:root{
  --color-primary:#1C1917;
  --color-secondary:#2C2825;
  --color-accent:#D4B896;
  --color-bg-light:#FDFCFB;
  --color-bg-alt:#F9F5F0;

  --radius-sm: 0.125rem;
  --radius-md: 0.25rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
}

html{ scroll-behavior:smooth; scroll-padding-top:5rem; }
body{ font-family:'DM Sans', system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background: var(--color-bg-light); }

::selection{ background: rgba(212,184,150,.35); }

.btn-base{
  white-space:nowrap;
  min-width:fit-content;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  line-height:1.1;
}

form button[type="submit"]{
  white-space:normal;
  width:100%;
}

/* Premium focus ring */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(212,184,150,.35);
  border-radius: .5rem;
}

/* Scroll animations (context: slide_right) */
[data-animate]{
  opacity:0;
  transform: translateX(-2rem);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
  will-change: opacity, transform;
}
[data-animate].is-visible{
  opacity:1;
  transform: translateX(0);
}

.rotate-180{ transform: rotate(180deg); }

/* Decorative patterns */
.decor-grid-dots{
  background-image: radial-gradient(circle at 1px 1px, rgba(28,25,23,.12) 1px, transparent 1px);
  background-size: 18px 18px;
}
.decor-grid-lines{
  background-image:
    linear-gradient(to right, rgba(28,25,23,.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(28,25,23,.08) 1px, transparent 1px);
  background-size: 34px 34px;
}
.decor-diagonal{
  background-image: repeating-linear-gradient(135deg,
    rgba(212,184,150,.14) 0px,
    rgba(212,184,150,.14) 1px,
    transparent 1px,
    transparent 10px
  );
}
.decor-mesh{
  background:
    radial-gradient(800px circle at 15% 20%, rgba(212,184,150,.22), transparent 55%),
    radial-gradient(900px circle at 85% 10%, rgba(28,25,23,.12), transparent 55%),
    radial-gradient(900px circle at 70% 85%, rgba(212,184,150,.16), transparent 55%),
    linear-gradient(to bottom, rgba(253,252,251,1), rgba(249,245,240,1));
}

.decor-subtle{ opacity:.06; }
.decor-moderate{ opacity:.10; }
.decor-bold{ opacity:.18; }

.decor-gradient-blur{
  position: relative;
}
.decor-gradient-blur::before,
.decor-gradient-blur::after{
  content:"";
  position:absolute;
  inset:auto;
  width: 420px;
  height: 420px;
  border-radius: 9999px;
  filter: blur(48px);
  opacity: .35;
  pointer-events:none;
  z-index:0;
}
.decor-gradient-blur::before{
  top:-160px;
  left:-140px;
  background: radial-gradient(circle, rgba(212,184,150,.85), transparent 60%);
}
.decor-gradient-blur::after{
  bottom:-180px;
  right:-160px;
  background: radial-gradient(circle, rgba(28,25,23,.45), transparent 65%);
}

.decor-glow-element{
  position: relative;
}
.decor-glow-element::after{
  content:"";
  position:absolute;
  inset:auto;
  width: 260px;
  height: 260px;
  border-radius: 9999px;
  background: radial-gradient(circle, rgba(212,184,150,.55), transparent 60%);
  filter: blur(34px);
  opacity: .55;
  z-index:0;
  pointer-events:none;
}

/* Improved tap targets */
#mobile-menu a, #mobile-menu button{
  -webkit-tap-highlight-color: transparent;
}

/* Cookie modal */
#cookie-consent{
  backdrop-filter: blur(6px);
}
#cookie-consent .shadow-2xl{
  box-shadow: 0 26px 70px rgba(0,0,0,.22);
}

/* Subtle scrollbar */
@media (min-width: 768px){
  ::-webkit-scrollbar{ width: 10px; height: 10px; }
  ::-webkit-scrollbar-track{ background: rgba(0,0,0,.03); }
  ::-webkit-scrollbar-thumb{ background: rgba(28,25,23,.18); border-radius: 9999px; border: 2px solid rgba(255,255,255,.6); }
  ::-webkit-scrollbar-thumb:hover{ background: rgba(28,25,23,.28); }
}