@font-face{font-family:'Satoshi';font-style:normal;font-weight:300;font-display:swap;src:url('/fonts/satoshi-300.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/satoshi-400.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/satoshi-500.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/satoshi-700.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-style:normal;font-weight:900;font-display:swap;src:url('/fonts/satoshi-900.woff2') format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/instrument-serif-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/instrument-serif-latin-italic.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --bg:#FFFFFF; --surface:#F5F5F7; --ink:#0A0A0A; --muted:#6B6B6B;
  --dim:#A8A8A8; --line:#EAEAEA; --line-2:#D0D0D0; --white:#FFFFFF;
  --radius:20px; --radius-pill:999px; --max:1440px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-family:'Satoshi','Inter',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;font-size:16px}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,textarea,select{font:inherit;color:inherit;background:transparent;border:1px solid var(--line);border-radius:12px;padding:12px 14px;width:100%;outline:none;transition:border-color .15s ease}
input:focus,textarea:focus,select:focus{border-color:var(--ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

.container{max-width:var(--max);margin:0 auto;padding:0 40px}
@media (max-width:768px){.container{padding:0 20px}}

/* Nav — floating pill, transparent bg, hides on scroll-down, shows on scroll-up */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;background:transparent;pointer-events:none;transform:translateY(0);transition:transform .35s cubic-bezier(.4,0,.2,1)}
.nav.is-hidden{transform:translateY(-140%)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;padding:22px 40px;gap:20px;pointer-events:none}
.nav__inner > *{pointer-events:auto}
@media (max-width:768px){.nav__inner{padding:16px 20px}}
.nav__logo{display:inline-flex;align-items:center;color:var(--ink)}
.nav__logo img{height:44px;width:auto;display:block}
.footer__logo{margin-bottom:16px}
.footer__logo img{height:42px;width:auto;display:block;color:var(--ink)}
.nav__links{display:flex;gap:2px;background:rgba(245,245,247,.7);backdrop-filter:blur(12px) saturate(1.6);-webkit-backdrop-filter:blur(12px) saturate(1.6);border-radius:var(--radius-pill);padding:5px;border:1px solid rgba(255,255,255,.6);box-shadow:0 8px 32px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.6)}
.nav__link{padding:9px 18px;border-radius:var(--radius-pill);font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap;transition:background .18s ease,color .18s ease,transform .18s ease}
.nav__link:hover{background:rgba(255,255,255,.6)}
.nav__link.is-active{background:var(--ink);color:var(--white)}
.nav__right{display:flex;align-items:center;gap:10px}
.nav__search{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.5);display:grid;place-items:center;transition:background .18s ease,transform .18s ease;box-shadow:0 4px 12px rgba(0,0,0,.05)}
.nav__search:hover{background:rgba(255,255,255,.8);transform:translateY(-1px)}
.nav__cta{padding:12px 22px;border-radius:var(--radius-pill);background:var(--ink);color:var(--white);font-weight:500;font-size:13px;transition:transform .18s ease,box-shadow .18s ease}
.nav__cta:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,0,0,.2)}
body{padding-top:0}
main{padding-top:0}
.hero{padding-top:140px}
.nav__toggle{display:none;background:none;border:0;padding:8px}
@media (max-width:900px){
  .nav__links,.nav__search{display:none}
  .nav__toggle{display:block}
  .nav__inner{padding:14px 0}
}
.mobile-menu{position:fixed;inset:64px 0 0;background:var(--bg);padding:40px 24px;z-index:49;transform:translateY(-100%);transition:transform .3s ease;overflow-y:auto}
.mobile-menu.is-open{transform:translateY(0)}
.mobile-menu a{display:block;padding:18px 0;font-size:24px;font-weight:600;border-bottom:1px solid var(--line)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 30px;border-radius:var(--radius-pill);font-weight:600;font-size:15px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.btn--primary{background:var(--ink);color:var(--white)}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.18)}
.btn--ghost{background:rgba(255,255,255,.55);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);color:var(--ink);border:1px solid rgba(255,255,255,.7);box-shadow:0 4px 14px rgba(0,0,0,.05),inset 0 1px 0 rgba(255,255,255,.6)}
.btn--ghost:hover{background:rgba(255,255,255,.85);transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.08)}
.btn--glass{background:rgba(255,255,255,.55);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);color:var(--ink);border:1px solid rgba(255,255,255,.7);box-shadow:0 4px 14px rgba(0,0,0,.05),inset 0 1px 0 rgba(255,255,255,.6);padding:14px 30px;border-radius:var(--radius-pill);font-weight:600;font-size:15px;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease}
.btn--glass:hover{background:rgba(255,255,255,.9);transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.08)}
.btn--sm{padding:11px 22px;font-size:13px}
/* WhatsApp CTA */
.btn--wa{background:#25D366;color:#fff;box-shadow:0 6px 20px rgba(37,211,102,.28)}
.btn--wa:hover{background:#1FBE58;transform:translateY(-2px);box-shadow:0 10px 26px rgba(37,211,102,.4)}
.btn--wa svg{color:#fff}
/* Floating WhatsApp bubble */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:60;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px rgba(37,211,102,.4),0 4px 10px rgba(0,0,0,.15);transition:transform .25s ease,box-shadow .25s ease;animation:wa-pop .5s cubic-bezier(.34,1.56,.64,1) .4s both}
.wa-float:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 14px 36px rgba(37,211,102,.5)}
.wa-float::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid #25D366;opacity:.5;animation:wa-pulse 2.4s ease-out infinite}
@keyframes wa-pop{from{opacity:0;transform:scale(.4) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}
@keyframes wa-pulse{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.5);opacity:0}}
@media (max-width:640px){.wa-float{right:16px;bottom:16px;width:52px;height:52px}}
@media (prefers-reduced-motion:reduce){.wa-float,.wa-float::after{animation:none}}

/* Sections */
.section{padding:100px 0}
.section--tight{padding:80px 0}
.section--surface{background:var(--surface)}
@media (max-width:768px){.section{padding:70px 0}}

.h1{font-family:'Instrument Serif','Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(48px,8vw,92px);line-height:1;letter-spacing:-.02em}
.h1 em{font-style:italic;color:#3a3a3a}
.h2{font-family:'Instrument Serif','Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(38px,5.5vw,64px);line-height:1.05;letter-spacing:-.015em}
.h2 em{font-style:italic;color:#3a3a3a}
.h3{font-weight:600;font-size:clamp(22px,2.6vw,28px);line-height:1.25;letter-spacing:-.01em}
.lead{font-size:18px;line-height:1.7;color:var(--muted);max-width:600px}
.muted{color:var(--muted)}
.eyebrow{font-size:11px;font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--dim)}

/* Hero — A: big top gap; B: tighter text→image; C: tighter image→brands */
.hero{padding:300px 0 40px;text-align:center}
.hero--sm{padding:280px 0 40px}
.hero .h1{max-width:1040px;margin:0 auto}
.hero__sub{margin:32px auto 0;max-width:620px}
.hero__ctas{display:flex;gap:12px;justify-content:center;margin-top:40px;flex-wrap:wrap}
.hero__img{margin:-8px auto 0;max-width:560px;padding:0 20px}
.hero__img img{width:100%;height:auto;display:block;object-fit:contain}
/* trim the gap between hero and brand strip */
.hero + .brands{margin-top:0}
@media (max-width:768px){
  .hero{padding:200px 0 30px}
  .hero--sm{padding:200px 0 30px}
  .hero__img{margin-top:30px;max-width:80%}
}
/* Every page's first content block sits well below the fixed nav */
main > .section:first-child{padding-top:220px}
main > .hero:first-child{padding-top:300px}
main > article:first-child,main > .container:first-child{padding-top:200px}
@media (max-width:768px){
  main > .section:first-child{padding-top:160px}
  main > .hero:first-child{padding-top:200px}
  main > article:first-child,main > .container:first-child{padding-top:150px}
}

/* Brand marquee — infinite scroll right→left */
.brands{padding:32px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:0;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%)}
.brands__track{display:flex;gap:64px;align-items:center;width:max-content;animation:bbw-marquee 60s linear infinite;will-change:transform}
.brands:hover .brands__track{animation-play-state:paused}
.brand{flex:0 0 120px;width:120px;height:48px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.brand > img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(1) contrast(.85) opacity(.55);transition:filter .25s ease,transform .25s ease}
.brand:hover > img{filter:grayscale(0) contrast(1) opacity(1);transform:scale(1.05)}
.brand--text{color:#B8B8B8;font-weight:700;font-size:15px;letter-spacing:2px;text-transform:uppercase;transition:color .25s ease}
.brand--text:hover{color:var(--ink)}
@keyframes bbw-marquee{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-50%,0,0)}}

/* Stats */
.stats{display:flex;margin-top:56px;border-top:1px solid var(--line);padding-top:40px;gap:0}
.stat{flex:1;text-align:center;padding:0 12px}
.stat__num{font-weight:700;font-size:clamp(28px,3.5vw,36px);letter-spacing:-1px}
.stat__label{color:var(--dim);font-size:14px;margin-top:8px}
.stat-divider{width:1px;background:var(--line)}
@media (max-width:768px){.stats{flex-wrap:wrap;gap:20px}.stat{flex:1 1 40%}.stat-divider{display:none}}

/* Split heading */
.split{display:flex;gap:80px;align-items:flex-start}
.split .h2{flex:0 0 440px;margin:0}
.split p{flex:1;margin:0}
@media (max-width:900px){.split{flex-direction:column;gap:24px}.split .h2{flex:none}}

/* Cards */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:900px){.grid-3{grid-template-columns:1fr}}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:1100px){.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.grid-4{grid-template-columns:1fr}}
.card{background:var(--surface);border-radius:var(--radius);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.card:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(0,0,0,.06)}
.card__img{height:240px;display:grid;place-items:center;padding:20px;overflow:hidden}
.card__img img{max-width:92%;max-height:100%;object-fit:contain;transition:transform .35s ease}
.card:hover .card__img img{transform:scale(1.04)}
.card__body{padding:22px 24px 24px}
.card__title{font-weight:600;font-size:18px;line-height:1.3;color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 18px}
.chip{padding:5px 12px;border-radius:var(--radius-pill);font-size:12px;color:var(--muted);background:var(--white)}
.card__actions{display:flex;gap:8px}
.card__actions a{flex:1;padding:11px;border-radius:var(--radius-pill);text-align:center;font-size:13px;font-weight:500;transition:background .18s ease,color .18s ease}
.card__actions .view{border:1px solid var(--line);color:var(--ink);background:transparent}
.card__actions .view:hover{background:var(--white)}
.card__actions .enq{background:var(--white);color:var(--muted)}
.card__actions .enq.is-primary{background:var(--ink);color:var(--white)}
.card__actions .enq:hover{background:var(--ink);color:var(--white)}

/* Section head */
.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:48px;gap:20px;flex-wrap:wrap}
.section-head__text{max-width:560px}
.section-head__text .lead{margin-top:16px}

/* Precision dial — half-wheel with 5 nodes ON the arc + centered glass card */
.dial{position:relative;width:min(1000px,95vw);aspect-ratio:1000/560;margin:60px auto 0;color:#DADADA}
.dial__wheel{position:absolute;inset:0;pointer-events:none}
.dial__wheel svg{width:100%;height:100%;display:block;overflow:visible}
.dial__node{position:absolute;text-align:center;cursor:pointer;z-index:3;transform:translate(-50%,-50%);transition:transform .25s ease;padding:6px}
.dial__node:hover{transform:translate(-50%,-50%) translateY(-2px)}
.dial__node .n{font-weight:600;font-size:12px;margin-bottom:8px;color:#B0B0B0;transition:color .25s;font-variant-numeric:tabular-nums;letter-spacing:.5px}
.dial__node .dot{width:18px;height:18px;border-radius:50%;background:var(--white);border:2px solid #CCC;margin:0 auto;transition:all .3s ease}
.dial__node.is-active .n{color:var(--ink)}
.dial__node.is-active .dot{background:var(--ink);border-color:var(--ink);box-shadow:0 0 0 5px rgba(10,10,10,.07),0 4px 12px rgba(10,10,10,.18)}
/* card sits centered inside the half-wheel */
.dial__card{position:absolute;left:50%;top:60%;transform:translate(-50%,-30%);width:min(380px,80%);background:rgba(255,255,255,.95);backdrop-filter:blur(22px) saturate(1.5);-webkit-backdrop-filter:blur(22px) saturate(1.5);border:1px solid rgba(255,255,255,.9);border-radius:22px;padding:28px 26px 26px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.7);z-index:4;transition:opacity .3s ease,transform .3s ease}
.dial__card h3{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:26px;line-height:1.1;margin-bottom:14px;letter-spacing:-.01em}
.dial__card .img-wrap{height:110px;display:grid;place-items:center;margin-bottom:16px;overflow:hidden;border-radius:14px}
.dial__card img{max-height:100%;max-width:100%;object-fit:contain}
.dial__card p{color:var(--muted);margin-bottom:18px;font-size:14px;line-height:1.55}
@media (max-width:640px){
  .dial{aspect-ratio:1000/620}
  .dial__card{width:88%;top:52%;padding:22px 20px 20px}
  .dial__card .img-wrap{height:90px}
  .dial__card h3{font-size:22px}
  .dial__card p{font-size:13px}
}

/* Tabs — glass-morphism */
.tabs{display:flex;gap:6px;flex-wrap:wrap}
.tabs button{padding:11px 20px;border-radius:var(--radius-pill);font-size:13px;font-weight:500;background:rgba(255,255,255,.55);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);color:var(--ink);border:1px solid rgba(255,255,255,.7);box-shadow:0 4px 14px rgba(0,0,0,.04),inset 0 1px 0 rgba(255,255,255,.6);transition:all .2s ease}
.tabs button.is-active{background:var(--ink);color:var(--white);border-color:var(--ink);box-shadow:0 6px 18px rgba(0,0,0,.2)}
.tabs button:hover:not(.is-active){background:rgba(255,255,255,.85);transform:translateY(-1px)}

/* Process tiles */
.process{display:grid;grid-template-columns:2fr 1fr;gap:32px;align-items:stretch}
.process__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tile{background:var(--surface);border-radius:16px;padding:22px 24px}
.tile__title{font-weight:700;font-size:16px;margin-bottom:6px}
.tile__sub{font-size:13px;color:var(--muted);line-height:1.5}
.process__img{border-radius:var(--radius);overflow:hidden;background:var(--surface)}
.process__img img{width:100%;height:100%;object-fit:cover;min-height:280px}
@media (max-width:900px){.process{grid-template-columns:1fr}.process__grid{grid-template-columns:1fr 1fr}}

/* Testimonials */
.tcards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:900px){.tcards{grid-template-columns:1fr}}
.tcard{background:var(--surface);border-radius:var(--radius);padding:32px 28px}
.tcard__q{font-size:36px;line-height:1;color:var(--line-2);margin-bottom:14px;font-weight:700}
.tcard__body{font-size:15px;line-height:1.65;color:var(--ink);margin-bottom:24px}
.tcard__author{display:flex;align-items:center;gap:12px}
.tcard__ava{width:40px;height:40px;border-radius:50%;background:var(--ink);display:grid;place-items:center;color:var(--white);font-weight:600;font-size:13px}
.tcard__name{font-weight:600;font-size:14px}
.tcard__loc{color:var(--dim);font-size:13px}

/* FAQ */
.faq-wrap{display:grid;grid-template-columns:1fr 1.4fr;gap:64px;align-items:start}
@media (max-width:900px){.faq-wrap{grid-template-columns:1fr;gap:32px}}
.faq{display:flex;flex-direction:column;gap:8px}
.faq__item{background:var(--surface);border-radius:16px;overflow:hidden;transition:background .2s ease}
.faq__item.is-open{background:var(--ink);color:var(--white)}
.faq__q{width:100%;padding:22px 26px;display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:15px;text-align:left;cursor:pointer}
.faq__q svg{transition:transform .3s ease}
.faq__item.is-open .faq__q svg{transform:rotate(180deg)}
.faq__a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.faq__a-inner{padding:0 26px 22px;font-size:14px;line-height:1.6;opacity:.8}

/* Footer */
.footer{background:var(--white);padding:80px 0 24px;border-top:1px solid var(--line);margin-top:40px}
.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.4fr;gap:48px;margin-bottom:60px}
@media (max-width:900px){.footer__grid{grid-template-columns:1fr 1fr;gap:32px}}
@media (max-width:520px){.footer__grid{grid-template-columns:1fr}}
.footer__logo{font-weight:800;font-size:19px;margin-bottom:16px}
.footer__desc{color:var(--muted);font-size:14px;line-height:1.6;margin-bottom:20px}
.footer__socials{display:flex;gap:8px}
.footer__socials a{width:36px;height:36px;border-radius:50%;background:var(--ink);display:grid;place-items:center;color:var(--white);transition:transform .18s ease}
.footer__socials a:hover{transform:translateY(-2px)}
.footer__col-title{font-weight:600;font-size:14px;margin-bottom:16px}
.footer__col ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer__col a,.footer__col li{color:var(--muted);font-size:14px;transition:color .18s ease}
.footer__col a:hover{color:var(--ink)}
.footer__sub-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.footer__bar{display:flex;justify-content:space-between;padding-top:24px;border-top:1px solid var(--line);color:var(--dim);font-size:13px;flex-wrap:wrap;gap:16px}
.footer__bar a{color:var(--dim);margin-left:16px;transition:color .18s ease}
.footer__bar a:hover{color:var(--ink)}

/* Reveal animation */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.is-in{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}html{scroll-behavior:auto}}

/* Page transitions — slide applied to <main> only, so body stays a clean containing block for position:fixed (WhatsApp float, nav) */
@keyframes pageSlideIn{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}
@keyframes pageSlideOut{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-40px)}}
main{animation:pageSlideIn .45s cubic-bezier(.2,.7,.2,1) both}
body.is-leaving main{animation:pageSlideOut .3s cubic-bezier(.4,0,.6,1) forwards}
@media (prefers-reduced-motion:reduce){main,body.is-leaving main{animation:none}}
/* Native View Transitions (Chrome/Edge) — smoother when available */
@view-transition{navigation:auto}
::view-transition-old(root){animation:.28s cubic-bezier(.4,0,.6,1) both pageSlideOut}
::view-transition-new(root){animation:.42s cubic-bezier(.2,.7,.2,1) both pageSlideIn}

/* Forms */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:600px){.form-grid{grid-template-columns:1fr}}
.field label{display:block;font-size:13px;font-weight:500;margin-bottom:6px;color:var(--muted)}
.field .hint{font-size:12px;color:var(--dim);margin-top:6px}
.field--full{grid-column:1/-1}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{padding:9px 16px;border-radius:var(--radius-pill);font-size:13px;font-weight:500;border:1px solid var(--line);background:var(--white);color:var(--ink);cursor:pointer;transition:all .18s ease;user-select:none}
.pill.is-selected{background:var(--ink);color:var(--white);border-color:var(--ink)}
.pill:hover:not(.is-selected){background:var(--surface)}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:13px;color:var(--muted);line-height:1.55}
.consent input{width:18px;height:18px;margin-top:2px;accent-color:var(--ink)}
.honey{position:absolute;left:-9999px;opacity:0;pointer-events:none}
.progress{height:4px;background:var(--surface);border-radius:2px;overflow:hidden;margin-bottom:32px}
.progress__bar{height:100%;background:var(--ink);width:25%;transition:width .35s ease}
.stepper{display:flex;justify-content:space-between;gap:12px;margin-bottom:32px}
.stepper__step{flex:1;padding:14px;border-radius:12px;background:var(--surface);color:var(--muted);font-size:13px;font-weight:500}
.stepper__step.is-active{background:var(--ink);color:var(--white)}
.stepper__step .n{font-size:11px;color:var(--dim);margin-bottom:2px}
.stepper__step.is-active .n{color:rgba(255,255,255,.6)}
.form-actions{display:flex;justify-content:space-between;margin-top:32px;gap:12px}

/* Blog */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
@media (max-width:900px){.blog-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.blog-grid{grid-template-columns:1fr}}
.post-card{display:flex;flex-direction:column;transition:transform .25s ease}
.post-card:hover{transform:translateY(-4px)}
.post-card__img{aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:var(--surface);margin-bottom:16px}
.post-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.post-card:hover .post-card__img img{transform:scale(1.03)}
.post-card__tag{font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:8px}
.post-card__title{font-weight:700;font-size:20px;line-height:1.3;margin-bottom:8px}
.post-card__excerpt{color:var(--muted);font-size:14px;line-height:1.6;margin-bottom:12px}
.post-card__meta{color:var(--dim);font-size:12px;margin-top:auto}

/* Blog post article */
.article{max-width:760px;margin:0 auto;padding:20px 0 40px}
.article h1{font-weight:800;font-size:clamp(30px,4.5vw,44px);line-height:1.15;letter-spacing:-.02em;margin-bottom:24px}
.article__meta{display:flex;gap:16px;color:var(--dim);font-size:13px;margin-bottom:32px}
.article__cover{aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;margin-bottom:40px;background:var(--surface)}
.article__cover img{width:100%;height:100%;object-fit:cover}
.article__body{font-size:17px;line-height:1.75;color:#333}
.article__body h2{font-weight:700;font-size:28px;margin:40px 0 16px;letter-spacing:-.01em;color:var(--ink)}
.article__body h3{font-weight:700;font-size:22px;margin:32px 0 12px;color:var(--ink)}
.article__body p{margin-bottom:18px}
.article__body ul,.article__body ol{margin:0 0 20px 24px}
.article__body li{margin-bottom:8px}
.article__body a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.article__body strong{color:var(--ink)}
.article__body blockquote{border-left:3px solid var(--ink);padding-left:20px;margin:24px 0;color:var(--muted);font-style:italic}
.article__cta{background:var(--surface);border-radius:var(--radius);padding:32px;margin:40px 0;text-align:center}
.article__cta h3{margin-bottom:12px}
.article__cta p{color:var(--muted);margin-bottom:20px}

/* Progress bar */
.readbar{position:fixed;top:0;left:0;height:3px;background:var(--ink);z-index:100;transition:width .1s ease}

/* Market note callout */
.market-note{background:linear-gradient(135deg,#FAFAFA 0%,#F0F0F2 100%);border:1px solid var(--line);border-radius:24px;padding:48px 56px;position:relative}
.market-note__eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted)}
.market-note__eyebrow .dot{width:8px;height:8px;border-radius:50%;background:#D93636;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}
@media (max-width:640px){.market-note{padding:32px 24px}}

/* Utility */
.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-48{margin-top:48px}
.center{text-align:center}
.mono{font-variant-numeric:tabular-nums}

/* Toast */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(120%);background:var(--ink);color:var(--white);padding:14px 24px;border-radius:var(--radius-pill);font-size:14px;z-index:100;transition:transform .3s ease;box-shadow:0 12px 40px rgba(0,0,0,.2)}
.toast.is-show{transform:translateX(-50%) translateY(0)}
.toast.is-error{background:#B00020}

/* Success screen */
.success{max-width:520px;margin:80px auto;text-align:center;padding:60px 30px}
.success__icon{width:80px;height:80px;border-radius:50%;background:var(--ink);color:var(--white);display:grid;place-items:center;margin:0 auto 24px}