/* ==========================================================================
   StudyInItaly.pk
   Palette: Florentine pietra serena (grey-green stone) on plaster white,
   with one ochre accent reserved for actions, and photographs of Italian
   university cities. Titillium Web for headings (born at the Accademia di
   Belle Arti di Urbino; used across Italian public and university sites),
   Source Sans 3 for reading.
   ========================================================================== */

@font-face {
	font-family: "Titillium Web";
	src: url("../fonts/titillium-web-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Titillium Web";
	src: url("../fonts/titillium-web-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Source Sans 3";
	src: url("../fonts/source-sans-3.woff2") format("woff2");
	font-weight: 400 700;
	font-style: normal;
	font-display: swap;
}

:root {
	/* Colour */
	--c-plaster: #f4f5f2;
	--c-surface: #ffffff;
	--c-stone-50: #eef1ee;
	--c-stone-100: #e3e8e4;
	--c-stone-200: #cfd7d2;
	--c-stone-400: #8a9a92;
	--c-stone: #4a5a53;
	--c-stone-700: #34423c;
	--c-stone-900: #1f2925;
	--c-ink: #17201c;
	--c-muted: #52605a;
	--c-ochre: #e2a630;
	--c-ochre-600: #c98e1a;
	--c-ochre-100: #f8ebcd;
	--c-error: #a8261d;
	--c-success: #2c6a4d;
	--c-focus: #1d5fd1;

	/* Type */
	--f-display: "Titillium Web", "Segoe UI", system-ui, -apple-system, sans-serif;
	--f-body: "Source Sans 3", "Segoe UI", system-ui, -apple-system, sans-serif;
	--fs-xs: 0.8125rem;
	--fs-sm: 0.9375rem;
	--fs-base: 1.0625rem;
	--fs-md: 1.25rem;
	--fs-lead: 1.125rem;
	--fs-lg: clamp(1.375rem, 1.1rem + 1vw, 1.75rem);
	--fs-xl: clamp(1.875rem, 1.3rem + 2.4vw, 3rem);
	--fs-hero: clamp(2.375rem, 1.5rem + 3.4vw, 4.25rem);
	--lh-tight: 1.05;
	--lh-snug: 1.25;
	--lh-body: 1.6;

	/* Space (4px base) */
	--s-1: 0.25rem;
	--s-2: 0.5rem;
	--s-3: 0.75rem;
	--s-4: 1rem;
	--s-5: 1.5rem;
	--s-6: 2rem;
	--s-7: 3rem;
	--s-8: 4rem;
	--s-9: 6rem;
	--section-y: clamp(4rem, 3rem + 5vw, 7.5rem);
	--gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);
	--wrap: 76rem;

	/* Shape & motion */
	--r-sm: 6px;
	--r-md: 12px;
	--r-lg: 20px;
	--r-pill: 999px;
	--shadow-lift: 0 1px 2px rgb(31 41 37 / 0.06), 0 8px 24px -12px rgb(31 41 37 / 0.25);
	--ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	--t-fast: 160ms;
	--t-med: 320ms;
	--header-h: 4.25rem;
}

/* ---------- Base ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--header-h) + 1rem);
}

body {
	margin: 0;
	background: var(--c-plaster);
	color: var(--c-ink);
	font-family: var(--f-body);
	font-size: var(--fs-base);
	line-height: var(--lh-body);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}

img, svg { display: block; max-width: 100%; height: auto; }
.icon { width: 1.25em; height: 1.25em; flex: none; }

h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: var(--lh-snug); text-wrap: balance; }
p { margin: 0 0 var(--s-4); text-wrap: pretty; }
p:last-child { margin-bottom: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

a { color: inherit; text-decoration-color: color-mix(in srgb, currentColor 45%, transparent); text-underline-offset: 0.2em; text-decoration-thickness: 1px; transition: text-decoration-color var(--t-fast), color var(--t-fast); }
a:hover { text-decoration-color: currentColor; }

:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 3px; border-radius: 3px; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}

.skip-link {
	position: absolute; left: var(--s-4); top: -100px; z-index: 100;
	padding: var(--s-3) var(--s-4);
	background: var(--c-ink); color: #fff; border-radius: var(--r-sm);
	font-weight: 600; text-decoration: none;
}
.skip-link:focus { top: var(--s-3); }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.wrap--narrow { max-width: 46rem; }

/* ---------- Buttons ---------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
	min-height: 3rem; padding: 0.7rem 1.35rem;
	border: 1.5px solid transparent; border-radius: var(--r-pill);
	font: 600 var(--fs-sm)/1.2 var(--f-body); letter-spacing: 0.01em;
	text-decoration: none; text-align: center; cursor: pointer;
	transition: background-color var(--t-fast), border-color var(--t-fast), color var(--t-fast), transform var(--t-fast) var(--ease), box-shadow var(--t-fast);
}
.btn:active { transform: translateY(1px); }
.btn--primary { background: var(--c-ochre); color: var(--c-ink); }
.btn--primary:hover { background: var(--c-ochre-600); box-shadow: var(--shadow-lift); }
.btn--ghost { border-color: currentColor; color: var(--c-ink); background: transparent; }
.btn--ghost:hover { background: var(--c-ink); color: #fff; border-color: var(--c-ink); }
.btn--whatsapp { background: #1f7a4d; color: #fff; }
.btn--whatsapp:hover { background: #17633e; }
.btn--sm { min-height: 2.5rem; padding: 0.5rem 1rem; }
.btn--lg { min-height: 3.375rem; padding: 0.85rem 1.6rem; font-size: var(--fs-base); }
.btn--block { width: 100%; }
.btn--icon { width: 3rem; padding: 0; }
.btn[disabled], .btn[aria-busy="true"] { opacity: 0.7; cursor: progress; }

/* ---------- Header ---------- */
.site-header {
	position: sticky; top: 0; z-index: 50;
	background: color-mix(in srgb, var(--c-plaster) 88%, transparent);
	-webkit-backdrop-filter: saturate(1.4) blur(12px);
	backdrop-filter: saturate(1.4) blur(12px);
	border-bottom: 1px solid transparent;
	transition: border-color var(--t-med), background-color var(--t-med);
}
.site-header.is-scrolled { border-bottom-color: var(--c-stone-200); }
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .site-header { top: 0; } }

.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); min-height: var(--header-h); }

.brand { display: inline-flex; align-items: center; text-decoration: none; color: var(--c-ink); }
.brand__logo { max-height: 2.75rem; width: auto; }
.brand__word { font-family: var(--f-display); font-size: 1.4rem; font-weight: 700; letter-spacing: -0.01em; line-height: 1; }
.brand__tld { color: var(--c-stone); font-weight: 500; }

.nav-toggle {
	display: inline-flex; align-items: center; gap: var(--s-2);
	min-height: 2.75rem; padding: 0 var(--s-4);
	border: 1.5px solid var(--c-stone-200); border-radius: var(--r-pill);
	background: var(--c-surface); color: var(--c-ink);
	font: 600 var(--fs-sm) var(--f-body); cursor: pointer;
}
.no-js .nav-toggle { display: none; }

.site-nav { display: none; }
.no-js .site-nav { display: block; width: 100%; padding-bottom: var(--s-3); }
.no-js .site-header__inner { flex-wrap: wrap; }
.no-js .site-nav__list { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-4); }

.site-nav__link { display: block; padding: var(--s-2) 0; color: var(--c-ink); text-decoration: none; font-weight: 500; }
.site-nav__link:hover { color: var(--c-stone); }
.site-nav__link.is-active { color: var(--c-ink); box-shadow: inset 0 -2px 0 var(--c-ochre); }

/* Mobile menu panel */
@media (max-width: 63.99rem) {
	.js .site-nav {
		position: fixed; inset: var(--header-h) 0 auto 0; z-index: 49;
		display: block;
		padding: var(--s-4) var(--gutter) var(--s-6);
		background: var(--c-plaster);
		border-bottom: 1px solid var(--c-stone-200);
		box-shadow: 0 24px 40px -24px rgb(31 41 37 / 0.35);
		transform: translateY(-0.75rem); opacity: 0; visibility: hidden;
		transition: transform var(--t-med) var(--ease), opacity var(--t-med), visibility 0s linear var(--t-med);
	}
	.admin-bar.js .site-nav { top: calc(var(--header-h) + 46px); }
	.js .site-nav.is-open { transform: none; opacity: 1; visibility: visible; transition-delay: 0s; }
	.js .site-nav__list { display: grid; }
	.js .site-nav__link { padding: var(--s-3) 0; font-size: var(--fs-md); border-bottom: 1px solid var(--c-stone-100); }
	.js .site-nav__link.is-active { box-shadow: none; color: var(--c-stone); }
	.site-nav__cta { margin-top: var(--s-5); width: 100%; min-height: 3.25rem; font-size: var(--fs-base); }
	.no-js .site-nav__cta { width: auto; }
}

@media (min-width: 64rem) {
	.nav-toggle { display: none; }
	.site-nav, .no-js .site-nav { display: flex; align-items: center; gap: var(--s-5); width: auto; padding: 0; }
	.site-nav__list { display: flex; gap: var(--s-5); }
	.site-nav__link { font-size: var(--fs-sm); padding: var(--s-2) 0; }
}

/* ---------- Sections ---------- */
.section { padding-block: var(--section-y); }
.section__head { max-width: 44rem; margin-bottom: var(--s-7); }
.section__title {
	font-family: var(--f-display);
	font-size: var(--fs-xl);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.01em;
}
.section__intro { margin-top: var(--s-4); font-size: var(--fs-lead); color: var(--c-muted); line-height: var(--lh-body); }
.section__intro a { color: var(--c-ink); font-weight: 600; }

/* ---------- Hero ---------- */
.hero {
	position: relative; isolation: isolate;
	display: flex; align-items: flex-end;
	min-height: min(80svh, 40rem);
	padding-block: clamp(3.5rem, 1rem + 12vw, 9rem) clamp(2rem, 1rem + 3vw, 3.5rem);
	color: #fff; background: var(--c-stone-900);
	overflow: hidden;
}
.hero__media { position: absolute; inset: 0; z-index: -2; }
.hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; }
.hero::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background:
		linear-gradient(180deg, rgb(15 22 19 / 0.15) 0%, rgb(15 22 19 / 0.35) 35%, rgb(15 22 19 / 0.88) 100%);
}
.hero__grid { display: grid; gap: var(--s-6); align-items: end; }
.hero__kicker {
	display: inline-flex; align-items: center; gap: var(--s-2);
	margin-bottom: var(--s-4); padding: 0.3rem 0.85rem 0.3rem 0.6rem;
	border-radius: var(--r-pill); background: rgb(255 255 255 / 0.14);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	border: 1px solid rgb(255 255 255 / 0.22);
	font-size: var(--fs-sm); font-weight: 600; color: #fff;
}
.hero__kicker::before { content: ""; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--c-ochre); box-shadow: 0 0 0 4px rgb(226 166 48 / 0.3); }
.hero__title {
	font-family: var(--f-display);
	font-size: var(--fs-hero);
	font-weight: 700;
	line-height: 1.04;
	letter-spacing: -0.015em;
	max-width: 18ch;
	text-shadow: 0 2px 24px rgb(0 0 0 / 0.25);
}
.hero__lead { margin-top: var(--s-4); max-width: 38rem; font-size: var(--fs-lead); line-height: var(--lh-body); color: rgb(255 255 255 / 0.88); }
.hero__lead a { color: #fff; font-weight: 600; text-decoration-color: var(--c-ochre); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-5); }
.hero__actions .btn { flex: 1 1 15rem; }
.hero__trust { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); margin-top: var(--s-5); font-size: var(--fs-sm); color: rgb(255 255 255 / 0.85); }
.hero__trust li { display: inline-flex; align-items: center; }
.hero__trust li::before { content: ""; flex: none; width: 5px; height: 5px; margin-right: var(--s-2); border-radius: 50%; background: var(--c-ochre); }
@media (max-width: 47.99rem) {
	.hero__trust { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-2) var(--s-4); font-size: var(--fs-xs); }
}

.hero__card {
	display: grid; gap: var(--s-1);
	padding: var(--s-4) var(--s-5);
	border-radius: var(--r-md);
	background: rgb(255 255 255 / 0.12); border: 1px solid rgb(255 255 255 / 0.22);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	font-size: var(--fs-sm); color: rgb(255 255 255 / 0.85);
}
.hero__card-label { margin: 0; font-size: var(--fs-xs); color: rgb(255 255 255 / 0.7); }
.hero__name { font-family: var(--f-display); font-size: var(--fs-lg); font-weight: 700; color: #fff; text-decoration: none; line-height: 1.2; }
.hero__name:hover { text-decoration: underline; text-decoration-color: var(--c-ochre); }
.hero__card-role { margin: 0; }
.hero__card a:not(.hero__name) { color: #fff; }
.hero__card-link { margin-top: var(--s-2); font-weight: 600; }

@media (max-width: 23.99rem) {
	.hero__title { font-size: 2.05rem; }
	.hero__lead { font-size: 1rem; }
	.hero__kicker { margin-bottom: var(--s-3); }
}
@media (min-width: 48rem) {
	.hero { min-height: min(88svh, 52rem); }
	.hero::before { background: linear-gradient(90deg, rgb(15 22 19 / 0.82) 0%, rgb(15 22 19 / 0.55) 45%, rgb(15 22 19 / 0.1) 80%), linear-gradient(180deg, transparent 60%, rgb(15 22 19 / 0.5) 100%); }
}
@media (min-width: 64rem) {
	.hero__grid { grid-template-columns: minmax(0, 1fr) 19rem; gap: var(--s-8); }
	.hero__actions .btn { flex: 0 0 auto; }
}

/* Arch frame: the round-headed arch of Italian porticoes and courtyards */
.arch-img, .hussain__portrait img, .hussain__portrait .img-placeholder {
	width: 100%; height: auto; object-fit: cover;
	border-radius: 999px 999px var(--r-md) var(--r-md);
}

.img-placeholder {
	display: grid; place-items: center; padding: var(--s-6);
	background:
		repeating-linear-gradient(135deg, transparent 0 14px, rgb(74 90 83 / 0.06) 14px 15px),
		var(--c-stone-100);
	color: var(--c-stone); font-size: var(--fs-sm); font-weight: 600; text-align: center;
}

.btn--light { background: #fff; color: var(--c-ink); }
.btn--light:hover { background: var(--c-stone-50); box-shadow: var(--shadow-lift); }

/* ---------- Proof ---------- */
.proof { border-block: 1px solid var(--c-stone-200); background: var(--c-surface); }
.proof__list { display: grid; }
.proof__item { display: flex; flex-direction: column; justify-content: space-between; gap: var(--s-3); padding: var(--s-5) 0; border-bottom: 1px solid var(--c-stone-100); }
.proof__item:last-child { border-bottom: 0; }
.proof__item p { color: var(--c-muted); }
.proof__figure { display: block; margin-bottom: var(--s-1); font-family: var(--f-display); font-size: var(--fs-lg); font-weight: 700; color: var(--c-ink); line-height: 1.1; }
.proof__source { font-size: var(--fs-sm); font-weight: 600; color: var(--c-stone); }
@media (min-width: 40rem) {
	.proof__list { grid-template-columns: repeat(2, 1fr); column-gap: var(--s-6); }
	.proof__item:nth-last-child(2) { border-bottom: 0; }
}
@media (min-width: 64rem) {
	.proof__list { grid-template-columns: repeat(4, 1fr); }
	.proof__item { padding: var(--s-6) var(--s-5); border-bottom: 0; border-left: 1px solid var(--c-stone-100); }
	.proof__item:first-child { border-left: 0; padding-left: 0; }
}

/* ---------- Why Italy ---------- */
.reasons { display: grid; gap: var(--s-5) var(--s-6); counter-reset: none; }
.reasons__item { padding-top: var(--s-4); border-top: 2px solid var(--c-stone); }
.reasons__title { margin-bottom: var(--s-2); font-size: var(--fs-md); }
.reasons__item p { color: var(--c-muted); }
@media (min-width: 40rem) { .reasons { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .reasons { grid-template-columns: repeat(5, 1fr); } }

.fit { display: grid; gap: var(--s-4); margin-top: var(--s-8); }
.fit__col { padding: var(--s-6) var(--s-5); border-radius: var(--r-lg); }
.fit__col--yes { background: var(--c-stone-700); color: #fff; }
.fit__col--no { background: var(--c-surface); border: 1px solid var(--c-stone-200); }
.fit__title { margin-bottom: var(--s-5); font-family: var(--f-display); font-size: var(--fs-lg); font-weight: 600; }
.fit__note { margin-top: var(--s-5); padding-top: var(--s-4); border-top: 1px solid var(--c-stone-100); font-size: var(--fs-sm); color: var(--c-muted); }
.fit__note a { color: var(--c-ink); font-weight: 600; }
@media (min-width: 56rem) { .fit { grid-template-columns: 1fr 1fr; } .fit__col { padding: var(--s-7); } }

.ticks li, .dashes li { position: relative; padding-left: 1.85rem; margin-bottom: var(--s-3); }
.ticks li::before {
	content: ""; position: absolute; left: 0; top: 0.3em;
	width: 1.15rem; height: 1.15rem; border-radius: 50%;
	background: var(--c-ochre) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4L18 8' fill='none' stroke='%2317201c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 0.8rem no-repeat;
}
.dashes li::before { content: ""; position: absolute; left: 0.2rem; top: 0.8em; width: 0.8rem; height: 2px; background: var(--c-stone-400); }
.ticks--cols { columns: 1; column-gap: var(--s-7); }
.ticks--cols li { break-inside: avoid; }
@media (min-width: 48rem) { .ticks--cols { columns: 2; } }

/* ---------- Italy top: heading with courtyard photo ---------- */
.italy__top { display: grid; gap: var(--s-6); align-items: end; margin-bottom: var(--s-7); }
.italy__top .section__head { margin-bottom: 0; }
.italy__photo { margin: 0; max-width: 22rem; }
@media (min-width: 64rem) {
	.italy__top { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--s-9); }
	.italy__photo { justify-self: end; width: 100%; margin-top: calc(-1 * var(--s-6)); }
}

/* ---------- Cities ---------- */
.cities { background: var(--c-surface); border-top: 1px solid var(--c-stone-200); }
.cities__grid { display: grid; gap: var(--s-5); }
.city { height: 100%; display: flex; flex-direction: column; }
.city__media { overflow: hidden; border-radius: 999px 999px var(--r-sm) var(--r-sm); aspect-ratio: 4 / 3; background: var(--c-stone-100); }
.city__img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--ease); }
.city:hover .city__img { transform: scale(1.05); }
.city__body { padding: var(--s-4) var(--s-1) 0; }
.city__name { font-family: var(--f-display); font-size: var(--fs-lg); font-weight: 700; }
.city__unis { margin: var(--s-1) 0 var(--s-2); color: var(--c-ink); }
.city__office { font-size: var(--fs-sm); color: var(--c-muted); }
.cities__foot { margin-top: var(--s-6); color: var(--c-muted); }
.cities__foot a { color: var(--c-ink); font-weight: 600; }
@media (min-width: 40rem) { .cities__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .cities__grid { grid-template-columns: repeat(3, 1fr); gap: var(--s-7) var(--s-6); } }

/* ---------- Intake calendar (signature) ---------- */
.calendar { background: var(--c-plaster); border-block: 1px solid var(--c-stone-200); }
.cal { --label: 17rem; --cal-gap: var(--s-6); position: relative; }
.cal__months { display: none; }
.cal__phases { display: grid; gap: var(--s-4); }
.cal__phase {
	display: grid; gap: var(--s-3);
	padding: var(--s-5); border: 1px solid var(--c-stone-200); border-radius: var(--r-md);
	background: var(--c-plaster);
	transition: border-color var(--t-fast), background-color var(--t-fast);
}
.cal__phase.is-current { border-color: var(--c-ochre); background: var(--c-surface); box-shadow: inset 4px 0 0 var(--c-ochre); }
.cal__title { font-size: var(--fs-md); }
.cal__when { margin: 0; font-size: var(--fs-sm); font-weight: 600; color: var(--c-stone); }
.cal__phase.is-current .cal__when::after { content: " · now"; color: var(--c-ochre-600); }

.cal__track {
	position: relative;
	display: grid; grid-template-columns: repeat(12, 1fr); gap: 2px;
	height: 0.75rem;
}
/* The 12 month cells behind the bar */
.cal__track::before {
	content: ""; position: absolute; inset: 0;
	background: repeating-linear-gradient(90deg, var(--c-stone-100) 0 calc(100% / 12 - 2px), transparent calc(100% / 12 - 2px) calc(100% / 12));
	border-radius: 3px;
}
.cal__bar {
	position: relative; grid-column: var(--s) / var(--e); grid-row: 1;
	border-radius: 3px; background: var(--c-stone);
	transform-origin: left center;
	transition: transform 900ms var(--ease);
}
.cal__phase.is-current .cal__bar { background: var(--c-ochre); }
.cal__body { font-size: var(--fs-sm); color: var(--c-muted); }
.cal__body p { margin-bottom: var(--s-2); }
.cal__example { padding-left: var(--s-3); border-left: 2px solid var(--c-stone-200); color: var(--c-stone-900); }

.js .cal:not(.is-drawn) .cal__bar { transform: scaleX(0); }
.js .cal.is-drawn .cal__phase:nth-child(2) .cal__bar { transition-delay: 120ms; }
.js .cal.is-drawn .cal__phase:nth-child(3) .cal__bar { transition-delay: 240ms; }
.js .cal.is-drawn .cal__phase:nth-child(4) .cal__bar { transition-delay: 360ms; }
.js .cal.is-drawn .cal__phase:nth-child(5) .cal__bar { transition-delay: 480ms; }

.calendar__foot { margin-top: var(--s-6); font-size: var(--fs-sm); color: var(--c-muted); max-width: 44rem; }
.calendar__foot a { color: var(--c-ink); font-weight: 600; }

@media (min-width: 64rem) {
	.cal__months {
		display: grid; grid-template-columns: repeat(12, 1fr);
		margin-left: calc(var(--label) + var(--cal-gap));
		padding-bottom: var(--s-3); border-bottom: 1px solid var(--c-stone-200);
		font-size: var(--fs-xs); font-weight: 600; color: var(--c-muted); text-align: center;
	}
	.cal__months li.is-now { color: var(--c-ink); }
	.cal__months li.is-now::after { content: ""; display: block; width: 6px; height: 6px; margin: 4px auto 0; border-radius: 50%; background: var(--c-ochre-600); }

	/* Vertical "today" band through every row */
	.cal::before {
		content: ""; position: absolute; top: 0; bottom: 0;
		left: calc(var(--label) + var(--cal-gap) + (100% - var(--label) - var(--cal-gap)) / 12 * (var(--now) - 1));
		width: calc((100% - var(--label) - var(--cal-gap)) / 12);
		background: rgb(226 166 48 / 0.1);
		border-inline: 1px dashed rgb(201 142 26 / 0.45);
		pointer-events: none;
	}

	.cal__phases { gap: 0; }
	.cal__phase {
		grid-template-columns: var(--label) 1fr; column-gap: var(--cal-gap); row-gap: var(--s-2);
		padding: var(--s-5) 0; border: 0; border-bottom: 1px solid var(--c-stone-100); border-radius: 0;
		background: transparent;
	}
	.cal__phase.is-current { box-shadow: none; background: transparent; }
	.cal__label { grid-row: 1 / span 2; }
	.cal__track { grid-column: 2; height: 1.1rem; margin-top: 0.3rem; }
	.cal__track::before { opacity: 0.6; }
	.cal__body { grid-column: 2; max-width: 52rem; }
	.cal__phase:hover .cal__bar { filter: brightness(1.12); }
}

/* ---------- Services ---------- */
.services__grid { display: grid; gap: var(--s-6) var(--s-6); }
.service { position: relative; padding-top: var(--s-5); border-top: 1px solid var(--c-stone-200); }
.service::before { content: ""; position: absolute; top: -1px; left: 0; width: 2.5rem; height: 3px; background: var(--c-ochre); transition: width var(--t-med) var(--ease); }
.service:hover::before { width: 5rem; }
.service__title { margin-bottom: var(--s-2); font-size: var(--fs-md); }
.service p { color: var(--c-muted); }
@media (min-width: 40rem) { .services__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .services__grid { grid-template-columns: repeat(3, 1fr); row-gap: var(--s-7); } }

.docs { margin-top: var(--s-8); padding: var(--s-5); border-radius: var(--r-lg); background: var(--c-surface); border: 1px solid var(--c-stone-200); }
.docs__intro { margin-bottom: var(--s-5); max-width: 40rem; }
.docs__title { font-family: var(--f-display); font-size: var(--fs-lg); margin-bottom: var(--s-2); }
.docs__intro p { color: var(--c-muted); }
.docs__tabs { display: flex; gap: var(--s-1); margin-bottom: var(--s-5); padding: var(--s-1); border-radius: var(--r-pill); background: var(--c-stone-50); overflow-x: auto; scrollbar-width: none; }
.docs__tabs[hidden] { display: none; }
.docs__tab {
	flex: 1 0 auto; min-height: 2.75rem; padding: 0 var(--s-4);
	border: 0; border-radius: var(--r-pill); background: transparent;
	font: 600 var(--fs-sm) var(--f-body); color: var(--c-muted); cursor: pointer; white-space: nowrap;
	transition: background-color var(--t-fast), color var(--t-fast), box-shadow var(--t-fast);
}
.docs__tab:hover { color: var(--c-ink); }
.docs__tab[aria-selected="true"] { background: var(--c-surface); color: var(--c-ink); box-shadow: 0 1px 3px rgb(31 41 37 / 0.15); }
.docs__panel { border-radius: var(--r-sm); }
.docs__panel + .docs__panel { margin-top: var(--s-6); }
.docs__panel-title { margin-bottom: var(--s-4); font-size: var(--fs-md); }
.js .docs.is-tabbed .docs__panel + .docs__panel { margin-top: 0; }
.js .docs.is-tabbed .docs__panel-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.docs__panel[hidden] { display: none; }
.docs__panel.is-entering { animation: fade-in var(--t-med) var(--ease); }
@media (min-width: 48rem) { .docs { padding: var(--s-7); } .docs__tabs:not([hidden]) { display: inline-flex; } }

/* ---------- Process stepper ---------- */
.process { background: var(--c-stone-50); }
.stepper__panels { display: grid; gap: var(--s-4); }
.step {
	padding: var(--s-6) var(--s-5);
	border-radius: var(--r-lg); background: var(--c-surface); border: 1px solid var(--c-stone-200);
}
.step__count { margin-bottom: var(--s-2); font-size: var(--fs-sm); font-weight: 600; color: var(--c-stone); }
.step__title { font-family: var(--f-display); font-size: var(--fs-lg); font-weight: 700; margin-bottom: var(--s-3); }
.step__text { color: var(--c-muted); max-width: 40rem; }
.step__points { margin: var(--s-5) 0; }
.step[hidden] { display: none; }
.step.is-entering { animation: fade-in var(--t-med) var(--ease); }
.stepper__nav[hidden] { display: none; }
.stepper__nav { display: flex; gap: var(--s-2); margin-bottom: var(--s-4); overflow-x: auto; scrollbar-width: none; padding-bottom: var(--s-1); }
.stepper__tab {
	flex: none; display: flex; align-items: center; gap: var(--s-3);
	padding: var(--s-2) var(--s-4) var(--s-2) var(--s-2);
	border: 1px solid var(--c-stone-200); border-radius: var(--r-pill); background: var(--c-surface);
	font: 600 var(--fs-sm) var(--f-body); color: var(--c-muted); text-align: left; cursor: pointer;
	transition: background-color var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.stepper__num {
	display: grid; place-items: center; flex: none; width: 2rem; height: 2rem;
	border-radius: 50%; background: var(--c-stone-100); color: var(--c-stone-700);
	font-family: var(--f-display); font-weight: 700;
	transition: background-color var(--t-fast), color var(--t-fast);
}
.stepper__tab:hover { color: var(--c-ink); border-color: var(--c-stone-400); }
.stepper__tab.is-done .stepper__num { background: var(--c-stone); color: #fff; }
.stepper__tab[aria-selected="true"] { background: var(--c-stone-900); border-color: var(--c-stone-900); color: #fff; }
.stepper__tab[aria-selected="true"] .stepper__num { background: var(--c-ochre); color: var(--c-ink); }
/* Mobile: only the number pills scroll; the active one shows its label */
@media (max-width: 47.99rem) {
	.stepper__tab:not([aria-selected="true"]) .stepper__label { display: none; }
	.stepper__tab:not([aria-selected="true"]) { padding-right: var(--s-2); }
}
@media (min-width: 64rem) {
	.stepper.is-tabbed { display: grid; grid-template-columns: 20rem minmax(0, 1fr); gap: var(--s-7); align-items: start; }
	.stepper__nav { flex-direction: column; margin: 0; overflow: visible; }
	.stepper__tab { width: 100%; border-radius: var(--r-md); padding: var(--s-3) var(--s-4) var(--s-3) var(--s-3); }
	.step { padding: var(--s-8) var(--s-7); min-height: 100%; }
	.stepper.is-tabbed .step { min-height: 26rem; }
}

/* ---------- Situation picker ---------- */
.picker { padding-bottom: calc(var(--section-y) * 0.6); }
.picker__chips[hidden] { display: none; }
.picker__chips { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-bottom: var(--s-5); }
.chip {
	min-height: 2.75rem; padding: 0.5rem 1.1rem;
	border: 1.5px solid var(--c-stone-200); border-radius: var(--r-pill); background: var(--c-surface);
	font: 600 var(--fs-sm)/1.25 var(--f-body); color: var(--c-stone-900); text-align: left; cursor: pointer;
	transition: background-color var(--t-fast), border-color var(--t-fast), color var(--t-fast);
}
.chip:hover { border-color: var(--c-stone); }
.chip[aria-selected="true"] { background: var(--c-stone-900); border-color: var(--c-stone-900); color: #fff; }
.picker__panel {
	padding: var(--s-6) var(--s-5); border-radius: var(--r-lg);
	background: var(--c-surface); border: 1px solid var(--c-stone-200);
}
.picker__panel + .picker__panel { margin-top: var(--s-4); }
.picker__panel[hidden] { display: none; }
.picker__panel.is-entering { animation: fade-in var(--t-med) var(--ease); }
.picker__situation { margin-bottom: var(--s-1); font-size: var(--fs-sm); font-weight: 600; color: var(--c-stone); }
.js .picker__box.is-tabbed .picker__situation { display: none; }
.js .picker__box.is-tabbed .picker__panel + .picker__panel { margin-top: 0; }
.picker__title { font-family: var(--f-display); font-size: var(--fs-lg); font-weight: 700; margin-bottom: var(--s-4); }
.picker__facts { margin-bottom: var(--s-5); max-width: 46rem; }
@media (min-width: 48rem) {
	.picker__panel { padding: var(--s-7); }
	.picker__facts { columns: 2; column-gap: var(--s-7); max-width: none; }
	.picker__facts li { break-inside: avoid; }
}

/* ---------- Free vs full guidance ---------- */
.section__head--center { margin-inline: auto; text-align: center; }
.plans { display: grid; gap: var(--s-4); max-width: 60rem; margin-inline: auto; }
.plan {
	display: flex; flex-direction: column;
	padding: var(--s-6) var(--s-5); border-radius: var(--r-lg);
	background: var(--c-surface); border: 1px solid var(--c-stone-200);
}
.plan--full { background: var(--c-stone-900); border-color: var(--c-stone-900); color: #e9eeeb; }
.plan__name { font-family: var(--f-display); font-size: var(--fs-xl); font-weight: 700; line-height: 1.1; }
.plan--full .plan__name { color: #fff; }
.plan__desc { margin-top: var(--s-2); color: var(--c-muted); }
.plan--full .plan__desc { color: #aab6b0; }
.plan__price { margin: var(--s-5) 0; padding-bottom: var(--s-5); border-bottom: 1px solid var(--c-stone-100); font-family: var(--f-display); font-size: var(--fs-md); font-weight: 700; }
.plan--full .plan__price { border-color: rgb(255 255 255 / 0.12); color: var(--c-ochre); }
.plan__list { flex: 1; margin-bottom: var(--s-6); }
.plan__list li { display: flex; align-items: flex-start; gap: var(--s-3); padding: var(--s-2) 0; }
.plan__list .icon { flex: none; width: 1.15rem; height: 1.15rem; margin-top: 0.2rem; color: var(--c-stone); }
.plan--full .plan__list .icon { color: var(--c-ochre); }
.plan__list li.is-out { color: #9aa59f; }
.plan__dash { flex: none; width: 1.15rem; height: 2px; margin-top: 0.75rem; background: var(--c-stone-200); }
@media (min-width: 48rem) { .plans { grid-template-columns: 1fr 1fr; } .plan { padding: var(--s-7); } }

/* ---------- Closing call-to-action band ---------- */
.cta-band { padding-block: clamp(3.5rem, 2.5rem + 4vw, 6rem); background: var(--c-stone-900); color: #e9eeeb; text-align: center; }
.cta-band__inner { max-width: 48rem; }
.cta-band__title { font-family: var(--f-display); font-size: var(--fs-xl); font-weight: 700; line-height: 1.1; color: #fff; }
.cta-band__text { margin: var(--s-4) auto var(--s-6); font-size: var(--fs-lead); line-height: var(--lh-body); color: #c8d1cc; max-width: 36rem; }
.cta-band__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s-3); }
.btn--outline-light { border-color: rgb(255 255 255 / 0.5); color: #fff; }
.btn--outline-light:hover { background: #fff; color: var(--c-ink); border-color: #fff; }

/* ---------- Hussain ---------- */
.hussain { background: var(--c-stone-900); color: #e9eeeb; }
.hussain a { color: #fff; }
.hussain .section__title { color: #fff; }
.hussain__grid { display: grid; gap: var(--s-8); }
.hussain__lead { margin-top: var(--s-5); font-size: var(--fs-lg); line-height: 1.4; color: #fff; font-family: var(--f-display); }
.hussain__lead a { text-decoration-color: var(--c-ochre); }
.hussain__bio > p:not(.hussain__lead) { max-width: 40rem; color: #c8d1cc; }
.hussain__quote { margin: var(--s-7) 0; padding: 0 0 0 var(--s-5); border-left: 3px solid var(--c-ochre); max-width: 40rem; }
.hussain__quote p { font-family: var(--f-display); font-size: var(--fs-md); line-height: 1.45; color: #fff; }
.hussain__quote footer { margin-top: var(--s-3); font-size: var(--fs-sm); color: #aab6b0; }
.hussain__quote cite { font-style: normal; }
.hussain__links { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.hussain__links a {
	display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0 var(--s-4);
	border: 1px solid rgb(255 255 255 / 0.25); border-radius: var(--r-pill);
	font-size: var(--fs-sm); font-weight: 600; text-decoration: none;
	transition: background-color var(--t-fast), border-color var(--t-fast), color var(--t-fast);
}
.hussain__links a:hover { background: #fff; color: var(--c-ink); border-color: #fff; }

.hussain__side { display: grid; gap: var(--s-6); align-content: start; }
.hussain__portrait { margin: 0; max-width: 20rem; }
.hussain__portrait .img-placeholder { aspect-ratio: 4 / 5; background: rgb(255 255 255 / 0.06); color: #aab6b0; border: 1px dashed rgb(255 255 255 / 0.25); }
.resources__title { margin-bottom: var(--s-4); font-size: var(--fs-md); color: #fff; }
.resources__list { display: grid; gap: var(--s-2); }
.resource {
	position: relative; display: grid; gap: var(--s-1);
	padding: var(--s-4) var(--s-7) var(--s-4) var(--s-5);
	border-radius: var(--r-md); background: rgb(255 255 255 / 0.05); border: 1px solid rgb(255 255 255 / 0.1);
	text-decoration: none;
	transition: background-color var(--t-fast), border-color var(--t-fast), transform var(--t-fast) var(--ease);
}
.resource::after {
	content: ""; position: absolute; right: var(--s-5); top: 50%; width: 0.6rem; height: 0.6rem;
	border-top: 2px solid var(--c-ochre); border-right: 2px solid var(--c-ochre);
	transform: translateY(-50%) rotate(45deg); transition: right var(--t-fast) var(--ease);
}
.resource:hover { background: rgb(255 255 255 / 0.1); border-color: rgb(226 166 48 / 0.5); }
.resource:hover::after { right: calc(var(--s-5) - 4px); }
.resource__title { font-weight: 700; color: #fff; }
.resource__text { font-size: var(--fs-sm); color: #aab6b0; }
@media (min-width: 64rem) { .hussain__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--s-9); } }

/* ---------- Stories ---------- */
.stories__grid { display: grid; gap: var(--s-4); }
.story { margin: 0; display: flex; flex-direction: column; justify-content: space-between; gap: var(--s-5); padding: var(--s-6); border-radius: var(--r-lg); background: var(--c-surface); border: 1px solid var(--c-stone-200); }
.story__quote { margin: 0; font-family: var(--f-display); font-size: var(--fs-md); line-height: 1.45; }
.story__by { display: grid; gap: 0.1rem; font-size: var(--fs-sm); color: var(--c-muted); }
.story__name { font-weight: 700; color: var(--c-ink); }
.story__link { margin-top: var(--s-2); font-weight: 600; color: var(--c-stone); }
.story--placeholder { border: 2px dashed var(--c-ochre-600); background: repeating-linear-gradient(135deg, transparent 0 16px, rgb(226 166 48 / 0.06) 16px 17px), var(--c-surface); }
.story--placeholder .story__quote { color: var(--c-muted); }
.story__flag { align-self: flex-start; margin: 0; padding: 0.2rem 0.6rem; border-radius: var(--r-pill); background: var(--c-ochre-100); font-size: var(--fs-xs); font-weight: 700; color: var(--c-stone-900); }
.stories__empty { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-5); padding: var(--s-6); border-radius: var(--r-lg); background: var(--c-surface); border: 1px solid var(--c-stone-200); }
.stories__empty p { max-width: 36rem; font-size: var(--fs-lead); }
@media (min-width: 56rem) { .stories__grid { grid-template-columns: repeat(3, 1fr); } }

.reader-note { margin: var(--s-7) 0 0; max-width: 46rem; }
.reader-note blockquote { margin: 0 0 var(--s-3); font-family: var(--f-display); font-size: var(--fs-lg); line-height: 1.35; }
.reader-note figcaption { display: grid; gap: var(--s-1); font-size: var(--fs-sm); color: var(--c-muted); }
.reader-note__translation { color: var(--c-ink); }
.reader-note a { color: var(--c-ink); font-weight: 600; }

/* ---------- FAQ ---------- */
.faq { background: var(--c-surface); border-top: 1px solid var(--c-stone-200); }
.faq__grid { display: grid; gap: var(--s-5); }
.faq__head { margin-bottom: 0; }
.faq__list { border-top: 1px solid var(--c-stone-200); }
.faq__item { border-bottom: 1px solid var(--c-stone-200); }
.faq__q {
	display: flex; align-items: center; justify-content: space-between; gap: var(--s-4);
	padding: var(--s-5) 0; cursor: pointer; list-style: none;
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q-text { font-size: var(--fs-md); font-weight: 600; transition: color var(--t-fast); }
.faq__q:hover .faq__q-text { color: var(--c-stone); }
.faq__icon {
	display: grid; place-items: center; flex: none; width: 2.25rem; height: 2.25rem;
	border-radius: 50%; border: 1.5px solid var(--c-stone-200);
	transition: transform var(--t-med) var(--ease), background-color var(--t-fast), border-color var(--t-fast);
}
.faq__item[open] .faq__icon { transform: rotate(45deg); background: var(--c-ochre); border-color: var(--c-ochre); }
.faq__a { padding: 0 var(--s-7) var(--s-5) 0; color: var(--c-muted); overflow: hidden; }
.faq__a p { max-width: 42rem; }
@media (min-width: 64rem) {
	.faq__grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--s-9); align-items: start; }
	.faq__head { position: sticky; top: calc(var(--header-h) + var(--s-6)); }
}

/* ---------- Consultation ---------- */
.consultation { background: var(--c-stone-100); }
.consultation__grid { display: grid; gap: var(--s-7); }
.consultation__info .section__intro { margin-bottom: var(--s-6); }
.consultation__sub { margin: var(--s-6) 0 var(--s-4); font-size: var(--fs-md); }
.contact-list { display: grid; gap: var(--s-2); }
.contact-list a {
	display: flex; align-items: center; gap: var(--s-3);
	min-height: 3rem; padding: var(--s-2) var(--s-4);
	border-radius: var(--r-md); background: rgb(255 255 255 / 0.6);
	font-weight: 600; text-decoration: none;
	transition: background-color var(--t-fast);
}
.contact-list a:hover { background: var(--c-surface); }
.contact-list .icon { color: var(--c-stone); }

.lead-form { padding: var(--s-5); border-radius: var(--r-lg); background: var(--c-surface); box-shadow: var(--shadow-lift); }
.lead-form__title { margin-bottom: var(--s-5); font-family: var(--f-display); font-size: var(--fs-lg); }
.field { margin-bottom: var(--s-4); }
.field-row { display: grid; gap: 0 var(--s-4); }
.field__label { display: block; margin-bottom: var(--s-2); font-size: var(--fs-sm); font-weight: 600; }
.field__optional { font-weight: 400; color: var(--c-muted); }
.field__control {
	width: 100%; min-height: 3rem; padding: 0.7rem 0.9rem;
	border: 1.5px solid var(--c-stone-200); border-radius: var(--r-sm);
	background: var(--c-surface); color: var(--c-ink);
	font: inherit; font-size: 1rem;
	transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
select.field__control {
	appearance: none; padding-right: 2.5rem;
	background: var(--c-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%234a5a53' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") right 0.75rem center / 1.1rem no-repeat;
}
textarea.field__control { min-height: 7rem; resize: vertical; }
.field__control::placeholder { color: #85918b; }
.field__control:hover { border-color: var(--c-stone-400); }
.field__control:focus { outline: none; border-color: var(--c-stone); box-shadow: 0 0 0 3px rgb(29 95 209 / 0.35); }
.field__control[aria-invalid="true"] { border-color: var(--c-error); }
.field__control[aria-invalid="true"]:focus { box-shadow: 0 0 0 3px rgb(168 38 29 / 0.25); }
.field__hint { margin: var(--s-1) 0 0; font-size: var(--fs-xs); color: var(--c-muted); }
.field__error { margin: var(--s-1) 0 0; font-size: var(--fs-sm); font-weight: 600; color: var(--c-error); }
.field__error::before { content: "! "; }
.form-status { margin-bottom: var(--s-5); padding: var(--s-4); border-radius: var(--r-sm); font-weight: 600; }
.form-status[hidden] { display: none; }
.form-status--sent { background: #e3f1ea; color: var(--c-success); border: 1px solid #b9dccb; }
.form-status--invalid, .form-status--expired, .form-status--limited, .form-status--failed { background: #fbe9e7; color: var(--c-error); border: 1px solid #f0c4bf; }
.form-status:focus { outline: none; }
.lead-form__privacy { margin-top: var(--s-3); font-size: var(--fs-xs); color: var(--c-muted); text-align: center; }
.lead-form.is-sent .field, .lead-form.is-sent .field-row, .lead-form.is-sent [data-submit], .lead-form.is-sent .lead-form__privacy { display: none; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (min-width: 40rem) { .field-row { grid-template-columns: 1fr 1fr; } .lead-form { padding: var(--s-7); } }
@media (min-width: 64rem) { .consultation__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--s-9); align-items: start; } }

/* ---------- Footer ---------- */
.site-footer { padding-block: var(--s-8) var(--s-6); background: var(--c-ink); color: #c5ceca; font-size: var(--fs-sm); }
.site-footer a { color: #fff; }
.site-footer__grid { display: grid; gap: var(--s-6); }
.brand__word--footer { color: #fff; margin-bottom: var(--s-3); }
.site-footer .brand__tld { color: var(--c-stone-400); }
.site-footer__about { max-width: 30rem; }
.site-footer__title { margin-bottom: var(--s-3); font-size: var(--fs-sm); color: #fff; }
.site-footer__col li { margin-bottom: var(--s-2); }
.site-footer__col a { text-decoration: none; }
.site-footer__col a:hover { text-decoration: underline; }
.site-footer__base { display: grid; gap: var(--s-2); margin-top: var(--s-7); padding-top: var(--s-5); border-top: 1px solid rgb(255 255 255 / 0.12); font-size: var(--fs-xs); color: #95a29c; }
@media (min-width: 48rem) {
	.site-footer__grid { grid-template-columns: 2fr 1fr 1fr; }
	.site-footer__base { grid-template-columns: auto 1fr; gap: var(--s-6); }
	.site-footer__base p:last-child { text-align: right; }
}
.site-footer__credits { grid-column: 1 / -1; text-align: left !important; }
.site-footer__credits a { color: #c5ceca; }
.sit-landing .site-footer { padding-bottom: calc(var(--s-6) + 4.5rem); }
@media (min-width: 64rem) { .site-footer__credits { grid-column: 1 / -1; text-align: left !important; }
.site-footer__credits a { color: #c5ceca; }
.sit-landing .site-footer { padding-bottom: var(--s-6); } }

/* ---------- Sticky mobile CTA ---------- */
.sticky-cta {
	position: fixed; left: var(--s-3); right: var(--s-3); bottom: var(--s-3); z-index: 40;
	display: flex; gap: var(--s-2); padding: var(--s-2);
	border-radius: var(--r-pill); background: rgb(23 32 28 / 0.92);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	box-shadow: 0 12px 30px -10px rgb(0 0 0 / 0.45);
	transform: translateY(calc(100% + 1.5rem));
	transition: transform var(--t-med) var(--ease);
}
.sticky-cta .btn--primary { flex: 1; }
.sticky-cta__channel { padding-inline: 1rem; gap: 0.4rem; }

/* ---------- Floating WhatsApp channel link ---------- */
.wa-channel {
	position: fixed; right: var(--s-5); bottom: var(--s-5); z-index: 40;
	display: inline-flex; align-items: center; gap: var(--s-2);
	padding: 0.3rem 1rem 0.3rem 0.3rem;
	border-radius: var(--r-pill); background: var(--c-surface);
	border: 1px solid var(--c-stone-200);
	box-shadow: 0 10px 28px -12px rgb(23 32 28 / 0.4);
	font-size: var(--fs-sm); font-weight: 600; color: var(--c-ink); text-decoration: none;
	transition: transform var(--t-fast) var(--ease), box-shadow var(--t-fast);
}
.wa-channel:hover { transform: translateY(-2px); box-shadow: 0 14px 32px -12px rgb(23 32 28 / 0.5); }
.wa-channel__icon { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: #1f7a4d; color: #fff; }
.wa-channel__icon .icon { width: 1.2rem; height: 1.2rem; }
/* On phones the home page puts the channel in the sticky bar instead. */
@media (max-width: 63.99rem) {
	.sit-landing .wa-channel { display: none; }
	.wa-channel { right: var(--s-3); bottom: var(--s-3); }
}
.sticky-cta.is-visible { transform: none; }
.sticky-cta[hidden] { display: none; }
@media (min-width: 64rem) { .sticky-cta { display: none !important; } }

/* ---------- Generic content pages ---------- */
.content-page { padding-block: var(--s-8); }
.entry { padding-block: var(--s-6); border-bottom: 1px solid var(--c-stone-200); }
.entry__title { font-family: var(--f-display); font-size: var(--fs-xl); line-height: 1.1; }
.entry__title a { text-decoration: none; }
.entry__meta { margin-top: var(--s-2); color: var(--c-muted); font-size: var(--fs-sm); }
.entry__content { margin-top: var(--s-5); }
.entry__content > * + * { margin-top: var(--s-4); }
.entry__content h2 { font-size: var(--fs-lg); margin-top: var(--s-7); }
.entry__content ul { list-style: disc; padding-left: 1.25rem; }
.entry__content ol { list-style: decimal; padding-left: 1.25rem; }
.entry__content img { border-radius: var(--r-md); }

/* ---------- Reveal (one subtle entrance for section heads) ---------- */
.js .reveal { opacity: 0; transform: translateY(14px); transition: opacity 600ms var(--ease), transform 600ms var(--ease); }
.js .reveal.is-in { opacity: 1; transform: none; }

@keyframes fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; transition-delay: 0s !important; }
	.js .reveal { opacity: 1; transform: none; }
	.js .cal:not(.is-drawn) .cal__bar { transform: none; }
}

/* ---------- Print ---------- */
@media print {
	.site-header, .sticky-cta, .lead-form, .hero__actions { display: none !important; }
	body { background: #fff; }
	.hussain { background: #fff; color: #000; }
}