@font-face { font-family:'Huninn'; font-style:normal; font-weight:400; font-display:swap; src:url('assets/huninn.ttf') format('truetype'); }
:root { --ink:#303331; --accent:#b8242c; --paper:#fafaf8; --motion:650ms; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:'Huninn',Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; cursor:pointer; }
button,a { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:2px solid var(--accent); outline-offset:6px; }
.header { position:fixed; z-index:5; inset:0 0 auto; display:flex; align-items:flex-start; justify-content:space-between; padding:24px 4.5vw; pointer-events:none; }
.header>* { pointer-events:auto; }
.brand img { width:120px; height:auto; display:block; }
.header nav { display:flex; align-items:center; gap:32px; padding:16px 0; font-size:14px; }
.header nav button { border:0; background:none; padding:0; }
.header nav a:hover,.header nav button:hover { color:var(--accent); }
.slide { position:relative; min-height:100svh; overflow:hidden; isolation:isolate; background:#eee; }
.background { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; filter:saturate(.32); }
.slide::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(to bottom,rgba(250,250,248,.98) 0%,rgba(250,250,248,.9) 30%,rgba(250,250,248,.2) 65%,rgba(250,250,248,.22)); }
.slide--holding .background { filter:none; object-position:center 60%; }
.slide--holding::after { background:linear-gradient(to bottom,rgba(255,255,255,.3),transparent 60%); }
.content { max-width:1120px; margin:auto; text-align:center; padding:160px 28px 220px; }
.eyebrow { font-size:12px; text-transform:uppercase; letter-spacing:.36em; margin:0 0 22px; line-height:1.8; }
h1,h2 { font-family:inherit; font-weight:400; letter-spacing:-.035em; text-wrap:balance; }
h1,h2 { font-size:clamp(34px,4.4vw,66px); line-height:1.12; margin:0; }
h1 span,h2 span { color:var(--accent); }
.description { font-size:clamp(16px,1.5vw,21px); line-height:1.5; margin:18px 0 0; }
.visit { display:inline-flex; align-items:center; justify-content:center; gap:22px; border:1px solid #555; border-radius:40px; padding:13px 24px; margin-top:26px; font-size:14px; background:rgba(255,255,255,.45); transition:background .2s,color .2s; }
.visit:hover { background:var(--ink); color:white; }
.slide:has(.company-summary) { display:flex; flex-direction:column; }
.slide:has(.company-summary) .content { width:100%; margin:0 auto; padding-bottom:32px; }
.company-summary { flex-shrink:0; align-self:flex-end; width:330px; max-width:calc(100% - 28px); margin:auto 6vw calc(var(--controls-height, 100px) + max(22px, env(safe-area-inset-bottom)) + 16px) 0; padding:22px 24px; border:1px solid rgba(255,255,255,.7); border-radius:8px; background:rgba(255,255,255,.9); backdrop-filter:blur(16px); }
.company-summary h3 { margin:0 0 9px; font-size:14px; line-height:1.45; font-weight:600; }
.company-summary h3::before { content:""; display:block; width:24px; height:2px; margin-bottom:13px; background:var(--accent); }
.company-summary p { margin:0; font-size:14px; line-height:1.65; color:#505450; }
.company-logo { display:block; width:auto; max-width:180px; height:34px; object-fit:contain; object-position:left center; margin-bottom:14px; }
.company-summary:has(.company-logo) h3::before { display:none; }
@media(max-width:900px) { .company-summary { margin-right:3vw; } }
@media(max-width:640px) { .company-summary { width:330px; margin-right:14px; margin-bottom:calc(var(--controls-height, 160px) + max(14px, env(safe-area-inset-bottom)) + 12px); padding:16px 20px; } }
.slide-controls { position:fixed; z-index:5; bottom:max(22px,env(safe-area-inset-bottom)); left:6vw; right:6vw; }
.scroll-hint { text-align:center; font-size:13px; margin:0 0 15px; text-shadow:0 1px 8px white; }
.navigation-bar { display:flex; align-items:center; background:rgba(255,255,255,.87); backdrop-filter:blur(18px); border:1px solid rgba(255,255,255,.6); border-radius:8px; padding:6px 15px; }
.company-nav { flex:1; display:flex; align-items:center; justify-content:space-around; }
.company-nav a { position:relative; white-space:nowrap; font-size:14px; padding:17px 10px; }
.company-nav a::after { content:""; position:absolute; height:2px; left:10px; right:10px; bottom:7px; background:var(--accent); transform:scaleX(0); transition:transform .25s; }
.company-nav a[aria-current="true"]::after,.company-nav a:hover::after { transform:scaleX(1); }
.paging { display:flex; align-items:center; margin-left:20px; gap:10px; }
.paging button { background:none; border:0; min-width:40px; min-height:44px; font-size:28px; font-weight:300; }
.paging button:disabled { opacity:.25; cursor:default; }
#counter { font-size:13px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.js main { height:100svh; position:relative; overflow:hidden; }
.js .slide { position:absolute; inset:0; height:100%; min-height:0; overflow:auto; opacity:0; visibility:hidden; pointer-events:none; transition:opacity var(--motion) ease,visibility var(--motion); }
.js .slide.is-active { opacity:1; visibility:visible; pointer-events:auto; }
.js .content { opacity:0; transform:translateY(10px); transition:opacity var(--motion),transform var(--motion); }
.js .is-active .content { opacity:1; transform:none; }
.sr-only,.skip-link:not(:focus) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip-link:focus { position:fixed; z-index:20; top:10px; left:10px; padding:12px; background:white; }
dialog { width:min(560px,calc(100% - 32px)); border:0; border-radius:8px; padding:48px 36px; color:var(--ink); background:var(--paper); }
dialog::backdrop { background:rgba(20,25,22,.35); backdrop-filter:blur(5px); }
dialog h2 { font-size:36px; }
dialog p:not(.eyebrow) { line-height:1.7; }
.close { position:absolute; top:8px; right:10px; border:0; background:none; width:44px; height:44px; font-size:30px; }
@media(min-width:1500px) { .content { padding-top:18vh; } }
@media(max-width:900px) { .slide-controls { left:3vw; right:3vw; } .company-nav a { font-size:12px; padding-inline:8px; } .paging { margin-left:5px; gap:0; } .brand img { width:96px; } }
@media(max-width:640px) {
  .header { padding:18px 22px; } .brand img { width:76px; } .header nav { gap:20px; font-size:13px; padding-top:12px; }
  .content { padding:145px 22px 230px; } .eyebrow { font-size:11px; letter-spacing:.24em; margin-bottom:16px; }
  h1,h2 { font-size:clamp(30px,8vw,44px); } .description { font-size:16px; }
  .background { object-position:center; } .slide--holding .background { object-fit:cover; object-position:center 60%; }
  .slide-controls { left:14px; right:14px; bottom:max(14px,env(safe-area-inset-bottom)); }
  .navigation-bar { flex-direction:column; padding:6px 8px 0; }
  .company-nav { flex-wrap:wrap; justify-content:center; gap:0 6px; width:100%; }
  .company-nav a { padding:10px 7px; font-size:12px; }
  .company-nav a::after { bottom:3px; }
  .paging { margin:0; width:100%; justify-content:space-between; border-top:1px solid #ddd; }
  .scroll-hint { margin-bottom:10px; font-size:12px; }
}
@media(max-height:620px) and (min-width:641px) { .content { padding-top:95px; } h1,h2 { font-size:38px; } .eyebrow { margin-bottom:10px; } .brand img { width:74px; } .visit { margin-top:14px; } }
@media(max-height:740px) and (max-width:640px) {
  .slide:has(.company-summary) .content { padding-top:112px; padding-bottom:18px; }
  .slide:has(.company-summary) h2 { font-size:28px; }
  .slide:has(.company-summary) .description { margin-top:10px; }
  .slide:has(.company-summary) .visit { margin-top:14px; padding:10px 20px; }
  .company-summary { padding:14px 18px; }
  .company-summary h3::before { margin-bottom:8px; }
  .company-logo { height:26px; margin-bottom:10px; }
}
@media(prefers-reduced-motion:reduce) { :root { --motion:0ms; } html { scroll-behavior:auto; } * { transition:none!important; } }