:root {
    --bg: #f5efe3;
    --surface: #ffffff;
    --surface-soft: #fff9f0;
    --ink: #1f1a17;
    --muted: #5f564d;
    --primary: #ba1f35;
    --primary-deep: #8f1326;
    --secondary: #0f4c5c;
    --line: #e2d8c8;
    --shadow: 0 20px 45px rgba(24, 16, 10, 0.12);
    --radius: 18px;
    --container: 1160px;
    --focus: #0c8b86;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: 'Manrope', sans-serif;
    color: var(--ink);
    background: radial-gradient(circle at 20% -10%, #fff8ee, var(--bg));
    line-height: 1.6;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
    outline: 3px solid var(--focus);
    outline-offset: 2px;
}

.container {
    width: min(var(--container), calc(100% - 2.2rem));
    margin: 0 auto;
}

.skip-link {
    position: absolute;
    left: -999px;
    top: -999px;
    padding: 0.75rem 1rem;
    background: var(--ink);
    color: #fff;
    z-index: 2000;
    border-radius: 8px;
}

.skip-link:focus {
    left: 1rem;
    top: 1rem;
}

.navbar {
    position: sticky;
    top: 0;
    z-index: 1200;
    backdrop-filter: blur(10px);
    background: rgba(245, 239, 227, 0.9);
    border-bottom: 1px solid rgba(122, 98, 71, 0.2);
}

.nav-inner {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    text-decoration: none;
}

.logo-img {
    width: 246px;
    height: 80px;
    object-fit: contain;
}

.brand-text {
    font-family: 'Fraunces', serif;
    font-size: 1.15rem;
    letter-spacing: 0.02em;
}

.nav-links {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.nav-links a {
    text-decoration: none;
    font-weight: 600;
    color: #3f352d;
    font-size: 0.95rem;
}

.nav-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1rem;
    background: var(--primary);
    color: #fff !important;
    border-radius: 999px;
    font-weight: 700;
}

.nav-cta:hover,
.nav-cta:focus-visible {
    background: var(--primary-deep);
}

.menu-toggle {
    display: none;
    width: 46px;
    height: 46px;
    border: 1px solid #baa78f;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    padding: 0.6rem;
    gap: 0.28rem;
    flex-direction: column;
    justify-content: center;
}

.menu-toggle span {
    display: block;
    width: 100%;
    height: 2px;
    background: #2b241f;
}

.hero {
    position: relative;
    min-height: 82vh;
    display: grid;
    align-items: center;
    overflow: hidden;
}

.hero-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(18, 13, 9, 0.78), rgba(18, 13, 9, 0.36));
}

.hero-content {
    position: relative;
    z-index: 1;
    padding: 7rem 0 4rem;
    color: #fff;
    max-width: 760px;
}

.hero-kicker {
    margin: 0 0 1rem;
    font-size: 0.9rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.92;
}

h1,
h2,
h3 {
    margin: 0 0 1rem;
    line-height: 1.15;
    font-family: 'Fraunces', serif;
}

h1 {
    font-size: clamp(2rem, 6.2vw, 4.1rem);
}

h2 {
    font-size: clamp(1.5rem, 4vw, 2.6rem);
}

h3 {
    font-size: clamp(1.2rem, 2.4vw, 1.5rem);
}

.hero-copy,
.hero-mini {
    margin: 0;
    max-width: 66ch;
}

.hero-mini {
    margin-top: 1rem;
    font-weight: 600;
    color: #f7dfc8;
}

.hero-actions {
    margin-top: 1.8rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.8rem;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    max-width: 100%;
    border: 0;
    border-radius: 999px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.2s ease, background 0.2s ease;
    padding: 0.75rem 1.2rem;
    white-space: normal;
    text-align: center;
}

.btn:hover {
    transform: translateY(-1px);
}

.btn-primary {
    background: var(--primary);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus-visible {
    background: var(--primary-deep);
}

.btn-secondary {
    background: #fff;
    color: #271d18;
    border: 1px solid #ccb8a2;
}

.btn-link {
    color: inherit;
    text-decoration: underline;
    font-weight: 700;
    background: transparent;
    padding-inline: 0.3rem;
}

.section {
    padding: clamp(3.5rem, 6vw, 5.6rem) 0;
}

.section-shell {
    display: grid;
    gap: 1.6rem;
}

.section-head p {
    margin: 0;
    color: var(--muted);
    max-width: 64ch;
}

.section-head.left {
    text-align: left;
}

.eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-size: 0.82rem;
    font-weight: 800;
    color: var(--primary);
}

.card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.card {
    background: var(--surface);
    border-radius: var(--radius);
    padding: 1.3rem;
    box-shadow: var(--shadow);
}

.card-highlight {
    background: linear-gradient(135deg, #2f1d16, #83213c);
    color: #fff;
}

.sunday {
    background: linear-gradient(180deg, #fff8ef, #f6ecdf);
}

.sunday-layout {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1.08fr 1fr;
}

.schedule-card,
.calendar-card,
.membership-card,
.address-note,
.schnupper-form,
.legal-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 1.2rem;
    box-shadow: var(--shadow);
}

table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.98rem;
}

table th,
table td {
    text-align: left;
    padding: 0.8rem 0.7rem;
    border-bottom: 1px solid #ecdfcc;
}

table td:first-child,
table th:first-child {
    width: 110px;
    font-weight: 800;
    color: #8e182b;
}

.chips {
    margin: 1rem 0 0;
    color: #53463b;
    font-weight: 700;
}

.calendar-card iframe {
    width: 100%;
    height: 420px;
    border: 0;
    border-radius: 12px;
    background: #fff;
}

.external-embed {
    border: 1px solid #ecdfcc;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.external-embed-placeholder {
    padding: 1rem;
    background: #f7efe5;
}

.external-embed-placeholder p {
    margin: 0;
    color: #53463b;
    font-weight: 700;
}

.external-embed-actions {
    margin-top: 0.8rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.external-embed-frame {
    width: 100%;
    border: 0;
    border-radius: 0;
    background: #fff;
}

.external-embed-frame[hidden] {
    display: none;
}

.calendar-source {
    margin: 0.75rem 0 0;
    font-size: 0.88rem;
    color: var(--secondary);
    font-weight: 800;
}

.steps {
    margin: 0;
    padding-left: 1.1rem;
    display: grid;
    gap: 0.5rem;
}

.schnupper-form {
    display: grid;
    gap: 1rem;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.form-field {
    display: grid;
    gap: 0.42rem;
}

.form-field.full {
    grid-column: 1 / -1;
}

label {
    font-weight: 700;
    font-size: 0.93rem;
}

input,
select,
textarea {
    width: 100%;
    border: 1px solid #ccbca7;
    border-radius: 12px;
    padding: 0.72rem 0.82rem;
    font: inherit;
    color: #2e2721;
    background: #fff;
}

textarea {
    resize: vertical;
    min-height: 90px;
}

.consent-label {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.consent-label input {
    margin-top: 0.1rem;
    width: 1rem;
    height: 1rem;
}

.choice-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.choice-inline .consent-label {
    margin: 0;
}

.form-status {
    margin: 0;
    font-weight: 700;
}

.form-status.success {
    color: #0d6e3f;
}

.form-status.error {
    color: #8e1527;
}

.mailto-fallback {
    display: grid;
    gap: 0.6rem;
}

.mailto-fallback p {
    margin: 0;
}

.membership-layout,
.address-layout {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1.1fr 1fr;
}

.benefits,
.checklist {
    margin: 0;
    padding-left: 1.15rem;
    display: grid;
    gap: 0.42rem;
}

.membership-actions {
    display: grid;
    gap: 0.6rem;
    margin-top: 0.8rem;
}

.address-text {
    margin: 0;
    font-size: clamp(1.1rem, 2.6vw, 1.5rem);
    font-weight: 800;
}

.address-actions {
    margin-top: 0.9rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}

.copy-status {
    min-height: 1.4rem;
    margin: 0.5rem 0 0;
    color: #1e654f;
    font-weight: 700;
}

.faq {
    background: linear-gradient(180deg, #fff9f1, #f3e6d2);
}

.faq-list {
    display: grid;
    gap: 0.7rem;
}

details {
    background: #fff;
    border: 1px solid #e6d8c5;
    border-radius: 12px;
    padding: 0.85rem 1rem;
}

summary {
    font-weight: 800;
    cursor: pointer;
}

details p {
    margin: 0.55rem 0 0;
}

.cta-band {
    background: linear-gradient(135deg, #28150f, #6d1830);
    color: #fff;
}

.cta-inner {
    text-align: center;
}

.footer {
    background: #140d0a;
    color: #f6eee4;
    padding: 2.8rem 0 5.6rem;
}

.footer-inner {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: 1fr auto;
}

.footer a {
    color: #f6eee4;
}

.footer-brand {
    margin-bottom: 0.4rem;
}

.footer-links {
    display: grid;
    gap: 0.45rem;
    align-content: start;
}

.mobile-sticky-cta {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: 0.8rem;
    z-index: 1250;
    text-align: center;
    text-decoration: none;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, #ba1f35, #8f1326);
    border-radius: 999px;
    padding: 0.95rem 1rem;
    box-shadow: 0 16px 34px rgba(46, 10, 15, 0.37);
    display: none;
}

.legal-page {
    min-height: 100vh;
    background: radial-gradient(circle at 20% -20%, #fff8ee, var(--bg));
}

.legal-header {
    padding: 1rem 0;
    border-bottom: 1px solid rgba(122, 98, 71, 0.25);
    background: rgba(247, 240, 230, 0.9);
    backdrop-filter: blur(8px);
}

.legal-head-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.legal-back {
    font-weight: 700;
}

.legal-main {
    padding: 2rem 0 4rem;
}

.legal-card h1 {
    font-size: clamp(1.8rem, 3.8vw, 2.7rem);
}

.legal-card h2 {
    margin-top: 1.4rem;
    font-size: clamp(1.25rem, 2.8vw, 1.7rem);
}

.legal-card p,
.legal-card li {
    color: #3e352e;
}

@media (max-width: 990px) {
    .nav-links {
        position: fixed;
        top: 78px;
        left: 0;
        right: 0;
        margin: 0;
        padding: 1rem;
        display: grid;
        gap: 0.55rem;
        background: #f7f1e8;
        border-bottom: 1px solid #d7c7b0;
        transform: translateY(-130%);
        transition: transform 0.25s ease;
    }

    .nav-links.active {
        transform: translateY(0);
    }

    .menu-toggle {
        display: inline-flex;
    }

    .sunday-layout,
    .membership-layout,
    .address-layout,
    .footer-inner {
        grid-template-columns: 1fr;
    }

    .card-grid {
        grid-template-columns: 1fr;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .hero-content {
        padding-top: 5.5rem;
    }

    .mobile-sticky-cta {
        display: block;
    }

    .footer {
        padding-bottom: 6.8rem;
    }
}

@media (max-width: 680px) {
    .logo-img {
        width: 246px;
        height: 80px;
    }

    .brand-text {
        font-size: 1rem;
    }

    table,
    tbody,
    tr,
    td,
    th,
    thead {
        display: block;
    }

    thead {
        display: none;
    }

    tr {
        border-bottom: 1px solid #ecdfcc;
        padding-block: 0.4rem;
    }

    td {
        border: 0;
        padding: 0.35rem 0;
    }

    td:first-child {
        width: auto;
    }
}

.app-page .legal-header {
    position: sticky;
    top: 0;
    z-index: 1200;
}

.app-nav {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.app-nav a {
    text-decoration: none;
    font-weight: 700;
}

.app-nav-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.3rem;
    width: 44px;
    height: 44px;
    border: 1px solid #d7c3a8;
    border-radius: 12px;
    background: #fff8ee;
    color: #2b2219;
    cursor: pointer;
    padding: 0;
    flex: 0 0 auto;
}

.app-nav-toggle-line {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.legal-head-inner.is-nav-open .app-nav-toggle-line:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.legal-head-inner.is-nav-open .app-nav-toggle-line:nth-child(2) {
    opacity: 0;
}

.legal-head-inner.is-nav-open .app-nav-toggle-line:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.app-main {
    min-height: calc(100vh - 90px);
}

.site-footer {
    border-top: 1px solid #e4d7c5;
    background: #fffaf2;
    margin-top: 1.2rem;
}

.footer-grid {
    padding: 1.1rem 0 1.3rem;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    color: #4c3e31;
    font-size: 0.94rem;
}

.footer-grid a {
    color: #4c3e31;
    font-weight: 700;
    text-decoration: none;
}

.footer-grid a:hover,
.footer-grid a:focus-visible {
    text-decoration: underline;
}

.training-location {
    margin: 0;
    font-weight: 800;
    color: #3f3025;
}

.small-legal-address {
    margin: 0;
    font-size: 0.82rem;
    color: #6c6054;
}

.auth-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 1.2rem;
    box-shadow: var(--shadow);
    display: grid;
    gap: 0.9rem;
    max-width: 620px;
}

.app-alert {
    border-radius: 12px;
    padding: 0.9rem 1rem;
    font-weight: 700;
}

.app-alert-success {
    background: #ecf9f1;
    border: 1px solid #8fc8a8;
    color: #15573a;
}

.app-alert-error {
    background: #fff1f3;
    border: 1px solid #d59ba4;
    color: #7f1d2d;
}

.app-alert-info {
    background: #eef7ff;
    border: 1px solid #9ec2df;
    color: #174f78;
}

.association-status-wrap {
    margin-top: 0.4rem;
}

.association-status-banner {
    margin: 0;
    border: 1px solid #d8c6a9;
    border-radius: 12px;
    background: #fff7eb;
    color: #4d3d2f;
    padding: 0.7rem 0.85rem;
    font-size: 0.88rem;
    font-weight: 700;
}

.app-note {
    background: #fff;
    border: 1px dashed #cfb89e;
    border-radius: 12px;
    padding: 1rem;
}

.app-note p {
    margin: 0.3rem 0;
}

.app-note-text {
    margin: 0.6rem 0 0;
    color: var(--muted);
    font-weight: 700;
}

.legal-content-shell {
    display: flex;
    justify-content: center;
}

.legal-content {
    width: 100%;
    max-width: 680px;
    margin-inline: auto;
    display: grid;
    gap: 0.8rem;
}

.legal-content h2 {
    margin-top: 32px;
}

.legal-content ul {
    margin: 0;
    padding-left: 1.2rem;
    display: grid;
    gap: 0.3rem;
}

.legal-meta {
    margin-top: -0.2rem;
    color: #5f5449;
    font-size: 0.92rem;
}

.field-hint {
    color: var(--muted);
    font-size: 0.84rem;
}

.home-hero-shell {
    background: linear-gradient(135deg, #fff7ea, #f8e9d8);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1.2rem;
}

.home-trust-copy {
    margin: 0.2rem 0 0;
    font-weight: 700;
    color: #5c4b39;
    font-size: 0.92rem;
}

.home-hero-actions .btn {
    min-height: 44px;
}

.intro-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.intro-card {
    border: 1px solid #ddc7aa;
    border-radius: 14px;
    background: #fffaf2;
    padding: 1rem;
    display: grid;
    gap: 0.5rem;
}

.intro-card h3 {
    margin: 0 0 0.2rem;
}

.intro-card ul {
    margin: 0;
    padding-left: 1.1rem;
    display: grid;
    gap: 0.25rem;
}

.intro-link {
    justify-self: start;
    margin-top: 0.25rem;
}

.partner-block {
    border: 1px solid #dbc9b2;
    border-radius: var(--radius);
    background: linear-gradient(145deg, #fff9ef, #f7ebdc);
    padding: 1rem;
    display: grid;
    gap: 0.55rem;
}

.partner-block h2 {
    margin-bottom: 0.2rem;
}

.partner-block p {
    margin: 0;
    max-width: 64ch;
}

.partner-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.partner-chip {
    border: 1px solid #d7be98;
    border-radius: 999px;
    background: #fff;
    color: #5a4330;
    padding: 0.28rem 0.62rem;
    font-size: 0.82rem;
    font-weight: 800;
}

.sunday-steps {
    display: grid;
    gap: 0.55rem;
}

.step-card {
    border: 1px solid #e4d6c4;
    border-radius: 12px;
    background: #fff;
    padding: 0.65rem 0.75rem;
    display: grid;
    gap: 0.1rem;
}

.step-card h3 {
    margin: 0;
    font-family: 'Manrope', sans-serif;
    font-size: 1.02rem;
    line-height: 1.25;
}

.step-time {
    margin: 0;
    color: #7f1f33;
    font-weight: 800;
    font-size: 1.03rem;
}

.step-card-highlight {
    background: #fff7ed;
    border-color: #d6b989;
}

.usp-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.usp-item {
    border: 1px solid #decfbc;
    border-radius: 12px;
    background: #fff;
    padding: 0.75rem 0.85rem;
    font-weight: 700;
    color: #493d32;
}

.intro-target-grid {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.intro-target-card {
    border: 1px solid #ddc7aa;
    border-radius: 14px;
    background: #fffaf2;
    padding: 0.9rem;
}

.intro-target-card h3 {
    margin-bottom: 0.55rem;
}

.intro-target-card ul {
    margin: 0;
    padding-left: 1.1rem;
    display: grid;
    gap: 0.2rem;
}

.event-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.event-choice {
    border: 1px solid #d8c8b4;
    border-radius: 14px;
    padding: 0.8rem;
    background: #fff;
    display: flex;
    gap: 0.7rem;
}

.event-choice input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    margin-top: 0.2rem;
}

.event-choice-active {
    border-color: #b6782c;
    background: #fff8ee;
}

.event-choice-locked {
    background: #f3f2f0;
    border-color: #d5d0c8;
    color: #6c655a;
}

.event-choice-content {
    display: grid;
    gap: 0.15rem;
    align-content: start;
}

.event-choice-capacity {
    color: #7f5520;
    font-weight: 700;
    font-size: 0.88rem;
}

.event-lock-hint {
    color: #554f45;
    font-size: 0.83rem;
    font-weight: 700;
}

.event-member-hint {
    color: #7b7468;
    font-size: 0.8rem;
}

.event-preview-list {
    display: grid;
    gap: 0.5rem;
}

.event-preview-item {
    border: 1px dashed #ccbfae;
    border-radius: 12px;
    padding: 0.7rem 0.8rem;
    background: #f8f6f2;
    display: grid;
    gap: 0.15rem;
    color: #5d574e;
}

.event-choice-grid-day {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.option-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.address-legal-note {
    margin: 0;
    font-size: 0.9rem;
    color: #5b5146;
}

.why-sunday-list {
    margin: 0;
    padding-left: 1.15rem;
    display: grid;
    gap: 0.35rem;
}

.option-card {
    border: 1px solid #d9c8b2;
    border-radius: 14px;
    padding: 0.8rem;
    background: #fff;
    display: flex;
    gap: 0.7rem;
}

.option-card input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    margin-top: 0.2rem;
}

.option-card-static {
    display: block;
}

.option-card-static .option-card-content {
    margin-left: 0;
}

.option-card-content {
    display: grid;
    gap: 0.15rem;
}

.option-card.is-selected {
    border-color: #8f5332;
    box-shadow: 0 8px 20px rgba(143, 83, 50, 0.08);
}

.option-card.is-covered {
    background: #fff8ef;
}

.option-price-note {
    color: #8f5332;
    font-size: 0.8rem;
    font-weight: 700;
}

.option-status {
    color: #6e2c22;
    font-weight: 700;
    font-size: 0.84rem;
}

.board-option-line {
    display: grid;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
}

.board-option-form {
    display: grid;
    grid-template-columns: 1.2fr 1.4fr 0.55fr 0.45fr 0.45fr auto;
    gap: 0.45rem;
    align-items: center;
}

.pricing-preview {
    display: grid;
    gap: 0.55rem;
}

.pricing-preview-lines {
    display: grid;
    gap: 0.45rem;
}

.pricing-preview-line {
    display: grid;
    gap: 0.1rem;
    padding: 0.55rem 0.7rem;
    border-radius: 12px;
    background: #f8f1e6;
    color: #4b3426;
}

.pricing-preview-line-note {
    color: #8f5332;
    font-size: 0.8rem;
    font-weight: 700;
}

.board-pricing-rule-grid {
    display: grid;
    gap: 0.45rem;
}

.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.portal-priority-section {
    background: linear-gradient(180deg, #fffdf9, #f8f1e6);
}

.portal-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.7rem;
    flex-wrap: wrap;
}

.portal-jump-link {
    font-size: 0.87rem;
    font-weight: 800;
    color: #574532;
}

.portal-filter-form {
    display: grid;
    gap: 0.7rem;
}

.portal-chip-bar {
    margin: 0;
}

.portal-filter-grid {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: 1fr;
}

.portal-collapsible {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    overflow: hidden;
    padding: 0;
    box-shadow: var(--shadow);
}

.portal-collapsible > summary {
    list-style: none;
    padding: 1rem 1.2rem;
    cursor: pointer;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.portal-collapsible[open] > summary {
    border-bottom: 1px solid #e6d8c5;
}

.portal-collapsible-body {
    padding: 1.05rem 1.2rem 1.2rem;
}

.portal-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 1rem;
}

.portal-mobile-only {
    display: block;
}

.portal-desktop-only {
    display: none;
}

.event-day-groups {
    display: grid;
    gap: 0.9rem;
}

.event-day-group {
    border: 1px solid #e5d9c8;
    border-radius: 14px;
    background: #fff;
    padding: 0.85rem;
    display: grid;
    gap: 0.8rem;
}

.event-day-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.7rem;
    flex-wrap: wrap;
}

.event-day-head h3 {
    margin: 0;
    font-size: 1.05rem;
}

.event-day-head p {
    margin: 0;
    font-size: 0.87rem;
    color: #64584d;
    font-weight: 700;
}

.event-cards {
    display: grid;
    gap: 0.75rem;
}

.event-cards--quick {
    grid-template-columns: 1fr;
}

.event-card {
    border: 1px solid #e4d8c7;
    border-radius: 14px;
    background: #fff;
    padding: 0.85rem;
    display: grid;
    gap: 0.62rem;
}

.event-card--readonly {
    background: #f8f4ee;
}

.event-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.event-card-time {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 800;
    color: #4f2d26;
}

.event-card-title {
    margin: 0;
    font-size: 1rem;
    line-height: 1.3;
    font-family: 'Manrope', sans-serif;
}

.event-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.36rem 0.55rem;
}

.event-card-meta span {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0.16rem 0.5rem;
    background: #f6f0e6;
    color: #605346;
    font-size: 0.79rem;
    font-weight: 700;
}

.event-card-notice {
    margin-top: -0.05rem;
}

.quiet-details {
    background: transparent;
    border: 1px dashed #d8c8b3;
    border-radius: 10px;
    padding: 0.35rem 0.55rem;
}

.quiet-details summary {
    font-size: 0.8rem;
    color: #6b5a47;
}

.quiet-details p {
    margin: 0.35rem 0 0;
    font-size: 0.84rem;
    color: #5c5147;
}

.quiet-details-inline {
    margin-top: 0.35rem;
    max-width: 340px;
}

.portal-table-wrap {
    overflow-x: auto;
}

.portal-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}

.portal-table th,
.portal-table td {
    border-bottom: 1px solid #ebdecb;
    padding: 0.7rem;
    text-align: left;
    vertical-align: top;
}

.portal-table th {
    font-size: 0.9rem;
    color: #4a3e34;
}

.portal-status-cell {
    min-width: 230px;
}

.row-readonly {
    background: #f7f4ef;
    color: #60574d;
}

.att-sel-form {
    display: grid;
    gap: 0.35rem;
}

.att-sel {
    border: 0;
    padding: 0;
    margin: 0;
    min-width: 0;
}

.att-sel-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem;
}

.att-sel-option {
    position: relative;
    min-width: 0;
}

.att-sel-option input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.att-sel-chip {
    min-height: 48px;
    border: 1px solid #d9ccb9;
    border-radius: 12px;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
    padding: 0.35rem 0.25rem;
}

.att-sel-icon {
    font-size: 0.98rem;
    line-height: 1;
}

.att-sel-text {
    font-size: 0.73rem;
    letter-spacing: 0.01em;
}

.att-sel-option input:focus-visible + .att-sel-chip {
    outline: 3px solid var(--focus);
    outline-offset: 2px;
}

.att-sel-option input:checked + .att-sel-chip {
    border-width: 2px;
}

.att-sel-option--coming input:checked + .att-sel-chip {
    background: #edf8f1;
    border-color: #6ca883;
    color: #1f5d37;
}

.att-sel-option--not input:checked + .att-sel-chip {
    background: #fdeef0;
    border-color: #c6727a;
    color: #7f2130;
}

.att-sel-option--unsure input:checked + .att-sel-chip {
    background: #fff7e8;
    border-color: #c6a35f;
    color: #7a6028;
}

.att-sel-option--coming .att-sel-icon {
    color: #2f7d4a;
}

.att-sel-option--not .att-sel-icon {
    color: #9a2f3f;
}

.att-sel-option--unsure .att-sel-icon {
    color: #8b6e2f;
}

.att-sel.is-disabled .att-sel-chip {
    opacity: 0.72;
    cursor: not-allowed;
}

.att-sel-feedback {
    min-height: 1.1rem;
    font-size: 0.79rem;
    font-weight: 700;
    color: #6a5d50;
}

.att-sel-feedback.is-loading {
    color: #7f682f;
}

.att-sel-feedback.is-success {
    color: #21603d;
}

.att-sel-feedback.is-error {
    color: #8d2133;
}

.att-sel-noscript-btn {
    margin-top: 0.2rem;
}

.profile-preview {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 18px;
    border: 1px solid #d8c8b4;
    margin-bottom: 0.8rem;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.15rem 0.55rem;
    border: 1px solid transparent;
}

.status-badge-success {
    background: #ecf9f1;
    border-color: #8fc8a8;
    color: #15573a;
}

.status-badge-warning {
    background: #fff7ea;
    border-color: #d9be8f;
    color: #7a5014;
}

.status-badge-muted {
    background: #f0f0f0;
    border-color: #d1d1d1;
    color: #505050;
}

.status-badge-att-coming {
    background: #edf8f1;
    border-color: #91c6a3;
    color: #1d5c37;
}

.status-badge-att-not {
    background: #fdeff1;
    border-color: #d09ba4;
    color: #772131;
}

.status-badge-att-unsure {
    background: #fff7e8;
    border-color: #d7be8a;
    color: #7d6023;
}

@media (min-width: 768px) {
    .portal-mobile-only {
        display: none;
    }

    .portal-desktop-only {
        display: block;
    }

    .event-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .event-cards--quick {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .portal-filter-grid {
        grid-template-columns: 1fr auto;
        align-items: end;
    }
}

@media (min-width: 1080px) {
    .event-cards--quick {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .portal-table {
        min-width: 0;
    }

    .portal-table-wrap {
        overflow-x: visible;
    }

    .portal-collapsible > summary {
        padding: 0.9rem 1rem;
    }

    .portal-collapsible-body {
        padding: 0.9rem 1rem 1rem;
    }
}

@media (max-width: 990px) {
    .app-nav {
        gap: 0.5rem;
        font-size: 0.92rem;
    }

    .portal-grid {
        grid-template-columns: 1fr;
    }

    .event-choice-grid,
    .option-grid,
    .intro-target-grid,
    .intro-grid,
    .usp-grid {
        grid-template-columns: 1fr;
    }

    .board-option-form {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .legal-header {
        padding: 0.3rem 0;
    }

    .legal-head-inner {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.45rem 0.65rem;
    }

    .legal-head-inner .brand {
        justify-self: auto;
        min-width: 0;
    }

    .legal-head-inner .brand .logo-img {
        width: 180px;
        height: auto;
    }

    .legal-head-inner .brand .brand-text {
        font-size: 0.95rem;
    }

    .legal-head-inner.nav-enhanced .app-nav-toggle {
        display: inline-flex;
        margin-left: auto;
    }

    .legal-head-inner.nav-enhanced .app-nav {
        order: 3;
        width: 100%;
        display: none;
        grid-template-columns: 1fr;
        gap: 0.4rem;
        margin-top: 0.1rem;
        padding: 0.55rem;
        border: 1px solid #d7c3a8;
        border-radius: 14px;
        background: #fff8ee;
        box-shadow: 0 10px 18px rgba(51, 32, 18, 0.12);
    }

    .legal-head-inner.nav-enhanced.is-nav-open .app-nav {
        display: grid;
    }

    .legal-head-inner.nav-enhanced .app-nav a {
        width: 100%;
        justify-content: flex-start;
        min-height: 42px;
        padding: 0.28rem 0.72rem;
        border: 1px solid #d7c3a8;
        border-radius: 10px;
        background: #fff;
        font-size: 0.9rem;
    }

    .home-hero-actions {
        display: grid;
        gap: 0.5rem;
    }

    .home-hero-actions .btn {
        width: 100%;
    }
}

/* Vorstand mobile-first */
.board-offline-hint {
    margin-bottom: 0;
}

.board-tabs {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.35rem;
}

.board-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border: 1px solid #d7c7b0;
    border-radius: 12px;
    background: #fff;
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 800;
    color: #4f4135;
    padding: 0.4rem 0.45rem;
    text-align: center;
}

.board-tab.is-active {
    background: #2f1d16;
    color: #fff;
    border-color: #2f1d16;
}

.board-panel {
    display: none;
}

.board-panel.is-active {
    display: block;
}

.board-panel-head {
    display: grid;
    gap: 0.25rem;
}

.board-panel-head h2 {
    margin-bottom: 0.15rem;
}

.board-panel-head p {
    margin: 0;
    color: #5f554d;
    font-weight: 700;
}

.board-filter-form {
    display: grid;
    gap: 0.75rem;
}

.board-filter-grid {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: 1fr;
}

.board-full-btn {
    width: 100%;
    min-height: 44px;
}

.board-quick-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.board-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    border: 1px solid #d8c8b4;
    border-radius: 999px;
    background: #fff;
    padding: 0.15rem 0.65rem;
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
    color: #5f5248;
}

.board-chip.is-active {
    background: #f8ece0;
    border-color: #b59166;
    color: #5c2e20;
}

.board-checkin-day-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 0.7rem;
    flex-wrap: wrap;
}

.board-checkin-day-head h3 {
    margin: 0;
    font-size: 1.15rem;
}

.board-checkin-day-head p {
    margin: 0;
    color: #5f564d;
    font-weight: 700;
}

.board-counter {
    font-size: 0.93rem;
}

.board-event-cards {
    grid-template-columns: 1fr;
}

.event-badges {
    display: inline-flex;
    gap: 0.3rem;
    flex-wrap: wrap;
}

.board-checkin-details {
    border: 1px solid #e4d7c4;
    border-radius: 12px;
    background: #fcf9f3;
    padding: 0.55rem 0.7rem;
}

.board-checkin-tools {
    display: grid;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.checkin-summary {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 800;
    color: #4f4338;
}

.checkin-bulk-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
}

.checkin-list {
    display: grid;
    gap: 0.55rem;
    margin-top: 0.6rem;
}

.checkin-row {
    border: 1px solid #e0d1bd;
    border-radius: 12px;
    background: #fff;
    padding: 0.6rem;
    display: grid;
    gap: 0.45rem;
}

.checkin-row.is-checked {
    border-color: #8ab499;
    background: #f0f8f3;
}

.checkin-row-main {
    display: grid;
    gap: 0.12rem;
}

.checkin-row-main small {
    color: #61564a;
}

.checkin-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 44px;
    font-weight: 800;
    cursor: pointer;
}

.checkin-toggle input {
    width: 1.2rem;
    height: 1.2rem;
}

.checkin-feedback {
    min-height: 1rem;
    margin: 0;
    font-size: 0.8rem;
    font-weight: 700;
    color: #5f5448;
}

.checkin-feedback.is-loading {
    color: #7a6226;
}

.checkin-feedback.is-success {
    color: #1d6240;
}

.checkin-feedback.is-error {
    color: #8d2133;
}

.member-cards {
    display: grid;
    gap: 0.7rem;
}

.member-card {
    border: 1px solid #dfd1be;
    border-radius: 14px;
    background: #fff;
    padding: 0.8rem;
    display: grid;
    gap: 0.55rem;
}

.member-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
}

.member-card-head h3 {
    margin: 0;
    font-size: 1rem;
}

.member-mail {
    margin: 0;
    font-size: 0.88rem;
    color: #60554a;
}

.member-summary-line {
    margin: 0;
    font-size: 0.82rem;
    font-weight: 700;
    color: #5e5245;
}

.board-member-update-form {
    display: grid;
    gap: 0.4rem;
}

.member-actions {
    display: grid;
    gap: 0.5rem;
    grid-template-columns: 1fr;
}

.member-actions label {
    display: grid;
    gap: 0.25rem;
}

.member-actions select {
    min-height: 44px;
}

.member-update-feedback {
    margin: 0;
    min-height: 1rem;
    font-size: 0.8rem;
    font-weight: 700;
    color: #5f5448;
}

.member-update-feedback.is-loading {
    color: #7a6226;
}

.member-update-feedback.is-success {
    color: #1d6240;
}

.member-update-feedback.is-error {
    color: #8d2133;
}

.board-member-inline-form {
    display: grid;
    gap: 0.4rem;
}

.member-option-list {
    display: grid;
    gap: 0.45rem;
}

.member-option-item {
    border: 1px dashed #deceba;
    border-radius: 10px;
    padding: 0.45rem 0.55rem;
    display: grid;
    gap: 0.28rem;
}

.member-card-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.payments-groups {
    display: grid;
    gap: 0.75rem;
}

.payment-member-card {
    border: 1px solid #dfd1be;
    border-radius: 14px;
    background: #fff;
    padding: 0.8rem;
    display: grid;
    gap: 0.6rem;
}

.payment-member-head h3 {
    margin: 0;
    font-size: 1rem;
}

.payment-member-head p {
    margin: 0.1rem 0 0;
    font-size: 0.87rem;
    color: #61564a;
}

.payment-inline-fields {
    display: grid;
    gap: 0.5rem;
}

.payment-inline-fields label {
    display: grid;
    gap: 0.25rem;
}

.payment-inline-fields input {
    min-height: 44px;
}

.payment-feedback {
    margin: 0;
}

.board-history-cards {
    display: grid;
    gap: 0.6rem;
}

.board-history-card {
    border: 1px solid #e0d3c2;
    border-radius: 12px;
    background: #fff;
    padding: 0.75rem;
    display: grid;
    gap: 0.38rem;
}

.board-history-card h3 {
    margin: 0;
    font-size: 0.98rem;
}

.board-history-card p {
    margin: 0;
    font-size: 0.86rem;
}

.board-option-cards {
    display: grid;
    gap: 0.7rem;
}

.board-option-card {
    border: 1px solid #dfd0bc;
    border-radius: 14px;
    background: #fff;
    padding: 0.85rem;
    display: grid;
    gap: 0.5rem;
}

.board-option-card-new {
    background: #fcf5eb;
}

.board-events-table thead th,
.board-members-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fff;
}

.board-mobile-only {
    display: block;
}

.board-desktop-only {
    display: none;
}

@media (min-width: 768px) {
    .board-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .board-filter-grid .full {
        grid-column: 1 / -1;
    }

    .board-mobile-only {
        display: none;
    }

    .board-desktop-only {
        display: block;
    }

    .board-tab {
        font-size: 0.9rem;
    }

    .board-event-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .member-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .member-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .board-option-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .payment-inline-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .payments-groups {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1080px) {
    .board-event-cards,
    .member-cards,
    .board-option-cards,
    .payments-groups {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .board-tabs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Community + Tanzstile */
.app-nav a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.35rem;
}

.home-quick-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.8rem;
}

.team-grid,
.style-grid,
.level-grid {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: 1fr;
}

.team-card,
.style-card,
.level-card {
    border: 1px solid #ddceb9;
    border-radius: 14px;
    background: #fff;
    box-shadow: var(--shadow);
    padding: 1rem;
    display: grid;
    gap: 0.45rem;
}

.team-card h3,
.style-card h2,
.level-card h2 {
    margin: 0;
}

.team-avatar {
    width: 84px;
    height: 84px;
    border-radius: 999px;
    border: 1px solid #dac9b0;
    background: #f4ede2;
    object-fit: cover;
}

.team-instagram-link {
    margin-top: 0.35rem;
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    width: fit-content;
    min-height: 42px;
    padding: 0.4rem 0.8rem 0.4rem 0.58rem;
    border-radius: 999px;
    text-decoration: none;
    border: 1px solid rgba(131, 58, 180, 0.35);
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(120deg, #f58529 0%, #dd2a7b 45%, #8134af 72%, #515bd4 100%) border-box;
    box-shadow: 0 10px 24px rgba(129, 52, 175, 0.18);
    transition: transform 120ms ease, box-shadow 120ms ease;
}

.team-instagram-link:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(129, 52, 175, 0.24);
}

.team-instagram-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 0.64rem;
    letter-spacing: 0.03em;
    color: #ffffff;
    background: linear-gradient(135deg, #f58529 0%, #dd2a7b 48%, #8134af 78%, #515bd4 100%);
}

.team-instagram-meta {
    display: grid;
    gap: 0.05rem;
    line-height: 1.1;
}

.team-instagram-meta strong {
    font-size: 0.8rem;
    color: #3a2833;
}

.team-instagram-meta small {
    font-size: 0.74rem;
    font-weight: 700;
    color: #72445e;
}

.team-instagram-arrow {
    font-size: 0.9rem;
    font-weight: 800;
    color: #7c2f67;
}

.pill-badge {
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    width: fit-content;
    padding: 0.12rem 0.62rem;
    border-radius: 999px;
    border: 1px solid #cfba9a;
    background: #fff7ea;
    color: #5a402a;
    font-weight: 800;
    font-size: 0.82rem;
}

.mini-faq {
    gap: 0.75rem;
}

.mini-faq details {
    border: 1px solid #ddcfbd;
    border-radius: 12px;
    background: #fff;
    padding: 0.7rem 0.8rem;
}

.mini-faq summary {
    cursor: pointer;
    font-weight: 800;
}

.mini-faq p {
    margin: 0.45rem 0 0;
}

@media (min-width: 768px) {
    .team-grid,
    .style-grid,
    .level-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1080px) {
    .team-grid,
    .style-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Paket F+G */
.info-banner {
    border: 1px solid #dbcab2;
    border-radius: 14px;
    background: #fff8ee;
    box-shadow: var(--shadow);
    padding: 1rem;
}

.flow-steps {
    display: grid;
    gap: 0.45rem;
}

.flow-steps p {
    margin: 0;
}

.onboarding-paths {
    border: 1px solid #d6c4aa;
    border-radius: 14px;
    background: #fffdf8;
}

.onboarding-path-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.65rem;
}

.onboarding-path-card {
    border: 1px solid #d7c5ab;
    border-radius: 12px;
    background: #fff;
    color: #2f2418;
    text-decoration: none;
    padding: 0.8rem;
    display: grid;
    gap: 0.22rem;
    transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.onboarding-path-card strong {
    font-size: 1rem;
}

.onboarding-path-card span {
    font-size: 0.95rem;
}

.onboarding-path-card small {
    color: #5a4a37;
}

.onboarding-path-card:hover {
    border-color: #bb9a71;
    box-shadow: var(--shadow);
    transform: translateY(-1px);
}

.onboarding-path-card.is-active {
    border-color: #a5763d;
    box-shadow: 0 0 0 2px rgba(165, 118, 61, 0.12);
    background: #fff6e8;
}

.cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.cta-row > * {
    min-width: 0;
}

.pricing-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.7rem;
}

.schnupper-form,
.info-banner,
.app-note,
.form-field,
.event-choice,
.event-choice-content,
.option-card,
.option-card-content,
.style-card,
.consent-label {
    min-width: 0;
}

.section-head p,
.training-location,
.app-alert,
.app-note,
.consent-label,
.event-choice-content,
.option-card-content,
.style-card {
    overflow-wrap: anywhere;
}

.next-sunday-block .section-head {
    margin-bottom: 0.2rem;
}

.next-sunday-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.7rem;
}

.location-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    align-items: start;
}

.location-map iframe {
    width: 100%;
    height: 260px;
    border: 0;
    border-radius: 12px;
}

.location-info {
    display: grid;
    gap: 0.65rem;
    align-content: start;
}

.instagram-embed iframe {
    width: 100%;
    height: 480px;
    border: 0;
    border-radius: 12px;
}

.calendar-card .external-embed-frame {
    height: 420px;
}

.instagram-embed .external-embed-frame {
    height: 480px;
}

@media (min-width: 768px) {
    .pricing-grid,
    .next-sunday-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .onboarding-path-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .location-grid {
        grid-template-columns: 1fr;
    }

    .instagram-embed iframe {
        height: 520px;
    }

    .instagram-embed .external-embed-frame {
        height: 520px;
    }
}

@media (max-width: 990px) {
    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .cta-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .cta-row .btn {
        width: 100%;
    }
}