/* Dawn guide template: service pillars, city pages and About (the old deep-dive family).
   Loads after dawn.css. The article markup is carried over from the pre-Dawn pages unchanged,
   so every class styled here (.dd-archetype-grid, .dd-tier-card, ...) is the original one. */

/* hero: the service's mesh field, as on the homepage cards */
.g-hero{margin:88px var(--gut) 0;position:relative;overflow:hidden;isolation:isolate;border-radius:30px;clip-path:inset(0 round 30px);min-height:min(64vh,600px);display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);color:var(--t,var(--ink))}
.g-hero .mesh{position:absolute;inset:-30%;z-index:-1;background:radial-gradient(40% 45% at 22% 30%,var(--c1),transparent 70%),radial-gradient(45% 50% at 78% 24%,var(--c2),transparent 70%),radial-gradient(50% 55% at 60% 82%,var(--c3),transparent 72%),radial-gradient(38% 40% at 18% 86%,var(--c4),transparent 70%),var(--c0);animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{0%{transform:translate(0,0) rotate(0) scale(1)}50%{transform:translate(4%,-3%) rotate(8deg) scale(1.06)}100%{transform:translate(-3%,4%) rotate(-6deg) scale(1.02)}}
/* pages that are not a service (About) get a neutral hero, no mesh */
.g-hero.neutral{background:var(--tile)}
.g-hero.neutral .mesh{display:none}
.g-hero .txt{padding:clamp(28px,4vw,56px);display:flex;flex-direction:column;justify-content:flex-end}
.g-hero .crumb{font-size:var(--t-caption);opacity:.8;margin-bottom:auto;padding-bottom:40px}
.g-hero .crumb a{color:inherit;text-decoration:none}
.g-hero .crumb a:hover{text-decoration:underline}
.g-hero h1{font-size:var(--t-card);letter-spacing:-.03em;line-height:1.04;max-width:18ch}
.g-hero .dd-lede{margin-top:20px;font-size:var(--t-lede);max-width:52ch;opacity:.86}
.g-hero .acts{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:28px}
.g-hero .acts .jump{font-size:var(--t-ui);color:inherit}
.g-hero .art{display:grid;place-items:center;padding:40px}
.g-hero .art svg{width:100%;max-width:340px;height:auto;overflow:visible}
.g-hero .art svg *{fill:none;stroke:currentColor;stroke-width:1.2}
.g-hero .art .fillw{fill:rgba(255,255,255,.5);stroke:none}
.g-hero .art .dot{fill:currentColor;stroke:none}
.g-hero .art .runner{display:none}

/* body: sticky contents on the left, the article on the right */
.g-body{display:grid;grid-template-columns:minmax(180px,250px) minmax(0,1fr);gap:clamp(32px,6vw,110px);padding:90px var(--gut) 0}
.g-toc{position:sticky;top:100px;align-self:start;font-size:var(--t-caption)}
.g-toc .k{display:block;color:var(--soft);margin-bottom:12px}
.g-toc a:not(.chip){display:flex;align-items:center;gap:10px;padding:7px 0;color:var(--soft);text-decoration:none;transition:color .2s}
.g-toc a:not(.chip)::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--faint);transition:background .2s}
.g-toc a:not(.chip):hover{color:var(--ink)}
.g-toc a:not(.chip).active{color:var(--ink)}
.g-toc a:not(.chip).active::before{background:var(--amber)}
.g-toc .chip{margin-top:22px}
.g-toc-m{display:none}
.g-main{min-width:0;max-width:780px}

/* article typography */
.dd-article{font-size:var(--t-body);line-height:1.72}
.dd-article > p{margin-top:18px;max-width:68ch}
.dd-article > p:first-child{margin-top:0;font-size:var(--t-lede);line-height:1.6}
.dd-article h2{font-size:var(--t-h2);letter-spacing:-.025em;line-height:1.08;margin-top:96px;scroll-margin-top:100px;max-width:22ch}
.dd-article h3{font-size:var(--t-step);letter-spacing:-.02em;line-height:1.18;margin-top:44px;scroll-margin-top:100px}
.dd-article h2 + h3{margin-top:30px}
.dd-article h4{font-size:var(--t-lede);letter-spacing:-.01em;line-height:1.3;font-weight:400}
.dd-article strong{font-weight:500}
.dd-article a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:3px;text-decoration-thickness:1px;transition:text-decoration-color .2s}
.dd-article a:hover{text-decoration-color:var(--ink)}
.dd-article ul{list-style:none;margin-top:20px;display:grid;gap:12px;max-width:68ch}
.dd-article ul li{position:relative;padding-left:20px}
.dd-article ul li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--amber)}
.dd-article table{width:100%;margin-top:26px;border-collapse:collapse;font-size:var(--t-small);line-height:1.55}
.dd-article th{text-align:left;font-weight:400;font-size:var(--t-caption);color:var(--soft);padding:0 16px 10px 0;border-bottom:1px solid var(--ink)}
.dd-article td{vertical-align:top;padding:16px 16px 16px 0;border-bottom:1px solid var(--line)}
.dd-article td:first-child{width:22%}

/* components carried over from the old template */
.dd-direct-answer{margin-top:26px;padding:24px 26px;background:var(--sand)}
.dd-archetype-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:28px}
.dd-archetype-card{background:var(--tile);padding:26px;display:flex;flex-direction:column;gap:8px}
.dd-archetype-card.full-width{grid-column:1/-1}
.dd-archetype-card .icon{width:26px;height:26px;margin-bottom:8px}
.dd-archetype-card .eyebrow,.dd-archetype-card .label{margin:0;font-size:var(--t-caption);color:var(--soft)}
.dd-archetype-card .eyebrow::before{display:none}
.dd-archetype-card p{font-size:var(--t-small);color:var(--soft);line-height:1.6}
.dd-tier-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:28px}
.dd-tier-card{background:var(--tile);padding:24px;display:flex;flex-direction:column;gap:10px}
.dd-tier-card .tier-num{font-size:var(--t-caption);color:var(--soft);font-variant-numeric:tabular-nums}
.dd-tier-card p{font-size:var(--t-small);color:var(--soft);line-height:1.6;flex:1}
.dd-tier-card .tagline{font-size:var(--t-caption);display:flex;align-items:center;gap:8px;padding-top:12px;border-top:1px solid var(--line)}
.dd-tier-card .tagline::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--amber)}
.dd-process-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin-top:30px}
.dd-process-step{border-top:1px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.dd-process-step .step-num{font-size:var(--t-caption);color:var(--soft);font-variant-numeric:tabular-nums}
.dd-process-step p{font-size:var(--t-small);color:var(--soft);line-height:1.6}

/* related links */
.acq-related{margin-top:100px}
.acq-related > h2{font-size:var(--t-h2);letter-spacing:-.025em;margin-bottom:26px}
/* six-column track: tiles take two (three a row); a short last row takes three each, so no tile sits alone */
.deep-dive-nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.deep-dive-nav a{grid-column:span 2}
.deep-dive-nav a:nth-child(3n+1):nth-last-child(4),.deep-dive-nav a:nth-child(3n+1):nth-last-child(4) ~ a,
.deep-dive-nav a:nth-child(3n+1):nth-last-child(2),.deep-dive-nav a:nth-child(3n+1):nth-last-child(2) ~ a{grid-column:span 3}
.deep-dive-nav a:only-child{grid-column:1/-1}
.deep-dive-nav a{display:flex;flex-direction:column;gap:8px;padding:22px;background:var(--tile);color:var(--ink);text-decoration:none;transition:background .3s}
.deep-dive-nav a:hover{background:var(--sand)}
.deep-dive-nav .label{font-size:var(--t-caption);color:var(--soft)}
.deep-dive-nav .title{font-size:var(--t-lede);letter-spacing:-.01em;line-height:1.3}

@media (max-width:900px){
  .g-hero{margin-top:76px;grid-template-columns:1fr;min-height:0;border-radius:24px;clip-path:inset(0 round 24px)}
  .g-hero .art{order:-1;padding:26px 26px 0;justify-items:start}
  .g-hero .art svg{height:130px;width:auto;max-width:100%}
  .g-hero .crumb{padding-bottom:22px}
  .g-body{grid-template-columns:1fr;padding-top:36px;gap:0}
  .g-toc{display:none}
  .g-toc-m{display:block;margin-bottom:40px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .g-toc-m summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:16px 0;font-size:var(--t-ui)}
  .g-toc-m summary::-webkit-details-marker{display:none}
  .g-toc-m summary::after{content:"+";font-size:var(--t-lede)}
  .g-toc-m[open] summary::after{content:"\2212"}
  .g-toc-m nav{display:grid;padding-bottom:12px}
  .g-toc-m a{padding:9px 0;color:var(--soft);text-decoration:none;font-size:var(--t-small)}
  .dd-article h2{margin-top:72px}
  .dd-archetype-grid,.dd-tier-grid{grid-template-columns:1fr}
  .dd-process-flow{grid-template-columns:1fr 1fr}
  .deep-dive-nav{grid-template-columns:1fr}
  .deep-dive-nav a{grid-column:1/-1!important}
  .dd-article table,.dd-article tbody,.dd-article tr,.dd-article td{display:block;width:100%}
  .dd-article thead{display:none}
  .dd-article tr{padding:14px 0;border-bottom:1px solid var(--line)}
  .dd-article td,.dd-article td:first-child{padding:3px 0;border:0;width:100%}
  .dd-article td:first-child{padding-bottom:6px}
  .dd-article td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;font-size:var(--t-caption);color:var(--soft)}
  .dd-article td:first-child{width:auto;min-width:120px}
}
@media (max-width:520px){.dd-process-flow{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.g-hero .mesh{animation:none}}

/* team bios: a small portrait in the left rail so the name and story lead */
.b-hero{display:grid;grid-template-columns:minmax(180px,250px) minmax(0,1fr);gap:clamp(32px,6vw,110px);align-items:end;padding:clamp(120px,15vh,160px) var(--gut) 0}
.b-hero .portrait{position:relative;width:100%;max-width:180px;aspect-ratio:4/5;border-radius:20px;clip-path:inset(0 round 20px);overflow:hidden;background:var(--tile)}
.b-hero .portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.02)}
.b-hero .intro{max-width:780px}
.b-hero .crumb{display:block;font-size:var(--t-caption);color:var(--soft);margin-bottom:22px}
.b-hero .crumb a{color:inherit;text-decoration:none}
.b-hero .crumb a:hover{text-decoration:underline}
.b-hero h1{font-size:var(--t-display);letter-spacing:-.035em;line-height:1}
.b-hero .lede{margin-top:22px;font-size:var(--t-lede);color:var(--soft);max-width:50ch}
.b-hero .acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.b-hero .acts svg{width:14px;height:14px}
.b-body{padding-top:0}
.b-body .dd-article > h2:first-child{margin-top:80px}
.bio-specs{list-style:none;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important;margin-top:26px}
.dd-article ul.bio-specs li{display:flex;margin:0}
.dd-article ul.bio-specs li{padding:0}
.dd-article ul.bio-specs li::before{display:none}
.dd-article .bio-specs a{flex:1;display:flex!important;align-items:center;gap:14px;min-height:76px;padding:16px 22px;line-height:1.35;color:var(--ink);background:var(--tile);text-decoration:none!important;transition:background .3s}
.dd-article .bio-specs a:hover{background:var(--sand)}
.bio-specs .sw{flex:none;width:26px;height:26px}
.dd-article ul.bio-specs li:last-child:nth-child(odd){grid-column:1/-1}
@media (max-width:900px){
  .b-hero{grid-template-columns:1fr;padding-top:104px;gap:22px}
  .b-hero .portrait{max-width:96px;aspect-ratio:1/1;border-radius:16px;clip-path:inset(0 round 16px)}
  .b-hero .crumb{margin-bottom:14px}
  .b-body .dd-article > h2:first-child{margin-top:56px}
  .bio-specs{grid-template-columns:1fr}
}

/* case studies: photo hero, the deal facts beside the story */
.c-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,80px);align-items:end;padding:108px var(--gut) 0}
.c-hero .crumb{display:block;font-size:var(--t-caption);color:var(--soft);margin-bottom:40px}
.c-hero .crumb a{color:inherit;text-decoration:none}
.c-hero .crumb a:hover{text-decoration:underline}
.c-hero h1{font-size:var(--t-card);letter-spacing:-.03em;line-height:1.04;max-width:18ch}
.c-hero .cs-li-link{margin-top:22px;font-size:var(--t-small)}
.c-hero .cs-li-link a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--amber);text-underline-offset:3px}
.c-hero .photo{aspect-ratio:4/3;border-radius:30px;clip-path:inset(0 round 30px);overflow:hidden;background:var(--tile)}
.c-hero .photo img{width:100%;height:100%;object-fit:cover}
.g-body.c-body{grid-template-columns:minmax(220px,300px) minmax(0,1fr)}
.c-body .facts{position:sticky;top:100px;align-self:start}
.facts-table{width:100%;border-collapse:collapse;font-size:var(--t-small);line-height:1.4}
.facts-table caption{text-align:left;font-size:var(--t-ui);color:var(--ink);padding-bottom:12px}
.facts-table th{text-align:left;font-weight:400;color:var(--soft);padding:10px 12px 10px 0;border-top:1px solid var(--line);vertical-align:top;width:44%}
.facts-table td{padding:10px 0;color:var(--ink);border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.c-body .facts .chip{margin-top:22px}
.dd-tldr{padding:26px 28px;background:var(--sand);font-size:var(--t-lede);line-height:1.6}
.dd-tldr .dd-eyebrow{font-size:var(--t-caption);color:var(--soft);margin-bottom:8px}
.dd-card h2,.faq h2{font-size:var(--t-h2);letter-spacing:-.025em;line-height:1.08;margin-top:88px;max-width:22ch}
.dd-card > p,.dd-next{margin-top:18px;max-width:68ch}
.dd-impact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:30px}
.dd-impact-card{background:var(--tile);padding:26px}
.dd-impact-card .v{font-size:var(--t-figure);letter-spacing:-.045em;line-height:.95;font-variant-numeric:tabular-nums}
.dd-impact-card .l{margin-top:12px;font-size:var(--t-caption);color:var(--soft);max-width:30ch;line-height:1.5}
.dd-chart{display:flex;align-items:flex-end;gap:36px;margin-top:30px;padding:28px 28px 0;background:var(--tile)}
.dd-bar{width:88px;margin-bottom:10px}
.dd-bar.before{height:120px;background:var(--faint)}
.dd-bar.after{height:147px;background:var(--amber)}
.dd-bar-val{font-size:var(--t-step);letter-spacing:-.02em}
.dd-bar-label{font-size:var(--t-caption);color:var(--soft);padding-bottom:24px}
.dd-delta{margin-top:12px;font-size:var(--t-small);color:var(--soft)}
.dd-delta strong{color:var(--ink)}
.dd-quote{margin-top:30px;padding:30px 32px;border-radius:26px;clip-path:inset(0 round 26px);background:var(--sand)}
.dd-quote p{font-size:var(--t-quote);letter-spacing:-.015em;line-height:1.28;margin:0 0 14px}
.dd-quote cite{font-style:normal;font-size:var(--t-caption);color:var(--soft)}
.faq-item{border-top:1px solid var(--line);padding:22px 0}
.faq-item h3{font-size:var(--t-faq);letter-spacing:-.012em;line-height:1.3;margin-top:0!important}
.faq-item p{margin-top:8px;color:var(--soft)}
.faq-item:first-of-type{margin-top:22px}
.dd-next{margin-top:56px;color:var(--soft)}
@media (max-width:900px){
  .c-hero{grid-template-columns:1fr;padding-top:88px;gap:28px}
  .c-hero .crumb{margin-bottom:18px}
  .c-hero .photo{border-radius:24px;clip-path:inset(0 round 24px)}
  .g-body.c-body{grid-template-columns:1fr}
  .c-body .facts{position:static;margin-bottom:40px}
  .dd-impact{grid-template-columns:1fr}
}

/* back to top at the foot of the desktop contents */
.g-toc a.g-top{margin-top:14px;color:var(--soft);text-decoration:underline;text-underline-offset:3px}
.g-toc a.g-top::before{display:none}

/* phones and tablets: the section bar under the nav (built by dawn-guide.js) */
.g-bar{display:none}
@media (max-width:900px){
  .g-bar{display:block;position:fixed;left:0;right:0;top:72px;z-index:55;background:color-mix(in srgb,var(--page) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);transform:translateY(-110%);opacity:0;visibility:hidden;pointer-events:none;transition:transform .35s var(--ease),opacity .25s,visibility 0s .35s}
  .g-bar.on{transform:none;opacity:1;visibility:visible;pointer-events:auto;transition:transform .35s var(--ease),opacity .25s,visibility 0s}
  .menu-open .g-bar{display:none}
  .g-bar-btn{display:flex;align-items:center;gap:10px;width:100%;padding:12px var(--gut);border:0;background:none;font:inherit;font-size:var(--t-ui);color:var(--ink);text-align:left;cursor:pointer}
  .g-bar-k{flex:none;color:var(--soft)}
  .g-bar-cur{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .g-bar-btn i{flex:none;width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .25s}
  .g-bar.open .g-bar-btn i{transform:translateY(2px) rotate(-135deg)}
  .g-bar-list{display:grid;max-height:min(60vh,420px);overflow-y:auto;padding:4px var(--gut) 14px;border-top:1px solid var(--line)}
  .g-bar-list[hidden]{display:none}
  .g-bar-list a{display:flex;align-items:center;gap:10px;padding:11px 0;color:var(--soft);text-decoration:none;font-size:var(--t-small)}
  .g-bar-list a::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--faint)}
  .g-bar-list a.active{color:var(--ink)}
  .g-bar-list a.active::before{background:var(--amber)}
  .g-bar-list .g-bar-top{color:var(--ink);border-bottom:1px solid var(--line);margin-bottom:4px}
  .g-bar-list .g-bar-top::before{background:none;width:auto;height:auto;content:"\2191"}
  /* jumps land below the nav and the bar */
  .dd-article h2,.dd-article h3,.g-main [id]{scroll-margin-top:136px}
}
@media (max-width:900px) and (prefers-reduced-motion:reduce){.g-bar{transition:none}}
/* on phones, article headings use the full line (the cap is for desktop reading width) */
@media (max-width:900px){.dd-article h2,.dd-card h2,.faq h2{max-width:none}}
