/* ============================================================
   Göta Dental — landningssida (startsida)
   Brand-korrigerad: blå CTA (#1E73BE), pink accent (#6C7079),
   Montserrat genomgående. Ingen orange.
   ============================================================ */

/* ─────── GEMENSAMT ─────── */
.gd-eyebrow {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--gd-text);
	opacity: .65;
}
.gd-mono {
	font-family: inherit;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
.gd-pink { color: var(--gd-pink); }
.gd-h2 {
	font-size: clamp(38px, 5.5vw, 78px);
	font-weight: 800;
	letter-spacing: -.04em;
	line-height: .96;
	color: var(--gd-black);
	margin: 0;
	text-wrap: balance;
}
.gd-h2 em { font-style: italic; font-weight: 500; }
.gd-body-txt { font-size: 16px; line-height: 1.72; color: var(--gd-text); }

.gd-section { max-width: 1280px; margin: 0 auto; padding: 100px 40px; }
.gd-section-full { padding: 100px 0; }
/* Nästlad .gd-section i en .gd-section-full ska inte dubblera vertikal padding. */
.gd-section-full > .gd-section { padding-top: 0; padding-bottom: 0; }
.gd-section-head {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	align-items: end;
	margin-bottom: 60px;
}
.gd-sec-num {
	font-size: 11px; font-weight: 600; letter-spacing: .2em;
	text-transform: uppercase; color: var(--gd-text); opacity: .5;
	margin-bottom: 12px;
}
.gd-bg-beige { background: var(--gd-beige); }
.gd-bg-lav   { background: var(--gd-lavender); }
.gd-bg-ink   { background: var(--gd-black); color: #fff; }
.gd-bg-grad  { background: var(--gd-grad); }

@media (max-width: 900px) {
	.gd-section { padding: 64px 20px; }
	.gd-section-full { padding: 64px 0; }
	.gd-section-head { grid-template-columns: 1fr; gap: 14px; margin-bottom: 40px; }
}

/* ─────── HERO (scroll-pinnad video) ─────── */
#gd-hero { height: 300vh; position: relative; }
#gd-hero-sticky {
	position: sticky;
	top: 0;
	height: 100vh;
	overflow: hidden;
	background: #0a0a0a;
}
#gd-hero-video {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
}
#gd-hero-overlay {
	position: absolute; inset: 0;
	background: linear-gradient(100deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.5) 52%, rgba(0,0,0,.2) 100%);
}
.gd-hero-grid {
	position: relative; z-index: 2;
	height: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 40px;
	display: flex;
	align-items: center;
}
.gd-hero-content { display: flex; flex-direction: column; gap: 22px; max-width: 720px; }
#gd-hero-h1 {
	font-size: clamp(44px, 6.2vw, 92px);
	font-weight: 800;
	letter-spacing: -.045em;
	line-height: 1.02;
	color: #fff;
	margin: 0;
	overflow-wrap: break-word;
}
#gd-hero-h1 em { font-style: italic; font-weight: 500; }
.gd-hero-sub {
	font-size: clamp(16px, 1.7vw, 20px);
	font-weight: 400;
	line-height: 1.6;
	color: rgba(255,255,255,.82);
	max-width: 520px;
	margin: 0;
}
.gd-hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
.gd-hero-eyebrow { color: rgba(255,255,255,.65); }
.gd-hero-ghost { color: #fff; border-color: rgba(255,255,255,.5); }
.gd-hero-ghost:hover { background: #fff; color: var(--gd-black); border-color: #fff; }
.gd-hero-trust {
	display: flex; align-items: center; gap: 12px;
	color: rgba(255,255,255,.72);
	font-size: 14px; font-weight: 500;
	margin-top: 6px;
}
.gd-hero-trust .gd-rate { color: #fff; font-size: 17px; font-weight: 800; text-decoration: none; }
.gd-hero-trust a.gd-rate:hover { text-decoration: underline; }

/* Hero word-reveal */
.gd-word { display: inline-block; }
.gd-anim .gd-word { opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; }
.gd-word.in { opacity: 1; transform: translateY(0); }

/* Hero progress */
#gd-hero-progress {
	position: absolute; bottom: 32px; left: 40px; z-index: 3;
	display: flex; align-items: center; gap: 10px;
	font-size: 10px; font-weight: 600; letter-spacing: .2em;
	text-transform: uppercase; color: rgba(255,255,255,.75);
}
#gd-hero-track { width: 200px; height: 2px; background: rgba(255,255,255,.25); border-radius: 1px; overflow: hidden; }
#gd-hero-fill { height: 100%; width: 100%; background: #fff; transform-origin: left; transform: scaleX(0); }
#gd-hero-chapters {
	position: absolute; right: 40px; top: 32px; z-index: 3;
	display: flex; flex-direction: column; gap: 6px; align-items: flex-end;
	font-size: 10px; font-weight: 600; letter-spacing: .16em;
	text-transform: uppercase; color: rgba(255,255,255,.45);
}
.gd-chap { transition: opacity .3s, color .3s; opacity: .4; }
.gd-chap.active { opacity: 1; color: #fff; }
.gd-scroll-hint {
	position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%);
	z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 6px;
	font-size: 10px; letter-spacing: .15em; text-transform: uppercase;
	color: rgba(255,255,255,.5); animation: gd-bob 2s ease-in-out infinite;
}
.gd-scroll-hint svg { width: 16px; }
@keyframes gd-bob { 0%,100%{transform:translate(-50%,0)} 50%{transform:translate(-50%,6px)} }

@media (max-width: 900px) {
	/* Mobil/surfplatta: statisk, snabb hero — videon som rundat kort på ljus brand-bakgrund */
	#gd-hero { height: auto; }
	#gd-hero-sticky {
		position: static; height: auto; display: block;
		background: var(--gd-grad);
		padding: 30px 0 46px;
	}
	#gd-hero-video {
		position: static;
		width: calc(100% - 40px); height: auto;
		margin: 0 20px 24px;
		aspect-ratio: 16 / 10;
		object-fit: cover; object-position: center 42%;
		border-radius: 18px;
		background: #0a0a0a;
		box-shadow: 0 26px 50px -26px rgba(0,0,0,.45);
	}
	#gd-hero-overlay, #gd-hero-progress, #gd-hero-chapters, .gd-scroll-hint { display: none; }
	.gd-hero-grid { position: static; height: auto; display: block; padding: 0 20px; }
	.gd-hero-content { max-width: none; gap: 16px; }
	#gd-hero-h1 { color: var(--gd-black); }
	.gd-hero-eyebrow { color: var(--gd-text); opacity: .7; }
	.gd-hero-sub { color: var(--gd-text); opacity: .92; max-width: none; }
	.gd-hero-trust { color: var(--gd-text); }
	.gd-hero-trust .gd-rate { color: var(--gd-black); }
	.gd-hero-ghost { color: var(--gd-black); border-color: rgba(0,0,0,.25); }
	.gd-hero-ghost:hover { background: var(--gd-black); color: #fff; border-color: var(--gd-black); }
}
@media (max-width: 560px) {
	#gd-hero-h1 { font-size: clamp(34px, 9vw, 50px); }
	.gd-hero-sub { font-size: 15px; }
}

/* ─────── MARQUEE ─────── */
#gd-marquee { background: var(--gd-black); color: #fff; padding: 18px 0; overflow: hidden; }
.gd-mq-track {
	display: flex; white-space: nowrap; width: max-content;
	animation: gd-mq 32s linear infinite;
	font-weight: 700; font-size: 13px; letter-spacing: .07em; text-transform: uppercase;
}
.gd-mq-track > span { display: inline-flex; align-items: center; }
.gd-dot { width: 6px; height: 6px; background: var(--gd-pink); border-radius: 50%; margin: 0 30px; }
@keyframes gd-mq { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ─────── STATS ─────── */
.gd-stats {
	display: grid; grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid rgba(0,0,0,.1);
	border-bottom: 1px solid rgba(0,0,0,.1);
}
.gd-stat { padding: 34px 24px; border-left: 1px solid rgba(0,0,0,.1); }
.gd-stat:first-child { border-left: none; }
.gd-stat-n { font-size: clamp(36px, 4vw, 56px); font-weight: 800; letter-spacing: -.04em; line-height: 1; color: var(--gd-black); }
.gd-stat-l { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gd-text); opacity: .6; margin-top: 8px; }
@media (max-width: 760px) {
	.gd-stats { grid-template-columns: 1fr 1fr; }
	.gd-stat:nth-child(3) { border-left: none; }
	.gd-stat { padding: 22px 16px; }
}

/* ─────── TESTIMONIALS ─────── */
.gd-testi-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.gd-testi { background: var(--gd-white); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; border: 1px solid rgba(0,0,0,.06); }
.gd-testi-vid { position: relative; aspect-ratio: 4/5; background: #111; overflow: hidden; cursor: pointer; }
.gd-testi-vid video { width: 100%; height: 100%; object-fit: cover; }
.gd-yt-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gd-yt-frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; z-index: 4; }
.gd-yt-loaded .gd-testi-play,
.gd-yt-loaded .gd-testi-live,
.gd-yt-loaded .gd-yt-thumb { display: none; }
.gd-testi-ph { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(30,115,190,.35), rgba(0,0,0,.7)); }
.gd-testi-play {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
	width: 84px; height: 84px; border-radius: 50%;
	background: var(--gd-blue); display: flex; align-items: center; justify-content: center;
	color: #fff; box-shadow: 0 14px 40px rgba(30,115,190,.5); transition: transform .2s; z-index: 2;
}
.gd-testi-vid:hover .gd-testi-play { transform: translate(-50%,-50%) scale(1.07); }
.gd-testi-dur {
	position: absolute; bottom: 14px; left: 14px; z-index: 2;
	font-size: 11px; font-weight: 600; color: #fff;
	background: rgba(0,0,0,.45); padding: 4px 9px; border-radius: 4px;
}
.gd-testi-live {
	position: absolute; top: 14px; right: 14px; z-index: 2;
	font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
	color: #fff; display: flex; align-items: center; gap: 6px;
}
.gd-testi-live::before { content: ""; width: 8px; height: 8px; background: var(--gd-pink); border-radius: 50%; animation: gd-blink 1.6s infinite; }
@keyframes gd-blink { 0%,100%{opacity:1} 50%{opacity:.3} }
.gd-testi-coming { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: #fff; text-align: center; padding: 24px; }
.gd-testi-body { padding: 28px; }
.gd-testi-quote { font-size: 19px; font-weight: 700; line-height: 1.35; letter-spacing: -.01em; color: var(--gd-black); margin-bottom: 16px; }
.gd-testi-author { font-weight: 800; font-size: 19px; letter-spacing: -.02em; color: var(--gd-black); }
.gd-testi-tag { font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gd-text); opacity: .55; margin-top: 4px; }
.gd-testi-line { font-size: 15px; line-height: 1.55; color: var(--gd-text); margin: 8px 0 0; }

/* ═══════ LEENDE-QUIZ v3 — ren, mobile-first, inline fokus (Ali 2026-07-03) ═══════
   EN källa till sanning. Kortet fyller vyn (100dvh) på mobil så varje steg ryms
   utan scroll; tvåkolumns på desktop. #gd-quiz-scope slår jq-r1 utan !important.
   Motion återanvänder --jq-ease. Färger orörda. */

/* Sektion: full-bleed app på mobil (ingen sektions-padding/rubrik/flex) */
#gd-quiz { padding: 0; display: block; max-width: none; }
#gd-quiz .gd-section-head { display: none; }

/* Kort = app som fyller vyn */
#gd-quiz .gd-quiz-card {
	display: flex; flex-direction: column;
	min-height: 100dvh; width: 100%; max-width: none; margin: 0;
	background: #fff; border: 0; border-radius: 0; box-shadow: none; overflow: hidden;
}

/* Illustration topp — responsiv höjd så resten ryms */
#gd-quiz .gd-quiz-illu {
	position: relative; flex: 0 0 auto;
	height: clamp(120px, 22dvh, 180px); min-height: 0;
	background: var(--jq-bg-lt);
	display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 0;
}
#gd-quiz .gd-quiz-illu [data-illu] { position: absolute; inset: 0; opacity: 0; transform: scale(1.04); transition: opacity .5s ease, transform .6s var(--jq-ease); }
#gd-quiz .gd-quiz-illu [data-illu].is-on { opacity: 1; transform: scale(1); }
#gd-quiz .gd-quiz-illu img { width: 100%; height: 100%; object-fit: contain; object-position: center; padding: 3%; display: block; }
/* Dölj illu på kontakt-skärm (frigör höjd för tangentbord) */
body.gd-quiz-noillu #gd-quiz .gd-quiz-illu { display: none; }

/* Panel = flex-kolumn som fyller resten */
#gd-quiz .gd-quiz-panel {
	flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column;
	padding: clamp(12px, 3.5vw, 18px);
	padding-bottom: calc(clamp(12px,3.5vw,18px) + env(safe-area-inset-bottom));
	background: #fff;
}

/* Progress: segmenterade piller + etikett (fast topp) */
#gd-quiz .gd-quiz-prog { flex: 0 0 auto; margin-bottom: 16px; }
#gd-quiz .gd-quiz-steplbl { display: block; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--jq-stone); margin-bottom: 8px; }
#gd-quiz .gd-quiz-dots { display: flex; gap: 5px; align-items: center; margin: 0; }
#gd-quiz .gd-quiz-dot { flex: 1 1 0; height: 6px; border-radius: 3px; background: rgba(21,23,27,.12); transition: background .45s var(--jq-ease); }
#gd-quiz .gd-quiz-dot.done { background: var(--gd-blue); }
#gd-quiz .gd-quiz-dot.active { background: var(--gd-black); }

/* Stage: centrerat vertikalt, nödfalls-scroll */
#gd-quiz .gd-quiz-stage { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; justify-content: flex-start; overflow-y: auto; -webkit-overflow-scrolling: touch; }
#gd-quiz .gd-quiz-step { margin: auto 0; width: 100%; }

/* Steg-övergång (riktnings-medveten) */
#gd-quiz .gd-quiz-step { animation: gd-quiz-in .34s var(--jq-ease) both; }
#gd-quiz .gd-quiz-stage[data-dir="back"] .gd-quiz-step { animation-name: gd-quiz-in-back; }
@keyframes gd-quiz-in { from { opacity: 0; transform: translateX(26px); } to { opacity: 1; transform: none; } }
@keyframes gd-quiz-in-back { from { opacity: 0; transform: translateX(-26px); } to { opacity: 1; transform: none; } }

/* Fråga: serif, redaktionell */
#gd-quiz .gd-quiz-count { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gd-blue); }
#gd-quiz .gd-quiz-q { font-family: var(--gd-serif); font-size: clamp(22px, 5.6vw, 30px); font-weight: 400; letter-spacing: -.01em; line-height: 1.14; color: var(--gd-black); margin: 10px 0 18px; }
#gd-quiz .gd-quiz-q em { font-style: italic; }
#gd-quiz .gd-quiz-sub { font-size: 14px; line-height: 1.5; color: var(--gd-text); opacity: .8; margin: -8px 0 16px; }

/* Alternativ: luftiga tap-targets */
#gd-quiz .gd-quiz-opts { display: flex; flex-direction: column; gap: 10px; }
#gd-quiz .gd-quiz-opt {
	display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 12px 18px;
	background: var(--gd-beige); border: 1.5px solid transparent; border-radius: 14px;
	cursor: pointer; font-family: inherit; text-align: left;
	transition: border-color .18s ease, background .18s ease, transform .18s var(--jq-ease);
}
@media (hover:hover) { #gd-quiz .gd-quiz-opt:hover { border-color: var(--gd-black); transform: translateY(-1px); } }
#gd-quiz .gd-quiz-opt:active { transform: scale(.985); }
#gd-quiz .gd-quiz-opt.sel { border-color: var(--gd-blue); background: rgba(30,115,190,.08); }
#gd-quiz .gd-quiz-opt.is-confirming { border-color: var(--gd-blue); background: rgba(30,115,190,.13); }
#gd-quiz .gd-quiz-opt-t { font-size: 16px; font-weight: 700; color: var(--gd-black); }
#gd-quiz .gd-quiz-opt-d { font-size: 13px; color: var(--gd-text); opacity: .7; }
#gd-quiz .gd-quiz-opt-arrow { margin-left: auto; color: var(--gd-blue); opacity: 0; transform: scale(.6); transition: opacity .2s ease, transform .25s var(--jq-ease); }
#gd-quiz .gd-quiz-opt.sel .gd-quiz-opt-arrow { opacity: 1; transform: scale(1.15); }

/* Tiles (svårighetsgrad) */
#gd-quiz .gd-quiz-opts--tiles { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
#gd-quiz .gd-quiz-tile { display: flex; flex-direction: column; gap: 8px; padding: 8px; border: 1.5px solid rgba(0,0,0,.1); border-radius: 14px; background: #fff; cursor: pointer; font-family: inherit; text-align: center; transition: border-color .2s ease, transform .2s var(--jq-ease), box-shadow .2s ease; }
#gd-quiz .gd-quiz-tile-img { aspect-ratio: 1/1; border-radius: 10px; overflow: hidden; background: var(--jq-bg-lt); }
#gd-quiz .gd-quiz-tile-img img { width: 100%; height: 100%; object-fit: contain; padding: 6%; display: block; }
#gd-quiz .gd-quiz-tile-t { font-size: 13px; font-weight: 700; color: var(--gd-black); }
@media (hover:hover) { #gd-quiz .gd-quiz-tile:hover { border-color: var(--gd-black); transform: translateY(-2px); } }
#gd-quiz .gd-quiz-tile.sel { border-color: var(--gd-blue); box-shadow: 0 0 0 3px rgba(30,115,190,.14); }

/* Byggande matchnings-mätare */
#gd-quiz .gd-quiz-meter { margin: 0 0 14px; }
#gd-quiz .gd-quiz-meter-bar { height: 5px; border-radius: 3px; background: rgba(0,0,0,.08); overflow: hidden; }
#gd-quiz .gd-quiz-meter-bar i { display: block; height: 100%; width: 0; background: var(--gd-blue); border-radius: 3px; transition: width .6s var(--jq-ease); }
#gd-quiz .gd-quiz-meter-lbl { display: block; margin-top: 7px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gd-blue); opacity: .9; }

/* Tillbaka-länk */
#gd-quiz .gd-quiz-back { margin-top: 14px; background: none; border: 0; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 600; color: var(--gd-text); opacity: .7; padding: 6px 0; align-self: flex-start; }
#gd-quiz .gd-quiz-back:hover { opacity: 1; }

/* Reveal (rekommendation) */
#gd-quiz .gd-quiz-match { display: flex; align-items: baseline; gap: 8px; margin: 2px 0 10px; }
#gd-quiz .gd-quiz-match-pct { font-family: var(--gd-serif); font-size: clamp(34px,9vw,46px); font-weight: 400; color: var(--gd-blue); line-height: 1; }
#gd-quiz .gd-quiz-match-lbl { font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gd-text); opacity: .65; }
/* Bandet som ersatte procentsiffran på reveal-skärmen (2026-08-04). */
#gd-quiz .gd-quiz-match-band { display: inline-block; padding: 6px 14px; border: 1px solid var(--gd-border); border-radius: 100px; background: var(--gd-cream,#F4F1EA); font-size: 10.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gd-ink); }
#gd-quiz .gd-quiz-echo { font-size: 13.5px; line-height: 1.5; color: var(--gd-text); opacity: .85; margin: 0 0 14px; }
#gd-quiz .gd-quiz-priceteaser { font-size: 15px; line-height: 1.5; color: var(--gd-black); margin: 0 0 18px; }
#gd-quiz .gd-quiz-priceteaser strong { color: var(--gd-blue); }

/* Kontakt-formulär */
#gd-quiz .gd-quiz-gate-lead { font-size: 14px; line-height: 1.5; color: var(--gd-text); margin: 4px 0 14px; }
#gd-quiz .gd-quiz-gate-lead strong { color: var(--gd-black); }
#gd-quiz .gd-quiz-form { display: flex; flex-direction: column; gap: 10px; }
#gd-quiz .gd-quiz-input { height: 50px; padding: 0 16px; border: 1.5px solid var(--gd-border); border-radius: 12px; font-family: inherit; font-size: 16px; background: #fff; transition: border-color .2s ease, box-shadow .2s ease; }
#gd-quiz .gd-quiz-input:focus { outline: none; border-color: var(--gd-blue); box-shadow: 0 0 0 3px rgba(30,115,190,.12); }
#gd-quiz .gd-quiz-consent { display: flex; gap: 10px; font-size: 12.5px; line-height: 1.45; color: var(--gd-text); }
#gd-quiz .gd-quiz-consent input { margin-top: 1px; flex-shrink: 0; accent-color: var(--gd-blue); width: 18px; height: 18px; }
#gd-quiz .gd-quiz-consent a { color: var(--gd-blue); }
#gd-quiz .gd-quiz-err { font-size: 13px; color: #C0392B; margin: 2px 0 0; font-weight: 600; }

/* Trust-rad */
#gd-quiz .gd-quiz-trust { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 12px; }
#gd-quiz .gd-quiz-trust li { font-size: 11px; font-weight: 700; color: var(--gd-black); }
#gd-quiz .gd-quiz-trust li::before { content: "\2713"; color: var(--gd-ink); font-weight: 800; margin-right: 5px; }

/* Intro */
#gd-quiz .gd-quiz-intro-lead { font-size: 15px; line-height: 1.55; color: var(--gd-text); margin: 8px 0 14px; }
#gd-quiz .gd-quiz-intro-reward { font-size: 14px; line-height: 1.5; color: var(--gd-black); background: rgba(30,115,190,.07); padding: 12px 15px; border-radius: 12px; margin-bottom: 16px; }
#gd-quiz .gd-quiz-intro-reward strong { color: var(--gd-blue); }
#gd-quiz .gd-quiz-start { align-self: stretch; }

/* Resultat, zonindelning (2026-08-04): fyra grupper i stället för 13 staplade block,
   avgränsade med linje + luft precis som sajtens redaktionella sektioner. */
#gd-quiz .gd-quiz-zon + .gd-quiz-zon { margin-top: clamp(18px,5vw,28px); padding-top: clamp(18px,5vw,28px); border-top: 1px solid var(--gd-border); }
@media (min-width: 761px) { #gd-quiz .gd-quiz-zon + .gd-quiz-zon { margin-top: clamp(28px,3vw,40px); padding-top: clamp(28px,3vw,40px); } }
#gd-quiz .gd-quiz-zon--trygg { padding-top: clamp(14px,4vw,20px); margin-top: clamp(14px,4vw,20px); }
#gd-quiz .gd-quiz-eyebrow { display: block; font-size: 10px; letter-spacing: .34em; text-transform: uppercase; color: #8b6f47; margin-bottom: 10px; }
#gd-quiz .gd-quiz-result .gd-quiz-q { font-size: clamp(26px,4.4vw,38px); line-height: 1.08; margin: 0 0 10px; }

/* Resultat */
#gd-quiz .gd-quiz-result-desc { font-size: 15px; line-height: 1.55; color: var(--gd-text); margin: 6px 0 14px; }
/* Specialistens motivering: den bärande texten på sidan, därför serif och ink. */
#gd-quiz .gd-quiz-why-lead { font-family: var(--gd-serif); font-size: clamp(16px,2.4vw,18.5px); line-height: 1.5; color: var(--gd-ink); margin: 0 0 12px; }
/* Pris i sajtens egen redaktionella pris-stil (2026-08-04): serif kursiv i ink,
   avgränsat med linjer i stället för blått kort. Blått är accent på sajten, inte
   huvudfärg, och priset var det enda stället där quizet bröt mot det. */
#gd-quiz .gd-quiz-result-price { display: flex; flex-direction: column; margin: 0 0 4px; padding: 18px 0; border-top: 1px solid var(--gd-border); border-bottom: 1px solid var(--gd-border); }
#gd-quiz .gd-quiz-result-price strong { font-family: var(--gd-serif); font-style: italic; font-size: clamp(2.4rem,6vw,3.4rem); font-weight: 400; color: var(--gd-ink); line-height: 1; letter-spacing: -.015em; font-variant-numeric: tabular-nums lining-nums; }
#gd-quiz .gd-quiz-result-price span { font-size: 13.5px; color: var(--gd-text); opacity: 1; margin-top: 7px; }
#gd-quiz .gd-quiz-result-note { font-size: 12px; line-height: 1.45; color: var(--gd-text); opacity: .65; margin: 0 0 16px; }
#gd-quiz .gd-quiz-result-cta { display: flex; flex-direction: column; gap: 10px; }

/* Resultat, video-hero (2026-08-03) */
#gd-quiz .gd-quiz-result-hero { position: relative; margin: 0 -18px 14px; border-radius: 0; overflow: hidden; background: var(--gd-ink); aspect-ratio: 4/3; }
#gd-quiz .gd-quiz-result-video { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Badgen flyttad till övre vänstra hörnet (2026-08-04) så den inte lägger sig över
   ansiktena i videon, och visar numera behandlingstid i stället för matchningsprocent. */
#gd-quiz .gd-quiz-result-badge { position: absolute; left: 12px; top: 12px; display: flex; flex-direction: column; background: rgba(240,236,226,.92); color: var(--gd-black); padding: 8px 14px; border-radius: 100px; font-family: var(--gd-serif); backdrop-filter: blur(6px); }
#gd-quiz .gd-quiz-result-badge b { font-size: 17px; font-weight: 400; line-height: 1.1; }
#gd-quiz .gd-quiz-result-badge em { font-style: normal; font-size: 8.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; opacity: .58; }
@media (min-width: 761px) { #gd-quiz .gd-quiz-result-hero { margin: 0 0 16px; border-radius: 14px; aspect-ratio: 16/9; } }

/* Resultat, alternativ (2026-08-03) */
#gd-quiz .gd-quiz-alts { margin: 18px 0 0; border-top: 1px solid rgba(21,23,27,.1); }
#gd-quiz .gd-quiz-alts-h { display: block; padding: 14px 0 8px; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gd-text); opacity: .6; }
/* Alternativ som avvägning, inte prislapp (2026-08-04): namn + tid/prisskillnad +
   en rad om vad metoden faktiskt innebär, så alternativet läses som ett annat val
   och inte som "den dyrare varianten". */
#gd-quiz .gd-quiz-alt { width: 100%; display: flex; flex-direction: column; gap: 3px; padding: 14px 2px; background: none; border: 0; border-top: 1px solid rgba(21,23,27,.08); text-align: left; cursor: pointer; font: inherit; }
#gd-quiz .gd-quiz-alt-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; width: 100%; }
#gd-quiz .gd-quiz-alt-name { font-family: var(--gd-serif); font-size: 17px; color: var(--gd-black); }
#gd-quiz .gd-quiz-alt-meta { font-size: 12.5px; color: var(--gd-text); opacity: .72; font-variant-numeric: tabular-nums; }
#gd-quiz .gd-quiz-alt-tradeoff { font-size: 12.5px; line-height: 1.45; color: var(--gd-text); opacity: .62; }
#gd-quiz .gd-quiz-alt-chev { color: var(--gd-ink); opacity: .5; transition: transform .3s var(--gd-ease); }
#gd-quiz .gd-quiz-alt[aria-expanded="true"] .gd-quiz-alt-chev { transform: rotate(90deg); }
#gd-quiz .gd-quiz-alt-panel { padding: 0 2px 16px; animation: gd-alt-in .28s var(--gd-ease) both; }
#gd-quiz .gd-quiz-alt-panel video { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 10px; margin-bottom: 10px; }
#gd-quiz .gd-quiz-alt-panel p { font-size: 13.5px; line-height: 1.5; color: var(--gd-text); margin: 0 0 10px; }
#gd-quiz .gd-quiz-alt-swap { background: none; border: 0; padding: 0; font: inherit; font-weight: 600; font-size: 13px; color: var(--gd-blue); cursor: pointer; }
@keyframes gd-alt-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* Metodrad, alla metoder (omgjord 2026-08-04). Staplarna och procenten är borta:
   de såg ut som mätdata och fick fullt giltiga metoder att läsas som underkända.
   Nu en redaktionell rad med kvalitativt band, i sajtens info-rad-stil. */
#gd-quiz .gd-quiz-breadth { margin: 18px 0 0; }
#gd-quiz .gd-quiz-bx { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 11px 0; border-top: 1px solid var(--gd-border); }
#gd-quiz .gd-quiz-bx-n { font-family: var(--gd-serif); font-size: 15px; color: var(--gd-ink); }
#gd-quiz .gd-quiz-bx-band { font-size: 10px; letter-spacing: .18em; text-transform: uppercase; text-align: right; color: var(--gd-text); opacity: .55; }
#gd-quiz .gd-quiz-bx.is-primary .gd-quiz-bx-n { font-style: italic; }
#gd-quiz .gd-quiz-bx.is-primary .gd-quiz-bx-band { color: var(--gd-ink); opacity: 1; }
#gd-quiz .gd-quiz-breadth-note { margin: 12px 0 0; font-size: 12px; line-height: 1.5; color: var(--gd-text); opacity: .6; }

/* Bokning i quizkortet, etapp 2 (2026-08-03), bakom gd_quiz_inline_booking-flaggan */
#gd-quiz .gd-quiz-book-slots { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 14px; }
#gd-quiz .gd-quiz-book-slot { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border: 1.5px solid var(--gd-border); border-radius: 12px; background: #fff; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; color: var(--gd-black); text-align: left; }
#gd-quiz .gd-quiz-book-slot:hover, #gd-quiz .gd-quiz-book-slot:focus-visible { border-color: var(--gd-blue); outline: none; }
#gd-quiz .gd-quiz-book-slot span { color: var(--gd-blue); font-weight: 700; }
#gd-quiz .gd-quiz-book-back { margin: 0 0 12px; }

/* ── DESKTOP (≥761px): tvåkolumns, kort centrerat med höjd-cap ── */
@media (min-width: 761px) {
	#gd-quiz { padding: clamp(40px,6vh,80px) 0; }
	/* Rubriken ska ligga i SAMMA box som quizkortet (Ali 2026-08-05). Kortet har
	   width:min(1060px,100%) + margin:0 auto, men rubriken saknade begränsning och
	   gick kant till kant, vilket såg ut som att den var vänsterställd utanför boxen. */
	#gd-quiz .gd-section-head { display: block; width: min(1060px,100%); margin-left: auto; margin-right: auto; }
	#gd-quiz .gd-quiz-card {
		display: grid; grid-template-columns: 0.82fr 1.18fr; align-items: stretch;
		min-height: 0; height: min(680px, 86dvh); width: min(1060px,100%); margin: 0 auto;
		border: 1px solid rgba(0,0,0,.07); border-radius: 24px;
		box-shadow: 0 36px 72px -46px rgba(0,0,0,.36);
	}
	#gd-quiz .gd-quiz-illu { height: auto; }
	body.gd-quiz-noillu #gd-quiz .gd-quiz-illu { display: flex; }
	#gd-quiz .gd-quiz-panel { padding: 34px 38px; }
	#gd-quiz .gd-quiz-start { align-self: flex-start; }
	#gd-quiz .gd-quiz-result-cta { flex-direction: row; flex-wrap: wrap; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	#gd-quiz .gd-quiz-step { animation: gd-quiz-fade .2s ease both; }
	@keyframes gd-quiz-fade { from { opacity: 0; } to { opacity: 1; } }
	#gd-quiz .gd-quiz-illu [data-illu], #gd-quiz .gd-quiz-meter-bar i, #gd-quiz .gd-quiz-opt, #gd-quiz .gd-quiz-dot, #gd-quiz .gd-quiz-tile { transition: opacity .2s ease; transform: none; }
}
/* ═══════ /LEENDE-QUIZ v3 ═══════

/* ─────── EXPERTS ─────── */
.gd-experts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.gd-expert {
	background: var(--gd-white); border: 1px solid rgba(0,0,0,.06); border-radius: 16px;
	padding: 36px; display: flex; flex-direction: column; gap: 16px; min-height: 400px;
	transition: transform .2s;
}
.gd-expert:hover { transform: translateY(-4px); }
.gd-expert.usp { background: var(--gd-black); color: #fff; }
.gd-ep-photo {
	width: 132px; height: 132px; border-radius: 50%;
	background: var(--gd-lavender); overflow: hidden;
	display: flex; align-items: center; justify-content: center;
}
.gd-ep-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 15%; }
.gd-ep-initials { font-size: 42px; font-weight: 800; letter-spacing: -.04em; color: var(--gd-black); }
.gd-ep-name { font-size: 22px; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.gd-ep-title { font-size: 14px; font-weight: 500; opacity: .68; }
.gd-ep-creds { font-size: 12px; line-height: 1.5; color: var(--gd-text); opacity: .6; }
.gd-expert.usp .gd-ep-creds { color: rgba(255,255,255,.6); }
.gd-ep-desc { font-size: 14px; line-height: 1.55; opacity: .72; margin: 0; }
.gd-ep-badge {
	margin-top: auto; align-self: flex-start;
	font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
	padding: 8px 13px; border: 1px solid rgba(0,0,0,.15); border-radius: 100px;
}
.gd-expert.usp .gd-ep-badge { border-color: rgba(255,255,255,.25); }
.gd-ep-big { font-size: clamp(36px, 4.6vw, 60px); font-weight: 800; letter-spacing: -.045em; line-height: .9; }

/* ─────── TREATMENTS ─────── */
.gd-tx-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.gd-tx {
	background: var(--gd-white); border-radius: 14px; padding: 30px 26px;
	display: flex; flex-direction: column; gap: 14px; min-height: 290px;
	border: 1.5px solid rgba(0,0,0,.06); transition: all .2s; position: relative;
	text-decoration: none; color: inherit;
}
.gd-tx:hover { border-color: var(--gd-blue); transform: translateY(-4px); box-shadow: 0 20px 46px -22px rgba(0,0,0,.16); text-decoration: none; }
.gd-tx.feat { border-color: var(--gd-blue); }
.gd-tx-vis { position: absolute; top: 18px; right: 20px; font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; opacity: .45; }
.gd-tx.feat .gd-tx-vis { opacity: 1; color: var(--gd-blue); }
.gd-tx-icon { width: 54px; height: 54px; border-radius: 50%; background: var(--gd-beige); display: flex; align-items: center; justify-content: center; color: var(--gd-black); transition: background .2s ease, color .2s ease; }
.gd-tx-icon svg { width: 27px; height: 27px; }
.gd-tx:hover .gd-tx-icon { background: var(--gd-blue); color: #fff; }
.gd-tx.feat .gd-tx-icon { background: var(--gd-blue); color: #fff; }
.gd-tx-title { font-size: 22px; font-weight: 800; letter-spacing: -.025em; color: var(--gd-black); }
.gd-tx-sub { font-size: 13px; opacity: .62; }
.gd-tx-more { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gd-blue); }
.gd-tx-more svg { width: 15px; height: 15px; transition: transform .2s ease; }
.gd-tx:hover .gd-tx-more svg { transform: translateX(4px); }

/* ─────── SERVICE-KORT (bettfel) ─────── */
.gd-scards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.gd-scard {
	display: flex; flex-direction: column;
	background: var(--gd-white);
	border: 1px solid rgba(0,0,0,.06);
	border-radius: 16px; overflow: hidden;
	text-decoration: none; color: inherit;
	transition: transform .25s ease, box-shadow .25s ease;
}
.gd-scard:hover { transform: translateY(-5px); box-shadow: 0 26px 52px -26px rgba(0,0,0,.24); text-decoration: none; }
.gd-scard-media { aspect-ratio: 16 / 11; overflow: hidden; background: var(--gd-lavender); }
.gd-scard-media img { width: 100%; height: 100%; object-fit: cover; }
.gd-scard-body { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.gd-scard-title { font-size: 21px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); margin: 0; }
.gd-scard-desc { font-size: 13.5px; line-height: 1.55; color: var(--gd-text); opacity: .72; margin: 0; }
.gd-scard-more {
	margin-top: auto; padding-top: 12px;
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
	color: var(--gd-blue);
}
.gd-scard-more svg { width: 15px; height: 15px; transition: transform .25s ease; }
.gd-scard:hover .gd-scard-more svg { transform: translateX(4px); }
@media (max-width: 900px) { .gd-scards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .gd-scards { grid-template-columns: 1fr; } }

/* ─────── BEFORE / AFTER ─────── */
.gd-ba-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.gd-ba-grid--single { grid-template-columns: 1fr; max-width: 880px; margin: 0 auto; }
.gd-ba { display: flex; flex-direction: column; gap: 12px; }
.gd-ba-frame {
	aspect-ratio: 4/3; border-radius: 14px; overflow: hidden; position: relative;
	background: #1a1a1a; cursor: ew-resize; user-select: none; touch-action: none;
}
.gd-ba-frame:focus-visible { outline: 3px solid var(--gd-blue); outline-offset: 3px; }
.gd-ba-before, .gd-ba-after { position: absolute; inset: 0; }
.gd-ba-before img, .gd-ba-after img { width: 100%; height: 100%; object-fit: cover; }
.gd-ba-after { clip-path: inset(0 0 0 var(--s, 50%)); }
.gd-ba-ph { display: flex; align-items: center; justify-content: center; }
.gd-ba-ph-dark { background: linear-gradient(135deg, #3a322a, #14100c); }
.gd-ba-ph-light { background: var(--gd-grad); }
.gd-ba-note {
	font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
	padding: 6px 12px; border-radius: 100px;
}
.gd-ba-ph-dark .gd-ba-note { color: rgba(255,255,255,.5); border: 1px solid rgba(255,255,255,.2); }
.gd-ba-ph-light .gd-ba-note { color: var(--gd-text); opacity: .55; border: 1px solid rgba(0,0,0,.18); }
.gd-ba-tag {
	position: absolute; bottom: 14px; font-size: 10px; font-weight: 600;
	letter-spacing: .16em; text-transform: uppercase; padding: 5px 10px; border-radius: 4px;
}
.gd-ba-before .gd-ba-tag { left: 14px; background: rgba(0,0,0,.55); color: #fff; }
.gd-ba-after .gd-ba-tag { right: 14px; background: rgba(255,255,255,.85); color: var(--gd-black); }
.gd-ba-handle { position: absolute; top: 0; bottom: 0; left: var(--s, 50%); width: 2px; background: #fff; pointer-events: none; box-shadow: 0 0 18px rgba(0,0,0,.45); }
.gd-ba-pill {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
	width: 46px; height: 46px; background: #fff; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 8px 22px rgba(0,0,0,.3); font-size: 15px; font-weight: 800; color: var(--gd-black);
}
.gd-ba-story { font-size: 16px; font-weight: 700; letter-spacing: -.01em; line-height: 1.3; color: var(--gd-black); }
.gd-ba-dur { font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; opacity: .5; }

/* ─────── PROCESS — auto-advancerande stegslider ─────── */
.gd-steps { display: grid; gap: 26px; }
.gd-steps-stage {
	display: grid;
	position: relative;
	background: var(--gd-white);
	border: 1px solid rgba(0,0,0,.06);
	border-radius: 22px;
	padding: 56px 60px;
	overflow: hidden;
	box-shadow: 0 30px 60px -40px rgba(0,0,0,.3);
}
.gd-step-panel {
	grid-area: 1 / 1;
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .55s ease, transform .55s ease;
	pointer-events: none;
}
.gd-step-panel.is-active { opacity: 1; transform: none; pointer-events: auto; }
.gd-step-index {
	position: absolute; top: -0.2em; right: 20px;
	font-size: clamp(150px, 18vw, 250px);
	font-weight: 800; letter-spacing: -.06em; line-height: 1;
	color: var(--gd-lavender); z-index: 0; pointer-events: none;
}
.gd-step-h {
	position: relative; z-index: 1;
	font-size: clamp(30px, 4vw, 50px);
	font-weight: 800; letter-spacing: -.035em; line-height: 1.02;
	color: var(--gd-black); margin: 0 0 16px;
}
.gd-step-p {
	position: relative; z-index: 1;
	font-size: 17px; line-height: 1.7; color: var(--gd-text);
	max-width: 44ch; margin: 0;
}
.gd-steps-nav { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.gd-step-tab {
	background: none; border: none; cursor: pointer; font-family: inherit;
	text-align: left; padding: 0; display: flex; flex-direction: column; gap: 5px;
	opacity: .5; transition: opacity .25s ease;
}
.gd-step-tab:hover { opacity: .82; }
.gd-step-tab.is-active { opacity: 1; }
.gd-step-tab-num { font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gd-blue); }
.gd-step-tab-name { font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); }
.gd-step-tab-track { margin-top: 9px; height: 3px; background: rgba(0,0,0,.12); border-radius: 2px; overflow: hidden; }
.gd-step-tab-fill { display: block; height: 100%; width: 0; background: var(--gd-blue); border-radius: 2px; }
.gd-step-tab:focus-visible { outline: 3px solid var(--gd-blue); outline-offset: 4px; border-radius: 4px; }
@media (max-width: 760px) {
	.gd-steps-stage { padding: 36px 28px; }
	.gd-steps-nav { grid-template-columns: 1fr 1fr; gap: 22px 14px; }
	.gd-step-index { right: 10px; font-size: 130px; }
	.gd-step-p { font-size: 16px; }
}

/* ─────── GLOBE — "Patienter reser till oss" ─────── */
.gd-globe-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.gd-globe-text .gd-h2 { margin: 12px 0 0; }
.gd-globe-text .gd-body-txt { margin: 18px 0 0; }
.gd-globe-cities {
	list-style: none; margin: 26px 0 28px; padding: 0;
	display: grid; grid-template-columns: repeat(2, max-content); gap: 10px 40px;
}
.gd-globe-cities li {
	display: flex; align-items: center; gap: 10px;
	font-size: 15px; font-weight: 600; color: var(--gd-black);
}
.gd-globe-cities li::before {
	content: ""; width: 7px; height: 7px; border-radius: 50%;
	background: var(--gd-blue); flex-shrink: 0;
}
.gd-globe-cities li a { color: inherit; text-decoration: none; transition: color .15s ease; }
.gd-globe-cities li a:hover { color: var(--gd-blue); text-decoration: none; }
.gd-globe-cities li:first-child { font-weight: 800; }
.gd-globe-cities li:first-child::before { box-shadow: 0 0 0 4px rgba(30,115,190,.18); }
.gd-globe-stage { width: 100%; max-width: 440px; aspect-ratio: 1 / 1; margin: 0 auto; }
/* Lättviktig "räckvidd"-grafik — ren CSS, ingen WebGL, ingen löpande kostnad */
.gd-reach { position: relative; width: 100%; height: 100%; }
.gd-reach-ring {
	position: absolute; top: 50%; left: 50%;
	border: 1.5px solid var(--gd-border); border-radius: 50%;
	transform: translate(-50%, -50%);
}
.gd-reach-ring:nth-of-type(1) { width: 38%; height: 38%; }
.gd-reach-ring:nth-of-type(2) { width: 67%; height: 67%; }
.gd-reach-ring:nth-of-type(3) { width: 97%; height: 97%; border-style: dashed; }
.gd-reach::before {
	content: ""; position: absolute; top: 50%; left: 50%;
	width: 38%; height: 38%; border-radius: 50%;
	border: 2px solid var(--gd-blue);
	transform: translate(-50%, -50%);
	animation: gd-reach-pulse 3.6s ease-out infinite;
}
@keyframes gd-reach-pulse {
	0% { transform: translate(-50%,-50%) scale(.45); opacity: .65; }
	100% { transform: translate(-50%,-50%) scale(2.55); opacity: 0; }
}
.gd-reach-core {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
	width: 62px; height: 62px; border-radius: 50%;
	background: var(--gd-blue); color: #fff;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 14px 32px -10px rgba(30,115,190,.6); z-index: 2;
}
.gd-reach-core svg { width: 28px; height: 28px; }
.gd-reach-label {
	position: absolute; top: calc(50% + 46px); left: 50%; transform: translateX(-50%);
	font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
	color: var(--gd-black); white-space: nowrap; z-index: 2;
}
.gd-reach-dot {
	position: absolute; width: 13px; height: 13px;
	border-radius: 50%; background: var(--gd-white);
	border: 2.5px solid var(--gd-blue); transform: translate(-50%,-50%);
}
/* Varierad, on-brand färg per stad */
.gd-reach-dot:nth-of-type(2) { border-color: #6C7079; }
.gd-reach-dot:nth-of-type(3) { border-color: #1E73BE; }
.gd-reach-dot:nth-of-type(4) { border-color: #1F8A70; }
.gd-reach-dot:nth-of-type(5) { border-color: #6C7079; }
.gd-reach-dot:nth-of-type(6) { border-color: #C8873A; }
.gd-reach-dot:nth-of-type(7) { border-color: #1F8A70; }
.gd-reach-dot:nth-of-type(8) { border-color: #C8873A; }
/* Aktiv stad (på stadssidor) — markerad prick */
.gd-reach-dot.gd-reach-dot-active {
	width: 22px; height: 22px;
	background: var(--gd-blue); border-color: var(--gd-blue);
	box-shadow: 0 0 0 7px rgba(30,115,190,.2);
	z-index: 3;
}

/* ─────── STADSSIDA ─────── */
.gd-city-hero { background: var(--gd-grad); padding: 56px 40px 84px; text-align: center; }
.gd-city-hero-inner { max-width: 780px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 20px; }
.gd-city-h1 { font-size: clamp(46px, 7vw, 90px); font-weight: 800; letter-spacing: -.045em; line-height: 1.03; color: var(--gd-black); margin: 6px 0 0; }
.gd-city-h1 em { font-style: italic; font-weight: 500; }
.gd-city-lead { font-size: clamp(16px, 1.8vw, 19px); line-height: 1.65; color: var(--gd-text); max-width: 56ch; margin: 0; }
.gd-city-intro { padding-top: 84px; padding-bottom: 8px; }
.gd-city-body {
	max-width: 780px; margin: 0 auto; text-align: center;
	font-size: clamp(21px, 2.6vw, 30px); font-weight: 500;
	line-height: 1.45; letter-spacing: -.02em; color: var(--gd-black);
}
.gd-city-body em { font-style: italic; }
.gd-city-hero .gd-hero-ctas { justify-content: center; margin-top: 8px; }
.gd-city-hero .gd-hero-trust { justify-content: center; }
@media (max-width: 900px) {
	.gd-city-hero { padding: 26px 20px 56px; }
}
@media (max-width: 900px) {
	.gd-globe-grid { grid-template-columns: 1fr; gap: 36px; }
	.gd-globe-stage { max-width: 340px; }
	.gd-globe-cities { gap: 10px 28px; }
}

/* ─────── PRICING — planer + toggle ─────── */
.gd-pricing-head {
	display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px;
	align-items: end; margin-bottom: 44px;
}
.gd-pricing-intro .gd-h2 { margin: 12px 0 0; }
.gd-pricing-intro .gd-body-txt { margin: 16px 0 0; max-width: 46ch; }

/* Toggle */
.gd-price-toggle {
	position: relative; justify-self: end;
	display: inline-flex; padding: 5px;
	background: var(--gd-white); border: 1px solid var(--gd-border);
	border-radius: 100px;
}
.gd-pt-btn {
	position: relative; z-index: 1;
	border: none; background: none; cursor: pointer; font-family: inherit;
	font-size: 13px; font-weight: 700; letter-spacing: .01em;
	padding: 11px 22px; border-radius: 100px;
	color: var(--gd-text); transition: color .25s ease;
}
.gd-pt-btn.is-active { color: #fff; }
.gd-pt-ind {
	position: absolute; top: 5px; left: 5px; z-index: 0;
	width: calc(50% - 5px); height: calc(100% - 10px);
	background: var(--gd-blue); border-radius: 100px;
	transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.gd-price-toggle.is-month .gd-pt-ind { transform: translateX(100%); }

/* Plan-rutnät */
.gd-pricing { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.gd-plan {
	display: flex; flex-direction: column;
	background: var(--gd-white); border: 1px solid rgba(0,0,0,.07);
	border-radius: 18px; padding: 30px 26px 28px;
	transition: transform .2s ease, box-shadow .2s ease;
}
.gd-plan:hover { transform: translateY(-4px); box-shadow: 0 26px 52px -28px rgba(0,0,0,.22); }
.gd-plan-pop {
	background: var(--gd-black); color: #fff;
	border-color: var(--gd-black);
	box-shadow: 0 30px 60px -30px rgba(0,0,0,.5);
}
.gd-plan-badge {
	align-self: flex-start;
	font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
	background: var(--gd-blue); color: #fff;
	padding: 6px 12px; border-radius: 100px; margin-bottom: 16px;
}
.gd-plan-priceline { display: flex; align-items: baseline; gap: 7px; }
.gd-plan-num { font-size: clamp(30px, 3.4vw, 42px); font-weight: 800; letter-spacing: -.04em; line-height: 1; }
.gd-plan-unit { display: flex; flex-direction: column; font-size: 14px; font-weight: 600; line-height: 1.15; }
.gd-plan-unit small { font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; opacity: .5; }
.gd-plan-name { font-size: 19px; font-weight: 800; letter-spacing: -.02em; margin: 18px 0 6px; }
.gd-plan-pop .gd-plan-name { color: #fff; }
.gd-plan-desc { font-size: 13px; line-height: 1.55; opacity: .7; margin: 0 0 18px; }
.gd-plan-inc { border-top: 1px solid rgba(0,0,0,.1); padding-top: 16px; margin-bottom: 22px; }
.gd-plan-pop .gd-plan-inc { border-color: rgba(255,255,255,.16); }
.gd-plan-inc-h { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; opacity: .55; }
.gd-plan-inc ul { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.gd-plan-inc li { position: relative; padding-left: 26px; font-size: 13.5px; line-height: 1.4; }
.gd-plan-inc li::before {
	content: ""; position: absolute; left: 0; top: 0;
	width: 17px; height: 17px; border-radius: 50%;
	background: var(--gd-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/11px no-repeat;
}
.gd-plan .gd-btn { margin-top: auto; }

/* ─────── KALKYLATOR — guidad stepper ─────── */
.gd-calc { background: var(--gd-white); color: var(--gd-black); border-radius: 20px; padding: 44px; margin-top: 40px; border: 1px solid rgba(0,0,0,.06); box-shadow: 0 30px 64px -42px rgba(0,0,0,.3); }
.gd-calc-intro { margin-bottom: 30px; }
.gd-calc-lbl { display: block; font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gd-blue); }
.gd-calc-h { font-size: clamp(22px, 2.8vw, 30px); font-weight: 800; letter-spacing: -.025em; color: var(--gd-black); margin: 8px 0 6px; }
.gd-calc-note { font-size: 14px; line-height: 1.55; color: var(--gd-text); opacity: .75; margin: 0; }

.gd-cstepper { list-style: none; margin: 0; padding: 0; }
.gd-cstep { display: flex; gap: 18px; position: relative; padding-bottom: 6px; }
.gd-cstep-rail { position: relative; width: 36px; flex-shrink: 0; }
.gd-cstep-rail::before {
	content: ""; position: absolute; left: 17px; top: 40px; bottom: -6px;
	width: 2px; background: var(--gd-border);
}
.gd-cstep:last-child .gd-cstep-rail::before { display: none; }
.gd-cstep.is-done .gd-cstep-rail::before { background: var(--gd-blue); }
.gd-cstep-dot {
	width: 36px; height: 36px; border-radius: 50%;
	border: 2px solid var(--gd-border); background: var(--gd-white);
	display: flex; align-items: center; justify-content: center;
	transition: border-color .2s ease, background .2s ease;
}
.gd-cstep.is-active .gd-cstep-dot { border-color: var(--gd-blue); }
.gd-cstep.is-done .gd-cstep-dot { background: var(--gd-blue); border-color: var(--gd-blue); }
.gd-cstep-n { font-size: 14px; font-weight: 800; color: var(--gd-text); }
.gd-cstep.is-active .gd-cstep-n { color: var(--gd-blue); }
.gd-cstep-ok { width: 18px; height: 18px; color: #fff; display: none; }
.gd-cstep.is-done .gd-cstep-n { display: none; }
.gd-cstep.is-done .gd-cstep-ok { display: block; }

.gd-cstep-main { flex: 1; min-width: 0; padding-bottom: 14px; }
.gd-cstep-head {
	width: 100%; background: none; border: none; cursor: pointer;
	font-family: inherit; text-align: left; padding: 6px 0;
	display: flex; flex-direction: column; gap: 2px;
}
.gd-cstep-t { font-size: 17px; font-weight: 800; letter-spacing: -.015em; color: var(--gd-black); }
.gd-cstep-pick { font-size: 13px; font-weight: 500; color: var(--gd-text); opacity: .6; }
.gd-cstep.is-done .gd-cstep-pick { color: var(--gd-blue); opacity: 1; font-weight: 600; }
.gd-cstep-panel { max-height: 0; overflow: hidden; transition: max-height .4s ease; }
.gd-cstep.is-active .gd-cstep-panel { max-height: 460px; }

.gd-copts { display: flex; flex-direction: column; gap: 8px; padding: 12px 0 4px; }
.gd-copts-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.gd-copt {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	padding: 14px 16px; border: 1.5px solid var(--gd-border); border-radius: 10px;
	background: var(--gd-white); cursor: pointer; font-family: inherit;
	font-size: 14px; color: var(--gd-black); transition: border-color .15s ease, background .15s ease;
}
.gd-copts-grid .gd-copt { justify-content: center; }
.gd-copt:hover { border-color: var(--gd-black); }
.gd-copt.is-selected { border-color: var(--gd-blue); background: rgba(30,115,190,.07); }
.gd-copt strong { font-weight: 800; }
.gd-copt:focus-visible { outline: 3px solid var(--gd-blue); outline-offset: 2px; }

.gd-calc-result { text-align: center; padding: 14px 0 6px; }
.gd-calc-big { font-size: clamp(48px, 7vw, 78px); font-weight: 800; letter-spacing: -.045em; line-height: 1; color: var(--gd-blue); }
.gd-calc-sub { font-size: 13px; color: var(--gd-text); opacity: .6; margin: 6px 0 18px; }
.gd-calc-fine { font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gd-text); opacity: .4; margin-top: 12px; }

/* ─────── FAQ ─────── */
.gd-faq { max-width: 860px; margin: 0 auto; }
.gd-fq { border-bottom: 1px solid rgba(0,0,0,.1); padding: 24px 0; cursor: pointer; }
.gd-fq-q { display: flex; justify-content: space-between; align-items: center; gap: 24px; font-size: clamp(17px, 2vw, 22px); font-weight: 700; letter-spacing: -.015em; line-height: 1.25; color: var(--gd-black); }
.gd-fq-toggle { width: 36px; height: 36px; flex-shrink: 0; border: 1px solid rgba(0,0,0,.18); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 18px; transition: all .25s; }
.gd-fq.open .gd-fq-toggle { background: var(--gd-black); color: #fff; border-color: var(--gd-black); transform: rotate(45deg); }
.gd-fq-a { max-height: 0; overflow: hidden; transition: max-height .35s ease, margin-top .3s; font-size: 16px; line-height: 1.7; opacity: .75; }
.gd-fq.open .gd-fq-a { max-height: 320px; margin-top: 14px; }

/* ─────── BOKNING / MUNTRA ─────── */
.gd-lead-box { max-width: 720px; margin: 0 auto; background: var(--gd-white); border-radius: 20px; padding: 52px; }
.gd-lead-badge {
	display: inline-flex; align-items: center; gap: 9px;
	font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
	background: rgba(30,115,190,.1); color: var(--gd-blue);
	padding: 9px 15px; border-radius: 100px; margin-bottom: 18px;
}
.gd-lead-dot { width: 8px; height: 8px; background: var(--gd-blue); border-radius: 50%; }
.gd-lead-points { list-style: none; margin: 24px 0 28px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.gd-lead-points li {
	position: relative; padding-left: 30px;
	font-size: 15px; line-height: 1.5; color: var(--gd-text);
}
.gd-lead-points li::before {
	content: ""; position: absolute; left: 0; top: 1px;
	width: 20px; height: 20px; border-radius: 50%;
	background: var(--gd-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat;
}
.gd-lead-fine { font-size: 12px; opacity: .5; text-align: center; margin: 12px 0 0; }

/* ─────── STICKY MOBIL-CTA ─────── */
#gd-mobile-cta {
	display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 90;
	background: rgba(255,255,255,.95); backdrop-filter: blur(18px);
	border-top: 1px solid rgba(0,0,0,.08);
	padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
	gap: 12px; align-items: center;
}
.gd-mob-price { font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; line-height: 1.4; flex-shrink: 0; }
.gd-mob-price strong { display: block; color: var(--gd-blue); font-size: 14px; }

/* ─────── REVEAL-ANIMATION ─────── */
.gd-anim .gd-reveal { opacity: 0; transform: translateY(34px); transition: opacity .7s ease, transform .7s ease; }
.gd-reveal.in { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
	.gd-reveal, .gd-anim .gd-reveal { opacity: 1 !important; transform: none !important; }
	.gd-word, .gd-anim .gd-word { opacity: 1 !important; transform: none !important; }
	.gd-mq-track { animation: none; }
}

/* ─────── RESPONSIVT ─────── */
@media (max-width: 900px) {
	.gd-testi-grid, .gd-ba-grid { grid-template-columns: 1fr; }
	/* Panoramiska intraorala foton (≈2,6:1) — bred ram på mobil så de inte uppförstoras */
	.gd-ba-frame { aspect-ratio: 5 / 2; }
	.gd-quiz-wrap { grid-template-columns: 1fr; padding: 28px; gap: 28px; border-radius: 16px; }
	.gd-experts, .gd-tx-grid, .gd-pricing { grid-template-columns: 1fr 1fr; }
	.gd-pricing-head { grid-template-columns: 1fr; gap: 24px; }
	.gd-price-toggle { justify-self: start; }
	.gd-calc { padding: 26px; }
	.gd-copts-grid { grid-template-columns: 1fr 1fr; }
	.gd-lead-box { padding: 30px; }
	#gd-mobile-cta { display: flex; }
}
@media (max-width: 600px) {
	.gd-experts, .gd-tx-grid, .gd-pricing { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════
   BEHANDLINGSSIDOR
   ════════════════════════════════════════════════ */

/* ── Premium klinisk hero (.gd-th) ── */
.gd-th { background: var(--gd-grad); padding: 60px 0 92px; overflow: hidden; }
.gd-th-inner {
	max-width: 1280px; margin: 0 auto; padding: 0 40px;
	display: grid; grid-template-columns: 1.02fr .98fr; gap: 66px; align-items: center;
}
.gd-th-crumbs { display: flex; flex-wrap: wrap; gap: 7px; font-size: 12px; color: var(--gd-text); margin-bottom: 22px; }
.gd-th-crumbs a { color: var(--gd-text); opacity: .6; text-decoration: none; }
.gd-th-crumbs a:hover { opacity: 1; color: var(--gd-blue); }
.gd-th-crumbs span[aria-hidden] { opacity: .35; }
.gd-th-crumbs [aria-current] { color: var(--gd-black); font-weight: 600; }
.gd-th-eyebrow { display: flex; align-items: center; gap: 12px; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gd-blue); }
.gd-th-rule { width: 34px; height: 1.5px; background: var(--gd-blue); display: inline-block; flex-shrink: 0; }
.gd-th-h1 { font-size: clamp(38px, 5.4vw, 66px); font-weight: 800; letter-spacing: -.045em; line-height: 1.03; color: var(--gd-black); margin: 18px 0 20px; }
.gd-th-h1 em { font-style: italic; font-weight: 500; }
.gd-th-lead { font-size: clamp(16px, 1.55vw, 18px); line-height: 1.62; color: var(--gd-text); max-width: 500px; }
.gd-th-facts { display: flex; flex-wrap: wrap; margin: 30px 0; border-top: 1px solid rgba(0,0,0,.12); border-bottom: 1px solid rgba(0,0,0,.12); }
.gd-th-fact { padding: 16px 26px 16px 0; margin-right: 26px; border-right: 1px solid rgba(0,0,0,.1); }
.gd-th-fact:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.gd-th-fact dd { font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); margin: 0; }
.gd-th-fact dt { font-size: 10.5px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--gd-text); opacity: .6; margin-top: 4px; }
.gd-th-ctas { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.gd-th-quizlink { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 600; color: var(--gd-text); text-decoration: none; }
.gd-th-quizlink svg { width: 16px; height: 16px; color: var(--gd-blue); transition: transform .2s ease; }
.gd-th-quizlink:hover { color: var(--gd-black); }
.gd-th-quizlink:hover svg { transform: translateX(3px); }
.gd-th-media { position: relative; }
.gd-th-photo { border-radius: 24px; overflow: hidden; box-shadow: 0 44px 84px -48px rgba(10,20,40,.5); aspect-ratio: 6/5; }
.gd-th-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gd-th-badge {
	position: absolute; left: -24px; bottom: -24px; background: var(--gd-white);
	border-radius: 16px; padding: 17px 22px; display: flex; align-items: center; gap: 14px;
	box-shadow: 0 26px 46px -28px rgba(10,20,40,.5);
}
.gd-th-badge-star { font-size: 22px; font-weight: 800; color: var(--gd-blue); white-space: nowrap; }
.gd-th-badge-txt { font-size: 12px; line-height: 1.4; color: var(--gd-text); max-width: 160px; }
.gd-th-badge-txt strong { display: block; color: var(--gd-black); font-size: 13px; }

/* ── Scroll-driven "Så går det till" (.gd-proc) ── */
.gd-proc { position: relative; background: var(--gd-white); }
.gd-proc-sticky { padding: 96px 0; }
.gd-proc-inner {
	max-width: 1280px; margin: 0 auto; padding: 0 40px; width: 100%;
	display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center;
}
.gd-proc-media { position: relative; border-radius: 22px; overflow: hidden; aspect-ratio: 4/5; background: #0e1b2c; box-shadow: 0 44px 84px -50px rgba(0,0,0,.6); }
.gd-proc-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gd-proc-fallback { position: absolute; inset: 0; background: linear-gradient(160deg,#0e1b2c,#1a2c42); display: flex; align-items: center; justify-content: center; }
.gd-proc-fallback span { width: 34%; max-width: 140px; color: rgba(255,255,255,.5); }
.gd-proc-fallback svg { width: 100%; height: auto; }
.gd-proc-counter { position: absolute; left: 18px; bottom: 16px; z-index: 2; color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .08em; display: flex; align-items: baseline; gap: 6px; }
.gd-proc-counter .gd-proc-cur { font-size: 16px; }
.gd-proc-panel .gd-h2 { margin: 10px 0 4px; }
.gd-proc-steps { margin-top: 22px; display: flex; flex-direction: column; gap: 6px; }
.gd-proc-step { display: flex; gap: 16px; padding: 18px; border-radius: 14px; transition: background .35s ease, opacity .35s ease; }
.gd-proc-step-n { font-size: 13px; font-weight: 800; color: var(--gd-blue); flex-shrink: 0; padding-top: 2px; }
.gd-proc-step-h { font-size: 17px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); margin: 0 0 5px; }
.gd-proc-step-p { font-size: 14px; line-height: 1.6; color: var(--gd-text); margin: 0; }
/* Pinned läge — aktiveras av JS på desktop. Utan JS = vanlig staplad sektion. */
.gd-proc.is-pinned { height: 340vh; }
.gd-proc.is-pinned .gd-proc-sticky { position: sticky; top: 0; height: 100vh; padding: 0; display: flex; align-items: center; overflow: hidden; }
.gd-proc.is-pinned .gd-proc-step { opacity: .42; }
.gd-proc.is-pinned .gd-proc-step.is-active { opacity: 1; background: var(--gd-beige); }

/* Intro */
.gd-tp-intro-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 48px; align-items: start; }
.gd-tp-intro-body p + p { margin-top: 16px; }

/* Fördelar */
.gd-tp-benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.gd-tp-benefit {
	background: var(--gd-white); border: 1px solid rgba(0,0,0,.07);
	border-radius: 18px; padding: 32px 28px;
	box-shadow: 0 24px 48px -40px rgba(0,0,0,.4);
}
.gd-tp-benefit-num { font-size: 13px; font-weight: 800; letter-spacing: .1em; color: var(--gd-blue); }
.gd-tp-benefit-h { font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); margin: 12px 0 9px; line-height: 1.22; }
.gd-tp-benefit-p { font-size: 14.5px; line-height: 1.62; color: var(--gd-text); }

/* Jämförelsetabell */
.gd-tp-cmp-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 16px; }
.gd-tp-cmp { width: 100%; min-width: 640px; border-collapse: collapse; background: var(--gd-white); }
.gd-tp-cmp th, .gd-tp-cmp td {
	padding: 15px 16px; text-align: left; font-size: 14px;
	border-bottom: 1px solid rgba(0,0,0,.08);
}
.gd-tp-cmp thead th { font-weight: 800; color: var(--gd-black); font-size: 13.5px; border-bottom: 2px solid rgba(0,0,0,.12); }
.gd-tp-cmp-lbl { font-weight: 700; color: var(--gd-black); }
.gd-tp-cmp td { color: var(--gd-text); }
.gd-tp-cmp .on { background: rgba(30,115,190,.08); }
.gd-tp-cmp thead th.on { background: var(--gd-blue); color: #fff; border-bottom-color: var(--gd-blue); }
.gd-tp-cmp tbody td.on { color: var(--gd-black); font-weight: 700; }

/* Pris */
.gd-tp-price { display: grid; grid-template-columns: 1.15fr .85fr; gap: 44px; align-items: center; }
.gd-tp-price .gd-h2 { margin: 12px 0 14px; }
.gd-tp-price-card {
	background: var(--gd-black); color: #fff; border-radius: 22px;
	padding: 34px 32px; display: flex; flex-direction: column; gap: 4px;
	box-shadow: 0 36px 70px -44px rgba(0,0,0,.6);
}
.gd-tp-price-name { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.gd-tp-price-from { font-size: 13px; color: rgba(255,255,255,.55); margin-top: 14px; }
.gd-tp-price-big { font-size: clamp(32px, 4.4vw, 44px); font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.gd-tp-price-month { font-size: 13.5px; color: rgba(255,255,255,.7); margin-bottom: 20px; }
.gd-tp-price-card .gd-btn { margin-top: 4px; }
.gd-tp-price-fine { font-size: 11.5px; color: rgba(255,255,255,.5); text-align: center; margin-top: 10px; }

/* Relaterade behandlingar */
.gd-tp-related { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.gd-tp-relcard {
	background: var(--gd-white); border: 1px solid rgba(0,0,0,.07); border-radius: 16px;
	padding: 24px; text-decoration: none; display: flex; flex-direction: column; gap: 7px;
	transition: transform .2s ease, box-shadow .2s ease;
}
.gd-tp-relcard:hover { transform: translateY(-4px); box-shadow: 0 28px 50px -36px rgba(0,0,0,.45); }
.gd-tp-relicon {
	width: 44px; height: 44px; border-radius: 11px; background: var(--gd-beige);
	display: flex; align-items: center; justify-content: center; color: var(--gd-black);
	margin-bottom: 6px; transition: background .2s ease, color .2s ease;
}
.gd-tp-relicon svg { width: 24px; height: 24px; }
.gd-tp-relcard:hover .gd-tp-relicon { background: var(--gd-blue); color: #fff; }
.gd-tp-relname { font-size: 17px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); }
.gd-tp-relvis { font-size: 12.5px; color: var(--gd-text); opacity: .75; }
.gd-tp-relmore { font-size: 13px; font-weight: 700; color: var(--gd-blue); display: flex; align-items: center; gap: 6px; margin-top: 4px; }
.gd-tp-relmore svg { width: 16px; height: 16px; }

@media (max-width: 880px) {
	.gd-th { padding: 24px 0 56px; }
	.gd-th-inner { grid-template-columns: 1fr; gap: 40px; padding: 0 20px; }
	.gd-th-photo { aspect-ratio: 4/3; }
	.gd-th-badge { left: 16px; bottom: -20px; padding: 14px 18px; }
	.gd-th-fact { padding: 12px 18px 12px 0; margin-right: 18px; }
	/* Process: alltid staplad på mobil, ingen pinning */
	.gd-proc.is-pinned { height: auto !important; }
	.gd-proc.is-pinned .gd-proc-sticky { position: static; height: auto; padding: 64px 0; display: block; }
	.gd-proc.is-pinned .gd-proc-step { opacity: 1; }
	.gd-proc-inner { grid-template-columns: 1fr; gap: 32px; padding: 0 20px; }
	.gd-proc-media { aspect-ratio: 5/4; max-width: 460px; }
	.gd-tp-intro-grid { grid-template-columns: 1fr; gap: 18px; }
	.gd-tp-benefits { grid-template-columns: 1fr; }
	.gd-tp-price { grid-template-columns: 1fr; gap: 26px; }
	.gd-tp-related { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════
   STANDARDSIDOR (priser / om oss / kontakt / bokning)
   ════════════════════════════════════════════════ */
.gd-ph { background: var(--gd-grad); padding: 72px 0 84px; text-align: center; }
.gd-ph-inner { max-width: 780px; margin: 0 auto; padding: 0 40px; display: flex; flex-direction: column; align-items: center; }
.gd-ph .gd-th-eyebrow { justify-content: center; }
.gd-ph-h1 { font-size: clamp(38px, 5.4vw, 64px); font-weight: 800; letter-spacing: -.045em; line-height: 1.04; color: var(--gd-black); margin: 18px 0; }
.gd-ph-h1 em { font-style: italic; font-weight: 500; }
.gd-ph-lead { font-size: clamp(16px, 1.6vw, 18.5px); line-height: 1.62; color: var(--gd-text); max-width: 600px; margin: 0 0 28px; }
.gd-ph .gd-hero-ctas { justify-content: center; }
.gd-price-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.gd-price-card {
	position: relative; background: var(--gd-white); border: 1px solid rgba(0,0,0,.08);
	border-radius: 18px; padding: 32px 26px; display: flex; flex-direction: column;
	box-shadow: 0 24px 48px -40px rgba(0,0,0,.4);
}
.gd-price-card.is-feat { border: 1.5px solid var(--gd-blue); box-shadow: 0 34px 64px -36px rgba(30,115,190,.5); }
.gd-price-tag { position: absolute; top: -12px; left: 26px; background: var(--gd-blue); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }
.gd-price-name { font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); margin: 4px 0; }
.gd-price-desc { font-size: 13px; color: var(--gd-text); opacity: .8; margin: 0 0 16px; min-height: 36px; line-height: 1.4; }
.gd-price-amount { font-size: 27px; font-weight: 800; letter-spacing: -.03em; color: var(--gd-black); }
.gd-price-month { font-size: 12.5px; color: var(--gd-text); opacity: .75; margin-bottom: 18px; }
.gd-price-list { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.gd-price-list li { font-size: 13px; color: var(--gd-text); padding-left: 22px; position: relative; line-height: 1.45; }
.gd-price-list li::before { content: "✓"; position: absolute; left: 0; color: var(--gd-blue); font-weight: 800; }
.gd-price-card .gd-btn { margin-top: auto; }
.gd-contact-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.gd-contact-card { background: var(--gd-white); border: 1px solid rgba(0,0,0,.08); border-radius: 16px; padding: 28px 24px; }
.gd-contact-h { font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gd-blue); margin: 0 0 12px; }
.gd-contact-v { font-size: 18px; font-weight: 700; color: var(--gd-black); line-height: 1.4; margin: 0 0 8px; }
.gd-contact-v a { color: var(--gd-black); text-decoration: none; }
.gd-contact-v a:hover { color: var(--gd-blue); }
.gd-contact-sub { font-size: 13px; color: var(--gd-text); opacity: .8; line-height: 1.5; margin: 0; }
.gd-map { border-radius: 20px; overflow: hidden; box-shadow: 0 30px 60px -44px rgba(0,0,0,.5); }
.gd-map iframe { width: 100%; height: 430px; border: 0; display: block; }
.gd-booking { background: var(--gd-white); border: 1px solid rgba(0,0,0,.08); border-radius: 20px; padding: 26px; min-height: 220px; box-shadow: 0 30px 60px -46px rgba(0,0,0,.4); }
@media (max-width: 1080px) {
	.gd-price-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gd-contact-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 880px) {
	.gd-ph { padding: 28px 0 56px; }
	.gd-ph-inner { padding: 0 20px; }
	.gd-price-grid, .gd-contact-grid { grid-template-columns: 1fr; }
	.gd-map iframe { height: 320px; }
}

/* Länk-kort-rutnät (tandreglering-hubben) */
.gd-pg-linkgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
@media (max-width: 1080px) { .gd-pg-linkgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 880px) { .gd-pg-linkgrid { grid-template-columns: 1fr; } }

/* ─── Tandreglering-hubben ─── */
.gd-imgsplit { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.gd-imgsplit-img { border-radius: 22px; overflow: hidden; box-shadow: 0 40px 80px -50px rgba(10,20,40,.5); aspect-ratio: 6/5; }
.gd-imgsplit-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gd-imgsplit-txt .gd-h2 { margin: 10px 0 16px; }
.gd-imgsplit-txt .gd-body-txt + .gd-body-txt { margin-top: 14px; }
.gd-hubstats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.gd-hubstat { display: flex; flex-direction: column; gap: 8px; }
.gd-hubstat-n { font-size: clamp(38px, 4.5vw, 54px); font-weight: 800; letter-spacing: -.04em; color: #fff; line-height: 1; }
.gd-hubstat-l { font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.7); }
.gd-hubcard { background: var(--gd-white); border: 1px solid rgba(0,0,0,.08); border-radius: 18px; padding: 28px 24px; text-decoration: none; display: flex; flex-direction: column; box-shadow: 0 24px 48px -40px rgba(0,0,0,.4); transition: transform .2s ease, box-shadow .2s ease; }
.gd-hubcard:hover { transform: translateY(-4px); box-shadow: 0 30px 56px -36px rgba(0,0,0,.45); }
.gd-hubcard-ic { width: 46px; height: 46px; border-radius: 12px; background: var(--gd-beige); display: flex; align-items: center; justify-content: center; color: var(--gd-black); transition: background .2s ease, color .2s ease; }
.gd-hubcard-ic svg { width: 25px; height: 25px; }
.gd-hubcard:hover .gd-hubcard-ic { background: var(--gd-blue); color: #fff; }
.gd-hubcard-vis { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gd-blue); margin-top: 16px; }
.gd-hubcard-name { font-size: 17px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); margin-top: 5px; }
.gd-hubcard-desc { font-size: 13px; line-height: 1.5; color: var(--gd-text); margin-top: 6px; }
.gd-hubcard .gd-tp-relmore { margin-top: 14px; }
@media (max-width: 880px) {
	.gd-imgsplit { grid-template-columns: 1fr; gap: 28px; }
	.gd-imgsplit-img { aspect-ratio: 4/3; }
	.gd-hubstats { grid-template-columns: 1fr 1fr; gap: 24px; }
}

/* ════════════════════════════════════════════════
   HALO-SEKTIONER — alternerande bild/text-split + numrerad CTA
   Delas av standardsidor och behandlingssidor.
   ════════════════════════════════════════════════ */

/* ── Alternerande split-sektioner ── */
.gd-splits { display: flex; flex-direction: column; gap: 76px; }
.gd-split {
	display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center;
}
.gd-split--rev .gd-split-media { order: 2; }
.gd-split-img {
	border-radius: 22px; overflow: hidden; aspect-ratio: 4 / 3;
	background: var(--gd-card);
	box-shadow: 0 40px 80px -50px rgba(10,20,40,.5);
}
.gd-split-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gd-split-num { font-size: 13px; font-weight: 800; letter-spacing: .12em; color: var(--gd-blue); }
.gd-split-h {
	font-size: clamp(24px, 3vw, 34px); font-weight: 800; letter-spacing: -.03em;
	line-height: 1.14; color: var(--gd-black); margin: 12px 0 14px; text-wrap: balance;
}
.gd-split-h em { font-style: italic; font-weight: 500; }
.gd-split-text .gd-h2 { margin: 6px 0 16px; }
.gd-split-text .gd-body-txt + .gd-body-txt { margin-top: 12px; }
.gd-split-points { list-style: none; margin: 20px 0 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.gd-split-points li {
	font-size: 14.5px; line-height: 1.5; color: var(--gd-text);
	padding-left: 26px; position: relative;
}
.gd-split-points li::before {
	content: "✓"; position: absolute; left: 0; top: 0;
	color: var(--gd-blue); font-weight: 800;
}

/* ── Numrerad boknings-CTA ── */
.gd-cta {
	display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center;
	background: var(--gd-white); border-radius: 24px; padding: 56px;
	box-shadow: 0 44px 84px -54px rgba(10,20,40,.5);
}
.gd-cta-badge {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: 12px; font-weight: 600; letter-spacing: .03em; color: var(--gd-text);
	background: var(--gd-beige); border-radius: 999px; padding: 7px 14px;
}
.gd-cta-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gd-blue); flex-shrink: 0; }
.gd-cta-text .gd-sec-num { margin-top: 20px; }
.gd-cta-text .gd-h2 { margin: 2px 0 14px; }
.gd-cta-text .gd-btn { margin-top: 22px; }
.gd-cta-fine { font-size: 12px; opacity: .55; margin: 12px 0 0; }
.gd-cta-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.gd-cta-steps li { display: flex; gap: 18px; padding: 20px 4px; align-items: flex-start; }
.gd-cta-steps li + li { border-top: 1px solid rgba(0,0,0,.09); }
.gd-cta-steps li > div { flex: 1; }
.gd-cta-step-n {
	width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
	background: var(--gd-blue); color: #fff; font-weight: 800; font-size: 15px;
	display: flex; align-items: center; justify-content: center;
}
.gd-cta-steps strong {
	display: block; font-size: 16px; font-weight: 800; letter-spacing: -.02em;
	color: var(--gd-black); margin-bottom: 4px;
}
.gd-cta-steps span { font-size: 14px; line-height: 1.55; color: var(--gd-text); }

@media (max-width: 880px) {
	.gd-splits { gap: 48px; }
	.gd-split { grid-template-columns: 1fr; gap: 26px; }
	.gd-split--rev .gd-split-media { order: 0; }
	.gd-split-img { aspect-ratio: 3 / 2; }
	.gd-cta { grid-template-columns: 1fr; gap: 30px; padding: 32px; border-radius: 18px; }
}

/* ════════════════════════════════════════════════
   BETTFEL-SIDOR — ankarmeny, punktrutnät, orsaker, före/efter
   ════════════════════════════════════════════════ */

/* Ankarlänkar i heron */
.gd-th-anchors { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.gd-th-anchors a {
	font-size: 12.5px; font-weight: 600; color: var(--gd-text); text-decoration: none;
	padding: 8px 15px; border-radius: 999px; border: 1px solid rgba(0,0,0,.13);
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.gd-th-anchors a:hover { background: var(--gd-black); color: #fff; border-color: var(--gd-black); }

/* Fast ankarmeny längst ner (Halo-signatur) */
.gd-anchorbar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
	display: flex; align-items: center; gap: 14px;
	padding: 10px 24px calc(10px + env(safe-area-inset-bottom));
	background: rgba(255,255,255,.94); backdrop-filter: blur(18px);
	border-top: 1px solid rgba(0,0,0,.09);
	transition: transform .3s ease;
}
.gd-anchorbar.is-hidden { transform: translateY(110%); }
.gd-anchorbar-links { display: flex; gap: 4px; flex: 1; overflow-x: auto; scrollbar-width: none; }
.gd-anchorbar-links::-webkit-scrollbar { display: none; }
.gd-anchorbar-links a {
	font-size: 13px; font-weight: 600; color: var(--gd-text); text-decoration: none;
	padding: 9px 16px; border-radius: 999px; white-space: nowrap;
	transition: background .18s ease, color .18s ease;
}
.gd-anchorbar-links a:hover { color: var(--gd-black); }
.gd-anchorbar-links a.is-active { background: var(--gd-beige); color: var(--gd-black); }
.gd-anchorbar .gd-btn { flex-shrink: 0; }
.gd-anchorbar-spacer { height: 66px; }

/* Punktrutnät — symptom & risker */
.gd-pointgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 26px; }
.gd-point {
	display: flex; gap: 14px; align-items: flex-start;
	background: var(--gd-white); border: 1px solid rgba(0,0,0,.07);
	border-radius: 14px; padding: 18px 20px;
	font-size: 15px; line-height: 1.5; color: var(--gd-text);
}
.gd-point-mark {
	flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%;
	background: var(--gd-blue); color: #fff; font-weight: 800; font-size: 14px;
	display: flex; align-items: center; justify-content: center;
}
.gd-pointgrid--risk .gd-point-mark { background: var(--gd-pink); }

/* Orsaks-rutnät */
.gd-causegrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.gd-cause {
	background: var(--gd-white); border: 1px solid rgba(0,0,0,.07); border-radius: 16px;
	padding: 26px 22px; box-shadow: 0 24px 48px -42px rgba(0,0,0,.4);
}
.gd-cause-num { font-size: 13px; font-weight: 800; letter-spacing: .1em; color: var(--gd-blue); }
.gd-cause-txt { font-size: 14.5px; line-height: 1.6; color: var(--gd-text); margin: 12px 0 0; }

/* Före / efter */
.gd-bagrid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.gd-bacard { margin: 0; position: relative; border-radius: 18px; overflow: hidden; box-shadow: 0 30px 60px -46px rgba(0,0,0,.5); }
.gd-bacard img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 16 / 10; }
.gd-bacard figcaption {
	position: absolute; left: 16px; top: 16px;
	background: rgba(255,255,255,.95); color: var(--gd-black);
	font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
	padding: 6px 14px; border-radius: 999px;
}

@media (max-width: 880px) {
	.gd-anchorbar { padding: 8px 14px calc(8px + env(safe-area-inset-bottom)); gap: 8px; }
	.gd-anchorbar-links a { padding: 8px 13px; font-size: 12.5px; }
	.gd-anchorbar .gd-btn { padding: 12px 18px; font-size: 11px; }
	.gd-pointgrid { grid-template-columns: 1fr; gap: 12px; }
	.gd-causegrid { grid-template-columns: 1fr 1fr; gap: 14px; }
	.gd-bagrid { grid-template-columns: 1fr; gap: 16px; }
}
@media (max-width: 560px) {
	.gd-causegrid { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════════════
   PREMIUM v1.8 — display-serif, förfinad rörelse, mjuka toner
   Editorial serif på rubriker/titlar (JQ-referensens premium-känsla),
   sans behålls för brödtext, eyebrows, knappar och etiketter.
   ════════════════════════════════════════════════════════════ */

/* Stora display-rubriker — elegant serif, lätt vikt, luftig tracking. */
.gd-h2,
#gd-hero-h1,
.gd-ph-h1,
.gd-th-h1,
.gd-city-h1,
.gd-ep-big,
.gd-quiz-q,
.gd-calc-big,
.gd-plan-num {
	font-family: var(--gd-serif);
	font-weight: 400;
	letter-spacing: -.015em;
}
.gd-h2 { line-height: 1.05; }
.gd-th-h1, .gd-ph-h1, .gd-city-h1, #gd-hero-h1 { line-height: 1.06; }

/* Kursiva accenter i serif blir verkligt kursiva (Spectral italic). */
.gd-h2 em,
#gd-hero-h1 em,
.gd-ph-h1 em,
.gd-th-h1 em,
.gd-city-h1 em,
.gd-ep-big em {
	font-family: var(--gd-serif);
	font-weight: 400;
	font-style: italic;
}

/* Kort- och sektionstitlar — serif i mellanvikt, editorial men tydlig. */
.gd-ep-name,
.gd-tx-title,
.gd-scard-title,
.gd-step-tab-name,
.gd-hubcard-name,
.gd-plan-name,
.gd-price-name,
.gd-testi-author,
.gd-step-h,
.gd-split-text h3,
.gd-fq-q > span,
.gd-tp-benefit-h {
	font-family: var(--gd-serif);
	font-weight: 500;
	letter-spacing: -.005em;
}

/* Förfinad scroll-rörelse — mjuk ease-out-expo, lite längre, lite mer väg. */
.gd-anim .gd-reveal {
	transform: translateY(42px);
	transition: opacity 1s var(--gd-ease), transform 1s var(--gd-ease);
}
.gd-anim .gd-word {
	transition: opacity .85s var(--gd-ease), transform .85s var(--gd-ease);
}

/* Premium-hover på kort: mjukare lyft med förfinad easing. */
.gd-tx, .gd-scard, .gd-hubcard, .gd-expert, .gd-plan, .gd-tp-relcard {
	transition: transform .45s var(--gd-ease), box-shadow .45s var(--gd-ease), border-color .3s ease;
}

/* ── Staggrad barn-reveal ── barnen i ett rutnät träder in ett efter ett. */
.gd-anim .gd-reveal-stagger > * {
	opacity: 0;
	transform: translateY(34px);
	transition: opacity .9s var(--gd-ease), transform .9s var(--gd-ease);
}
.gd-reveal-stagger > *.in { opacity: 1; transform: none; }

/* ── Parallax-bild ── img:en är överstor och centrerad i en klippande ram
   så att JS:ets ±9 %-rörelse aldrig blottar en kant. */
.gd-px { position: relative; overflow: hidden; }
.gd-px > [data-parallax] {
	position: absolute; left: 0; top: -12%;
	width: 100%; height: 124%;
	object-fit: cover; will-change: transform;
	transition: none;
}

@media (prefers-reduced-motion: reduce) {
	.gd-reveal-stagger > * { opacity: 1 !important; transform: none !important; }
	.gd-px > [data-parallax] { position: static; top: 0; height: 100%; transform: none !important; }
}

/* ════════════════════════════════════════════════════════════
   PREMIUM v2 — lyft mot referensnivå
   Editorial luft, förfinade eyebrows, kort, knappar, statistik.
   ════════════════════════════════════════════════════════════ */

/* Editorial rytm — luftig men sektionerna ska inte spränga viewporten. */
.gd-section { padding: clamp(74px, 9vw, 128px) 44px; }
.gd-section-full { padding: clamp(74px, 9vw, 128px) 0; }
.gd-section-full > .gd-section { padding-top: 0; padding-bottom: 0; }
.gd-section-head { margin-bottom: clamp(40px, 5vw, 64px); gap: 56px; }

/* Eyebrow — pyttetunn versal med ledande streck (referensens känsla). */
.gd-sec-num {
	display: inline-flex; align-items: center; gap: 12px;
	font-size: 10.5px; font-weight: 700; letter-spacing: .26em;
	opacity: .62; margin-bottom: 18px;
}
.gd-sec-num::before {
	content: ""; width: 26px; height: 1px;
	background: currentColor; opacity: .55; flex: none;
}

/* Brödtext — aning större, mer luft för editorial läsning. */
.gd-body-txt { font-size: 16.5px; line-height: 1.78; }

/* Display-rubriker — återhållsam JQ-skala (max ~62px), inte gigantiska. */
.gd-h2 { font-size: clamp(32px, 4.4vw, 62px); line-height: 1.06; }

/* Kort — mjukare radie, tunnare ram, förfinad skugga + lyft. */
.gd-tx, .gd-scard, .gd-hubcard, .gd-expert, .gd-plan, .gd-price-card, .gd-tp-relcard {
	border-radius: 20px;
	border-color: rgba(21,23,27,.07);
}
.gd-tx:hover, .gd-scard:hover, .gd-hubcard:hover, .gd-tp-relcard:hover {
	transform: translateY(-6px);
	box-shadow: 0 38px 70px -44px rgba(21,23,27,.42);
}

/* Knappar — lugnare proportion. */
.gd-btn { letter-spacing: .1em; }
.gd-btn-lg { padding: 20px 42px; }

/* Statistik — överdriven närvaro, stora editorial-siffror. */
.gd-stats { gap: 0; border-top: 1px solid rgba(21,23,27,.1); }
.gd-stat {
	padding: 46px 32px; position: relative;
	border-bottom: 1px solid rgba(21,23,27,.1);
}
.gd-stat + .gd-stat { border-left: 1px solid rgba(21,23,27,.1); }
.gd-stat-n {
	font-family: var(--gd-serif); font-weight: 400;
	font-size: clamp(52px, 6vw, 92px); letter-spacing: -.02em;
	line-height: .95; color: var(--gd-black);
}
.gd-stat-l {
	font-size: 12px; font-weight: 600; letter-spacing: .12em;
	text-transform: uppercase; color: var(--gd-text);
	opacity: .62; margin-top: 14px;
}

@media (max-width: 900px) {
	.gd-section { padding: 80px 22px; }
	.gd-section-full { padding: 80px 0; }
	.gd-section-head { margin-bottom: 44px; gap: 18px; }
	.gd-h2 { font-size: clamp(34px, 9vw, 52px); }
	/* Stadssidans H1 saknade mobilregel (min 46px var for stor pa telefon). Skala ned. */
	.gd-city-h1 { font-size: clamp(34px, 9vw, 52px); }
	.gd-stat { padding: 32px 20px; }
	.gd-stat + .gd-stat { border-left: 0; }
}

/* ════════════════════════════════════════════════════════════
   PREMIUM v2.1 — tvinga display-serifen
   Elementors globala kit (.elementor-kit-38 h2/h3…) sätter Montserrat
   på alla rubrik-ELEMENT med specificitet (0,1,1) och slår våra
   (0,1,0)-klassregler. Vi tvingar igenom serifen med !important —
   legitimt eftersom vi inte kan röra Elementor-kit-CSS:en.
   ════════════════════════════════════════════════════════════ */
.gd-h2, #gd-hero-h1, .gd-ph-h1, .gd-th-h1, .gd-city-h1, .gd-ep-big,
.gd-quiz-q, .gd-calc-big, .gd-plan-num,
.gd-ep-name, .gd-tx-title, .gd-scard-title, .gd-step-tab-name, .gd-hubcard-name,
.gd-plan-name, .gd-price-name, .gd-testi-author, .gd-step-h, .gd-split-text h3,
.gd-fq-q > span, .gd-tp-benefit-h, .gd-stat-n,
.gd-h2 em, #gd-hero-h1 em, .gd-ph-h1 em, .gd-th-h1 em, .gd-city-h1 em, .gd-ep-big em {
	font-family: var(--gd-serif) !important;
}

/* ─── Quiz v3 (lead-gen "money machine") ─────────────────── */
.gd-quiz-sub { font-size: 14px; line-height: 1.55; color: var(--gd-text); opacity: .8; margin: -12px 0 20px; }

/* Intro */
.gd-quiz-intro-lead { font-size: 16px; line-height: 1.6; color: var(--gd-text); margin: 10px 0 18px; max-width: 46ch; }
.gd-quiz-intro-reward { font-size: 14.5px; line-height: 1.55; color: var(--gd-black); background: rgba(30,115,190,.07);
	border: 1px solid rgba(30,115,190,.18); border-radius: 12px; padding: 14px 16px; margin: 0 0 22px; }
.gd-quiz-intro-reward strong { color: var(--gd-blue); }
.gd-quiz-start { align-self: flex-start; }

/* Trust-rad (badges) */
.gd-quiz-trust { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 10px; }
.gd-quiz-trust li { font-size: 11.5px; font-weight: 700; letter-spacing: .02em; color: var(--gd-black);
	background: var(--gd-cream, #F4F1EA); border: 1px solid var(--gd-line, #D5D9E2); border-radius: 999px; padding: 6px 12px; position: relative; }
.gd-quiz-trust li::before { content: "✓"; color: var(--gd-ink); font-weight: 800; margin-right: 6px; }
.gd-quiz-trust--intro { margin-top: 16px; }

/* Match-badge */
.gd-quiz-result-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.gd-quiz-match { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; line-height: 1; text-align: center; }
.gd-quiz-match-pct { font-family: var(--gd-serif); font-size: clamp(30px, 4vw, 40px); font-weight: 700; color: var(--gd-blue); }
.gd-quiz-match-lbl { font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gd-text); opacity: .65; margin-top: 3px; }
.gd-quiz-match--gate { margin: 6px 0 4px; align-items: flex-start; flex-direction: row; gap: 8px; align-items: baseline; }

/* Därför-lista */
.gd-quiz-why { margin: 4px 0 18px; }
.gd-quiz-why-h { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gd-text); opacity: .7; }
.gd-quiz-why ul { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.gd-quiz-why li { font-size: 14.5px; line-height: 1.45; color: var(--gd-black); padding-left: 22px; position: relative; }
.gd-quiz-why li::before { content: "—"; position: absolute; left: 0; color: var(--gd-text); opacity: .55; font-weight: 400; }

/* Gate (pris-unlock) */
.gd-quiz-gate-h { font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--gd-black); margin: 14px 0 6px; }
.gd-quiz-read { font-size: 13.5px; font-weight: 700; color: var(--gd-blue); text-decoration: none; }
.gd-quiz-read:hover { text-decoration: underline; }
.gd-quiz-result-cta--ghost { margin-top: 14px; }

@media (max-width: 600px) {
	.gd-quiz-result-head { flex-direction: row; align-items: center; }
	.gd-quiz-match-pct { font-size: 30px; }
}

/* ── Quiz mobil-finjustering v2 (Ali 2026-07-03): varje steg ryms utan scroll.
   Liten illu på frågor (övervinner jq-r1 !important), dold på reveal/kontakt/resultat
   och på korta skärmar; matchnings-mätaren dold (redundant m. piller + reveal). ── */
@media (max-width: 760px) {
	#gd-quiz .gd-quiz-illu { display: flex !important; aspect-ratio: auto !important; height: clamp(44px, 6.5dvh, 68px) !important; min-height: 0 !important; max-height: none !important; }
	#gd-quiz .gd-quiz-illu img { width: 100% !important; height: 100% !important; padding: 2% !important; }
	body.gd-quiz-noillu #gd-quiz .gd-quiz-illu { display: none !important; }
	#gd-quiz .gd-quiz-card { padding: 0 !important; }
	#gd-quiz .gd-quiz-panel { padding: 10px 14px calc(10px + env(safe-area-inset-bottom)) !important; }
	#gd-quiz .gd-quiz-prog { margin-bottom: 10px; }
	#gd-quiz .gd-quiz-steplbl { margin-bottom: 6px; }
	/* Slimmad i stället för dold (Ali 2026-08-04): mätaren var enda progressions-
	   känslan UNDER själva frågorna (reveal-badgen syns först på sista skärmen) — att
	   dölja den helt lämnade quizet utan någon "du är på väg"-känsla på mobil. */
	#gd-quiz .gd-quiz-meter { margin: 0 0 8px; }
	#gd-quiz .gd-quiz-meter-bar { height: 3px; }
	#gd-quiz .gd-quiz-meter-lbl { margin-top: 4px; font-size: 9.5px; }
	#gd-quiz .gd-quiz-q { font-size: clamp(19px, 5vw, 24px); margin: 2px 0 10px; line-height: 1.12; }
	#gd-quiz .gd-quiz-sub { margin: -6px 0 12px; }
	#gd-quiz .gd-quiz-opt { min-height: 44px; padding: 7px 16px; }
	#gd-quiz .gd-quiz-opt-t { font-size: 15px; }
	#gd-quiz .gd-quiz-opts { gap: 7px; }
	#gd-quiz .gd-quiz-back { margin-top: 8px; }
	#gd-quiz .gd-quiz-echo { margin: 0 0 8px; }
	#gd-quiz .gd-quiz-priceteaser { margin: 0 0 12px; }
	#gd-quiz .gd-quiz-intro-lead { margin: 6px 0 10px; }
	#gd-quiz .gd-quiz-intro-reward { padding: 10px 13px; margin-bottom: 12px; }
}
/* Korta skärmar (iPhone SE m.fl.): dölj illu helt så innehållet ryms */
@media (max-width: 760px) and (max-height: 640px) {
	#gd-quiz .gd-quiz-illu { display: none !important; }
}

/* ── Svarsalternativ = tappbara kort (övervinner jq-r1:s redaktionella !important). Ali 2026-07-03 ── */
#gd-quiz .gd-quiz-opts:not(.gd-quiz-opts--tiles) { display: flex !important; flex-direction: column !important; gap: 8px !important; border-top: 0 !important; }
#gd-quiz .gd-quiz-opts--tiles { display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 10px !important; border-top: 0 !important; }
#gd-quiz .gd-quiz-opt {
	display: flex !important; align-items: center !important; gap: 10px !important;
	min-height: 54px; padding: 11px 16px !important;
	background: var(--gd-beige) !important; border: 1.5px solid transparent !important;
	border-radius: 13px !important; text-align: left !important; color: var(--gd-black) !important;
	transition: border-color .18s ease, background .18s ease, transform .18s var(--jq-ease) !important;
}
@media (hover:hover) { #gd-quiz .gd-quiz-opt:hover { border-color: var(--gd-black) !important; transform: translateY(-1px); padding-left: 16px !important; } }
#gd-quiz .gd-quiz-opt:active { transform: scale(.985); }
#gd-quiz .gd-quiz-opt.sel, #gd-quiz .gd-quiz-opt.is-confirming { border-color: var(--gd-blue) !important; background: rgba(30,115,190,.09) !important; padding-left: 16px !important; }
#gd-quiz .gd-quiz-opt-t { font-size: 15px !important; font-weight: 700 !important; font-family: inherit !important; color: var(--gd-black) !important; }
#gd-quiz .gd-quiz-opt-d, #gd-quiz .gd-quiz-opt-l { display: block !important; font-size: 12.5px !important; opacity: .7; margin: 0 !important; }
#gd-quiz .gd-quiz-opt-arrow { margin-left: auto !important; }
@media (max-width: 760px) {
	#gd-quiz .gd-quiz-opt { min-height: 48px; padding: 8px 15px !important; }
	#gd-quiz .gd-quiz-opts { gap: 7px !important; }
}

/* ── Resultat-tider = tappbara chips (saknades helt → plain text). Ali 2026-07-03 ── */
#gd-quiz .gd-quiz-slots { margin: 14px 0 4px; }
#gd-quiz .gd-quiz-slots-label { display: block; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gd-text); opacity: .7; margin-bottom: 9px; }
#gd-quiz .gd-quiz-slots-list { display: flex; flex-direction: column; gap: 8px; }
#gd-quiz .gd-quiz-slot {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	min-height: 50px; padding: 12px 16px;
	background: var(--gd-beige); border: 1.5px solid rgba(21,23,27,.12); border-radius: 12px;
	font-size: 15px; font-weight: 700; color: var(--gd-black); text-decoration: none; font-family: inherit;
	transition: border-color .18s ease, background .18s ease, transform .18s var(--jq-ease);
}
#gd-quiz .gd-quiz-slot::after { content: "\2192"; color: var(--gd-blue); font-weight: 700; }
@media (hover:hover) { #gd-quiz .gd-quiz-slot:hover { border-color: var(--gd-blue); background: rgba(30,115,190,.06); transform: translateY(-1px); } }
#gd-quiz .gd-quiz-slot:active { transform: scale(.99); }
/* Enskild framhävd "nästa lediga tid" (i stället för en glest utspridd lista) */
#gd-quiz .gd-quiz-slot--hero { min-height: 60px; padding: 15px 18px; font-size: 18px; }
#gd-quiz .gd-quiz-slots-more { align-self: flex-start; margin-top: 12px; text-decoration: none; }
/* Väntelista-opt-in på reveal */
#gd-quiz .gd-quiz-wl { margin: 14px 0 4px; padding: 14px 16px; border: 1px solid var(--gd-border); border-radius: 12px; background: var(--gd-cream,#F4F1EA); }
#gd-quiz .gd-quiz-wl-lead { margin: 0 0 10px; font-size: 13.5px; line-height: 1.5; color: var(--gd-text); }
#gd-quiz .gd-quiz-wl-btn { width: 100%; }
#gd-quiz .gd-quiz-wl-done { margin: 0; font-size: 13.5px; font-weight: 600; color: var(--gd-ink); }

/* Resultat-polish: kompaktare rytm, tydliga sektioner (var rörigt) */
#gd-quiz .gd-quiz-result-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 2px; }
#gd-quiz .gd-quiz-result-desc { margin: 6px 0 12px; }
#gd-quiz .gd-quiz-incl { margin: 14px 0 0; padding: 13px 15px; border: 1px solid var(--gd-border); border-radius: 12px; background: var(--gd-cream,#F4F1EA); font-size: 12.5px; line-height: 1.5; color: var(--gd-text); }
#gd-quiz .gd-quiz-why { margin: 12px 0 0; }
#gd-quiz .gd-quiz-result-cta { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
#gd-quiz .gd-quiz-result-cta .gd-btn { width: 100%; text-align: center; }
@media (min-width: 761px) { #gd-quiz .gd-quiz-result-cta { flex-direction: row; } #gd-quiz .gd-quiz-result-cta .gd-btn { width: auto; } }

/* ── Quiz-knappar på mobil: tillåt radbrytning + mindre sido-padding så lång text
   (t.ex. "Boka din kostnadsfria konsultation") aldrig klipps. Ali 2026-07-03 ── */
@media (max-width: 760px) {
	#gd-quiz .gd-btn { white-space: normal !important; line-height: 1.25 !important; height: auto !important; min-height: 50px; padding-top: 13px !important; padding-bottom: 13px !important; padding-left: 20px !important; padding-right: 20px !important; text-align: center; }
}

/* Blogg: quizet ligger efter artikeltexten (cream). Dra upp så artikelns botten-padding
   + illu-cream inte blir ett stort tomt fält överst. (Ali 2026-07-03) */
.gd-blog-single .gd-blog-quiz-wrap { margin-top: -40px; }
@media (max-width: 760px) { .gd-blog-single .gd-blog-quiz-wrap { margin-top: -32px; } }

/* ── Analys-fix (Ali 2026-07-03): full-bleed illu (ingen liten ikon i tomt fält),
   luftigare samtycke, dölj kampanj-strip under quizet (se functions.php). ── */
@media (max-width: 760px) {
	#gd-quiz .gd-quiz-illu { height: clamp(76px, 12dvh, 108px) !important; }
	#gd-quiz .gd-quiz-illu img { object-fit: cover !important; object-position: center 42% !important; padding: 0 !important; }
	#gd-quiz .gd-quiz-consent { margin-top: 4px; gap: 12px; align-items: flex-start; }
	#gd-quiz .gd-quiz-consent input { width: 22px; height: 22px; }
	#gd-quiz .gd-quiz-form .gd-btn { margin-top: 4px; }
}

/* ═══════ PREMIUM-LAGER (Ali 2026-07-03) — ren yta, större serif, luft, lugn ═══════
   Illustrationer bort på mobil (ren typografi), vit yta, hairline-kort, mono-pillar. */
#gd-quiz .gd-quiz-card { background: #fff !important; }
#gd-quiz .gd-quiz-panel { background: #fff !important; }

/* Typografi: större serif-rubrik, förfinade etiketter */
#gd-quiz .gd-quiz-q { font-family: var(--gd-serif) !important; font-size: clamp(27px, 6.6vw, 36px) !important; font-weight: 400 !important; line-height: 1.1 !important; letter-spacing: -.017em !important; color: #14161A !important; margin: 6px 0 22px !important; }
#gd-quiz .gd-quiz-q em { font-style: italic !important; }
#gd-quiz .gd-quiz-count, #gd-quiz .gd-quiz-steplbl { font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .2em !important; text-transform: uppercase !important; color: #A19B90 !important; }
#gd-quiz .gd-quiz-sub { color: #6C7079 !important; font-size: 14.5px !important; line-height: 1.5 !important; margin: -12px 0 22px !important; }

/* Kort: hairline, vit, generös, förfinad markering */
#gd-quiz .gd-quiz-opt { background: #fff !important; border: 1px solid rgba(21,23,27,.11) !important; border-radius: 16px !important; min-height: 62px !important; padding: 15px 20px !important; box-shadow: 0 1px 2px rgba(21,23,27,.03) !important; }
@media (hover:hover){ #gd-quiz .gd-quiz-opt:hover { border-color: rgba(21,23,27,.4) !important; transform: translateY(-1px); box-shadow: 0 8px 24px -14px rgba(21,23,27,.28) !important; } }
#gd-quiz .gd-quiz-opt.sel, #gd-quiz .gd-quiz-opt.is-confirming { border-color: #14161A !important; background: #fff !important; box-shadow: 0 10px 28px -14px rgba(21,23,27,.3) !important; padding-left: 20px !important; }
#gd-quiz .gd-quiz-opt-t { font-size: 16px !important; font-weight: 600 !important; letter-spacing: -.01em !important; }
#gd-quiz .gd-quiz-opt-d { font-size: 13px !important; color: #8A857C !important; }
#gd-quiz .gd-quiz-opts:not(.gd-quiz-opts--tiles) { gap: 10px !important; }

/* Pillar: tunna, mono (lugnt, ej rea-blått) */
#gd-quiz .gd-quiz-dot { height: 3px !important; border-radius: 2px !important; background: rgba(21,23,27,.12) !important; }
#gd-quiz .gd-quiz-dot.done { background: rgba(21,23,27,.34) !important; }
#gd-quiz .gd-quiz-dot.active { background: #14161A !important; }

/* Intro-belöning: lugnare (mindre rea) */
#gd-quiz .gd-quiz-intro-reward { background: #FAF8F4 !important; border: 1px solid rgba(21,23,27,.08) !important; color: #4A4740 !important; font-size: 13.5px !important; }
#gd-quiz .gd-quiz-intro-reward strong { color: #14161A !important; }

/* Trust-chips: förfinade */
#gd-quiz .gd-quiz-trust li { color: #6C7079 !important; font-weight: 600 !important; }

/* MOBIL: illustrationer bort → ren typografi + luft, innehåll centrerat */
@media (max-width: 760px) {
	/* Illustrationerna TILLBAKA — full-bleed premium-bild (Ali), fyller remsan kant-till-kant */
	#gd-quiz .gd-quiz-illu { display: flex !important; height: clamp(120px, 20dvh, 168px) !important; aspect-ratio: auto !important; min-height: 0 !important; max-height: none !important; background: #F4F1EA !important; }
	#gd-quiz .gd-quiz-illu img { object-fit: cover !important; object-position: center 44% !important; padding: 0 !important; width: 100% !important; height: 100% !important; }
	body.gd-quiz-noillu #gd-quiz .gd-quiz-illu { display: none !important; }
	#gd-quiz .gd-quiz-panel { padding: 18px 20px calc(18px + env(safe-area-inset-bottom)) !important; }
	#gd-quiz .gd-quiz-prog { margin-bottom: 18px !important; }
	#gd-quiz .gd-quiz-q { margin: 4px 0 16px !important; }
	#gd-quiz .gd-quiz-opt { min-height: 56px !important; padding: 12px 18px !important; }
	#gd-quiz .gd-quiz-opts:not(.gd-quiz-opts--tiles) { gap: 8px !important; }
}

/* ── Specialist-känsla (Ali 2026-07-03): klinik-identitet + auktoritet på varje steg ── */
#gd-quiz .gd-quiz-brand { flex: 0 0 auto; display: flex; align-items: center; gap: 7px; margin-bottom: 16px; font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #8A857C; }
#gd-quiz .gd-quiz-brand svg { color: var(--gd-blue); flex: 0 0 auto; }
#gd-quiz .gd-quiz-brand b { color: #14161A; font-weight: 700; letter-spacing: .12em; }
#gd-quiz .gd-quiz-sig { display: flex; align-items: center; gap: 7px; margin: 16px 0 0; padding-top: 14px; border-top: 1px solid rgba(21,23,27,.08); font-size: 11px; font-weight: 600; letter-spacing: .06em; color: #8A857C; }
#gd-quiz .gd-quiz-sig svg { color: var(--gd-blue); flex: 0 0 auto; }
@media (max-width: 760px) { #gd-quiz .gd-quiz-brand { margin-bottom: 12px; } }

/* ── Mobil-footer: kortare (Ali 2026-07-05) ──
   jq-r1 kollapsar grid till 1 kolumn <640px → footern blev ~4 skärmar hög.
   Nu: 3 länkkolumner 2-i-bredd (brand fullbredd), stramare statement. Alla länkar kvar (SEO). */
@media (max-width: 640px) {
	footer.jq-footer .jq-footer-grid { grid-template-columns: 1fr 1fr !important; gap: 32px 20px !important; padding-top: 40px !important; padding-bottom: 30px !important; }
	footer.jq-footer .jq-footer-brand { grid-column: 1 / -1 !important; }
	footer.jq-footer .jq-footer-tag { margin-bottom: 14px; }
	footer.jq-footer .jq-footer-col li a { font-size: 13px; }
	footer.jq-footer .jq-footer-statement { padding-top: 40px !important; padding-bottom: 34px !important; gap: 16px !important; }
	footer.jq-footer .jq-footer-statement h2 { font-size: clamp(25px, 7.4vw, 32px); line-height: 1.12; }
}

/* A11y-kontrast (Ali 2026-07-05): stat-etiketter var #6C7079 på #F0ECE2 ≈ 4.2:1 (< WCAG AA 4.5:1).
   #63666E ger ~4.87:1 — klarar AA, bara aningen mörkare. */
.gd-jq .jq-mfx-l { color: #63666E; }

/* ── Resultatvyn: låt den växa i stället för att scrolla i en liten ruta (2026-08-04)
   Stagen har fast höjd + overflow-y:auto för frågestegen (bra där, ett steg ska rymmas
   utan scroll). Resultatvyn är 4-5 gånger så hög och hamnade därför i en intern
   scrollruta, vilket på desktop gav ett litet fönster med stor tom yta runt. ── */
body.gd-quiz-resultat #gd-quiz .gd-quiz-stage { overflow: visible; height: auto; flex: 0 0 auto; }
body.gd-quiz-resultat #gd-quiz .gd-quiz-panel,
body.gd-quiz-resultat #gd-quiz .gd-quiz-card { height: auto; min-height: 0; }
@media (min-width: 761px) {
	/* Illustrationskolumnen fyller ingen funktion på resultatsidan (heron bär bilden)
	   och tvingar bara upp korthöjden. Ge resultatet hela bredden. */
	body.gd-quiz-resultat #gd-quiz .gd-quiz-illu { display: none; }
	body.gd-quiz-resultat #gd-quiz .gd-quiz-card { grid-template-columns: 1fr; display: block; }
	body.gd-quiz-resultat #gd-quiz .gd-quiz-panel { max-width: 720px; margin: 0 auto; padding: clamp(28px,3vw,44px) clamp(24px,3vw,40px); }
}

/* Metodnamnet får aldrig klämmas ihop av bandet bredvid (gav "Kerami", "Lingu"). */
#gd-quiz .gd-quiz-bx-n { flex: 0 0 auto; }
#gd-quiz .gd-quiz-bx-band { flex: 0 1 auto; }

/* Tidig boknings-zon: nästa lediga tid + CTA direkt efter rekommendationen. */
#gd-quiz .gd-quiz-zon--boka-primar .gd-quiz-trust { margin-top: 14px; }
#gd-quiz .gd-quiz-zon--boka-primar .gd-quiz-result-cta { margin-top: 4px; }

/* ══════════════════════════════════════════════════════════════════════
   RESULTATVYN, visuell omarbetning 2026-08-04
   Problem: sidan var platt, jämnt staplade beige block, allt vänsterställt
   i samma skala. Grepp: ETT mörkt ankarblock (bokningen), brass som varm
   sekundärfärg, dramatisk skalkontrast, varierad vitrymme, sticky funnel.
   ══════════════════════════════════════════════════════════════════════ */
#gd-quiz .gd-quiz-result { --gd-brass: #8B6F47; }

/* Panelens padding som variabel, så full-bleed-heron aldrig kan glida isär
   från den (låg 2px fel tidigare). Resultatläget får mer luft än frågestegen,
   det är en läsvy, inte ett formulärsteg. */
#gd-quiz .gd-quiz-panel { --gd-quiz-pad: 20px; }
#gd-quiz .gd-quiz-result-hero { margin: 0 calc(var(--gd-quiz-pad) * -1) 16px; }
@media (max-width: 760px) {
	body.gd-quiz-resultat #gd-quiz .gd-quiz-panel { --gd-quiz-pad: 22px; padding: 22px var(--gd-quiz-pad) calc(22px + env(safe-area-inset-bottom)) !important; }
	#gd-quiz .gd-quiz-result-desc { font-size: 16px; }   /* 15px är under mobilminimum */
	#gd-quiz .gd-quiz-alt { padding: 14px 4px; }
}

/* Skalkontrast: stor serif mot mikroversaler, inget däremellan. */
#gd-quiz .gd-quiz-result .gd-quiz-q { font-size: clamp(30px,6.4vw,46px); line-height: 1.04; letter-spacing: -.02em; }
#gd-quiz .gd-quiz-eyebrow { color: var(--gd-brass); letter-spacing: .3em; font-size: 9.5px; font-weight: 700; }
#gd-quiz .gd-quiz-alts-h { color: var(--gd-brass); opacity: 1; letter-spacing: .22em; font-size: 9.5px; }
#gd-quiz .gd-quiz-bx-band { opacity: .72; color: var(--gd-text-mid); }

/* Varierad rytm: mycket luft före ankarblocket, tätare inuti grupper. */
#gd-quiz .gd-quiz-zon + .gd-quiz-zon { margin-top: clamp(26px,6vw,36px); padding-top: clamp(26px,6vw,36px); }

/* ── Ankarblocket: sidans enda mörka yta, och dess mittpunkt ── */
#gd-quiz .gd-quiz-bokakort {
	margin: clamp(28px,7vw,44px) calc(var(--gd-quiz-pad) * -1) clamp(26px,6vw,36px);
	padding: clamp(26px,6vw,38px) var(--gd-quiz-pad) clamp(24px,5vw,32px);
	/* Varm mörk ton i stället för nästan svart (Alis val 2026-08-06). Samma
	   familj som sajtens --jq-deep, men med brunvärme så den läser som en del
	   av den beige paletten och inte som ett främmande svart block. */
	background: #1C1814; color: #F4F1EA;
}
@media (min-width: 761px) { #gd-quiz .gd-quiz-bokakort { margin-left: 0; margin-right: 0; padding: 40px; border-radius: 4px; } }
#gd-quiz .gd-quiz-bokakort-eyebrow { display: block; font-size: 9.5px; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; color: var(--gd-brass); margin-bottom: 12px; }
#gd-quiz .gd-quiz-bokakort-rubrik { font-family: var(--gd-serif); font-size: clamp(24px,5.4vw,34px); font-weight: 400; line-height: 1.14; color: #F4F1EA; margin: 0 0 20px; }
#gd-quiz .gd-quiz-bokakort .gd-quiz-slots { margin: 0 0 18px; }
#gd-quiz .gd-quiz-bokakort .gd-quiz-slots-label { color: rgba(244,241,234,.62); }
#gd-quiz .gd-quiz-bokakort .gd-quiz-slot { background: rgba(244,241,234,.07); border-color: rgba(244,241,234,.22); color: #F4F1EA; }
#gd-quiz .gd-quiz-bokakort .gd-quiz-slot:hover { background: rgba(244,241,234,.13); }
#gd-quiz .gd-quiz-bokakort .gd-quiz-slots-more,
#gd-quiz .gd-quiz-bokakort .gd-quiz-back { color: rgba(244,241,234,.72); }
/* Blått är handlingsfärgen, och den enda starka färgen som får finnas här. */
#gd-quiz .gd-quiz-bokaknapp { display: block; width: 100%; text-align: center; background: var(--gd-blue); color: #fff; border: 0; padding: 17px 24px; font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
#gd-quiz .gd-quiz-bokaknapp:hover { background: #1a66aa; color: #fff; }
#gd-quiz .gd-quiz-trust--mork { margin: 16px 0 0; }
#gd-quiz .gd-quiz-trust--mork li { color: rgba(244,241,234,.82); background: none; border-color: rgba(244,241,234,.2); }
#gd-quiz .gd-quiz-trust--mork li::before { color: var(--gd-brass); }

/* ── Sticky bokningsrad, mobil. Funnel-greppet: bokningen inom tummens
   räckvidd hela vägen ned. Visas först när ankarblocket passerats. ── */
#gd-quiz .gd-quiz-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 80; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 16px calc(11px + env(safe-area-inset-bottom)); background: rgba(21,23,27,.97); backdrop-filter: blur(10px); animation: gd-sticky-in .3s var(--gd-ease) both; }
#gd-quiz .gd-quiz-sticky[hidden] { display: none; }
#gd-quiz .gd-quiz-sticky-txt { font-size: 12.5px; color: rgba(244,241,234,.9); }
#gd-quiz .gd-quiz-sticky-btn { flex-shrink: 0; min-height: 48px; display: inline-flex; align-items: center; background: var(--gd-blue); color: #fff; border: 0; padding: 0 22px; font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
@keyframes gd-sticky-in { from { transform: translateY(100%); } to { transform: none; } }
@media (min-width: 761px) { #gd-quiz .gd-quiz-sticky { display: none !important; } }

/* Hairline-indrag på metodraden ger en andra vertikal linje, bryter att allt
   ligger på samma x-position (det är kärnan i platt-känslan). */
#gd-quiz .gd-quiz-bx { border-top-color: rgba(21,23,27,.1); }
#gd-quiz .gd-quiz-breadth-note { padding-left: 0; }

/* Hero = redaktionell klinikbild (2026-08-04). Behandlingsfilmen ligger bakom
   "Se behandlingen" i stället, klinisk närbild är fel som första intryck. */
#gd-quiz .gd-quiz-result-bild { width: 100%; height: 100%; object-fit: cover; display: block; }
#gd-quiz .gd-quiz-film { margin: 18px 0 0; }
#gd-quiz .gd-quiz-film-btn { background: none; border: 0; padding: 0; font: inherit; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gd-brass,#8B6F47); cursor: pointer; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; }
#gd-quiz .gd-quiz-film-btn[aria-expanded="true"] span { transform: rotate(45deg); }
#gd-quiz .gd-quiz-film-btn span { display: inline-block; transition: transform .25s var(--gd-ease); font-size: 15px; }
#gd-quiz .gd-quiz-film-panel { animation: gd-alt-in .28s var(--gd-ease) both; }
#gd-quiz .gd-quiz-film-panel video { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 10px; display: block; }

/* ── Rättningar 2026-08-06 efter Alis skärmdumpar ────────────────────────────
   1) Mörka kortets text låg klippt i vänsterkanten. Kortet dras ut i full bredd
      med negativ marginal, men --gd-quiz-pad sätts på .gd-quiz-panel och ärvdes
      inte alltid hit, så innerpaddingen blev för liten. Sätt den på kortet självt.
   2) Sticky bokningsrad låg ovanpå väntelisteknappen. Resultatvyn får utrymme
      under sig så raden aldrig täcker innehåll. */
#gd-quiz .gd-quiz-bokakort { --gd-quiz-pad: 22px; padding-left: 22px; padding-right: 22px; }
@media (min-width: 761px) { #gd-quiz .gd-quiz-bokakort { padding-left: 40px; padding-right: 40px; } }
#gd-quiz .gd-quiz-bokakort > * { max-width: 100%; }
#gd-quiz .gd-quiz-bokakort .gd-quiz-slots-label,
#gd-quiz .gd-quiz-bokakort .gd-quiz-bokakort-eyebrow { display: block; }

body.gd-quiz-resultat #gd-quiz .gd-quiz-result { padding-bottom: 96px; }
@media (min-width: 761px) { body.gd-quiz-resultat #gd-quiz .gd-quiz-result { padding-bottom: 0; } }

/* Platsräknare i quizets intro (2026-08-06). Samma siffra som toppbaren. */
#gd-quiz .gd-quiz-intro-kvar { margin: 10px 0 0; font-size: 12.5px; letter-spacing: .02em; color: var(--gd-blue); }
#gd-quiz .gd-quiz-intro-kvar strong { font-weight: 700; }

/* Bildtexten under före/efter låg som en flexrad med två texter sida vid sida.
   På mobil rymdes de inte och la sig ovanpå varandra (Ali 2026-08-06).
   Staplas nu på smal skärm, med luft emellan. */
@media (max-width: 600px) {
	.gd-jq .jq-ev-cap { flex-direction: column; align-items: flex-start; gap: 6px; }
	.gd-jq .jq-ev-cap .dim { letter-spacing: .18em; }
}
