/* Arcteon homepage, "Kaamos": the blue hour of the polar night.
   Cards are double-bezelled (shell + core). The only accent is the low sun (#E8A88C), and the mark's orange dot is the star.
   Orange is for shapes only, never text. Every page is complete without JS; motion is transform-only. */

@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/schibsted-grotesk-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/schibsted-grotesk-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Schibsted Grotesk";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/schibsted-grotesk-latin-400-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Schibsted Grotesk";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/schibsted-grotesk-latin-ext-400-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/schibsted-grotesk-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/schibsted-grotesk-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/schibsted-grotesk-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/schibsted-grotesk-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  color-scheme:dark;
  --night:#0B1016;--dusk:#121A23;--dusk-2:#17212C;--deep:#3B5670;
  --ice:#E6EEF2;--frost:#95A5B2;--mist:#5E6E7B;--glow:#E8A88C;--star:#FF4F00;
  --hair:rgba(230,238,242,.08);--hair-2:rgba(230,238,242,.14);--shell:rgba(230,238,242,.035);

  --display:"Schibsted Grotesk","Helvetica Neue",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;

  --ease:cubic-bezier(.32,.72,0,1);--spring:cubic-bezier(.34,1.45,.64,1);
  --r-shell:2rem;--r-pad:.4rem;--r-core:calc(var(--r-shell) - var(--r-pad));
  --z-overlay:30;--z-nav:40;--z-grain:50;--z-skip:60;
  --section:clamp(96px,12vw,168px);
}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--night);scroll-behavior:smooth;overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--night);color:var(--ice);font:400 1.0625rem/1.65 var(--display);-webkit-font-smoothing:antialiased;overflow-x:clip}
body::after{
  content:"";position:fixed;inset:0;z-index:var(--z-grain);pointer-events:none;opacity:.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
h1,h2,h3,p,figure,ul,dl{margin:0}
h1,h2,h3{font-weight:500;text-wrap:balance}
p{text-wrap:pretty}
a{color:inherit}
img,svg{max-width:100%}
:focus-visible{outline:2px solid var(--glow);outline-offset:3px;border-radius:999px}
::selection{background:var(--glow);color:var(--night)}

.wrap{max-width:1240px;margin-inline:auto;padding-inline:clamp(16px,4vw,40px)}

.skip{position:absolute;left:16px;top:-100px;z-index:var(--z-skip);background:var(--ice);color:var(--night);padding:10px 18px;border-radius:999px;font:500 .9375rem/1 var(--display);text-decoration:none}
.skip:focus{top:calc(env(safe-area-inset-top,0px) + 12px)}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;width:max-content;max-width:100%;
  padding:5px 12px 5px 10px;border-radius:999px;background:var(--shell);box-shadow:inset 0 0 0 1px var(--hair);
  font:400 .6875rem/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--frost);
}
.eyebrow i{flex:none;width:6px;height:6px;border-radius:50%;background:var(--glow);box-shadow:0 0 12px var(--glow)}

/* ---------- Brand ---------- */
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.brand svg{width:15px;height:20px;color:var(--ice)}
.brand span{font:600 1.0625rem/1 var(--display);letter-spacing:-.02em;color:var(--ice)}

/* ---------- Nav island ---------- */
.nav{
  position:fixed;z-index:var(--z-nav);top:calc(env(safe-area-inset-top,0px) + 18px);left:50%;transform:translateX(-50%);
  width:max-content;max-width:calc(100% - 32px);display:flex;align-items:center;gap:6px;padding:6px 6px 6px 18px;border-radius:999px;
  background:rgba(18,26,35,.62);-webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%);
  box-shadow:inset 0 0 0 1px var(--hair),inset 0 1px 0 rgba(255,255,255,.06),0 20px 50px -20px rgba(3,8,14,.8);
}
.nav .brand{margin-right:14px}
.nav-links{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.nav-links a{display:block;padding:8px 14px;border-radius:999px;font-size:.875rem;color:var(--frost);text-decoration:none;transition:color 400ms var(--ease),background-color 400ms var(--ease)}
.nav-links a:hover{color:var(--ice);background:rgba(230,238,242,.06)}
.nav-cta{display:inline-flex;align-items:center;gap:8px;padding:8px 8px 8px 16px;border-radius:999px;background:var(--ice);color:var(--night);font-size:.875rem;font-weight:500;text-decoration:none;transition:transform 500ms var(--ease)}
.nav-cta:active{transform:scale(.97)}
.nav-cta .dot{width:22px;height:22px;border-radius:50%;background:rgba(11,16,22,.09);display:grid;place-items:center;transition:transform 500ms var(--spring)}
.nav-cta:hover .dot{transform:translate(2px,-1px) scale(1.06)}
.nav-cta svg{width:11px;height:11px}

.burger{display:none;position:relative;width:40px;height:40px;border:0;border-radius:50%;background:rgba(230,238,242,.06);color:var(--ice);cursor:pointer}
.burger span{position:absolute;left:12px;right:12px;top:50%;height:1.5px;margin-top:-.75px;border-radius:2px;background:currentColor;transition:transform 600ms var(--ease)}
.burger span:nth-child(1){transform:translateY(-3.5px)}
.burger span:nth-child(2){transform:translateY(3.5px)}
.burger[aria-expanded="true"] span:nth-child(1){transform:rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){transform:rotate(-45deg)}

.overlay{
  position:fixed;inset:0;z-index:var(--z-overlay);display:flex;flex-direction:column;justify-content:center;
  padding:120px clamp(24px,8vw,80px) 60px;background:rgba(11,16,22,.84);-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);
  opacity:0;visibility:hidden;transition:opacity 600ms var(--ease),visibility 0s 600ms;
}
.overlay.open{opacity:1;visibility:visible;transition:opacity 600ms var(--ease)}
.overlay ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.overlay li{overflow:hidden}
.overlay a{
  display:inline-block;text-decoration:none;font-size:clamp(2.5rem,11vw,4.5rem);font-weight:500;letter-spacing:-.035em;line-height:1.1;
  transform:translateY(110%);opacity:0;transition:transform 900ms var(--ease),opacity 900ms var(--ease);
}
.overlay li:nth-child(1) a{transition-delay:80ms}
.overlay li:nth-child(2) a{transition-delay:150ms}
.overlay li:nth-child(3) a{transition-delay:220ms}
.overlay li:nth-child(4) a{transition-delay:290ms}
.overlay.open a{transform:none;opacity:1}
.overlay p{margin-top:48px;font:400 .75rem/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;padding-top:clamp(140px,18vw,200px);padding-bottom:var(--section);overflow:hidden}
.hero::before{
  content:"";position:absolute;z-index:-1;inset:auto -20% -38% -20%;height:90%;pointer-events:none;
  background:radial-gradient(60% 55% at 50% 100%,rgba(232,168,140,.22),transparent 70%),radial-gradient(80% 70% at 50% 100%,rgba(59,86,112,.45),transparent 72%);
}
.hero::after{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,168,140,.5),transparent)}
.hero-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(32px,4vw,56px);align-items:end}
.hero-copy{grid-column:span 7;display:grid;gap:32px}
.hero h1{font-size:clamp(3rem,7.4vw,6.9rem);line-height:.94;letter-spacing:-.045em}
.hero h1 em{font-style:italic;font-weight:400;color:var(--frost)}
.lede{max-width:34rem;font-size:1.1875rem;line-height:1.6;color:var(--frost)}
.lede strong{color:var(--ice);font-weight:500}
.actions{display:flex;flex-wrap:wrap;gap:12px;padding-top:8px}

.btn{
  display:inline-flex;align-items:center;gap:14px;padding:6px 6px 6px 24px;border:0;border-radius:999px;
  font:500 .9375rem/1 var(--display);text-decoration:none;cursor:pointer;
  transition:transform 500ms var(--ease),background-color 500ms var(--ease);
}
.btn:active{transform:scale(.98)}
.btn .ico{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;transition:transform 600ms var(--spring)}
.btn:hover .ico{transform:translate(3px,-2px) scale(1.06)}
.btn svg{width:15px;height:15px}
.btn-solid{background:var(--ice);color:var(--night)}
.btn-solid .ico{background:rgba(11,16,22,.08)}
.btn-ghost{background:var(--shell);color:var(--ice);box-shadow:inset 0 0 0 1px var(--hair)}
.btn-ghost:hover{background:rgba(230,238,242,.06)}
.btn-ghost .ico{background:rgba(230,238,242,.07)}

/* ---------- Double bezel ---------- */
.bezel{padding:var(--r-pad);border-radius:var(--r-shell);background:var(--shell);box-shadow:inset 0 0 0 1px var(--hair),0 40px 80px -40px rgba(2,6,12,.9)}
.core{
  position:relative;overflow:hidden;height:100%;border-radius:var(--r-core);
  background:linear-gradient(180deg,var(--dusk-2),var(--dusk));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 0 0 1px rgba(230,238,242,.04);
}
@media (hover:hover){
  .core::before{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
    background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(232,168,140,.09),transparent 45%);
    transition:opacity 600ms var(--ease);
  }
  .bezel:hover .core::before{opacity:1}
}

.sky{grid-column:span 5}
.sky .core{padding:22px 22px 18px;display:grid;gap:16px}
.sky-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.label{font:400 .6875rem/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--frost)}
.live{display:inline-flex;align-items:center;gap:8px;font:400 .6875rem/1.4 var(--mono);color:var(--mist);font-variant-numeric:tabular-nums}
.live i{width:6px;height:6px;border-radius:50%;background:var(--glow);animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
.sky-chart{display:block;width:100%;height:210px}
.readouts{display:grid;grid-template-columns:1fr 1fr;gap:1px;border-radius:1rem;overflow:hidden;background:var(--hair)}
.readouts div{background:var(--dusk);padding:12px 14px;display:grid;gap:2px}
.readouts dt{font:400 .625rem/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.readouts dd{margin:0;font:400 1rem/1.4 var(--mono);font-variant-numeric:tabular-nums;color:var(--ice)}
.sky-foot{font:400 .6875rem/1.5 var(--mono);color:var(--mist)}

/* ---------- Sections ---------- */
.block{padding-block:var(--section)}
.sec-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:end;margin-bottom:clamp(48px,6vw,80px)}
.sec-head > div{grid-column:span 7;display:grid;gap:24px}
.sec-head p{grid-column:9 / span 4;color:var(--frost);max-width:26rem}
h2{font-size:clamp(2.25rem,4.8vw,4.1rem);line-height:1;letter-spacing:-.04em}
h3{font-size:clamp(1.5rem,2.2vw,1.875rem);letter-spacing:-.025em;line-height:1.1}

.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.bento > :nth-child(1),.bento > :nth-child(4){grid-column:span 7}
.bento > :nth-child(2),.bento > :nth-child(3){grid-column:span 5}
.card{padding:clamp(28px,3.4vw,44px);display:flex;flex-direction:column;gap:18px;min-height:340px}
.card p{color:var(--frost);max-width:30rem}
.card .foot{margin-top:auto;padding-top:20px}

.ledger{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--hair)}
.ledger li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--hair);font:400 .8125rem/1.4 var(--mono);color:var(--frost)}
.ledger b{font-weight:400;color:var(--ice);font-variant-numeric:tabular-nums}

.rewrite{display:grid;gap:10px;font-size:.9375rem}
.rewrite s{color:var(--mist);text-decoration-color:rgba(232,168,140,.7);text-decoration-thickness:1.5px;font:400 .8125rem/1.4 var(--mono)}
.rewrite span{color:var(--ice)}

.road{display:block;width:100%;height:120px;color:var(--deep)}
.stamp{display:flex;gap:28px;flex-wrap:wrap;font:400 .75rem/1.4 var(--mono);color:var(--mist);letter-spacing:.06em}
.stamp b{display:block;font:400 1.5rem/1.3 var(--display);color:var(--ice);letter-spacing:-.02em}

/* ---------- Looking up ---------- */
.up .core{min-height:460px;display:grid;align-content:end;background:radial-gradient(120% 90% at 70% 0%,#1A2633 0%,var(--dusk) 55%,#0E151D 100%)}
.stars{position:absolute;inset:0;width:100%;height:100%}
.up-copy{position:relative;padding:clamp(28px,5vw,64px);display:grid;gap:22px;max-width:40rem}
.up-copy p{color:var(--frost);font-size:1.125rem}

/* ---------- Contact ---------- */
.contact{display:grid;gap:32px}
.mail{font-size:clamp(2rem,7.6vw,6.6rem);font-weight:500;letter-spacing:-.045em;line-height:1;overflow-wrap:anywhere}
.mail a{text-decoration:none;border-radius:.2em;transition:color 400ms var(--ease)}
.mail a:hover{color:#FFFFFF}
.mail span{color:var(--mist)}
.contact-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px}
.contact-row p{color:var(--frost);max-width:28rem}

.site-foot{padding-block:40px 56px;border-top:1px solid var(--hair)}
.foot-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;font:400 .75rem/1.5 var(--mono);color:var(--mist)}
.foot-row ul{display:flex;flex-wrap:wrap;gap:8px 24px;list-style:none;padding:0}

/* ---------- 404 ---------- */
.lost{min-height:100dvh;display:grid;align-content:center;justify-items:start;gap:32px;padding-block:96px}
.lost h1{font-size:clamp(2.5rem,7vw,5.5rem);line-height:.98;letter-spacing:-.045em}

/* ---------- Motion ---------- */
.rise{animation:rise 1100ms var(--ease) both}
.d0{animation-delay:120ms}.d1{animation-delay:210ms}.d2{animation-delay:300ms}.d3{animation-delay:390ms}.d4{animation-delay:480ms}
@keyframes rise{from{opacity:0;transform:translateY(28px);filter:blur(10px)}}
@supports (animation-timeline:view()){
  .reveal{animation:drift both var(--ease);animation-timeline:view();animation-range:entry 0% entry 55%}
  @keyframes drift{from{transform:translateY(64px) scale(.985)}to{transform:none}}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rise,.reveal,.live i{animation:none!important}
  .overlay a{transition:none}
}

/* ---------- Small screens ---------- */
@media (max-width:860px){
  .nav-links,.nav-cta{display:none}
  .burger{display:block}
  .nav{padding-left:16px}
  .hero-copy,.sky,.sec-head > div,.sec-head p,.bento > :nth-child(n){grid-column:1 / -1}
  .sec-head{gap:20px}
  .card{min-height:0}
  .up .core{min-height:420px}
}
