:root,
body.light {
    /* BRAND PALETTE — Pastel Beige + Soft Coral + Mint + Warm Gray */

    --primary: #e9a5a2;
    /* pastel coral rose */
    --on-primary: #ffffff;

    --primary-container: #f7dedd;
    /* pale coral/beige container */
    --on-primary-container: #5a2726;

    --secondary: #b4a694;
    /* warm beige with gray undertones */
    --on-secondary: #ffffff;

    --secondary-container: #f1e9df;
    /* light buttery beige */
    --on-secondary-container: #403a32;

    --tertiary: #9accc2;
    /* pastel mint/turquoise */
    --on-tertiary: #0f2a28;

    --tertiary-container: #dbf4f0;
    /* pale mint */
    --on-tertiary-container: #21433f;

    --error: #d87a82;
    /* soft red/pink (still gentle) */
    --on-error: #ffffff;

    --error-container: #ffd9dd;
    --on-error-container: #4a1015;

    /* BACKGROUND + SURFACES — beige & cream */

    --background: #faf7f2;
    /* soothing beige-cream */
    --on-background: #2d2c29;

    --surface: #fdfaf6;
    --on-surface: #2d2c29;

    --surface-variant: #e8e0d7;
    /* beige variant */
    --on-surface-variant: #5c554d;

    --outline: #a79f96;
    --outline-variant: #d6cec5;

    --shadow: #00000020;
    --scrim: #00000033;

    --inverse-surface: #3c3a37;
    --inverse-on-surface: #f5f1ec;
    --inverse-primary: #bb7774;

    --surface-dim: #e8e3dd;
    --surface-bright: #fefcfb;

    --surface-container-lowest: #ffffff;
    --surface-container-low: #f7f3ef;
    --surface-container: #f2ede8;
    --surface-container-high: #ece7e2;
    --surface-container-highest: #e6e1dc;
}

/* Center all content */
.snoezel-hero {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100vh;
}

/* Default: desktop/tablet – text left, logo right */
.snoezel-text {
    order: 1;
}

.snoezel-logo {
    order: 2;
}

.snoezel-socials {
    order: 3;
}

/* Mobile: logo on top, text under */
@media (max-width: 600px) {
    .snoezel-logo {
        order: 1;
    }

    .snoezel-text {
        order: 2;
    }
}

.fredoka-light {
    font-family: "Fredoka", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}

.fredoka-regular {
    font-family: "Fredoka", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.fredoka-medium {
    font-family: "Fredoka", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}

.fredoka-semibold {
    font-family: "Fredoka", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
}

.fredoka-bold {
    font-family: "Fredoka", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}