:root {
    /* FILTRIX palette */
    --bg: #0b1d2d;
    /* deep navy */
    --fg: #ffffff;
    /* high-contrast white */
    --cyan: #2bb7da;
    /* primary accent */
    --blue: #147ca3;
    /* secondary blue accent */
    --orange: #f28c28;
    /* CTA/important */
}

* {
    box-sizing: border-box;
}

html,
body {
    height: 100%;
}

html {
    background: var(--bg);
}

body {
    margin: 0;
    background: radial-gradient(circle at 50% 40%, #0e253c 0%, #0b1d33 40%, var(--bg) 100%);
    color: var(--fg);
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
    line-height: 1.5;
    min-height: 100vh;
    overflow: hidden;
    display: grid;
    place-items: center;
}

h1 {
    font-family: Orbitron, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
}

h1 {
    font-size: clamp(32px, 6vw, 56px);
    margin: 8px 0 12px;
    letter-spacing: -0.02em;
}

/* removed legacy .container/.brand/.btn/.footer */

/* Force brand-consistent dark theme; no light-mode override */

/* Coming Soon layout — geometric shapes and subscribe form */
.shape {
    position: absolute;
    width: 30vw;
    height: 30vh;
    pointer-events: none;
}

.shape.top-right {
    top: 0;
    right: 0;
    background: var(--cyan);
    opacity: 0.25;
    clip-path: polygon(100% 0%, 0% 0%, 100% 100%);
}

.shape.bottom-left {
    bottom: 0;
    left: 0;
    background: var(--blue);
    opacity: 0.20;
    clip-path: polygon(0% 100%, 0% 0%, 100% 100%);
}

.content {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 700px;
    padding: 20px;
    margin: 20vh auto 0;
    /* slightly higher */
    text-align: center;
}

.content .logo {
    width: clamp(198px, 24vw, 352px);
    max-width: 60vw;
    height: auto;
    margin: 0 auto 20px;
    filter: none;
    mix-blend-mode: normal;
}

.coming-soon {
    font-size: 3rem;
    letter-spacing: 0.12em;
    margin-bottom: 0;
    line-height: 1;
    text-transform: uppercase;
}

.coming-text {
    color: var(--cyan);
}

.soon-text {
    color: var(--orange);
}

.subscribe-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    font-family: Consolas, "Courier New", monospace;
}

.subscribe-form input[type="email"] {
    width: 100%;
    padding: 12px 16px;
    font-size: 1rem;
    color: var(--fg);
    background-color: rgba(255, 255, 255, 0.05);
    border: 2px solid var(--cyan);
    border-radius: 0;
    outline: none;
    font-family: Consolas, "Courier New", monospace;
}

.subscribe-form input[type="email"]::placeholder {
    color: #cccccc;
}

.subscribe-form button {
    width: 100%;
    padding: 12px 16px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--fg);
    background-color: var(--orange);
    border: none;
    border-radius: 0;
    cursor: pointer;
    transition: filter 0.2s ease;
    font-family: Consolas, "Courier New", monospace;
}

.subscribe-form button:hover,
.subscribe-form button:focus {
    filter: brightness(0.9);
}

@media (min-width: 480px) {
    .subscribe-form {
        flex-direction: row;
    }

    .subscribe-form input[type="email"] {
        flex: 2;
    }

    .subscribe-form button {
        flex: 1;
    }
}

/* Brevo (Sendinblue) overrides — preserve FILTRIX styling */
.sib-form {
    background: transparent !important;
    margin-top: 0 !important;
}

#sib-form-container,
.sib-form-container,
#sib-container {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    max-width: 420px !important;
    margin: 0 auto !important;
}

#sib-form-container,
#sib-container {
    padding-top: 0 !important;
}

/* Remove any white backgrounds from inner wrappers */
.sib-input.sib-form-block,
.sib-captcha.sib-form-block,
.sib-form-block,
.sib-form .form__entry,
.sib-form .form__label-row,
.sib-form .entry__field {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Lay out: input + button on one row, captcha below */
#sib-form {
    display: grid !important;
    grid-template-columns: 1.4fr auto !important;
    grid-template-areas:
        "field button"
        "captcha captcha" !important;
    column-gap: 10px !important;
    row-gap: 0 !important;
    align-items: center !important;
}

.content .sib-form {
    margin-top: 0 !important;
}

/* Remove extra spacing inserted by Brevo wrappers above the grid */
#sib-form>div {
    margin: 0 !important;
    padding: 0 !important;
}

.sib-form .sib-form-block {
    margin: 0 !important;
    padding: 0 !important;
}

.sib-form .form__entry,
.sib-form .form__label-row,
.sib-form .entry__field {
    margin: 0 !important;
    padding: 0 !important;
}

#sib-form>div:nth-of-type(1) {
    grid-area: field !important;
}

#sib-form>div:nth-of-type(2) {
    grid-area: captcha !important;
}

#sib-form>div:nth-of-type(3) {
    grid-area: button !important;
}

#sib-form>div {
    padding: 0 !important;
    margin: 0 !important;
}

.sib-form .sib-form-block {
    padding: 0 !important;
    margin: 0 !important;
}

.sib-form .form__entry,
.sib-form .form__label-row,
.sib-form .entry__field {
    padding: 0 !important;
    margin: 0 !important;
}

/* Inputs */
.sib-form .input,
.sib-form input[type="email"] {
    width: 100% !important;
    padding: 10px 14px !important;
    font-size: 1rem !important;
    color: var(--fg) !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 2px solid var(--cyan) !important;
    border-radius: 0 !important;
    outline: none !important;
    font-family: Consolas, "Courier New", monospace !important;
    height: auto !important;
}

/* Button */
.sib-form .sib-form-block__button {
    padding: 10px 14px !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: var(--fg) !important;
    background-color: var(--orange) !important;
    border: none !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    transition: filter 0.2s ease !important;
    font-family: Consolas, "Courier New", monospace !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: auto !important;
    min-width: 120px !important;
    height: auto !important;
}

.sib-form .sib-form-block__button:hover {
    filter: brightness(0.9) !important;
}

/* Push reCAPTCHA block slightly lower */
#sib-captcha {
    margin-top: 8px !important;
}

/* Hide default message panels until needed; keep layout clean */
.sib-form-message-panel {
    display: none !important;
}

/* Mobile: stack field, button, then captcha */
@media (max-width: 479px) {
    #sib-form {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "field"
            "button"
            "captcha" !important;
    }
}

/* Wider mobile breakpoint to catch more iPhones */
@media (max-width: 600px) {
    .content {
        margin: 8vh auto 0 !important;
    }

    #sib-form {
        row-gap: 12px !important;
    }

    .sib-form .sib-form-block__button {
        margin-top: 4px !important;
    }
}

/* Landscape phones/tablets: lift logo and form higher */
@media (orientation: landscape) and (max-height: 500px) {
    body {
        padding-top: 4svh !important;
    }

    .content {
        margin: 2vh auto 6vh !important;
    }

    .content .logo {
        margin-bottom: 8px !important;
    }

    #sib-form {
        row-gap: 10px !important;
    }
}

/* Mobile layout fix: allow scroll and lift content */
@media (max-width: 600px) {

    html,
    body {
        height: auto !important;
        min-height: 100dvh !important;
    }

    body {
        display: block !important;
        /* cancel grid centering */
        place-items: initial !important;
        overflow: auto !important;
        padding-bottom: calc(env(safe-area-inset-bottom) + 24px) !important;
    }

    .content {
        margin: 6vh auto 8vh !important;
        padding: 16px;
    }

    .shape {
        opacity: 0.18;
    }

    .shape.top-right,
    .shape.bottom-left {
        width: 40vw;
        height: 22vh;
    }
}

/* Strong mobile centering and widths */
@media (max-width: 600px) {
    body {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        min-height: 100svh !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        padding-top: 10svh !important;
        /* lift from bottom */
        padding-bottom: calc(env(safe-area-inset-bottom) + 24px) !important;
    }

    .content {
        margin: 0 !important;
        width: min(92vw, 560px) !important;
        padding: 0 16px !important;
        text-align: center !important;
    }

    /* Make the form take full width and stack cleanly */
    .sib-form,
    #sib-form,
    #sib-form-container,
    .sib-form-container,
    #sib-container {
        width: 100% !important;
        max-width: 100% !important;
    }

    #sib-form {
        row-gap: 14px !important;
        column-gap: 0 !important;
    }

    /* Remove decorative shapes on very small screens */
    .shape {
        display: none !important;
    }
}

/* Horizontal fit fixes for small screens */
@media (max-width: 600px) {

    html,
    body {
        width: 100% !important;
        overflow-x: hidden !important;
    }

    .content {
        width: 100% !important;
        max-width: 92vw !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    #sib-form,
    #sib-container,
    .sib-form-container,
    #sib-form-container {
        width: 100% !important;
        max-width: 100% !important;
    }

    .sib-form .form__entry,
    .sib-form .form__label-row,
    .sib-form .entry__field {
        max-width: 100% !important;
    }

    /* If visible reCAPTCHA checkbox is enabled, scale it to avoid overflow */
    .g-recaptcha {
        transform: scale(0.88);
        transform-origin: center top;
        width: 304px;
    }
}

/* iOS safe areas */
@supports (padding: max(0px)) {
    body {
        padding-top: max(0px, env(safe-area-inset-top));
        padding-bottom: max(0px, env(safe-area-inset-bottom));
    }
}

/* Mobile adjustments */
@media (max-width: 420px) {
    .content {
        margin: 10vh auto 0;
        /* raise content on small screens */
        padding: 16px;
    }

    .content .logo {
        width: clamp(160px, 40vw, 260px);
        margin-bottom: 12px;
    }

    #sib-form {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "field"
            "button" !important;
        row-gap: 10px !important;
        /* more space between input and button */
        column-gap: 0 !important;
    }

    .sib-form .input,
    .sib-form input[type="email"] {
        padding: 12px 14px !important;
    }

    .sib-form .sib-form-block__button {
        margin-top: 2px !important;
    }
}

@media (max-width: 600px) {

    html,
    body {
        background: var(--bg) !important;
    }
}

/* Email inline error: force layout, toggle visibility */
.sib-input .entry__error {
    display: block !important;
    /* override any hidden defaults */
    min-height: 18px;
    margin-top: 6px;
    visibility: hidden;
    opacity: 0;
    transition: opacity .15s ease;
}

.sib-input .entry__error.shown {
    visibility: visible;
    opacity: 1;
}

/* Keep input and button aligned at the top within the grid */
#sib-form {
    align-items: start !important;
}