/*
 * Test av startsidan utan Nectar. Mått, typografi och färger är avlästa från
 * salmingwatches.test (1440x900 och 390x844) 2026-11-06.
 */

@font-face { font-family: "TWKLausanne"; src: url("../assets/fonts/TWKLausanne-200.woff2") format("woff2"); font-style: normal; font-weight: 200; font-display: swap; }
@font-face { font-family: "TWKLausanne"; src: url("../assets/fonts/TWKLausanne-400.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "TWKLausanne"; src: url("../assets/fonts/TWKLausanne-600.woff2") format("woff2"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "TWKLausanne"; src: url("../assets/fonts/TWKLausanne-200Italic.woff2") format("woff2"); font-style: italic; font-weight: 200; font-display: swap; }

:root {
    --light: #f4f3f3;
    --dark: #000;
    --deep: #1e1e1e;
    --white: #fff;
    /* Innehållsbredden: procentmarginaler räknas mot den, inte mot skärmen. */
    --b: min(calc(100vw - 100px), 1710px);
    --intro-left: max(50px, min(calc(50px + (100vw - 1200px) * .358), calc(136px + (100vw - 1440px) * .2646)));
}

*, *::before, *::after { box-sizing: border-box; }

html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

body {
    margin: 0;
    background: var(--light);
    color: var(--dark);
    font: 200 18px/30px "TWKLausanne", system-ui, -apple-system, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
    overflow-x: clip;
}

:where(.sb) p, :where(.sb) h2, :where(.sb) h3, :where(.sb) h1, :where(.sb) figure, :where(.sb) blockquote { margin: 0; padding: 0; border: 0; font-weight: inherit; }
:where(.sb) img, :where(.sb) video { display: block; }
:where(.sb) a { color: inherit; text-decoration: none; }
:where(p, li, td, blockquote) a { text-decoration: underline; }
td, th { font-weight: 400; }
.salming-contact input { line-height: 1; }
.salming-contact textarea { line-height: 1; }
.salming-contact__submit { line-height: 1.2; }

/* ---------- Hero: staplad som grund (mobil, surfplatta, minskad rörelse) ---------- */

.hero { background: var(--light); }

.hero__media {
    position: relative;
    height: 78vh;
    overflow: hidden;
    background: var(--deep);
}

.hero__media img,
.hero__media video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero__media video { opacity: 0; transition: opacity .4s ease; }
.hero__media video.is-playing { opacity: 1; }

.hero__title { padding: 36px 25px 0; }
.hero__title img { width: 100%; max-width: 329px; height: auto; display: block; }

.hero__photo-anchor { padding: 30px 25px 15px; }
.hero__photo img { width: 100%; height: auto; border-radius: 10px; }

.hero__text {
    display: flex;
    flex-direction: column;
    padding: 20px 25px 56px;
}

.hero__copy p + p { margin-top: 28px; }
.hero__copy { font-size: 16px; line-height: 24px; }
.hero__cta { padding-top: 30px; font-size: 24px; line-height: 24px; }

@media (min-width: 768px) and (max-width: 1024px) {
    .hero__copy { font-size: 18px; line-height: 28px; }
}

/* Mobil: lägre video, så att rubriken och början av fotot syns utan att scrolla.
   svh, så att höjden inte hoppar när adressfältet fälls in. */
@media (max-width: 767px) {
    .hero__media { height: 58vh; height: 58svh; }
}

/* ---------- Hero: låst sektion på desktop ---------- */

@media (min-width: 1025px) and (prefers-reduced-motion: no-preference) {
    .hero:not(.is-preview) {
        position: relative;
        height: 100vh;
        overflow: hidden;
    }

    .hero:not(.is-preview) .hero__media {
        position: absolute;
        inset: 0;
        z-index: 1;
        height: 100%;
        will-change: transform;
    }

    .hero:not(.is-preview) .hero__text {
        position: absolute;
        inset: 0 0 0 auto;
        z-index: 0;
        width: 68vw;
        padding: 20px 0;
        align-items: center;
        justify-content: center;
        gap: 0;
    }

    .hero:not(.is-preview) .hero__text-inner {
        display: flex;
        flex-direction: column;
        gap: 10px;
        max-width: 53vw;
        opacity: 0;
    }

    .hero:not(.is-preview) .hero__copy {
        margin: 72px 0 20px;
        max-width: 35.4em;
        font-size: clamp(16px, 3vh, 22px);
        line-height: 1.3;
    }

    .hero:not(.is-preview) .hero__copy p + p { margin-top: 1.3em; }

    .hero:not(.is-preview) .hero__cta {
        padding: 0;
        margin-bottom: 20px;
        max-width: 30em;
        font-size: clamp(18px, 4vh, 26px);
        line-height: 1.3;
    }

    .hero:not(.is-preview) .hero__title {
        position: absolute;
        inset: 0;
        z-index: 3;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        padding: 20px 40px 20px 80px;
        pointer-events: none;
    }

    .hero:not(.is-preview) .hero__title img { width: 36vw; max-width: none; margin: 0; }

    /* Nollstor punkt, som hos Nectar: skalningen utgår från höger mitt. */
    .hero:not(.is-preview) .hero__photo-anchor {
        position: absolute;
        top: 50%;
        right: 6%;
        z-index: 4;
        width: 0;
        height: 0;
        padding: 0;
    }

    .hero:not(.is-preview) .hero__photo-move {
        position: absolute;
        right: 0;
        top: calc(38vw * -.3165);
        width: 38vw;
    }
}

/* ---------- Citat ---------- */

.quote {
    display: flex;
    gap: 51px;
    justify-content: center;
    margin: 0 auto;
    padding: calc(var(--b) * .12) 25px 0;
    max-width: 930px;
}

.quote__main { display: flex; flex: 1; gap: 27px; align-items: flex-start; min-width: 0; }
.quote__mark { flex: none; width: 70px; height: auto; padding-top: 7px; }
.quote__body { display: flex; flex-direction: column; gap: 22px; }
.quote__text { font-size: 42px; line-height: 1.1; }
.quote__by { font-size: 16px; line-height: 1.4; font-weight: 400; letter-spacing: 1px; }
.quote__logo { flex: none; width: 182px; height: auto; align-self: flex-start; margin-top: 7px; }

/* ---------- Stort påstående ---------- */

/* Samma maxbredd som claim--story och claim--balanced, annars går texten kant i kant på breda skärmar. */
.claim { max-width: 1810px; margin: 0 auto; padding: calc(var(--b) * .1) 60px calc(var(--b) * .11); }
.claim__text { font-size: 60px; line-height: 1; font-weight: 400; }

/* ---------- Korten ---------- */

.cards {
    display: flex;
    gap: 30px;
    max-width: 1810px;
    margin: 0 auto;
    padding: 0 50px 112px;
}

.card {
    position: relative;
    flex: 1 1 33.33%;
    min-width: 0;
    height: 72vw;
    min-height: 500px;
    max-height: 720px;
    color: var(--white);
    transition: transform .25s ease;
}

/* Glid-in-animationen ligger här, hover-lyftet på .card: samma uppdelning som hos Nectar. */
.card__wrap {
    position: absolute;
    inset: 0;
    border-radius: 10px;
    overflow: hidden;
    background: var(--deep);
    transition: box-shadow .25s ease;
    isolation: isolate;
}

.card__img {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.card__inner {
    position: absolute;
    inset: auto 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 20px 38px 60px 30px;
    text-align: center;
}

.card__title { font-size: 50px; line-height: 50px; max-width: 470px; }
.card__desc { margin-top: 6px; font-size: 20px; line-height: 30px; max-width: 470px; }

.card__link {
    display: inline-flex;
    align-items: center;
    gap: .8em;
    margin-top: 38px;
    text-decoration: none;
}

.card__link img { width: 16px; height: auto; }
.card__link span { font-size: 24px; line-height: 30px; background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat; }
.card__link::after { content: ""; position: absolute; inset: 0; }

@media (min-width: 1025px) {
    .card:hover { transform: translateY(-12px); }

    .card:hover .card__wrap {
        box-shadow: 0 1px 2px -1px #0000000a, 0 2px 6px -2px #0000000d, 0 6px 12px -3px #0000000d, 0 15px 30px -3px #00000008;
    }
}

/* Ord som tonas in stegvis */
.word { display: inline-block; }

/* ---------- Under 1025 px ---------- */

@media (max-width: 1024px) {
    .quote { padding: 75px 18px 0; gap: 21px; }
    .quote__text { font-size: 29px; line-height: 1.3; }
    .quote__by { font-size: 15px; }
    .quote__mark { width: 60px; }
    .quote__logo { width: 130px; }

    .claim { padding: 9vw 25px 11vw; }
    .claim__text { font-size: 40px; line-height: 1; }

    .cards { flex-direction: column; gap: 24px; padding: 0 18px 24px; }
    .card { flex: none; height: 72vw; }
}

@media (max-width: 767px) {
    .quote { gap: 5px; padding: 75px 23px 39px 18px; }
    .quote__main { gap: 16px; }
    .quote__mark { width: 33px; padding-top: 3px; }
    .quote__body { gap: 22px; }
    .quote__text { font-size: 18px; line-height: 1.3; }
    .quote__by { font-size: 12px; }

    .card__inner { padding: 20px 20px 34px; }
    .card__title { font-size: 40px; line-height: 40px; }
    .card__desc { font-size: 16px; line-height: 24px; }
    .card__link { margin-top: 8px; font-size: 16px; }
    .card__link span { font-size: 20px; line-height: 25px; }
}

@media (prefers-reduced-motion: reduce) {
    .card, .hero__media video { transition: none; }
}

/* ---------- Grund ---------- */

.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 16px; top: 16px; z-index: 10000; background: #fff; padding: 8px 12px; }
h1, h2, h3, h4 { font-weight: 400; }
a { color: inherit; text-decoration: none; }
:where(p, li, td, blockquote) a { text-decoration: underline; }
td, th { font-weight: 400; }
.salming-contact input { line-height: 1; }
.salming-contact textarea { line-height: 1; }
.salming-contact__submit { line-height: 1.2; }
b, strong { font-weight: 600; }
.nectar-blocks-title__text, .salming-news-card__title { font-size: 20px; line-height: 20px; font-weight: 400; }
.salming-news-card__title.nectar-font-h4 { font-size: 40px; line-height: 1em; }
.salming-news-single h1, .salming-news-single h2, .salming-news-single h3, .salming-news__excerpt { letter-spacing: normal; }
.salming-news-single blockquote { margin: 0 0 30px; font-size: 20.8px; line-height: 29.12px; font-weight: 200; letter-spacing: -.01em; }
.salming-news-single blockquote p { margin: 0; }
.nectar-font-body { font-weight: 200; font-size: 18px; line-height: 30px; }
.nectar-font-label { font-weight: 400; font-size: 16px; line-height: 1.2em; letter-spacing: .063em; text-transform: uppercase; }
.nectar-font-h2 { font-weight: 400; font-size: 80px; line-height: 1em; }
.nectar-font-h4 { font-weight: 400; font-size: 40px; line-height: 1em; }
@media (max-width: 1024px) {
    body, .nectar-font-body { font-size: 16px; line-height: 24px; }
}

/* ---------- Citat, litet ---------- */

.quote--small { max-width: none; padding: 0 18px calc(var(--b) * .16); justify-content: center; }
.quote--small .quote__main { flex: none; }
.quote--small .quote__mark { padding-top: 0; }
.quote__text { font-weight: 200; }
.quote--small .quote__text { max-width: 432px; font-size: 24px; line-height: 33px; }

/* ---------- Helbild ---------- */

.full {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    overflow: hidden;
    background: var(--deep);
    color: var(--white);
}
.full__bg { position: absolute; inset: -16% 0; }
.full__bg img { width: 100%; height: 100%; object-fit: cover; }
.full--statement .full__bg img { opacity: .75; object-position: 57% 30%; }
.full--page-hero .full__bg { inset: -10% auto auto -10%; width: 120%; height: 120%; }
.full--image .full__bg { inset: 0; }
.full--image .full__by { max-width: 190px; }
.full--natural { display: block; min-height: 0; }
.full--natural .full__bg { position: static; }
.full--natural .full__bg img { height: auto; }
.full__title { position: relative; font-weight: 400; text-align: center; }
.full--statement .full__title { padding: 0 5vw; font-size: clamp(20px, 3.2vw, 100vw); line-height: 1; letter-spacing: -.022em; }
.full__title-wrap { position: relative; margin-bottom: 100px; }
.full--page-hero .full__title { font-size: 5vw; line-height: .94; letter-spacing: -.022em; }
.full__by { position: absolute; left: 20px; bottom: 20px; max-width: 18em; font-size: 18px; line-height: 1.3; }
.full--page-hero .full__by { left: max(50px, calc((100% - 1524px) / 2)); bottom: 40px; max-width: 594px; line-height: 30px; }

/* ---------- Bild och berättelse ---------- */

.story { display: flex; align-items: center; gap: 32px; max-width: 1616px; margin: 0 auto; padding: 6vw 50px 5vw; }
.story__figure { position: relative; flex: 0 0 40.67%; }
.story__figure img { width: 100%; max-width: 592px; height: auto; aspect-ratio: 545 / 727; object-fit: cover; border-radius: 10px; }
.caption-over { position: absolute; left: 0; right: 0; bottom: 18px; color: #fff; font-style: italic; font-size: 18px; line-height: 30px; text-align: center; }
.story__body { flex: 1; min-width: 0; padding-left: 2vw; }
.story__title { margin-bottom: 34px; font-size: 80px; line-height: 80px; font-weight: 400; }
.story__text, .comp__text { font-size: 20px; line-height: 30px; letter-spacing: -.2px; }
.story__text p + p, .comp__text p + p { margin-top: 10px; }

/* ---------- Text och bildkomposition ---------- */

.comp { display: flex; gap: 25px; max-width: 1616px; margin: 0 auto; padding: 0 50px; }
.comp__left { display: flex; flex: 1; flex-direction: column; justify-content: space-between; min-width: 0; }
.comp__text { max-width: 558px; }
.comp__pair { display: flex; gap: 25px; }
.comp__pair > div { flex: 1; }
.comp__pair img { width: 100%; height: auto; aspect-ratio: 371 / 529; object-fit: cover; border-radius: 10px; }
.comp__large { position: relative; flex: 0 0 40.9%; }
.comp__large img { width: 100%; height: 100%; aspect-ratio: 548 / 779; object-fit: cover; border-radius: 10px; }

/* ---------- Personer ---------- */

.people { max-width: 1810px; margin: 0 auto; padding: 162px 50px 150px; }
.people__title { margin-bottom: 18px; font-size: 40px; line-height: 50px; font-weight: 200; letter-spacing: -1px; }
.people__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.person img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 10px; }
.person__name { margin-top: 20px; font-size: 24px; line-height: 31.2px; }
.person__role { margin-top: 6px; font-size: 18px; line-height: 21.6px; letter-spacing: 1px; }

/* ---------- Text och bild med märke ---------- */

.report { display: flex; align-items: center; justify-content: space-between; gap: 115px; max-width: 1700px; margin: 0 auto; padding: clamp(220px, 15vw, 330px) 50px 150px; }
.report__body { flex: 0 0 max(510px, calc((100% - 115px) * .4165)); }
.report__title { margin-bottom: 40px; font-size: 40px; line-height: 40px; font-weight: 400; }
.report__text p + p { margin-top: 38px; }
.report__figure { position: relative; flex: 1 1 0; min-width: 0; }
.report__image { width: 100%; height: auto; border-radius: 10px; }
.report__badge { position: absolute; left: -118px; top: -118px; width: clamp(230px, 16vw, 236px); height: auto; z-index: 1; }
.report__caption { margin-top: 10px; font-size: 16px; line-height: 19.2px; font-style: italic; text-align: center; }

/* ---------- Under 1025 px och mobil, nya block ---------- */

@media (max-width: 1024px) {
    .story { flex-direction: column-reverse; align-items: stretch; }
    .report { flex-direction: column; align-items: stretch; }
    .story__figure { flex: none; }
    .story__figure img { max-width: none; }
    .story__body { flex: none; }
    .report__figure { flex: none; max-width: none; }
    .report__badge { left: auto; right: -19px; top: -65px; width: 100px; }
    .report__body { flex: none; }
    .comp { flex-direction: column; gap: 0; padding: 0; }
    .comp__left { padding: 0 18px; }
    .comp__pair { display: none; }
    .comp__large { flex: none; margin-top: 31px; }
    .comp__large img { height: auto; aspect-ratio: 390 / 695; border-radius: 0; }
}

@media (max-width: 767px) {
    .full__by { font-size: 16px; }
    .full--page-hero { min-height: 60vh; }
    .full--page-hero .full__title-wrap, .full--page-hero .full__by { display: none; }

    .story { flex-direction: column-reverse; gap: 32px; padding: 88px 18px 48px; }
    .story__figure img { aspect-ratio: 354 / 472; }
    .story__body { padding: 0 25px; }
    .story__title { margin-bottom: 22px; font-size: 40px; line-height: 40px; }
    .story__text, .comp__text { font-size: 16px; line-height: 24px; letter-spacing: -.16px; }
    .caption-over { bottom: 15px; font-size: 14.4px; line-height: 24px; }
    .comp__large .caption-over { left: 50%; }

    .people { padding: 89px 18px 42px; }
    .people__title { margin-bottom: 16px; }
    .people__grid { grid-template-columns: 1fr; }
    .person__name { font-size: 20px; line-height: 26px; }
    .person__role { margin-top: 5px; font-size: 14px; line-height: 16.8px; }

    .report { gap: 106px; padding: 180px 18px 100px; }
    .report__title { font-size: 40px; }
    .report__text p + p { margin-top: 36px; }
    .report__figure { position: relative; }
    .report__badge { left: auto; right: -19px; top: -65px; width: 100px; }
    .report__caption { margin-top: 9px; font-size: 14px; line-height: 20px; }

    .quote--small { padding: 21px 18px 109px; justify-content: flex-start; }
    .quote--small .quote__main { flex: 1; gap: 23px; }
    .quote--small .quote__mark { width: 44px; }
    .quote--small .quote__text { max-width: none; font-size: 18px; line-height: 23.4px; }
}

/* ---------- Hero, film som växer ---------- */

.tale { position: relative; height: 100vh; overflow: hidden; background: #293b45; }
.tale__media { position: absolute; inset: 0; overflow: hidden; }
.tale__media img, .tale__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tale__media img { opacity: .45; }
.tale__media video { opacity: 0; transition: opacity .4s ease; }
.tale__media video.is-playing { opacity: 1; }
.tale__words, .tale__crown { position: absolute; top: 50%; left: 0; z-index: 100; width: 100%; transform: translate(7vw, -50%); }
.tale__words-in { display: flex; gap: 1.5vw; }
.tale__word { flex: 1; min-width: 0; color: #fff; font-size: clamp(45px, 5vw, 100vw); line-height: 1; font-weight: 400; filter: drop-shadow(0 0 45px #0000004d); }
.tale__word--left { padding-right: 3vw; text-align: right; }
.tale__word--right { padding-left: 2.85vw; }
.tale__crown { display: flex; justify-content: center; }
.tale__crown img { width: 5vw; height: auto; padding-top: .4vw; }
.tale__mobile { display: none; position: absolute; inset: 0; z-index: 100; align-items: flex-end; justify-content: center; }
.tale__mobile-in { width: 100%; max-width: 500px; padding: 0 10vw 11vh; }
.tale__mobile img { width: 100%; height: auto; }

/* ---------- Faktarad ---------- */

.facts { max-width: 1810px; margin: 0 auto; padding: 20px 50px; font-size: 14px; line-height: 19.6px; font-weight: 400; letter-spacing: 1px; text-align: center; }

/* ---------- Stor text, berättelse ---------- */

.claim--story { max-width: 1810px; margin: 0 auto; padding: calc(var(--b) * .12) 50px 103px; }

/* ---------- Text och bild ---------- */

.split { display: flex; gap: 32px; max-width: 1810px; margin: 0 auto 200px; padding: 0 50px; }
.split--image-left + .split--panel { margin-top: -65px; }
.split__figure, .split__body { flex: 1 1 50%; min-width: 0; }
.split__image { display: block; width: 100%; height: auto; object-fit: cover; border-radius: 10px; }
.split--r34 .split__image { aspect-ratio: 3 / 4; }
.split--r23 .split__image { aspect-ratio: 654 / 989; }
.split--r23 { margin-bottom: 201px; }
.split__body { display: flex; align-items: center; justify-content: center; }
.split--narrow .split__inner { max-width: 450px; }
.split--wide .split__inner { max-width: 594px; }
.split__text p + p { margin-top: 10px; }
.split__text p:first-child + p { margin-top: 28px; }
.split--panel { max-width: none; padding: 0; }
.split--panel .split__figure { order: 2; position: relative; }
.split--panel .split__image { position: absolute; inset: 0; height: 100%; border-radius: 0; aspect-ratio: auto; }
.split--panel .split__body { background: #293b45; color: #fff; padding: 153px 28px; }
.split__logos { display: flex; gap: 10px; align-items: center; margin-top: 64px; }
.split__logo { width: auto; height: 140px; }

/* ---------- Bild som växer fram ---------- */

.rise { position: relative; margin-bottom: 200px; overflow: hidden; }
.rise__bg { position: absolute; inset: 0; }
.rise__bg img { width: 100%; height: 100%; object-fit: cover; }
.rise__image { position: relative; }
.rise__image img { width: 100%; height: auto; }

/* ---------- Matchberättelsen ---------- */

.tale-story { background: #293b45; padding: 150px 50px; }
.tale-story > .salming-game-story { max-width: 1210px; margin: 0 auto; }
label { font-size: 16px; line-height: 1.2em; font-weight: 400; letter-spacing: .063em; text-transform: uppercase; }
.tale-story .salming-game-story__button { font-size: 14px; line-height: 16.8px; font-weight: 600; padding: 15px 20px; }

@media (max-width: 1024px) {
    .tale__words, .tale__crown { display: none; }
    .tale__mobile { display: flex; }
    .facts { padding: 20px 18px; }
    .claim--story { padding: 42px 18px 103px; }
    .split, .rise { margin-bottom: 70px; }
    .split__inner { width: 100%; }
    .split__logos { margin-top: 15px; flex-wrap: wrap; }
    .split__logo { height: 80px; }
}

@media (max-width: 767px) {
    .facts { color: #7e7e7e; }
    .claim--story .claim__text { font-size: 30px; line-height: 30px; }
    .split { flex-direction: column; padding: 0 18px; }
    .split__body { justify-content: flex-start; }
    .split--narrow .split__inner, .split--wide .split__inner { max-width: none; }
    .split__figure, .split__body { flex: none; }
    .split__text p:first-child + p { margin-top: 26px; }
    .split--r23 { margin-bottom: 70px; }
    .split--image-left + .split--panel { margin-top: 0; }
    .split--panel { gap: 0; margin-bottom: 120px; padding: 0; }
    .split--panel .split__figure { order: 0; height: 500px; }
    .split--panel .split__body { padding: 24px; }
    .split__logos { justify-content: center; margin-top: 25px; padding-bottom: 0; }
    .split__logo { height: 80px; }
    .tale-story { padding: 110px 18px; }
}

@media (prefers-reduced-motion: reduce) {
    .tale__media video { display: none; }
}

/* ---------- Hero med text ---------- */

.intro { position: relative; display: flex; align-items: center; height: 100vh; overflow: hidden; background: var(--deep); }
.intro__bg { position: absolute; inset: 0; }
.intro__bg img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.intro__inner {
    position: relative;
    max-width: 800px;
    margin-left: var(--intro-left);
    padding-top: 40px;
}
.intro__title { margin-bottom: 40px; font-size: clamp(65px, calc(65px + (100vw - 1200px) * .104), 90px); line-height: .94; font-weight: 400; letter-spacing: -.022em; }
.intro__text { max-width: min(33em, 45vw); }
.intro__text p + p { margin-top: 28px; }
.intro__cta { margin-top: 39px; font-size: 24px; line-height: 30px; }

/* ---------- Stor text med jämn luft ---------- */

@media (min-width: 1921px) {
    :root { --intro-left: calc((100vw - 1724px) / 2 + 165px + (100vw - 1920px) * .06); }
}

.claim--balanced { max-width: 1810px; margin: 0 auto; padding: calc(var(--b) * .12) 50px; }

/* ---------- Panel med två filmer ---------- */

.limited { display: flex; }
.limited__panel { display: flex; flex: 1 1 50%; min-width: 0; align-items: center; justify-content: center; padding: 200px 69px 100px 24px; background: #293b45; color: #fff; }
.limited__inner { max-width: 592px; }
.limited__title { margin-bottom: 36px; font-size: 60px; line-height: 60px; font-weight: 400; }
.limited__text p + p, .limited__sub p + p { margin-top: 30px; }
.limited__sub { margin-top: 82px; }
.limited__sub h3 { margin: 0 0 22px; font-size: 25px; line-height: 35px; font-weight: 400; }
.limited__media { position: relative; display: flex; flex: 1 1 50%; min-width: 0; flex-direction: column; }
.limited__clip { position: relative; flex: 1; overflow: hidden; }
.limited__clip img, .limited__clip video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.limited__clip video, .detail__media video { opacity: 0; transition: opacity .4s ease; }
.limited__clip video.is-playing, .detail__media video.is-playing { opacity: 1; }
.limited__stamp { position: absolute; top: calc(50% - 57px); left: -62px; z-index: 2; width: 122px; height: 122px; }

/* ---------- Specifikationer ---------- */

.specs { position: relative; margin-bottom: -50px; padding: calc(7vw + 73px) 20px 7vw 63px; background: #f0f0f0; overflow: hidden; }
.specs__bg { position: absolute; inset: 73px 0 0; }
.specs__bg img { width: 100%; height: 100%; object-fit: cover; }
.specs__inner { position: relative; max-width: 1521px; margin: 0 auto; }
.specs__col { width: 50%; max-width: 36em; }
.specs__title { margin-bottom: 10px; padding-bottom: 11px; font-size: 50px; line-height: 55px; font-weight: 200; }
.specs__list { margin: 0 0 30px 30px; padding: 0; }
.specs__list li { margin-bottom: 10.8px; }
.specs__below { display: none; }

/* ---------- Detaljrutnät ---------- */

.details { max-width: 1810px; margin: 0 auto 38px; padding: 0 50px; position: relative; }
.details--three { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.details--feature { display: grid; grid-template-columns: 317fr 537fr 438fr; grid-template-rows: 1fr auto auto; column-gap: 24px; row-gap: 0; }
.details--feature .detail { display: contents; }
.details--feature .detail:nth-child(1) .detail__media { grid-column: 1; grid-row: 1 / span 3; }
.details--feature .detail:nth-child(2) .detail__media { grid-column: 2; grid-row: 1 / span 3; aspect-ratio: 537 / 420; }
.details--feature .detail__caption { grid-column: 3; }
.details--feature .detail:nth-child(1) .detail__caption { grid-row: 2; margin-bottom: 28px; }
.details--feature .detail:nth-child(2) .detail__caption { grid-row: 3; }
.detail__media { position: relative; overflow: hidden; border-radius: 10px; background: var(--deep); }
.details--three .detail__media { aspect-ratio: 431 / 525; }
.detail__media img, .detail__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.details--three .detail__caption { margin-top: 20px; }
.detail__label { font-size: 16px; line-height: 22.4px; font-weight: 600; letter-spacing: 1px; }
.detail__text { font-size: 16px; line-height: 30px; }

/* ---------- Kontakt ---------- */

.contact { padding: 80px 20px; scroll-margin-top: 40px; }
.contact__card { padding: 130px 0; border-radius: 10px; background: #fff; }
.contact__inner { display: flex; gap: 32px; width: min(100% - 136px, 1674px); margin: 0 auto; }
.contact__intro, .contact__form { flex: 1 1 50%; min-width: 0; }
.contact__intro { padding: 0 20px; }
.contact__title { margin-bottom: 36px; font-size: 64px; line-height: 64px; font-weight: 400; }
.contact__text { max-width: 16em; font-size: 30px; line-height: 33px; }

/* ---------- Film med spelknapp ---------- */

.film { margin-top: 97px; }
.film .video-card { display: block; }
.film .video { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }

/* ---------- Under 1025 px och mobil, 1148 ---------- */

@media (max-width: 1024px) {
    .intro { align-items: flex-end; justify-content: center; height: 1200px; }
    .intro__bg img { object-position: var(--pos-t, var(--pos, 50% 50%)); }
    .intro__inner { width: 100%; max-width: 31em; margin: 0 0 176px; padding-top: 60px; color: #fff; }
    .intro__title { font-size: 60px; line-height: 56.4px; text-align: center; }
    .intro__text { max-width: none; }
    .intro__cta { line-height: 24px; }
    .claim--balanced { padding: calc((100vw - 36px) * .12) 18px; }
    .claim--balanced .claim__text { font-size: 46px; line-height: 46px; }
    .specs__title { padding-bottom: 17px; }
    .limited { flex-direction: column-reverse; }
    .limited__panel { flex: none; padding: 140px 20px 70px; }
    .limited__media { flex: none; height: 100vw; }
    .limited__stamp { top: auto; bottom: -65px; left: calc(50% - 57px); }
    .specs { margin-bottom: 0; padding: calc(7vw + 73px) 20px 7vw; }
    .specs__bg { display: none; }
    .specs__col { width: 100%; margin: 0 auto; }
    .specs__below { display: block; margin: -43px 0 38px; }
    .specs__below img { width: 100%; height: auto; }
    .details--three, .details--feature { display: flex; flex-direction: column; gap: 24px; padding: 0 18px; }
    .details--feature .detail { display: block; }
    .details--feature .detail__media { aspect-ratio: 537 / 420; }
    .details--feature .detail__caption { margin: 24px 0 0 !important; }
    .contact__inner { flex-direction: column; gap: 16px; width: calc(100% - 60px); }
    .contact__card { padding: 40px 0 50px; }
    .contact__intro { padding: 0; }
    .contact__title { max-width: 15em; margin-bottom: 16px; font-size: 35px; line-height: 35px; }
    .contact__text { font-size: 20px; line-height: 25px; }
}

@media (max-width: 767px) {
    .intro { height: 1258px; }
    .intro__bg img { object-position: var(--pos-m, var(--pos-t, var(--pos, 50% 50%))); }
    .intro__inner { margin-bottom: 172px; padding: 60px 25px 0; }
    .intro__title { font-size: 33px; line-height: 31px; margin-bottom: 42px; }
    .intro__text p + p { margin-top: 26px; }
    .intro__cta { margin-top: 58px; font-size: 24px; line-height: 24px; }
    .claim--balanced .claim__text { font-size: 30px; line-height: 30px; }
    .contact__inner { width: calc(100% - 40px); }
    .limited__text p + p, .limited__sub p + p { margin-top: 24px; }
    .limited__title { margin-bottom: 32px; }
    .limited__sub { margin-top: 76px; }
    .detail__text { line-height: 24px; }
    .specs { padding-left: 20px; }
    .specs__title { margin-bottom: 0; padding-bottom: 21px; font-size: 34px; line-height: 44.2px; }
    .specs__list li { margin-bottom: 9.6px; }
    .film { margin-top: 97px; }
}

/* ---------- Innehåll utan sektionsblock: policy, arkiv och nyheter ---------- */

.container-wrap, .site-main { color: var(--dark); }
.main-content.container { max-width: 1810px; margin: 0 auto; padding: 164px 50px 0; }
.main-content > h1, .main-content > h3 { font-size: 60px; line-height: 1; font-weight: 400; margin: 0 0 24px; }
.main-content > h5 { font-size: 30px; line-height: 42px; font-weight: 400; margin: 0 0 24px; }
.main-content > p { margin: 0 0 24px; }
.main-content > ol, .main-content > ul { margin: 0 0 24px; padding-left: 30px; }
.main-content > figure table { width: 100%; border-collapse: collapse; }
.main-content > figure td, .main-content > figure th { padding: 9px; border: 1px solid #000; font-weight: 400; vertical-align: top; }
.main-content > .wp-block-table { margin: 0; }
.news-archive-page { max-width: 1000px; margin: 0 auto; padding-top: 44px; }
.news-archive-page > h1 { font-size: 80px; line-height: 1; font-weight: 400; margin: 0 0 132px; }

/* ---------- Alumni: hero med knapp, märke och bildrutor ---------- */

.intro--gallery { overflow: visible; z-index: 1; }
.intro--gallery .intro__bg { overflow: hidden; }
.intro__logo { position: absolute; top: 40px; left: calc(50% - 75px); width: 150px; height: auto; }
.intro__badge { position: absolute; top: 74px; right: calc((100% - min(100%, 1724px)) / 2 + 44px); z-index: 2; width: 190px; height: auto; }
.intro--button .intro__cta { margin-top: 10px; font-size: 12px; line-height: 30px; }
.intro--button .intro__cta a { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 24px; border-radius: 10px; background: #000; color: #fff; font-weight: 400; letter-spacing: 2px; text-decoration: none; text-transform: uppercase; transition: background-color .2s ease; }
.intro--button .intro__cta a:hover { background: #1a1a1a; }
.intro__gallery { position: absolute; left: var(--intro-left); bottom: -122px; z-index: 1; display: flex; gap: 24px; width: 54%; max-width: 900px; }
.intro__box { position: relative; flex: 1; overflow: hidden; border-radius: 10px; aspect-ratio: 1; }
.intro__box img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; }
.intro__box img:first-child { opacity: 1; }

/* ---------- Två citat ---------- */

.quotes { display: flex; gap: 32px; max-width: 1810px; margin: 69px auto 0; padding: calc(var(--b) * .12) 50px; }
.quotes__col { flex: 1 1 50%; min-width: 0; display: flex; }
.quotes__col:first-child { justify-content: flex-end; }
.quotes__item { display: flex; gap: 27px; align-items: flex-start; }
.quotes .quote__mark { padding-top: 0; }
.quotes .quote__text { max-width: 432px; font-size: 24px; line-height: 33px; font-weight: 200; }
.quotes .quote__body { display: flex; flex-direction: column; gap: 22px; }
.quotes + .film { margin-top: 92px; }

/* ---------- Hero med knappar ---------- */

.share { position: relative; display: flex; align-items: center; min-height: max(100vh, 1400px); overflow: hidden; background: #000; color: #fff; }
.share__bg { position: absolute; inset: 0; }
.share__bg img { width: 100%; height: 100%; object-fit: cover; }
.share__body { position: relative; margin-left: var(--intro-left); max-width: 1200px; padding-top: 40px; }
.share__eyebrow { margin-bottom: 4px; font-size: 16px; line-height: 19.2px; font-weight: 400; letter-spacing: .063em; text-transform: uppercase; }
.share__title { max-width: min(720px, 45vw); margin-bottom: 30px; font-size: clamp(65px, calc(65px + (100vw - 1200px) * .104), 90px); line-height: 1; font-weight: 400; letter-spacing: -.022em; }
.share__text { margin-top: 3px; max-width: 33em; }
.share__text strong, .kit__sub strong, .shot__title strong { font-weight: 600; }
.share__text--mobile, .share__panel-img { display: none; }
.share__buttons { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 13px 10px; max-width: 26em; margin-top: 34px; }
.share__button { display: inline-block; padding: 16px 32px; border-radius: 10px; background: #fff; color: #000 !important; font-size: 16px; line-height: 16px; font-weight: 400; letter-spacing: .063em; text-decoration: none; text-transform: uppercase; }

/* ---------- Steg ---------- */

.steps { max-width: 1616px; margin: 0 auto; padding: 132px 50px 0; }
.steps__title { font-size: 60px; line-height: 60px; font-weight: 400; }
.steps__intro { font-size: 20px; line-height: 30px; }
.steps__row { display: flex; padding: 102px 0 72px; border-bottom: 1px solid #000; }
.steps__col { flex: 1 1 33.33%; min-width: 0; padding-right: 50px; }
.steps__name { margin: 0 0 36px; font-size: 50px; line-height: 50px; font-weight: 400; }
.steps__text { font-size: 24px; line-height: 30px; }
.steps__text p + p { margin-top: 36px; }

/* ---------- Text i två kolumner ---------- */

.kit { display: flex; max-width: 1616px; margin: 0 auto; padding: 102px 50px 72px; }
.kit__left, .kit__right { flex: 1 1 50%; min-width: 0; padding-right: 50px; }
.kit__right { padding-right: 40px; }
.kit__title { margin-bottom: 18px; font-size: 70px; line-height: 70px; font-weight: 400; }
.kit__sub, .kit__right { font-size: 24px; line-height: 30px; }
.kit__right p + p { margin-top: 36px; }

/* ---------- Lista i mörk ruta ---------- */

.shot { max-width: 1810px; margin: 0 auto; padding: 102px 50px 72px; }
.shot__card { position: relative; display: flex; justify-content: flex-end; overflow: hidden; padding: 200px 0; border-radius: 10px; background: #000; color: #fff; }
.shot__bg { position: absolute; inset: 0; }
.shot__bg img { width: auto; max-width: 100%; height: 100%; object-fit: cover; }
.shot__col { position: relative; width: calc((100% - 32px) * .5833); padding-right: 34px; }
.shot__title { margin-bottom: 36px; font-size: 70px; line-height: 1; font-weight: 200; }
.shot__list { margin: 0; padding-left: 15px; list-style: none; font-size: 30px; line-height: 33px; }
.shot__list li { position: relative; margin-bottom: 18px; padding-left: 22px; }
.shot__list li:last-child { margin-bottom: 0; }
.shot__list li::before { content: ""; position: absolute; left: 0; top: .5em; width: .45em; height: .45em; border-radius: 50%; background: currentColor; }
.shot__below { display: none; }

/* ---------- Frågor och svar ---------- */

.owner-gallery { display: none; }
.faq { max-width: 1616px; margin: 0 auto; padding: 20px 50px; }
.faq__card { padding: 20px 60px; border-radius: 10px; background: #fff; }
.faq__inner { max-width: 1200px; margin: 0 auto; padding: 102px 0 72px; }
.faq__item { border-bottom: 1px solid #000; }
.faq__item:first-child { border-top: 1px solid #000; }
.faq__q { position: relative; display: block; padding: 28px 40px 0 0; font-size: 50px; line-height: 50px; font-weight: 400; cursor: pointer; list-style: none; }
.faq__q::-webkit-details-marker { display: none; }
.faq__icon { position: absolute; right: 0; bottom: 18px; width: 14px; height: 14px; background: linear-gradient(currentColor, currentColor) center / 100% 1px no-repeat, linear-gradient(currentColor, currentColor) center / 1px 100% no-repeat; transition: transform .25s ease; }
.faq__item[open] .faq__icon { transform: rotate(45deg); }
.faq__a { padding: 16px 0 28px; font-size: 27px; line-height: 33px; }

@media (max-width: 1024px) {
    .main-content.container { padding: 99px 18px 0; }
    .intro--gallery.intro { height: 1086px; }
    .intro__logo { top: 45px; left: calc(50% - 67px); width: 134px; }
    .intro__badge { top: 116px; right: 43px; width: 122px; }
    .intro__gallery { display: none; }
    .quotes { margin-top: 53px; flex-direction: column; gap: 64px; padding: calc((100vw - 36px) * .12) 18px; }
    .quotes__col:first-child { justify-content: center; }
    .quotes__col { justify-content: center; }
    .share { display: block; min-height: 0; padding-top: 1400px; }
    .share__bg { inset: 0 0 auto; height: 1400px; }
    .share__body { max-width: none; margin: 0; padding-top: 266px; background: #000; }
    .share__eyebrow, .share__title { padding: 0 26px; }
    .share__eyebrow { margin-bottom: 10px; }
    .share__title { max-width: none; margin-bottom: 23px; font-size: 35px; line-height: 35px; letter-spacing: 0; }
    .share__panel { position: relative; margin-top: 0; }
    .share__panel-img { display: block; width: 100%; height: auto; }
    .share__text { position: absolute; top: 10px; left: 0; right: 0; max-width: none; margin: 0; padding: 0 61% 0 26px; font-size: 25.6px; line-height: 1.1; }
    .share__text--desktop { display: none; }
    .share__text--mobile { display: block; }
    .share__buttons { display: block; max-width: none; margin: 0; }
    .share__button { display: block; padding: 16px 32px; border-radius: 0; border-bottom: 1px solid #000; text-align: center; }
    .steps { padding: 70px 18px 0; }
    .steps__title { font-size: 40px; line-height: 40px; }
    .steps__intro { font-size: 16px; line-height: 24px; }
    .steps__row { flex-direction: column; gap: 30px; padding: 30px 0 64px; }
    .steps__col { padding: 0; }
    .steps__name { margin-bottom: 16px; font-size: 30px; line-height: 30px; }
    .steps__text { font-size: 20px; line-height: 24px; }
    .steps__text p + p { margin-top: 16px; }
    .kit { flex-direction: column; gap: 30px; padding: 60px 18px 30px; }
    .kit__left, .kit__right { padding: 0; }
    .kit__title { margin-bottom: 16px; font-size: 30px; line-height: 30px; }
    .kit__sub, .kit__right { font-size: 20px; line-height: 24px; }
    .kit__right p + p { margin-top: 32px; }
    .shot { padding: 30px 18px; }
    .shot__card { display: block; padding: 0; }
    .shot__bg { display: none; }
    .shot__col { width: auto; padding: 48px 24px 2px; }
    .shot__title { font-size: 30px; }
    .shot__list { font-size: 20.8px; }
    .shot__list li { margin-bottom: 12px; }
    .shot__below { display: block; }
    .shot__below img { width: 100%; height: auto; }
    .owner-gallery { display: block; padding: 60px 18px 30px; }
    .owner-gallery > h2 { margin: 0 0 15px; font-size: 30px; line-height: 30px; font-weight: 400; }
    .faq { padding: 20px 18px; }
    .faq__card { padding: 20px 26px; }
    .faq__inner { padding: 60px 0; }
    .faq__q { padding: 0 60px 8px 0; font-size: 26px; line-height: 26px; }
    .faq__icon { bottom: 14px; }
    .faq__a { padding: 8px 0 16px; font-size: 17.6px; line-height: 22.88px; }
}

@media (max-width: 767px) {
    .intro--gallery.intro { height: 1158px; }
    .share { padding-top: 100vh; }
    .share__bg { height: 100vh; }
    .share__body { padding-top: 200px; }
    .share__text { padding: 0 44% 0 26px; font-size: 17.6px; line-height: 19.36px; }
    .news-archive-page > h1 { margin-bottom: 124px; }
    .intro--button .intro__inner { margin-bottom: 166px; }
    .intro--button .intro__cta { margin-top: 26px; line-height: 24px; }
    .intro__badge { top: 127px; right: 4vw; width: 93px; }
    .quotes { gap: 48px; padding: 21px 38px 66px; }
    .quotes__col { justify-content: flex-start !important; }
    .quotes__col:nth-child(2) .quotes__item { flex-direction: row-reverse; justify-content: space-between; width: 100%; }
    .quotes .quote__mark { width: 44px; }
    .quotes .quote__text { font-size: 18px; line-height: 23.4px; }
    .quotes .quote__by { font-size: 12px; line-height: 16.8px; }
    .quotes__item { gap: 23px; }
}

/* ---------- Redigeraren: inga animationer, allt synligt ---------- */

.is-preview.tale { height: 420px; }

.is-preview.full { min-height: 420px; }
.is-preview .hero__media { height: 320px; }

/* Bara för skärmläsare och sökmotorer: sidans H1 där rubriken är grafik. */
.sb-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }