/* Homepage. Loaded after base.css. */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:200px 200px}

/* ---------- hero ---------- */
.hero{padding:clamp(52px,7vw,92px) 0 clamp(44px,5vw,72px);border-top:0;position:relative;overflow:clip}
.hero h1{font-size:clamp(40px,6.6vw,88px);max-width:13em;margin:22px 0 0}
.hero .sub{font-size:clamp(18px,2vw,23px);max-width:34em;margin-top:22px;line-height:1.45;color:var(--cream)}
.looking{margin-top:26px;font-family:var(--mono);font-size:13px;line-height:1.75;letter-spacing:.02em;color:var(--accent);max-width:44em;border-left:2px solid var(--accent);padding-left:16px}
.honest{margin-top:22px;font-size:16px;line-height:1.7;color:var(--muted);max-width:44em}
.honest a{color:var(--cream);border-bottom:1px solid var(--rule);white-space:nowrap}
.honest a:hover{border-color:var(--accent)}
.micro{margin-top:20px;font-family:var(--mono);font-size:12.5px;color:var(--muted);letter-spacing:.02em;line-height:1.9}
.micro a{border-bottom:1px solid var(--rule)}
.micro a:hover{color:var(--cream);border-color:var(--accent)}
.videonote{margin-top:24px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.stage{position:relative;max-width:900px;margin:38px 0 0}
.frame{position:relative;aspect-ratio:16/9;background:var(--well);border:1px solid var(--rule);border-radius:12px;overflow:hidden}
.frame iframe,.frame video{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.poster{position:absolute;inset:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:radial-gradient(90% 90% at 50% 35%,#134750 0%,var(--well) 65%);border:0;color:var(--cream);text-align:center;padding:20px;font-family:inherit;cursor:pointer}
.poster:focus-visible{outline:2px solid var(--accent);outline-offset:-6px}
.play{width:70px;height:70px;flex:none;border-radius:50%;background:var(--accent);display:grid;place-items:center}
.play svg{width:26px;height:26px;margin-left:4px;fill:var(--ink)}
.poster .ptitle{font-family:var(--serif);font-size:clamp(22px,3.4vw,34px);line-height:1.1}
.poster .plabel{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* ---------- proof strip ---------- */
.proof{padding-top:clamp(40px,5vw,60px);padding-bottom:clamp(40px,5vw,60px)}
.nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:26px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.nums>div{padding:28px 0;min-width:0}
.nums>div+div{border-left:1px solid var(--rule);padding-left:24px}
.nums b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(38px,5.2vw,70px);line-height:1;letter-spacing:-.03em;}
.nums .cap{display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--muted);margin-top:12px;line-height:1.55}
@media(max-width:900px){.nums{grid-template-columns:1fr 1fr;gap:0}.nums>div{padding:22px 0}.nums>div:nth-child(2n+1){padding-right:14px}.nums>div:nth-child(2n){border-left:1px solid var(--rule);padding-left:18px}.nums>div:nth-child(odd){border-left:0;padding-left:0}.nums>div:nth-child(n+3){border-top:1px solid var(--rule)}}
.stripnote{font-family:var(--mono);font-size:11.5px;color:var(--muted);margin-top:14px;letter-spacing:.03em}
.stripfoot{margin-top:14px;font-size:15.5px;color:var(--muted);max-width:52em;line-height:1.65}

/* ---------- brands ---------- */
.brandrow{border-top:1px solid var(--rule);padding:22px 0;display:grid;grid-template-columns:200px minmax(0,1fr);gap:8px 28px;align-items:baseline}
@media(max-width:700px){.brandrow{grid-template-columns:1fr;gap:8px}}
.brandrow .lab{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.brandrow .list{font-size:18px;line-height:1.6;color:var(--cream)}
.brandrow .sublist{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--muted);margin-top:8px;line-height:1.7}
.brandcap{margin-top:26px;font-size:16.5px;color:var(--muted);max-width:48em;line-height:1.65}

/* ---------- what I own ---------- */
.owns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 48px;margin-top:40px}
@media(max-width:820px){.owns{grid-template-columns:1fr;gap:26px}}
.own{border-top:1px solid var(--rule);padding-top:20px;min-width:0}
.own h3{font-size:28px;margin-bottom:10px}
.own .stance{font-style:italic;color:var(--accent);font-size:16.5px;display:block;margin-bottom:8px;font-family:var(--serif);letter-spacing:.005em}
.own p{font-size:16px;color:var(--cream);opacity:.92;line-height:1.65}
.ownpair{margin-top:40px;display:grid;gap:14px;border-top:2px solid var(--accent);padding-top:24px}
.ownpair div{font-size:16px;line-height:1.65;color:var(--muted)}
.ownpair b{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:4px;font-weight:500}

/* ---------- selected work ---------- */
.worknote{margin-top:34px;border-left:2px solid var(--accent);padding:4px 0 4px 18px;max-width:46em}
.worknote b{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:8px;font-weight:500}
.worknote p{font-size:16px;color:var(--muted);line-height:1.65}
.cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:34px}
@media(max-width:820px){.cases{grid-template-columns:1fr}}
.case{display:block;background:transparent;border:1px solid var(--edge);border-radius:8px;padding:26px 24px 24px;transition:background .18s ease,border-color .18s ease;min-width:0}
.case:hover{background:var(--well);border-color:var(--accent)}
.case .ctx{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);line-height:1.6}
.case .n{font-family:var(--serif);font-size:clamp(42px,5vw,60px);line-height:1;letter-spacing:-.03em;margin-top:14px;}
.case .nl{font-family:var(--mono);font-size:11.5px;color:var(--muted);margin-top:8px;letter-spacing:.03em;line-height:1.55}
.case .brand{font-size:19px;font-weight:600;margin-top:18px;padding-top:16px;border-top:1px solid var(--rule)}
.case .mech{font-size:15.5px;color:var(--muted);margin-top:8px;line-height:1.6}
.case .more{margin-top:14px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.worksalso{margin-top:26px;font-family:var(--mono);font-size:12px;color:var(--muted);line-height:1.8;letter-spacing:.02em}

/* ---------- how I operate ---------- */
.ops{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 48px;margin-top:40px}
@media(max-width:820px){.ops{grid-template-columns:1fr;gap:22px}}
.op{border-top:1px solid var(--rule);padding-top:20px;min-width:0}
.op h3{font-size:27px;margin-bottom:10px}
.op p{font-size:16px;color:var(--cream);opacity:.92;line-height:1.65}

/* ---------- recommendations ---------- */
.recs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:38px}
@media(max-width:920px){.recs{grid-template-columns:1fr}}
.rec{background:transparent;border:1px solid var(--edge);border-radius:8px;padding:28px 24px 24px;min-width:0;display:flex;flex-direction:column}
.rec blockquote p{font-family:var(--serif);font-size:clamp(20px,2vw,25px);line-height:1.28;letter-spacing:-.01em;text-wrap:pretty}
.rec figcaption{margin-top:auto;padding-top:22px}
.rec .rel{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:10px;font-weight:500}
.rec .who{font-size:16px;font-weight:600;color:var(--cream)}
.rec .role{font-family:var(--mono);font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.6}
.rec .also{font-family:var(--mono);font-size:11.5px;color:var(--muted);margin-top:14px;padding-top:14px;border-top:1px solid var(--rule);line-height:1.65}
.recsfoot{margin-top:28px;font-size:16.5px;color:var(--muted);max-width:46em;line-height:1.65}
.recsfoot a{color:var(--cream);border-bottom:1px solid var(--rule);white-space:nowrap}
.recsfoot a:hover{border-color:var(--accent)}

/* ---------- Q&A ---------- */
.qa{margin-top:38px;display:grid;gap:34px;max-width:50em}
.q{border-top:1px solid var(--rule);padding-top:22px}
.q .ql{font-family:var(--mono);font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);margin-bottom:14px;line-height:1.6}
.q p{font-size:17px;line-height:1.7;color:var(--cream);opacity:.95}
.qafoot{margin-top:30px;font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);line-height:1.8}

/* ---------- 90 days ---------- */
.phases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:38px}
@media(max-width:900px){.phases{grid-template-columns:1fr}}
.phase{border-top:2px solid var(--accent);padding-top:20px;min-width:0}
.phase .pl{font-family:var(--mono);font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--accent);line-height:1.65;margin-bottom:12px;font-weight:500}
.phase p{font-size:15.5px;line-height:1.65;color:var(--cream);opacity:.92}
.phasecav{margin-top:30px;font-size:16px;color:var(--muted);max-width:50em;line-height:1.65}

/* ---------- calculator cta ---------- */
.calc{background:var(--well)}
.calc p{font-size:17px;line-height:1.7;color:var(--cream);opacity:.93;max-width:44em;margin-top:18px}
.calccap{margin-top:20px;font-size:15.5px;color:var(--muted);max-width:44em;line-height:1.65}
.calccap2{margin-top:8px;font-family:var(--mono);font-size:11.5px;color:var(--muted);letter-spacing:.03em}

/* ---------- looking for ---------- */
.rows{margin-top:36px;border-top:1px solid var(--rule)}
.row{display:grid;grid-template-columns:160px minmax(0,1fr);gap:8px 28px;padding:20px 0;border-bottom:1px solid var(--rule);align-items:baseline}
@media(max-width:700px){.row{grid-template-columns:1fr;gap:6px}}
.row dt{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);font-weight:500}
.row dd{font-size:17px;line-height:1.6;color:var(--cream)}
.row dd a{border-bottom:1px solid var(--rule)}
.row dd a:hover{border-color:var(--accent)}
.lookfoot{margin-top:26px;font-size:16.5px;color:var(--muted);max-width:44em;line-height:1.65}