/* ============================================================
   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 (lead-gen) ─────── */
.gd-quiz-card {
	display: grid; grid-template-columns: 0.82fr 1.18fr;
	background: var(--gd-white); border: 1px solid rgba(0,0,0,.07);
	border-radius: 24px; overflow: hidden;
	box-shadow: 0 36px 72px -46px rgba(0,0,0,.36);
}
.gd-quiz-illu {
	position: relative; min-height: 440px;
	background: #d9d5cc;
	display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.gd-quiz-illu [data-illu] {
	position: absolute; inset: 0;
	opacity: 0; transition: opacity .45s ease;
}
.gd-quiz-illu [data-illu].is-on { opacity: 1; }
.gd-quiz-illu img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gd-quiz-panel { padding: 44px; display: flex; flex-direction: column; }
.gd-quiz-dots { display: flex; gap: 6px; margin-bottom: 26px; flex-wrap: wrap; }
.gd-quiz-dot { width: 22px; height: 4px; border-radius: 2px; background: rgba(0,0,0,.1); transition: background .3s ease; }
.gd-quiz-dot.done, .gd-quiz-dot.active { background: var(--gd-blue); }
.gd-quiz-stage { flex: 1; }
.gd-quiz-step { animation: gd-quiz-in .4s ease both; }
@keyframes gd-quiz-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.gd-quiz-count { font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gd-blue); }
.gd-quiz-q { font-size: clamp(23px, 2.9vw, 34px); font-weight: 800; letter-spacing: -.03em; line-height: 1.08; color: var(--gd-black); margin: 10px 0 22px; }
.gd-quiz-q em { font-style: italic; font-weight: 500; }
.gd-quiz-opts { display: flex; flex-direction: column; gap: 10px; }
.gd-quiz-opt {
	display: flex; align-items: center; gap: 8px;
	background: var(--gd-beige); border: 1.5px solid transparent; border-radius: 12px;
	padding: 15px 18px; cursor: pointer; font-family: inherit; text-align: left;
	transition: border-color .15s ease, transform .15s ease, background .15s ease;
}
.gd-quiz-opt:hover { border-color: var(--gd-black); transform: translateX(4px); }
.gd-quiz-opt.sel { border-color: var(--gd-blue); background: rgba(30,115,190,.08); }
.gd-quiz-opt-t { font-size: 15px; font-weight: 700; color: var(--gd-black); }
.gd-quiz-opt-d { font-size: 13px; color: var(--gd-text); opacity: .7; }
.gd-quiz-opt-arrow { margin-left: auto; color: var(--gd-blue); opacity: 0; transition: opacity .15s ease; }
.gd-quiz-opt:hover .gd-quiz-opt-arrow, .gd-quiz-opt.sel .gd-quiz-opt-arrow { opacity: 1; }
.gd-quiz-back { margin-top: 18px; background: none; border: none; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 600; color: var(--gd-text); opacity: .7; padding: 4px 0; align-self: flex-start; }
.gd-quiz-back:hover { opacity: 1; }
.gd-quiz-gate-lead { font-size: 15px; line-height: 1.6; color: var(--gd-text); margin: 12px 0 20px; }
.gd-quiz-gate-lead strong { color: var(--gd-black); }
.gd-quiz-form { display: flex; flex-direction: column; gap: 11px; }
.gd-quiz-input { height: 50px; padding: 0 16px; border: 1.5px solid var(--gd-border); border-radius: 10px; font-family: inherit; font-size: 15px; background: #fff; }
.gd-quiz-input:focus { outline: none; border-color: var(--gd-blue); }
.gd-quiz-consent { display: flex; gap: 9px; font-size: 12.5px; line-height: 1.5; color: var(--gd-text); }
.gd-quiz-consent input { margin-top: 2px; flex-shrink: 0; accent-color: var(--gd-blue); }
.gd-quiz-consent a { color: var(--gd-blue); }
.gd-quiz-err { font-size: 13px; color: #6C7079; margin: 2px 0 0; font-weight: 600; }
.gd-quiz-result-desc { font-size: 16px; line-height: 1.6; color: var(--gd-text); margin: 8px 0 16px; }
.gd-quiz-result-price { display: flex; flex-direction: column; margin-bottom: 12px; }
.gd-quiz-result-price strong { font-size: clamp(30px, 4vw, 40px); font-weight: 800; letter-spacing: -.03em; color: var(--gd-blue); line-height: 1; }
.gd-quiz-result-price span { font-size: 13px; color: var(--gd-text); opacity: .7; margin-top: 4px; }
.gd-quiz-result-note { font-size: 12.5px; line-height: 1.5; color: var(--gd-text); opacity: .65; margin: 0 0 20px; }
.gd-quiz-result-cta { display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 760px) {
	.gd-quiz-card { grid-template-columns: 1fr; }
	.gd-quiz-illu { min-height: 230px; }
	.gd-quiz-panel { padding: 28px; }
}

/* ─────── 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); }
	.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;
}
