/* Modern layer: loaded last, refines the other four files. */
@view-transition{navigation:auto}
:root{--ease:cubic-bezier(.2,.8,.2,1)}
html{scroll-padding-top:5.5rem;scroll-behavior:smooth}
body{min-block-size:100dvh}
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}
.skip{position:absolute;left:12px;top:-64px;z-index:50;background:var(--lime);padding:10px 16px;font-weight:500;transition:top .2s}
.skip:focus{top:10px}

/* Header */
.top{background:color-mix(in oklab,#fff 90%,transparent);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4)}
.logo-short{display:none;font:800 1.15rem var(--head)}
.nav-adm,#burger{display:none}
#burger{position:relative;inline-size:44px;block-size:44px;border:0;background:var(--lav);cursor:pointer}
#burger i{position:absolute;inset-inline:12px;block-size:2.5px;background:var(--navy);transition:transform .3s var(--ease),top .3s var(--ease)}
#burger i:nth-child(1){top:16px}
#burger i:nth-child(2){top:26px}
#burger[aria-expanded=true] i:nth-child(1){top:21px;transform:rotate(45deg)}
#burger[aria-expanded=true] i:nth-child(2){top:21px;transform:rotate(-45deg)}

@media (max-width:1150px){
  .top{flex-wrap:nowrap;gap:10px;padding:8px 14px;min-block-size:64px}
  .logo{flex:1;min-inline-size:0;max-inline-size:none}
  .logo img{inline-size:40px;block-size:40px}
  .cta{margin:0;gap:8px;align-items:center}
  .cta .desk{display:none}
  #lang::after{display:none}
  #lang span{padding:10px 14px}
  #burger{display:block}
  .top nav{order:0;width:auto;position:absolute;inset:100% 0 auto 0;display:grid;margin:0;padding:6px 16px 20px;overflow:visible;
    background:#fff;border-block-end:1px solid var(--line);box-shadow:0 24px 40px color-mix(in oklab,var(--navy) 18%,transparent);
    clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .35s var(--ease),visibility .35s}
  .top nav.open{clip-path:inset(0);visibility:visible}
  .top nav a:not(.btn){padding:14px 4px;border-block-end:1px solid var(--line);font:800 1.3rem var(--head);white-space:normal}
  .top nav a.btn{padding:0;margin-block-start:18px;justify-self:start;font:500 1rem var(--body)}
  .nav-adm{display:inline-flex}
}
@media (max-width:540px){.logo-text{display:none}.logo-short{display:inline}}

/* Surfaces */
.frame .hero,.frame .page-head{border-radius:clamp(18px,3vw,32px)}
.hero{background:
  radial-gradient(60% 80% at 88% 8%,color-mix(in oklab,var(--indigo) 65%,#fff) 0,transparent 62%),
  radial-gradient(55% 65% at 0 100%,color-mix(in oklab,var(--indigo) 55%,var(--navy)) 0,transparent 70%),
  var(--indigo)}
.chip{border-radius:20px}
.badge-row img,.site-foot img{border-radius:14px}
.offer-list{grid-template-columns:1fr}
.offer>div{container-type:inline-size}
@container (min-width:30rem){.offer-list{grid-template-columns:1fr 1fr}}
.offer-list li{border:0;background:var(--tint);border-radius:16px;padding:18px 20px;transition:transform .25s var(--ease),box-shadow .25s}
.offer-list li:hover{transform:translateY(-3px);box-shadow:0 14px 30px color-mix(in oklab,var(--indigo) 22%,transparent)}
.notice-list li{transition:background .2s}
.split .notice-list li:hover{background:#fff}

/* About page: pattern sits top-right, no dead space */
.band.page{position:relative}
.pat.small{position:absolute;right:clamp(16px,5vw,72px);top:clamp(16px,3vw,32px);width:clamp(84px,13vw,140px);margin:0}
.band.page:has(>.pat.small){padding-block-start:clamp(120px,15vw,170px)}

/* Motion */
@keyframes in{from{opacity:0;translate:0 22px}}
.hero-text>*,.hero-art,.page-head>h1,.page-head>p{animation:in .9s var(--ease) both}
.hero-text>:nth-child(2){animation-delay:.08s}
.hero-text>:nth-child(3){animation-delay:.16s}
.hero-text>:nth-child(4){animation-delay:.24s}
.hero-art{animation-delay:.2s}
@supports (animation-timeline:view()){
  .stats dl>div,.offer>*,.split>*,.about-in,.find>*,.band.page>*:not(.pat){animation:in linear both;animation-timeline:view();animation-range:entry 0% entry 40%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important}html{scroll-behavior:auto}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass{background:rgba(15,15,77,.55)}.top{background:#fff}}