/* ATV skin for the guided section blocks (structure lives in atv-core/assets/css/blocks.css). */

/* Bands */
.atv-split {
	padding-block: var(--spacing-layout-l);
}

.atv-section--compact {
	padding-block: var(--spacing-layout-m);
}

/* Two compact white bands in a row (e.g. a documents list then a CTA) read as one band: no doubled gap — also when
   the second one is a template band right after the post content (a form after the page's last band). */
.atv-section--compact.atv-section--bg-white + .atv-section--compact.atv-section--bg-white,
.wp-block-post-content:has(> .atv-section--compact.atv-section--bg-white:last-child) + .atv-section--compact.atv-section--bg-white {
	padding-block-start: 0;
}

/* Two bands in a row with the same background get a hairline between them, so they never read as one band
   (except the compact white pairs above, which are meant to merge). */
:is(.atv-section, .atv-split).atv-section--bg-tint + :is(.atv-section--bg-tint, .atv-split--bg-tint),
.atv-split--bg-tint + :is(.atv-section--bg-tint, .atv-split--bg-tint),
:is(.atv-section--bg-white, .atv-split--bg-white) + .atv-split--bg-white,
.atv-split--bg-white + .atv-section--bg-white,
.atv-section--bg-white:not(.atv-section--compact) + .atv-section--bg-white,
.atv-section--bg-white + .atv-section--bg-white:not(.atv-section--compact),
:is(.atv-section--bg-navy, .atv-split--bg-navy) + :is(.atv-section--bg-navy, .atv-split--bg-navy) {
	border-block-start: 1px solid color-mix(in srgb, var(--atv-navy) 15%, transparent);
}

:is(.atv-section--bg-navy, .atv-split--bg-navy) + :is(.atv-section--bg-navy, .atv-split--bg-navy) {
	border-block-start-color: color-mix(in srgb, var(--color-white) 20%, transparent);
}

.atv-split--bg-tint,
.atv-section--bg-tint {
	background: var(--wp--preset--color--atv-green-light);
}

.atv-split--bg-white,
.atv-section--bg-white {
	background: var(--wp--preset--color--atv-white);
}

.atv-split--bg-navy,
.atv-section--bg-navy {
	background: var(--atv-navy);
	color: var(--color-white);
}

.atv-split--bg-tint,
.atv-split--bg-white,
.atv-section--bg-tint,
.atv-section--bg-white {
	color: var(--atv-navy);
}

/* Headings and lists inherit the band colour; on navy the eyebrow is lima pálido (DS contrast pair, 8.5:1). */
.atv-split--bg-navy :is(h1, h2, h3, h4),
.atv-section--bg-navy :is(h1, h2, h3, h4) {
	color: inherit;
}

.atv-split--bg-navy .is-style-atv-eyebrow,
.atv-section--bg-navy .is-style-atv-eyebrow {
	color: var(--atv-green-tint);
}

/* Text links on navy go white; buttons and the white cards (and everything inside them) keep their own colours.
   This outranks the prose link rule `:where(.entry-content) a:not([class])` (0,1,1) in components.css. */
:is(.atv-split.atv-split--bg-navy, .atv-section.atv-section--bg-navy) a:not(.wp-block-button__link, .hds-button, .atv-card, .hds-card, :is(.atv-card, .hds-card, .atv-offer-card) a) {
	color: var(--color-white);
}

/* Focus on navy: lima (DS: focus-dark is the lima ring for dark contexts). */
.atv-split--bg-navy :focus-visible,
.atv-section--bg-navy :focus-visible {
	outline-color: var(--atv-focus-dark);
}

/* ...but inside a white card the ring goes back to the light-surface colour (same specificity, later wins). */
:is(.atv-card, .hds-card, .atv-offer-card) :focus-visible,
:is(.atv-card, .hds-card, .atv-offer-card):focus-visible {
	outline-color: var(--atv-focus-light);
}

/* Split content: big uppercase heading like the section titles, lead-sized text */
.atv-split__content .wp-block-heading {
	margin: 0 0 var(--spacing-m);
	font-family: var(--font-heading);
	font-weight: 800;
	/* Capped by the viewport on phones so the longest uppercase word fits (headings never break mid-word). */
	font-size: min(var(--wp--preset--font-size--h-1), 9vw);
	line-height: 1.05;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	text-wrap: balance;
	color: inherit;
}

.atv-split__content > p:not([class]) {
	margin: 0 0 var(--spacing-m);
	font-size: var(--wp--preset--font-size--body-l);
	line-height: 1.6;
	max-width: 36rem;
}

.atv-split__content .is-style-atv-check li {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--body-l);
	color: inherit;
}

.atv-split__content .wp-block-buttons {
	margin-top: var(--spacing-l);
}

/* Photo */
.atv-split__img {
	border-radius: var(--atv-radius-m);
}

/* Offer card */
.atv-offer-card {
	box-sizing: border-box;
	padding: var(--spacing-m);
	background: var(--wp--preset--color--atv-white);
	border-radius: var(--atv-radius-m);
	color: var(--atv-navy);
	box-shadow: 0 0.5rem 1.5rem color-mix(in srgb, var(--atv-scrim) 18%, transparent);
}

.atv-offer-card a:not(.wp-block-button__link) {
	color: var(--atv-green-text);
}

.atv-offer-card__label {
	margin: 0;
	font-family: var(--font-heading);
	font-size: var(--wp--preset--font-size--body);
}

.atv-offer-card__value {
	margin: 0 0 var(--spacing-s);
	font-family: var(--font-heading);
	font-weight: 800;
	font-size: var(--wp--preset--font-size--h-2);
	line-height: 1.1;
	letter-spacing: -0.02em;
}

.atv-offer-card__actions .wp-block-button,
.atv-offer-card__actions .wp-block-button__link {
	width: 100%;
	box-sizing: border-box;
	text-align: center;
}

.atv-offer-card__social {
	display: flex;
	align-items: center;
	gap: var(--spacing-xs);
	margin: var(--spacing-s) 0 0;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--small);
}

.atv-offer-card__avatar {
	border: 2px solid var(--wp--preset--color--atv-white);
}

@media (forced-colors: active) {
	.atv-offer-card {
		border: 1px solid CanvasText;
	}
}

/* Destaques rápidos */
/* Key facts in a band without a photo sit on the text measure (same width as the paragraphs), not the 1200px grid:
   4 facts → 2 × 2 within the measure. */
:is(.atv-section, .atv-split--no-media) .atv-key-facts { max-width: var(--wp--custom--measure--prose, 65ch); }
.atv-key-facts__item { border-inline-start: 3px solid var(--atv-green-text); padding-inline-start: var(--spacing-s); }
.atv-key-facts__label { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--atv-muted); }
.atv-key-facts__value { font-family: var(--font-heading); font-weight: 700; font-size: var(--wp--preset--font-size--body-l); }
:is(.atv-split--bg-navy, .atv-section--bg-navy) .atv-key-facts__item { border-color: var(--atv-green-light); }
:is(.atv-split--bg-navy, .atv-section--bg-navy) .atv-key-facts__label { color: inherit; opacity: .85; }

/* Modalidade */
.atv-program { background: var(--wp--preset--color--atv-white); border: 1px solid var(--wp--preset--color--atv-line); border-radius: var(--atv-radius-m); color: var(--wp--preset--color--atv-navy); }
.atv-program__title { margin: 0; font-size: var(--wp--preset--font-size--h-4, var(--wp--preset--font-size--body-l)); }
.atv-program__badge { align-self: flex-start; margin: 0; padding: 0.15em 0.6em; border-radius: var(--atv-radius-s); background: var(--atv-green-tint); color: var(--atv-green-ink); font-size: var(--wp--preset--font-size--small); font-weight: 700; }
.atv-program__days { font-weight: 700; }
.atv-program__tbc { margin: 0; font-style: italic; color: var(--wp--preset--color--atv-muted); }
.atv-program__meta dt { font-weight: 700; }
.atv-program__meta dt::after { content: ":"; }

/* Equipa */
.atv-team-member__avatar { background: var(--atv-green-tint); color: var(--atv-green-ink); font-family: var(--font-heading); font-weight: 700; font-size: var(--wp--preset--font-size--body-l); }
.atv-team-member__name { font-size: var(--wp--preset--font-size--body-l); }
.atv-team-member__role { color: var(--atv-green-text); font-weight: 700; font-size: var(--wp--preset--font-size--small); }
:is(.atv-split--bg-navy, .atv-section--bg-navy) .atv-team-member__role { color: var(--atv-green-light); }
.atv-team__empty { font-style: italic; }

/* Galeria "ATV: mosaico": first image 2×2, 2 columns on phones, 3 from 768px, rounded corners.
   Any count from 2 to 7 (and beyond) ends on a full row: the leftover image(s) widen into a strip instead of leaving
   empty cells. With the 2×2 first image, n images fill n + 3 cells. */
.wp-block-gallery.is-style-atv-mosaic.has-nested-images { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--spacing-xs); }
@media (min-width: 768px) { .wp-block-gallery.is-style-atv-mosaic.has-nested-images { grid-template-columns: repeat(3, 1fr); } }
.wp-block-gallery.is-style-atv-mosaic.has-nested-images figure.wp-block-image { width: auto !important; margin: 0; aspect-ratio: 1; }
.wp-block-gallery.is-style-atv-mosaic.has-nested-images figure.wp-block-image:first-child { grid-column: span 2; grid-row: span 2; }
.wp-block-gallery.is-style-atv-mosaic figure.wp-block-image img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--atv-radius-m); }
/* 2 columns: an even count leaves one cell → the last image spans the row. */
.wp-block-gallery.is-style-atv-mosaic.has-nested-images figure.wp-block-image:last-child:nth-child(even) { grid-column: span 2; aspect-ratio: 2 / 1; }
@media (min-width: 768px) {
	.wp-block-gallery.is-style-atv-mosaic.has-nested-images figure.wp-block-image:last-child:nth-child(even) { grid-column: auto; aspect-ratio: 1; }
	/* 3 columns: n = 3k+1 (4, 7) → the last image spans the row; n = 3k+2 (5) → it spans 2. */
	.wp-block-gallery.is-style-atv-mosaic.has-nested-images figure.wp-block-image:last-child:nth-child(3n+1):not(:first-child) { grid-column: span 3; aspect-ratio: 3 / 1; }
	.wp-block-gallery.is-style-atv-mosaic.has-nested-images figure.wp-block-image:last-child:nth-child(3n+2) { grid-column: span 2; aspect-ratio: 2 / 1; }
}
/* Exactly 2 images: two equal squares, no 2×2 lead (it would leave a column of empty cells). */
.wp-block-gallery.is-style-atv-mosaic.has-nested-images:has(> figure:nth-child(2):last-child) { grid-template-columns: repeat(2, 1fr); }
.wp-block-gallery.is-style-atv-mosaic.has-nested-images:has(> figure:nth-child(2):last-child) figure.wp-block-image { grid-column: auto; grid-row: auto; aspect-ratio: 1; }

/* Detalhes "ATV: pergunta" */
.wp-block-details.is-style-atv-faq { border-bottom: 1px solid var(--wp--preset--color--atv-line); padding-block: var(--spacing-s); }
.wp-block-details.is-style-atv-faq > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: var(--spacing-s); font-family: var(--font-heading); font-weight: 700; font-size: var(--wp--preset--font-size--body-l); }
.wp-block-details.is-style-atv-faq > summary::-webkit-details-marker { display: none; }
.wp-block-details.is-style-atv-faq > summary::after { content: ""; flex: none; width: 0.6em; height: 0.6em; margin-top: 0.3em; border-inline-end: 3px solid var(--atv-green-text); border-bottom: 3px solid var(--atv-green-text); transform: rotate(45deg); transition: transform var(--atv-motion-fast); }
.wp-block-details.is-style-atv-faq[open] > summary::after { transform: rotate(-135deg); }
.wp-block-details.is-style-atv-faq > summary:focus-visible { outline: 3px solid var(--atv-focus-light); outline-offset: 4px; }
:is(.atv-split--bg-navy, .atv-section--bg-navy) .wp-block-details.is-style-atv-faq > summary:focus-visible { outline-color: var(--atv-focus-dark); }
@media (prefers-reduced-motion: reduce) { .wp-block-details.is-style-atv-faq > summary::after { transition: none; } }
@media (forced-colors: active) { .wp-block-details.is-style-atv-faq > summary::after { border-color: CanvasText; } }

/* Closing CTA band (pattern atv/section-cta-contact): one sentence and a button, side by side from tablets up. */
.atv-cta-band > .hds-container {
	display: grid;
	gap: var(--spacing-m);
	align-items: center;
}

@media (min-width: 768px) {
	.atv-cta-band > .hds-container {
		grid-template-columns: 1fr auto;
		gap: var(--spacing-l);
	}
}

.atv-cta-band .atv-cta-band__text {
	margin: 0;
	max-width: 40rem;
	font-family: var(--font-heading);
	font-size: var(--wp--preset--font-size--h-3);
	font-weight: 800;
	line-height: 1.2;
	text-wrap: balance;
}

.atv-cta-band .atv-cta-band__actions {
	margin: 0;
}