/* Interior pages share the homepage's typography, palette, controls and nav.
   Flat content surfaces keep forms and practical information in view.
   Flip cards are limited to the membership benefits section. */
.interior-page { --text-dark: var(--cap-ink); --text-light: var(--cap-muted); --background-light: #f7f7f8; }
.interior-page .container { max-width: 1320px; padding-inline: 0; width: calc(100% - 96px); }
.interior-page .navbar .container { width: 100%; }
.interior-page .section { padding-block: 80px; }
.interior-page .section-alt { background: var(--background-light); }
.interior-page h2, .interior-page h3, .interior-page h4 { color: var(--cap-ink); }
.interior-page h2 { font-size: clamp(30px, 3.1vw, 44px); line-height: 1.15; letter-spacing: -.05em; margin-bottom: 22px; }
.interior-page h3 { font-size: 23px; line-height: 1.3; letter-spacing: -.035em; margin-bottom: 14px; }
.interior-page h4 { font-size: 16px; line-height: 1.5; margin-block: 22px 10px; }
.interior-page p { color: var(--cap-muted); font-size: 15px; line-height: 1.85; margin-bottom: 16px; }
.interior-page p:last-child { margin-bottom: 0; }
.interior-page main a:not(.btn):not(.cap-button):not(.cap-text-link):not(.cap-gallery-open) { text-underline-offset: 4px; }
.interior-page main p a { color: var(--cap-red); text-decoration: underline; }
.cap-page-hero { position: relative; isolation: isolate; padding-block: 48px 64px; border-bottom: 1px solid var(--cap-line); background: var(--cap-white); }
.cap-page-hero > .cap-shell { position: relative; z-index: 2; }
.cap-page-hero h1 { font-size: clamp(48px, 6.6vw, 94px); margin: 22px 0; overflow-wrap: anywhere; }
.cap-page-hero > div > p { max-width: 620px; font-size: 18px; line-height: 1.7; margin-bottom: 0; }
.cap-breadcrumb { font-size: 12px; font-weight: 600; }
.cap-breadcrumb .cap-icon { transform: rotate(-135deg); }
.cap-page-hero.is-photo { color: var(--cap-white); background: var(--cap-ink); }
.cap-page-hero.is-photo::after { content: ''; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgb(20 20 24 / .84), rgb(20 20 24 / .54)); }
.cap-page-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; filter: grayscale(1); }
.cap-page-hero.is-photo p { color: var(--cap-white); }
.interior-page .section-header { text-align: left; margin-bottom: 38px; }
.interior-page .section-header p { margin: 0; max-width: 700px; font-size: 16px; }
.interior-page .section-header h2 { margin-bottom: 14px; }
.interior-page .two-column { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.interior-page .column { min-width: 0; }
.interior-page .column > h3:not(:first-child) { margin-top: 30px; }
.interior-page .mission-image { height: auto; border-radius: 8px; overflow: hidden; }
.interior-page .mission-image .gallery-item { height: auto; cursor: default; aspect-ratio: auto; }
.interior-page .mission-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.interior-page .cards-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
.interior-page .card { border: 0; border-top: 1px solid var(--cap-line); border-radius: 0; padding: 28px 0; box-shadow: none; background: transparent; text-align: left; transition: none; }
.interior-page .card:hover { transform: none; box-shadow: none; }
.interior-page .card h3 { color: var(--cap-ink); }
.interior-page .cards-grid:has(> .card:nth-child(3):last-child) > .card:last-child { grid-column: 1 / -1; }
.cap-panel { background: var(--background-light); padding: 32px; border-radius: 8px; margin-bottom: 24px; }
.cap-panel > .cards-grid { margin-top: 24px; }
.cap-space-block { margin-top: 56px; }
.cap-reading-width { max-width: 800px; margin-inline: auto; }
.cap-callout { border-left: 3px solid var(--cap-red); }
.cap-action-row { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-block: 24px; }
.interior-page .btn, .interior-page .form-submit, .interior-page .btn-large, .interior-page .modal-form button[type="submit"] { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 11px 18px; border: 1px solid var(--cap-red); border-radius: 6px; font: 600 14px/1.4 'Montserrat',sans-serif; width: fit-content; max-width: 100%; box-shadow: none; text-align: center; }
.interior-page .btn-primary, .interior-page .form-submit, .interior-page .modal-form button[type="submit"] { color: var(--cap-white); background: var(--cap-red); }
.interior-page .btn-outline, .interior-page .btn-secondary { background: var(--cap-white); color: var(--cap-ink); border-color: #c6c6cc; }
.interior-page .btn:hover { transform: none; box-shadow: none; }
.interior-page .btn:active, .interior-page .form-submit:active { transform: scale(.98); }
.interior-page button:disabled { opacity: .6; cursor: wait; }
.interior-page .cta-section { background: var(--cap-white); color: var(--cap-ink); text-align: center; padding: 72px 0; border-top: 1px solid var(--cap-line); }
.interior-page .cta-section h2 { color: var(--cap-ink); font-size: clamp(34px, 4.4vw, 58px); margin-bottom: 20px; }
.interior-page .cta-section p { max-width: 650px; margin: 0 auto 28px; }
.interior-page .cta-section .btn { margin-inline: auto; }
.interior-page .footer h4 { font-size: 17px; letter-spacing: -.02em; margin-block: 0 18px; }
.interior-page .footer p, .interior-page .footer a { font-size: 13px; line-height: 1.8; }
.interior-page .footer .container { max-width: 1320px; }

/* Team details expand in place; roles are never hidden behind a flip. */
.interior-page .service-teams { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.interior-page .team-card { padding: 32px; background: var(--cap-white); border: 1px solid var(--cap-line); border-radius: 8px; box-shadow: none; scroll-margin-top: 104px; }
.interior-page .team-card:hover { transform: none; box-shadow: none; }
.interior-page .team-card h3 { color: var(--cap-ink); font-size: 24px; }
.cap-team-detail { border-top: 1px solid var(--cap-line); padding-top: 18px; margin-top: 22px; }
.cap-team-detail summary { cursor: pointer; font-size: 14px; font-weight: 600; min-height: 44px; padding-block: 10px; }
.interior-page .team-card ul { list-style: disc; padding-left: 20px; margin-bottom: 18px; }
.interior-page .team-card li { font-size: 14px; line-height: 1.8; color: var(--cap-muted); margin-bottom: 8px; padding-left: 0; }
.interior-page .team-card li::before { content: none; }
.interior-page .team-card > .cap-text-link { margin-top: 12px; }

/* Practical information and giving details remain flat and visible. */
.interior-page .calendar-container { max-width: none; }
.interior-page .calendar-container > h3 { margin-top: 40px; }
.interior-page .calendar-container > h3:first-child { margin-top: 0; }
.interior-page .calendar-event { padding: 26px 0; background: transparent; border: 0; border-top: 1px solid var(--cap-line); border-radius: 0; box-shadow: none; margin-bottom: 0; }
.interior-page .calendar-event:hover { transform: none; }
.interior-page .calendar-date { color: var(--cap-red); font-size: 15px; font-weight: 600; }
.interior-page .give-options { grid-template-columns: 1fr 1fr; gap: 20px; }
.interior-page .give-card { background: var(--cap-white); border: 1px solid var(--cap-line); border-radius: 8px; box-shadow: none; padding: 28px; min-width: 0; }
.interior-page .give-card:hover { transform: none; }
.interior-page .give-method-row { display: flex; align-items: center; gap: 20px; min-width: 0; }
.interior-page .give-method-row > div { min-width: 0; }
.interior-page .give-method-logo { width: 56px; height: 56px; object-fit: contain; flex: 0 0 56px; }
.interior-page .give-method-title { font-size: 22px; margin-bottom: 6px; }
.interior-page .give-method-value { color: var(--cap-ink); font-size: 15px; font-weight: 500; overflow-wrap: anywhere; }
.interior-page iframe { width: 100%; border: 0; border-radius: 8px; }
.interior-page main .column > .cap-panel:last-child { margin-bottom: 0; }
.interior-page .resources-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.interior-page .resource-card { text-align: left; padding: 30px 0; border: 0; border-top: 1px solid var(--cap-line); border-radius: 0; box-shadow: none; background: transparent; display: flex; flex-direction: column; align-items: start; }
.interior-page .resource-card:hover { transform: none; box-shadow: none; }
.interior-page .resource-card p { margin-bottom: 24px; flex: 1; }

/* Forms retain their original fields, order and submission destinations. */
.interior-page .form-container { background: var(--cap-white); max-width: 760px; width: 100%; padding: 32px; border: 1px solid var(--cap-line); border-radius: 8px; box-shadow: none; }
.interior-page .form-section { scroll-margin-top: 104px; }
.interior-page .form-section > div:first-child { max-width: 760px; margin: 0 auto 30px; }
.interior-page .form-group { margin-bottom: 22px; }
.interior-page .form-group label { font-size: 14px; line-height: 1.6; margin-bottom: 8px; }
.interior-page .form-group input, .interior-page .form-group select, .interior-page .form-group textarea { font-size: 16px; line-height: 1.5; border: 1px solid #b9b9c1; background: var(--cap-white); color: var(--cap-ink); min-height: 48px; border-radius: 6px; padding: 12px 14px; max-width: 100%; }
.interior-page .form-group input::placeholder, .interior-page .form-group textarea::placeholder { color: #6d6d76; opacity: 1; }
.interior-page .form-group input:focus, .interior-page .form-group select:focus, .interior-page .form-group textarea:focus { outline: 2px solid var(--cap-red); outline-offset: 2px; box-shadow: none; border-color: var(--cap-red); }
.interior-page .form-group input[type="checkbox"], .interior-page .form-group input[type="radio"] { min-height: 20px; width: 20px; flex: 0 0 20px; accent-color: var(--cap-red); }
.cap-check-label { display: flex !important; gap: 12px; align-items: start; }
.cap-form-switch { border-bottom: 1px solid var(--cap-line); padding-bottom: 24px; }
.interior-page .cap-form-switch .btn { background: var(--cap-white); color: var(--cap-ink); border-color: #c6c6cc; }
.interior-page .cap-form-switch [aria-pressed="true"] { background: var(--cap-red); color: var(--cap-white); border-color: var(--cap-red); }
.cap-form-status { margin-top: 18px; font-size: 14px; }
.cap-form-status.is-error { color: #a8172d; }
.interior-page .tooltip-content { margin-top: 10px; border: 1px solid var(--cap-line); border-radius: 6px; padding: 16px; color: var(--cap-muted); background: var(--background-light); font-size: 13px; line-height: 1.8; }
.interior-page .tooltip-icon { display: inline-flex; justify-content: center; align-items: center; min-width: 44px; min-height: 44px; padding: 8px; background: transparent; color: var(--cap-ink); border: 0; cursor: pointer; }

/* One front/back interaction, limited to the three membership benefits. */
.cap-flip-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 28px; }
.cap-flip:first-child { grid-column: 1 / -1; }
.cap-flip { min-width: 0; scroll-margin-top: 104px; }
.cap-flip-inner { border: 1px solid var(--cap-line); border-radius: 8px; background: var(--cap-white); }
.cap-flip-front, .cap-flip-back { padding: 28px; }
.cap-flip-back { border-top: 1px solid var(--cap-line); background: var(--cap-red); color: var(--cap-white); border-radius: 8px; }
.cap-flip-toggle { background: none; border: 0; color: var(--cap-ink); padding: 0; cursor: pointer; font-family: inherit; }
.cap-site:not(.site-ready) .cap-flip-toggle { display: none; }
.site-ready .cap-flip { perspective: 1200px; }
.site-ready .cap-flip-inner { display: grid; transform-style: preserve-3d; transition: transform 650ms cubic-bezier(.45, 0, .2, 1); min-height: 220px; }
.site-ready .cap-flip-front, .site-ready .cap-flip-back { grid-area: 1 / 1; backface-visibility: hidden; -webkit-backface-visibility: hidden; display: flex; flex-direction: column; align-items: start; justify-content: space-between; gap: 18px; border: 0; }
.site-ready .cap-flip-back { transform: rotateY(180deg); }
.interior-page .cap-flip-back h3, .interior-page .cap-flip-back p, .interior-page .cap-flip-back .cap-flip-toggle { color: var(--cap-white); }
.cap-site .cap-flip-back button:focus-visible { outline-color: var(--cap-white); }
.site-ready .cap-flip.is-flipped .cap-flip-inner { transform: rotateY(180deg); }
.site-ready .cap-flip.is-instant .cap-flip-inner { transition: none; }
.site-ready .cap-flip-front h3, .site-ready .cap-flip-back h3 { margin: 0; }
.site-ready .cap-flip-back p { margin: 0; font-size: 14px; }
.cap-flip-grid .cap-flip:first-child .cap-flip-front { background: var(--cap-ink); color: var(--cap-white); border-radius: 8px; }
.cap-flip-grid .cap-flip:first-child .cap-flip-front h3, .cap-flip-grid .cap-flip:first-child .cap-flip-toggle { color: inherit; }

/* Gallery filters are buttons; photos open in a native, keyboard-safe dialog. */
.interior-page .gallery-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.interior-page .gallery-item { min-width: 0; height: auto; border-radius: 8px; aspect-ratio: 4 / 3; overflow: hidden; box-shadow: none; }
.interior-page .gallery-item:hover { transform: none; }
.interior-page .cap-gallery-open { display: block; border: 0; padding: 0; background: var(--cap-ink); width: 100%; height: 100%; cursor: zoom-in; }
.interior-page .cap-gallery-open img { width: 100%; height: 100%; object-fit: cover; transition: transform 300ms var(--cap-ease); }
.interior-page .cap-gallery-open:focus-visible { outline-offset: -4px; }
.interior-page #video-gallery { grid-template-columns: minmax(0, 900px); }
.interior-page #video-gallery .gallery-item { aspect-ratio: 16 / 9; background: var(--cap-ink); }
.interior-page video { width: 100%; height: 100%; object-fit: contain; }
.interior-page .cap-action-row:has([id^="filter-"]) { gap: 8px; margin-bottom: 32px; }
.interior-page button[id^="filter-"] { background: var(--cap-white); color: var(--cap-ink); border-color: #c6c6cc; font-size: 13px; }
.interior-page button[id^="filter-"][aria-pressed="true"] { background: var(--cap-red); color: var(--cap-white); border-color: var(--cap-red); }
.cap-lightbox { padding: 56px 16px 16px; border: 0; border-radius: 8px; max-width: min(96vw, 1200px); max-height: 94dvh; color: var(--cap-white); background: var(--cap-ink); }
.cap-lightbox::backdrop, .interior-page dialog.modal::backdrop { background: rgb(20 20 24 / .85); }
.cap-lightbox img { max-width: 100%; max-height: calc(90dvh - 80px); object-fit: contain; margin: auto; }
.cap-dialog-close { position: absolute; right: 12px; top: 8px; min-height: 44px; padding: 8px 14px; border: 1px solid #777; background: var(--cap-ink); color: var(--cap-white); border-radius: 6px; font: 600 13px 'Montserrat',sans-serif; cursor: pointer; }

/* The outreach report uses a native dialog, with the existing form intact. */
.interior-page .soul-counter-main { background: var(--cap-ink); border-radius: 8px; box-shadow: none; padding: 40px; }
.interior-page .soul-counter-main h2, .interior-page .soul-counter-main p { color: var(--cap-white); }
.interior-page .counter-display { font-size: clamp(56px, 7vw, 90px); animation: none; text-shadow: none; }
.interior-page .soul-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-block: 28px; }
.interior-page .soul-note { background: var(--background-light); border-radius: 8px; padding: 24px; border: 0; border-left: 3px solid var(--cap-red); }
.interior-page .ranking-section { margin: 48px 0 0; padding: 0; background: transparent; border-radius: 0; }
.interior-page .ranking-container { display: grid; grid-template-columns: 1fr; gap: 0; }
.interior-page .rank-card { border: 0; border-top: 1px solid var(--cap-line); border-radius: 0; box-shadow: none; background: var(--cap-white); padding: 24px 0; display: flex; align-items: center; gap: 20px; text-align: left; transform: none; }
.interior-page .rank-card:hover { transform: none; }
.interior-page .rank-number { position: static; background: transparent; color: var(--cap-red); box-shadow: none; width: 36px; height: auto; font-size: 23px; }
.interior-page .rank-avatar { margin: 0; width: 64px; height: 64px; border-width: 1px; box-shadow: none; }
.interior-page .rank-info { margin-top: 0; }
.interior-page .rank-avatar.floating { animation: none; }
.interior-page .rank-name { font-size: 20px; }
.interior-page dialog.modal { display: none; position: fixed; inset: 0; height: auto; width: min(92vw, 640px); max-height: 90dvh; margin: auto; padding: 0; overflow-y: auto; border: 1px solid var(--cap-line); border-radius: 8px; background: var(--cap-white); color: var(--cap-ink); backdrop-filter: none; }
.interior-page dialog.modal[open] { display: block; }
.interior-page .modal-content { width: 100%; padding: 48px 32px 32px; max-height: none; margin: 0; border-radius: 0; box-shadow: none; animation: none; overflow: visible; }
.interior-page .modal-close { min-height: 44px; min-width: 44px; border: 0; background: transparent; color: var(--cap-ink); top: 8px; right: 8px; font-size: 28px; }
html:has(dialog[open]) { overflow: hidden; }
@media (hover: hover) and (pointer: fine) { .cap-gallery-open:hover img { transform: scale(1.025); } .interior-page .btn:hover, .interior-page .form-submit:hover { filter: brightness(.96); } }
@media (prefers-reduced-motion: reduce) { .site-ready .cap-flip-inner { transition: none; } }
@media (max-width: 1024px) {
    .interior-page .container { width: calc(100% - 64px); }
    .interior-page .two-column { gap: 32px; }
    .interior-page .give-method-row { gap: 14px; }
    .interior-page .give-card { padding: 22px; }
}
@media (max-width: 767px) {
    .interior-page .container { width: calc(100% - 40px); }
    .interior-page .section { padding-block: 52px; }
    .cap-page-hero { padding-block: 24px 40px; }
    .cap-page-hero h1 { font-size: clamp(40px, 9.8vw, 64px); margin: 18px 0; }
    .cap-page-hero > div > p { font-size: 16px; }
    .interior-page h2 { font-size: 30px; }
    .interior-page .section-header { margin-bottom: 28px; }
    .interior-page .two-column, .interior-page .cards-grid, .interior-page .resources-grid, .interior-page .service-teams, .interior-page .give-options { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .interior-page .card { padding-block: 24px; }
    .interior-page .team-card, .cap-panel { padding: 24px; }
    .cap-space-block { margin-top: 36px; }
    .interior-page .form-container { padding: 24px 18px; }
    .interior-page .cta-section { padding-block: 52px; }
    .interior-page .cta-section h2 { font-size: 34px; }
    .interior-page .gallery-grid { gap: 12px; }
    .interior-page .gallery-item { border-radius: 6px; }
    .interior-page .cap-action-row:has([id^="filter-"]) { gap: 6px; }
    .interior-page button[id^="filter-"] { padding-inline: 12px; font-size: 12px; }
    .cap-flip-grid { grid-template-columns: minmax(0, 1fr); }
    .site-ready .cap-flip-inner { min-height: 240px; }
    .interior-page .cap-flip-front, .interior-page .cap-flip-back { padding: 24px; }
    .interior-page .soul-counter-main { padding: 28px 20px; }
    .interior-page .rank-card { gap: 12px; }
    .interior-page .rank-name { font-size: 16px; }
    .interior-page .rank-avatar { width: 48px; height: 48px; flex: 0 0 48px; }
    .interior-page .modal-content { padding: 52px 20px 24px; }
    .interior-page .give-method-logo { width: 48px; height: 48px; flex-basis: 48px; }
    .interior-page iframe { height: 320px; }
}
