/* Gaurav Joshi - shared design system. Tokens locked in Handover 1, section 5. */
:root{--paper:#F1EEE6;--paper-2:#FBFAF6;--ink:#211A2B;--ink-soft:#6A6076;--line:#E1DCD0;--rule:#D2CCC0;--plum:#2A1740;--plum-deep:#180B29;--spruce:#2E6F63;--ochre:#C69A4C;--cream:#F3ECDF;--lilac:#ECE7F1;
--disp:"Fraunces",Charter,Georgia,serif;--sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;--maxw:1020px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:104px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;padding-bottom:env(safe-area-inset-bottom,0px)}
h1,h2,h3{font-family:var(--disp);font-weight:600;line-height:1.08;margin:0;letter-spacing:-.01em}
a{color:var(--spruce);text-decoration:none}a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--spruce);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
.eyebrow{font-size:14.5px;font-weight:700;color:var(--spruce);margin-bottom:14px}
.brand{display:flex;align-items:center;gap:12px;color:var(--ink)}.brand:hover{text-decoration:none}
.owl{flex:none}

/* review banner (remove before go-live) */
.note{background:var(--plum-deep);color:#E7DCF1;font-size:12.5px;text-align:center;padding:9px 16px}.note b{color:var(--ochre)}
body.review [data-check]::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ochre);margin-left:6px;vertical-align:super}

/* nav + freeze-pane tabs */
header.nav{position:sticky;top:0;z-index:40;background:rgba(241,238,230,.94);backdrop-filter:saturate(140%) blur(9px);-webkit-backdrop-filter:saturate(140%) blur(9px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:56px}
.nav .brand{gap:9px}.nav .owl{width:26px;height:26px}.nav .name{font-family:var(--disp);font-size:20px;font-weight:700}
.nav .links{display:flex;gap:18px}.nav .links a{font-size:13.5px;color:var(--ink-soft);font-weight:500}.nav .links a.on{color:var(--ink);font-weight:600}
.nav .links a.soon{opacity:.45;pointer-events:none}
.menu-btn{display:none;background:none;border:1px solid var(--rule);border-radius:8px;padding:6px 11px;font:600 13px var(--sans);color:var(--ink);cursor:pointer}
@media(max-width:700px){.menu-btn{display:block}.nav .links{display:none;position:absolute;top:56px;left:0;right:0;flex-direction:column;gap:0;background:var(--paper-2);border-bottom:1px solid var(--line)}.nav.open .links{display:flex}.nav .links a{padding:13px 22px;border-top:1px solid var(--line);font-size:15px}}
.tabbar{position:sticky;top:calc(56px + env(safe-area-inset-top,0px));z-index:39;background:var(--plum-deep)}.tabbar .wrap{display:flex}
.tab{flex:1;text-align:center;padding:12px 6px;font:600 13px var(--sans);color:#B3A4C6;background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:.15s}
.tab.on{color:#fff;border-bottom-color:var(--ochre)}
@media(max-width:420px){.tab{font-size:11.5px;padding:11px 4px}}

/* sections */
section{padding:56px 0;border-top:1px solid var(--line)}
.head{font-family:var(--disp);font-weight:600;font-size:clamp(23px,3.4vw,32px);max-width:24ch;margin-bottom:8px}
.sub{font-size:14.5px;color:var(--ink-soft);max-width:58ch;margin:0 0 22px}

/* dark opening band */
.open{background:var(--plum-deep);color:var(--cream);border-top:none;padding:52px 0 50px}.open .eyebrow{color:#C6A9E4}
.open .dgwrap{max-width:600px;margin:6px 0 4px}.open .dgwrap.wide{max-width:760px}
.open .dgwrap img{width:100%;height:auto;display:block}
.open .line{font-family:var(--disp);font-weight:500;font-size:clamp(26px,4.8vw,44px);line-height:1.12;max-width:20ch;color:#F6F1E8}
.open .belief{font-family:var(--disp);font-style:italic;font-weight:400;font-size:clamp(16px,2.3vw,21px);line-height:1.4;color:#CBB9DE;margin:20px 0 0;max-width:44ch}
.open-enter{opacity:0;animation:rise .75s cubic-bezier(.2,.7,.2,1) .06s forwards}
@keyframes rise{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}

/* overview pieces */
.ssscard{background:var(--paper-2);border:1px solid var(--line);border-radius:16px;padding:26px 24px 20px}
.ssscard img{width:100%;max-width:560px;height:auto;display:block;margin:0 auto}
.sss-cap{font-size:12.5px;color:var(--ink-soft);text-align:center;margin-top:14px}.sss-cap b{color:var(--spruce)}
.pillars,.ledger{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper-2);margin-top:8px}
.pill{padding:22px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:8px 22px;align-items:start}.pill:last-child{border-bottom:none}
.pill .claim{font-family:var(--disp);font-weight:600;font-size:clamp(18px,2.5vw,23px);max-width:30ch}
.pill .ev{font-size:13.5px;color:var(--ink-soft);line-height:1.55;grid-column:1;max-width:58ch}
.pill .metric{grid-row:1 / span 2;grid-column:2;font-family:var(--disp);font-weight:700;font-size:clamp(18px,2.7vw,25px);color:var(--spruce);text-align:right;white-space:nowrap}
@media(max-width:560px){.pill{grid-template-columns:1fr}.pill .metric{grid-row:auto;grid-column:1;text-align:left;font-size:22px}}
.beat{display:block;width:fit-content;font:600 11.5px var(--sans);color:var(--plum);background:var(--lilac);border-radius:20px;padding:2px 9px;margin-bottom:8px}

/* testimonial */
.qsec{background:var(--lilac)}
.tcard{background:var(--paper-2);border:1px solid var(--rule);border-radius:16px;padding:30px 28px 26px;max-width:660px;box-shadow:0 20px 40px -34px rgba(42,23,64,.5)}
.tcard .qm{font-family:var(--disp);font-weight:700;font-size:60px;line-height:.6;color:var(--ochre);display:block;height:26px}
.tcard .qbig{font-family:var(--disp);font-size:clamp(19px,2.7vw,26px);line-height:1.3;max-width:26ch;margin-top:8px}
.tcard .qbig .mk{color:var(--spruce)}.tcard .qwho{font-size:13px;color:var(--ink-soft);margin-top:18px}.tcard .qwho b{color:var(--ink);font-weight:600}

/* AI on the job */
.aisec{background:var(--lilac)}
.ai-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:16px}
@media(max-width:760px){.ai-grid{grid-template-columns:1fr}}
.ai-item{background:var(--paper-2);border:1px solid var(--rule);border-radius:14px;padding:22px}
.ai-item .metric{font-family:var(--disp);font-weight:700;font-size:26px;color:var(--spruce);line-height:1.1}
.ai-item h3{font-size:19px;margin:8px 0 6px}
.ai-item p{font-size:13.5px;color:var(--ink-soft);margin:0;line-height:1.55}
.ai-side{display:flex;flex-direction:column;gap:16px}
.solo{margin-top:22px;font-size:14.5px;max-width:70ch}.solo b{font-weight:600}

/* collapsibles: journey + skill map */
details.fold{background:var(--paper-2);border:1px solid var(--line);border-radius:14px}
details.fold>summary{list-style:none;cursor:pointer;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary .h{font-family:var(--disp);font-weight:600;font-size:clamp(20px,2.8vw,26px)}
details.fold>summary .hint{font-size:13px;color:var(--ink-soft);margin-top:2px}
details.fold>summary .tog{flex:none;font:600 13px var(--sans);color:var(--spruce);border:1px solid var(--rule);border-radius:20px;padding:5px 13px;white-space:nowrap}
details.fold[open]>summary .tog .a{display:none}details.fold:not([open])>summary .tog .b{display:none}
.fold-body{padding:0 22px 24px;border-top:1px solid var(--line)}

/* journey strip (visible collapsed) + stops */
.strip{display:flex;align-items:center;gap:0;margin-top:14px;font-size:13px;color:var(--ink-soft);flex-wrap:wrap}
.strip span b{color:var(--ink);font-weight:600}
.strip i{flex:0 0 28px;height:1px;background:var(--rule);margin:0 10px}
.stop{display:grid;grid-template-columns:130px 1fr;gap:4px 26px;padding:24px 0;border-bottom:1px solid var(--line)}.stop:last-of-type{border-bottom:none}
@media(max-width:620px){.stop{grid-template-columns:1fr}}
.stop .yr{font-family:var(--disp);font-weight:600;font-size:18px;color:var(--plum)}
.stop .yr small{display:block;font:500 12.5px var(--sans);color:var(--ink-soft);margin-top:3px}
.stop h3{font-size:20px}.stop .role{font-size:13.5px;color:var(--ink-soft);margin:3px 0 10px}
.stop ul{margin:0;padding-left:18px;font-size:14px;line-height:1.55}.stop li{margin-bottom:6px}
.creds{font-size:13.5px;color:var(--ink-soft);margin-top:18px;line-height:1.7}.creds b{color:var(--ink);font-weight:600}

/* skill map */
.skills{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:22px}
@media(max-width:820px){.skills{grid-template-columns:1fr}}
.skills h3{font-size:19px;padding-bottom:8px;border-bottom:2px solid var(--plum);margin-bottom:6px}
.sk{padding:11px 0;border-bottom:1px solid var(--line)}.sk:last-child{border-bottom:none}
.sk b{display:block;font-size:14px;font-weight:600}.sk span{font-size:13px;color:var(--ink-soft);line-height:1.5}
.sk em{font-style:normal;font-size:11.5px;color:var(--spruce);font-weight:600}

/* go-deeper blocks: first one is prominent, order set per tab */
.blocks{display:grid;grid-template-columns:1.6fr 1fr;grid-template-rows:auto auto;gap:16px}
.blocks .blk:first-child{grid-row:1 / span 2}
@media(max-width:760px){.blocks{grid-template-columns:1fr}.blocks .blk:first-child{grid-row:auto}}
.blk{background:var(--paper-2);border:1px solid var(--line);border-top:3px solid var(--c);border-radius:12px;padding:20px 22px;color:var(--ink);display:block}
.blk:hover{text-decoration:none;border-color:var(--c)}
.blk.cases{--c:var(--spruce)}.blk.fw{--c:var(--plum)}.blk.art{--c:var(--ochre)}
.blk .k{font-size:13px;font-weight:700;color:var(--c)}.blk.art .k{color:#8E6A2C}
.blk h3{font-size:clamp(19px,2.4vw,23px);margin:6px 0 8px}
.blk ul{list-style:none;margin:0;padding:0;font-size:14px}.blk li{padding:8px 0;border-top:1px solid var(--line)}
.blk li small{display:block;color:var(--ink-soft);font-size:12.5px}
.blk:not(:first-child) ul{display:none}
.blk .go{display:inline-block;margin-top:12px;font-size:13.5px;font-weight:600;color:var(--spruce)}
.swan{background:var(--plum-deep);color:var(--cream);border-radius:16px;padding:28px 26px;margin-bottom:16px}
.swan h3{font-size:clamp(22px,3vw,30px);color:#F6F1E8}.swan p{color:#CBB9DE;max-width:56ch;font-size:14.5px}
.swan .anchors{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.swan .anchors span{font-size:12.5px;border:1px solid rgba(243,236,223,.25);border-radius:20px;padding:4px 11px}

/* sign-off */
.signoff h2{font-size:clamp(24px,3.4vw,32px)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.btn{font:600 14px var(--sans);padding:12px 20px;border:1px solid var(--rule);border-radius:8px;color:var(--ink);background:var(--paper-2);cursor:pointer;transition:.15s;display:inline-block}
.btn:hover{background:var(--plum);color:#fff;border-color:var(--plum);text-decoration:none}.btn.primary{background:var(--plum);color:#fff;border-color:var(--plum)}
.owlmark{margin-top:40px;display:flex;align-items:center;gap:16px;max-width:560px}.owlmark .owl{width:56px;height:56px}
.owlmark .tag{font-family:var(--disp);font-style:italic;font-size:15px;line-height:1.45;color:var(--ink-soft)}.owlmark .who{font-size:12.5px;font-weight:600;margin-top:5px}
.stub{background:var(--paper-2);border:1px dashed var(--rule);border-radius:12px;padding:20px;font-size:14px;color:var(--ink-soft);max-width:60ch}.stub b{color:var(--ink)}
.foot{padding:28px 0 46px;font-size:12px;color:var(--ink-soft)}

/* landing */
#landing{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;justify-content:center;padding:54px 22px;max-width:730px;margin:0 auto}
#landing .brand .owl{width:38px;height:38px}
#landing .name{font-family:var(--disp);font-weight:700;font-size:27px;letter-spacing:-.015em}
#landing .role{font-size:13px;color:var(--ink-soft);margin-top:2px}
#landing h1{font-size:clamp(30px,6.4vw,46px);margin:32px 0 8px}
#landing .lead{font-size:16px;color:var(--ink-soft);margin:0 0 26px}
.doors{display:grid;gap:11px}
.door{text-align:left;background:var(--paper-2);border:1px solid var(--rule);border-radius:12px;padding:16px 18px;color:var(--ink);display:flex;align-items:center;gap:15px;transition:border-color .16s,transform .16s}
.door:hover{border-color:var(--spruce);transform:translateY(-2px);text-decoration:none}
.door .dicon{width:30px;height:30px;flex:none;color:var(--spruce)}
.door .dbody{flex:1}.door .dt{display:block;font-size:16px;font-weight:700}.door .dd{display:block;font-size:13px;color:var(--ink-soft);margin-top:3px}
.door .arw{color:var(--spruce);font-size:22px;flex:none}

/* ---------- v2 additions ---------- */
.nav .links a.on{border-bottom:2px solid var(--ochre);padding-bottom:2px}
@media(max-width:700px){.nav .links a.on{border-bottom:none;background:var(--lilac)}}
.open .hook{font-family:var(--disp);font-weight:500;font-size:clamp(21px,3.2vw,30px);line-height:1.2;color:#F6F1E8;max-width:26ch;margin:0 0 20px;text-wrap:balance}
.enlarge{display:none;margin-top:10px;font-size:13px;font-weight:600;color:#C6A9E4}
@media(max-width:700px){.enlarge{display:inline-block}}
.head{text-wrap:balance}

/* landing: rows on phones, 2x2 on wider screens */
#landing{max-width:880px}
@media(min-width:720px){
 .doors{grid-template-columns:1fr 1fr;gap:14px}
 .door{flex-direction:column;align-items:flex-start;gap:14px;padding:24px 24px 22px;min-height:196px}
 .door .dicon{width:44px;height:44px}
 .door .dt{font-size:18px}
 .door .arw{display:none}
}

/* ways to work together (consulting) */
.ways{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:700px){.ways{grid-template-columns:1fr}}
.way{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:22px}
.way h3{font-size:21px;margin-bottom:6px}.way p{margin:0 0 10px;font-size:14px;color:var(--ink-soft)}
.way .for{font-size:13px;color:var(--ink)}.way .for b{font-weight:600}

/* Swanubhava method (training) */
.method-intro{font-family:var(--disp);font-size:clamp(19px,2.5vw,24px);line-height:1.35;max-width:36ch;margin:0 0 26px;text-wrap:balance}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:14px;background:var(--paper-2);overflow:hidden}
.steps li{padding:20px;border-right:1px solid var(--line)}.steps li:last-child{border-right:none}
.steps .n{font-family:var(--disp);font-weight:700;font-size:22px;color:var(--spruce)}
.steps b{display:block;font-size:15px;margin:4px 0 6px}.steps span{font-size:13px;color:var(--ink-soft);line-height:1.5;display:block}
@media(max-width:760px){.steps{grid-template-columns:1fr}.steps li{border-right:none;border-bottom:1px solid var(--line)}.steps li:last-child{border-bottom:none}}
.nodes{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
@media(max-width:700px){.nodes{grid-template-columns:1fr}}
.node{border:1px solid var(--rule);border-radius:14px;padding:20px;background:var(--paper-2)}
.node h3{font-size:19px;margin-bottom:6px}.node p{margin:0;font-size:14px;color:var(--ink-soft)}
.matrix-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--paper-2)}
table.matrix{border-collapse:collapse;width:100%;min-width:560px;font-size:14px}
.matrix th,.matrix td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:center}
.matrix thead th{font-size:12.5px;font-weight:700;color:var(--ink-soft);background:var(--paper)}
.matrix th[scope=row]{text-align:left;font-weight:600;color:var(--ink)}
.matrix tr:last-child th,.matrix tr:last-child td{border-bottom:none}
.matrix .dot{display:inline-block;width:11px;height:11px;border-radius:50%;background:var(--plum)}
.matrix .no{color:var(--rule)}
.scale{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0;font-size:13.5px}
.scale span{border:1px solid var(--rule);border-radius:20px;padding:5px 12px;background:var(--paper-2)}.scale b{font-weight:600}
.anchor-ex{margin-top:26px;border-left:3px solid var(--ochre);padding:4px 0 4px 20px;max-width:64ch}
.anchor-ex h3{font-size:20px;margin-bottom:6px}.anchor-ex p{margin:0 0 8px;font-size:14.5px}
.anchor-ex .says{font-family:var(--disp);font-style:italic;font-size:17px;color:var(--plum)}
.engine{display:grid;grid-template-columns:1.2fr 1fr;gap:26px;align-items:start}
@media(max-width:760px){.engine{grid-template-columns:1fr}}
.engine ul{margin:0;padding-left:18px;font-size:14.5px}.engine li{margin-bottom:8px}
.play{background:var(--plum-deep);color:var(--cream);border-radius:16px;padding:24px}
.play h3{color:#F6F1E8;font-size:22px;margin-bottom:6px}.play p{color:#CBB9DE;font-size:14px;margin:0 0 16px}
.play .btn{background:var(--ochre);border-color:var(--ochre);color:var(--plum-deep)}
.play .btn:hover{background:#F6F1E8;border-color:#F6F1E8;color:var(--plum-deep)}
.tm{font-size:12px;color:var(--ink-soft);margin-top:28px;max-width:70ch}

/* How I think */
.zone-intro{font-size:14.5px;color:var(--ink-soft);max-width:60ch;margin:0 0 22px}
details.case{background:var(--paper-2);border:1px solid var(--line);border-top:3px solid var(--spruce);border-radius:12px;margin-bottom:14px}
details.case>summary{list-style:none;cursor:pointer;padding:20px 22px;display:grid;grid-template-columns:1fr auto;gap:6px 18px;align-items:start}
details.case>summary::-webkit-details-marker{display:none}
.case .kind{font-size:13px;font-weight:700;color:var(--spruce)}
.case h3{font-size:clamp(19px,2.6vw,24px);grid-column:1}
.case .gist{grid-column:1;font-size:14px;color:var(--ink-soft);max-width:62ch}
.case summary .tog{grid-row:1 / span 3;grid-column:2;align-self:center}
details.case[open]>summary .tog .a{display:none}details.case:not([open])>summary .tog .b{display:none}
.tog{font:600 13px var(--sans);color:var(--spruce);border:1px solid var(--rule);border-radius:20px;padding:5px 13px;white-space:nowrap}
@media(max-width:560px){details.case>summary{grid-template-columns:1fr}.case summary .tog{grid-row:auto;grid-column:1;justify-self:start;margin-top:6px}}
.case-body{padding:4px 22px 24px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:22px 30px}
@media(max-width:760px){.case-body{grid-template-columns:1fr}}
.case-body h4{font-size:13px;font-weight:700;color:var(--ink-soft);margin:18px 0 8px;font-family:var(--sans)}
.case-body p{margin:0;font-size:14.5px}.case-body .full{grid-column:1 / -1}
.case-body ul{margin:0;padding-left:18px;font-size:14.5px}.case-body li{margin-bottom:5px}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{font-size:12.5px;border:1px solid var(--rule);border-radius:20px;padding:3px 10px;background:var(--paper)}
.flow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13.5px}
.flow span{border:1.5px solid var(--plum);border-radius:6px;padding:7px 11px;font-weight:600;color:var(--plum);background:var(--paper)}
.flow i{font-style:normal;color:var(--plum)}
.decks{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.fw-list{border:1px solid var(--line);border-radius:14px;background:var(--paper-2);overflow:hidden}
details.fw{border-bottom:1px solid var(--line)}details.fw:last-child{border-bottom:none}
details.fw>summary{list-style:none;cursor:pointer;padding:18px 22px;display:grid;grid-template-columns:1fr auto;gap:4px 18px}
details.fw>summary::-webkit-details-marker{display:none}
.fw .t{font-family:var(--disp);font-weight:600;font-size:clamp(18px,2.4vw,21px)}
.fw .l{font-size:14px;color:var(--ink-soft);grid-column:1}
.fw summary .tog{grid-row:1 / span 2;grid-column:2;align-self:center}
details.fw[open]>summary .tog .a{display:none}details.fw:not([open])>summary .tog .b{display:none}
.fw-body{padding:0 22px 20px;font-size:14.5px;max-width:70ch}.fw-body p{margin:0 0 8px}
.swan-link{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;background:var(--plum-deep);color:var(--cream);border-radius:14px;padding:22px 24px;margin-bottom:16px}
.swan-link h3{color:#F6F1E8;font-size:22px}.swan-link p{margin:4px 0 0;color:#CBB9DE;font-size:14px;max-width:56ch}
.swan-link .btn{background:var(--ochre);border-color:var(--ochre);color:var(--plum-deep)}
details.cat{border-top:1px solid var(--line)}details.cat:last-of-type{border-bottom:1px solid var(--line)}
details.cat>summary{list-style:none;cursor:pointer;padding:16px 0;display:flex;justify-content:space-between;align-items:baseline;gap:16px}
details.cat>summary::-webkit-details-marker{display:none}
.cat .ct{font-family:var(--disp);font-weight:600;font-size:20px}.cat .cc{font-size:13px;color:var(--ink-soft);white-space:nowrap}
.cat .cd{display:block;font-family:var(--sans);font-size:13.5px;font-weight:400;color:var(--ink-soft);margin-top:2px}
ol.arts{margin:0 0 18px;padding-left:24px;font-size:15px}ol.arts li{padding:6px 0}
ol.arts a{color:var(--ink)}ol.arts a:hover{color:var(--spruce)}

/* In their words */
.cloud{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline;max-width:860px;line-height:1.15}
.cloud span{font-family:var(--disp);font-weight:500;color:var(--plum)}.cloud span.alt{color:var(--spruce)}.cloud span.lite{color:var(--ink-soft);font-weight:400}
.cloud-note{font-size:12.5px;color:var(--ink-soft);margin-top:16px}
.rgroup{margin-top:34px}.rgroup:first-of-type{margin-top:0}
.rgroup h3{font-size:22px;margin-bottom:4px}.rgroup .gs{font-size:13.5px;color:var(--ink-soft);margin:0 0 16px}
.recs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:16px;align-items:start}
.rec{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:20px 20px 16px;margin:0}
.rec .rt{font-size:14.5px;line-height:1.6;margin:0}.rec .rt p{margin:0 0 10px}
.rec .who{font-size:13px;color:var(--ink-soft);margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.rec .who b{display:block;color:var(--ink);font-weight:600;font-size:14px}
.rec details summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--spruce);list-style:none;margin-top:4px}
.rec details summary::-webkit-details-marker{display:none}.rec details[open] summary{display:none}

/* Get in touch */
.reach{display:grid;grid-template-columns:1.1fr 1fr;gap:28px}
@media(max-width:760px){.reach{grid-template-columns:1fr}}
.mail{font-family:var(--disp);font-weight:600;font-size:clamp(20px,3.2vw,30px);word-break:break-all;color:var(--plum)}
.facts{border:1px solid var(--line);border-radius:14px;background:var(--paper-2)}
.facts div{display:flex;justify-content:space-between;gap:16px;padding:13px 18px;border-bottom:1px solid var(--line);font-size:14px}.facts div:last-child{border-bottom:none}
.facts span{color:var(--ink-soft)}.facts b{font-weight:600;text-align:right}
.curious{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:820px){.curious{grid-template-columns:1fr 1fr}}@media(max-width:460px){.curious{grid-template-columns:1fr}}
.cq{background:var(--paper-2);border:1px solid var(--line);border-radius:12px;padding:18px}
.cq b{display:block;font-family:var(--disp);font-size:18px;font-weight:600;margin-bottom:6px}.cq span{font-size:13.5px;color:var(--ink-soft)}
.dl{border:1px solid var(--line);border-radius:14px;background:var(--paper-2);overflow:hidden}
.dl a{display:flex;justify-content:space-between;gap:16px;padding:14px 18px;border-bottom:1px solid var(--line);color:var(--ink);font-size:14.5px}
.dl a:last-child{border-bottom:none}.dl a:hover{background:var(--lilac);text-decoration:none}
.dl a span{color:var(--ink-soft);font-size:13px;white-space:nowrap}
.redirect{max-width:560px;margin:18vh auto;padding:0 22px;font-size:15px}

/* ---------- v3: review round 26 Sep ---------- */
/* landing: no icons, centred text */
#landing{text-align:center;align-items:center}
#landing .brand{justify-content:center}
.doors{width:100%}
.door{justify-content:center;text-align:center}
@media(min-width:720px){.door{align-items:center;justify-content:center;min-height:150px}}
.door .arw{display:none}

/* overview opening band: light, smaller diagrams, one-line statements */
.open.lite{background:var(--lilac);color:var(--ink);padding:40px 0 38px;border-bottom:1px solid var(--line)}
.open.lite .eyebrow{color:var(--spruce)}
.open.lite .hook{color:var(--ink);max-width:none;margin-bottom:14px}
.open.lite .belief{color:var(--plum);max-width:none;margin-top:14px}
.open.lite .dgwrap{max-width:380px;margin:0}.open.lite .dgwrap.wide{max-width:600px}
.open.lite .enlarge{color:var(--spruce)}
@media(min-width:900px){
 .open.lite .hook{white-space:nowrap}
 .open.lite .belief{white-space:nowrap;font-size:clamp(15px,1.8vw,18.5px)}
}

/* PM perspective row: diagram | divider | next step */
.pmrow{padding:44px 0}
.pm-title{max-width:none}
@media(min-width:760px){.pm-title{white-space:nowrap}}
.pm-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:0;align-items:center;margin-top:18px}
.pm-grid .ssscard{padding:18px 18px 14px}
.pm-cta{padding-left:34px;margin-left:34px;border-left:2px solid var(--rule)}
.pm-cta h2{font-size:clamp(22px,2.7vw,28px);text-wrap:balance}
.pm-cta .cta-row{margin-top:18px}
@media(max-width:760px){.pm-grid{grid-template-columns:1fr;gap:22px}.pm-cta{padding-left:0;margin-left:0;border-left:none;border-top:2px solid var(--rule);padding-top:22px}}

/* more prominent section titles */
.eyebrow.lg{font-family:var(--disp);font-weight:600;font-size:clamp(22px,2.8vw,28px);color:var(--ink);margin-bottom:16px}
.pill .metric{white-space:normal;max-width:15ch}

/* who I am: compact opening band */
.open.compact{padding:22px 0 20px}
.open.compact .eyebrow{margin-bottom:6px}
.open.compact .line{font-size:clamp(20px,2.6vw,26px);max-width:none}
.open.compact .belief{font-size:clamp(14px,1.6vw,16px);margin-top:8px;max-width:none}

/* skill map: rated */
.skillcols{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:22px;background:var(--paper)}
.skillcol{padding:20px 22px;border-right:1px solid var(--line)}.skillcol:last-child{border-right:none}
@media(max-width:760px){.skillcols{grid-template-columns:1fr}.skillcol{border-right:none;border-bottom:1px solid var(--line)}.skillcol:last-child{border-bottom:none}}
.skillcol .sh{font-family:var(--disp);font-weight:600;font-size:19px;color:var(--plum)}
.skillcol .sd{font-family:var(--disp);font-style:italic;font-size:14px;color:var(--spruce);margin:2px 0 12px}
.srow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
.srow:first-of-type{border-top:none}
.srow .sn{font-size:13.5px}
.stars{display:flex;gap:4px;flex:none}
.stars i{width:9px;height:9px;border-radius:50%;background:var(--ochre)}
.stars i.o{background:transparent;border:1px solid var(--ochre)}
.stars i.h{background:linear-gradient(90deg,var(--ochre) 50%,transparent 50%);border:1px solid var(--ochre)}
.skey{display:flex;gap:18px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-soft);margin-top:14px;align-items:center}
.skey span{display:flex;align-items:center;gap:6px}
.door .dbody{flex:none}
@media(min-width:720px){.door{min-height:124px}}
.pill .metric{max-width:11em}
#landing .brand{margin:0 auto}

/* ---------- v4: use the full width ---------- */
:root{--maxw:1240px}
.head,.sub,.zone-intro,.method-intro,.pill .claim,.pill .ev,.case .gist,.fw-body,.solo,.anchor-ex,.tm,.swan p,.swan-link p,.open .line,.open .belief,.tcard .qbig,.owlmark,.stop ul,.creds,.way p{max-width:none}
.pill .ev{max-width:90ch}
.method-intro{text-wrap:pretty}
.tcard{max-width:none}

/* SSS diagram smaller, CTA takes the rest */
.pm-grid{grid-template-columns:minmax(0,440px) 1fr}
@media(max-width:760px){.pm-grid{grid-template-columns:1fr}}
.pm-grid .ssscard img{max-width:400px}

/* fractional offer under the consulting CTA */
.offer{margin-top:22px;font-size:14px}
.offer b{display:block;color:var(--spruce);font-size:14.5px;margin-bottom:4px}
.offer p{margin:0 0 8px;color:var(--ink-soft);line-height:1.6}.offer .for b{display:inline;color:var(--ink);font-size:inherit}

/* quote beside the owl mark */
.q-row{display:grid;grid-template-columns:1.15fr 1fr;gap:28px;align-items:center}
.q-row .owlmark{margin:0;background:var(--paper);border-radius:14px;padding:22px 24px}
@media(max-width:820px){.q-row{grid-template-columns:1fr}}

/* training: demo up front, one-row scale */
.play.wide{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:0 0 22px;padding:20px 24px}
.play.wide p{margin:0}.play.wide h3{margin-bottom:2px}
@media(min-width:900px){.scale{flex-wrap:nowrap}.scale span{white-space:nowrap}}

/* how we'd work (consulting + training tabs) */
.howwork{border:1px solid var(--line);border-radius:14px;background:var(--paper-2);overflow:hidden;margin-top:8px}
.howwork .hw{display:grid;grid-template-columns:200px 1fr;gap:6px 24px;padding:18px 22px;border-bottom:1px solid var(--line)}.howwork .hw:last-child{border-bottom:none}
.howwork .hw>b{font-family:var(--disp);font-weight:600;font-size:17px;line-height:1.3}
.howwork .hw>div{font-size:14.5px;line-height:1.6;color:var(--ink-soft)}
.howwork ol,.howwork ul{margin:0;padding-left:20px}.howwork li{margin:0 0 6px}.howwork li:last-child{margin-bottom:0}
.howwork li b{color:var(--ink);font-weight:600}
@media(max-width:640px){.howwork .hw{grid-template-columns:1fr;padding:16px 18px}}
.facts div.long{flex-direction:column;gap:4px}.facts div.long b{text-align:left;font-weight:500;line-height:1.5}

/* how we'd work pop-ups (contact page) */
dialog.hwdlg{width:min(880px,calc(100% - 32px));max-height:86vh;padding:0;border:1px solid var(--line);border-radius:16px;background:var(--paper);color:var(--ink);box-shadow:0 24px 60px rgba(24,11,41,.28)}
dialog.hwdlg::backdrop{background:rgba(24,11,41,.55)}
.hwdlg-head{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:20px 22px 14px;background:var(--paper);border-bottom:1px solid var(--line)}
.hwdlg-head h2{font-size:clamp(20px,3vw,26px)}.hwdlg-head .eyebrow{margin-bottom:4px}
.hwdlg-x{flex:none;width:36px;height:36px;border-radius:50%;border:1px solid var(--rule);background:var(--paper-2);font-size:22px;line-height:1;cursor:pointer;color:var(--ink)}
.hwdlg-x:hover{background:var(--ink);color:var(--paper)}
dialog.hwdlg .howwork{margin:16px 22px 22px}
@media(max-width:640px){dialog.hwdlg .howwork{margin:12px 12px 16px}.hwdlg-head{padding:16px 16px 12px}}
body.dlg-open{overflow:hidden}

/* Links from the assistant land below the sticky header */
[id]{scroll-margin-top:120px}

/* Long door descriptions no longer run off narrow phone screens */
.door .dbody{max-width:100%;min-width:0}

/* ---------- 30 Sep: landing title block, OWL spacing, footer ---------- */
#landing .hero-brand{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0 auto;width:100%}
#landing .brand-top{display:flex;align-items:center;justify-content:center;gap:12px}
#landing .hero-brand .name{font-size:clamp(28px,4.2vw,36px)}
#landing .hero-brand .role{font-size:clamp(15px,1.9vw,17.5px);font-weight:700;color:var(--ink);margin-top:2px}
#landing .reach{font-size:14.5px;font-weight:600;color:var(--ink-soft);display:flex;flex-wrap:wrap;justify-content:center;gap:2px 0}
#landing .reach a{color:var(--spruce)}
#landing .motto{font-size:clamp(14px,1.7vw,16px);font-weight:700;color:var(--plum);letter-spacing:.01em}
#landing .sep{color:var(--rule);font-weight:400;margin:0 8px}
#ask-gaurav-inline{padding:18px 0 0!important;border-top:none!important}
#landing h1{margin-top:28px}
.site-foot{max-width:var(--maxw);margin:0 auto;padding:22px 22px calc(28px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);font-size:12px;color:var(--ink-soft);text-align:center}
#landing + .site-foot{border-top:none;padding-top:0}
@media(max-width:560px){#landing .reach{flex-direction:column;align-items:center}#landing .reach .sep{display:none}}
#landing .hero-brand .m{white-space:nowrap}
@media(max-width:560px){#landing .sep{margin:0 6px}#landing .motto{font-size:13.5px}}

/* ---------- C4: landing fits OWL and the four doors in the first screen ---------- */
#landing{justify-content:flex-start;padding-top:36px;padding-bottom:28px}
#landing h1.name{margin:0;font-size:clamp(28px,4.2vw,36px);letter-spacing:-.015em}
#landing .reach .short{display:none}
#landing .doors-h{font-size:clamp(20px,2.6vw,24px);margin:26px 0 14px;font-weight:600}
@media(min-width:720px){.door{min-height:96px;padding:18px 22px}.door .dt{font-size:17px}}
@media(max-width:560px){
 #landing{padding:22px 16px 20px}
 #landing .reach{flex-direction:row;justify-content:center}
 #landing .reach .sep{display:inline}
 #landing .reach .full{display:none}#landing .reach .short{display:inline}
 .doors{gap:8px}
 .door{flex-direction:row;justify-content:space-between;text-align:left;padding:13px 16px;min-height:0}
 .door .dd{display:none}.door .dt{font-size:15.5px}
 .door .arw{display:block}
}
@media(max-width:560px){
 .ag-inline .ag-starters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-14px;padding-bottom:2px}
 .ag-inline .ag-starters button{flex:none}
 #landing .motto{margin-top:2px}
}

/* ---------- C5: overview leads with proof and the obvious next step ---------- */
.open .hero-cta{margin-top:20px}
@media(max-width:560px){.open.lite .dgwrap:not(.wide){max-width:300px}}

/* ---------- C6: one footer ---------- */
.site-foot .foot-links{font-size:13px;margin-bottom:6px;color:var(--ink)}
.site-foot .foot-links a{color:var(--spruce)}

/* ---------- C8: themes replace the word cloud ---------- */
.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
@media(max-width:760px){.themes{grid-template-columns:1fr}}
.theme{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:20px 20px 8px}
.theme h3{font-family:var(--disp);font-size:20px;margin:0 0 12px;color:var(--plum)}
.theme blockquote{margin:0 0 14px;padding-left:12px;border-left:3px solid var(--ochre,#C69A4C)}
.theme blockquote p{margin:0 0 4px;font-size:15px;line-height:1.5;color:var(--ink)}
.theme blockquote a{font-size:13px;font-weight:600;color:var(--spruce)}
/* ---------- C10: contact - downloads before interests, resume hints ---------- */
#downloads em.hint{font-style:normal;color:var(--ink-soft);font-size:.92em;margin:0 auto 0 8px}

/* ---------- C1 follow-up: phones show two buttons in one row (the hero already carries the others) ---------- */
@media(max-width:760px){.pm-cta .m-hide{display:none}.pm-cta .cta-row{flex-wrap:nowrap;gap:10px}.pm-cta .cta-row .btn{flex:1;text-align:center;padding:12px 10px}.pm-cta .m-first{background:var(--plum);border-color:var(--plum);color:#fff}}

/* ---------- C4 follow-up: doors lift off the page like the OWL panel ---------- */
.door{box-shadow:0 18px 36px -22px rgba(24,11,41,.35),0 2px 6px rgba(24,11,41,.05)}
.door:hover{box-shadow:0 24px 44px -22px rgba(24,11,41,.42),0 2px 6px rgba(24,11,41,.06)}

/* ---------- C7 follow-up: audience tabs stand out ---------- */
.tab{font-size:14.5px;font-weight:700;padding:14px 6px;color:#D4C8E3;border-bottom-width:3px}
.tab:hover{color:#fff;background:rgba(255,255,255,.05)}
.tab.on{color:#fff;background:rgba(198,154,76,.2)}
@media(max-width:420px){.tab{font-size:12.5px;padding:12px 4px}}

/* ---------- C9: training tab - storyline: difference, what, how, see it, engagement, science ---------- */
details.fold{margin-top:16px;border:1px solid var(--line);border-radius:12px;background:var(--paper-2);padding:0 18px}
details.fold>summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;justify-content:space-between;gap:6px 16px;flex-wrap:wrap;padding:14px 0}
details.fold>summary::-webkit-details-marker{display:none}
details.fold .fold-t{font-family:var(--disp);font-weight:600;font-size:18px;color:var(--ink)}
details.fold .fold-hint{font-size:13.5px;font-weight:600;color:var(--spruce)}
details.fold .fold-hint::after{content:' \25BE'}
details.fold[open] .fold-hint{font-size:0}
details.fold[open] .fold-hint::after{content:'Hide \25B4';font-size:13.5px}
details.fold[open]{padding-bottom:16px}
.sci-h{font-family:var(--disp);font-size:20px;margin:4px 0 12px}
#tr-model .conv{margin-top:6px}
.open.lite .hook.tr-hook{white-space:normal;max-width:none;text-wrap:balance}
.open .tr-lede{font-size:17px;color:var(--ink-soft);margin:0;max-width:60ch}
@media(max-width:560px){.open .tr-lede{font-size:16px}}


/* Booking calendar (Google appointment schedule) - inline on contact, pop-up elsewhere */
.book-frame{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.book-frame iframe{display:block;width:100%;height:640px;border:0;background:#fff}
dialog.bookdlg .book-note{font-size:14.5px;color:var(--ink-soft);margin:14px 22px 0}
dialog.bookdlg .book-frame{margin:12px 22px 22px}
@media(max-width:640px){dialog.bookdlg .book-note{margin:12px 12px 0}dialog.bookdlg .book-frame{margin:10px 12px 16px}.book-frame iframe{height:600px}}
.linkbtn{font:inherit;font-weight:600;color:var(--plum);background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}

/* ======================================================================
   v5 (22 Oct 2026): Working papers theme
   Cool stone ground, green-black ink, one spruce accent, Schibsted Grotesk
   for everything, self-hosted. Gaurav's hand-drawn diagrams are the only
   decoration. Replaces cream / Fraunces / Inter / plum / ochre.
   ====================================================================== */
@font-face{font-family:"Schibsted Grotesk";src:url(fonts/schibsted-grotesk.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Tiro Devanagari Marathi";src:url(fonts/tiro-devanagari-marathi-swanubhava.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{
 --paper:#E9EAE6;--paper-2:#F5F5F2;--ink:#17201D;--ink-soft:#535A56;--line:#D6D8D3;--rule:#C4C7C1;
 --plum:#17201D;--plum-deep:#17201D;--spruce:#1D6657;--ochre:#1D6657;--cream:#E9EAE6;--lilac:#DDDFDA;
 --on-dark:#F2F3EF;--on-dark-soft:#AEB6B1;--spruce-on-dark:#9EC4B7;
 --disp:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;--sans:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
 --ease-out:cubic-bezier(.23,1,.32,1)}
html{-webkit-tap-highlight-color:transparent}
body{font-size:16.5px;line-height:1.6;font-kerning:normal}
h1,h2,h3{font-weight:700;letter-spacing:-.025em;line-height:1.1}
::selection{background:var(--spruce);color:#fff}
a{text-underline-offset:.18em;text-decoration-thickness:.07em}
a,button,summary,.door,.btn{touch-action:manipulation}
p{text-wrap:pretty}

/* section titles (the green ones): 30% more prominent */
.eyebrow{font-size:19px;font-weight:700;letter-spacing:-.01em;color:var(--spruce);margin-bottom:12px}
.open .eyebrow,.open.compact .eyebrow{color:var(--spruce-on-dark)}
.open.lite .eyebrow{color:var(--spruce)}

/* bigger, tighter display type - size does the work, not ornament */
.head{font-size:clamp(28px,3.9vw,42px);letter-spacing:-.03em;line-height:1.05}
.signoff h2{font-size:clamp(28px,3.9vw,42px)}
.open .line{font-weight:700;letter-spacing:-.03em;color:var(--on-dark)}
.open .hook{font-weight:700;letter-spacing:-.03em}
.open .belief,.owlmark .tag,.anchor-ex .says,.skillcol .sd{font-style:normal}
.open .belief{color:var(--on-dark-soft)}
.open{color:var(--on-dark)}
#landing h1.name,#landing .hero-brand .name{font-weight:800;font-size:clamp(34px,5vw,52px);letter-spacing:-.04em}
#landing .motto{color:var(--ink)}
#landing .doors-h{font-weight:700;letter-spacing:-.02em}

/* nav and audience tabs */
header.nav{background:rgba(233,234,230,.94)}
.nav .name{font-weight:800;letter-spacing:-.03em}
.nav .links a.on{border-bottom-color:var(--spruce)}
.tab{color:var(--on-dark-soft);padding-block:14px}
.tab:hover{color:var(--on-dark)}
.tab.on{color:var(--on-dark);background:rgba(242,243,239,.08);border-bottom-color:var(--on-dark)}

/* surfaces: told apart by tone, not by shadow */
.door,.door:hover,.tcard,.ag-panel.ag-inline{box-shadow:none}
.door{border-color:transparent}
.door:hover{border-color:var(--ink)}
.blk,.blk:hover,details.case{border-top-width:1px;border-top-color:var(--line)}
.blk:hover{border-color:var(--ink)}
.blk.art .k{color:var(--spruce)}
.tcard{border-color:transparent}
.tcard .qm{color:var(--spruce)}
.theme blockquote{border-left-color:var(--spruce)}
.anchor-ex{border-left-color:var(--spruce)}
.beat{color:var(--ink);background:var(--lilac)}
.stars i{background:var(--spruce)}.stars i.o{border-color:var(--spruce)}
.stars i.h{background:linear-gradient(90deg,var(--spruce) 50%,transparent 50%);border-color:var(--spruce)}

/* dark bands */
.swan h3,.swan-link h3,.play h3{color:var(--on-dark)}
.swan p,.swan-link p,.play p{color:var(--on-dark-soft)}
.swan .anchors span{border-color:rgba(242,243,239,.25)}
.play .btn,.swan-link .btn{background:var(--on-dark);border-color:var(--on-dark);color:var(--ink)}
.play .btn:hover,.swan-link .btn:hover{background:#fff;border-color:#fff;color:var(--ink)}
.enlarge{color:var(--spruce-on-dark)}
.open.lite .enlarge{color:var(--spruce)}

/* buttons: press feedback, named transitions */
.btn,.tab,.door{transition:background-color .15s var(--ease-out),color .15s var(--ease-out),border-color .15s var(--ease-out),transform .12s var(--ease-out)}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.btn.primary{background:var(--ink);border-color:var(--ink)}
.btn.primary:hover{background:var(--spruce);border-color:var(--spruce)}
.btn:active,.door:active{transform:scale(.97)}
@media(max-width:760px){.pm-cta .m-first{background:var(--ink);border-color:var(--ink)}}

/* phones: no sticky hover after a tap */
@media (hover:none){
 .btn:hover{background:var(--paper-2);color:var(--ink);border-color:var(--rule)}
 .btn.primary:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
 .play .btn:hover,.swan-link .btn:hover{background:var(--on-dark);border-color:var(--on-dark)}
 .door:hover{transform:none;border-color:transparent}
 .blk:hover{border-color:var(--line)}
 .dl a:hover{background:transparent}
 .tab:hover{background:transparent;color:var(--on-dark-soft)}.tab.on:hover{color:var(--on-dark)}
 a:hover{text-decoration:none}
}

/* Swanubhava in Marathi: one detail from Gaurav's own world */
.deva{font-family:"Tiro Devanagari Marathi","Noto Serif Devanagari",serif;font-weight:400;letter-spacing:0;font-size:1.25em;line-height:1;margin-right:.35em;color:inherit}

/* dialogs */
dialog.hwdlg{border:0;box-shadow:0 16px 40px rgba(23,32,29,.22)}
dialog.hwdlg::backdrop{background:rgba(23,32,29,.55)}

/* audit fixes (Impeccable): breathing room inside the tab bar and framework list */
.fw-list{padding-block:4px}
.open .hook,.open .line{line-height:1.12}

/* ---------- Batch 3: scroll moments (js/moments.js) ---------- */
/* In their words: the words each theme stands on. Fully drawn at rest; moments.js draws it in on scroll. */
mark.hl{color:inherit;background-color:transparent;padding:0 .08em;border-radius:2px;background-image:linear-gradient(rgba(29,102,87,.2),rgba(29,102,87,.2)); /* taste-skill-ignore: flat highlighter fill, not a decorative gradient */
 background-repeat:no-repeat;background-position:0 100%;background-size:100% 100%;-webkit-box-decoration-break:clone;box-decoration-break:clone}
/* Who I am: Shape - Ship - Synchronize rail beside the results (desktop) and an active marker on the result in view */
.pill{transition:box-shadow .25s var(--ease-out)}
.pill.on{box-shadow:inset 4px 0 0 var(--spruce)}
.moved-grid{display:grid;grid-template-columns:170px minmax(0,1fr);gap:28px;align-items:start}
.beatrail{position:sticky;top:96px;display:grid;grid-template-columns:4px 1fr;gap:16px;padding-top:12px}
.beatrail .track{background:var(--line);border-radius:4px;overflow:hidden;min-height:180px}
.beatrail .fill{display:block;width:100%;height:100%;background:var(--spruce);transform-origin:top;transform:scaleY(0)}
.beatrail ol{list-style:none;margin:0;padding:0;display:grid;gap:22px}
.beatrail li{color:var(--ink-soft);transition:color .2s var(--ease-out)}
.beatrail li b{display:block;font-size:20px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.beatrail li span{font-size:13.5px}
.beatrail li.on{color:var(--ink)}.beatrail li.on b{color:var(--spruce)}

/* ---------- Round 2 (22 Oct) ---------- */
/* green section titles: another 10% (19px to 21px) */
.eyebrow{font-size:21px}
/* OWL keeps a soft lift on every page, so it reads as the way in */
.ag-panel.ag-inline{box-shadow:0 1px 2px rgba(23,32,29,.06),0 20px 44px -24px rgba(23,32,29,.38)}

/* In their words: each group folds, with its own words on the closed card */
details.rgroup{background:var(--paper-2);border-radius:14px;margin-top:14px;padding:0 22px}
details.rgroup:first-of-type{margin-top:0}
details.rgroup>summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 18px;align-items:center;padding:20px 0}
details.rgroup>summary::-webkit-details-marker{display:none}
details.rgroup>summary h3{margin:0 0 2px}
details.rgroup>summary .gs{margin:0 0 10px}
details.rgroup .kw{display:flex;flex-wrap:wrap;gap:6px 8px;margin:0}
details.rgroup .kw span{font-size:13.5px;background:var(--lilac);color:var(--ink);border-radius:999px;padding:3px 11px}
details.rgroup .cnt{font-size:13px;color:var(--ink-soft);display:block;margin-top:10px}
details.rgroup[open] .tog .a{display:none}details.rgroup:not([open]) .tog .b{display:none}
details.rgroup[open]{padding-bottom:22px}
details.rgroup .recs{margin-top:4px}
details.rgroup .rec{background:var(--paper)}
@media(max-width:560px){details.rgroup{padding:0 16px}details.rgroup>summary{grid-template-columns:minmax(0,1fr)}details.rgroup>summary .tog{justify-self:start}}

/* Who I am, journey: a spine through the three stops, latest first (js/moments.js fills it on scroll) */
.jstops{position:relative;padding-left:30px}
.jline{position:absolute;left:6px;top:30px;bottom:30px;width:3px;border-radius:3px;background:var(--line);overflow:hidden}
.jline i{display:block;width:100%;height:100%;background:var(--spruce);transform-origin:top;transform:scaleY(0)}
.jstops .stop{position:relative}
.jstops .stop::before{content:"";position:absolute;left:-30px;top:31px;width:15px;height:15px;border-radius:50%;background:var(--paper-2);box-shadow:inset 0 0 0 3px var(--rule);transition:box-shadow .25s var(--ease-out),background-color .25s var(--ease-out)}
.jstops .stop.on::before,.jstops .stop.seen::before{background:var(--spruce);box-shadow:inset 0 0 0 3px var(--spruce)}
.jstops .stop.on .yr{color:var(--spruce)}
/* AI section: four cards in a 2x2 grid (OWL added, Oct 2026) */
.ai-grid4{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){.ai-grid4{grid-template-columns:minmax(0,1fr)}}

/* ---------- Top bands (22 Oct): removed on Who I am, How I think, In their words; slim on Get in touch ---------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.lead-line{font-size:clamp(18px,2vw,21px);font-weight:600;letter-spacing:-.015em;color:var(--ink);margin:2px 0 6px;max-width:none}
main > h1.sr-only + section{border-top:none}
.open.slim{background:transparent;color:var(--ink);padding:40px 0 4px;border-top:none}
.open.slim .eyebrow{display:none}
.open.slim .line{color:var(--ink);font-size:clamp(26px,3.2vw,36px);max-width:none}
.open.slim .belief{color:var(--ink-soft);font-size:clamp(15px,1.6vw,17.5px);margin-top:10px}
.open.slim + section{border-top:none;padding-top:36px}
/* taller audience tabs (Overview and Who I am) */
.tabbar .tab{padding-block:20px;font-size:16px}
@media(max-width:420px){.tabbar .tab{padding-block:16px;font-size:13.5px}}
.btn.on-dark{background:var(--on-dark);border-color:var(--on-dark);color:var(--ink)}
.btn.on-dark:hover{background:#fff;border-color:#fff;color:var(--ink)}