/* =========================================================
   CELEBRITIES ASSISTANT , KOMPONENTER
   Jourrad, sidfot, korttyper. Bygger på tokens.css och core.css.
   ========================================================= */

/* ---------------------------------------------------------
   JOURRAD , ovanför sidhuvudet, på varje sida
   Acceptanskrav: jourtelefonen ska synas utan scroll.
   --------------------------------------------------------- */
.ca-kontaktrad {
	background: var(--ca-brand-deep);
	color: var(--ca-text-invers);
	padding-inline: var(--ca-marginal);
}

/*
 * Kontakt till vanster, sprak till hoger.
 *
 * Raden var tidigare hogerstalld med allt i ett svep. Sprakvaljaren
 * flyttade hit fran menyn 2026-08-25, och da behovs tva grupper i
 * stallet: numret ska lasas forst, valet ska ligga i sin egen kant.
 *
 * Samma bredd som innehallet, --ca-bredd, till skillnad fran raden
 * under som far ga bredare. Det ar avsiktligt: kontaktraden ar smal
 * och en logga plus en meny ar det inte.
 */
.ca-kontaktrad__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--ca-rum-2) var(--ca-rum-6);
	max-width: var(--ca-bredd);
	margin-inline: auto;
	padding-block: var(--ca-rum-2);
}

.ca-kontaktrad__kontakt {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ca-rum-2) var(--ca-rum-6);
}

.ca-kontaktrad__sprak {
	display: flex;
	align-items: center;
	margin-inline-start: auto;
}

.ca-kontaktrad__text {
	margin: 0;
	font-size: var(--ca-text-xs);
	color: rgba(255, 255, 255, 0.85);
}

.ca-kontaktrad__nummer {
	display: inline-flex;
	align-items: center;
	gap: var(--ca-rum-2);
	min-height: 40px;
	color: var(--ca-text-invers);
	font-weight: 700;
	font-size: var(--ca-text-sm);
	text-decoration: none;
}

.ca-kontaktrad__nummer:hover,
.ca-kontaktrad__nummer:focus {
	color: var(--ca-text-invers);
	text-decoration: none;
}

.ca-kontaktrad__ikon svg {
	width: 18px;
	height: 18px;
	display: block;
}

.ca-kontaktrad__nummer:focus-visible {
	outline: 3px solid var(--ca-gul);
	outline-offset: 2px;
}

@media (max-width: 600px) {
	/* Pa smal skarm centreras kontakten och sprakvaljaren lagger sig
	   under den, i stallet for att klamma ihop bada pa en rad. */
	.ca-kontaktrad__inner   { justify-content: center; }
	.ca-kontaktrad__kontakt { justify-content: center; }
	.ca-kontaktrad__sprak   { margin-inline: auto; }
	.ca-kontaktrad__text    { width: 100%; text-align: center; }
}

/* ---------------------------------------------------------
   HERO
   --------------------------------------------------------- */
.ca-hero__devis {
	margin: 0 0 var(--ca-rum-3);
	font-size: var(--ca-text-sm);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ca-ockra);
}

.ca-hero__brodtext {
	font-size: var(--ca-text-lg);
	color: var(--ca-text);
}

/* ---------------------------------------------------------
   SEKTIONSRUBRIK , centrerad, som referenssajten
   --------------------------------------------------------- */
.ca-sektionshuvud {
	max-width: 62ch;
	margin-inline: auto;
	margin-bottom: var(--ca-rum-12);
	text-align: center;
}

.ca-sektionshuvud h2 {
	margin: 0 0 var(--ca-rum-4);
}

.ca-sektionshuvud p {
	max-width: none;
	margin: 0 auto;
	color: var(--ca-text-dampad);
	font-size: var(--ca-text-lg);
}

.ca-sektionshuvud__knappar {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--ca-rum-4);
	margin-top: var(--ca-rum-8);
}

/* ---------------------------------------------------------
   KORT
   --------------------------------------------------------- */
/* KORTEN SKA FYLLA SIN KOLUMN.

   Astra satter margin-left: auto och margin-right: auto pa allt som
   ligger tva niva'er under .entry-content, via selektorn
   .ast-page-builder-template .entry-content[data-ast-blocks-layout]
   > :not(.wp-block-group):where(...) > *.

   Pa ett rutnatsbarn betyder auto-marginaler "krymp till innehallet och
   centrera", inte "stracks ut". Foljden syntes pa /om-oss/, dar
   kortraden ligger direkt i innehallet: kolumnerna var jamna 282 px men
   korten blev 195, 205, 209, 221 och 260 px beroende pa hur langa
   namnen och e-postadresserna var. Inuti en .ca-sektion trafffade
   Astras regel sjalva raden i stallet for korten, sa startsidan sag
   ratt ut och felet var latt att missa.

   width: 100% loser det utan specificitetskrig: med en angiven bredd
   finns inget fritt utrymme kvar for auto-marginalerna att fordela. */
.ca-kortrad > .ca-kort {
	width: 100%;
}

.ca-kortrad--varm .ca-kort { background: var(--ca-varm); border-color: transparent; }
.ca-kortrad--bla  .ca-kort { background: var(--ca-bla-ljus); border-color: transparent; }

.ca-kort__eget-namn {
	margin: 0;
	font-size: var(--ca-text-xs);
	font-style: italic;
	color: var(--ca-text-dampad);
}

.ca-kort__adress,
.ca-kort__tider,
.ca-kort__roll {
	margin: 0;
	color: var(--ca-text-dampad);
	font-size: var(--ca-text-sm);
}

.ca-kort__tel a,
.ca-kort__mail a {
	font-weight: 600;
	word-break: break-word;
}

.ca-kort__tel,
.ca-kort__mail {
	margin: 0;
	font-size: var(--ca-text-sm);
}

.ca-kort__portratt img {
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	object-position: center top;
	border-radius: var(--ca-radie);
	display: block;
}

/* ---- Kontorskort ----

   KUNDFEEDBACK 2026-08-19: "Gor ett snyggt upplagg pa kontoren med
   ljusblaa rutor, ta bort las mer knapparna. Det kanns rorigt nu."

   Korten ar nu ljusblaa ytor utan ram, samma ton som juridikkorten och
   bokningsrutan. Utan knappen ar ortsnamnet kortets enda lank, sa den
   far bara rollen som knappen hade: hela kortet lyfter pa hover, och
   rubriken ar tydligt blaa. */
.ca-kortrad--kontor .ca-kort {
	background: var(--ca-bla-ljus);
	border-color: transparent;
	transition: background-color 0.18s ease;
}

.ca-kort--kontor h3 {
	font-size: var(--ca-text-xl);
}

/* Kortrubriker ska lasa som rubriker, inte som lankar mitt i en text.

   SPECIFICITETEN AR MEDVETET HOJD med .entry-content. Astra skriver
   ut .ast-single-post .entry-content a { text-decoration: underline }
   i sin dynamiska stilmall, alltsa tre klasser. En regel pa
   .ca-kort--kontor h3 a bar bara tva och forlorade tyst: ortsnamnen
   lag understrukna pa /kontakt/ men inte pa startsidan, eftersom
   kroppsklassen skiljer sig mellan sidtyperna. Regeln nedan tacker
   bada korttyperna och bada sidtyperna. */
.entry-content .ca-kortrad .ca-kort h3 a {
	text-decoration: none;
}

/* Fargen halls utanfor regeln ovan. Personkorten sätter color: inherit
   langre ned i filen, med lagre specificitet, och skulle annars fa
   lankblatt pa namnen. Ortsnamnen ska daremot vara blaa. */
.ca-kort--kontor h3 a {
	color: var(--ca-bla);
}

.entry-content .ca-kortrad .ca-kort h3 a:hover,
.entry-content .ca-kortrad .ca-kort h3 a:focus-visible {
	text-decoration: none;
	text-underline-offset: 0.15em;
}

/* Hela rutan svarar pa muspekaren, inte bara rubriken. :focus-within
   tacker tangentbordet: den som tabbar in i kortet ser samma markering
   som den som pekar pa det. */
.ca-kortrad--kontor .ca-kort:hover,
.ca-kortrad--kontor .ca-kort:focus-within {
	background: var(--ca-bla-ljus-2);
}

/* ---------------------------------------------------------
   SBF
   --------------------------------------------------------- */
.ca-cert__text { color: var(--ca-text-dampad); }

/* ---------------------------------------------------------
   LÄSSPALT PÅ VANLIGA SIDOR

   Sidorna körs i Astras page-builder-layout, alltså utan temats
   container, eftersom hero och sektioner ska gå ut i kanterna och
   bär sin egen sidmarginal. Konsekvensen är att vanlig brödtext
   annars skulle spänna hela skärmens bredd.

   Därför får allt direkt under .entry-content en läsbar spalt,
   UTOM våra egna fullbreddsblock, som uttryckligen undantas.
   --------------------------------------------------------- */
/* .ca-sektionslayout undantas: den bär sitt eget rutnät med en
   navigeringskolumn och en innehållskolumn, och sätter läsbredden
   på innehållet inuti. Utan undantaget kapades hela rutnätet till
   läsbredden och navigeringskolumnen klämdes ihop till ingenting. */
/* .ca-kortrad undantas också: kortrutnäten ska använda hela
   innehållsbredden (1200 px), inte läsbredden. Kapade till 736 px fick
   de bara plats med två kort per rad, vilket gav både onödig scrollning
   och stora tomma ytor i sidled. */
/* .ca-form och .ca-form-tack undantas: formuläret bär ett rutnät
   med produktkort och ärendekort. Kapat till läsbredden fick de bara
   plats två per rad, vilket gjorde formuläret onödigt högt. Det får en
   egen bredd i formular.css i stället. */
/* NYA SEKTIONSKLASSERNA MASTE OCKSA UNDANTAS.

   Regeln nedan har atta :not() och darmed specificitet 0,10,0. Den
   kapar allt i innehallet till lasbredden, och undantagslistan ar
   det enda sattet att slippa undan.

   Nar sektionssystemet i sektioner.css byggdes glomdes .ca-topp och
   .ca-s bort ur listan. Foljden blev att heron kapades till 736 px
   trots att bade sidmall.css och Astras egen fullbreddsmekanism sa
   nagot annat: 0,10,0 slar bada, och komponenter.css laddas dessutom
   sist. Tre forsok att losa det pa andra hall bet inte, eftersom
   felet aldrig lag dar.

   Lardomen ar den som redan star hogre upp i filen: en regel som
   maste vinna med atta :not() ar ett varningstecken, inte en losning.
   Nar det gamla systemet fasas ut ska den har regeln bort helt. */
.ast-page-builder-template .entry-content > *:not(.ca-hero):not(.ca-sektion):not(.ca-sektionslayout):not(.ca-kortrad):not(.ca-knapprad):not(.ca-form):not(.ca-form-tack):not(.ca-boka):not(.ca-topp):not(.ca-s) {
	max-width: min(var(--ca-lasbredd), 100% - 2.5rem);
	margin-inline: auto;
}

/* Kortrutnät och knapprader centreras mot innehållsbredden i stället. */
.ast-page-builder-template .entry-content > .ca-kortrad,
.ast-page-builder-template .entry-content > .ca-knapprad {
	max-width: min(var(--ca-bredd), 100% - 2.5rem);
	margin-inline: auto;
}

/* En knapprad är block-nivå.

   Jourknappen låg tidigare som ett naket <a> direkt i .entry-content.
   Den ärvde då reglerna ovan, men margin-inline: auto centrerar bara
   block-nivåboxar. Ett inline-flex-element ignorerar dem och hamnade
   längst ut i vänsterkanten, utanför spalten. */
.ca-knapprad {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ca-rum-4);
}

/* Knapprader som ligger i läsande text följer textspalten. */
.ca-knapprad--text {
	max-width: min(var(--ca-lasbredd), 100% - 2.5rem) !important;
}

/* Sidor som saknar hero behöver luft mot sidhuvudet. */
.ast-page-builder-template .entry-content > *:first-child:not(.ca-hero):not(.ca-sektionslayout):not(.ca-topp):not(.ca-s) {
	margin-block-start: var(--ca-sektion);
}

.ast-page-builder-template .entry-content > *:last-child:not(.ca-sektion):not(.ca-sektionslayout):not(.ca-topp):not(.ca-s) {
	margin-block-end: var(--ca-sektion);
}

/* Innanför en sektion styr .ca-innehall bredden i stället. */
.ca-innehall > * {
	max-width: var(--ca-radlangd);
}

.ca-innehall > h1,
.ca-innehall > h2,
.ca-innehall > h3 {
	max-width: none;
}

/* ---------------------------------------------------------
   KONTORSSIDA , faktarutor
   --------------------------------------------------------- */
.ca-kontorsfakta {
	display: grid;
	gap: var(--ca-rum-12);
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	max-width: var(--ca-bredd);
}

.ca-kontorsfakta > * { max-width: none; }

.ca-faktalista h2 {
	margin: 0 0 var(--ca-rum-4);
	font-size: var(--ca-text-xl);
}

.ca-faktalista h3 {
	margin: var(--ca-rum-6) 0 var(--ca-rum-1);
	font-size: var(--ca-text-lg);
}

.ca-faktalista dl {
	display: grid;
	grid-template-columns: minmax(90px, auto) 1fr;
	gap: var(--ca-rum-2) var(--ca-rum-6);
	margin: 0;
}

.ca-faktalista dt {
	font-weight: 600;
	color: var(--ca-text-dampad);
}

.ca-faktalista dd {
	margin: 0;
}

/* ---------------------------------------------------------
   EXTERNA LÄNKAR

   Öppnas i ny flik. WCAG 2.2 kriterium 3.2.5 säger att det inte
   ska ske utan förvarning, så länken bär både en dold upplysning
   för skärmläsare och den lilla ikonen nedan för seende.
   --------------------------------------------------------- */
.ca-extern::after {
	content: "";
	display: inline-block;
	width: 0.72em;
	height: 0.72em;
	margin-left: 0.35em;
	vertical-align: -0.02em;
	background-color: currentColor;
	opacity: 0.65;
	/* Pil som lämnar en ruta. Maskad SVG, så den ärver textfärgen
	   och fungerar lika bra på mörk som ljus botten. */
	-webkit-mask: var(--ca-extern-ikon) no-repeat center / contain;
	mask: var(--ca-extern-ikon) no-repeat center / contain;
}

:root {
	--ca-extern-ikon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3C/svg%3E");
}

/* Inuti en knapp sitter ikonen närmare texten och är lite tydligare. */
.ca-knapp.ca-extern::after {
	opacity: 0.9;
	margin-left: 0.45em;
}

/* ---------------------------------------------------------
   KARTA MED KLICK FÖR ATT LADDA

   Inget hämtas från Google innan besökaren bett om det. På en sajt
   där folk söker efter en avliden anhörig ska inga kakor sättas i
   förbifarten. Adressen står alltid som text ovanför, så kartan är
   ett komplement och aldrig enda bäraren av informationen.
   --------------------------------------------------------- */
.ca-karta {
	border: 1px solid var(--ca-kant);
	border-radius: var(--ca-radie);
	overflow: hidden;
	background: var(--ca-bla-ljus);
}

.ca-karta__knapp {
	display: flex;
	align-items: center;
	gap: var(--ca-rum-4);
	width: 100%;
	min-height: 120px;
	padding: var(--ca-rum-6);
	border: 0;
	background: transparent;
	color: var(--ca-text);
	font-family: inherit;
	text-align: left;
	cursor: pointer;
	transition: background-color 0.18s ease;
}

.ca-karta__knapp:hover,
.ca-karta__knapp:focus-visible {
	background: rgba(36, 54, 110, 0.07);
}

.ca-karta__ikon svg {
	width: 32px;
	height: 32px;
	color: var(--ca-bla);
	display: block;
}

.ca-karta__text {
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.ca-karta__text strong {
	color: var(--ca-bla);
	font-size: var(--ca-text-sm);
}

.ca-karta__text small {
	color: var(--ca-text-dampad);
	font-size: var(--ca-text-xs);
	line-height: 1.45;
}

.ca-karta--laddad { background: none; }

.ca-karta iframe {
	display: block;
	width: 100%;
	/* ⚠️ URSPRUNGSVARDET GICK FORLORAT 2026-08-25.
	   Ett for brett sed-kommando av mig skrev over height i fyra regler
	   i den har filen samtidigt. Tre gick att aterstalla sakert, den har
	   inte: det fanns ingen kopia och ingen parad bredd att harleda ur.

	   420 px ar ett vanligt matt for en inbaddad karta, och regeln ar
	   dod kod: ingen PHP i pluginet ritar .ca-karta, och sajten har inga
	   inbaddningar alls. Matt om och satt ratt varde den dag en karta
	   faktiskt laggs in. */
	height: 420px;
	border: 0;
}

.ca-karta__vag { margin-top: var(--ca-rum-4); }

/* ---------------------------------------------------------
   HERO UTAN BILD

   Bildmaterialet kommer från kunden och saknas ännu. Utan denna
   regel står högra spalten tom och heron ser trasig ut. Så fort
   en utvald bild sätts på sidan fylls kolumnen och tvåspaltigheten
   återkommer automatiskt.
   --------------------------------------------------------- */
.ca-hero__bild:empty { display: none; }

.ca-hero__inner:has(.ca-hero__bild:empty) {
	grid-template-columns: 1fr;
	max-width: 78ch;
}

/* Reservlösning för webbläsare utan :has(). Heron blir enspaltig
   och texten behåller en läsbar radlängd. */
@supports not selector(:has(*)) {
	.ca-hero__text { max-width: 78ch; }
}

/* ---------------------------------------------------------
   SIDFOT
   Kundkrav: SBF-märket och samtliga kontaktuppgifter ska ligga här.
   Uppgifterna hämtas från CPT:n kontor, aldrig handskrivna.
   --------------------------------------------------------- */
.ca-sidfot {
	background: var(--ca-brand-deep);
	color: var(--ca-text-invers);
	padding-block: var(--ca-rum-16) var(--ca-rum-8);
	padding-inline: var(--ca-marginal);
}

.ca-sidfot__inner {
	max-width: var(--ca-bredd);
	margin-inline: auto;
}

.ca-sidfot a {
	color: var(--ca-text-invers);
}

.ca-sidfot a:hover,
.ca-sidfot a:focus {
	color: var(--ca-text-invers);
	text-decoration: none;
}

.ca-sidfot :focus-visible {
	outline: 3px solid var(--ca-gul);
	outline-offset: 2px;
}

.ca-sidfot__topp {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--ca-rum-8);
	padding-bottom: var(--ca-rum-8);
	border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.ca-sidfot__namn {
	margin: 0;
	font-size: var(--ca-text-xl);
	font-weight: 700;
}

/* ---- Logotyper ---- */
/*
 * ⚠️ MATTEN AR OMRAKNADE FOR KUNDENS EGEN LOGGA 2026-08-25.
 *
 * De gamla varden (78 px huvud, 96 px sidfot) hordde till forlagans
 * logga, som var nastan kvadratisk. Celebrities Assistants ordbild ar
 * 449,56 x 54,75, alltsa 8,2:1. Vid 78 px hojd hade den blivit 640 px
 * BRED och atit upp hela sidhuvudsraden.
 *
 * En hojd i sig sager alltsa ingenting. Det som styr ar bredden, och
 * darfor raknas alla varden harifran:
 *
 *   26 px hojd -> 266 px bred   sidhuvud, skrivbord
 *   20 px hojd -> 204 px bred   sidhuvud, telefon
 *   20 px hojd -> 204 px bred   sidfot
 *
 * Varden satta av Thomas 2026-08-25 pa oga, efter att ha sett dem i
 * webblasaren. Den forsta omgangen satte 34 och 40, vilket var for
 * stort for en ordbild sa har bred: den tog over huvudet och konkurrerade
 * med menyn i stallet for att rama in den.
 *
 * Kunden levererade tre filer 2026-08-25. Ordbilden ar nu 510,01 x
 * 49,94, alltsa 10,21:1 och ANNU bredare an foregaende. Matten ar
 * omraknade darefter, och menyraden ar uppmatt sa att den inte bryter.
 *
 * Rakna om harifran om filen nagon gang byts mot en med annan rityta.
 */
.ca-logo {
	display: block;
	width: auto;
	height: 26px;
	max-width: 100%;
}

@media (max-width: 600px) {
	.ca-logo { height: 20px; }
}

.ca-sidfot__logo {
	display: inline-block;
	text-decoration: none;
}

/* Sidfotens logotyp ar en ANNAN fil an sidhuvudets.
   ca-logo-negativ.svg ar samma vektor, ingen bana rord, men ordbilden
   ar vit i stallet for #232629 och accenten uppljusad.

   VARFOR ACCENTEN MASTE LJUSAS UPP: originalets rosa #b2487d ligger pa
   2,90:1 mot sidfotens #43192E, alltsa gyttjigt. #D18FB0 ar samma
   kulort och mattnad, bara ljusare, och matte 5,82:1.

   Den morka ordbilden hade legat pa 1,03:1, alltsa helt osynlig. Det ar
   darfor det finns tva filer och inte en. */
.ca-sidfot__logo .ca-logo { height: 20px; }

.ca-cert-logo {
	width: 78px;
	height: auto;
	flex: 0 0 auto;
}

/* Sidhuvudets logotyp. Astra sätter egna marginaler på sidtiteln. */
.site-title { margin: 0 !important; line-height: 1 !important; }
.site-title a { display: inline-block; text-decoration: none; }

.ca-sidfot__jour { text-align: right; }

.ca-sidfot__jour-etikett {
	margin: 0;
	font-size: var(--ca-text-xs);
	color: rgba(255, 255, 255, 0.8);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.ca-sidfot__jour-nummer {
	display: block;
	font-size: var(--ca-text-2xl);
	font-weight: 700;
	text-decoration: none;
	line-height: 1.2;
}

.ca-sidfot__mail {
	display: block;
	font-size: var(--ca-text-sm);
}

.ca-sidfot__rubrik {
	margin: var(--ca-rum-8) 0 var(--ca-rum-6);
	color: var(--ca-text-invers);
	font-size: var(--ca-text-lg);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.ca-sidfot__kontorslista {
	display: grid;
	gap: var(--ca-rum-6);
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
}

.ca-sidfot__kontorslista li {
	max-width: none;
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-size: var(--ca-text-sm);
}

.ca-sidfot__ort {
	font-weight: 700;
	text-decoration: none;
}

.ca-sidfot__eget,
.ca-sidfot__adress {
	color: rgba(255, 255, 255, 0.78);
}

.ca-sidfot__eget { font-style: italic; font-size: var(--ca-text-xs); }

.ca-sidfot__tel { font-weight: 600; }

.ca-sidfot__botten {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ca-rum-8);
	justify-content: space-between;
	margin-top: var(--ca-rum-12);
	padding-top: var(--ca-rum-8);
	border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.ca-sidfot__cert {
	display: flex;
	align-items: flex-start;
	gap: var(--ca-rum-4);
	max-width: 46ch;
}

.ca-sidfot__cert p {
	margin: 0;
	max-width: none;
	font-size: var(--ca-text-xs);
	color: rgba(255, 255, 255, 0.85);
}

/* SBF-märket ligger i sin vita version direkt på den blå ytan.
   Ingen vit platta bakom, märket är redan gjort för mörk botten. */

/*
 * Ar metablocket ensamt i botten, alltsa nar certrutan ar dold som den ar
 * for den har kunden, ska det vansterstallas. Utan detta hamnade
 * copyrighten centrerad under en vansterstalld lankrad, eftersom
 * placeringen forutsatte att nagot annat lag till vanster om den.
 */
/*
 * Sidfotens understa rad.
 *
 * ⚠️ EN RAD, INTE TRE. Juridiska lankar, aret verksamheten startade och
 * copyrighten lag pa var sin rad och at nastan hundra pixlar hojd i en
 * sidfot som redan ar hog. Allt tre ar finstilt, och finstilt ska ta
 * finstilt plats.
 *
 * Lankarna till vanster, de tva pastaendena skjutna till hoger med
 * margin-inline-start: auto pa det forsta. Rangordningen bars tidigare
 * av ordningsfoljden, nu bar den av vikt och farg i stallet: raden om
 * 2016 ar helvit, copyrighten dampad.
 *
 * flex-wrap gor att de staplar sig igen av sig sjalva pa smal skarm,
 * dar en rad inte far plats. Ingen brytpunkt behovs.
 *
 * Kolumnlayouten fanns for forlagans sidfot, som hade sociala ikoner
 * och ett certifikatmarke i samma block. Den har kunden har varken.
 */
.ca-sidfot__meta {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
	column-gap: var(--ca-rum-6);
	row-gap: var(--ca-rum-2);
	text-align: start;
	width: 100%;
}

.ca-sidfot__meta > .ca-sidfot__juridisk { order: 1; }

.ca-sidfot__meta > .ca-sidfot__sedan {
	order: 2;
	margin: 0;
	margin-inline-start: auto;
}

.ca-sidfot__meta > .ca-sidfot__copyright { order: 3; margin: 0; }

/* Under 900 px far raden inte plats. Da staplar den, vanstersttalld,
   och pastaendena ska inte langre skjutas at hoger. */
@media (max-width: 900px) {
	.ca-sidfot__meta > .ca-sidfot__sedan { margin-inline-start: 0; }
}

.ca-sidfot__sociala,
.ca-sidfot__juridisk-lista {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: var(--ca-rum-4);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--ca-text-xs);
}

.ca-sidfot__sociala li,
.ca-sidfot__juridisk-lista li { max-width: none; }

.ca-sidfot__copyright {
	margin: 0;
	max-width: none;
	font-size: var(--ca-text-xs);
	color: rgba(255, 255, 255, 0.7);
}

/*
 * Raden om att verksamheten startade 2016.
 *
 * Nagot ljusare an copyrighten ovanfor, inte morkare. Det ar den enda
 * raden i sidfoten som sager nagot om foretaget snarare an om sajten,
 * och den ska lasas, inte gommas i finstilten. Den ar anda mindre an
 * lanklistorna, sa den tar inte over.
 */
.ca-sidfot__sedan {
	margin: 0 0 var(--ca-rum-2);
	max-width: none;
	font-size: var(--ca-text-sm);
	color: #fff;
}

/*
 * Aret ar det enda i sidfoten som ar ett argument. Det far bara den
 * betoning fetstil ger, ingen egen farg: en accentfarg pa ett arta i en
 * sidfot laser som en lank, och den gar inte att klicka pa.
 */
.ca-sidfot__sedan strong { font-weight: 700; }

@media (max-width: 720px) {
	.ca-sidfot__topp,
	.ca-sidfot__botten { flex-direction: column; }

	.ca-sidfot__jour { text-align: left; align-items: flex-start; }

	.ca-sidfot__sociala,
	.ca-sidfot__juridisk-lista { justify-content: flex-start; }
}

/* ---------------------------------------------------------
   404
   Astras standard gav ingen vag vidare, saknade main-landmarke
   och hade en sokknapp pa 15 x 21 px. Den som landar har kom
   oftast fran en gammal lank till ett paket som bytt namn, och
   ska darfor mota tjanstelistan och inte en atervandsgrand.
   --------------------------------------------------------- */
.ca-404 {
	max-width: var(--ca-bredd);
	margin-inline: auto;
	padding-inline: var(--ca-marginal);
	padding-block: var(--ca-sektion);
}

.ca-404 h2 {
	margin-top: var(--ca-rum-16);
	font-size: var(--ca-text-2xl);
}

.ca-404 .ca-kortrad { margin-top: var(--ca-rum-8); }

.ca-404__orter {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ca-rum-3);
	margin: var(--ca-rum-6) 0 0;
	padding: 0;
	list-style: none;
}

.ca-404__orter li { max-width: none; }

.ca-404__orter a {
	display: inline-flex;
	align-items: center;
	min-height: var(--ca-traffyta);
	padding: 0 var(--ca-rum-5);
	border: 1px solid var(--ca-kant);
	border-radius: var(--ca-radie);
	background: var(--ca-vit);
	font-weight: 600;
	text-decoration: none;
}

.ca-404__orter a:hover,
.ca-404__orter a:focus-visible {
	border-color: var(--ca-bla);
	background: var(--ca-bla-ljus);
}

/* Sokfaltet: WCAG 2.2 kraver minst 24 x 24 px traffyta. */
.ca-404 .search-form,
.ca-404 .wp-block-search__inside-wrapper {
	display: flex;
	gap: var(--ca-rum-2);
	max-width: 34rem;
	margin-top: var(--ca-rum-4);
}

.ca-404 .search-field,
.ca-404 input[type="search"] {
	flex: 1;
	min-height: var(--ca-traffyta);
	padding: 0 var(--ca-rum-4);
	border: 1px solid var(--ca-kant);
	border-radius: var(--ca-radie);
}

.ca-404 .search-submit,
.ca-404 button[type="submit"] {
	min-height: var(--ca-traffyta);
	min-width: var(--ca-traffyta);
	padding-inline: var(--ca-rum-6);
	border: 0;
	border-radius: var(--ca-radie);
	background: var(--ca-bla);
	color: var(--ca-vit);
	font-weight: 600;
	cursor: pointer;
}

/* ---------------------------------------------------------
   SMA TRAFFYTOR, WCAG 2.2 kriterium 2.5.8 (minst 24 x 24 px)
   Uppmatt i granskningen: sidfotslankar 18 px, brodsmulan
   "Hem" 21 px.
   --------------------------------------------------------- */
.ca-sidfot__sociala a,
.ca-sidfot__juridisk-lista a,
.ca-sidfot__cert a,
.ca-brodsmulor a,
.ca-brodsmulor [aria-current="page"] {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
}

/* ---------------------------------------------------------
   PLATSHALLARPORTRATT

   Fem av elva medarbetare saknar foto. Utan platshallare blev
   korten olika hoga och raden lases som ofardig. Initialerna
   i varumarkesfargerna har samma bildformat som ett riktigt
   portratt, sa rutnatet haller ihop tills bilderna kommer.
   --------------------------------------------------------- */
/* KUNDFEEDBACK 2026-08-19: "Forminska bilderna pa personal sa den inte
   klipper huvuden."

   ORSAKEN var inte storleken utan bildformatet. Samtliga elva portratt
   ar 400x600, alltsa 2:3. Ramen har var 4:5. Med object-fit: cover
   skalades bilden till ramens bredd, blev for hog, och overskottet
   kapades halften i overkant och halften i underkant. Pa tva av
   portratten hamnade snittet rakt genom haret.

   Ramen har nu samma format som filerna, 2:3, sa ingenting beskars.
   object-position: center top ar ett skyddsnat: laggs det nagon gang in
   ett portratt med annat format kapas det i underkant, aldrig i huvudet.

   Ramen kapas dessutom till 210 px och centreras. Ett 2:3-portratt i
   full kortbredd hade blivit 393 px hogt och tagit over hela raden.
   Bilden blir alltsa mindre, precis som kunden bad om, och korten
   kortare. */
.ca-kort__portratt {
	position: relative;
	aspect-ratio: 2 / 3;
	max-width: 210px;
	margin-inline: auto;
	width: 100%;
	border-radius: var(--ca-radie);
	overflow: hidden;
	background: var(--ca-bla-ljus);
}

.ca-kort__initialer {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ca-bla);
	font-size: clamp(2rem, 1rem + 4vw, 3rem);
	font-weight: 700;
	letter-spacing: 0.04em;
	opacity: 0.42;
}

/* Korten i en personrad ska bli lika hoga och innehallet ligga
   uppifran, inte tryckas ned av flexens fria utrymme. */
.ca-kortrad--personer .ca-kort {
	justify-content: flex-start;
}

.ca-kortrad--personer .ca-kort h3 {
	margin-top: var(--ca-rum-1);
}

/* ---------------------------------------------------------
   FULLBREDD UTAN VIT RAM

   Astras <article> bar padding: 36px 20px 0 20px, vilket gav en
   vit ram runt hero och sektioner. Uppmatt: heron borjade pa
   x=20 i stallet for x=0 och hade 36 px vitt ovanfor.

   Sidorna kor page-builder-layout, sa temats egen padding fyller
   ingen funktion. Vara egna block bar sin padding sjalva.
   --------------------------------------------------------- */
.ast-single-post.ast-page-builder-template .site-main > article,
.ast-page-builder-template .site-main > article,
.ast-page-builder-template .ast-article-single {
	padding: 0;
}

/* ---------------------------------------------------------
   HERO MED FOTO

   Bilden kommer fran sidans utvalda bild via --ca-hero-bild.
   Scrim i varumarkets marinbla, starkast dar texten star, sa att
   den halls lasbar oavsett vad som hander i motivet. Tonen ar
   lugn och inte skrikig: bilden far synas.
   --------------------------------------------------------- */
.ca-hero--foto {
	position: relative;
	background-color: var(--ca-bla-mork);
	background-image: var(--ca-hero-bild, none);
	background-size: cover;
	background-position: center 62%;
	background-repeat: no-repeat;
	isolation: isolate;
}

.ca-hero--foto::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(
		100deg,
		rgba(20, 28, 46, 0.94) 0%,
		rgba(20, 28, 46, 0.86) 34%,
		rgba(20, 28, 46, 0.52) 62%,
		rgba(20, 28, 46, 0.18) 100%
	);
}

.ca-hero--foto .ca-hero__inner { min-height: 22rem; }

.ca-hero--foto .ca-hero__titel,
.ca-hero--foto h1,
.ca-hero--foto h2 {
	color: var(--ca-vit);
}

.ca-hero--foto .ca-hero__brodtext,
.ca-hero--foto .ca-hero__underrubrik,
.ca-hero--foto p {
	color: rgba(255, 255, 255, 0.92);
}

.ca-hero--foto .ca-hero__devis { color: var(--ca-gul); }

/* Sekundarknappen behover vit kant mot den morka ytan. */
.ca-hero--foto .ca-knapp--sekundar {
	border-color: rgba(255, 255, 255, 0.7);
	color: var(--ca-vit);
}

.ca-hero--foto .ca-knapp--sekundar:hover,
.ca-hero--foto .ca-knapp--sekundar:focus {
	background: var(--ca-vit);
	color: var(--ca-bla);
}

.ca-hero--foto .ca-jour,
.ca-hero--foto .ca-jour:hover {
	color: var(--ca-vit);
}

.ca-hero--foto :focus-visible {
	outline-color: var(--ca-gul);
}

/* Pa smal skarm loper texten over hela bredden, sa scrimen gar
   nedifran i stallet for fran sidan.

   Scrimen ar ocksa starkare an pa stor skarm. Skalet ar motivet: pa
   bredd hamnar solreflexen till hoger om textspalten, men nar bilden
   beskars till 390 px hamnar den rakt bakom brodtexten. Uppmatt
   kontrast dar var 3,4:1 med den tidigare scrimen, alltsa under
   WCAG 1.4.3. Bildutsnittet flyttas dessutom upp mot himlen. */
@media (max-width: 767px) {
	.ca-hero--foto {
		background-position: center 34%;
	}

	.ca-hero--foto::before {
		background: linear-gradient(
			180deg,
			rgba(20, 28, 46, 0.78) 0%,
			rgba(20, 28, 46, 0.93) 46%,
			rgba(20, 28, 46, 0.96) 100%
		);
	}

	.ca-hero--foto .ca-hero__inner { min-height: 0; }
}

/* Textspalten i en foto-hero kapas, av tva skal: radlangden blir
   lasbar, och motivet till hoger far synas i stallet for att skymmas
   av text. Scrimen ar starkast just dar texten star. */
.ca-hero--foto .ca-hero__text {
	max-width: 40rem;
}

.ca-hero--foto .ca-hero__brodtext,
.ca-hero--foto .ca-hero__underrubrik,
.ca-hero--foto .ca-hero__titel {
	max-width: none;
}

@media (max-width: 767px) {
	.ca-hero--foto .ca-hero__text { max-width: none; }
}

/* ---------------------------------------------------------
   PRODUKTKORT , paket och tjänster

   Bilden ligger i kortets överkant och går ut i kanterna, så
   kortet läses som en produkt och inte som en textruta.
   --------------------------------------------------------- */
/* Fast antal kolumner i stället för auto-fit.
   Produktrutnätet ligger i innehållskolumnen bredvid sektionsnavet,
   alltså på cirka 740 px. Med auto-fit och minmax(260px) blev det två
   kort per rad och en onödigt lång sida. Tre kolumner är deterministiskt
   och ger samma resultat oavsett var rutnätet placeras. */
.ca-kortrad--produkt {
	grid-template-columns: repeat(var(--ca-produktkolumner, 3), minmax(0, 1fr));
	gap: var(--ca-rum-4);
}

@media (max-width: 900px) {
	.ca-kortrad--produkt { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
	.ca-kortrad--produkt { grid-template-columns: 1fr; }
}

.ca-kort--produkt {
	padding: 0;
	overflow: hidden;
}

.ca-kort__bild {
	margin: 0;
	background: var(--ca-varm);
}

.ca-kort__bild img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* Utan foto: ingen bildyta, bara en smal färgkant i överkant.
   Se motiveringen i inc/produkt.php. */
.ca-kort--utan-bild {
	border-top: 4px solid var(--ca-ockra);
}

.ca-kort__text {
	display: flex;
	flex-direction: column;
	gap: var(--ca-rum-2);
	padding: var(--ca-rum-6);
	flex: 1;
}

.ca-kort__titel {
	margin: 0;
	font-size: var(--ca-text-lg);
}

.ca-kort__pris {
	margin: 0;
	font-size: var(--ca-text-lg);
	font-weight: 700;
	color: var(--ca-bla);
}

.ca-kort__brod {
	margin: 0;
	color: var(--ca-text-dampad);
	font-size: var(--ca-text-sm);
}

/* Faktaraden hakas i kortets underkant, så att Material och Färg
   ligger på samma höjd över hela raden även när beskrivningarna är
   olika långa. */
.ca-kort__fakta {
	margin: auto 0 0;
	padding: var(--ca-rum-3) 0 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--ca-rum-1) var(--ca-rum-4);
}

.ca-kort__fakta li {
	margin: 0;
	font-size: var(--ca-text-xs);
	color: var(--ca-text-dampad);
}

/* ---------------------------------------------------------
   MEDARBETARSIDA
   --------------------------------------------------------- */
.ca-hero__inner--person {
	grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
	align-items: center;
}

.ca-hero__portratt {
	max-width: 260px;
}

.ca-person__bild {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: var(--ca-radie);
}

.ca-person__initialer {
	display: grid;
	place-items: center;
	aspect-ratio: 4 / 5;
	border-radius: var(--ca-radie);
}

.ca-hero--person .ca-hero__devis {
	color: var(--ca-bla);
}

.ca-hero--person .ca-hero__underrubrik {
	margin: 0 0 var(--ca-rum-3);
	font-size: var(--ca-text-lg);
	color: var(--ca-text-dampad);
}

@media (max-width: 700px) {
	.ca-hero__inner--person { grid-template-columns: 1fr; }
	.ca-hero__portratt { max-width: 200px; }
}

/* ---------------------------------------------------------
   PLATSHÅLLARE FÖR EJ BYGGD INBÄDDNING

   Syns bara för inloggade. Filtret i inc/inbaddning.php tar bort
   rutan ur HTML:en för besökare, så det här är enbart utseende
   för redaktören. Streckad kant och ockra, alltså tydligt skild
   från allt annat på sidan, så att den inte kan misstas för
   publicerat innehåll.
   --------------------------------------------------------- */
.ca-platshallare {
	max-width: var(--ca-lasbredd);
	margin: var(--ca-rum-12) auto;
	padding: var(--ca-rum-8) var(--ca-rum-6);
	border: 2px dashed var(--ca-ockra);
	border-radius: var(--ca-radie);
	background: var(--ca-varm);
	color: var(--ca-ockra);
	text-align: center;
}

.ca-platshallare p {
	margin: 0;
	font-size: var(--ca-text-sm);
}

/* Omslag runt leverantörens anmälningsformulär. Centreringen
   och bredden sköts av .ca-inbaddning--fast i inbaddning.css,
   här behövs bara luften runt omkring. */
.ca-anmalan {
	margin-block: var(--ca-rum-12);
}

/* Namnlänken i medarbetarkortet. Ska läsa som en rubrik, inte som
   en länk mitt i texten, men fortfarande vara tydligt klickbar. */
.ca-kortrad--personer .ca-kort h3 a {
	color: inherit;
	text-decoration: none;
}

.ca-kortrad--personer .ca-kort h3 a:hover,
.ca-kortrad--personer .ca-kort h3 a:focus-visible {
	text-decoration: none;
	text-underline-offset: 0.15em;
}

/* ---------------------------------------------------------
   BOKNINGSRUTAN , sidornas avslut

   Kundfeedback 2026-08-19: undersidorna slutade med en H2, ett
   stycke och en lös knapp, och lastes som roriga. Avslutet ar nu
   en lugn ruta i den ljusblaa varumarkestonen. Se inc/boka.php
   for varfor rubriken ar ett <p> och inte en rubriknivaa.

   Fargen ar --ca-bla-ljus, samma som juridikkorten. Rutan ska
   lasa som en inbjudan, inte som en varning: ingen ram, ingen
   skugga, ingen accentfarg pa ytan.
   --------------------------------------------------------- */
.ca-boka {
	background: var(--ca-bla-ljus);
	border-radius: var(--ca-radie-stor);
	padding: var(--ca-rum-12) var(--ca-rum-8);
	text-align: center;
}

.ca-boka__inner {
	max-width: 44rem;
	margin-inline: auto;
}

.ca-boka__rubrik {
	margin: 0 0 var(--ca-rum-3);
	color: var(--ca-bla);
	font-size: var(--ca-text-2xl);
	font-weight: 700;
	line-height: var(--ca-radhojd-rubrik);
}

.ca-boka__text {
	margin: 0 auto;
	max-width: 38rem;
	color: var(--ca-text);
	font-size: var(--ca-text-bas);
}

.ca-boka__knappar {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--ca-rum-4);
	margin: var(--ca-rum-8) 0 0;
}

/* Sekundarknappen star mot ljusblaa botten och behover en tydlig
   kant for att lasa som en knapp och inte som brodtext. */
.ca-boka .ca-knapp--sekundar {
	background: var(--ca-vit);
}

@media (max-width: 600px) {
	.ca-boka {
		padding: var(--ca-rum-8) var(--ca-rum-5);
	}

	/* Knapparna staplas hellre an bryts pa mitten. */
	.ca-boka__knappar .ca-knapp {
		width: 100%;
	}
}

/* Rutan ar bredare an lasspalten, men smalare an sektionsbredden.
   Utan undantaget nedan kapas den till 46 rem och den inre
   textspalten far da ingen luft kvar i sidled. */
.ast-page-builder-template .entry-content > .ca-boka {
	max-width: min(58rem, 100% - 2.5rem);
	margin-inline: auto;
	margin-block: var(--ca-sektion);
}

/* Ligger rutan sist i dokumentet behovs andaa luft under den, annars
   klistras den mot sidfoten. */
.ast-page-builder-template .entry-content > .ca-boka:last-child {
	margin-block-end: var(--ca-sektion);
}

/* Inuti en sektion bar sektionen luften. Rutan behover bara sin bredd,
   annars spanner den hela innehallsbredden pa 1200 px och den centrerade
   texten far en orimligt lang radlangd. */
.ca-sektion > .ca-boka {
	max-width: min(58rem, 100%);
	margin-inline: auto;
}

/* ---------------------------------------------------------------
   Copy-klasser
   ---------------------------------------------------------------
   .ca-lead   ingressen under H1
   .ca-lucka  markerad lucka i copyn, dar underlag saknas

   VARFOR .ca-lucka SYNS SA TYDLIGT: den ska vara omojlig att
   missa vid granskning och omojlig att rakla med ut i produktion.
   Alternativet, att fylla i en gissning, ar det enda som ar varre.
   --------------------------------------------------------------- */
.ca-lead {
	font-size: var(--ca-text-lg);
	line-height: 1.55;
	color: var(--ca-ink-dampad);
	max-width: 42rem;
}

.ca-lucka {
	border-left: 3px solid var(--ca-fel);
	background: var(--ca-surface);
	padding: var(--ca-rum-3) var(--ca-rum-4);
	color: var(--ca-ink);
	font-size: var(--ca-text-sm);
}

.ca-lucka strong {
	color: var(--ca-fel);
	letter-spacing: .04em;
}

/* ---------- Kort formular, provet ----------
   Added 2026-08-25. Den som redan bestamt sig for att prova nagot
   gratis ska inte motas av fyra falt och en stjarna. */
/* 🐛 Bada, inte bara faltet. Klassen sätts pa raden som halier namn och
   telefon, och en regel som bara traffade .ca-form__falt lamnade dem
   kvar pa skarmen med bara stjarnan borttagen. */
.ca-form__falt.ar-dold,
.ca-form__rad.ar-dold,
.ca-form__grenval.ar-dold { display: none; }

.ca-form__gren--profil .ca-form__falt { max-width: 34rem; }

.ca-form__gren--profil input {
	font-size: 1.05rem;
}

/* Rubriken ovanfor det korta formularet. Smal, sa den laser som en
   etikett pa formularet och inte som en ny sektion att ta sig igenom. */
.ca-form-topp {
	max-width: 46rem;
	margin-block-end: var(--ca-rum-5);
}

.ca-form-topp h2 { margin-block: var(--ca-rum-2) var(--ca-rum-3); }
.ca-form-topp p { color: var(--ca-ink-dampad); margin: 0; }

/* ---------- Sidfotens lankkolumner ----------
   Added 2026-08-25. Ligger mellan varumarkesraden och den juridiska
   raden, och ar darfor det enda i sidfoten som vaxer med sajten. */
.ca-sidfot__kolumner {
	display: grid;
	gap: var(--ca-rum-6);
	grid-template-columns: 1fr;
	padding-block: var(--ca-rum-6);
	border-block-start: 1px solid rgba(255, 255, 255, .16);
}

@media (min-width: 640px) {
	.ca-sidfot__kolumner { grid-template-columns: repeat(3, 1fr); }
}

.ca-sidfot__kolumn-rubrik {
	margin: 0 0 var(--ca-rum-3);
	font-size: .78rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .62);
	font-weight: 600;
}

.ca-sidfot__kolumn ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }

.ca-sidfot__kolumn a {
	color: var(--ca-text-invers, #fff);
	text-decoration: none;
}

.ca-sidfot__kolumn a:hover,
.ca-sidfot__kolumn a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }

/* ---------------------------------------------------------
   SIDHUVUDETS BREDD
   ---------------------------------------------------------
   Astra later sidhuvudsraden folja innehallets bredd, 1240 px.
   Det racker sa lange menyn ar kort. Med VIP inlagt blev raden
   for lang och sprakvaxlaren foll ner pa egen rad, vilket gjorde
   sidhuvudet 275 px hogt pa varje sida.

   ⚠️ BARA SIDHUVUDET VIDGAS, inte innehallet. Loptext ska ha kvar
   sin radlangd, det ar vad --ca-bredd finns for. Ett sidhuvud ar
   ingen loptext: det ar en logga i ena kanten och en meny i den
   andra, och det mar bra av att anvanda skarmen.

   🐛 BARA DEN YTTRE BEHALLAREN. En forsta version satte max-width
   pa .ast-builder-grid-row-container-inner ocksa. Det ar sjalva
   rutnatet, och att lasa dess bredd fick loggans kolumn att brytas
   ner UNDER menyn. Menyraden sag da perfekt ut, vilket ar precis
   varfor felet var latt att missa: det som gick sonder lag utanfor
   utsnittet man tittade pa.

   min() ger ett tak sa raden inte glesas ut pa en bred skarm, och
   2 rem luft mot kanten pa allt smalare an sa.
   --------------------------------------------------------- */
.site-primary-header-wrap.ast-builder-grid-row-container {
	max-width: min(1560px, calc(100% - 2rem));
}

/* Toppmenyn på en rad, 2026-09-17. Med Case studies blev det åtta poster,
   och Astras 18 px padding och 18 px text bröt menyn till två rader även
   på 1440 px. Tätare poster från den bredd där desktopmenyn visas. */
@media (min-width: 922px) {
	.ast-builder-menu .main-header-menu > .menu-item > .menu-link {
		padding-inline: 11px;
		font-size: 16px;
	}
}
