/*
 * JASON AI trust theme
 * Direction: technical workshop — primary colour, hard-edged graphics, less neon.
 * This is deliberately additive so it can be disabled without disturbing the base UI.
 */

:root {
    --brand-ink: #071820;
    --brand-ink-2: #0c222c;
    --brand-surface: #102832;
    --brand-paper: #f3efe4;
    --brand-paper-2: #fffdf7;
    --brand-blue: #2f6fed;
    --brand-blue-dark: #1749a7;
    --brand-yellow: #ffc928;
    --brand-red: #ee4f3b;
    --brand-steel: #9babb4;
    --blue: var(--brand-blue);
    --violet: var(--brand-yellow);
    --amber: var(--brand-yellow);
    --pink: var(--brand-red);
    --bg: var(--brand-ink);
    --bg-2: var(--brand-ink-2);
    --radius: 12px;
}

body:not(.admin-body) {
    background:
        radial-gradient(circle at 12% 6%, rgba(47, 111, 237, 0.13), transparent 28rem),
        radial-gradient(circle at 88% 22%, rgba(255, 201, 40, 0.075), transparent 26rem),
        linear-gradient(180deg, #071820 0%, #091821 48%, #050d12 100%);
}

body:not(.admin-body)::before {
    content: "";
    position: fixed;
    z-index: 1000;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(
        90deg,
        var(--brand-blue) 0 46%,
        var(--brand-yellow) 46% 76%,
        var(--brand-red) 76% 100%
    );
    pointer-events: none;
}

/* Brand and navigation */
.brand {
    position: relative;
}

.brand::after {
    content: "";
    position: absolute;
    right: 5%;
    bottom: -3px;
    left: 5%;
    height: 3px;
    background: linear-gradient(
        90deg,
        var(--brand-blue) 0 54%,
        var(--brand-yellow) 54% 78%,
        var(--brand-red) 78% 100%
    );
    opacity: 0.9;
}

.brand img {
    filter: saturate(0.78) contrast(1.04);
}

.site-nav {
    border-color: rgba(155, 171, 180, 0.3);
    background: rgba(7, 24, 32, 0.94);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        5px 5px 0 rgba(47, 111, 237, 0.2),
        0 16px 32px rgba(0, 0, 0, 0.2);
}

.site-nav::before {
    inset: 3px 9px auto;
    height: 2px;
    border: 0;
    background: linear-gradient(90deg, var(--brand-blue) 0 58%, var(--brand-yellow) 58% 82%, var(--brand-red) 82%);
    opacity: 0.82;
}

.site-nav::after {
    display: none;
}

.site-nav a {
    transition: color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.site-nav a[aria-current="page"] {
    color: #ffffff;
    background: var(--brand-blue);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.site-nav a:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.09);
}

.site-gpt-button {
    color: #fff6d6;
}

.site-gpt-button:hover,
.site-gpt-button:focus-visible {
    color: var(--brand-yellow);
}

.site-menu-toggle,
.language-reset,
.language-switcher select,
.currency-switcher select {
    border-color: rgba(155, 171, 180, 0.4);
    background: rgba(7, 24, 32, 0.94);
}

.site-menu-toggle:hover,
.language-reset:hover,
.language-switcher select:hover,
.currency-switcher select:hover {
    border-color: var(--brand-yellow);
}

/* Type signals */
.eyebrow,
.service-category {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--brand-yellow);
    text-shadow: none;
}

.eyebrow::before,
.service-category::before {
    content: "";
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    background: var(--brand-red);
    box-shadow: 3px 3px 0 var(--brand-blue);
}

/* Buttons: solid colour and offset print shadow instead of neon gradients */
.btn,
.page-shell main button:not(.service-image-button):not(.checkout-image-button):not(.image-viewer__close),
.discount-cta__form button,
.checkout-custom-work-card a,
.custom-work-pay-button,
.custom-work-card__head button,
.contact-form__footer button,
.product-glass-link,
.product-mobile-cta {
    border: 2px solid var(--brand-yellow);
    border-radius: 10px;
    color: var(--brand-ink);
    background: var(--brand-yellow);
    box-shadow: 5px 5px 0 var(--brand-blue);
    text-shadow: none;
    transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.btn:hover,
.btn:focus-visible,
.page-shell main button:not(.service-image-button):not(.checkout-image-button):not(.image-viewer__close):hover,
.page-shell main button:not(.service-image-button):not(.checkout-image-button):not(.image-viewer__close):focus-visible,
.discount-cta__form button:hover,
.discount-cta__form button:focus-visible,
.checkout-custom-work-card a:hover,
.checkout-custom-work-card a:focus-visible,
.product-glass-link:hover,
.product-glass-link:focus-visible,
.product-mobile-cta:hover,
.product-mobile-cta:focus-visible {
    color: var(--brand-ink);
    background: #ffd85c;
    box-shadow: 7px 7px 0 var(--brand-blue);
    filter: none;
    transform: translate(-2px, -2px);
}

.btn-secondary,
.icon-link,
.product-glass-link--ghost,
.service-details-link {
    border: 1px solid rgba(155, 171, 180, 0.48);
    color: var(--text);
    background: rgba(7, 24, 32, 0.82);
    box-shadow: none;
}

.btn-secondary:hover,
.btn-secondary:focus-visible,
.icon-link:hover,
.icon-link:focus-visible,
.product-glass-link--ghost:hover,
.product-glass-link--ghost:focus-visible,
.service-details-link:hover,
.service-details-link:focus-visible {
    border-color: var(--brand-blue);
    color: #ffffff;
    background: rgba(47, 111, 237, 0.16);
    box-shadow: 4px 4px 0 rgba(47, 111, 237, 0.34);
}

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

/* Launch offer */
.discount-cta {
    border: 1px solid rgba(155, 171, 180, 0.35);
    border-left: 8px solid var(--brand-yellow);
    border-radius: 12px;
    text-align: left;
    background: var(--brand-surface);
    box-shadow:
        12px 12px 0 rgba(47, 111, 237, 0.16),
        0 28px 62px rgba(0, 0, 0, 0.25);
}

.discount-cta::before {
    top: 0;
    right: 0;
    left: auto;
    width: 180px;
    height: 6px;
    background: linear-gradient(90deg, var(--brand-blue) 0 55%, var(--brand-yellow) 55% 76%, var(--brand-red) 76%);
}

.discount-cta::after {
    right: 22px;
    bottom: 18px;
    left: auto;
    width: 112px;
    height: 70px;
    background: radial-gradient(circle, rgba(255, 201, 40, 0.48) 1.6px, transparent 2px);
    background-size: 14px 14px;
    opacity: 0.48;
}

.discount-cta > * {
    position: relative;
    z-index: 1;
}

.discount-cta p {
    margin-left: 0;
}

.discount-cta__form input {
    border-color: rgba(155, 171, 180, 0.42);
    color: #ffffff;
    background: #071820;
    box-shadow: none;
}

.discount-cta__form input:focus {
    border-color: var(--brand-blue);
}

/* Hero graphics */
.home-hero-band {
    border-color: rgba(155, 171, 180, 0.22);
    background:
        linear-gradient(90deg, var(--brand-blue) 0 48%, var(--brand-yellow) 48% 76%, var(--brand-red) 76%) top / 100% 5px no-repeat,
        linear-gradient(135deg, #0d2a36 0%, #071820 58%, #0d2028 100%);
}

.home-hero-band::before {
    right: auto;
    bottom: auto;
    left: max(28px, 5vw);
    top: 50%;
    width: 74px;
    height: 156px;
    border: 13px solid var(--brand-yellow);
    border-right: 0;
    background: repeating-linear-gradient(
        -45deg,
        rgba(255, 201, 40, 0.7) 0 7px,
        transparent 7px 15px
    );
    box-shadow: none;
    opacity: 0.42;
    transform: translateY(-50%);
}

.home-hero-band::after {
    right: max(30px, 5vw);
    bottom: auto;
    left: auto;
    top: 50%;
    width: 132px;
    height: 132px;
    border: 17px solid var(--brand-blue);
    border-radius: 50%;
    background: transparent;
    box-shadow: 34px 34px 0 -15px var(--brand-red);
    opacity: 0.46;
    transform: translateY(-50%);
}

.home-hero-band .hero-copy {
    width: min(790px, 100%);
}

.home-hero-band h1 {
    color: #ffffff;
    text-shadow: 4px 4px 0 rgba(47, 111, 237, 0.24);
}

.home-hero-band .hero-copy > p {
    color: #c5d0d5;
}

/* Service catalogue: a warm editorial field inside the dark site */
.home-products {
    overflow: hidden;
    border: 1px solid #c7c0b2;
    border-radius: 12px;
    color: var(--brand-ink);
    background: var(--brand-paper);
    box-shadow:
        12px 12px 0 var(--brand-blue),
        0 26px 64px rgba(0, 0, 0, 0.28);
}

.home-products::before {
    inset: 0 0 auto auto;
    width: 118px;
    height: 118px;
    background: linear-gradient(135deg, var(--brand-red) 0 34%, var(--brand-yellow) 34% 65%, var(--brand-blue) 65%);
    box-shadow: none;
    clip-path: polygon(100% 0, 100% 100%, 0 0);
    opacity: 0.96;
}

.home-products .section-heading,
.home-products .service-sort,
.home-products .service-grid,
.home-products .service-pagination,
.home-products .section-actions {
    position: relative;
    z-index: 1;
}

.home-products h2,
.home-products .service-card h3,
.home-products .service-card__footer strong {
    color: var(--brand-ink);
}

.home-products .section-heading p,
.home-products .service-card p,
.home-products .service-sort label {
    color: #4f5f64;
}

.home-products .eyebrow,
.home-products .service-category {
    color: var(--brand-blue-dark);
}

.home-products .service-sort select {
    border-color: #aaa394;
    color: var(--brand-ink);
    background: var(--brand-paper-2);
}

.home-products .service-card {
    border: 1px solid #c9c2b5;
    border-radius: 10px;
    background: var(--brand-paper-2);
    box-shadow: 5px 5px 0 rgba(7, 24, 32, 0.12);
}

.home-products .service-art {
    border-bottom: 4px solid var(--brand-yellow);
    background: #dfe7e9;
}

.home-products .service-card:nth-child(3n + 2) .service-art {
    border-bottom-color: var(--brand-blue);
}

.home-products .service-card:nth-child(3n) .service-art {
    border-bottom-color: var(--brand-red);
}

.home-products .icon-link,
.home-products .service-details-link {
    border-color: var(--brand-blue);
    color: #ffffff;
    background: var(--brand-blue);
    box-shadow: none;
}

.home-products .service-precheck-link {
    border-color: rgba(23, 73, 167, 0.34);
    color: var(--brand-blue-dark);
    background: rgba(47, 111, 237, 0.08);
}

.home-products .service-pagination a,
.home-products .service-pagination span {
    border-color: #aaa394;
    color: var(--brand-ink);
    background: var(--brand-paper-2);
}

.home-products .service-pagination span[aria-current="page"] {
    border-color: var(--brand-blue);
    color: #ffffff;
    background: var(--brand-blue);
}

.home-products .section-actions .btn-secondary {
    border-color: var(--brand-ink);
    color: var(--brand-ink);
    background: transparent;
}

/* Shared panels and process blocks */
.hero-panel,
.glass-panel,
.checkout-panel,
.consult-card,
.consult-score-card,
.contact-panel,
.product-funnel__trust,
.product-funnel__included,
.product-funnel__process li,
.product-funnel__related article,
.product-funnel__final {
    border-color: rgba(155, 171, 180, 0.3);
    background: rgba(12, 34, 44, 0.9);
    box-shadow: 8px 8px 0 rgba(47, 111, 237, 0.12);
}

.spotlight-service {
    border-left: 7px solid var(--brand-blue);
    background: var(--brand-surface);
}

.step {
    border-color: rgba(155, 171, 180, 0.3);
    border-radius: 10px;
    background: var(--brand-surface);
    box-shadow: 4px 4px 0 rgba(255, 201, 40, 0.16);
}

.step span,
.workflow-node span,
.workflow-hub span,
.workflow-output span,
.product-funnel__breadcrumb a,
.product-funnel__related article > div > span {
    color: var(--brand-yellow);
}

.home-section-separator::before {
    background: linear-gradient(90deg, transparent, var(--brand-blue), var(--brand-yellow), var(--brand-red), transparent);
    box-shadow: none;
}

.home-section-separator::after {
    border-radius: 2px;
    background: var(--brand-yellow);
    box-shadow: 10px 0 0 var(--brand-red), -10px 0 0 var(--brand-blue);
}

.checkout-custom-work-card {
    border: 0;
    border-radius: 10px;
    color: #ffffff;
    background: var(--brand-blue);
    box-shadow: 10px 10px 0 var(--brand-yellow);
}

.checkout-custom-work-card p,
.checkout-custom-work-card .eyebrow {
    color: #e9f0ff;
}

.checkout-custom-work-card .eyebrow::before {
    background: var(--brand-yellow);
    box-shadow: 3px 3px 0 var(--brand-red);
}

/* Customer proof */
.jai-reviews__surface {
    border-color: #c7c0b2;
    border-radius: 12px;
    color: var(--brand-ink);
    background: var(--brand-paper);
    box-shadow: 10px 10px 0 var(--brand-red);
}

.jai-reviews__intro h2 {
    color: var(--brand-ink);
}

.jai-reviews__intro p,
.jai-review-slider__status {
    color: #526168;
}

.jai-review-card {
    border-color: #cbc4b7;
    border-radius: 10px;
    color: var(--brand-ink);
    background: var(--brand-paper-2);
    box-shadow: 4px 4px 0 rgba(47, 111, 237, 0.18);
}

.jai-review-card::before {
    color: rgba(238, 79, 59, 0.18);
}

.jai-review-card__stars {
    color: #b87800;
}

.jai-review-card blockquote p,
.jai-review-card figcaption strong {
    color: var(--brand-ink);
}

.jai-review-card figcaption {
    color: #627177;
}

.jai-review-slider__controls button {
    border-color: var(--brand-blue);
    color: #ffffff;
    background: var(--brand-blue);
}

/* Product and enquiry funnels */
.product-gallery__stage {
    border-color: rgba(155, 171, 180, 0.34);
    background: var(--brand-surface);
    box-shadow: 9px 9px 0 rgba(255, 201, 40, 0.18);
}

.product-funnel__highlight {
    border-color: rgba(155, 171, 180, 0.3);
    background: rgba(255, 255, 255, 0.045);
}

.product-funnel__highlight > span,
.product-funnel__included li > span {
    color: var(--brand-ink);
    background: var(--brand-yellow);
}

.product-funnel__process li:nth-child(4n + 2) > span {
    border-color: var(--brand-yellow);
    color: var(--brand-yellow);
    background: rgba(255, 201, 40, 0.08);
}

.product-funnel__process li:nth-child(4n + 3) > span {
    border-color: var(--brand-red);
    color: #ffb3a8;
    background: rgba(238, 79, 59, 0.08);
}

.product-funnel__demo,
.product-glass-link--demo {
    border-color: var(--brand-blue);
    color: #ffffff;
    background: var(--brand-blue);
}

.product-funnel__faq details[open] {
    border-color: var(--brand-yellow);
    background: rgba(255, 201, 40, 0.06);
}

.consult-progress span.is-active,
.consult-score-bar span,
.consult-live-analyser__track span {
    background: var(--brand-yellow);
}

.contact-code,
.selected-service,
.checkout-payment-structure,
.payment-method-option,
.wallet-choice-shell,
.stripe-choice-shell {
    border-color: rgba(155, 171, 180, 0.32);
}

/* Footer */
.site-footer {
    position: relative;
    border-top: 1px solid rgba(155, 171, 180, 0.25);
}

.site-footer::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: linear-gradient(90deg, var(--brand-blue) 0 46%, var(--brand-yellow) 46% 76%, var(--brand-red) 76%);
}

@media (max-width: 920px) {
    .site-nav::before {
        right: 12px;
        left: 12px;
    }

    .home-hero-band::before,
    .home-hero-band::after {
        opacity: 0.2;
    }
}

@media (max-width: 680px) {
    body:not(.admin-body)::before {
        height: 3px;
    }

    .brand::after {
        bottom: -1px;
    }

    .discount-cta {
        border-left-width: 6px;
        text-align: center;
        box-shadow: 6px 6px 0 rgba(47, 111, 237, 0.2);
    }

    .discount-cta p {
        margin-left: auto;
    }

    .discount-cta::after,
    .home-hero-band::before,
    .home-hero-band::after {
        display: none;
    }

    .home-products {
        box-shadow: 6px 6px 0 var(--brand-blue);
    }

    .home-products::before {
        width: 72px;
        height: 72px;
    }

    .jai-reviews__surface {
        box-shadow: 6px 6px 0 var(--brand-red);
    }

    .checkout-custom-work-card {
        box-shadow: 6px 6px 0 var(--brand-yellow);
    }

    .jai-messaging-link,
    .jai-chat-launcher {
        right: max(10px, env(safe-area-inset-right));
        width: 52px;
        min-width: 52px;
        min-height: 52px;
        gap: 0;
        padding: 0;
    }

    .jai-messaging-link > span,
    .jai-chat-launcher > span:not(.jai-chat-launcher__dot) {
        display: none;
    }

    .jai-messaging-link--whatsapp {
        bottom: calc(max(10px, env(safe-area-inset-bottom)) + 116px);
    }

    .jai-messaging-link--telegram {
        bottom: calc(max(10px, env(safe-area-inset-bottom)) + 58px);
    }

    .jai-chat-launcher {
        bottom: max(10px, env(safe-area-inset-bottom));
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-nav a,
    .btn,
    .discount-cta__form button,
    .product-glass-link,
    .product-mobile-cta {
        transition: none;
    }
}
