/* ============================================================
   QUANTIVERSE · chrome
   Shared by the homepage and every practice page: tokens, links
   and buttons, the header with its practice menus, the mobile
   menu, page transitions, cursor, marquees, footer, back-to-top.
   White · charcoal #2B2B2B · red #E41613 · square edges.
   ============================================================ */
:root{
  --white:#FFFFFF;
  --ink:#2B2B2B;
  --ink-2:#1F1F1F;
  --ink-soft:#5A5A5A;
  --muted:#8C8C8C;
  --g1:#F7F7F7;
  --g2:#F2F2F2;
  --g3:#D5D5D5;
  --g4:#BDBDBD;
  --red:#E41613;
  --red-wash:rgba(228,22,19,.07);
  --line:#E2E2E2;
  --line-d:rgba(255,255,255,.14);

  --sans:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;

  --wrap:1440px;
  --gut:clamp(20px,3.6vw,52px);
  --e:cubic-bezier(.22,.61,.36,1);
  --e2:cubic-bezier(.7,0,.25,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --hdr:65px;
  --sub:46px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--hdr)}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-weight:400;font-size:16px;line-height:1.5;letter-spacing:-.011em;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
ul,ol{margin:0;padding:0;list-style:none}
p,h1,h2,h3,h4,dl,dd,figure{margin:0}
::selection{background:var(--red);color:var(--white)}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-left:max(var(--gut),env(safe-area-inset-left,0px));padding-right:max(var(--gut),env(safe-area-inset-right,0px))}

/* ---------------- arrows, links, buttons ---------------- */
.arw{display:inline-block;width:14px;height:10px;flex:none;transition:transform .4s var(--e)}
.arw path{fill:none;stroke:currentColor;stroke-width:1.4}
.arw--d{transform:rotate(90deg)}
.arw--u{transform:rotate(-90deg)}

/* underline retracts to the right and redraws from the left */
.ul{position:relative;display:inline-block;padding-bottom:4px;font-size:14px;transition:color .3s var(--e)}
.ul::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:right}
.ul:hover{color:var(--red)}
.ul:hover::after{animation:ulx .8s var(--e)}
.ul--l:hover{color:var(--white)}
@keyframes ulx{0%{transform:scaleX(1);transform-origin:right}42%{transform:scaleX(0);transform-origin:right}43%{transform:scaleX(0);transform-origin:left}100%{transform:scaleX(1);transform-origin:left}}

/* buttons fill from below; the arrow steps forward */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;height:48px;padding:0 24px;background:var(--ink);color:var(--white);font-size:13px;font-weight:500;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;isolation:isolate;transition:color .35s var(--e),transform .5s var(--e)}
.btn::before{content:"";position:absolute;inset:-1px;background:var(--red);transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--e);z-index:-1}
.btn:hover::before{transform:scaleY(1)}
.btn:hover .arw{transform:translateX(4px)}
.btn:hover .arw--d{transform:rotate(90deg) translateX(3px)}
.btn--line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.btn--line::before{background:var(--ink)}
.btn--line:hover{color:var(--white)}
.btn--l{background:var(--white);color:var(--ink)}
.btn--l:hover{color:var(--white)}
.btn--ghost{background:transparent;color:var(--white);box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.btn--ghost::before{background:var(--white)}
.btn--ghost:hover{color:var(--ink)}

/* ---------------- header ---------------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:50;background:var(--white);transition:transform .55s var(--e)}
.hdr::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);opacity:0;transition:opacity .3s var(--e);z-index:3}
.hdr.stuck::after{opacity:1}
.hdr.hide{transform:translateY(calc(var(--hdr) * -1))}
html.mega-open .hdr::after{opacity:1}
.hdr__in{position:relative;z-index:2;display:flex;align-items:stretch;height:var(--hdr);background:var(--white)}
.hdr__prog{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;z-index:4;pointer-events:none}
.brand{display:inline-flex;align-items:center;gap:12px;padding-left:max(var(--gut),env(safe-area-inset-left,0px));padding-right:clamp(24px,4vw,64px);--pbg:var(--white)}
.brand svg{display:block;flex:none}
.brand__mark{width:41px;height:30px;transition:transform .6s var(--spring)}
.brand:hover .brand__mark{transform:rotate(-8deg) scale(1.06)}
.brand__word{width:100px;height:18px}
.brand__name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hdr__nav{display:flex;align-items:stretch;gap:clamp(16px,2vw,32px)}
.hdr__nav > a,.nav__top{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink);position:relative;transition:color .25s var(--e)}
.hdr__nav > a::after,.nav__top::after{content:"";position:absolute;left:0;right:0;bottom:20px;height:1px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--e)}
.hdr__nav > a:hover::after,.nav__item.open .nav__top::after,.nav__top[aria-current="true"]::after{transform:scaleX(1);transform-origin:left}
.nav__top svg{width:8px;height:5px;transition:transform .4s var(--e)}
.nav__top svg path{fill:none;stroke:currentColor;stroke-width:1.3}
.nav__item{display:flex}
.nav__item.open .nav__top svg{transform:rotate(180deg)}
.hdr__end{display:flex;align-items:center;margin-left:auto}
.hdr__cta{position:relative;display:inline-flex;align-items:center;gap:12px;height:var(--hdr);padding:0 clamp(18px,2.4vw,34px);background:var(--ink);color:var(--white);font-size:13px;font-weight:500;overflow:hidden;isolation:isolate}
.hdr__cta::before{content:"";position:absolute;inset:0;background:var(--red);transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--e);z-index:-1}
.hdr__cta:hover::before{transform:none}
.hdr__cta:hover .arw{transform:translateX(4px)}
.hdr__burger{display:none;position:relative;width:var(--hdr);height:var(--hdr);border-left:1px solid var(--line)}
.hdr__burger i{position:absolute;left:50%;width:20px;height:1.5px;margin-left:-10px;background:var(--ink);transition:transform .4s var(--e),width .4s var(--e)}
.hdr__burger i:first-child{top:calc(50% - 4px)}
.hdr__burger i:last-child{top:calc(50% + 3px);width:13px}
.hdr__burger:hover i:last-child{width:20px}
@media(max-width:1180px){.hdr__nav{display:none}.hdr__burger{display:block}}
@media(max-width:560px){.hdr__cta{display:none}}

/* ---------------- practice menus: a full-width panel under the bar ---------------- */
.nav__drop{position:absolute;left:0;right:0;top:100%;background:var(--white);border-top:1px solid var(--line);clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .55s var(--e2),visibility 0s linear .55s}
.nav__item.open .nav__drop,.nav__item:focus-within .nav__drop{clip-path:inset(0);visibility:visible;transition:clip-path .6s var(--e2),visibility 0s}
.mega{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);max-width:var(--wrap);margin-inline:auto;padding:26px var(--gut) 34px}
.mega__hub{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:14px;min-height:300px;padding:26px 26px 24px;background:var(--ink);color:var(--white);overflow:hidden;isolation:isolate}
.mega__hub::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.13) 1px,transparent 1.6px);background-size:16px 16px;-webkit-mask-image:linear-gradient(200deg,#000 10%,transparent 70%);mask-image:linear-gradient(200deg,#000 10%,transparent 70%);transition:transform 1.4s var(--e)}
.mega__hub::after{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(circle,var(--red) 2.6px,transparent 3.2px),radial-gradient(circle,var(--red) 2.6px,transparent 3.2px),radial-gradient(circle,var(--red) 2.6px,transparent 3.2px),radial-gradient(circle,rgba(228,22,19,.5) 1px,transparent 1.5px);background-repeat:no-repeat;background-size:8px 8px,8px 8px,8px 8px,8px 8px;background-position:78% 14%,91% 30%,66% 26%,84% 44%;animation:blink 2.6s var(--e) infinite}
.mega__hub:hover::before{transform:scale(1.08)}
.mega__hub .label{position:absolute;top:24px;left:26px;color:rgba(255,255,255,.5)}
.mega__hub b{font-size:clamp(28px,2.6vw,38px);font-weight:500;letter-spacing:-.04em;line-height:.98}
.mega__hub p{font-size:14px;line-height:1.5;color:rgba(255,255,255,.66);max-width:32ch}
.mega__go{display:inline-flex;align-items:center;gap:10px;margin-top:6px;font-size:13px;font-weight:500}
.mega__hub:hover .mega__go .arw{transform:translateX(5px);color:var(--red)}
.mega__list{display:grid;grid-template-columns:1fr 1fr;align-content:start;column-gap:clamp(18px,2.4vw,40px);padding-left:clamp(22px,3vw,52px)}
.mega__list a{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr) 16px;gap:3px 10px;padding:17px 4px 17px 0;border-bottom:1px solid var(--line);opacity:0;transform:translateY(10px);transition:opacity .45s var(--e),transform .55s var(--e),padding .4s var(--e)}
.nav__item.open .mega__list a,.nav__item:focus-within .mega__list a{opacity:1;transform:none;transition-delay:calc(var(--i) * 35ms + 120ms)}
.mega__list a::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--e)}
.mega__list a:hover{padding-left:8px}
.mega__list a:hover::before{transform:scaleX(1);transform-origin:left}
.mega__list i{font-style:normal;font-size:11px;color:var(--muted);padding-top:3px;font-variant-numeric:tabular-nums;transition:color .25s}
.mega__list b{font-weight:500;font-size:15px;letter-spacing:-.02em;line-height:1.25}
.mega__list span{grid-column:2;font-size:12px;color:var(--muted);line-height:1.4}
.mega__list .arw{grid-column:3;grid-row:1 / span 2;align-self:center;color:var(--g4)}
.mega__list a:hover i,.mega__list a:hover .arw{color:var(--red)}
.mega__list a:hover .arw{transform:translateX(3px)}
.scrim{position:fixed;inset:0;z-index:45;background:rgba(31,31,31,.34);opacity:0;visibility:hidden;transition:opacity .45s var(--e),visibility 0s linear .45s}
html.mega-open .scrim{opacity:1;visibility:visible;transition:opacity .45s var(--e)}

/* ---------------- section bar (practice pages): appears once the hero has passed ---------------- */
.subnav{position:relative;z-index:1;height:0;overflow:hidden;background:var(--white);transition:height .45s var(--e)}
.hdr.sub .subnav{height:var(--sub)}
.subnav__in{display:flex;align-items:center;gap:clamp(16px,2.4vw,36px);height:var(--sub);max-width:var(--wrap);margin-inline:auto;padding-inline:max(var(--gut),env(safe-area-inset-left,0px));border-top:1px solid var(--line)}
.subnav__t{display:none;flex:none;font-size:12px;font-weight:600;letter-spacing:-.01em;max-width:22ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(min-width:1640px){.subnav__t{display:block}}
.subnav__links{position:relative;display:flex;align-items:center;gap:clamp(14px,1.5vw,24px);flex:1;min-width:0;height:100%;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.subnav__links::-webkit-scrollbar{display:none}
.subnav__links a{flex:none;display:inline-flex;align-items:center;gap:7px;height:100%;font-size:12px;color:var(--muted);white-space:nowrap;transition:color .25s var(--e)}
.subnav__links a i{font-style:normal;font-size:10px;font-variant-numeric:tabular-nums;color:var(--g4);transition:color .25s}
.subnav__links a:hover,.subnav__links a.on{color:var(--ink)}
.subnav__links a.on i{color:var(--red)}
.subnav__bar{position:absolute;left:0;top:0;height:2px;width:0;background:var(--ink);opacity:0;transition:transform .5s var(--e),width .5s var(--e),opacity .3s}
.subnav__cta{flex:none;display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:var(--ink);transition:color .25s}
.subnav__cta:hover{color:var(--red)}
.subnav__cta:hover .arw{transform:translateX(3px)}
@media(max-width:760px){.subnav__cta{display:none}}

/* ---------------- full-screen menu ---------------- */
.menu{position:fixed;inset:0;z-index:80;background:var(--ink);color:var(--white);display:flex;flex-direction:column;padding:0 max(var(--gut),env(safe-area-inset-right,0px)) 32px max(var(--gut),env(safe-area-inset-left,0px));overflow:auto;clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .65s var(--e2),visibility 0s linear .65s}
.menu.open{clip-path:inset(0);visibility:visible;transition:clip-path .65s var(--e2),visibility 0s}
.menu__bar{display:flex;align-items:center;justify-content:space-between;flex:none;height:var(--hdr);margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);border-bottom:1px solid var(--line-d)}
.menu__bar .brand{padding:0;color:var(--white);--pbg:var(--ink)}
.menu__x{display:inline-flex;align-items:center;gap:12px;font-size:13px}
.menu__x i{position:relative;width:16px;height:16px}
.menu__x i::before,.menu__x i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:currentColor;transform:rotate(45deg);transition:transform .4s var(--e)}
.menu__x i::after{transform:rotate(-45deg)}
.menu__x:hover i::before{transform:rotate(135deg)}
.menu__x:hover i::after{transform:rotate(45deg)}
.menu__list{padding:26px 0 30px}
.menu__list > *{opacity:0;transform:translateY(28px);transition:opacity .5s var(--e),transform .7s var(--e)}
.menu.open .menu__list > *{opacity:1;transform:none;transition-delay:calc(var(--i) * 60ms + 200ms)}
.menu__a{display:flex;align-items:baseline;gap:16px;padding:12px 0;font-weight:500;font-size:clamp(30px,7vw,50px);line-height:1.05;letter-spacing:-.04em;border-bottom:1px solid var(--line-d);transition:color .25s}
.menu__a i{flex:none;font-style:normal;font-size:12px;letter-spacing:0;color:var(--red);font-variant-numeric:tabular-nums;transform:translateY(-.9em)}
.menu__a:hover{color:rgba(255,255,255,.7)}
.menu__row{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line-d)}
.menu__row .menu__a{border-bottom:0;flex:1}
.menu__tog{position:relative;flex:none;width:48px;height:48px}
.menu__tog::before,.menu__tog::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:1.5px;margin:-.75px 0 0 -8px;background:currentColor;transition:transform .45s var(--e)}
.menu__tog::after{transform:rotate(90deg)}
.menu__grp.open .menu__tog::after{transform:rotate(0)}
.menu__sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--e)}
.menu__grp.open .menu__sub{grid-template-rows:1fr}
.menu__sub > div{overflow:hidden;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.menu__sub a{padding:9px 0;font-size:15px;color:rgba(255,255,255,.7);border-bottom:1px solid rgba(255,255,255,.07)}
.menu__sub a:first-child,.menu__sub a:nth-child(2){margin-top:12px}
.menu__sub a:hover{color:var(--white)}
.menu__foot{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:auto}
@media(max-width:520px){.menu__sub > div{grid-template-columns:1fr}.menu__sub a:nth-child(2){margin-top:0}}

/* ---------------- page transitions: an ink curtain, the mark at its centre ---------------- */
.curtain,html.arrive body::before{position:fixed;inset:0;z-index:400;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Crect width='200' height='200' fill='%232B2B2B'/%3E%3Cpath fill='%23FFFFFF' d='M61.31 143.00L61.31 143.00Q53.96 143.00 47.49 139.50Q41.01 136.00 36.06 129.76Q31.10 123.52 28.24 115.12Q25.38 106.72 25.38 96.92L25.38 96.92Q25.38 84.90 29.64 75.10Q33.90 65.30 41.13 58.36Q48.36 51.42 57.11 47.92L57.11 47.92L58.86 50.02Q50.81 55.74 45.80 64.84L45.80 64.84L79.40 50.37Q86.63 53.52 92.76 59.24Q98.88 64.95 102.61 72.89Q106.35 80.82 106.35 90.74L106.35 90.74Q106.35 99.95 102.73 108.76Q99.11 117.57 93.40 124.69L93.40 124.69Q95.03 127.37 98.76 131.80Q102.50 136.24 109.15 139.62L109.15 139.62L113.81 135.65L116.26 138.10L98.65 152.10Q95.61 150.47 91.59 147.20Q87.56 143.94 81.50 135.77L81.50 135.77Q76.60 139.15 71.41 141.08Q66.21 143.00 61.31 143.00ZM65.28 60.29L65.28 91.09Q65.28 98.44 62.19 103.05Q59.10 107.65 54.49 110.05Q49.88 112.44 45.33 113.14L45.33 113.14Q49.18 120.60 55.54 125.39Q61.90 130.17 70.18 130.17L70.18 130.17Q70.76 130.17 71.35 130.05L71.35 130.05L71.35 62.39Q68.90 61.10 66.21 59.82L66.21 59.82L65.28 60.29ZM74.73 64.49L74.73 64.49L74.73 91.44L90.71 83.39Q85.81 71.84 74.73 64.49ZM39.85 89.45L39.85 89.45Q39.85 100.07 43.58 109.29L43.58 109.29Q46.50 107.19 48.36 102.34Q50.23 97.50 50.23 91.67L50.23 91.67L50.23 66.59L43.70 69.27Q41.83 73.70 40.84 78.78Q39.85 83.85 39.85 89.45ZM91.88 86.54L74.73 95.17L74.73 103.69L93.75 94.12Q93.16 90.15 91.88 86.54L91.88 86.54ZM94.45 102.75L94.45 102.75Q94.45 100.07 94.21 97.62L94.21 97.62L74.73 107.42L74.73 129.70Q79.98 128.54 84.47 124.98Q88.96 121.42 91.71 115.76Q94.45 110.10 94.45 102.75Z'/%3E%3Cpath fill='%23E41613' stroke='%232B2B2B' stroke-width='7' paint-order='stroke' stroke-linejoin='round' d='M101.68 102.75L99.00 102.75Q98.41 100.77 98.41 98.67L98.41 98.67Q98.41 92.84 102.03 88.34Q105.65 83.85 111.25 83.85L111.25 83.85Q111.95 83.85 112.76 83.97L112.76 83.97L112.76 67.29Q112.76 66.35 112.53 64.72Q112.30 63.09 111.36 61.75Q110.43 60.40 108.33 60.40L108.33 60.40Q103.55 60.40 103.55 66.00L103.55 66.00L100.75 66.00Q100.98 60.29 105.01 55.80Q109.03 51.30 115.80 51.30L115.80 51.30Q122.10 51.30 125.66 55.56Q129.21 59.82 129.21 67.05L129.21 67.05L129.21 72.65L133.88 68.69L133.88 52.35L137.15 52.35L137.15 65.77L156.16 49.67L167.48 60.40L172.50 56.32L174.60 58.89L167.60 64.49L167.60 64.49L167.60 112.67L172.15 109.05L174.36 112.67L136.91 141.14Q132.83 136.82 127.29 134.43Q121.75 132.04 115.80 132.04L115.80 132.04Q110.31 132.04 106.00 133.67Q101.68 135.30 98.06 138.10L98.06 138.10L95.85 138.10Q97.83 133.67 102.09 128.94Q106.35 124.22 112.76 121.65L112.76 121.65L112.76 96.69Q111.83 96.69 110.49 96.69Q109.15 96.69 108.45 96.69L108.45 96.69Q105.18 96.69 103.43 97.97Q101.68 99.25 101.68 102.40L101.68 102.40Q101.68 102.64 101.68 102.75L101.68 102.75ZM153.13 68.69L146.71 62.39L137.15 70.44L137.15 88.40L153.13 80.35L153.13 68.69ZM129.21 77.09L129.21 119.55Q131.55 119.90 133.88 120.60L133.88 120.60L133.88 73.24L129.21 77.09ZM153.13 84.09L137.15 92.14L137.15 100.65L153.13 92.60L153.13 84.09ZM147.41 128.42L147.41 128.42L153.13 123.99L153.13 96.34L137.15 104.39L137.15 121.77Q142.98 124.10 147.41 128.42Z'/%3E%3C/svg%3E") center/68px no-repeat;pointer-events:none}
.curtain{transform:translateY(100%);transition:transform .5s var(--e2)}
.curtain.on{transform:none}
@media(prefers-reduced-motion:no-preference){
  html.arrive body::before{content:"";animation:curtainOut .85s var(--e2) .08s both}
}
@keyframes curtainOut{from{transform:none}to{transform:translateY(-100%)}}

/* ---------------- cursor: a ring that grows over links and opens into a label ---------------- */
.cur{position:fixed;left:0;top:0;z-index:300;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:1px solid #fff;mix-blend-mode:difference;pointer-events:none;opacity:0;transition:width .35s var(--e),height .35s var(--e),margin .35s var(--e),background-color .3s,border-color .3s,opacity .3s}
.cur.on{opacity:1}
.cur--link{width:56px;height:56px;margin:-28px 0 0 -28px}
.cur--hide{opacity:0!important}
.cur--view{width:84px;height:84px;margin:-42px 0 0 -42px;background:var(--red);border-color:var(--red);mix-blend-mode:normal}
.cur span{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;font-weight:500;letter-spacing:-.01em;color:#fff;opacity:0;transition:opacity .2s}
.cur--view span{opacity:1}

/* ---------------- marquees ---------------- */
.mq{display:block;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none}
.mq__track{display:inline-flex;will-change:transform}
.mq__seg{display:inline-flex;align-items:center;flex:none}
.mq__seg > *{flex:none}
.mq i{display:inline-block;width:.16em;height:.16em;border-radius:50%;background:var(--red);margin:0 .55em}
.mq b{font-weight:500}
.mq-sec{position:relative;background:var(--white);padding:clamp(18px,3vw,44px) 0;border-block:1px solid var(--line)}
.mq--big{font-size:clamp(46px,8.6vw,136px);letter-spacing:-.05em;line-height:1.08}
.mq--big b:nth-child(4n+3){color:transparent;-webkit-text-stroke:1.2px var(--ink)}

/* image band with a marquee riding over it (homepage and practice pages) */
.band__mq{position:absolute;left:0;right:0;bottom:clamp(20px,4vw,52px);z-index:1;color:var(--white)}
.mq--band{font-size:clamp(46px,8vw,128px);letter-spacing:-.05em;line-height:1.05}
.mq--band b:nth-child(4n+3){color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.85)}

/* ---------------- footer ---------------- */
.foot{position:relative;background:var(--ink);color:var(--white);overflow:hidden}
.mq--foot{padding:clamp(30px,4.4vw,64px) 0;border-bottom:1px solid var(--line-d);font-size:clamp(44px,7.2vw,116px);letter-spacing:-.05em;line-height:1;transition:color .4s var(--e)}
.mq--foot .arw{width:.6em;height:.43em;margin-left:.3em;color:var(--red)}
.mq--foot .arw path{stroke-width:1.2}
.mq--foot:hover{color:var(--red)}
.mq--foot:hover .arw{color:var(--white)}
.foot > .wrap{padding-top:clamp(48px,6vw,84px)}
.foot__top{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,5vw,90px);padding-bottom:clamp(40px,5vw,72px)}
.foot .brand{padding:0;color:var(--white);--pbg:var(--ink)}
.foot__tag{margin-top:20px;font-size:clamp(20px,2.4vw,32px);font-weight:500;line-height:1.1;letter-spacing:-.03em;max-width:18ch}
.foot__cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,40px)}
.foot__cols h4{margin:0 0 14px;font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.foot__cols a{position:relative;display:block;width:fit-content;padding:5px 0;font-size:14px;color:rgba(255,255,255,.82);transition:color .25s,transform .35s var(--e)}
.foot__cols a:hover{color:var(--white);transform:translateX(4px)}
.foot__cols a::before{content:"";position:absolute;left:-12px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--red);opacity:0;transform:scale(0);transition:opacity .25s,transform .35s var(--spring)}
.foot__cols a:hover::before{opacity:1;transform:none}
.foot__bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding:22px 0;border-top:1px solid var(--line-d);font-size:12px;color:rgba(255,255,255,.55)}
.foot__bar ul{display:flex;flex-wrap:wrap;gap:8px 22px}
.foot__bar a:hover{color:var(--white)}
.foot__up{display:inline-flex;align-items:center;gap:8px;color:var(--white)}
.foot__up:hover .arw{transform:rotate(-90deg) translateX(3px)}
.foot__disc{padding-bottom:30px;font-size:11px;line-height:1.6;color:rgba(255,255,255,.38);max-width:112ch}
.foot__word{padding:0 max(var(--gut),env(safe-area-inset-left,0px));color:rgba(255,255,255,.075);line-height:0;margin-bottom:-.6vw}
.foot__word svg{display:block;width:100%;height:auto;aspect-ratio:444/80;transform:translate3d(0,var(--fw,0%),0)}
@media(max-width:1000px){.foot__top{grid-template-columns:1fr;gap:34px}}
@media(max-width:620px){.foot__cols{grid-template-columns:1fr 1fr}}

/* ---------------- back to top, with the page's progress drawn round it ---------------- */
.totop{position:fixed;right:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:40;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--white);color:var(--ink);box-shadow:0 8px 24px -10px rgba(31,31,31,.35);opacity:0;transform:translateY(14px) scale(.85);pointer-events:none;transition:opacity .4s var(--e),transform .5s var(--e),background .3s,color .3s}
.totop.on{opacity:1;transform:none;pointer-events:auto}
.totop:hover{background:var(--ink);color:var(--white)}
.totop__ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.totop__ring circle{fill:none;stroke:var(--line);stroke-width:1.5}
.totop__ring .totop__p{stroke:var(--red);stroke-dasharray:1;stroke-dashoffset:1}
.totop .arw{position:relative}

/* ---------------- homepage practice index; also the shape of a clickable row ---------------- */
.pidx{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,72px)}
.pidx__hd{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 14px;align-items:baseline;padding:0 0 22px;border-bottom:1px solid var(--ink)}
.pidx__hd span{font-family:var(--serif);font-size:22px;color:var(--red);font-variant-numeric:lining-nums}
.pidx__hd b{font-size:clamp(26px,2.6vw,38px);font-weight:500;letter-spacing:-.04em;line-height:1}
.pidx__hd em{grid-column:2;font-style:normal;font-size:14px;line-height:1.45;color:var(--ink-soft);max-width:44ch}
.pidx__hd .arw{grid-column:3;grid-row:1;width:20px;height:14px;align-self:center}
.pidx__hd:hover .arw{transform:translateX(5px);color:var(--red)}
.pidx__r{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) 20px;gap:2px 12px;align-items:center;padding:18px 14px 18px 0;border-bottom:1px solid var(--line);isolation:isolate;transition:color .4s var(--e),padding .5s var(--e)}
.pidx__r::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--e)}
.pidx__r i{font-style:normal;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.pidx__r b{font-size:clamp(17px,1.5vw,21px);font-weight:500;letter-spacing:-.025em;line-height:1.2}
.pidx__r span{grid-column:2;font-size:13px;color:var(--muted);line-height:1.4;transition:color .4s}
.pidx__r .arw{grid-column:3;grid-row:1 / span 2;color:var(--g4)}
.pidx__r:hover{color:var(--white);padding-left:16px}
.pidx__r:hover::before{transform:none;transform-origin:top}
.pidx__r:hover span{color:rgba(255,255,255,.6)}
.pidx__r:hover i,.pidx__r:hover .arw{color:var(--red)}
.pidx__r:hover .arw{transform:translateX(4px)}
@media(max-width:900px){.pidx{grid-template-columns:1fr}}

/* ---------------- steps that light up as the page passes them ---------------- */
.steps,.pipe{position:relative}
.steps__track{position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--red);transform:scaleX(var(--p,0));transform-origin:left;pointer-events:none;z-index:3}
.js-p .step__n,.js-p .pipe__n{transition:color .5s var(--e),transform .6s var(--spring)}
.js-p .step:not(.on) .step__n{color:var(--g4)}
.js-p .step.on .step__n{transform:translateY(-2px)}
.js-p .step p{transition:opacity .5s var(--e)}
.js-p .step:not(.on) p{opacity:.5}
@media(max-width:600px){.steps__track{display:none}}

@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes ping{0%{transform:scale(1);opacity:.75}100%{transform:scale(3.2);opacity:0}}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .mega__list a,.menu__list > *{opacity:1!important;transform:none!important}
  .nav__drop,.menu{transition:none}
  .mega__hub::after{animation:none}
}
html.static .mega__hub::after{animation:none}