/* plentiful.money — site styles.
   Built on the Claude Design tokens in tokens.css. Rules from the system that
   shape everything here: paper ground, at most two more field colours per
   page, no gradients, no shadows, hairlines in stone, pills for buttons,
   paper text never sits on gold or purple. */

/* ---- Base (from _design-system/tokens/base.css) ------------------------- */
html{-webkit-text-size-adjust:100%}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-text);font-size:var(--size-body);line-height:var(--lh-body);font-weight:var(--weight-regular);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--weight-regular);margin:0;letter-spacing:-.005em;text-wrap:balance}
h1{font-size:var(--size-display-1);line-height:var(--lh-display-1)}
h2{font-size:var(--size-display-2);line-height:var(--lh-display-2)}
h3{font-size:var(--size-headline);line-height:var(--lh-headline)}
h4{font-size:var(--size-subhead);line-height:var(--lh-subhead)}
p{margin:0 0 var(--space-4)}
a{color:var(--text-link);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;text-decoration-color:var(--plentiful-gold);transition:color var(--duration-base) var(--ease-standard),text-decoration-color var(--duration-base) var(--ease-standard)}
a:hover{color:var(--text-link-hover);text-decoration-color:var(--plentiful-purple)}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent-purple);outline-offset:3px}
strong,b{font-weight:var(--weight-semibold)}
::selection{background:var(--plentiful-gold-tint);color:var(--plentiful-ink)}
img{max-width:100%;height:auto;display:block}

/* ---- Layout -------------------------------------------------------------- */
.wrap{width:100%;max-width:1320px;margin:0 auto;padding:0 22px}
@media (min-width:760px){.wrap{padding:0 48px}}
@media (min-width:1100px){.wrap{padding:0 96px;max-width:1512px}}
.section{padding:var(--space-9) 0}
@media (min-width:1100px){.section{padding:var(--space-10) 0}}
.skip{position:absolute;left:-9999px}
.skip:focus{left:22px;top:12px;z-index:10;background:var(--plentiful-ink);color:var(--plentiful-paper);padding:10px 16px;border-radius:var(--radius-pill)}

/* ---- Type helpers -------------------------------------------------------- */
.label{font-family:var(--font-text);font-weight:600;font-size:var(--size-label);letter-spacing:var(--tracking-label);text-transform:uppercase;line-height:1.4;color:var(--plentiful-ink-70);margin:0 0 var(--space-5)}
.label--purple{color:var(--plentiful-purple-deep)}
.label--gold{color:var(--plentiful-gold-deep)}
.lede{font-size:var(--size-lede);line-height:var(--lh-lede);color:var(--plentiful-ink-70);max-width:34em}
.poster{font-size:var(--size-poster);line-height:var(--lh-poster);letter-spacing:var(--tracking-poster)}
.mark-gold{box-shadow:inset 0 -.32em 0 var(--plentiful-gold)}
.mark-purple{box-shadow:inset 0 -.32em 0 var(--plentiful-purple-tint)}
.hand{font-family:var(--font-hand);font-size:var(--size-hand);line-height:var(--lh-hand);color:var(--plentiful-purple-deep)}
em{font-style:italic}

/* ---- Buttons ------------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--font-text);font-weight:500;font-size:15px;line-height:1;padding:14px 26px;border:1px solid transparent;border-radius:var(--radius-pill);text-decoration:none;cursor:pointer;transition:background-color var(--duration-base) var(--ease-standard),color var(--duration-base) var(--ease-standard),border-color var(--duration-base) var(--ease-standard),transform var(--duration-fast) var(--ease-standard)}
.btn:active{transform:translateY(1px)}
.btn--lg{font-size:16px;padding:17px 32px}
.btn--sm{font-size:14px;padding:11px 20px}
.btn--primary{background:var(--plentiful-ink);color:var(--plentiful-paper)}
.btn--primary:hover{background:var(--plentiful-purple-deep);color:var(--plentiful-paper)}
.btn--outline{background:transparent;color:var(--plentiful-ink);border-color:rgba(28,22,32,.28)}
.btn--outline:hover{background:var(--plentiful-ink);border-color:var(--plentiful-ink);color:var(--plentiful-paper)}
.btn--inverse{background:var(--plentiful-paper);color:var(--plentiful-ink)}
.btn--inverse:hover{background:var(--plentiful-gold);color:var(--plentiful-ink)}
.btn .arr{display:inline-block;transition:transform var(--duration-base) var(--ease-standard)}
.btn:hover .arr,.door:hover .arr{transform:translateX(3px)}
.arr{font-family:var(--font-text)}

/* ---- Header -------------------------------------------------------------- */
.site-head{border-bottom:1px solid var(--rule-hairline);background:var(--plentiful-paper)}
.site-head__in{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);min-height:76px}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--plentiful-ink)}
.brand img{width:36px;height:36px}
.brand__word{font-family:var(--font-display);font-size:30px;line-height:1;letter-spacing:-.012em;background:linear-gradient(var(--plentiful-gold),var(--plentiful-gold)) no-repeat 0 .86em/100% .18em}
.nav{display:none;align-items:center;gap:var(--space-6)}
.nav a{font-weight:500;font-size:15px;text-decoration:none;box-shadow:inset 0 -1.5px 0 transparent;padding:6px 0;transition:color var(--duration-base) var(--ease-standard),box-shadow var(--duration-base) var(--ease-standard)}
.nav a:hover,.nav a[aria-current=page]{color:var(--plentiful-purple-deep);box-shadow:inset 0 -1.5px 0 var(--plentiful-gold)}
.nav a.btn{padding:11px 20px;box-shadow:none;color:var(--plentiful-paper)}
@media (min-width:900px){.nav{display:flex}.nav-m{display:none}}
/* Mobile nav: a no-JS disclosure. */
.nav-m{position:relative}
.nav-m summary{list-style:none;cursor:pointer;font-weight:500;font-size:15px;padding:10px 18px;border:1px solid rgba(28,22,32,.28);border-radius:var(--radius-pill)}
.nav-m summary::-webkit-details-marker{display:none}
.nav-m[open] summary{background:var(--plentiful-ink);color:var(--plentiful-paper)}
.nav-m__list{position:absolute;right:0;top:calc(100% + 10px);z-index:5;background:var(--plentiful-white);border:1px solid var(--rule-hairline);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-5);min-width:240px;display:grid;gap:2px}
.nav-m__list a{display:block;padding:12px 0;text-decoration:none;font-weight:500;border-bottom:1px solid var(--rule-hairline)}
.nav-m__list a:last-child{border-bottom:0}

/* ---- Doors: the B2C / B2B split ------------------------------------------ */
.doors{display:grid;gap:var(--space-4)}
@media (min-width:820px){.doors{grid-template-columns:1fr 1fr;gap:var(--space-5)}}
.door{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:320px;padding:var(--space-6);border-radius:var(--radius-lg);text-decoration:none;color:var(--plentiful-ink);transition:background-color var(--duration-slow) var(--ease-standard),color var(--duration-slow) var(--ease-standard)}
@media (min-width:1100px){.door{padding:var(--space-7);min-height:400px}}
.door__title{font-family:var(--font-display);font-size:clamp(40px,5vw,68px);line-height:1.02;letter-spacing:-.008em;display:block;margin:var(--space-4) 0 var(--space-5)}
.door__body{display:block;font-size:17px;line-height:1.6;max-width:30em}
.door__go{display:inline-flex;align-items:center;gap:10px;margin-top:var(--space-6);font-weight:500;font-size:16px}
.door__go span:first-child{box-shadow:inset 0 -1.5px 0 currentColor}
.door--gold{background:var(--plentiful-gold)}
.door--gold:hover{background:#ffc53a;color:var(--plentiful-ink)}
.door--gold .label{color:var(--plentiful-ink)}
.door--aub{background:var(--plentiful-aubergine);color:var(--plentiful-paper)}
.door--aub:hover{background:var(--plentiful-ink);color:var(--plentiful-paper)}
.door--aub .label{color:var(--plentiful-gold)}
.door--goldtint{background:var(--plentiful-gold-tint)}
.door--goldtint:hover{background:var(--plentiful-gold);color:var(--plentiful-ink)}
.door--purpletint{background:var(--plentiful-purple-tint)}
.door--purpletint:hover{background:#e4cffa;color:var(--plentiful-ink)}
.door--goldtint .label,.door--purpletint .label{color:var(--plentiful-ink-70)}

/* ---- Manifesto ------------------------------------------------------------ */
.manifesto h2{font-size:clamp(40px,6vw,88px);line-height:1.03;max-width:14em}
.verbs{display:grid;gap:0;margin-top:var(--space-8);border-top:2px solid var(--plentiful-ink)}
@media (min-width:820px){.verbs{grid-template-columns:repeat(3,1fr)}}
.verb{padding:var(--space-6) 0;border-bottom:1px solid var(--rule-hairline)}
@media (min-width:820px){.verb{padding:var(--space-6) var(--space-6) 0 0;border-bottom:0}.verb+.verb{padding-left:var(--space-6);border-left:1px solid var(--rule-hairline)}}
.verb h3{font-size:var(--size-headline);margin-bottom:var(--space-3)}
.verb p{color:var(--plentiful-ink-70);margin:0;max-width:26em}

/* ---- Offer rows ------------------------------------------------------------ */
.split{display:grid;gap:var(--space-7)}
@media (min-width:980px){.split{grid-template-columns:5fr 7fr;gap:var(--space-9)}}
.rows{border-top:2px solid var(--plentiful-ink)}
.row{display:grid;gap:6px var(--space-6);padding:var(--space-5) 0;border-bottom:1px solid var(--rule-hairline);text-decoration:none;color:inherit}
@media (min-width:640px){.row{grid-template-columns:1fr auto;align-items:baseline}}
.row h3{font-size:clamp(28px,3vw,40px);transition:color var(--duration-base) var(--ease-standard)}
a.row:hover h3{color:var(--plentiful-purple-deep)}
.row p{grid-column:1;margin:0;color:var(--plentiful-ink-70);max-width:34em}
.row .meta{font-weight:600;font-size:var(--size-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--plentiful-ink-70);white-space:nowrap}
.on-dark .rows{border-top-color:var(--plentiful-paper)}
.on-dark .row{border-bottom-color:rgba(250,247,242,.18)}
.on-dark .row p,.on-dark .lede{color:rgba(250,247,242,.78)}
.on-dark .row .meta,.on-dark .label{color:var(--plentiful-gold)}
.on-dark a.row:hover h3{color:var(--plentiful-gold)}
.on-dark{background:var(--plentiful-aubergine);color:var(--plentiful-paper)}
.on-dark a{color:var(--plentiful-paper)}
.actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}

/* ---- Founders -------------------------------------------------------------- */
.founders{display:grid;gap:var(--space-7);align-items:end}
@media (min-width:980px){.founders{grid-template-columns:6fr 6fr;gap:var(--space-9)}}
.founders__photo{background:var(--plentiful-gold);border-radius:var(--radius-lg);overflow:hidden;padding:var(--space-6) var(--space-5) 0}
.founders__photo img{width:100%}
.founders__text{padding-bottom:var(--space-5)}
.founders__text h2{margin-bottom:var(--space-5)}
.sigs{display:flex;gap:var(--space-6);margin-top:var(--space-5)}

/* ---- Subscribe band --------------------------------------------------------- */
.sub{background:var(--plentiful-gold)}
.sub__in{display:grid;gap:var(--space-6);align-items:end}
@media (min-width:980px){.sub__in{grid-template-columns:8fr 4fr}}
.sub h2{font-size:clamp(36px,5vw,72px);line-height:1.04;max-width:16em}
.sub .label{color:var(--plentiful-ink)}
.sub__cta p{font-size:var(--size-body-sm);margin:var(--space-4) 0 0;color:var(--plentiful-ink)}

/* ---- Footer ------------------------------------------------------------------ */
.site-foot{padding:var(--space-8) 0 var(--space-7);border-top:1px solid var(--rule-hairline);font-size:var(--size-body-sm);line-height:var(--lh-body-sm)}
.site-foot__in{display:grid;gap:var(--space-6)}
@media (min-width:820px){.site-foot__in{grid-template-columns:5fr 3fr 3fr}}
.site-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.site-foot p{color:var(--plentiful-ink-70);max-width:32em}
.legal{margin-top:var(--space-7);padding-top:var(--space-5);border-top:1px solid var(--rule-hairline);color:var(--plentiful-ink-70);font-size:var(--size-caption)}

/* ---- Staging-only review bar --------------------------------------------------- */
.review{background:var(--plentiful-ink);color:var(--plentiful-paper);font-size:13px;line-height:1.4}
.review .wrap{display:flex;flex-wrap:wrap;gap:6px 20px;align-items:center;padding-top:9px;padding-bottom:9px}
.review a{color:var(--plentiful-paper)}
.review strong{color:var(--plentiful-gold);font-weight:600}

/* ---- Small utilities (no inline styles anywhere: the CSP forbids them) ---------- */
.section--flush{padding-top:0}
.lede--gap{margin-top:var(--space-5)}
.foot-tag{margin-top:var(--space-4)}
.btn--outline-inv{background:transparent;color:var(--plentiful-paper);border-color:rgba(250,247,242,.4)}
.btn--outline-inv:hover{background:var(--plentiful-paper);color:var(--plentiful-ink)}
.on-dark a.btn--inverse,.on-dark a.btn--inverse:hover{color:var(--plentiful-ink)}
