/*
 * INEX overrides, loaded after the legacy theme (style.css).
 *
 * The theme is kept as the base so existing pages keep their look; this file
 * holds the design tokens and every deliberate improvement on top of it, so
 * the changes live in one place instead of being scattered through style.css.
 */

:root {
    --inex-blue: #4DB7FE;
    --inex-blue-dark: #1E90E0;
    --inex-orange: #FF6F00;
    --inex-navy: #1A213D;
    --inex-navy-soft: #2A3358;
    --inex-ink: #1A213D;
    --inex-muted: #6B7280;
    --inex-line: #E5E9F2;
    --inex-surface: #F6F9FC;
    --inex-radius: 14px;
    --inex-radius-sm: 10px;
    --inex-shadow: 0 20px 50px -20px rgba(26, 33, 61, 0.35);
    --inex-shadow-sm: 0 6px 18px -8px rgba(26, 33, 61, 0.25);
    --inex-focus: 0 0 0 4px rgba(77, 183, 254, 0.25);
}

/* ------------------------------------------------------------------------ */
/* Navbar: logo left, menu centred on the screen, actions right.            */
/* ------------------------------------------------------------------------ */

.inex-nav {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 24px;
    min-height: 84px;
}

.inex-nav__brand img {
    max-height: 42px;
    width: auto;
}

/* Centred by the grid, not by margins, so it stays centred whatever the
   widths of the logo and the buttons either side of it. */
.inex-nav .main-menu {
    margin-left: 0 !important;
    justify-self: center;
}

.header-area .main-header .inex-nav .main-menu ul li {
    margin: 0 11px;
}

.header-area .main-header .inex-nav .main-menu ul li > a {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.inex-nav__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: nowrap;
}

.inex-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 22px;
    border-radius: 999px;
    border: 1.5px solid transparent;
    font-family: "Work Sans", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

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

.inex-btn:focus-visible {
    outline: none;
    box-shadow: var(--inex-focus);
}

.inex-btn--primary {
    background: var(--inex-orange);
    color: #fff;
    box-shadow: 0 8px 20px -8px rgba(255, 111, 0, 0.7);
}

.inex-btn--primary:hover {
    background: #e86500;
    color: #fff;
}

.inex-btn--ghost {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.55);
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(4px);
}

.inex-btn--ghost:hover {
    color: #fff;
    border-color: #fff;
    background: rgba(255, 255, 255, 0.18);
}

.inex-btn--block {
    width: 100%;
    padding: 15px 22px;
    font-size: 15px;
}

/* The theme's scrolled header was translucent, so headings showed through
   it. Solid navy keeps the white menu and both buttons legible. The theme
   also hid its buttons on scroll; Register is the main call to action, so
   ours stay. */
.header-area .main-header.sticky-bar {
    background: rgba(26, 33, 61, 0.97) !important;
    backdrop-filter: blur(8px);
}

@media (max-width: 1199.98px) {
    .header-area .main-header .inex-nav .main-menu ul li {
        margin: 0 7px;
    }

    .header-area .main-header .inex-nav .main-menu ul li > a {
        font-size: 14px;
    }
}

/* Below xl the menu is swapped for slicknav's hamburger (the full menu
   needs ~760px, which laptops between 992px and 1200px don't have beside
   the logo and buttons); keep the logo and actions on one row and let the
   burger sit under them. */
@media (max-width: 1199.98px) {
    .inex-nav {
        grid-template-columns: auto 1fr;
        min-height: 70px;
    }

    .inex-nav .main-menu {
        display: none;
    }

    .inex-nav__actions {
        justify-self: end;
    }


    .inex-btn {
        padding: 9px 16px;
        font-size: 13px;
    }
}

@media (max-width: 420px) {
    .inex-nav__actions .inex-btn--ghost {
        display: none;
    }
}

/* ------------------------------------------------------------------------ */
/* Auth pages: compact hero, card lifted over it.                           */
/* ------------------------------------------------------------------------ */

.inex-hero-compact .slider-height2 {
    min-height: 340px !important;
    height: 340px !important;
}

.inex-hero-compact .hero-caption h2 {
    font-size: 44px;
    margin-bottom: 70px;
}

.inex-auth {
    position: relative;
    margin-top: -90px;
    padding-bottom: 90px;
    z-index: 2;
}

.inex-auth__card {
    display: grid;
    grid-template-columns: 5fr 7fr;
    background: #fff;
    border-radius: var(--inex-radius);
    box-shadow: var(--inex-shadow);
    overflow: hidden;
}

.inex-auth__card--narrow {
    grid-template-columns: 1fr;
    max-width: 520px;
    margin: 0 auto;
}

.inex-auth__aside {
    position: relative;
    padding: 44px 38px;
    color: #fff;
    background:
        radial-gradient(circle at 110% -10%, rgba(77, 183, 254, 0.55), transparent 55%),
        radial-gradient(circle at -20% 120%, rgba(255, 111, 0, 0.35), transparent 50%),
        linear-gradient(160deg, var(--inex-navy) 0%, var(--inex-navy-soft) 100%);
}

.inex-auth__aside h3 {
    color: #fff;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 14px;
}

.inex-auth__aside p {
    color: rgba(255, 255, 255, 0.78);
    font-size: 15px;
}

.inex-auth__eyebrow {
    display: inline-block;
    margin-bottom: 18px;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-family: "Work Sans", sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.inex-steps {
    list-style: none;
    margin: 28px 0 0;
    padding: 0;
}

.inex-steps li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 15px;
    line-height: 1.5;
}

.inex-steps__num {
    flex: 0 0 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--inex-blue);
    color: var(--inex-navy);
    font-family: "Work Sans", sans-serif;
    font-weight: 700;
    font-size: 14px;
}

.inex-steps strong {
    display: block;
    color: #fff;
    font-weight: 700;
}

.inex-auth__event {
    margin-top: 30px;
    padding-top: 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    font-size: 14px;
    color: rgba(255, 255, 255, 0.75);
}

.inex-auth__event strong {
    color: #fff;
}

.inex-auth__main {
    padding: 44px 46px;
}

.inex-auth__main h3 {
    font-size: 26px;
    font-weight: 600;
    color: var(--inex-ink);
    margin-bottom: 6px;
}

.inex-auth__lead {
    color: var(--inex-muted);
    font-size: 15px;
    margin-bottom: 28px;
}

/* Form controls, scoped so the theme's own forms are untouched. */
.inex-form .form-label {
    display: block;
    margin-bottom: 7px;
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 14px;
    font-weight: 600;
}

.inex-form .form-control {
    height: 50px;
    padding: 12px 16px;
    border: 1.5px solid var(--inex-line);
    border-radius: var(--inex-radius-sm);
    background: var(--inex-surface);
    color: var(--inex-ink);
    font-size: 15px;
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.inex-form .form-control::placeholder {
    color: #A0A7B5;
}

.inex-form .form-control:focus {
    border-color: var(--inex-blue);
    background: #fff;
    box-shadow: var(--inex-focus);
}

.inex-form .form-control.is-invalid {
    border-color: #E5484D;
    background-image: none;
}

.inex-form .invalid-feedback {
    font-size: 13px;
}

.inex-form .form-hint {
    display: block;
    margin-top: 6px;
    color: var(--inex-muted);
    font-size: 13px;
}

.inex-form .form-check-input:checked {
    background-color: var(--inex-blue);
    border-color: var(--inex-blue);
}

.inex-form .form-check-label {
    color: var(--inex-muted);
    font-size: 14px;
}

.inex-field-password {
    position: relative;
}

.inex-field-password .form-control {
    padding-right: 48px;
}

.inex-field-password__toggle {
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--inex-muted);
    cursor: pointer;
}

.inex-field-password__toggle:hover {
    color: var(--inex-ink);
    background: var(--inex-line);
}

/* The toggle sits inside the input's box, so validation text must hang
   off the wrapper rather than the input. */
.inex-field-password + .invalid-feedback {
    display: block;
}

.inex-link {
    color: var(--inex-blue-dark);
    font-weight: 600;
    text-decoration: none;
}

.inex-link:hover {
    color: var(--inex-navy);
    text-decoration: underline;
}

.inex-divider {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 26px 0 18px;
    color: var(--inex-muted);
    font-size: 14px;
}

.inex-divider::before,
.inex-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--inex-line);
}

.inex-alert {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 22px;
    padding: 14px 16px;
    border-radius: var(--inex-radius-sm);
    font-size: 14px;
    line-height: 1.5;
}

.inex-alert ul {
    margin: 0;
    padding-left: 18px;
}

.inex-alert--success {
    background: #ECFDF3;
    color: #05603A;
    border: 1px solid #ABEFC6;
}

.inex-alert--danger {
    background: #FEF3F2;
    color: #B42318;
    border: 1px solid #FECDCA;
}

.inex-alert--info {
    background: #EFF8FF;
    color: #175CD3;
    border: 1px solid #B2DDFF;
}

@media (max-width: 991.98px) {
    .inex-auth__card {
        grid-template-columns: 1fr;
    }

    /* On small screens the form comes first; the benefits panel follows. */
    .inex-auth__aside {
        order: 2;
        padding: 32px 26px;
    }

    .inex-auth__main {
        padding: 34px 26px;
    }

    .inex-hero-compact .slider-height2 {
        min-height: 260px !important;
        height: 260px !important;
    }

    .inex-hero-compact .hero-caption h2 {
        font-size: 32px;
        margin-bottom: 60px;
    }

    .inex-auth {
        margin-top: -70px;
        padding-bottom: 60px;
    }
}

/* ------------------------------------------------------------------------ */
/* Shared building blocks for redesigned pages.                             */
/* ------------------------------------------------------------------------ */

.inex-btn--lg {
    padding: 15px 28px;
    font-size: 15px;
}

.inex-btn--outline {
    color: var(--inex-navy);
    border-color: var(--inex-line);
    background: #fff;
}

.inex-btn--outline:hover {
    color: var(--inex-navy);
    border-color: var(--inex-navy);
}

.inex-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    border-radius: 999px;
    font-family: "Work Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.inex-chip--light {
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(6px);
}

.inex-chip--light i {
    color: var(--inex-orange);
}

.inex-eyebrow {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--inex-orange);
    font-family: "Work Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.inex-section {
    padding: 100px 0;
}

.inex-section--tint {
    background: var(--inex-surface);
}

.inex-section__head {
    max-width: 680px;
    margin: 0 auto 56px;
    text-align: center;
}

.inex-section__head h2 {
    color: var(--inex-ink);
    font-size: 40px;
    font-weight: 700;
    line-height: 1.15;
    margin-bottom: 14px;
}

.inex-section__head p {
    color: var(--inex-muted);
    font-size: 17px;
    font-weight: 400;
}

@media (max-width: 767.98px) {
    .inex-section {
        padding: 70px 0;
    }

    .inex-section__head {
        margin-bottom: 40px;
    }

    .inex-section__head h2 {
        font-size: 30px;
    }
}

/* ------------------------------------------------------------------------ */
/* Home: hero                                                               */
/* ------------------------------------------------------------------------ */

.inex-hero {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 100vh;
    padding: 140px 0 170px;
    color: #fff;
    background:
        linear-gradient(100deg, rgba(20, 26, 50, 0.94) 0%, rgba(26, 33, 61, 0.82) 45%, rgba(26, 33, 61, 0.45) 100%),
        url("../img/hero/h1_hero.jpg") center / cover no-repeat;
}

.inex-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 760px;
}

.inex-hero__title {
    margin: 22px 0 10px;
    color: #fff;
    font-size: clamp(56px, 9vw, 112px);
    font-weight: 800;
    line-height: 0.95;
    letter-spacing: -0.03em;
}

.inex-hero__tagline {
    margin-bottom: 28px;
    color: rgba(255, 255, 255, 0.88);
    font-family: "Work Sans", sans-serif;
    font-size: clamp(20px, 2.4vw, 28px);
    font-weight: 500;
    line-height: 1.3;
}

.inex-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 28px;
    margin-bottom: 36px;
    font-size: 17px;
    font-weight: 600;
}

.inex-hero__meta i {
    margin-right: 8px;
    color: var(--inex-blue);
}

.inex-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.inex-countdown {
    display: flex;
    gap: 12px;
    margin-top: 44px;
}

.inex-countdown[hidden] {
    display: none;
}

.inex-countdown > div {
    min-width: 92px;
    padding: 14px 10px;
    text-align: center;
    border-radius: var(--inex-radius-sm);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(6px);
}

.inex-countdown strong {
    display: block;
    color: #fff;
    font-family: "Work Sans", sans-serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1;
}

.inex-countdown span {
    display: block;
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ------------------------------------------------------------------------ */
/* Home: key facts, lifted over the bottom of the hero                      */
/* ------------------------------------------------------------------------ */

.inex-facts {
    position: relative;
    z-index: 2;
    margin-top: -80px;
}

.inex-facts__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: #fff;
    border-radius: var(--inex-radius);
    box-shadow: var(--inex-shadow);
    overflow: hidden;
}

.inex-fact {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 28px 26px;
}

.inex-fact + .inex-fact {
    border-left: 1px solid var(--inex-line);
}

.inex-fact i {
    flex: 0 0 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #EFF8FF;
    color: var(--inex-blue-dark);
    font-size: 19px;
}

.inex-fact strong {
    display: block;
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

.inex-fact span {
    display: block;
    margin-top: 4px;
    color: var(--inex-muted);
    font-size: 14px;
    line-height: 1.4;
}

@media (max-width: 991.98px) {
    .inex-facts__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .inex-fact:nth-child(3) {
        border-left: 0;
    }

    .inex-fact:nth-child(n+3) {
        border-top: 1px solid var(--inex-line);
    }
}

@media (max-width: 575.98px) {
    .inex-hero {
        min-height: auto;
        padding: 130px 0 140px;
    }

    .inex-hero__actions .inex-btn {
        width: 100%;
    }

    .inex-countdown > div {
        flex: 1;
        min-width: 0;
    }

    .inex-facts__grid {
        grid-template-columns: 1fr;
    }

    .inex-fact + .inex-fact {
        border-left: 0;
        border-top: 1px solid var(--inex-line);
    }
}

/* ------------------------------------------------------------------------ */
/* Home: zones, categories, highlights, steps, CTA, features                */
/* ------------------------------------------------------------------------ */

.inex-zone {
    height: 100%;
    padding: 34px 30px;
    border: 1px solid var(--inex-line);
    border-radius: var(--inex-radius);
    background: #fff;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.inex-zone:hover {
    transform: translateY(-4px);
    border-color: transparent;
    box-shadow: var(--inex-shadow);
}

.inex-zone__icon {
    width: 58px;
    height: 58px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--inex-blue), var(--inex-blue-dark));
    color: #fff;
    font-size: 24px;
    box-shadow: 0 10px 22px -10px rgba(30, 144, 224, 0.8);
}

.inex-zone__label {
    display: block;
    margin-bottom: 4px;
    color: var(--inex-orange);
    font-family: "Work Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.inex-zone h3 {
    margin-bottom: 8px;
    color: var(--inex-ink);
    font-size: 24px;
    font-weight: 700;
}

.inex-zone__tagline {
    margin-bottom: 18px;
    color: var(--inex-muted);
    font-style: italic;
}

.inex-zone__list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.inex-zone__list li {
    position: relative;
    padding: 7px 0 7px 26px;
    color: var(--inex-ink);
    font-size: 15px;
    border-top: 1px dashed var(--inex-line);
}

.inex-zone__list li::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 16px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--inex-blue);
}

.inex-categories {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 18px;
}

.inex-category {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 26px 16px 22px;
    text-align: center;
    text-decoration: none;
    border-radius: var(--inex-radius);
    background: #fff;
    box-shadow: var(--inex-shadow-sm);
    transition: transform .25s ease, box-shadow .25s ease;
}

.inex-category:hover {
    transform: translateY(-4px);
    box-shadow: var(--inex-shadow);
}

.inex-category__img {
    width: 96px;
    height: 96px;
    margin-bottom: 16px;
    overflow: hidden;
    border-radius: 50%;
    background: var(--inex-surface);
}

.inex-category__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inex-category__name {
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

.inex-category__count {
    margin-top: 6px;
    color: var(--inex-muted);
    font-size: 13px;
}

.inex-category__desc {
    margin-top: 8px;
    color: var(--inex-muted);
    font-size: 13px;
    line-height: 1.5;
}

.inex-category__cta {
    margin-top: 8px;
    color: var(--inex-blue-dark);
    font-size: 13px;
    font-weight: 600;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity .2s ease, transform .2s ease;
}

.inex-category:hover .inex-category__cta,
.inex-category:focus-visible .inex-category__cta {
    opacity: 1;
    transform: none;
}

@media (max-width: 1199.98px) {
    .inex-categories {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 575.98px) {
    .inex-categories {
        grid-template-columns: repeat(2, 1fr);
    }

    /* No hover on touch screens, so the prompt is always shown. */
    .inex-category__cta {
        opacity: 1;
        transform: none;
    }
}

.inex-highlights {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 260px;
    gap: 18px;
}

.inex-highlight {
    position: relative;
    margin: 0;
    overflow: hidden;
    border-radius: var(--inex-radius);
    background: var(--inex-navy);
}

.inex-highlight--feature {
    grid-column: span 2;
    grid-row: span 2;
}

.inex-highlight img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}

.inex-highlight:hover img {
    transform: scale(1.05);
}

.inex-highlight figcaption {
    position: absolute;
    inset: auto 0 0 0;
    padding: 60px 22px 20px;
    background: linear-gradient(to top, rgba(20, 26, 50, 0.92), transparent);
}

.inex-highlight h3 {
    margin-bottom: 4px;
    color: #fff;
    font-size: 19px;
    font-weight: 700;
}

.inex-highlight--feature h3 {
    font-size: 28px;
}

.inex-highlight p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 14px;
    line-height: 1.45;
}

@media (max-width: 991.98px) {
    .inex-highlights {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 220px;
    }
}

@media (max-width: 575.98px) {
    .inex-highlights {
        grid-template-columns: 1fr;
    }

    .inex-highlight--feature {
        grid-column: auto;
        grid-row: auto;
    }
}

.inex-step {
    height: 100%;
    padding: 34px 30px;
    border-radius: var(--inex-radius);
    background: #fff;
    box-shadow: var(--inex-shadow-sm);
}

.inex-step__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 20px;
    border-radius: 50%;
    background: var(--inex-navy);
    color: #fff;
    font-family: "Work Sans", sans-serif;
    font-size: 20px;
    font-weight: 700;
}

.inex-step h3 {
    margin-bottom: 8px;
    color: var(--inex-ink);
    font-size: 21px;
    font-weight: 700;
}

.inex-step p {
    margin: 0;
    color: var(--inex-muted);
    font-size: 15px;
}

.inex-cta-wrap {
    padding: 0 0 100px;
    background: linear-gradient(to bottom, var(--inex-surface) 50%, #fff 50%);
}

.inex-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 56px 60px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 100% 0%, rgba(77, 183, 254, 0.5), transparent 50%),
        radial-gradient(circle at 0% 100%, rgba(255, 111, 0, 0.35), transparent 45%),
        linear-gradient(135deg, var(--inex-navy), var(--inex-navy-soft));
    box-shadow: var(--inex-shadow);
}

.inex-cta h2 {
    margin-bottom: 8px;
    color: #fff;
    font-size: 36px;
    font-weight: 700;
}

.inex-cta p {
    margin: 0;
    color: rgba(255, 255, 255, 0.8);
    font-size: 17px;
}

.inex-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    flex-shrink: 0;
}

@media (max-width: 991.98px) {
    .inex-cta {
        flex-direction: column;
        align-items: flex-start;
        padding: 40px 30px;
    }

    .inex-cta h2 {
        font-size: 28px;
    }
}

.inex-feature {
    height: 100%;
    padding: 36px 32px;
    border: 1px solid var(--inex-line);
    border-radius: var(--inex-radius);
    background: #fff;
}

.inex-feature__icon {
    width: 56px;
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border-radius: 16px;
    background: #FFF4EB;
    color: var(--inex-orange);
    font-size: 22px;
}

.inex-feature h3 {
    margin-bottom: 10px;
    color: var(--inex-ink);
    font-size: 21px;
    font-weight: 700;
}

.inex-feature p {
    margin: 0;
    color: var(--inex-muted);
    font-size: 15px;
    line-height: 1.65;
}

/* ------------------------------------------------------------------------ */
/* Content pages (About and onwards)                                        */
/* ------------------------------------------------------------------------ */

/* The header is fixed, so an anchor jump would otherwise land a section's
   heading underneath it. */
section[id],
[id].inex-section {
    scroll-margin-top: 96px;
}

.inex-muted {
    color: var(--inex-muted);
}

/* A plain page banner: same compact height as the auth pages, but no card
   overlapping it, so the caption sits in the middle. */
.inex-hero-compact--page .hero-caption h2 {
    margin-bottom: 0;
}

.inex-eyebrow--light {
    color: var(--inex-blue);
}

/* The theme styles every span in a hero caption as 60px green display type
   (`.slider-area .hero-caption span`), so this needs at least that weight. */
.slider-area .hero-caption .inex-eyebrow {
    display: inline-block;
    margin-bottom: 10px;
    color: var(--inex-blue);
    font-family: "Work Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.2;
    text-transform: uppercase;
}

.inex-subnav {
    position: relative;
    z-index: 3;
    background: #fff;
    border-bottom: 1px solid var(--inex-line);
    box-shadow: 0 6px 16px -14px rgba(26, 33, 61, 0.5);
}

.inex-subnav ul {
    display: flex;
    gap: 6px;
    margin: 0;
    padding: 12px 0;
    list-style: none;
    overflow-x: auto;
    scrollbar-width: none;
}

.inex-subnav ul::-webkit-scrollbar {
    display: none;
}

.inex-subnav a {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 999px;
    color: var(--inex-muted);
    font-family: "Work Sans", sans-serif;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    transition: background-color .2s ease, color .2s ease;
}

.inex-subnav a:hover {
    color: var(--inex-navy);
    background: var(--inex-surface);
}

@media (min-width: 992px) {
    .inex-subnav ul {
        justify-content: center;
    }
}

.inex-heading {
    margin-bottom: 20px;
    color: var(--inex-ink);
    font-size: 40px;
    font-weight: 700;
    line-height: 1.15;
}

.inex-prose p {
    color: #4B5563;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.75;
}

/* Rich text written in the admin panel or the innovator portal. The theme
   resets lists and sizes headings for page titles, so both are restored
   here at a size that suits running text. */
.inex-prose h2,
.inex-prose h3,
.inex-prose h4 {
    margin: 26px 0 10px;
    color: var(--inex-ink);
    font-size: 19px;
    font-weight: 700;
    line-height: 1.35;
}

.inex-prose ul,
.inex-prose ol {
    margin: 0 0 18px;
    padding-left: 22px;
    color: #4B5563;
    font-size: 16px;
    line-height: 1.7;
}

.inex-prose ul li {
    list-style: disc;
}

.inex-prose ol li {
    list-style: decimal;
}

.inex-prose li + li {
    margin-top: 4px;
}

.inex-prose a {
    color: var(--inex-blue-dark);
    text-decoration: underline;
}

.inex-prose blockquote {
    margin: 0 0 18px;
    padding: 4px 0 4px 18px;
    border-left: 3px solid var(--inex-blue);
    color: var(--inex-muted);
}

.inex-keyfacts {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 30px 0 0;
}

.inex-keyfacts > div {
    flex: 1 1 160px;
    padding: 16px 18px;
    border: 1px solid var(--inex-line);
    border-radius: var(--inex-radius-sm);
    background: #fff;
}

.inex-keyfacts dt {
    margin-bottom: 4px;
    color: var(--inex-muted);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.inex-keyfacts dt i {
    margin-right: 6px;
    color: var(--inex-blue-dark);
}

.inex-keyfacts dd {
    margin: 0;
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
}

.inex-photo-frame {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--inex-shadow);
}

.inex-photo-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
}

.inex-photo-frame img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

/* The INEX innovation funnel (About page). Each stage is a trapezoid, a
   little narrower than the one above, so the three stack into a funnel that
   pours into the bullseye below. */
.inex-funnel {
    margin: 0;
    padding: 34px 30px 30px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--inex-line);
    box-shadow: var(--inex-shadow);
}

.inex-funnel__title {
    margin-bottom: 22px;
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
}

.inex-funnel__title span {
    display: block;
    margin-bottom: 4px;
    color: var(--inex-orange);
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.inex-funnel__stages {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.inex-funnel__stage {
    padding: 18px 13% 20px;
    color: #fff;
    text-align: center;
    clip-path: polygon(0 0, 100% 0, 93% 100%, 7% 100%);
}

.inex-funnel__stage strong {
    display: block;
    margin-bottom: 4px;
    font-family: "Work Sans", sans-serif;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.inex-funnel__stage span {
    display: block;
    font-size: 13.5px;
    line-height: 1.5;
    opacity: 0.95;
}

.inex-funnel__stage--1 {
    width: 100%;
    background: linear-gradient(135deg, #1E6FD9, #3AA0F0);
}

.inex-funnel__stage--2 {
    width: 86%;
    background: linear-gradient(135deg, #12A58B, #5CC46A);
}

.inex-funnel__stage--3 {
    width: 72%;
    background: linear-gradient(135deg, #F28C0F, #F4B41A);
}

.inex-funnel__target {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
}

/* A bullseye in rings of the stage colours, with the arrow stem above it. */
.inex-funnel__bullseye {
    position: relative;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: radial-gradient(circle,
        #E0262E 0 16%, #fff 16% 30%, #F4B41A 30% 46%, #fff 46% 60%, #1E6FD9 60% 78%, #fff 78% 86%, #1A213D 86% 100%);
    box-shadow: 0 10px 20px -10px rgba(26, 33, 61, 0.6);
}

.inex-funnel__bullseye::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -16px;
    width: 3px;
    height: 20px;
    background: #F4B41A;
    transform: translateX(-50%);
}

.inex-funnel__target strong {
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

@media (max-width: 575.98px) {
    .inex-funnel {
        padding: 26px 16px 24px;
    }

    .inex-funnel__stage {
        padding: 16px 11% 18px;
    }

    .inex-funnel__stage--2 {
        width: 90%;
    }

    .inex-funnel__stage--3 {
        width: 80%;
    }
}

/* For artwork with text in it, which must never be cropped. */
.inex-photo-frame--contain {
    background: #fff;
}

.inex-photo-frame--contain img {
    aspect-ratio: auto;
    object-fit: contain;
}

.inex-zone__intro {
    color: #4B5563;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
}

.inex-zone__note {
    margin: 18px 0 0;
    padding: 10px 14px;
    border-radius: var(--inex-radius-sm);
    background: #FFF4EB;
    color: #9A3C00;
    font-size: 14px;
    font-weight: 600;
}

/* Schedule: one card per day, activities as a timeline. */
.inex-schedule {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    max-width: 1080px;
    margin: 0 auto;
}

.inex-schedule__day {
    border: 1px solid var(--inex-line);
    border-radius: var(--inex-radius);
    background: #fff;
    overflow: hidden;
}

.inex-schedule__day--extended {
    grid-column: 1 / -1;
}

.inex-schedule__head {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    background: linear-gradient(135deg, var(--inex-navy), var(--inex-navy-soft));
    color: #fff;
}

.inex-schedule__day--extended .inex-schedule__head {
    background: linear-gradient(135deg, var(--inex-blue-dark), var(--inex-blue));
}

.inex-schedule__badge {
    flex-shrink: 0;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--inex-orange);
    color: #fff;
    font-family: "Work Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.inex-schedule__day--extended .inex-schedule__badge {
    background: rgba(255, 255, 255, 0.2);
}

.inex-schedule__head h3 {
    margin: 0;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
}

.inex-schedule__head span:not(.inex-schedule__badge) {
    color: rgba(255, 255, 255, 0.75);
    font-size: 14px;
}

.inex-schedule__list {
    margin: 0;
    padding: 10px 24px 18px;
    list-style: none;
}

.inex-schedule__list li {
    position: relative;
    display: grid;
    grid-template-columns: 118px 1fr;
    gap: 14px;
    padding: 12px 0 12px 18px;
    border-left: 2px solid var(--inex-line);
}

.inex-schedule__list li::before {
    content: "";
    position: absolute;
    left: -6px;
    top: 18px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--inex-blue);
}

.inex-schedule__list time {
    color: var(--inex-blue-dark);
    font-family: "Work Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.inex-schedule__list span {
    color: var(--inex-ink);
    font-size: 15px;
    line-height: 1.45;
}

@media (max-width: 991.98px) {
    .inex-schedule {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 479.98px) {
    .inex-schedule__list li {
        grid-template-columns: 1fr;
        gap: 2px;
    }
}

/* Register band on a white page: no tinted half behind it. */
.inex-cta-wrap--plain {
    padding: 20px 0 100px;
    background: #fff;
}

.inex-downloads {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    margin-top: 26px;
}

.inex-download {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 22px;
    border: 1px solid var(--inex-line);
    border-radius: var(--inex-radius-sm);
    background: #fff;
    text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.inex-download:hover {
    border-color: var(--inex-blue);
    box-shadow: var(--inex-shadow-sm);
}

.inex-download i {
    color: var(--inex-orange);
    font-size: 26px;
}

.inex-download span {
    color: var(--inex-muted);
    font-size: 13px;
}

.inex-download strong {
    display: block;
    color: var(--inex-ink);
    font-size: 15px;
}

/* People: delegates and the advisory council. */
.inex-people {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 22px;
}

/* Flex rather than grid, so an incomplete last row is centred instead of
   hanging off to the left. */
.inex-people--council {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.inex-people--council .inex-person {
    flex: 0 1 200px;
}

.inex-person {
    margin: 0;
    padding: 18px 16px 20px;
    text-align: center;
    border-radius: var(--inex-radius);
    background: #fff;
    box-shadow: var(--inex-shadow-sm);
    transition: transform .25s ease, box-shadow .25s ease;
}

.inex-section--tint .inex-person {
    box-shadow: 0 4px 14px -8px rgba(26, 33, 61, 0.25);
}

.inex-person:hover {
    transform: translateY(-4px);
    box-shadow: var(--inex-shadow);
}

.inex-person__photo {
    width: 120px;
    height: 120px;
    margin: 0 auto 14px;
    overflow: hidden;
    border-radius: 50%;
    background: var(--inex-surface);
    box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--inex-line);
}

.inex-person__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.inex-person strong {
    display: block;
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.inex-person span {
    display: block;
    margin-top: 6px;
    color: var(--inex-muted);
    font-size: 13px;
    line-height: 1.4;
}

@media (max-width: 575.98px) {
    .inex-people,
    .inex-people--council {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    /* Two per row on phones, the fifth centred beneath. */
    .inex-people--council .inex-person {
        flex: 0 1 calc(50% - 7px);
    }

    .inex-person__photo {
        width: 92px;
        height: 92px;
    }
}

/* Partner logos: muted until hovered, so no one logo shouts over another. */
.inex-logos {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 18px;
    max-width: 1080px;
    margin: 0 auto;
}

.inex-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 0;
    padding: 26px 18px 18px;
    border-radius: var(--inex-radius);
    background: #fff;
    text-align: center;
}

.inex-logo img {
    max-width: 100%;
    max-height: 84px;
    object-fit: contain;
    filter: grayscale(1);
    opacity: 0.75;
    transition: filter .25s ease, opacity .25s ease;
}

.inex-logo:hover img {
    filter: none;
    opacity: 1;
}

.inex-logo figcaption {
    color: var(--inex-muted);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
}

@media (max-width: 575.98px) {
    .inex-logos {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ------------------------------------------------------------------------ */
/* Venue                                                                    */
/* ------------------------------------------------------------------------ */

.inex-venue-card {
    height: 100%;
    padding: 40px 36px;
    border-radius: var(--inex-radius);
    color: #fff;
    background:
        radial-gradient(circle at 110% -10%, rgba(77, 183, 254, 0.5), transparent 55%),
        radial-gradient(circle at -20% 120%, rgba(255, 111, 0, 0.3), transparent 50%),
        linear-gradient(160deg, var(--inex-navy) 0%, var(--inex-navy-soft) 100%);
    box-shadow: var(--inex-shadow);
}

.inex-venue-card h2 {
    margin-bottom: 22px;
    color: #fff;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;
}

.inex-venue-card__address {
    display: flex;
    gap: 14px;
    margin-bottom: 16px;
    color: rgba(255, 255, 255, 0.88);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
}

.inex-venue-card__address i {
    flex: 0 0 18px;
    margin-top: 5px;
    color: var(--inex-blue);
}

.inex-venue-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.inex-venue-card .inex-btn--outline {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.45);
    background: transparent;
}

.inex-venue-card .inex-btn--outline:hover {
    color: #fff;
    border-color: #fff;
}

.inex-map {
    height: 100%;
    min-height: 380px;
    overflow: hidden;
    border-radius: var(--inex-radius);
    border: 1px solid var(--inex-line);
    background: var(--inex-surface);
    box-shadow: var(--inex-shadow-sm);
}

/* Footer phone numbers are tap-to-call links; keep them in the footer's own
   text colour rather than the browser's link blue. */
.footer-tittle p a {
    color: inherit;
    text-decoration: none;
}

.footer-tittle p a:hover {
    color: var(--inex-blue);
}

/* ------------------------------------------------------------------------ */
/* Awards                                                                   */
/* ------------------------------------------------------------------------ */

.inex-honours {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
    align-items: stretch;
}

.inex-honour {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 44px 34px 40px;
    text-align: center;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--inex-line);
    box-shadow: var(--inex-shadow-sm);
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease;
}

/* A thin gold line across the top of every honour. */
.inex-honour::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, #B8860B, #F2C230, #B8860B);
}

.inex-honour:hover {
    transform: translateY(-4px);
    box-shadow: var(--inex-shadow);
}

.inex-honour__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 84px;
    height: 84px;
    margin-bottom: 22px;
    border-radius: 50%;
    color: #fff;
    font-size: 32px;
    background: radial-gradient(circle at 32% 28%, #FFE58A, #E0A800 55%, #9A6B00);
    box-shadow:
        inset 0 -5px 10px rgba(0, 0, 0, 0.18),
        inset 0 5px 10px rgba(255, 255, 255, 0.4),
        0 14px 28px -14px rgba(154, 107, 0, 0.8);
    text-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
}

.inex-honour__img {
    max-width: 150px;
    max-height: 150px;
    margin-bottom: 22px;
    object-fit: contain;
}

.inex-honour__by {
    display: block;
    margin-bottom: 8px;
    color: #A87700;
    font-family: "Work Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.inex-honour h3 {
    margin-bottom: 16px;
    color: var(--inex-ink);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
}

.inex-honour__rule {
    display: block;
    width: 48px;
    height: 2px;
    margin-bottom: 18px;
    background: linear-gradient(90deg, transparent, #D4A017, transparent);
}

.inex-honour p {
    margin: 0;
    color: var(--inex-muted);
    font-size: 15px;
    line-height: 1.7;
}

/* Three columns side by side: reserve two lines for every title, so the
   gold rule and description start at the same height in each card even
   when one name ("Best International Innovation") wraps and others don't. */
@media (min-width: 992px) {
    .inex-honour h3 {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 2.4em;
    }
}

@media (max-width: 991.98px) {
    .inex-honours {
        grid-template-columns: 1fr;
        max-width: 520px;
        margin: 0 auto;
    }
}

.inex-specials {
    display: grid;
    gap: 22px;
    max-width: 860px;
    margin: 0 auto;
}

.inex-special {
    display: flex;
    gap: 30px;
    align-items: center;
    padding: 34px 38px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--inex-line);
    box-shadow: var(--inex-shadow-sm);
}

.inex-special__seal {
    flex: 0 0 128px;
    height: 128px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
    border-radius: 50%;
    background: #fff;
    color: #A87700;
    font-size: 40px;
    box-shadow: 0 0 0 1px var(--inex-line), 0 0 0 7px #FBF6E9, 0 0 0 8px #E8D9AE;
}

.inex-special__seal img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.inex-special h3 {
    margin-bottom: 10px;
    color: var(--inex-ink);
    font-size: 24px;
    font-weight: 700;
}

.inex-special p {
    margin: 0;
    color: var(--inex-muted);
    font-size: 15px;
    line-height: 1.7;
}

@media (max-width: 575.98px) {
    .inex-special {
        flex-direction: column;
        text-align: center;
        padding: 30px 24px;
    }
}

/* Medals */
.inex-medal-card {
    height: 100%;
    padding: 36px 30px;
    text-align: center;
    border-radius: var(--inex-radius);
    background: #fff;
    box-shadow: var(--inex-shadow-sm);
}

.inex-medal-card h3 {
    margin: 20px 0 6px;
    color: var(--inex-ink);
    font-size: 22px;
    font-weight: 700;
}

.inex-medal-card p {
    margin: 0;
    color: var(--inex-muted);
    font-size: 15px;
}

.inex-medal-card__img {
    max-width: 120px;
    max-height: 120px;
    object-fit: contain;
}

.inex-medal {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 104px;
    height: 104px;
    border-radius: 50%;
    color: #fff;
    font-size: 40px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
    box-shadow:
        inset 0 -6px 12px rgba(0, 0, 0, 0.18),
        inset 0 6px 12px rgba(255, 255, 255, 0.45),
        0 14px 28px -14px rgba(0, 0, 0, 0.5);
}

.inex-medal--gold {
    background: radial-gradient(circle at 32% 28%, #FFF1A8, #F2C230 45%, #B8860B);
}

.inex-medal--silver {
    background: radial-gradient(circle at 32% 28%, #FFFFFF, #C9CED6 45%, #8A919C);
}

.inex-medal--bronze {
    background: radial-gradient(circle at 32% 28%, #FFD2A6, #CD7F32 45%, #8B4A1C);
}

/* ------------------------------------------------------------------------ */
/* HEI Award                                                                */
/* ------------------------------------------------------------------------ */

.inex-notice {
    display: flex;
    gap: 20px;
    padding: 30px 30px 28px;
    border-radius: var(--inex-radius);
    background: linear-gradient(160deg, #EFF8FF, #FFF7EE);
    border: 1px solid #D6EBFB;
}

.inex-notice__icon {
    flex: 0 0 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #fff;
    color: var(--inex-blue-dark);
    font-size: 22px;
    box-shadow: var(--inex-shadow-sm);
}

.inex-notice p {
    margin-bottom: 8px;
    color: var(--inex-muted);
    font-size: 15px;
}

.inex-notice .inex-notice__lead {
    color: var(--inex-ink);
    font-size: 17px;
}

.inex-criteria {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

.inex-criterion {
    padding: 28px 24px;
    border-radius: var(--inex-radius);
    background: #fff;
    box-shadow: 0 4px 14px -8px rgba(26, 33, 61, 0.25);
}

.inex-criterion .inex-feature__icon {
    margin-bottom: 18px;
}

.inex-criterion h3 {
    margin-bottom: 8px;
    color: var(--inex-ink);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
}

.inex-criterion p {
    margin: 0;
    color: var(--inex-muted);
    font-size: 14px;
    line-height: 1.6;
}

.inex-weights {
    display: grid;
    gap: 20px;
    max-width: 980px;
    margin: 0 auto;
}

.inex-weight {
    padding: 28px 30px;
    border-radius: var(--inex-radius);
    border: 1px solid var(--inex-line);
    background: #fff;
}

.inex-weight__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.inex-weight__head h3 {
    margin: 0;
    color: var(--inex-ink);
    font-size: 20px;
    font-weight: 700;
}

.inex-weight__value {
    color: var(--inex-orange);
    font-family: "Work Sans", sans-serif;
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
}

.inex-weight__bar {
    height: 8px;
    margin-bottom: 22px;
    border-radius: 999px;
    background: var(--inex-surface);
    overflow: hidden;
}

/* Scaled so the largest weight (30%) fills most of the bar; otherwise every
   bar would sit in the left third and the differences would be hard to see. */
.inex-weight__bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--inex-blue), var(--inex-blue-dark));
    transform: scaleX(3);
    transform-origin: left;
}

.inex-weight h4 {
    margin-bottom: 10px;
    color: var(--inex-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.inex-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.inex-tags span {
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--inex-surface);
    border: 1px solid var(--inex-line);
    color: var(--inex-ink);
    font-size: 13px;
}

.inex-timeline {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* The line joining the steps, behind the icons. */
.inex-timeline::before {
    content: "";
    position: absolute;
    left: 10%;
    right: 10%;
    top: 31px;
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--inex-blue) 0 8px, transparent 8px 14px);
}

.inex-timeline__step {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.inex-timeline__dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: #fff;
    color: var(--inex-blue-dark);
    font-size: 22px;
    box-shadow: 0 0 0 6px var(--inex-surface), var(--inex-shadow-sm);
}

.inex-timeline__num {
    color: var(--inex-orange);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.inex-timeline__step strong {
    margin: 4px 0 6px;
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    line-height: 1.3;
}

.inex-timeline__date {
    padding: 4px 12px;
    border-radius: 999px;
    background: #fff;
    border: 1px dashed #B2DDFF;
    color: var(--inex-blue-dark);
    font-size: 13px;
    font-weight: 600;
}

@media (max-width: 991.98px) {
    .inex-timeline {
        grid-template-columns: 1fr;
        gap: 22px;
        max-width: 420px;
        margin: 0 auto;
    }

    .inex-timeline::before {
        left: 31px;
        right: auto;
        top: 10px;
        bottom: 10px;
        width: 2px;
        height: auto;
        background: repeating-linear-gradient(180deg, var(--inex-blue) 0 8px, transparent 8px 14px);
    }

    .inex-timeline__step {
        display: grid;
        grid-template-columns: 64px 1fr;
        column-gap: 18px;
        align-items: center;
        text-align: left;
    }

    .inex-timeline__dot {
        grid-row: span 3;
        margin-bottom: 0;
    }

    .inex-timeline__date {
        justify-self: start;
    }
}

@media (max-width: 575.98px) {
    .inex-notice {
        flex-direction: column;
    }

    .inex-weight {
        padding: 24px 20px;
    }
}

/* ------------------------------------------------------------------------ */
/* Chapters                                                                 */
/* ------------------------------------------------------------------------ */

.inex-empty {
    max-width: 520px;
    margin: 0 auto;
    padding: 50px 30px;
    text-align: center;
    border-radius: 18px;
    border: 1.5px dashed #C7D7EA;
    background: var(--inex-surface);
}

.inex-empty__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    margin-bottom: 18px;
    border-radius: 50%;
    background: #fff;
    color: var(--inex-blue-dark);
    font-size: 32px;
    box-shadow: var(--inex-shadow-sm);
}

.inex-empty h3 {
    margin-bottom: 8px;
    color: var(--inex-ink);
    font-size: 24px;
    font-weight: 700;
}

.inex-empty p {
    margin: 0;
    color: var(--inex-muted);
}

.inex-chapters {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 24px;
}

.inex-chapter {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--inex-radius);
    background: #fff;
    border: 1px solid var(--inex-line);
    box-shadow: var(--inex-shadow-sm);
    transition: transform .25s ease, box-shadow .25s ease;
}

.inex-chapter:hover {
    transform: translateY(-4px);
    box-shadow: var(--inex-shadow);
}

.inex-chapter__media {
    height: 170px;
    background:
        radial-gradient(circle at 100% 0%, rgba(77, 183, 254, 0.55), transparent 55%),
        linear-gradient(150deg, var(--inex-navy), var(--inex-navy-soft));
}

.inex-chapter__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inex-chapter__initials {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 100%;
    padding: 0 16px;
    color: #fff;
    font-family: "Work Sans", sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
}

.inex-chapter__initials i {
    color: var(--inex-blue);
    font-size: 34px;
}

.inex-chapter__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 22px 22px 24px;
}

.inex-chapter h3 {
    margin-bottom: 6px;
    color: var(--inex-ink);
    font-size: 20px;
    font-weight: 700;
}

.inex-chapter__place {
    margin-bottom: 12px;
    color: var(--inex-muted);
    font-size: 14px;
}

.inex-chapter__place i {
    margin-right: 4px;
    color: var(--inex-orange);
}

.inex-chapter p {
    color: var(--inex-muted);
    font-size: 15px;
    line-height: 1.6;
}

.inex-chapter__links {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--inex-line);
    font-size: 14px;
    word-break: break-word;
}

/* ------------------------------------------------------------------------ */
/* Innovation catalogue                                                     */
/* ------------------------------------------------------------------------ */

.inex-filters {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr auto;
    gap: 12px;
    align-items: center;
    margin-bottom: 30px;
    padding: 18px;
    border-radius: var(--inex-radius);
    background: var(--inex-surface);
    border: 1px solid var(--inex-line);
}

.inex-filters .form-control {
    background: #fff;
}

.inex-filters__search {
    position: relative;
}

.inex-filters__search i {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--inex-muted);
}

.inex-filters__search .form-control {
    padding-left: 42px;
}

.inex-filters__actions {
    display: flex;
    gap: 8px;
}

@media (max-width: 991.98px) {
    .inex-filters {
        grid-template-columns: 1fr 1fr;
    }

    .inex-filters__search,
    .inex-filters__actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 575.98px) {
    .inex-filters {
        grid-template-columns: 1fr;
    }
}

.inex-table-wrap {
    overflow: hidden;
    border-radius: var(--inex-radius);
    border: 1px solid var(--inex-line);
    background: #fff;
    box-shadow: var(--inex-shadow-sm);
}

.inex-table {
    width: 100%;
    border-collapse: collapse;
}

.inex-table th {
    padding: 14px 18px;
    background: var(--inex-surface);
    color: var(--inex-muted);
    font-family: "Work Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: left;
    text-transform: uppercase;
    border-bottom: 1px solid var(--inex-line);
}

.inex-table td {
    padding: 14px 18px;
    color: var(--inex-ink);
    font-size: 15px;
    vertical-align: middle;
    border-bottom: 1px solid var(--inex-line);
}

.inex-table tbody tr:last-child td {
    border-bottom: 0;
}

.inex-table tbody tr {
    transition: background-color .15s ease;
}

.inex-table tbody tr:hover {
    background: #FAFCFF;
}

.inex-table__title {
    display: flex;
    align-items: center;
    gap: 14px;
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-weight: 700;
    text-decoration: none;
}

.inex-table__title:hover {
    color: var(--inex-blue-dark);
}

.inex-table__title img,
.inex-table__thumb {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 10px;
    object-fit: cover;
}

.inex-table__thumb {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #EFF8FF;
    color: var(--inex-blue-dark);
}

.inex-table__title small {
    display: block;
    margin-top: 2px;
    color: var(--inex-muted);
    font-family: "Mulish", sans-serif;
    font-size: 13px;
    font-weight: 400;
}

.inex-table__action {
    text-align: right;
    white-space: nowrap;
}

/* On a phone each row becomes a card, with the column name beside each value. */
@media (max-width: 767.98px) {
    .inex-table-wrap {
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .inex-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
    }

    .inex-table,
    .inex-table tbody,
    .inex-table tr,
    .inex-table td {
        display: block;
    }

    .inex-table tr {
        margin-bottom: 14px;
        padding: 6px 4px;
        border-radius: var(--inex-radius);
        border: 1px solid var(--inex-line);
        background: #fff;
    }

    .inex-table td {
        display: flex;
        justify-content: space-between;
        gap: 14px;
        padding: 10px 14px;
        border-bottom: 1px dashed var(--inex-line);
        text-align: right;
    }

    .inex-table td[data-label]::before {
        content: attr(data-label);
        color: var(--inex-muted);
        font-size: 13px;
        font-weight: 600;
        text-align: left;
    }

    .inex-table td[data-label="Innovation"] {
        display: block;
        text-align: left;
    }

    .inex-table td[data-label="Innovation"]::before {
        content: none;
    }

    .inex-table__action {
        justify-content: flex-end;
    }
}

.inex-chip-tag {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 999px;
    background: #EFF8FF;
    color: var(--inex-blue-dark);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.inex-chip-tag:hover {
    background: var(--inex-blue-dark);
    color: #fff;
}

.inex-award-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.inex-award-badge--gold {
    background: #FFF6D6;
    color: #8A6100;
    border: 1px solid #F2D675;
}

.inex-award-badge--silver {
    background: #F2F4F7;
    color: #475467;
    border: 1px solid #D0D5DD;
}

.inex-award-badge--bronze {
    background: #FCEFE3;
    color: #8B4A1C;
    border: 1px solid #E9C09B;
}

.inex-award-badge--special {
    background: var(--inex-navy);
    color: #fff;
    border: 1px solid var(--inex-navy);
}

.inex-award-badge--lg {
    margin-bottom: 14px;
    padding: 8px 16px;
    font-size: 14px;
}

.inex-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 26px;
}

.inex-pager__summary {
    color: var(--inex-muted);
    font-size: 14px;
}

.inex-pager ul {
    display: flex;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.inex-pager__link,
.inex-pager__gap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 10px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
}

.inex-pager__link {
    color: var(--inex-ink);
    background: #fff;
    border: 1px solid var(--inex-line);
}

a.inex-pager__link:hover {
    border-color: var(--inex-blue);
    color: var(--inex-blue-dark);
}

.inex-pager__link.is-current {
    background: var(--inex-navy);
    border-color: var(--inex-navy);
    color: #fff;
}

.inex-pager__link.is-disabled {
    opacity: 0.4;
}

.inex-pager__gap {
    color: var(--inex-muted);
}

/* ------------------------------------------------------------------------ */
/* Innovation page                                                          */
/* ------------------------------------------------------------------------ */

.inex-hero-compact--slim .slider-height2 {
    min-height: 240px !important;
    height: 240px !important;
}

.inex-hero-compact--slim .hero-caption h2 {
    font-size: 34px;
}

.inex-crumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 30px;
    color: var(--inex-muted);
    font-size: 14px;
}

.inex-crumbs a {
    color: var(--inex-blue-dark);
    font-weight: 600;
    text-decoration: none;
}

.inex-gallery {
    position: sticky;
    top: 110px;
}

.inex-gallery__main {
    margin: 0;
    overflow: hidden;
    border-radius: 18px;
    background: var(--inex-surface);
    border: 1px solid var(--inex-line);
    box-shadow: var(--inex-shadow);
}

/* Posters are usually portrait; show them whole rather than cropping. */
.inex-gallery__main img {
    display: block;
    width: 100%;
    max-height: 640px;
    object-fit: contain;
    background: #fff;
}

.inex-gallery__main figcaption {
    padding: 12px 16px;
    color: var(--inex-muted);
    font-size: 14px;
    border-top: 1px solid var(--inex-line);
    background: #fff;
}

.inex-gallery__placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    aspect-ratio: 3 / 4;
    color: var(--inex-muted);
    background:
        radial-gradient(circle at 100% 0%, rgba(77, 183, 254, 0.25), transparent 55%),
        var(--inex-surface);
}

.inex-gallery__placeholder i {
    color: var(--inex-blue);
    font-size: 48px;
}

.inex-gallery__thumbs {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.inex-gallery__thumb {
    padding: 0;
    overflow: hidden;
    aspect-ratio: 1;
    border-radius: 10px;
    border: 2px solid transparent;
    background: var(--inex-surface);
    cursor: pointer;
    opacity: 0.7;
    transition: opacity .2s ease, border-color .2s ease;
}

.inex-gallery__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inex-gallery__thumb:hover,
.inex-gallery__thumb.is-active {
    opacity: 1;
    border-color: var(--inex-blue);
}

.inex-innovation__title {
    margin: 0 0 14px;
    color: var(--inex-ink);
    font-size: clamp(30px, 4vw, 42px);
    font-weight: 700;
    line-height: 1.15;
}

.inex-innovation__lead {
    margin: 20px 0 26px;
    color: #374151;
    font-size: 19px;
    font-weight: 400;
    line-height: 1.6;
}

.inex-facts-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    margin: 0 0 34px;
    overflow: hidden;
    border-radius: var(--inex-radius);
    border: 1px solid var(--inex-line);
    background: var(--inex-line);
}

.inex-facts-list > div {
    padding: 14px 18px;
    background: #fff;
}

.inex-facts-list dt {
    margin-bottom: 2px;
    color: var(--inex-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.inex-facts-list dd {
    margin: 0;
    color: var(--inex-ink);
    font-size: 16px;
    font-weight: 600;
}

.inex-innovation__subhead {
    margin-bottom: 14px;
    color: var(--inex-ink);
    font-size: 22px;
    font-weight: 700;
}

.inex-related {
    display: flex;
    gap: 16px;
    align-items: center;
    height: 100%;
    padding: 14px;
    border-radius: var(--inex-radius);
    background: #fff;
    box-shadow: var(--inex-shadow-sm);
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}

.inex-related:hover {
    transform: translateY(-3px);
    box-shadow: var(--inex-shadow);
}

.inex-related__media {
    flex: 0 0 76px;
    height: 76px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 12px;
    background: #EFF8FF;
    color: var(--inex-blue-dark);
    font-size: 24px;
}

.inex-related__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inex-related strong {
    display: block;
    color: var(--inex-ink);
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
}

.inex-related__body span {
    color: var(--inex-muted);
    font-size: 14px;
}

@media (max-width: 991.98px) {
    .inex-gallery {
        position: static;
    }
}

@media (max-width: 575.98px) {
    .inex-facts-list {
        grid-template-columns: 1fr;
    }
}

/* ------------------------------------------------------------------------ */
/* Terms and the 404 page                                                   */
/* ------------------------------------------------------------------------ */

.inex-toc {
    position: sticky;
    top: 110px;
    padding: 22px;
    border-radius: var(--inex-radius);
    background: var(--inex-surface);
    border: 1px solid var(--inex-line);
}

.inex-toc strong {
    display: block;
    margin-bottom: 10px;
    color: var(--inex-ink);
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.inex-toc ol {
    margin: 0;
    padding-left: 20px;
}

.inex-toc li {
    padding: 4px 0;
    list-style: decimal;
    color: var(--inex-muted);
    font-size: 14px;
}

.inex-toc a {
    color: var(--inex-muted);
    text-decoration: none;
}

.inex-toc a:hover {
    color: var(--inex-blue-dark);
}

.inex-legal section + section {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--inex-line);
}

.inex-legal h2 {
    font-size: 21px;
}

.inex-notfound {
    max-width: 620px;
    margin: 0 auto;
    text-align: center;
}

.inex-notfound__code {
    display: block;
    margin-bottom: 6px;
    font-family: "Work Sans", sans-serif;
    font-size: clamp(88px, 18vw, 150px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
    background: linear-gradient(135deg, var(--inex-blue), var(--inex-orange));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.inex-notfound h3 {
    margin-bottom: 12px;
    color: var(--inex-ink);
    font-size: 26px;
    font-weight: 700;
}

.inex-notfound p {
    color: var(--inex-muted);
}

.inex-notfound__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 26px;
}

/* ------------------------------------------------------------------------ */
/* Contact                                                                  */
/* ------------------------------------------------------------------------ */

.inex-contact__list {
    margin: 30px 0 0;
    padding: 0;
    list-style: none;
}

.inex-contact__list li {
    display: flex;
    gap: 16px;
    padding: 18px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

/* Scoped to the list so it outranks `.inex-contact__list span` below, which
   otherwise turns the box into a block and pins the icon to its corner. */
.inex-contact__list .inex-contact__icon {
    flex: 0 0 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(77, 183, 254, 0.18);
    color: var(--inex-blue);
    font-size: 16px;
}

.inex-contact__list strong {
    display: block;
    margin-bottom: 4px;
    color: #fff;
    font-family: "Work Sans", sans-serif;
    font-size: 15px;
}

.inex-contact__list a {
    display: block;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    line-height: 1.6;
}

.inex-contact__list a:hover {
    color: var(--inex-blue);
}

.inex-contact__list span {
    display: block;
    color: rgba(255, 255, 255, 0.65);
    font-size: 14px;
    line-height: 1.5;
}

.inex-contact__list .inex-contact__address {
    color: rgba(255, 255, 255, 0.88);
    margin-bottom: 6px;
}

.inex-form .inex-form__textarea {
    height: auto;
    min-height: 150px;
    resize: vertical;
}

.inex-contact__sent {
    padding: 50px 10px;
    text-align: center;
}

.inex-contact__sent-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    margin-bottom: 20px;
    border-radius: 50%;
    background: #ECFDF3;
    color: #12B76A;
    font-size: 30px;
}

.inex-contact__sent h3 {
    margin-bottom: 10px;
    color: var(--inex-ink);
    font-size: 26px;
    font-weight: 700;
}

.inex-contact__sent p {
    max-width: 420px;
    margin: 0 auto 18px;
    color: var(--inex-muted);
}

.inex-map iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 380px;
    border: 0;
}

/* ---------- Mobile: no sideways scroll ----------
   The theme's containers have 15px side padding, narrower than half of
   Bootstrap's g-5 gutter (24px), so g-5 rows poked 12px past the screen
   edge and the whole page could be dragged sideways. */
@media (max-width: 767.98px) {
    .row.g-5,
    .row.gx-5 {
        --bs-gutter-x: 1.5rem;
    }

    .testimonial-area,
    .slick-list {
        overflow: hidden;
    }
}

/* Belt and braces: nothing may widen the page on a phone. */
html,
body {
    overflow-x: clip;
}

/* ---------- Mobile menu (slicknav) ----------
   The theme shipped it light blue with small rows and a second arrow next
   to every dropdown; this brings it in line with the navy header. */
.slicknav_menu .slicknav_nav {
    background: var(--inex-navy, #1a213d) !important;
    margin-top: 12px;
    padding: 8px 0;
    border-radius: 12px;
    box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.6);
}

.slicknav_nav li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.slicknav_nav li:last-child {
    border-bottom: 0;
}

.slicknav_nav a,
.slicknav_nav .slicknav_row {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
    margin: 0 !important;
    padding: 12px 20px !important;
    font-size: 16px;
    font-weight: 500;
    color: #fff !important;
    background: transparent !important;
}

.slicknav_nav a:hover,
.slicknav_nav a:focus {
    color: #ff6f00 !important;
}

/* The label's own chevron duplicates slicknav's toggle arrow. */
.slicknav_nav .slicknav_row > a > i,
.slicknav_nav .slicknav_item i {
    display: none;
}

.slicknav_nav .slicknav_arrow {
    font-size: 20px;
    color: #ff6f00;
}

.slicknav_nav ul {
    margin: 0 0 8px;
    background: rgba(255, 255, 255, 0.04);
}

.slicknav_nav ul a {
    min-height: 44px;
    padding-left: 36px !important;
    font-size: 15px;
    color: rgba(255, 255, 255, 0.8) !important;
}

/* ---------- Back to top ----------
   Theme default was light blue; brand orange, and a little smaller on a
   phone so it covers less of the content underneath. */
#back-top a {
    background: #ff6f00 !important;
    color: #fff !important;
    box-shadow: 0 10px 24px -10px rgba(255, 111, 0, 0.7);
}

@media (max-width: 767.98px) {
    #back-top a {
        width: 44px !important;
        height: 44px !important;
        line-height: 44px !important;
        font-size: 16px;
    }
}

/* ---------- Burger menu (below xl) ----------
   The burger lives in the header's actions row (see the navbar partial), so
   flexbox lines it up with Register at every width. Its dropdown is taken
   out of the row and hung below the whole header instead. */
.main-header {
    position: relative;
}

.inex-nav__actions .mobile_menu,
.inex-nav__actions .slicknav_menu {
    position: static;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    background: none;
}

.inex-nav__actions .slicknav_menu .slicknav_btn {
    position: static;
    top: auto !important;
    right: auto !important;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.06);
}

.inex-nav__actions .slicknav_menu .slicknav_icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    position: static;
    width: 18px;
    height: auto;
    margin: 0 !important;
    float: none;
}

.inex-nav__actions .slicknav_menu .slicknav_icon-bar {
    width: 18px;
    height: 2px;
    margin: 0 !important;
    border-radius: 2px;
    background: #fff;
    box-shadow: none;
}

.inex-nav__actions .slicknav_menu .slicknav_menutxt {
    display: none;
}

.inex-nav__actions .slicknav_menu .slicknav_nav {
    position: absolute;
    top: 100%;
    left: 12px;
    right: 12px;
    z-index: 50;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}

@media (min-width: 768px) {
    .inex-nav__actions .slicknav_menu .slicknav_nav {
        left: auto;
        width: 360px;
    }
}

/* ---------- Footer on phones: centred ----------
   Brand block and contact details run full width; the two link lists sit
   side by side so the footer doesn't become one long left-aligned column. */
@media (max-width: 767.98px) {
    .footer-area .row > [class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
        margin-left: 0;
        text-align: center;
    }

    .footer-area .row > .col-xl-2 {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .footer-area .single-footer-caption {
        margin-bottom: 32px;
    }

    .footer-area .footer-logo img {
        margin: 0 auto;
    }

    .footer-area .footer-social {
        display: flex;
        justify-content: center;
        gap: 18px;
    }

    .footer-area .footer-social a {
        margin: 0;
    }

    .footer-area .footer-tittle ul {
        padding: 0;
    }
}

/* ---------- Gallery ---------- */
.inex-albums {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 28px;
}

.inex-album {
    display: block;
    overflow: hidden;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 14px 34px -22px rgba(26, 33, 61, 0.45);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.inex-album:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 40px -22px rgba(26, 33, 61, 0.55);
}

.inex-album__cover {
    position: relative;
    aspect-ratio: 3 / 2;
    background: #e9ecf3;
}

.inex-album__cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inex-album__count {
    position: absolute;
    right: 12px;
    bottom: 12px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: rgba(26, 33, 61, 0.75);
}

.inex-album__body {
    padding: 18px 20px 20px;
}

.inex-album__body h3 {
    margin: 4px 0 0;
    font-size: 19px;
    color: var(--inex-navy, #1a213d);
}

.inex-album__meta {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #ff6f00;
}

.inex-album-intro {
    max-width: 760px;
    margin: 0 0 28px;
}

.inex-album-intro p {
    margin: 8px 0 0;
}

/* Masonry-style columns keep each photo at its own proportions. */
.inex-photos {
    column-count: 3;
    column-gap: 14px;
}

.inex-photo {
    display: block;
    margin: 0 0 14px;
    overflow: hidden;
    border-radius: 10px;
    break-inside: avoid;
    background: #e9ecf3;
}

.inex-photo img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.35s ease;
}

.inex-photo:hover img {
    transform: scale(1.04);
}

@media (max-width: 991.98px) {
    .inex-photos {
        column-count: 2;
    }
}

@media (max-width: 575.98px) {
    .inex-photos {
        column-gap: 8px;
    }

    .inex-photo {
        margin-bottom: 8px;
        border-radius: 8px;
    }
}

/* Lightbox: above the sticky header, on a dark backdrop. */
.mfp-bg {
    z-index: 100040;
    background: #0b0f1d;
    opacity: 0.92 !important;
}

.mfp-wrap {
    z-index: 100050;
}

.mfp-title {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.85);
}

/* 1200-1399px: just enough room for the full menu on one line once the
   theme's generous item spacing is trimmed. */
@media (min-width: 1200px) and (max-width: 1399.98px) {
    .main-menu ul#navigation > li {
        margin: 0 2px;
    }

    .main-menu ul#navigation > li > a {
        padding-left: 4px;
        padding-right: 4px;
    }
}