:root { color-scheme: light; }
html { scroll-behavior: smooth; }
body { background: #f4f3ee; }

.noise {
  position: absolute;
  inset: 0;
  opacity: 0.05;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.hero-gradient {
  background:
    radial-gradient(120% 90% at 12% 0%, rgba(95,149,163,0.55) 0%, rgba(15,42,61,0) 55%),
    radial-gradient(90% 70% at 100% 100%, rgba(181,98,47,0.35) 0%, rgba(15,42,61,0) 60%),
    linear-gradient(160deg, #0f2a3d 0%, #17435a 45%, #1f5f77 100%);
}

.text-balance { text-wrap: balance; }
.text-pretty { text-wrap: pretty; }

/* ===== Motion ===== */
/* Always visible by default — enhances an already-visible layout with a
   settle-into-place + soft-focus motion. Never gates content on JS/observer
   timing, so it degrades safely for no-JS, slow-render, and headless capture. */
[data-reveal], [data-reveal-stagger] > * {
  opacity: 1;
  transform: translateY(30px);
  filter: blur(0px);
  transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), filter 1s cubic-bezier(0.16, 1, 0.3, 1);
}
[data-reveal].is-visible,
[data-reveal-stagger].is-visible > * {
  transform: translateY(0);
}
[data-reveal-stagger] > *:nth-child(1) { transition-delay: 0ms; }
[data-reveal-stagger] > *:nth-child(2) { transition-delay: 110ms; }
[data-reveal-stagger] > *:nth-child(3) { transition-delay: 220ms; }
[data-reveal-stagger] > *:nth-child(4) { transition-delay: 330ms; }
[data-reveal-stagger] > *:nth-child(5) { transition-delay: 440ms; }
[data-reveal-stagger] > *:nth-child(6) { transition-delay: 550ms; }

/* Hero headline: per-word masked reveal, GSAP-driven (see site.js).
   inline-block lets words wrap naturally while each keeps its own
   overflow-hidden mask for the translateY reveal. */
.split-line { overflow: hidden; display: inline-block; vertical-align: top; }
.split-line > span { display: inline-block; will-change: transform; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-reveal], [data-reveal-stagger] > * {
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
  .split-line > span { transform: none !important; }
}

/* ===== Buttons ===== */
.btn-primary {
  background: #b5622f;
  color: #f4f3ee;
  box-shadow: 0 1px 2px rgba(122,61,30,0.3), 0 8px 24px -8px rgba(122,61,30,0.55);
  transition: transform 0.35s cubic-bezier(0.16,1,0.3,1), box-shadow 0.35s cubic-bezier(0.16,1,0.3,1), background 0.35s;
}
.btn-primary:hover { background: #a1552a; transform: translateY(-2px); box-shadow: 0 2px 4px rgba(122,61,30,0.35), 0 14px 32px -10px rgba(122,61,30,0.6); }
.btn-primary:active { transform: translateY(0); }
.btn-primary:focus-visible { outline: 2px solid #d99a63; outline-offset: 3px; }
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }

.btn-outline {
  border: 1.5px solid rgba(244,243,238,0.55);
  color: #f4f3ee;
  transition: border-color 0.35s, background 0.35s, transform 0.35s cubic-bezier(0.16,1,0.3,1);
}
.btn-outline:hover { border-color: #f4f3ee; background: rgba(244,243,238,0.08); transform: translateY(-2px); }
.btn-outline:focus-visible { outline: 2px solid #f4f3ee; outline-offset: 3px; }

.btn-ink {
  border: 1.5px solid rgba(17,26,36,0.35);
  color: #111a24;
  transition: border-color 0.35s, background 0.35s, transform 0.35s cubic-bezier(0.16,1,0.3,1);
}
.btn-ink:hover { border-color: #111a24; background: rgba(17,26,36,0.05); transform: translateY(-2px); }

/* ===== Nav ===== */
.nav-link { position: relative; padding-block: 0.25rem; }
.nav-link::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: -2px; height: 1.5px;
  background: currentColor; transition: right 0.4s cubic-bezier(0.16,1,0.3,1);
}
.nav-link:hover::after, .nav-link[aria-current="page"]::after { right: 0; }
.mobile-menu { transition: max-height 0.45s cubic-bezier(0.16,1,0.3,1), opacity 0.35s ease; }

::selection { background: #b5622f; color: #f4f3ee; }

/* ===== Image treatment ===== */
.photo-tint {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(15,42,61,0.15) 0%, rgba(15,42,61,0.45) 100%);
  mix-blend-mode: multiply;
  pointer-events: none;
}
.photo-tint-warm {
  position: absolute; inset: 0;
  background: linear-gradient(160deg, rgba(31,95,119,0.35) 0%, rgba(181,98,47,0.25) 100%);
  mix-blend-mode: multiply;
  pointer-events: none;
}
.img-zoom { overflow: hidden; }
.img-zoom img { transition: transform 1.1s cubic-bezier(0.16,1,0.3,1); }
.img-zoom:hover img { transform: scale(1.06); }