:root{
  --paper:#FBFAF6;
  --ink:#15140F;
  --ink-soft:#5b5850;
  --line:#15140f1c;
  --card:#FFFFFF;
  --accent:#1f7a52;
  --accent-soft:#1f7a5214;
  --amber:#a8672a;
  --amber-soft:#a8672a16;
  --error:#b3432f;
  --error-soft:#b3432f14;
  --maxw:1180px;
  --font-body:"Hanken Grotesk",system-ui,sans-serif;
  --font-display:"Bricolage Grotesque",system-ui,sans-serif;
  --shadow:0 30px 60px -40px #14302255;
}
*{box-sizing:border-box;}
[hidden]{display:none !important;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--font-body);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
img{max-width:100%;display:block;}
a{color:inherit;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
section{padding:104px 0;}
h1,h2,h3{margin:0;}
.eyebrow{font-family:var(--font-body);font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);display:inline-flex;align-items:center;gap:9px;}
.eyebrow::before{content:"";width:22px;height:1.5px;background:var(--accent);}

/* top bar */
.topbar{position:sticky;top:0;z-index:50;background:color-mix(in srgb, var(--paper) 86%, transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;gap:24px;}
.brand{font-family:var(--font-display);font-weight:700;font-size:21px;letter-spacing:-.01em;text-decoration:none;}
.navlinks{display:flex;gap:26px;font-size:14.5px;font-weight:600;color:var(--ink-soft);}
.navlinks a{text-decoration:none;transition:.15s;}
.navlinks a:hover{color:var(--ink);}
.topbar .cta{font-family:var(--font-body);font-weight:600;font-size:14px;white-space:nowrap;background:var(--ink);color:var(--paper);border:0;cursor:pointer;padding:11px 18px;border-radius:999px;text-decoration:none;transition:.18s;}
.topbar .cta:hover{transform:translateY(-1px);}
@media(max-width:820px){.navlinks{display:none;}}

/* hero */
.hero{padding:80px 0 60px;text-align:center;}
.hero .eyebrow{justify-content:center;}
.h1{font-family:var(--font-display);font-weight:700;font-size:clamp(40px,5.6vw,78px);line-height:1.0;letter-spacing:-.03em;margin:22px auto 0;max-width:15ch;min-height:2.05em;}
.h1 u{text-decoration:none;color:var(--accent);box-shadow:inset 0 -.11em color-mix(in srgb,var(--accent) 26%,transparent);}
.headline-pick{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:22px;}
.headline-pick .lbl{font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft);font-weight:700;}
.headline-pick button{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line);background:transparent;color:var(--ink-soft);font-weight:700;font-size:12px;cursor:pointer;font-family:var(--font-body);transition:.16s;}
.headline-pick button.on{background:var(--accent);color:#fff;border-color:var(--accent);}
.sub{font-size:19.5px;line-height:1.5;color:var(--ink-soft);max-width:38ch;margin:26px auto 0;}
.audience{margin-top:18px;font-size:13.5px;color:var(--ink-soft);}

/* waitlist form */
.form-row{display:flex;flex-direction:column;gap:11px;max-width:430px;}
.form-row .fields{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
.form-row input{font-family:var(--font-body);font-size:15px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:11px;padding:13px 15px;width:100%;}
.form-row input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent;}
.form-row input.full{grid-column:1 / -1;}
.btn-primary{font-family:var(--font-body);font-weight:700;font-size:15.5px;background:var(--accent);color:#fff;border:0;cursor:pointer;padding:14px 22px;border-radius:11px;transition:.18s;}
.btn-primary:hover{filter:brightness(.95);transform:translateY(-1px);}
.btn-primary[disabled]{opacity:.6;cursor:not-allowed;transform:none;filter:none;}
a.btn-primary{display:inline-block;text-decoration:none;}
.form-note{font-size:12.5px;color:var(--ink-soft);}
.form-error{font-size:12.5px;color:var(--error);background:var(--error-soft);border-radius:8px;padding:9px 12px;display:none;}
.form-error.show{display:block;}
.form-success{font-family:var(--font-display);font-size:20px;color:var(--accent);font-weight:600;max-width:430px;line-height:1.3;}
.hero form{margin:34px auto 0;}
.join form{margin-left:auto;margin-right:auto;text-align:left;}

/* generic CTA block (used where a form used to sit, now just a link to /waitlist) */
.cta-block{display:flex;flex-direction:column;align-items:center;gap:11px;max-width:430px;margin:34px auto 0;}
.join .cta-block{margin-top:26px;}

/* math */
.math{max-width:760px;margin:60px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:18px;text-align:left;}
.math .col{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:26px;}
.math .col.win{border-color:var(--accent);box-shadow:var(--shadow);}
.math h4{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);font-weight:700;margin:0 0 16px;}
.math .col.win h4{color:var(--accent);}
.math ul{margin:0;padding:0;}
.math li{list-style:none;display:flex;justify-content:space-between;gap:10px;font-size:14.5px;padding:9px 0;border-bottom:1px solid #15140f12;}
.math li:last-child{border-bottom:0;}
.math li span{color:var(--ink-soft);}
.math .big{font-family:var(--font-display);font-weight:700;font-size:30px;letter-spacing:-.02em;margin-top:8px;}
.illus{text-align:center;font-size:12px;color:var(--ink-soft);margin:16px auto 0;max-width:760px;}

/* testimonial */
.testimonial{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:36px 40px;margin:40px auto 0;max-width:720px;text-align:left;}
.testimonial-tag{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;}
.testimonial p{font-family:var(--font-display);font-weight:500;font-size:21px;line-height:1.45;color:var(--ink);margin:0;letter-spacing:-.01em;}
.testimonial footer{margin-top:22px;}
.testimonial cite{font-style:normal;font-size:14.5px;font-weight:600;color:var(--ink);display:block;}
.testimonial-meta{font-size:13px;color:var(--ink-soft);display:block;margin-top:4px;}
@media(max-width:600px){.testimonial{padding:28px 24px;}.testimonial p{font-size:18px;}}

/* chief of staff intro */
.cos-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;}
.cos h2{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.6vw,48px);line-height:1.05;letter-spacing:-.02em;margin:18px 0 0;max-width:12ch;}
.lede{font-size:18px;line-height:1.55;color:var(--ink-soft);max-width:32em;margin:20px 0 0;}
.cos-list{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:16px;}
.cos-list li{font-size:15px;line-height:1.55;color:var(--ink-soft);padding-left:22px;position:relative;}
.cos-list li::before{content:"";position:absolute;left:0;top:8px;width:9px;height:9px;border-radius:50%;background:var(--accent);}
.cos-list b{color:var(--ink);font-weight:600;}

.brief-card{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);overflow:hidden;}
.bc-head{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--line);font-weight:600;font-size:15px;}
.bc-head .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);}
.bc-head .tag{margin-left:auto;font-size:12px;color:var(--ink-soft);font-weight:500;}
.bc-row{display:flex;align-items:flex-start;gap:13px;padding:15px 20px;border-bottom:1px solid #15140f10;}
.bc-row:last-of-type{border-bottom:0;}
.bc-n{width:22px;height:22px;border-radius:7px;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:12px;display:grid;place-items:center;flex:none;margin-top:2px;}
.bc-row .meta{line-height:1.3;}
.bc-row .meta b{font-size:14.5px;font-weight:600;display:block;}
.bc-row .meta span{font-size:12.5px;color:var(--ink-soft);}
.bc-foot{padding:13px 20px;background:#15140f07;font-size:12.5px;color:var(--ink-soft);font-weight:600;}

/* product pieces */
.pieces h2{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.6vw,48px);line-height:1.05;letter-spacing:-.02em;margin:18px 0 0;max-width:12ch;}

/* animated demo panels (Brief, Loop) — full-width so the embedded 1280x720 stage stays legible */
.piece-demos{display:grid;grid-template-columns:1fr;gap:48px;margin-top:52px;}
.piece-demo{display:flex;flex-direction:column;}
.piece-demo h3{font-family:var(--font-display);font-weight:600;font-size:19px;margin:20px 0 8px;}
.piece-demo p{font-size:14px;line-height:1.5;color:var(--ink-soft);margin:0;max-width:52em;}
.stage{position:relative;width:100%;border:1px solid var(--line);border-radius:16px;background:#0c0b0a;overflow:hidden;box-shadow:var(--shadow);}
.stage-frame{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;}
/* Animations render at a fixed 1280x720 stage; scale the iframe to fit the responsive frame. */
.stage-frame iframe{position:absolute;top:0;left:0;width:1280px;height:720px;border:0;display:block;transform-origin:top left;transform:scale(var(--frame-scale,1));}

.piece-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:44px;}
.piece{display:flex;flex-direction:column;}
.piece h3{font-family:var(--font-display);font-weight:600;font-size:19px;margin:18px 0 8px;}
.piece p{font-size:14px;line-height:1.5;color:var(--ink-soft);margin:0;}
.mock-illus{font-size:11px;color:var(--ink-soft);margin:8px 0 0;}
.mock{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;font-size:12.5px;box-shadow:0 20px 40px -32px #14302250;}
.mock-head{display:flex;justify-content:space-between;align-items:baseline;font-weight:700;font-size:13px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line);}
.mock-head span{font-weight:500;color:var(--ink-soft);font-size:11px;}

.brief-mock .mock-line{display:flex;align-items:center;gap:8px;padding:6px 0;color:var(--ink-soft);}
.chk{width:14px;height:14px;border-radius:4px;border:1.5px solid var(--line);flex:none;}
.chk.on{background:var(--accent);border-color:var(--accent);}

.loop-item{padding:8px 9px;border-radius:8px;margin-bottom:6px;font-weight:600;font-size:12px;}
.loop-item.high{background:var(--amber-soft);color:var(--amber);}
.loop-item.mid{background:#15140f0a;color:var(--ink);}
.loop-item.low{background:transparent;color:var(--ink-soft);font-weight:500;}
.loop-item em{font-style:normal;text-decoration:underline;text-underline-offset:2px;}

.fin-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #15140f10;}
.fin-row:last-child{border-bottom:0;}
.fin-row span{color:var(--ink-soft);}
.fin-row.good b{color:var(--accent);}

.proj-msg{display:flex;align-items:flex-start;gap:8px;padding:6px 0;line-height:1.4;color:var(--ink-soft);}
.av{width:20px;height:20px;border-radius:6px;flex:none;display:grid;place-items:center;font-size:10px;font-weight:700;color:#fff;}
.av.you{background:var(--ink);}
.av.vendor{background:#7a6a4a;}
.av.agent{background:var(--accent);}

/* hire team */
.hires h2{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.6vw,48px);line-height:1.05;letter-spacing:-.02em;margin:18px 0 0;max-width:13ch;}
.hire-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:50px;}
.hire{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;}
.hire .role{font-weight:700;font-size:16px;}
.hire .does{font-size:13.5px;color:var(--accent);font-weight:600;margin-top:10px;}

/* faq */
.faq h2{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.6vw,48px);line-height:1.05;letter-spacing:-.02em;margin:18px 0 0;max-width:14ch;}
.faq-list{margin-top:40px;max-width:760px;}
.faq-item{border-bottom:1px solid var(--line);padding:20px 0;}
.faq-item:first-child{border-top:1px solid var(--line);}
.faq-item summary{cursor:pointer;font-weight:600;font-size:16px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";font-size:20px;color:var(--ink-soft);flex:none;}
.faq-item[open] summary::after{content:"–";}
.faq-item p{margin:14px 0 0;font-size:14.5px;line-height:1.6;color:var(--ink-soft);}

/* join */
.join{text-align:center;background:color-mix(in srgb,var(--accent) 9%,var(--paper));}
.join h2{font-family:var(--font-display);font-weight:700;font-size:clamp(34px,4.2vw,58px);line-height:1.0;letter-spacing:-.025em;max-width:16ch;margin:18px auto 0;}
.join .sub{margin:20px auto 0;}

/* waitlist page thank-you + blog cards */
.thankyou{max-width:700px;margin:0 auto;}
.latest-posts{margin-top:56px;text-align:left;}
.latest-posts h4{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);font-weight:700;margin:0 0 20px;}
.blog-date{display:block;font-size:12px;color:var(--ink-soft);}
.blog-byline{display:block;font-size:12px;color:var(--ink-soft);margin-top:2px;}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.blog-card{display:block;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;text-decoration:none;color:var(--ink);transition:.16s;}
.blog-card:hover{border-color:var(--accent);transform:translateY(-2px);}
.blog-card .blog-date{margin-bottom:0;}
.blog-card .blog-byline{margin-bottom:8px;}
.blog-card h3{font-family:var(--font-display);font-weight:600;font-size:16px;margin:0 0 8px;}
.blog-card p{font-size:13.5px;line-height:1.5;color:var(--ink-soft);margin:0;}
@media(max-width:880px){.blog-grid{grid-template-columns:1fr;}}

/* blog index + post pages */
.blog-index h1{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.6vw,48px);line-height:1.05;letter-spacing:-.02em;margin:18px 0 0;max-width:12ch;}
.blog-index .lede{margin-bottom:0;}
.blog-index .blog-grid{margin-top:52px;grid-template-columns:repeat(3,1fr);}
.post-wrap{max-width:680px;}
.back-link{display:inline-block;font-size:13.5px;font-weight:600;color:var(--ink-soft);text-decoration:none;margin-bottom:28px;}
.back-link:hover{color:var(--ink);}
.post-wrap .blog-date{margin-bottom:4px;}
.post-title{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,4vw,46px);line-height:1.1;letter-spacing:-.02em;margin-top:10px;}
.post-body{margin-top:32px;font-size:16.5px;line-height:1.7;color:var(--ink-soft);}
.post-body h2{font-family:var(--font-display);color:var(--ink);font-size:24px;margin:32px 0 12px;}
.post-body p{margin:0 0 18px;}
.post-body ul{margin:0 0 18px;padding-left:22px;}

@media(max-width:960px){
  .hire-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:880px){
  .math,.cos-grid{grid-template-columns:1fr;}
  .cos-grid .brief-card{order:-1;}
}
@media(max-width:600px){
  .piece-grid,.hire-grid,.blog-index .blog-grid{grid-template-columns:1fr;}
}

/* footer */
.foot{border-top:1px solid var(--line);padding:46px 0;}
.foot .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;}
.foot .brand{font-size:20px;}
.foot small{color:var(--ink-soft);font-size:13px;}