:root{--yellow:#FFC83B;--pale:#FFECB3;--line:rgba(255,255,255,.17);--muted:rgba(255,255,255,.64);--dim:rgba(255,255,255,.4);--ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1);
/* District's palette, used only where the work itself is shown */
--eq-purple:#7801FB;--eq-plum:#1D0B38;--eq-beige:#F2EBE3;--eq-tile:#F4F2EE;--eq-lilac:#E9DDFF}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:#000;color:#fff;font-family:Manrope,sans-serif;-webkit-font-smoothing:antialiased}
body:before{content:"";position:fixed;inset:0;z-index:-1;background-image:linear-gradient(to right,#ffffff09 1px,transparent 1px),linear-gradient(to bottom,#ffffff09 1px,transparent 1px);background-size:120px 120px}
a{color:inherit}button{font:inherit;cursor:pointer;color:inherit}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--yellow);outline-offset:5px}
img{display:block;max-width:100%}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
h3,h4{margin:0}
/* layout system (design.md §4): vertical rhythm only */
main{--eq-sub:16px;--eq-media:32px;--eq-section:120px;padding-bottom:var(--eq-section)}
@media(max-width:900px){main{--eq-sub:12px;--eq-media:24px;--eq-section:80px}}
.body{font-size:14px;line-height:1.85;color:var(--muted)}
h2{font-size:clamp(32px,3.6vw,48px);font-weight:500;line-height:1.1;letter-spacing:-.045em;margin:0}
.eq-q{font-size:clamp(22px,2.3vw,30px);font-weight:500;line-height:1.15;letter-spacing:-.035em;text-wrap:balance}
.cap{font:11px/1.6 DMMono,monospace;color:var(--dim);margin-top:10px}
.hint{display:none;font:11px/1.6 DMMono,monospace;color:var(--dim);margin-top:10px}
.lbl{font:500 10px/1.4 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase}

/* hero */
.eq-hero{padding:96px 0 0}
.eq-hero h1{font-size:clamp(46px,7.2vw,104px);font-weight:500;line-height:.98;letter-spacing:-.055em;margin:0 0 var(--eq-sub);max-width:20ch}
.eq-hero h1 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.eq-hero h1 .w span{display:inline-block;transform:translateY(125%);opacity:0;animation:rise .7s var(--ease-out) forwards;animation-delay:calc(var(--i)*70ms + 80ms)}
@keyframes rise{to{transform:translateY(0);opacity:1}}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:64px;align-items:start}.hero-grid>*{min-width:0}
.eq-lead{font-size:16px;line-height:1.75;color:var(--muted);max-width:56ch}
.meta{display:flex;flex-direction:column;gap:16px;font:11px/1.7 DMMono,Mono,monospace;color:var(--muted);border-top:1px solid var(--line);padding-top:22px;margin:0}
.meta b{display:block;color:var(--pale);font-weight:500;margin-bottom:4px}
.fade{opacity:0;animation:fadein .8s var(--ease-out) forwards}
@keyframes fadein{to{opacity:1}}
.fade.d1{animation-delay:.45s}
.hero-visual{margin:var(--eq-media) 0 0;border:1px solid var(--line);overflow:hidden;aspect-ratio:16/9;background:var(--eq-purple);transform:scale(.975);opacity:0;animation:filmin .9s var(--ease-out) .55s forwards}
@keyframes filmin{to{transform:scale(1);opacity:1}}
.hero-visual img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);animation:settle 2.4s var(--ease-out) .55s forwards}
@keyframes settle{to{transform:scale(1)}}

/* sections */
.section{padding:var(--eq-section) 0 0}
.split{display:grid;grid-template-columns:.9fr 1.3fr;gap:70px;align-items:start;margin-bottom:var(--eq-media)}
.split>*{min-width:0}
.split .body p+p{margin-top:var(--eq-sub)}
.split .body{max-width:58ch}
.eq-below{margin-top:var(--eq-sub);max-width:40ch}
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);transition-delay:calc(var(--i,0)*70ms)}
.rv.in{opacity:1;transform:none}
figcaption,.out{padding:12px 14px 14px;font:11px/1.6 DMMono,monospace;color:var(--dim);border-top:1px solid var(--line)}
.out{border-top:0;padding:10px 0 0}

/* ---------- the story layer: Romil's narration, on the site's own black ---------- */
.eq-opener{max-width:780px}
.eq-partno{color:var(--yellow);margin-bottom:var(--eq-sub);font:500 11px/1.4 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase}
.eq-opener-lead{font-size:clamp(18px,1.7vw,22px);line-height:1.6;color:rgba(255,255,255,.82);margin-top:var(--eq-sub);max-width:46ch;letter-spacing:-.01em}

/* Rahul's table: the party, seated */
.eq-party{display:grid;grid-template-columns:150px 1fr 150px;grid-template-rows:auto auto auto;column-gap:24px;row-gap:14px;align-items:center}
.eq-party .top,.eq-party .bottom{grid-column:2;display:grid;justify-items:center}
.eq-party .top{grid-row:1;grid-template-columns:repeat(4,1fr)}
.eq-party .bottom{grid-row:3;grid-template-columns:repeat(3,1fr);padding:0 12%}
.eq-party .tablebar{grid-column:2;grid-row:2;background:var(--eq-beige);color:#5b4a6e;font:500 11px/1 DMMono,monospace;letter-spacing:.14em;text-transform:uppercase;text-align:center;padding:42px 12px}
.eq-party .host{grid-column:1;grid-row:1/4}
.eq-party .baby{grid-column:3;grid-row:1/4}
.seat-wrap{display:grid;justify-items:center;text-align:center;gap:3px;transition:transform .5s var(--ease-out),opacity .5s var(--ease-out);transition-delay:calc(var(--s,0)*80ms + 150ms)}
.eq-party:not(.in) .seat-wrap{opacity:0;transform:scale(.9)}
.seat{width:76px;height:76px;border-radius:50%;background:var(--eq-purple) var(--g) center/48% no-repeat;margin-bottom:8px;display:grid;place-items:center;font:600 26px/1 Manrope,sans-serif}
.seat.r{background:var(--eq-plum);border:1px solid #ffffff30}
.seat.k{width:58px;height:58px;background:var(--eq-lilac);color:var(--eq-purple);font-size:20px}
.seat-wrap b{font-size:15px;font-weight:600;letter-spacing:-.01em}
.seat-wrap small{font-size:12px;line-height:1.45;color:var(--muted);max-width:18ch}
.eq-party .top .seat-wrap{order:0}.eq-party .top .seat{order:3;margin:8px 0 0}
.eq-say{font-size:clamp(22px,2.3vw,30px);font-weight:500;letter-spacing:-.035em;line-height:1.2;margin-top:var(--eq-media);max-width:28ch}

/* the afternoon of phone calls */
.eq-calls{display:grid;gap:10px;justify-items:end}
.eq-calls li{background:#fff;color:var(--eq-plum);padding:14px 20px 16px;font-size:17px;font-weight:600;letter-spacing:-.015em;line-height:1.35;max-width:100%}
.eq-calls li:nth-child(2n){margin-right:56px}
.eq-calls li b{display:block;font:500 10px/1.4 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--eq-purple);margin-bottom:4px}
.eq-calls .reply{margin:14px 120px 0 0;background:#3a1f6b;color:#fff}
.eq-calls .reply b{color:#cbb5ff}

/* who the table is for */
.eq-guests{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
.eq-guests li{background:var(--eq-tile);color:#1D0B38;font-size:13px;font-weight:600;line-height:1.3;padding:20px 14px 18px;display:grid;gap:14px;min-width:0}
.gi{width:46px;height:46px;background:var(--eq-purple);-webkit-mask:var(--g) center/contain no-repeat;mask:var(--g) center/contain no-repeat}
.eq-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:var(--eq-media)}
.eq-stat{padding:28px 28px 0;border-right:1px solid var(--line);min-width:0}
.eq-stat:first-child{padding-left:0}.eq-stat:last-child{border-right:0}
.eq-stat .num{display:block;font-size:clamp(40px,4.6vw,64px);font-weight:500;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.eq-stat .say{display:block;font-size:clamp(24px,2.4vw,32px);font-weight:500;letter-spacing:-.035em;line-height:1.1;color:var(--yellow)}
.eq-stat p{font-size:13px;line-height:1.75;color:var(--muted);margin-top:var(--eq-sub);max-width:30ch}
.eq-stats+.cap{margin-top:22px}

/* the day: eleven stops, each with its time and how far through the evening it is */
.eq-stop{padding-top:var(--eq-section)}
.stop-head{display:flex;align-items:center;gap:18px;margin-bottom:var(--eq-sub);font:500 12px/1 DMMono,monospace;letter-spacing:.08em;text-transform:uppercase}
.stop-head .time{color:var(--yellow);font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
.stop-head .where{color:var(--pale);white-space:nowrap}
.stop-head .route{flex:1;min-width:120px;height:10px;position:relative;background:linear-gradient(var(--line),var(--line)) 0 50%/100% 1px no-repeat}
.stop-head .route:before{content:"";position:absolute;left:0;top:4px;height:2px;width:calc((var(--n) - 1) / 10 * 100%);background:#fff}
.stop-head .route:after{content:"";position:absolute;top:0;left:calc((var(--n) - 1) / 10 * 100% - 5px);width:10px;height:10px;border-radius:50%;background:var(--yellow)}
.stop-body{display:grid;grid-template-columns:.9fr 1.3fr;gap:70px;align-items:start}
.stop-body>*{min-width:0}
.stop-copy>p{font-size:15px;line-height:1.8;color:var(--muted);margin-top:var(--eq-sub);max-width:46ch}
.stop-copy .eq-q{max-width:18ch}
.well{border:1px solid var(--line);display:flex;justify-content:center;gap:16px;padding:28px 20px}
.well.plum{background:var(--eq-plum)}
.well img{width:100%;max-width:280px;height:auto;cursor:zoom-in}
.well.two img{max-width:250px;min-width:0;flex:1}
.photos{display:grid;gap:16px}
.photos.two{grid-template-columns:1fr 1fr}
.photos img{width:100%;border:1px solid var(--line);cursor:zoom-in}
.photos.two img{aspect-ratio:5/8;object-fit:cover}
.piece,.pieces figure{margin:0;border:1px solid var(--line);background:var(--eq-tile);min-width:0}
.piece{margin-top:var(--eq-media)}
.piece img,.pieces img{width:100%;cursor:zoom-in}
.piece figcaption,.pieces figcaption{background:#000}
.pieces{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.eq-sees{margin-top:var(--eq-media);background:#fff;color:var(--eq-plum);padding:22px 24px 24px;max-width:440px}
.eq-sees .lbl{color:var(--eq-purple)}
.eq-sees .when{font-size:19px;font-weight:600;letter-spacing:-.02em;line-height:1.3;margin:10px 0 14px;padding-bottom:14px;border-bottom:1px solid #1D0B3825}
.eq-sees li{font-size:14px;line-height:1.5;padding-left:18px;position:relative;margin-top:6px}
.eq-sees li:before{content:"";position:absolute;left:2px;top:7px;width:7px;height:7px;border-radius:50%;background:var(--eq-purple)}
.eq-spoken{margin-top:var(--eq-media);display:grid;gap:8px;counter-reset:s}
.eq-spoken li{counter-increment:s;display:grid;grid-template-columns:26px 1fr;gap:12px;align-items:start;background:#fff;color:var(--eq-plum);padding:12px 16px;font-size:14px;font-weight:600;line-height:1.45}
.eq-spoken li:before{content:counter(s);width:24px;height:24px;border-radius:50%;background:var(--eq-purple);color:#fff;font:600 12px/24px Manrope,sans-serif;text-align:center}
.eq-end{max-width:900px}
.eq-big{font-size:clamp(34px,4.6vw,64px);font-weight:500;letter-spacing:-.05em;line-height:1.05;text-wrap:balance}
.eq-end .body{margin-top:var(--eq-sub);max-width:52ch;font-size:16px}

/* ---------- the work, in District's colours ---------- */
.eq-checks{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.eq-checks li{background:var(--eq-tile);color:var(--eq-plum);padding:22px 20px 24px;display:grid;gap:8px;align-content:start;min-width:0}
.eq-checks img{width:52px;height:auto;margin:0 0 14px -6px}
.eq-checks b{font:500 10px/1 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--eq-purple)}
.eq-checks span{font-size:16px;font-weight:600;letter-spacing:-.02em;line-height:1.25}

.eq-personas{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.persona{display:grid;grid-template-columns:.62fr 1fr;background:var(--eq-tile);color:var(--eq-plum);min-width:0}
.persona img{width:100%;height:100%;object-fit:cover}
.persona>div{padding:26px 24px 28px;min-width:0}
.persona .lbl{color:var(--eq-purple)}
.persona h4{font-size:22px;font-weight:600;letter-spacing:-.025em;line-height:1.15;margin:10px 0 12px}
.persona p:not(.lbl){font-size:13px;line-height:1.6;color:#4b3d5c}
.persona dl{margin:18px 0 0;font-size:13px;line-height:1.5}
.persona dt{font:500 10px/1.4 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--eq-purple);margin:14px 0 6px}
.persona dd{margin:0 0 4px;font-weight:600}

.eq-house{max-width:900px;margin-left:auto;display:grid;gap:10px}
.eq-house .roof{background:var(--eq-plum);clip-path:polygon(50% 0,100% 100%,0 100%);aspect-ratio:900/150;display:grid;place-items:end center;padding-bottom:18px}
.eq-house .roof span{font-size:clamp(14px,1.5vw,19px);font-weight:600;max-width:24ch;text-align:center;line-height:1.3}
.eq-house .beam{background:var(--eq-purple);font-size:clamp(18px,2vw,26px);font-weight:600;letter-spacing:-.02em;text-align:center;padding:20px 12px}
.eq-house .pillars{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.eq-house .pillars li{background:#ECECEC;color:var(--eq-plum);font-size:14px;font-weight:600;line-height:1.3;text-align:center;padding:64px 10px;display:grid;place-items:center}
.eq-house .pillars .g{background:var(--eq-beige)}
.eq-house .ground{height:12px;background:var(--eq-plum);border:1px solid var(--line)}
.eq-house .legend{display:grid;grid-template-columns:1fr 1fr;font:500 10px/1.4 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--pale)}

.eq-who li{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:baseline;padding:18px 0;border-top:1px solid var(--line)}
.eq-who li:last-child{border-bottom:1px solid var(--line)}
.eq-who b{font-size:clamp(20px,2vw,26px);font-weight:500;letter-spacing:-.03em;color:var(--dim)}
.eq-who span{font-size:14px;line-height:1.6;color:var(--dim)}
.eq-who .yes b{color:#fff}.eq-who .yes span{color:var(--muted)}
.eq-tone{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.eq-tone>div{padding:30px 30px 34px;display:grid;gap:26px;align-content:start;min-width:0}
.eq-tone .are{background:var(--eq-purple)}
.eq-tone .not{background:var(--eq-tile);color:var(--eq-plum)}
.eq-tone .are .lbl{color:rgba(255,255,255,.75)}.eq-tone .not .lbl{color:var(--eq-purple)}
.eq-tone h4{font-size:20px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.eq-tone p:not(.lbl){font-size:13px;line-height:1.6;margin-top:4px;opacity:.78}
.eq-tone q,.eq-tone s{display:block;font-size:15px;font-weight:600;line-height:1.4;margin-top:10px}
.eq-tone q{quotes:"“" "”"}
.eq-tone s{color:#8a8191;text-decoration-thickness:1px}
.eq-tone s:before{content:"“"}.eq-tone s:after{content:"”"}

.eq-mark{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.eq-mark li{display:grid;grid-template-rows:auto auto 1fr;gap:6px;min-width:0}
.eq-mark img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--line);margin-bottom:8px}
.eq-mark b{font-size:15px;font-weight:600;letter-spacing:-.02em}
.eq-mark span{font-size:13px;line-height:1.7;color:var(--muted)}

.pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.pair figure{margin:0;border:1px solid var(--line);background:#111;overflow:hidden;min-width:0}
.pair img{width:100%;cursor:zoom-in}
.eq-wide{margin:0 0 16px;border:1px solid var(--line);background:#111;overflow:hidden}.eq-wide img{width:100%;cursor:zoom-in}
.eq-route{margin:16px 0 0;border:1px solid var(--line);background:#fff}
.eq-route .scroll{overflow-x:auto}
.eq-route img{width:100%;cursor:zoom-in}
.eq-route figcaption{background:#000}

.eq-table{border-top:1px solid var(--line)}
.eq-table .row{display:grid;grid-template-columns:1fr 1.1fr 1.1fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--line);font-size:14px;line-height:1.6;color:var(--muted)}
.eq-table .row>*{min-width:0}
.eq-table .row b{color:#fff;font-weight:600}
.eq-table .head{font:500 10px/1.6 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--pale);padding:14px 0}
.eq-routes{display:grid;grid-template-columns:1fr 1fr .82fr;gap:16px;align-items:start;margin-top:var(--eq-media)}
.eq-routes figure{margin:0;border:1px solid var(--line);background:#0B0B0B;min-width:0}
.eq-routes img{width:100%}
.eq-routes .made{grid-column:3;grid-row:1/3}
.eq-routes figcaption{font:13px/1.6 Manrope,sans-serif;color:var(--muted);padding:14px 16px 18px}
.eq-routes figcaption b{display:block;font:500 11px/1.6 DMMono,monospace;color:var(--pale);margin-bottom:4px}
.eq-routes .made figcaption b{color:var(--yellow)}

/* the insight: one chooses, eight come */
.eq-insight{display:grid;justify-items:center;gap:12px;padding:8px 0}
.eq-insight .seats{display:flex;gap:14px}
.eq-insight i{width:64px;height:64px;border-radius:50%;background:#3a3340}
.eq-insight .chooser{background:var(--eq-purple) url(images/projects/equitable/g-mobility.png) center/50% no-repeat;transition-delay:0s}
.eq-insight .tb{width:min(100%,320px);background:var(--eq-tile);display:grid;place-items:center;padding:10px}
.eq-insight .tb img{width:64px}
.eq-insight p{font-size:15px;font-weight:600;margin-top:10px}

.eq-gets{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.eq-gets li{border:1px solid var(--line);background:#0B0B0B;padding:26px 26px 30px;min-width:0}
.eq-gets .n{display:block;font-size:56px;font-weight:500;letter-spacing:-.05em;line-height:1;color:var(--eq-purple)}
.eq-gets h4{font-size:19px;font-weight:600;letter-spacing:-.02em;margin:18px 0 8px}
.eq-gets p{font-size:13px;line-height:1.7;color:var(--muted)}

.eq-rail{display:grid;grid-auto-flow:column;grid-auto-columns:250px;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:14px}
.eq-rail>*{scroll-snap-align:start;min-width:0}
.eq-rail .well{background:#fff;padding:16px 10px}
.eq-rail p{font-size:13px;line-height:1.6;color:var(--muted);padding-top:14px}
.eq-rail p b{display:block;font:500 11px/1.6 DMMono,monospace;color:var(--pale);margin-bottom:4px}

.eq-films{display:grid;grid-template-columns:1fr .316fr;gap:16px;align-items:start}
.eq-films figure{margin:0;border:1px solid var(--line);background:#0a0f16;min-width:0}
.eq-films .film{position:relative}
.eq-films .film-wide .film{aspect-ratio:16/9}.eq-films .film-tall .film{aspect-ratio:9/16}
.eq-films .film img,.eq-films .film iframe{width:100%;height:100%;object-fit:cover;border:0;display:block}
.eq-films button.film{display:block;width:100%;padding:0;border:0;background:#0a0f16;cursor:pointer}
.eq-films .play{position:absolute;left:18px;bottom:18px;width:60px;height:60px;border-radius:50%;background:#000c;border:1px solid #ffffff55;transition:transform .2s var(--ease-out),background .2s var(--ease-out)}
.eq-films .play:after{content:"";position:absolute;left:23px;top:18px;border-style:solid;border-width:11px 0 11px 17px;border-color:transparent transparent transparent #fff}
@media(hover:hover) and (pointer:fine){.eq-films button.film:hover .play{transform:scale(1.06);background:var(--eq-purple)}}
.eq-films figcaption a{color:var(--pale)}

/* the deck's progress bar, kept: where you are in the story */
.eq-progress{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:12px max(20px,calc((100% - 1200px)/2)) calc(12px + env(safe-area-inset-bottom,0px));background:#000000d9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .3s var(--ease-out)}
.eq-progress.on{transform:none}
.eq-progress .seg{display:grid;gap:8px;font:500 10px/1.2 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--dim);min-width:0}
.eq-progress .seg span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eq-progress .seg.now{color:#fff}
.eq-progress i{display:block;height:2px;background:var(--line);position:relative;overflow:hidden}
.eq-progress i:after{content:"";position:absolute;inset:0;background:var(--yellow);transform-origin:left;transform:scaleX(var(--p,0))}

/* lightbox */
.lb{position:fixed;inset:0;z-index:50;background:#000d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:grid;place-items:center;padding:40px;opacity:0;pointer-events:none;transition:opacity .22s var(--ease-out)}
.lb.on{opacity:1;pointer-events:auto}
.lb .frame{max-width:100%;max-height:100%;overflow:auto;transform:scale(.96);transition:transform .28s var(--ease-out)}
.lb.on .frame{transform:none}
.lb img{max-width:min(1500px,100%);max-height:calc(100vh - 80px);object-fit:contain;display:block}
.lb .x{position:absolute;top:22px;right:26px;border:1px solid #ffffff40;background:#000;color:#fff;width:44px;height:44px;font:500 12px DMMono,monospace}

#join .hint{display:block}
@media(min-width:1101px){.eq-rail.partner{grid-auto-flow:row;grid-template-columns:repeat(5,1fr);overflow:visible;padding-bottom:0}#join .hint{display:none}}
@media(max-width:1100px){
 .eq-checks{grid-template-columns:repeat(5,minmax(180px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:14px}.eq-checks li{scroll-snap-align:start}.eq-checks+.hint{display:block}
 .eq-guests{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:900px){
 .eq-hero{padding-top:56px}.eq-hero h1 br{display:none}.hero-grid{grid-template-columns:1fr;gap:var(--eq-media)}
 .split,.stop-body{grid-template-columns:1fr;gap:var(--eq-media)}
 .split{gap:var(--eq-sub)}
 .eq-party{grid-template-columns:1fr 1fr;grid-template-rows:none;row-gap:22px}
 .eq-party .top,.eq-party .bottom{display:contents}
 .eq-party .host,.eq-party .baby,.eq-party .tablebar{grid-column:auto;grid-row:auto}
 .eq-party .tablebar{grid-column:1/-1;order:-1;padding:18px 12px}
 .eq-party .host{order:-1}
 .eq-party .top .seat{order:0;margin:0 0 8px}
 .eq-calls{justify-items:stretch}.eq-calls li:nth-child(2n),.eq-calls .reply{margin-right:0}.eq-calls li{font-size:15px}
 .eq-guests{grid-template-columns:repeat(2,1fr)}.eq-guests li:last-child{grid-column:1/-1}
 .eq-stats{grid-template-columns:1fr}.eq-stat{padding:22px 0;border-right:0;border-bottom:1px solid var(--line)}.eq-stat:last-child{border-bottom:0;padding-bottom:0}
 .stop-head{flex-wrap:wrap;row-gap:12px}.stop-head .route{flex-basis:100%}
 .well{padding:20px 12px}
 .eq-personas{grid-template-columns:1fr}
 .eq-house .pillars{grid-template-columns:repeat(3,1fr)}.eq-house .pillars li{padding:28px 8px;font-size:13px}
 .eq-house .legend{display:none}
 .eq-who li{grid-template-columns:1fr;gap:4px}
 .eq-tone{grid-template-columns:1fr}
 .eq-mark{grid-template-columns:1fr 1fr}
 .eq-gets{grid-template-columns:1fr}
 .eq-rail{grid-auto-columns:220px}
 .eq-route .scroll img{width:1100px;max-width:none}
 .eq-route+.hint{display:block}
 .eq-films{grid-template-columns:1fr}.eq-films .film-tall{width:min(320px,100%)}
 .eq-table .row{grid-template-columns:1fr;gap:6px}.eq-table .head{display:none}
 .eq-table .row span:before{content:attr(data-l);display:block;font:500 10px/1.6 DMMono,monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--pale);margin-top:6px}
 .eq-routes{grid-template-columns:1fr 1fr}.eq-routes .made{grid-column:1/-1;grid-row:auto;order:-1}
 .eq-progress{gap:10px}.eq-progress .seg{font-size:9px;letter-spacing:.06em}
}
@media(max-width:520px){
 .pair,.eq-routes,.pieces{grid-template-columns:1fr}
 .persona{grid-template-columns:1fr}.persona img{aspect-ratio:4/3;object-position:50% 25%}
 .seat{width:64px;height:64px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .eq-hero h1 .w span,.fade,.hero-visual,.hero-visual img{animation:none;opacity:1;transform:none}
 .rv{transition:opacity .2s ease;transform:none}
 .seat-wrap,.eq-progress{transition:none}
 .eq-party:not(.in) .seat-wrap{transform:none}
}

/* part openers: chapter cards, like the deck's part boards */
.eq-opener{max-width:none;display:grid;grid-template-columns:.9fr 1.3fr;column-gap:70px;align-items:end}
.eq-rule{grid-column:1/-1;width:100%;border:0;border-top:1px solid var(--line);margin:0 0 48px}
#day .split,#before .split,#insight .split{margin-bottom:0}
.eq-opener .eq-partno{grid-column:1/-1}
.eq-opener h2{font-size:clamp(46px,6vw,88px);line-height:.98;letter-spacing:-.055em}
.eq-opener-lead{margin-top:0}
@media(max-width:900px){
 .eq-opener{grid-template-columns:1fr}.eq-rule{margin-bottom:32px}.eq-opener-lead{margin-top:var(--eq-sub)}
 .stop-body{display:flex;flex-direction:column}.stop-copy{display:contents}.stop-copy .piece,.stop-copy .eq-sees,.stop-copy .eq-spoken{order:3}.stop-media{order:2}
}

/* ---------- Wave 27 polish: motion (purposeful, transform/opacity only) ---------- */
/* the evening's route draws in as each stop arrives: how far through Saturday we are */
.stop-head .route:before{transform-origin:left center;transform:scaleX(0);transition:transform .7s var(--ease-out) .15s}
.stop-head .route:after{opacity:0;transform:scale(.6);transition:opacity .25s var(--ease-out) .7s,transform .25s var(--ease-out) .7s}
.stop-head.in .route:before{transform:scaleX(1)}
.stop-head.in .route:after{opacity:1;transform:none}
/* the phone calls come in from the right, one after another */
.eq-calls .rv{transform:translateX(16px)}
.eq-calls .rv.in{transform:none}
/* one guest chooses, then the rest of the table fills: opacity on a layer, not a background-colour animation */
.eq-insight i{position:relative}
.eq-insight i:not(.chooser):after{content:"";position:absolute;inset:0;border-radius:50%;background:#d9cdf5;opacity:0;transform:scale(.9);transition:opacity .4s var(--ease-out),transform .4s var(--ease-out);transition-delay:calc(var(--d,0)*70ms + 700ms)}
.eq-insight.in i:not(.chooser):after{opacity:1;transform:none}
.eq-insight .seats.top i:nth-child(1){--d:1}.eq-insight .seats.top i:nth-child(2){--d:2}.eq-insight .seats.top i:nth-child(3){--d:3}.eq-insight .seats.top i:nth-child(4){--d:4}
.eq-insight .seats.bottom i:nth-child(1){--d:5}.eq-insight .seats.bottom i:nth-child(3){--d:6}.eq-insight .seats.bottom i:nth-child(4){--d:7}
/* press feedback on the film frames */
.eq-films button.film{transition:transform .14s var(--ease-out)}
.eq-films button.film:active{transform:scale(.985)}

/* ---------- Wave 27 polish: phone layout ---------- */
@media(max-width:900px){
 /* Rahul's table becomes the booking itself: a guest list under the table line */
 .eq-party{display:grid;grid-template-columns:1fr;row-gap:0}
 .eq-party .tablebar{order:-2;padding:16px 12px;margin-bottom:6px}
 .eq-party .host{order:-1}
 .eq-party .seat-wrap{display:grid;grid-template-columns:52px 1fr;grid-template-rows:auto auto;column-gap:14px;row-gap:0;justify-items:start;text-align:left;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
 .eq-party .seat-wrap:last-child{border-bottom:0}
 .eq-party .seat,.eq-party .top .seat{grid-row:1/3;width:52px;height:52px;margin:0;order:0}
 .eq-party .seat.k{width:52px;height:52px}
 .eq-party .seat-wrap b{align-self:end}.eq-party .seat-wrap small{align-self:start;max-width:none}
 .eq-say{margin-top:var(--eq-media)}
 /* stops: heading → text is --sub, text → media is --media, outputs after the photographs */
 .stop-body{gap:0}
 .stop-copy>p{margin-top:var(--eq-sub)}
 .stop-media{margin-top:var(--eq-media);width:100%;max-width:100%}
 .stop-copy .piece,.stop-copy .eq-sees,.stop-copy .eq-spoken{margin-top:16px}
 /* two phone screens side by side were 150px wide: swipe them at a readable 220px */
 .well.two{justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;padding:20px 16px}
 .well.two img{flex:0 0 220px;max-width:220px;scroll-snap-align:start}
 .well img{max-width:240px}
 /* the brand house keeps its roof readable */
 .eq-house .roof{clip-path:none;aspect-ratio:auto;padding:18px 16px;place-items:center}
 .eq-house .pillars li{padding:22px 8px}
 /* personas: a small portrait beside the name */
 .persona{grid-template-columns:104px 1fr;align-items:start}
 .persona img{aspect-ratio:3/4;height:auto;object-position:50% 20%}
 .persona>div{padding:18px 16px 20px}
 .persona h4{font-size:19px;margin-top:6px}
 /* the progress bar names only the part you are in */
 .eq-progress .seg span{visibility:hidden}.eq-progress .seg.now span{visibility:visible}
 .eq-progress .seg{font-size:10px;letter-spacing:.08em}
 .eq-progress .seg span{overflow:visible}
}
@media(max-width:520px){.persona{grid-template-columns:92px 1fr}}
@media(prefers-reduced-motion:reduce){
 .stop-head .route:before,.stop-head .route:after,.eq-insight i:not(.chooser):after,.eq-films button.film{transition:none}
 .stop-head .route:before{transform:none}.stop-head .route:after{opacity:1;transform:none}
 .eq-insight i:not(.chooser):after{opacity:1;transform:none}
 .eq-calls .rv{transform:none}
}
/* Wave 34: two photos side by side at one height on desktop (7:55 pm, Figma 279:30). Columns follow the crops
   (278:381), so equal heights hold at any width. On phone they stack at their own shape. */
@media(min-width:901px){
 .photos.side{grid-template-columns:278fr 381fr}
 .photos.side img{object-fit:cover}
 .photos.side img:first-child{aspect-ratio:278/240}
 .photos.side img:last-child{aspect-ratio:381/240}
}
