/* ══════════════════════════════════════════════════════════════════════════
   css/milestones.css — /milestones  (prefix fw-ml)

   The moments the network reached. Its heart is the timeline: one line
   running sideways, oldest first, edge to edge, with arrows and a
   progress line for more; each moment's kind icon and year on the line,
   the photograph with its headline figure, the story and the place; kind
   chips above; "today" at the end. Around it: the masthead, how far we
   have come (the headline numbers as a path with the time between them),
   in their words, how we count a milestone, questions, and a closing
   invitation beside a consultation photograph.

   A sibling of the other story pages with its own grammar (the sideways line,
   the path, the nodes). House rules kept: bright grounds with soft
   brand light; no max-width on bands; colour only from :root; structure
   from space and fade rules, no boxed cards; photographs square-cornered
   (moment photographs share one 3:2 frame); icon discs, pills and buttons
   round; 28px / 14px gutters; type in vh, released at 1024px and below.
   ══════════════════════════════════════════════════════════════════════════ */

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

.fw-ml-page{
	--pad:28px;
	--ink:var(--dk-d);
	--line:color-mix(in srgb, var(--dk) 9%, transparent);
	--fade-x:linear-gradient(90deg, transparent, var(--line) 8%, var(--line) 92%, transparent);
	--sec:clamp(34px, 6vh, 72px);
	--gap:clamp(24px, 4vw, 76px);
	--ease:cubic-bezier(.22,1,.36,1);
	--ease-soft:cubic-bezier(.16,1,.3,1);
	--ac:var(--pk);--ac-ink:var(--pk-dd);--ac-l:var(--pk-l);
	background:var(--wh);
	-webkit-text-size-adjust:100%
}
.fw-ml-ac--pk{--ac:var(--pk);--ac-ink:var(--pk-dd);--ac-l:var(--pk-l)}
.fw-ml-ac--bl{--ac:var(--bl);--ac-ink:var(--bl-ink);--ac-l:var(--bl-l)}
.fw-ml-ac--mt{--ac:var(--mt);--ac-ink:var(--mt-ink);--ac-l:var(--mt-l)}
.fw-ml-ac--pu{--ac:var(--pu);--ac-ink:var(--pu-ink);--ac-l:var(--pu-l)}
.fw-ml-ac--co{--ac:var(--co);--ac-ink:var(--co-ink);--ac-l:var(--co-l)}
.fw-ml-ac--go{--ac:var(--go);--ac-ink:var(--go-ink);--ac-l:var(--go-l)}

.fw-ml{display:block;position:relative}
.fw-ml-page em{font-family:var(--ff);font-style:normal}
.fw-ml .fw-ico{stroke-width:1.6}

.fw-ml-sec{position:relative;padding:var(--sec) var(--pad)}
.fw-ml-sec + .fw-ml-sec::before{content:"";position:absolute;left:var(--pad);right:var(--pad);top:0;height:1px;background:var(--fade-x)}

.fw-ml-head{display:grid;gap:8px;margin-bottom:clamp(22px, 3.6vh, 36px)}
.fw-ml-head--c{justify-items:center;text-align:center}
.fw-ml-head--c .fw-ml-sub{text-wrap:balance}
.fw-ml-h2{margin:0;font-family:var(--ff);font-size:clamp(25px, 4vh, 40px);font-weight:700;line-height:1.12;letter-spacing:-.03em;color:var(--ink);text-wrap:balance}
.fw-ml-sub{margin:0;font-size:clamp(15px, 2vh, 17px);line-height:1.6;color:var(--g6);text-wrap:pretty}
.fw-ml-kicker{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--pk-dd)}
.fw-ml-kicker .fw-ico{width:18px;height:18px}
.fw-ml-note{display:flex;align-items:flex-start;gap:8px;margin:0;font-size:14px;line-height:1.55;color:var(--g6)}
.fw-ml-note .bi{margin-top:2px;color:var(--pk-dd)}
.fw-ml-note a{font-weight:700;color:var(--bl-ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--bl-ring)}

.fw-ml-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:15px;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), background .25s
}
.fw-ml-btn i{font-size:14px}
.fw-ml-btn:hover{color:var(--wh);box-shadow:var(--pk-glow-lg);transform:translateY(-1px)}
.fw-ml-btn--ghost{color:var(--ink);background:var(--wh);box-shadow:inset 0 0 0 1.5px var(--line)}
.fw-ml-btn--ghost:hover{color:var(--bl-ink);background:var(--bl-wash);box-shadow:inset 0 0 0 1.5px var(--bl-ring)}
.fw-ml-act{display:flex;flex-wrap:wrap;gap:12px 14px;margin-top:clamp(18px, 3vh, 28px)}

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

/* ══════════════════════════════════════════════════════════════
   01 · THE MOMENTS THAT MADE US
   The latest big moment rides on the photograph as a badge: its icon
   in its accent, the month and the figure.
   ══════════════════════════════════════════════════════════════ */

.fw-ml-mast__grid{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);gap:var(--gap);align-items:center}
.fw-ml-mast__say{display:grid;justify-items:start}
.fw-ml-mast__say .fw-ml-kicker{margin-top:clamp(8px, 1.6vh, 16px)}
.fw-ml .fw-ml-h1{margin:clamp(8px, 1.4vh, 14px) 0 0;font-size:clamp(34px, 6vh, 60px);line-height:1.05;letter-spacing:-.035em;color:var(--ink);text-wrap:balance}
.fw-ml .fw-ml-h1 em{display:block;background:linear-gradient(100deg, var(--pk-dd), var(--pk) 55%, var(--bl-d));-webkit-background-clip:text;background-clip:text;color:transparent}
.fw-ml-lede{margin:clamp(10px, 1.8vh, 16px) 0 0;font-size:clamp(16px, 2.2vh, 19px);line-height:1.55;color:var(--g6);text-wrap:pretty}
.fw-ml-trust{position:relative;display:grid;grid-template-columns:repeat(3, auto);justify-content:start;gap:0;width:100%;margin:clamp(18px, 3vh, 28px) 0 0;padding:clamp(14px, 2.2vh, 18px) 0 0;list-style:none}
.fw-ml-trust::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg, var(--line), transparent)}
.fw-ml-trust li{position:relative;display:grid;padding:0 clamp(16px, 2vw, 28px)}
.fw-ml-trust li:first-child{padding-left:0}
.fw-ml-trust li + li::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:1px;background:var(--line)}
.fw-ml-trust b{font-size:clamp(22px, 3.4vh, 30px);font-weight:700;line-height:1.1;letter-spacing:-.02em;color:var(--ink)}
.fw-ml-trust span{font-size:12.5px;font-weight:600;color:var(--g6)}
.fw-ml-mast__fig{position:relative;justify-self:end;margin:0;line-height:0}
.fw-ml-mast__fig img{display:block;height:clamp(250px, 46vh, 470px);width:auto;max-width:100%;aspect-ratio:3 / 2;object-fit:cover}
.fw-ml-badge{position:absolute;left:clamp(-28px, -2vw, -14px);bottom:clamp(14px, 2.4vh, 24px);display:flex;align-items:center;gap:12px;padding:10px 20px 10px 10px;border-radius:100px;line-height:1.25;background:var(--wh);box-shadow:var(--sh-soft)}
.fw-ml-badge__ico{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--wh);background:var(--ac)}
.fw-ml-badge__ico .fw-ico{width:22px;height:22px}
.fw-ml-badge > span:last-child{display:grid}
.fw-ml-badge small{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ac-ink)}
.fw-ml-badge b{font-size:16px;font-weight:700;color:var(--ink)}

/* ══════════════════════════════════════════════════════════════
   02 · HOW FAR WE HAVE COME
   The headline numbers as a path, oldest first: an icon disc in each
   moment's accent, the number large in its gradient, what it counts and
   the month; a dashed arrow between stops carries the time it took.
   ══════════════════════════════════════════════════════════════ */

.fw-ml-path{background:linear-gradient(180deg, var(--wh), var(--pk-wash) 38%, var(--bl-wash) 78%, var(--wh))}
.fw-ml-path__list{--disc:70px;--top:40px;display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));margin:0;padding:0;list-style:none}
.fw-ml-path__list--1{grid-template-columns:minmax(0, 1fr)}
.fw-ml-path__list--2{grid-template-columns:repeat(2, minmax(0, 1fr))}
.fw-ml-path__list--3{grid-template-columns:repeat(3, minmax(0, 1fr))}
.fw-ml-path__stop{position:relative;display:grid;justify-items:center;align-content:start;gap:6px;padding:var(--top) clamp(10px, 1.6vw, 24px) 0;text-align:center}
/* the dashed arrow from the stop before to this one */
.fw-ml-path__stop + .fw-ml-path__stop::before{content:"";position:absolute;top:calc(var(--top) + var(--disc) / 2 - 1px);left:calc(-50% + var(--disc) / 2 + 16px);right:calc(50% + var(--disc) / 2 + 18px);height:2px;background:repeating-linear-gradient(90deg, var(--ac) 0 9px, transparent 9px 16px)}
.fw-ml-path__stop + .fw-ml-path__stop::after{content:"";position:absolute;top:calc(var(--top) + var(--disc) / 2 - 7px);right:calc(50% + var(--disc) / 2 + 8px);border-left:11px solid var(--ac);border-top:7px solid transparent;border-bottom:7px solid transparent}
.fw-ml-path__go{position:absolute;left:0;top:calc(var(--top) + var(--disc) / 2 - 42px);z-index:1;display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:100px;transform:translateX(-50%);font-size:12px;font-weight:700;white-space:nowrap;color:var(--g7);background:var(--wh);box-shadow:inset 0 0 0 1px var(--line)}
.fw-ml-path__go .bi{font-size:11px;color:var(--ac-ink)}
.fw-ml-path__ico{position:relative;display:grid;place-items:center;width:var(--disc);height:var(--disc);border-radius:50%;color:var(--wh);background:linear-gradient(135deg, var(--ac), var(--ac-ink));box-shadow:0 0 0 8px var(--wh), 0 0 0 10px var(--ac-l), 0 20px 34px -20px var(--ac)}
.fw-ml-path__ico .fw-ico{width:30px;height:30px}
.fw-ml-path__stop.is-now .fw-ml-path__ico::after{content:"";position:absolute;inset:-10px;border-radius:50%;box-shadow:0 0 0 2px var(--ac);opacity:0;animation:fw-ml-ping 2.6s var(--ease-soft) infinite}
@keyframes fw-ml-ping{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(1.35)}}
.fw-ml-path__stop b{margin-top:clamp(10px, 1.8vh, 16px);font-size:clamp(44px, 7.6vh, 76px);font-weight:700;line-height:1;letter-spacing:-.045em;font-variant-numeric:tabular-nums;background:linear-gradient(135deg, var(--ac), var(--dk-d) 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
.fw-ml-path__l{font-size:clamp(15px, 2.1vh, 18px);font-weight:600;color:var(--ink)}
.fw-ml-path__stop time{margin-top:4px;padding:4px 12px;border-radius:100px;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ac-ink);background:var(--ac-l)}

/* ══════════════════════════════════════════════════════════════
   03 · THE TIMELINE
   One line running sideways, oldest first, edge to edge of the page
   (the track bleeds into the gutters and snaps a moment to the
   gutter). Each moment: its kind's icon and the year on the line, then
   the photograph with its figure, the date, the story and the place.
   Arrows on the heading row; a thin progress line under the track
   follows the scroll where the browser has scroll timelines. "Today"
   closes the line with an arrowhead.
   ══════════════════════════════════════════════════════════════ */

.fw-ml-time .fw-ml-head{margin-bottom:clamp(14px, 2.4vh, 22px)}
.fw-ml-time{timeline-scope:--fw-ml-x;background:radial-gradient(60% 40% at 50% 0%, var(--pk-wash), transparent 70%), var(--wh)}
.fw-ml-head--row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 24px}
.fw-ml-head__say{display:grid;gap:8px}
.fw-ml-arrows{display:flex;gap:10px}
.fw-ml-arrows button{display:grid;place-items:center;width:clamp(46px, 6vh, 54px);height:clamp(46px, 6vh, 54px);padding:0;border:0;border-radius:50%;cursor:pointer;font-size:18px;color:var(--wh);background:linear-gradient(135deg, var(--pk), var(--pk-dd));box-shadow:var(--pk-glow);transition:transform .25s var(--ease), box-shadow .25s, background .25s, color .25s}
.fw-ml-arrows button:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--pk-glow-lg)}
.fw-ml-arrows button:disabled{cursor:default;color:var(--g4);background:var(--wh);box-shadow:inset 0 0 0 1.5px var(--line)}
.fw-ml-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 clamp(10px, 2vh, 18px)}
.fw-ml-chips button{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 8px 0 14px;border:0;border-radius:100px;cursor:pointer;font-family:var(--ff);font-size:13.5px;font-weight:600;color:var(--g7);background:var(--wh);box-shadow:inset 0 0 0 1px var(--line);transition:background .25s, color .25s, box-shadow .25s}
.fw-ml-chips button .fw-ico{width:16px;height:16px;color:var(--ac-ink)}
.fw-ml-chips button span{display:grid;place-items:center;min-width:24px;height:24px;padding:0 7px;border-radius:100px;font-size:11.5px;font-weight:700;color:var(--ac-ink);background:var(--ac-l)}
.fw-ml-chips button:hover{box-shadow:inset 0 0 0 1.5px var(--ac)}
.fw-ml-chips button.is-on{color:var(--wh);background:var(--ac);box-shadow:none}
.fw-ml-chips button.is-on .fw-ico{color:var(--wh)}
.fw-ml-chips button.is-on span{color:var(--ac-ink);background:var(--wh)}

.fw-ml-rail{--node:50px;--w:clamp(270px, 23vw, 350px);--tgap:clamp(22px, 2.6vw, 40px);position:relative;margin:0 calc(-1 * var(--pad))}
.fw-ml-track{display:flex;align-items:stretch;gap:var(--tgap);margin:0;padding:8px var(--pad) clamp(12px, 2vh, 18px);list-style:none;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);scroll-timeline:--fw-ml-x inline;scrollbar-width:none;outline:0}
.fw-ml-track::-webkit-scrollbar{display:none}
.fw-ml-track:focus-visible{box-shadow:inset 0 0 0 2px var(--bl-ring)}
.fw-ml-item,.fw-ml-now{position:relative;flex:0 0 var(--w);display:flex;flex-direction:column;gap:clamp(12px, 2vh, 16px);scroll-snap-align:start}
.fw-ml-item[hidden]{display:none}
.fw-ml-axis{position:relative;display:flex;align-items:center;gap:12px;height:var(--node)}
/* the line: from this moment's node to the next one's, in this moment's colour */
.fw-ml-axis::before{content:"";position:absolute;left:calc(var(--node) / 2);right:calc(-1 * var(--tgap));top:50%;height:3px;margin-top:-1.5px;border-radius:3px;background:linear-gradient(90deg, var(--ac), var(--ac-l))}
.fw-ml-node{position:relative;z-index:1;display:grid;place-items:center;flex:0 0 auto;width:var(--node);height:var(--node);border-radius:50%;color:var(--wh);background:var(--ac);box-shadow:0 0 0 6px var(--wh), 0 0 0 8px var(--ac-l), 0 14px 26px -16px var(--ac)}
.fw-ml-node .fw-ico{width:23px;height:23px}
.fw-ml-item.is-big .fw-ml-node{background:linear-gradient(135deg, var(--ac), var(--ac-ink));box-shadow:0 0 0 6px var(--wh), 0 0 0 9px var(--ac), 0 16px 30px -14px var(--ac)}
.fw-ml-yr{position:relative;z-index:1;padding:5px 14px;border-radius:100px;font-size:clamp(18px, 2.6vh, 24px);font-weight:700;line-height:1;letter-spacing:-.02em;color:var(--ac-ink);background:var(--wh);box-shadow:inset 0 0 0 1.5px var(--ac-l)}
.fw-ml-yr.is-same{display:none}
.fw-ml-track.is-filtered .fw-ml-yr.is-same{display:inline-block}

.fw-ml-moment{display:flex;flex-direction:column;gap:6px;flex:1}
.fw-ml-moment__pic{position:relative;margin:0 0 4px;width:100%;aspect-ratio:16 / 10;overflow:hidden;background:var(--ac-l)}
.fw-ml-moment__pic img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease-soft)}
.fw-ml-moment:hover .fw-ml-moment__pic img{transform:scale(1.03)}
.fw-ml-moment__art{position:absolute;inset:0;display:grid;place-items:center;color:var(--ac);background:radial-gradient(circle at 30% 25%, var(--wh), var(--ac-l) 70%)}
.fw-ml-moment__art .fw-ico{width:72px;height:72px;stroke-width:1.2}
.fw-ml-moment__pic figcaption{position:absolute;left:12px;bottom:12px;display:grid;padding:9px 14px;border-radius:14px;line-height:1.05;background:var(--wh);box-shadow:var(--sh-soft)}
.fw-ml-moment__pic figcaption b{font-size:clamp(24px, 3.6vh, 32px);font-weight:700;letter-spacing:-.03em;color:var(--ac-ink)}
.fw-ml-moment__pic figcaption span{font-size:12px;font-weight:600;color:var(--g6)}
.fw-ml-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--g5)}
.fw-ml-pill{padding:4px 10px;border-radius:100px;font-size:11px;letter-spacing:.04em;color:var(--ac-ink);background:var(--ac-l)}
.fw-ml-moment__h{margin:0;font-family:var(--ff);font-size:clamp(18px, 2.6vh, 22px);font-weight:700;line-height:1.25;letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.fw-ml-moment__x{margin:0;font-size:clamp(14.5px, 1.9vh, 15.5px);line-height:1.6;color:var(--g6);text-wrap:pretty}
.fw-ml-place{display:flex;align-items:center;gap:8px;margin:auto 0 0;padding-top:4px;font-size:13px;font-weight:600;color:var(--g6)}
.fw-ml-place img{display:block;width:18px;height:13px;object-fit:cover}
.fw-ml-place .bi{color:var(--ac-ink)}

/* today: the line ends in an arrowhead at a sparkle */
.fw-ml-now{--ac:var(--bl);--ac-l:var(--bl-l)}
.fw-ml-now .fw-ml-axis::before{display:none}
.fw-ml-now .fw-ml-axis::after{content:"";position:absolute;left:-14px;top:50%;margin-top:-7px;border-left:11px solid var(--bl);border-top:7px solid transparent;border-bottom:7px solid transparent}
.fw-ml-now .fw-ml-node{background:linear-gradient(135deg, var(--pk), var(--bl))}
.fw-ml-now__say{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:clamp(20px, 3.4vh, 32px) clamp(18px, 2vw, 28px);background:radial-gradient(120% 80% at 0% 0%, var(--pk-wash), transparent 60%), linear-gradient(160deg, var(--wh), var(--bl-wash))}
.fw-ml-now__say .fw-ml-btn{margin-top:auto}

.fw-ml-progress{display:none;height:3px;margin:0 var(--pad);border-radius:3px;overflow:hidden;background:var(--g1)}
@supports (animation-timeline: scroll()){
	.fw-ml-progress{display:block}
	.fw-ml-progress i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg, var(--pk), var(--pu), var(--bl));transform-origin:left;animation:fw-ml-prog linear both;animation-timeline:--fw-ml-x}
	@keyframes fw-ml-prog{from{transform:scaleX(.06)}to{transform:scaleX(1)}}
}
.fw-ml-empty{margin:16px 0 0;font-size:15px;color:var(--g6)}
.fw-ml-empty button{border:0;padding:0;cursor:pointer;font:inherit;font-weight:700;color:var(--bl-ink);background:none;text-decoration:underline;text-underline-offset:3px}

/* the rise-in, only when the script is there to bring things back */
.fw-ml-track.is-ready .fw-ml-item .fw-ml-moment{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease-soft), transform .9s var(--ease-soft)}
.fw-ml-track.is-ready .fw-ml-item .fw-ml-node{opacity:0;transform:scale(.4);transition:transform .7s var(--ease) .1s, opacity .5s .1s}
.fw-ml-track.is-ready .fw-ml-item.is-in .fw-ml-moment,
.fw-ml-track.is-ready .fw-ml-item.is-in .fw-ml-node{opacity:1;transform:none}

/* ══════════════════════════════════════════════════════════════
   04 · IN THEIR WORDS
   The families' and doctors' words side by side, split by soft fades;
   each ends level on the moment it belongs to.
   ══════════════════════════════════════════════════════════════ */

.fw-ml-voices{background:radial-gradient(70% 70% at 50% 0%, var(--pk-wash), transparent 70%), var(--wh)}
.fw-ml-voices__list{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-auto-rows:auto;margin:0;padding:0;list-style:none}
.fw-ml-voices__list--1{grid-template-columns:minmax(0, 1fr)}
.fw-ml-voices__list--2{grid-template-columns:repeat(2, minmax(0, 1fr))}
.fw-ml-voices__list--3{grid-template-columns:repeat(3, minmax(0, 1fr))}
.fw-ml-voices__list li{position:relative;display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:18px;padding:0 clamp(16px, 2.2vw, 36px)}
.fw-ml-voices__list li:first-child{padding-left:0}
.fw-ml-voices__list li:last-child{padding-right:0}
.fw-ml-voices__list li + li::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:linear-gradient(180deg, transparent, var(--line) 15%, var(--line) 85%, transparent)}
.fw-ml-voice{margin:0;padding:0;border:0}
.fw-ml-voice__mark{display:block;height:46px;font-size:88px;font-weight:700;line-height:1;color:var(--ac)}
.fw-ml-voice p{margin:0;font-size:clamp(16.5px, 2.3vh, 19.5px);font-weight:500;line-height:1.5;color:var(--ink);text-wrap:pretty}
.fw-ml-voice footer{margin-top:10px;font-size:13.5px;font-weight:700;color:var(--ac-ink)}
.fw-ml-voice__on{position:relative;display:flex;align-items:flex-start;gap:10px;margin:0;padding-top:14px}
.fw-ml-voice__on::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg, var(--line), transparent)}
.fw-ml-voice__ico{display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:50%;color:var(--ac-ink);background:var(--ac-l)}
.fw-ml-voice__ico .fw-ico{width:18px;height:18px}
.fw-ml-voice__on > span:last-child{display:grid;line-height:1.35}
.fw-ml-voice__on b{font-size:13.5px;font-weight:700;color:var(--ink)}
.fw-ml-voice__on time{font-size:12px;font-weight:600;color:var(--g5)}

/* ══════════════════════════════════════════════════════════════
   05 · HOW WE COUNT A MILESTONE
   The heading on the left; the team's own steps (Manage) on the right,
   numbered icon discs joined by a dashed arrow, one row whatever the
   count.
   ══════════════════════════════════════════════════════════════ */

.fw-ml-count__grid{display:grid;grid-template-columns:minmax(0, .8fr) minmax(0, 2fr);gap:var(--gap);align-items:center}
.fw-ml-count__say{margin:0}
.fw-ml-steps{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0, 1fr);margin:0;padding:0;list-style:none}
.fw-ml-steps li{position:relative;display:grid;align-content:start;gap:8px;padding-right:clamp(14px, 1.8vw, 28px)}
.fw-ml-steps li:not(:last-child)::after{content:"";position:absolute;top:29px;left:76px;right:18px;height:2px;background:repeating-linear-gradient(90deg, var(--bl-ring) 0 7px, transparent 7px 13px)}
.fw-ml-steps li:not(:last-child)::before{content:"";position:absolute;top:24px;right:9px;border-left:10px solid var(--bl-ring);border-top:6px solid transparent;border-bottom:6px solid transparent}
.fw-ml-steps__ico{position:relative;display:grid;place-items:center;width:60px;height:60px;margin-bottom:6px;border-radius:50%;color:var(--bl-ink);background:var(--bl-l);box-shadow:0 0 0 6px var(--bl-wash)}
.fw-ml-steps__ico .fw-ico{width:26px;height:26px}
.fw-ml-steps__ico em{position:absolute;top:-4px;right:-6px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-size:12px;font-weight:700;color:var(--wh);background:var(--pk-dd);box-shadow:0 0 0 3px var(--wh)}
.fw-ml-steps h3{margin:0;font-family:var(--ff);font-size:clamp(16px, 2.2vh, 18.5px);font-weight:700;line-height:1.3;color:var(--ink)}
.fw-ml-steps p{margin:0;font-size:14.5px;line-height:1.6;color:var(--g6);text-wrap:pretty}

/* ══════════════════════════════════════════════════════════════
   06 · QUESTIONS
   The heading and a few facts on the left (they end level with the
   answers), the questions on the right.
   ══════════════════════════════════════════════════════════════ */

.fw-ml-faq{background:linear-gradient(180deg, var(--wh), var(--bl-wash))}
.fw-ml-faq__grid{display:grid;grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);gap:var(--gap);align-items:stretch}
.fw-ml-faq__say{display:flex;flex-direction:column}
.fw-ml-faq__say .fw-ml-head{margin-bottom:clamp(16px, 3vh, 26px)}
.fw-ml-facts{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:0 clamp(16px, 2vw, 32px);margin:auto 0 0}
.fw-ml-facts > div{position:relative;display:grid;gap:2px;padding:12px 0}
.fw-ml-facts > div::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg, var(--line), transparent)}
.fw-ml-facts dt{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--g5)}
.fw-ml-facts dd{margin:0;font-size:clamp(20px, 3vh, 26px);font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.fw-ml-q{position:relative}
.fw-ml-q + .fw-ml-q::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:var(--fade-x)}
.fw-ml-q summary{display:grid;grid-template-columns:auto minmax(0, 1fr) auto;align-items:center;gap:14px;padding:clamp(12px, 2vh, 17px) 6px;cursor:pointer;list-style:none}
.fw-ml-q summary::-webkit-details-marker{display:none}
.fw-ml-q__n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;font-size:12.5px;font-weight:700;color:var(--pk-dd);background:var(--pk-l);transition:background .25s, color .25s}
.fw-ml-q__t{font-size:clamp(15px, 2vh, 17px);font-weight:600;line-height:1.4;color:var(--ink);transition:color .25s}
.fw-ml-q summary > i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-size:13px;color:var(--g6);background:var(--wh);box-shadow:inset 0 0 0 1px var(--line);transition:transform .3s var(--ease), color .25s, background .25s}
.fw-ml-q summary:hover .fw-ml-q__t,.fw-ml-q[open] .fw-ml-q__t{color:var(--pk-dd)}
.fw-ml-q p{margin:0;padding:0 48px clamp(14px, 2.2vh, 20px) calc(36px + 14px + 6px);font-size:15px;line-height:1.7;color:var(--g6)}
.fw-ml-q[open] .fw-ml-q__n{color:var(--wh);background:var(--pk-dd)}
.fw-ml-q[open] summary > i{transform:rotate(45deg);color:var(--wh);background:var(--pk-dd);box-shadow:none}

/* ══════════════════════════════════════════════════════════════
   07 · YOUR FAMILY, THE NEXT MILESTONE
   The family photograph at the words' exact height, the invitation
   beside it.
   ══════════════════════════════════════════════════════════════ */

.fw-ml-close__grid{display:grid;grid-template-columns:auto minmax(0, 1fr);gap:var(--gap);align-items:stretch}
.fw-ml-pic{position:relative;margin:0;line-height:0;height:100%;min-height:280px;aspect-ratio:1400 / 1050;max-width:48vw;background:var(--g1)}
.fw-ml-pic img{display:block;width:100%;height:100%}
.fw-ml-close__say{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px}
.fw-ml-close__say .fw-ml-note{margin-top:6px}

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

@media (max-width: 1024px){
	.fw-ml-mast__grid,.fw-ml-close__grid,.fw-ml-count__grid,.fw-ml-faq__grid{grid-template-columns:minmax(0, 1fr)}
	.fw-ml-mast__fig{justify-self:start}
	.fw-ml-mast__fig img{height:auto;width:100%}
	.fw-ml-badge{left:12px}
	.fw-ml-pic{height:auto;max-width:none;width:100%;min-height:0}
	.fw-ml-pic img{height:auto;aspect-ratio:1400 / 1050}
	.fw-ml-path__list{--disc:58px}
	.fw-ml-path__go{font-size:11px;padding:4px 9px}
	.fw-ml-voices__list,.fw-ml-voices__list--3{grid-template-columns:repeat(2, minmax(0, 1fr));row-gap:32px}
	.fw-ml-voices__list li:nth-child(odd){padding-left:0}
	.fw-ml-voices__list li:nth-child(even){padding-right:0}
	.fw-ml-voices__list li:nth-child(odd)::before{display:none}
	.fw-ml-steps{grid-auto-flow:row;grid-template-columns:repeat(2, minmax(0, 1fr));row-gap:28px}
	.fw-ml-steps li::before,.fw-ml-steps li::after{display:none}
	.fw-ml-facts{margin-top:0}
}
@media (max-width: 768px){
	.fw-ml-page{--pad:14px}
	.fw-ml .fw-ml-h1{font-size:clamp(30px, 8.4vw, 40px)}
	.fw-ml-act{width:100%}
	.fw-ml-act .fw-ml-btn{width:100%}
	.fw-ml-badge{position:static;margin-top:10px;border-radius:18px;box-shadow:inset 0 0 0 1px var(--line)}
	.fw-ml-trust{grid-template-columns:repeat(3, minmax(0, 1fr))}
	.fw-ml-trust li{padding:0 10px}
	/* the path runs down the left: discs on a dashed line, words beside */
	.fw-ml-path__list,.fw-ml-path__list--2,.fw-ml-path__list--3{--disc:52px;grid-template-columns:minmax(0, 1fr)}
	.fw-ml-path__stop{grid-template-columns:var(--disc) minmax(0, 1fr);justify-items:start;column-gap:18px;row-gap:2px;padding:0 0 24px;text-align:left}
	.fw-ml-path__stop + .fw-ml-path__stop::before{display:none}
	.fw-ml-path__stop::after,.fw-ml-path__stop + .fw-ml-path__stop::after{content:"";position:absolute;left:calc(var(--disc) / 2 - 1px);right:auto;top:0;bottom:0;width:2px;height:auto;border:0;background:repeating-linear-gradient(180deg, var(--ac) 0 7px, transparent 7px 12px)}
	.fw-ml-path__stop:first-child::after{top:calc(var(--disc) / 2)}
	.fw-ml-path__stop:last-child::after{bottom:auto;height:30px}
	.fw-ml-path__go{position:static;grid-column:2;transform:none;margin-bottom:6px}
	.fw-ml-path__ico{grid-column:1;grid-row:span 3;z-index:1}
	.fw-ml-path__stop:not(:first-child) .fw-ml-path__ico{grid-row:2 / span 3}
	.fw-ml-path__stop b,.fw-ml-path__l,.fw-ml-path__stop time{grid-column:2}
	.fw-ml-path__stop b{margin-top:0;font-size:clamp(36px, 11vw, 48px)}
	.fw-ml-rail{--w:80vw;--node:48px}
	.fw-ml-arrows button{width:44px;height:44px;font-size:16px}
	.fw-ml-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-left:calc(-1 * var(--pad));margin-right:calc(-1 * var(--pad));padding:0 var(--pad)}
	.fw-ml-chips button{flex:0 0 auto}
	.fw-ml-voices__list,.fw-ml-voices__list--2,.fw-ml-voices__list--3{grid-template-columns:minmax(0, 1fr);row-gap:0}
	.fw-ml-voices__list li,.fw-ml-voices__list li:nth-child(n){padding:22px 0}
	.fw-ml-voices__list li:first-child{padding-top:0}
	.fw-ml-voices__list li + li::before,.fw-ml-voices__list li:nth-child(odd)::before{display:block;left:0;right:0;top:0;bottom:auto;width:auto;height:1px;background:var(--fade-x)}
	.fw-ml-steps{grid-template-columns:minmax(0, 1fr)}
	.fw-ml-steps li{grid-template-columns:60px minmax(0, 1fr);column-gap:16px;padding-right:0}
	.fw-ml-steps__ico{grid-row:span 2;margin:0}
	.fw-ml-q p{padding:0 6px clamp(14px, 2.2vh, 20px)}
}
@media (prefers-reduced-motion: reduce){
	.fw-ml *{transition:none!important;animation:none!important}
	.fw-ml-track{scroll-behavior:auto}
}