/* ──────────────────────────────────────────────────────────────────────────
   BLOOMSCAPE — frontend-mall (organiskt/elegant). Scopad [data-template="bloomscape"].
   Design hämtad ur themixlyweb/react-vite-bloomscape-theme (MIT):
   Playfair Display-rubriker (serif) + Inter-brödtext, mjukt rundat, pill-knappar,
   luftiga sektioner, grön palett. Accent = loggans gröna #01ac3e.
   Byter UTSEENDE på våra befintliga sektioner — inget innehåll/struktur ändras.
   ────────────────────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

/* Tokens (html[data-template] slår :root-temat via högre specificitet) */
html[data-template="bloomscape"]{
  --ff-heading:'Manrope',system-ui,sans-serif;
  --ff-body:'Inter',system-ui,sans-serif;
  --brand:#01ac3e; --brand-deep:#018a33; --brand-rgb:1,172,62;
  --leaf:#3ddc6f;               /* ljusare grön highlight (motsv. bloomscapes lime) */
  --ink:#1b2a21; --ink-2:#394a40; --muted:#5d6b61;
  --line:rgba(27,42,33,.10);
  --radius:20px;
  --bg:#ffffff; --bg-soft:#f6f9f6;
  --deep:#14271b;              /* mörk grön (footer/cta) */
}

[data-template="bloomscape"] body{font-family:var(--ff-body);color:var(--ink-2)}

/* Rubriker — Playfair serif, elegant, normalläge */
[data-template="bloomscape"] h1,
[data-template="bloomscape"] h2,
[data-template="bloomscape"] h3,
[data-template="bloomscape"] h4{font-family:var(--ff-heading);font-weight:600;letter-spacing:-.01em;color:var(--ink);line-height:1.12}
[data-template="bloomscape"] h1{font-weight:700}
[data-template="bloomscape"] .subhero h1{font-size:clamp(34px,5vw,60px)}

/* Eyebrow — grön pill-etikett */
[data-template="bloomscape"] .eyebrow{
  color:var(--brand-deep);font-family:var(--ff-body);font-weight:600;
  text-transform:uppercase;letter-spacing:.12em;font-size:12.5px;
  background:rgba(var(--brand-rgb),.10);padding:6px 14px;border-radius:999px;display:inline-block;
}

/* Knappar — pill, grön solid + mjuk skugga (bloomscape rounded-full) */
[data-template="bloomscape"] .btn{border-radius:999px;font-family:var(--ff-body);font-weight:600;padding:13px 28px;transition:all .2s ease}
[data-template="bloomscape"] .btn--primary{background:var(--brand);color:#fff;border:1px solid var(--brand);box-shadow:0 10px 24px rgba(var(--brand-rgb),.26)}
[data-template="bloomscape"] .btn--primary:hover{background:var(--brand-deep);border-color:var(--brand-deep);transform:translateY(-2px);box-shadow:0 14px 30px rgba(var(--brand-rgb),.32)}
[data-template="bloomscape"] .btn--ghost{background:#fff;color:var(--ink);border:1.5px solid var(--line)}
[data-template="bloomscape"] .btn--ghost:hover{border-color:var(--brand);color:var(--brand-deep)}

/* Header/nav — mjuk, rundad pill. OBS: .nav-wrap är helbredds-containern (lämnas
   transparent); det är .nav som är den svävande pillen. */
[data-template="bloomscape"] .nav{border-radius:22px;border-color:var(--line)}
[data-template="bloomscape"] .nav__cta{border-radius:999px}

/* Startside-hero — bakgrundsbild (flytteliten_frontpage) med ljus transparens över,
   och mjuk övergång (fade) ner till nästa sektion. */
[data-template="bloomscape"] .hero{position:relative;isolation:isolate;background:var(--bg-soft)}
[data-template="bloomscape"] .hero::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background-image:url('/assets/img/services/flytteliten_frontpage.jpg');
  background-size:cover;background-position:center;
}
/* Ljus transparens-slöja över bilden så text blir läsbar + mjuk nedtoning mot nästa sektion */
[data-template="bloomscape"] .hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(255,255,255,.75) 0%,rgba(255,255,255,.70) 48%,rgba(246,249,246,.90) 88%,var(--bg) 100%);
}
/* Döljer ev. inbyggd .hero__bg/.bg-glow — vi använder vårt eget lager */
[data-template="bloomscape"] .hero .hero__bg,
[data-template="bloomscape"] .hero > .bg-glow{display:none}

/* Hero-hubbar — rundare + serif-etikett + grön hover-pil */
[data-template="bloomscape"] .hero-hub{border-radius:22px}
[data-template="bloomscape"] .hero-hub__label{font-family:var(--ff-heading);font-weight:600}
[data-template="bloomscape"] .hero-hub__arrow{color:var(--leaf)}

/* Subhero (alla övriga sidors hero) — samma bakgrundsbild + ljusa slöja som startsidans hero */
[data-template="bloomscape"] .subhero{position:relative;isolation:isolate;background:var(--bg-soft)}
[data-template="bloomscape"] .subhero::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background-image:url('/assets/img/services/flytteliten_frontpage.jpg');
  background-size:cover;background-position:center;
}
[data-template="bloomscape"] .subhero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(255,255,255,.80) 0%,rgba(255,255,255,.74) 50%,rgba(246,249,246,.92) 88%,var(--bg) 100%);
}
[data-template="bloomscape"] .subhero > .bg-glow{display:none}
[data-template="bloomscape"] .subhero__photo,
[data-template="bloomscape"] .subhero__photo--portrait{border-radius:28px;box-shadow:0 24px 60px rgba(27,42,33,.16)}
[data-template="bloomscape"] .subhero__answer,
[data-template="bloomscape"] .snabbsvar{background:var(--bg-soft);border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:18px}

/* Sektioner — luftigt */
[data-template="bloomscape"] .section{padding-block:clamp(52px,8vw,100px)}

/* Kort — mjukt rundade, luftig skugga, grön hover */
[data-template="bloomscape"] .card{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 6px 20px rgba(27,42,33,.05);transition:transform .2s ease,box-shadow .2s ease}
[data-template="bloomscape"] .card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(27,42,33,.12)}
[data-template="bloomscape"] .card__icon{color:var(--brand);background:rgba(var(--brand-rgb),.1);border-radius:16px}

/* Blockläge (tjänst/geo/område) */
[data-template="bloomscape"] .svc-block__label{color:var(--brand-deep);font-family:var(--ff-body);letter-spacing:.12em}
[data-template="bloomscape"] .svc-block__check{background:rgba(var(--brand-rgb),.14);color:var(--brand)}
[data-template="bloomscape"] .svc-block__aside{background:var(--bg-soft);border:1px solid var(--line);border-radius:22px;padding:28px}
[data-template="bloomscape"] .svc-block-row:nth-child(even){background:var(--bg-soft)}

/* Relaterat-kort */
[data-template="bloomscape"] .related-link{border-radius:22px;border:1px solid var(--line);border-left:4px solid var(--brand)}
[data-template="bloomscape"] .related-link__icon{background:rgba(var(--brand-rgb),.12);color:var(--brand);border-radius:50%}

/* Process-tidslinje */
[data-template="bloomscape"] .process__check{background:var(--brand);color:#fff}

/* FAQ */
[data-template="bloomscape"] .faq summary,
[data-template="bloomscape"] .faq__q{font-family:var(--ff-heading);font-weight:600}
[data-template="bloomscape"] .faq [open] summary,
[data-template="bloomscape"] .faq__item--open .faq__q{color:var(--brand-deep)}

/* Formulär — rundade fält, grön fokus */
[data-template="bloomscape"] .aside-form,
[data-template="bloomscape"] form.aside-form{border-radius:22px;border-top:4px solid var(--brand)}
[data-template="bloomscape"] input,
[data-template="bloomscape"] textarea,
[data-template="bloomscape"] select{border-radius:14px}
[data-template="bloomscape"] input:focus,
[data-template="bloomscape"] textarea:focus,
[data-template="bloomscape"] select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(var(--brand-rgb),.15);outline:none}

/* Pristabell */
[data-template="bloomscape"] .price-table{border-radius:18px;overflow:hidden}
[data-template="bloomscape"] .price-table .num{color:var(--brand-deep)}

/* CTA-strip — mörk grön med ljus pill-knapp */
[data-template="bloomscape"] .cta-strip{background:var(--deep);border-radius:28px}
[data-template="bloomscape"] .cta-strip h2{color:#fff;font-family:var(--ff-heading)}
[data-template="bloomscape"] .cta-strip .btn--primary{background:var(--leaf);color:var(--deep);border-color:var(--leaf)}

/* Footer — mörk grön */
[data-template="bloomscape"] .footer{background:var(--deep);color:#c3d2c8}
[data-template="bloomscape"] .footer h3,
[data-template="bloomscape"] .footer h4,
[data-template="bloomscape"] .footer strong{color:#fff;font-family:var(--ff-heading)}
[data-template="bloomscape"] .footer a:hover{color:var(--leaf)}

/* "Vilka vi är" — rundare bilder */
[data-template="bloomscape"] .home-about__img{border-radius:20px}

/* USP-kort ("Det här kan du räkna med") — mer interaktiva */
[data-template="bloomscape"] .grid-4 .card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
[data-template="bloomscape"] .grid-4 .card:hover{border-color:rgba(var(--brand-rgb),.5)}
[data-template="bloomscape"] .grid-4 .card:hover .card__icon{background:var(--brand);color:#fff;transform:scale(1.06)}
[data-template="bloomscape"] .grid-4 .card__icon{transition:background .2s ease,color .2s ease,transform .2s ease}

/* Process-CTA ("Begär en kostnadsfri offert") — distinkt bloomscape-design */
[data-template="bloomscape"] .process__cta{
  background:linear-gradient(145deg,var(--deep) 0%,#1d4030 100%);
  border-radius:26px;border:1px solid rgba(255,255,255,.08);overflow:hidden;box-shadow:0 22px 50px rgba(20,39,27,.35);
}
[data-template="bloomscape"] .process__cta-eyebrow{color:var(--leaf)}
[data-template="bloomscape"] .process__cta-title{font-family:var(--ff-heading);color:#fff}
[data-template="bloomscape"] .process__cta-sub,
[data-template="bloomscape"] .process__cta-list li{color:#d8e5dc}
[data-template="bloomscape"] .process__cta-list li svg{color:var(--leaf)}
[data-template="bloomscape"] .process__cta-action{background:var(--leaf);color:var(--deep);border-radius:999px;font-weight:700}
[data-template="bloomscape"] .process__cta:hover .process__cta-action{background:#fff}

/* Betyg/trust accent */
[data-template="bloomscape"] .aside-emblems__google-score{color:var(--brand-deep)}
