:root{
  --bg:#121212;
  --fg:#F5F5F0;
  --gold:#C5A059;
}

html{ scroll-behavior:smooth; }

body{
  background-color:var(--bg);
  color:var(--fg);
  overflow-x:hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  -webkit-touch-callout: none;
}

/* Mobile optimization base */
* {
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}

/* Scrollbar */
::-webkit-scrollbar{ width:8px; }
::-webkit-scrollbar-track{ background:var(--bg); }
::-webkit-scrollbar-thumb{ background:var(--gold); border-radius:4px; }

/* Decorative outline stroke */
.text-stroke{
  -webkit-text-stroke: 1px rgba(197,160,89,0.55);
  color: rgba(245,245,240,0.05);
  text-shadow: 0 0 18px rgba(197,160,89,0.10);
  opacity: 0.75;
}

.img-container{ overflow:hidden; }
.img-container img{
  transition:transform 0.7s cubic-bezier(0.25,0.46,0.45,0.94);
}
.img-container:hover img{ transform:scale(1.1); }

/* Enez image crop - show right side only */
img[src*="enez-ortacalar"]{
  object-position: right center;
}

/* Loader */
.loader{
  position:fixed;
  inset:0;
  background:#000;
  z-index:9999;
  display:flex;
  justify-content:center;
  align-items:center;
}
.loader-text{
  font-family:"Cormorant Garamond", serif;
  font-size:clamp(2rem,5vw,3rem);
  color:var(--gold);
  opacity:0;
  transform:translateY(10px);
}

/* Initial reveal */
.reveal-on-load{
  opacity:0;
  transform:translateY(14px);
}

/* Utility fallbacks for Tailwind brand classes */
.text-brand-gold{ color:var(--gold) !important; }
.bg-brand-gold{ background-color:var(--gold) !important; }
.border-brand-gold{ border-color:var(--gold) !important; }
.bg-brand-dark{ background-color:var(--bg) !important; }
.bg-brand-gray{ background-color:#2A2A2A !important; }

/* Focus visibility */
:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
}

/* Mobile Optimization */
@media (max-width: 768px){
  /* Ensure proper spacing on mobile */
  body{ padding: 0; margin: 0; }

  /* Touch targets minimum 48px */
  a, button{ min-height: 48px; min-width: 48px; display: inline-flex; align-items: center; justify-content: center; }

  /* Responsive padding */
  section{ padding: 20px 16px !important; }

  /* Responsive font sizes */
  h1{ font-size: clamp(1.5rem, 6vw, 2.5rem) !important; }
  h2{ font-size: clamp(1.25rem, 5vw, 2rem) !important; }
  h3{ font-size: clamp(1rem, 4vw, 1.5rem) !important; }
  p{ font-size: 14px; line-height: 1.6; }

  /* Full width images and containers */
  img{ max-width: 100%; height: auto; }

  /* Flexible grid */
  .grid{ gap: 12px !important; }

  /* Better spacing for mobile forms */
  input, textarea, select{ padding: 12px; font-size: 16px; }

  /* Prevent horizontal scroll */
  * { max-width: 100%; overflow-x: hidden; }
}

@media (max-width: 480px){
  /* Extra small devices */
  section{ padding: 16px 12px !important; }
  h1{ font-size: clamp(1.25rem, 5vw, 2rem) !important; }
  h2{ font-size: clamp(1rem, 4vw, 1.5rem) !important; }
  p{ font-size: 13px; }

  /* Reduce spacing on very small screens */
  .grid{ gap: 8px !important; }
  margin, padding{ margin: 0 !important; padding: 0 !important; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Glass + showcase helpers */
.glass-panel{
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.showcase-frame{
  position:relative;
  border:1px solid rgba(197,160,89,0.25);
  background:
    radial-gradient(700px circle at 20% 20%, rgba(197,160,89,0.18), transparent 60%),
    radial-gradient(600px circle at 80% 30%, rgba(255,255,255,0.06), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,0.05), rgba(0,0,0,0.15));
  overflow:hidden;
}

.showcase-frame::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.06) 0px,
      rgba(255,255,255,0.06) 1px,
      transparent 1px,
      transparent 14px
    );
  opacity:0.35;
  pointer-events:none;
}

.showcase-overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:22px;
}

/* Group hover text color override */
.group:hover span.group-hover\:text-white{
  color: white !important;
}