/* ============ Page-specific layouts ============ */

/* Split sections (image + text) */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.split--reverse > :first-child { order: 2; }

/* Services overview grid on home */
.services-grid { grid-template-columns: repeat(4, 1fr); }

/* Why choose */
.why-grid { grid-template-columns: repeat(2, 1fr); }
.why-item { display: flex; gap: 1rem; align-items: flex-start; }
.why-item .card__icon { flex-shrink: 0; }
.why-item p { font-size: var(--fs-small); margin-top: 0.2rem; }

/* Contact page */
.contact-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 2.5rem; align-items: start; }
.contact-info { display: grid; gap: 1.1rem; }
.contact-info .card { flex-direction: row; align-items: flex-start; gap: 1rem; }
.contact-info .card__icon { flex-shrink: 0; width: 44px; height: 44px; }
.contact-info .card p { flex-grow: 0; }
.map-embed { border: 0; width: 100%; height: 340px; border-radius: var(--radius); box-shadow: var(--shadow-sm); }

/* Membership requirements panel */
.req-panel { background: var(--white); border: 1px solid var(--line); border-left: 5px solid var(--gold); border-radius: var(--radius); padding: 1.6rem; }

/* Calculators page layout */
.calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: start; }

/* Uplift page: how-it-works strip */
.uplift-download { display: flex; gap: 1.6rem; align-items: center; flex-wrap: wrap; }

/* Legal prose */
.legal-prose { max-width: 760px; }
.legal-prose h2 { margin: 1.8rem 0 0.6rem; font-size: 1.25rem; }
.legal-prose p, .legal-prose li { font-size: var(--fs-small); color: var(--ink-soft); margin-bottom: 0.7rem; }
.legal-prose ul { padding-left: 1.2rem; }

/* 404 */
.notfound { min-height: 55vh; display: grid; place-items: center; text-align: center; }
.notfound .big { font-family: var(--font-display); font-weight: 800; font-size: clamp(4rem, 12vw, 8rem); color: var(--gold); line-height: 1; }

/* Reveal animation */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity 0.6s var(--ease), transform 0.6s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; } }