/* Thought Leadership v2 (inc/thought-leadership-v2.php, page-templates/tpl-thought-leadership-v2.php, assets/js/thought-leadership-v2.js). Shares the Company v2 base (.co2 tokens, hero, pills, buttons - copied from company-v2.css, keep in sync). The part above "below the fold" is inlined in by ss_co2_critical_css() (inc/company-v2.php). Reveal policy: nothing hidden, no entrances, UI transitions <= 150 ms. Glows = the shared gold token (inc/ss-glow.php), never blue. */ .co2{--navy:var(--ss-navy-deep);--navy2:var(--ss-navy-deep);--navy3:var(--ss-navy);--navy-line:var(--ss-navy-line);--gold:var(--ss-gold);--gold-ink:var(--ss-navy);--gold-soft:var(--ss-gold-soft);--goldg:var(--ss-gold-grad);--ink:var(--ss-ink);--ink2:var(--ss-ink-2);--ink3:var(--ss-ink-3);--line:var(--ss-line);--ground:var(--ss-ground);--mist:var(--ss-mist);--on-navy:var(--ss-on-navy);--red:var(--ss-bad);--green:var(--ss-ok);--green-soft:var(--ss-ok-soft);--font:"Proxima Nova","Helvetica Neue",Arial,sans-serif; --hdr:57px;background:#fff;color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip} @media (min-width:768px){.co2{--hdr:67px}} @media (min-width:1200px){.co2{--hdr:75px}} body.co2-page{margin:0;background:var(--ss-navy-deep)} body.co2-page .site-content{padding-top:0!important} .co2 *,.co2 *:before,.co2 *:after{box-sizing:border-box} .co2 :where(h1,h2,h3,h4){margin:0;font-family:var(--font);color:inherit;text-wrap:balance;letter-spacing:-.02em;text-transform:none} .co2 :where(p,figure,blockquote){margin:0} .co2 :where(ul,ol){margin:0;padding:0;list-style:none} .co2 :where(img){max-width:100%;height:auto;display:block} .co2 :where(a){color:inherit;text-decoration:none} .co2 :where(button){font-family:inherit} .co2 :where(b){font-weight:700} .co2-w{max-width:1312px;margin:0 auto;padding-inline:64px;position:relative} .co2-w--narrow{max-width:1164px} .co2-w--faq{max-width:1008px} @media (max-width:900px){.co2-w{padding-inline:24px}} @media (max-width:560px){.co2-w{padding-inline:16px}} .co2-sec{padding-block:104px;position:relative} @media (max-width:760px){.co2-sec{padding-block:68px}} .co2-dark{background:var(--navy);color:#fff} .co2-ground{background:var(--ground)} /* gold radial burst = the shared token from inc/ss-glow.php (case-study v2 hero), never blue */ .co2-glow{background-color:var(--ss-navy-deep);background-image:var(--ss-glow-gold),var(--ss-glow-navy)} .co2-glow--soft{background-color:var(--navy);background-image:var(--ss-glow-gold-soft)} .co2-pill{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:var(--navy);font-size:13px;font-weight:700;line-height:1.2;padding:6px 15px;border-radius:999px;letter-spacing:.02em;justify-self:start} .co2-pill--ghost{background:rgba(var(--ss-gold-rgb),.1);color:var(--gold);border:1px solid rgba(var(--ss-gold-rgb),.45)} .co2-h2{font-size:clamp(30px,3.6vw,46px);font-weight:700;line-height:1.1} .co2-h2 .hl{padding-bottom:.14em;margin-bottom:-.14em;padding-right:.06em;margin-right:-.06em;color:var(--ss-navy);background:var(--ss-blue-shine);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent} .co2-dark .co2-h2 .hl{padding-bottom:.14em;margin-bottom:-.14em;padding-right:.06em;margin-right:-.06em;color:var(--gold);background:var(--ss-gold-shine);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent} .co2-lede{font-size:18px;color:var(--ink2);max-width:62ch} .co2-dark .co2-lede{color:var(--on-navy)} .co2-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:700 16px/1 var(--font);border:0;border-radius:999px;padding:17px 28px;cursor:pointer;background:var(--goldg);color:var(--navy)!important;box-shadow:0 10px 24px rgba(var(--ss-gold-end-rgb),.25);white-space:nowrap;transition:filter .15s} .co2-btn svg{width:16px;height:16px;flex:none} .co2-btn--line{background:transparent;color:#fff!important;border:1.5px solid rgba(255,255,255,.4);box-shadow:none;transition:border-color .15s,color .15s} .co2-btn--line:hover{border-color:var(--gold);color:var(--gold)!important;filter:none} .co2-stars{color:var(--gold);letter-spacing:2px;font-size:15px;line-height:1} /* ---------- hero ---------- */ .co2-hero{color:#fff;position:relative;overflow:hidden;padding-top:var(--hdr)} .co2-hero__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:64px;align-items:center;padding-block:80px 96px} .co2-hero__copy{display:grid;justify-items:start} .co2-hero h1{font-size:clamp(40px,5.1vw,68px);line-height:1.03;font-weight:700;margin:22px 0;letter-spacing:-.02em;color:#fff} .co2-hero h1 em{padding-bottom:.14em;margin-bottom:-.14em;padding-right:.06em;margin-right:-.06em;font-style:normal;color:var(--gold);background:var(--ss-gold-shine);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent} .co2-hero .co2-lede{font-size:19px;color:var(--on-navy)} .co2-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px} .co2-proof{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:32px;font-size:14.5px;color:var(--mist);align-self:stretch} .co2-proof b{color:#fff;font-weight:700} .co2-proof .co2-stars{margin-right:6px;font-size:14px} .co2-hero__pic{position:relative} .co2-hero__main{border-radius:24px;overflow:hidden;aspect-ratio:3/2;background:var(--navy2);box-shadow:0 30px 70px rgba(0,0,0,.45)} .co2-hero__main img{width:100%;height:100%;object-fit:cover} .co2-hero__inset{position:absolute;right:-18px;top:-26px;width:34%;aspect-ratio:1/1;border-radius:18px;overflow:hidden;border:5px solid var(--ss-navy-deep);box-shadow:0 18px 40px rgba(0,0,0,.4);background:var(--navy2)} .co2-hero__inset img{width:100%;height:100%;object-fit:cover} .co2-hero__tag{position:absolute;left:20px;bottom:20px;background:rgba(var(--ss-navy-deep-rgb),.8);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:12px 16px;font-size:14px;line-height:1.35;color:#fff} .co2-hero__tag b{display:block;color:var(--gold);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase} @media (max-width:1000px){.co2-hero__in{grid-template-columns:1fr;gap:48px;padding-block:48px 64px}.co2-hero__inset{right:-6px}} @media (max-width:560px){ .co2-hero h1{font-size:40px;margin:18px 0} .co2-hero .co2-lede{font-size:17px} .co2-ctas .co2-btn{flex:1 1 auto} .co2-hero__inset{width:30%;top:-18px;border-width:4px} .co2-hero__tag{left:12px;bottom:12px;padding:9px 12px;font-size:13px} } .tl2-hero__in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:64px;align-items:center;padding-block:80px 88px} .tl2-speakers{display:grid;gap:14px} .tl2-sp{display:grid;grid-template-columns:96px minmax(0,1fr);gap:18px;align-items:center;padding:16px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);color:#fff;transition:border-color .15s} .tl2-sp .tl2-sp__img{width:96px;height:96px;border-radius:14px;object-fit:cover;background:var(--navy2)} .tl2-sp b{display:block;font-size:19px;font-weight:800;margin-bottom:2px} .tl2-sp span{font-size:14px;line-height:1.45;color:var(--on-navy)} .tl2-sp em{display:block;font-style:normal;color:var(--gold);font-weight:700;font-size:13px;margin-top:6px} .tl2-book{display:grid;grid-template-columns:64px minmax(0,1fr);gap:18px;align-items:center;padding:16px;border-radius:18px;background:rgba(var(--ss-gold-rgb),.07);border:1px solid rgba(var(--ss-gold-rgb),.3);color:var(--on-navy);font-size:14px;line-height:1.45} .tl2-book .tl2-book__img{width:64px;height:auto;border-radius:4px;box-shadow:0 6px 16px rgba(0,0,0,.4)} .tl2-book small{display:block;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);font-weight:700} .tl2-book b{display:block;color:#fff;font-size:16px} .tl2-book .co2-link{color:#fff;margin-top:8px;font-size:14px} .tl2-bar{position:sticky;top:var(--hdr);z-index:5;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 6px 18px rgba(var(--ss-navy-deep-rgb),.05);scroll-margin-top:var(--hdr)} .tl2-bar__in{display:flex;flex-wrap:wrap;align-items:end;gap:10px 16px;padding-block:14px} .tl2-bar label{display:grid;gap:3px;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)} .tl2-bar select{font:600 14.5px/1.2 var(--font);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:9px 34px 9px 12px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5L6 8l3.5-3.5' fill='none' stroke='%230b1722' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center/11px;-webkit-appearance:none;appearance:none;min-width:150px;max-width:100%;cursor:pointer} .tl2-bar select:focus-visible{outline:3px solid var(--gold);outline-offset:1px} .tl2-bar__n{margin-left:auto;font-size:14px;color:var(--ink2);display:flex;gap:12px;align-items:center;padding-bottom:8px} .tl2-bar__n b{color:var(--ink)} .tl2-bar__n button,.tl2-empty button{border:0;background:none;padding:0;font:700 14px/1 var(--font);color:var(--gold-ink);text-decoration:underline;cursor:pointer} @media (max-width:1000px){.tl2-hero__in{grid-template-columns:1fr;gap:40px;padding-block:48px 56px}} @media (max-width:700px){ .tl2-bar{position:static} .tl2-bar__in{display:grid;grid-template-columns:1fr 1fr;gap:10px} .tl2-bar select{min-width:0;width:100%} .tl2-bar__n{grid-column:1/-1;margin:0;padding:0} .tl2-sp{grid-template-columns:72px minmax(0,1fr);gap:14px;padding:12px} .tl2-sp .tl2-sp__img{width:72px;height:72px} } /* first row of talk cards is above the fold on desktop */ .tl2-talks{padding-block:48px 96px} .tl2-h2{font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);font-weight:700;margin-bottom:22px} .tl2-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 26px} .tl2-card{display:grid;grid-template-rows:auto 1fr;min-width:0;scroll-margin-top:calc(var(--hdr) + 90px)} .tl2-card[hidden]{display:none} .tl2-card__media{position:relative;border-radius:16px;overflow:hidden;background:var(--navy2);aspect-ratio:16/9} .tl2-card__media a,.tl2-play{display:block;width:100%;height:100%} .tl2-card__img,.tl2-card__ph{display:block;width:100%;height:100%;object-fit:cover} .tl2-play{border:0;padding:0;margin:0;cursor:pointer;position:relative;background:none} .tl2-play__btn{position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:rgba(var(--ss-navy-deep-rgb),.78);border:2px solid rgba(255,255,255,.85);color:#fff;display:grid;place-items:center;transition:background-color .15s,border-color .15s} .tl2-play__btn svg{width:26px;height:26px;margin-left:3px} .tl2-card__bd{display:flex;flex-direction:column;gap:6px;padding-top:14px;min-width:0} .tl2-card__meta{font-size:13px;color:var(--ink3);font-variant-numeric:tabular-nums} .tl2-card h3{font-size:18.5px;line-height:1.3;font-weight:800;letter-spacing:-.01em} .tl2-card__ev{font-size:14px;font-weight:700;color:var(--gold-ink)} .tl2-card__ex{font-size:14.5px;color:var(--ink2);line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden} .tl2-card__ft{margin-top:auto;padding-top:6px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;color:var(--ink3)} @media (max-width:1100px){.tl2-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media (max-width:640px){.tl2-grid{grid-template-columns:1fr;gap:30px}.tl2-talks{padding-block:32px 64px}} .co2-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--navy);border-bottom:2px solid var(--gold);padding-bottom:2px;white-space:nowrap} .co2-link svg{width:14px;height:14px} .tl2-bar__n button[hidden]{display:none} /* ==== below the fold ==== */ /* ---------- section heads (always stacked: pill, heading, intro, link) ---------- */ .co2-head{display:grid;gap:18px;margin-bottom:52px;max-width:780px;justify-items:start} .co2-center{text-align:center;justify-items:center;margin-inline:auto} .co2-center .co2-pill{justify-self:center} .co2-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--navy);border-bottom:2px solid var(--gold);padding-bottom:2px;white-space:nowrap} .co2-dark .co2-link{color:#fff} .co2-link svg{width:14px;height:14px;transition:transform .15s} @media (max-width:640px){.co2-head{margin-bottom:36px}.co2-lede{font-size:16.5px}} /* ---------- talk cards (rest) ---------- */ .tl2-card.is-target .tl2-card__media{box-shadow:0 0 0 3px var(--gold)} .tl2-play:hover .tl2-play__btn,.tl2-play:focus-visible .tl2-play__btn{background:var(--gold);border-color:var(--gold);color:var(--navy)} .tl2-frame{display:block;width:100%;height:100%;border:0} .tl2-card__badge{position:absolute;left:12px;top:12px;background:var(--gold);color:var(--navy);font-size:12px;font-weight:800;padding:5px 10px;border-radius:999px} .tl2-empty{font-size:16px;color:var(--ink2);padding:40px 0;text-align:center} .tl2-empty[hidden]{display:none} /* ---------- conference logo band ---------- */ .tl2-lband{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:34px 48px} .tl2-lband li{display:grid;justify-items:center;gap:8px} .tl2-lband a{display:grid;justify-items:center;gap:8px;opacity:.85;transition:opacity .15s} .tl2-lband a:hover{opacity:1} .tl2-lband img{width:auto;max-width:220px} .tl2-lband small{font-size:12px;color:var(--mist);font-variant-numeric:tabular-nums} @media (max-width:640px){.tl2-lband{gap:26px 30px;justify-content:center}.tl2-lband img{max-width:150px;height:auto!important;max-height:40px}} /* ---------- press ---------- */ .tl2-plist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;border-top:1px solid var(--line)} .tl2-plist li{display:grid;gap:4px;padding:18px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.45} .tl2-plist__who{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink);font-weight:700} .tl2-plist a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px} .tl2-press__foot{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:36px} @media (max-width:760px){.tl2-plist{grid-template-columns:1fr}} @media (prefers-reduced-motion:reduce){.co2 *{transition:none!important}}