/* Art Studio Azur ACADÉMIE — native programme presentation (/academie/).
   Scoped to .aca so nothing leaks into Ashade or the rest of the site.
   Dark version: every section is transparent so Ashade's own page
   background (black + top-left spotlight up to #28282e) shows through. Palette (WCAG AA checked, worst case listed):
     text #f2efe8 ≥ 11.3:1 · muted #c3c9ce ≥ 7.7:1 · terra #e0906c ≥ 5.2:1
     azure #5fb7c9 ≥ 5.6:1 · gold #d9b26a ≥ 6.5:1 (on charcoal, cards
     #18181b, spotlight #28282e, navy #0f2533 and navy-2 #16344a)
   Accent buttons use dark text #15181c (≥ 7.1:1). */

.aca {
	--aca-navy: #0f2533;
	--aca-navy-2: #16344a;
	--aca-bg: transparent;
	--aca-ivory: #f2efe8;
	--aca-ivory-2: rgba(255, 255, 255, 0.025);
	--aca-paper: #18181b;
	--aca-line: rgba(255, 255, 255, 0.08);
	--aca-ink: #f2efe8;
	--aca-on-accent: #15181c;
	--aca-muted: #c3c9ce;
	--aca-muted-dark: #c3c9ce;
	--aca-gold: #d9b26a;
	--aca-terra: #e0906c;
	--aca-petrol: #5fb7c9;
	--aca-azure: #5fb7c9;
	--aca-accent: var(--aca-terra);
	--aca-accent-on-dark: var(--aca-gold);
	--aca-serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
	--aca-radius: 14px;
	--aca-gutter: clamp(1rem, 4vw, 2.5rem);

	background: var(--aca-bg);
	color: var(--aca-ink);
	line-height: 1.6;
	overflow-x: clip;
}

.aca *,
.aca *::before,
.aca *::after {
	box-sizing: border-box;
}

/* Neutralise inherited theme typography/list styles inside the section. */
.aca h1,
.aca h2,
.aca h3,
.aca h4,
.aca p,
.aca ul,
.aca ol,
.aca figure {
	margin: 0;
	padding: 0;
	letter-spacing: normal;
	text-transform: none;
}

.aca ul,
.aca ol {
	list-style: none;
}

/* Ashade is a dark theme and colours headings itself; inside the
   Académie headings always follow their section's text colour. */
.aca h1,
.aca h2,
.aca h3,
.aca h4 {
	color: inherit !important;
	font-family: var(--aca-serif) !important;
}

.aca-tomes,
.aca-programme,
.aca-level:not(.aca-level--advanced),
.aca-downloads {
	color: var(--aca-ink);
}

.aca li::before {
	content: none;
}

.aca img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* Fixed-ratio frames: the frame owns the aspect ratio and the photo fills
   it (absolute + cover), so crops stay identical whatever the source
   ratio (21:9 heroes vs 3:2 photos). */
.aca-hero__media,
.aca-tome__media,
.aca-programme__media,
.aca-level__media {
	position: relative;
	overflow: hidden;
}

.aca-hero__media img,
.aca-tome__media img,
.aca-programme__media img,
.aca-level__media img {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	max-width: none;
	object-fit: cover;
}

/* Keep the logo baked into the right side of the Vidéo hero photo out
   of the card crop. */
.aca-tome--video .aca-tome__img {
	object-position: 12% 50%;
}

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

.aca-wrap {
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 var(--aca-gutter);
}

.aca-section {
	padding: clamp(3.5rem, 8vw, 6.5rem) 0;
}

.aca-section__title {
	font-family: var(--aca-serif);
	font-size: clamp(1.6rem, 3vw, 2.3rem);
	line-height: 1.2;
	font-weight: 600;
	margin-bottom: 2rem !important;
}

/* Kickers */
.aca-kicker {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: var(--aca-gold);
	margin-bottom: 1.1rem !important;
}

.aca-kicker--accent {
	color: var(--aca-accent);
}

/* Buttons — 44px minimum touch target */
.aca-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem;
}

.aca-btn {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	min-height: 44px;
	padding: 0.8rem 1.5rem;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.25;
	text-align: center;
	text-decoration: none !important;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.aca-btn:hover {
	transform: translateY(-1px);
}

/* Themes style a:focus with high specificity (Twenty Twenty-One sets a
   transparent outline); keyboard focus must stay visible here. */
.aca-btn:focus-visible,
.aca a:focus-visible {
	outline: 3px solid var(--aca-gold) !important;
	outline-offset: 3px !important;
}

/* Card/section focus ring in the text colour (high contrast on charcoal
   and on the cards); gold stays for the navy bands. */
.aca-tomes a:focus-visible,
.aca-programme .aca-level:not(.aca-level--advanced) a:focus-visible,
.aca-results a:focus-visible,
.aca-downloads a:focus-visible {
	outline-color: var(--aca-ink) !important;
}

.aca-btn--gold {
	background: var(--aca-gold);
	color: var(--aca-navy) !important;
}

.aca-btn--gold:hover {
	background: #e6c587;
}

.aca-btn--line {
	border-color: rgba(248, 243, 234, 0.6);
	color: var(--aca-ivory) !important;
}

.aca-btn--line:hover {
	border-color: var(--aca-ivory);
	background: rgba(248, 243, 234, 0.08);
}

.aca-btn--terra {
	background: var(--aca-terra);
	color: var(--aca-on-accent) !important;
}

.aca-btn--terra:hover {
	background: #eaa585;
}

.aca-btn--petrol {
	background: var(--aca-petrol);
	color: var(--aca-on-accent) !important;
}

.aca-btn--petrol:hover {
	background: #7cc6d5;
}

.aca-btn--ink {
	border-color: var(--aca-ink);
	color: var(--aca-ink) !important;
}

.aca-btn--ink:hover {
	background: var(--aca-ink);
	color: var(--aca-on-accent) !important;
}

.aca-btn__meta {
	display: block;
	margin-top: 0.15rem;
	font-size: 0.75rem;
	font-weight: 500;
	opacity: 0.85;
}

/* ---------------------------------------------------------------- Hero */
.aca-hero {
	background: var(--aca-bg);
	color: var(--aca-ivory);
}

.aca-hero__text {
	padding-top: clamp(3.5rem, 9vw, 7rem);
	padding-bottom: clamp(2.5rem, 6vw, 4.5rem);
}

.aca-hero__title {
	max-width: 21ch;
	font-family: var(--aca-serif);
	font-size: clamp(2.1rem, 5vw, 4rem);
	font-weight: 600;
	line-height: 1.08;
	color: var(--aca-ivory) !important;
	margin-bottom: 1.5rem !important;
	overflow-wrap: break-word;
}

.aca-hero__intro {
	max-width: 46rem;
	font-size: clamp(1.02rem, 1.6vw, 1.2rem);
	color: var(--aca-muted-dark);
	margin-bottom: 2.2rem !important;
}

.aca-trust {
	margin-top: 2.4rem !important;
	padding-top: 1.4rem !important;
	border-top: 1px solid rgba(217, 178, 106, 0.35);
	font-size: 0.85rem;
	line-height: 2;
	letter-spacing: 0.04em;
	word-spacing: 0.35em;
	color: var(--aca-gold);
}

/* Items never break mid-phrase; the "·" separators stay gold. */
.aca-trust span {
	white-space: nowrap;
	word-spacing: normal;
	color: var(--aca-muted-dark);
}

/* Always full width; height follows the 1800×772 photo but never exceeds
   78vh (aspect-ratio + max-height would shrink the width on very wide or
   short screens, leaving an empty band on the right). */
.aca-hero__media {
	width: 100%;
	height: min(78vh, 42.9vw);
}

/* ---------------------------------------------------------- Tome cards */
.aca-tomes {
	background: var(--aca-bg);
}

.aca-tomes__grid {
	display: grid;
	gap: clamp(1.25rem, 3vw, 2rem);
}

.aca-tome {
	display: flex;
	flex-direction: column;
	background: var(--aca-paper);
	border-radius: var(--aca-radius);
	overflow: hidden;
	box-shadow: 0 1px 0 rgba(15, 37, 51, 0.06), 0 18px 40px -28px rgba(15, 37, 51, 0.45);
}

.aca-tome__media {
	aspect-ratio: 3 / 2;
}

.aca-tome__img {
	transition: transform 0.6s ease;
}

.aca-tome:hover .aca-tome__img {
	transform: scale(1.03);
}

.aca-tome__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.8rem;
	flex: 1;
	padding: clamp(1.4rem, 3vw, 2.2rem);
	border-top: 4px solid var(--aca-terra);
}

.aca-tome--video .aca-tome__body {
	border-top-color: var(--aca-petrol);
}

.aca-tome__kicker {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: var(--aca-terra);
}

.aca-tome--video .aca-tome__kicker {
	color: var(--aca-petrol);
}

.aca-tome__title {
	font-family: var(--aca-serif);
	font-size: clamp(1.4rem, 2.6vw, 1.9rem);
	line-height: 1.2;
	font-weight: 600;
	color: var(--aca-ink);
}

.aca-tome__stats {
	color: var(--aca-muted);
	margin-bottom: 0.6rem !important;
}

.aca-tome .aca-btn {
	margin-top: auto;
}

/* ----------------------------------------------------------- Programme */
.aca-programme {
	padding-top: clamp(3.5rem, 8vw, 6.5rem);
	background: var(--aca-bg);
	scroll-margin-top: 80px;
}

.aca-programme--video {
	--aca-accent: var(--aca-petrol);
	--aca-accent-on-dark: var(--aca-azure);
	border-top: 1px solid var(--aca-line);
}

.aca-programme__intro {
	display: grid;
	gap: clamp(1.75rem, 4vw, 3.5rem);
	align-items: center;
	margin-bottom: clamp(3rem, 6vw, 4.5rem);
}

.aca-programme__title {
	font-family: var(--aca-serif);
	font-size: clamp(2rem, 4.4vw, 3.3rem);
	line-height: 1.1;
	font-weight: 600;
	color: var(--aca-ink);
	margin-bottom: 0.6rem !important;
}

.aca-programme__subtitle {
	font-family: var(--aca-serif);
	font-size: clamp(1.15rem, 2vw, 1.45rem);
	font-style: italic;
	color: var(--aca-accent);
	margin-bottom: 1.4rem !important;
}

.aca-programme__promise {
	font-size: 1.08rem;
	max-width: 36rem;
	margin-bottom: 1.4rem !important;
}

.aca-programme__stats {
	display: inline-block;
	padding: 0.55rem 1.1rem !important;
	border-radius: 999px;
	background: var(--aca-navy);
	color: var(--aca-ivory);
	font-size: 0.88rem;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.aca-programme__media,
.aca-level__media {
	border-radius: var(--aca-radius);
}

.aca-programme__media {
	aspect-ratio: 3 / 2;
}

/* Levels + stage path */
.aca-level {
	padding: clamp(2.75rem, 6vw, 4.5rem) 0;
	background: var(--aca-bg);
}

.aca-level--advanced {
	background: var(--aca-bg);
	color: var(--aca-ivory);
}

.aca-level__head {
	display: grid;
	gap: 0.3rem;
	margin-bottom: clamp(1.75rem, 4vw, 2.75rem);
}

.aca-level__label {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase !important;
	color: var(--aca-accent);
}

.aca-level--advanced .aca-level__label {
	color: var(--aca-gold);
}

.aca-level__name {
	font-family: var(--aca-serif);
	font-size: clamp(1.7rem, 3.4vw, 2.5rem);
	line-height: 1.15;
	font-weight: 600;
	color: inherit !important;
}

.aca-level__meta {
	font-weight: 600;
	color: var(--aca-muted);
}

.aca-level--advanced .aca-level__meta {
	color: var(--aca-muted-dark);
}

.aca-path {
	display: grid;
	gap: 1rem;
	counter-reset: none;
}

.aca-stage {
	position: relative;
	padding: 1.4rem 1.4rem 1.5rem;
	background: var(--aca-paper);
	border-radius: var(--aca-radius);
	border: 1px solid var(--aca-line);
}

.aca-level--advanced .aca-stage {
	background: var(--aca-navy-2);
	border-color: rgba(248, 243, 234, 0.08);
}

.aca-stage__num {
	font-family: var(--aca-serif);
	font-size: 1.9rem;
	font-weight: 700;
	line-height: 1;
	color: var(--aca-accent);
	margin-bottom: 0.7rem !important;
}

.aca-level--advanced .aca-stage__num {
	color: var(--aca-accent-on-dark);
}

.aca-stage__title {
	font-family: var(--aca-serif);
	font-size: 1.18rem;
	line-height: 1.25;
	font-weight: 600;
	color: inherit !important;
	margin-bottom: 0.9rem !important;
}

.aca-stage__modules {
	display: grid;
	gap: 0.55rem;
	font-size: 0.93rem;
	line-height: 1.45;
}

.aca-stage__modules li {
	display: grid;
	grid-template-columns: 1.9rem 1fr;
	align-items: baseline;
}

.aca-stage__mno {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--aca-muted);
}

.aca-level--advanced .aca-stage__mno {
	color: var(--aca-gold);
}

.aca-level__media {
	margin-top: clamp(1.75rem, 4vw, 2.75rem) !important;
	aspect-ratio: 21 / 9;
}

/* Results */
.aca-results {
	padding-top: clamp(3rem, 6vw, 4.5rem);
	padding-bottom: clamp(3.5rem, 8vw, 6rem);
}

.aca-results__title {
	font-family: var(--aca-serif);
	font-size: clamp(1.6rem, 3vw, 2.2rem);
	font-weight: 600;
	color: var(--aca-ink);
	margin-bottom: 1.75rem !important;
}

.aca-results__grid {
	display: grid;
	gap: 1rem;
	margin-bottom: 2.25rem !important;
}

.aca-result {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.9rem;
	align-items: start;
	padding: 1.25rem 1.3rem;
	background: var(--aca-paper);
	border-radius: var(--aca-radius);
	border-left: 3px solid var(--aca-accent);
}

.aca-result__num {
	font-family: var(--aca-serif);
	font-weight: 700;
	color: var(--aca-accent);
}

.aca-result p {
	font-size: 0.97rem;
	line-height: 1.5;
}

.aca-result strong {
	color: var(--aca-ink);
}

/* ----------------------------------------------------------- Downloads */
.aca-downloads {
	background: var(--aca-ivory-2);
}

.aca-downloads__grid {
	display: grid;
	gap: 1.25rem;
}

.aca-download__link {
	display: grid;
	grid-template-columns: minmax(88px, 128px) 1fr;
	gap: 1.25rem;
	align-items: center;
	padding: 1rem;
	min-height: 44px;
	background: var(--aca-paper);
	border-radius: var(--aca-radius);
	color: var(--aca-ink) !important;
	text-decoration: none !important;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.aca-download__link:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 36px -26px rgba(15, 37, 51, 0.55);
}

.aca-download__cover {
	border-radius: 6px;
	box-shadow: 0 6px 18px -8px rgba(15, 37, 51, 0.5);
}

.aca-download__name {
	display: block;
	font-family: var(--aca-serif);
	font-size: 1.15rem;
	font-weight: 600;
	line-height: 1.3;
	margin-bottom: 0.35rem;
}

.aca-download__meta {
	display: block;
	font-size: 0.85rem;
	color: var(--aca-muted);
}

/* ---------------------------------------------------------- Admissions */
.aca-admissions {
	background: var(--aca-bg);
	color: var(--aca-ivory);
	scroll-margin-top: 80px;
}

.aca-admissions__inner {
	max-width: 980px;
	padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1.25rem, 5vw, 4rem) !important;
	background: var(--aca-navy);
	border-radius: calc(var(--aca-radius) * 1.5);
	text-align: center;
}

.aca-admissions__title {
	font-family: var(--aca-serif);
	font-size: clamp(1.8rem, 4vw, 3rem);
	line-height: 1.15;
	font-weight: 600;
	color: var(--aca-ivory) !important;
	margin-bottom: 1.25rem !important;
}

.aca-admissions__text {
	max-width: 42rem;
	margin: 0 auto 1.5rem !important;
	font-size: 1.05rem;
	color: var(--aca-muted-dark);
}

.aca-admissions__dates {
	display: inline-block;
	margin-bottom: 1.75rem !important;
	padding: 0.6rem 1.1rem !important;
	border: 1px solid rgba(217, 178, 106, 0.5);
	border-radius: 999px;
	color: var(--aca-gold);
	font-weight: 600;
}

.aca-admissions .aca-actions {
	justify-content: center;
	margin-bottom: 2.25rem;
}

.aca-admissions__legal {
	font-size: 0.85rem;
	color: var(--aca-muted-dark);
}

/* Anchor targets clear Ashade's fixed header */
.aca [id] {
	scroll-margin-top: 80px;
}

/* --------------------------------------------------------- Breakpoints */
@media (min-width: 640px) {
	.aca-results__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.aca-path {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 768px) {
	.aca-downloads__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 900px) {
	.aca-tomes__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.aca-programme__intro {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
	.aca-programme--video .aca-programme__heading {
		order: 2;
	}
}

@media (min-width: 1024px) {
	.aca-results__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.aca-level__head {
		grid-template-columns: auto 1fr auto;
		align-items: end;
		gap: 0 1.5rem;
	}
	.aca-level__label {
		grid-column: 1 / -1;
	}
}

/* Four-stage timeline: one row with a connecting line on wide screens. */
@media (min-width: 1100px) {
	.aca-path {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		position: relative;
	}
	.aca-path::before {
		content: "";
		position: absolute;
		top: 2.35rem;
		left: 1.4rem;
		right: 1.4rem;
		height: 1px;
		background: currentColor;
		opacity: 0.15;
	}
	.aca-stage__num {
		position: relative;
		display: inline-block;
		padding-right: 0.6rem;
		background: inherit;
	}
}

@media (max-width: 480px) {
	.aca-actions .aca-btn {
		width: 100%;
	}
	.aca-trust {
		font-size: 0.8rem;
	}
	.aca-hero__media {
		height: 75vw; /* 4:3 */
	}
	/* 4:3 crop of the 21:9 photo: frame the people, never half of the
	   logo baked into the left of the image (visible area 30%–87%). */
	.aca-hero__media img {
		object-position: 70% 50%;
	}
	.aca-download__link {
		grid-template-columns: 80px 1fr;
		gap: 1rem;
	}
}

/* ------------------------------------------------------------ Motion */
/* Content is fully visible without JS; academy-landing.js adds .aca-js
   (only when motion is allowed) to enable the subtle reveal. */
.aca-js .aca-reveal {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.aca-js .aca-reveal.is-visible {
	opacity: 1;
	transform: none;
}

.aca-js .aca-programme__media img,
.aca-js .aca-level__media img {
	transform: scale(1.04);
	transition: transform 1.2s ease;
}

.aca-js .is-visible.aca-programme__media img,
.aca-js .is-visible.aca-level__media img {
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.aca *,
	.aca *::before,
	.aca *::after {
		transition: none !important;
		animation: none !important;
	}
	.aca .aca-reveal,
	.aca img {
		opacity: 1 !important;
		transform: none !important;
	}
	.aca-btn:hover,
	.aca-download__link:hover,
	.aca-tome:hover .aca-tome__img {
		transform: none;
	}
}
