/* ---------- typsnitt (egna filer, beskurna till latin) ---------- */
@font-face{font-family:"Familjen Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonter/familjen-grotesk.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2010-2027, U+2030-203A, U+20AC, U+2122, U+2190-2193, U+2212}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:200 800;font-display:swap;src:url(fonter/newsreader.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2010-2027, U+2030-203A, U+20AC, U+2122, U+2190-2193, U+2212}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:400;font-display:swap;src:url(fonter/newsreader-italic.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2010-2027, U+2030-203A, U+20AC, U+2122, U+2190-2193, U+2212}
@font-face{font-family:"Caveat";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonter/caveat.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2010-2027, U+2030-203A, U+20AC, U+2122, U+2190-2193, U+2212}

/* Digitalt mingel – gemensam stil för alla sidor */
:root{
  --bg:#F6F4F4;
  --surface:#FFFFFF;
  --sunk:#EDE8E8;
  --ink:#2B2829;
  --muted:#6B6365;
  --line:#E0D8D8;
  --rose:#E0A298;
  --rose-soft:#F3DCD7;
  --rose-strong:#9E4B55;
  --frost:#8EA8BB;
  --mid:#C4B0B6;
  --on-ink:#F6F4F4;
  --stamp:#2B2829;
  --stamp-text:#F6F4F4;
  --shadow:0 1px 2px rgba(43,40,41,.06),0 12px 32px -12px rgba(43,40,41,.18);
  --band-bg:#2B2829; --band-ink:#F6F4F4; --band-muted:#BDB3B5; --band-accent:#E0A298; --band-line:#4A4345;

  --display:"Familjen Grotesk",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --serif:"Newsreader",Georgia,"Iowan Old Style","Times New Roman",serif;
  --hand:"Caveat","Bradley Hand","Segoe Print","Comic Sans MS",cursive;

  --t-xs:.8125rem; --t-sm:.9375rem; --t-md:1.1875rem; --t-lg:1.5rem; --t-xl:2.25rem;
  --t-hero:clamp(2.6rem,1.4rem + 5vw,5.1rem);
  --wrap:1180px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#1D1B1C; --surface:#272425; --sunk:#221F20; --ink:#F1ECEB; --muted:#ADA3A5; --line:#3A3536;
    --rose:#E4A99F; --rose-soft:#3A2B2C; --rose-strong:#EDB5AB; --frost:#9BB4C6; --mid:#B79FA6;
    --on-ink:#1D1B1C; --stamp:#E4A99F; --stamp-text:#1D1B1C;
    --shadow:0 1px 2px rgba(0,0,0,.3),0 12px 32px -12px rgba(0,0,0,.6);
    --band-bg:#2E292B; --band-ink:#F1ECEB; --band-muted:#B0A6A8; --band-accent:#E4A99F; --band-line:#4A4345;
  }
}
:root[data-theme="dark"]{
  --bg:#1D1B1C; --surface:#272425; --sunk:#221F20; --ink:#F1ECEB; --muted:#ADA3A5; --line:#3A3536;
  --rose:#E4A99F; --rose-soft:#3A2B2C; --rose-strong:#EDB5AB; --frost:#9BB4C6; --mid:#B79FA6;
  --on-ink:#1D1B1C; --stamp:#E4A99F; --stamp-text:#1D1B1C;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 12px 32px -12px rgba(0,0,0,.6);
  --band-bg:#2E292B; --band-ink:#F1ECEB; --band-muted:#B0A6A8; --band-accent:#E4A99F; --band-line:#4A4345;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--display);font-size:1rem;line-height:1.5;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--rose-strong);outline-offset:3px;border-radius:2px}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0;letter-spacing:-.02em;line-height:1.05}
p{margin:0}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(1.25rem,4vw,2.5rem)}
.label{font-size:var(--t-xs);font-weight:600;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}
.lede{font-family:var(--serif);font-size:var(--t-md);line-height:1.55;color:var(--ink);max-width:36em}
.muted{color:var(--muted)}
.hand{font-family:var(--hand);font-weight:600;color:var(--rose-strong);font-size:1.5rem;line-height:1.1}
.num{font-variant-numeric:tabular-nums}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:20;background:var(--bg);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .2s}
.top.scrolled{border-bottom-color:var(--line)}
.top .wrap{display:flex;align-items:center;gap:1.5rem;min-height:4.25rem}
.brand{display:flex;align-items:center;gap:.55rem;min-height:2.75rem;text-decoration:none;font-weight:700;font-size:1.25rem;letter-spacing:-.02em;white-space:nowrap}
.brand-logo{width:2.5rem;height:2.5rem;border-radius:50%;flex:0 0 auto}
.nav{display:flex;gap:1.5rem;margin-left:auto;font-size:var(--t-sm);font-weight:500}
.nav a{text-decoration:none;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;min-width:2.75rem;padding-inline:.15rem}
.nav a:hover{color:var(--ink)}
.nav .kort{display:none}
.kort-xs{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;gap:.5rem;font:600 var(--t-sm)/1 var(--display);padding:.85rem 1.2rem;border-radius:99px;text-decoration:none;border:1.5px solid var(--ink);background:var(--ink);color:var(--on-ink);cursor:pointer;transition:transform .15s,background .15s,color .15s}
.btn:hover{transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--on-ink)}
.btn.small{padding:.6rem .95rem}
@media (max-width:760px){
  .top .wrap{flex-wrap:wrap;row-gap:0;column-gap:.75rem;padding-top:.35rem}
  .brand{font-size:1.125rem}
  .brand-logo{width:2.25rem;height:2.25rem}
  .top .btn.small{padding-inline:.9rem}
  .top .btn{margin-left:auto}
  .nav{order:3;width:100%;margin-left:0;gap:.75rem;justify-content:space-between;overflow-x:auto;padding:.1rem 0 .3rem;scrollbar-width:none;white-space:nowrap}
  .nav::-webkit-scrollbar{display:none}
  .nav a{flex:0 0 auto;padding-block:.75rem;padding-inline:0;min-width:0}
  .nav .lang{display:none}
  .nav .kort{display:inline}
}
@media (max-width:360px){
  .nav{gap:.4rem;font-size:.875rem}
  .lang-xs{display:none}
  .kort-xs{display:inline}
  .brand{gap:.45rem;font-size:1.0625rem}
  .brand-logo{width:2rem;height:2rem}
  .top .btn.small{padding-inline:.75rem}
}

/* ---------- hero ---------- */
.hero{padding-block:clamp(2rem,4vw,3.25rem) clamp(3rem,6vw,5rem)}
.hero .wrap{display:grid;grid-template-columns:repeat(12,1fr);gap:2rem;align-items:center}
.hero-text{grid-column:1/8;display:flex;flex-direction:column;gap:1.25rem}
.hero h1{font-size:var(--t-hero);font-weight:700;letter-spacing:-.035em;line-height:.98}
.hero h1 .warm{background:linear-gradient(90deg,var(--frost),var(--mid) 40%,var(--rose));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.25rem}
.hero-path{--path-gap:.9rem;display:flex;flex-direction:column;gap:var(--path-gap);max-width:36rem;margin-top:.25rem}
.path-card{display:grid;gap:.35rem;background:var(--rose-soft);border:1px solid color-mix(in srgb,var(--rose) 50%,transparent);border-radius:8px;padding:1.15rem 1.3rem 1.3rem}
.path-kicker{margin:0;display:flex;align-items:center;gap:.55rem;font:600 var(--t-xs)/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--rose-strong)}
.step-n{display:inline-grid;place-items:center;flex:0 0 auto;width:1.45rem;height:1.45rem;border-radius:50%;background:var(--ink);color:var(--on-ink);font:700 .75rem/1 var(--display);letter-spacing:0}
.step-n.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.path-title{margin:.2rem 0 0;font:700 var(--t-lg)/1.15 var(--display);letter-spacing:-.02em;color:var(--ink)}
.path-sub{margin:0 0 .65rem;font-family:var(--serif);font-size:1.0313rem;line-height:1.5;color:var(--muted)}
.path-card .btn{justify-self:start}
.path-kicker,.path-title,.path-sub,.path-link{display:block}
.path-kicker{display:flex}
.path-next{position:relative;background:var(--surface);border-color:var(--line);text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.path-next::before{content:"";position:absolute;left:calc(1.3rem + .7rem);top:calc(-1 * var(--path-gap) - 1px);height:var(--path-gap);border-left:2px dashed color-mix(in srgb,var(--rose) 70%,transparent)}
.path-next .path-kicker{color:var(--muted)}
.path-next .path-title{font-size:1.25rem}
.path-next .path-sub{margin-bottom:.35rem}
.path-link{font:600 var(--t-sm)/1.2 var(--display);color:var(--rose-strong)}
.path-next:hover{border-color:var(--rose);transform:translateY(-1px)}
.path-next:hover .path-link{text-decoration:underline;text-underline-offset:3px}
@media (max-width:560px){.path-next::before{left:calc(1.05rem + .7rem)}.path-card{padding:1rem 1.05rem 1.1rem}.path-card .btn{justify-self:stretch}.path-title{font-size:1.3125rem}}
.hero-media{grid-column:8/13;position:relative}
.photo{border-radius:6px;overflow:hidden;background:var(--sunk);aspect-ratio:4/5}
picture{display:contents}
picture source{display:none}
.photo img{width:100%;height:100%;object-fit:cover}
.stamp{position:absolute;left:-2.75rem;bottom:-2rem;width:9.5rem;height:9.5rem;border-radius:50%;background:var(--stamp);color:var(--stamp-text);display:grid;place-items:center;box-shadow:var(--shadow)}
.stamp svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 40s linear infinite}
.stamp text{font:600 10.5px var(--display);letter-spacing:.2em;fill:currentColor;text-transform:uppercase}
.stamp .core{font-family:var(--hand);font-size:2.4rem;font-weight:600;line-height:.8;text-align:center;color:var(--rose)}
:root[data-theme="dark"] .stamp .core{color:var(--stamp-text)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .stamp .core{color:var(--stamp-text)}}
.stamp .core small{display:block;font:600 .6rem var(--display);letter-spacing:.14em;text-transform:uppercase;margin-top:.35rem}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr}
  .hero-text,.hero-media{grid-column:1/-1}
  .hero-media{max-width:26rem;margin-left:auto;margin-right:0;width:85%}
  .photo{aspect-ratio:5/4}
  .stamp{left:-1.5rem;bottom:-1.5rem;width:8rem;height:8rem}
}

/* ---------- sections ---------- */
section,#anmalan{scroll-margin-top:5.5rem}
@media (max-width:760px){section,#anmalan{scroll-margin-top:8rem}}
.sec{padding-block:clamp(3.5rem,8vw,6.5rem)}
.sec-head{display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem 2rem;margin-bottom:clamp(2rem,4vw,3rem)}
.sec-head .label{grid-column:1/-1}
.sec-head h2{grid-column:1/7;font-size:var(--t-xl);font-weight:700}
.sec-head .lede{grid-column:7/13;align-self:end}
@media (max-width:860px){.sec-head h2,.sec-head .lede{grid-column:1/-1}}

/* ---------- värmeskalan ---------- */
.scale-band{background:var(--surface);border-block:1px solid var(--line)}
.scale{position:relative;margin-bottom:2.5rem}
.track{position:absolute;left:10%;right:10%;top:1.1rem;height:.6rem;border-radius:99px;background:linear-gradient(90deg,var(--frost),var(--mid) 50%,var(--rose))}
.stops{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:.25rem}
.stop{appearance:none;background:none;border:0;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.8rem;color:var(--muted);font:inherit}
.knob{width:2.8rem;height:2.8rem;border-radius:50%;background:var(--surface);border:2px solid var(--line);display:grid;place-items:center;transition:transform .2s,border-color .2s,background .2s}
.knob::after{content:"";width:.7rem;height:.7rem;border-radius:50%;background:var(--c)}
.stop .name{font-weight:700;font-size:1.25rem;letter-spacing:-.01em;color:var(--ink)}
.stop .sub{font-size:var(--t-xs);text-align:center;max-width:9rem;line-height:1.35}
.stop:hover .knob{border-color:var(--c)}
.stop[aria-selected="true"] .knob{background:var(--c);border-color:var(--ink);transform:scale(1.12)}
.stop[aria-selected="true"] .knob::after{background:var(--ink)}
.stop[aria-selected="true"] .sub{color:var(--ink)}
.stuck{position:absolute;top:-2.4rem;left:50%;transform:translateX(-2%) rotate(-3deg);white-space:nowrap;font-size:1.35rem}
.stuck::after{content:"↓";margin-left:.2rem}
@media (max-width:620px){.stop .sub{display:none}.stop .name{font-size:1rem}.knob{width:2.3rem;height:2.3rem}.track{top:.85rem}.stuck{font-size:1.1rem;top:-2rem;transform:translateX(-30%) rotate(-3deg)}}

.panel{display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem 2rem;padding:clamp(1.5rem,3vw,2.25rem);border-radius:6px;background:var(--bg);border:1px solid var(--line)}
.panel .p-title{grid-column:1/5;display:flex;flex-direction:column;gap:.6rem}
.panel .p-title h3{font-size:var(--t-xl)}
.panel .p-title .temp{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--t-sm);color:var(--muted)}
.panel .p-title .temp i{width:.8rem;height:.8rem;border-radius:50%;background:var(--c);display:inline-block}
.panel .p-col{grid-column:span 4;display:flex;flex-direction:column;gap:.5rem}
.panel .p-col p{font-family:var(--serif);font-size:1.0625rem;line-height:1.55}
.panel .p-foot{grid-column:1/-1;padding-top:1rem;border-top:1px solid var(--line);font-size:var(--t-sm);color:var(--muted);display:flex;flex-wrap:wrap;gap:.25rem 1rem}
.panel .p-foot b{color:var(--ink);font-weight:600}
@media (max-width:860px){.panel .p-title,.panel .p-col{grid-column:1/-1}}

/* ---------- webinar ---------- */
.webinar{background:var(--band-bg);color:var(--band-ink)}
.webinar .label{color:var(--band-muted)}
.webinar .lede{color:var(--band-ink)}
.web-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:2.5rem;align-items:start}
.web-intro{grid-column:1/6;display:flex;flex-direction:column;gap:1.25rem}
.web-intro h2{font-size:var(--t-xl);font-weight:700}
.reasons{grid-column:7/13;list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.reasons li{display:grid;grid-template-columns:3.5rem 1fr;gap:1rem;padding:1.4rem 0;border-top:1px solid var(--band-line)}
.reasons li:last-child{border-bottom:1px solid var(--band-line)}
.reasons .n{font-family:var(--hand);font-size:3rem;line-height:.8;color:var(--band-accent);font-weight:600}
.reasons h3{font-size:1.3rem;letter-spacing:-.015em;line-height:1.2}
.reasons p{font-family:var(--serif);font-size:1.0313rem;line-height:1.5;color:var(--band-muted);margin-top:.35rem}
.btn.rose{background:var(--band-accent);border-color:var(--band-accent);color:var(--band-bg)}
@media (max-width:860px){.web-intro,.reasons{grid-column:1/-1}}

/* ---------- guider ---------- */
.guide-badge{grid-column:1/-1;justify-self:start;display:inline-flex;align-items:stretch;flex-wrap:wrap;margin:0;border-radius:99px;overflow:hidden;border:1px solid color-mix(in srgb,var(--rose) 55%,transparent);font:600 var(--t-xs)/1 var(--display);letter-spacing:.09em;text-transform:uppercase;box-shadow:0 1px 0 rgba(0,0,0,.03)}
.gb-free{display:inline-flex;align-items:center;padding:.55rem .85rem;background:linear-gradient(90deg,var(--frost),var(--mid) 60%,var(--rose));color:#2B2829}
.gb-step{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .9rem;background:var(--surface);color:var(--ink)}
.gb-step i{width:.6rem;height:.6rem;border-radius:50%;background:var(--frost);box-shadow:0 0 0 3px color-mix(in srgb,var(--frost) 30%,transparent)}
.guides{display:grid;grid-template-columns:repeat(12,1fr);gap:2rem}
.feature{grid-column:1/8;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:clamp(1.5rem,3vw,2.25rem);display:flex;flex-direction:column;gap:1.25rem;box-shadow:var(--shadow)}
.feature h3{font-size:var(--t-lg)}
.feature .lede{font-size:1.0625rem}
.toggle{display:inline-flex;padding:.25rem;border-radius:99px;background:var(--sunk);align-self:flex-start}
.toggle button{appearance:none;border:0;background:none;font:600 var(--t-sm)/1 var(--display);padding:.55rem 1.1rem;min-height:2.75rem;border-radius:99px;color:var(--muted);cursor:pointer}
.toggle button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.li-card{border:1px solid var(--line);border-radius:6px;background:var(--bg);padding:1rem 1.1rem;display:grid;grid-template-columns:3.25rem 1fr;gap:.9rem;align-items:start}
.avatar{width:3.25rem;height:3.25rem;border-radius:50%;background:linear-gradient(135deg,var(--frost),var(--rose));display:grid;place-items:center;font-weight:700;color:var(--ink)}
.li-card .who{font-weight:700;font-size:1.0625rem}
.li-card .headline{font-size:var(--t-sm);line-height:1.45;margin-top:.15rem;min-height:2.9em}
.li-card .meta{display:flex;justify-content:space-between;gap:1rem;margin-top:.6rem;font-size:var(--t-xs);color:var(--muted)}
.meter{height:.3rem;border-radius:99px;background:var(--sunk);margin-top:.35rem;overflow:hidden}
.meter i{display:block;height:100%;background:var(--c,var(--frost));border-radius:99px;transition:width .35s ease,background .35s}
.verdict{font-family:var(--serif);font-size:1rem;line-height:1.55;color:var(--muted)}
.verdict b{color:var(--ink);font-weight:500}
.feature .hand{align-self:flex-end;transform:rotate(-2deg);margin-top:-.5rem}

.feature .read{align-self:flex-start}
.guide-list{grid-column:8/13;list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.guide-list li{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.guide-list li:first-child{padding-top:0}
.g-stage{display:flex;align-items:center;gap:.45rem;font-size:var(--t-xs);font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);align-self:start;margin-top:.2rem}
.g-stage i{width:.65rem;height:.65rem;border-radius:50%;background:var(--c);flex:none}
.guide-list h4{margin:0;font-size:1.125rem;letter-spacing:-.01em;line-height:1.25}
.guide-list h4 a{text-decoration:none}
.guide-list h4 a:hover{text-decoration:underline;text-underline-offset:3px}
.guide-list p{font-family:var(--serif);color:var(--muted);font-size:.98rem;line-height:1.5;margin-top:.25rem}
.g-status{display:inline-flex;align-items:center;min-height:2.75rem;margin-top:0;font-size:var(--t-xs);font-weight:600;letter-spacing:.04em;color:var(--muted)}
a.g-status{color:var(--rose-strong);text-decoration:none}
a.g-status:hover{text-decoration:underline;text-underline-offset:3px}
.guide-list .g-locked h4{color:var(--muted)}
.guide-list .g-locked .g-stage i{background:transparent;border:2px solid var(--c)}
@media (max-width:960px){.feature,.guide-list{grid-column:1/-1}}

.pdf-card{display:grid;grid-template-columns:9rem minmax(0,1fr);gap:2rem;align-items:center;margin-top:clamp(2.5rem,5vw,3.5rem);padding:clamp(1.5rem,3vw,2.25rem);border-radius:6px;background:var(--rose-soft);border:1px solid color-mix(in srgb,var(--rose) 45%,transparent)}
.pdf-cover{width:100%;height:auto;display:block;border-radius:3px;box-shadow:0 10px 24px rgba(43,40,41,.16),0 2px 6px rgba(43,40,41,.08);transform:rotate(-2deg)}
.pdf-text{display:flex;flex-direction:column;align-items:flex-start;gap:.7rem}
.pdf-text .label{color:var(--rose-strong)}
.pdf-text h3{font-size:var(--t-lg);letter-spacing:-.02em}
.pdf-text p:not(.label){font-family:var(--serif);font-size:1.0625rem;line-height:1.6;max-width:38em}
.pdf-text .btn{margin-top:.4rem}
.pdf-meta{font-weight:500;opacity:.75;font-size:.8125rem;margin-left:.15rem}
@media (max-width:560px){.pdf-card{grid-template-columns:minmax(0,1fr);gap:1.5rem}.pdf-cover{max-width:8rem}.pdf-text .btn{align-self:stretch}}
.guide-main .pdf-card,.in-group + .pdf-card{margin-block:2.5rem}

/* ---------- gruppen ---------- */
.group-band{background:var(--surface);border-block:1px solid var(--line)}
.group{display:grid;grid-template-columns:repeat(12,1fr);gap:2.5rem}
.group-main{grid-column:1/8;display:flex;flex-direction:column;gap:3rem}
.group-side{grid-column:8/13}
@media (max-width:960px){.group-main,.group-side{grid-column:1/-1}}

.block-h{font-size:var(--t-lg);margin-bottom:1.25rem}
.tracks{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
.track-card{display:flex;flex-direction:column;gap:.7rem;padding:1.5rem;border-radius:6px;background:var(--bg);border:1px solid var(--line)}
.track-card h3{font-size:1.3rem;letter-spacing:-.015em;line-height:1.2}
.track-card p:not(.label){font-family:var(--serif);font-size:1.0313rem;line-height:1.55}
@media (max-width:620px){.tracks{grid-template-columns:1fr}}
.together{display:grid;grid-template-columns:9.5rem minmax(0,1fr);gap:1.75rem;align-items:center;padding:clamp(1.25rem,3vw,2rem);border-radius:6px;background:var(--rose-soft)}
.round-table{width:100%;height:auto;display:block}
.rt-table{fill:var(--surface);stroke:var(--rose);stroke-width:2}
.rt-num{font:700 26px var(--display);fill:var(--ink)}
.rt-seat{fill:var(--surface);stroke:var(--ink);stroke-width:2}
.rt-me{fill:var(--ink)}
.rt-du{font:600 8px var(--display);fill:var(--on-ink)}
.together-text{display:flex;flex-direction:column;gap:.7rem}
.together-text h3{font-size:var(--t-lg);letter-spacing:-.02em}
.together-text p:not(.label){font-family:var(--serif);font-size:1.0625rem;line-height:1.55}
.together-text ul{list-style:none;margin:.25rem 0 0;padding:0;display:flex;flex-direction:column;gap:.45rem}
.together-text li{display:grid;grid-template-columns:.9rem minmax(0,1fr);gap:.55rem;font-size:var(--t-sm);line-height:1.45}
.together-text li::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--rose-strong);margin-top:.45rem}
@media (max-width:560px){.together{grid-template-columns:minmax(0,1fr)}.round-table{max-width:8rem}}
.outcomes{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem 2rem;list-style:none;margin:0;padding:0}
.outcomes li{display:grid;grid-template-columns:1.5rem 1fr;gap:.6rem;align-items:start}
.outcomes li::before{content:"";width:1.1rem;height:1.1rem;margin-top:.2rem;border-radius:50%;border:2px solid var(--rose);background:radial-gradient(circle,var(--rose) 0 35%,transparent 38%)}
.outcomes b{display:block;font-weight:600}
.outcomes span{font-family:var(--serif);color:var(--muted);font-size:1rem;line-height:1.5}
@media (max-width:620px){.outcomes{grid-template-columns:1fr}}

.themes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.themes li{display:flex;flex-direction:column;gap:.35rem;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:6px;background:var(--bg)}
.t-n{font-size:var(--t-xs);font-weight:600;text-transform:uppercase;letter-spacing:.09em;color:var(--rose-strong)}
.t-name{font-size:1.125rem;font-weight:600;letter-spacing:-.01em;line-height:1.25}
.themes-note{margin-top:1rem;font-family:var(--serif);font-size:1.0313rem;line-height:1.55;color:var(--muted)}
@media (max-width:760px){.themes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.themes{grid-template-columns:minmax(0,1fr)}}

.practical{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem 2rem;margin:0}
.practical div{display:flex;flex-direction:column;gap:.15rem;padding-top:.8rem;border-top:1px solid var(--line)}
.practical dt{font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.09em;font-weight:600;color:var(--muted)}
.practical dd{margin:0;font-family:var(--serif);font-size:1.0313rem;line-height:1.5}
@media (max-width:620px){.practical{grid-template-columns:1fr}}

.price{position:sticky;top:var(--stick-top,5.5rem);background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:1.5rem 1.6rem;display:flex;flex-direction:column;gap:1rem;box-shadow:var(--shadow)}
@media (max-width:960px){.price{position:static}}
.price .row{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap}
.price .big{font-size:3.1rem;font-weight:700;letter-spacing:-.04em;line-height:1}
.price .per{font-size:var(--t-sm);color:var(--muted)}
.price .was{font-size:var(--t-sm);color:var(--muted)}
.price .was s{text-decoration-thickness:1.5px}
.pill{display:inline-flex;align-self:flex-start;font-size:var(--t-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:.35rem .7rem;border-radius:99px;background:var(--rose-soft);color:var(--rose-strong)}
.price dl{margin:0;display:flex;flex-direction:column}
.price dl div{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;border-top:1px solid var(--line);font-size:var(--t-sm)}
.price dt{color:var(--muted)}
.price dd{margin:0;font-weight:600;text-align:right}
.seats{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}
.seat-row{display:flex;gap:.4rem}
.seat-row i{width:1.1rem;height:1.1rem;border-radius:50%;border:2px solid var(--ink);display:block}
.seat-row i.taken{background:var(--ink);position:relative}
.seat-row i.taken::before,.seat-row i.taken::after{content:"";position:absolute;left:50%;top:50%;width:.6rem;height:2px;border-radius:2px;background:var(--on-ink);transform:translate(-50%,-50%) rotate(45deg)}
.seat-row i.taken::after{transform:translate(-50%,-50%) rotate(-45deg)}
.seats-note{flex-basis:100%;margin:0;font-size:var(--t-xs);color:var(--rose-strong)}
.seats-note b{font-weight:700}
.price .btn{justify-content:center;width:100%;padding-block:1rem}
.price .fine{font-size:var(--t-xs);color:var(--muted);line-height:1.45}
.price .hand{font-size:1.35rem;transform:rotate(-2deg);margin:-.5rem 0 -.3rem}

/* ---------- om ---------- */
.about{display:grid;grid-template-columns:repeat(12,1fr);gap:2.5rem;align-items:center}
.about .photo{grid-column:1/6;aspect-ratio:4/5}
.about .photo img{object-position:center top}
.about-text{grid-column:7/13;display:flex;flex-direction:column;gap:1.25rem}
.about-text h2{font-size:var(--t-xl)}
.about-text p{font-family:var(--serif);font-size:var(--t-md);line-height:1.6;max-width:34em}
.about-actions{display:flex;align-items:center;gap:1rem 1.5rem;flex-wrap:wrap}
.about-text .sign{font-family:var(--hand);font-size:2.4rem;font-weight:600;color:var(--rose-strong);line-height:1}
.facts{display:flex;gap:2.5rem;flex-wrap:wrap;padding-top:1rem;border-top:1px solid var(--line)}
.facts div{display:flex;flex-direction:column}
.facts strong{font-size:2.25rem;font-weight:700;letter-spacing:-.03em;line-height:1}
.facts span{font-size:var(--t-sm);color:var(--muted)}
@media (max-width:860px){.about .photo,.about-text{grid-column:1/-1}.about .photo{max-width:24rem}}

/* ---------- faq ---------- */
.faq{display:grid;grid-template-columns:repeat(12,1fr);gap:2rem}
.faq h2{grid-column:1/5;font-size:var(--t-xl)}
.faq-list{grid-column:5/13;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;padding:1.15rem 0;font-weight:600;font-size:1.125rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;font-size:1.5rem;line-height:1;color:var(--muted);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{font-family:var(--serif);font-size:1.0625rem;line-height:1.6;padding-bottom:1.25rem;max-width:40em}
@media (max-width:860px){.faq h2,.faq-list{grid-column:1/-1}}

/* ---------- footer ---------- */
.site-foot{background:var(--band-bg);color:var(--band-muted);padding-top:clamp(3.5rem,7vw,5rem);font-size:var(--t-sm)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr) minmax(0,1.2fr);gap:3rem}
.foot-brand{display:flex;flex-direction:column;align-items:flex-start;gap:1.25rem;max-width:28rem}
.foot-logo{display:flex;align-items:center;gap:.8rem;color:var(--band-ink);font:700 1.35rem/1 var(--display);letter-spacing:-.02em;text-decoration:none}
.foot-logo img{width:3.5rem;height:3.5rem;border-radius:50%}
.foot-brand > p{font-family:var(--serif);font-size:1.0313rem;line-height:1.65;color:var(--band-muted)}
.foot-brand > div{margin-top:.75rem}
.foot-h{margin:0 0 1rem;font:600 var(--t-xs)/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--band-ink)}
.foot-social{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center}
.soc{position:relative;display:grid;place-items:center;width:2.9rem;height:2.9rem;border-radius:50%;border:1px solid var(--band-line);color:var(--band-ink);text-decoration:none;transition:border-color .15s,color .15s,background .15s,transform .15s}
.soc svg{width:1.25rem;height:1.25rem}
.soc:hover,.soc:focus-visible{border-color:var(--band-accent);color:var(--band-bg);background:var(--band-accent);transform:translateY(-2px)}
.soc-nina{border-color:var(--band-accent)}
.soc-nina img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.soc-badge{position:absolute;right:-.2rem;bottom:-.2rem;display:grid;place-items:center;width:1.3rem;height:1.3rem;border-radius:50%;background:var(--band-accent);color:var(--band-bg);border:2px solid var(--band-bg)}
.soc-badge svg{width:.7rem;height:.7rem}
.soc-nina:hover{background:none}
.foot-links{list-style:none;margin:0;padding:0;display:grid}
.foot-links a{display:inline-flex;align-items:center;min-height:2.6rem;color:var(--band-ink);text-decoration:none}
.foot-links a:hover{color:var(--band-accent)}
.foot-contact{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.foot-contact li{display:grid;grid-template-columns:1.2rem minmax(0,1fr);gap:.8rem;align-items:start;line-height:1.5}
.foot-contact svg{width:1.15rem;height:1.15rem;margin-top:.15rem;color:var(--band-accent)}
.foot-contact strong{display:block;color:var(--band-ink);font-weight:600}
.foot-contact a{color:var(--band-ink);text-decoration:none;overflow-wrap:anywhere}
.foot-contact a:hover{color:var(--band-accent);text-decoration:underline;text-underline-offset:3px}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1.5rem;margin-top:clamp(2.75rem,5vw,4rem);padding-block:1.5rem 2rem;border-top:1px solid var(--band-line);font-size:var(--t-xs)}
.foot-bottom a{color:var(--band-ink)}
@media (max-width:860px){.foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.foot-brand{grid-column:1/-1}}
@media (max-width:560px){.foot-grid{grid-template-columns:minmax(0,1fr);gap:2.75rem}}

.linkish{appearance:none;background:none;border:0;padding:.55rem 0;min-height:2.75rem;font:500 var(--t-sm)/1.4 var(--display);color:var(--rose-strong);text-decoration:underline;text-underline-offset:3px;cursor:pointer;text-align:left}

/* ---------- anmälan ---------- */
.dlg{width:min(40rem,calc(100% - 1.5rem));max-height:calc(100dvh - 1.5rem);padding:0;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.dlg::backdrop{background:rgba(29,27,28,.55);backdrop-filter:blur(3px)}
.dlg-form,.dlg-done{display:flex;flex-direction:column}
.dlg-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;padding:1.5rem 1.5rem 1rem;border-bottom:1px solid var(--line)}
.dlg-head h2{font-size:var(--t-lg);margin-top:.35rem}
.dlg-close{appearance:none;border:0;background:var(--sunk);color:var(--ink);width:2.75rem;height:2.75rem;border-radius:50%;font-size:1.4rem;line-height:1;cursor:pointer;flex:none}
.dlg-body{display:flex;flex-direction:column;gap:1rem;padding:1.25rem 1.5rem}
.f-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
@media (max-width:520px){.f-row{grid-template-columns:minmax(0,1fr)}}
.f{display:flex;flex-direction:column;gap:.4rem;margin:0;padding:0;border:0;min-width:0}
.f>span,.f legend{font-size:var(--t-sm);font-weight:600;padding:0}
.f em{font-style:normal;font-weight:400;color:var(--muted)}
.f input:not([type=radio]):not([type=checkbox]),.f textarea{font:400 1rem/1.4 var(--display);color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:6px;padding:.7rem .8rem;width:100%}
.f textarea{resize:vertical;min-height:5rem}
.f input:not([type=radio]):not([type=checkbox]):focus,.f textarea:focus{outline:none;border-color:var(--rose-strong);box-shadow:0 0 0 3px var(--rose-soft)}
.f input[aria-invalid="true"],.f textarea[aria-invalid="true"]{border-color:#C0392B}
.f legend{margin-bottom:.4rem}
.opt,.check{display:flex;gap:.65rem;align-items:flex-start;font-size:var(--t-sm);line-height:1.45;cursor:pointer}
.opt{padding:.55rem .7rem;border:1.5px solid var(--line);border-radius:6px;margin-top:.4rem}
.opt:has(input:checked){border-color:var(--rose-strong);background:var(--rose-soft)}
.opt input,.check input{accent-color:var(--rose-strong);margin-top:.2rem;flex:none}
.opt b{font-weight:600}
.f-fine{font-size:var(--t-xs);color:var(--muted)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.dlg-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1rem 1.5rem 1.5rem;border-top:1px solid var(--line)}
.f-status{font-size:var(--t-sm);color:var(--muted);flex:1 1 12rem}
.f-status.err{color:#B03A2E}
:root[data-theme="dark"] .f-status.err{color:#F08A7E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .f-status.err{color:#F08A7E}}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}
.dlg-done{gap:1rem;padding:2rem 1.5rem 1.75rem}
.dlg-done h2{font-size:var(--t-xl)}
.dlg-done h2:focus{outline:none}
.dlg-done p:not(.label){font-family:var(--serif);font-size:1.0625rem;line-height:1.55}
.dlg-done a{color:var(--rose-strong);font-weight:600}
.dlg-done .btn{align-self:flex-start}

/* smala skärmar: tolvkolumnsnäten blir en kolumn så att mellanrummen inte spränger bredden */
@media (max-width:960px){
  .guides,.group{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:860px){
  .hero .wrap,.sec-head,.panel,.web-grid,.about,.faq{grid-template-columns:minmax(0,1fr)}
  .web-grid,.group,.about{gap:2rem}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* ---------- guidesidor ---------- */
.crumb{font-size:var(--t-sm);color:var(--muted)}
.crumb a{color:var(--ink)}
.g-hero{padding-block:clamp(2.25rem,5vw,3.75rem) 2.25rem;border-bottom:1px solid var(--line);background:var(--surface)}
.g-hero .wrap{display:flex;flex-direction:column;gap:1.25rem}
.g-hero h1{font-size:clamp(2.3rem,1.3rem + 3.8vw,4rem);font-weight:700;letter-spacing:-.035em;line-height:1;max-width:15ch}
.g-hero .lede{max-width:38em}
.g-meta{display:flex;flex-wrap:wrap;gap:.4rem 1.5rem;font-size:var(--t-sm);color:var(--muted)}
.mini-scale{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.3rem;width:min(100%,26rem)}
.mini-scale span{display:flex;flex-direction:column;gap:.4rem;font-size:var(--t-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mini-scale span::before{content:"";height:.45rem;border-radius:99px;background:var(--c);opacity:.3}
.mini-scale .on{color:var(--ink)}
.mini-scale .on::before{opacity:1}
.nav a[aria-current="page"]{color:var(--ink)}

.prose{display:flex;flex-direction:column;gap:1.15rem;padding-block:clamp(2rem,5vw,3rem) clamp(3rem,6vw,5rem)}
.prose>*{max-width:44rem;width:100%}
.prose h2{font-size:1.75rem;font-weight:700;letter-spacing:-.02em;line-height:1.15;margin-top:1.25rem}
.prose>p,.prose>ul>li,.prose>ol>li{font-family:var(--serif);font-size:1.1875rem;line-height:1.65}
.prose>ul,.prose>ol{margin:0;padding-left:1.3rem;display:flex;flex-direction:column;gap:.55rem}
.prose b{font-family:var(--display);font-weight:600}
.formula{font-family:var(--display)!important;font-size:1.45rem!important;font-weight:600;line-height:1.45!important;letter-spacing:-.01em}
.formula mark{background:var(--rose-soft);color:var(--rose-strong);padding:.05em .4em;border-radius:4px}
.examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.ex{display:flex;flex-direction:column;gap:.45rem;padding:1.1rem 1.2rem;border:1px solid var(--line);border-radius:6px;background:var(--surface)}
.ex p:not(.label){font-size:1.0625rem;line-height:1.45;font-weight:500}
@media (max-width:620px){.examples{grid-template-columns:minmax(0,1fr)}}

.builder{display:flex;flex-direction:column;gap:1.1rem;margin-block:1.25rem;padding:clamp(1.25rem,3vw,2rem);background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow)}
.builder h2{margin-top:0}
.builder-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
@media (max-width:620px){.builder-fields{grid-template-columns:minmax(0,1fr)}}
.builder .headline.muted{color:var(--muted)}
.builder-actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}

.today{display:flex;flex-direction:column;gap:.9rem;margin-block:1.25rem;padding:clamp(1.5rem,3vw,2.25rem);border-radius:6px;background:var(--band-bg);color:var(--band-ink)}
.today .label{color:var(--band-muted)}
.today h2{margin-top:0}
.today ol{margin:0;padding-left:1.4rem;display:flex;flex-direction:column;gap:.6rem}
.today li{font-family:var(--serif);font-size:1.125rem;line-height:1.55}
.today li::marker{font-family:var(--hand);font-size:1.5rem;color:var(--band-accent)}
.today-p{font-family:var(--serif);font-size:1.125rem;line-height:1.6;color:var(--band-ink)}

.in-group{display:grid;grid-template-columns:minmax(0,1fr);gap:1.25rem;padding:clamp(1.5rem,3vw,2rem);border-radius:6px;background:var(--rose-soft)}
.in-group h2{margin-top:.35rem;font-size:1.5rem}
.in-group p:not(.label){font-family:var(--serif);font-size:1.0625rem;line-height:1.55;margin-top:.5rem}
.in-group-ctas{display:flex;flex-wrap:wrap;gap:.75rem}

.next-guide{display:flex;flex-direction:column;gap:.25rem;padding-top:1.5rem;margin-top:.5rem;border-top:1px solid var(--line)}
.next-title{font-size:1.25rem;font-weight:700;letter-spacing:-.01em}

/* ---------- luftigare på mobil ---------- */
@media (max-width:760px){
  .wrap{padding-inline:1.5rem}
  .sec{padding-block:4.5rem}
  .hero{padding-block:2.25rem 4rem}
  .hero-text{gap:1.5rem}
  .hero-path{--path-gap:1.1rem}
  .sec-head{row-gap:1rem;margin-bottom:2.5rem}

  .lede,.panel .p-col p,.reasons p,.track-card p:not(.label),.together-text p:not(.label),.outcomes span,
  .themes-note,.practical dd,.guide-list p,.faq details p,.about-text p,.feature .lede,.verdict{line-height:1.68}

  .scale{margin-bottom:2.75rem}
  .panel{padding:1.6rem 1.4rem;row-gap:1.75rem}
  .panel .p-col{gap:.65rem}
  .panel .p-foot{padding-top:1.25rem;gap:.4rem 1rem}

  .web-grid{gap:3rem}
  .web-intro{gap:1.5rem}
  .reasons li{grid-template-columns:2.75rem minmax(0,1fr);padding:1.75rem 0}
  .reasons p{margin-top:.55rem}

  .guides{gap:3rem}
  .feature{padding:1.6rem 1.4rem;gap:1.5rem}
  .li-card{grid-template-columns:2.6rem minmax(0,1fr);padding:1.1rem 1.15rem}
  .avatar{width:2.6rem;height:2.6rem}
  .li-card .meta{flex-wrap:wrap;gap:.2rem 1rem}
  .li-card .meta .num{white-space:nowrap}
  .guide-list li{grid-template-columns:minmax(0,1fr);gap:.45rem;padding:1.5rem 0}
  .g-stage{margin-top:0}
  .guide-list p{margin-top:.4rem}

  .group,.group-main{gap:3.5rem}
  .block-h{margin-bottom:1.5rem}
  .tracks{gap:1.5rem}
  .track-card{padding:1.6rem 1.4rem;gap:.9rem}
  .together{padding:1.75rem 1.4rem;gap:1.5rem}
  .together-text{gap:1rem}
  .together-text ul{gap:.8rem;margin-top:.5rem}
  .outcomes{gap:1.5rem}
  .themes{gap:1rem}
  .themes li{padding:1.15rem 1.3rem;gap:.45rem}
  .themes-note{margin-top:1.5rem}
  .practical{gap:1.35rem}
  .practical div{padding-top:1.15rem;gap:.4rem}
  .price{padding:1.75rem 1.4rem;gap:1.25rem}
  .price dl div{padding:.75rem 0}

  .about{gap:2.75rem}
  .about-text{gap:1.5rem}
  .facts{padding-top:1.5rem}
  .faq{gap:2rem}
  .faq summary{padding:1.35rem 0}
  .faq details p{padding-bottom:1.5rem}
}
@media (max-width:380px){
  .wrap{padding-inline:1.25rem}
}