/*
 * Camp page. Values: [m] audit/measure/camp-1440 and -390, [ds] design-system, [spec] design-spec 3b, 5c, 7.
 * Vertical rhythm is Elementor's today: 60px page padding, 10px column/widget gutters, 30px white spacer section,
 * FAQ pulled up 39px, 60px after the FAQ.
 */

/* ---------- 2. Photo carousel: 60px page padding + the 10px column gutter above and below [m] ---------- */
.camp-photos { padding-block: 70px 10px; }

/* ---------- 3. Intro row (1fr 4fr 1fr, 20px gaps) ---------- */
.camp-intro__side--left { background: var(--cc-green); }
.camp-intro__side--right { background: var(--cc-green-deep); } /* R-19: reproduced */
.camp-intro__main {
	width: 100%;
	max-width: 640px;
	margin-inline: auto;
	padding: 66px 10px 31px; /* 12 column margin + 10 gutter + 24 spacer + 20 widget gap above; 10 + 21 below [m] */
	text-align: center;
}
.camp-intro__main > p,
.camp-intro__main > div > p {
	margin: 0 0 24px;
	color: var(--cc-text);
	font-family: var(--cc-font-body);
	font-size: 15px;
	line-height: 25px;
}
/* The Camp Dates heading: an h4 today, an h2 now (heading order). Same look: Roboto Slab 400, 24/29, #3a3a3a. */
.camp-intro__main h2 {
	margin: 0 0 20px;
	color: var(--cc-heading-astra);
	font-size: var(--cc-fs-h4);
	font-weight: var(--cc-fw-title);
	line-height: 1.2;
}
.camp-intro__main h2 strong { color: var(--cc-black); font-weight: 700; } /* the one black text on the site, 1:1 */
.camp-intro__main .canopy-reg { margin-top: 0; margin-bottom: 0; }

@media (max-width: 767px) {
	.camp-intro__row { gap: 0; }
	/* Side columns become 1px lines above and below the text [m camp-390]. */
	.camp-intro__side { height: 1px; }
	.camp-intro__main > p,
	.camp-intro__main > div > p { font-size: 14px; line-height: 23px; margin-bottom: 22px; }
}

/* ---------- 4. The white 30px spacer section ---------- */
.camp-gap { height: 30px; }

/* ---------- 5. Schedule card and the empty Location column ---------- */
.camp-schedule {
	margin-bottom: 85px;
	padding: 8px 20px 20px;
	background: var(--cc-white);
	box-shadow: var(--cc-shadow);
}
.camp-schedule__heading { margin: 0 0 8px; font-size: var(--cc-fs-h2); line-height: 1.3; }
.camp-schedule__text p {
	max-width: var(--cc-measure);
	margin: 0 0 24px;
	color: var(--cc-text);
	font-family: var(--cc-font-body);
	font-size: 15px;
	line-height: 1.9;
}
.camp-schedule__text > :last-child { margin-bottom: 0; }
.camp-location { min-height: 0; } /* R-3: empty today, reproduced */

@media (max-width: 767px) {
	.camp-info .canopy-grid { gap: 0; }
	.camp-schedule__text p { font-size: 14px; line-height: 26px; }
	.camp-location { min-height: 94px; } /* the empty column's height when stacked [m camp-390] */
}

/* ---------- 6. FAQ: blue panel, white wave brush on top ---------- */
.camp-faq { margin-top: -39px; padding-bottom: var(--cc-space-page); }
.camp-faq__panel { position: relative; overflow: hidden; padding: 10px; background: var(--cc-panel-blue); }
.camp-faq__wave {
	position: absolute;
	top: 0;
	left: 50%;
	z-index: 1;
	width: 139%;
	height: 93px;
	max-width: none;
	transform: translateX(-50%);
	pointer-events: none;
}
.camp-faq__body { position: relative; z-index: 2; }
.camp-faq__heading { margin: 90px 0 20px; font-size: var(--cc-fs-h2); line-height: 1.3; }
.camp-faq .canopy-accordion__content { color: var(--cc-text); } /* R-13: #65665c */

/* B10-1: the old site switched to phone type at <= 768px (Astra 4.7.3 inline responsive CSS: html 85.5%,
   h1 30 / h2 25 / h3 20), while columns stacked only at <= 767. These are this file's <= 767 type rules, repeated so
   768 gets them too; 769+ stays desktop, 390 is unchanged. Source: audit/measure/live-tablet-breakpoint.txt */
@media (max-width: 768px) {
	.camp-intro__main > p,
	.camp-intro__main > div > p { font-size: 14px; line-height: 23px; }
	.camp-schedule__text p { font-size: 14px; line-height: 26px; }
}