/* Brand Strategy — Figma 817:6531 */
body[data-chapter="strategy"] { --dock-y: 168; --dock-x: 160; }
.fh.th-lilac { color: var(--m-navy); }
.fh.th-lilac .fh__panel { box-shadow: inset 0 0 0 1px rgba(255,255,255,.55), 0 50px 120px -50px rgba(14,19,60,.35); background: rgba(255,255,255,.08); }
.fh.th-lilac .fh__s img { filter: blur(7px) saturate(1.1) brightness(1.05); }
.st-chips { max-width: 1340px; gap: 10px 12px; }
.st-chips .chip { font-size: clamp(12px, calc(17 * var(--fx)), 17px); padding: .45em .8em; }

/* floating acts navigator */
.st-acts {
  position: fixed; left: 50%; bottom: 18px; z-index: 58; translate: -50% 140%; display: flex; gap: 4px; padding: 6px; border-radius: 999px;
  background: rgba(14,19,60,.78); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4);
  box-shadow: 0 20px 50px -20px rgba(14,19,60,.6), inset 0 0 0 1px rgba(255,255,255,.12); transition: translate .7s var(--ease); max-width: calc(100vw - 24px); overflow-x: auto; scrollbar-width: none;
}
.st-acts::-webkit-scrollbar { display: none; }
.st-acts.is-on { translate: -50% 0; }
.st-acts a { display: inline-flex; align-items: center; gap: .5em; padding: .65em 1em; border-radius: 999px; color: rgba(255,255,255,.72); font: 500 13px/1 var(--font-display); white-space: nowrap; transition: background .3s, color .3s; }
.st-acts a i { font-style: normal; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 6px; background: rgba(255,255,255,.12); font-size: 11px; }
.st-acts a:hover { color: #fff; background: rgba(255,255,255,.08); }
.st-acts a.is-active { color: var(--m-navy); background: #fff; }
.st-acts a.is-active i { background: var(--m-purple); color: #fff; }
@media (max-width: 900px) { .st-acts a { font-size: 0; gap: 0; padding: .55em; } .st-acts a i { font-size: 11px; } .st-acts a.is-active { font-size: 12px; gap: .5em; padding: .55em .9em; } }

.st-credit { margin-top: var(--s-5); text-align: right; font-weight: 300; opacity: .8; }
.st-credit b { font-weight: 700; }
.st-pill { display: inline-flex; padding: .55em 1.1em; border-radius: 999px; background: rgba(255,255,255,.55); font: 600 var(--t-small)/1 var(--font-display); color: var(--m-navy); }
.st-pill--dark { background: rgba(255,255,255,.14); color: #fff; }
.st-link { font: inherit; color: var(--m-purple); text-decoration: underline; text-underline-offset: 3px; }
.st-big-list { font-size: var(--t-lead); gap: .7em; }

/* archetypes */
.st-arch { min-height: 100svh; }
.st-arch__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--s-6); align-items: center; }
.st-arch__dial svg { width: 100%; max-width: 640px; margin-inline: auto; overflow: visible; }
.ad-seg { cursor: pointer; transition: transform .6s var(--ease), opacity .4s; transform-box: view-box; transform-origin: 0 0; }
.ad-seg:focus { outline: none; }
.ad-seg:focus-visible path { stroke: #fff; stroke-width: 3; }
#arch-dial.has-sel .ad-seg:not(.is-sel) { opacity: .45; }
.ad-label { font: 600 26px var(--font-display); fill: #fff; pointer-events: none; }
.ad-label tspan.n { font-size: 44px; font-weight: 700; }
.ad-hub { font: 700 34px var(--font-display); fill: #fff; }
.st-arch__panel { display: grid; gap: var(--s-4); }
.st-arch__panel .seg { --line: rgba(255,255,255,.3); --fg: #fff; --bg: var(--m-navy); --fg-soft: rgba(255,255,255,.7); justify-self: start; }
.st-arch__card { display: grid; gap: var(--s-3); padding: var(--s-5); border-radius: var(--r-card); background: rgba(255,255,255,.06); }
.st-arch__pct { font: 700 clamp(56px, calc(120 * var(--fx)), 120px)/1 var(--font-display); letter-spacing: -.04em; color: var(--m-lilac-2); }
.st-arch__pct b { font-weight: 700; }
.st-arch__card .sp-list { font-size: var(--t-lead); gap: .6em; }

/* outcome */
.st-outcome__cards { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--s-4); }
.st-card { padding: var(--s-5); border-radius: var(--r-card); background: #fff; box-shadow: 0 30px 80px -40px rgba(14,19,60,.35); display: grid; gap: var(--s-3); align-content: start; }
.st-card--a { grid-column: 6 / span 7; }
.st-card--b { grid-column: 1 / span 6; margin-top: calc(var(--s-6) * -0.5); }

/* voice & tone */
.st-voice { overflow: clip; min-height: 100svh; }
.st-voice__cursor { position: absolute; right: -4%; top: 10%; width: min(58vw, 980px); opacity: .55; mix-blend-mode: screen; pointer-events: none; }
.st-voice__grid { position: relative; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s-6); align-items: center; }
.st-voice__text { display: grid; gap: var(--s-4); }
.st-voice__words { display: flex; gap: 10px; flex-wrap: wrap; }
.st-voice__words .st-pill { background: rgba(255,255,255,.35); }
.st-voice__tracks { display: grid; grid-template-columns: repeat(5, 1fr); gap: clamp(10px, 2vw, 32px); }
.vt { display: grid; grid-template-rows: auto 1fr auto auto; justify-items: center; gap: 12px; }
.vt__lbl { font: 600 var(--t-small)/1 var(--font-display); color: var(--m-navy); transition: color .3s, transform .4s var(--ease); }
.vt__lbl.is-near { color: var(--m-purple); transform: scale(1.08); }
.vt__track { position: relative; width: clamp(54px, 5vw, 86px); height: clamp(320px, 52svh, 560px); border-radius: 999px; background: linear-gradient(180deg, rgba(255,255,255,.45), rgba(255,255,255,.15)); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.6), 0 30px 50px -30px rgba(14,19,60,.4); cursor: grab; touch-action: none; }
.vt__track:focus-visible { outline: 3px solid var(--m-purple); outline-offset: 4px; }
.vt__fill { position: absolute; left: 6px; right: 6px; top: 6px; height: calc((100% - 12px) * var(--v)); border-radius: 999px; background: linear-gradient(180deg, rgba(101,47,234,.15), rgba(101,47,234,.45)); transition: height .5s var(--ease); }
.vt__orb { position: absolute; left: 50%; top: calc(6px + (100% - 12px) * var(--v)); width: clamp(40px, 3.8vw, 64px); aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff, #D0C7FF 45%, #652FEA 100%); box-shadow: 0 0 0 6px rgba(255,255,255,.35), 0 14px 30px -6px rgba(101,47,234,.7); transition: top .5s var(--ease); }
.vt.is-drag .vt__orb, .vt.is-drag .vt__fill { transition: none; }
.vt__lean { font: 500 var(--t-micro)/1.3 var(--font-display); color: var(--fg-soft); text-align: center; min-height: 2.6em; }

/* statements */
.st-statement { min-height: 80svh; display: flex; align-items: center; }
.st-statement__grid { position: relative; display: grid; gap: var(--s-5); width: 100%; }
.st-statement__text { font: 500 clamp(26px, calc(52 * var(--fx)), 56px)/1.25 var(--font-display); letter-spacing: -.02em; max-width: 26ch; }
.st-statement__shapes { justify-self: end; }
.st-statement__shapes .shapes { font-size: clamp(22px, calc(34 * var(--fx)), 34px); }

/* core business challenge */
.st-challenge__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s-7); }
.st-challenge__left { display: grid; gap: var(--s-4); align-content: start; }
.st-stat { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 .2em; }
.st-stat__n, .st-stat__pct { font: 700 clamp(90px, calc(200 * var(--fx)), 220px)/.9 var(--font-display); letter-spacing: -.05em; color: var(--m-violet); font-variant-numeric: tabular-nums; }
.st-stat p { flex-basis: 100%; font: 600 var(--t-lead)/1.3 var(--font-display); }
.st-challenge__right { display: grid; gap: var(--s-5); align-content: center; }
.st-quote { font: 600 clamp(24px, calc(44 * var(--fx)), 48px)/1.2 var(--font-display); letter-spacing: -.02em; color: rgba(255,255,255,.6); }
.st-quote--hl { color: #fff; background: linear-gradient(transparent 62%, rgba(101,47,234,.75) 62%) no-repeat 0 0 / 0% 100%; transition: background-size 1.4s var(--ease) .4s; display: inline; }
.st-quote--hl.is-in { background-size: 100% 100%; }

/* why now */
.st-whynow__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s-6); }
.st-whynow__head { position: sticky; top: calc(var(--bar-h) + var(--s-4)); align-self: start; display: grid; gap: var(--s-5); }
.st-giant { font: 700 clamp(72px, calc(190 * var(--fx)), 200px)/.92 var(--font-display); letter-spacing: -.05em; }
.st-whynow__story { display: grid; gap: var(--s-6); padding-block: 12vh 18vh; font-size: clamp(22px, calc(40 * var(--fx)), 42px); line-height: 1.3; font-family: var(--font-display); letter-spacing: -.015em; }
.st-whynow__list { font-weight: 600; }

/* meant to do */
.st-success { display: grid; gap: var(--s-3); align-content: start; padding: var(--s-5); }

/* objectives funnel */
.st-funnel { position: relative; display: grid; justify-items: center; gap: 14px; padding-block: var(--s-5); isolation: isolate; }
.st-funnel__blob { position: absolute; z-index: -1; left: 50%; top: 50%; translate: -50% -50%; width: min(60vw, 900px); opacity: .9; pointer-events: none; }
.fl {
  position: relative; width: var(--w); min-height: clamp(120px, calc(190 * var(--fx)), 190px); padding: var(--s-4) calc(var(--s-6) + 6%); display: grid; align-content: center; gap: .6em; text-align: left;
  clip-path: polygon(0 0, 100% 0, calc(100% - 5%) 100%, 5% 100%); background: var(--fill); color: var(--tc);
  -webkit-backdrop-filter: blur(22px) saturate(1.2); backdrop-filter: blur(22px) saturate(1.2); transition: min-height .6s var(--ease), filter .4s, transform .6s var(--ease);
}
.fl:hover, .fl:focus-visible { filter: brightness(1.06); transform: translateY(-3px); }
.fl:focus-visible { outline: none; box-shadow: inset 0 0 0 3px #fff; }
.fl__t { display: flex; align-items: center; gap: .6em; font: 700 var(--t-h4)/1.2 var(--font-display); }
.fl__t svg { width: .9em; height: .9em; flex: none; transition: transform .6s var(--ease); }
.fl__b { font-size: var(--t-body); max-width: 60ch; max-height: 0; opacity: 0; overflow: hidden; transition: max-height .6s var(--ease), opacity .4s; }
.fl[aria-expanded="true"] .fl__b { max-height: 12em; opacity: 1; }
.fl[aria-expanded="true"] .fl__t svg { transform: rotate(90deg); }

/* scope grid */
.st-scope__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(8px, 1vw, 16px); margin-top: var(--s-5); }
.st-scope__photo, .st-scope__tile { aspect-ratio: 1; border-radius: var(--r-card); overflow: hidden; }
.st-scope__photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); transition: transform 1s var(--ease), filter .6s; }
.st-scope__photo:hover img { transform: scale(1.06); filter: grayscale(.4); }
.st-scope__tile { position: relative; display: grid; align-content: space-between; padding: clamp(12px, 1.4vw, 24px); background: var(--m-purple); color: #fff; box-shadow: inset 0 0 0 0 #fff; transition: box-shadow .3s, transform .5s var(--ease), background .3s; }
.st-scope__tile:hover, .st-scope__tile:focus-visible { box-shadow: inset 0 0 0 2px #fff; transform: translateY(-4px); background: var(--m-purple-deep); }
.st-scope__tile img { width: clamp(30px, 3vw, 56px); height: auto; filter: brightness(0) invert(1); }
.st-scope__n { position: absolute; top: clamp(12px, 1.4vw, 24px); right: clamp(12px, 1.4vw, 24px); font: 700 var(--t-small)/1 var(--font-display); opacity: .8; }
.st-scope__t { font: 600 clamp(13px, calc(20 * var(--fx)), 20px)/1.2 var(--font-display); }

/* risks */
.st-risks__grid { display: grid; grid-template-columns: 1fr auto; gap: var(--s-6); align-items: center; }
.st-risks__shapes .shapes { font-size: clamp(26px, calc(46 * var(--fx)), 46px); gap: .7em; }
.st-assume { display: grid; gap: var(--s-2); counter-reset: a; }
.st-assume li { display: grid; grid-template-columns: 3.2em 1fr; align-items: baseline; padding: var(--s-3) 0; border-top: 1px solid rgba(14,19,60,.18); font: 600 var(--t-h4)/1.25 var(--font-display); letter-spacing: -.01em; }
.st-assume li span { font: 600 var(--t-micro)/1 var(--font-display); letter-spacing: .14em; color: var(--m-purple); }

/* research */
.st-research__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4); }
.st-rcol { display: grid; gap: var(--s-3); align-content: start; padding: var(--s-5); border-radius: var(--r-card); background: rgba(255,255,255,.08); }
.st-rcol__n { font: 700 var(--t-h2)/1 var(--font-display); color: rgba(255,255,255,.35); }
.st-areas { display: flex; flex-wrap: wrap; gap: 8px; }


/* platforms */
.st-plat { overflow: clip; }
.st-plat__cursor { position: absolute; right: -6%; top: 0; width: min(54vw, 900px); opacity: .45; mix-blend-mode: screen; pointer-events: none; }
.st-plat__sub { margin: calc(var(--s-5) * -1) 0 var(--s-5); color: var(--m-lilac); }
.st-plat__ui { position: relative; display: grid; grid-template-columns: minmax(220px, 3fr) minmax(0, 8fr); gap: var(--s-5); }
.st-plat__tabs { display: grid; gap: 10px; align-content: start; }
.pt { display: flex; align-items: center; gap: 14px; padding: 12px 18px 12px 12px; border-radius: 18px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.12); font: 600 var(--t-body)/1 var(--font-display); color: #fff; text-align: left; transition: background .3s, box-shadow .3s, transform .4s var(--ease); }
.pt img { width: 44px; height: 44px; border-radius: 12px; object-fit: contain; background: #fff; }
.pt:hover { box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.5); transform: translateX(4px); }
.pt[aria-selected="true"] { background: var(--m-purple); box-shadow: inset 0 0 0 1.5px var(--m-purple); }
.st-plat__panel { position: relative; min-height: 420px; padding: var(--s-5); border-radius: var(--r-panel); background: linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.03)); -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s-5); }
.pp__main { display: grid; gap: var(--s-4); align-content: start; }
.pp__h { font: 700 var(--t-h2)/1 var(--font-display); }
.pp__rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); }
.pp__k { font: 600 var(--t-micro)/1 var(--font-display); letter-spacing: .14em; text-transform: uppercase; color: var(--m-lilac); margin-bottom: .6em; }
.pp__logo { width: clamp(90px, 10vw, 180px); height: auto; align-self: start; filter: drop-shadow(0 20px 30px rgba(0,0,0,.35)); animation: float 6s ease-in-out infinite; }

/* pillars */
.st-pillars { overflow: clip; }
.st-pillars__ribbon { position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: min(90vw, 1500px); pointer-events: none; opacity: .9; }
.st-pillars__grid { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5) var(--s-7); }
.pl { display: grid; gap: var(--s-2); padding: var(--s-5); border-radius: var(--r-card); background: rgba(101,47,234,.55); -webkit-backdrop-filter: blur(20px) saturate(1.3); backdrop-filter: blur(20px) saturate(1.3); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.25); color: #fff; text-align: left; transition: transform .6s var(--ease), box-shadow .3s, background .3s; }
.pl:nth-child(even) { margin-top: var(--s-7); }
.pl:hover, .pl:focus-visible { box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.7); transform: translateY(-6px); }
.pl[aria-expanded="true"] { background: rgba(14,19,60,.7); }
.pl__n { font: 600 var(--t-micro)/1 var(--font-display); letter-spacing: .16em; text-transform: uppercase; color: var(--m-lilac-2); }
.pl__t { font: 700 var(--t-h3)/1.15 var(--font-display); }
.pl__more { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .6s var(--ease); }
.pl__more > div { overflow: hidden; }
.pl[aria-expanded="true"] .pl__more { grid-template-rows: 1fr; }
.pl__cta { display: inline-flex; align-items: center; gap: .5em; font: 600 var(--t-micro)/1 var(--font-display); letter-spacing: .08em; text-transform: uppercase; opacity: .75; margin-top: var(--s-2); }
.pl__cta::before { content: "+"; font-size: 1.6em; line-height: .6; transition: transform .4s var(--ease); }
.pl[aria-expanded="true"] .pl__cta::before { transform: rotate(45deg); }

/* content OS */
.st-cos__steps { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4); }
.st-cos__line { position: absolute; left: 8%; right: 8%; top: 64px; height: 3px; background: #E7E8F2; border-radius: 3px; overflow: hidden; }
.st-cos__line i { display: block; height: 100%; width: var(--p, 0%); background: linear-gradient(90deg, var(--m-violet), var(--m-purple)); transition: width .8s var(--ease); }
.cs { position: relative; display: grid; gap: var(--s-3); align-content: start; padding: var(--s-5); min-height: clamp(320px, 40vw, 520px); border-radius: var(--r-card); background: #F0F0F0; text-align: left; transition: background .4s, transform .6s var(--ease), box-shadow .3s; box-shadow: inset 0 0 0 1.5px transparent; }
.cs:hover { box-shadow: inset 0 0 0 1.5px rgba(14,19,60,.25); }
.cs[aria-pressed="true"] { background: var(--m-purple); color: #fff; transform: translateY(-10px); }
.cs img { width: clamp(64px, 6vw, 100px); height: auto; transition: filter .4s; }
.cs[aria-pressed="true"] img { filter: brightness(0) invert(1); }
.cs__t { font: 700 var(--t-h3)/1.15 var(--font-display); margin-top: auto; }

/* partnerships */
.st-partner__intro { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s-6); align-items: end; margin-bottom: var(--s-6); }
.st-partner__goal { font: 600 var(--t-h4)/1.3 var(--font-display); margin-top: .5em; }
.st-partner__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); }
.st-ptile { display: grid; gap: var(--s-2); align-content: start; padding: var(--s-4); border-radius: var(--r-card); background: rgba(255,255,255,.06); font-size: var(--t-small); }
.st-ptile .t-h4 { color: var(--m-lilac-2); }

/* campaign bento */
.st-camp__bento { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: var(--s-3); }
.st-cb { display: grid; gap: var(--s-2); align-content: start; padding: var(--s-5); border-radius: var(--r-panel); font-size: var(--t-small); transition: transform .6s var(--ease); }
.st-cb:hover { transform: translateY(-6px); }
.st-cb__quote { font: 600 var(--t-body)/1.35 var(--font-display); margin-top: var(--s-2); }
.st-moments { display: grid; gap: 10px; margin-block: var(--s-2); }
.st-moment { display: grid; gap: 4px; padding: var(--s-3); border-radius: 14px; background: rgba(255,255,255,.4); }
.st-moment b { font: 700 var(--t-h4)/1.1 var(--font-display); }
.st-events { display: flex; gap: 10px; margin-top: auto; }
.st-events span { padding: .8em 1.2em; border-radius: 14px; background: rgba(255,255,255,.1); font: 800 var(--t-h4)/1 var(--font-display); letter-spacing: .04em; }

/* PESTLE */
.st-pestle-intro { padding-bottom: var(--s-5); }
.st-pl { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.plt { position: relative; display: grid; gap: 6px; padding: var(--s-3) var(--s-3) var(--s-4); border-radius: var(--r-card); background: #F2F3F9; text-align: left; transition: background .35s, color .35s, transform .5s var(--ease), box-shadow .3s; box-shadow: inset 0 0 0 1.5px transparent; overflow: hidden; }
.plt:hover { box-shadow: inset 0 0 0 1.5px rgba(14,19,60,.25); transform: translateY(-4px); }
.plt b { font: 800 clamp(48px, calc(110 * var(--fx)), 120px)/.9 var(--font-display); letter-spacing: -.04em; }
.plt span { font: 600 var(--t-micro)/1.25 var(--font-display); }
.plt[aria-selected="true"] { background: var(--c); color: var(--tc); }
.st-pestle { position: relative; overflow: clip; color: var(--tc, #fff); background: var(--c, var(--m-purple)); transition: background .6s var(--ease), color .6s; }
.st-pestle__tex { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; transition: opacity .6s; }
.st-pestle__in { position: relative; padding: var(--s-7) var(--gutter); display: grid; gap: var(--s-6); }
.pp-head { display: flex; justify-content: space-between; align-items: end; gap: var(--s-4); flex-wrap: wrap; }
.pp-head .t-eyebrow { opacity: .75; }
.pp-head h3 { font: 700 var(--t-h2)/1.05 var(--font-display); letter-spacing: -.02em; margin-top: .3em; }
.pp-nav { display: flex; gap: 8px; }
.pp-nav button { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; box-shadow: inset 0 0 0 1.5px currentColor; opacity: .7; transition: opacity .25s, background .25s; }
.pp-nav button:hover { opacity: 1; background: rgba(255,255,255,.12); }
.pp-nav svg { width: 18px; height: 18px; }
.pp-part h4 { font: 700 var(--t-h3)/1.15 var(--font-display); margin-bottom: var(--s-3); }
.pp-table { display: grid; border-radius: var(--r-card); overflow: hidden; background: color-mix(in srgb, var(--tc) 8%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.pp-row { display: grid; grid-template-columns: minmax(180px, 3fr) minmax(0, 8fr); gap: var(--s-4); padding: var(--s-3) var(--s-4); border-top: 1px solid color-mix(in srgb, var(--tc) 14%, transparent); transition: background .3s; }
.pp-row:first-child { border-top: 0; }
.pp-row:hover { background: color-mix(in srgb, var(--tc) 8%, transparent); }
.pp-row b { font: 700 var(--t-body)/1.3 var(--font-display); }
.st-callout { display: grid; grid-template-columns: auto 1fr; gap: var(--s-3); padding: var(--s-4); border-radius: var(--r-card); background: color-mix(in srgb, var(--tc, #fff) 10%, transparent); box-shadow: inset 4px 0 0 var(--accent-bar, #fff); }
.st-callout img { width: 28px; height: 28px; filter: brightness(0) invert(var(--inv, 1)); }
.st-callout .label { margin-bottom: .3em; }
.st-callout--wide { grid-template-columns: 1fr; margin-top: var(--s-5); max-width: 900px; }

/* matrix */
.st-matrix { overflow: clip; }
.st-matrix__blob { position: absolute; right: -10%; top: 0; width: min(60vw, 1000px); opacity: .7; mix-blend-mode: lighten; pointer-events: none; }
.st-mx__tools { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; margin: var(--s-4) 0; }
.st-mx__tools .seg { --line: rgba(255,255,255,.3); --fg: #fff; --bg: var(--m-purple); --fg-soft: rgba(255,255,255,.75); }
.st-mx__hint { opacity: .7; margin-left: auto; }
.st-mx { position: relative; display: grid; border-radius: var(--r-card); overflow: hidden; background: rgba(255,255,255,.08); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); }
.mx-row { display: grid; grid-template-columns: 1.3fr 1fr 1fr 2.4fr; gap: var(--s-3); align-items: center; padding: var(--s-3) var(--s-4); text-align: left; border-top: 1px solid rgba(255,255,255,.14); transition: background .3s; font-size: var(--t-small); }
.mx-row:first-child { border-top: 0; }
.mx-head { background: rgba(43,0,150,.5); font: 600 var(--t-micro)/1.2 var(--font-display); letter-spacing: .1em; text-transform: uppercase; }
button.mx-row:hover, button.mx-row:focus-visible { background: rgba(255,255,255,.1); }
.mx-row b { font: 700 var(--t-body)/1.2 var(--font-display); display: flex; align-items: center; gap: .6em; }
.mx-row b i { font-style: normal; width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; background: #fff; color: var(--m-purple); font-size: 15px; }
.lvl { display: inline-flex; align-items: center; gap: .5em; font: 600 var(--t-small)/1 var(--font-display); }
.lvl em { display: inline-flex; gap: 3px; }
.lvl em i { width: 7px; height: 16px; border-radius: 2px; background: rgba(255,255,255,.22); }
.lvl em i.on { background: var(--lc, #fff); }

/* executive insight: four forces converge */
.st-conv { position: relative; display: grid; grid-template-columns: 1fr minmax(160px, .6fr) 1fr; grid-template-rows: auto auto; gap: var(--s-4); align-items: center; margin-top: var(--s-6); }
.st-conv svg.cv-lines { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.cv-lines path { fill: none; stroke: rgba(255,255,255,.35); stroke-width: 1.5; stroke-dasharray: 6 8; transition: stroke .3s; }
.cv-lines path.is-hot { stroke: #fff; stroke-dasharray: none; stroke-width: 2.5; }
.cv-core { grid-column: 2; grid-row: 1 / span 2; justify-self: center; width: clamp(140px, 14vw, 220px); aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; text-align: center; background: radial-gradient(circle at 35% 30%, #fff, #D0C7FF 40%, #652FEA 100%); color: var(--m-navy); font: 700 var(--t-h4)/1.1 var(--font-display); box-shadow: 0 0 0 14px rgba(255,255,255,.1), 0 0 80px rgba(208,199,255,.5); animation: pulse 4s ease-in-out infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 22px rgba(255,255,255,.06), 0 0 110px rgba(208,199,255,.65); } }
.cv { position: relative; z-index: 1; display: grid; gap: .5em; padding: var(--s-4); border-radius: var(--r-card); background: rgba(14,19,60,.35); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); transition: background .3s, transform .5s var(--ease); }
.cv:hover { background: rgba(14,19,60,.6); transform: scale(1.02); }
.cv b { font: 700 var(--t-h4)/1.2 var(--font-display); }
.cv p { font-size: var(--t-small); opacity: .9; }

/* brand core */
.st-essence__lines { display: grid; gap: var(--s-4); margin-top: var(--s-3); }
.st-essence__line { font: 600 clamp(28px, calc(64 * var(--fx)), 68px)/1.12 var(--font-display); letter-spacing: -.03em; max-width: 24ch; }
.st-essence__k { display: block; font: 600 var(--t-micro)/1 var(--font-display); letter-spacing: .16em; text-transform: uppercase; color: var(--m-purple); margin-bottom: .8em; }
.st-ptile2 { display: grid; gap: var(--s-3); padding: var(--s-5); }
.st-corewhy__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--s-6); }
.st-vm { display: flex; min-height: 90svh; }
.st-vm__half { flex: 1 1 0; display: grid; align-content: start; gap: var(--s-5); padding: var(--s-8) var(--gutter); transition: flex-grow .9s var(--ease); }
.st-vm:hover .st-vm__half:hover { flex-grow: 1.45; }
.st-vm__h { display: flex; align-items: center; gap: .45em; font: 600 var(--t-h2)/1 var(--font-display); letter-spacing: -.02em; }
.st-vm__h img { height: .82em; width: auto; filter: brightness(0) invert(1); }
.st-vm .seg { --line: rgba(255,255,255,.3); --fg: #fff; --bg: var(--m-navy); --fg-soft: rgba(255,255,255,.7); justify-self: start; }
.st-vm__p { max-width: 40ch; }
.st-vm__body { display: grid; gap: var(--s-3); max-width: 58ch; }
.st-vm__body p:first-child { font: 600 var(--t-lead)/1.35 var(--font-display); }

.st-values__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s-6); align-items: start; }
.st-ladder { display: grid; gap: 10px; }
.ld { width: 100%; display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: var(--s-3); padding: 14px 18px 14px 14px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1.5px rgba(14,19,60,.12), 0 18px 30px -24px rgba(159,173,211,.9); font: 600 var(--t-h4)/1 var(--font-display); text-align: left; transition: box-shadow .3s, transform .5s var(--ease), background .3s; }
.ld i { font-style: normal; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--m-purple); color: #fff; font: 700 16px/1 var(--font-display); }
.ld:hover { box-shadow: inset 0 0 0 1.5px var(--m-navy); transform: translateX(6px); }
.ld[aria-selected="true"] { background: var(--m-navy); color: #fff; box-shadow: none; }
.ld[aria-disabled="true"] { cursor: default; opacity: .55; transform: none; box-shadow: inset 0 0 0 1.5px rgba(14,19,60,.08); }
.ld small { font: 500 var(--t-micro)/1 var(--font-display); opacity: .6; }
.st-values__panel { display: grid; gap: var(--s-3); padding: var(--s-5); border-radius: var(--r-card); background: #F4F6FD; min-height: 380px; align-content: start; }

@media (max-width: 900px) {
  .st-arch__grid, .st-voice__grid, .st-challenge__grid, .st-whynow__grid, .st-plat__ui, .st-partner__intro, .st-corewhy__grid, .st-values__grid { grid-template-columns: 1fr; }
  .st-whynow__head { position: static; }
  .st-outcome__cards { grid-template-columns: 1fr; } .st-card--a, .st-card--b { grid-column: 1; margin: 0; }
  .st-scope__grid { grid-template-columns: repeat(3, 1fr); }
  .st-research__grid, .st-partner__grid, .st-camp__bento, .st-cos__steps, .st-pillars__grid { grid-template-columns: 1fr; }
  .pl:nth-child(even) { margin-top: 0; }
  .st-pl { grid-template-columns: repeat(3, 1fr); }
  .pp-row { grid-template-columns: 1fr; gap: .4em; }
  .mx-row { grid-template-columns: 1fr 1fr; } .mx-head { display: none; }
  .st-conv { grid-template-columns: 1fr; } .cv-core { grid-column: 1; grid-row: auto; } .st-conv svg.cv-lines { display: none; }
  .st-vm { flex-direction: column; }
  .st-plat__panel { grid-template-columns: 1fr; } .pp__rows { grid-template-columns: 1fr; }
  .st-cos__line { display: none; }
  .st-voice__tracks { gap: 6px; } .vt__track { height: 300px; }
}
/* legibility over the PESTLE textures */
.pp-table { background: color-mix(in srgb, var(--c) 78%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc) 16%, transparent); }
.st-pestle .st-callout { background: color-mix(in srgb, var(--c) 82%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.st-pestle__tex { opacity: .55 !important; }

/* ===================== v2: every slide visible ===================== */
/* archetypes: both cards side by side */
.st-arch__panel .seg button[aria-pressed="true"] { background: #fff; color: var(--m-navy); }
.st-arch__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.st-arch__card { transition: background .4s, transform .6s var(--ease), box-shadow .4s; }
.st-arch__card.is-sel { background: rgba(126,105,245,.28); transform: translateY(-6px); box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); }
.st-arch__card .st-arch__pct { font-size: clamp(48px, calc(96 * var(--fx)), 96px); }
.st-arch__card .sp-list { font-size: var(--t-body); }
.st-arch__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }

/* funnel: every layer open */
.fl .fl__b { max-height: none; opacity: 1; }
.fl .fl__t svg { transform: none; }
.st-funnel.has-sel .fl:not([aria-pressed="true"]) { opacity: .5; }
.fl[aria-pressed="true"] { transform: scale(1.02); }

/* platform overview grid (Figma 3 x 2) */
.pg-grid { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 24px); margin-top: var(--s-5); }
.pg-icon, .pg-card { aspect-ratio: 1.25; border-radius: var(--r-card); transition: transform .6s var(--ease), box-shadow .3s, background .3s; }
.pg-icon { display: grid; place-items: center; background: var(--m-purple); box-shadow: inset 0 0 0 1.5px transparent; }
.pg-icon img { width: 42%; height: auto; transition: transform .8s var(--ease); }
.pg-icon:hover { box-shadow: inset 0 0 0 1.5px #fff; transform: translateY(-6px); }
.pg-icon:hover img { transform: scale(1.12) rotate(-6deg); }
.pg-card { display: grid; align-content: start; gap: .4em; padding: var(--s-4); color: #fff; background: linear-gradient(160deg, rgba(255,255,255,.16), rgba(255,255,255,.04)); -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.2); font-size: var(--t-small); }
.pg-card b { font: 700 var(--t-h3)/1.1 var(--font-display); margin-bottom: .4em; }
.pg-card .pp__k { margin: .8em 0 0; }
.pg-card:hover { box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.7); transform: translateY(-6px); }

/* one slide per platform */
.st-pslide { min-height: 88svh; display: flex; align-items: center; box-shadow: inset 0 -2px 0 var(--m-lilac); }
.st-pslide__grid { width: 100%; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s-7); align-items: center; }
.st-pslide--rev .st-pslide__text { order: 2; }
.st-pslide--rev .st-pslide__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.st-pslide__text { display: grid; gap: var(--s-4); }
.st-pslide__logo { justify-self: center; width: min(100%, 420px); transition: transform .7s var(--ease); }
.st-pslide__logo img { width: 100%; height: auto; filter: drop-shadow(0 40px 50px rgba(14,19,60,.25)); animation: float 7s ease-in-out infinite; }

/* pillars: content types always visible */
.pl { cursor: default; }
.pl__list { margin-top: var(--s-2); padding-top: var(--s-3); border-top: 1px solid rgba(255,255,255,.2); }
.pl__list .sp-list { font-size: var(--t-small); }

/* horizontal decks (desktop): one Figma slide per panel */
.st-deck { position: relative; overflow: hidden; }
.st-deck__track { display: flex; width: max-content; will-change: transform; }
.st-slide { position: relative; flex: 0 0 100vw; width: 100vw; min-height: 100svh; display: flex; align-items: center; overflow: hidden; }
.st-slide__in { position: relative; z-index: 1; width: 100%; max-width: 1500px; padding: calc(var(--bar-h) + var(--s-5)) var(--gutter) var(--s-7); display: grid; gap: var(--s-4); align-content: center; }
.st-slide__in > * { max-width: 62ch; }
.st-slide__in .t-h1 { max-width: 14ch; }
.st-slide__in--two { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-7); align-items: start; }
.st-slide__in--two > * { display: grid; gap: var(--s-3); align-content: start; }
.st-slide__in--split { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s-7); align-items: center; }
.st-slide__n { font: 600 var(--t-micro)/1 var(--font-display); letter-spacing: .2em; opacity: .65; }
.st-slide__statement { font: 600 clamp(24px, calc(48 * var(--fx)), 52px)/1.2 var(--font-display); letter-spacing: -.02em; max-width: 24ch !important; }
.st-slide__shapes { position: absolute; right: var(--gutter); top: 50%; translate: 0 -50%; }
.st-slide__shapes .shapes { font-size: clamp(26px, calc(48 * var(--fx)), 48px); gap: .7em; }
.st-areas2 { display: grid; gap: 0; }
.st-areas2 li { display: grid; grid-template-columns: 3em 1fr; align-items: baseline; padding: var(--s-3) 0; border-top: 1px solid rgba(255,255,255,.22); font: 600 var(--t-h3)/1.2 var(--font-display); }
.st-areas2 li span { font: 600 var(--t-micro)/1 var(--font-display); letter-spacing: .14em; opacity: .7; }
.st-diamonds { position: absolute; right: 4%; bottom: 6%; width: min(40vw, 620px); height: auto; pointer-events: none; animation: float 9s ease-in-out infinite; }
.st-deck .st-moments { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px !important; }
.st-deck .st-moment { padding: var(--s-4); }
.st-deck .st-events span { font-size: var(--t-h3); padding: .8em 1.4em; }
@media (max-width: 900px), (prefers-reduced-motion: reduce) {
  .st-deck__track { flex-direction: column; width: 100%; }
  .st-slide { flex: none; width: 100%; min-height: 0; }
  .st-slide__in { padding: var(--s-7) var(--gutter); }
  .st-slide__in--two, .st-slide__in--split { grid-template-columns: 1fr; }
  .st-slide__shapes, .st-diamonds { display: none; }
  .st-deck .st-moments { grid-template-columns: 1fr; }
}

/* PESTLE: six visible categories + sticky letters */
.st-pestle-intro { padding-bottom: var(--s-5); }
.st-pestle-wrap { position: relative; }
.st-pl-nav { position: sticky; top: calc(var(--bar-h) + 10px); z-index: 30; display: flex; gap: 6px; width: max-content; max-width: calc(100vw - 24px); margin: 0 auto -64px; padding: 6px; border-radius: 999px; background: rgba(255,255,255,.75); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: 0 20px 40px -24px rgba(14,19,60,.5), inset 0 0 0 1px rgba(14,19,60,.08); overflow-x: auto; scrollbar-width: none; }
.st-pl-nav a { display: inline-flex; align-items: center; gap: .5em; padding: .5em .9em .5em .5em; border-radius: 999px; font: 500 13px/1 var(--font-display); color: var(--m-navy); white-space: nowrap; transition: background .3s, color .3s; }
.st-pl-nav a b { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--c); color: var(--tc); font: 800 15px/1 var(--font-display); }
.st-pl-nav a:hover { background: rgba(14,19,60,.06); }
.st-pl-nav a.is-active { background: var(--m-navy); color: #fff; }
.st-pc { position: relative; scroll-margin-top: 60px; }
.st-pc__band { position: relative; overflow: hidden; background: #fff; color: var(--m-navy); padding: calc(var(--s-7) + 40px) 0 var(--s-5); }
.st-pc__band .t-eyebrow { color: var(--m-purple); }
.st-pc__band .t-h2 { margin-top: .3em; }
.st-pc__letter { position: absolute; right: var(--gutter); top: 50%; translate: 0 -46%; font: 800 clamp(140px, calc(320 * var(--fx)), 340px)/.8 var(--font-display); color: var(--c); opacity: .14; pointer-events: none; }
.st-pc .st-pestle__in { padding: var(--s-7) var(--gutter); gap: var(--s-6); }
.st-pc .st-pestle__tex { inset: -8% 0; height: 116%; }
@media (max-width: 900px) { .st-pl-nav a span { display: none; } .st-pl-nav a { padding: .35em; } }

/* core values: sticky ladder + every value visible */
.st-values__grid { align-items: start; }
.st-ladder { position: sticky; top: calc(var(--bar-h) + var(--s-4)); }
a.ld { text-decoration: none; }
.ld[aria-current="true"] { background: var(--m-navy); color: #fff; box-shadow: none; transform: translateX(8px); }
.st-values__list { display: grid; gap: var(--s-4); }
.st-vcard { display: grid; gap: var(--s-3); padding: var(--s-5); border-radius: var(--r-card); background: #F4F6FD; scroll-margin-top: calc(var(--bar-h) + 20px); }

/* vision: both horizons as a two-step timeline */
.st-horizon { display: grid; gap: var(--s-5); position: relative; padding-left: 28px; }
.st-horizon::before { content: ""; position: absolute; left: 6px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(var(--m-violet), rgba(255,255,255,.2)); }
.st-horizon li { position: relative; display: grid; gap: .5em; }
.st-horizon li::before { content: ""; position: absolute; left: -28px; top: .35em; width: 14px; height: 14px; border-radius: 3px; transform: rotate(45deg); background: var(--m-violet); box-shadow: 0 0 0 5px rgba(126,105,245,.25); }
@media (max-width: 900px) { .st-arch__cards, .pg-grid { grid-template-columns: 1fr 1fr; } .st-pslide__grid, .st-pslide--rev .st-pslide__grid { grid-template-columns: 1fr; } .st-pslide--rev .st-pslide__text { order: 0; } .st-pslide__logo { width: 50%; } }
@media (max-width: 900px) { .st-pl-nav { position: relative; top: auto; margin: 0 auto var(--s-3); } .st-pc__band { padding-top: var(--s-6); } }