/* ARMS website — design direction from the approved sample pages (version 2):
   charcoal, green, Schibsted Grotesk headlines, photo heroes, rounded cards, route-line signature, restrained motion. */
:root{--charcoal:#1f2321;--ink:#121513;--slate:#2b302c;--green:#1d7a4f;--green-dk:#145c3a;--green-lt:#6fd19b;--mint:#9fd4b5;--grey:#4d544f;--muted:#c6ccc7;--rule:#cfd4ce;--panel:#f2f3ef;--white:#ffffff;
--head:"Schibsted Grotesk","Public Sans",system-ui,sans-serif;--body:"Public Sans",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace;
--gutter:max(24px,calc((100% - 1200px)/2));--eo:cubic-bezier(0.23,1,0.32,1);--eio:cubic-bezier(0.77,0,0.175,1);--ease:var(--eo)}
*{box-sizing:border-box}
html{scroll-padding-top:90px}
body{margin:0;background:var(--white);color:var(--charcoal);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--green)}a:hover{color:var(--green-dk)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--green-lt);outline-offset:3px}
.skip{position:absolute;left:-9999px;top:12px;z-index:60;background:var(--white);color:var(--charcoal);padding:10px 16px;border-radius:6px;font-weight:600}
.skip:focus{left:16px}
.pg{width:100%;display:flex;flex-direction:column;min-height:100vh}
.wfbar,.note{display:none!important}

/* Navigation (dark) */
.nav{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px var(--gutter);background:var(--charcoal);border-bottom:1px solid #343a36}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img{height:32px;width:auto;min-width:110px}
.navl{display:flex;gap:30px;align-items:center;font-size:15px}
.navl a{color:#cdd3ce;text-decoration:none}
.navl a:hover{color:var(--white)}
.nav .row{gap:10px}
.nav .btn,.nav .btn2{min-height:44px;padding:0 18px;font-size:15px}

/* Sections */
.sec{padding:104px var(--gutter);display:flex;flex-direction:column;gap:28px;background:var(--white)}
.alt{background:var(--panel)}
.sec>*{max-width:1200px}

/* Hero cover: dark, with the page photo behind a left-weighted shade when there is one */
.cover{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 85% 20%,#1c3b2d 0%,var(--ink) 58%);color:#f2f3ef;padding-top:120px;padding-bottom:140px}
.cover.has-img{background-image:linear-gradient(90deg,rgba(18,21,19,0.93) 0%,rgba(18,21,19,0.72) 40%,rgba(18,21,19,0.2) 75%,rgba(18,21,19,0.35) 100%),var(--hero);background-size:cover;background-position:center;min-height:640px;justify-content:center}
.cover>*:not(.route){position:relative;z-index:1}
.cover .p,.cover .sm,.cover .proof,.cover p{color:var(--muted)}
.cover .h1,.cover .h2,.cover .h3{color:#f2f3ef}
.cover a:not(.btn):not(.btn2):not(.card){color:var(--mint)}
.cover .card{background:rgba(20,24,22,0.86);border:1px solid rgba(255,255,255,0.14);color:#f2f3ef;border-radius:12px;padding:20px 22px}
.cover .card .h3,.cover .card .h2,.cover .card .h1{color:#f2f3ef}
.cover .card .sm,.cover .card p{color:#aeb6b0}
.cover .card:hover{transform:none;box-shadow:none}
.cover input{background:var(--white)}
.cover .ph.report{box-shadow:0 24px 50px rgba(0,0,0,0.45)}
.route{position:absolute;left:0;right:0;bottom:0;width:100%;height:auto;pointer-events:none;z-index:0}
.route .line{animation:draw 2400ms var(--eio) forwards;animation-delay:700ms}
.route .node{transform-box:fill-box;transform-origin:center;animation:nodeIn 420ms var(--eo) both}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes nodeIn{from{opacity:0;transform:scale(0.5)}to{opacity:1;transform:none}}

/* Type */
.h1,.h2{font-family:var(--head);font-weight:800;letter-spacing:-0.02em;margin:0}
.h1{font-size:clamp(40px,5.6vw,76px);line-height:1.0;max-width:880px;animation:rise 800ms var(--eo) 100ms both}
.h2{font-size:clamp(30px,3.4vw,46px);line-height:1.06;max-width:900px}
.h3{font-family:var(--head);font-weight:700;font-size:22px;line-height:1.25;margin:0}
.h1,.h2,.h3{overflow-wrap:break-word;hyphens:auto}
.h1[style*="font-size"]{font-size:clamp(38px,5.6vw,76px)!important}
@keyframes rise{from{opacity:0;transform:translateY(16px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.cover .p{animation:rise 700ms var(--eo) 350ms both}
.cover .row{animation:rise 700ms var(--eo) 480ms both}
.p{font-size:19px;line-height:1.6;color:var(--grey);margin:0;max-width:720px}
.sm{font-size:16px;line-height:1.6;color:var(--grey);margin:0}
.proof{font-family:var(--mono);font-size:14px;color:var(--grey);margin:0}
.label{font-family:var(--mono);font-size:13px;letter-spacing:0.06em;text-transform:uppercase;color:var(--green);margin:0}
.mono,.num{font-family:var(--mono)}
.quote{font-family:var(--head);font-weight:700;font-size:clamp(24px,2.6vw,36px);line-height:1.25;margin:0;max-width:980px}

/* Buttons */
.btn,.btn2{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;font-weight:600;font-size:16px;text-decoration:none;border-radius:6px;border:1px solid transparent;white-space:nowrap;transition:transform 160ms var(--eo),background-color 200ms ease,border-color 200ms ease,color 200ms ease}
.btn{background:var(--green);color:var(--white)}
.btn:hover{background:var(--green-dk);color:var(--white)}
.btn2{background:transparent;color:var(--charcoal);border-color:var(--charcoal)}
.btn2:hover{background:var(--charcoal);color:var(--white)}
.cover .btn2,.nav .btn2,.foot .btn2{color:#f2f3ef;border-color:#6d766f}
.cover .btn2:hover,.nav .btn2:hover{border-color:#f2f3ef;background:transparent;color:var(--white)}
.btn:active,.btn2:active{transform:scale(0.97)}
.lnk{font-weight:600;color:var(--green);text-decoration:none}
.lnk:hover{text-decoration:underline}
.row{display:flex;gap:14px;align-items:center;flex-wrap:wrap}

/* Grids and cards */
.g2,.g3,.g4,.g5,.split{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.split{grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;align-items:center}
.split>*,.g2>*,.g3>*,.g4>*,.g5>*{min-width:0}
.card{background:var(--white);border:1px solid var(--rule);border-radius:10px;padding:26px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--charcoal);overflow:hidden;transition:border-color 200ms ease,transform 240ms var(--eo),box-shadow 240ms var(--eo)}
a.card:hover{border-color:var(--green);transform:translateY(-3px);box-shadow:0 14px 30px rgba(31,35,33,0.12);color:var(--charcoal)}
.card img{width:calc(100% + 52px);max-width:none;margin:-26px -26px 12px;aspect-ratio:16/10;object-fit:cover;transition:transform 600ms var(--eo)}
a.card:hover img{transform:scale(1.03)}

@media (min-width: 1001px){.g5:has(>:nth-child(6)):not(:has(>:nth-child(7))){grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Steps */
.g4,.g3,.g5{counter-reset:step}
.step{display:flex;flex-direction:column;gap:10px;border-top:2px solid var(--green);padding-top:18px;counter-increment:step}
.step::before{content:counter(step,decimal-leading-zero);font-family:var(--mono);font-size:14px;color:var(--green)}
.cover .step{border-top-color:var(--green-lt)}.cover .step::before{color:var(--green-lt)}

ul{padding-left:20px;margin:0}
ul li{margin:6px 0}

/* Tables */
.tbl{display:flex;flex-direction:column;border:1px solid var(--rule);border-radius:10px;background:var(--white);overflow:hidden}
.tr{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:14px 20px;border-bottom:1px solid #e3e6e1;font-size:15px}
.th{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:0.04em;color:var(--grey);background:var(--panel)}
.flag{font-weight:700;color:#a4342a}

/* Images and document panels */
.band{margin:0;padding:0 var(--gutter);background:var(--white)}
.band img{width:100%;max-width:1200px;height:clamp(240px,34vw,460px);object-fit:cover;margin:0 auto;border-radius:12px}
.band.shot{background:var(--panel);padding-top:64px;padding-bottom:64px}
.band.shot img{height:auto;object-fit:contain;border:1px solid var(--rule);background:var(--white);border-radius:12px}
.band figcaption{max-width:1200px;margin:14px auto 0;font-family:var(--mono);font-size:13px;color:var(--grey)}
.screens{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;max-width:1200px;margin:0 auto}
.screens img{width:100%;border:9px solid #0b0e0c;border-radius:30px;background:#0b0e0c;box-shadow:0 24px 50px rgba(0,0,0,0.25)}
.ph{background:var(--panel);border:1px solid var(--rule);border-radius:12px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:6px;padding:24px;font-size:15px;color:var(--grey);min-height:160px;overflow:hidden}
.ph.doc{background:radial-gradient(120% 90% at 85% 10%,#1c3b2d 0%,var(--ink) 60%);color:var(--muted);border:0;justify-content:space-between;min-height:220px}
.ph.doc .doclabel{font-family:var(--mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--green-lt)}
.ph.doc .doctitle{font-family:var(--head);font-weight:800;color:#f2f3ef;font-size:22px;line-height:1.1}
.ph img{width:100%;height:100%;object-fit:cover}
.ph.img{padding:0;border:0;background:none;min-height:0}
.ph.report{padding:0;background:var(--white);border:1px solid var(--rule)}
.ph.report img{object-fit:contain;object-position:top}
.ph.blank{background:none;border:0}
.initials{display:flex;align-items:center;justify-content:center;background:var(--charcoal);color:#f2f3ef;font-family:var(--head);font-weight:800;font-size:44px;aspect-ratio:1/1;max-width:220px;border-radius:12px;margin-bottom:6px}
.fallback{display:flex;flex-direction:column;gap:14px;background:var(--white);border:1px solid var(--rule);border-radius:12px;padding:28px}
.cover .fallback{background:rgba(20,24,22,0.86);border-color:rgba(255,255,255,0.14)}

label{font-size:14px;font-weight:600}
input,select{height:52px;border:1px solid #8c958e;border-radius:6px;padding:0 14px;font-size:16px;font-family:inherit;background:var(--white);width:100%;color:var(--charcoal)}

/* Footer */
.foot{margin-top:auto;padding:72px var(--gutter) 48px;background:var(--charcoal);color:var(--muted);display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:28px;font-size:15px;border-top:1px solid #343a36}
.foot div{display:flex;flex-direction:column;gap:9px}
.foot strong{color:#f2f3ef;font-weight:600;margin-bottom:4px}
.foot a{color:var(--muted);text-decoration:none}
.foot a:hover{color:var(--white)}
.footbrand{grid-column:1/-1;display:flex!important;flex-direction:row!important;justify-content:space-between;align-items:center;border-top:1px solid #343a36;padding-top:24px;margin-top:12px;flex-wrap:wrap;gap:12px}
.footbrand img{height:28px;width:auto}
.footbrand span{font-family:var(--mono);font-size:12px;color:#8c958e}

.article{max-width:720px}
.article h2{font-family:var(--head);font-weight:800;font-size:28px;line-height:1.15;margin:40px 0 10px}
.article p,.article li{font-size:18px;line-height:1.7;color:#3b3f3c}

/* Responsive */
@media (max-width: 1000px){
  .nav{flex-wrap:wrap;padding:12px 20px;gap:10px}
  .navl{order:3;flex:1 1 100%;min-width:0;max-width:100%;overflow-x:auto;gap:20px;padding:6px 0 2px;white-space:nowrap;-webkit-overflow-scrolling:touch}
  .nav .btn2{display:none}

  .g4,.g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split{grid-template-columns:1fr;gap:40px}
  .foot{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .screens{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 760px){
  body{font-size:16px}
  .logo img{height:28px;min-width:98px}
  .sec{padding:64px 20px;gap:22px}
  .cover{padding-top:72px;padding-bottom:72px}
  .g2,.g3,.g4,.g5{grid-template-columns:1fr}
  .tr{grid-template-columns:1fr 1fr;row-gap:4px}
  .th{display:none}
  .foot{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:48px 20px 36px}
  .foot a,.footbrand span{overflow-wrap:anywhere}
  .band{padding:0 20px}
  .row .btn,.row .btn2{flex:1 1 100%}
  [style*="position:absolute"]{position:static!important}
  .card[style*="flex-direction:row"]{flex-direction:column!important;align-items:flex-start!important}
  .card>*{min-width:0;max-width:100%}
  .sec [style*="display:flex"]{flex-wrap:wrap}
  .sec [style*="width:"]:not(img){max-width:100%}
  .ph.doc{width:100%!important}
  [style*="height:500px"],[style*="height: 500px"]{height:auto!important}
}
@media (max-width: 400px){.h1{font-size:34px}.h2{font-size:26px}.tr{grid-template-columns:1fr}.sec [style*="grid-template-columns"]{grid-template-columns:1fr!important}.sec [style*="white-space:nowrap"]{white-space:normal!important}.btn,.btn2{white-space:normal;text-align:center;padding:12px 18px}}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}.route .line{stroke-dashoffset:0!important}}