@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Fraunces:ital,opsz,wght@1,9..144,500&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --paper:#FFFBF5;
  --paper-dim:#FBF3E7;
  --coral:#FF6A47;
  --coral-dark:#E1502A;
  --coral-deep:#C43F1E;
  --jade:#0E6B5C;
  --jade-dark:#0A5347;
  --jade-pale:#E3F3EE;
  --apricot:#FFB648;
  --apricot-dark:#F09A1F;
  --peach:#FFE7D9;
  --ink:#1D2B27;
  --ink-soft:#4B5B56;
  --ink-faint:#7C8B86;
  --line:#E8DFD3;
  --line-strong:#D9CDB9;
}

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

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

body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

.font-display{ font-family:'Fraunces', ui-serif, Georgia, serif; }
.font-mono{ font-family:'IBM Plex Mono', ui-monospace, monospace; }

h1,h2,h3,.font-display{ letter-spacing:-0.03em; }

/* ---------- Focus ---------- */
a, button, [tabindex]{ outline-offset:3px; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2.5px solid var(--jade);
  outline-offset:3px;
  border-radius:4px;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0.5rem;
  padding:0.95rem 1.75rem;
  border-radius:999px;
  font-weight:600;
  font-size:0.95rem;
  white-space:nowrap;
  transition:transform 180ms cubic-bezier(.34,1.56,.64,1), box-shadow 180ms ease, background-color 180ms ease, color 180ms ease;
  will-change:transform;
}
.btn-primary{
  background:var(--coral);
  color:var(--paper);
  box-shadow:0 1px 2px rgba(29,43,39,0.06), 0 10px 24px -10px rgba(255,106,71,0.55);
}
.btn-primary:hover{ background:var(--coral-dark); transform:translateY(-2px); box-shadow:0 4px 10px rgba(29,43,39,0.08), 0 16px 30px -10px rgba(255,106,71,0.55); }
.btn-primary:active{ background:var(--coral-deep); transform:translateY(0); box-shadow:0 1px 2px rgba(29,43,39,0.08); }

.btn-secondary{
  background:transparent;
  color:var(--jade-dark);
  border:1.5px solid var(--jade);
}
.btn-secondary:hover{ background:var(--jade); color:var(--paper); transform:translateY(-2px); }
.btn-secondary:active{ background:var(--jade-dark); border-color:var(--jade-dark); transform:translateY(0); }

.btn-ghost{
  background:var(--paper);
  color:var(--ink);
  border:1.5px solid var(--line-strong);
}
.btn-ghost:hover{ border-color:var(--jade); color:var(--jade-dark); transform:translateY(-2px); }
.btn-ghost:active{ transform:translateY(0); }

.btn-on-dark{
  background:var(--apricot);
  color:var(--ink);
  box-shadow:0 10px 24px -10px rgba(0,0,0,0.4);
}
.btn-on-dark:hover{ background:#FFC66B; transform:translateY(-2px); }
.btn-on-dark:active{ transform:translateY(0); }

/* ---------- Cards / surfaces ---------- */
.surface-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:1.25rem;
  transition:transform 220ms cubic-bezier(.22,1,.36,1), box-shadow 220ms ease, border-color 220ms ease;
}
.surface-card:hover{
  transform:translateY(-4px);
  border-color:var(--line-strong);
  box-shadow:0 2px 4px rgba(29,43,39,0.04), 0 24px 40px -20px rgba(255,106,71,0.28), 0 8px 20px -10px rgba(14,107,92,0.12);
}

.shadow-float{
  box-shadow:0 2px 6px rgba(29,43,39,0.05), 0 30px 60px -24px rgba(255,106,71,0.35), 0 10px 24px -12px rgba(14,107,92,0.15);
}
.shadow-soft{
  box-shadow:0 1px 2px rgba(29,43,39,0.04), 0 12px 28px -14px rgba(29,43,39,0.18);
}

/* ---------- Eyebrow / labels ---------- */
.eyebrow{
  font-family:'IBM Plex Mono', ui-monospace, monospace;
  font-size:0.75rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  font-weight:500;
}

/* ---------- Grain texture overlay ---------- */
.grain{ position:relative; isolation:isolate; }
.grain::after{
  content:"";
  position:absolute; inset:0;
  pointer-events:none;
  opacity:0.5;
  mix-blend-mode:overlay;
  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%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.35'/%3E%3C/svg%3E");
}

/* ---------- Hero gradient field ---------- */
.hero-field{
  position:relative;
  background:
    radial-gradient(60% 55% at 14% 8%, rgba(255,182,72,0.55) 0%, rgba(255,182,72,0) 60%),
    radial-gradient(55% 60% at 88% 0%, rgba(14,107,92,0.30) 0%, rgba(14,107,92,0) 62%),
    radial-gradient(90% 70% at 50% 100%, rgba(255,106,71,0.28) 0%, rgba(255,106,71,0) 60%),
    var(--paper);
}

.field-jade{
  position:relative;
  background:
    radial-gradient(60% 60% at 85% 0%, rgba(255,182,72,0.35) 0%, rgba(255,182,72,0) 60%),
    radial-gradient(70% 70% at 10% 100%, rgba(255,106,71,0.28) 0%, rgba(255,106,71,0) 60%),
    linear-gradient(160deg, var(--jade-dark) 0%, var(--jade) 100%);
  color:var(--paper);
}

/* ---------- Ribbon / journey path ---------- */
.ribbon-line{
  stroke-dasharray: 2 14;
  stroke-linecap:round;
}

.step-marker{
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Fraunces', serif;
  font-weight:600;
  border-radius:999px;
  flex-shrink:0;
}

/* ---------- Reveal on scroll ---------- */
.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity 700ms cubic-bezier(.22,1,.36,1), transform 700ms cubic-bezier(.22,1,.36,1);
}
.reveal.is-visible{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* ---------- Marquee-free divider ---------- */
.hairline{ background:var(--line); height:1px; border:none; }

/* ---------- Accordion (FAQ) ---------- */
.accordion-trigger[aria-expanded="true"] .accordion-icon{ transform:rotate(45deg); }
.accordion-icon{ transition:transform 220ms cubic-bezier(.22,1,.36,1); }
.accordion-panel{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows 260ms cubic-bezier(.22,1,.36,1);
}
.accordion-panel > div{ overflow:hidden; }
.accordion-trigger[aria-expanded="true"] + .accordion-panel{ grid-template-rows:1fr; }

/* ---------- Nav ---------- */
.nav-link{ position:relative; }
.nav-link::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-4px;
  height:2px;
  background:var(--coral);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform 220ms cubic-bezier(.22,1,.36,1);
}
.nav-link:hover::after, .nav-link.is-active::after{ transform:scaleX(1); }
.nav-link.is-active{ color:var(--ink); }

/* mobile menu */
#mobile-menu{
  max-height:0;
  overflow:hidden;
  transition:max-height 320ms cubic-bezier(.22,1,.36,1);
}
#mobile-menu.open{ max-height:32rem; }

/* logo color control */
.logo-mark path{ fill:currentColor; }

::selection{ background:var(--peach); color:var(--ink); }
