/* page-ratgeber: layout nuance only (tokens from theme.css, no new theme values) */

/* section 2: the first guide (Abzocke) is the featured card: dark via the existing ink hooks, full row from the 3-column breakpoint */
.rg-guides .guide:first-child{
	--t-head:#fff;--t-muted:var(--d-text);--t-link:var(--accent);--t-eb:var(--accent);--t-eb-bg:rgba(0,207,230,.12);--t-badge:var(--accent);--t-badge-bg:rgba(0,207,230,.14);
	background:var(--brand);border-color:var(--brand);
}
.rg-guides .guide:first-child .guide__t{font-size:clamp(1.4rem,1.1rem + 1vw,1.9rem)}
/* badge above the question tag, so a long question never squeezes into a two-line pill */
.rg-guides .guide__top{flex-direction:column;align-items:flex-start;gap:.7rem}
@media (min-width:1000px){
	.rg-guides .guide:first-child{
		grid-column:1/-1;
		display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-rows:auto auto 1fr;
		grid-template-areas:"top x" "t x" "more x";
		column-gap:clamp(2rem,5vw,4.5rem);row-gap:.8rem;
		padding:clamp(1.8rem,3vw,2.7rem);
	}
	.rg-guides .guide:first-child .guide__top{grid-area:top;justify-content:flex-start}
	.rg-guides .guide:first-child .guide__t{grid-area:t}
	.rg-guides .guide:first-child .guide__x{grid-area:x;align-self:center;font-size:1.2rem;line-height:1.6}
	.rg-guides .guide:first-child .more{grid-area:more;align-self:end}
}

/* section 3: lead statement, four reason cards, two asides side by side */
.rg-why .lead-block{margin-bottom:clamp(1.8rem,3.5vw,2.8rem)}
.rg-notes{display:grid;gap:1rem;grid-template-columns:minmax(0,1fr);margin-top:clamp(1.4rem,3vw,2rem)}
@media (min-width:900px){
	.rg-notes{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* section 4: router table (situation left, what to do right) under the 112 notice */
.rg-112{margin-bottom:clamp(1.2rem,2.5vw,1.8rem)}
.rg-router .ilist__b{flex:1;min-width:0}
.rg-router .ilist__t{font-size:1.25rem}
@media (min-width:760px){
	.rg-router .ilist__b{display:grid;grid-template-columns:minmax(11rem,.7fr) minmax(0,1.6fr);column-gap:2rem;align-items:baseline}
	.rg-router .ilist__t{margin:0}
}

/* section 5: photo + three sample terms */
.rg-gloss .ilist--tight{margin-top:.6rem}
.rg-gloss .split__x{max-width:36rem}

/* section 6: phone card on the dark band, then the closing line of links */
.rg-after{max-width:46rem;margin:clamp(1.4rem,3vw,2rem) 0 0;font-size:1.0625rem;color:var(--d-text)}
.rg-after a{font-weight:700}
