/* Landing template (T3) and ChatB2B podcast hub. Built on tokens.css, components.css, v3.css and tpl.css.
   SYSTEM.md rules held: no accent bars, no colored left borders, no gradient text, no middle-dot separators, 18px floor. */

/* hero: the home hero card, without the scroll-scrub pin */
html.mo .ld-hero, .ld-hero{height:auto}
.ld-hero__card{height:auto!important;min-height:0!important;max-height:none!important}
.ld-hero__text{display:grid;gap:var(--sp-5);align-content:center;padding:var(--v3-panel-pad)}
.ld-h1{max-width:18ch}
.ld-eyebrow{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4)}
.ld-hero__media{margin:0;position:relative;min-height:280px;background:var(--c-halo)}
.ld-hero__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ld-hero__media .ld-glass{position:absolute;inset:0}
@media (min-width:1024px){.ld-hero__card{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}.ld-hero__media{min-height:560px}}
@media (max-width:1023px){.ld-hero__media{aspect-ratio:16/10}.ld-hero__text{padding-bottom:var(--sp-6)}}
.ld-host{font-weight:var(--fw-semibold);margin:0}
.ld-trailer{display:block;background:var(--c-ink)}
.ld-trailer img{object-fit:contain!important}
.ld-trailer__label{position:absolute;left:var(--sp-5);bottom:var(--sp-5);display:flex;gap:var(--sp-3);background:var(--c-white);color:var(--c-ink);border-radius:var(--r-pill);padding:6px 16px;font:var(--fw-semibold) var(--fs-ui)/1.3 var(--font-body)}

/* Blender glass on a Halo panel (fallback 2) */
.ld-glass{display:grid;place-items:center;background:var(--c-halo);border-radius:inherit;overflow:hidden}
.ld-glass img{position:static!important;width:auto!important;height:auto!important;max-width:62%;max-height:78%;object-fit:contain}

/* lead, prose and features: heading left, text right on desktop */
.ld-lead .t-lead{max-width:40ch;font-size:clamp(24px,2.4vw,34px);line-height:1.3}
@media (min-width:1024px){.ld-split{display:grid;grid-template-columns:5fr 7fr;column-gap:var(--sp-9);align-items:start}.ld-split>.section-header{margin:0}}
.ld-features{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-6)}
.ld-features li{display:grid;gap:var(--sp-2);padding-bottom:var(--sp-6);border-bottom:var(--bw-hair) solid var(--line)}
.ld-features li:last-child{border-bottom:0;padding-bottom:0}
.ld-features p,.ld-prose p{margin:0;max-width:60ch}
.ld-prose{display:grid;gap:var(--sp-4)}

/* single sourced stat */
.ld-stat{margin-top:var(--sp-8);background:var(--bg-raised);border-radius:var(--r-xl);padding:var(--v3-panel-pad);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--sp-6)}
.ld-stat .stat__num{font:var(--fw-bold) clamp(64px,8vw,128px)/1 var(--font-display);letter-spacing:-.02em}
.ld-stat__label{font-size:var(--fs-body-l);max-width:40ch;margin:var(--sp-3) 0 0}
.ld-stat__src{font-size:var(--fs-ui);color:var(--text);opacity:.75;margin:var(--sp-3) 0 0}
.ld-stat__glass{width:clamp(120px,16vw,220px);height:auto;padding:var(--sp-4)}
@media (max-width:639px){.ld-stat{grid-template-columns:1fr}.ld-stat__glass{display:none}}
.ld-stats{margin-top:var(--sp-8)}

/* tinted band */
.ld-band{background:var(--panel);border-radius:var(--r-xl);padding:var(--v3-panel-pad)}

/* tool cards */
.ld-tools{list-style:none;margin:var(--sp-6) 0 0;padding:0;display:grid;gap:var(--sp-4);grid-template-columns:1fr}
@media (min-width:640px){.ld-tools{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.ld-tools--4{grid-template-columns:repeat(4,minmax(0,1fr))}.ld-tools--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ld-tool{background:var(--bg-raised);border-radius:var(--r-l);padding:var(--sp-3) var(--sp-3) var(--sp-5);display:grid;grid-template-rows:auto auto 1fr;gap:var(--sp-2)}
.ld-tool__img{display:block;aspect-ratio:4/3;border-radius:var(--r-m);overflow:hidden;margin-bottom:var(--sp-2)}
.ld-tool__img img{width:100%;height:100%;object-fit:cover}
.ld-tool>:not(.ld-tool__img){padding-inline:var(--sp-3)}
.ld-tool p{margin:0}

/* badges */
.ld-badges{list-style:none;margin:var(--sp-6) 0 0;padding:0;display:grid;gap:var(--sp-4);grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.ld-badge{background:var(--bg-raised);border-radius:var(--r-l);padding:var(--sp-5);display:grid;gap:var(--sp-2);align-content:start}
.ld-badge__img{height:120px;width:auto;max-width:100%;object-fit:contain;justify-self:start;margin-bottom:var(--sp-3)}
.ld-badge .ld-glass.ld-badge__img{width:120px;height:120px;border-radius:var(--r-m)}
.ld-badge .ld-glass img{max-width:90%;max-height:90%}
.ld-badge h3 a{color:inherit;text-decoration-thickness:1px;text-underline-offset:4px;display:inline-block;padding-block:8px;margin-block:-8px} /* 40px tap target (#349 item 13) */
.ld-badge p{margin:0}

/* people */
.ld-people{list-style:none;margin:var(--sp-6) 0 0;padding:0;display:grid;gap:var(--sp-4);grid-template-columns:1fr}
@media (min-width:768px){.ld-people{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1200px){.ld-people{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ld-person{background:var(--bg-raised);border-radius:var(--r-l);padding:var(--sp-3) var(--sp-3) var(--sp-5);display:grid;gap:var(--sp-4);align-content:start}
.ld-person>img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r-m);background:var(--c-halo)}
.ld-person>div{padding-inline:var(--sp-3);display:grid;gap:var(--sp-2)}
.ld-person p{margin:0}
.ld-person__role{font-weight:var(--fw-semibold);color:var(--accent)}
.ld-li{color:var(--text);display:inline-flex;margin-top:var(--sp-2)}
.ld-li:hover{color:var(--accent)}

/* image and text */
.ld-media{display:grid;gap:var(--sp-6);align-items:center}
@media (min-width:1024px){.ld-media{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-9)}}
.ld-media__img{margin:0;border-radius:var(--r-l);overflow:hidden;aspect-ratio:4/3;background:var(--c-halo)}
.ld-media__img img{width:100%;height:100%;object-fit:cover}
.ld-media__text{display:grid;gap:var(--sp-4);align-content:center}
.ld-media__text p{margin:0}

/* statement */
.ld-statement{display:grid;gap:var(--sp-4)}
.ld-statement .t-h1{max-width:24ch}

/* areas and gallery */
.ld-areas{list-style:none;margin:var(--sp-6) 0 0;padding:0;display:grid;gap:var(--sp-4);grid-template-columns:1fr}
@media (min-width:640px){.ld-areas{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.ld-areas{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ld-areas li{background:var(--bg-raised);border-radius:var(--r-l);padding:var(--sp-3) var(--sp-3) var(--sp-5);display:grid;gap:var(--sp-2);align-content:start}
.ld-areas__img{display:block;aspect-ratio:16/10;border-radius:var(--r-m);overflow:hidden;margin-bottom:var(--sp-2)}
.ld-areas__img img{width:100%;height:100%;object-fit:cover}
.ld-areas li>:not(.ld-areas__img){padding-inline:var(--sp-3);margin:0}
.ld-gallery{list-style:none;margin:var(--sp-6) 0 0;padding:0;display:grid;gap:var(--sp-4);grid-template-columns:1fr}
@media (min-width:768px){.ld-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ld-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-l)}

/* numbered steps */
.ld-steps-head{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-6)}
.ld-steps__glass{width:160px;height:160px;border-radius:var(--r-l);background:var(--bg-raised);flex:none}
.ld-steps__glass img{max-width:80%;max-height:80%}
@media (max-width:639px){.ld-steps__glass{display:none}}
.ld-steps{list-style:none;margin:var(--sp-6) 0 0;padding:0;display:grid;gap:var(--sp-4);grid-template-columns:1fr}
@media (min-width:768px){.ld-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1200px){.ld-steps{grid-template-columns:repeat(5,minmax(0,1fr))}}
.ld-steps li{background:var(--bg-raised);border-radius:var(--r-l);padding:var(--sp-5);display:grid;gap:var(--sp-2);align-content:start}
.ld-steps__n{font:var(--fw-semibold) var(--fs-ui)/1 var(--font-body);color:var(--accent)}
.ld-steps p{margin:0}

/* quote and labs */
.ld-quote .quote__body{padding:var(--v3-panel-pad)}
.ld-quote blockquote{margin:0;max-width:30ch}
.ld-labs{display:grid;gap:var(--sp-4);grid-template-columns:1fr;margin-top:var(--sp-6)}
@media (min-width:768px){.ld-labs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ld-labs__item{background:var(--bg-raised);border-radius:var(--r-l);padding:var(--sp-3) var(--sp-3) var(--sp-5);display:grid;gap:var(--sp-3);align-content:start}
.ld-labs__item>:not(.ld-labs__img){padding-inline:var(--sp-3);margin:0}
.ld-labs__img{display:block;aspect-ratio:16/10;border-radius:var(--r-m);overflow:hidden;position:relative}
.ld-labs__img>img{width:100%;height:100%;object-fit:cover}
.ld-labs__img .ld-glass{position:absolute;inset:0}
.ld-pending{font-weight:var(--fw-semibold)}

/* podcast */
.ld-plats .btn{min-height:44px}
.ld-podfeat .feature-x__media.is-glass img,.ep__img.is-glass img{object-fit:contain;padding:10%}
.ld-podfeat .feature-x__media{background:var(--c-ink)}
.ld-podfeat .feature-x__media img{object-fit:contain}
.ep__who{font-weight:var(--fw-semibold);margin:0}
.ld-eps{display:grid;gap:var(--sp-4);grid-template-columns:1fr;margin-top:var(--sp-5)}
@media (min-width:640px){.ld-eps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.ld-eps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ep{background:var(--bg-raised);border-radius:var(--r-l);padding:var(--sp-3) var(--sp-3) var(--sp-5);display:grid;gap:var(--sp-2);align-content:start}
.ep>:not(.ep__img){padding-inline:var(--sp-3);margin:0}
.ep__img{display:block;aspect-ratio:16/9;border-radius:var(--r-m);overflow:hidden;background:var(--c-ink);margin-bottom:var(--sp-2)}
.ep__img.is-glass{background:var(--c-halo)}
.ep__img img{width:100%;height:100%;object-fit:cover}
.ep__date{font-size:var(--fs-ui);color:var(--accent);font-weight:var(--fw-semibold)}
.ep__links{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-5);margin-top:var(--sp-2)!important}
.ep__links a{color:var(--text);font-weight:var(--fw-semibold);text-underline-offset:4px;min-height:24px}
.ld-wall{display:grid;gap:var(--sp-4)}
.ld-wall ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--sp-3)}
.ld-wall li{background:var(--bg-raised);border-radius:var(--r-pill);padding:8px 20px;font:var(--fw-semibold) var(--fs-ui)/1.3 var(--font-body)}
.ld-subs{display:grid;gap:var(--sp-4)}
.ld-sub .t-lead{margin:0}
.ld-guest{display:grid;gap:var(--sp-4)}
.ld-guest p{margin:0;max-width:52ch}
@media (max-width:1023px){.ld-hero__card{grid-template-columns:minmax(0,1fr)}}
.ld-h1{overflow-wrap:break-word;hyphens:manual}
@media (max-width:479px){.ld-h1{font-size:clamp(36px,10.5vw,56px)}}

/* Creative QA fixes, Oct 27 */
/* hero titles sit at one height on every service page: the text block is top-aligned with a fixed top padding */
@media (min-width:1024px){.ld-hero__text{align-content:start;padding-top:clamp(48px,5vw,72px)}.ld-hero__card{align-items:stretch}}
/* stat source line in Ink (no gray secondary text) */
.ld-stat__src{opacity:1}
/* room before tinted panels and image rows so sections never touch */
.ld .ld-band,.ld .ld-media,.ld .ld-stats{margin-top:var(--sp-9)}
.ld .ld-band+.ld-media,.ld .ld-media+.ld-band{margin-top:var(--sp-8)}
/* the ChatB2B artwork tile sits on Halo */
.ld-trailer{background:var(--c-halo)}
.ld-trailer img{object-fit:cover!important}
.ld-podfeat .feature-x__media{background:var(--c-halo)}
.ld-podfeat .feature-x__media img{object-fit:cover}
/* tool cards with a glass object */
.ld-tool__img .ld-glass{width:100%;height:100%}
.ld-tool__img .ld-glass img{max-width:70%;max-height:80%}
/* Labs steps: long step names wrap inside the card */
.ld-steps h3{overflow-wrap:normal;hyphens:none}
/* two stat tiles fill the row in equal halves */
@media (min-width:640px){.ld-stats--2{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ld-areas__img .ld-glass{width:100%;height:100%}
@media (min-width:768px){.ld-stats--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ld-badge__img{height:120px;width:auto;max-width:100%;object-fit:contain}
.ld-badge__none{display:block;height:120px}

/* The Drum's official logo is white artwork: it sits on an Ink plate at the same 120px badge height (no recolor) */
.ld-badge__plate{display:flex;align-items:center;justify-content:center;height:120px;width:120px;background:var(--c-ink);border-radius:var(--r-m);margin-bottom:var(--sp-3);padding:var(--sp-3)}
.ld-badge__plate .ld-badge__img{height:auto;width:100%;margin:0}

/* AA-2026-10-28-about-photo: the About team photo (1192 x 918) is never shown larger than its native size. It sits
   centered in its rounded frame, capped at 1192 px wide and 918 px tall; below that it fills the frame as before. */
.ld-hero__media:has(img[src*="about-us/header"]){background:var(--bg-raised)}
.ld-hero__media img[src*="about-us/header"]{inset:0;margin:auto;max-width:1192px;max-height:918px;border-radius:var(--r-l)}
