/*
 * RTS Render - component styles for the service page sections.
 * Built on the design tokens in the child theme (tokens.css). Editorial,
 * calm, premium. No JavaScript; the FAQ accordion is native details/summary.
 */

.c-section { margin: var(--rts-space-12, 3rem) 0; }
.c-section__title {
	font-family: var(--rts-font-serif, Georgia, serif);
	font-size: var(--rts-fs-h2, 2rem);
	line-height: var(--rts-lh-heading, 1.15);
	color: var(--rts-navy, #0E1B2C);
	margin: 0 0 var(--rts-space-6, 1.5rem);
}

/* Hero */
.c-block--hero { margin: 0 0 var(--rts-space-8, 2rem); }
.c-block--eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: var(--rts-fs-sm, 0.875rem);
	font-weight: 600;
	color: var(--rts-terracotta, #C5532A);
	margin: 0 0 var(--rts-space-3, 0.75rem);
}
.c-block--title {
	font-family: var(--rts-font-serif, Georgia, serif);
	font-size: var(--rts-fs-h1, 3rem);
	line-height: var(--rts-lh-heading, 1.15);
	color: var(--rts-navy, #0E1B2C);
	margin: 0 0 var(--rts-space-4, 1rem);
}
.c-block--subtitle {
	font-size: var(--rts-fs-lg, 1.25rem);
	color: var(--rts-ink, #1A1A1A);
	max-width: 56ch;
	margin: 0 0 var(--rts-space-6, 1.5rem);
}

/* Buttons */
.c-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--rts-control-height, 48px);
	padding: 0 var(--rts-space-8, 2rem);
	border-radius: var(--rts-radius-sm, 4px);
	font-weight: 600;
	text-decoration: none;
	transition: transform 0.15s ease, opacity 0.15s ease;
}
.c-btn--primary { background: var(--rts-terracotta, #C5532A); color: var(--rts-paper, #FAFAF7); }
.c-btn--primary:hover { opacity: 0.92; transform: translateY(-1px); }

/* TL;DR */
.c-tldr {
	background: var(--rts-sand, #F4EDE0);
	border: 1px solid var(--rts-rule, #E5E1D8);
	border-radius: var(--rts-radius-md, 12px);
	padding: var(--rts-space-8, 2rem);
	margin: 0 0 var(--rts-space-12, 3rem);
}
.c-tldr__label {
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: var(--rts-fs-sm, 0.875rem);
	font-weight: 700;
	color: var(--rts-emerald, #1E5A4A);
	margin: 0 0 var(--rts-space-4, 1rem);
}
.c-tldr__grid { margin: 0; display: grid; gap: var(--rts-space-4, 1rem); }
.c-tldr__row { display: grid; grid-template-columns: 9rem 1fr; gap: var(--rts-space-4, 1rem); align-items: baseline; }
.c-tldr__row dt { font-weight: 700; color: var(--rts-navy, #0E1B2C); }
.c-tldr__row dd { margin: 0; color: var(--rts-ink, #1A1A1A); }
@media (max-width: 600px) { .c-tldr__row { grid-template-columns: 1fr; gap: var(--rts-space-1, 0.25rem); } }

/* Checklist */
.c-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--rts-space-3, 0.75rem); }
.c-checklist__item { position: relative; padding-left: 2rem; }
.c-checklist__item::before {
	content: "";
	position: absolute;
	left: 0; top: 0.15em;
	width: 1.25rem; height: 1.25rem;
	border-radius: 50%;
	background: var(--rts-emerald, #1E5A4A);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center / 80% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center / 80% no-repeat;
}

/* Process steps */
.c-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--rts-space-6, 1.5rem); counter-reset: step; }
.c-steps__item { display: grid; grid-template-columns: 3rem 1fr; gap: var(--rts-space-6, 1.5rem); align-items: start; }
.c-steps__num {
	display: flex; align-items: center; justify-content: center;
	width: 3rem; height: 3rem;
	border-radius: 50%;
	background: var(--rts-navy, #0E1B2C);
	color: var(--rts-paper, #FAFAF7);
	font-family: var(--rts-font-serif, Georgia, serif);
	font-size: 1.25rem; font-weight: 600;
}
.c-steps__title { font-size: var(--rts-fs-h4, 1.375rem); color: var(--rts-navy, #0E1B2C); margin: 0.25rem 0 var(--rts-space-2, 0.5rem); }
.c-steps__text { margin: 0 0 var(--rts-space-2, 0.5rem); }
.c-steps__meta { margin: 0; font-size: var(--rts-fs-sm, 0.875rem); color: var(--rts-emerald, #1E5A4A); font-weight: 600; }

/* Fees table */
.c-table-wrap { overflow-x: auto; border: 1px solid var(--rts-rule, #E5E1D8); border-radius: var(--rts-radius-md, 12px); }
.c-table { width: 100%; border-collapse: collapse; background: var(--rts-paper, #FAFAF7); }
.c-table th, .c-table td { text-align: left; padding: var(--rts-space-4, 1rem); border-bottom: 1px solid var(--rts-rule, #E5E1D8); vertical-align: top; }
.c-table thead th { background: var(--rts-navy, #0E1B2C); color: var(--rts-paper, #FAFAF7); font-size: var(--rts-fs-sm, 0.875rem); text-transform: uppercase; letter-spacing: 0.06em; }
.c-table tbody tr:last-child th, .c-table tbody tr:last-child td { border-bottom: 0; }
.c-table tbody th { font-weight: 600; color: var(--rts-navy, #0E1B2C); }
.c-fees__note { font-size: var(--rts-fs-sm, 0.875rem); color: var(--rts-ink, #1A1A1A); opacity: 0.8; margin: var(--rts-space-3, 0.75rem) 0 0; }

/* Cards */
.c-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--rts-space-6, 1.5rem); }
.c-cards--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 781px) { .c-cards, .c-cards--3 { grid-template-columns: 1fr; } }
.c-card {
	background: var(--rts-paper, #FAFAF7);
	border: 1px solid var(--rts-rule, #E5E1D8);
	border-radius: var(--rts-radius-md, 12px);
	padding: var(--rts-space-6, 1.5rem);
}
.c-card__title { font-size: var(--rts-fs-h4, 1.375rem); color: var(--rts-navy, #0E1B2C); margin: 0 0 var(--rts-space-3, 0.75rem); }
.c-card__text { margin: 0; }
.c-card__lead { font-weight: 700; color: var(--rts-emerald, #1E5A4A); }
.c-card--link { display: block; text-decoration: none; color: inherit; transition: box-shadow 0.15s ease, transform 0.15s ease; }
.c-card--link:hover { box-shadow: var(--rts-shadow, 0 12px 32px rgba(14,27,44,0.08)); transform: translateY(-2px); }
.c-card__more { display: inline-block; margin-top: var(--rts-space-4, 1rem); font-weight: 600; color: var(--rts-terracotta, #C5532A); }

/* FAQ accordion */
.c-accordion { border: 1px solid var(--rts-rule, #E5E1D8); border-radius: var(--rts-radius-md, 12px); overflow: hidden; }
.c-accordion__item { border-bottom: 1px solid var(--rts-rule, #E5E1D8); }
.c-accordion__item:last-child { border-bottom: 0; }
.c-accordion__q {
	cursor: pointer;
	list-style: none;
	padding: var(--rts-space-6, 1.5rem);
	font-family: var(--rts-font-serif, Georgia, serif);
	font-size: var(--rts-fs-lg, 1.25rem);
	color: var(--rts-navy, #0E1B2C);
	position: relative;
	padding-right: 3.5rem;
}
.c-accordion__q::-webkit-details-marker { display: none; }
.c-accordion__q::after {
	content: "+";
	position: absolute;
	right: var(--rts-space-6, 1.5rem);
	top: 50%; transform: translateY(-50%);
	font-size: 1.75rem; line-height: 1;
	color: var(--rts-terracotta, #C5532A);
}
.c-accordion__item[open] .c-accordion__q::after { content: "\2212"; }
.c-accordion__a { padding: 0 var(--rts-space-6, 1.5rem) var(--rts-space-6, 1.5rem); }
.c-accordion__a p { margin: 0 0 var(--rts-space-3, 0.75rem); }
.c-accordion__a p:last-child { margin-bottom: 0; }

/* City stats */
.c-stats { display: flex; flex-wrap: wrap; gap: var(--rts-space-6, 1.5rem); }
.c-stat {
	flex: 1 1 12rem;
	background: var(--rts-sand, #F4EDE0);
	border: 1px solid var(--rts-rule, #E5E1D8);
	border-radius: var(--rts-radius-md, 12px);
	padding: var(--rts-space-6, 1.5rem);
	display: grid; gap: var(--rts-space-2, 0.5rem);
}
.c-stat__label { font-size: var(--rts-fs-sm, 0.875rem); text-transform: uppercase; letter-spacing: 0.08em; color: var(--rts-emerald, #1E5A4A); font-weight: 700; }
.c-stat__value { font-family: var(--rts-font-serif, Georgia, serif); font-size: var(--rts-fs-h4, 1.375rem); color: var(--rts-navy, #0E1B2C); }

/* Byline */
.c-byline {
	border-top: 1px solid var(--rts-rule, #E5E1D8);
	border-bottom: 1px solid var(--rts-rule, #E5E1D8);
	padding: var(--rts-space-6, 1.5rem) 0;
	margin: var(--rts-space-12, 3rem) 0;
	display: grid; gap: var(--rts-space-2, 0.5rem);
}
.c-byline__row { margin: 0; font-size: var(--rts-fs-sm, 0.9375rem); }
.c-byline__label { font-weight: 700; color: var(--rts-navy, #0E1B2C); margin-right: var(--rts-space-2, 0.5rem); }
.c-byline__updated { color: var(--rts-emerald, #1E5A4A); }