/* The shell of every page, kept quiet: colour only as a thin print bar and a rule under the open item.
   The art of the footer is the one big word, in the manner of the credits. */
html{scroll-padding-top:56px}
.hd{--h:76px;position:sticky;top:0;z-index:40;isolation:isolate;height:76px;pointer-events:none}
.hd.slim{--h:56px}
.hd>*{pointer-events:auto}
.hd::after{content:"";position:absolute;z-index:-1;left:0;right:0;top:0;height:var(--h);background:var(--bg);transition:height .2s cubic-bezier(.3,.7,.2,1),background-color .35s ease;pointer-events:none}
.hd.slim::after{background:color-mix(in srgb,var(--bg) 90%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--line)}
.hd::before{content:"";position:absolute;z-index:1;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#b8a3ff 0 20%,#f783ac 0 40%,#ffd43b 0 60%,#38d9a9 0 80%,#4dabf7 0);pointer-events:none}
.hd:has(dv-if.if-mobile:not(.off)){position:relative;height:auto}
.hd-bar{position:relative;display:flex;align-items:center;gap:clamp(14px,2vw,28px);max-width:1240px;height:var(--h);margin:0 auto;padding:0 clamp(16px,4vw,32px);transition:height .2s cubic-bezier(.3,.7,.2,1)}
.hd .pm{top:calc(var(--h) - 2px)}
.hd-gap{flex:1}

.hd-logo{display:flex;align-items:center;gap:9px;flex:none}
.hd-logo span{font:600 21px/1 Fredoka,sans-serif}
.hd-logo span span{color:var(--accent-ink);font:inherit}

.hd-tabs{display:flex;align-items:stretch;height:var(--h)}
.hd-tab{--c:var(--accent-ink);position:relative;display:flex;align-items:center;gap:6px;height:var(--h);padding:0 13px;transition:height .2s cubic-bezier(.3,.7,.2,1);border:0;background:none;color:var(--ink);font:600 15.5px/1 'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;letter-spacing:-.005em;white-space:nowrap;cursor:pointer}
.hd-tab::after{content:"";position:absolute;left:13px;right:13px;bottom:0;height:3px;background:var(--c);transform:scaleX(0);transform-origin:0 50%;transition:transform .22s cubic-bezier(.3,.7,.2,1)}
.hd-tab:hover::after,.hd-tab.is-open::after,.hd-tab.is-here::after,.hd-tab:focus-visible::after{transform:scaleX(1)}
.hd-tab:focus-visible{outline:0;color:var(--accent-ink)}
body:has(main.cz) .hd-tab[aria-controls="dv-cozum"]::after{transform:scaleX(1)}
.hd-tabs>:nth-child(1){--c:#b8a3ff}
.hd-tabs>:nth-child(2){--c:#f783ac}
.hd-tabs>:nth-child(3){--c:#ffd43b}
.hd-tabs>:nth-child(4){--c:#38d9a9}
.hd-tabs>:nth-child(5){--c:#4dabf7}

.hd-sw{position:relative;flex:none;width:38px;height:38px;padding:0;border:1px solid var(--line2);border-radius:8px;background:none;color:var(--ink);cursor:pointer;transition:border-color .15s}
.hd-sw:hover{border-color:var(--ink)}
.hd-sw .dv-knob{position:absolute;inset:0;width:auto;height:auto;background:none;color:inherit;box-shadow:none;transition:none}
.hd-sw svg{width:16px;height:16px}
.hd-lang{display:flex;align-items:center;justify-content:center;flex:none;width:38px;height:38px;border:1px solid var(--line2);border-radius:8px;color:var(--ink);font:600 13px/1 'JetBrains Mono',ui-monospace,Consolas,monospace;transition:border-color .15s}
.hd-lang:hover,.hd-lang:focus-visible{border-color:var(--ink);outline:0}
.hd-in{flex:none;font:600 15.5px/1 'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;color:var(--ink);text-underline-offset:5px}
.hd-in:hover{text-decoration:underline}
.hd-go{display:flex;align-items:center;flex:none;height:40px;padding:0 20px;border-radius:7px;background:var(--ink);color:var(--bg) !important;font:700 15px/1 'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;transition:background-color .15s,color .15s}
.hd-go:hover,.hd-go:focus-visible{background:var(--accent);color:#fff !important;outline:0}
.dv-burger{width:44px;height:44px;border:0;border-radius:8px;background:var(--tile2);color:var(--ink);align-items:center;justify-content:center;cursor:pointer}

/* ---- the foot: always dark, like the credits */
.ft{--d:#6d4bd8;position:relative;overflow:hidden;background:#0b0b0f;color:#f4f3f6}
.ft-in{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr))}
.ft-col{--c:#b8a3ff;display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:30px clamp(18px,2.5vw,44px) 46px;border-top:4px solid var(--c);border-left:1px solid rgba(255,255,255,.08)}
.ft-col:first-child{border-left:0;padding-left:clamp(16px,4vw,56px)}
.ft-col:nth-child(2){--c:#f783ac}
.ft-col:nth-child(3){--c:#ffd43b}
.ft-col:nth-child(4){--c:#38d9a9}
.ft-col:nth-child(5){--c:#4dabf7}
.ft-h{margin:0 0 12px;color:var(--c);font:500 12.5px/1.2 'JetBrains Mono',ui-monospace,Consolas,monospace;letter-spacing:.06em;text-transform:uppercase}
.ft-col a:not(.ft-logo){display:block;max-width:100%;padding:5px 0;color:#d8d7de;font:600 clamp(15.5px,1.15vw,18px)/1.25 'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:5px;transition:color .15s,text-decoration-color .15s}
.ft-col a:not(.ft-logo):hover,.ft-col a:not(.ft-logo):focus-visible{color:#fff;text-decoration-color:var(--c);outline:0}
.ft-logo{display:inline-flex;align-items:center;gap:9px;font:600 21px/1 Fredoka,sans-serif}
.ft-logo span span{color:#b8a3ff}
.ft-brand p{max-width:300px;margin:14px 0 0;color:#a3a2ac;font-size:14.5px;line-height:1.5;text-wrap:pretty}
.ft-set{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:20px}
.ft-set select{height:38px;padding:0 8px;border:1px solid rgba(255,255,255,.2);border-radius:8px;background:#0b0b0f;color:#f4f3f6;font:500 14px Inter,'Segoe UI',system-ui,sans-serif}
.ft-set .hd-sw{border-color:rgba(255,255,255,.2);color:#f4f3f6}
.ft-motion .m-still,html.still .ft-motion .m-move{display:none}
html.still .ft-motion .m-still{display:block}
.ft-set>span{color:#a3a2ac;font-size:14px}
/* inside .ft-col, whose links are big and underlined: the language link stays a small box */
.ft-col .ft-set .ft-lang{display:inline-flex;align-items:center;height:38px;padding:0 12px;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#f4f3f6;font:500 14px Inter,'Segoe UI',system-ui,sans-serif;text-decoration:none}
.ft-col .ft-set .ft-lang:hover{border-color:#fff}
.ft-fam{display:flex;align-items:center;gap:clamp(20px,3vw,48px);padding:20px clamp(16px,4vw,56px) 22px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.ft-ggdb{flex:none;color:#f4f3f6;font:800 clamp(30px,2.9vw,44px)/1 'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;letter-spacing:-.02em;transition:color .15s}
.ft-ggdb:hover,.ft-ggdb:focus-visible{color:#b8a3ff;outline:0}
.ft-fam p{flex:1 1 auto;min-width:0;max-width:560px;margin:0;color:#a3a2ac;font-size:14.5px;line-height:1.5;text-wrap:pretty}
.ft-fam p b{color:#f4f3f6;font-weight:600}
.ft-fam nav{display:flex;flex-wrap:wrap;gap:6px 24px;margin-left:auto}
.ft-fam nav a{color:#d8d7de;font:600 clamp(15px,1.1vw,17px)/1.3 'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;white-space:nowrap;text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:5px;transition:color .15s,text-decoration-color .15s}
.ft-fam nav a:hover,.ft-fam nav a:focus-visible{color:#fff;text-decoration-color:#b8a3ff;outline:0}
.ft-base a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.ft-base a:hover{color:#fff}
.ft-word{position:relative;display:block;height:calc(98vw / 4.5 * .96);margin:clamp(10px,2vw,30px) 0 0 1vw;font-size:calc(98vw / 4.5);font-weight:800;line-height:.96;letter-spacing:-.025em;color:#f4f3f6;text-shadow:0.004em 0.004em 0 var(--d),0.008em 0.008em 0 var(--d),0.012em 0.012em 0 var(--d),0.016em 0.016em 0 var(--d),0.020em 0.020em 0 var(--d),0.024em 0.024em 0 var(--d),0.028em 0.028em 0 var(--d),0.032em 0.032em 0 var(--d),0.036em 0.036em 0 var(--d),0.040em 0.040em 0 var(--d),0.044em 0.044em 0 var(--d),0.048em 0.048em 0 var(--d),0.052em 0.052em 0 var(--d),0.056em 0.056em 0 var(--d),0.060em 0.060em 0 var(--d);clip-path:inset(-8% -3% -.07em -3%)}
.ft-w{position:absolute;left:0;bottom:var(--b,0px);display:inline-flex;width:max-content;font-size:inherit;transition:visibility 0s}
.ft-w b{display:block;font-weight:inherit}
.ft-w i{display:block;font-style:normal;transition:transform .56s cubic-bezier(.3,.7,.2,1);transition-delay:calc(var(--i) * 24ms)}
.ft-w.off{visibility:hidden;transition:visibility 0s .86s}
.ft-w.off i{transform:translateY(112%)}
.ft-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 24px;padding:18px clamp(16px,4vw,56px) 20px;color:#a3a2ac;font-size:13.5px}

@media (max-width:1140px){
.hd-bar{gap:12px}
.hd-tab{padding:0 9px;font-size:14.5px}
.hd-tab::after{left:9px;right:9px}
.hd-tab .dv-chev{display:none}
}
@media (max-width:1000px){
.hd-bar .hd-lang{margin-left:auto}
.hd-gap{display:none}
}
@media (max-width:900px){
.ft-in{grid-template-columns:repeat(2,minmax(0,1fr))}
.ft-col{padding:24px 16px 30px}
.ft-col:first-child{grid-column:1 / -1;padding-left:16px}
.ft-col:nth-child(2){border-left:0}
.ft-col:nth-child(4){border-left:0}
.ft-fam{flex-wrap:wrap;gap:10px 18px;padding:20px 16px 22px}
.ft-fam p{flex:1 1 100%;max-width:none;order:2}
.ft-fam nav{order:3;flex:1 1 100%;margin-left:0}
.ft-word{margin-left:2vw;font-size:calc(96vw / 4.5);height:calc(96vw / 4.5 * .96)}
}
html.still .hd::after,html.still .hd-bar,html.still .hd-tab,html.still .hd-tab::after,html.still .ft-w i{transition:none}