/**
 * Equino homepage — zelfde palet als training / klusjes / inventaris
 */

/* Zelfde tokens als klusjes / training (.jobs-page, .training-discipline-page) */
:root {
    --eq-ink: #3d3428;
    --eq-muted: #6b5e4f;
    --eq-parchment: #f8f1e4;
    --eq-parchment-deep: #efe4d4;
    --eq-surface: #fffef9;
    --eq-border: #e6dccb;
    --eq-border-soft: #e0d9bc;
    --eq-accent: #8b6914;
    --eq-accent-dark: #5c3610;
    --eq-link: #5c3610;
    --eq-topbar: #c09b6c;
    --eq-topbar-dark: #a8845a;
    --eq-canvas: #e8dfd0;
    --eq-shadow: rgba(90, 70, 40, 0.12);
    --eq-panel-shadow: 0 2px 12px rgba(90, 70, 40, 0.08);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    margin: 0;
    padding: 0;
    font-size: 16px;
    scroll-behavior: smooth;
}

body.eq-landing {
    margin: 0;
    padding: 0;
    font-family: "Nunito", "Poppins", system-ui, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.45;
    color: var(--eq-ink);
    background-color: var(--eq-canvas);
    overflow-x: hidden;
}

body.eq-landing main {
    overflow: visible;
}

/* Rasafbeeldingen uit images/horses/full — decoratief, mag over randen */
.eq-landing-breed-figure {
    display: block;
    width: auto;
    max-width: none;
    height: auto;
    pointer-events: none;
    user-select: none;
    filter: drop-shadow(0 8px 18px rgba(61, 52, 40, 0.22));
}

body.eq-landing main h1,
body.eq-landing main h2,
body.eq-landing main h3,
body.eq-landing main h4,
body.eq-landing main h5,
body.eq-landing main h6 {
    font-family: "Nunito", "Poppins", system-ui, sans-serif;
    font-weight: 700;
    color: var(--eq-ink);
    line-height: 1.25;
    margin: 0 0 0.75rem;
}

body.eq-landing main p {
    color: var(--eq-muted);
    margin: 0 0 1rem;
}

body.eq-landing main a:not(.eq-landing-btn):not(.eq-landing-nav__brand) {
    color: var(--eq-link);
    font-weight: 600;
    transition: color 0.15s ease;
}

body.eq-landing main a:not(.eq-landing-btn):not(.eq-landing-nav__brand):hover,
body.eq-landing main a:not(.eq-landing-btn):not(.eq-landing-nav__brand):focus {
    color: var(--eq-accent-dark);
}

body.eq-landing img {
    max-width: 100%;
    height: auto;
}

.eq-landing-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-left: max(1.25rem, env(safe-area-inset-left));
    padding-right: max(1.25rem, env(safe-area-inset-right));
}

/* Header — zelfde tint als ingame topbar */
.eq-landing-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: linear-gradient(180deg, var(--eq-topbar) 0%, var(--eq-topbar-dark) 100%);
    border-bottom: 1px solid rgba(61, 52, 40, 0.18);
    box-shadow: 0 2px 10px var(--eq-shadow);
}

.eq-landing-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 58px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 8px max(1.25rem, env(safe-area-inset-left)) 8px max(1.25rem, env(safe-area-inset-right));
}

.eq-landing-nav__brand img {
    display: block;
    max-height: 38px;
    width: auto;
}

.eq-landing-nav__links {
    display: flex;
    align-items: center;
    gap: 4px;
}

.eq-landing-nav__links a {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    padding: 8px 12px;
    border-radius: 999px;
}

.eq-landing-nav__links a:hover,
.eq-landing-nav__links a:focus {
    color: #fff;
    background: rgba(61, 52, 40, 0.18);
}

.eq-landing-nav__toggle {
    display: none;
}

.eq-landing-nav__toggle-label {
    display: none;
    cursor: pointer;
    padding: 8px;
}

.eq-landing-nav__toggle-label span {
    display: block;
    width: 22px;
    height: 2px;
    margin: 5px 0;
    background: #fff;
    border-radius: 2px;
}

/* Intro — landschap (molen) bovenaan zichtbaar, meer kleur links */
.eq-landing-intro {
    position: relative;
    overflow: visible;
    min-height: clamp(440px, 52vh, 580px);
    padding: 2rem 0 3.5rem;
    border-bottom: 1px solid var(--eq-border);
    background-color: #d4c4a8;
}

.eq-landing-intro::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: url("/images/background2_sand.jpg");
    background-repeat: no-repeat;
    background-position: 50% 0;
    background-size: cover;
    filter: saturate(1.22) contrast(1.06) brightness(1.04);
}

.eq-landing-intro::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    /* Links: landschap zichtbaar; rechts: voldoende dekking achter formulier */
    background: linear-gradient(
        102deg,
        rgba(255, 254, 249, 0.12) 0%,
        rgba(255, 254, 249, 0.28) 38%,
        rgba(247, 243, 238, 0.72) 58%,
        rgba(239, 228, 212, 0.9) 78%,
        rgba(239, 228, 212, 0.94) 100%
    );
}

.eq-landing-intro__grid {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2rem 2.5rem;
}

.eq-landing-intro__copy {
    flex: 1 1 300px;
    min-width: 0;
    max-width: 540px;
    padding: 1.25rem 1.35rem;
    border-radius: 14px;
    border: 1px solid rgba(224, 217, 188, 0.85);
    background: rgba(255, 254, 249, 0.92);
    box-shadow: 0 2px 14px rgba(42, 34, 24, 0.08);
}

.eq-landing-intro__title {
    font-size: clamp(1.85rem, 4.5vw, 2.5rem);
    font-weight: 800;
    letter-spacing: 0.01em;
    color: var(--eq-ink);
    margin-bottom: 0.75rem;
}

.eq-landing-intro__lead {
    font-size: 1.05rem;
    line-height: 1.6;
    color: var(--eq-muted);
    margin-bottom: 1.25rem;
}

.eq-landing-intro__stat {
    display: inline-block;
    padding: 0.6rem 1rem;
    border-radius: 12px;
    border: 1px solid var(--eq-border-soft);
    background: var(--eq-surface);
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--eq-ink);
    line-height: 1.5;
    box-shadow: 0 1px 4px rgba(42, 34, 24, 0.06);
    margin: 0;
}

.eq-landing-intro__stat strong {
    color: var(--eq-link);
    font-weight: 800;
    margin: 0 0.25em;
}

.eq-landing-eyebrow {
    display: block;
    margin: 0 0 0.5rem;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--eq-link);
}

.eq-landing-eyebrow--light {
    color: var(--eq-link);
}

/* Auth card — zelfde gevoel als training-discipline panel */
.eq-landing-intro .Registerform,
.Registerform.eq-auth-card {
    flex: 0 1 440px;
    width: 100%;
    max-width: 440px;
    margin: 0;
    padding: 1.5rem 1.75rem 1.75rem;
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: var(--eq-parchment);
    box-shadow: 0 2px 12px var(--eq-shadow);
    overflow: visible;
}

.Registerform h3 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--eq-ink);
    margin-bottom: 0.25rem;
}

.Registerform > p {
    font-size: 0.95rem;
    color: var(--eq-muted);
    margin-bottom: 1.25rem;
}

/* Formulierkaart: voldoende contrast op alle achtergronden */
.Registerform.eq-auth-card {
    background: var(--eq-surface);
    border-color: var(--eq-border-soft);
}

.Registerform .input_detail label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--eq-ink);
    margin-bottom: 6px;
}

.Registerform .input_detail .name {
    margin-bottom: 12px;
}

.Registerform .input_detail .name-input-wrap {
    position: relative;
    width: 100%;
}

.Registerform .input_detail .name-input-wrap > span {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    line-height: 0;
    z-index: 2;
    pointer-events: none;
}

.Registerform .input_detail .name-input-wrap > span svg path {
    fill: var(--eq-muted);
}

.Registerform .input_detail input {
    width: 100%;
    height: 46px;
    margin: 0;
    padding: 0 14px 0 44px;
    border-radius: 10px;
    border: 1px solid var(--eq-border-soft);
    background: var(--eq-surface);
    color: var(--eq-ink);
    font-size: 15px;
    font-family: inherit;
    box-shadow: inset 0 1px 2px rgba(90, 70, 40, 0.06);
}

.Registerform .input_detail input::placeholder {
    color: #75685a;
}

.Registerform .input_detail input:focus {
    outline: none;
    border-color: rgba(139, 105, 20, 0.55);
    box-shadow:
        inset 0 1px 2px rgba(90, 70, 40, 0.06),
        0 0 0 3px rgba(139, 105, 20, 0.15);
}

.Registerform .agreed {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}

.Registerform .agreed input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    flex-shrink: 0;
    accent-color: var(--eq-accent-dark);
}

.Registerform .agreed span {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    color: var(--eq-muted);
}

.Registerform .agreed span a {
    color: var(--eq-link);
    font-weight: 700;
}

.Registerform .register_btn {
    margin: 0 0 12px;
}

.Registerform .register_btn button,
.eq-landing-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    padding: 10px 20px;
    border: 1px solid #4a2e0c;
    border-radius: 999px;
    background: linear-gradient(180deg, #8a5620 0%, #5c3610 100%);
    color: #fff !important;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    box-shadow:
        0 2px 8px rgba(70, 42, 15, 0.42),
        0 1px 0 rgba(255, 255, 255, 0.25) inset;
    transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

.Registerform .register_btn button:hover,
.Registerform .register_btn button:focus,
.eq-landing-btn:hover,
.eq-landing-btn:focus {
    transform: translateY(-1px);
    background: linear-gradient(180deg, #ebb73d 0%, #c58500 100%);
    border-color: #9a6b12;
    color: #fff !important;
    outline: none;
    filter: brightness(1.03);
}

.Registerform .registernow p {
    margin: 0;
    text-align: center;
    font-size: 14px;
    color: var(--eq-muted);
}

.Registerform .registernow p a {
    font-weight: 700;
    color: var(--eq-link);
}

.Registerform .help-block,
.Registerform .input_detail .help-block {
    display: block;
    margin-top: 4px;
    font-size: 13px;
    color: #a33b2a !important;
}

.Registerform .eq-forgot-link {
    display: block;
    text-align: center;
    margin: 8px 0 12px;
    font-size: 14px;
    color: var(--eq-link);
    text-decoration: none;
    font-weight: 700;
}

.Registerform .eq-flash,
.Registerform .alert {
    margin-bottom: 14px;
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid var(--eq-border-soft);
    background: var(--eq-surface);
    color: var(--eq-ink);
    font-size: 14px;
}

.Registerform .col_full {
    margin-bottom: 12px;
}

/* Stats — perkamentstrook met één topbar-accent (geen tweede tan-balk) */
.eq-landing-stats {
    position: relative;
    overflow: visible;
    padding: 1.75rem 0;
    background: var(--eq-parchment);
    border-top: 4px solid var(--eq-topbar);
    border-bottom: 1px solid var(--eq-border);
}

.eq-landing-stats__wrap {
    position: relative;
}

/* Fries kijkt over de stats-balk (onder het formulier) */
.eq-landing-stats__peek {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 4;
    pointer-events: none;
    transform: translateY(-62%);
}

.eq-landing-stats__horse {
    width: auto;
    max-width: none;
    max-height: clamp(130px, 22vw, 220px);
    transform: translateX(8%);
}

.eq-landing-stats__wrap:has(.eq-landing-stats__peek) .eq-landing-stats__grid {
    padding-right: clamp(4.5rem, 16vw, 10rem);
}

.eq-landing-intro .Registerform {
    position: relative;
    z-index: 3;
}

.eq-landing-stats__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 640px) {
    .eq-landing-stats__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem 1.25rem;
    }
}

.eq-landing-stat {
    text-align: center;
    padding: 1rem 0.75rem;
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: var(--eq-surface);
    box-shadow: var(--eq-panel-shadow);
}

.eq-landing-stat__value {
    display: block;
    font-size: clamp(1.35rem, 3vw, 1.75rem);
    font-weight: 800;
    color: var(--eq-link);
    line-height: 1.2;
    margin-bottom: 0.35rem;
}

.eq-landing-stat__label {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--eq-muted);
}

/* Sectiekoppen */
.eq-landing-section-head {
    max-width: 640px;
    margin-bottom: 2rem;
}

.eq-landing-section-head--center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.eq-landing-section-head__title {
    font-size: clamp(1.4rem, 3vw, 1.85rem);
    margin-bottom: 0.65rem;
}

.eq-landing-section-head__lead {
    margin: 0;
    font-size: 1.05rem;
    line-height: 1.55;
    color: var(--eq-muted);
}

.eq-landing-section-head__title,
.eq-landing-section-head .eq-landing-eyebrow {
    color: var(--eq-ink);
}

.eq-landing-section-head .eq-landing-eyebrow {
    color: var(--eq-link);
}

/* Feature-grid */
.eq-landing-features {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 600px) {
    .eq-landing-features {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
    }
}

@media (min-width: 960px) {
    .eq-landing-features {
        grid-template-columns: repeat(4, 1fr);
    }
}

.eq-landing-feature {
    padding: 1.35rem 1.25rem;
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: var(--eq-surface);
    box-shadow: var(--eq-panel-shadow);
    text-align: center;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.eq-landing-feature:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(90, 70, 40, 0.14);
}

/* Zelfde icoon-stijl als klusjes-jobcards, gecentreerd in de kaart */
.eq-landing-feature__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin: 0 auto 0.85rem;
    border-radius: 12px;
    border: 1px solid rgba(90, 72, 50, 0.12);
    background: rgba(255, 255, 255, 0.55);
}

.eq-landing-feature__icon img,
.eq-landing-feature__icon-svg {
    width: 46px;
    height: 46px;
    max-width: 46px;
    max-height: 46px;
    object-fit: contain;
}

.eq-landing-feature__icon-svg {
    display: block;
}

.eq-landing-feature__title {
    font-size: 1.1rem;
    margin-bottom: 0.4rem;
    color: var(--eq-ink);
}

.eq-landing-feature__text {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--eq-muted);
}

/* Rassensectie — paarden uit het spel, afwisselend gespiegeld */
.eq-landing-showcase {
    overflow: visible;
}

.eq-landing-showcase__wrap {
    overflow: visible;
}

.eq-landing-showcase__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.5rem 2rem;
    overflow: visible;
}

.eq-landing-showcase__copy {
    flex: 1 1 260px;
    min-width: 0;
    position: relative;
    z-index: 2;
}

.eq-landing-showcase__title {
    font-size: clamp(1.35rem, 3vw, 1.75rem);
    margin-bottom: 0.75rem;
    color: var(--eq-ink);
}

.eq-landing-showcase__copy p {
    margin-bottom: 1.25rem;
    color: var(--eq-muted);
}

.eq-landing-showcase__stage {
    flex: 1 1 260px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 0;
    width: fit-content;
    max-width: 100%;
    min-height: clamp(130px, 18vw, 175px);
    margin: 0 auto;
    padding: 0;
    overflow: visible;
}

.eq-landing-showcase__breed {
    flex: 0 0 auto;
    width: auto;
    max-height: clamp(95px, 14vw, 150px);
    margin-left: clamp(-6.5rem, -28vw, -4rem);
    transform-origin: bottom center;
}

.eq-landing-showcase__breed--flip {
    transform: scaleX(-1);
}

/* Kudde: sterk overlap, alleen spiegelen (geen rotate) */
.eq-landing-showcase__breed--1 {
    z-index: 1;
    margin-left: 0;
    max-height: clamp(86px, 12vw, 132px);
}

.eq-landing-showcase__breed--2 {
    z-index: 3;
    margin-left: clamp(-7.5rem, -35vw, -4.75rem);
}

.eq-landing-showcase__breed--3 {
    position: relative;
    z-index: 6;
    margin-left: clamp(-7.75rem, -36vw, -5rem);
    max-height: clamp(108px, 16vw, 168px);
    transform: translateY(-5px);
}

.eq-landing-showcase__breed--3.eq-landing-showcase__breed--flip {
    transform: scaleX(-1) translateY(-5px);
}

.eq-landing-showcase__breed--4 {
    z-index: 3;
    margin-left: clamp(-7.5rem, -35vw, -4.75rem);
}

.eq-landing-showcase__breed--5 {
    z-index: 1;
    margin-left: clamp(-7.5rem, -35vw, -4.75rem);
    max-height: clamp(86px, 12vw, 132px);
}

/* Stappen */
.eq-landing-steps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: none;
}

@media (min-width: 768px) {
    .eq-landing-steps {
        grid-template-columns: repeat(3, 1fr);
        gap: 1.5rem;
    }
}

.eq-landing-step {
    position: relative;
    padding: 1.5rem 1.25rem 1.25rem;
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: var(--eq-surface);
    box-shadow: var(--eq-panel-shadow);
}

.eq-landing-step__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin-bottom: 0.75rem;
    border-radius: 50%;
    background: linear-gradient(180deg, #8a5620 0%, #5c3610 100%);
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
}

.eq-landing-step__title {
    font-size: 1.05rem;
    margin-bottom: 0.35rem;
}

.eq-landing-step__title {
    color: var(--eq-ink);
}

.eq-landing-step p {
    margin: 0;
    font-size: 0.92rem;
    color: var(--eq-muted);
}

/* Checklist */
.eq-landing-checklist {
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.eq-landing-checklist li {
    position: relative;
    padding-left: 1.5rem;
    margin-bottom: 0.5rem;
    font-size: 0.95rem;
    color: var(--eq-muted);
    line-height: 1.45;
}

.eq-landing-checklist li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--eq-accent-dark);
    font-weight: 700;
}

.eq-landing-checklist--compact {
    margin-bottom: 1.25rem;
}

/* Secties — afwisseling zand (canvas) ↔ één perkamentband, niet overal panels */
.eq-landing-section {
    padding: 3.25rem 0;
}

.eq-landing-section--canvas {
    background: var(--eq-canvas);
}

.eq-landing-section--parchment {
    background: var(--eq-parchment);
    border-top: 1px solid var(--eq-border);
    border-bottom: 1px solid var(--eq-border);
}

/* @deprecated alias — zelfde als canvas */
.eq-landing-section--surface {
    background: var(--eq-canvas);
}

.eq-landing-section--surface + .eq-landing-section--surface,
.eq-landing-section--canvas + .eq-landing-section--canvas {
    padding-top: 0;
}

.eq-landing-section--parchment + .eq-landing-section--parchment {
    border-top: none;
}

/* CTA — zand + één panel, geen extra perkamentvlak */
.eq-landing-cta-band {
    padding: 3rem 0;
    background: var(--eq-canvas);
}

.eq-landing-cta-band .eq-landing-cta {
    padding: 2rem 1.75rem;
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: linear-gradient(165deg, var(--eq-surface) 0%, var(--eq-parchment) 100%);
    box-shadow: var(--eq-panel-shadow);
}

/* Expliciete tekstkleuren per sectie (voorkomt vervaging op lichte tinten) */
.eq-landing-section h2,
.eq-landing-section h3 {
    color: var(--eq-ink);
}

.eq-landing-section p,
.eq-landing-section li {
    color: var(--eq-muted);
}

/* Intro staat buiten <main> — zelfde typografie als content */
body.eq-landing .eq-landing-intro h1 {
    color: var(--eq-ink);
}

body.eq-landing .eq-landing-intro p {
    color: var(--eq-muted);
}

.eq-landing-panel {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2rem;
    padding: 1.75rem;
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: var(--eq-surface);
    box-shadow: var(--eq-panel-shadow);
}

/* App-download: één panel op zand, geen volledige witte sectie */
.eq-landing-app.eq-landing-section--canvas .eq-landing-download {
    padding: 1.75rem;
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: var(--eq-surface);
    box-shadow: var(--eq-panel-shadow);
}

.eq-landing-panel__content {
    flex: 1 1 280px;
    min-width: 0;
}

.eq-landing-panel__title {
    font-size: clamp(1.35rem, 3vw, 1.75rem);
    margin-bottom: 0.75rem;
}

.eq-landing-panel__title {
    color: var(--eq-ink);
}

.eq-landing-panel__text {
    font-size: 1rem;
    line-height: 1.55;
    color: var(--eq-muted);
}

.eq-landing-panel .eq-landing-eyebrow {
    color: var(--eq-link);
}

.eq-landing-panel__media {
    flex: 0 1 280px;
    position: relative;
    min-height: 180px;
    text-align: center;
    overflow: visible;
}

.eq-landing-panel__horse {
    max-height: 200px;
    margin: 0 auto;
}

.eq-landing-cta {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}

.eq-landing-cta__title {
    font-size: clamp(1.35rem, 3vw, 1.65rem);
    color: var(--eq-ink);
}

.eq-landing-cta__text {
    margin-bottom: 1.5rem;
    color: var(--eq-muted);
}

.eq-landing-cta-band .eq-landing-cta__title {
    color: var(--eq-ink);
}

.eq-landing-cta-band .eq-landing-cta__text {
    color: var(--eq-muted);
}

.eq-landing-btn--inline {
    width: auto;
    min-width: 240px;
    margin: 0 auto;
    text-decoration: none;
}

.eq-landing-download {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2rem;
}

.eq-landing-download__copy {
    flex: 1 1 280px;
}

.eq-landing-download__title {
    font-size: clamp(1.25rem, 3vw, 1.6rem);
    color: var(--eq-ink);
}

.eq-landing-download__copy p {
    color: var(--eq-muted);
}

.eq-landing-download__copy .eq-landing-eyebrow {
    color: var(--eq-link);
}

.eq-landing-store-badges {
    display: flex;
    flex-flow: row wrap;
    align-items: stretch;
    gap: 12px;
    margin-top: 0.25rem;
}

/* Vaste tegel — overschrijft body.eq-landing img { height: auto } */
.eq-landing-store-badges a {
    display: block;
    flex: 0 0 180px;
    width: 180px;
    height: 56px;
    border-radius: 10px;
    overflow: hidden;
    line-height: 0;
    background: #1a1208;
    box-shadow: 0 1px 4px rgba(42, 34, 24, 0.1);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.eq-landing-store-badges a:hover,
.eq-landing-store-badges a:focus {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(42, 34, 24, 0.14);
}

.eq-landing-store-badges a img {
    display: block;
    width: 180px;
    height: 56px;
    max-width: none;
    max-height: none;
    object-fit: cover;
    object-position: center center;
}

@media (max-width: 420px) {
    .eq-landing-store-badges {
        flex-direction: column;
        align-items: flex-start;
    }

    .eq-landing-store-badges a,
    .eq-landing-store-badges a img {
        width: min(180px, 100%);
    }
}

.eq-landing-download__phone {
    flex: 0 1 260px;
    text-align: center;
}

.eq-landing-download__phone img {
    max-height: 320px;
}

/* Footer — donkere achtergrond, lichte leesbare tekst */
.eq-landing-footer {
    --eq-footer-bg-top: #5c3610;
    --eq-footer-bg-bottom: #3d2810;
    --eq-footer-heading: #ffffff;
    --eq-footer-text: #f8f2e8;
    --eq-footer-text-muted: #e8dcc8;
    --eq-footer-link: #f5d78a;
    --eq-footer-link-hover: #ffe9a8;

    padding: 2.75rem 0 1.75rem;
    background: linear-gradient(180deg, var(--eq-footer-bg-top) 0%, var(--eq-footer-bg-bottom) 100%);
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    color: var(--eq-footer-text);
}

.eq-landing-footer a {
    color: var(--eq-footer-link);
    font-weight: 600;
    text-decoration: none;
}

.eq-landing-footer a:hover,
.eq-landing-footer a:focus {
    color: var(--eq-footer-link-hover);
    text-decoration: underline;
}

/* Overschrijf globale main-typografie — footer staat buiten <main> */
body.eq-landing .eq-landing-footer h5 {
    color: var(--eq-footer-heading);
    font-weight: 800;
}

body.eq-landing .eq-landing-footer p {
    color: var(--eq-footer-text);
}

.eq-landing-footer__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem 2.5rem;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.eq-landing-footer__brand img {
    max-height: 42px;
    margin-bottom: 14px;
}

.eq-landing-footer__brand > p:not(.eq-landing-footer__note) {
    color: var(--eq-footer-text);
    max-width: 300px;
    font-size: 15px;
    line-height: 1.55;
    margin-bottom: 0;
}

.eq-landing-footer__note {
    margin-top: 0.85rem;
    font-size: 13px !important;
    color: var(--eq-footer-text-muted) !important;
    line-height: 1.5;
}

.eq-landing-footer__col h5 {
    color: var(--eq-footer-heading);
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 0.85rem;
}

.eq-landing-footer__col p {
    color: var(--eq-footer-text);
    font-size: 15px;
    line-height: 1.55;
    margin-bottom: 0.4rem;
}

.eq-landing-footer__col p a {
    color: var(--eq-footer-link);
}

.eq-landing-footer__legal {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.75rem;
    padding-top: 1.35rem;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    font-size: 14px;
}

.eq-landing-footer__legal a {
    color: var(--eq-footer-text-muted);
    font-weight: 600;
}

.eq-landing-footer__legal a:hover,
.eq-landing-footer__legal a:focus {
    color: var(--eq-footer-link-hover);
}

/* Mobile nav */
@media (max-width: 640px) {
    .eq-landing-nav__toggle-label {
        display: block;
    }

    .eq-landing-nav__links {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        background: var(--eq-topbar-dark);
        border-bottom: 1px solid rgba(61, 52, 40, 0.2);
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.25s ease;
    }

    .eq-landing-nav__links a {
        border-radius: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }

    .eq-landing-nav__toggle:checked ~ .eq-landing-nav__links {
        max-height: 280px;
    }

    .eq-landing-intro {
        min-height: clamp(380px, 48vh, 480px);
        padding-top: 1.25rem;
        padding-bottom: 2.5rem;
    }

    .eq-landing-intro::before {
        /* Op smal scherm iets meer horizon/molen in beeld */
        background-position: 42% 0;
        background-size: cover;
    }

    .eq-landing-stats__peek {
        transform: translateY(-48%);
        right: -0.5rem;
    }

    .eq-landing-stats__horse {
        max-height: 105px;
        transform: translateX(12%);
    }

    .eq-landing-stats__wrap:has(.eq-landing-stats__peek) .eq-landing-stats__grid {
        padding-right: 3.5rem;
    }

    .eq-landing-showcase__stage {
        flex-wrap: nowrap;
        min-height: 108px;
        transform: scale(0.86);
        transform-origin: bottom center;
    }

    .eq-landing-showcase__breed {
        max-height: 76px;
        margin-left: -2.85rem;
    }

    .eq-landing-showcase__breed--2,
    .eq-landing-showcase__breed--3,
    .eq-landing-showcase__breed--4,
    .eq-landing-showcase__breed--5 {
        margin-left: -3.15rem;
    }

    .eq-landing-showcase__breed--3 {
        max-height: 86px;
        transform: translateY(-3px);
    }

    .eq-landing-showcase__breed--3.eq-landing-showcase__breed--flip {
        transform: scaleX(-1) translateY(-3px);
    }

    .eq-landing-showcase__breed--1,
    .eq-landing-showcase__breed--5 {
        max-height: 70px;
    }

    .eq-landing-showcase__breed--1 {
        margin-left: 0;
    }

    .eq-landing-intro__grid {
        flex-direction: column;
    }

    .eq-landing-intro .Registerform {
        max-width: 100%;
        order: -1;
    }

    .eq-landing-nav__links a {
        font-size: 13px;
        padding: 12px 16px;
    }
}

@media (min-width: 900px) {
    .eq-landing-intro {
        min-height: clamp(480px, 58vh, 620px);
    }

    .eq-landing-intro__grid {
        gap: 3rem;
    }

    .eq-landing-intro__copy {
        padding-top: 1.5rem;
    }
}

/* Juridische pagina's (privacy, voorwaarden) */
.eq-legal-page {
    padding: 2rem 0 3rem;
    background: var(--eq-canvas);
}

.eq-legal-page__article {
    max-width: 800px;
    margin: 0 auto;
    padding: 1.75rem 1.5rem;
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: var(--eq-surface);
    box-shadow: var(--eq-panel-shadow);
}

.eq-legal-page__article h1 {
    font-size: clamp(1.5rem, 3vw, 1.85rem);
    margin-bottom: 0.5rem;
}

.eq-legal-page__article h2 {
    font-size: 1.2rem;
    margin-top: 1.5rem;
}

.eq-legal-page__article h3,
.eq-legal-page__article h4 {
    font-size: 1.05rem;
    margin-top: 1.1rem;
}

.eq-legal-page__meta {
    margin: 0 0 1.25rem;
    font-size: 0.9rem;
    color: var(--eq-muted);
    font-style: italic;
}

.eq-legal-page__address {
    margin-top: 1rem;
    font-style: normal;
    line-height: 1.6;
    color: var(--eq-muted);
}

.eq-legal-page__iframe {
    display: block;
    width: 100%;
    min-height: 70vh;
    border: 1px solid var(--eq-border);
    border-radius: 10px;
    background: #fff;
}

.eq-legal-page__footer-links {
    justify-content: center;
    gap: 1.25rem;
    padding: 1.5rem 0;
}

/* Juridische modals */
body.eq-legal-modal-open {
    overflow: hidden;
}

.eq-legal-open {
    display: inline;
    margin: 0;
    padding: 0;
    border: none;
    background: none;
    font: inherit;
    font-weight: 600;
    color: var(--eq-link);
    text-decoration: underline;
    cursor: pointer;
    vertical-align: baseline;
}

.eq-legal-open:hover,
.eq-legal-open:focus {
    color: var(--eq-accent-dark);
}

.Registerform .agreed .eq-legal-open {
    font-size: inherit;
}

.eq-landing-footer__legal .eq-legal-open {
    color: rgba(255, 252, 245, 0.92);
    text-decoration: underline;
}

.eq-landing-footer__legal .eq-legal-open:hover,
.eq-landing-footer__legal .eq-legal-open:focus {
    color: #fff;
}

.eq-legal-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
}

.eq-legal-modal[hidden] {
    display: none;
}

.eq-legal-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(61, 52, 40, 0.55);
}

.eq-legal-modal__dialog {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    width: min(920px, 100%);
    max-height: min(90vh, 820px);
    border-radius: 14px;
    border: 1px solid var(--eq-border);
    background: var(--eq-surface);
    box-shadow: 0 12px 40px rgba(61, 52, 40, 0.28);
    overflow: hidden;
}

.eq-legal-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: linear-gradient(180deg, var(--eq-topbar) 0%, var(--eq-topbar-dark) 100%);
    border-bottom: 1px solid rgba(61, 52, 40, 0.2);
}

.eq-legal-modal__title {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
}

.eq-legal-modal__close {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease;
}

.eq-legal-modal__close:hover,
.eq-legal-modal__close:focus {
    background: rgba(255, 255, 255, 0.28);
}

.eq-legal-modal__toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    padding: 0.65rem 1.25rem;
    border-bottom: 1px solid var(--eq-border-soft);
    background: var(--eq-parchment);
}

.eq-legal-modal__meta {
    font-size: 0.88rem;
    color: var(--eq-muted);
    font-style: italic;
}

.eq-legal-modal__link {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--eq-link);
    text-decoration: none;
}

.eq-legal-modal__link:hover,
.eq-legal-modal__link:focus {
    color: var(--eq-accent-dark);
    text-decoration: underline;
}

.eq-legal-modal__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background: var(--eq-surface);
}

.eq-legal-modal__body--prose {
    padding: 1.25rem 1.35rem;
}

.eq-legal-modal__body--prose h2 {
    font-size: 1.1rem;
    margin-top: 1.35rem;
}

.eq-legal-modal__body--prose h3,
.eq-legal-modal__body--prose h4 {
    font-size: 1rem;
    margin-top: 1rem;
}

.eq-legal-modal__body--prose p,
.eq-legal-modal__body--prose li {
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--eq-muted);
}

.eq-legal-modal__body--prose ul {
    margin: 0 0 1rem;
    padding-left: 1.35rem;
}

.eq-legal-modal__body--prose li {
    margin-bottom: 0.35rem;
}

.eq-legal-page__article ul {
    margin: 0 0 1rem;
    padding-left: 1.35rem;
}

.eq-legal-page__article li {
    margin-bottom: 0.35rem;
    color: var(--eq-muted);
    line-height: 1.55;
}

.eq-legal-modal__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem 1rem;
    padding: 0.85rem 1.25rem;
    border-top: 1px solid var(--eq-border);
    background: var(--eq-parchment);
}

.eq-legal-modal__btn-close {
    margin: 0;
}

@media (max-width: 640px) {
    .eq-legal-modal {
        padding: 0.5rem;
    }

    .eq-legal-modal__dialog {
        max-height: 94vh;
        border-radius: 12px;
    }

    .eq-legal-modal__iframe {
        min-height: 50vh;
    }

    .eq-legal-modal__footer {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .eq-legal-modal__footer .eq-landing-btn {
        width: 100%;
        text-align: center;
    }
}