/* Collective.Golf — shared components for /collectives and /venture
   Layers on top of styles.css (same tokens + Barlow Condensed system). */

/* header brand emblem (ball-on-tee mark) */
.brand{display:inline-flex;align-items:center;gap:9px}
.brand-mark{height:26px;width:auto;display:block}
@media(max-width:800px){.brand-mark{height:22px}}

/* sub-page hero (no photo; typographic) */
.subhero{background:var(--ink);color:var(--bone);padding:11vw 3vw 8vw;position:relative;overflow:hidden}
.subhero::after{content:"寸";position:absolute;right:-2vw;bottom:-6vw;font:700 42vw serif;color:rgba(234,255,50,.05);pointer-events:none;line-height:1}
.subhero .kicker{color:var(--yellow);display:block;margin-bottom:18px}
.subhero h1{font:900 clamp(58px,13vw,210px)/.8 'Barlow Condensed',sans-serif;letter-spacing:-.05em;margin:0 0 26px;text-transform:uppercase;position:relative}
.subhero .lead{max-width:780px;font-size:clamp(18px,2vw,25px);line-height:1.5;color:#dcdcd2;position:relative}
.subhero .actions{margin-top:36px;position:relative}
.subhero .backlink{position:absolute;top:5vw;left:3vw;font:700 12px 'Barlow Condensed';letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.subhero .backlink:hover{color:var(--yellow)}

/* sequence / flow rail (expansion, journey, how-it-works) */
.flow{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:6vw 3vw}
.flow.on-ink{background:var(--ink);color:var(--bone)} .flow.on-green{background:var(--green);color:var(--bone)}
.flow .step{border:1px solid rgba(233,225,209,.35);padding:12px 18px;font:700 clamp(15px,2.2vw,26px) 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.02em}
.flow .step.hot{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}
.flow .arrow{color:var(--yellow);font:700 clamp(16px,2.4vw,28px) 'Barlow Condensed';opacity:.8}

/* generic content block */
.block{padding:8vw 3vw}
.block.bone{background:var(--bone);color:var(--ink)}
.block.stone{background:#c5bdaf;color:var(--ink)}
.block.ink{background:var(--ink);color:var(--bone)}
.block.green{background:var(--green);color:var(--bone)}
.block .kicker{display:block;margin-bottom:2.4vw}
.block h2{font:800 clamp(42px,7vw,120px)/.85 'Barlow Condensed',sans-serif;letter-spacing:-.04em;margin:0 0 3vw;text-transform:uppercase}
.block .lead{max-width:820px;font-size:19px;line-height:1.6}
.block .lead + .lead{margin-top:18px}

/* poetic stacked lines ("what members bring") */
.lines{max-width:860px;margin-top:1vw;font:600 clamp(19px,2.4vw,30px)/1.5 'Barlow Condensed',sans-serif}
.lines p{margin:0 0 4px}
.lines .cap{color:var(--yellow)}
.block.bone .lines .cap,.block.stone .lines .cap{color:var(--green)}

/* the six collectives — card grid */
.colgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--ink);border:2px solid var(--ink);margin-top:3vw}
.colgrid article{background:var(--bone);color:var(--ink);padding:26px 22px 30px;display:flex;flex-direction:column;min-height:250px}
.colgrid article .n{font:600 12px 'Barlow Condensed';letter-spacing:.16em;color:var(--green)}
.colgrid article h3{font:800 30px/.98 'Barlow Condensed';margin:16px 0 12px;text-transform:uppercase}
.colgrid article p{line-height:1.5;margin:0}
.colgrid article .sep{margin-top:auto;padding-top:16px;font:700 11px 'Barlow Condensed';letter-spacing:.12em;color:var(--green);text-transform:uppercase}
.colgrid article.spotlight{background:var(--green);color:var(--bone)}
.colgrid article.spotlight .n,.colgrid article.spotlight .sep{color:var(--yellow)}

/* two connected member profiles */
.profiles{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--ink);border:2px solid var(--ink);margin-top:3vw}
.profiles section{background:var(--bone);color:var(--ink);padding:30px 28px 34px}
.profiles .sub{font:600 12px 'Barlow Condensed';letter-spacing:.14em;color:var(--green);text-transform:uppercase}
.profiles h3{font:800 40px/.95 'Barlow Condensed';margin:8px 0 18px;text-transform:uppercase}
.profiles ul{list-style:none;padding:0;margin:0}
.profiles li{padding:11px 0;border-bottom:1px solid var(--line);font:600 15px/1.3 Inter,Arial,sans-serif}
.profiles li:last-child{border-bottom:0}

/* member labels */
.labels{display:flex;flex-wrap:wrap;gap:8px;margin-top:2vw}
.labels span{border:1px solid currentColor;padding:11px 15px;font:700 13px 'Barlow Condensed';letter-spacing:.06em;text-transform:uppercase}
.labels span.key{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}

/* recognition bullets */
.bullets{list-style:none;padding:0;margin:2vw 0 0;max-width:960px;columns:2;column-gap:44px}
.bullets li{padding:10px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.4;break-inside:avoid}
.block.green .bullets li,.block.ink .bullets li{border-color:rgba(233,225,209,.2)}

/* prominent legal disclosure */
.disclosure{border:2px solid var(--yellow);background:rgba(234,255,50,.07);padding:32px 30px;margin-top:3vw;max-width:900px}
.disclosure .tag{font:700 12px 'Barlow Condensed';letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);display:block;margin-bottom:12px}
.disclosure p{font-size:17px;line-height:1.6;margin:0}

/* who participates / offers-style 5-up reuse via .offers already in styles.css */
.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:currentColor;border:2px solid;margin-top:3vw}
.roles article{background:var(--bone);color:var(--ink);padding:24px 22px 30px}
.roles h3{font:800 26px/1 'Barlow Condensed';margin:0 0 8px;text-transform:uppercase}
.roles p{line-height:1.5;margin:0}

/* big closing statement line */
.statement{padding:9vw 3vw;text-align:center}
.statement.ink{background:var(--ink);color:var(--bone)} .statement.green{background:var(--green);color:var(--bone)}
.statement p{font:900 clamp(30px,5vw,74px)/1 'Barlow Condensed',sans-serif;letter-spacing:-.03em;text-transform:uppercase;margin:0 auto;max-width:16ch}
.statement p .y{color:var(--yellow)}
.statement .actions{justify-content:center;margin-top:4vw;display:flex;flex-wrap:wrap;gap:8px}

@media(max-width:800px){
  .subhero{padding:22vw 18px 14vw}
  .subhero .backlink{top:11vw;left:18px}
  .block{padding:70px 18px}
  .flow{padding:44px 18px}
  .colgrid,.profiles,.roles{grid-template-columns:1fr}
  .bullets{columns:1}
}
