/**
 * Lekon Rådgivning - designlag.
 *
 * Ligger OVEN PÅ lekon-front.css og ændrer kun tokens og et par
 * detaljer, så artiklerne matcher det nye site. Layout, struktur og
 * komponenter i templates og lekon-front.css er urørt.
 */

/* ---------- Tokens ---------- */
.lk-single,
.lk-more{
  --fh:"Schibsted Grotesk", sans-serif;
  --fb:"Plus Jakarta Sans", sans-serif;
  --dark:#1D3244;
  --deep:#152634;
  --bright:#16ADEE;
  --soft:#F4F7F9;
  --ink:#132330;
  --ink-soft:#5A7080;
  --line:#DEE7EC;
  --head:#132330;
  --ease:cubic-bezier(.22,1,.28,1);
}

/* ---------- Typografi ---------- */
.lk-single h1,.lk-single h2,.lk-single h3,
.lk-more h2,.lk-more h3{
  letter-spacing:-.028em;
}
.lk-single .lk-hero h1{letter-spacing:-.035em; line-height:1.05;}

/* ---------- Runde former som resten af sitet ---------- */
.lk-card,
.lk-form-card,
.lk-acc,
.lk-more .lk-mcard{border-radius:18px;}
.lk-chip,
.lk-card__more,
.lk-empty button,
.lk-btn,
.lk-single .lk-form button[type="submit"]{border-radius:999px;}
.lk-single .lk-field select{border-radius:12px; background-color:#fff; border:1px solid var(--line);}

/* ---------- Blødere kant frem for hårde skygger ---------- */
.lk-single .lk-card{border:1px solid var(--line); box-shadow:none;
  transition:transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease);}
.lk-single .lk-card:hover{transform:translateY(-3px); border-color:transparent;
  box-shadow:0 24px 48px -26px rgba(35,56,70,.45);}
.lk-single .lk-badge{background:rgba(21,38,52,.82); box-shadow:none; border-radius:999px;}

/* ---------- Hero på den enkelte artikel ---------- */
.lk-single .lk-hero{background:var(--deep);}
.lk-single .lk-hero__sub{font-weight:400; color:#fff;}
.lk-single .lk-eyebrow{color:#8FA8B8;}
.lk-single .lk-hero__back{color:#8FA8B8;}
.lk-single .lk-hero__back:hover{color:#fff;}

/* ---------- Detaljer ---------- */
.lk-single .lk-chip.is-active{background:var(--bright); color:#fff;}
.lk-single .lk-chip__n{opacity:.7;}
.lk-single .lk-count{font-family:var(--fb); font-weight:500; font-size:.88rem; color:var(--ink-soft);}
.lk-single .lk-card__kat{font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:.72rem;}
.lk-single .lk-card__more{color:var(--bright); font-family:var(--fb); font-weight:600;}
.lk-single .lk-avatar{box-shadow:none;}


/* ---------- Relaterede undersider på artiklen ---------- */
.lk-single .lk-relpages{margin-top:26px;padding:22px 24px;border:1px solid var(--line);border-radius:18px;}
.lk-single .lk-relpages__label{display:block;margin-bottom:12px;font-family:var(--fb);font-size:.72rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);}
.lk-single .lk-relpages ul{list-style:none;margin:0;padding:0;}
.lk-single .lk-relpages li a{display:flex;align-items:center;gap:11px;padding:9px 0;font-family:var(--fb);
  font-size:.94rem;font-weight:500;color:var(--ink);text-decoration:none;
  transition:color .2s var(--ease),transform .2s var(--ease);}
.lk-single .lk-relpages li a::before{content:'';flex:0 0 auto;width:10px;height:10px;background:var(--bright);opacity:.75;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='square'%3E%3Cpath d='M2.6 6h6.4M6.2 3.2 9 6l-2.8 2.8'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='square'%3E%3Cpath d='M2.6 6h6.4M6.2 3.2 9 6l-2.8 2.8'/%3E%3C/svg%3E") center/contain no-repeat;}
.lk-single .lk-relpages li a:hover{color:var(--bright);transform:translateX(3px);}


/* ==================================================================
   ENKELT ARTIKEL - tilpasset sitets design
   Ingen ændringer i markup: kun farver, form og typografi ovenpå
   lekon-front.css. Alle sektioner (hero, akkordeon, hilsen,
   formular, relaterede artikler) er bevaret som de er.
   ================================================================== */

/* ---------- Hero: samme flade som sitets øvrige heroes ---------- */
.lk-single .lk-hero{background:#152634;padding:96px 0 150px;}
.lk-single .lk-hero__bg{inset:0;filter:none;transform:none;background-position:center right;opacity:.85;}
.lk-single .lk-hero__overlay{
  background:linear-gradient(90deg,#152634 0%,rgba(21,38,52,.92) 26%,rgba(21,38,52,.5) 62%,rgba(21,38,52,.22) 100%);}
/* Kvadratnet og lysskær som på de øvrige sider */
.lk-single .lk-hero::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:74px 74px;
  -webkit-mask-image:radial-gradient(120% 90% at 72% 12%,#000 0%,rgba(0,0,0,.55) 45%,transparent 78%);
  mask-image:radial-gradient(120% 90% at 72% 12%,#000 0%,rgba(0,0,0,.55) 45%,transparent 78%);}
.lk-single .lk-hero::after{content:'';position:absolute;top:-24%;right:-6%;z-index:1;pointer-events:none;
  width:900px;height:900px;border-radius:50%;
  background:radial-gradient(circle,rgba(22,173,238,.26),rgba(22,173,238,.06) 42%,transparent 68%);filter:blur(12px);}
.lk-single .lk-hero__inner{z-index:2;}
.lk-single .lk-hero__wave{height:72px;}

.lk-single .lk-hero h1{font-family:var(--fh);font-weight:700;letter-spacing:-.038em;line-height:1.03;
  font-size:clamp(1.95rem,4.2vw,3.1rem);}
.lk-single .lk-hero__sub{font-weight:400;color:#fff;font-size:clamp(1rem,1.3vw,1.1rem);line-height:1.62;}
.lk-single .lk-hero__back{color:#8FA8B8;font-weight:500;}
.lk-single .lk-hero__back:hover{color:#fff;}
.lk-single .lk-hero__aname{font-weight:600;}
.lk-single .lk-hero__arole{color:#8FA8B8;}

/* ---------- Former: væk med 1px-rammer, ens radius ---------- */
.lk-single .lk-acc,
.lk-single .lk-form-card,
.lk-single .lk-info-card,
.lk-more .lk-mcard{border:0;border-radius:18px;}
/* .lk-udbytte__item og .lk-standarder li tegner deres skillelinje med
   inset box-shadow. Får de border-radius, bliver stregen til en
   afrundet ramme rundt om hvert punkt - derfor holdes de firkantede. */
.lk-single .lk-udbytte__item,
.lk-single .lk-standarder li{border-radius:0;border:0;}
.lk-single .lk-avatar,
.lk-more .lk-avatar{border-radius:12px;box-shadow:none;}
.lk-single .lk-hero__author .lk-avatar{border-radius:14px;}
.lk-more .lk-mcard__img,
.lk-more .lk-mcard__media{border-radius:12px;overflow:hidden;}

/* ---------- Knapper og felter ---------- */
.lk-single .lk-form button,
.lk-single .lk-form input[type="submit"],
.lk-single .lk-more__all,
.lk-single .lk-btn{border-radius:999px;font-family:var(--fh);font-weight:500;}
.lk-single .lk-form input,
.lk-single .lk-form textarea,
.lk-single .lk-form select{border-radius:12px;border:0;background:var(--soft);font-family:var(--fb);}
.lk-single .lk-form input:focus,
.lk-single .lk-form textarea:focus{outline:2px solid var(--bright);outline-offset:1px;}

/* ---------- Akkordeon ----------
   Lukket: rolig lys flade. Åben: mørkeblå hoved med hvid tekst og
   blå ikonflise, så det er tydeligt hvilken sektion man er inde i.
   Selve indholdet står på hvid, så teksten er nem at læse. */
.lk-single .lk-acc{background:#F4F7F9;overflow:hidden;
  transition:background .3s var(--ease),box-shadow .3s var(--ease);}
.lk-single .lk-acc__head{padding:20px 22px;gap:15px;
  transition:background .3s var(--ease),color .3s var(--ease);}
.lk-single .lk-acc__title{font-family:var(--fh);font-weight:700;letter-spacing:-.02em;color:var(--ink);
  transition:color .3s var(--ease);}
.lk-single .lk-acc__ic{width:38px;height:38px;border-radius:12px;background:#fff;color:#1D3244;
  transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease);}
.lk-single .lk-acc__chev{color:#5A7080;transition:transform .3s var(--ease),color .3s var(--ease);}

/* Lukket: hover løfter fladen en anelse */
.lk-single .lk-acc.is-collapsed .lk-acc__head:hover{background:#EAF1F5;}
.lk-single .lk-acc.is-collapsed .lk-acc__head:hover .lk-acc__ic{background:#E4F4FD;color:var(--bright);}

/* Åben */
.lk-single .lk-acc:not(.is-collapsed){background:#fff;box-shadow:0 18px 40px -30px rgba(35,56,70,.6);}
.lk-single .lk-acc:not(.is-collapsed) .lk-acc__head{background:#152634;}
.lk-single .lk-acc:not(.is-collapsed) .lk-acc__title{color:#fff;}
.lk-single .lk-acc:not(.is-collapsed) .lk-acc__ic{background:var(--bright);color:#fff;}
.lk-single .lk-acc:not(.is-collapsed) .lk-acc__chev{color:var(--bright);transform:rotate(180deg);}
.lk-single .lk-acc__body,
.lk-single .lk-acc__inner{background:#fff;}

/* ---------- Tekst ---------- */
.lk-single .lk-kicker{font-family:var(--fb);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--bright);}
.lk-single .lk-prose{font-size:1.04rem;line-height:1.75;color:#2E4354;}
.lk-single .lk-prose a{color:var(--bright);}
.lk-single .lk-udbytte__t{font-family:var(--fh);font-weight:700;letter-spacing:-.02em;color:var(--ink);}
.lk-single .lk-udbytte__item{padding:18px 0;gap:14px;}
.lk-single .lk-udbytte__d{color:#2E4354;}
.lk-single .lk-standarder li{color:#2E4354;}
.lk-single .lk-usp__icon{border-radius:13px;}
.lk-single .lk-check{color:var(--bright);}

/* ---------- Relaterede artikler ---------- */
.lk-more{background:var(--soft);box-shadow:none;}
.lk-more .lk-mcard{background:#fff;transition:transform .28s var(--ease),box-shadow .28s var(--ease);}
.lk-more .lk-mcard:hover{transform:translateY(-3px);box-shadow:0 24px 48px -26px rgba(35,56,70,.45);}
.lk-more .lk-mcard__title{font-family:var(--fh);font-weight:700;letter-spacing:-.022em;}
.lk-more .lk-mcard__eyebrow{font-weight:600;letter-spacing:.09em;text-transform:uppercase;font-size:.71rem;color:var(--bright);}
.lk-more .lk-mcard__link{color:var(--bright);font-weight:600;}

@media (max-width:900px){
  .lk-single .lk-hero{padding:64px 0 110px;}
  .lk-single .lk-hero__wave{height:48px;}
}
