/* Landing composition on the sizing scale (spec/core/site/design.md). Tokens: ink-acid.css :root.
   The Slack simulator (.vk-*) is styled by slack-original.css. */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body.calm{font-family:var(--ff-ui);color:var(--ink);background:var(--paper);font-size:var(--t0);line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2{text-wrap:balance}

/* frame and text column */
.wrap{max-width:var(--frame);margin:0 auto;padding:0 var(--pad-x)}
.wrap-n{max-width:calc(var(--measure) + 2 * var(--pad-x));margin:0 auto;padding:0 var(--pad-x)}
.measure{max-width:var(--measure)}
.center{text-align:center}
.center .measure,.center .sec-intro,.center .lead,.center p{margin-left:auto;margin-right:auto}

/* type steps */
.display{font-size:var(--t5);line-height:1.1;letter-spacing:-.02em}
.title{font-size:var(--t3);line-height:1.25;letter-spacing:-.02em}
.lead{font-size:var(--t1);line-height:1.25}
.caption,.stamp,.chip{font-size:var(--t-1);line-height:1.5}
.stamp{text-transform:uppercase;letter-spacing:0;color:var(--muted)}
.wdim,.rz-intro,.caption{color:var(--muted)}
.rz-intro,.sec-intro p,.hero-subheading{max-width:var(--measure)}
.hero-subheading .p-marks{display:inline;white-space:nowrap}
.hero-subheading .p-mark{display:inline-block;width:1.15em;height:1.15em;margin:0 .12em;vertical-align:-.2em;object-fit:contain}

/* controls */
.chip{display:inline-flex;align-items:center;gap:var(--s2);font-weight:600;padding:var(--s2) var(--s3);border-radius:var(--s1);border:1px solid var(--line);background:#fff;color:var(--muted)}
.chip img{width:var(--s4);height:var(--s4)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:var(--target);padding:var(--s3) var(--s6);border-radius:var(--radius);background:var(--ink);color:var(--paper);border:1px solid var(--ink);font-weight:600;font-size:var(--t1);line-height:1.25}
.btn:hover{background:var(--paper);color:var(--ink)}
.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:var(--target);padding:var(--s3) var(--s6);border-radius:var(--radius);border:1px solid var(--line);color:var(--ink);font-weight:600;font-size:var(--t1);line-height:1.25}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius)}

/* sections: one rhythm, one head */
.sec{padding:var(--sec-y) 0}
.sec-dark,.aurora{background:var(--paper);color:var(--ink)}
.aurora{position:relative;overflow:hidden}
.hairline-d{border-top:1px solid var(--line)}
.sec>.wrap>*+*{margin-top:var(--s12)}
.sec.dense>.wrap>*+*{margin-top:var(--s6)}
.sec-intro>*+*{margin-top:var(--s4)}
.sec-split>.wrap{display:grid;grid-template-columns:1fr 2fr;gap:var(--s6) var(--s12);align-items:start}
.sec-split>.wrap>*+*{margin-top:0}
.sec[id],#creative-engine,#proof{scroll-margin-top:var(--nav)}
@media(max-width:767px){.sec-split>.wrap{grid-template-columns:minmax(0,1fr)}}

/* hero */
.hero{padding:var(--s12) 0 var(--hero-y)}
.hero>.wrap>*+*{margin-top:var(--s4)}
.hero>.wrap>.vk-bezel{margin-top:var(--s12)}
.hero .btn,.hero .chip{margin-left:auto;margin-right:auto}
@media(max-width:767px){.hero .display br:first-of-type{display:none}}
.vk-bezel{max-width:var(--frame);text-align:left}

/* org chart */
.d-org{display:flex;flex-direction:column;align-items:center;width:100%;isolation:isolate}
.d-node{display:inline-flex;align-items:center;gap:var(--s2);padding:var(--s3) var(--s6);border-radius:var(--radius);background:#fff;border:1px solid var(--line);font-weight:600}
.d-node>span{display:flex;flex-direction:column;text-align:left;line-height:1.25}
.d-node small{font-size:var(--t-1);font-weight:400;color:var(--muted);margin-top:var(--s1)}
.d-node.maja{position:relative;background:none;border-color:transparent}
.d-node.maja::before,.d-node.maja::after{content:'';position:absolute;z-index:-1;opacity:.55}
.d-node.maja::before{inset:-.05em -.2em .35em -.4em;background:var(--marker) center/100% 100% no-repeat;transform:rotate(-2deg)}
.d-node.maja::after{inset:.45em -.45em -.15em -.15em;background:var(--marker2) center/100% 100% no-repeat;transform:rotate(1.2deg)}
.d-node.maja img{width:var(--s8);height:var(--s8);border-radius:var(--s1);object-fit:cover;object-position:top}
.d-vlink{width:1px;height:var(--s6);background:#bcc3b4}
.d-bus{display:block;width:calc(50% + 4px);height:1px;background:#bcc3b4}
.d-team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4);width:100%;padding-top:var(--s6)}
.d-chip{position:relative;display:grid;grid-template-rows:var(--s8) auto 1fr auto;justify-items:center;align-items:start;gap:var(--s2);min-width:0;padding:var(--s6) var(--s4);text-align:center;background:#fff;border:1px solid #cbd1c3;border-radius:var(--radius)}
.d-chip b{font-weight:600}
.d-chip i{font-style:normal;font-size:var(--t-1);line-height:1.5;color:var(--muted)}
.d-drop{position:absolute;top:0;left:50%;width:1px;height:var(--s6);background:#bcc3b4;transform:translateY(-100%)}
.d-faces{display:flex;min-height:var(--s8)}
.d-faces img,.d-faces em,.d-faces .rd,.d-faces .lg{width:var(--s8);height:var(--s8);border-radius:50%;object-fit:cover;border:2px solid #fff;margin-left:calc(-1 * var(--s2));display:flex;align-items:center;justify-content:center}
.d-faces>*:first-child{margin-left:0}
.d-faces em{background:var(--offwhite);font-size:var(--t-1);font-weight:600;font-style:normal}
.d-faces .rd{background:#FF4500}
.d-faces .lg{background:#fff;border-color:#d8ddcf}
.d-faces .rd img,.d-faces .lg img{width:var(--s4);height:var(--s4);border:0;margin:0;border-radius:0}
@media(max-width:767px){.d-team{grid-template-columns:minmax(0,1fr)}.d-bus,.d-drop{display:none}.d-team{padding-top:0}}

/* creative engine: the animation, the finished examples, the humans who post them */
#ugc.mh-section{overflow:visible}
#ugc .ce-engine-video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;border-radius:var(--radius);background:#080a12}
@media(max-width:767px){#ugc .ce-engine-video{aspect-ratio:3/4}}
#ugc .ce-examples-label{margin:0 0 var(--s4);font-size:var(--t1);line-height:1.25;color:var(--muted)}
#ugc .ce-gallery{display:flex;flex-wrap:nowrap;gap:var(--s6);width:100%;min-width:0;box-sizing:border-box;padding:var(--s2) var(--s2) var(--s4);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--s2);scrollbar-width:thin;text-align:left}
#ugc .ce-card{position:relative;flex:0 0 calc((100% - 72px)/3.25);min-width:0;margin:0;scroll-snap-align:start;scroll-snap-stop:always;color:var(--ink)}
#ugc .ce-card video{display:block;position:static;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:var(--ink);border:1px solid #c5c9bb;border-radius:var(--radius);box-sizing:border-box}
#ugc .ce-description{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#ugc .ce-gallery:focus-visible,#ugc .ce-card video:focus-visible{outline:3px solid var(--ink);outline-offset:var(--s1)}
@media(min-width:1024px){#ugc .ce-card{flex-basis:calc((100% - 72px)/4)}}
@media(max-width:767px){#ugc .ce-gallery{gap:var(--s3)}#ugc .ce-card{flex-basis:calc((100% - 12px)/1.25 * .92)}}
/* our own app: the run, then the accounts */
.d-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6);text-align:left}
.d-stats>div{padding-right:var(--s6);border-right:1px solid var(--line)}
.d-stats>div:last-child{border:0;padding:0}
.d-stats b{display:block;font-size:var(--t3);line-height:1.25;letter-spacing:-.02em;white-space:nowrap}
.d-stats span{display:block;font-size:var(--t-1);color:var(--muted);margin-top:var(--s2)}
.d-roster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s12);max-width:calc(var(--measure) * 1.5);margin-left:auto;margin-right:auto}
.d-acc{display:flex;align-items:center;gap:var(--s3);padding:var(--s4) 0;border-bottom:1px solid var(--line);text-align:left}
.d-acc>div{flex:1;min-width:0}
.d-acc .pf{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none}
.d-acc .h{font-weight:600;line-height:1.25}
.d-acc .m{display:flex;align-items:center;gap:var(--s2);font-size:var(--t-1);color:var(--ink);margin-top:var(--s1)}
.d-acc .m img{width:var(--s4);height:var(--s4);object-fit:contain}
.d-acc .gz{font-size:var(--t-1);color:var(--muted);margin-top:var(--s1)}
@media(max-width:767px){.d-stats,.d-roster{grid-template-columns:minmax(0,1fr)}.d-stats>div{padding:0;border:0}}

/* reddit: ticker, then search result → human thread → AI citation */
.rz-ticker{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.rz-lane{display:flex;gap:var(--s4);width:max-content;animation:rzscroll var(--d,74s) linear infinite}
.rz-lane.rev{animation-direction:reverse}
.rz-lane+.rz-lane{margin-top:var(--s3)}
@keyframes rzscroll{to{transform:translateX(-50%)}}
.rz-pill{display:inline-flex;align-items:center;gap:var(--s2);padding:var(--s2) var(--s3);border-radius:var(--radius);background:#fff;border:1px solid var(--line);font-size:var(--t-1);font-weight:600;white-space:nowrap}
.rz-rchip,.rz-cchip{width:var(--s4);height:var(--s4);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none}
.rz-rchip{background:#FF4500}.rz-cchip{background:#0d0d0d}
.rz-rchip img{width:10px;height:10px}.rz-cchip img{width:var(--s3);height:var(--s3)}
.rz-lg{width:var(--s4);height:var(--s4);flex:none;object-fit:contain}
.rz-diag{display:flex;align-items:center;justify-content:center}
.rz-conn{flex:1;height:1px;background:var(--line);max-width:150px;min-width:var(--s16)}
.rz-thread{width:100%;max-width:328px;flex:none;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--s4);color:#1a1a1b;text-align:left;font-family:'Noto Sans','Inter',-apple-system,sans-serif}
.rz-thread .rh{display:flex;align-items:center;gap:var(--s2);font-size:12px;color:#576f76}
.rz-thread .rav{width:22px;height:22px;border-radius:50%;background:#FF4500;display:flex;align-items:center;justify-content:center}
.rz-thread .rt{font-weight:700;font-size:14.5px;line-height:1.35;margin-top:var(--s2)}
.rz-dest{width:100%;max-width:256px;min-height:148px;flex:none;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--s4);text-align:left;transition:border-color .4s;display:flex;flex-direction:column;justify-content:center}
.rz-dest.lit{border-color:#a7ad9e}
.rz-dest .dh{display:flex;align-items:center;gap:var(--s2);font-size:11px;color:#8a8a8a;font-weight:600}
.rz-serp,.rz-serp .bc,.rz-serp .t,.rz-serp .dh{font-family:Arial,Helvetica,sans-serif}
.rz-serp .bc{font-size:10.5px;color:#0a7d30;margin-top:var(--s2)}
.rz-serp .t{font-size:13px;color:#1a0dab;font-weight:600;line-height:1.35;margin-top:2px}
.rz-rank{display:inline-block;visibility:hidden;font-size:9px;font-weight:900;background:var(--acid);color:var(--ink);border-radius:var(--s1);padding:1px 6px;margin-left:6px;vertical-align:1px}
.rz-dest.lit .rz-rank{visibility:visible}
.rz-ai,.rz-ai .ans{font-family:'Inter',-apple-system,'Segoe UI',sans-serif}
.rz-ai .ans{font-size:12.5px;color:#3c3c43;line-height:1.5;margin-top:var(--s2)}
.rz-ai .cite{display:inline-block;font-size:10.5px;font-weight:700;border:1px solid #e0e0e0;border-radius:var(--s1);padding:3px 8px;margin-top:var(--s2);color:#9a9a9a;transition:all .4s;align-self:flex-start}
.rz-dest.lit .cite{border-color:#a7ad9e;color:#3e5125}
.rz-dlab{text-align:center;font-family:var(--ff-mono);font-size:var(--t-1);text-transform:uppercase;color:var(--muted);margin-top:var(--s3)}
@media(max-width:1023px){
 .rz-diag{flex-direction:column;gap:var(--s4)}
 .rz-conn{width:1px;height:var(--s6);max-width:none;min-width:0;flex:none}
}
@media(max-width:767px){
 .rz-ticker{display:none}
 #reddit .rz-diag{gap:var(--s1);align-items:stretch}
 #reddit .rz-diag>div:not(.rz-conn){display:block;width:100%}
 #reddit .rz-diag>.rz-conn{height:var(--s3);margin-left:50%}
 #reddit .rz-dest,#reddit .rz-thread{max-width:none;min-height:0;padding:var(--s3)}
 #reddit #rzserp+.rz-dlab,#reddit #rzai+.rz-dlab{display:none}
}

/* pricing: two invoices */
.d-price{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6);align-items:start;text-align:left}
.d-inv{background:#fff;border:1px solid var(--line);border-top:3px solid var(--ink);border-radius:var(--radius);padding:var(--s6)}
.d-inv.feat{border-top-color:var(--acid)}
.d-inv .tier{font-family:var(--ff-mono);font-size:var(--t-1);text-transform:uppercase;color:var(--muted)}
.d-inv .amt{margin-top:var(--s2)}
.d-inv .amt b{font-size:var(--t3);line-height:1.25;letter-spacing:-.02em;font-weight:500}
.d-inv .amt span{color:var(--muted);margin-left:var(--s1)}
.d-inv .sub{color:var(--muted);margin-top:var(--s2)}
.d-inv .sub+.row{margin-top:var(--s4)}
.d-inv .row{display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding:var(--s3) 0;border-top:1px solid var(--line)}
.d-inv .row>span{display:flex;align-items:center;gap:var(--s2);min-width:0}
.d-inv .row em{flex:none;font-style:normal;font-weight:600;white-space:nowrap;color:var(--muted);font-size:var(--t-1)}
.d-inv .row em.addon{color:var(--ink)}
.d-inv .mk{width:var(--s4);height:var(--s4);object-fit:contain;flex:none}
.d-inv .row.two>span{flex-direction:column;align-items:flex-start;gap:var(--s2)}
.d-inv .row.two>span>span:first-child{display:flex;flex-direction:column;gap:var(--s1)}
.d-inv .row.two b{font-weight:600}
.d-inv .row.two small{font-size:var(--t-1);color:var(--muted)}
.d-inv .mks{display:inline-flex;flex-direction:row;gap:var(--s2)}
.d-inv .btn{width:100%;margin-top:var(--s6)}
.d-inv .fine{text-align:center;font-size:var(--t-1);color:var(--muted);margin-top:var(--s3)}
@media(max-width:767px){.d-price{grid-template-columns:minmax(0,1fr)}}

/* faq */
details.faq-gtm{background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
details.faq-gtm+details.faq-gtm{margin-top:var(--s2)}
details.faq-gtm summary{display:flex;justify-content:space-between;align-items:center;gap:var(--s4);min-height:var(--target);padding:var(--s4) var(--s6);font-weight:600;cursor:pointer;list-style:none}
details.faq-gtm summary::-webkit-details-marker{display:none}
details.faq-gtm summary::after{content:'+';flex:none}
details.faq-gtm[open] summary::after{content:'−'}
details.faq-gtm p{padding:0 var(--s6) var(--s4);color:var(--muted);max-width:var(--measure)}
details.faq-gtm p a{color:inherit;text-decoration:underline}

/* closing call */
#cta{border-top:1px solid var(--line)}
#cta .display{font-size:var(--t4)}
#cta .display,.hero .display{isolation:isolate}


/* animation opt-out */
@media(prefers-reduced-motion:reduce){.rz-lane{animation:none!important}}
