/*
 * 40-pages.css — page-specific fixes (Part 2, Section 2 "Pages", Tasks 20–29).
 * Every rule is scoped by body.page-id-<id> or an Elementor element class. Values come from the --ric-* tokens in
 * 00-tokens.css; every var() carries a fallback. !important is used only to beat an Elementor inline/#id rule, and
 * says so in a comment. Each task appends one block: "---- Task N · <issue> · <what> ----".
 */

/* ---- Task 20 · P-13 · one 1280px content column on pages Elementor does not render, and on the Home closing band ---- */
/* Hello caps .site-main at 600/800/1140px on non-Elementor pages (Privacy Policy); use the Elementor column instead. */
@media (min-width: 768px) {
	body.page:not([class*="elementor-page-"]) .site-main {
		max-width: calc(var(--ric-content-max, 1280px) + 2 * var(--ric-space-5, 24px));
		padding-inline: var(--ric-space-5, 24px);
	}

	body.page:not([class*="elementor-page-"]) .page-header .entry-title {
		max-width: none;
		padding-inline: 0;
	}
}

/* The Home closing band (call-to-action 75162cba) stays full-bleed; its text starts on the 1280px column. */
@media (min-width: 1025px) {
	body.page-id-414 .elementor-element-75162cba .elementor-cta__content {
		padding-inline: max(var(--ric-space-5, 24px), calc((100% - var(--ric-content-max, 1280px)) / 2));
	}
}

/* ---- Task 21 · P-25 · Home feature cards: buttons share one baseline; one column up to 820px ---- */
body.page-id-414 .elementor-element:is(.elementor-element-18a42418, .elementor-element-15f0e743, .elementor-element-1609e2bd) > .elementor-widget-button {
	margin-block-start: auto;
}

/* Elementor has no 820px breakpoint; three 232–250px columns wrap every title at 768–820. */
@media (max-width: 820px) {
	body.page-id-414 .elementor-element.elementor-element-470e8368 {
		--e-con-grid-template-columns: repeat(1, minmax(0, 1fr));
	}
}

/* P-24: the closing-band title takes the global "Heading L" typography, whose variable overrides the element's own
   28px phone size (ledger: 75162cba title_typography_font_size_mobile); apply it here so "Conservation" fits at 320px. */
@media (max-width: 767px) {
	body.page-id-414 .elementor-element.elementor-element-75162cba .elementor-cta__title {
		font-size: 1.75rem;
	}
}

/* ---- Task 23 · P-08 · Contact FAQ: Nested Accordion (details/summary) styled like the accordion it replaced ---- */
body.page-id-417 .elementor-element.elementor-element-ricfaqacc {
	--n-accordion-title-font-size: var(--ric-text-lg, 18px);
	--n-accordion-title-justify-content: space-between;
	--n-accordion-title-icon-order: 1;
	--n-accordion-border-width: 1px;
	--n-accordion-border-color: var(--ric-color-primary, #2C5F2D);
	--n-accordion-padding: var(--ric-space-6, 32px) var(--ric-space-5, 24px);
	--n-accordion-title-normal-color: var(--ric-color-primary, #2C5F2D);
	--n-accordion-title-hover-color: var(--ric-color-secondary, #1B3B1A);
	--n-accordion-title-active-color: var(--ric-color-primary, #2C5F2D);
	--n-accordion-icon-size: 16px;
	--n-accordion-icon-gap: 0 var(--ric-space-4, 16px);
}

/* Weight 500: the kit's "Heading S", which the replaced accordion's questions rendered in. */
body.page-id-417 .elementor-element-ricfaqacc .e-n-accordion-item-title-text {
	font-family: var(--ric-font-heading, "Poppins", sans-serif);
	font-weight: 500;
	line-height: var(--ric-leading-tight, 1.3);
	color: inherit;
}

/* One 1px line between questions, and none between a question and its answer. */
body.page-id-417 .elementor-element-ricfaqacc .e-n-accordion-item + .e-n-accordion-item > .e-n-accordion-item-title {
	border-block-start-width: 0;
}

body.page-id-417 .elementor-element-ricfaqacc .e-n-accordion-item > .e-con {
	border-block-start-width: 0;
	--padding-top: var(--ric-space-5, 24px); /* the question's bottom border stays, as on the replaced accordion */
	--padding-right: var(--ric-space-5, 24px);
	--padding-bottom: var(--ric-space-5, 24px);
	--padding-left: var(--ric-space-5, 24px);
}

@media (max-width: 767px) {
	body.page-id-417 .elementor-element.elementor-element-ricfaqacc {
		--n-accordion-title-font-size: var(--ric-text-base, 16px);
		--n-accordion-padding: var(--ric-space-5, 24px) var(--ric-space-4, 16px);
	}

	body.page-id-417 .elementor-element-ricfaqacc .e-n-accordion-item > .e-con {
		--padding-right: var(--ric-space-4, 16px);
		--padding-left: var(--ric-space-4, 16px);
	}
}

/* ---- Task 24 · P-21 · Photo Gallery carousel: one 3:2 crop, visible 44px arrows, 44px dot targets ---- */
body.page-id-405 .elementor-element-fab4ce5 .swiper-slide-image {
	aspect-ratio: 3 / 2;
	width: 100%;
	height: auto;
	object-fit: cover;
}

body.page-id-405 .elementor-element-fab4ce5 .elementor-swiper-button {
	box-sizing: content-box;
	padding: calc((var(--ric-tap-min, 44px) - 24px) / 2);
	border-radius: 50%;
	background-color: rgb(255 255 255 / 0.92);
	box-shadow: var(--ric-shadow-sm, 0 1px 3px rgb(0 0 0 / 0.25));
	color: var(--ric-color-primary, #2C5F2D);
	font-size: 24px;
}

body.page-id-405 .elementor-element-fab4ce5 .elementor-swiper-button svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

/* Dots: a 10px visible dot inside a 44px target. */
body.page-id-405 .elementor-element-fab4ce5 .elementor-image-carousel-wrapper {
	padding-block-end: calc(var(--ric-tap-min, 44px) + var(--ric-space-1, 4px));
}

body.page-id-405 .elementor-element-fab4ce5 .swiper-pagination {
	bottom: 0;
	line-height: 0;
}

body.page-id-405 .elementor-element-fab4ce5 .swiper-pagination-bullet {
	box-sizing: content-box;
	width: 10px;
	height: 10px;
	margin: 0;
	padding: calc((var(--ric-tap-min, 44px) - 10px) / 2);
	background-clip: content-box;
	background-color: var(--ric-color-muted, #69727D);
	opacity: 1;
}

body.page-id-405 .elementor-element-fab4ce5 .swiper-pagination-bullet-active {
	background-color: var(--ric-color-primary, #2C5F2D);
}

/* "Upload Your Photos" lands on the form heading with breathing room. */
body.page-id-405 #upload {
	scroll-margin-block-start: var(--ric-space-6, 32px);
}

/* ---- Task 26 · P-07 · Home "Wildlife Photography" card: its new in-sentence "Wildlife Guide" link is underlined,
 * like every running-text link (10-base.css, G-04), so it is not told apart by colour alone ---- */
body.page-id-414 .elementor-element-3fc2b338 .elementor-icon-box-description a {
	text-decoration-line: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

body.page-id-414 .elementor-element-3fc2b338 .elementor-icon-box-description a:hover {
	text-decoration-thickness: 2px;
}

/* ---- Task 29 · P-20 · photo-upload hint is readable (WPForms prints it at 60% opacity) ---- */
body.page-id-405 div.wpforms-container-full .wpforms-field-file-upload .wpforms-uploader .dz-message .modern-hint {
	opacity: 1;
	color: var(--ric-color-muted, #595959);
}

/* ---- Task 29 · P-04 · Privacy Policy: running text keeps a readable measure inside the 1280px column (Task 20) ---- */
/* Figtree's 1ch (the width of "0") is about 1.4 average letters: 75ch held 96–107 characters a line at 16px,
   55ch holds at most 80 (WCAG 1.4.8). The heading above keeps the full column. */
body.page-id-3 .page-content {
	max-width: 55ch;
}

/* Hello gives paragraphs a 0.9rem bottom margin and lists none, so a list ran into the paragraph after it. */
body.page-id-3 .page-content :is(ul, ol) {
	margin-block-end: 0.9rem;
}