/*! Odin IPTV Marketing — full sajt-CSS, lazy-loaded efter kritisk path. */

/* ============================================================
   TYPE — globala typografiska defaults
   Använder !important för att vinna mot Twenty Twenty-Five theme.json
   som injicerar Manrope + andra färger via inline <style>.
   ============================================================ */
h1,h2,h3,h4,h5,h6{
    font-family:"Inter",-apple-system,BlinkMacSystemFont,sans-serif !important;
    letter-spacing:-.02em;
    color:#fff;
    margin-top:0;
    line-height:1.2;
    font-weight:700;
    text-wrap:balance;
}
p{margin:0 0 1rem;line-height:1.65;font-family:inherit}
strong{font-weight:700;color:#fff}
button,input,select,textarea{font-family:inherit}

/* ============================================================
   SECTIONS — alla har explicit bg (parent-tema kan ändra body-bg)
   ============================================================ */
.section{padding:5rem 1.5rem;background:#0c1428}
.section--alt{background:#131d34}
.section--deep{background:#1a253d}
.section__eyebrow{
    display:inline-block;
    color:#FFB077;
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
    padding:.35rem .75rem;
    background:rgba(255,176,119,.10);
    border:1px solid rgba(255,176,119,.22);
    border-radius:999px;
    margin-bottom:1rem;
}
.section h2{
    font-size:clamp(1.7rem,2.8vw,2.25rem);
    margin:0 0 .75rem;
    text-align:center;
    font-weight:700;
}
.section .lead{
    text-align:center;
    color:#a8b3ca;
    max-width:660px;
    margin:0 auto 3rem;
    font-size:1.05rem;
    line-height:1.6;
    text-wrap:pretty;
}

/* ============================================================
   FEATURE GRID — "Varför välja OdinTV?", "Erbjuder dig"
   ============================================================ */
.feature-grid{
    display:grid;
    gap:1.5rem;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    max-width:1100px;
    margin:0 auto;
}
.feature-card{
    background:linear-gradient(180deg,#1f2c4a 0%,#1a253d 100%);
    padding:2rem 1.75rem;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.06);
    text-align:center;
    transition:transform .2s,border-color .2s,box-shadow .2s;
}
.feature-card:hover{
    transform:translateY(-3px);
    border-color:rgba(218,117,48,.3);
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.feature-card__icon{
    width:64px;height:64px;margin:0 auto 1.25rem;
    display:grid;place-items:center;
    background:linear-gradient(135deg,rgba(218,117,48,.18),rgba(255,176,119,.06));
    border:1px solid rgba(218,117,48,.22);
    border-radius:18px;
    color:#FFB077;
    font-size:1.6rem;
}
.feature-card h3{
    font-size:1.18rem;
    margin:0 0 .6rem;
    color:#fff;
    font-weight:600;
}
.feature-card p{
    color:#a8b3ca;
    margin:0;
    font-size:.97rem;
    line-height:1.6;
}

/* ============================================================
   STAT BAND
   ============================================================ */
.stat-band{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
    gap:2rem 1.5rem;
    max-width:1100px;
    margin:0 auto;
    text-align:center;
}
/* (Stat-band mobil-overrides ligger l\u00e4ngst ner i RESPONSIVE-blocket) */
.stat-band__item{padding:1rem .5rem;position:relative;min-width:0}
.stat-band__item:not(:last-child)::after{
    content:"";
    position:absolute;
    right:-.75rem;
    top:25%;
    bottom:25%;
    width:1px;
    background:linear-gradient(180deg,transparent,rgba(255,255,255,.10),transparent);
}
@media (max-width:1023px){.stat-band__item:not(:last-child)::after{display:none}}
.stat-band__num{
    font-size:clamp(1.65rem,5vw,2.75rem);
    background:linear-gradient(135deg,#FFB077 0%,#DA7530 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
    font-weight:800;
    margin:0 0 .35rem;
    letter-spacing:-.03em;
    line-height:1;
    font-variant-numeric:proportional-nums;
    white-space:nowrap;
}
.stat-band__label{
    color:#a8b3ca;
    margin:0;
    font-size:.92rem;
    font-weight:500;
}

/* ============================================================
   TWO-COL — bild + text
   ============================================================ */
.two-col{
    display:grid;
    gap:3rem;
    grid-template-columns:1fr;
    max-width:1100px;
    margin:0 auto;
    align-items:center;
}
@media (min-width:720px){
    .two-col{grid-template-columns:1fr 1fr;gap:2.5rem}
    .two-col--reverse > :first-child{order:2}
}
@media (min-width:1024px){
    .two-col{gap:4rem}
}
.two-col__media{
    border-radius:14px;
    overflow:hidden;
    box-shadow:0 18px 50px rgba(0,0,0,.45);
    border:1px solid rgba(255,255,255,.06);
}
.two-col__body h2{text-align:left;margin-bottom:1.25rem}
.two-col__body > p{
    color:#a8b3ca;
    margin:0 0 1.25rem;
    line-height:1.65;
    font-size:1.02rem;
}
.two-col__body ul{
    list-style:none;
    padding:0;
    margin:0 0 1.75rem;
}
.two-col__body ul li{
    padding:.6rem 0 .6rem 2.1rem;
    position:relative;
    color:#cdd5e6;
    font-size:1rem;
    line-height:1.5;
}
.two-col__body ul li::before{
    content:"";
    position:absolute;
    left:0;top:.55rem;
    width:24px;height:24px;
    background:rgba(34,160,107,.15);
    border:1px solid rgba(34,160,107,.4);
    border-radius:50%;
}
.two-col__body ul li::after{
    content:"";
    position:absolute;
    left:8px;top:1.1rem;
    width:8px;height:5px;
    border-left:2px solid #22a06b;
    border-bottom:2px solid #22a06b;
    transform:rotate(-45deg);
}

/* ============================================================
   POSTER STRIP — filmer/serier teaser
   ============================================================ */
.poster-strip{
    display:flex;
    gap:1rem;
    overflow-x:auto;
    padding:.5rem 0 1rem;
    margin:0 auto 2rem;
    max-width:1180px;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,176,119,.3) transparent;
    scroll-snap-type:x mandatory;
}
.poster-strip::-webkit-scrollbar{height:6px}
.poster-strip::-webkit-scrollbar-thumb{background:rgba(255,176,119,.3);border-radius:3px}
.poster-strip img{
    width:140px;
    height:210px;
    object-fit:cover;
    border-radius:10px;
    flex-shrink:0;
    box-shadow:0 8px 24px rgba(0,0,0,.4);
    border:1px solid rgba(255,255,255,.06);
    transition:transform .25s,box-shadow .25s;
    scroll-snap-align:start;
}
.poster-strip img:hover{
    transform:translateY(-6px) scale(1.04);
    box-shadow:0 18px 40px rgba(218,117,48,.30);
}
@media (min-width:880px){
    .poster-strip{justify-content:center}
}

/* ============================================================
   TWO-COL MEDIA FRAME — finare ram runt bilder
   ============================================================ */
.two-col__media--frame{
    position:relative;
    border-radius:16px;
    padding:.5rem;
    background:linear-gradient(135deg,rgba(218,117,48,.30),rgba(34,160,107,.18));
}
.two-col__media--frame img{
    border-radius:12px;
    width:100%;
    height:auto;
    display:block;
}
.two-col__media--frame::after{
    content:"";
    position:absolute;
    inset:-12px;
    background:radial-gradient(circle at 50% 50%,rgba(218,117,48,.15) 0%,transparent 60%);
    z-index:-1;
    border-radius:24px;
    pointer-events:none;
}

/* ============================================================
   LOGO STRIP
   ============================================================ */
.logo-strip{
    display:flex;
    flex-wrap:wrap;
    gap:1.5rem 3rem;
    align-items:center;
    justify-content:center;
    max-width:1000px;
    margin:1.5rem auto 0;
    opacity:.78;
}
.logo-strip img{
    max-height:32px;
    width:auto;
    filter:grayscale(.4) brightness(.95);
    transition:filter .25s,opacity .25s,transform .25s;
}
.logo-strip img:hover{filter:none;opacity:1;transform:scale(1.04)}

/* ============================================================
   TESTIMONIAL
   ============================================================ */
.testimonials{
    display:grid;
    gap:1.5rem;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    max-width:1100px;
    margin:0 auto;
}
.testimonial{
    background:linear-gradient(180deg,#1f2c4a,#1a253d);
    padding:2rem 1.75rem;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.06);
    position:relative;
}
.testimonial::before{
    content:"\201C";
    position:absolute;
    top:-8px;left:18px;
    font-size:4.5rem;
    color:#DA7530;
    line-height:1;
    font-family:Georgia,serif;
    opacity:.45;
}
.testimonial__stars{color:#FFB077;margin:0 0 1rem;letter-spacing:.15em;font-size:1.05rem}
.testimonial__text{color:#cdd5e6;margin:0 0 1.5rem;line-height:1.65;font-size:.98rem;font-style:italic}
.testimonial__name{margin:0;font-weight:600;color:#fff;font-size:1rem}
.testimonial__role{margin:.15rem 0 0;color:#8a96b0;font-size:.85rem}

/* ============================================================
   CTA BAND
   ============================================================ */
.cta-band{
    background:linear-gradient(135deg,#DA7530 0%,#E8843E 50%,#FFB077 100%);
    padding:4rem 1.5rem;
    text-align:center;
    position:relative;
    overflow:hidden;
}
.cta-band::before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 30% 50%,rgba(255,255,255,.12) 0%,transparent 50%);
    pointer-events:none;
}
.cta-band > *{position:relative}
.cta-band h2{color:#0c1428;margin:0 0 .9rem;font-size:clamp(1.7rem,3vw,2.2rem);font-weight:800;letter-spacing:-.02em}
.cta-band p{color:rgba(12,20,40,.85);margin:0 auto 1.75rem;max-width:580px;font-size:1.05rem;font-weight:500}
.cta-band .btn-primary{
    background:#0c1428;
    color:#fff;
    box-shadow:0 8px 24px rgba(0,0,0,.25);
}
.cta-band .btn-primary:hover{background:#1a253d;color:#fff}

/* ============================================================
   FAQ ACCORDION (native <details>)
   ============================================================ */
.faq-wrapper{max-width:880px;margin:0 auto;display:flex;flex-direction:column;gap:2rem}
.faq-section{display:flex;flex-direction:column;gap:.85rem}
.faq-section__pill{
    align-self:flex-start;
    color:#FFB077;
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
    padding:.35rem .85rem;
    background:rgba(255,176,119,.10);
    border:1px solid rgba(255,176,119,.22);
    border-radius:999px;
}
.faq-list{display:flex;flex-direction:column;gap:.55rem}
.faq-list summary{
    list-style:none;
    cursor:pointer;
    font-weight:600;
    font-size:1.02rem;
    padding:1.15rem 1.4rem;
    background:#1a253d;
    border:1px solid rgba(255,255,255,.06);
    border-radius:10px;
    color:#fff;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
    transition:background .15s,border-color .15s;
}
.faq-list summary:hover{background:#1f2c4a;border-color:rgba(255,176,119,.18)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{
    content:"";
    width:12px;height:12px;
    border-right:2px solid #DA7530;
    border-bottom:2px solid #DA7530;
    transform:rotate(45deg);
    transition:transform .2s;
    flex-shrink:0;
}
.faq-list details[open] summary{
    border-radius:10px 10px 0 0;
    border-bottom:0;
    background:#1f2c4a;
}
.faq-list details[open] summary::after{transform:rotate(-135deg);margin-top:6px}
.faq-list details{
    background:transparent;
    border-radius:10px;
}
.faq-list details[open]{
    background:#1a253d;
    border:1px solid rgba(255,176,119,.18);
}
.faq-list .faq-answer{
    padding:1.25rem 1.4rem 1.5rem;
    color:#cdd5e6;
    line-height:1.7;
    font-size:.97rem;
}
.faq-list .faq-answer p:first-child{margin-top:0}
.faq-list .faq-answer p:last-child{margin-bottom:0}
.faq-list .faq-answer a{color:#FFB077;text-decoration:underline;text-decoration-color:rgba(255,176,119,.35);text-underline-offset:3px}
.faq-list .faq-answer a:hover{text-decoration-color:#FFB077}
.faq-list .faq-answer ul,
.faq-list .faq-answer ol{padding-left:1.5rem;margin:.75rem 0}
.faq-list .faq-answer li{margin:.4rem 0}
.faq-list .faq-answer code{
    background:#0c1428;
    color:#FFB077;
    padding:.15rem .4rem;
    border-radius:4px;
    font-size:.88em;
    font-family:"SF Mono",Monaco,Consolas,monospace;
}
.faq-list .faq-answer pre{
    background:#0c1428;
    padding:1rem;
    border-radius:6px;
    overflow-x:auto;
    font-size:.88em;
}
/* Backwards-compat: gamla .faq-category som big h2 — gör den diskret nu */
.faq-category{
    align-self:flex-start;
    margin:0 0 .5rem;
    color:#FFB077;
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.12em;
    font-weight:700;
    padding:.35rem .85rem;
    background:rgba(255,176,119,.10);
    border:1px solid rgba(255,176,119,.22);
    border-radius:999px;
    display:inline-block;
    max-width:max-content;
    line-height:1.2;
}

/* ============================================================
   GUIDES (KB)
   ============================================================ */
.kb-grid{
    display:grid;
    gap:1.5rem;
    grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
    max-width:1180px;
    margin:0 auto;
}
.kb-card{
    background:linear-gradient(180deg,#1f2c4a,#1a253d);
    border-radius:16px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.06);
    transition:transform .2s,border-color .2s,box-shadow .2s;
    display:flex;
    flex-direction:column;
}
.kb-card:hover{
    transform:translateY(-4px);
    border-color:rgba(218,117,48,.35);
    box-shadow:0 16px 36px rgba(0,0,0,.30);
}
.kb-card__head{
    display:flex;
    align-items:center;
    gap:.75rem;
    padding:1.25rem 1.5rem;
    background:linear-gradient(135deg,rgba(218,117,48,.10),rgba(255,176,119,.04));
    border-bottom:1px solid rgba(255,255,255,.06);
}
.kb-card__icon{
    width:42px;height:42px;
    display:grid;place-items:center;
    background:linear-gradient(135deg,rgba(218,117,48,.20),rgba(255,176,119,.08));
    border:1px solid rgba(218,117,48,.30);
    border-radius:11px;
    color:#FFB077;
    flex-shrink:0;
}
.kb-card__icon svg{width:22px;height:22px;display:block}
.kb-card__cat{
    color:#fff;
    font-size:.95rem;
    font-weight:600;
    letter-spacing:-.005em;
}
.kb-card__body{padding:1.5rem 1.5rem;display:flex;flex-direction:column;flex:1}
.kb-card h3{
    margin:0 0 .55rem;
    color:#fff;
    font-size:1.18rem;
    font-weight:600;
    letter-spacing:-.01em;
    line-height:1.3;
}
.kb-card p{
    color:#a8b3ca;
    margin:0 0 1.25rem;
    font-size:.95rem;
    line-height:1.55;
    flex:1;
}
.kb-card details summary{
    cursor:pointer;
    list-style:none;
    font-size:.93rem;
    font-weight:600;
    color:#FFB077;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.5rem;
    padding:.7rem 0;
    border-top:1px solid rgba(255,255,255,.06);
    margin-top:auto;
    transition:color .15s;
}
.kb-card details summary:hover{color:#fff}
.kb-card details summary::-webkit-details-marker{display:none}
.kb-card__chev{
    font-size:1.4rem;
    line-height:1;
    transition:transform .2s;
    color:#DA7530;
}
.kb-card details[open] .kb-card__chev{transform:rotate(90deg)}
.kb-card details .kb-content{
    margin-top:1.25rem;
    padding-top:1.25rem;
    border-top:1px solid rgba(255,255,255,.08);
    color:#cdd5e6;
    line-height:1.65;
    font-size:.95rem;
}
.kb-content h2,.kb-content h3{
    color:#fff;
    margin-top:1.5rem;
    font-size:1rem;
    font-weight:600;
}
.kb-content h2:first-child,.kb-content h3:first-child{margin-top:0}
.kb-content ol,.kb-content ul{padding-left:1.4rem}
.kb-content code{
    background:#0c1428;
    color:#FFB077;
    padding:.1rem .35rem;
    border-radius:4px;
    font-size:.88em;
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{
    background:#0c1428;
    padding:4rem 1.5rem 2rem;
    border-top:1px solid rgba(255,255,255,.06);
    color:#a8b3ca;
}
.site-footer__inner{
    display:grid;
    gap:2.5rem;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    max-width:1200px;
    margin:0 auto 2.5rem;
}
.site-footer__col--brand{max-width:340px}
.site-footer__badges{display:flex;gap:.5rem;margin-top:1rem;flex-wrap:wrap}
.site-footer__badge{
    display:inline-flex;
    align-items:center;
    gap:.4rem;
    font-size:.8rem;
    font-weight:600;
    color:#cdd5e6;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.10);
    padding:.35rem .75rem;
    border-radius:999px;
}
.site-footer__badge:first-child span{color:#FFB077}
.site-footer__badge:last-child span{color:#22a06b}
.site-footer__socials{display:flex;gap:.5rem;margin-top:1rem;flex-wrap:wrap}
.site-footer__social{
    display:inline-flex;align-items:center;justify-content:center;
    width:36px;height:36px;border-radius:50%;
    background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);
    color:#cdd5e6;text-decoration:none;
    transition:background .15s,color .15s,border-color .15s,transform .15s;
}
.site-footer__social:hover{
    background:rgba(218,117,48,.18);
    border-color:rgba(218,117,48,.45);
    color:#FFB077;transform:translateY(-2px);
}
.site-footer__social:focus-visible{outline:2px solid #FFB077;outline-offset:2px}
.site-footer__pay{
    display:inline-flex;gap:.5rem;flex-wrap:wrap;
}
.site-footer__pay span{
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.05em;
    padding:.25rem .55rem;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.10);
    border-radius:6px;
    color:#a8b3ca;
}
.site-footer h4{
    color:#fff;
    margin:0 0 1rem;
    font-size:.95rem;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.06em;
}
.site-footer p{font-size:.92rem;line-height:1.6;margin:0;color:#a8b3ca}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer ul li{margin:.55rem 0}
.site-footer a{color:#a8b3ca;font-size:.95rem}
.site-footer a:hover{color:#FFB077}
.site-footer__bottom{
    border-top:1px solid rgba(255,255,255,.06);
    padding-top:1.5rem;
    font-size:.85rem;
    max-width:1200px;
    margin:0 auto;
    color:#8a96b0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:1rem;
}
@media (max-width:639px){
    .site-footer__bottom{justify-content:center;text-align:center;flex-direction:column}
}

/* ============================================================
   PROSE — text-tunga sidor (Kontakt, Integritetspolicy, FAQ-intro)
   ============================================================ */
.container--prose{
    max-width:760px;
    margin:0 auto;
    padding:0 1.5rem;
    text-align:left;
    color:#cdd5e6;
    font-size:1.02rem;
    line-height:1.75;
}
.container--prose h2{
    color:#fff;
    font-size:1.45rem;
    font-weight:600;
    text-align:left !important;
    margin:2.5rem 0 1rem;
    letter-spacing:-.015em;
}
.container--prose h2:first-child{margin-top:0}
.container--prose h3{
    color:#fff;
    font-size:1.15rem;
    font-weight:600;
    text-align:left;
    margin:2rem 0 .75rem;
}
.container--prose p{
    margin:0 0 1.25rem;
    color:#cdd5e6;
}
.container--prose ul,.container--prose ol{
    padding-left:1.25rem;
    margin:0 0 1.5rem;
}
.container--prose li{
    margin:.5rem 0;
    color:#cdd5e6;
    line-height:1.7;
}
.container--prose li::marker{color:#FFB077}
.container--prose a{
    color:#FFB077;
    text-decoration:underline;
    text-decoration-color:rgba(255,176,119,.4);
    text-underline-offset:3px;
}
.container--prose a:hover{
    color:#fff;
    text-decoration-color:#fff;
}
.container--prose strong{color:#fff;font-weight:700}
.container--prose blockquote{
    margin:1.5rem 0;
    padding:1rem 1.25rem;
    border-left:3px solid #DA7530;
    background:rgba(218,117,48,.06);
    border-radius:0 8px 8px 0;
    color:#cdd5e6;
}

/* ============================================================
   FlexSupport status + breadcrumbs + print
   ============================================================ */
.flexsupport-error{
    text-align:center;
    color:#a8b3ca;
    padding:2.5rem 1rem;
    border:1px dashed rgba(255,255,255,.12);
    border-radius:12px;
    max-width:680px;
    margin:0 auto;
}
.odin-breadcrumbs{
    max-width:1200px;
    margin:0 auto;
    padding:1rem 1.5rem;
    color:#8a96b0;
    font-size:.88rem;
}
.odin-breadcrumbs ol{
    list-style:none;
    padding:0;
    margin:0;
    display:flex;
    flex-wrap:wrap;
    gap:.4rem;
}
.odin-breadcrumbs li:not(:last-child)::after{
    content:"\203A";
    margin-left:.4rem;
    color:#5a6a82;
}
.odin-breadcrumbs a{color:#8a96b0}
.odin-breadcrumbs a:hover{color:#FFB077}
.odin-breadcrumbs [aria-current=page]{color:#fff}

/* ============================================================
   RESPONSIVE — samlade viewport-justeringar (sist = h\u00f6gst spec)
   ============================================================ */

/* --- Tablet portrait (iPad portrait, ~720-1023 px) ---
   Mellanl\u00e4ge mellan stor mobil och desktop. Vi vill utnyttja bredden:
   2-col i tv\u00e5spalts-sektioner, 3 feature-kort, 2 KB-kort, 4 footer-kolumner. */
@media (min-width:720px) and (max-width:1023px){
    .section{padding:4.5rem 2rem}
    .section h2{font-size:clamp(1.6rem,3vw,2rem)}

    .feature-grid{grid-template-columns:repeat(3,1fr);gap:1rem}

    .stat-band{grid-template-columns:repeat(4,1fr);gap:1rem .75rem}
    .stat-band__num{font-size:clamp(1.6rem,3vw,2.2rem)}
    .stat-band__item:not(:last-child)::after{display:none}

    .kb-grid{grid-template-columns:repeat(2,1fr);gap:1.25rem}

    .site-footer{padding:3rem 2rem 2rem}
    .site-footer__inner{
        grid-template-columns:1.4fr 1fr 1fr 1fr;
        gap:2rem;
    }
    .site-footer__col--brand{max-width:none}

    .container--prose{padding:0 2rem;max-width:680px}
}

/* --- Mobil + liten tablet (under 640 px) --- */
@media (max-width:639px){
    .section{padding:3.5rem 1.25rem}
    .section h2{font-size:clamp(1.5rem,5.5vw,1.85rem);line-height:1.2}
    .section .lead,.hero .lead{
        font-size:clamp(.95rem,4vw,1.05rem);
        line-height:1.55;
    }

    .two-col__media--frame{padding:.25rem}
    .two-col__media--frame img{aspect-ratio:16/10;object-fit:cover}
    .two-col__media--frame::after{display:none}
    .two-col__body ul li{padding:.5rem 0 .5rem 1.85rem;font-size:.95rem}

    .feature-card{padding:1.5rem 1.25rem}

    .kb-card__head{padding:1rem 1.25rem}
    .kb-card__body{padding:1.25rem 1.25rem}
    .kb-card h3{font-size:1.05rem}
    .kb-card p{font-size:.9rem}

    .faq-list summary{padding:.9rem 1rem;min-height:48px}
    .faq-answer{padding:.5rem 1rem 1rem}

    .container--prose{
        padding:0 1.25rem;
        font-size:.96rem;
        line-height:1.7;
    }
    .container--prose h2{font-size:1.25rem;margin:2rem 0 .75rem}
    .container--prose h3{font-size:1.05rem;margin:1.5rem 0 .5rem}

    .site-footer{padding:2.5rem 1.25rem 1.5rem}
    .site-footer__inner{gap:1.75rem}
}

/* --- Stat-band p\u00e5 mobil: tving 2x2 utan klippning --- */
@media (max-width:540px){
    .stat-band{
        grid-template-columns:repeat(2,1fr);
        gap:1.25rem .25rem;
    }
    .stat-band__item{padding:.5rem .15rem;min-width:0;overflow:hidden}
    .stat-band__num{
        font-size:clamp(1.45rem,5.5vw,1.85rem);
        letter-spacing:-.04em;
    }
    .stat-band__label{font-size:.8rem;line-height:1.3}
}

/* --- Sm\u00e5 mobiler (<480 px): full-bredd CTA + kompaktare eyebrows --- */
@media (max-width:479px){
    .faq-section__pill,.section__eyebrow{font-size:.68rem;letter-spacing:.1em}
    .platform-chip{font-size:.82rem;padding:.45rem .75rem}
}

@media print{
    .site-header,.site-footer,.cta-band,.btn{display:none !important}
    body{background:#fff;color:#000}
}
