:root{color-scheme:dark;--base:#141311;--mid:#392e24;--deep:#0c0d0c;--ink:#fff9f0;--muted:#c8b6a0;--accent:#e3bb83;--accent-soft:#ffe7c4;--line:rgba(231,190,133,.25);--card:rgba(231,190,133,.07);--glow:rgba(213,153,86,.22);--halo:rgba(221,171,106,.19);--ridge-a:#d2a36d;--ridge-b:#34251b}
*{box-sizing:border-box}
html{min-width:280px;background:var(--deep);scroll-behavior:smooth}
body{min-width:280px;min-height:100vh;min-height:100svh;margin:0;overflow-x:hidden;background:radial-gradient(ellipse at 49% 24%,var(--mid) 0%,var(--base) 51%,var(--deep) 100%);color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.atmosphere{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.atmosphere:before{content:"";position:absolute;inset:0;opacity:.35;background-image:radial-gradient(1px 1px at 14% 22%,var(--accent-soft),transparent),radial-gradient(1px 1px at 78% 16%,var(--accent-soft),transparent),radial-gradient(1px 1px at 66% 43%,var(--accent-soft),transparent),radial-gradient(1.5px 1.5px at 29% 58%,var(--accent),transparent)}
.aurora,.autumn-light{position:absolute;top:-22%;left:14%;width:72%;height:58%;border-radius:50%;background:radial-gradient(ellipse,var(--glow),transparent 72%);filter:blur(64px)}
.ice-ridge,.terrain{position:absolute;bottom:0;left:-2%;width:104%;height:16%;opacity:.11;background:linear-gradient(180deg,var(--ridge-a),var(--ridge-b));clip-path:polygon(0 100%,0 73%,13% 41%,27% 81%,41% 22%,53% 71%,66% 18%,78% 63%,90% 35%,100% 79%,100% 100%)}
.ridge-front{opacity:.08;transform:scaleX(-1)}
.page{position:relative;z-index:1;isolation:isolate;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:0;width:100%;max-width:1520px;min-height:100vh;min-height:100svh;margin:auto;padding:clamp(18px,2.4svh,27px) clamp(18px,5vw,82px) clamp(16px,2svh,24px)}
.topbar,.footer{display:flex;align-items:center;justify-content:space-between;gap:18px}
.topbar{min-height:40px}
.artio-link{display:inline-flex;align-items:center;gap:11px;font-size:11px;font-weight:550;letter-spacing:.15em;white-space:nowrap;color:var(--muted)}
.artio-link strong{color:var(--ink);font-weight:900}
.artio-mark{width:36px;height:36px;flex:none;display:grid;place-items:center;border:1px solid var(--line);font-size:22px;font-weight:900;letter-spacing:-.12em;padding-right:3px;color:var(--ink)}
.artio-mark span,.header-edition span{color:var(--accent)}
.header-edition{font-size:11px;font-weight:750;letter-spacing:.18em;white-space:nowrap;color:var(--muted)}
.header-edition span{margin:0 10px}
.stage{min-width:0;display:grid;place-items:center;padding:clamp(28px,5svh,64px) 0}
.stage-core{width:min(100%,1150px);min-width:0;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);grid-template-rows:auto auto;align-items:center;column-gap:clamp(28px,5vw,90px);row-gap:28px}
.logo-stage{position:relative;grid-column:1;grid-row:1/span 2;justify-self:center;align-self:center;width:min(100%,440px);aspect-ratio:1;display:grid;place-items:center}
.logo-halo{position:absolute;inset:0;border:1px solid var(--line);border-radius:50%;background:radial-gradient(circle,var(--halo),transparent 69%);box-shadow:0 0 90px 12px var(--glow)}
.logo-halo:before{content:"";position:absolute;inset:11%;border-radius:50%;border:1px dashed var(--line)}
.logo-stage img{position:relative;z-index:1;display:block;width:83%;height:83%;max-width:100%;object-fit:contain;filter:drop-shadow(0 23px 29px rgba(0,0,0,.37))}
.logo-caption{position:absolute;right:1%;bottom:13%;z-index:2;background:rgba(12,17,20,.88);color:var(--accent-soft);border:1px solid var(--line);font-size:9px;font-weight:750;letter-spacing:.15em;white-space:nowrap;padding:9px 11px;transform:rotate(-5deg)}
.identity{grid-column:2;grid-row:1;align-self:end;min-width:0;text-align:left}
.slogan{margin:0 0 16px;color:var(--accent);font-size:clamp(10px,1.05vw,13px);font-weight:850;letter-spacing:.25em}
.identity h1{margin:0;font-size:clamp(49px,5.5vw,86px);font-weight:900;line-height:1.04;letter-spacing:-.055em;white-space:nowrap;text-wrap:nowrap;text-shadow:0 14px 50px rgba(0,0,0,.13)}
.identity h1 span{display:block;font-size:.79em;letter-spacing:.13em;color:var(--accent-soft);padding-left:.08em}
.event-date{margin:22px 0 0;color:var(--muted);font-size:clamp(11px,1.15vw,14px);font-weight:800;letter-spacing:.13em}
.event-date span,.opening-date span{color:var(--accent);margin:0 7px}
.countdown-section,.actions{grid-column:2;grid-row:2;align-self:start;min-width:0}
.countdown-section{width:100%;max-width:570px;text-align:left}
.countdown-section h2{margin:0 0 15px;color:var(--accent);font-size:11px;font-weight:800;letter-spacing:.16em}
.countdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.time-cell{min-width:0;min-height:111px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:11px 4px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.time-cell strong{font-size:clamp(35px,3.65vw,55px);line-height:1;font-weight:850;letter-spacing:-.045em;font-variant-numeric:tabular-nums;color:var(--ink)}
.time-cell span{font-size:9px;font-weight:750;letter-spacing:.11em;color:var(--muted)}
.opening-date{margin:15px 0 0;color:var(--ink);font-size:11px;font-weight:850;letter-spacing:.14em}
.opening-date small{font-size:9px;color:var(--muted)}
.opening-status{margin:12px 0 0;color:var(--accent);font-size:11px;line-height:1.5}
.opening-status:empty{display:none}
.format-line{margin:22px 0 0;color:var(--muted);font-size:clamp(12px,1.3vw,15px);font-weight:750;letter-spacing:.13em}
.format-line strong{color:var(--accent-soft);font-weight:900}
.format-line span{margin:0 11px;color:var(--accent)}
.actions{margin:0}
.action-main{display:inline-flex;align-items:center;justify-content:center;gap:22px;max-width:100%;min-height:52px;padding:14px 21px;border:1px solid var(--accent);border-radius:7px;background:var(--card);color:var(--accent-soft);font-size:11px;font-weight:850;letter-spacing:.11em;transition:background .2s,transform .2s}
.action-main:hover{background:var(--glow);transform:translateY(-2px)}
.action-main span{font-size:18px}
.footer{min-height:39px;border-top:1px solid var(--line);padding-top:15px;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.11em}
.footer a{color:var(--accent-soft)}.footer a:hover{color:var(--accent)}.footer a span{color:var(--accent)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){
.page{padding:17px clamp(15px,4vw,30px) 16px}
.topbar{min-height:35px}
.stage{padding:clamp(14px,3svh,28px) 0}
.stage-core{display:flex;flex-direction:column;align-items:center;width:min(100%,560px);gap:0}
.logo-stage{width:clamp(142px,min(47vw,26svh),235px);margin:0 auto clamp(10px,1.7svh,16px)}
.logo-caption{right:-5%;bottom:9%;font-size:7px;padding:6px 8px}
.identity{align-self:stretch;text-align:center}
.slogan{margin-bottom:9px;font-size:10px;letter-spacing:.2em}
.identity h1{font-size:clamp(39px,10.8vw,70px);line-height:.99;letter-spacing:-.055em}
.identity h1 span{font-size:.76em;letter-spacing:.15em}
.event-date{font-size:11px;letter-spacing:.09em;margin-top:13px}
.format-line{font-size:11px;letter-spacing:.09em;margin-top:14px}
.countdown-section,.actions{align-self:stretch;text-align:center;margin-top:clamp(18px,2.5svh,26px);width:100%}
.countdown-section h2{font-size:10px;letter-spacing:.12em;margin-bottom:12px}
.countdown{gap:8px}
.time-cell{min-height:87px;padding:10px 3px;gap:5px;border-radius:10px}
.time-cell strong{font-size:clamp(33px,9vw,52px)}
.time-cell span{font-size:8px;letter-spacing:.07em}
.opening-date{margin-top:12px;font-size:10px;letter-spacing:.08em}
.footer{font-size:9px;letter-spacing:.08em;padding-top:12px}
}
@media(max-width:380px){
.page{padding-inline:12px}
.artio-link{font-size:9px;letter-spacing:.11em;gap:7px}
.artio-mark{width:30px;height:30px;font-size:19px}
.header-edition{font-size:9px;letter-spacing:.1em}
.header-edition span{margin:0 4px}
.identity h1{font-size:clamp(36px,10.7vw,43px)}
.countdown{gap:6px}
.time-cell{min-height:78px}
.time-cell strong{font-size:clamp(31px,9.3vw,37px)}
.time-cell span{font-size:7px}
.format-line{font-size:10px}
.format-line span{margin:0 6px}
.footer{font-size:8px}
}
@media(max-height:700px) and (max-width:900px){
.stage{padding-block:12px}
.logo-stage{width:clamp(115px,min(38vw,23svh),170px);margin-bottom:7px}
.slogan{margin-bottom:5px}
.identity h1{font-size:clamp(37px,9.4vw,55px)}
.event-date{margin-top:8px}
.format-line{margin-top:9px}
.countdown-section,.actions{margin-top:12px}
.time-cell{min-height:68px;padding-block:6px}
.countdown-section h2{margin-bottom:7px}
.opening-date{margin-top:8px}
}
@media(max-height:620px) and (min-width:901px){
.stage{padding-block:16px}
.stage-core{width:min(100%,1050px)}
.logo-stage{width:min(100%,325px)}
.identity h1{font-size:clamp(43px,5vw,72px)}
.time-cell{min-height:84px}
}
@media(prefers-reduced-motion:no-preference){
.aurora,.autumn-light{animation:glow-shift 11s ease-in-out infinite alternate}
@keyframes glow-shift{to{transform:scale(1.11);opacity:.7}}
}
@media(prefers-reduced-motion:reduce){.aurora,.autumn-light{animation:none}.action-main{transition:none}}
