/* White comparison variant — remove this stylesheet to restore the saved dark design. */
:root{--paper:#fff;--surface:#fff;--control:#fff;--ink:#000;--muted:#000;--line:#d9d9d9;--accent:#000}
body,.hero,.brands,.product,.content-collage,.faq,.community,.footer{background-color:#fff;color:#000}
.header{background:rgba(255,255,255,.95);border-color:#ddd}
h1,h1 span,h2,h3,p,.yc-name,.eyebrow,.collage-copy h2,.collage-copy p,.collage-copy .platforms,.footer a,.footer p{color:#000}
.brand img,.community-brand,.client-logo img,.client-logo:hover img,.backer-logos img{filter:brightness(0)}
.brand:before,.brand-halo:after{background:#000}
.backer{border-color:#d6d6d6;box-shadow:none;color:#000}.yc{background:#eee;color:#000}
.button,.button.primary,.desktop-demo,.collage-copy .button{background:#fff;color:#000;border-color:#bbb;box-shadow:0 4px 0 #d6d6d6}
.button:hover,.button.primary:hover,.desktop-demo:hover{background:#f4f4f4;color:#000}
.hero-asset,.product-fan .product-card,.community-panel,.feature-frame,.fan-card,dialog{background:#fff;border-color:#ddd;color:#000}
.product-icon,.orb,.metric{background:#fff;border-color:#ddd;color:#000}.metric b{color:#000}
.asset-chrome{color:#000}.asset-chrome i{background:#000;box-shadow:none}
.eyebrow{background:#fff;border-color:#ccc}
#product.scroll-fan .section-heading h2,#product.scroll-fan .section-description{text-shadow:0 2px 14px #fff,0 0 24px #fff}
.faq{background-image:radial-gradient(circle,#00000018 1px,transparent 1.4px)}
.faq .faq-list,.faq details,.faq details[open]{border-color:#ccc}
.faq summary,.faq summary span,.faq details p{color:#000}
.footer input,dialog input{background:#fff;border-color:#bbb;color:#000}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline-color:#000}

.backer .yc{background:#fb650a;color:#fff}

.client-logo img{transition:filter .25s,opacity .25s}
.client-logo:hover img{filter:none;opacity:1}

/* Soft desktop-grey hero and oversized sans-serif type study. */
.hero{background-color:#f5f5f5}
.header{background:rgba(245,245,245,.96)}
.hero:before{background-image:radial-gradient(#999 1px,transparent 1.5px);background-size:32px 32px;opacity:.34;mask-image:none;inset:0}

/* Reference CTA: solid navy, white type, rounded rectangle. */
.button.primary,.desktop-demo,.hero .button,.collage-copy .button{background:#031226;color:#fff;border:1px solid #031226;border-radius:18px;box-shadow:none;font-weight:500}
.button.primary:hover,.desktop-demo:hover,.hero .button:hover,.collage-copy .button:hover{background:#102740;color:#fff;border-color:#102740;box-shadow:none}
.button.primary:active,.desktop-demo:active,.hero .button:active,.collage-copy .button:active{box-shadow:none;transform:translateY(1px)}


.hero .backer{margin-bottom:56px}
@media(max-width:600px){.hero .backer{margin-bottom:44px}}

/* Shared soft grey canvas throughout, matching the header. */
:root{--paper:#f5f5f5;--surface:#f5f5f5;--control:#f5f5f5}
body,.hero,.brands,.product,.content-collage,.faq,.community,.footer,.community-panel,.hero-asset,.product-fan .product-card,.feature-frame,.fan-card,dialog{background-color:#f5f5f5}
.header{background:rgba(245,245,245,.96)}

.product-fan .product-card{background:#fff}
.product-fan .product-icon{background:#f5f5f5;color:#757575}
.product-fan .product-icon svg{stroke:#757575}
.product-fan .pixel-field{opacity:.85}

.product-fan .product-icon svg path[fill="white"]{fill:#757575}

.product-fan .product-icon{margin-top:auto;margin-bottom:24px}
.product-fan .product-card>div{margin-top:0}

/* Flat primary/outlined secondary button reference. */
.button{background:transparent;color:#111;border:1.5px solid #111;border-radius:7px;box-shadow:none;font-weight:400}
.button.primary,.desktop-demo,.hero .button,.collage-copy .button{background:#111;color:#fff;border:1.5px solid #111;border-radius:7px;box-shadow:none;font-weight:400}
.button:hover{background:#e9e9e9;color:#111;box-shadow:none}
.button.primary:hover,.desktop-demo:hover,.hero .button:hover,.collage-copy .button:hover{background:#292929;color:#fff;border-color:#292929;box-shadow:none}
.button:active,.button.primary:active,.desktop-demo:active,.hero .button:active,.collage-copy .button:active{box-shadow:none;transform:translateY(1px)}

/* Pastel editorial footer inspired by the supplied reference. */
.footer{position:relative;isolation:isolate;overflow:hidden;padding-top:88px;padding-bottom:0;background-color:#e9ebec;background-image:radial-gradient(ellipse at 8% 12%,#afc3a3b3,transparent 37%),radial-gradient(ellipse at 43% 0%,#f0d6aab3,transparent 36%),radial-gradient(ellipse at 75% 27%,#b3c4a6cc,transparent 40%),radial-gradient(ellipse at 98% 5%,#b5bee6cc,transparent 44%),radial-gradient(ellipse at 30% 93%,#b5bedeb3,transparent 40%)}
.footer .container{position:relative;z-index:1}
.footer-top{grid-template-columns:1.6fr .8fr 1fr 1.15fr;gap:48px;border:0}
.footer-identity{display:inline-block;margin-bottom:26px}
.footer-identity img{width:146px;height:38px;object-fit:contain;filter:brightness(0)}
.footer-pitch h2{font-family:'Instrument Serif',Georgia,serif;font-size:34px;line-height:1.15;font-weight:400;max-width:340px}
.footer h3{font-size:17px;font-weight:500;margin-bottom:24px}
.footer .footer-links{font-family:Geist,sans-serif;text-transform:none;font-size:16px;gap:18px}
.footer .footer-links a,.footer .footer-pitch p,.footer .waitlist-form label{color:#454545}
.footer .email-row{background:#ffffff50;border-color:#777}
.footer .email-row input,.footer .email-row button{color:#111;background:transparent}
.footer-bottom{border-top:1px solid #00000018;margin-top:40px;padding-top:24px;padding-bottom:20px}
.footer-wordmark{font-family:'Instrument Serif',Georgia,serif;font-size:clamp(160px,30vw,540px);line-height:.77;letter-spacing:-.06em;text-align:center;margin-top:64px;margin-bottom:-.11em;background:linear-gradient(120deg,#183e91,#07154c 35%,#3459a0 70%,#677d9e);background-clip:text;-webkit-background-clip:text;color:transparent;pointer-events:none}
@media(max-width:900px){.footer-top{grid-template-columns:1.4fr 1fr;gap:40px}.footer{padding-top:64px}}
@media(max-width:600px){.footer-top{grid-template-columns:1fr 1fr;gap:36px 24px}.footer-pitch{grid-column:1/-1}.footer-pitch h2{font-size:32px}.footer .footer-links{font-size:14px}.footer-wordmark{font-size:30vw;margin-top:40px}.footer-bottom{flex-wrap:wrap}}

.footer{background:#fff;background-image:none}
.footer-wordmark{background:none;color:#000;margin:48px 0 0;height:clamp(170px,25vw,420px);line-height:1;overflow:hidden}
.footer-particles{display:block;width:100%;height:100%}
/* Continuous community arc from the October 10 reference. */
.community.section{background:#fff;padding:70px 0 65px;overflow:hidden}
.community .community-panel{max-width:none;width:100%;padding:0;border:0;border-radius:0;background:#fff;box-shadow:none}
.community-panel:before{display:none}
.community-arc{position:relative;width:100%;height:clamp(260px,45vw,720px);overflow:hidden}
.arc-card{position:absolute;left:50%;top:0;width:15vw;max-width:300px;aspect-ratio:3/4;border-radius:9px;overflow:hidden;background:#eee;will-change:transform}
.arc-card video{display:block;width:100%;height:100%;object-fit:cover}
.community .community-copy{position:relative;margin:clamp(-110px,-7vw,-35px) auto 0;padding:0 20px;text-align:center}
.community-copy .section-heading{margin:0 auto 30px;max-width:850px}
.community-copy .section-heading h2{font-family:'Instrument Serif',Georgia,serif;font-size:clamp(36px,4.3vw,70px);font-weight:400;line-height:1.1;letter-spacing:-.025em;max-width:none}
.community-copy h2 span{color:#777}
.community-copy .actions{justify-content:center}
@media(max-width:600px){.community.section{padding-top:45px}.arc-card{width:24vw}.community-arc{height:310px}.community .community-copy{margin-top:-35px}.community-copy .actions{flex-wrap:wrap}}
/* Page canvas sampled from the October 10 reference: #fefcf8. */
:root{--page-canvas:#fefcf8}
html,body,.header,.hero,.brands,.product,.content-collage,.faq,.community.section,.community .community-panel,.footer{background-color:var(--page-canvas)}
.header{background:var(--page-canvas)}
/* Local refinement: let the arc fade into the canvas instead of clipping sharply. */
.community.section{padding-bottom:160px}
.community .community-copy{background:transparent;border:0;box-shadow:none}
.footer{border-top:0}
@media(max-width:600px){.community.section{padding-bottom:100px}}

/* Local community revision: crisp videos and more room below the actions. */
.community-arc{mask-image:none;-webkit-mask-image:none}
.community.section{padding-bottom:240px}
@media(max-width:600px){.community.section{padding-bottom:150px}}
/* Footer without the update signup column. */
.footer-top{grid-template-columns:1.6fr 1fr 1fr}
@media(max-width:900px){.footer-top{grid-template-columns:1.4fr 1fr 1fr}}
@media(max-width:600px){.footer-top{grid-template-columns:1fr 1fr}}
.hero-content h1{white-space:nowrap;max-width:none;font-size:clamp(30px,6.3vw,100px)}
/* Borderless product cards with soft depth on the warm canvas. */
.product-fan .product-card{border-color:transparent;box-shadow:0 3px 10px rgb(40 35 25 / 4%),0 14px 35px rgb(40 35 25 / 7%)}
.footer-wordmark,.footer-particles{pointer-events:auto}
.footer-particles{cursor:crosshair;touch-action:pan-y}
.header .brand:before{display:none;content:none}
#product .section-heading h2{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:clamp(38px,4.3vw,70px);line-height:1.1;letter-spacing:-.025em;max-width:none}

.client-logo img.hologrow{width:150px;height:40px;object-fit:contain}.client-logo.agent37{display:flex;align-items:center;justify-content:center;gap:8px}.client-logo img.agent37{width:36px;height:36px;object-fit:contain}.client-logo.agent37 span{font-family:Geist,Arial,sans-serif;font-size:25px;font-weight:600;letter-spacing:-.04em;opacity:.7;white-space:nowrap}.client-logo.agent37:hover span{opacity:1}

/* Keep every wordmark inside its own roomy ticker slot. */
.ticker-track .client-logo{flex:0 0 180px;width:180px;height:64px;overflow:visible}
.ticker-track .client-logo img{display:block;object-fit:contain;width:auto;height:auto;max-width:160px;max-height:44px;flex-shrink:0}
.ticker-track .client-logo img.yam{width:160px;height:64px;max-width:160px;max-height:64px;object-fit:contain}
.ticker-track .client-logo img.hologrow{width:160px;height:40px}
.ticker-track .client-logo img.agent37{width:32px;height:32px;max-width:32px;max-height:32px}
@media(max-width:600px){.ticker-track .client-logo{flex-basis:165px;width:165px}.ticker-track .client-logo.agent37 span{font-size:23px}}

/* Balance each wordmark at the same visual height. */
.ticker-track .client-logo{height:64px}
.ticker-track .client-logo img{width:auto;height:30px;max-width:160px;max-height:30px;object-fit:contain}
.ticker-track .client-logo img.hologrow{width:160px;height:30px;max-height:30px}
/* Yam includes generous transparent padding in its source artwork. */
.ticker-track .client-logo img.yam{width:160px;height:78px;max-width:160px;max-height:78px;object-fit:contain}
.ticker-track .client-logo img.agent37{width:30px;height:30px;max-width:30px;max-height:30px}
.ticker-track .client-logo.agent37 span{font-size:25px;line-height:30px}

.header .brand img{content:normal;filter:none;width:200px;height:60px;object-fit:contain}@media(max-width:600px){.header .brand img{width:160px;height:48px}}

.header .brand img{width:132px;height:40px}@media(max-width:600px){.header .brand img{width:112px;height:34px}}

/* Compact, viewport-scaled media and wordmarks on phones. */
@media(max-width:600px){
 .hero .hero-media{gap:clamp(8px,2.5vw,14px);padding:10px 20px 24px;scrollbar-width:none}
 .hero .hero-media::-webkit-scrollbar{display:none}
 .hero .hero-asset{width:clamp(108px,30vw,150px);padding:6px 6px 8px;box-shadow:0 12px 22px #0002}
 .hero .hero-asset .hero-video{aspect-ratio:9/14}
 .hero .asset-chrome{height:16px;margin-bottom:5px}
 .ticker-track{gap:clamp(16px,5vw,28px)}
 .ticker-track .client-logo{flex:0 0 clamp(106px,28vw,140px);width:clamp(106px,28vw,140px);height:44px}
 .ticker-track .client-logo img{height:22px;max-height:22px;max-width:100px}
 .ticker-track .client-logo img.hologrow{width:100px;height:22px;max-height:22px}
 .ticker-track .client-logo img.yam{width:112px;height:56px;max-width:112px;max-height:56px}
 .ticker-track .client-logo img.agent37{width:20px;height:20px;max-width:20px;max-height:20px}
 .ticker-track .client-logo.agent37{gap:5px}
 .ticker-track .client-logo.agent37 span{font-size:18px;line-height:22px}
}
