/* ============================================================
   LEIELINK CALVIA-C — "Refined Nordic"
   ------------------------------------------------------------
   Sidebar + branding for C-design. Separat fra leielink-calvia.css
   for å ikke bryte eksisterende innloggede sider.

   Aktiveres ved at fila linkes inn i HEAD på pub-sider:
     <link rel="stylesheet" href="/css/leielink-calvia-c.css">

   Påvirker kun elementer med .ll-* prefiks, så ingen kollisjon
   med eksisterende leielink.css eller leielink-calvia.css.

   Z-index-stack (sidebar-relatert):
     250  .ll-brand-top — logo, alltid skarp
     201  .ll-pub-sidebar — over overlay
     150  .ll-sidebar-overlay — blur bakgrunnen
   ============================================================ */

/* ─── ROOT VARIABLER ──────────────────────────────────────── */
:root{
  --llc-bg-deep:    #0a1929;
  --llc-bg-deeper:  #06111c;
  --llc-bg-soft:    #11243a;
  --llc-ink:        #f4ede0;
  --llc-ink-dim:    rgba(244,237,224,.72);
  --llc-ink-faint:  rgba(244,237,224,.45);
  --llc-sand:       #d5c28f;
  --llc-sand-soft:  #b8a574;
  --llc-line:       rgba(213,194,143,.15);
  --llc-line-strong:rgba(213,194,143,.3);
  --llc-sidebar-w:  230px;
}

/* ─── FONT-IMPORTS ────────────────────────────────────────── */
/* Last via <link> i HEAD for raskere render — disse er fallback */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,400;1,500&family=Manrope:wght@300;400;500;600&display=swap');

/* ─── FRI-SVEVENDE LOGO ───────────────────────────────────── */
.ll-brand-top{
  position:fixed;
  top:42px;
  left:32px;
  z-index:250; /* OVER overlay (150) og sidebar (201) — aldri blurret */
  transition:opacity .35s ease, transform .35s ease;
}
.ll-brand-top a{
  display:block;
  text-decoration:none;
  transition:transform .35s cubic-bezier(.2,.7,.2,1);
}
.ll-brand-top a:hover{transform:translateY(-1px)}
.ll-brand-img{
  height:36px;
  width:auto;
  max-width:calc(var(--llc-sidebar-w) - 48px);
  display:block;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.6));
}

/* ─── SIDEBAR (desktop) ───────────────────────────────────── */
.ll-pub-sidebar{
  position:fixed;
  top:0; left:0; bottom:0;
  width:var(--llc-sidebar-w);
  /* Gradient: gjennomsiktig topp som slipper hero-bildet igjennom */
  background:linear-gradient(180deg,
    rgba(6,17,28,0)    0px,
    rgba(6,17,28,0)    100px,
    rgba(6,17,28,.88)  180px,
    rgba(6,17,28,.92)  100%);
  z-index:201;
  display:flex;
  flex-direction:column;
  padding-top:150px;
  transition:left .35s cubic-bezier(.2,.7,.2,1);
  font-family:'Manrope', sans-serif;
}
/* Gull-streken på høyre kant: fader inn fra topp, solid resten */
.ll-pub-sidebar::after{
  content:"";
  position:absolute;
  top:0; right:0; bottom:0;
  width:1px;
  background:linear-gradient(180deg,
    rgba(213,194,143,0)   0px,
    rgba(213,194,143,0)   100px,
    rgba(213,194,143,.2)  180px,
    rgba(213,194,143,.2)  100%);
  pointer-events:none;
}

/* ─── SIDEBAR SEKSJONSTITLER ──────────────────────────────── */
.ll-sb-section{
  padding:24px 24px 10px;
  font-size:10px;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--llc-ink-faint);
  font-family:'Manrope',sans-serif;
  font-weight:500;
}
.ll-sb-section:first-of-type{padding-top:0}

/* ─── SIDEBAR NAV ─────────────────────────────────────────── */
.ll-sb-nav{
  list-style:none;
  padding:0 12px;
  margin:0;
}
.ll-sb-nav li{margin:0}
.ll-sb-nav a{
  display:flex;
  align-items:center;
  gap:14px;
  padding:6px 14px;
  font-size:13px;
  color:var(--llc-ink-dim);
  border-radius:2px;
  position:relative;
  transition:all .25s;
  text-decoration:none;
  font-family:'Manrope',sans-serif;
}
.ll-sb-nav a:hover{
  color:var(--llc-ink);
  background:rgba(213,194,143,.04);
}
.ll-sb-nav a.active{
  color:var(--llc-sand);
  background:rgba(213,194,143,.07);
}
.ll-sb-nav a.active::before{
  content:"";
  position:absolute;
  left:0; top:25%; bottom:25%;
  width:2px;
  background:var(--llc-sand);
}
.ll-sb-nav svg{
  width:15px;
  height:15px;
  flex-shrink:0;
}

/* ─── SIDEBAR BUNN: språk + theme + Aa ───────────────────── */
.ll-sb-bottom{
  margin-top:auto;
  padding:20px 24px 28px;
  border-top:1px solid var(--llc-line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

/* Theme-toggle (diskret, mellom språk og Aa) */
.ll-sb-theme{
  width:32px; height:32px;
  flex-shrink:0;
  aspect-ratio:1;
  border-radius:50%;
  background:rgba(213,194,143,.06);
  border:1px solid var(--llc-line);
  cursor:pointer;
  color:var(--llc-ink-dim);
  display:grid;
  place-items:center;
  padding:0;
  transition:all .25s;
}
.ll-sb-theme:hover{
  background:rgba(213,194,143,.12);
  color:var(--llc-sand);
  border-color:var(--llc-line-strong);
}
.ll-sb-theme svg{width:14px;height:14px}

/* Aa-knapp (gull, italic Cormorant — som skissen) */
.ll-sb-a11y{
  width:32px; height:32px;
  flex-shrink:0;
  aspect-ratio:1;
  border-radius:50%;
  background:linear-gradient(145deg, var(--llc-sand), var(--llc-sand-soft));
  border:1px solid transparent;
  cursor:pointer;
  color:#0a1929;
  display:grid;
  place-items:center;
  font-family:'Cormorant Garamond', serif;
  font-style:italic;
  font-size:14px;
  font-weight:500;
  padding:0;
  transition:transform .25s;
  box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.ll-sb-a11y:hover{transform:rotate(-10deg)}

/* ─── OVERRIDE eksisterende sprakvelger til ny stil ──────── */
.ll-sb-bottom .sprakvelger--sidebar{
  position:relative !important;  /* For å posisjonere dropdown-menyen */
}
.ll-sb-bottom .sprakvelger-knapp{
  background:rgba(213,194,143,.06) !important;
  border:1px solid var(--llc-line) !important;
  border-radius:6px !important;
  padding:6px 10px !important;
  color:var(--llc-ink-dim) !important;
  font-size:11px !important;
  letter-spacing:.08em !important;
  cursor:pointer;
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  font-family:'Manrope',sans-serif !important;
  transition:all .2s !important;
}
.ll-sb-bottom .sprakvelger-knapp:hover{
  background:rgba(213,194,143,.12) !important;
  border-color:var(--llc-line-strong) !important;
  color:var(--llc-sand) !important;
}
.ll-sb-bottom .sprakvelger-flagg{
  font-size:14px !important;
  line-height:1 !important;
}
.ll-sb-bottom .sprakvelger-kode{
  color:var(--llc-ink) !important;
  font-weight:600 !important;
  font-size:11px !important;
}
.ll-sb-bottom .sprakvelger-pil{
  font-size:9px !important;
  opacity:.5 !important;
}

/* Dropdown-meny ── popper opp OVER (siden vi er nederst i sidebaren) */
.ll-sb-bottom .sprakvelger-meny--sidebar{
  position:absolute !important;
  bottom:calc(100% + 8px) !important;
  left:0 !important;
  right:auto !important;
  min-width:160px !important;
  background:var(--llc-bg-deeper) !important;
  border:1px solid var(--llc-line-strong) !important;
  border-radius:8px !important;
  list-style:none !important;
  padding:6px !important;
  margin:0 !important;
  box-shadow:0 -8px 24px rgba(0,0,0,.5) !important;
  z-index:210 !important;  /* Over sidebar selv */
}
.ll-sb-bottom .sprakvelger-meny--sidebar[hidden]{display:none !important}
.ll-sb-bottom .sprakvelger-element{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  width:100% !important;
  padding:8px 12px !important;
  background:none !important;
  border:none !important;
  border-radius:5px !important;
  font-size:13px !important;
  color:var(--llc-ink-dim) !important;
  cursor:pointer !important;
  text-align:left !important;
  font-family:'Manrope',sans-serif !important;
  transition:all .15s !important;
}
.ll-sb-bottom .sprakvelger-element:hover{
  background:rgba(213,194,143,.08) !important;
  color:var(--llc-ink) !important;
}
.ll-sb-bottom .sprakvelger-element.aktiv{
  color:var(--llc-sand) !important;
  background:rgba(213,194,143,.05) !important;
}
.ll-sb-bottom .sprakvelger-hake{
  margin-left:auto !important;
  color:var(--llc-sand) !important;
  font-weight:600 !important;
}

/* ─── MOBIL-OVERLAY (blur bak sidebar) ────────────────────── */
.ll-sidebar-overlay{
  display:none;
  position:fixed;
  inset:0;
  z-index:150;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  background:rgba(6,17,28,.4);
  opacity:0;
  visibility:hidden;
  transition:opacity .3s ease, visibility .3s ease;
  pointer-events:auto;
}
.ll-sidebar-overlay.active{
  opacity:1;
  visibility:visible;
}

/* ─── MOBIL-FLIK (åpne/lukke) ──────────────────────────────── */
.ll-sidebar-tab{
  display:none;
  position:absolute;
  right:-22px;
  top:50%;
  transform:translateY(-50%);
  width:22px;
  height:60px;
  background:linear-gradient(180deg, #0a1929, #06111c);
  border:1px solid var(--llc-line-strong);
  border-left:none;
  border-radius:0 10px 10px 0;
  align-items:center;
  justify-content:center;
  color:var(--llc-sand);
  font-size:18px;
  font-weight:600;
  cursor:pointer;
  z-index:201;
  box-shadow:3px 0 10px rgba(0,0,0,.35);
  transition:transform .25s;
  padding:0;
  font-family:'Cormorant Garamond', serif;
}
.ll-sidebar-tab:hover{
  transform:translateY(-50%) translateX(2px);
}
.ll-sidebar-tab-ch{
  display:inline-block;
  transition:transform .35s;
  transform:rotate(0deg);
}
.ll-pub-sidebar.open .ll-sidebar-tab-ch{
  transform:rotate(180deg);
}

/* ─── MOBILE OVERRIDES ────────────────────────────────────── */
@media (max-width: 900px){

  .ll-brand-top{
    top:36px;
    left:24px;
  }
  .ll-brand-img{
    height:30px;
  }

  .ll-pub-sidebar{
    left:calc(-1 * var(--llc-sidebar-w));
    padding-top:130px;
  }
  .ll-pub-sidebar.open{
    left:0;
  }

  .ll-sidebar-tab{
    display:flex;
  }
  .ll-sidebar-overlay{
    display:block;
  }
}

/* ─── SKJUL GAMMEL SIDEBAR-ELEMENTER (overskrivinger) ────── */
/* Disse er fra pre-Calvia oppsett som ikke skal vises
   sammen med ny .ll-pub-sidebar. Gjenta i ny .ll- klasse
   for å unngå at gammel og ny sidebar dukker opp samtidig. */
.ll-pub-sidebar + .sidebar:not(.ll-pub-sidebar),
.ll-pub-sidebar ~ .sidebar:not(.ll-pub-sidebar){
  display:none !important;
}

/* ─── REDUCED MOTION ─────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  .ll-pub-sidebar,
  .ll-sidebar-overlay,
  .ll-sb-theme,
  .ll-sb-a11y{
    transition:none !important;
  }
}

/* Dropdown-panelet positioneres relativt sidebar-Aa-knapp istedet */
#a11yDrop{
  left:auto !important;
  bottom:80px !important;
  right:24px !important;
}
@media (max-width:900px){
  #a11yDrop{
    bottom:90px !important;
    right:60px !important;
  }
}

/* FIX 2.1: Aa-dropdown skal være fixed-posisjonert
   ── Gamle .a11y-drop er position:absolute innenfor wrappen.
   Vi flytter den til fixed-position over hele viewporten
   slik at den vises uavhengig av wrap-en. */
#a11yDrop{
  position:fixed !important;
  bottom:80px !important;
  left:24px !important;       /* venstre — like under sidebar-Aa-knapp */
  right:auto !important;
  top:auto !important;
  width:300px !important;
  z-index:300 !important;     /* Over alt annet */
}

/* På mobil: høyresentrert, ikke kant-til-kant */
@media (max-width: 900px){
  #a11yDrop{
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:80px !important;
    width:calc(100vw - 32px) !important;
    max-width:320px !important;
  }
}

/* FIX 2.2: Skjul hamburger-meny — vi har gull-flikken på mobil */
.hamburger,
#hamburgerBtn,
.topbar-title,
.topbar-left{
  display:none !important;
}

/* Gjør hele den gamle topbaren mer transparent slik at den
   ikke konkurrerer visuelt med ny topbar.
   Behold tb-btn (Logg inn/Registrer) men style dem subtilt. */
.topbar{
  background:transparent !important;
  border-bottom:none !important;
  box-shadow:none !important;
  padding:24px 32px !important;
}
.topbar-right{
  margin-left:auto;
}


/* ─── PAGE FOOTER — links-rad (Personvern · Vilkår · Cookies) ─── */
.page-footer{
  padding:24px 32px 28px !important;
  border-top:1px solid var(--llc-line) !important;
  background:transparent !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:12px !important;
}
.page-footer-copy{
  font-size:11px !important;
  letter-spacing:.05em !important;
  color:var(--llc-ink-faint) !important;
  font-family:'Manrope',sans-serif !important;
  text-align:center !important;
}
.page-footer-links{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
  font-family:'Manrope',sans-serif;
}
.page-footer-links a,
.page-footer-links .page-footer-link{
  font-size:11px;
  letter-spacing:.04em;
  color:var(--llc-ink-faint);
  text-decoration:none;
  background:none;
  border:none;
  padding:4px 6px;
  cursor:pointer;
  font-family:'Manrope',sans-serif;
  transition:color .2s;
}
.page-footer-links a:hover,
.page-footer-links .page-footer-link:hover{
  color:var(--llc-sand);
}
.page-footer-sep{
  color:var(--llc-ink-faint);
  opacity:.4;
  font-size:11px;
  user-select:none;
}

/* Light tema-versjon */
.app.light .page-footer-copy,
.app.light .page-footer-links a,
.app.light .page-footer-links .page-footer-link{
  color:rgba(26,31,46,0.55);
}
.app.light .page-footer-links a:hover,
.app.light .page-footer-links .page-footer-link:hover{
  color:#8a6c1a;
}


/* ════════════════════════════════════════════════════════════
   FASE 2 — HERO / PROP / FEATURES (pub/index.ejs)
   ════════════════════════════════════════════════════════════ */

/* ─── HERO TOPBAR (Logg inn / Registrer, fixed) ─── */
.ll-hero-topbar{
  position:fixed;
  top:0;
  left:var(--llc-sidebar-w);
  right:0;
  z-index:15;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:14px;
  padding:24px 48px;
  pointer-events:none;  /* la klikk gå gjennom til hero */
}
.ll-hero-topbar > *{pointer-events:auto}
.ll-hero-topbar a{
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  padding:12px 22px;
  transition:all .3s;
  text-decoration:none;
  font-family:'Manrope',sans-serif;
  font-weight:500;
}
.ll-hero-topbar .ll-htb-login{
  color:var(--llc-ink);
  border:1px solid var(--llc-line-strong);
}
.ll-hero-topbar .ll-htb-login:hover{
  border-color:var(--llc-sand);
  color:var(--llc-sand);
}
.ll-hero-topbar .ll-htb-register{
  background:var(--llc-sand);
  color:#0a1929;
}
.ll-hero-topbar .ll-htb-register:hover{
  background:var(--llc-ink);
  transform:translateY(-1px);
}

/* ─── HERO ─── */
.ll-hero{
  position:relative;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:var(--llc-bg-deep);
  overflow:hidden;
}
.ll-hero-image{
  position:absolute;
  inset:0;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:0;
  transition:opacity 1.5s ease-in-out;
  z-index:0;
}
.ll-hero-image.is-active{opacity:1}

/* Overlay-gradient for tekst-lesbarhet */
.ll-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(95deg,
      rgba(6,17,28,.94) 0%,
      rgba(10,25,41,.85) 25%,
      rgba(10,25,41,.55) 55%,
      rgba(10,25,41,.20) 80%,
      rgba(10,25,41,.05) 100%),
    linear-gradient(180deg,
      rgba(6,17,28,0) 50%,
      rgba(6,17,28,.65) 100%);
}
/* Film grain via SVG noise */
.ll-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.95 0 0 0 0 0.9 0 0 0 0 0.8 0 0 0 0.06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity:.35;
  mix-blend-mode:overlay;
  pointer-events:none;
  z-index:2;
}

.ll-hero-inner{
  position:relative;
  z-index:5;
  padding:0 96px 0 calc(var(--llc-sidebar-w) + 80px);
  max-width:calc(1400px + var(--llc-sidebar-w));
}
.ll-eyebrow{
  font-size:11px;
  letter-spacing:.35em;
  text-transform:uppercase;
  color:var(--llc-sand);
  margin-bottom:32px;
  opacity:0;
  animation:llcFadeUp 1s .2s cubic-bezier(.2,.7,.2,1) forwards;
  font-family:'Manrope',sans-serif;
  font-weight:500;
}
.ll-eyebrow::before{
  content:"";
  display:inline-block;
  width:36px;
  height:1px;
  background:var(--llc-sand);
  vertical-align:middle;
  margin-right:18px;
  margin-bottom:3px;
}

.ll-hero h1{
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:clamp(48px,6.5vw,88px);
  line-height:1.02;
  letter-spacing:-.01em;
  margin-bottom:36px;
  max-width:780px;
  opacity:0;
  animation:llcFadeUp 1.1s .4s cubic-bezier(.2,.7,.2,1) forwards;
  color:var(--llc-ink);
}
.ll-hero h1 em{
  font-style:italic;
  font-weight:400;
  color:var(--llc-sand);
  display:block;
}

.ll-hero-lead{
  font-size:17px;
  line-height:1.65;
  color:var(--llc-ink-dim);
  max-width:540px;
  margin-bottom:48px;
  font-weight:300;
  opacity:0;
  animation:llcFadeUp 1.1s .6s cubic-bezier(.2,.7,.2,1) forwards;
  font-family:'Manrope',sans-serif;
}

.ll-cta-row{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  opacity:0;
  animation:llcFadeUp 1.1s .8s cubic-bezier(.2,.7,.2,1) forwards;
}
.ll-btn{
  display:inline-flex;
  align-items:center;
  gap:14px;
  padding:18px 32px;
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-weight:500;
  transition:all .35s cubic-bezier(.2,.7,.2,1);
  cursor:pointer;
  border:none;
  text-decoration:none;
  font-family:'Manrope',sans-serif;
}
.ll-btn-primary{
  background:var(--llc-sand);
  color:#0a1929;
}
.ll-btn-primary:hover{
  background:var(--llc-ink);
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(213,194,143,.25);
}
.ll-btn-ghost{
  background:transparent;
  color:var(--llc-ink);
  border:1px solid var(--llc-line-strong);
}
.ll-btn-ghost:hover{
  border-color:var(--llc-sand);
  color:var(--llc-sand);
}
.ll-arrow{
  width:18px;
  height:10px;
  position:relative;
  transition:transform .35s;
}
.ll-arrow::before{
  content:"";
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  height:1px;
  background:currentColor;
  transform:translateY(-50%);
}
.ll-arrow::after{
  content:"";
  position:absolute;
  top:50%;
  right:0;
  width:8px;
  height:8px;
  border-top:1px solid currentColor;
  border-right:1px solid currentColor;
  transform:translateY(-50%) rotate(45deg);
}
.ll-btn:hover .ll-arrow{transform:translateX(4px)}

/* ─── PROP-SEKSJON ─── */
.ll-prop{
  background:var(--llc-bg-deeper);
  padding:140px 96px 140px calc(var(--llc-sidebar-w) + 96px);
}
.ll-prop-inner{
  max-width:1300px;
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:96px;
  align-items:start;
}
.ll-prop-label{
  font-size:11px;
  letter-spacing:.35em;
  text-transform:uppercase;
  color:var(--llc-sand);
  font-family:'Manrope',sans-serif;
  font-weight:500;
}
.ll-prop-label::before{
  content:"";
  display:inline-block;
  width:24px;
  height:1px;
  background:var(--llc-sand);
  vertical-align:middle;
  margin-right:14px;
  margin-bottom:3px;
}
.ll-prop-title{
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:clamp(34px,4vw,54px);
  line-height:1.1;
  margin-top:28px;
  color:var(--llc-ink);
}
.ll-prop-title em{
  font-style:italic;
  color:var(--llc-sand);
}
.ll-prop-body p{
  font-size:16px;
  line-height:1.75;
  color:var(--llc-ink-dim);
  font-weight:300;
  margin-bottom:20px;
  font-family:'Manrope',sans-serif;
}

/* ─── FEATURES ─── */
.ll-features{
  background:var(--llc-bg-deep);
  padding:120px 96px 120px calc(var(--llc-sidebar-w) + 96px);
}
.ll-features-inner{
  max-width:1300px;
}

/* Try-free-boks (mellom prop og features) */
.ll-try-free{
  background:linear-gradient(135deg,
    rgba(213,194,143,.08) 0%,
    rgba(213,194,143,.03) 100%);
  border:1px solid var(--llc-line-strong);
  padding:28px 36px;
  margin-bottom:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  flex-wrap:wrap;
}
.ll-try-free-text{
  flex:1;
  min-width:240px;
}
.ll-try-free-title{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-weight:400;
  font-size:22px;
  color:var(--llc-sand);
  margin-bottom:6px;
}
.ll-try-free-sub{
  font-size:12px;
  color:var(--llc-ink-dim);
  letter-spacing:.05em;
  font-family:'Manrope',sans-serif;
}

.ll-features-header{
  display:flex;
  justify-content:space-between;
  align-items:end;
  margin-bottom:72px;
  padding-bottom:28px;
  border-bottom:1px solid var(--llc-line);
}
.ll-features-title{
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:clamp(30px,3.2vw,44px);
  line-height:1.1;
  max-width:560px;
  color:var(--llc-ink);
}
.ll-features-title em{
  font-style:italic;
  color:var(--llc-sand);
}
.ll-features-meta{
  font-size:11px;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--llc-ink-faint);
  font-family:'Manrope',sans-serif;
}

.ll-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--llc-line);
}
.ll-feature{
  background:var(--llc-bg-deep);
  padding:44px 32px;
  transition:background .4s;
}
.ll-feature:hover{
  background:var(--llc-bg-soft);
}
.ll-feature-num{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-size:14px;
  color:var(--llc-sand);
  margin-bottom:22px;
  letter-spacing:.05em;
}
.ll-feature-name{
  font-family:'Cormorant Garamond',serif;
  font-weight:400;
  font-size:24px;
  margin-bottom:14px;
  line-height:1.2;
  color:var(--llc-ink);
}
.ll-feature-desc{
  font-size:14px;
  line-height:1.6;
  color:var(--llc-ink-dim);
  font-weight:300;
  font-family:'Manrope',sans-serif;
}

/* ─── ANIMATIONS ─── */
@keyframes llcFadeUp{
  from{
    opacity:0;
    transform:translateY(24px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

/* ─── MOBILE ─── */
@media (max-width:900px){
  .ll-hero-topbar{
    left:0;
    padding:18px 20px;
  }
  .ll-hero-topbar a{
    padding:10px 14px;
    font-size:10px;
  }
  .ll-hero-inner{
    padding:0 24px;
  }
  .ll-prop,
  .ll-features{
    padding:80px 24px;
  }
  .ll-prop-inner{
    grid-template-columns:1fr;
    gap:36px;
  }
  .ll-feature-grid{
    grid-template-columns:1fr;
  }
  .ll-features-header{
    flex-direction:column;
    align-items:start;
    gap:20px;
  }
  .ll-try-free{
    flex-direction:column;
    text-align:center;
  }
}

/* ════════════════════════════════════════════════════════════
   FASE 2 HOTFIX — override .main for pub-sider
   ────────────────────────────────────────────────────────────
   leielink.css setter .main med margin-left:230px og
   solid gradient (også som !important). Det dytter
   hero-bildet til høyre og dekker området bak sidebar.

   For pub-sider (.app.pub-calvia) vil vi at hero-bildet
   skal fylle hele skjermen, så vi overrider med høyere
   specifisitet.
   ════════════════════════════════════════════════════════════ */
.app.pub-calvia .main{
  margin-left:0 !important;
  width:100% !important;
  background:transparent !important;
}
.app.pub-calvia.dark .main,
.app.pub-calvia.light .main{
  background:transparent !important;
}

/* Bunn av hero må ha solid bakgrunn så footer/prop ikke titter
   gjennom heroens overlay-gradient */
.app.pub-calvia .ll-prop,
.app.pub-calvia .ll-features,
.app.pub-calvia .page-footer{
  position:relative;
  z-index:5;
}

/* ════════════════════════════════════════════════════════════
   GULL-KNAPP TEXT-FIX
   ────────────────────────────────────────────────────────────
   leielink.css har globale button/.btn-regler som overstyrer
   tekst-fargen på våre gull-knapper. Vi setter eksplisitt
   farge med høyere specifisitet og !important for å sikre
   at teksten alltid er synlig (dypeste navy på gull).
   ════════════════════════════════════════════════════════════ */
.ll-btn-primary,
.ll-btn-primary:link,
.ll-btn-primary:visited,
.ll-hero-topbar .ll-htb-register,
.ll-hero-topbar .ll-htb-register:link,
.ll-hero-topbar .ll-htb-register:visited{
  color:#06111c !important;
}
.ll-btn-primary:hover,
.ll-btn-primary:focus,
.ll-hero-topbar .ll-htb-register:hover,
.ll-hero-topbar .ll-htb-register:focus{
  color:#06111c !important;
}

/* Pilen i gull-knappen skal også være mørk */
.ll-btn-primary .ll-arrow::before{
  background:#06111c !important;
}
.ll-btn-primary .ll-arrow::after{
  border-top-color:#06111c !important;
  border-right-color:#06111c !important;
}

/* Sikre at Logg inn-knappen (ghost) har lys tekst */
.ll-hero-topbar .ll-htb-login,
.ll-hero-topbar .ll-htb-login:link,
.ll-hero-topbar .ll-htb-login:visited{
  color:var(--llc-ink) !important;
}

/* Ghost-knapp i hero (Hvordan det virker) */
.ll-btn-ghost,
.ll-btn-ghost:link,
.ll-btn-ghost:visited{
  color:var(--llc-ink) !important;
}
.ll-btn-ghost:hover{
  color:var(--llc-sand) !important;
}

/* ════════════════════════════════════════════════════════════
   COOKIE-BANNER OVERRIDE — dark Calvia-styling
   ────────────────────────────────────────────────────────────
   Cookie-consent-bannen rendres med standard cream-styling
   som kolliderer med vår dark theme. Vi overstyrer hele
   moduen til navy + gull.
   ════════════════════════════════════════════════════════════ */

/* Hele cookie-bannen */
.cookie-banner,
#cookie-banner,
.cookie-consent,
.cookie-banner-wrapper{
  background:var(--llc-bg-deeper) !important;
  color:var(--llc-ink) !important;
  border-top:1px solid var(--llc-line-strong) !important;
  box-shadow:0 -8px 32px rgba(0,0,0,.4) !important;
}

/* Tekst i banneren */
.cookie-banner *,
#cookie-banner *,
.cookie-consent *{
  color:var(--llc-ink-dim) !important;
}

/* Headings */
.cookie-banner h1,
.cookie-banner h2,
.cookie-banner h3,
.cookie-banner h4,
.cookie-banner strong,
#cookie-banner h1,
#cookie-banner h2,
#cookie-banner h3,
#cookie-banner h4,
#cookie-banner strong{
  color:var(--llc-ink) !important;
}

/* Linker (f.eks. "Learn more") */
.cookie-banner a,
#cookie-banner a,
.cookie-consent a{
  color:var(--llc-sand) !important;
  text-decoration:underline !important;
}
.cookie-banner a:hover,
#cookie-banner a:hover{
  color:var(--llc-ink) !important;
}

/* Primary-knapper (Accept all, etc) */
.cookie-banner button.primary,
.cookie-banner button.accept,
.cookie-banner button[class*="accept"],
.cookie-banner .btn-primary,
#cookie-banner button.primary,
#cookie-banner button.accept{
  background:var(--llc-sand) !important;
  color:#06111c !important;
  border:none !important;
  padding:10px 20px !important;
  font-weight:500 !important;
  letter-spacing:.05em !important;
}
.cookie-banner button.primary:hover,
.cookie-banner button.accept:hover{
  background:var(--llc-ink) !important;
}

/* Secondary-knapper (Reject, Customize) */
.cookie-banner button.secondary,
.cookie-banner button.reject,
.cookie-banner button[class*="reject"],
.cookie-banner button[class*="customize"],
.cookie-banner .btn-secondary,
#cookie-banner button.secondary,
#cookie-banner button.reject{
  background:transparent !important;
  color:var(--llc-ink) !important;
  border:1px solid var(--llc-line-strong) !important;
  padding:10px 20px !important;
}
.cookie-banner button.secondary:hover,
.cookie-banner button.reject:hover{
  border-color:var(--llc-sand) !important;
  color:var(--llc-sand) !important;
}

/* Fallback: ALLE knapper i banneren (om klassenavn ikke matcher) */
.cookie-banner button:not(.primary):not(.secondary):not(.accept):not(.reject),
#cookie-banner button:not(.primary):not(.secondary):not(.accept):not(.reject){
  background:transparent;
  color:var(--llc-ink);
  border:1px solid var(--llc-line-strong);
}

/* Custom panel / detail expandert område */
.cookie-banner-details,
.cookie-banner-categories,
.cookie-customize-panel{
  background:var(--llc-bg-deep) !important;
  border-top:1px solid var(--llc-line) !important;
}

/* ════════════════════════════════════════════════════════════
   GHOST-KNAPP VARIANT C — lesbar mot lyse og mørke bilder
   ────────────────────────────────────────────────────────────
   Tekst-shadow + 2px border (krem 55% alpha).
   Beholder transparent-følelse, gir lesbarhet via skygge.
   
   Gjelder begge ghost-knapper:
   - .ll-btn-ghost          (Hvordan det virker)
   - .ll-htb-login          (Logg inn i hero topbar)
   ════════════════════════════════════════════════════════════ */

/* Hovedstil — overrider alle tidligere ghost-regler */
.ll-btn-ghost,
.ll-btn-ghost:link,
.ll-btn-ghost:visited,
.ll-hero-topbar .ll-htb-login,
.ll-hero-topbar .ll-htb-login:link,
.ll-hero-topbar .ll-htb-login:visited{
  background:transparent !important;
  color:var(--llc-ink) !important;
  border:2px solid rgba(244,237,224,.55) !important;
  text-shadow:0 1px 8px rgba(0,0,0,.85), 0 0 14px rgba(0,0,0,.45);
}

/* Hover: gull-tone */
.ll-btn-ghost:hover,
.ll-hero-topbar .ll-htb-login:hover{
  border-color:var(--llc-sand) !important;
  color:var(--llc-sand) !important;
  text-shadow:0 1px 8px rgba(0,0,0,.65), 0 0 14px rgba(0,0,0,.30);
}

/* Justér padding så 2px border ikke flytter på layout */
.ll-btn-ghost{
  padding:17px 31px !important;  /* var 18px 32px, 1px mindre for å kompensere for ekstra border */
}
.ll-hero-topbar .ll-htb-login{
  padding:11px 21px !important;  /* var 12px 22px */
}

/* ============================================================
   FASE 2 TILLEGG — samlet, ingen duplikater
   ============================================================ */

/* ── Ken Burns på hero-bilder ── */
.ll-hero-image {
  animation: llcKenBurns 40s ease-in-out infinite alternate;
}
@keyframes llcKenBurns {
  from { transform: scale(1); }
  to   { transform: scale(1.08); }
}

/* ── Overlay: kald blå som v9 ── */
.ll-hero-overlay {
  background:
    linear-gradient(95deg,
      rgba(6,17,28,.82)   0%,
      rgba(10,25,41,.62)  35%,
      rgba(10,25,41,.15)  65%,
      rgba(10,25,41,.05)  100%),
    linear-gradient(180deg,
      rgba(6,17,28,.0)    60%,
      rgba(6,17,28,.55)   100%) !important;
}

/* ── Farger: hvit h1, gull em, krem lead ── */
.app.calvia.pub-calvia .ll-hero h1 { color: #f4ede0 !important; }
.app.calvia.pub-calvia .ll-hero h1 em { color: #d5c28f !important; }
.app.calvia.pub-calvia .ll-hero-lead { color: rgba(244,237,224,.72) !important; }
.app.calvia.pub-calvia .ll-eyebrow { color: #d5c28f !important; }

/* ── Sidebar nav: krem tekst ── */
.app.calvia .ll-pub-sidebar .ll-sb-nav a { color: rgba(244,237,224,.72) !important; }
.app.calvia .ll-pub-sidebar .ll-sb-nav a:hover { color: #f4ede0 !important; }
.app.calvia .ll-pub-sidebar .ll-sb-nav li.active > a { color: #f4ede0 !important; }

/* ── Prop og features tekster: krem ── */
.app.calvia.pub-calvia .ll-prop-body p { color: rgba(244,237,224,.72) !important; }
.app.calvia.pub-calvia .ll-feature-desc { color: rgba(244,237,224,.72) !important; }
.app.calvia.pub-calvia .ll-feature-name { color: #f4ede0 !important; }
.app.calvia.pub-calvia .ll-prop-title { color: #f4ede0 !important; }
.app.calvia.pub-calvia .ll-prop-title em { color: #d5c28f !important; }
.app.calvia.pub-calvia .ll-features-title em { color: #d5c28f !important; }

/* ── Logo: litt opp, 12% større ── */
.ll-brand-top { top: 28px !important; }
.ll-brand-img { height: 38px !important; }

/* ── Aa-knapp: rund, ikke italic ── */
.ll-sb-a11y {
  font-family: 'Manrope', sans-serif !important;
  font-style: normal !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  border-radius: 50% !important;
}

/* ── Sidebar bunn: gradient + layout ── */
.ll-sb-bottom {
  position: relative !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 16px 20px 24px !important;
  border-top: none !important;
  background: linear-gradient(
    0deg,
    rgba(6,17,28,.98) 0%,
    rgba(6,17,28,.85) 50%,
    rgba(6,17,28,.0)  100%
  ) !important;
  padding-top: 40px !important;
}

/* ── Språkvelger tonet ned ── */
.ll-sb-bottom .sprakvelger-knapp {
  background: rgba(213,194,143,.04) !important;
  border-color: rgba(213,194,143,.15) !important;
  color: rgba(244,237,224,.45) !important;
  font-size: 10px !important;
  padding: 5px 8px !important;
}
.ll-sb-bottom .sprakvelger-kode { color: rgba(244,237,224,.45) !important; }

/* ── MOBIL ── */
@media (max-width: 900px) {

  /* Sidebar padding */
  .ll-pub-sidebar { padding-top: 80px !important; }

  /* Logo */
  .ll-brand-top { top: 20px !important; left: 16px !important; }
  .ll-brand-img { height: 32px !important; }

  /* Nav spacing */
  .ll-sb-nav a { padding: 8px 20px !important; font-size: 13px !important; }
  .ll-sb-section { padding: 14px 20px 5px !important; font-size: 9px !important; }

  /* Bunn-rad: tving innenfor sidebar */
  .ll-sb-bottom {
    justify-content: flex-start !important;
    padding: 40px 16px 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  .ll-sb-a11y { margin-left: auto !important; flex-shrink: 0 !important; }

  /* Topbar: blur, knapper like høye */
  .ll-hero-topbar {
    left: 0 !important;
    padding: 14px 16px !important;
    background: linear-gradient(
      180deg,
      rgba(6,17,28,.85) 0%,
      rgba(6,17,28,.0)  100%
    ) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    align-items: center !important;
    gap: 8px !important;
  }
  .ll-hero-topbar a {
    font-size: 9px !important;
    padding: 7px 10px !important;
    letter-spacing: .08em !important;
    display: inline-flex !important;
    align-items: center !important;
    height: 30px !important; /* samme høyde begge knapper */
    box-sizing: border-box !important;
  }

  /* Hero-inner under topbar */
  .ll-hero-inner { padding-top: 100px !important; }

  /* CTA-knapper: stables vertikalt */
  .ll-cta-row { flex-direction: column !important; gap: 12px !important; }
  .ll-cta-row .ll-btn { width: 100% !important; justify-content: center !important; }
}

/* ============================================================
   END FASE 2 TILLEGG
   ============================================================ */

/* ===== MOBIL SIDEBAR BREDDE + AA FIX ===== */
@media (max-width: 900px) {
  :root { --llc-sidebar-w: min(230px, 85vw); }

  .ll-pub-sidebar {
    width: var(--llc-sidebar-w) !important;
    overflow: visible !important;
  }

  .ll-sb-bottom {
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    justify-content: space-between !important;
    padding: 40px 16px 20px !important;
  }

  .ll-sb-a11y {
    position: relative !important;
    flex-shrink: 0 !important;
  }
}
/* ===== END MOBIL SIDEBAR BREDDE ===== */

/* ── Cookie-knapp i sidebar bunn ── */
.ll-sb-cookie {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border-radius: 50%;
  background: rgba(213,194,143,.08);
  border: 1px solid rgba(213,194,143,.2);
  cursor: pointer;
  color: rgba(244,237,224,.5);
  display: grid;
  place-items: center;
  padding: 0;
  transition: all .25s;
}
.ll-sb-cookie:hover {
  background: rgba(213,194,143,.15);
  border-color: rgba(213,194,143,.4);
  color: #d5c28f;
}
.ll-sb-cookie svg {
  width: 16px;
  height: 16px;
}


/* Flikk-pil: start rotert 180deg (peker venstre = åpne),
   når sidebar er open: 0deg (peker høyre = lukk) */
}
}

/* Sidebar bunn: reduser høyde, sentrér vertikalt */
.ll-sb-bottom {
  height: auto !important;
  min-height: unset !important;
  padding: 20px 20px 24px !important;
  padding-top: 36px !important;
  align-items: center !important;
}



/* Flikk-pil: › peker høyre = vis sidebar.
   Lukket = peker høyre (klikk for å åpne) ✓
   Åpen = peker venstre (klikk for å lukke) */
  display: inline-block;
  transition: transform .35s !important;
}
}

/* Sidebar bunn: tett gruppe mot høyre */
.ll-sb-bottom {
  justify-content: flex-end !important;
  gap: 12px !important;
}

/* Språkvelger: ikke strekk seg */
.ll-sb-bottom .sprakvelger--sidebar {
  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  margin-right: auto !important; /* push til venstre */
}



/* Flikk-pil: lukket = høyre (åpne), åpen = venstre (lukke) */
  display: inline-block;
  transition: transform .35s !important;
}
}

/* Sidebar bunn: NB til venstre, cookie + Aa til høyre */
.ll-sb-bottom {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 36px 16px 20px !important;
}

.ll-sb-bottom .sprakvelger--sidebar {
  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  margin-right: auto !important;
}

.ll-sb-cookie,
.ll-sb-a11y {
  flex-shrink: 0 !important;
}


/* ===== BUNN LAYOUT FIX V3 ===== */
.ll-sb-bottom {
  justify-content: flex-start !important;
  gap: 10px !important;
  padding: 36px 16px 20px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  overflow: hidden !important;
}
.ll-sb-bottom .sprakvelger--sidebar {
  margin-right: 0 !important;
  flex-shrink: 0 !important;
}
.ll-sb-cookie { flex-shrink: 0 !important; }
.ll-sb-a11y { 
  flex-shrink: 0 !important;
  margin-left: auto !important;
}
/* ===== END BUNN LAYOUT FIX V3 ===== */

/* ===== BUNN LAYOUT FIX V4 ===== */
.ll-sb-bottom {
  overflow: visible !important;
}
.ll-pub-sidebar {
  overflow: visible !important;
}
/* ===== END BUNN LAYOUT FIX V4 ===== */

/* ===== BUNN LAYOUT FIX V5 — sprakvelger max-width ===== */
.ll-sb-bottom .sprakvelger--sidebar {
  max-width: 90px !important;
  width: auto !important;
}
.ll-sb-bottom .sprakvelger-knapp {
  max-width: 90px !important;
  width: auto !important;
}
/* ===== END BUNN LAYOUT FIX V5 ===== */

/* ===== BUNN LAYOUT FIX V6 ===== */
.ll-sb-bottom {
  align-items: center !important;
  gap: 8px !important;
}
.ll-sb-bottom .sprakvelger--sidebar {
  align-self: center !important;
}
.ll-sb-bottom .sprakvelger-knapp {
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
}
.ll-sb-cookie {
  align-self: center !important;
}
.ll-sb-a11y {
  align-self: center !important;
  margin-left: 0 !important;
}
/* ===== END BUNN LAYOUT FIX V6 ===== */


/* ===== BUNN ALIGNMENT FINAL ===== */
/* sprakvelger-knapp er 5px høyere enn cookie+Aa — fix med transform */
.ll-sb-bottom .sprakvelger-knapp {
  transform: translateY(5px) !important;
}
/* ===== END BUNN ALIGNMENT FINAL ===== */

/* ===== MOBIL NAV FONT SIZE ===== */
@media (max-width: 900px) {
  .ll-sb-nav a { font-size: 15px !important; }
}
/* ===== END ===== */

/* ===== MOBIL LOGO SIZE ===== */
@media (max-width: 900px) {
  .ll-brand-img { height: 34px !important; }
}
/* ===== END ===== */

/* ===== MOBIL LOGO SIZE V2 ===== */
@media (max-width: 900px) {
  .ll-brand-img { height: 37px !important; }
}
/* ===== END ===== */

/* ===== MOBIL H1 SIZE ===== */
@media (max-width: 900px) {
  .ll-hero h1 { font-size: clamp(43px, 5.85vw, 79px) !important; }
}
/* ===== END ===== */

/* ===== ACTIVE NAV: fjern grå boks, behold kun gul strek ===== */
.ll-sb-nav a.active,
.ll-sb-nav li.active > a {
  background: transparent !important;
}
.ll-sb-nav a:hover {
  background: transparent !important;
}
/* ===== END ===== */

/* ===== SIDEBAR GRADIENT BUNN ===== */
/* Legg fade-ut ned i sidebar-bakgrunnen direkte */
.ll-pub-sidebar {
  background: linear-gradient(180deg,
    rgba(6,17,28,0)    0px,
    rgba(6,17,28,0)    80px,
    rgba(6,17,28,.88)  160px,
    rgba(6,17,28,.95)  calc(100% - 100px),
    rgba(6,17,28,.60)  calc(100% - 40px),
    rgba(6,17,28,0)    100%
  ) !important;
}
/* ===== END SIDEBAR GRADIENT BUNN ===== */


/* Topbar: knapper ned fra topp */
@media (max-width: 900px) {
  .ll-hero-topbar {
    padding-top: 50px !important;
    align-items: flex-end !important;
  }
}

/* Flikk-pil: lukket=høyre(åpne), åpen=venstre(lukke) */
  transition: transform .35s !important;
  display: inline-block !important;
}
}
/* ===== END ===== */

/* ===== MOBIL CTA KNAPPER ===== */
@media (max-width: 900px) {
  /* CTA: side om side, ikke stables */
  .ll-cta-row {
    flex-direction: row !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
  }
  .ll-cta-row .ll-btn {
    width: auto !important;
    flex: 1 !important;
    justify-content: center !important;
    font-size: 11px !important;
    padding: 14px 16px !important;
    letter-spacing: .12em !important;
  }
}
/* ===== END MOBIL CTA ===== */

/* ===== MOBIL CTA SIZE FIX ===== */
@media (max-width: 900px) {
  .ll-cta-row {
    flex-direction: column !important;
    gap: 10px !important;
  }
  .ll-cta-row .ll-btn {
    width: 100% !important;
    justify-content: center !important;
    font-size: 11px !important;
    padding: 12px 20px !important;
    letter-spacing: .12em !important;
  }
}
/* ===== END MOBIL CTA SIZE ===== */

  display: inline-block !important;
  transition: transform .35s !important;
}
}

  transition: transform .35s !important;
}
}

  transform: none !important;
}
  transform: none !important;
}

  display: inline-block !important;
  transition: transform .35s !important;
}
}

/* Lukket: vis høyre-pil, skjul venstre */

/* Åpen: vis venstre-pil, skjul høyre */

/* Lukket (inne): vis > */

/* Åpen (ute): vis < */
/* ===== END ===== */