/* ---------- Tokens ---------- */
  :root{
    --rod:#C8102E;
    --rod-dyp:#9E0D24;
    --mork:#0E151B;
    --mork-2:#16212A;
    --lys:#EDF1F4;
    --hvit:#FFFFFF;
    --basseng:#2E9BC6;
    --gull:#F2D043;
    --solv:#C6CFD6;
    --bronse:#CE8D5B;
    --tekst:#1B262E;
    --tekst-demp:#5A6B76;
    --tekst-lys:#E8EEF2;
    --tekst-lys-demp:#93A4AF;
    --maks:1120px;
    --display:'Bahnschrift Cond','Arial Narrow','Helvetica Neue',Arial,sans-serif;
    --brodtekst:'Bahnschrift Semi',system-ui,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  }
  @font-face{
    font-family:'Bahnschrift Cond';
    src:url('fonts/bahnschrift-cond-bold.woff2') format('woff2');
    font-weight:700; font-style:normal; font-display:swap;
  }
  @font-face{
    font-family:'Bahnschrift Semi';
    src:url('fonts/bahnschrift-semicond-medium.woff2') format('woff2');
    font-weight:500; font-style:normal; font-display:swap;
  }

  /* ---------- Base ---------- */
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{transition:none !important;animation:none !important} }
  body{
    font-family:var(--brodtekst);
    color:var(--tekst);
    background:var(--lys);
    line-height:1.6;
    font-size:1.0625rem;
  }
  img{max-width:100%;display:block}
  a{color:inherit}
  h1,h2,h3{font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:1.02;text-wrap:balance}
  .wrap{max-width:var(--maks);margin:0 auto;padding:0 24px}
  .eyebrow{
    font-family:var(--display);text-transform:uppercase;letter-spacing:.22em;
    font-size:.8rem;color:var(--rod);
  }
  section{padding:88px 0}

  /* Goal-frame heading motif: red frame open at the bottom, like a polo goal */
  .goal-heading{
    display:inline-block;position:relative;
    padding:18px 26px 0 26px;margin-bottom:28px;
  }
  .goal-heading::before{
    content:"";position:absolute;inset:0;
    border:4px solid var(--rod);border-bottom:none;
  }
  .goal-heading h2{font-size:clamp(2.2rem,5vw,3.4rem)}

  /* ---------- Nav ---------- */
  header.nav{
    position:sticky;top:0;z-index:50;
    background:rgba(14,21,27,.92);backdrop-filter:blur(8px);
    color:var(--tekst-lys);
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .nav-inner{
    max-width:var(--maks);margin:0 auto;padding:10px 24px;
    display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  }
  .brand{display:flex;align-items:center;gap:12px;text-decoration:none}
  .brand img{width:42px;height:42px;flex:none}
  .brand span{
    font-family:var(--display);text-transform:uppercase;
    letter-spacing:.06em;font-size:1.15rem;white-space:nowrap;
  }
  nav.menu{margin-left:auto;display:flex;align-items:center;gap:4px;flex-wrap:wrap}
  nav.menu a{
    text-decoration:none;font-family:var(--display);text-transform:uppercase;
    letter-spacing:.08em;font-size:.92rem;color:var(--tekst-lys-demp);
    padding:8px 12px;
  }
  nav.menu a:hover,nav.menu a:focus-visible{color:var(--hvit)}
  nav.menu a:focus-visible{outline:2px solid var(--basseng);outline-offset:2px}
  .btn{
    display:inline-block;text-decoration:none;
    font-family:var(--display);text-transform:uppercase;letter-spacing:.08em;
    padding:12px 26px;border:2px solid var(--rod);
    background:var(--rod);color:var(--hvit);
    transition:background .15s,border-color .15s;
  }
  .btn:hover,.btn:focus-visible{background:var(--rod-dyp);border-color:var(--rod-dyp)}
  .btn:focus-visible{outline:2px solid var(--basseng);outline-offset:3px}
  .btn.ghost{background:transparent;color:var(--hvit);border-color:rgba(255,255,255,.65)}
  .btn.ghost:hover,.btn.ghost:focus-visible{border-color:var(--hvit);background:rgba(255,255,255,.08)}
  nav.menu .btn{padding:9px 18px;font-size:.92rem}

  /* ---------- Hero ---------- */
  .hero{
    position:relative;min-height:92vh;
    display:flex;align-items:flex-end;
    color:var(--hvit);
    background:var(--mork) url('img/hero_polo_ball.jpg') center 30%/cover no-repeat;
  }
  .hero::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(14,21,27,.25) 0%,rgba(14,21,27,.05) 40%,rgba(14,21,27,.82) 100%);
  }
  .hero-inner{position:relative;z-index:1;max-width:var(--maks);margin:0 auto;padding:120px 24px 72px;width:100%}
  .hero .eyebrow{color:var(--hvit);opacity:.95;margin-bottom:10px;text-shadow:0 1px 10px rgba(0,0,0,.75)}
  .hero h1{
    font-size:clamp(3.4rem,11vw,8rem);
    letter-spacing:.01em;
    text-shadow:0 2px 24px rgba(0,0,0,.35);
  }
  .hero h1 .accent{color:var(--rod)}
  .hero p.lead{
    max-width:34em;margin:18px 0 30px;font-size:1.15rem;color:var(--tekst-lys);
  }
  .hero-cta{display:flex;gap:14px;flex-wrap:wrap}

  /* ---------- Medal scoreboard ---------- */
  .tavle{background:var(--mork);color:var(--tekst-lys);padding:34px 0}
  .tavle-inner{
    max-width:var(--maks);margin:0 auto;padding:0 24px;
    display:grid;grid-template-columns:auto 1fr;gap:8px 48px;align-items:center;
  }
  .tavle .label{
    font-family:var(--display);text-transform:uppercase;letter-spacing:.18em;
    color:var(--tekst-lys-demp);font-size:.85rem;
  }
  .tavle ul{
    list-style:none;display:flex;gap:36px;flex-wrap:wrap;
    font-family:var(--display);text-transform:uppercase;letter-spacing:.04em;
    font-variant-numeric:tabular-nums;
  }
  .tavle li{display:flex;align-items:baseline;gap:10px;font-size:1.3rem}
  .tavle li .aar{color:var(--tekst-lys-demp);font-size:1rem}
  .tavle li .valor{color:var(--hvit)}
  .tavle li .valor.gull{color:var(--gull)}
  .tavle li .valor.solv{color:var(--solv)}
  .tavle li .valor.bronse{color:var(--bronse)}
  .tavle li.neste .valor{color:var(--rod)}
  @media (max-width:720px){.tavle-inner{grid-template-columns:1fr}}

  /* ---------- Polo section ---------- */
  .to-kol{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
  @media (max-width:860px){.to-kol{grid-template-columns:1fr}}
  .fakta{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
  .fakta span{
    font-family:var(--display);text-transform:uppercase;letter-spacing:.06em;
    border:2px solid var(--tekst);padding:6px 14px;font-size:.95rem;white-space:nowrap;
  }
  .polo-bilder{display:grid;gap:14px}
  .polo-bilder img,.polo-bilder video{width:100%;height:auto;display:block}
  .bildetekst{font-size:.85rem;color:var(--tekst-demp);margin-top:6px}
  .mork .bildetekst{color:var(--tekst-lys-demp)}
  p + p{margin-top:1em}

  /* ---------- Section grounds ---------- */
  .hvit{background:var(--hvit)}
  .mork{background:var(--mork);color:var(--tekst-lys)}
  .mork .goal-heading::before{border-color:var(--rod)}
  .mork .eyebrow{color:var(--basseng)}

  /* ---------- Training cards ---------- */
  .treninger{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:12px}
  @media (max-width:860px){.treninger{grid-template-columns:1fr}}
  .trening-kort{
    background:var(--mork-2);border:1px solid rgba(255,255,255,.09);
    padding:26px 24px 24px;display:flex;flex-direction:column;gap:8px;
  }
  .trening-kort .naar{
    font-family:var(--display);text-transform:uppercase;font-size:1.5rem;letter-spacing:.02em;
  }
  .trening-kort .hvor{color:var(--basseng);font-family:var(--display);text-transform:uppercase;letter-spacing:.1em;font-size:.85rem}
  .trening-kort p{color:var(--tekst-lys-demp);font-size:.98rem}
  .trening-note{margin-top:26px;max-width:46em;color:var(--tekst-lys-demp)}
  .trening-note strong{color:var(--tekst-lys)}

  /* ---------- Klubben ---------- */
  .gjengen{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
  @media (max-width:860px){.gjengen{grid-template-columns:1fr}}
  .person{background:var(--hvit);border:1px solid #d8dee3}
  .person img{width:100%;aspect-ratio:1/1;object-fit:cover}
  .person .info{padding:14px 16px 16px}
  .person .navn{font-family:var(--display);text-transform:uppercase;font-size:1.2rem}
  .person .rolle{color:var(--rod);font-family:var(--display);text-transform:uppercase;letter-spacing:.1em;font-size:.8rem}

  /* ---------- Documents and prices ---------- */
  .dokumenter{margin-top:28px;border:1px solid #d8dee3;background:var(--hvit);padding:20px 22px}
  .dokumenter .hva{font-family:var(--display);text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;color:var(--rod);margin-bottom:8px}
  .dokumenter ul{list-style:none;display:grid;gap:6px}
  .dokumenter a{color:var(--tekst)}
  .dokumenter p.note{font-size:.9rem;color:var(--tekst-demp);margin-top:8px}
  .kontingent{margin-top:26px}
  .kontingent .hva{font-family:var(--display);text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;color:var(--tekst-lys-demp);margin-bottom:6px}
  .kontingent ul{list-style:none;max-width:300px;display:grid;gap:2px}
  .kontingent li{display:flex;justify-content:space-between;gap:20px;border-bottom:1px dashed rgba(255,255,255,.18);padding:5px 0;font-variant-numeric:tabular-nums}
  .kontakt-grid .btn{margin-top:24px}

  /* ---------- Gallery ---------- */
  .galleri-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
  @media (max-width:860px){.galleri-grid{grid-template-columns:repeat(2,1fr)}}
  @media (max-width:560px){.galleri-grid{grid-template-columns:1fr}}
  .galleri-grid button{
    border:0;padding:0;cursor:pointer;background:none;display:block;position:relative;
  }
  .galleri-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:filter .15s}
  .galleri-grid button:hover img,.galleri-grid button:focus-visible img{filter:brightness(1.08)}
  .galleri-grid button:focus-visible{outline:3px solid var(--basseng);outline-offset:2px}
  dialog.lys-boks{
    border:0;padding:0;background:transparent;
    width:100%;height:100dvh;max-width:100%;max-height:100dvh;overflow:hidden;
  }
  dialog.lys-boks::backdrop{background:rgba(10,16,21,.94)}
  .lb-scene{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;cursor:zoom-out}
  .lb-scene img{max-width:min(1200px,92vw);max-height:80dvh;width:auto;height:auto;cursor:default;box-shadow:0 12px 60px rgba(0,0,0,.6)}
  .lb-meta{color:var(--tekst-lys);display:flex;gap:16px;align-items:baseline;font-size:.95rem;cursor:default}
  .lb-teller{color:var(--tekst-lys-demp);font-family:var(--display);font-variant-numeric:tabular-nums;letter-spacing:.08em}
  .lb-knapp{
    position:fixed;width:52px;height:52px;border-radius:50%;
    border:2px solid rgba(255,255,255,.45);background:rgba(14,21,27,.55);color:#fff;
    font-size:1.7rem;line-height:1;cursor:pointer;
    display:flex;align-items:center;justify-content:center;padding:0 0 4px;
  }
  .lb-knapp:hover,.lb-knapp:focus-visible{border-color:#fff;background:rgba(14,21,27,.85)}
  .lb-knapp:focus-visible{outline:2px solid var(--basseng);outline-offset:2px}
  .lb-forrige{left:20px;top:50%;transform:translateY(-50%)}
  .lb-neste{right:20px;top:50%;transform:translateY(-50%)}
  .lb-lukk{top:18px;right:20px}
  @media (max-width:640px){
    .lb-knapp{width:44px;height:44px;font-size:1.4rem}
    .lb-forrige{left:8px}.lb-neste{right:8px}.lb-lukk{right:8px}
  }

  /* ---------- Kontakt ---------- */
  .kontakt-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
  @media (max-width:720px){.kontakt-grid{grid-template-columns:1fr}}
  .kontakt-punkt{margin-bottom:18px}
  .kontakt-punkt .hva{font-family:var(--display);text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;color:var(--tekst-lys-demp)}
  .kontakt-punkt a{color:var(--hvit)}

  /* ---------- Footer ---------- */
  footer{background:#0A1015;color:var(--tekst-lys-demp);padding:40px 0;font-size:.9rem}
  .footer-inner{max-width:var(--maks);margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
  .footer-inner img{width:64px;height:64px}
  .footer-inner .spacer{margin-left:auto;text-align:right}
  .footer-lenker{display:flex;gap:6px 18px;flex-wrap:wrap;max-width:340px}
  .footer-lenker a{color:var(--tekst-lys-demp);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.2)}
  .footer-lenker a:hover,.footer-lenker a:focus-visible{color:var(--hvit)}

  /* ---------- Subpage (klubbinfo) ---------- */
  .side-hode{background:var(--mork);color:var(--tekst-lys);padding:64px 0 48px}
  .side-hode .eyebrow{color:var(--basseng);margin-bottom:8px}
  .side-hode h1{font-size:clamp(2.6rem,6vw,4rem)}
  .side-hode p.lead{max-width:38em;margin-top:14px;color:var(--tekst-lys-demp)}
  .styre-liste{list-style:none;display:grid;gap:16px;max-width:36em}
  .styre-liste .rolle{font-family:var(--display);text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;color:var(--rod)}
  .styre-liste a{color:var(--tekst)}
  .kontingent.lys .hva{color:var(--tekst-demp)}
  .kontingent.lys li{border-bottom-color:rgba(27,38,46,.25)}
  .nav .menu a.aktiv{color:var(--hvit)}
  .regel-liste{list-style:disc;padding-left:1.3em;display:grid;gap:10px;max-width:40em}
  .regel-liste a{color:var(--tekst)}