/* ══════════════════════════════════════════════════════════════════════════
   css/our-mission.css — /our-mission  (prefix fw-om)

   A promise, not a brochure. Its devices are its own, on purpose (the
   owner's rule: every page about 80% unique): a manifesto that writes
   itself word by word, a round window ringed by turning words, promise
   panels that open wide, a segmented switch, a proof ledger with dotted
   leaders, a master and detail question reader, and a signature that draws
   itself. No shared masthead band, no jump bar, no accordion here.

   House rules, all kept: bright grounds only, depth from blurred brand
   light; no max-width on sections or text; colour only from :root (each
   promise maps a family onto --ac-*); no boxed cards, structure from fade
   dividers, type and space; photographs may round their own corners;
   28px / 14px gutters; type sized in vh on desktop so a band holds.

   THE APP LAYER (≤768px) is designed, not stacked: the promises become a
   story deck with progress bars, tap zones and autoplay; the audience
   switch is a full-width segmented control; the ledger reads like a
   settings list; the questions are a swipe row of chips.

   Motion lives in § 9 and only runs once custom/js/our-mission.js has added
   .fw-om-anim; prefers-reduced-motion turns all of it off.
   ══════════════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════
   00 · TOKENS & PRIMITIVES
   ══════════════════════════════════════════════════════════════ */

.fw-om-page{
	--pad:28px;
	--article-top:116px;
	--ink:var(--dk-d);
	/* Page defaults for the accent pair links read; a promise overrides them. */
	--ac-ink:var(--pk-ink);
	--ac-dd:var(--pk-dd);
	--line:color-mix(in srgb, var(--dk) 9%, transparent);
	--line-soft:color-mix(in srgb, var(--dk) 5.5%, transparent);
	--fade-x:linear-gradient(90deg, transparent, var(--line) 10%, var(--line) 90%, transparent);
	--fade-y:linear-gradient(180deg, transparent, var(--line) 18%, var(--line) 82%, transparent);
	--sec:clamp(28px, 4.8vh, 58px);
	--gap:clamp(24px, 3.4vw, 72px);
	--ease:cubic-bezier(.22,1,.36,1);
	--ease-soft:cubic-bezier(.16,1,.3,1);
	--ease-pop:cubic-bezier(.34,1.56,.64,1);
	background:var(--wh);
	-webkit-text-size-adjust:100%
}

/* A promise's colour family. */
.fw-om-ac--pk{--ac:var(--pk);--ac-d:var(--pk-d);--ac-dd:var(--pk-dd);--ac-ink:var(--pk-ink);--ac-l:var(--pk-l);--ac-l2:var(--pk-l2);--ac-ring:var(--pk-ring)}
.fw-om-ac--bl{--ac:var(--bl);--ac-d:var(--bl-d);--ac-dd:var(--bl-dd);--ac-ink:var(--bl-ink);--ac-l:var(--bl-l);--ac-l2:var(--bl-l2);--ac-ring:var(--bl-ring)}
.fw-om-ac--mt{--ac:var(--mt);--ac-d:var(--mt-d);--ac-dd:var(--mt-dd);--ac-ink:var(--mt-ink);--ac-l:var(--mt-l);--ac-l2:var(--mt-l2);--ac-ring:var(--mt-ring)}
.fw-om-ac--pu{--ac:var(--pu);--ac-d:var(--pu-d);--ac-dd:var(--pu-dd);--ac-ink:var(--pu-ink);--ac-l:var(--pu-l);--ac-l2:var(--pu-l2);--ac-ring:var(--pu-ring)}

.fw-om{display:block;position:relative}
.fw-om-page em{font-family:var(--ff)}
.fw-om .fw-ico{stroke-width:1.6}
.fw-om-inner{position:relative;z-index:1;width:100%;padding-inline:var(--pad)}

.fw-om-eyebrow{
	display:flex;align-items:center;gap:10px;margin:0;
	font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--g5)
}
.fw-om-eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--pk);box-shadow:0 0 0 4px var(--pk-l);flex-shrink:0}
.fw-om-eyebrow--c{justify-content:center}
.fw-om-h2{
	margin:clamp(8px, 1.2vh, 14px) 0 0;font-family:var(--ff);
	font-size:clamp(24px, 3.9vh, 42px);font-weight:500;line-height:1.08;letter-spacing:-.035em;color:var(--ink);text-wrap:balance
}
.fw-om-lead{margin:clamp(10px, 1.6vh, 16px) 0 0;font-size:clamp(14.5px, 2vh, 17px);font-weight:300;line-height:1.65;color:var(--g6);text-wrap:pretty}

.fw-om-btn{
	display:inline-flex;align-items:center;justify-content:center;gap:9px;
	min-height:clamp(46px, 5.8vh, 54px);padding:0 26px;border:0;border-radius:100px;cursor:pointer;
	font-family:var(--ff);font-size:14.5px;font-weight:600;white-space:nowrap;
	color:var(--wh);background:linear-gradient(100deg, var(--pk), var(--pk-d) 45%, var(--pk-dd));box-shadow:var(--pk-glow);
	transition:box-shadow .3s, transform .25s var(--ease)
}
.fw-om-btn i{font-size:13px;transition:transform .3s var(--ease)}
.fw-om-btn:hover{color:var(--wh);box-shadow:var(--pk-glow-lg);transform:translateY(-1px)}
.fw-om-btn:hover i{transform:translateX(3px)}
.fw-om-btn--ghost{color:var(--ink);background:var(--wh);box-shadow:inset 0 0 0 1px var(--line), 0 10px 22px -16px var(--ink-a40)}
.fw-om-btn--ghost:hover{color:var(--pk-ink);background:var(--pk-wash);box-shadow:inset 0 0 0 1px var(--pk-ring)}
.fw-om-link{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;font-weight:600;color:var(--ac-ink);transition:gap .3s var(--ease)}
.fw-om-link i{font-size:12px}
.fw-om-link:hover{gap:12px;color:var(--ac-dd)}

/* Ambient light: blurred brand discs in a clipped sibling layer. */
.fw-om-fx{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.fw-om-fx i{position:absolute;display:block;aspect-ratio:1;border-radius:50%;width:clamp(300px, 34vw, 600px);filter:blur(110px);opacity:.11}
.fw-om-fx i:first-child{top:-12%;left:-8%;background:var(--pk)}
.fw-om-fx i:last-child{bottom:-20%;right:6%;background:var(--pu)}

.fw-om img.lazy{opacity:0;transition:opacity .6s var(--ease-soft)}
.fw-om img.lazy-loaded,
.fw-om img.lazy-error{opacity:1}

/* ══════════════════════════════════════════════════════════════
   01 · §1 THE MANIFESTO
   ══════════════════════════════════════════════════════════════ */

.fw-om-hero{position:relative;overflow:hidden;padding:clamp(18px, 3vh, 36px) 0 clamp(26px, 4.4vh, 50px);background:linear-gradient(180deg, var(--wh), var(--paper-p))}
.fw-om-hero__grid{display:grid;grid-template-columns:minmax(0, 7fr) minmax(0, 5fr);column-gap:var(--gap);align-items:center}
.fw-om-crumb{margin-bottom:clamp(10px, 1.8vh, 18px)}
.fw-om-h1{
	display:flex;align-items:center;gap:12px;margin:0;font-family:var(--ff);
	font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--pk-ink)
}
.fw-om-h1__sun{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-size:17px;color:var(--wh);background:linear-gradient(135deg, var(--pk), var(--pu));box-shadow:0 10px 24px -12px var(--pk)}

/* The vow: each word its own span, so it can be written in. */
.fw-om-vow{
	margin:clamp(10px, 1.8vh, 18px) 0 0;font-family:var(--ff);
	font-size:clamp(28px, 5vh, 58px);font-weight:400;line-height:1.14;letter-spacing:-.035em;color:var(--ink);text-wrap:balance
}
.fw-om-w{--i:0;display:inline-block}
.fw-om-w.is-mark{
	font-weight:600;color:var(--ac-dd);
	background:linear-gradient(90deg, var(--ac-l2), var(--ac-l)) no-repeat left 88% / 100% .3em;
	padding-inline:.04em
}

.fw-om-tokens{display:flex;flex-wrap:wrap;margin:clamp(14px, 2.4vh, 26px) 0 0;padding:0;list-style:none}
.fw-om-tokens li{position:relative;padding:4px clamp(12px, 1.4vw, 22px)}
.fw-om-tokens li:first-child{padding-left:0}
.fw-om-tokens li + li::before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:1px;background:var(--fade-y)}
.fw-om-token{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:var(--g7);transition:color .25s}
.fw-om-token > span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-size:15px;color:var(--ac-ink);background:var(--ac-l);transition:transform .35s var(--ease-pop), background .3s, color .3s}
.fw-om-token:hover{color:var(--ac-ink)}
.fw-om-token:hover > span{transform:scale(1.1) rotate(-6deg);color:var(--wh);background:var(--ac)}

/* The window: a round photograph, ringed by the four promise words. */
.fw-om-portal{position:relative;margin:0 auto clamp(30px, 5vh, 50px);width:clamp(240px, min(28vw, 44vh), 420px);aspect-ratio:1}
.fw-om-portal__ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fw-om-portal__ring text{font-family:var(--ff);font-size:12.5px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;fill:var(--pk-ink)}
.fw-om-portal__win{
	position:absolute;inset:12.5%;overflow:hidden;border-radius:50%;
	box-shadow:0 0 0 10px var(--wh), 0 0 0 11px var(--pk-ring), 0 40px 80px -36px var(--pk)
}
.fw-om-portal__win img{display:block;width:100%;height:100%;object-fit:cover}
.fw-om-portal__cap{
	position:absolute;left:50%;bottom:-6px;transform:translate(-50%, 100%);width:max-content;
	display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;font-size:12.5px;color:var(--g6)
}
.fw-om-portal__cap b{font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--g7)}


/* ══════════════════════════════════════════════════════════════
   02 · §2 FOUR PROMISES — panels that open wide
   ══════════════════════════════════════════════════════════════ */

.fw-om-promises{position:relative;padding:var(--sec) 0}
.fw-om-head{margin-bottom:clamp(14px, 2.2vh, 26px)}
.fw-om-deck{--om-story:6s;position:relative;padding-inline:var(--pad)}
.fw-om-deck__bars,
.fw-om-deck__hint{display:none}
.fw-om-deck__track{display:flex;gap:clamp(10px, 1vw, 16px);height:clamp(330px, 48vh, 500px)}

.fw-om-panel{position:relative;display:flex;flex:.55 1 0;min-width:0;transition:flex .85s var(--ease)}
.fw-om-panel.is-open{flex:4.2 1 0}
.fw-om-panel__fig{position:relative;flex:1 1 100%;min-width:0;margin:0;overflow:hidden;border-radius:clamp(20px, 2vw, 30px);background:var(--g1);transition:flex-basis .85s var(--ease)}
.fw-om-panel.is-open .fw-om-panel__fig{flex:0 0 46%}
.fw-om-panel__fig img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease-soft)}
.fw-om-panel:not(.is-open) .fw-om-panel__fig img{transform:scale(1.08)}
.fw-om-panel__fig::after{
	content:'';position:absolute;inset:0;pointer-events:none;
	background:linear-gradient(180deg, transparent 38%, color-mix(in srgb, var(--ac-dd) 72%, transparent));transition:opacity .6s
}
.fw-om-panel.is-open .fw-om-panel__fig::after{opacity:.35}

/* The tab covers the strip: a number up top, the word written upward. */
.fw-om-panel__tab{
	position:absolute;z-index:2;top:0;left:0;bottom:0;width:100%;
	display:flex;flex-direction:column;justify-content:space-between;align-items:center;
	padding:18px 0 22px;border:0;background:none;cursor:pointer;color:var(--wh);font-family:var(--ff);text-align:center
}
.fw-om-panel.is-open .fw-om-panel__tab{width:46%;align-items:flex-start;padding:18px 20px;cursor:default}
.fw-om-panel__num{font-size:12px;font-weight:700;letter-spacing:.14em;padding:6px 10px;border-radius:100px;background:color-mix(in srgb, var(--wh) 22%, transparent);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.fw-om-panel__word{writing-mode:vertical-rl;transform:rotate(180deg);font-size:clamp(17px, 2.4vh, 22px);font-weight:600;letter-spacing:.02em;white-space:nowrap;transition:opacity .4s}
.fw-om-panel.is-open .fw-om-panel__word{opacity:0}

.fw-om-panel__body{
	flex:0 0 0;min-width:0;overflow:hidden;opacity:0;
	display:flex;flex-direction:column;justify-content:center;padding:0;
	transition:flex-basis .85s var(--ease), opacity .4s, padding .85s var(--ease)
}
.fw-om-panel.is-open .fw-om-panel__body{flex:1 1 54%;opacity:1;padding:0 clamp(8px, 1vw, 16px) 0 clamp(22px, 2.6vw, 48px);transition-delay:0s, .35s, 0s}
.fw-om-panel__ico{display:grid;place-items:center;width:clamp(44px, 5.6vh, 54px);height:clamp(44px, 5.6vh, 54px);border-radius:50%;font-size:clamp(20px, 2.6vh, 24px);color:var(--ac-ink);background:var(--ac-l)}
.fw-om-panel__kick{margin:clamp(12px, 2vh, 20px) 0 0;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ac-ink)}
.fw-om-panel__t{margin:6px 0 0;font-family:var(--ff);font-size:clamp(26px, 4.4vh, 46px);font-weight:500;line-height:1.05;letter-spacing:-.035em;color:var(--ink);text-wrap:balance}
.fw-om-panel__lead{margin:clamp(10px, 1.8vh, 18px) 0 0;font-size:clamp(16px, 2.3vh, 20px);font-weight:500;line-height:1.45;color:var(--ac-dd);text-wrap:pretty}
.fw-om-panel__text{margin:clamp(8px, 1.4vh, 14px) 0 0;font-size:clamp(14px, 1.9vh, 16px);font-weight:300;line-height:1.7;color:var(--g6);text-wrap:pretty}
.fw-om-panel__body .fw-om-link{margin-top:clamp(12px, 2.2vh, 22px)}

/* ══════════════════════════════════════════════════════════════
   03 · §3 WHO IT SERVES — the segmented switch
   ══════════════════════════════════════════════════════════════ */

.fw-om-for{position:relative;padding:var(--sec) 0;background:linear-gradient(180deg, var(--paper-p), var(--wh))}
.fw-om-for__top{display:grid;grid-template-columns:minmax(0, 6fr) minmax(0, 6fr);column-gap:var(--gap);align-items:end;margin-bottom:clamp(14px, 2.4vh, 28px)}
.fw-om-seg{
	--n:3;--at:0;
	position:relative;display:grid;grid-template-columns:repeat(var(--n), minmax(0, 1fr));justify-self:end;width:clamp(300px, 38vw, 560px);
	padding:5px;border-radius:100px;background:var(--g0);box-shadow:inset 0 0 0 1px var(--line)
}
.fw-om-seg[data-on="1"]{--at:1}
.fw-om-seg[data-on="2"]{--at:2}
.fw-om-seg__b{
	position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:8px;
	min-height:46px;padding:0 14px;border:0;border-radius:100px;background:none;cursor:pointer;
	font-family:var(--ff);font-size:14px;font-weight:500;white-space:nowrap;color:var(--g6);transition:color .3s
}
.fw-om-seg__b .fw-ico{font-size:17px}
.fw-om-seg__b.is-on{color:var(--pk-ink);font-weight:600}
.fw-om-seg__thumb{
	position:absolute;z-index:0;top:5px;bottom:5px;left:5px;width:calc((100% - 10px) / var(--n));border-radius:100px;
	background:var(--wh);box-shadow:0 8px 22px -12px var(--ink-a40), 0 0 0 1px var(--line-soft);
	transform:translateX(calc(var(--at) * 100%));transition:transform .5s var(--ease)
}

.fw-om-pane{display:grid;grid-template-columns:minmax(0, 6fr) minmax(0, 6fr);column-gap:var(--gap);align-items:center}
.fw-om-pane[hidden]{display:none}
.fw-om-pane__h{margin:0;font-family:var(--ff);font-size:clamp(26px, 4.2vh, 44px);font-weight:500;line-height:1.08;letter-spacing:-.035em;color:var(--ink);text-wrap:balance}
.fw-om-pane__body{margin:clamp(10px, 1.8vh, 18px) 0 clamp(18px, 3vh, 30px);font-size:clamp(15px, 2.1vh, 18px);font-weight:300;line-height:1.65;color:var(--g6);text-wrap:pretty}
.fw-om-pane__pts{margin:0;padding:0;list-style:none;counter-reset:pt}
.fw-om-pane__pts li{position:relative;display:flex;align-items:center;gap:16px;padding:clamp(8px, 1.4vh, 14px) 0;font-size:clamp(15px, 2.1vh, 18px);font-weight:500;color:var(--ink)}
.fw-om-pane__pts li + li::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:var(--fade-x)}
.fw-om-pane__tick{display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;border-radius:50%;font-size:17px;color:var(--wh);background:linear-gradient(135deg, var(--mt), var(--mt-d))}

/* ══════════════════════════════════════════════════════════════
   04 · §4 HOLD US TO IT — the proof ledger
   ══════════════════════════════════════════════════════════════ */

.fw-om-ledger{position:relative;padding:var(--sec) 0}
.fw-om-ledger__grid{display:grid;grid-template-columns:minmax(0, 4fr) minmax(0, 8fr);column-gap:var(--gap);align-items:center}
.fw-om-rows{margin:0;padding:0;list-style:none}
.fw-om-rows li{position:relative}
.fw-om-rows li + li::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:var(--fade-x)}
.fw-om-row{
	display:grid;grid-template-columns:30px auto minmax(30px, 1fr) auto clamp(120px, 12vw, 160px);align-items:end;column-gap:14px;
	padding:clamp(8px, 1.3vh, 14px) 10px;border-radius:14px;color:var(--ink);transition:background .3s
}
.fw-om-row:hover{color:var(--ink);background:linear-gradient(90deg, var(--pk-wash), transparent 85%)}
.fw-om-row__n{align-self:center;font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--g4);font-variant-numeric:tabular-nums}
.fw-om-row__what{display:flex;flex-direction:column;line-height:1.3}
.fw-om-row__what b{font-size:clamp(15px, 2.1vh, 18px);font-weight:600;letter-spacing:-.01em}
.fw-om-row__what small{margin-top:3px;font-size:13px;color:var(--g5)}
.fw-om-row__dots{
	align-self:end;height:2px;margin-bottom:10px;
	background:radial-gradient(circle, var(--g3) 1px, transparent 1.5px) repeat-x left center / 8px 2px
}
.fw-om-row__val{display:flex;align-items:baseline;gap:6px;white-space:nowrap}
.fw-om-row__val b,
.fw-om-row__val b.counter{
	font-size:clamp(26px, 4vh, 40px);font-weight:600;line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums;
	background:linear-gradient(120deg, var(--pk-d), var(--pu) 70%);-webkit-background-clip:text;background-clip:text;color:transparent
}
.fw-om-row__val small{font-size:12px;font-weight:500;color:var(--g5)}
.fw-om-row__go{display:inline-flex;align-items:center;justify-content:flex-end;gap:6px;margin-bottom:6px;font-size:13px;font-weight:600;color:var(--bl-d);transition:color .25s, gap .3s var(--ease)}
.fw-om-row__go i{font-size:11px}
.fw-om-row:hover .fw-om-row__go{gap:9px;color:var(--pk-ink)}

/* ══════════════════════════════════════════════════════════════
   05 · §5 QUESTIONS — a reader
   ══════════════════════════════════════════════════════════════ */

.fw-om-faq{position:relative;padding:var(--sec) 0;background:linear-gradient(180deg, var(--wh), var(--paper-p))}
.fw-om-faq__head{margin-bottom:clamp(12px, 2.2vh, 24px)}
.fw-om-reader{display:grid;grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);column-gap:var(--gap);align-items:start}
.fw-om-reader__qs{display:flex;flex-direction:column}
.fw-om-q{
	position:relative;display:grid;grid-template-columns:34px minmax(0, 1fr);align-items:center;column-gap:10px;
	padding:clamp(8px, 1.3vh, 12px) 14px clamp(8px, 1.3vh, 12px) 18px;border:0;border-radius:14px;background:none;cursor:pointer;text-align:left;
	font-family:var(--ff);color:var(--g6);transition:color .25s, background .3s
}
.fw-om-q + .fw-om-q::before{content:'';position:absolute;top:0;left:18px;right:14px;height:1px;background:var(--fade-x)}
.fw-om-q::after{content:'';position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:3px;background:linear-gradient(180deg, var(--pk), var(--pu));transform:scaleY(0);transition:transform .4s var(--ease)}
.fw-om-q__n{font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--g4);font-variant-numeric:tabular-nums}
.fw-om-q__t{font-size:clamp(14.5px, 2vh, 16.5px);font-weight:500;line-height:1.4}
.fw-om-q:hover{color:var(--ink)}
.fw-om-q.is-on{color:var(--ink);background:linear-gradient(90deg, var(--pk-wash), transparent)}
.fw-om-q.is-on::after{transform:scaleY(1)}
.fw-om-q.is-on .fw-om-q__n{color:var(--pk-ink)}
.fw-om-q.is-on + .fw-om-q::before,
.fw-om-q.is-on::before{opacity:0}

.fw-om-reader__as{position:relative;min-height:clamp(200px, 26vh, 270px);padding-left:clamp(20px, 3vw, 48px)}
.fw-om-reader__as::before{content:'';position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--fade-y)}
.fw-om-ans[hidden]{display:none}
.fw-om-ans{position:relative}
.fw-om-ans::before{
	content:'\201C';position:absolute;top:-.34em;left:-.06em;z-index:0;font-family:Georgia, serif;font-size:clamp(120px, 18vh, 200px);line-height:1;color:var(--pk-l2)
}
.fw-om-ans__q{position:relative;z-index:1;margin:clamp(22px, 3.6vh, 40px) 0 0;font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--pk-ink)}
.fw-om-ans__a{position:relative;z-index:1;margin:clamp(10px, 1.8vh, 16px) 0 0;font-size:clamp(18px, 2.8vh, 26px);font-weight:300;line-height:1.55;letter-spacing:-.01em;color:var(--ink);text-wrap:pretty}
.fw-om-ans:focus{outline:none}

/* ══════════════════════════════════════════════════════════════
   06 · §6 THE PLEDGE — signed
   ══════════════════════════════════════════════════════════════ */

.fw-om-pledge{position:relative;overflow:hidden;padding:clamp(34px, 6vh, 72px) 0;text-align:center;background:var(--wh)}
.fw-om-pledge::before{
	content:'';position:absolute;left:50%;top:50%;width:clamp(420px, 60vw, 980px);aspect-ratio:2 / 1;transform:translate(-50%, -50%);
	border-radius:50%;background:radial-gradient(closest-side, var(--pk-wash), transparent);pointer-events:none
}
.fw-om-pledge__in{display:flex;flex-direction:column;align-items:center}
.fw-om-pledge__h{
	margin:clamp(10px, 1.6vh, 16px) 0 0;font-family:var(--ff);font-size:clamp(28px, 4.8vh, 54px);font-weight:500;line-height:1.08;letter-spacing:-.04em;color:var(--ink);text-wrap:balance
}
.fw-om-pledge__h em{
	display:block;font-style:normal;font-weight:600;
	background:linear-gradient(100deg, var(--pk-d), var(--pu) 60%, var(--bl-d));-webkit-background-clip:text;background-clip:text;color:transparent
}
.fw-om-sign{margin:clamp(12px, 2.2vh, 22px) 0 0;display:flex;flex-direction:column;align-items:center;gap:8px}
.fw-om-sign__ink{width:clamp(220px, 26vw, 360px);height:auto;overflow:visible}
.fw-om-sign__ink path{fill:none;stroke:var(--pk-d);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.fw-om-sign__ink .fw-om-sign__under{stroke:var(--pu);stroke-width:2;opacity:.6}
.fw-om-sign figcaption{font-size:13.5px;font-weight:500;letter-spacing:.02em;color:var(--g6)}
.fw-om-pledge__act{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 16px;margin-top:clamp(16px, 2.6vh, 26px)}

/* ══════════════════════════════════════════════════════════════
   07 · WHY WE EXIST — the old way, struck out
   ══════════════════════════════════════════════════════════════ */

.fw-om-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.fw-om-why{position:relative;padding:var(--sec) 0;background:var(--wh)}
.fw-om-why__head{display:grid;grid-template-columns:minmax(0, 6fr) minmax(0, 6fr);column-gap:var(--gap);align-items:end;margin-bottom:clamp(14px, 2.2vh, 26px)}
.fw-om-why__head .fw-om-lead{margin:0}
.fw-om-why__switch{display:none}
.fw-om-why__cols,
.fw-om-why__row{display:grid;grid-template-columns:minmax(0, 1fr) 64px minmax(0, 1fr);column-gap:clamp(16px, 2vw, 32px);align-items:center}
.fw-om-why__cols{padding-bottom:10px;font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--g5)}
.fw-om-why__cols span:last-child{color:var(--mt-ink)}
.fw-om-why__rows{margin:0;padding:0;list-style:none}
.fw-om-why__row{position:relative;padding:clamp(8px, 1.3vh, 13px) 0}
.fw-om-why__row::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:var(--fade-x)}
.fw-om-why__old{margin:0;font-size:clamp(15px, 2.1vh, 18px);font-weight:300;line-height:1.45;color:var(--g4)}
/* The strike is a background on the inline text, cloned per line, so a
   sentence that wraps is struck on every line. */
.fw-om-why__old span{
	background:linear-gradient(var(--co), var(--co)) no-repeat 0 58% / 100% 2px;
	-webkit-box-decoration-break:clone;box-decoration-break:clone
}
.fw-om-why__arrow{justify-self:center;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-size:15px;color:var(--pk-ink);background:var(--pk-l)}
.fw-om-why__new{margin:0;display:flex;align-items:center;gap:14px;font-size:clamp(15px, 2.1vh, 18px);font-weight:600;line-height:1.4;color:var(--ink)}
.fw-om-why__ico{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;border-radius:50%;font-size:16px;color:var(--mt-ink);background:var(--mt-l)}

/* ══════════════════════════════════════════════════════════════
   08 · WHAT WE WILL NEVER DO
   ══════════════════════════════════════════════════════════════ */

.fw-om-never{position:relative;padding:var(--sec) 0;background:linear-gradient(180deg, var(--paper-p), var(--wh))}
.fw-om-never__grid{display:grid;grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);column-gap:var(--gap);align-items:center}
.fw-om-never__h{display:flex;flex-direction:column;margin:clamp(10px, 1.6vh, 16px) 0 0;font-family:var(--ff)}
.fw-om-never__we{font-size:clamp(22px, 3.6vh, 36px);font-weight:500;line-height:1.1;letter-spacing:-.03em;color:var(--ink)}
.fw-om-never__h .fw-om-never__big{
	-webkit-text-fill-color:transparent;
	margin:.02em 0 .06em -.04em;font-size:clamp(80px, 14vh, 170px);font-weight:700;line-height:.86;letter-spacing:-.065em;
	background:linear-gradient(120deg, var(--pk), var(--pu) 60%, var(--bl));-webkit-background-clip:text;background-clip:text;color:transparent
}
.fw-om-never__list{margin:0;padding:0;list-style:none}
.fw-om-never__vow{position:relative;display:grid;grid-template-columns:40px 30px minmax(0, 1fr);align-items:center;column-gap:14px;padding:clamp(8px, 1.3vh, 13px) 0}
.fw-om-never__vow + .fw-om-never__vow::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:var(--fade-x)}
.fw-om-never__x{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;font-size:16px;color:var(--co-ink);background:var(--co-l);transition:transform .4s var(--ease-pop), background .3s, color .3s}
.fw-om-never__vow:hover .fw-om-never__x{transform:rotate(90deg);color:var(--wh);background:var(--co)}
.fw-om-never__n{font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--g4);font-variant-numeric:tabular-nums}
.fw-om-never__vow p{margin:0;font-size:clamp(17px, 2.5vh, 23px);font-weight:500;line-height:1.3;letter-spacing:-.02em;color:var(--ink)}
.fw-om-never__dots{display:none}

/* ══════════════════════════════════════════════════════════════
   09 · THE PEOPLE WHO KEEP IT — two drifting rows
   ══════════════════════════════════════════════════════════════ */

.fw-om-people{position:relative;overflow:hidden;padding:var(--sec) 0;background:var(--wh)}
.fw-om-people__head{display:grid;grid-template-columns:minmax(0, 6fr) minmax(0, 6fr);column-gap:var(--gap);align-items:end;margin-bottom:clamp(14px, 2.2vh, 26px)}
.fw-om-people__aside .fw-om-lead{margin:0 0 12px}
.fw-om-drift{
	display:grid;row-gap:clamp(14px, 2vh, 22px);
	-webkit-mask:linear-gradient(90deg, transparent, var(--dk) 7%, var(--dk) 93%, transparent);
	        mask:linear-gradient(90deg, transparent, var(--dk) 7%, var(--dk) 93%, transparent)
}
.fw-om-drift__row{overflow:hidden}
.fw-om-drift__track{display:flex;width:max-content;margin:0;padding:0;list-style:none}
.fw-om-drift__track li{margin-right:clamp(12px, 1.2vw, 18px)}
.fw-om-doc{display:flex;flex-direction:column;gap:7px;width:clamp(122px, 9vw, 150px);color:var(--ink)}
.fw-om-doc img{display:block;width:100%;aspect-ratio:4 / 5;object-fit:cover;border-radius:clamp(16px, 1.4vw, 22px);background:var(--g1);transition:transform .6s var(--ease-soft)}
.fw-om-doc:hover img{transform:translateY(-4px)}
.fw-om-doc__t{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.fw-om-doc__t b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fw-om-doc__t small{font-size:12px;color:var(--g5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fw-om-doc:hover .fw-om-doc__t b{color:var(--pk-ink)}

/* ══════════════════════════════════════════════════════════════
   10 · YOUR FIRST STEP — three steps on a drawn path
   ══════════════════════════════════════════════════════════════ */

.fw-om-steps{position:relative;padding:var(--sec) 0;background:linear-gradient(180deg, var(--wh), var(--paper-p))}
.fw-om-steps__head{text-align:center;margin-bottom:clamp(16px, 2.8vh, 32px)}
.fw-om-steps__head .fw-om-h2{margin-inline:auto}
.fw-om-steps__wrap{position:relative}
.fw-om-steps__path{position:absolute;z-index:0;left:0;right:0;top:0;width:100%;height:clamp(72px, 10vh, 104px);overflow:visible}
.fw-om-steps__path path{fill:none;stroke:var(--pk-ring);stroke-width:2;stroke-dasharray:6 9;stroke-linecap:round;vector-effect:non-scaling-stroke}
.fw-om-steps__list{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));column-gap:var(--gap);margin:0;padding:0;list-style:none;text-align:center}
.fw-om-step{display:flex;flex-direction:column;align-items:center}
.fw-om-step__dot{
	position:relative;display:grid;place-items:center;width:clamp(66px, 8.4vh, 84px);height:clamp(66px, 8.4vh, 84px);border-radius:50%;
	background:var(--wh);box-shadow:0 0 0 8px var(--paper-p), 0 20px 44px -22px var(--pk)
}
.fw-om-step__ico{display:grid;place-items:center;font-size:clamp(26px, 3.6vh, 34px);color:var(--pk-ink)}
.fw-om-step__dot b{
	position:absolute;top:-4px;right:-4px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
	font-size:12.5px;font-weight:700;color:var(--wh);background:linear-gradient(135deg, var(--pk), var(--pu));box-shadow:0 0 0 3px var(--wh)
}
.fw-om-step__t{margin:clamp(12px, 2vh, 18px) 0 0;font-family:var(--ff);font-size:clamp(18px, 2.6vh, 23px);font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.fw-om-step__p{margin:8px 0 0;font-size:clamp(14px, 1.9vh, 16px);font-weight:300;line-height:1.65;color:var(--g6);text-wrap:pretty}
.fw-om-steps__act{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px;margin-top:clamp(16px, 2.8vh, 30px)}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════════ */

@media(max-width:1024px){
	.fw-om-page{--pad:14px;--sec:clamp(44px, 10vw, 70px)}
	.fw-om-hero__grid{grid-template-columns:minmax(0, 1fr);row-gap:clamp(48px, 10vw, 70px);min-height:0}
	.fw-om-portal{order:-1;width:clamp(240px, 52vw, 380px);margin-bottom:0}
	.fw-om-portal__cap{display:none}
	.fw-om-vow{font-size:clamp(28px, 5.6vw, 44px)}
	.fw-om-h2{font-size:clamp(25px, 5.4vw, 36px)}
	.fw-om-for__top,
	.fw-om-pane,
	.fw-om-ledger__grid,
	.fw-om-reader{grid-template-columns:minmax(0, 1fr);row-gap:clamp(18px, 4vw, 28px)}
	.fw-om-seg{justify-self:stretch;width:100%}
	.fw-om-deck__track{height:clamp(380px, 62vw, 520px)}
	/* One column is no longer a spread: type goes back to the width. */
	.fw-om-pane__h{font-size:clamp(26px, 6vw, 38px)}
	.fw-om-pane__body,
	.fw-om-pane__pts li{font-size:clamp(15px, 2.4vw, 17px)}
	.fw-om-panel__t{font-size:clamp(24px, 4.6vw, 34px)}
	.fw-om-panel__lead{font-size:clamp(16px, 2.6vw, 19px)}
	.fw-om-row__val b,
	.fw-om-row__val b.counter{font-size:clamp(26px, 5vw, 38px)}
	.fw-om-ans__a{font-size:clamp(18px, 3.2vw, 23px)}
	.fw-om-pledge__h{font-size:clamp(28px, 6.4vw, 46px)}
	.fw-om-pledge{padding:clamp(48px, 12vw, 90px) 0}
	.fw-om-why__head,
	.fw-om-never__grid,
	.fw-om-people__head{grid-template-columns:minmax(0, 1fr);row-gap:clamp(14px, 3vw, 22px)}
	.fw-om-why__old,
	.fw-om-why__new{font-size:clamp(15px, 2.4vw, 18px)}
	.fw-om-never__we{font-size:clamp(22px, 5vw, 32px)}
	.fw-om-never__h .fw-om-never__big{font-size:clamp(78px, 20vw, 150px)}
	.fw-om-never__vow p{font-size:clamp(17px, 3vw, 22px)}}

/* ── THE APP LAYER ──────────────────────────────────────────── */
@media(max-width:768px){
	.fw-om-page{--article-top:64px}
	.fw-om-hero{padding:18px 0 30px}
	.fw-om-portal{width:62vw}
	.fw-om-crumb{margin-bottom:12px}
	.fw-om-vow{font-size:clamp(26px, 7.6vw, 34px);line-height:1.18}
	/* The four tokens: a swipe row of chips, like an app's filters. */
	.fw-om-tokens{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:8px;margin-inline:calc(var(--pad) * -1);padding:2px var(--pad) 4px}
	.fw-om-tokens::-webkit-scrollbar{display:none}
	.fw-om-tokens li,
	.fw-om-tokens li:first-child{padding:0;flex-shrink:0}
	.fw-om-tokens li + li::before{display:none}
	.fw-om-token{padding:6px 14px 6px 6px;border-radius:100px;background:var(--wh);box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap}

	/* THE STORY DECK: one promise per screen, swiped or tapped through,
	   a progress bar per story across the top. */
	.fw-om-deck{padding-inline:0}
	.fw-om-deck__bars{
		position:absolute;z-index:4;top:12px;left:calc(var(--pad) + 14px);right:calc(var(--pad) + 14px);
		display:flex;gap:5px;pointer-events:none
	}
	.fw-om-deck__bars i{flex:1 1 0;height:3px;border-radius:3px;overflow:hidden;background:color-mix(in srgb, var(--wh) 45%, transparent)}
	.fw-om-deck__bars b{display:block;width:0;height:100%;border-radius:3px;background:var(--wh)}
	.fw-om-deck__bars i.is-done b{width:100%}
	.fw-om-deck__track{
		height:auto;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;
		padding-inline:var(--pad);scroll-padding-inline:var(--pad);-webkit-overflow-scrolling:touch
	}
	.fw-om-deck__track::-webkit-scrollbar{display:none}
	.fw-om-panel,
	.fw-om-panel.is-open{flex:0 0 100%;flex-direction:column;scroll-snap-align:start;scroll-snap-stop:always}
	.fw-om-panel__fig,
	.fw-om-panel.is-open .fw-om-panel__fig{flex:0 0 auto;height:min(52vh, 420px);border-radius:24px}
	.fw-om-panel__fig::after,
	.fw-om-panel.is-open .fw-om-panel__fig::after{opacity:1;background:linear-gradient(180deg, color-mix(in srgb, var(--ac-dd) 45%, transparent), transparent 30%, transparent 62%, color-mix(in srgb, var(--ac-dd) 60%, transparent))}
	.fw-om-panel:not(.is-open) .fw-om-panel__fig img{transform:none}
	.fw-om-panel__tab,
	.fw-om-panel.is-open .fw-om-panel__tab{top:auto;bottom:auto;height:min(52vh, 420px);width:100%;align-items:flex-start;justify-content:flex-end;padding:18px;cursor:pointer}
	.fw-om-panel__word,
	.fw-om-panel.is-open .fw-om-panel__word{writing-mode:horizontal-tb;transform:none;opacity:1;font-size:26px;letter-spacing:-.02em}
	.fw-om-panel__num{position:absolute;top:26px;right:18px}
	.fw-om-panel__body,
	.fw-om-panel.is-open .fw-om-panel__body{flex:0 0 auto;opacity:1;padding:18px 4px 4px;overflow:visible;justify-content:flex-start}
	.fw-om-panel__ico{display:none}
	.fw-om-panel__kick{margin-top:0}
	.fw-om-panel__t{font-size:26px}
	.fw-om-deck__hint{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 0;font-size:12.5px;color:var(--g5)}

	.fw-om-seg{position:sticky;top:calc(var(--article-top) + 6px);z-index:5;margin-top:4px}
	.fw-om-seg__b{min-height:42px;padding:0 6px;font-size:13px}
	.fw-om-seg__b .fw-ico{display:none}
	.fw-om-pane__pts li{font-size:15px}

	/* The ledger reads like a settings list: what, the number, a chevron. */
	.fw-om-row{grid-template-columns:minmax(0, 1fr) auto 14px;align-items:center;column-gap:12px;padding:14px 4px}
	.fw-om-row__n,
	.fw-om-row__dots{display:none}
	.fw-om-row__what small{font-size:12.5px}
	.fw-om-row__val{flex-direction:column;align-items:flex-end;gap:0}
	.fw-om-row__val b,
	.fw-om-row__val b.counter{font-size:26px}
	.fw-om-row__go{font-size:0;margin:0;color:var(--g4)}
	.fw-om-row__go i{font-size:14px}

	/* The questions: a swipe row of chips above the answer. */
	.fw-om-reader__qs{flex-direction:row;gap:8px;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--pad) * -1);padding:2px var(--pad) 6px}
	.fw-om-reader__qs::-webkit-scrollbar{display:none}
	.fw-om-q{flex:0 0 auto;grid-template-columns:auto minmax(0, auto);width:auto;flex-basis:auto;padding:10px 16px;border-radius:100px;background:var(--wh);box-shadow:inset 0 0 0 1px var(--line)}
	.fw-om-q + .fw-om-q::before,
	.fw-om-q::after{display:none}
	.fw-om-q__t{white-space:nowrap;font-size:13.5px}
	.fw-om-q.is-on{color:var(--wh);background:linear-gradient(120deg, var(--pk), var(--pk-d));box-shadow:var(--pk-glow)}
	.fw-om-q.is-on .fw-om-q__n{color:var(--wh)}
	.fw-om-reader__as{padding-left:0;min-height:0}
	.fw-om-reader__as::before{display:none}
	.fw-om-ans__a{font-size:19px}

	.fw-om-pledge__act .fw-om-btn{flex:1 1 100%}

	/* Why: a two-way segmented toggle, one side of every line at a time. */
	.fw-om-why__switch{
		position:relative;display:grid;grid-template-columns:1fr 1fr;margin-bottom:10px;padding:4px;border-radius:100px;
		background:var(--g0);box-shadow:inset 0 0 0 1px var(--line)
	}
	.fw-om-why__sb{min-height:42px;border:0;border-radius:100px;background:none;cursor:pointer;font-family:var(--ff);font-size:14px;font-weight:500;color:var(--g6);transition:color .3s, background .3s, box-shadow .3s}
	.fw-om-why__sb.is-on{font-weight:600;color:var(--ink);background:var(--wh);box-shadow:0 8px 20px -12px var(--ink-a40)}
	.fw-om-why__sb.is-on[data-om-side="old"]{color:var(--co-ink)}
	.fw-om-why__sb.is-on[data-om-side="new"]{color:var(--mt-ink)}
	.fw-om-why__cols{display:none}
	.fw-om-why__row{grid-template-columns:minmax(0, 1fr);padding:14px 2px}
	.fw-om-why__arrow{display:none}
	[data-side="new"] .fw-om-why__old,
	[data-side="old"] .fw-om-why__new{display:none}
	.fw-om-why__old{display:flex;align-items:center;gap:14px}
	.fw-om-why__old::before{content:'\2715';display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border-radius:50%;font-size:14px;color:var(--co-ink);background:var(--co-l)}

	/* Never: an onboarding carousel, one vow per screen, dots below. */
	.fw-om-never__list{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px;margin-inline:calc(var(--pad) * -1);padding:4px var(--pad) 6px;scroll-padding-inline:var(--pad)}
	.fw-om-never__list::-webkit-scrollbar{display:none}
	.fw-om-never__vow{flex:0 0 84%;scroll-snap-align:start;grid-template-columns:minmax(0, 1fr);row-gap:14px;padding:10px 4px}
	.fw-om-never__vow + .fw-om-never__vow::before{display:none}
	.fw-om-never__x{width:52px;height:52px;font-size:18px}
	.fw-om-never__n{display:none}
	.fw-om-never__vow p{font-size:21px}
	.fw-om-never__dots{display:flex;justify-content:center;gap:7px;margin-top:14px}
	.fw-om-never__dots i{width:7px;height:7px;border-radius:7px;background:var(--g3);transition:width .35s var(--ease), background .3s}
	.fw-om-never__dots i.is-on{width:22px;background:var(--pk)}

	.fw-om-drift{-webkit-mask:none;mask:none}
	.fw-om-drift__row{overflow-x:auto;scrollbar-width:none;padding-left:var(--pad)}
	.fw-om-drift__row::-webkit-scrollbar{display:none}
	.fw-om-doc{width:132px}

	/* Steps: a vertical onboarding flow, the dots joined by a dashed line. */
	.fw-om-steps__head{text-align:left}
	.fw-om-steps__head .fw-om-eyebrow--c{justify-content:flex-start}
	.fw-om-steps__path{display:none}
	.fw-om-steps__list{grid-template-columns:minmax(0, 1fr);row-gap:0;text-align:left}
	.fw-om-step{position:relative;display:grid;grid-template-columns:64px minmax(0, 1fr);grid-template-rows:auto auto;column-gap:16px;align-items:start;padding-bottom:26px}
	.fw-om-step:not(:last-child)::after{content:'';position:absolute;left:31px;top:70px;bottom:4px;border-left:2px dashed var(--pk-ring)}
	.fw-om-step__dot{grid-row:1 / span 2;width:64px;height:64px;box-shadow:0 0 0 6px var(--paper-p), 0 14px 30px -18px var(--pk)}
	.fw-om-step__ico{font-size:24px}
	.fw-om-step__t{margin:8px 0 0;font-size:19px}
	.fw-om-step__p{font-size:14.5px}
	.fw-om-steps__act{flex-direction:column;align-items:stretch}
	.fw-om-steps__act .fw-om-link{justify-content:center}}

/* ══════════════════════════════════════════════════════════════
   09 · MOTION — only when it is welcome
   ══════════════════════════════════════════════════════════════ */

@media(prefers-reduced-motion:no-preference){
	.fw-om-fx i:first-child{animation:fwOmDrift 30s ease-in-out infinite}
	.fw-om-fx i:last-child{animation:fwOmDrift 36s ease-in-out infinite reverse}
	.fw-om-portal__ring{animation:fwOmTurn 70s linear infinite}

	/* The vow is written in, word by word; a promise word's underline
	   draws after it lands. --i is each word's place, set by the script. */
	.fw-om-anim .fw-om-w{opacity:0;transform:translate3d(0,.45em,0);filter:blur(6px);transition:opacity .6s var(--ease-soft), transform .8s var(--ease-soft), filter .6s;transition-delay:calc(var(--i) * 60ms)}
	.fw-om-anim .fw-om-w.is-mark{background-size:0% .3em;transition-property:opacity, transform, filter, background-size;transition-duration:.6s, .8s, .6s, .9s;transition-delay:calc(var(--i) * 60ms), calc(var(--i) * 60ms), calc(var(--i) * 60ms), calc(var(--i) * 60ms + 450ms)}
	.fw-om-anim .fw-om-vow.is-on .fw-om-w{opacity:1;transform:none;filter:none}
	.fw-om-anim .fw-om-vow.is-on .fw-om-w.is-mark{background-size:100% .3em}
	.fw-om-anim .fw-om-portal__win{transform:scale(.86);opacity:0;transition:transform 1.4s var(--ease-soft), opacity 1s}
	.fw-om-anim .fw-om-portal.is-on .fw-om-portal__win{transform:none;opacity:1}

	.fw-om-anim [data-om-reveal]{opacity:0;transform:translate3d(0,26px,0);transition:opacity .9s var(--ease-soft), transform 1s var(--ease-soft)}
	.fw-om-anim [data-om-reveal].is-in{opacity:1;transform:none}
	.fw-om-anim .fw-om-panel .fw-om-draw > *{stroke-dasharray:130;stroke-dashoffset:130}
	.fw-om-anim .fw-om-panel.is-open .fw-om-draw > *{animation:fwOmDraw 1.4s var(--ease-soft) .5s forwards}
	.fw-om-pane:not([hidden]){animation:fwOmPane .6s var(--ease-soft)}
	.fw-om-ans:not([hidden]){animation:fwOmPane .5s var(--ease-soft)}

	/* The signature writes itself when the pledge arrives. */
	.fw-om-anim .fw-om-sign__ink path{stroke-dasharray:1200;stroke-dashoffset:1200}
	.fw-om-anim .fw-om-pledge__in.is-in .fw-om-sign__ink path{animation:fwOmInk 2.4s var(--ease-soft) .4s forwards}
	.fw-om-anim .fw-om-pledge__in.is-in .fw-om-sign__ink .fw-om-sign__under{animation-delay:1.9s;animation-duration:1s}

	/* The old way is struck out as each line arrives; the old words fade. */
	.fw-om-anim .fw-om-why__row[data-om-reveal] .fw-om-why__old span{background-size:0% 2px;transition:background-size 1s var(--ease-soft) .35s}
	.fw-om-anim .fw-om-why__row[data-om-reveal].is-in .fw-om-why__old span{background-size:100% 2px}
	.fw-om-anim .fw-om-why__row[data-om-reveal] .fw-om-why__old{color:var(--g6);transition:color .8s .9s}
	.fw-om-anim .fw-om-why__row[data-om-reveal].is-in .fw-om-why__old{color:var(--g4)}
	.fw-om-anim .fw-om-why__row:nth-child(2){transition-delay:.06s}
	.fw-om-anim .fw-om-why__row:nth-child(3){transition-delay:.12s}
	.fw-om-anim .fw-om-why__row:nth-child(4){transition-delay:.18s}
	.fw-om-anim .fw-om-why__row:nth-child(5){transition-delay:.24s}
	.fw-om-anim .fw-om-never__vow:nth-child(2){transition-delay:.08s}
	.fw-om-anim .fw-om-never__vow:nth-child(3){transition-delay:.16s}
	.fw-om-anim .fw-om-never__vow:nth-child(4){transition-delay:.24s}
	.fw-om-anim .fw-om-never__vow:nth-child(5){transition-delay:.32s}

	/* The doctors drift, the two rows in opposite directions. */
	.fw-om-drift__row--a .fw-om-drift__track{animation:fwOmSlide 90s linear infinite}
	.fw-om-drift__row--b .fw-om-drift__track{animation:fwOmSlide 80s linear infinite reverse}
	.fw-om-drift__row:hover .fw-om-drift__track,
	.fw-om-drift__row:focus-within .fw-om-drift__track{animation-play-state:paused}

	/* The path between the steps draws itself left to right. */
	.fw-om-anim .fw-om-steps__wrap[data-om-reveal] .fw-om-steps__path{clip-path:inset(-20px 100% -20px 0);transition:clip-path 1.8s var(--ease-soft) .3s}
	.fw-om-anim .fw-om-steps__wrap[data-om-reveal].is-in .fw-om-steps__path{clip-path:inset(-20px -20px -20px 0)}
	.fw-om-anim .fw-om-steps__wrap[data-om-reveal] .fw-om-step__dot{transform:scale(.6);transition:transform .7s var(--ease-pop)}
	.fw-om-anim .fw-om-steps__wrap[data-om-reveal].is-in .fw-om-step__dot{transform:none}
	.fw-om-anim .fw-om-step:nth-child(2) .fw-om-step__dot{transition-delay:.5s}
	.fw-om-anim .fw-om-step:nth-child(3) .fw-om-step__dot{transition-delay:1s}
	.fw-om-anim .fw-om-steps__wrap .fw-om-draw > *{stroke-dasharray:130;stroke-dashoffset:130}
	.fw-om-anim .fw-om-steps__wrap.is-in .fw-om-draw > *{animation:fwOmDraw 1.4s var(--ease-soft) .6s forwards}

	/* A live story fills its bar. */
	.fw-om-deck__bars i.is-live b{animation:fwOmBar var(--om-story) linear forwards}
	.fw-om-deck.is-paused .fw-om-deck__bars i.is-live b{animation-play-state:paused}}

@keyframes fwOmDrift{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(34px,-26px,0) scale(1.1)}}
@keyframes fwOmTurn{to{transform:rotate(360deg)}}
@keyframes fwOmDraw{to{stroke-dashoffset:0}}
@keyframes fwOmInk{to{stroke-dashoffset:0}}
@keyframes fwOmBar{from{width:0}to{width:100%}}
@keyframes fwOmSlide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes fwOmPane{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){
	.fw-om-page *,
	.fw-om-page *::before,
	.fw-om-page *::after{
		animation-duration:.01ms!important;animation-iteration-count:1!important;
		transition-duration:.01ms!important;scroll-behavior:auto!important
	}
	.fw-om img.lazy{opacity:1}
	.fw-om-drift__row{overflow-x:auto;scrollbar-width:none}}

/* ══════════════════════════════════════════════════════════════
   TOUCH · FOCUS · ANCHORS
   ══════════════════════════════════════════════════════════════ */

@media(hover:none){
	.fw-om-btn:hover,
	.fw-om-btn:hover i,
	.fw-om-token:hover > span{transform:none}}

.fw-om [id]{scroll-margin-top:calc(var(--article-top) + 16px)}

.fw-om-page a:focus-visible,
.fw-om-page button:focus-visible,
.fw-om-page [tabindex]:focus-visible{outline:2px solid var(--bl);outline-offset:3px;border-radius:8px}