:root {
  --color-primary: #4A4035;
  --color-secondary: #6A5A4A;
  --color-accent: #F5E6D3;
}

html { scroll-behavior: smooth; scroll-padding-top: 5rem; }
body { font-family: 'Space Grotesk', system-ui, sans-serif; text-rendering: optimizeLegibility; }

::selection { background: color-mix(in srgb, var(--color-accent) 70%, white); color: #111827; }

img { max-width: 100%; height: auto; }

button, .btn, [class*="btn-"], a[href="#order_form"] {
  white-space: nowrap;
  min-width: fit-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

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

a { -webkit-tap-highlight-color: transparent; }

#site-header.is-solid > div:first-child { background: rgba(255,255,255,.92); backdrop-filter: blur(10px); }
#site-header.is-solid { border-bottom: 1px solid rgba(17,24,39,.06); }
#site-header.is-solid a, 
#site-header.is-solid button { color: #111827; }
#site-header.is-solid a { opacity: 1; }
#site-header.is-solid .text-white\/85,
#site-header.is-solid .text-white\/75,
#site-header.is-solid .text-white { color: rgba(17,24,39,.92) !important; }
#site-header.is-solid .bg-white\/10 { background: rgba(17,24,39,.04) !important; }
#site-header.is-solid .ring-white\/15 { --tw-ring-color: rgba(17,24,39,.10) !important; }

.btn-cta { transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.btn-cta:active { transform: translateY(1px) scale(0.99); }

.input-premium {
  border-radius: 1rem;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(255,255,255,.92);
  transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease;
}
.input-premium:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--color-primary) 35%, white);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-accent) 45%, transparent);
}

.badge-glass {
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
}

[data-animate] {
  opacity: 0;
  transform: translateX(32px);
  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 backgrounds (required class names; subtle premium defaults) */
.decor-grid-dots {
  background-image: radial-gradient(rgba(255,255,255,.10) 1px, transparent 1px);
  background-size: 18px 18px;
}
.decor-grid-lines {
  background-image:
    linear-gradient(to right, rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 36px 36px;
}
.decor-diagonal {
  background-image: repeating-linear-gradient(135deg, rgba(255,255,255,.08) 0, rgba(255,255,255,.08) 1px, transparent 1px, transparent 12px);
}
.decor-mesh {
  background:
    radial-gradient(900px 600px at 20% 10%, rgba(245,230,211,.35), transparent 60%),
    radial-gradient(900px 600px at 80% 20%, rgba(106,90,74,.25), transparent 60%),
    radial-gradient(700px 500px at 50% 90%, rgba(74,64,53,.22), transparent 60%);
}

.decor-gradient-blur::before,
.decor-gradient-blur::after {
  content: "";
  position: absolute;
  inset: auto;
  width: 520px;
  height: 520px;
  filter: blur(50px);
  opacity: .35;
  pointer-events: none;
  border-radius: 9999px;
}
.decor-gradient-blur::before {
  left: -220px;
  top: -220px;
  background: color-mix(in srgb, var(--color-accent) 80%, white);
}
.decor-gradient-blur::after {
  right: -220px;
  bottom: -220px;
  background: color-mix(in srgb, var(--color-secondary) 55%, transparent);
}

.decor-corner-tr::before {
  content:"";
  position:absolute;
  top:0; right:0;
  width: 220px; height: 220px;
  background: radial-gradient(circle at top right, rgba(245,230,211,.35), transparent 60%);
  pointer-events:none;
}
.decor-corner-bl::before {
  content:"";
  position:absolute;
  bottom:0; left:0;
  width: 220px; height: 220px;
  background: radial-gradient(circle at bottom left, rgba(106,90,74,.22), transparent 60%);
  pointer-events:none;
}

.decor-glow-element {
  position: relative;
}
.decor-glow-element::before {
  content:"";
  position:absolute;
  inset:-20px;
  background: radial-gradient(closest-side, rgba(245,230,211,.35), transparent 65%);
  filter: blur(10px);
  z-index: -1;
}

/* Consent modal micro-UX */
#cookie-consent button { transition: transform .15s ease, background-color .15s ease, border-color .15s ease; }
#cookie-consent button:active { transform: translateY(1px); }

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-animate] { transition: none; }
  .btn-cta { transition: none; }
}