:root{
  --ink:#171310; --ink-soft:#2c2620; --ink-muted:#7a7266;
  --gold:#c39a52; --gold-deep:#9c7a34; --gold-pale:#f2e6c9; --gold-pale-2:#f8f1de;
  --cream:#faf7f1; --surface:#ffffff; --line:#e9e1cf;
  --sage:#5c7a5e; --sage-pale:#e6ede4;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'Manrope',sans-serif;font-size:15px;line-height:1.6;}
h1,h2,h3,.serif{font-family:'Playfair Display',serif;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}

/* ---------- Top Nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(250,247,241,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line);}
.nav-inner{max-width:1180px;margin:0 auto;padding:16px 32px;display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;}
.nav-logo{display:flex;align-items:center;gap:12px;margin-right:auto;}
.nav-logo img{height:48px;width:auto;}
.nav-links{display:flex;gap:26px;font-size:13.5px;font-weight:600;color:var(--ink-soft);}
.nav-links a:hover{color:var(--gold-deep);}
.nav-cta{display:flex;gap:10px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:10px;font-size:13.5px;font-weight:700;border:1px solid transparent;cursor:pointer;white-space:nowrap;}
.btn-ghost{border-color:var(--ink);color:var(--ink);}
.btn-ghost:hover{background:var(--ink);color:var(--cream);}
.btn-gold{background:var(--gold);color:var(--ink);}
.btn-gold:hover{background:var(--gold-deep);}
.btn-outline-cream{border-color:rgba(250,247,241,.4);color:var(--cream);}
.btn-outline-cream:hover{background:rgba(250,247,241,.12);}

/* ---------- Hero — centered, editorial, no side illustration ---------- */
.hero{padding:96px 0 0;overflow:hidden;position:relative;text-align:center;}
.hero-inner{max-width:680px;margin:0 auto;}
.hero .eyebrow-mark{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:24px;}
.hero .eyebrow-mark span{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-deep);font-weight:700;}
.hero .eyebrow-mark::before,.hero .eyebrow-mark::after{content:'';width:28px;height:1px;background:var(--gold);}
.hero h1{font-size:56px;line-height:1.1;margin:0 0 22px;font-weight:600;letter-spacing:-.01em;}
.hero p{font-size:17px;color:var(--ink-soft);max-width:44ch;margin:0 auto 36px;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;}
.hero-ctas .btn{padding:14px 28px;font-size:14.5px;}
.hero-note{margin-top:22px;font-size:12.5px;color:var(--ink-muted);}

/* Trust strip — replaces the old side illustration; a quiet row of category
   chips right under the fold gives an immediate sense of breadth without
   inventing statistics we can't stand behind. */
.trust-strip{margin-top:56px;padding:22px 0;border-top:1px solid var(--line);}
.trust-strip-inner{display:flex;align-items:center;justify-content:center;gap:36px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-muted);font-weight:600;}
.trust-strip-inner span{display:flex;align-items:center;gap:7px;}
.trust-strip-inner svg{width:15px;height:15px;color:var(--gold-deep);flex-shrink:0;}

/* ---------- Testimonials ---------- */
.testimonial-band{padding:88px 0;background:var(--cream);}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.testimonial-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:28px 26px;display:flex;flex-direction:column;}
.testimonial-quote-mark{font-family:'Playfair Display',serif;font-size:44px;line-height:1;color:var(--gold);margin-bottom:6px;}
.testimonial-text{font-size:14px;line-height:1.7;color:#3a332a;margin:0 0 20px;flex:1;}
.testimonial-stars{color:var(--gold);font-size:13px;letter-spacing:2px;margin-bottom:10px;}
.testimonial-person{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid var(--line);}
.testimonial-avatar{width:38px;height:38px;border-radius:50%;background:var(--gold-pale);color:var(--gold-deep);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-weight:700;font-size:15px;flex-shrink:0;}
.testimonial-name{font-size:13.5px;font-weight:700;color:var(--ink);}
.testimonial-role{font-size:11.5px;color:var(--ink-muted);}

/* ---------- Section shared ---------- */
.band{padding:88px 0;}
.band-head{max-width:560px;margin-bottom:52px;}
.band-head h2{font-size:34px;margin:0 0 14px;font-weight:600;}
.band-head p{font-size:15px;margin:0;}
.band-light{background:var(--cream);}
.band-light .band-head p{color:var(--ink-soft);}

.band-dark{background:var(--ink);color:var(--cream);}
.band-dark .band-head p{color:#cabfa9;}
.band-dark .feature-desc{color:#b8ac93;}
.band-dark .feature-title{color:var(--cream);}
.band-dark .feature-rule{background:var(--gold);}

/* ---------- Feature rows (not cards — a quiet, structured list) ---------- */
.feature-list{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
.feature-rule{width:34px;height:3px;background:var(--gold-deep);border-radius:2px;margin-bottom:18px;}
.feature-title{font-family:'Playfair Display',serif;font-size:19px;font-weight:600;margin:0 0 10px;color:var(--ink);}
.feature-desc{font-size:14px;color:var(--ink-soft);margin:0;max-width:32ch;}

.band-footer{margin-top:48px;}

/* ---------- App download band ---------- */
.app-band{background:var(--gold-pale);padding:72px 0;}
.app-band-inner{display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;}
.app-band h2{font-size:28px;margin:0 0 10px;font-weight:600;}
.app-band p{font-size:14.5px;color:var(--ink-soft);margin:0;max-width:40ch;}
.store-badges{display:flex;gap:14px;flex-wrap:wrap;}
.store-badge{display:flex;align-items:center;gap:10px;background:var(--ink);color:var(--cream);padding:11px 18px;border-radius:10px;}
.store-badge svg{width:22px;height:22px;flex-shrink:0;}
.store-badge .store-text{display:flex;flex-direction:column;line-height:1.2;}
.store-badge .store-text small{font-size:9.5px;text-transform:uppercase;letter-spacing:.5px;color:#cabfa9;}
.store-badge .store-text strong{font-size:14.5px;font-weight:700;}
.store-badge:hover{background:var(--gold-deep);color:var(--ink);}
.store-badge:hover .store-text small{color:var(--ink);}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:#cabfa9;padding:52px 0 30px;}
.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;margin-bottom:40px;}
.footer-brand{display:flex;align-items:center;gap:12px;}
.footer-brand img{height:44px;}
.footer-tagline{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--gold);margin-top:8px;}
.footer-links{display:flex;gap:56px;flex-wrap:wrap;}
.footer-col h4{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--gold);margin:0 0 14px;font-weight:700;}
.footer-col a{display:block;font-size:13.5px;color:#cabfa9;margin-bottom:10px;}
.footer-col a:hover{color:var(--cream);}
.footer-bottom{border-top:1px solid rgba(250,247,241,.12);padding-top:22px;font-size:12px;color:#8f8368;}

/* ---------- How It Works (genuinely sequential — numbered steps earn their place here) ---------- */
.steps-band{padding:88px 0;background:var(--cream);}
.step-list{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;counter-reset:step;}
.step{position:relative;padding-top:8px;}
.step-num{font-family:'Playfair Display',serif;font-size:44px;font-weight:600;color:var(--gold);line-height:1;margin-bottom:16px;}
.step-title{font-family:'Playfair Display',serif;font-size:19px;font-weight:600;margin:0 0 10px;}
.step-desc{font-size:14px;color:var(--ink-soft);margin:0;max-width:30ch;}
.step-connector{position:absolute;top:26px;left:calc(100% + 22px);width:44px;height:1px;background:var(--line);}
.step:last-child .step-connector{display:none;}

/* ---------- Popular Categories ---------- */
.categories-band{padding:88px 0;background:var(--surface);}
.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.category-chip{display:flex;align-items:center;gap:12px;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:var(--cream);transition:border-color .2s ease, background .2s ease;}
.category-chip:hover{border-color:var(--gold);background:var(--gold-pale-2);}
.category-chip svg{width:20px;height:20px;flex-shrink:0;color:var(--gold-deep);}
.category-chip span{font-size:13.5px;font-weight:700;color:var(--ink);}
.categories-more{margin-top:20px;font-size:13px;color:var(--ink-muted);}
.categories-more a{color:var(--gold-deep);font-weight:700;text-decoration:underline;}

/* ---------- Why Viya (benefits) — distinct icon-badge treatment for visual variety ---------- */
.benefits-band{padding:88px 0;background:var(--cream);}
.benefit-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px 48px;}
.benefit-row{display:flex;gap:18px;align-items:flex-start;}
.benefit-badge{flex-shrink:0;width:46px;height:46px;border-radius:50%;background:var(--gold-pale);display:flex;align-items:center;justify-content:center;}
.benefit-badge svg{width:22px;height:22px;color:var(--gold-deep);}
.benefit-title{font-family:'Playfair Display',serif;font-size:17px;font-weight:600;margin:0 0 6px;}
.benefit-desc{font-size:13.5px;color:var(--ink-soft);margin:0;max-width:38ch;}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.3,1),transform .8s cubic-bezier(.2,.7,.3,1);}
.reveal.is-visible{opacity:1;transform:translateY(0);}
.reveal-stagger > *{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease;}
.reveal-stagger.is-visible > *{opacity:1;transform:translateY(0);}
.reveal-stagger.is-visible > *:nth-child(1){transition-delay:.05s;}
.reveal-stagger.is-visible > *:nth-child(2){transition-delay:.15s;}
.reveal-stagger.is-visible > *:nth-child(3){transition-delay:.25s;}
.reveal-stagger.is-visible > *:nth-child(4){transition-delay:.35s;}
@media (prefers-reduced-motion: reduce){
  .reveal,.reveal-stagger > *{opacity:1 !important;transform:none !important;transition:none !important;}
}
@media (prefers-reduced-motion: no-preference){
  .hero h1,.hero p,.hero-ctas,.hero-note{animation:rise .7s ease both;}
  .hero p{animation-delay:.08s;}
  .hero-ctas{animation-delay:.16s;}
  .hero-note{animation-delay:.22s;}
  .trust-strip{animation:fade-in 1s ease .2s both;}
}
@keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
@keyframes fade-in{from{opacity:0;}to{opacity:1;}}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .hero h1{font-size:38px;}
  .trust-strip-inner{gap:18px 24px;}
  .testimonial-grid{grid-template-columns:1fr;}
  .feature-list{grid-template-columns:1fr 1fr;}
  .step-list{grid-template-columns:1fr 1fr;}
  .step-connector{display:none;}
  .category-grid{grid-template-columns:repeat(3,1fr);}
  .nav-links{display:none;}
}
@media (max-width:640px){
  .wrap{padding:0 20px;}
  .nav-inner{padding:14px 20px;}
  .nav-logo img{height:38px;}
  .btn{padding:10px 16px;font-size:12.5px;}
  .hero{padding:48px 0 56px;}
  .hero h1{font-size:30px;}
  .hero p{font-size:14.5px;}
  .hero-ctas .btn{flex:1;padding:13px 16px;}
  .band{padding:56px 0;}
  .band-head h2{font-size:26px;}
  .feature-list{grid-template-columns:1fr;gap:30px;}
  .steps-band{padding:56px 0;}
  .step-list{grid-template-columns:1fr;gap:32px;}
  .categories-band{padding:56px 0;}
  .category-grid{grid-template-columns:1fr 1fr;}
  .benefit-grid{grid-template-columns:1fr;}
  .app-band-inner{flex-direction:column;align-items:flex-start;}
  .footer-top{flex-direction:column;gap:28px;}
  .footer-links{gap:32px;}
}