/*
 * Calm institutional layer.
 * Loaded after site-v2.css: reduces display scale, decorative shapes and dark
 * blocks while keeping the approved paper/ink/violet/gold palette.
 */

body.vas-calm {
	font-size: 16.5px;
	line-height: 1.6;
}

/* Hero -------------------------------------------------------------------- */
body.vas-calm .hero {
	padding: clamp(2.8rem, 4.5vw, 4.5rem) 0 clamp(2.4rem, 3.5vw, 3.5rem);
}

body.vas-calm .hero::before,
body.vas-calm .hero::after {
	display: none;
}

body.vas-calm .hero__inner {
	grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
	gap: clamp(2rem, 4vw, 4rem);
}

body.vas-calm .hero__copy h1 {
	max-width: 12ch;
	font-size: clamp(2.9rem, 5.2vw, 5.1rem);
	line-height: 0.96;
	letter-spacing: -0.025em;
}

body.vas-calm .hero__lead {
	max-width: 34rem;
	margin-top: 1.25rem;
	font-size: clamp(1.05rem, 1.35vw, 1.2rem);
	line-height: 1.55;
}

body.vas-calm .hero__actions {
	gap: 1rem;
	margin-top: 1.8rem;
}

body.vas-calm .hero__note {
	margin-top: 1.6rem;
	font-size: 0.64rem;
}

body.vas-calm .hero__visual {
	min-height: 0;
	height: clamp(360px, 39vw, 500px);
}

body.vas-calm .hero__photo--main {
	position: relative;
	inset: auto;
	width: 100%;
	height: 100%;
	border-radius: 10px;
}

body.vas-calm .hero__photo--small,
body.vas-calm .hero__stamp {
	display: none;
}

/* The moving colour band is removed: it adds noise on first screen. */
body.vas-calm .ticker {
	display: none;
}

/* Sections and headings --------------------------------------------------- */
body.vas-calm .section {
	padding: clamp(3.2rem, 5vw, 5rem) 0;
}

body.vas-calm .section--programs {
	padding-top: clamp(3.2rem, 5vw, 5rem);
}

body.vas-calm .section-head {
	max-width: 760px;
	margin-bottom: clamp(1.8rem, 3vw, 2.6rem);
}

body.vas-calm .section-head h2 {
	max-width: 24ch;
	font-size: clamp(2rem, 3vw, 3rem);
	line-height: 1.05;
	letter-spacing: -0.02em;
}

body.vas-calm .page-hero {
	padding: clamp(2.5rem, 4vw, 4rem) 0 clamp(2rem, 3vw, 3rem);
}

body.vas-calm .page-hero__inner {
	grid-template-columns: minmax(0, 1.05fr) minmax(260px, 0.58fr);
	gap: clamp(2rem, 4vw, 4rem);
}

body.vas-calm .page-hero h1 {
	max-width: 15ch;
	font-size: clamp(2.8rem, 4.7vw, 4.4rem);
	line-height: 1;
	letter-spacing: -0.02em;
}

body.vas-calm .page-hero__lead {
	max-width: 60ch;
	font-size: 1.05rem;
	line-height: 1.55;
}

/* Stats ------------------------------------------------------------------- */
body.vas-calm .stat {
	padding: 1.5rem clamp(0.8rem, 2.2vw, 2rem) 1.6rem;
}

body.vas-calm .stat__value {
	font-size: clamp(2.3rem, 3.8vw, 3.7rem);
	line-height: 0.9;
}

/* Programmes: light cards, no dark slabs -------------------------------- */
body.vas-calm .programme-card {
	padding: 1.5rem;
	border: 1px solid var(--line);
	background: var(--paper-2);
	color: var(--ink);
}

body.vas-calm .programme-card .eyebrow {
	color: var(--lime);
}

body.vas-calm .programme-card h3 {
	max-width: 18ch;
	color: var(--ink);
	font-size: clamp(1.75rem, 2.4vw, 2.45rem);
}

body.vas-calm .programme-card p,
body.vas-calm .programme-card li {
	color: var(--ink-3);
}

body.vas-calm .programme-card--volunteer {
	background: var(--paper-2);
}

body.vas-calm .programme-card .button {
	align-self: flex-start;
}

/* Project cards ----------------------------------------------------------- */
body.vas-calm .project-card__media {
	min-height: 170px;
}

body.vas-calm .project-card__body {
	padding: 1.1rem 1.1rem 1.25rem;
}

body.vas-calm .project-card__body h3 {
	font-size: clamp(1.45rem, 2vw, 1.9rem);
}

/* Testimonial: readable, not display-scale ------------------------------- */
body.vas-calm .testimonial__quote {
	max-width: 32ch;
	font-size: clamp(1.8rem, 2.8vw, 2.7rem);
	line-height: 1.1;
	letter-spacing: -0.02em;
}

body.vas-calm .testimonial__portrait {
	border-width: 1px;
	border-color: var(--line);
}

/* CTA: light panel instead of a dark photo block ------------------------- */
body.vas-calm .section--cta {
	background: var(--paper-2);
	color: var(--ink);
}

body.vas-calm .section--cta::before {
	display: none;
}

body.vas-calm .section--cta .eyebrow {
	color: var(--lime);
}

body.vas-calm .cta h2 {
	color: var(--ink);
	font-size: clamp(2rem, 3vw, 3rem);
}

body.vas-calm .cta h2 em {
	color: var(--lime);
}

body.vas-calm .cta p {
	color: var(--ink-3);
}

body.vas-calm .button--light {
	border-color: var(--ink);
	background: var(--ink);
	color: var(--paper);
}

/* Project detail ---------------------------------------------------------- */
body.vas-calm .project-hero {
	padding: clamp(2.4rem, 4vw, 3.8rem) 0 clamp(2rem, 3vw, 3rem);
}

body.vas-calm .project-hero h1 {
	font-size: clamp(2.8rem, 4.5vw, 4.2rem);
	line-height: 1;
}

body.vas-calm .project-body {
	padding: clamp(1.8rem, 3vw, 3rem) 0;
}

body.vas-calm .project-body .prose h2 {
	margin-top: 2rem;
	font-size: clamp(1.7rem, 2.2vw, 2.3rem);
}

body.vas-calm .project-aside__card {
	background: var(--paper-2);
	color: var(--ink);
	border: 1px solid var(--line);
}

body.vas-calm .project-aside__card .eyebrow {
	color: var(--lime);
}

body.vas-calm .project-aside__card .project-aside__text,
body.vas-calm .project-aside__card dt,
body.vas-calm .project-aside__card dd {
	color: var(--ink);
}

body.vas-calm .project-aside__card dl > div {
	border-color: var(--line);
}

/* Footer: keep it compact ------------------------------------------------- */
body.vas-calm .site-footer {
	padding-top: clamp(2.5rem, 4vw, 4rem);
}

body.vas-calm .footer-brand__mark {
	width: 38px;
	height: 38px;
}

body.vas-calm .footer-brand__name {
	font-size: clamp(1.8rem, 2.3vw, 2.5rem);
}

@media (max-width: 900px) {
	body.vas-calm .hero__inner,
	body.vas-calm .page-hero__inner {
		grid-template-columns: 1fr;
	}

	body.vas-calm .hero__visual {
		height: clamp(300px, 58vw, 440px);
	}

	body.vas-calm .hero__copy h1 {
		font-size: clamp(2.6rem, 9vw, 4.1rem);
	}
}

@media (max-width: 640px) {
	body.vas-calm .section {
		padding: 2.5rem 0;
	}

	body.vas-calm .hero {
		padding: 2rem 0 2.4rem;
	}

	body.vas-calm .hero__copy h1 {
		font-size: clamp(2.35rem, 11vw, 3.4rem);
	}

	body.vas-calm .page-hero h1 {
		font-size: clamp(2.2rem, 10vw, 3.2rem);
	}

	body.vas-calm .section-head h2 {
		font-size: clamp(1.8rem, 8vw, 2.4rem);
	}

	body.vas-calm .stat__value {
		font-size: 2rem;
	}

	body.vas-calm .stat {
		padding: 1.1rem 0.6rem 1.2rem;
	}

	body.vas-calm .testimonial__quote {
		font-size: clamp(1.6rem, 7vw, 2.2rem);
	}
}

/* Calm v3 refinements: remove the remaining dark/photo slabs. */
body.vas-calm .hero__copy h1 {
	font-size: clamp(2.7rem, 4.5vw, 4.5rem);
	max-width: 13ch;
}

body.vas-calm .program-card {
	min-height: 240px;
	padding: 1.5rem;
	border: 1px solid var(--line);
	background: var(--paper-2);
	color: var(--ink);
}

body.vas-calm .program-card::before,
body.vas-calm .program-card::after {
	display: none;
}

body.vas-calm .program-card__number {
	color: var(--lime);
}

body.vas-calm .program-card h3 {
	max-width: 16ch;
	margin-top: auto;
	padding-top: 3rem;
	color: var(--ink);
	font-size: clamp(1.8rem, 2.6vw, 2.7rem);
	line-height: 1;
}

body.vas-calm .program-card p {
	color: var(--muted);
}

body.vas-calm .program-card .text-link {
	color: var(--ink);
}

body.vas-calm .section--mission {
	background: var(--paper-2);
	color: var(--ink);
}

body.vas-calm .section--mission .eyebrow {
	color: var(--lime);
}

body.vas-calm .mission-intro h2 {
	color: var(--ink);
}

body.vas-calm .mission-intro h2 em {
	color: var(--lime);
}

body.vas-calm .mission-intro p,
body.vas-calm .mission-copy p {
	color: var(--ink-3);
}

body.vas-calm .mission-copy > div {
	border-color: var(--line);
}

body.vas-calm .mission-copy h3 {
	color: var(--lime);
}

body.vas-calm .section--testimonial {
	background: var(--paper-2);
	color: var(--ink);
}

body.vas-calm .section--testimonial .eyebrow {
	color: var(--lime);
}

body.vas-calm .section--testimonial .eyebrow::before {
	background: var(--gold);
}

body.vas-calm .testimonial__quote {
	color: var(--ink);
}

body.vas-calm .testimonial blockquote footer {
	color: var(--ink-3);
}