﻿:root{
    --navy:#031b35;--navy2:#062a4d;--blue:#1673d1;--cyan:#28b7ef;
    --text:#102235;--muted:#5f7080;--bg:#f4f7fa;--white:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--white)}
a{color:inherit}
.container{width:min(1160px,calc(100% - 40px));margin:auto}
.narrow{max-width:850px}
.topbar{background:var(--navy);color:#fff;position:sticky;top:0;z-index:50;box-shadow:0 4px 22px rgba(0,0,0,.18)}
.nav-wrap{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand img{width:250px;max-width:42vw;display:block}
nav{display:flex;align-items:center;gap:30px;font-weight:650}
nav a{text-decoration:none;opacity:.92}
nav a:hover{opacity:1;color:#7bd5ff}
.admin-link{padding:11px 17px;border:1px solid rgba(255,255,255,.32);border-radius:9px}
.hero{background:
 radial-gradient(circle at 80% 15%,rgba(40,183,239,.22),transparent 34%),
 linear-gradient(135deg,var(--navy) 0%,var(--navy2) 58%,#0a4674 100%);
 color:#fff;padding:105px 0}
.hero-grid{display:grid;grid-template-columns:1.28fr .72fr;gap:75px;align-items:center}
.eyebrow{display:inline-block;font-size:.78rem;letter-spacing:.16em;font-weight:800;color:#39b8f5;margin-bottom:12px}
h1{font-size:clamp(2.6rem,5vw,5.2rem);line-height:1.02;letter-spacing:-.04em;margin:0 0 24px}
h2{font-size:clamp(2rem,3vw,3.15rem);line-height:1.1;letter-spacing:-.025em;margin:0 0 18px}
h3{font-size:1.25rem;margin:0 0 10px}
.lead{font-size:1.25rem;line-height:1.7;max-width:720px;color:#d5e6f7}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:9px;text-decoration:none;font-weight:750;border:1px solid transparent;cursor:pointer}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:#2488e8}
.btn-secondary{border-color:rgba(255,255,255,.42);color:#fff;background:rgba(255,255,255,.06)}
.btn-light{background:#fff;color:var(--navy)}
.hero-card{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);padding:34px;border-radius:20px;box-shadow:0 30px 70px rgba(0,0,0,.23);backdrop-filter:blur(8px)}
.hero-card h2{font-size:1.9rem}
.hero-card p{color:#d9e6f2;line-height:1.6}
.pulse{width:12px;height:12px;border-radius:50%;background:#4ce49b;box-shadow:0 0 0 8px rgba(76,228,155,.13);margin-bottom:24px}
.status-row{display:flex;justify-content:space-between;gap:15px;padding:14px 0;border-top:1px solid rgba(255,255,255,.13);font-size:.95rem}
.status-row strong{color:#8ce9bb}
.section{padding:90px 0}
.section p{font-size:1.12rem;line-height:1.8;color:var(--muted)}
.alt{background:var(--bg)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:38px}
.cards article{background:#fff;padding:30px;border-radius:14px;border:1px solid #e0e8ef;box-shadow:0 10px 35px rgba(12,40,65,.06)}
.contact{background:linear-gradient(120deg,#0871c9,#13a5e5);color:#fff}
.contact-box{display:flex;justify-content:space-between;align-items:center;gap:30px}
.contact .eyebrow{color:#d9f4ff}.contact p{color:#e9f7ff}
footer{background:#021529;color:#b9cad9;padding:28px 0}
.footer-row{display:flex;justify-content:space-between;gap:20px}
.footer-row a{color:#fff;text-decoration:none}
@media(max-width:850px){
    nav a:not(.admin-link){display:none}
    .hero-grid{grid-template-columns:1fr;gap:35px}
    .cards{grid-template-columns:1fr}
    .contact-box,.footer-row{align-items:flex-start;flex-direction:column}
    .hero{padding:75px 0}
}

/* ==========================================================
   LINDHOLMSYSTEM-ABOUT-RUT-CSS-V2
   ========================================================== */

.ls-about-v2 {
    padding: 95px 4%;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(29, 144, 211, 0.14),
            transparent 34%
        ),
        #15191c;
}

.ls-section-container {
    width: min(1500px, 100%);
    margin: 0 auto;
}

.ls-section-label {
    display: block;
    margin-bottom: 18px;
    color: #43c8ff;
    font-size: 0.88rem;
    font-weight: 850;
    letter-spacing: 0.16em;
}

.ls-about-v2 h2,
.ls-rut-v2 h2 {
    max-width: 1050px;
    margin: 0 0 26px;
    color: #f7f5f1;
    font-size: clamp(2.2rem, 4.5vw, 4rem);
    line-height: 1.08;
}

.ls-about-lead {
    max-width: 1050px;
    margin: 0 0 20px;
    color: #d8e4ec;
    font-size: 1.3rem;
    line-height: 1.7;
}

.ls-about-text {
    max-width: 1100px;
    margin: 0 0 17px;
    color: #bfcbd3;
    font-size: 1.08rem;
    line-height: 1.8;
}

.ls-about-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin-top: 46px;
}

.ls-about-card {
    position: relative;
    padding: 30px;
    overflow: hidden;
    border: 1px solid rgba(65, 192, 246, 0.22);
    border-radius: 18px;
    background:
        linear-gradient(
            145deg,
            rgba(10, 54, 87, 0.92),
            rgba(5, 29, 48, 0.96)
        );
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.2);
}

.ls-card-number {
    color: rgba(74, 204, 255, 0.8);
    font-size: 0.84rem;
    font-weight: 850;
    letter-spacing: 0.12em;
}

.ls-about-card h3 {
    margin: 18px 0 13px;
    color: #ffffff;
    font-size: 1.45rem;
}

.ls-about-card p,
.ls-about-card li {
    color: #c9d7e0;
    line-height: 1.62;
}

.ls-about-card ul {
    margin: 20px 0 0;
    padding-left: 21px;
}

.ls-about-card li {
    margin: 9px 0;
}

/* Privatpersoner och RUT */

.ls-rut-v2 {
    padding: 95px 4%;
    color: #ffffff;
    background:
        radial-gradient(
            circle at 82% 15%,
            rgba(57, 210, 142, 0.2),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #06365d,
            #0878b4
        );
}

.ls-rut-container {
    width: min(1500px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns:
        minmax(0, 1.3fr)
        minmax(350px, 0.7fr);
    gap: 55px;
    align-items: center;
}

.ls-rut-lead {
    max-width: 900px;
    margin: 0 0 20px;
    color: #e3f0f7;
    font-size: 1.23rem;
    line-height: 1.72;
}

.ls-rut-content > p:not(.ls-rut-lead) {
    max-width: 900px;
    color: #d3e4ee;
    font-size: 1.06rem;
    line-height: 1.72;
}

.ls-rut-information {
    max-width: 900px;
    margin-top: 28px;
    padding: 21px 23px;
    border-left: 4px solid #69e6a9;
    border-radius: 9px;
    background: rgba(3, 27, 46, 0.58);
}

.ls-rut-information strong {
    color: #83eebe;
    font-size: 1.05rem;
}

.ls-rut-information p {
    margin: 8px 0 0;
    color: #d9e8f0;
    line-height: 1.65;
}

.ls-rut-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 31px;
}

.ls-rut-primary,
.ls-rut-secondary {
    display: inline-flex;
    min-height: 53px;
    align-items: center;
    justify-content: center;
    padding: 13px 24px;
    border-radius: 9px;
    text-decoration: none;
    font-weight: 800;
    transition:
        transform 0.15s ease,
        filter 0.15s ease;
}

.ls-rut-primary {
    color: #ffffff;
    background: #126fc0;
}

.ls-rut-secondary {
    border: 1px solid rgba(255, 255, 255, 0.42);
    color: #ffffff;
    background: rgba(3, 29, 49, 0.46);
}

.ls-rut-primary:hover,
.ls-rut-secondary:hover {
    transform: translateY(-2px);
    filter: brightness(1.09);
}

.ls-rut-card {
    padding: 35px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    background: rgba(3, 29, 49, 0.8);
    box-shadow: 0 30px 75px rgba(0, 0, 0, 0.25);
}

.ls-rut-badge {
    display: inline-flex;
    padding: 8px 13px;
    border-radius: 999px;
    color: #84ecbb;
    background: rgba(52, 202, 132, 0.15);
    font-size: 0.87rem;
    font-weight: 850;
}

.ls-rut-card h3 {
    margin: 20px 0;
    color: #ffffff;
    font-size: 1.65rem;
}

.ls-rut-card ul {
    margin: 0;
    padding-left: 22px;
}

.ls-rut-card li {
    margin: 13px 0;
    color: #d8e6ee;
    line-height: 1.55;
}

.ls-rut-disclaimer {
    margin: 24px 0 0;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    color: #abc3d1;
    font-size: 0.9rem;
    line-height: 1.6;
}

@media (max-width: 1050px) {
    .ls-about-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ls-rut-container {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .ls-about-v2,
    .ls-rut-v2 {
        padding: 68px 23px;
    }

    .ls-about-cards {
        grid-template-columns: 1fr;
    }

    .ls-about-card,
    .ls-rut-card {
        padding: 24px;
    }

    .ls-rut-buttons {
        flex-direction: column;
    }

    .ls-rut-primary,
    .ls-rut-secondary {
        width: 100%;
    }
}

/* LINDHOLMSYSTEM-MOBILE-HEADER-START */

/* Förhindrar att sidhuvudet skapar horisontell rullning */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

header,
.site-header,
.main-header,
.top-header {
    width: 100%;
    max-width: 100%;
}

header .container,
.site-header .container,
.main-header .container,
.header-inner,
.header-content,
.navbar {
    min-width: 0;
}

/* Logotypen får aldrig bli bredare än skärmen */
header .logo,
header .brand,
header .navbar-brand,
.site-header .logo,
.site-header .brand {
    min-width: 0;
    max-width: 100%;
    flex-shrink: 1;
}

header .logo img,
header .brand img,
header .navbar-brand img,
.site-header .logo img,
.site-header .brand img {
    display: block;
    width: auto;
    max-width: 240px;
    height: auto;
    object-fit: contain;
}

@media screen and (max-width: 760px) {
    header,
    .site-header,
    .main-header {
        height: auto !important;
        min-height: 0 !important;
    }

    header .container,
    .site-header .container,
    .main-header .container,
    .header-inner,
    .header-content,
    .navbar {
        display: flex;
        width: 100%;
        max-width: 100%;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding-left: 18px;
        padding-right: 18px;
    }

    header .logo img,
    header .brand img,
    header .navbar-brand img,
    .site-header .logo img,
    .site-header .brand img {
        max-width: 70vw;
        max-height: 68px;
    }

    header nav,
    .site-header nav,
    .main-header nav,
    .navbar-nav {
        display: flex;
        width: 100%;
        max-width: 100%;
        flex-wrap: nowrap;
        gap: 8px;
        justify-content: flex-start;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 6px 0 10px;
        white-space: nowrap;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }

    header nav a,
    .site-header nav a,
    .main-header nav a,
    .navbar-nav a {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}

@media screen and (max-width: 360px) {
    header .container,
    .site-header .container,
    .main-header .container,
    .header-inner,
    .header-content,
    .navbar {
        padding-left: 12px;
        padding-right: 12px;
    }

    header .logo img,
    header .brand img,
    header .navbar-brand img,
    .site-header .logo img,
    .site-header .brand img {
        max-width: 66vw;
        max-height: 58px;
    }
}

/* LINDHOLMSYSTEM-MOBILE-HEADER-END */
