/* 57 Windward — "Night compound, day body". Launchkeel / LimmudLink day mode, for a venue:
   - the hero is a deep, LUMINOUS night window (navy → lit petrol) with one light source: his drone footage;
   - everything below is a soft pale blend in ONE family (sky → periwinkle → a hint of aqua), never white;
   - frosted pale glass, deep navy ink, ONE accent (aqua light, from the same blue family as the body). */

/* ---------- fonts (self-hosted, latin; Archivo is variable in weight and width) ---------- */
@font-face{font-family:"Archivo";font-style:normal;font-weight:400 700;font-stretch:62% 125%;font-display:swap;src:url(/fonts/archivo.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";font-style:italic;font-weight:400 700;font-stretch:62% 125%;font-display:swap;src:url(/fonts/archivo-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/plex-mono-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/plex-mono-500.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  /* night window (heroes, the events band, the closer) */
  --nw0:#061221; --nw1:#0A2136; --nw2:#0D3346; --nw-bloom:#1E6F82;
  --nw-text:#EAF4F8; --nw-text-2:#BCD3DE; --nw-text-3:#93B0BE;
  /* day body: one pale family */
  --d1:#C9DAEC; --d2:#BFD2E8; --d3:#AFC6E2; --d4:#E4EEF5; --d5:#D3E2F0;
  /* ink */
  --ink:#0B1A2E; --ink-2:#2B3D56; --ink-3:#3B4D66;
  --line:rgba(11,26,46,.13); --line-strong:rgba(11,26,46,.78);
  /* the one accent: aqua light (from the same blue family) — on night windows it's the CTA; on pale it's a mark */
  --aqua:#7FD8DE; --aqua-hi:#A6ECEF; --aqua-ink:#0B5E67;
  /* frosted pale glass */
  --glass-bg:rgba(255,255,255,.44); --glass-edge:rgba(255,255,255,.7);
  --shadow:0 1px 0 rgba(255,255,255,.7) inset,0 24px 50px -30px rgba(11,26,46,.35);
  /* legacy names used by the inner pages' css, resolved into this system */
  --cobalt:var(--nw1); --sky-deep:var(--ink); --sky-ink:var(--ink-2); --sky:var(--aqua-ink); --sky-2:var(--d3); --sky-pale:var(--d5);
  --gold:var(--aqua); --sunset:var(--aqua); --sand:var(--d4); --g1:var(--d1); --g2:var(--d2); --g3:var(--d4); --g4:var(--d3); --g5:var(--d5);
  --night:var(--nw1); --night-2:var(--nw2); --night-text:var(--nw-text-2); --night-dim:var(--nw-text-3);
  --wall:var(--d2); --wall-2:var(--d5); --white:var(--glass-bg); --text:var(--ink); --text-2:var(--ink-2); --text-3:var(--ink-3); --accent:var(--ink);
  --ficus:#4E7A2C;
  /* type */
  --display:"Archivo",system-ui,sans-serif; --body:"Archivo",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --t-hero:clamp(42px,1.2rem + 4vw,92px);
  --t-h1:clamp(40px,1.1rem + 3.2vw,72px);
  --t-h2:clamp(30px,1.1rem + 2.2vw,56px);
  --t-h3:20px; --t-lede:clamp(17px,1rem + .25vw,20px); --t-body:17px; --t-small:14px; --t-fine:13px;
  /* space */
  --gutter:clamp(16px,4vw,48px);
  --gap:clamp(64px,32px + 4vw,112px);
  --hdr-h:64px;
  --r-sm:8px; --r:18px; --r-pill:999px;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--d2);scroll-padding-top:calc(var(--hdr-h) + 16px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* the day body: pale sky → periwinkle → a hint of aqua, with soft glows. Never white, never flat. */
body{margin:0;color:var(--ink);font:400 var(--t-body)/1.6 var(--body);-webkit-font-smoothing:antialiased;
  background-color:var(--d2);
  background-image:
    radial-gradient(60vw 44vw at 100% 30%,rgba(230,241,245,.75),transparent 70%),
    radial-gradient(56vw 44vw at 0% 58%,rgba(183,204,230,.8),transparent 70%),
    radial-gradient(60vw 40vw at 90% 84%,rgba(206,236,238,.7),transparent 70%),
    linear-gradient(180deg,var(--d4) 0,var(--d4) 1000px,var(--d1) 1700px,var(--d2) max(2300px,34%),var(--d3) max(2700px,52%),var(--d5) max(3300px,70%),var(--d1) max(3900px,86%),var(--d3) max(4500px,100%))}
/* every stop is monotonic whatever the page length (mixing px and % let a short page clamp two stops into a hard seam) */
section,main,footer{overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
p{margin:0 0 1em}
::selection{background:var(--aqua);color:var(--ink)}
h1,h2,h3,h4{font-family:var(--display);margin:0;font-weight:540;letter-spacing:-.012em;color:var(--ink);font-stretch:110%}
h1{font-size:var(--t-h1);line-height:1;letter-spacing:-.02em}
h2{font-size:var(--t-h2);line-height:1.06;max-width:18ch;text-wrap:balance}
/* the one authored accent per heading: Archivo's own italic, a little wider */
.it{font-style:italic;font-weight:500;font-stretch:118%;letter-spacing:-.01em}
h3{font-size:var(--t-h3);line-height:1.25;font-stretch:106%}
:focus-visible{outline:2px solid var(--aqua-ink);outline-offset:3px}
.nw :focus-visible,.page-hero :focus-visible{outline-color:var(--aqua)}
.skip{position:absolute;left:-999px;top:0}.skip:focus{left:12px;top:12px;z-index:200;background:var(--d4);padding:12px}
.wrap{width:min(1240px,100% - 2*var(--gutter));margin-inline:auto}
.band{padding-block:var(--gap) 0}
main > section.band:last-of-type{padding-bottom:var(--gap)}
/* one section-head component: heading + lede, two columns only on wide screens */
.band h2 + .sub,.band h2 + .lede{margin-top:clamp(14px,1.2vw,20px)}
.sec-head{display:grid;gap:0 clamp(24px,4vw,64px);margin-bottom:clamp(28px,3vw,44px)}
.sec-head h2{margin:0}
.sec-head .sub,.sec-head h2 + .sub,.sec-head h2 + p{margin:clamp(14px,1.2vw,20px) 0 0}
@media (min-width:961px){.sec-head{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end}.sec-head > .sub{margin:0}}
.band-white,.band-pale{background:transparent}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.kicker{margin:0 0 16px;font:500 13px/1.3 var(--mono);letter-spacing:.02em;color:var(--ink-3)}
.lede{font-size:var(--t-lede);max-width:44ch;color:var(--ink-2)}
.sub{color:var(--ink-2);max-width:54ch}
.fine{font-size:var(--t-fine);color:var(--ink-3)}
.hint{font-size:var(--t-small);color:var(--ink-3);margin:0}
.touch-only{display:none}
@media (hover:none){.touch-only{display:inline}.hover-only{display:none}}
html:not(.js) .js-only{display:none}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* the light-catching word in a night-window headline (Launchkeel's "reach.") */
.lit{color:var(--aqua-hi);text-shadow:0 0 34px rgba(127,216,222,.45)}

/* ---------- frosted pale glass (never a white card) ---------- */
.glass{background:var(--glass-bg);border:1px solid var(--glass-edge);-webkit-backdrop-filter:blur(18px) saturate(1.15);backdrop-filter:blur(18px) saturate(1.15);border-radius:var(--r);box-shadow:var(--shadow)}

/* ---------- night window: a deep, lit band that dissolves into the day body (use sparingly) ---------- */
.nw,.band-night{position:relative;color:var(--nw-text);
  background:radial-gradient(50vw 36vw at 80% 40%,rgba(30,111,130,.5),transparent 70%),linear-gradient(180deg,var(--nw0),var(--nw1) 45%,var(--nw2));}
.band-night{padding-block:calc(var(--gap) + 40px);
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 90px,#000 calc(100% - 90px),transparent);
  mask-image:linear-gradient(180deg,transparent 0,#000 90px,#000 calc(100% - 90px),transparent)}
.nw h1,.nw h2,.nw h3,.band-night h2,.band-night h3{color:var(--nw-text)}
.nw p,.nw .sub,.band-night p,.band-night .sub,.nw .lede{color:var(--nw-text-2)}
.nw .kicker,.band-night .kicker,.nw .fine,.band-night .fine,.nw .hint,.band-night .hint{color:var(--nw-text-3)}

/* ---------- buttons: navy on the day body, aqua light in a night window ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:var(--r-pill);background:var(--ink);color:#F2F7FA;text-decoration:none;font:560 16px/1.1 var(--display);font-stretch:108%;border:0;cursor:pointer;box-shadow:0 12px 26px -16px rgba(11,26,46,.7);transition:background .2s,color .2s,box-shadow .2s,transform .15s}
.btn:hover{background:var(--ink-2)}
.btn:active{transform:scale(.97)}
.btn-sm{min-height:44px;padding:0 18px;font-size:15px}
.btn-accent,.btn-light{background:var(--aqua);color:var(--ink);box-shadow:0 0 0 1px rgba(166,236,239,.5),0 14px 34px -14px rgba(127,216,222,.75)}
.btn-accent:hover,.btn-light:hover{background:var(--aqua-hi);color:var(--ink)}
.btn-ghost{background:rgba(255,255,255,.28);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line-strong)}
.btn-ghost:hover{background:var(--ink);color:#F2F7FA}
.btn-ghost-light{background:transparent;color:var(--nw-text);box-shadow:inset 0 0 0 1.5px rgba(234,244,248,.6)}
.btn-ghost-light:hover{background:var(--nw-text);color:var(--ink)}
.link{color:var(--ink);font-weight:560;text-decoration:underline;text-decoration-color:var(--aqua-ink);text-underline-offset:5px;text-decoration-thickness:1.5px}
.link:hover{color:var(--aqua-ink)}

/* ---------- header: night glass over the dark hero, pale frosted glass once you're past it ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:40;height:var(--hdr-h);display:flex;align-items:center;gap:24px;padding:0 var(--gutter);
  --h-ink:var(--nw-text);--h-ink-2:var(--nw-text-2);
  background:linear-gradient(180deg,rgba(6,18,33,.62),rgba(6,18,33,.38));border-bottom:1px solid rgba(234,244,248,.08);
  transition:background .35s var(--ease),border-color .35s}
.hdr-day .hdr{--h-ink:var(--ink);--h-ink-2:var(--ink-2);background:rgba(222,234,245,.86);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);border-bottom-color:rgba(11,26,46,.08)}
.mark{color:var(--h-ink,var(--ink));text-decoration:none;font:600 18px/1 var(--display);font-stretch:118%;letter-spacing:-.01em;min-height:44px;display:flex;align-items:center;gap:8px;transition:color .35s}
.mark-n{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:7px;background:var(--h-ink,var(--ink));color:var(--nw0);font-size:14px;transition:background .35s}
.hdr-day .mark-n{color:#F2F7FA}
.ftr .mark-n{background:var(--nw-text);color:var(--nw0)}
.hdr-nav{display:flex;gap:2px;margin-left:auto}
.hdr-nav a{color:var(--h-ink-2);text-decoration:none;font-size:15px;padding:12px 10px;transition:color .35s}
.hdr-nav a:hover{color:var(--h-ink)}
.hdr-nav a[aria-current]{color:var(--h-ink);text-decoration:underline;text-decoration-color:var(--aqua);text-underline-offset:8px;text-decoration-thickness:2px}
.hdr-day .hdr-nav a[aria-current]{text-decoration-color:var(--aqua-ink)}
.hdr .hdr-cta{background:var(--aqua);color:var(--ink);box-shadow:none}
.hdr .hdr-cta:hover{background:var(--aqua-hi)}
.hdr-day .hdr .hdr-cta{background:var(--ink);color:#F2F7FA}
.hdr-cta{flex:none}
.hdr-menu{display:none;width:48px;height:48px;border:0;background:transparent;color:var(--h-ink);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:6px;border-radius:999px}
.hdr-menu span{display:block;width:22px;height:2px;background:currentColor;border-radius:2px}
.menu{border:0;padding:20px var(--gutter) 28px;margin:0;width:100%;max-width:none;height:100dvh;max-height:none;inset:0;color:var(--ink);
  background:radial-gradient(70vw 60vw at 90% 6%,rgba(230,241,245,.9),transparent 70%),linear-gradient(180deg,var(--d4),var(--d1) 55%,var(--d3))}
.menu::backdrop{background:rgba(11,26,46,.3)}
.menu-close{display:block;margin-left:auto;min-height:48px;padding:0 18px;border-radius:999px;border:0;background:var(--ink);color:#F2F7FA;font:560 15px var(--display);cursor:pointer}
.menu nav{display:flex;flex-direction:column;margin-top:28px}
.menu nav a{color:var(--ink);text-decoration:none;font:540 34px/1.15 var(--display);font-stretch:114%;letter-spacing:-.02em;padding:10px 0;border-bottom:1px solid var(--line)}
.menu-foot{margin-top:28px;font-size:16px;line-height:2}
.menu-foot a{color:var(--ink)}
@media (prefers-reduced-motion:no-preference){
  .menu:popover-open{animation:menu-in .28s var(--ease)}
  @keyframes menu-in{from{opacity:0;translate:0 -12px}}
}
@media (max-width:900px){.hdr{gap:10px}.hdr-nav{display:none}.hdr-cta{margin-left:auto}.hdr-menu{display:flex}}
@media (max-width:360px){.hdr-cta{display:none}.hdr-menu{margin-left:auto}}

/* ---------- inner-page hero: a night window, copy left, a real photo glowing on the right ---------- */
.page-hero{position:relative;isolation:isolate;overflow:hidden;color:var(--nw-text);padding:calc(var(--hdr-h) + clamp(40px,3vw + 24px,80px)) 0 clamp(72px,5vw + 40px,120px);
  background:radial-gradient(44vw 34vw at 78% 50%,rgba(30,111,130,.55),transparent 70%),linear-gradient(180deg,var(--nw0),var(--nw1) 55%,var(--nw2))}
.page-hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,4vw,64px);align-items:center}
.page-hero h1{max-width:13ch;color:var(--nw-text)}
.page-hero .lede{color:var(--nw-text-2);margin:22px 0 0}
.page-hero .kicker{color:var(--nw-text-3)}
.ph-photo{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;box-shadow:0 0 0 1px rgba(234,244,248,.1),0 0 120px -30px rgba(127,216,222,.55),0 40px 80px -40px rgba(0,0,0,.6)}
.ph-photo img{width:100%;height:100%;object-fit:cover}
/* the night window's foot: the day body rises in one long shallow arc (the one shape kept from his site) */
.page-hero::after,.nh::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:clamp(28px,4vw,72px);background:var(--d4);clip-path:ellipse(80% 100% at 32% 100%);pointer-events:none}
/* short variant: get the visitor to the content fast */
.page-hero.ph-short{padding-bottom:clamp(56px,4vw + 32px,96px)}
/* jump chips in a night hero */
.ph-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.ph-chips a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;color:var(--nw-text);text-decoration:none;box-shadow:inset 0 0 0 1.5px rgba(234,244,248,.45);font:540 15px var(--display);font-stretch:106%;transition:background .2s,color .2s}
.ph-chips a:hover{background:var(--aqua);color:var(--ink);box-shadow:none}
/* text-only variant (reference pages) */
.page-hero.ph-text .wrap{grid-template-columns:1fr}
.page-hero.ph-text h1{max-width:16ch}
@media (max-width:900px){.page-hero .wrap{grid-template-columns:1fr}.ph-photo{aspect-ratio:16/10}}

/* ---------- closing band + footer: one full-bleed night ground rising out of the day on a long arc ----------
   (mirrors the hero's arc, so the page reads as one swoop down into the day and back up into the night) */
.closer{position:relative;margin-top:calc(var(--gap) + clamp(36px,5vw,90px));padding:clamp(48px,4vw,80px) 0 clamp(40px,3vw,64px);color:var(--nw-text);
  background:radial-gradient(44vw 34vw at 82% 30%,rgba(46,150,168,.45),transparent 70%),linear-gradient(180deg,var(--nw2),var(--nw1) 60%,var(--nw0))}
.closer::before{content:"";position:absolute;left:0;right:0;bottom:calc(100% - 1px);height:clamp(36px,5vw,90px);background:var(--nw2);clip-path:ellipse(70% 100% at 68% 100%);pointer-events:none}
.closer-grid{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:28px}
.closer h2{color:var(--nw-text);max-width:14ch}
.closer-act{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.closer-act p{margin:0;font-size:17px;line-height:1.7;color:var(--nw-text-2)}
.closer-act p a{color:var(--nw-text);text-decoration:none;border-bottom:1.5px solid rgba(234,244,248,.4)}
.closer-act p a:hover{border-color:var(--aqua)}
.ftr{padding:clamp(40px,4vw,64px) 0 72px;font-size:15px;color:var(--nw-text-2);background:var(--nw0)}
.ftr{position:relative}
.ftr::before{display:none}
/* pages without the closer: the footer itself rises on the arc */
body:not(:has(.closer)) .ftr{margin-top:calc(var(--gap) + clamp(36px,5vw,90px))}
body:not(:has(.closer)) .ftr::before{display:block;content:"";position:absolute;left:0;right:0;bottom:calc(100% - 1px);height:clamp(36px,5vw,90px);background:var(--nw0);clip-path:ellipse(70% 100% at 68% 100%);pointer-events:none}
.ftr-word{margin:0 0 clamp(28px,3vw,44px);font:540 clamp(48px,2rem + 3vw,88px)/1 var(--display);font-stretch:120%;letter-spacing:-.02em;color:var(--nw-text)}
.ftr-word .it{color:var(--aqua-hi)}
.ftr-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:32px;align-items:start;padding-top:28px;border-top:1px solid rgba(234,244,248,.12)}
.mark-ink{color:var(--nw-text)}
.ftr-tag{margin:10px 0 0}
.ftr address{font-style:normal;line-height:1.7}
.ftr p{line-height:1.7;margin:0}
.ftr a{color:var(--nw-text);text-underline-offset:4px;text-decoration-color:rgba(234,244,248,.35)}
.ftr nav{display:flex;flex-direction:column}
.ftr nav a{text-decoration:none;padding:6px 0;min-height:32px}
.ftr nav a:hover{text-decoration:underline}
.ftr-fine{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:40px;padding-top:20px;border-top:1px solid rgba(234,244,248,.12);font-size:13px;color:var(--nw-text-3)}
.ftr-credit a{color:var(--nw-text-2)}
@media (max-width:900px){.ftr-grid{grid-template-columns:1fr 1fr}.ftr address a,.ftr p a{display:inline-block;padding:6px 0}}

/* ---------- Launchkeel badge ---------- */
/* the Launchkeel credit: a small quiet disc that expands on hover (the full credit also lives in the footer) */
.lk-badge{position:fixed;right:10px;bottom:10px;z-index:60;min-width:30px;height:30px;border-radius:var(--r-pill);background:var(--ink);color:#F2F7FA;font:600 11px/1 var(--display);text-decoration:none;display:flex;align-items:center;justify-content:center;opacity:.6;white-space:nowrap;box-shadow:0 6px 18px -8px rgba(11,26,46,.5);transition:opacity .3s,padding .3s}
.lk-badge::before{content:"LK"}
.lk-badge::after{content:"";position:absolute;inset:-8px}
.lk-badge .lk-full{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (hover:hover){.lk-badge:hover,.lk-badge:focus-visible{padding:0 14px;opacity:1}
  .lk-badge:hover::before,.lk-badge:focus-visible::before{content:none}
  .lk-badge:hover .lk-full,.lk-badge:focus-visible .lk-full{position:static;width:auto;height:auto;clip:auto;font:500 12px/1 var(--mono)}}
.js .lk-badge{opacity:0;pointer-events:none}
.js.lk-show .lk-badge{opacity:.6;pointer-events:auto}
.js.lk-show .lk-badge:hover{opacity:1}

/* ============ reveal vocabulary (short, fire once ~15% into view; visible with no JS / reduced motion) ============ */
@media (prefers-reduced-motion:no-preference){
  .rv-armed [data-rv]:not(.in),.rv-armed [data-rv-kids]:not(.in)>*{opacity:0}
  .rv-armed [data-rv="mask"]:not(.in){clip-path:inset(100% -.3em -.4em -.3em);translate:0 .5em}
  .rv-armed [data-rv="up"]:not(.in),.rv-armed [data-rv-kids="up"]:not(.in)>*{translate:0 24px}
  .rv-armed [data-rv="blur"]:not(.in){filter:blur(6px);translate:0 16px}
  .rv-armed [data-rv="scale"]:not(.in),.rv-armed [data-rv-kids="scale"]:not(.in)>*{scale:.96;translate:0 24px}
  .rv-armed [data-rv-kids="alt"]:not(.in)>:nth-child(odd){translate:-30px 0}
  .rv-armed [data-rv-kids="alt"]:not(.in)>:nth-child(even){translate:30px 0}
  .rv-armed [data-rv="mask"].in{clip-path:inset(-.3em -.3em -.4em -.3em)}
  [data-rv].in{transition:opacity .6s var(--ease),clip-path .75s var(--ease),translate .75s var(--ease),filter .7s var(--ease),scale .75s var(--ease)}
  [data-rv-kids].in>*{transition:opacity .55s var(--ease),translate .7s var(--ease),scale .7s var(--ease);transition-delay:calc(min(var(--i,0),6) * 60ms)}
}