/*
 * Consolidated child theme stylesheet.
 * Phase 1 starts by migrating header/navigation rules from the parent bundle
 * so we can diff behaviour before dequeueing legacy handles.
 */

/* ==========================================================================
   Accessibility
   ========================================================================== */

.skip-to-content {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    z-index: 100000;
}

.skip-to-content:focus {
    position: fixed;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    padding: 0.75rem 1.5rem;
    background: var(--lse-structure-navy, #000032);
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    z-index: 100000;
    outline: 2px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

/* ==========================================================================
   Brand Base & Typography
   ========================================================================== */

:root {
    --lse-primary-magenta: #E6007E;
    --lse-secondary-orange: #EE7218;
    --lse-tertiary-blue: #6ACAF3;
    --lse-structure-navy: #000032;
    --lse-neutral-gray: #666666;
    --lse-light-gray: #f5f5f5;
    --lse-white: #ffffff;
    --partner-london-homestays: #ed3036;
    --partner-uk-residences: #7ac043;
    --lse-primary-orange: var(--lse-secondary-orange);
    --lse-light-blue: var(--lse-tertiary-blue);
    --lse-magenta: var(--lse-primary-magenta);
    --lse-dark-blue: var(--lse-structure-navy);
    --lse-body-font-family: 'proxima-nova', 'Proxima Nova', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --lse-heading-font-family: var(--lse-body-font-family);
    --lse-heading-font-weight: 700;
    --lse-heading-line-height: 1.3;
    --lse-heading-letter-spacing: 0.5px;
    --lse-heading-h2-size: 2rem;
    --lse-heading-h2-margin-top: 40px;
    --lse-heading-h2-margin-bottom: 30px;
    --lse-heading-h2-margin: var(--lse-heading-h2-margin-top) 0 var(--lse-heading-h2-margin-bottom);
    --lse-heading-underline-width: 300px;
    --lse-heading-underline-height: 4px;
    --lse-heading-underline-margin-top: 15px;
    --lse-wrap-base-width: 80%;
    --lse-wrap-desktop-width: 85%;
    --lse-wrap-wide-width: 96%;
    --lse-grid-max-width: 1200px;
    --lse-grid-gutter: 24px;
    --lse-grid-gutter-narrow: 12px;
    --lse-grid-gutter-wide: 48px;
    --lse-module-overlay-bg: rgba(0, 0, 0, 0.7);
    --lse-module-heading-padding: 22px;
    --lse-module-heading-letter-spacing: 1px;
    --lse-module-heading-color: #ffffff;
    --lse-module-price-background: var(--lse-structure-navy);
    --lse-module-price-text: #ffffff;
    --lse-module-availability-background: #ffcb99;
    --lse-module-availability-text: #000000;
    --lse-accent-color: var(--lse-primary-magenta);
    --lse-option-module-heading: #424564;
    --lse-residence-module-heading: #684f6d;
}

body {
    font-family: var(--lse-body-font-family);
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--lse-heading-font-family);
    font-weight: var(--lse-heading-font-weight);
    color: var(--lse-structure-navy);
    line-height: var(--lse-heading-line-height);
}

h2 {
    font-size: var(--lse-heading-h2-size) !important;
    letter-spacing: var(--lse-heading-letter-spacing) !important;
    margin: var(--lse-heading-h2-margin) !important;
    color: var(--lse-structure-navy) !important;
    font-weight: var(--lse-heading-font-weight) !important;
    line-height: var(--lse-heading-line-height) !important;
    padding: 0 !important;
    text-align: center !important;
    position: relative !important;
    background: none !important;
    border: none !important;
}

h2::after {
    content: '';
    display: block;
    width: var(--lse-heading-underline-width) !important;
    height: var(--lse-heading-underline-height) !important;
    background: var(--lse-primary-magenta) !important;
    margin: var(--lse-heading-underline-margin-top) auto 0 !important;
    border-radius: 2px !important;
}

body,
html {
    background: #ffffff;
    color: var(--lse-structure-navy);
    overflow-x: hidden; /* Prevent horizontal scroll from Splide carousel clones */
}

html body {
    overflow-x: hidden;
    max-width: 100vw;
}

/* Global Splide containment: prevent clone slides from extending document width
   This ensures all Splide carousels respect viewport bounds on mobile */
.splide,
.splide__track,
.splide__list {
    max-width: 100%;
}

.splide__track {
    overflow-x: hidden;
}

html body::after,
html body .container::after,
html body .wrap::after {
    content: "";
    display: table;
    clear: both;
}

/* ==========================================================================
   Layout Grid System Support
   ========================================================================== */

.wrap {
    width: var(--lse-wrap-base-width, 80%);
    margin: 0 auto;
}

@media (min-width: 768px) {
    .wrap {
        width: var(--lse-wrap-desktop-width, 85%);
        max-width: var(--lse-grid-max-width, 1200px);
    }
}

@media (min-width: 1030px) {
    .wrap {
        width: var(--lse-wrap-wide-width, 96%);
    }
}

.clearfix::before,
.clearfix::after {
    content: "";
    display: table;
}
.clearfix::after {
    clear: both;
}
.clearfix {
    zoom: 1;
}
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

.grid {
    list-style: none;
    margin: 0;
    padding: 0;
    margin-left: calc(-1 * var(--lse-grid-gutter, 24px));
}
.grid__item {
    display: inline-block;
    padding-left: var(--lse-grid-gutter, 24px);
    vertical-align: top;
    width: 100%;
    box-sizing: border-box;
}

[class*='grid--rev'] {
    direction: rtl;
    text-align: left;
}
[class*='grid--rev'] > [class*='grid__item'] {
    direction: ltr;
    text-align: left;
}
[class*='grid--full'] {
    margin-left: 0;
}
[class*='grid--full'] > [class*='grid__item'] {
    padding-left: 0;
}
[class*='grid--right'] {
    text-align: right;
}
[class*='grid--right'] > [class*='grid__item'] {
    text-align: left;
}
[class*='grid--center'] {
    text-align: center;
}
[class*='grid--center'] > [class*='grid__item'] {
    text-align: left;
}
[class*='grid--middle'] > [class*='grid__item'] {
    vertical-align: middle;
}
[class*='grid--bottom'] > [class*='grid__item'] {
    vertical-align: bottom;
}
[class*='grid--narrow'] {
    margin-left: calc(-1 * var(--lse-grid-gutter-narrow, 12px));
}
[class*='grid--narrow'] > [class*='grid__item'] {
    padding-left: var(--lse-grid-gutter-narrow, 12px);
}
[class*='grid--wide'] {
    margin-left: calc(-1 * var(--lse-grid-gutter-wide, 48px));
}
[class*='grid--wide'] > [class*='grid__item'] {
    padding-left: var(--lse-grid-gutter-wide, 48px);
}

.one-whole {
    width: 100%;
}

.eleven-twelfths {
    width: 91.666%;
}

.nine-tenths {
    width: 90%;
}

.seven-eighths {
    width: 87.5%;
}

.five-sixths,
.ten-twelfths {
    width: 83.333%;
}

.eight-tenths,
.four-fifths {
    width: 80%;
}

.nine-twelfths,
.six-eighths,
.three-quarters {
    width: 75%;
}

.seven-tenths {
    width: 70%;
}

.eight-twelfths,
.four-sixths,
.two-thirds {
    width: 66.666%;
}

.five-eighths {
    width: 62.5%;
}

.six-tenths,
.three-fifths {
    width: 60%;
}

.seven-twelfths {
    width: 58.333%;
}

.five-tenths,
.four-eighths,
.one-half,
.six-twelfths,
.three-sixths,
.two-quarters {
    width: 50%;
}

.five-twelfths {
    width: 41.666%;
}

.four-tenths,
.two-fifths {
    width: 40%;
}

.three-eighths {
    width: 37.5%;
}

.four-twelfths,
.one-third,
.two-sixths {
    width: 33.333%;
}

.three-tenths {
    width: 30%;
}

.one-quarter,
.three-twelfths,
.two-eighths {
    width: 25%;
}

.one-fifth,
.two-tenths {
    width: 20%;
}

.one-sixth,
.two-twelfths {
    width: 16.666%;
}

.one-eighth {
    width: 12.5%;
}

.one-tenth {
    width: 10%;
}

.one-twelfth {
    width: 8.333%;
}

@media (max-width: 480px) {
    .palm--one-whole {
        width: 100%;
    }

    .palm--eleven-twelfths {
        width: 91.666%;
    }

    .palm--nine-tenths {
        width: 90%;
    }

    .palm--seven-eighths {
        width: 87.5%;
    }

    .palm--five-sixths,
    .palm--ten-twelfths {
        width: 83.333%;
    }

    .palm--eight-tenths,
    .palm--four-fifths {
        width: 80%;
    }

    .palm--nine-twelfths,
    .palm--six-eighths,
    .palm--three-quarters {
        width: 75%;
    }

    .palm--seven-tenths {
        width: 70%;
    }

    .palm--eight-twelfths,
    .palm--four-sixths,
    .palm--two-thirds {
        width: 66.666%;
    }

    .palm--five-eighths {
        width: 62.5%;
    }

    .palm--six-tenths,
    .palm--three-fifths {
        width: 60%;
    }

    .palm--seven-twelfths {
        width: 58.333%;
    }

    .palm--five-tenths,
    .palm--four-eighths,
    .palm--one-half,
    .palm--six-twelfths,
    .palm--three-sixths,
    .palm--two-quarters {
        width: 50%;
    }

    .palm--five-twelfths {
        width: 41.666%;
    }

    .palm--four-tenths,
    .palm--two-fifths {
        width: 40%;
    }

    .palm--three-eighths {
        width: 37.5%;
    }

    .palm--four-twelfths,
    .palm--one-third,
    .palm--two-sixths {
        width: 33.333%;
    }

    .palm--three-tenths {
        width: 30%;
    }

    .palm--one-quarter,
    .palm--three-twelfths,
    .palm--two-eighths {
        width: 25%;
    }

    .palm--one-fifth,
    .palm--two-tenths {
        width: 20%;
    }

    .palm--one-sixth,
    .palm--two-twelfths {
        width: 16.666%;
    }

    .palm--one-eighth {
        width: 12.5%;
    }

    .palm--one-tenth {
        width: 10%;
    }

    .palm--one-twelfth {
        width: 8.333%;
    }
}

@media (min-width: 481px) and (max-width: 1023px) {
    .lap--one-whole {
        width: 100%;
    }

    .lap--eleven-twelfths {
        width: 91.666%;
    }

    .lap--nine-tenths {
        width: 90%;
    }

    .lap--seven-eighths {
        width: 87.5%;
    }

    .lap--five-sixths,
    .lap--ten-twelfths {
        width: 83.333%;
    }

    .lap--eight-tenths,
    .lap--four-fifths {
        width: 80%;
    }

    .lap--nine-twelfths,
    .lap--six-eighths,
    .lap--three-quarters {
        width: 75%;
    }

    .lap--seven-tenths {
        width: 70%;
    }

    .lap--eight-twelfths,
    .lap--four-sixths,
    .lap--two-thirds {
        width: 66.666%;
    }

    .lap--five-eighths {
        width: 62.5%;
    }

    .lap--six-tenths,
    .lap--three-fifths {
        width: 60%;
    }

    .lap--seven-twelfths {
        width: 58.333%;
    }

    .lap--five-tenths,
    .lap--four-eighths,
    .lap--one-half,
    .lap--six-twelfths,
    .lap--three-sixths,
    .lap--two-quarters {
        width: 50%;
    }

    .lap--five-twelfths {
        width: 41.666%;
    }

    .lap--four-tenths,
    .lap--two-fifths {
        width: 40%;
    }

    .lap--three-eighths {
        width: 37.5%;
    }

    .lap--four-twelfths,
    .lap--one-third,
    .lap--two-sixths {
        width: 33.333%;
    }

    .lap--three-tenths {
        width: 30%;
    }

    .lap--one-quarter,
    .lap--three-twelfths,
    .lap--two-eighths {
        width: 25%;
    }

    .lap--one-fifth,
    .lap--two-tenths {
        width: 20%;
    }

    .lap--one-sixth,
    .lap--two-twelfths {
        width: 16.666%;
    }

    .lap--one-eighth {
        width: 12.5%;
    }

    .lap--one-tenth {
        width: 10%;
    }

    .lap--one-twelfth {
        width: 8.333%;
    }
}

@media (min-width: 1024px) {
    .desk--one-whole {
        width: 100%;
    }

    .desk--eleven-twelfths {
        width: 91.666%;
    }

    .desk--nine-tenths {
        width: 90%;
    }

    .desk--seven-eighths {
        width: 87.5%;
    }

    .desk--five-sixths,
    .desk--ten-twelfths {
        width: 83.333%;
    }

    .desk--eight-tenths,
    .desk--four-fifths {
        width: 80%;
    }

    .desk--nine-twelfths,
    .desk--six-eighths,
    .desk--three-quarters {
        width: 75%;
    }

    .desk--seven-tenths {
        width: 70%;
    }

    .desk--eight-twelfths,
    .desk--four-sixths,
    .desk--two-thirds {
        width: 66.666%;
    }

    .desk--five-eighths {
        width: 62.5%;
    }

    .desk--six-tenths,
    .desk--three-fifths {
        width: 60%;
    }

    .desk--seven-twelfths {
        width: 58.333%;
    }

    .desk--five-tenths,
    .desk--four-eighths,
    .desk--one-half,
    .desk--six-twelfths,
    .desk--three-sixths,
    .desk--two-quarters {
        width: 50%;
    }

    .desk--five-twelfths {
        width: 41.666%;
    }

    .desk--four-tenths,
    .desk--two-fifths {
        width: 40%;
    }

    .desk--three-eighths {
        width: 37.5%;
    }

    .desk--four-twelfths,
    .desk--one-third,
    .desk--two-sixths {
        width: 33.333%;
    }

    .desk--three-tenths {
        width: 30%;
    }

    .desk--one-quarter,
    .desk--three-twelfths,
    .desk--two-eighths {
        width: 25%;
    }

    .desk--one-fifth,
    .desk--two-tenths {
        width: 20%;
    }

    .desk--one-sixth,
    .desk--two-twelfths {
        width: 16.666%;
    }

    .desk--one-eighth {
        width: 12.5%;
    }

    .desk--one-tenth {
        width: 10%;
    }

    .desk--one-twelfth {
        width: 8.333%;
    }
}

[class*='push--'], [class*='pull--'] {
    position: relative;
}

.push--one-whole {
    left: 100%;
}

.push--eleven-twelfths {
    left: 91.666%;
}

.push--nine-tenths {
    left: 90%;
}

.push--seven-eighths {
    left: 87.5%;
}

.push--five-sixths,
.push--ten-twelfths {
    left: 83.333%;
}

.push--eight-tenths,
.push--four-fifths {
    left: 80%;
}

.push--nine-twelfths,
.push--six-eighths,
.push--three-quarters {
    left: 75%;
}

.push--seven-tenths {
    left: 70%;
}

.push--eight-twelfths,
.push--four-sixths,
.push--two-thirds {
    left: 66.666%;
}

.push--five-eighths {
    left: 62.5%;
}

.push--six-tenths,
.push--three-fifths {
    left: 60%;
}

.push--seven-twelfths {
    left: 58.333%;
}

.push--five-tenths,
.push--four-eighths,
.push--one-half,
.push--six-twelfths,
.push--three-sixths,
.push--two-quarters {
    left: 50%;
}

.push--five-twelfths {
    left: 41.666%;
}

.push--four-tenths,
.push--two-fifths {
    left: 40%;
}

.push--three-eighths {
    left: 37.5%;
}

.push--four-twelfths,
.push--one-third,
.push--two-sixths {
    left: 33.333%;
}

.push--three-tenths {
    left: 30%;
}

.push--one-quarter,
.push--three-twelfths,
.push--two-eighths {
    left: 25%;
}

.push--one-fifth,
.push--two-tenths {
    left: 20%;
}

.push--one-sixth,
.push--two-twelfths {
    left: 16.666%;
}

.push--one-eighth {
    left: 12.5%;
}

.push--one-tenth {
    left: 10%;
}

.push--one-twelfth {
    left: 8.333%;
}

@media (max-width: 480px) {
    .push--palm--one-whole {
        left: 100%;
    }

    .push--palm--eleven-twelfths {
        left: 91.666%;
    }

    .push--palm--nine-tenths {
        left: 90%;
    }

    .push--palm--seven-eighths {
        left: 87.5%;
    }

    .push--palm--five-sixths,
    .push--palm--ten-twelfths {
        left: 83.333%;
    }

    .push--palm--eight-tenths,
    .push--palm--four-fifths {
        left: 80%;
    }

    .push--palm--nine-twelfths,
    .push--palm--six-eighths,
    .push--palm--three-quarters {
        left: 75%;
    }

    .push--palm--seven-tenths {
        left: 70%;
    }

    .push--palm--eight-twelfths,
    .push--palm--four-sixths,
    .push--palm--two-thirds {
        left: 66.666%;
    }

    .push--palm--five-eighths {
        left: 62.5%;
    }

    .push--palm--six-tenths,
    .push--palm--three-fifths {
        left: 60%;
    }

    .push--palm--seven-twelfths {
        left: 58.333%;
    }

    .push--palm--five-tenths,
    .push--palm--four-eighths,
    .push--palm--one-half,
    .push--palm--six-twelfths,
    .push--palm--three-sixths,
    .push--palm--two-quarters {
        left: 50%;
    }

    .push--palm--five-twelfths {
        left: 41.666%;
    }

    .push--palm--four-tenths,
    .push--palm--two-fifths {
        left: 40%;
    }

    .push--palm--three-eighths {
        left: 37.5%;
    }

    .push--palm--four-twelfths,
    .push--palm--one-third,
    .push--palm--two-sixths {
        left: 33.333%;
    }

    .push--palm--three-tenths {
        left: 30%;
    }

    .push--palm--one-quarter,
    .push--palm--three-twelfths,
    .push--palm--two-eighths {
        left: 25%;
    }

    .push--palm--one-fifth,
    .push--palm--two-tenths {
        left: 20%;
    }

    .push--palm--one-sixth,
    .push--palm--two-twelfths {
        left: 16.666%;
    }

    .push--palm--one-eighth {
        left: 12.5%;
    }

    .push--palm--one-tenth {
        left: 10%;
    }

    .push--palm--one-twelfth {
        left: 8.333%;
    }
}

@media (min-width: 481px) and (max-width: 1023px) {
    .push--lap--one-whole {
        left: 100%;
    }

    .push--lap--eleven-twelfths {
        left: 91.666%;
    }

    .push--lap--nine-tenths {
        left: 90%;
    }

    .push--lap--seven-eighths {
        left: 87.5%;
    }

    .push--lap--five-sixths,
    .push--lap--ten-twelfths {
        left: 83.333%;
    }

    .push--lap--eight-tenths,
    .push--lap--four-fifths {
        left: 80%;
    }

    .push--lap--nine-twelfths,
    .push--lap--six-eighths,
    .push--lap--three-quarters {
        left: 75%;
    }

    .push--lap--seven-tenths {
        left: 70%;
    }

    .push--lap--eight-twelfths,
    .push--lap--four-sixths,
    .push--lap--two-thirds {
        left: 66.666%;
    }

    .push--lap--five-eighths {
        left: 62.5%;
    }

    .push--lap--six-tenths,
    .push--lap--three-fifths {
        left: 60%;
    }

    .push--lap--seven-twelfths {
        left: 58.333%;
    }

    .push--lap--five-tenths,
    .push--lap--four-eighths,
    .push--lap--one-half,
    .push--lap--six-twelfths,
    .push--lap--three-sixths,
    .push--lap--two-quarters {
        left: 50%;
    }

    .push--lap--five-twelfths {
        left: 41.666%;
    }

    .push--lap--four-tenths,
    .push--lap--two-fifths {
        left: 40%;
    }

    .push--lap--three-eighths {
        left: 37.5%;
    }

    .push--lap--four-twelfths,
    .push--lap--one-third,
    .push--lap--two-sixths {
        left: 33.333%;
    }

    .push--lap--three-tenths {
        left: 30%;
    }

    .push--lap--one-quarter,
    .push--lap--three-twelfths,
    .push--lap--two-eighths {
        left: 25%;
    }

    .push--lap--one-fifth,
    .push--lap--two-tenths {
        left: 20%;
    }

    .push--lap--one-sixth,
    .push--lap--two-twelfths {
        left: 16.666%;
    }

    .push--lap--one-eighth {
        left: 12.5%;
    }

    .push--lap--one-tenth {
        left: 10%;
    }

    .push--lap--one-twelfth {
        left: 8.333%;
    }
}

@media (min-width: 1024px) {
    .push--desk--one-whole {
        left: 100%;
    }

    .push--desk--eleven-twelfths {
        left: 91.666%;
    }

    .push--desk--nine-tenths {
        left: 90%;
    }

    .push--desk--seven-eighths {
        left: 87.5%;
    }

    .push--desk--five-sixths,
    .push--desk--ten-twelfths {
        left: 83.333%;
    }

    .push--desk--eight-tenths,
    .push--desk--four-fifths {
        left: 80%;
    }

    .push--desk--nine-twelfths,
    .push--desk--six-eighths,
    .push--desk--three-quarters {
        left: 75%;
    }

    .push--desk--seven-tenths {
        left: 70%;
    }

    .push--desk--eight-twelfths,
    .push--desk--four-sixths,
    .push--desk--two-thirds {
        left: 66.666%;
    }

    .push--desk--five-eighths {
        left: 62.5%;
    }

    .push--desk--six-tenths,
    .push--desk--three-fifths {
        left: 60%;
    }

    .push--desk--seven-twelfths {
        left: 58.333%;
    }

    .push--desk--five-tenths,
    .push--desk--four-eighths,
    .push--desk--one-half,
    .push--desk--six-twelfths,
    .push--desk--three-sixths,
    .push--desk--two-quarters {
        left: 50%;
    }

    .push--desk--five-twelfths {
        left: 41.666%;
    }

    .push--desk--four-tenths,
    .push--desk--two-fifths {
        left: 40%;
    }

    .push--desk--three-eighths {
        left: 37.5%;
    }

    .push--desk--four-twelfths,
    .push--desk--one-third,
    .push--desk--two-sixths {
        left: 33.333%;
    }

    .push--desk--three-tenths {
        left: 30%;
    }

    .push--desk--one-quarter,
    .push--desk--three-twelfths,
    .push--desk--two-eighths {
        left: 25%;
    }

    .push--desk--one-fifth,
    .push--desk--two-tenths {
        left: 20%;
    }

    .push--desk--one-sixth,
    .push--desk--two-twelfths {
        left: 16.666%;
    }

    .push--desk--one-eighth {
        left: 12.5%;
    }

    .push--desk--one-tenth {
        left: 10%;
    }

    .push--desk--one-twelfth {
        left: 8.333%;
    }
}

.pull--one-whole {
    right: 100%;
}

.pull--eleven-twelfths {
    right: 91.666%;
}

.pull--nine-tenths {
    right: 90%;
}

.pull--seven-eighths {
    right: 87.5%;
}

.pull--five-sixths,
.pull--ten-twelfths {
    right: 83.333%;
}

.pull--eight-tenths,
.pull--four-fifths {
    right: 80%;
}

.pull--nine-twelfths,
.pull--six-eighths,
.pull--three-quarters {
    right: 75%;
}

.pull--seven-tenths {
    right: 70%;
}

.pull--eight-twelfths,
.pull--four-sixths,
.pull--two-thirds {
    right: 66.666%;
}

.pull--five-eighths {
    right: 62.5%;
}

.pull--six-tenths,
.pull--three-fifths {
    right: 60%;
}

.pull--seven-twelfths {
    right: 58.333%;
}

.pull--five-tenths,
.pull--four-eighths,
.pull--one-half,
.pull--six-twelfths,
.pull--three-sixths,
.pull--two-quarters {
    right: 50%;
}

.pull--five-twelfths {
    right: 41.666%;
}

.pull--four-tenths,
.pull--two-fifths {
    right: 40%;
}

.pull--three-eighths {
    right: 37.5%;
}

.pull--four-twelfths,
.pull--one-third,
.pull--two-sixths {
    right: 33.333%;
}

.pull--three-tenths {
    right: 30%;
}

.pull--one-quarter,
.pull--three-twelfths,
.pull--two-eighths {
    right: 25%;
}

.pull--one-fifth,
.pull--two-tenths {
    right: 20%;
}

.pull--one-sixth,
.pull--two-twelfths {
    right: 16.666%;
}

.pull--one-eighth {
    right: 12.5%;
}

.pull--one-tenth {
    right: 10%;
}

.pull--one-twelfth {
    right: 8.333%;
}

@media (max-width: 480px) {
    .pull--palm--one-whole {
        right: 100%;
    }

    .pull--palm--eleven-twelfths {
        right: 91.666%;
    }

    .pull--palm--nine-tenths {
        right: 90%;
    }

    .pull--palm--seven-eighths {
        right: 87.5%;
    }

    .pull--palm--five-sixths,
    .pull--palm--ten-twelfths {
        right: 83.333%;
    }

    .pull--palm--eight-tenths,
    .pull--palm--four-fifths {
        right: 80%;
    }

    .pull--palm--nine-twelfths,
    .pull--palm--six-eighths,
    .pull--palm--three-quarters {
        right: 75%;
    }

    .pull--palm--seven-tenths {
        right: 70%;
    }

    .pull--palm--eight-twelfths,
    .pull--palm--four-sixths,
    .pull--palm--two-thirds {
        right: 66.666%;
    }

    .pull--palm--five-eighths {
        right: 62.5%;
    }

    .pull--palm--six-tenths,
    .pull--palm--three-fifths {
        right: 60%;
    }

    .pull--palm--seven-twelfths {
        right: 58.333%;
    }

    .pull--palm--five-tenths,
    .pull--palm--four-eighths,
    .pull--palm--one-half,
    .pull--palm--six-twelfths,
    .pull--palm--three-sixths,
    .pull--palm--two-quarters {
        right: 50%;
    }

    .pull--palm--five-twelfths {
        right: 41.666%;
    }

    .pull--palm--four-tenths,
    .pull--palm--two-fifths {
        right: 40%;
    }

    .pull--palm--three-eighths {
        right: 37.5%;
    }

    .pull--palm--four-twelfths,
    .pull--palm--one-third,
    .pull--palm--two-sixths {
        right: 33.333%;
    }

    .pull--palm--three-tenths {
        right: 30%;
    }

    .pull--palm--one-quarter,
    .pull--palm--three-twelfths,
    .pull--palm--two-eighths {
        right: 25%;
    }

    .pull--palm--one-fifth,
    .pull--palm--two-tenths {
        right: 20%;
    }

    .pull--palm--one-sixth,
    .pull--palm--two-twelfths {
        right: 16.666%;
    }

    .pull--palm--one-eighth {
        right: 12.5%;
    }

    .pull--palm--one-tenth {
        right: 10%;
    }

    .pull--palm--one-twelfth {
        right: 8.333%;
    }
}

@media (min-width: 481px) and (max-width: 1023px) {
    .pull--lap--one-whole {
        right: 100%;
    }

    .pull--lap--eleven-twelfths {
        right: 91.666%;
    }

    .pull--lap--nine-tenths {
        right: 90%;
    }

    .pull--lap--seven-eighths {
        right: 87.5%;
    }

    .pull--lap--five-sixths,
    .pull--lap--ten-twelfths {
        right: 83.333%;
    }

    .pull--lap--eight-tenths,
    .pull--lap--four-fifths {
        right: 80%;
    }

    .pull--lap--nine-twelfths,
    .pull--lap--six-eighths,
    .pull--lap--three-quarters {
        right: 75%;
    }

    .pull--lap--seven-tenths {
        right: 70%;
    }

    .pull--lap--eight-twelfths,
    .pull--lap--four-sixths,
    .pull--lap--two-thirds {
        right: 66.666%;
    }

    .pull--lap--five-eighths {
        right: 62.5%;
    }

    .pull--lap--six-tenths,
    .pull--lap--three-fifths {
        right: 60%;
    }

    .pull--lap--seven-twelfths {
        right: 58.333%;
    }

    .pull--lap--five-tenths,
    .pull--lap--four-eighths,
    .pull--lap--one-half,
    .pull--lap--six-twelfths,
    .pull--lap--three-sixths,
    .pull--lap--two-quarters {
        right: 50%;
    }

    .pull--lap--five-twelfths {
        right: 41.666%;
    }

    .pull--lap--four-tenths,
    .pull--lap--two-fifths {
        right: 40%;
    }

    .pull--lap--three-eighths {
        right: 37.5%;
    }

    .pull--lap--four-twelfths,
    .pull--lap--one-third,
    .pull--lap--two-sixths {
        right: 33.333%;
    }

    .pull--lap--three-tenths {
        right: 30%;
    }

    .pull--lap--one-quarter,
    .pull--lap--three-twelfths,
    .pull--lap--two-eighths {
        right: 25%;
    }

    .pull--lap--one-fifth,
    .pull--lap--two-tenths {
        right: 20%;
    }

    .pull--lap--one-sixth,
    .pull--lap--two-twelfths {
        right: 16.666%;
    }

    .pull--lap--one-eighth {
        right: 12.5%;
    }

    .pull--lap--one-tenth {
        right: 10%;
    }

    .pull--lap--one-twelfth {
        right: 8.333%;
    }
}

@media (min-width: 1024px) {
    .pull--desk--one-whole {
        right: 100%;
    }

    .pull--desk--eleven-twelfths {
        right: 91.666%;
    }

    .pull--desk--nine-tenths {
        right: 90%;
    }

    .pull--desk--seven-eighths {
        right: 87.5%;
    }

    .pull--desk--five-sixths,
    .pull--desk--ten-twelfths {
        right: 83.333%;
    }

    .pull--desk--eight-tenths,
    .pull--desk--four-fifths {
        right: 80%;
    }

    .pull--desk--nine-twelfths,
    .pull--desk--six-eighths,
    .pull--desk--three-quarters {
        right: 75%;
    }

    .pull--desk--seven-tenths {
        right: 70%;
    }

    .pull--desk--eight-twelfths,
    .pull--desk--four-sixths,
    .pull--desk--two-thirds {
        right: 66.666%;
    }

    .pull--desk--five-eighths {
        right: 62.5%;
    }

    .pull--desk--six-tenths,
    .pull--desk--three-fifths {
        right: 60%;
    }

    .pull--desk--seven-twelfths {
        right: 58.333%;
    }

    .pull--desk--five-tenths,
    .pull--desk--four-eighths,
    .pull--desk--one-half,
    .pull--desk--six-twelfths,
    .pull--desk--three-sixths,
    .pull--desk--two-quarters {
        right: 50%;
    }

    .pull--desk--five-twelfths {
        right: 41.666%;
    }

    .pull--desk--four-tenths,
    .pull--desk--two-fifths {
        right: 40%;
    }

    .pull--desk--three-eighths {
        right: 37.5%;
    }

    .pull--desk--four-twelfths,
    .pull--desk--one-third,
    .pull--desk--two-sixths {
        right: 33.333%;
    }

    .pull--desk--three-tenths {
        right: 30%;
    }

    .pull--desk--one-quarter,
    .pull--desk--three-twelfths,
    .pull--desk--two-eighths {
        right: 25%;
    }

    .pull--desk--one-fifth,
    .pull--desk--two-tenths {
        right: 20%;
    }

    .pull--desk--one-sixth,
    .pull--desk--two-twelfths {
        right: 16.666%;
    }

    .pull--desk--one-eighth {
        right: 12.5%;
    }

    .pull--desk--one-tenth {
        right: 10%;
    }

    .pull--desk--one-twelfth {
        right: 8.333%;
    }
}

/* ==========================================================================
   Legacy Brand & Accommodation Modules
   ========================================================================== */

.brand_module,
.option_module,
.residence_module {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 18px 38px -26px rgba(0, 0, 0, 0.35);
}

.brand_module img,
.option_module img,
.residence_module img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.brand_module h3,
.option_module h3,
.residence_module h3 {
    position: absolute;
    left: 0;
    width: 100%;
    margin: 0;
    padding: var(--lse-module-heading-padding) 0;
    color: var(--lse-module-heading-color);
    text-align: center;
    text-transform: uppercase;
    letter-spacing: var(--lse-module-heading-letter-spacing);
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.2;
    z-index: 510;
    background: var(--lse-structure-navy);
    box-shadow: inset 0 -4px 0 rgba(255, 255, 255, 0.12);
}

.option_module h3 {
    background: var(--lse-option-module-heading);
}

.residence_module h3 {
    background: var(--lse-residence-module-heading);
}

.brand_module .top-position,
.option_module .top-position,
.residence_module .top-position {
    top: 0;
    bottom: auto;
}

.brand_module .bottom-position,
.option_module .bottom-position,
.residence_module .bottom-position {
    top: auto;
    bottom: 0;
}

.brand_module .price-row,
.option_module .price-row,
.residence_module .price-row {
    position: absolute;
    left: 0;
    width: 100%;
    display: block;
    z-index: 505;
    letter-spacing: 0.5px;
    pointer-events: none;
}

.brand_module .bottom-row-adjustment,
.option_module .bottom-row-adjustment,
.residence_module .bottom-row-adjustment {
    position: relative;
    display: block;
    width: 100%;
}

.brand_module .price-left,
.option_module .price-left,
.residence_module .price-left {
    background: var(--lse-module-price-background);
    color: var(--lse-module-price-text);
    width: 51.5%;
    float: left;
    display: block;
    padding: 10px 0;
    text-align: center;
    text-transform: lowercase;
    line-height: 1.6;
    font-weight: 600;
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.2);
}

.brand_module .availability-text,
.option_module .availability-text,
.residence_module .availability-text {
    background: var(--lse-module-availability-background);
    color: var(--lse-module-availability-text);
    width: 48.5%;
    float: left;
    display: block;
    padding: 10px 0;
    text-align: center;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
}

.brand_module .availability-text span,
.option_module .availability-text span,
.residence_module .availability-text span {
    display: block;
    padding: 0 10px;
}

.brand_module .from-text,
.option_module .from-text,
.residence_module .from-text {
    display: block;
    font-size: 0.75rem;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.75);
    text-transform: uppercase;
}

.brand_module .price-number,
.option_module .price-number,
.residence_module .price-number {
    display: block;
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 4px;
}

.brand_module_overlay,
.option_module_overlay,
.residence_module_overlay {
    position: absolute;
    inset: 0;
    padding: 20px 22px 64px;
    background: var(--lse-module-overlay-bg);
    color: #ffffff;
    z-index: 500;
    opacity: 0;
    transition: opacity 0.25s ease;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    pointer-events: none;
}

.brand_module_overlay.pchange {
    padding: 84px 22px 20px;
}

.brand_module_overlay.fchange {
    padding: 90px 40px 20px;
}

.brand_module_overlay.schange {
    padding: 80px 40px 40px;
}

.brand_module_overlay.sbchange {
    padding: 40px 40px 80px;
}

.brand_module:hover .brand_module_overlay,
.brand_module:focus-within .brand_module_overlay,
.option_module:hover .option_module_overlay,
.option_module:focus-within .option_module_overlay,
.residence_module:hover .residence_module_overlay,
.residence_module:focus-within .residence_module_overlay {
    opacity: 1;
    pointer-events: auto;
}

.brand_module_overlay .overlay_content,
.option_module_overlay .overlay_content,
.residence_module_overlay .overlay_content {
    width: 100%;
    max-height: 100%;
    overflow-y: auto;
    padding-right: 6px;
}

.brand_module_overlay .overlay_content a,
.option_module_overlay .overlay_content a,
.residence_module_overlay .overlay_content a {
    color: #ffffff;
    text-decoration: none;
}

.brand_module_overlay .overlay_content a:hover,
.option_module_overlay .overlay_content a:hover,
.residence_module_overlay .overlay_content a:hover {
    text-decoration: underline;
}

.brand_module .over_anchor,
.option_module .over_anchor,
.residence_module .over_anchor {
    position: absolute;
    inset: 0;
    display: block;
    z-index: 999;
}

.brand_module_text {
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 16px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 14px 32px -24px rgba(0, 0, 0, 0.25);
}

.brand_module_text h3 {
    margin: 0;
    padding: var(--lse-module-heading-padding) 0;
    background: var(--lse-structure-navy);
    color: var(--lse-module-heading-color);
    text-align: center;
    text-transform: uppercase;
    letter-spacing: var(--lse-module-heading-letter-spacing);
    font-weight: 700;
}

.brand_module_text p {
    font-size: 0.95rem;
    line-height: 1.7;
    color: rgba(0, 0, 50, 0.75);
    margin: 0;
    padding: 0 24px 18px;
}

.option_menu {
    background: linear-gradient(120deg, rgba(230, 0, 126, 0.92), rgba(238, 114, 24, 0.88));
    border-radius: 18px;
    padding: 10px 0;
    box-shadow: 0 18px 32px -24px rgba(230, 0, 126, 0.45);
}

.option_menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.option_menu ul li {
    margin: 0 18px;
    border-radius: 14px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.option_menu ul li + li {
    margin-top: 12px;
}

.option_menu ul li a {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    color: #ffffff;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-decoration: none;
    font-size: 1rem;
}

.option_menu ul li a:hover,
.option_menu ul li a:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
}

.option_menu ul li i {
    font-size: 32px;
    width: 36px;
    text-align: center;
}

.option_menu ul li span {
    flex: 1 1 auto;
    display: block;
    line-height: 1.4;
}

.about_content {
    font-size: 1.1rem;
    line-height: 1.8;
    color: rgba(0, 0, 50, 0.78);
    margin: 0 0 32px;
}

.about_content p {
    margin: 0 0 18px;
}

.home_title {
    text-align: center;
    margin: 0 0 24px;
}

.home_title h1 {
    margin: 0;
}

.accommodation_content {
    padding: 35px 0 18px;
}

.accommodation_gallery {
    margin-bottom: 48px;
    overflow: hidden;
    border-radius: 16px;
}

.acc_gallery::after {
    content: "";
    display: table;
    clear: both;
}

.acc_gallery img {
    border: 8px solid rgba(0, 0, 0, 0.08);
    margin: 16px;
    float: left;
    border-radius: 12px;
}

h4.acc_trigger {
    margin: 0 0 10px;
    padding: 12px 20px;
    background: rgba(230, 0, 126, 0.12);
    border: 1px solid rgba(230, 0, 126, 0.22);
    letter-spacing: 1px;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 0.95rem;
}

.acc_container {
    display: block;
    overflow: hidden;
    clear: both;
    background: #f5f8f9;
    border: 2px solid rgba(0, 0, 50, 0.08);
    border-top: none;
    padding: 20px;
    color: #000032;
    line-height: 1.6;
    margin-bottom: 12px;
}

@media (max-width: 1199px) {
    .brand_module .price-number,
    .option_module .price-number,
    .residence_module .price-number {
        font-size: 2rem;
    }

    .brand_module .availability-text,
    .option_module .availability-text,
    .residence_module .availability-text {
        font-size: 1rem;
    }
}

@media (max-width: 1024px) {
    .brand_module .price-number,
    .option_module .price-number,
    .residence_module .price-number {
        font-size: 1.7rem;
    }

    .brand_module .price-left,
    .option_module .price-left,
    .residence_module .price-left,
    .brand_module .availability-text,
    .option_module .availability-text,
    .residence_module .availability-text {
        font-size: 0.95rem;
    }
}

@media (max-width: 767px) {
    .brand_module,
    .option_module,
    .residence_module {
        border-radius: 12px;
    }

    .brand_module .price-row,
    .option_module .price-row,
    .residence_module .price-row {
        position: relative;
        pointer-events: auto;
    }

    .brand_module .price-left,
    .option_module .price-left,
    .residence_module .price-left,
    .brand_module .availability-text,
    .option_module .availability-text,
    .residence_module .availability-text {
        float: none;
        width: 100%;
        padding: 12px 0;
    }

    .brand_module .availability-text,
    .option_module .availability-text,
    .residence_module .availability-text {
        font-size: 0.9rem;
    }
}

@media (max-width: 600px) {
    .option_menu ul li {
        margin: 0 12px;
    }

    .option_menu ul li a {
        padding: 14px 16px;
        font-size: 0.95rem;
    }

    .acc_gallery img {
        width: calc(50% - 32px);
        margin: 12px;
    }
}

@media (max-width: 480px) {
    .option_menu ul li {
        margin: 0 10px;
    }

    .acc_gallery img {
        width: calc(100% - 32px);
    }
}

/* ==========================================================================
   Accommodation Detail Panels
   ========================================================================== */

.home-stay-title,
.home_title {
    text-align: center;
}

.home-stay-title h1,
.home-stay-detail h1 {
    margin: 0;
}

.home-stay-detail {
    font-size: 1.05rem;
    line-height: 1.74;
    color: rgba(0, 0, 50, 0.8);
    margin-bottom: 28px;
}

.home-stay-detail.adjust {
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0, 0, 50, 0.12);
}

.accommodation_menu {
    margin: 32px 0;
}

.accommodation_menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.accommodation_menu ul li {
    margin: 0;
}

.accommodation_menu ul li a {
    display: block;
    padding: 12px 24px;
    border-radius: 999px;
    background: rgba(0, 0, 50, 0.08);
    color: rgba(0, 0, 50, 0.85);
    font-weight: 600;
    letter-spacing: 0.75px;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.accommodation_menu ul li.current a,
.accommodation_menu ul li a:hover,
.accommodation_menu ul li a:focus {
    background: var(--lse-accent-color);
    color: #ffffff;
    box-shadow: 0 12px 24px -18px rgba(230, 0, 126, 0.55);
}

.tab_content,
.tab-content,
.panes {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 50, 0.08);
    padding: 28px;
    margin-bottom: 24px;
    box-shadow: 0 20px 46px -32px rgba(0, 0, 50, 0.35);
}

.tab-title {
    display: inline-block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.tab-title::after {
    display: block;
    width: min(var(--lse-heading-underline-width), 100%);
    margin-left: auto;
    margin-right: auto;
}

.tab_content h3,
.tab-content h3,
.panes h3 {
    margin-top: 0;
}

.key_info {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 16px;
    border-bottom: 1px solid rgba(0, 0, 50, 0.08);
    padding: 18px 0;
}

.key_info:last-child {
    border-bottom: none;
}

.kye_name {
    flex: 0 0 220px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.75px;
    color: var(--lse-structure-navy);
}

.kye_description,
.room_info {
    flex: 1 1 0;
    font-size: 0.98rem;
    line-height: 1.7;
    color: rgba(0, 0, 50, 0.78);
}

.kye_description ul,
.room_info ul {
    margin: 0;
    padding-left: 18px;
}

.content_holder {
    padding: 15px 22px 0;
}

.text_content {
    width: 100%;
    max-height: 220px;
    overflow-y: auto;
}

.gap {
    margin-bottom: 18px;
}

.rates-section {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    margin: 48px 0 24px;
}

.rates-left-content {
    flex: 1 1 55%;
}

.rates-right-content {
    flex: 1 1 30%;
    background: #f5f8f9;
    border-radius: 16px;
    padding: 24px 24px 18px;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 50, 0.05);
}

.rates-heading h3 {
    margin: 0 0 18px;
    font-size: 1.35rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.catering-section {
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 24px;
}

.availability-section {
    background: rgba(230, 0, 126, 0.08);
    border-radius: 14px;
    padding: 18px 20px;
    margin-bottom: 24px;
}

.availability-info {
    width: 48px;
    height: 4px;
    background: var(--lse-accent-color);
    margin-bottom: 12px;
    border-radius: 999px;
}

.availability_content {
    margin-top: 12px;
}

.rates-right-content ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.rates-right-content ul li {
    font-size: 0.95rem;
    line-height: 1.6;
    padding: 6px 0;
    border-bottom: 1px solid rgba(0, 0, 50, 0.08);
}

.rates-right-content ul li:last-child {
    border-bottom: none;
}

.rates-right-content ul li span {
    display: block;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.75px;
    color: var(--lse-structure-navy);
    margin-bottom: 8px;
}

.apply_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--lse-accent-color), var(--lse-secondary-orange));
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.apply_btn:hover,
.apply_btn:focus {
    transform: translateY(-1px);
    box-shadow: 0 14px 32px -20px rgba(238, 114, 24, 0.45);
}

.map_area,
.panes #map_canvas {
    width: 100%;
    min-height: 320px;
    border-radius: 16px;
    overflow: hidden;
}

@media (max-width: 992px) {
    .kye_name {
        flex: 0 0 180px;
    }

    .rates-section {
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .tab_content,
    .tab-content,
    .panes {
        padding: 22px;
    }

    .key_info {
        flex-direction: column;
    }

    .kye_name {
        flex: 1 1 auto;
    }

    .rates-section {
        flex-direction: column;
    }

    .rates-left-content,
    .rates-right-content {
        flex: 1 1 auto;
    }

    .rates-right-content {
        padding: 20px;
    }
}

@media (max-width: 600px) {
    .accommodation_menu ul {
        gap: 10px;
    }

    .accommodation_menu ul li a {
        padding: 10px 18px;
    }

    .tab_content,
    .tab-content,
    .panes {
        padding: 18px;
    }
}

/* ==========================================================================
   Pagination & Comment Styling
   ========================================================================== */

.page-navigation,
.wp-prev-next {
    margin: 24px 0 40px;
}

.bones_page_navi {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    gap: 10px;
    margin: 0;
    padding: 0;
}

.bones_page_navi li {
    margin: 0;
}

.bones_page_navi li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    padding: 10px 18px;
    border-radius: 999px;
    background: rgba(0, 0, 50, 0.08);
    color: rgba(0, 0, 50, 0.82);
    font-weight: 600;
    letter-spacing: 0.6px;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.bones_page_navi li a:hover,
.bones_page_navi li a:focus {
    background: var(--lse-accent-color);
    color: #ffffff;
    box-shadow: 0 12px 24px -18px rgba(230, 0, 126, 0.5);
}

.bones_page_navi li.bpn-current a,
.bones_page_navi li.bpn-prev-link a,
.bones_page_navi li.bpn-next-link a,
.bones_page_navi li.bpn-first-page-link a,
.bones_page_navi li.bpn-last-page-link a {
    font-weight: 700;
}

.bones_page_navi li.bpn-current a {
    background: var(--lse-accent-color);
    color: #ffffff;
    box-shadow: 0 12px 24px -18px rgba(230, 0, 126, 0.5);
}

.wp-prev-next .prev-link,
.wp-prev-next .next-link {
    display: inline-flex;
    align-items: center;
    font-weight: 600;
    letter-spacing: 0.6px;
}

.wp-prev-next .prev-link {
    margin-right: auto;
}

.wp-prev-next .next-link {
    margin-left: auto;
}

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

.commentlist li {
    position: relative;
    margin-bottom: 32px;
    padding: 24px;
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 18px 36px -30px rgba(0, 0, 50, 0.3);
}

.commentlist li ul.children {
    margin-top: 24px;
    padding-left: 32px;
}

.commentlist .vcard {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
}

.commentlist .vcard img.avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 3px solid rgba(0, 0, 50, 0.08);
    background: #ffffff;
}

.commentlist .vcard cite.fn {
    font-weight: 700;
    font-style: normal;
    color: var(--lse-structure-navy);
}

.commentlist .comment_content {
    margin-left: 0;
    color: rgba(0, 0, 50, 0.82);
    line-height: 1.7;
}

.commentlist .comment_content p {
    margin: 12px 0;
}

.commentlist .comment-reply-link {
    display: inline-flex;
    margin-top: 12px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(0, 0, 50, 0.08);
    color: rgba(0, 0, 50, 0.82);
    text-decoration: none;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.commentlist .comment-reply-link:hover,
.commentlist .comment-reply-link:focus {
    background: var(--lse-accent-color);
    color: #ffffff;
}

.nocomments {
    margin: 24px 0;
    padding: 20px;
    border-radius: 12px;
    background: rgba(0, 0, 50, 0.05);
    color: rgba(0, 0, 50, 0.7);
}

.respond-form {
    margin: 32px 0;
    padding: 28px;
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 50, 0.08);
    background: #ffffff;
    box-shadow: 0 18px 36px -30px rgba(0, 0, 50, 0.3);
}

.respond-form form {
    margin: 0;
}

.respond-form input[type="text"],
.respond-form input[type="email"],
.respond-form input[type="url"],
.respond-form textarea {
    width: 100%;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 50, 0.12);
    background: rgba(0, 0, 50, 0.02);
    margin-bottom: 16px;
    transition: border-color 0.2s ease;
}

.respond-form input[type="text"]:focus,
.respond-form input[type="email"]:focus,
.respond-form input[type="url"]:focus,
.respond-form textarea:focus {
    border-color: var(--lse-accent-color);
    outline: none;
}

/* ==========================================================================
   Contact & Utility Blocks
   ========================================================================== */

.section_contact {
    background: #f5f8f9;
    border-radius: 18px;
    padding: 32px;
    margin: 40px 0;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 50, 0.05);
}

.contact_wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
}

.contact_form,
.custom_form {
    flex: 2 1 500px;
    background: #ffffff;
    border-radius: 28px;
    padding: 32px 36px;
    box-shadow: 0 32px 80px rgba(0, 0, 50, 0.12);
    border: 1px solid rgba(0, 0, 50, 0.04);
}

.contact_location {
    flex: 1 1 320px;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.contact_info-card {
    background: #ffffff;
    border-radius: 26px;
    padding: 28px 30px;
    box-shadow: 0 28px 70px rgba(0, 0, 50, 0.12);
    border: 1px solid rgba(0, 0, 50, 0.05);
}

.contact_info-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.article-header__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.article-header__top .home-button {
    margin-left: auto;
}

.article-header .page-title {
    position: relative !important;
    display: inline-block !important;
    font-size: 2.5rem !important;
    color: var(--lse-dark-blue, #000032) !important;
    margin: 0 0 1.5rem !important;
    padding: 0 0 0.75rem !important;
    text-align: left !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}

.article-header .page-title::after {
    content: '' !important;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 140px !important;
    height: 5px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, var(--lse-primary-magenta, #E6007E), var(--lse-secondary-orange, #EE7218)) !important;
    margin: 0 !important;
    display: block !important;
}

.contact_info-item {
    display: flex;
    align-items: center;
    gap: 18px;
}

.contact_info-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    background: linear-gradient(160deg, rgba(230, 0, 126, 0.18), rgba(106, 202, 243, 0.16));
    color: var(--lse-primary-magenta);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    box-shadow: inset 0 0 0 1px rgba(230, 0, 126, 0.18);
}

.contact_info-text {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: rgba(0, 0, 50, 0.82);
    font-weight: 600;
}

.contact_info-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(0, 0, 50, 0.55);
}

.contact_info-text a {
    color: var(--lse-primary-magenta);
    text-decoration: none;
    font-weight: 700;
}

.contact_info-text a:hover,
.contact_info-text a:focus {
    color: var(--lse-secondary-orange);
}

.contact-map {
    min-height: 0;
    padding: 8px;
    border-radius: 32px;
    background: linear-gradient(150deg, rgba(106, 202, 243, 0.16), rgba(230, 0, 126, 0.12));
}

.contact-map__canvas {
    min-height: 440px;
    border-radius: 26px;
    box-shadow: 0 38px 90px rgba(0, 0, 50, 0.18);
}

@media (max-width: 1024px) {
    .contact_wrap {
        flex-direction: column;
    }

    .contact_form,
    .custom_form {
        order: 2;
        padding: 28px;
    }
}

@media (max-width: 768px) {
    .contact_form,
    .custom_form {
        padding: 24px;
    }

    .contact_location {
        gap: 24px;
    }

    .contact_info-card {
        padding: 22px;
    }

    .contact-map__canvas {
        min-height: 320px;
        border-radius: 22px;
    }
}

.contact_form label,
.custom_form label {
    display: block;
    font-weight: 600;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}

.contact_form label span,
.custom_form label span {
    color: #e54b4b;
}

.contact_form input[type="text"],
.contact_form input[type="email"],
.contact_form input[type="tel"],
.contact_form textarea,
.custom_form input[type="text"],
.custom_form input[type="email"],
.custom_form input[type="tel"],
.custom_form textarea {
    width: 100%;
    padding: 14px 18px;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 50, 0.12);
    background: rgba(0, 0, 50, 0.02);
    margin-bottom: 16px;
    font-size: 1rem;
}

.contact_form textarea,
.custom_form textarea {
    min-height: 160px;
    resize: vertical;
}

.contact_form input[type="submit"],
.custom_form input[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    border-radius: 999px;
    border: none;
    background: linear-gradient(135deg, #EE7218 0%, #E6007E 100%);
    color: #ffffff;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 10px 24px rgba(238, 114, 24, 0.25);
}

.contact_form input[type="submit"]:hover,
.custom_form input[type="submit"]:hover,
.contact_form input[type="submit"]:focus,
.custom_form input[type="submit"]:focus {
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(230, 0, 126, 0.25);
}

.info_text,
.faq_content,
.base_content,
.archive_content,
.default {
    font-size: 1rem;
    line-height: 1.8;
    color: rgba(0, 0, 50, 0.78);
    margin-bottom: 24px;
}

.section_contact .info_text a,
.section_contact .faq_content a,
.info_text a,
.faq_content a,
.base_content a,
.archive_content a {
    color: var(--lse-accent-color);
    text-decoration: underline;
}

.brand_feature,
.cat_icon {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-weight: 600;
}

.twitter-widget {
    background: #ffffff;
    padding: 20px;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 50, 0.08);
}

.videoWrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: 16px;
}

.videoWrapper iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.sidebar {
    background: #ffffff;
    border-radius: 16px;
    padding: 28px;
    box-shadow: 0 20px 46px -32px rgba(0, 0, 50, 0.3);
}

.widgettitle,
.sidebar h4 {
    margin-top: 0;
    margin-bottom: 18px;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.75px;
    color: var(--lse-structure-navy);
}

.post-meta {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    color: rgba(0, 0, 50, 0.6);
    font-size: 0.95rem;
}

.post-meta li {
    position: relative;
    padding-left: 18px;
}

.post-meta li:before {
    content: '‚2';
    position: absolute;
    left: 6px;
    color: var(--lse-accent-color);
}

.byline,
.fn {
    font-style: normal;
    font-weight: 600;
}

.read-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 999px;
    background: rgba(0, 0, 50, 0.08);
    color: rgba(0, 0, 50, 0.82);
    text-decoration: none;
    font-weight: 600;
}

.read-more:hover,
.read-more:focus {
    background: var(--lse-accent-color);
    color: #ffffff;
}

/* ==========================================================================
   Legacy Blog Layout & Content Wrappers
   ========================================================================== */

#container {
    width: 100%;
    background: #ffffff;
}

.full--width {
    width: 100%;
    display: block;
}

.inner-content {
    width: 100%;
}

.inner-content.wrap {
    max-width: var(--lse-grid-max-width, 1200px);
}

.option-section {
    margin: 1.5rem 0;
}

.option-section .option_menu {
    margin-bottom: 0;
}

.player1 {
    position: relative;
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
    aspect-ratio: 16 / 9;
    border-radius: 16px;
    overflow: hidden;
    background: #000000;
    box-shadow: 0 16px 34px -24px rgba(0, 0, 50, 0.4);
}

.player1 iframe,
.player1 video,
.player1 embed {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.player1 .me-plugin,
.player1 .mejs-overlay {
    width: 100% !important;
    height: 100% !important;
}

#blog-content {
    display: grid;
    gap: 32px;
    margin: 0;
    padding: 0;
}

#blog-content article {
    background: #ffffff;
    border-radius: 20px;
    padding: 32px;
    border: 1px solid rgba(0, 0, 50, 0.08);
    box-shadow: 0 20px 48px -32px rgba(0, 0, 50, 0.28);
}

#blog-content article:last-child {
    margin-bottom: 0;
}

#blog-content article .article-header ul {
    list-style: none;
    padding: 0;
    margin: 0 0 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    color: rgba(0, 0, 50, 0.6);
}

#blog-content article .article-header ul li {
    display: inline-flex;
    gap: 8px;
    font-size: 0.95rem;
}

#blog-content article.post:after {
    content: '';
    display: block;
    clear: both;
}

#blog-content article .read-more {
    margin-top: 18px;
}

#post-not-found {
    text-align: center;
    font-size: 1.6rem;
    padding: 80px 0;
    color: rgba(0, 0, 50, 0.75);
}

#post-not-found h1 {
    font-size: 3rem;
    margin-bottom: 12px;
}

#comments {
    margin-top: 48px;
}

#comment-form-title {
    font-size: 1.85rem;
    margin: 0 0 24px;
    font-weight: 700;
    color: var(--lse-structure-navy);
}

#submit {
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

/* ==========================================================================
   Accommodation Gallery (Splide)
   ========================================================================== */

#carousel-wrapper {
    position: relative;
}

#carousel {
    position: relative;
}

.accommodation-gallery__main .splide__track {
    border-radius: 16px;
    overflow: hidden;
}

.accommodation-gallery__slide {
    position: relative;
}

.accommodation-gallery__media {
    display: block;
}

.accommodation-gallery__media img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.accommodation-gallery__arrows {
    pointer-events: none;
}

.accommodation-gallery__arrow {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 50, 0.45);
    color: #ffffff;
    border: none;
    cursor: pointer;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1;
    transition: background 0.3s ease;
    pointer-events: auto;
}

.accommodation-gallery__arrow::after {
    content: '\2039';
}

.accommodation-gallery__arrow--next::after {
    content: '\203A';
}

.accommodation-gallery__arrow--prev {
    left: 0;
}

.accommodation-gallery__arrow--next {
    right: 0;
}

.accommodation-gallery__arrow:hover,
.accommodation-gallery__arrow:focus {
    background: rgba(0, 0, 50, 0.65);
}

.accommodation-gallery__arrow svg {
    display: none;
}

.accommodation_gallery--no-splide [data-accommodation-splide="thumbs"] {
    display: none;
}

.accommodation_gallery--no-splide .splide__track {
    overflow: visible;
}

.accommodation_gallery--no-splide .splide__list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    transform: none !important;
}

#thumbs-wrapper {
    padding: 24px 58px;
    background: #e6eaee;
    position: relative;
}

.accommodation-gallery__thumbs .splide__track {
    overflow: visible;
}

.accommodation-gallery__thumbs .splide__list {
    gap: 16px;
}

.accommodation-gallery__thumb-button {
    display: block;
    width: 120px;
    height: 84px;
    border-radius: 12px;
    overflow: hidden;
    border: 4px solid #ffffff;
    box-shadow: 0 12px 28px -20px rgba(0, 0, 50, 0.35);
    transition: border-color 0.25s ease, transform 0.25s ease;
    background: transparent;
    padding: 0;
    cursor: pointer;
}

.accommodation-gallery__thumb-button img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.accommodation-gallery__thumb.is-active .accommodation-gallery__thumb-button,
.accommodation-gallery__thumb-button:hover,
.accommodation-gallery__thumb-button:focus {
    border-color: rgba(0, 0, 50, 0.35);
    transform: translateY(-4px);
}

@media (max-width: 768px) {
    #thumbs-wrapper {
        padding: 16px 46px;
    }

    .accommodation-gallery__thumbs .splide__list {
        gap: 12px;
    }

    .accommodation-gallery__thumb-button {
        width: 92px;
        height: 64px;
    }

    .accommodation-gallery__arrow {
        width: 46px;
    }
}

/* ==========================================================================
   Legacy Utility Helpers
   ========================================================================== */

/* ==========================================================================
   Lightbox Overlay
   ========================================================================== */

body.lse-lightbox-open {
    overflow: hidden;
}

.lse-lightbox {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}

.lse-lightbox.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.lse-lightbox__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(6, 24, 44, 0.78);
    backdrop-filter: blur(4px);
}

.lse-lightbox__body {
    position: relative;
    max-width: min(90vw, 1100px);
    max-height: 90vh;
    width: 100%;
    margin: 0 24px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--lse-white);
}

.lse-lightbox__figure {
    margin: 0;
    flex: 1 1 auto;
    text-align: center;
    /* Smooth transition for navigation */
    transition: opacity 0.18s ease-out, transform 0.18s ease-out;
}

/* Navigation transition states */
.lse-lightbox__figure.is-transitioning {
    opacity: 0.7;
}
.lse-lightbox__figure.is-transitioning.is-nav-next {
    transform: translateX(-16px);
}
.lse-lightbox__figure.is-transitioning.is-nav-prev {
    transform: translateX(16px);
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .lse-lightbox__figure {
        transition: none;
    }
    .lse-lightbox__figure.is-transitioning,
    .lse-lightbox__figure.is-transitioning.is-nav-next,
    .lse-lightbox__figure.is-transitioning.is-nav-prev {
        opacity: 1;
        transform: none;
    }
}

.lse-lightbox__image {
    max-width: 100%;
    max-height: 70vh;
    border-radius: 12px;
    box-shadow: 0 24px 64px -28px rgba(0, 0, 0, 0.6);
}

.lse-lightbox__caption {
    margin-top: 12px;
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.88);
}

.lse-lightbox__close {
    position: absolute;
    top: -12px;
    right: -12px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    background: rgba(0, 0, 0, 0.75);
    color: var(--lse-white);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    transition: background 0.25s ease, box-shadow 0.25s ease;
    outline: none;
    z-index: 2;
}

.lse-lightbox__close::before {
    content: '\2715';
    line-height: 1;
    font-size: 1.1em;
    position: relative;
    z-index: 3;
}

button.lse-lightbox__close:hover,
button.lse-lightbox__close:focus,
button.lse-lightbox__close:focus-visible {
    background: rgba(16, 16, 20, 0.92);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.45);
    outline: none;
}

.lse-lightbox__nav {
    border: none;
    background: rgba(0, 0, 0, 0.6);
    color: var(--lse-white);
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
    outline: none;
    position: relative;
    z-index: 2;
}

.lse-lightbox__nav::before {
    font-weight: 600;
    line-height: 1;
    font-size: 1.2rem;
    font-family: inherit;
    position: relative;
    z-index: 3;
}

.lse-lightbox__nav--prev::before {
    content: '\2039';
}

.lse-lightbox__nav--next::before {
    content: '\203A';
}

button.lse-lightbox__nav:hover,
button.lse-lightbox__nav:focus,
button.lse-lightbox__nav:focus-visible {
    background: rgba(16, 16, 20, 0.82);
    transform: translateY(-2px);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.45);
    outline: none;
}

@media (max-width: 768px) {
    .lse-lightbox__body {
        flex-direction: column;
        max-height: 88vh;
    }

    .lse-lightbox__nav {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }

    .lse-lightbox__nav--prev {
        left: -16px;
    }

    .lse-lightbox__nav--next {
        right: -16px;
    }
}

.alignleft {
    float: left;
    margin: 0 24px 12px 0;
}

.small {
    font-size: 0.85rem;
}

.amp {
    font-family: 'Baskerville', 'Goudy Old Style', 'Palatino', 'Book Antiqua', serif;
    font-style: italic;
}

/*
 * Legacy .scroll-pane containers previously relied on jScrollPane.
 * With the vendor script removed we allow native scrolling.
 */
.scroll-pane {
    overflow: auto;
    scrollbar-gutter: stable both-edges;
}

.article-header {
    margin-bottom: 24px;
    border-bottom: 1px solid rgba(0, 0, 50, 0.08);
    padding-bottom: 16px;
}

.h2 {
    font-size: var(--lse-heading-h2-size);
    font-weight: var(--lse-heading-font-weight);
    line-height: var(--lse-heading-line-height);
    text-align: center;
    margin: var(--lse-heading-h2-margin);
    position: relative;
}

.h2::after {
    content: '';
    display: block;
    width: var(--lse-heading-underline-width);
    height: var(--lse-heading-underline-height);
    background: var(--lse-primary-magenta);
    margin: var(--lse-heading-underline-margin-top) auto 0;
    border-radius: 2px;
}

.alert-help,
.alert-info,
.error {
    border-left: 4px solid var(--lse-accent-color);
    background: rgba(0, 0, 50, 0.04);
    padding: 16px 20px;
    border-radius: 12px;
    margin: 16px 0;
}

.alert-info {
    border-color: var(--lse-tertiary-blue);
}

.error {
    border-color: #e54b4b;
    background: rgba(229, 75, 75, 0.1);
}

.item {
    position: relative;
}

.footer-caption {
    font-size: 0.9rem;
    color: rgba(0, 0, 50, 0.65);
    margin-top: 12px;
}

.vcard time,
.vcard span {
    color: rgba(0, 0, 50, 0.6);
    font-size: 0.9rem;
}

.lhs2 {
    --lse-accent-color: #424564;
}

.lsr2 {
    --lse-accent-color: #684f6d;
}

.sel2 {
    --lse-accent-color: #356045;
}

.gs2 {
    --lse-accent-color: #9c1428;
}

.lhs2,
.lsr2,
.sel2,
.gs2 {
    background: #ffffff;
}

.hshares,
.hshares2 {
    --lse-accent-color: #CC3366;
}

.next-link a,
.prev-link a,
.page-navigation a {
    color: var(--lse-accent-color);
    text-decoration: none;
}

.next-link a:hover,
.prev-link a:hover,
.page-navigation a:hover {
    text-decoration: underline;
}

.hshares .accommodation_menu ul li a,
.hshares2 .accommodation_menu ul li a {
    background: var(--lse-accent-color);
}

.hshares .accommodation_menu ul li a:hover,
.hshares .accommodation_menu ul li.current a,
.hshares2 .accommodation_menu ul li a:hover,
.hshares2 .accommodation_menu ul li.current a {
    background: var(--lse-structure-navy);
}

.hshares .option_menu ul li a,
.hshares2 .option_menu ul li a {
    background: var(--lse-accent-color);
}

.hshares .option_menu ul li a:hover,
.hshares2 .option_menu ul li a:hover {
    background: var(--lse-structure-navy);
}

.date_icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
}

.twitter-widget a {
    color: var(--lse-accent-color);
}

.videoWrapper .wp-video-shortcode {
    width: 100% !important;
    height: 100% !important;
}

.nogap {
    margin-bottom: 0 !important;
}

.alt {
    color: rgba(0, 0, 50, 0.6);
}

.brand_feature a,
.info_text a,
.faq_content a,
.base_content a,
.archive_content a,
.custom_form a,
.contact_form a {
    color: var(--lse-accent-color);
}

.brand_feature a:hover,
.info_text a:hover,
.faq_content a:hover,
.base_content a:hover,
.archive_content a:hover,
.custom_form a:hover,
.contact_form a:hover {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .commentlist li ul.children {
        padding-left: 18px;
    }

    .contact_wrap {
        flex-direction: column;
    }

    .contact_location {
        order: -1;
        gap: 20px;
    }

    .contact_info-card {
        padding: 22px;
    }

    .contact-map__canvas {
        min-height: 320px;
    }

    .sidebar {
        padding: 24px;
    }
}

/* ==========================================================================
   Primary CTA Buttons
   ========================================================================== */

.btn-primary,
.button-primary,
.wpcf7-submit,
.apply-btn,
.search-btn,
.course-finder .btn,
.pricing-btn,
.cta-button,
input[type="submit"],
button[type="submit"] {
    background-color: var(--lse-primary-magenta) !important;
    border-color: var(--lse-primary-magenta) !important;
    color: var(--lse-white) !important;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: 6px;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 6px rgba(230, 0, 126, 0.25);
}

.btn-primary:hover,
.button-primary:hover,
.wpcf7-submit:hover,
.apply-btn:hover,
.search-btn:hover,
.course-finder .btn:hover,
.pricing-btn:hover,
.cta-button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
    background-color: var(--lse-secondary-orange) !important;
    border-color: var(--lse-secondary-orange) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(238, 114, 24, 0.3);
}

/* ==========================================================================
   Neutral Button Baseline
   ========================================================================== */

button,
input[type="button"],
input[type="submit"],
.btn {
    background: #ffffff;
    border: 1px solid rgba(9, 55, 79, 0.18);
    color: #09374f;
    font-weight: 600;
    padding: 10px 18px;
    border-radius: 10px;
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
    box-shadow: none;
}

button:hover,
button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
.btn:hover,
.btn:focus {
    background: rgba(9, 55, 79, 0.08);
    border-color: rgba(9, 55, 79, 0.28);
    color: #09374f;
    transform: translateY(-1px);
}

.lse-button--primary {
    background: linear-gradient(135deg, #EE7218, #E6007E);
    border: none;
    color: #ffffff;
    box-shadow: 0 18px 32px -20px rgba(238, 114, 24, 0.45);
}

.lse-button--primary:hover,
.lse-button--primary:focus {
    transform: translateY(-1px);
    box-shadow: 0 24px 38px -20px rgba(238, 114, 24, 0.55);
}

.lse-button--ghost {
    background: rgba(9, 55, 79, 0.08);
    border: none;
    color: #09374f;
}

.lse-button--ghost:hover,
.lse-button--ghost:focus {
    background: rgba(9, 55, 79, 0.16);
}

.lse-lightbox button.lse-lightbox__nav,
.lse-lightbox button.lse-lightbox__close {
    background: rgba(0, 0, 0, 0.6);
    color: var(--lse-white);
    border: none;
    box-shadow: none;
    transform: none;
}

.lse-lightbox button.lse-lightbox__close:hover,
.lse-lightbox button.lse-lightbox__close:focus,
.lse-lightbox button.lse-lightbox__close:focus-visible {
    background: rgba(16, 16, 20, 0.92) !important;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.45) !important;
    color: var(--lse-white) !important;
    transform: none !important;
}

.lse-lightbox button.lse-lightbox__nav:hover,
.lse-lightbox button.lse-lightbox__nav:focus,
.lse-lightbox button.lse-lightbox__nav:focus-visible {
    background: rgba(16, 16, 20, 0.82) !important;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.45) !important;
    color: var(--lse-white) !important;
    transform: translateY(-2px) !important;
}

/* ==========================================================================
   Header Redesign 2025
   ========================================================================== */

.top-bar {
    background: #000032;
    color: #ffffff;
    font-size: 0.9rem;
    padding: 0.35rem 0;
    position: relative;
    z-index: 1000;
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.top-bar__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
    padding: 0 1.5rem;
    width: 100%;
    box-sizing: border-box;
}

.top-bar__left,
.top-bar__right {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.top-bar__contact 
{
}
.top-bar__contacts {
    display: flex;
    align-items: center;
    gap: 1rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.partner-icons {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.top-bar__brand-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.top-bar a,
.top-bar span,
.top-bar i {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.top-bar__lang .header-language-toggle .header-language-icon {
    color: currentColor !important;
    opacity: 1 !important;
    transition: color 0.2s ease, opacity 0.2s ease;
}

/* === PARTNER BAR LAYOUT === */
.partner-bar {
    position: relative;
    background: #f5f5f7;
    border-bottom: 1px solid #e2e3ea;
}

.partner-bar__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0.4rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.25rem;
}

.partner-bar__label {
    order: 1;
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #5b5e6f;
    margin-right: 0.5rem;
}

.partner-bar__logos {
    order: 2;
    display: flex;
    gap: 0.75rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.partner-bar__link img {
    height: 30px;
    width: auto;
    object-fit: contain;
    filter: none;
    transition: transform 0.2s ease;
}

.partner-bar__link:hover img {
    transform: translateY(-2px);
}

body.header-sticky .partner-bar {
    display: none !important;
}

body.header-sticky .header {
    margin-top: 0 !important;
}

@media (max-width: 767px) {
    .partner-bar__inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .partner-bar__label {
        margin-right: 0;
    }

    .partner-bar__logos {
        flex-wrap: wrap;
        gap: 0.5rem 1rem;
    }
}

.top-bar a:hover,
.top-bar a:focus,
.top-bar a:focus-visible {
    color: #FF4FB2 !important;
    text-decoration: none;
}


.top-bar__contact a,
.top-bar__contact span,
.top-bar__contact i {
    font-weight: 500;
    transition: color 0.2s ease-in-out;
}

.top-bar__contact span,
.top-bar__contact i {
    color: #fff !important;
    fill: #fff !important;
}

/* === UNIFIED TOP-BAR LINK STYLING (CONTACT + PORTAL) === */
.top-bar__contact a,
.top-bar .partner-portal a {
    color: #ffffff;
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}
.top-bar__contact a:hover,
.top-bar .partner-portal a:hover {
    color: #FF4FB2;
    text-decoration: none;
}
.top-bar__contact-link {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

.top-bar__contact-link:hover,
.top-bar__contact-link:focus,
.top-bar__contact-link:focus-visible {
    color: #ff4fb2;
    text-decoration: underline;
}

.top-bar__contact {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
}

.top-bar__contact i {
    color: #fff;
    margin-right: 6px;
    font-size: 0.9rem;
    vertical-align: middle;
    transition: color 0.2s ease-in-out;
}

.top-bar__contact a:hover i,
.top-bar__contact a:focus i,
.top-bar__contact a:focus-visible i {
    color: #FF4FB2;
}

.top-bar .partner-icons img {
    height: 24px;
    width: auto;
    max-width: 48px;
    object-fit: contain;
    margin-left: 1.25rem;
    padding: 3px 6px;
    background: #F2F2F2;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    opacity: 0.95;
    transition: opacity 0.2s ease, transform 0.2s ease;
    vertical-align: middle;
}

.top-bar .partner-icons img:hover {
    opacity: 1;
    transform: translateY(-1px);
}

.top-bar a,
.top-bar span,
.top-bar i {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.top-bar a:hover,
.top-bar a:focus,
.top-bar a:focus-visible {
    color: #FF4FB2 !important;
    text-decoration: none;
}

/* === FINAL UNDERLINE SUPPRESSION FOR PARTNER PORTAL === */
.top-bar .partner-portal a:hover {
    text-decoration: none !important;
    border-bottom: none !important;
}

.top-bar__link {
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s ease;
}

.top-bar__link:hover,
.top-bar__link:focus,
.top-bar__link:focus-visible {
    border-bottom-color: #FF4FB2;
}

.top-bar__link--portal:hover,
.top-bar__link--portal:focus,
.top-bar__link--portal:focus-visible {
    border-bottom-color: transparent;
}

.top-bar .header-language-toggle {
    border: none;
    background: transparent;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    color: inherit;
}

.top-bar .header-language-flag {
    width: 18px;
    height: 12px;
    border-radius: 2px;
    object-fit: cover;
}

.top-bar .header-language-label,
.top-bar .header-language-name {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.top-bar-language-menu {
    background: #ffffff;
    border-radius: 4px;
    padding: 0.5rem 0;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
    min-width: 120px;
}

.top-bar-language-menu .header-language-link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* === HEADER LANGUAGE SWITCHER (CUSTOM STRUCTURE) === */
.top-bar__lang {
    position: relative;
}

/* Toggle button */
.top-bar__lang .header-language-toggle {
    display: inline-flex;
    align-items: center;
    background: #000032 !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    color: #FF9F40 !important;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9rem;
    padding: 4px 5px;
    transition: color 0.2s ease-in-out, background 0.2s ease-in-out, border-color 0.2s ease-in-out;
    z-index: 1000;
    max-width: 65px;
    overflow: hidden;
    gap: 4px;
}
.top-bar__lang .header-language-toggle:hover {
    color: #FF4FB2 !important;
    border-color: rgba(255, 79, 178, 0.4);
}

.top-bar__lang .header-language-flag {
    width: 20px;
    height: auto;
    margin-right: 6px;
    border-radius: 2px;
}
.top-bar__lang .header-language-icon {
    margin-left: -1px;
    font-size: 0.7rem;
}

/* Dropdown menu */
.top-bar__lang .top-bar-language-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: #000032 !important;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    padding: 4px 0;
    margin-top: -1px;
    list-style: none;
    min-width: 160px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
    display: none;
    z-index: 9999;
    color: #FF9F40 !important;
}

.top-bar__lang:hover .top-bar-language-menu,
.top-bar__lang:focus-within .top-bar-language-menu {
    display: block;
}

.top-bar__lang .header-language-option {
    display: block;
}

.top-bar__lang .header-language-link {
    display: block;
    padding: 6px 12px;
    color: #FF9F40 !important;
    background: #000032;
    text-decoration: none;
    transition: color 0.2s ease, background 0.2s ease;
}
.top-bar__lang .header-language-link:hover,
.top-bar__lang .header-language-link:focus,
.top-bar__lang .header-language-link:focus-visible {
    background: #FF4FB2 !important;
    color: #ffffff !important;
}

/* === MAKE LANGUAGE NAMES VISIBLE INSIDE SWITCHER === */
.top-bar__lang .screen-reader-text {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding-left: 6px;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    color: #FF9F40 !important;
    font-weight: 600;
    display: inline !important;
}

.top-bar__lang .header-language-toggle .screen-reader-text {
    white-space: nowrap !important;
}

.top-bar__lang .header-language-link:hover .screen-reader-text {
    color: #FF4FB2 !important;
}


/* FORCE WPML HEADER STYLE ONLY */
.top-bar__lang .wpml-ls-legacy-dropdown,
.top-bar__lang .wpml-ls {
    background: transparent !important;
}

.top-bar__lang .wpml-ls-item,
.top-bar__lang .wpml-ls-current-language {
    background: none !important;
    border: none !important;
}

.top-bar__lang .wpml-ls-item a,
.top-bar__lang .wpml-ls-current-language a {
    color: #ffffff !important;
    background: none !important;
    border: none !important;
    padding: 2px 6px !important;
    display: inline-flex;
    align-items: center;
    font-weight: 500;
}

.top-bar__lang .wpml-ls-item a:after,
.top-bar__lang .wpml-ls-current-language a:after {
    content: '▾';
    margin-left: 4px;
    font-size: 0.7rem;
    color: #ffffff;
    opacity: 0.85;
}

.top-bar__lang .wpml-ls ul {
    background: #000032 !important;
    border: 1px solid rgba(255,255,255,0.25);
    padding: 4px 0;
    z-index: 9999;
}

.top-bar__lang .wpml-ls ul li a {
    color: #ffffff !important;
    padding: 6px 12px;
    display: block;
}

.top-bar__lang .wpml-ls ul li a:hover {
    background: #FF4FB2 !important;
    color: #ffffff !important;
}

.top-bar {
    transition: opacity 0.2s ease, height 0.2s ease;
}

.top-bar.is-hidden {
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
}

.top-bar.is-hidden,
body.header-sticky .top-bar {
    transform: translateY(-100%);
}

@media (max-width: 768px) {
    .top-bar__inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .top-bar__left,
    .top-bar__right {
        width: 100%;
        flex-wrap: wrap;
        gap: 0.75rem;
    }
}

.top-nav li.menu-item-has-children {
    position: relative;
}

.top-nav li.menu-item-has-children > ul.sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    padding: 12px 0;
    margin: 0;
    list-style: none;
    display: none;
    z-index: 9999;
    border: none;
}

.top-nav li.menu-item-has-children > ul.sub-menu > li {
    width: 100%;
}

.top-nav li.menu-item-has-children > ul.sub-menu > li > a {
    display: block;
    padding: 8px 18px;
    color: var(--lse-structure-navy);
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}

.top-nav li.menu-item-has-children > ul.sub-menu > li > a:hover,
.top-nav li.menu-item-has-children > ul.sub-menu > li > a:focus,
.top-nav li.menu-item-has-children > ul.sub-menu > li > a:focus-visible {
    background: rgba(0, 0, 50, 0.08);
    color: var(--lse-secondary-orange);
}

.top-nav li.menu-item-has-children:hover > ul.sub-menu,
.top-nav li.menu-item-has-children:focus-within > ul.sub-menu,
.top-nav li.menu-item-has-children.is-open > ul.sub-menu {
    display: block;
}

.top-nav .menu-item-apply-for-english-course a {
    background: linear-gradient(90deg, #FF4FB2 0%, #E6007E 100%);
    color: #ffffff !important;
    font-weight: 700;
    padding: 0.65rem 1.4rem;
    border-radius: 9999px;
    box-shadow: 0 0 12px rgba(230, 0, 126, 0.45);
    text-transform: none;
    transition: all 0.25s ease-in-out;
}

.top-nav .menu-item-apply-for-english-course a:hover,
.top-nav .menu-item-apply-for-english-course a:focus,
.top-nav .menu-item-apply-for-english-course a:focus-visible {
    opacity: 0.9;
    box-shadow: 0 0 18px rgba(230, 0, 126, 0.6);
}

/* === LANGUAGE SWITCHER — ORANGE TEXT + MAGENTA HOVER === */
.top-bar__lang .header-language-toggle,
.top-bar__lang .header-language-link {
    color: #FF9F40 !important;
    font-weight: 600;
    transition: color 0.2s ease-in-out;
}
.top-bar__lang .header-language-toggle:hover {
    color: #FF4FB2 !important;
}
.top-bar__lang .top-bar-language-menu {
    background: #000032;
}

/* === EVEN HORIZONTAL SPACING & ALIGNMENT === */
.top-bar__lang,
.top-bar .partner-icons,
.top-bar .partner-portal {
    display: inline-flex;
    align-items: center;
    margin-left: 1.25rem;
}

/* ==========================================================================
   Header Palette Overrides
   ========================================================================== */

.header_top {
    background: #fff8f2 !important;
    color: var(--lse-structure-navy) !important;
}

.header_top * {
    color: var(--lse-structure-navy) !important;
}

.header_top a {
    color: var(--lse-structure-navy) !important;
    text-decoration: none !important;
}

.header_top a:hover {
    color: var(--lse-secondary-orange) !important;
}

#menu-item-6242,
#menu-item-6242 a,
#menu-item-6242 a *,
#menu-item-6242 svg,
#menu-item-6242 svg * {
    color: #ffffff !important;
    fill: #ffffff !important;
}

#menu-item-6242 > a,
#menu-item-6242 > a:link,
#menu-item-6242 > a:visited {
    background: linear-gradient(135deg, var(--lse-primary-magenta) 0%, #ff1a94 100%) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    border-radius: 25px !important;
    padding: 10px 20px !important;
    margin: 2px 8px !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 3px 12px rgba(230, 0, 126, 0.3) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    border: none !important;
    display: inline-block !important;
    text-align: center !important;
}

#menu-item-6242 > a * {
    color: #ffffff !important;
}

#menu-item-6242 > a:hover,
#menu-item-6242 > a:focus,
#menu-item-6242 > a:focus-visible,
#menu-item-6242 > a:hover:visited,
#menu-item-6242 > a:focus:visited,
#menu-item-6242 > a:focus-visible:visited {
    background: linear-gradient(135deg, var(--lse-secondary-orange) 0%, #ff8534 100%) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(238, 114, 24, 0.4) !important;
}

body .header.sticky #menu-item-6242 > a {
    padding: 8px 16px !important;
    font-size: 12px !important;
    border-radius: 20px !important;
}

.site-header,
.main-navigation,
.navbar,
header,
.header_colored_bg,
.main_header,
.header_bottom {
    background-color: #ffffff !important;
    color: var(--lse-structure-navy) !important;
}

.header_bottom .grid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}

.header_bottom .grid__item {
    float: none;
    width: auto;
    min-width: 0;
}

.header_bottom .grid__item:first-child {
    flex: 0 0 auto;
}

.header_bottom .grid__item:last-child {
    flex: 1 1 auto;
}

.header_controls {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-bottom: 0;
    flex: 0 1 auto;
    max-width: 100%;
    flex-wrap: nowrap;
}

.header-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 999px;
    background: #fff;
    color: var(--lse-primary-magenta) !important;
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border: 1px solid rgba(230, 0, 126, 0.3);
    box-shadow: 0 0 16px rgba(230, 0, 126, 0.35);
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, color 0.25s ease;
    max-width: 200px;
    text-align: center;
    white-space: nowrap;
}

.header-cta span {
    color: inherit !important;
}

.header_bottom .header_controls .header-cta,
.header_bottom .header_controls .header-cta:link,
.header_bottom .header_controls .header-cta:visited,
.header_bottom .header_controls .header-cta:active {
    color: var(--lse-primary-magenta) !important;
    -webkit-text-fill-color: var(--lse-primary-magenta);
}

.header_bottom .header_controls .header-cta span {
    color: inherit !important;
}

.header-cta:hover,
.header-cta:focus,
.header-cta:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 0 20px rgba(230, 0, 126, 0.45);
    background: var(--lse-primary-magenta);
    color: #fff !important;
    -webkit-text-fill-color: #fff;
    border-color: var(--lse-primary-magenta);
    outline: none;
}

.header-cta:active {
    transform: translateY(0);
    box-shadow: 0 4px 12px rgba(230, 0, 126, 0.2);
}

body .header.sticky .header_controls {
    margin-bottom: 0;
}

body .header.sticky .header-cta {
    display: none;
}

.main-navigation a,
.navbar-nav .nav-link,
.site-header a {
    color: var(--lse-structure-navy) !important;
    transition: color 0.3s ease;
}

.main-navigation a:hover,
.navbar-nav .nav-link:hover,
.site-header a:hover {
    color: var(--lse-secondary-orange) !important;
}

.nav-item.london-homestays > a,
.menu-item.london-homestays > a {
    background: linear-gradient(135deg, var(--partner-london-homestays), #ba2f36) !important;
    color: var(--lse-white) !important;
    padding: 8px 16px;
    border-radius: 4px;
}

.nav-item.uk-residences > a,
.menu-item.uk-residences > a {
    background: linear-gradient(135deg, var(--partner-uk-residences), #08913f) !important;
    color: var(--lse-white) !important;
    padding: 8px 16px;
    border-radius: 4px;
}

.logo img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-height: 77px !important;
    width: auto !important;
    height: auto !important;
}

/* ==========================================================================
   Header Layout (migrated from parent style.css @1041+)
   ========================================================================== */

.header_top {
    padding: 12px 0;
}

.top_menu {
    overflow: visible;
}

.top_menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.top_menu ul li {
    float: none;
    display: flex;
    align-items: center;
    padding: 0 16px 0 0;
    line-height: 32px;
    font-size: 15px;
    text-transform: none;
    color: var(--lse-neutral-gray) !important;
    border-left: 0;
}

.top_menu ul li:first-child {
    padding-left: 0;
}

.top_menu ul li a {
    display: block;
    padding-left: 24px;
    text-decoration: none;
    position: relative;
    color: var(--lse-neutral-gray) !important;
}

.top_menu ul li a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    font-family: 'FontAwesome';
    font-size: 16px;
    color: var(--lse-neutral-gray) !important;
}

.top_menu ul li a:hover {
    color: var(--lse-secondary-orange) !important;
}

.top_menu ul li a:hover::before {
    color: var(--lse-secondary-orange) !important;
}

.top_menu ul li.mail a::before {
    content: '\f0e0';
}

.top_menu ul li.phone a::before {
    content: '\f095';
}

.header_social {
    float: right;
    margin-right: 20px;
    padding: 6px 0 0 0;
}

.header_social a,
.header_social a:link,
.header_social a:visited,
.header_top .header_social a,
.header_top .header_social a:link,
.header_top .header_social a:visited,
body .header_social a,
body .header_social a:link,
body .header_social a:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 8px;
    color: var(--lse-structure-navy) !important;
    font-size: 16px;
    text-decoration: none;
    transition: color 0.3s ease, transform 0.3s ease;
}

.header_social a:first-child {
    margin-left: 0;
}

.header_social a:hover,
.header_social a:hover:visited,
.header_top .header_social a:hover,
.header_top .header_social a:hover:visited,
body .header_social a:hover,
body .header_social a:hover:visited {
    color: var(--lse-secondary-orange) !important;
    transform: translateY(-2px);
}

.header_social a i,
.header_top .header_social a i,
body .header_social a i {
    font-size: 16px;
    line-height: 1;
    font-style: normal;
    color: inherit !important;
}

.header-brand-symbol img {
    display: block;
    width: auto;
    height: 22px;
    object-fit: contain;
}

.header-brand-symbol--residences img {
    height: 24px;
}

/* ==========================================================================
   Blog single – full redesign (2026-02-09)
   ========================================================================== */

/* Hero banner — full-width with featured image background */
.blog-single__hero-banner {
    position: relative;
    min-height: 380px;
    display: flex;
    align-items: flex-end;
    background-size: cover;
    background-position: center 30%;
    background-color: #091a3f;
}

.blog-single__hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(9, 26, 63, 0.92) 0%,
        rgba(9, 26, 63, 0.7) 40%,
        rgba(9, 26, 63, 0.35) 100%
    );
    pointer-events: none;
}

.blog-single__hero-inner {
    position: relative;
    z-index: 1;
    padding: 48px 0 40px;
}

/* Breadcrumb */
.blog-single__breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    margin-bottom: 20px;
}

.blog-single__breadcrumb a,
.blog-single__breadcrumb a:link,
.blog-single__breadcrumb a:visited {
    color: rgba(255, 255, 255, 0.7) !important;
    text-decoration: none !important;
    transition: color 0.15s ease;
}

.blog-single__breadcrumb a:hover {
    color: #ffffff !important;
}

.blog-single__breadcrumb span {
    color: rgba(255, 255, 255, 0.4);
}

/* Hero title */
.blog-single__title,
h1.blog-single__title {
    font-size: clamp(1.75rem, 4vw, 2.75rem) !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    line-height: 1.2 !important;
    margin: 0 0 20px !important;
    max-width: 800px;
    text-align: left !important;
}

.blog-single__title::after,
h1.blog-single__title::after {
    display: none !important;
}

/* Hero meta chips */
.meta-chip--hero {
    background: rgba(255, 255, 255, 0.15) !important;
    color: rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.meta-chip--hero svg {
    fill: rgba(255, 255, 255, 0.9);
}

a.meta-chip--hero:link,
a.meta-chip--hero:visited {
    color: rgba(255, 255, 255, 0.9) !important;
}

a.meta-chip--hero:hover {
    background: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

/* Body */
.blog-single {
    background: #f9fbfd;
}

.blog-single__wrap {
    padding: 40px 0 60px;
}

.blog-single__grid {
    display: flex;
    gap: 48px;
    align-items: flex-start;
}

.blog-single__main {
    flex: 1 1 0;
    min-width: 0;
    max-width: 800px;
}

.blog-single__article {
    background: #ffffff;
    border-radius: 16px;
    padding: 40px 44px;
    box-shadow: 0 1px 3px rgba(9, 26, 63, 0.04), 0 8px 32px rgba(9, 26, 63, 0.06);
    border: 1px solid rgba(9, 26, 63, 0.05);
}

/* Content typography */
.blog-single__content {
    font-size: 1.08rem;
    line-height: 1.85;
    color: #2a2f3d;
}

.blog-single__content p {
    margin-bottom: 1.5em;
}

.blog-single__content img {
    border-radius: 12px;
    margin: 1.5em 0;
    max-width: 100%;
    height: auto;
}

.blog-single__content blockquote {
    border-left: 3px solid #E6007E;
    margin: 2em 0;
    padding: 1em 1.5em;
    background: rgba(230, 0, 126, 0.04);
    border-radius: 0 12px 12px 0;
    font-style: italic;
    color: #4d5a75;
}

.blog-single__content ul,
.blog-single__content ol {
    padding-left: 1.5em;
    margin-bottom: 1.5em;
}

.blog-single__content li {
    margin-bottom: 0.5em;
}

/* Blog post tables */
.blog-single__content table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 1.5em 0;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(9, 26, 63, 0.1);
    font-size: 0.95rem;
}

.blog-single__content thead th {
    background: #000032;
    color: #fff;
    font-weight: 600;
    padding: 14px 20px;
    text-align: left;
    font-size: 0.9rem;
    letter-spacing: 0.02em;
}

.blog-single__content tbody td {
    padding: 12px 20px;
    border-bottom: 1px solid rgba(9, 26, 63, 0.06);
    vertical-align: top;
}

.blog-single__content tbody tr:last-child td {
    border-bottom: none;
}

.blog-single__content tbody tr:nth-child(even) {
    background: rgba(9, 26, 63, 0.02);
}

.blog-single__content tbody tr:hover {
    background: rgba(9, 26, 63, 0.04);
}

.blog-single__content tbody td a {
    font-weight: 600;
    color: #000032;
}

.blog-single__content tbody td a:hover {
    color: #E6007E;
}

@media (max-width: 600px) {
    .blog-single__content table {
        font-size: 0.88rem;
    }
    .blog-single__content thead th,
    .blog-single__content tbody td {
        padding: 10px 14px;
    }
}

/* entry-content h2 — only override when NOT .ukse-section-heading */
.entry-content h2 {
    font-size: 1.5rem;
    line-height: 1.3;
    font-weight: 700;
    margin: 2.5rem 0 1rem;
    text-align: left;
    color: #000032;
}

.entry-content h2::after {
    content: "";
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #E6007E, #EE7218);
    margin: 0.5rem 0 0;
    border-radius: 999px;
}

.entry-content h3 {
    font-size: 1.2rem;
    font-weight: 600;
    margin: 2rem 0 0.75rem;
    color: #000032;
}

/* Share section */
.blog-single__share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin: 40px 0 0;
    padding: 24px 0;
    border-top: 1px solid rgba(9, 26, 63, 0.08);
    border-bottom: 1px solid rgba(9, 26, 63, 0.08);
}

.blog-single__share-label {
    font-weight: 600;
    font-size: 0.95rem;
    color: #000032;
}

.blog-single__share-links {
    display: flex;
    gap: 10px;
}

.blog-single__share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(9, 26, 63, 0.06);
    color: #000032 !important;
    transition: all 0.2s ease;
}

.blog-single__share-btn:link,
.blog-single__share-btn:visited {
    color: #000032 !important;
}

.blog-single__share-btn:hover {
    transform: translateY(-2px);
}

.blog-single__share-btn--x:hover  { background: #000; color: #fff !important; }
.blog-single__share-btn--li:hover { background: #0A66C2; color: #fff !important; }
.blog-single__share-btn--fb:hover { background: #1877F2; color: #fff !important; }
.blog-single__share-btn--wa:hover { background: #25D366; color: #fff !important; }

/* Tags */
.blog-single__footer {
    margin-top: 24px;
    background: transparent;
    color: inherit;
    padding: 0;
}

.blog-single__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.blog-single__tags-label {
    font-weight: 600;
    font-size: 0.9rem;
    color: #000032;
    margin-right: 4px;
}

.blog-single__tags a,
.blog-single__tags a:link,
.blog-single__tags a:visited {
    background: rgba(9, 26, 63, 0.05) !important;
    border-radius: 999px !important;
    padding: 5px 14px !important;
    color: rgba(9, 26, 63, 0.7) !important;
    font-size: 0.85rem !important;
    text-decoration: none !important;
    transition: all 0.15s ease;
}

.blog-single__tags a:hover {
    background: rgba(230, 0, 126, 0.1) !important;
    color: #E6007E !important;
}

/* Post navigation */
.blog-single__post-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 32px 0 0;
    padding: 32px 0 0;
    border-top: 1px solid rgba(9, 26, 63, 0.08);
}

.blog-single__nav-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    padding: 16px;
    border-radius: 12px;
    background: rgba(9, 26, 63, 0.03);
    border: 1px solid rgba(9, 26, 63, 0.06);
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.blog-single__nav-card:link,
.blog-single__nav-card:visited {
    text-decoration: none !important;
}

.blog-single__nav-card:hover {
    background: rgba(9, 26, 63, 0.06);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(9, 26, 63, 0.08);
}

.blog-single__nav-card--next {
    text-align: right;
    flex-direction: row;
}

.blog-single__nav-thumb {
    flex: 0 0 72px;
    width: 72px;
    height: 54px;
    border-radius: 8px;
    overflow: hidden;
}

.blog-single__nav-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.blog-single__nav-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.blog-single__nav-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #E6007E;
}

.blog-single__nav-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #000032 !important;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Sidebar */
.blog-single__sidebar {
    flex: 0 0 320px;
    position: sticky;
    top: 140px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Sidebar thumbnail list */
.blog-sidebar-list--thumbs a {
    display: flex !important;
    align-items: flex-start;
    gap: 14px;
}

.blog-sidebar-list__thumb {
    flex: 0 0 72px;
    width: 72px;
    height: 54px;
    border-radius: 8px;
    overflow: hidden;
    background: rgba(9, 26, 63, 0.04);
}

.blog-sidebar-list__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.blog-sidebar-list--thumbs a:hover .blog-sidebar-list__thumb img {
    transform: scale(1.08);
}

.blog-sidebar-list__text {
    flex: 1;
    min-width: 0;
}

.blog-sidebar-list--thumbs .blog-sidebar-list__title {
    font-size: 0.9rem;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Browse by topic — pill-style tags */
.blog-sidebar-list--topics {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px !important;
}

.blog-sidebar-list--topics li {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.blog-sidebar-list--topics a,
.blog-sidebar-list--topics a:link,
.blog-sidebar-list--topics a:visited {
    display: inline-block !important;
    padding: 6px 14px !important;
    border-radius: 999px !important;
    background: rgba(9, 26, 63, 0.05) !important;
    font-size: 0.85rem !important;
    font-weight: 500 !important;
    transition: all 0.15s ease !important;
}

.blog-sidebar-list--topics a:hover {
    background: rgba(230, 0, 126, 0.1) !important;
    color: #E6007E !important;
}

/* Responsive */
@media (max-width: 1200px) {
    .blog-single__grid {
        gap: 32px;
    }
    .blog-single__sidebar {
        flex-basis: 280px;
    }
    .blog-single__article {
        padding: 32px;
    }
}

@media (max-width: 991px) {
    .blog-single__grid {
        flex-direction: column;
    }
    .blog-single__sidebar {
        width: 100%;
        position: static;
    }
    .blog-single__hero-banner {
        min-height: 300px;
    }
    .blog-single__article {
        padding: 24px 20px;
        border-radius: 12px;
    }
    .blog-single__post-nav {
        grid-template-columns: 1fr;
    }
}

.header_social i.fa,
.header_top .header_social i.fa,
body .header_social i.fa {
    font-family: "FontAwesome" !important;
    font-weight: normal !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* Header top layout refresh */
.header_top .grid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-left: 0;
    gap: 12px 24px;
}

.header_top .grid__item {
    width: auto;
    padding-left: 0;
    flex: 1 1 auto;
}

.header_top .grid__item:last-child {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
}

.header_top .header_social {
    float: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.header_top .language_option {
    margin-left: 12px;
    display: flex;
    align-items: center;
}

@media (max-width: 900px) {
    .header_top .grid {
        flex-direction: column;
        align-items: flex-start;
    }

    .header_top .grid__item,
    .header_top .grid__item:last-child {
        width: 100%;
        flex: 1 1 100%;
    }

    .header_top .grid__item:last-child {
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 12px;
    }

    .header_top .header_social {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .header_top .language_option {
        margin-left: 0;
    }
}

@media (max-width: 600px) {
    .top_menu ul {
        gap: 8px 16px;
    }

    .top_menu ul li {
        padding-right: 0;
    }

    .header_top .grid__item:last-child {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .header_top {
        display: none;
    }

    .header-brand-symbol,
    .header_top .header_social,
    .header_top .language_option {
        display: none !important;
    }
}

.header_social .fa-facebook:before,
.header_top .header_social .fa-facebook:before,
body .header_social .fa-facebook:before {
    content: "\f09a" !important;
}

.header_social .fa-twitter:before,
.header_top .header_social .fa-twitter:before,
body .header_social .fa-twitter:before {
    content: "\f099" !important;
}

.header_social .fa-linkedin:before,
.header_top .header_social .fa-linkedin:before,
body .header_social .fa-linkedin:before {
    content: "\f0e1" !important;
}

.header_social .fa-instagram:before,
.header_top .header_social .fa-instagram:before,
body .header_social .fa-instagram:before {
    content: "\f16d" !important;
}

.header_social .fa-whatsapp:before,
.header_top .header_social .fa-whatsapp:before,
body .header_social .fa-whatsapp:before {
    content: "\f232" !important;
}

.header_social a:hover i,
.header_top .header_social a:hover i,
body .header_social a:hover i,
.header_social a:hover i::before,
.header_top .header_social a:hover i::before,
body .header_social a:hover i::before {
    color: var(--lse-secondary-orange) !important;
}

.language_option,
#lang_sel {
    background: #ffffff !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.language_option {
    position: relative;
    z-index: 999;
    min-width: 0;
}

#lang_sel {
    position: static;
    width: auto;
    min-width: 0;
    height: auto;
    display: block;
}

.language_option #lang_sel ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.language_option #lang_sel ul li {
    position: relative;
}

.language_option #lang_sel ul li a {
    display: block;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 16px;
    text-decoration: none;
    border: 0;
    color: var(--lse-structure-navy) !important;
    transition: color 0.3s ease, background 0.3s ease;
}

.language_option #lang_sel a.lang_sel_sel {
    position: relative;
    padding-right: 34px;
    background: #ffffff !important;
    border-radius: 3px;
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
}

.language_option #lang_sel a.lang_sel_sel::after {
    content: '\f107';
    font-family: 'FontAwesome';
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    font-size: 14px;
    color: var(--lse-neutral-gray);
}

.language_option img {
    width: 16px;
    height: 12px;
    margin-right: 6px;
}

.language_option #lang_sel a.lang_sel_sel:hover {
    color: var(--lse-secondary-orange) !important;
}

.language_option #lang_sel ul ul {
    top: calc(100% - 1px);
    min-width: 120px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    background: #ffffff;
    left: auto;
    right: 0;
}

.language_option #lang_sel ul li li {
    width: 100%;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.language_option #lang_sel ul ul a {
    background: #ffffff;
}

.language_option #lang_sel ul ul a:hover {
    background: var(--lse-secondary-orange) !important;
    color: #ffffff !important;
}

/* Custom header language dropdown */
.language-option--dropdown {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.header-language-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    border-radius: 999px;
    border: 1px solid rgba(26, 40, 89, 0.22);
    background: rgba(255, 255, 255, 0.85);
    color: var(--lse-structure-navy);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.01em;
    cursor: pointer;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

.header-language-toggle:hover,
.header-language-toggle:focus,
.header-language-toggle:focus-visible {
    background: #ffffff;
    border-color: rgba(26, 40, 89, 0.36);
    color: var(--lse-structure-navy);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
    outline: none;
}

.header-language-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.header-language-icon {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid currentColor;
    transition: transform 0.2s ease;
}

.language-option--dropdown.is-open .header-language-icon {
    transform: rotate(180deg);
}

.header-language-menu {
    list-style: none;
    margin: 12px 0 0;
    padding: 8px 0;
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 220px;
    background: #ffffff;
    border: 1px solid rgba(26, 40, 89, 0.16);
    border-radius: 12px;
    box-shadow: 0 24px 36px rgba(0, 0, 0, 0.22);
    display: flex;
    flex-direction: column;
    gap: 4px;
    z-index: 1000;
}

.header-language-menu[hidden] {
    display: none;
}

.header-language-option {
    margin: 0;
}

.header-language-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    color: var(--lse-structure-navy);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}

.header-language-link:hover,
.header-language-link:focus,
.header-language-link:focus-visible {
    background: rgba(26, 40, 89, 0.08);
    color: var(--lse-structure-navy);
    outline: none;
}

.header-language-option.is-active .header-language-link {
    font-weight: 600;
    background: rgba(255, 156, 106, 0.18);
}

.header-language-flag {
    width: 18px;
    height: 12px;
    border-radius: 2px;
    object-fit: cover;
    flex-shrink: 0;
}

.header-language-name {
    white-space: nowrap;
}


.header_bottom {
    min-height: 96px;
    padding: 22px 0 16px;
}

.header_nav {
    float: right;
    padding-top: 12px;
}

.header_nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
    border-bottom: 1px solid #ccc;
}

.header_nav ul li {
    float: left;
    padding: 0 0 12px 36px;
    font-family: 'proxima-nova', 'Proxima Nova', 'proxima_nova', sans-serif;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.2;
    letter-spacing: 0;
}

.header_nav ul li:first-child {
    padding-left: 0;
}

.header_nav ul li:last-child a {
    text-decoration: underline;
}

.header_nav ul li a {
    text-decoration: none;
    display: inline-block;
    padding: 0;
}

.header_nav ul li:hover > a {
    text-decoration: underline;
}

.header_nav ul ul {
    position: absolute;
    top: 30px;
    left: 0;
    width: 160px;
    margin: 0;
    padding: 0;
    list-style: none;
    background: #fff;
    border: 1px solid #d7d7d7;
    display: none;
    text-align: left;
    z-index: 999;
}

.header_nav ul li:hover > ul,
.header_nav ul li li:hover > ul {
    display: block;
}

.header_nav ul li li {
    float: none;
    width: 100%;
    padding: 10px;
    border-top: 1px solid #d7d7d7;
    font-family: 'ligurino_condensedregular', 'Proxima Nova', sans-serif;
    font-size: 16px;
    letter-spacing: 1px;
    text-transform: none;
}

.header_nav ul li li:first-child {
    border-top: 0;
}

.header_nav ul li li a {
    display: block;
    text-decoration: none;
}

/* Header navigation override (consolidated from child overrides) */
body .header_nav,
.header_nav {
    background: #ffffff !important;
    padding: 8px 0 !important;
    border-top: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    gap: 0;
}

body .header_nav ul,
body .header_nav .nav,
body .header_nav .top-nav,
.header_nav ul,
.header_nav .nav,
.header_nav .top-nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    gap: 0;
}

body .header_nav li,
body .header_nav .nav li,
body .header_nav .top-nav li,
.header_nav li,
.header_nav .nav li,
.header_nav .top-nav li {
    display: inline-flex !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

body .header_nav a,
body .header_nav .nav a,
body .header_nav .top-nav a,
.header_nav a,
.header_nav .nav a,
.header_nav .top-nav a {
    color: var(--lse-structure-navy) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 8px 12px !important;
    margin: 0 2px !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
    background: transparent !important;
}

body .header_nav #menu-item-6242 > a,
.header_nav #menu-item-6242 > a {
    font-size: 12px !important;
    padding: 8px 16px !important;
    margin: 2px 6px !important;
    border-radius: 20px !important;
}

body .header_nav #menu-item-6242 > a:hover,
body .header_nav #menu-item-6242 > a:focus,
body .header_nav #menu-item-6242 > a:focus-visible,
.header_nav #menu-item-6242 > a:hover,
.header_nav #menu-item-6242 > a:focus,
.header_nav #menu-item-6242 > a:focus-visible,
body .header_nav #menu-item-6242 > a:hover:visited,
body .header_nav #menu-item-6242 > a:focus:visited,
body .header_nav #menu-item-6242 > a:focus-visible:visited,
.header_nav #menu-item-6242 > a:hover:visited,
.header_nav #menu-item-6242 > a:focus:visited,
.header_nav #menu-item-6242 > a:focus-visible:visited {
    color: #ffffff !important;
}

.nav.top-nav,
#menu-main-menu-english {
    background: #ffffff !important;
    border-top: 1px solid #e0e0e0 !important;
    border-bottom: 1px solid #e0e0e0 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.nav.top-nav a,
#menu-main-menu-english a {
    color: var(--lse-structure-navy) !important;
    transition: color 0.3s ease;
}

.nav.top-nav a:hover,
#menu-main-menu-english a:hover {
    color: var(--lse-secondary-orange) !important;
}

body .header_nav a:hover,
body .header_nav .nav a:hover,
body .header_nav .top-nav a:hover,
.header_nav a:hover,
.header_nav .nav a:hover,
.header_nav .top-nav a:hover {
    color: var(--lse-secondary-orange) !important;
}

@media (max-width: 1200px) {
    body .header_nav a,
    .header_nav a {
        font-size: 12px !important;
        padding: 6px 10px !important;
        margin: 0 1px !important;
    }

    body .header_nav #menu-item-6242 > a {
        font-size: 11px !important;
        padding: 6px 12px !important;
    }
}

@media (max-width: 1024px) {
    body .header_nav a,
    .header_nav a {
        font-size: 11px !important;
        padding: 5px 8px !important;
    }

    body .header_nav #menu-item-6242 > a {
        font-size: 10px !important;
        padding: 5px 10px !important;
    }
}

.site_navigation.desk ul li:hover > ul,
.site_navigation.desk ul li.hover > ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 9999 !important;
    background: #ffffff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* ==========================================================================
   Sticky Navigation
   ========================================================================== */

.header {
    transition: transform 0.3s ease;
}

body.header-hidden .header {
    transform: translateY(-100%) !important;
    transition: transform 0.3s ease;
}

body .header.sticky {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1) !important;
    animation: slideDown 0.3s ease !important;
}

@keyframes slideDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

body .header.sticky .header_top {
    display: none !important;
}

body .header.sticky .header_bottom {
    padding: 16px 0 12px !important;
    min-height: 82px !important;
}

body .header.sticky .header_nav {
    padding-top: 6px !important;
}

body .header.sticky .logo img {
    max-height: 58px !important;
    transition: max-height 0.3s ease !important;
}

@media (max-width: 768px) {
    body .header.sticky .logo img {
        max-height: 48px !important;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    body .header.sticky .logo img {
        max-height: 53px !important;
    }
}

body.header-sticky {
    padding-top: 96px;
}

@media (max-width: 768px) {
    body.header-sticky {
        padding-top: 72px;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    body.header-sticky {
        padding-top: 76px;
    }
}

/* === UKSE: Sticky header breakpoint policy (single source of truth) ===
   Policy:
   - ≤767px: mobile header (hamburger + drawer), hide inline desktop nav, hide partner bar
   - ≥768px: desktop header (inline nav), hide hamburger, partner bar visible (non-sticky)
   - Partner bar NEVER appears in sticky header at any width
   Notes:
   - Keep this block minimal; do not create "in-between" states.
   - Parent theme ie.css has `.nav-toggle{display:none!important}`, must override. */

@media (max-width: 767px) {
    /* Mobile: hide partner bar (saves vertical space on small screens) */
    .partner-bar {
        display: none !important;
    }

    /* Breathing room so logo/CTA aren't flush */
    .header_bottom {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    /* Mobile mode: show hamburger (override parent theme ie.css with higher specificity)
       Note: Parent ie.css has .nav-toggle{display:none!important} and loads AFTER child theme.
       Using higher specificity (0,4,0 vs 0,1,0) to guarantee override. */
    .header .header_controls .menu_icon.nav-toggle,
    .header_bottom .header_controls .menu_icon.nav-toggle,
    button.menu_icon.nav-toggle {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Mobile mode: hide inline desktop nav */
    .header .header_nav,
    .header_bottom .header_nav {
        display: none !important;
    }
}

@media (min-width: 768px) {
    /* Desktop mode: hide hamburger */
    .header .header_controls .menu_icon.nav-toggle,
    .header_bottom .header_controls .menu_icon.nav-toggle,
    button.menu_icon.nav-toggle {
        display: none !important;
        visibility: hidden !important;
    }

    /* Desktop mode: show inline nav */
    .header .header_nav,
    .header_bottom .header_nav {
        display: flex !important;
    }
}

/* Sticky state: partner bar never shown (all widths).
   JS adds .sticky class to .header when scrolled past threshold. */
.header.sticky .partner-bar {
    display: none !important;
}

/* Mobile sticky: restore side gutters (global sticky rule sets padding: 16px 0 12px) */
@media (max-width: 767px) {
    body .header.sticky .header_bottom {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

/* Desktop search icon: extend icon-only styling from 960px down to 768px.
   style.css has this at min-width:960px; we override for 768-959px range. */
@media (min-width: 768px) and (max-width: 959px) {
    li.menu-item-search-trigger > a {
        display: inline-block !important;
        width: 40px !important;
        height: auto !important;
        padding: 8px 12px !important;
        text-indent: -9999px !important;
        overflow: hidden !important;
        position: relative !important;
    }

    li.menu-item-search-trigger > a::before {
        content: "\f002" !important;
        font-family: "Font Awesome 6 Free" !important;
        font-weight: 900 !important;
        font-size: 16px !important;
        color: inherit !important;
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        text-indent: 0 !important;
    }
}

/* Desktop band composition (768-1024px): keep logo + nav on one row */
@media (min-width: 768px) and (max-width: 1024px) {
    /* Reduce logo so it doesn't force a second row */
    body .header .logo img {
        max-height: 72px !important;
        width: auto !important;
        height: auto !important;
    }

    /* Force single-row layout for logo + nav/controls */
    body .header .header_bottom .grid {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 16px !important;
    }

    body .header .header_bottom .grid__item:first-child {
        flex: 0 0 auto !important;
        max-width: 220px !important;
    }

    body .header .header_bottom .grid__item:last-child {
        flex: 1 1 auto !important;
        min-width: 0 !important; /* allow nav to shrink */
        margin-left: auto !important;
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        padding-left: 16px !important;
        overflow: visible !important;
    }

    /* Override right-anchoring on nav column */
    body .header_bottom .grid__item.lap--eight-tenths {
        justify-content: flex-start !important;
    }

    /* Allow nav to size naturally */
    body .header .header_nav {
        width: auto !important;
        max-width: none !important;
        overflow: visible !important;
        margin-left: 12px !important;
        justify-content: flex-end !important;
    }

    /* Slightly tighten nav so it fits cleanly */
    body .header .header_nav a {
        padding: 6px 10px !important;
        font-size: 13px !important;
    }

    /* Keep the CTA from ballooning */
    body .header .header_nav .menu_cta a,
    body .header .header_nav .menu_cta .menu-button {
        padding: 10px 16px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }
}

/* Tablet header gap correction: force precise 10px visual gap via transform */
@media (min-width: 768px) and (max-width: 1279px) {
    body .header_bottom .header_nav {
        margin-left: -20px;
        transform: translateX(10px);
    }

    body .header_bottom .grid__item.lap--eight-tenths {
        transform: translateX(10px);
    }
}

/* ============================================
   TABLET NAV FIT (768–1023px)
   Adapted desktop nav: keep everything on one row
   and ensure CTA is fully visible.
   ============================================ */
@media (min-width: 768px) and (max-width: 1023px) {

    /* A) Use more of the viewport for the header bottom row */
    body .header_bottom.wrap {
        max-width: none !important;
        width: calc(100% - 40px) !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
    }

    /* B) Reduce logo column footprint + right-align logo + safe gutter */
    body .header .header_bottom .grid__item:first-child {
        max-width: 200px !important;
        flex: 0 0 auto !important;
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        padding-right: 12px !important;
    }
    body .header_bottom .grid__item:first-child .logo,
    body .header_bottom .header_logo {
        margin: 0 !important;
        padding-left: 24px !important;   /* nudge logo inward from left edge */
    }
    body .header_bottom .logo img {
        max-height: 64px !important;     /* slightly larger logo for tablet */
        width: auto !important;
        height: auto !important;
        max-width: 180px !important;     /* keep within column bounds */
    }

    /* C) Remove any nav link margins that add up */
    body .header_bottom .header_nav > ul > li > a {
        margin: 0 !important;
        white-space: nowrap !important;
    }

    /* D) Tighten nav density slightly (tablet only) */
    body .header_bottom .header_nav > ul > li > a {
        font-size: 12px !important;
        padding: 6px 8px !important;
        line-height: 1.2 !important;
    }
    body .header_bottom .header_nav > ul > li:last-child > a {
        padding: 8px 12px !important;
    }

    /* E) Ensure nav column can use remaining space + remove left gutter */
    body .header .header_bottom .grid__item:last-child {
        flex: 1 1 0% !important;
        min-width: 0 !important;
        padding-left: 0 !important;
    }

    /* E2) Reduce inter-column gap + fix header_nav alignment */
    body .header .header_bottom .grid {
        gap: 12px !important;
        margin-left: 0 !important;   /* neutralise negative margin from parent theme */
    }
    body .header_bottom .header_nav {
        width: 100% !important;
        padding-right: 12px !important;
        margin-left: 0 !important;
        justify-content: flex-start !important;
    }
    body .header_bottom .header_nav > ul {
        display: flex !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
    }

    /* F) Push CTA to right edge */
    body .header_bottom .header_nav > ul > li:last-child {
        margin-left: auto !important;
    }

    /* G) Neutralise fighting tablet transforms/margins from 768-1279 block */
    body .header_bottom .header_nav,
    body .header_bottom .grid__item.lap--eight-tenths,
    body .header_bottom .grid__item.desk--eight-tenths {
        transform: none !important;
        margin-left: 0 !important;
    }

    /* H) Override 20/80 grid columns so spacing is controllable */
    /* Logo column: keep shrink-to-fit but let Section B's max-width:200px apply */
    body .header_bottom .grid > .grid__item.lap--two-tenths,
    body .header_bottom .grid > .grid__item.desk--two-tenths {
        flex: 0 0 auto !important;
        width: auto !important;
        /* max-width: none removed - Section B's 200px constraint must apply */
    }

    body .header_bottom .grid > .grid__item.lap--eight-tenths,
    body .header_bottom .grid > .grid__item.desk--eight-tenths {
        flex: 1 1 0% !important;
        width: auto !important;
        min-width: 0 !important;
    }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Header Nav — Tabs-Style Underline (matches School/City CPT tabs pattern)
   Desktop only (≥768px). Mobile drawer uses separate styling.
   ───────────────────────────────────────────────────────────────────────────── */

/* Nav container — subtle bottom border anchor (like tabs-nav) */
@media (min-width: 768px) {
    body .header_nav > ul,
    body .header_nav > .nav,
    body .header_nav > .top-nav {
        border-bottom: 1px solid rgba(0, 0, 50, 0.08);
        padding-bottom: 1px;
    }

    /* Nav links — flex for vertical centering, position relative for underline pseudo-element */
    body .header_bottom .header_nav > ul > li > a,
    body .header_bottom .header_nav > .nav > li > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        height: 42px !important;
        padding: 0 16px !important;
        margin: 0 !important;
        color: rgba(0, 0, 50, 0.6) !important;
        font-weight: 600 !important;
        transition: color 0.2s ease !important;
        text-decoration: none !important;
    }

    /* Underline — hidden by default, animates in on hover/active */
    body .header_bottom .header_nav > ul > li > a::after,
    body .header_bottom .header_nav > .nav > li > a::after {
        content: '';
        position: absolute;
        bottom: -1px;
        left: 0;
        right: 0;
        width: 100%;
        height: 3px;
        background: linear-gradient(90deg, #EE7218 0%, #E6007E 50%, #6ACAF3 100%);
        border-radius: 3px 3px 0 0;
        transform: scaleX(0);
        transform-origin: center;
        transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    }

    /* Hover — text darkens, partial underline preview */
    body .header_bottom .header_nav > ul > li > a:hover,
    body .header_bottom .header_nav > .nav > li > a:hover {
        color: var(--lse-structure-navy, #000032) !important;
        background: transparent !important;
        text-decoration: none !important;
    }

    body .header_bottom .header_nav > ul > li > a:hover::after,
    body .header_bottom .header_nav > .nav > li > a:hover::after {
        transform: scaleX(0.5);
    }

    /* Active / Current page — strong text, full underline */
    body .header_bottom .header_nav > ul > li.current-menu-item > a,
    body .header_bottom .header_nav > ul > li.current_page_parent > a,
    body .header_bottom .header_nav > ul > li.current-menu-ancestor > a,
    body .header_bottom .header_nav > .nav > li.current-menu-item > a,
    body .header_bottom .header_nav > .nav > li.current_page_parent > a,
    body .header_bottom .header_nav > .nav > li.current-menu-ancestor > a {
        color: var(--lse-structure-navy, #000032) !important;
        background: transparent !important;
    }

    body .header_bottom .header_nav > ul > li.current-menu-item > a::after,
    body .header_bottom .header_nav > ul > li.current_page_parent > a::after,
    body .header_bottom .header_nav > ul > li.current-menu-ancestor > a::after,
    body .header_bottom .header_nav > .nav > li.current-menu-item > a::after,
    body .header_bottom .header_nav > .nav > li.current_page_parent > a::after,
    body .header_bottom .header_nav > .nav > li.current-menu-ancestor > a::after {
        transform: scaleX(1);
    }

    /* Focus-visible — accessibility outline */
    body .header_bottom .header_nav > ul > li > a:focus-visible,
    body .header_bottom .header_nav > .nav > li > a:focus-visible {
        outline: 2px solid var(--lse-tertiary-blue, #6acaf3);
        outline-offset: 2px;
        border-radius: 4px;
    }

    /* Exclude CTA button (Apply Now) from tabs styling — keep its pill appearance */
    body .header_bottom .header_nav > ul > li:last-child > a,
    body .header_bottom .header_nav > .nav > li:last-child > a {
        color: var(--lse-structure-navy, #000032) !important;
    }

    body .header_bottom .header_nav > ul > li:last-child > a::after,
    body .header_bottom .header_nav > .nav > li:last-child > a::after {
        display: none;
    }

    body .header_bottom .header_nav > ul > li:last-child > a:hover,
    body .header_bottom .header_nav > .nav > li:last-child > a:hover {
        color: var(--lse-secondary-orange, #EE7218) !important;
    }
}

/* Tablet density adjustment (768px – 1024px) — tighten horizontal padding */
@media (min-width: 768px) and (max-width: 1024px) {
    body .header_bottom .header_nav > ul > li > a,
    body .header_bottom .header_nav > .nav > li > a {
        padding: 0 10px !important;
        font-size: 12px !important;
    }
}

/* Wide tablet adjustment (1025px – 1200px) */
@media (min-width: 1025px) and (max-width: 1200px) {
    body .header_bottom .header_nav > ul > li > a,
    body .header_bottom .header_nav > .nav > li > a {
        padding: 0 14px !important;
        font-size: 13px !important;
    }
}

/* Mobile Smart Sticky Header (phone only: ≤767px where mobile nav toggle is visible)
   At ≥768px, header is in normal flow and only becomes fixed via JS .sticky class. */
@media (max-width: 767px) {
    .header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 9990 !important;
        background: #fff !important;
        transition: transform 0.25s ease-out !important;
    }

    body.header-hidden .header {
        transform: translateY(-100%) !important;
    }

    /* Ensure mobile nav open takes precedence - header stays visible */
    body.mobile-nav-open .header {
        transform: translateY(0) !important;
    }

    /* Body offset to prevent content from hiding under fixed header */
    body {
        padding-top: 80px !important;
    }
}

/* === FOOTER SOCIAL ICONS === */
.footer-social {
    text-align: center;
    margin-top: 1rem;
}

footer .footer-social a,
footer .footer-social a:link,
footer .footer-social a:visited {
    color: #ffffff !important;
    font-size: 1.1rem;
    margin: 0 0.5rem;
    display: inline-block;
    transition: color 0.2s ease;
    text-decoration: none;
}

footer .footer-social a:hover,
footer .footer-social a:focus,
footer .footer-social a:active {
    color: var(--lse-tertiary-blue) !important;
}

footer .footer-social a[aria-label="WhatsApp"]:hover {
    color: #25D366 !important;
}

.footer-legal {
    text-align: center;
    margin-top: 0.75rem;
    font-size: 0.85rem;
}

.footer-legal a,
.footer-legal a:link,
.footer-legal a:visited {
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    margin: 0 0.75rem;
}

.footer-legal a:hover,
.footer-legal a:focus {
    color: var(--lse-tertiary-blue) !important;
    text-decoration: none;
}

/* ==========================================================================
   404 Page
   ========================================================================== */

.ukse-404-page {
    min-height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4rem 1rem;
}

.ukse-404-inner h1 {
    font-size: clamp(4rem, 10vw, 8rem);
    font-weight: 800;
    background: linear-gradient(135deg, #EE7218 0%, #E6007E 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
    margin-bottom: 0.25rem;
}

.ukse-404-inner h2 {
    font-size: 1.5rem;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 1rem;
}

.ukse-404-inner p {
    color: #666;
    font-size: 1.05rem;
    margin-bottom: 2rem;
}

.ukse-404-actions {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* ==========================================================================
   Hero & Course Finder
   ========================================================================== */

.home .banner_holder,
.banner_holder {
    background-image: url('/wp-content/LSE-hero-image.jpg') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    min-height: 500px !important;
    border-radius: 0 !important;
    position: relative !important;
}

.banner_holder::before,
.hero-section::before,
.banner-section::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(135deg, rgba(0, 0, 50, 0.8) 0%, rgba(230, 0, 126, 0.6) 50%, rgba(238, 114, 24, 0.5) 100%) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

.hero-title,
.banner_holder .hero-title,
.course-finder-hero .hero-title {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

.hero-subtitle,
.banner_holder .hero-subtitle,
.course-finder-hero .hero-subtitle {
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

.hero-stats,
.hero-stats *,
.hero-statistics,
.hero-statistics *,
.course-finder-hero .stats,
.course-finder-hero .stats *,
.banner_holder .stats,
.banner_holder .stats * {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
    position: relative !important;
    z-index: 2 !important;
}

.course-finder-hero > *,
.hero-section > *,
.banner-section > *,
.banner_holder > *,
.course-finder-wrapper,
.course-finder {
    position: relative !important;
    z-index: 2 !important;
}

.home-hero__finder .course-finder-hero,
.home-hero__finder .course-finder-hero-only {
    background: none !important;
    min-height: auto !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.home-hero__finder .course-finder-hero::before {
    display: none !important;
}

.home-hero__finder .course-finder-hero > .wrap,
.home-hero__finder .quick-search-container,
.home-hero__finder .search-inputs-row {
    padding: 0 !important;
    margin: 0 !important;
}

.home-hero__finder .quick-search-container {
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 16px !important;
    padding: 20px 22px !important;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.08) !important;
    font-family: var(--lse-body-font-family, 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif) !important;
}

/* Phase XV-C — Finder form base alignment */
.quick-search-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}

/* Phase XV-N — neutralise legacy quick-search widths */
.quick-search-form .search-input-group {
    flex: 0 0 auto !important;
    min-width: unset !important;
    width: auto !important;
}

.home-hero__finder .search-select {
    width: auto !important;
    max-width: none !important;
}

.quick-search-form .search-input-group select.search-select {
    width: auto !important;
}

/* Phase XV-J — legacy layout neutralized */
.search-inputs-row {
    gap: 0.75rem;
    align-items: center;
}

/* keep selects inline */
.search-inputs-row > *:not(.search-cta-btn-wrapper) {
    flex: 0 0 auto;
}

/* only the CTA wrapper breaks to a new full-width row */
.search-inputs-row .search-cta-btn-wrapper {
    flex: 1 1 100%;
    display: flex;
    justify-content: center;
    margin-top: 0.5rem;
}

.search-inputs-row .search-cta-btn {
    min-width: 160px;
    padding: 0.75rem 1.25rem;
    font-weight: 600;
}

@media (max-width: 600px) {
    .search-inputs-row > *:not(.search-cta-btn-wrapper) {
        flex: 1 1 45%;
        min-width: 150px;
    }

    .search-inputs-row .search-cta-btn-wrapper {
        flex-basis: 100%;
    }

    .search-inputs-row .search-cta-btn {
        width: 100%;
        max-width: 320px;
    }
}

.home-hero__finder .search-inputs-row {
    gap: 0.75rem;
}

.home-hero__finder .search-cta-btn {
    background: linear-gradient(135deg, #ee7218 0%, #e6007e 100%) !important;
    border-radius: 12px !important;
    padding: 0.75rem 1.25rem !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    box-shadow: 0 10px 20px rgba(230, 0, 126, 0.15) !important;
    min-width: 160px !important;
    transition: opacity 0.2s ease, filter 0.2s ease;
}

.home-hero__finder .search-cta-btn:disabled,
.home-hero__finder .search-cta-btn.is-loading {
    opacity: 0.7 !important;
    cursor: not-allowed !important;
    filter: grayscale(0.2);
}

/* Refine bar button disabled/loading state (synced with hero) */
.finder-lab-search-btn:disabled,
.finder-lab-search-btn.is-loading {
    opacity: 0.7 !important;
    cursor: not-allowed !important;
    filter: grayscale(0.2);
}

.home-hero__finder .search-cta-btn .search-icon {
    display: inline-flex !important;
}

.home-hero__finder .search-input-group label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #1f1f29 !important;
    display: block !important;
    margin-bottom: 8px !important;
    text-align: center !important;
}

.home-hero__finder .search-select {
    width: 100% !important;
    border-radius: 10px !important;
    border: 1px solid rgba(31, 31, 41, 0.15) !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
    font-family: inherit !important;
    box-shadow: none !important;
    background-color: #ffffff !important;
    color: #1f1f29 !important;
    background-image: linear-gradient(135deg, #ffffff 0%, #f7f8fc 100%) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.home-hero__finder .search-select:focus {
    outline: none !important;
    border-color: #ee7218 !important;
    box-shadow: 0 0 0 3px rgba(238, 114, 24, 0.25) !important;
}

.home-hero__finder .search-select option,
.home-hero__finder .search-select optgroup,
.home-hero__finder .search-select::-ms-value {
    font-size: 14px !important;
    background: #ffffff !important;
    color: #1f1f29 !important;
    font-family: inherit !important;
}

.home-hero__finder .search-select::-webkit-scrollbar {
    width: 8px;
}

.home-hero__finder .search-select::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 10px;
}

.home-hero__finder .search-cta-btn-wrapper {
    grid-column: 1 / -1 !important;
    display: flex !important;
    justify-content: center !important;
}

.home-hero__finder .hero-stats {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin-top: 18px !important;
}

.home-hero__finder .hero-stats .stat-item {
    background: rgba(255, 255, 255, 0.85) !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    text-align: center !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06) !important;
}

.home-hero__finder .hero-stats .stat-number {
    color: #e6007e !important;
    font-weight: 700 !important;
    font-size: 18px !important;
}

.home-hero__finder .hero-stats .stat-label {
    color: #1f1f29 !important;
    font-size: 12px !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
}

.home-hero__finder .course-finder-hero > .wrap {
    width: 100% !important;
}

.home-hero__finder .hero-content {
    padding: 0 !important;
}

.home-hero__wrap {
    display: flex !important;
    align-items: stretch !important;
    gap: clamp(24px, 5vw, 72px) !important;
    padding: 0 var(--lse-section-horizontal, 24px) 0 var(--lse-section-horizontal, 24px) !important;
}

.home-hero__col--content {
    flex: 2 1 0 !important;
    max-width: none !important;
    color: var(--lse-structure-navy, #000032) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: clamp(18px, 4vw, 36px) !important;
    justify-content: flex-start !important;
    padding-top: clamp(28px, 6vw, 64px) !important;
    padding-bottom: clamp(28px, 6vw, 64px) !important;
}

.home-hero__col--visual {
    flex: 1 1 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
    align-self: stretch !important;
    padding-bottom: 0 !important;
}

.home-hero__col--visual img {
    width: clamp(315px, 31.5vw, 465px) !important;
    max-width: none !important;
    height: auto !important;
    border-radius: 20px !important;
    box-shadow: 0 20px 45px rgba(7, 21, 52, 0.2) !important;
    object-fit: cover !important;
    margin: 0 !important;
    align-self: flex-end !important;
}

.home-hero__intro > *:last-child {
    margin-bottom: 0 !important;
}

.home-hero__intro h1,
.home-hero__intro h2 {
    color: var(--lse-structure-navy, #000032) !important;
}

.home-hero__intro p {
    color: #5a6170 !important;
}

.home-hero__title {
    margin: 0 !important;
    font-size: clamp(2.5rem, 5vw, 3.6rem) !important;
    line-height: 1.15 !important;
    color: inherit !important;
}

.home-hero__title h1 {
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.015em !important;
    color: inherit !important;
}

.home-hero__subtitle {
    margin: 0 !important;
    font-size: clamp(1.05rem, 2.2vw, 1.3rem) !important;
    line-height: 1.5 !important;
    color: #5a6170 !important;
}

.home-hero__subtitle--accent {
    font-weight: 600 !important;
    font-size: clamp(1rem, 1.8vw, 1.25rem) !important;
    margin-bottom: clamp(12px, 2.5vw, 20px) !important;
    white-space: nowrap !important;
}

.home-hero__subtitle--secondary {
    color: #5a6170 !important;
}

.home-hero__finder {
    margin-top: auto !important;
    padding-top: clamp(18px, 4vw, 36px) !important;
}

.home-hero__mini-finder .course-finder-hero {
    padding: 0 !important;
    background: transparent !important;
    color: var(--lse-structure-navy, #000032) !important;
    background-image: none !important;
    min-height: auto !important;
    height: auto !important;
    display: flex !important;
}

.home-hero__mini-finder .course-finder-hero > .wrap {
    display: flex !important;
    flex: 1 1 auto !important;
    padding: 0 !important;
}

.home-hero__mini-finder .course-finder-hero::before {
    display: none !important;
}

.home-hero__mini-finder .hero-content {
    margin: 0 !important;
    max-width: none !important;
    text-align: left !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

.home-hero__mini-finder .hero-title,
.home-hero__mini-finder .hero-subtitle,
.home-hero__mini-finder .hero-stats {
    display: none !important;
}

.home-hero__mini-finder {
    margin: 0 !important;
}

@media (max-width: 900px) {
    .home-hero__wrap {
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    .home-hero__col--visual {
        align-self: center !important;
    }
}

@media (max-width: 640px) {
    .home-hero {
        padding: 28px 0 40px !important;
    }

    .home-hero__col--visual img {
        max-width: 360px !important;
        border-radius: 16px !important;
        box-shadow: 0 16px 35px rgba(7, 21, 52, 0.18) !important;
    }
}

/* ============================================================================
   PHASE XVIII-F: HERO IMAGE-RIGHT VARIANT
   Full-bleed image flush to viewport right edge with CSS gradient overlay.
   Toggle: body.ukse-hero--image-right (via UKSE_HERO_V2 constant or ?hero=v2)
   Default: OFF (existing rounded hero remains)
   ============================================================================ */

/* Base variant container setup */
body.ukse-hero--image-right .home-hero {
    position: relative;
    overflow: hidden;
}

body.ukse-hero--image-right .home-hero__wrap {
    position: relative;
    z-index: 3;
}

/* Hide the original rounded visual column when variant is active */
body.ukse-hero--image-right .home-hero__col--visual {
    display: none !important;
}

/* Content column: constrain width so it never overlaps the image area */
body.ukse-hero--image-right .home-hero__col--content {
    position: relative;
    z-index: 3;
    max-width: 50% !important;
    flex: 0 0 50% !important;
}

/* Ensure finder stays within content column */
body.ukse-hero--image-right .home-hero__finder {
    max-width: 100%;
}

body.ukse-hero--image-right .home-hero__finder .quick-search-container {
    max-width: 100%;
}

/* Hero media element: full-bleed to viewport right edge */
/* Now a direct child of .home-hero (not inside .wrap), so right:0 = viewport edge */
body.ukse-hero--image-right .ukse-hero-media {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 50vw;
    z-index: 1;
    pointer-events: none;
}

/* White/cream overlay to desaturate image and improve finder form hierarchy */
body.ukse-hero--image-right .ukse-hero-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.22);
    pointer-events: none;
    z-index: 2;
}

body.ukse-hero--image-right .ukse-hero-media__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
    /* Alpha mask: completely hidden on left 15%, then fade in, fully visible by 60% */
    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        transparent 15%,
        rgba(0, 0, 0, 0.10) 25%,
        rgba(0, 0, 0, 0.30) 35%,
        rgba(0, 0, 0, 0.55) 45%,
        rgba(0, 0, 0, 0.80) 52%,
        black 60%,
        black 100%
    );
    mask-image: linear-gradient(
        90deg,
        transparent 0%,
        transparent 15%,
        rgba(0, 0, 0, 0.10) 25%,
        rgba(0, 0, 0, 0.30) 35%,
        rgba(0, 0, 0, 0.55) 45%,
        rgba(0, 0, 0, 0.80) 52%,
        black 60%,
        black 100%
    );
}

/* Tablet (max-width: 900px): Hide hero media, restore normal layout */
@media (max-width: 900px) {
    body.ukse-hero--image-right .home-hero__col--content {
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }

    body.ukse-hero--image-right .ukse-hero-media {
        display: none;
    }

    /* Restore the original rounded visual on tablet when variant is active */
    body.ukse-hero--image-right .home-hero__col--visual {
        display: flex !important;
    }
}

/* Mobile (max-width: 640px): Ensure hero media hidden, normal mobile layout */
@media (max-width: 640px) {
    body.ukse-hero--image-right .ukse-hero-media {
        display: none;
    }

    body.ukse-hero--image-right .home-hero__col--visual {
        display: flex !important;
    }

    body.ukse-hero--image-right .home-hero__col--content {
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }
}

/* END HERO IMAGE-RIGHT VARIANT */

.course-finder-wrapper,
.course-finder {
    background: rgba(255, 255, 255, 0.95) !important;
    padding: 30px !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1) !important;
}

.course-card-compact {
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
    transition: box-shadow 0.2s ease !important;
}

.home_content {
    padding: 60px 0 !important;
    background: #ffffff !important;
}

.section_latest_blog .blog_scroller {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    gap: 20px !important;
}

.section_latest_blog .blog_module {
    flex: 0 0 300px !important;
    min-width: 300px !important;
}

.grid.section_feature {
    display: none !important;
}

.partner-schools-carousel {
    display: block !important;
    padding: 20px 0 !important;
    background: #fff8f2 !important;
}

/* ==========================================================================
   Layout & Legacy Container Resets
   ========================================================================== */

body,
.container,
.main-container,
#main,
.content-wrapper {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 auto !important;
}

.banner_holder {
    display: none !important;
}

.course-finder-hero {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

.site_navigation.desk {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    overflow: visible !important;
    position: relative !important;
    float: none !important;
}

.site_navigation.desk .wrap {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

.home_content,
.main-content,
.content-area {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 20px !important;
    float: none !important;
    clear: both !important;
}

.section_testimonial {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 40px 20px !important;
    height: auto !important;
    overflow-x: hidden !important; /* Contain Splide clone slides */
    overflow-y: visible !important;
}

.section_latest_blog {
    position: relative !important;
    width: 100vw !important;
    max-width: none !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 40px 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    z-index: 1 !important;
}

.section_latest_blog h2.blog-title {
    max-width: 1200px !important;
    margin: 40px auto 40px auto !important;
    padding: 0 20px !important;
    text-align: center !important;
}

.section_latest_blog .blog_update {
    width: 100vw !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    overflow: hidden !important;
}

.section_latest_blog .blog_slide {
    background: #ffffff !important;
    margin: 0 15px !important;
    padding: 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 50, 0.1) !important;
    border: 1px solid rgba(0, 0, 50, 0.05) !important;
    min-height: 200px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    transition: all 0.3s ease !important;
    overflow: hidden !important;
}

.section_latest_blog .blog_slide__thumb {
    width: 100% !important;
    aspect-ratio: 16 / 8 !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}

.section_latest_blog .blog_slide__thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.35s ease !important;
}

.section_latest_blog .blog_slide:hover .blog_slide__thumb img {
    transform: scale(1.04) !important;
}

.section_latest_blog .blog_slide:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 50, 0.15) !important;
}

.section_latest_blog .blog_slide h3 {
    color: var(--lse-structure-navy) !important;
    font-size: 1.25rem !important;
    line-height: 1.35 !important;
    letter-spacing: var(--lse-heading-letter-spacing) !important;
    font-weight: 700 !important;
    text-align: left !important;
    margin: 0 0 12px !important;
    padding: 0 24px !important;
}

.section_latest_blog .blog_slide h3::after {
    display: none !important;
    content: none !important;
}

.section_latest_blog .blog_slide p {
    color: #495057 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
    padding: 0 24px !important;
    flex: 1 !important;
    text-align: left !important;
}

.section_latest_blog .blog_slide span {
    color: #EE7218 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 10px !important;
    display: block !important;
    padding: 0 24px !important;
}

.section_latest_blog .blog_slide span:first-of-type {
    padding-top: 20px !important;
}

/* When there's no thumbnail, add top padding to span */
.section_latest_blog .blog_slide > span:first-child {
    padding-top: 24px !important;
}

.section_latest_blog .blog_slide .blog-button {
    background: linear-gradient(135deg, #EE7218 0%, #c25a13 100%) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-align: center !important;
    transition: all 0.3s ease !important;
    border: 2px solid #EE7218 !important;
    display: inline-block !important;
    margin: auto 24px 24px !important;
}

.section_latest_blog .blog_slide .blog-button:hover {
    background: transparent !important;
    color: #EE7218 !important;
    transform: translateY(-2px) !important;
}

@media (max-width: 768px) {
    .section_latest_blog .blog_slide {
        margin: 0 10px !important;
        padding: 20px !important;
        min-height: 180px !important;
    }

    .section_latest_blog .blog_slide h3 {
        font-size: 1.25rem !important;
    }

    .section_latest_blog .blog_slide p {
        font-size: 13px !important;
    }
}

/* ==========================================================================
   Hero banner (parent style.css @1388 + responsive adjustments)
   ========================================================================== */

.footer-link,
.menu-sitemap a,
.footer-mega-menu a,
#footer_language_list ul li a {
    color: var(--lse-secondary-orange) !important;
    transition: color 0.2s ease;
}

.footer-link:hover,
.menu-sitemap a:hover,
.footer-mega-menu a:hover,
#footer_language_list ul li a:hover {
    color: var(--lse-tertiary-blue) !important;
}

.banner_holder {
    margin-top: -57px;
}

@media (max-width: 1199px) {
    .banner_holder {
        margin-top: -50px;
    }
}

@media (max-width: 979px) {
    .banner_holder {
        margin-top: -40px;
    }
}

@media (max-width: 768px) {
    .banner_holder {
        margin-top: 0;
    }
}

/* ==========================================================================
   Course Finder CTA button (align icon + text, prevent wraps)
   ========================================================================== */

.quick-search-form .search-input-group {
    flex: 1 1 calc(25% - 12px);
    min-width: 160px;
}

.search-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    justify-content: center;
    margin: 0 auto;
    padding-left: 28px !important;
    padding-right: 28px !important;
    flex: 0 0 auto;
    align-self: flex-end;
}

.search-cta-btn .search-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    color: currentColor;
}

.search-cta-btn .search-icon svg {
    width: 100%;
    height: 100%;
}

.search-cta-btn .search-label {
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

@media (max-width: 900px) {
    .quick-search-form .search-input-group {
        flex: 1 1 220px;
    }

    .search-cta-btn {
        margin-top: 16px;
    }
}

/* ==========================================================================
   Homepage blog slider (migrated from parent .section_latest_blog/.blog_update)
   ========================================================================== */

/* Footer blog Splide overrides */
.section_latest_blog {
    position: relative;
    padding: 40px 0;
}

.section_latest_blog h2 {
    margin: 0 auto 32px;
    text-align: center;
    font-size: 24px;
    letter-spacing: 1px;
    text-transform: uppercase;
    max-width: min(1200px, 95vw);
    padding: 0 20px;
}

.section_latest_blog .blog_update.splide {
    position: relative;
    width: min(1200px, 95vw);
    margin: 0 auto;
}

.section_latest_blog .blog_update .splide__track {
    padding: 8px 0 24px; /* top + bottom padding for card shadows */
    overflow: clip visible; /* horizontal clip, vertical visible for shadows */
}

.section_latest_blog .blog_update .splide__list {
    display: flex;
    align-items: stretch;
}

.section_latest_blog .blog_update .splide__slide {
    display: flex;
    justify-content: center;
    align-items: stretch;
    padding: 0;
    width: auto !important;
}

.section_latest_blog .blog_slide {
    width: 370px !important;
    max-width: 370px !important;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: #f5f8f9;
    border: 1px solid #f2f2f2;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 16px 30px rgba(0, 0, 50, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.section_latest_blog .blog_slide:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 40px rgba(0, 0, 50, 0.15);
}

.section_latest_blog .blog_slide span {
    display: block;
    margin-bottom: 18px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: #EE7218;
}

.section_latest_blog .blog_slide h3 {
    font-size: 24px;
    line-height: 1.35;
    margin: 0 0 18px;
    text-transform: none;
    color: #000032;
}

.section_latest_blog .blog_slide p {
    flex: 1 1 auto;
    margin: 0 0 20px;
    color: #495057;
}

.section_latest_blog .blog_slide .blog-button {
    align-self: flex-start;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.section_latest_blog .blog_update .splide__arrows {
    display: none;
}

.section_latest_blog .blog_update .splide__pagination {
    position: static;
    display: flex;
    justify-content: center;
    gap: 12px;
    margin: 28px auto 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
}

.section_latest_blog .blog_update .splide__pagination::-webkit-scrollbar {
    display: none;
}

.section_latest_blog .blog_update .splide__pagination__page {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(0, 0, 50, 0.15);
    transition: background 0.3s ease, transform 0.3s ease;
    flex-shrink: 0;
}

.section_latest_blog .blog_update .splide__pagination__page.is-active,
.section_latest_blog .blog_update .splide__pagination__page:hover,
.section_latest_blog .blog_update .splide__pagination__page:focus-visible {
    background: #E6007E;
    transform: scale(1.15);
}

@media (max-width: 1024px) {
    .section_latest_blog .blog_update.splide {
        width: min(1100px, 92vw);
    }

    .section_latest_blog .blog_slide {
        width: 320px !important;
        max-width: 320px !important;
        padding: 28px;
    }
}

@media (max-width: 768px) {
    .section_latest_blog {
        padding: 32px 0;
    }

    .section_latest_blog .blog_update.splide {
        width: min(640px, 92vw);
    }

    .section_latest_blog .blog_update .splide__slide {
        width: 100% !important;
    }

    .section_latest_blog .blog_slide {
        width: 100% !important;
        max-width: none !important;
        padding: 24px;
    }

    .section_latest_blog .blog_update .splide__pagination {
        display: none !important;
    }
}

/* ==========================================================================
   Featured partner schools carousel
   ========================================================================== */

.partner-schools-carousel {
    padding: 32px 0;
    margin: 0;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0, 0, 50, 0.08);
    background: #ffffff;
}

.partner-schools-carousel .wrap {
    width: min(95%, 1400px);
    margin: 0 auto;
    padding: 0 24px;
}

.school-card-afs {
    display: flex;
    flex-direction: column;
    width: min(320px, 100%);
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 50, 0.08);
    box-shadow: 0 4px 16px rgba(0, 0, 50, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    overflow: visible;
    position: relative;
    height: 550px;
    max-height: 550px;
    isolation: isolate;
}

.school-card-afs__overlay-link {
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
}

.school-card-afs__overlay-link:focus-visible {
    outline: 3px solid rgba(238, 114, 24, 0.65);
    outline-offset: 4px;
}

.school-card-afs:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 32px rgba(238, 114, 24, 0.15);
    border-color: rgba(238, 114, 24, 0.3);
}

.partner-schools-carousel__card {
    display: flex;
    flex-direction: column;
    min-height: 560px;
}

.partner-schools-carousel__media {
    flex: 0 0 auto;
}

.school-image-wrapper {
    position: relative;
    z-index: 2;
    aspect-ratio: 4/3;
    overflow: hidden;
}

.school-image-afs {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.school-card-afs:hover .school-image-afs {
    transform: scale(1.03);
}


.school-logo-overlay.partner-schools-carousel__logo-box {
    position: absolute;
    inset: auto 50% 18px 50%;
    transform: translate(-50%, 0);
}

.ukse-school-card__logo-box,
.partner-schools-carousel__logo-wrapper .ukse-school-card__logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0.5rem 1rem;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(9, 26, 63, 0.12);
    border: 1px solid rgba(9, 26, 63, 0.08);
    width: 100%;
    height: 72px;
    margin: 0 0 0.5rem;
}

.ukse-school-card__logo,
.school-logo.partner-schools-carousel__logo {
    max-width: 180px;
    width: auto;
    height: auto;
    max-height: 52px;
    display: block;
    margin: 0 auto;
    object-fit: contain;
    flex: 0 0 auto;
}

.no-schools-message {
    text-align: center;
    padding: 40px 20px;
    color: var(--lse-neutral-gray, #6c757d);
    font-size: 1.1rem;
}

.school-placeholder-image {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    color: var(--lse-structure-navy, #000032);
    text-align: center;
    border-radius: 8px;
    gap: 6px;
}

.school-placeholder-image i {
    font-size: 2.7rem;
    color: var(--lse-structure-navy, #000032);
}

.school-placeholder-image span {
    font-weight: 600;
    font-size: 1.1rem;
    max-width: 200px;
    line-height: 1.3;
}

.school-content-afs {
    display: flex;
    flex-direction: column;
    padding: 24px;
    gap: 16px;
    flex: 1 1 auto;
    position: relative;
    z-index: 2;
}

.school-title-afs {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    overflow: hidden;
    height: calc(1.3em * 2); /* Reserve exactly 2 lines so descriptions align across cards */
}

.school-description-afs {
    flex: 1 1 auto;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #475467;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    line-clamp: 4;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: calc(1.5em * 4);
}

.school-cta-section {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
}

.school-features,
.feature-badge {
    display: none !important;
}

.school-btn-afs {
    min-width: 120px;
    text-align: center;
    font-weight: 600;
    letter-spacing: 0.5px;
    position: relative;
    z-index: 3;
}

@media (max-width: 1024px) {
    .partner-schools-carousel {
        padding: 24px 0;
    }

    .school-card-afs {
        width: 280px;
    }
}

@media (max-width: 768px) {
    .school-placeholder-image {
        height: 150px;
    }

    .school-placeholder-image i {
        font-size: 2rem;
    }
}

@media (max-width: 640px) {
    .partner-schools-carousel .wrap {
        padding: 0 12px;
    }

    .school-card-afs {
        width: min(260px, 100%);
        height: 500px;
        max-height: 500px;
    }

    .school-content-afs {
        padding: 20px;
    }

    .school-logo-overlay,
    .partner-schools-carousel__logo-box {
        bottom: 12px !important;
        left: 12px !important;
        transform: translate(20px, 10px);
        height: 60px;
    }

    .school-logo-overlay img,
    .partner-schools-carousel__logo-box img,
    .partner-schools-carousel__logo {
        width: auto !important;
        max-width: 60px !important;
        max-height: 36px !important;
    }
}

.schools-carousel-slider .splide__track {
    padding: 8px 0 16px;
    overflow: clip visible; /* horizontal clip for slides, vertical visible for shadows */
}

.schools-carousel-slider .splide__list {
    display: flex;
    align-items: stretch;
}

.schools-carousel-slider .splide__slide {
    display: flex;
    justify-content: center;
    height: 100%;
}

.partner-schools-carousel__logo-wrapper {
    margin: 0.75rem 0 1.25rem;
    padding: 0 1.5rem;
    display: block;
}

.partner-schools-carousel__logo-wrapper .ukse-school-card__logo-box {
    width: 100%;
    justify-content: center;
}

.partner-schools-carousel__content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 0 1.5rem 1.5rem;
}

.partner-schools-carousel__text {
    flex: 1 1 auto;
}

.partner-schools-carousel__cta {
    flex: 0 0 auto;
    margin-top: 1.25rem;
}

.partner-schools-carousel__excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.partner-schools-carousel .splide__arrows,
.home-testimonials__carousel .splide__arrows,
.school-testimonials__carousel .splide__arrows {
    display: none;
}

.partner-schools-carousel .splide__pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin: 24px auto 0;
    padding: 0;
    position: static;
}

.partner-schools-carousel .splide__pagination__page {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(0, 0, 50, 0.15);
    transition: background 0.3s ease, transform 0.3s ease;
}

.partner-schools-carousel .splide__pagination__page.is-active,
.partner-schools-carousel .splide__pagination__page:focus-visible,
.partner-schools-carousel .splide__pagination__page:hover {
    background: #E6007E;
    transform: scale(1.15);
}

/* City pill overlay in featured schools carousel cards */
.partner-schools-carousel .ukse-featured-school-card__city-pill {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 2;
    background-color: rgba(155, 81, 224, 0.85);
    border-color: rgba(155, 81, 224, 1);
    color: #fff;
}

/* ==========================================================================
   Home school map
   ========================================================================== */

.home-school-map {
    padding: 32px 0 0;
    background: #ffffff;
}

.home-school-map__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}

.home-school-map__headline {
    max-width: 640px;
}

.home-school-map__headline h2 {
    margin-bottom: var(--lse-heading-h2-margin-bottom);
}

.home-school-map__headline p {
    font-size: 1rem;
    line-height: 1.6;
    color: #3a3a3a;
    margin: 0;
}

/* Legacy heading alignment – ensure emergency overrides match historic layout */
html body div.wrap h2,
html body .wrap h2,
html body h2.schools-carousel-title,
html body h2.testimonial_title,
html body h2.blog-title,
html body h2.content-title,
html body h2.results-title,
html body .section_latest_blog h2,
html body .section_testimonial h2,
html body .partner-schools-carousel h2,
html body .course-results-section h2,
html body div h2,
html body section h2,
html body article h2,
html body .content_middle h2,
html body #home_content h2 {
    font-family: var(--lse-heading-font-family) !important;
    font-size: var(--lse-heading-h2-size) !important;
    font-weight: var(--lse-heading-font-weight) !important;
    color: var(--lse-structure-navy) !important;
    text-align: center !important;
    margin: var(--lse-heading-h2-margin) !important;
    padding: 0 !important;
    position: relative !important;
    line-height: var(--lse-heading-line-height) !important;
    text-transform: none !important;
    letter-spacing: var(--lse-heading-letter-spacing) !important;
    background: none !important;
    border: none !important;
}

html body div.wrap h2::after,
html body .wrap h2::after,
html body h2.schools-carousel-title::after,
html body h2.testimonial_title::after,
html body h2.blog-title::after,
html body h2.content-title::after,
html body h2.results-title::after,
html body .section_latest_blog h2::after,
html body .section_testimonial h2::after,
html body .partner-schools-carousel h2::after,
html body .course-results-section h2::after,
html body div h2::after,
html body section h2::after,
html body article h2::after,
html body .content_middle h2::after,
html body #home_content h2::after {
    content: '' !important;
    display: block !important;
    width: var(--lse-heading-underline-width) !important;
    height: var(--lse-heading-underline-height) !important;
    background: var(--lse-primary-magenta) !important;
    margin: var(--lse-heading-underline-margin-top) auto 0 !important;
    border-radius: 2px !important;
}

.home-school-map__filters {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    background: #ffffff;
    border-radius: 18px;
    padding: 10px 18px;
    box-shadow: 0 18px 40px rgba(0, 0, 50, 0.08);
    border: 1px solid rgba(0, 0, 50, 0.08);
    min-width: 320px;
    align-self: flex-end;
    margin-top: clamp(48px, 8vw, 120px);
}

.home-school-map__filters label {
    font-weight: 600;
    color: #000032;
    font-size: 0.95rem;
    white-space: nowrap;
}

.home-school-map__filters select {
    appearance: none;
    border: 1px solid rgba(0, 0, 50, 0.12);
    border-radius: 14px;
    padding: 8px 36px 8px 14px;
    font-size: 0.95rem;
    font-weight: 600;
    color: #000032;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23000032' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center/12px 8px, #fff;
    min-width: 200px;
    margin-top: 0;
}

.home-school-map__viewport {
    position: relative;
    margin-top: 36px;
    min-height: 560px;
}

.home-school-map__canvas {
    width: 100%;
    min-height: 560px;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 45px 90px rgba(0, 0, 50, 0.18);
    position: relative;
    background: #e8eef4;
}

/* ── Skeleton loader (visible until Google Maps renders) ── */
.home-school-map__skeleton {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #e8eef4 0%, #d4e0ec 50%, #e8eef4 100%);
    border-radius: inherit;
    overflow: hidden;
    transition: opacity 0.4s ease;
}

.home-school-map__skeleton-shimmer {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%);
    background-size: 200% 100%;
    animation: ukse-map-shimmer 1.8s ease-in-out infinite;
}

@keyframes ukse-map-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.home-school-map__skeleton-pin {
    position: absolute;
    width: 18px;
    height: 24px;
    background: rgba(0, 0, 50, 0.12);
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
}

.home-school-map__skeleton-label {
    position: relative;
    z-index: 2;
    font-size: 0.9rem;
    font-weight: 500;
    color: rgba(0, 0, 50, 0.35);
    margin: 0;
    letter-spacing: 0.02em;
}

/* Hide skeleton once Google Maps has rendered (GM adds .gm-style child) */
.home-school-map__canvas:has(.gm-style) .home-school-map__skeleton {
    opacity: 0;
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .home-school-map__skeleton-shimmer { animation: none; }
}

/* Prevent Google Maps from cropping marker images with global max-width rules */
#lse-school-map-canvas .gm-style img {
    max-width: none;
}

.home-school-map__overlay,
.lse-school-map-overlay {
    position: absolute;
    top: 40px;
    left: 40px;
    width: 420px;
    max-width: calc(100% - 80px);
    /* Default: visible panel for /schools and Home school list mode */
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 24px 64px rgba(9, 26, 63, 0.22), 0 8px 20px rgba(9, 26, 63, 0.10);
    padding: 24px;
    height: auto;
    max-height: 580px;
    overflow: hidden;
    font-size: 0.95rem;
    line-height: 1.4;
    font-weight: 500;
    transform: translateX(-120%);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.22s ease, opacity 0.22s ease;
    z-index: 40;
}

/* Finder-lab: transparent container; shadow lives here (card shadow is clipped by parents) */
body.page-template-page-course-finder-lab .home-school-map__overlay {
    background: transparent;
    box-shadow: 0 6px 24px rgba(0, 0, 50, 0.32), 0 0 6px rgba(0, 0, 50, 0.10);
    border-radius: 24px;
    padding: 0;
    overflow: visible;
}

.home-school-map__overlay.is-active {
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
}

/* Close button: overlays the image */
.home-school-map__overlay-close {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 10;
    border: 1px solid rgba(9, 26, 63, 0.10);
    background: rgba(255, 255, 255, 0.85);
    width: 40px;
    height: 40px;
    border-radius: 999px;
    color: #000032;
    font-size: 1.25rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
    box-shadow: 0 10px 24px rgba(9, 26, 63, 0.10);
    outline: none;
}

.home-school-map__overlay-close:hover,
.home-school-map__overlay-close:focus {
    background: rgba(255, 255, 255, 0.95);
}

/* Hide X close button when showing school list (no school selected) */
.home-school-map__overlay:not(.has-school-detail) .home-school-map__overlay-close {
    display: none;
}

.home-school-map__overlay-inner {
    margin-top: 0;
    height: 100%;
    max-height: calc(580px - 48px); /* overlay max-height minus padding */
    overflow-y: auto;
    overflow-x: hidden;
}

/* Finder-lab: inner scrolls within card, not container */
body.page-template-page-course-finder-lab .home-school-map__overlay-inner {
    max-height: 100%;
}

.home-school-map__overlay--fullscreen {
    position: fixed !important;
    top: 24px !important;
    left: 24px !important;
    right: 24px !important;
    bottom: 24px !important;
    width: auto !important;
    max-width: 420px !important;
    margin: 0 auto !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.home-school-map__overlay--fullscreen .home-school-map__overlay-inner {
    max-height: calc(100vh - 190px) !important;
}

.home-school-map__overlay-empty {
    text-align: left;
}

.home-school-map__overlay-empty h3 {
    font-size: 1.4rem;
    margin-bottom: 10px;
    color: #000032;
}

.home-school-map__overlay-empty p {
    margin: 0;
    color: #525252;
    line-height: 1.6;
}

/* No-results empty state */
.home-school-map__overlay-empty--no-results {
    text-align: center;
    padding: 32px 20px;
}
.home-school-map__empty-icon {
    margin-bottom: 16px;
}
.home-school-map__empty-reset {
    margin-top: 16px;
}

.home-school-map__overlay-list {
    list-style: none;
    margin: 24px 0 0 0;
    padding: 0;
    display: grid;
    gap: 12px;
}

.home-school-map__overlay-list li {
    margin: 0;
    padding: 0;
}

.home-school-map__overlay-list-button {
    width: calc(100% - 10px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 50, 0.12);
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(0, 0, 50, 0.08);
    font-size: 0.95rem;
    font-weight: 600;
    color: #000032;
    text-align: left;
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    margin: 0 auto;
}

.home-school-map__overlay-list-button:hover,
.home-school-map__overlay-list-button:focus {
    transform: translateY(-2px);
    box-shadow: 0 16px 32px rgba(0, 0, 50, 0.12), 0 0 0 2px rgba(230, 0, 126, 0.35);
    border-color: rgba(230, 0, 126, 0.65);
    outline: none;
}

.home-school-map__overlay-list-title {
    flex: 1;
    margin-right: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.home-school-map__overlay-list-meta {
    font-size: 0.78rem;
    font-weight: 600;
    color: rgba(0, 0, 50, 0.65);
    background: rgba(106, 202, 243, 0.16);
    border-radius: 999px;
    padding: 4px 12px;
    white-space: nowrap;
}

/* Overlay card: no padding (content has its own) */
.home-school-map__overlay-card {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 24px;
    overflow: hidden;
    border-top: 6px solid var(--ukse-city-accent, #edf8fc);
    box-shadow: 0 24px 64px rgba(0, 0, 50, 0.22), 0 8px 20px rgba(0, 0, 50, 0.10);
}

/* Media: flush to card edges */
.home-school-map__overlay-media {
    overflow: hidden;
    background: #edf8fc;
}

.home-school-map__overlay-media img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

.home-school-map__overlay-media--logo {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 50, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
}

/* Logo pill: matches carousel spacing */
.home-school-map__overlay-logo-pill {
    margin: 12px 24px 20px 24px;
    padding: 8px 16px;
    height: 72px;
    background: #fff;
    border: 1px solid rgba(9, 26, 63, 0.08);
    border-radius: 999px;
    box-shadow: 0 12px 30px rgba(9, 26, 63, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-school-map__overlay-logo-pill img {
    max-height: 48px;
    max-width: 100%;
    width: auto;
    height: auto;
    display: block;
}

/* Content area: has its own padding */
.home-school-map__overlay-content {
    padding: 0 24px 24px 24px;
}

.home-school-map__overlay-content h3 {
    font-size: 1.6rem;
    margin: 0 0 8px 0;
    color: #000032;
}

.home-school-map__overlay-address {
    margin: 0 0 16px 0;
    font-weight: 600;
    color: #000032;
}

.home-school-map__overlay-city {
    margin: 0 0 16px 0;
}

.home-school-map__city-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: var(--ukse-city-accent, #edf8fc);
    color: #000032;
    margin-bottom: 8px;
}

.home-school-map__overlay-city p {
    margin: 0;
    color: #000032;
    font-size: 0.95rem;
}

.home-school-map__overlay-course-count {
    margin: 0 0 12px 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #E6007E;
}

.home-school-map__overlay-course-count-link {
    color: inherit;
    text-decoration: underline;
    text-decoration-color: rgba(230, 0, 126, 0.4);
    text-underline-offset: 2px;
    cursor: pointer;
}

.home-school-map__overlay-course-count-link:hover {
    text-decoration-color: rgba(230, 0, 126, 0.8);
}

.home-school-map__overlay-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.home-school-map__overlay-tags--secondary {
    margin-top: -4px;
}

.home-school-map__overlay-tags--services {
    margin-top: -4px;
}

.home-school-map__tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(106, 202, 243, 0.18);
    color: #000032;
    font-size: 0.82rem;
    font-weight: 600;
}

.home-school-map__tag--secondary {
    background: rgba(0, 0, 50, 0.08);
}

.home-school-map__tag--service {
    background: rgba(106, 202, 143, 0.18);
}

.home-school-map__overlay-description {
    color: #3a3a3a;
    line-height: 1.6;
}

/* Collapsible description on mobile */
.home-school-map__overlay-description[data-collapsible] .home-school-map__overlay-description-text {
    max-height: 4.8em; /* ~3 lines */
    overflow: hidden;
    transition: max-height 0.25s ease;
}
.home-school-map__overlay-description[data-collapsible].is-expanded .home-school-map__overlay-description-text {
    max-height: 40em;
}
.home-school-map__overlay-readmore {
    display: inline-block;
    margin-top: 4px;
    padding: 0;
    border: none;
    background: none;
    color: #6ACAF3;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
}
.home-school-map__overlay-readmore:hover { text-decoration: underline; }
@media (min-width: 1025px) {
    /* On desktop, don't collapse — show full description */
    .home-school-map__overlay-description[data-collapsible] .home-school-map__overlay-description-text { max-height: none; }
    .home-school-map__overlay-readmore { display: none; }
}

/* "+N more" tag badge */
.home-school-map__tag--more {
    background: rgba(0, 0, 50, 0.06);
    color: #666;
    font-weight: 500;
    font-size: 0.78rem;
}

/* Overlay actions: side-by-side compact row */
.home-school-map__overlay-actions {
    display: flex;
    gap: 10px;
    margin-top: 16px;
}

/* Overlay buttons: compact, flat, card-style */
.home-school-map__overlay-actions .home-button {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px !important;
    border-radius: 6px !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, transform 0.1s;
    box-shadow: none !important;
    background-image: none !important;
}

/* Primary: solid orange (matches "View Course" on cards) */
.home-school-map__overlay-actions .home-button--primary {
    background: #f26522 !important;
    color: #fff !important;
    border: 1px solid #f26522 !important;
}
.home-school-map__overlay-actions .home-button--primary:hover,
.home-school-map__overlay-actions .home-button--primary:focus {
    background: #d9551a !important;
    border-color: #d9551a !important;
    transform: translateY(-1px);
}

/* Secondary: light blue (matches "More details" toggle on cards) */
.home-school-map__overlay-actions .home-button--secondary {
    background: #e8f4fd !important;
    color: #1a365d !important;
    border: 1px solid #b3d7f5 !important;
}
.home-school-map__overlay-actions .home-button--secondary:hover,
.home-school-map__overlay-actions .home-button--secondary:focus {
    background: #d0e8fc !important;
    border-color: #7ec0f0 !important;
    transform: translateY(-1px);
}

/* "Back to results" button: hidden by default, shown only on mobile via media query overrides */
.home-school-map__overlay-close-bottom {
    display: none;
}

/* Increase top padding from 10px to 15px for 5px white space above logo */
/* Use .gm-style-iw.gm-style-iw-c (both classes, no space) for higher specificity */
.home-school-map__canvas .gm-style .gm-style-iw.gm-style-iw-c {
    padding: 15px 14px 10px 14px !important;
    align-items: center !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 48px rgba(0, 0, 50, 0.18) !important;
    border: 1px solid rgba(0, 0, 50, 0.08) !important;
    width: fit-content !important;
    position: relative !important;
    transform: translateX(-50%) !important;
}

/* Position arrow at BOTTOM of bubble pointing DOWN */
.home-school-map__canvas .gm-style .gm-style-iw-tc {
    top: auto !important;
    bottom: -12px !important;
    transform: translateX(-50%) !important;
}

/* Compact InfoWindow chrome: remove header band, let X float top-right */
.home-school-map__canvas .gm-style .gm-style-iw-chr {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    background: transparent !important;
    z-index: 5 !important;
}

/* Reset padding on inner content wrapper (child .gm-style-iw-c controls padding) */
.home-school-map__canvas .gm-style .gm-style-iw {
    padding: 0 !important;
}

.home-school-map__canvas .gm-style .gm-style-iw-d {
    color: #000032 !important;
    font-family: 'proxima-nova', 'Proxima Nova', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.home-school-map__canvas .gm-ui-hover-effect {
    background: #ffffff !important;
    border-radius: 50% !important;
    border: 1px solid rgba(0, 0, 50, 0.12) !important;
    box-shadow: none !important;
    width: 26px !important;
    height: 26px !important;
    top: 8px !important;
    right: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    position: absolute !important;
    outline: none !important;
}

.home-school-map__canvas .gm-ui-hover-effect svg,
.home-school-map__canvas .gm-ui-hover-effect span,
.home-school-map__canvas .gm-ui-hover-effect img,
.home-school-map__canvas .gm-ui-hover-effect::after {
    display: none !important;
}

.home-school-map__canvas .gm-ui-hover-effect::before {
    content: '×';
    display: block;
    font-size: 16px;
    line-height: 1;
    font-weight: 600;
    color: #000032;
}

.home-school-map__tooltip {
    font-weight: 700;
    color: #000032;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    font-size: 0.85rem;
}

/* Clickable tooltip link (pin popup → overlay) */
.home-school-map__tooltip-link {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.home-school-map__tooltip-link:hover {
    text-decoration: underline;
}

@media (max-width: 1024px) {
    .home-school-map__canvas {
        border-radius: 20px;
    }

    .home-school-map__overlay {
        left: 50%;
        top: auto;
        bottom: 32px;
        transform: translate(-50%, 140%);
        width: min(520px, calc(100% - 32px));
        padding: 20px; /* Restore padding for /schools list mode */
        height: auto;
        max-height: calc(100vh - 160px);
        overflow: hidden;
    }

    /* Finder-lab: no padding on tablet */
    body.page-template-page-course-finder-lab .home-school-map__overlay {
        padding: 0;
        overflow: visible;
    }

    .home-school-map__overlay.is-active {
        transform: translate(-50%, 0);
    }

    .home-school-map__overlay-inner {
        height: auto;
        max-height: calc(100vh - 220px);
    }
}

@media (max-width: 768px) {
    .home-school-map {
        padding: 56px 0 0;
    }

    .home-school-map__header {
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
    }

    .home-school-map__filters {
        border-radius: 16px;
        width: 100%;
        min-width: 0;
        margin-top: 24px;
        align-self: stretch;
    }

    .home-school-map__filters select {
        flex: 1;
        min-width: 0;
    }

    .home-school-map__canvas {
        min-height: 480px;
    }

    .home-school-map__overlay--fullscreen {
        left: 16px !important;
        right: 16px !important;
        top: 16px !important;
        max-width: none !important;
    }
}

@media (max-width: 540px) {
    .home-school-map__headline h2 {
        font-size: 2rem;
    }

    .home-school-map__filters {
        width: 100%;
        justify-content: space-between;
        margin-top: 20px;
    }

    .home-school-map__filters select {
        flex: 1;
    }

    .home-school-map__overlay {
        position: fixed;
        left: 16px;
        right: 16px;
        bottom: 16px;
        top: auto;
        width: auto;
        max-width: none;
        padding: 16px; /* Restore padding for /schools list mode on mobile */
        height: auto;
        max-height: calc(100vh - 160px);
        transform: translateY(140%);
        border-radius: 20px;
        opacity: 0;
        pointer-events: none;
        transition: transform 0.3s ease, opacity 0.3s ease;
    }

    /* Finder-lab: no padding on mobile */
    body.page-template-page-course-finder-lab .home-school-map__overlay {
        padding: 0;
    }

    .home-school-map__overlay.is-active {
        transform: translateY(0);
        opacity: 1;
        pointer-events: auto;
    }

    .home-school-map__overlay-inner {
        display: block;
        max-height: calc(100vh - 220px);
        overflow-y: auto;
    }

    .home-school-map__overlay-media img {
        height: 180px;
    }
}

/* ==========================================================================
   FAQ Template
   ========================================================================== */

.faq-page .article-header {
    margin-bottom: 32px;
}

.faq-page__intro {
    margin-bottom: 32px;
    font-size: 1.05rem;
}

.faq-page__accordion {
    display: grid;
    gap: 16px;
}

.faq-item {
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 12px 40px rgba(0, 0, 50, 0.06);
    padding: 0;
    overflow: hidden;
}

.faq-item__trigger {
    margin: 0;
    padding: 20px 24px;
    font-size: 1.05rem;
    font-weight: 600;
    position: relative;
    cursor: pointer;
}

.faq-item__trigger::after {
    content: '+';
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.2rem;
    color: rgba(0, 0, 50, 0.4);
    transition: transform 0.2s ease;
}

.faq-item__trigger.active::after {
    transform: translateY(-50%) rotate(45deg);
}

.faq-item__content {
    display: none;
    padding: 0 24px 24px;
    font-size: 0.95rem;
    color: rgba(0, 0, 50, 0.75);
}

.faq-item__trigger.active + .faq-item__content {
    display: block;
}

/* ==========================================================================
   Forms Template
   ========================================================================== */

.forms-page__grid {
    display: grid;
    gap: 32px;
}

.forms-page__copy {
    background: #ffffff;
    border-radius: 20px;
    padding: 32px;
    box-shadow: 0 24px 60px rgba(0, 0, 50, 0.08);
}

.forms-page__form .forms-page__card {
    background: linear-gradient(135deg, rgba(230, 0, 126, 0.08), rgba(106, 202, 243, 0.08));
    border-radius: 20px;
    padding: 32px;
    box-shadow: 0 18px 36px rgba(0, 0, 50, 0.12);
}

.forms-page__form form {
    display: grid;
    gap: 18px;
}

.forms-page__testimonials {
    margin-top: 48px;
}

@media (min-width: 900px) {
    .forms-page__grid {
        grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
        align-items: start;
    }
}

/* ==========================================================================
   Internal Template
   ========================================================================== */

.internal-page .rates-section {
    margin-top: 40px;
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 20px 50px rgba(0, 0, 50, 0.08);
    padding: 32px;
}

.internal-page .rates-left-content {
    max-width: 640px;
}

.internal-page .rates-right-content {
    border-left: 1px solid rgba(0, 0, 50, 0.08);
    padding-left: 32px;
}

.internal-page__testimonials {
    margin-top: 48px;
}

@media (max-width: 900px) {
    .internal-page .rates-section {
        display: block;
    }

    .internal-page .rates-right-content {
        border-left: none;
        padding-left: 0;
        margin-top: 24px;
    }
}

/* ==========================================================================
   Blog shared components (meta chips, sidebar cards)
   Used by both blog-single and blog-archive templates
   ========================================================================== */

.blog-single__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 16px;
}

.meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(0, 0, 50, 0.06);
    font-size: 0.85rem;
    color: rgba(0, 0, 50, 0.75);
}

.meta-chip:link,
.meta-chip:visited {
    color: rgba(0, 0, 50, 0.75) !important;
}

.meta-chip:hover,
.meta-chip:focus-visible {
    background: rgba(230, 0, 126, 0.12);
}

.meta-chip svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
}

.blog-sidebar-card {
    background: #ffffff;
    border-radius: 14px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(9, 26, 63, 0.06), 0 8px 24px rgba(9, 26, 63, 0.04);
    border: 1px solid rgba(9, 26, 63, 0.06);
}

.blog-sidebar-card .search-form {
    display: flex;
    gap: 12px;
}

.blog-sidebar-card .search-field {
    flex: 1;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 50, 0.12);
    padding: 10px 18px;
    font-size: 0.95rem;
}

.blog-sidebar-card .search-submit {
    border-radius: 999px;
    background: #E6007E;
    color: #ffffff;
    padding: 10px 20px;
    font-weight: 600;
    border: none;
}

.blog-sidebar-card h2,
html body div .blog-sidebar-card h2,
html body section .blog-sidebar-card h2,
html body article .blog-sidebar-card h2,
html body .blog-single__sidebar .blog-sidebar-card h2,
html body .blog-archive .blog-sidebar-card h2 {
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    text-align: left !important;
    color: #091a3f !important;
    letter-spacing: 0 !important;
    line-height: 1.4 !important;
    position: static !important;
    border: none !important;
    background: none !important;
}

html body .blog-sidebar-card h2::after,
html body div .blog-sidebar-card h2::after,
html body section .blog-sidebar-card h2::after,
html body article .blog-sidebar-card h2::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
}

.blog-sidebar-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 12px;
}

.blog-sidebar-list__title {
    display: block;
    font-weight: 600;
}

.blog-sidebar-list__date {
    display: block;
    font-size: 0.8rem;
    color: rgba(0, 0, 50, 0.6);
}

.blog-sidebar-card--cta {
    text-align: center;
    background: linear-gradient(145deg, #fdf4ed 0%, #f4edf8 100%);
    border-color: rgba(230, 0, 126, 0.1);
}

.blog-sidebar-card--cta p {
    color: #4d5a75;
    font-size: 0.92rem;
    line-height: 1.55;
}

.blog-sidebar-list a,
.blog-sidebar-list a:link,
.blog-sidebar-list a:visited {
    text-decoration: none !important;
    color: #091a3f !important;
    display: block;
    padding: 6px 0;
    border-radius: 6px;
    transition: color 0.15s ease;
}

.blog-sidebar-list a:hover,
.blog-sidebar-list a:focus {
    color: #E6007E !important;
}

.blog-sidebar-list li:not(:last-child) {
    border-bottom: 1px solid rgba(9, 26, 63, 0.06);
    padding-bottom: 12px;
}

.blog-sidebar-card--cta .home-button {
    margin-top: 12px;
}

.blog-single__testimonials {
    margin: 64px 0 0;
}

/* ==========================================================================
   Blog archive
   ========================================================================== */

.blog-archive {
    background: #f9fbfd;
}

.blog-archive__hero {
    background: linear-gradient(160deg, #091a3f 0%, #0d2d6b 55%, #1a4a8a 100%);
    color: #ffffff;
    padding: 80px 0 64px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.blog-archive__hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 600px 400px at 20% 80%, rgba(230, 0, 126, 0.12), transparent),
        radial-gradient(ellipse 500px 350px at 80% 20%, rgba(106, 202, 243, 0.15), transparent);
    pointer-events: none;
}

.blog-archive__hero .wrap {
    position: relative;
    z-index: 1;
}

.blog-archive__title {
    font-size: clamp(2.25rem, 4.5vw, 3.25rem) !important;
    margin: 0 0 16px !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    color: #ffffff !important;
    text-align: center !important;
}

.blog-archive__title::after {
    display: none !important;
}

.blog-archive__intro,
.blog-archive__intro-text {
    max-width: 560px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1.1rem;
    line-height: 1.6;
}

.blog-archive__layout {
    display: grid;
    gap: 48px;
    padding: 56px 0 72px;
}

.blog-archive__grid {
    display: grid;
    gap: 28px;
}

/* ── Card ────────────────────────────────────────────────── */

.blog-card {
    display: grid;
    grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(9, 26, 63, 0.06), 0 8px 24px rgba(9, 26, 63, 0.04);
    border: 1px solid rgba(9, 26, 63, 0.06);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.blog-card:hover {
    box-shadow: 0 4px 12px rgba(9, 26, 63, 0.08), 0 16px 40px rgba(9, 26, 63, 0.1);
    transform: translateY(-2px);
}

.blog-card__media {
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
}

.blog-card__media img,
.blog-card__placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.35s ease;
}

.blog-card:hover .blog-card__media img {
    transform: scale(1.04);
}

.blog-card__placeholder {
    background: linear-gradient(135deg, #f0f4f8 0%, #e8ecf2 100%);
}

.blog-card__body {
    padding: 28px 32px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.blog-card__meta {
    display: flex;
    gap: 16px;
    font-size: 0.82rem;
    color: #6b7a94;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 500;
}

.blog-card__meta span:not(:last-child)::after {
    content: '\00B7';
    margin-left: 16px;
    color: #c0c8d4;
}

h2.blog-card__title,
.blog-card h2.blog-card__title {
    margin: 0 !important;
    font-size: 1.3rem !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    color: #091a3f !important;
    text-align: left !important;
    position: relative !important;
    padding: 0 !important;
}

h2.blog-card__title::after,
.blog-card h2.blog-card__title::after,
html body div h2.blog-card__title::after,
html body article h2.blog-card__title::after {
    display: none !important;
    content: none !important;
}

.blog-card__title a,
.blog-card__title a:link,
.blog-card__title a:visited {
    color: #091a3f !important;
    text-decoration: none !important;
}

.blog-card__title a:hover,
.blog-card__title a:focus {
    color: #E6007E !important;
}

.blog-card__excerpt {
    color: #4d5a75;
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-card__link,
.blog-card__link:link,
.blog-card__link:visited {
    font-weight: 600;
    font-size: 0.9rem;
    color: #E6007E !important;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    transition: gap 0.2s ease;
}

.blog-card__link::after {
    content: '\2192';
    transition: transform 0.2s ease;
}

.blog-card__link:hover::after {
    transform: translateX(3px);
}

/* ── Sidebar ─────────────────────────────────────────────── */

.blog-archive__sidebar {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ── Pagination ──────────────────────────────────────────── */

.blog-archive__pagination {
    margin-top: 48px;
    text-align: center;
}

.blog-archive__pagination .nav-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
}

.blog-archive__pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 4px;
    border-radius: 10px;
    background: #ffffff;
    color: #4d5a75;
    font-weight: 600;
    font-size: 0.9rem;
    border: 1px solid rgba(9, 26, 63, 0.08);
    transition: background 0.15s ease, color 0.15s ease;
    text-decoration: none;
}

.blog-archive__pagination .page-numbers:hover {
    background: #091a3f;
    color: #ffffff;
    border-color: #091a3f;
}

.blog-archive__pagination .page-numbers.current {
    background: #E6007E;
    color: #ffffff;
    border-color: #E6007E;
}

.blog-archive__pagination .page-numbers.prev,
.blog-archive__pagination .page-numbers.next {
    padding: 0 16px;
    font-size: 0.85rem;
    letter-spacing: 0.02em;
}

.blog-archive__empty {
    background: #ffffff;
    border-radius: 16px;
    padding: 56px;
    text-align: center;
    box-shadow: 0 1px 3px rgba(9, 26, 63, 0.06);
    border: 1px solid rgba(9, 26, 63, 0.06);
    color: #4d5a75;
}

/* ── Responsive ──────────────────────────────────────────── */

@media (max-width: 1024px) {
    .blog-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .blog-card__media {
        aspect-ratio: 16 / 9;
    }
}

@media (min-width: 960px) {
    .blog-archive__layout {
        grid-template-columns: minmax(0, 3fr) minmax(0, 1.2fr);
        align-items: start;
    }

    .blog-archive__sidebar {
        position: sticky;
        top: 24px;
    }
}

/* ==========================================================================
   Course single
   ========================================================================== */

.course-hero {
    position: relative;
    background-size: cover;
    background-position: center;
    color: #ffffff;
    padding: 60px 0 48px;
}
.course-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0, 0, 50, 0.88), rgba(230, 0, 126, 0.45));
    z-index: 0;
}
.course-hero > * {
    position: relative;
    z-index: 1;
}

.course-hero__inner {
    display: grid;
    gap: 32px;
    align-items: stretch;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
}


/* Hero school section (text-only, no avatar) */
.course-hero__school {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: #ffffff;
}

.course-hero__school-label {
    text-transform: uppercase;
    font-size: 0.75rem;
    opacity: 0.85;
    letter-spacing: 0.08em;
    color: rgba(255, 255, 255, 0.8);
}

.course-hero__school-name {
    color: #ffffff;
    font-weight: 600;
    text-decoration: none;
}

.course-hero__school-name:hover,
.course-hero__school-name:focus-visible {
    color: #6ACAF3 !important;
    text-decoration: underline;
}

.course-hero__title {
    font-size: clamp(2.2rem, 5vw, 3.2rem);
    margin: 0;
    color: #ffffff;
}

.course-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem; /* Match course card taxonomy chip spacing */
}

.course-chip {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.22);
    color: #ffffff;
    font-size: 0.85rem;
    letter-spacing: 0.02em;
}

.course-chip--muted {
    background: rgba(255, 255, 255, 0.12);
}

.course-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.course-hero__content {
    display: grid;
    gap: 20px;
}

.course-hero__visual {
    justify-self: end;
    max-width: 320px;
    max-height: 280px;
    display: flex;
    align-items: center;
}

.course-hero__visual img {
    width: auto;
    height: 100%;
    max-height: 100%;
    display: block;
    filter: drop-shadow(0 24px 60px rgba(0, 0, 50, 0.35));
}
.course-hero__secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 24px;
    border-radius: 999px;
    font-weight: 600;
    color: #ffffff;
    border: 2px solid rgba(255, 255, 255, 0.4);
}

.course-hero__secondary:hover,
.course-hero__secondary:focus-visible {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.7);
}

.course-single__body {
    display: grid;
    gap: 40px;
    padding: 56px 0;
}

.course-highlights {
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 50, 0.08);
    padding: 32px;
}

.course-highlights__grid {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.course-highlights__label {
    display: block;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    color: rgba(0, 0, 50, 0.55);
    margin-bottom: 6px;
}

.course-highlights__value {
    font-weight: 600;
    font-size: 1.1rem;
    color: #000032;
}

.course-section {
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 50, 0.08);
    padding: 40px;
}

.course-section__title {
    font-size: 1.6rem;
    margin-bottom: 20px;
}

.course-section__content {
    margin-bottom: 24px;
}

.course-section__lead {
    max-width: 520px;
    color: rgba(0, 0, 50, 0.75);
}

.course-section__notice {
    background: rgba(230, 0, 126, 0.08);
    border-radius: 16px;
    padding: 24px;
    display: grid;
    gap: 16px;
}

.course-levels {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.course-levels__item {
    display: flex;
    flex-direction: column;
    padding: 16px 20px;
    border-radius: 16px;
    background: rgba(0, 0, 50, 0.03);
}

.course-levels__label {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: rgba(0, 0, 50, 0.6);
}

.course-levels__value {
    font-weight: 600;
}

.course-pricing__table {
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 50, 0.08);
}

.course-pricing__row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    padding: 18px 24px;
    background: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 50, 0.06);
    font-size: 0.95rem;
}

.course-pricing__row--header {
    background: rgba(0, 0, 50, 0.05);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
}

.course-pricing__align-right {
    text-align: right;
}

.course-schedule__details {
    display: grid;
    gap: 16px;
    margin-top: 24px;
}

.course-schedule__item {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid rgba(0, 0, 50, 0.08);
    padding-bottom: 12px;
}

.course-schedule__label {
    font-weight: 600;
    color: rgba(0, 0, 50, 0.7);
}

.course-dates {
    display: grid;
    gap: 16px;
}

.course-dates__item {
    padding: 20px 24px;
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-radius: 16px;
    display: grid;
    gap: 8px;
    background: rgba(0, 0, 50, 0.02);
}

.course-dates__date {
    font-weight: 600;
}

.course-dates__spaces {
    font-size: 0.9rem;
    color: rgba(0, 0, 50, 0.6);
}

.course-dates__spaces.is-full {
    color: #E6007E;
    font-weight: 600;
}

.course-cta-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 20px;
}

.course-materials {
    list-style: disc inside;
    color: rgba(0, 0, 50, 0.75);
    display: grid;
    gap: 8px;
}

.course-related__grid {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.course-related__card {
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 18px 40px rgba(0, 0, 50, 0.08);
    background: #ffffff;
}

.course-related__chip {
    display: inline-block;
    margin: 8px 0 12px;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(230, 0, 126, 0.1);
    color: #E6007E;
    font-size: 0.8rem;
}

.course-related__meta {
    display: flex;
    gap: 12px;
    color: rgba(0, 0, 50, 0.6);
    font-size: 0.9rem;
    margin-bottom: 12px;
}

.course-testimonials {
    margin: -16px 0 80px;
}

@media (max-width: 960px) {
    .course-hero {
        padding: 64px 0 48px;
    }

    .course-hero__inner {
        grid-template-columns: minmax(0, 1fr);
        text-align: left;
    }

    .course-hero__visual {
        justify-self: center;
        max-width: 220px;
        max-height: 220px;
    }

    .course-hero__visual img {
        width: auto;
        height: 100%;
        max-height: 100%;
    }

    .course-section {
        padding: 28px;
    }

    .course-pricing__row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-flow: dense;
    }

    .course-pricing__row span:nth-child(odd) {
        font-weight: 600;
    }
}

/* ==========================================================================
   Course archive
   ========================================================================== */

.course-archive__hero {
    background: linear-gradient(135deg, rgba(0, 0, 50, 0.92), rgba(106, 202, 243, 0.3));
    color: #ffffff;
    text-align: center;
    padding: 72px 0 56px;
}

.course-archive__title {
    font-size: clamp(2.2rem, 5vw, 3.1rem);
    margin-bottom: 12px;
}

.course-archive__intro {
    max-width: 620px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.85);
}

.course-archive__layout {
    display: grid;
    gap: 40px;
    padding: 56px 0;
}

.course-archive__grid {
    display: grid;
    gap: 28px;
}

.course-card {
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 50, 0.08);
    padding: 28px 32px;
    display: grid;
    gap: 18px;
}

.course-card__title {
    margin: 0;
    font-size: 1.5rem;
}

.course-card__school {
    font-size: 0.95rem;
    color: rgba(0, 0, 50, 0.65);
    margin: -12px 0 4px;
}

.course-card__excerpt {
    color: rgba(0, 0, 50, 0.72);
}

.course-card__facts {
    display: grid;
    gap: 10px;
    margin: 0;
}

.course-card__facts dt {
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(0, 0, 50, 0.55);
}

.course-card__facts dd {
    margin: 0;
    font-weight: 600;
}

.course-archive__pagination {
    margin-top: 40px;
}

.course-archive__pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-right: 6px;
    border-radius: 50%;
    background: rgba(0, 0, 50, 0.06);
    font-weight: 600;
}

.course-archive__pagination .page-numbers.current {
    background: #E6007E;
    color: #ffffff;
}

.course-archive__sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.course-sidebar-card {
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 18px 45px rgba(0, 0, 50, 0.1);
    padding: 24px;
}

.course-sidebar-card--cta {
    background: linear-gradient(135deg, rgba(238, 114, 24, 0.1), rgba(0, 0, 50, 0.08));
    text-align: center;
}

.course-sidebar-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}

.course-archive__empty {
    background: #ffffff;
    padding: 48px;
    text-align: center;
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 50, 0.08);
}

@media (min-width: 960px) {
    .course-archive__layout {
        grid-template-columns: minmax(0, 3fr) minmax(0, 1.1fr);
        align-items: start;
    }
}

/* ==========================================================================
   Course results cards
   ========================================================================== */

.course-results-container,
.results-grid,
.course-listings {
    background: #ffffff;
    padding: 40px 20px;
    margin: 20px 0;
    border-radius: 12px;
}

/* .search-results scoped to containers only — WP adds this class to <body> on search pages */
:not(body).search-results {
    background: #ffffff;
    padding: 40px 20px;
    margin: 20px 0;
    border-radius: 12px;
}

.course-results-section.is-hidden {
    display: none;
}

.course-results-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
    margin: 30px 0;
}

.course-result-card,
.course-item,
.course-listing-item {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 50, 0.08);
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid rgba(0, 0, 50, 0.05);
    height: auto;
    display: flex;
    flex-direction: column;
}

.course-result-card:hover,
.course-item:hover,
.course-listing-item:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(238, 114, 24, 0.12);
    border-color: rgba(238, 114, 24, 0.2);
}

.course-result-image {
    position: relative;
    height: 200px;
    overflow: hidden;
    background: #ffffff;
}

.course-result-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.course-result-card:hover .course-result-image img {
    transform: scale(1.03);
}

.course-result-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: linear-gradient(135deg, #E6007E 0%, #EE7218 100%);
    color: #ffffff;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(230, 0, 126, 0.3);
    z-index: 2;
}

.course-result-badge.featured {
    background: linear-gradient(135deg, #000032 0%, #333366 100%);
}

.course-result-badge.special {
    background: linear-gradient(135deg, #6ACAF3 0%, #4fb3d9 100%);
    animation: pulse 2s infinite;
}

.course-result-content {
    padding: 25px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.course-school-name {
    font-size: 1.4rem;
    font-weight: 700;
    color: #000032;
    margin: 0 0 8px 0;
    line-height: 1.3;
}

.course-location {
    color: #666666;
    font-size: 14px;
    margin: 0 0 12px 0;
    display: flex;
    align-items: center;
}

.course-location::before {
    content: "📍";
    margin-right: 6px;
}

.course-type-tag {
    background: rgba(106, 202, 243, 0.1);
    color: #6ACAF3;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    display: inline-block;
    margin-bottom: 15px;
    border: 1px solid #6ACAF3;
}

.course-description {
    color: #666666;
    font-size: 14px;
    line-height: 1.6;
    margin: 0 0 20px 0;
    flex: 1;
}

.course-price-section {
    background: rgba(230, 0, 126, 0.05);
    border-radius: 8px;
    padding: 15px;
    margin: 15px 0 20px 0;
    border: 1px solid rgba(230, 0, 126, 0.1);
}

.course-price {
    font-size: 1.8rem;
    font-weight: 700;
    color: #E6007E;
    margin: 0;
    display: block;
}

.course-duration {
    font-size: 14px;
    color: #666666;
    margin: 5px 0 0 0;
}

.course-features-list {
    list-style: none;
    padding: 0;
    margin: 15px 0;
}

.course-features-list li {
    padding: 4px 0;
    font-size: 14px;
    color: #000032;
    position: relative;
    padding-left: 20px;
}

.course-features-list li::before {
    content: "✓";
    color: #EE7218;
    font-weight: 700;
    position: absolute;
    left: 0;
    top: 4px;
}

.course-result-actions {
    display: flex;
    gap: 12px;
    margin-top: auto;
}

.course-btn-primary {
    flex: 1;
    background: linear-gradient(135deg, #E6007E 0%, #ff1a94 100%);
    color: #ffffff;
    text-decoration: none;
    padding: 14px 20px;
    border-radius: 8px;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(230, 0, 126, 0.25);
    border: none;
    cursor: pointer;
}

.course-btn-primary:hover {
    background: linear-gradient(135deg, #EE7218 0%, #ff8534 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(238, 114, 24, 0.3);
    color: #ffffff;
}

.course-btn-secondary {
    background: transparent;
    color: #EE7218;
    border: 2px solid #EE7218;
    padding: 12px 16px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    transition: all 0.3s ease;
    text-align: center;
    min-width: 100px;
}

.course-btn-secondary:hover {
    background: #EE7218;
    color: #ffffff;
    transform: translateY(-1px);
}

.course-results-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px 0;
    border-bottom: 2px solid rgba(238, 114, 24, 0.1);
}

.results-count {
    font-size: 1.2rem;
    font-weight: 600;
    color: #000032;
}

.view-toggles {
    display: flex;
    gap: 10px;
}

.view-toggle-btn {
    padding: 8px 16px;
    border: 2px solid #EE7218;
    background: transparent;
    color: #EE7218;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.3s ease;
}

.view-toggle-btn.active,
.view-toggle-btn:hover {
    background: #EE7218;
    color: #ffffff;
}

.course-results-grid.list-view {
    grid-template-columns: 1fr;
}

.course-results-grid.list-view .course-result-card {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    height: 250px;
}

.course-results-grid.list-view .course-result-image {
    width: 300px;
    flex-shrink: 0;
    height: auto;
}

.course-results-grid.list-view .course-result-content {
    padding: 25px 30px;
}

@media (max-width: 768px) {
    .course-results-container {
        padding: 20px 15px;
        margin: 15px 0;
    }

    .course-results-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .course-result-card {
        margin: 0;
    }

    .course-result-content {
        padding: 20px;
    }

    .course-school-name {
        font-size: 1.2rem;
    }

    .course-price {
        font-size: 1.5rem;
    }

    .course-result-actions {
        flex-direction: column;
    }

    .course-btn-primary,
    .course-btn-secondary {
        min-height: 44px;
        font-size: 16px;
    }

    .course-results-header {
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }

    .view-toggles {
        justify-content: center;
    }

    .course-results-grid.list-view {
        grid-template-columns: 1fr;
    }

    .course-results-grid.list-view .course-result-card {
        flex-direction: column;
        height: auto;
    }

    .course-results-grid.list-view .course-result-image {
        width: 100%;
        height: 200px;
    }
}

/* ==========================================================================
   UKSE Container & Rhythm Utilities (Jan 2026)
   - Opt-in: no impact until classes are applied
   - .ukse-container: max-width centered container
   - .ukse-container--narrow: narrower variant (800px, for blog)
   - .ukse-section: vertical section rhythm (responsive padding-block)
   - .ukse-stack: vertical stack with gap modifiers
   ========================================================================== */

.ukse-container {
    max-width: var(--lse-grid-max-width, 1200px);
    margin-inline: auto;
    padding-inline: var(--lse-grid-gutter, 24px);
}

.ukse-container--narrow {
    max-width: 800px;
}

.ukse-section {
    padding-block: clamp(2rem, 5vw, 4rem);
}

.ukse-section--sm {
    padding-block: clamp(1rem, 3vw, 2rem);
}

.ukse-section--lg {
    padding-block: clamp(3rem, 8vw, 6rem);
}

.ukse-stack {
    display: grid;
    gap: var(--ukse-stack-gap, 1rem);
}

.ukse-stack--sm { --ukse-stack-gap: 0.5rem; }
.ukse-stack--md { --ukse-stack-gap: 1.5rem; }
.ukse-stack--lg { --ukse-stack-gap: 2rem; }
.ukse-stack--xl { --ukse-stack-gap: 3rem; }

/* ==========================================================================
   UKSE UI Components — Card Shell (Jan 2026)
   - Opt-in: apply via data-ukse-card attribute
   - Variants: hero (accent bar), hero-soft (subtle bar for grids),
               hero-soft-secondary (no-magenta bar), flush, tight
   ========================================================================== */

[data-ukse-card] {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    padding: 1.5rem;
    overflow: hidden;
}

/* Hero variant: contact-style card with gradient accent bar */
[data-ukse-card][data-ukse-card-variant~="hero"] {
    position: relative;
    background: #ffffff;
    border-radius: 28px;
    padding: 32px 36px;
    box-shadow: 0 32px 80px rgba(0, 0, 50, 0.12);
    border: 1px solid rgba(0, 0, 50, 0.04);
    overflow: hidden;
}

/* Gradient accent bar (orange → magenta → light blue) */
[data-ukse-card][data-ukse-card-variant~="hero"]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: linear-gradient(90deg, #EE7218 0%, #E6007E 50%, #6ACAF3 100%);
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

/* Hero-soft variant: subtler for repeated grid cards */
[data-ukse-card][data-ukse-card-variant~="hero-soft"] {
    position: relative;
    background: #ffffff;
    border-radius: 20px;
    padding: 24px 28px;
    box-shadow: 0 12px 40px rgba(0, 0, 50, 0.08);
    border: 1px solid rgba(0, 0, 50, 0.06);
    overflow: hidden;
}

[data-ukse-card][data-ukse-card-variant~="hero-soft"]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #EE7218 0%, #E6007E 50%, #6ACAF3 100%);
    opacity: 0.7;
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

/* Hero-soft-secondary: muted brand gradient (navy → magenta → light blue) */
[data-ukse-card][data-ukse-card-variant~="hero-soft-secondary"] {
    position: relative;
    background: #ffffff;
    border-radius: 20px;
    padding: 24px 28px;
    box-shadow: 0 12px 40px rgba(0, 0, 50, 0.08);
    border: 1px solid rgba(0, 0, 50, 0.06);
    overflow: hidden;
}

[data-ukse-card][data-ukse-card-variant~="hero-soft-secondary"]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, rgba(0, 0, 50, 1) 0%, rgba(230, 0, 126, 1) 50%, rgba(106, 202, 243, 1) 100%);
    opacity: 0.4;
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

/* Accent-bar-only: adds gradient bar without overriding existing card styles
   Use --ukse-accent-bar to set a solid color instead of the default gradient */
[data-ukse-card][data-ukse-card-variant~="accent-bar-only"] {
    position: relative;
    overflow: hidden;
}

[data-ukse-card][data-ukse-card-variant~="accent-bar-only"]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--ukse-accent-bar, linear-gradient(90deg, rgba(0, 0, 50, 1) 0%, rgba(230, 0, 126, 1) 50%, rgba(106, 202, 243, 1) 100%));
    opacity: var(--ukse-accent-bar-opacity, 0.4);
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

[data-ukse-card][data-ukse-card-variant~="flush"] {
    padding: 0;
}

[data-ukse-card][data-ukse-card-variant~="tight"] {
    padding: 1rem;
}

/* ==========================================================================
   Canonical CTA System (Phase 1)
   Base: .ukse-btn
   Variants: --primary, --secondary, --tertiary, --compact
   ========================================================================== */

/* Base button reset and shared properties */
.ukse-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 28px;
    border: none;
    border-radius: 999px;
    font-weight: 600;
    font-size: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, border-color 0.25s ease;
}

/* Compact size modifier (header CTA) */
.ukse-btn--compact {
    padding: 8px 16px;
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* ==========================================================================
   Home shared components
   ========================================================================== */

/* PRIMARY: Gradient CTAs (home-button, quote, compare tray, search) */
.home-button,
.home-button:link,
.home-button:visited,
.ukse-btn.ukse-btn--primary,
.ukse-btn.ukse-btn--primary:link,
.ukse-btn.ukse-btn--primary:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: linear-gradient(135deg, #EE7218 0%, #E6007E 100%);
    color: #ffffff !important;
    padding: 12px 28px;
    border-radius: 999px;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 10px 24px rgba(238, 114, 24, 0.25);
}

.home-button:hover,
.home-button:focus,
.home-button:hover:visited,
.home-button:focus:visited,
.ukse-btn.ukse-btn--primary:hover,
.ukse-btn.ukse-btn--primary:focus {
    background-color: transparent;
    background-image: linear-gradient(135deg, #EE7218 0%, #E6007E 100%);
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(230, 0, 126, 0.25);
    color: #ffffff !important;
}

/* SECONDARY: Outline/ghost CTAs (view course, view school) */
.home-button--outline,
.home-button--outline:link,
.home-button--outline:visited,
.home-button--ghost,
.home-button--ghost:link,
.home-button--ghost:visited,
.ukse-btn.ukse-btn--secondary,
.ukse-btn.ukse-btn--secondary:link,
.ukse-btn.ukse-btn--secondary:visited {
    background: transparent;
    color: #000032 !important;
    border: 2px solid #EE7218;
    box-shadow: none;
}

.home-button--outline:hover,
.home-button--outline:focus,
.home-button--outline:hover:visited,
.home-button--outline:focus:visited,
.home-button--ghost:hover,
.home-button--ghost:focus,
.ukse-btn.ukse-btn--secondary:hover,
.ukse-btn.ukse-btn--secondary:focus {
    background: transparent;
    background-image: none;
    color: #EE7218 !important;
    box-shadow: none;
    transform: none;
}

/* Dec 2024: Promo Banner section */
.home-promo-banner--content {
    padding: 20px 0;
    text-align: center;
    color: #ffffff;
}

.home-promo-banner__wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 16px 32px;
}

.home-promo-banner__heading {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: inherit;
}

.home-promo-banner__text {
    margin: 0;
    font-size: 1rem;
    color: inherit;
    opacity: 0.95;
}

.home-promo-banner__cta {
    display: inline-block;
    padding: 10px 24px;
    background: #ffffff;
    color: #EE7218;
    font-weight: 600;
    text-decoration: none;
    border-radius: 6px;
    transition: background 0.2s, color 0.2s;
}

.home-promo-banner__cta:hover,
.home-promo-banner__cta:focus {
    background: #000032;
    color: #ffffff;
}

/* Promo Banner: Base section background */
.ukse-home-promo {
    background: #EAF4FF; /* pastel light blue */
}

/* Promo Banner: Image mode (cover banner with max-height) */
.ukse-home-promo--image {
    padding: 20px 0;
}

.ukse-home-promo__imageLink,
.ukse-home-promo__imageBg {
    display: block;
    width: 100%;
    height: 280px;
    max-height: 300px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 18px;
    position: relative;
}

.ukse-home-promo__imageLink::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.08), rgba(0,0,0,0));
    border-radius: inherit;
    pointer-events: none;
}

@media (max-width: 768px) {
    .home-promo-banner__wrap {
        flex-direction: column;
        text-align: center;
    }

    .ukse-home-promo__imageLink,
    .ukse-home-promo__imageBg {
        height: 180px;
        max-height: 180px;
        border-radius: 12px;
    }
}

/* Dec 2024: Info Bar section (3 columns, compact left-icon layout, cardlet style) */
.home-info-bar {
    background: linear-gradient(180deg, #F5F7FB 0%, #FFFFFF 70%);
    padding: 20px 0 12px;
    margin-bottom: 0;
}

.home-info-bar__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.home-info-bar__item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    text-align: left;
    background: #fff;
    border: 1px solid rgba(9, 26, 63, 0.08);
    border-radius: 16px;
    padding: 14px 16px;
    box-shadow: 0 10px 24px rgba(9, 26, 63, 0.06);
}

.home-info-bar__icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    color: #E6007E;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-info-bar__icon i {
    font-size: 32px;
    line-height: 1;
    color: inherit;
    display: inline-block;
}

.home-info-bar__icon img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.home-info-bar__text {
    flex: 1;
    min-width: 0;
}

.home-info-bar__title {
    margin: 0 0 4px 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #000032;
}

.home-info-bar__title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s;
}

.home-info-bar__title a:hover,
.home-info-bar__title a:focus {
    color: #E6007E;
}

.home-info-bar__description {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.35;
    color: #49536a;
}

@media (max-width: 900px) {
    .home-info-bar__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

/* Finder-lab embed: subtle top shadow for visual separation, no top margin */
#ukse-finder-lab-embed {
    margin-top: 0;
    box-shadow: 0 -8px 20px rgba(9, 26, 63, 0.06);
}

.home-about {
    /* background now set via ACF field in front-page.php */
    padding: 48px 0;
}

.home-about__wrap {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 48px;
    align-items: center;
}

.home-about__content {
    grid-column: span 6;
    display: flex;
    flex-direction: column;
}

.home-about__body p {
    margin-bottom: 16px;
    font-size: 1rem;
    line-height: 1.65;
    color: #2d2d2d;
}

.home-about__media {
    grid-column: span 6;
    display: flex;
    justify-content: center;
}

.home-about__media img {
    border-radius: 20px;
    max-width: 100%;
    box-shadow: 0 24px 48px rgba(0, 0, 50, 0.18);
}

.home-about__placeholder {
    min-height: 320px;
    width: 100%;
    border-radius: 20px;
    background: radial-gradient(circle at top right, rgba(106, 202, 243, 0.5), rgba(238, 114, 24, 0.6));
    color: #ffffff;
    font-weight: 600;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    box-shadow: 0 24px 48px rgba(0, 0, 50, 0.18);
}

@media (max-width: 1024px) {
    .home-about__wrap {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .home-about__content,
    .home-about__media {
        grid-column: span 1;
    }

    .home-about__media {
        order: -1;
        margin-bottom: 24px;
    }
}

/* ==========================================================================
   Home Section: Eyebrow + Info Chips (shared across About / Tuition / Partner)
   ========================================================================== */

/* Eyebrow: small uppercase label */
.home-section-eyebrow {
    display: block;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 0 4px;
}

/* Per-section eyebrow colours (complementing each section's bg gradient) */
.home-section-eyebrow--about   { color: #EE7218; }
.home-section-eyebrow--tuition { color: #E6007E; }
.home-section-eyebrow--partner { color: #6ACAF3; }

/* Info chips container */
.home-section-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 14px 0 0;
}

/* Individual chip (pill shape) */
.home-section-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #343a40;
    cursor: default;
}

.home-section-chip i {
    font-size: 0.75rem;
}

/* Per-section chip variants */
.home-section-chip--about {
    background: rgba(238, 114, 24, 0.1);
}
.home-section-chip--about i {
    color: #EE7218;
}

.home-section-chip--tuition {
    background: rgba(230, 0, 126, 0.1);
}
.home-section-chip--tuition i {
    color: #E6007E;
}

.home-section-chip--partner {
    background: rgba(106, 202, 243, 0.15);
}
.home-section-chip--partner i {
    color: #2294D2;
}

/* Mobile: slightly smaller chips */
@media (max-width: 640px) {
    .home-section-chip {
        font-size: 0.75rem;
        padding: 4px 10px;
    }
}

/* Split-section heading override: left-aligned, no underline, tighter spacing.
   Needed because the global .home-section-title forces center + magenta bar. */
.home-about .home-section-title,
.home-tuition .home-section-title,
.home-partner .home-section-title {
    text-align: left !important;
    margin: 0 0 12px !important;
    font-size: 2rem !important;
}

.home-about .home-section-title::after,
.home-tuition .home-section-title::after,
.home-partner .home-section-title::after {
    display: none !important;
}

/* Collapse first/last-p margins so spacing is controlled by parent, not stacking */
.home-about__body p:first-child,
.home-tuition__body p:first-child,
.home-partner__body p:first-child {
    margin-top: 0;
}

.home-about__body p:last-child,
.home-tuition__body p:last-child,
.home-partner__body p:last-child {
    margin-bottom: 0;
}

/* Consistent CTA spacing after chips */
.home-about .home-button,
.home-tuition .home-button,
.home-partner .home-button {
    margin-top: 24px;
    align-self: flex-start;
}

@media (max-width: 1024px) {
    .home-about .home-section-title,
    .home-tuition .home-section-title,
    .home-partner .home-section-title {
        text-align: left !important;
        font-size: 1.75rem !important;
    }
}

/* Journey Section - full-width banner with video overlay */
.home-journey {
    padding: 0;
    position: relative;
    overflow: hidden;
}

/* Full-bleed - override .wrap constraints */
.home-journey .wrap {
    width: 100%;
    max-width: none;
    padding: 0;
    margin: 0;
}

.home-journey__wrap {
    position: relative;
    display: block;
}

/* Image: full-width banner background */
.home-journey__image {
    position: relative;
    width: 100%;
    line-height: 0;
}

.home-journey__image img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* Video: overlay positioned on right side */
.home-journey__video {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 45%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    padding-right: 80px;
    z-index: 2;
}

/* Dark semi-transparent backdrop behind video - slightly taller than 16:9 for equal visual border */
.home-journey__video::before {
    content: '';
    position: absolute;
    top: 50%;
    left: calc(50% - 28px); /* Offset for asymmetric padding: (80px - 24px) / 2 */
    transform: translate(-50%, -50%);
    width: calc(100% - 72px); /* Slightly larger than video for border effect */
    aspect-ratio: 16 / 9.4; /* Taller than 16:9 to balance top/bottom border with sides */
    background: rgba(0, 0, 50, 0.35);
    border-radius: 28px;
    z-index: 1;
}

.home-journey__video-container {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 8px 40px rgba(0, 0, 50, 0.25);
    background: #000032;
    z-index: 2;
}

.home-journey__video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Tablet: reduce video overlay width */
@media (max-width: 1024px) {
    .home-journey__video {
        width: 50%;
        padding: 16px;
    }

    .home-journey__video-container {
        border-radius: 16px;
    }
}

/* Mobile: stack vertically */
@media (max-width: 768px) {
    .home-journey__image img {
        /* Crop to show left portion with students */
        object-position: left center;
        height: 280px;
        object-fit: cover;
    }

    .home-journey__video {
        position: relative;
        width: 100%;
        padding: 20px;
        top: auto;
        right: auto;
        bottom: auto;
    }

    .home-journey__video::before {
        display: none;
    }

    .home-journey__video-container {
        border-radius: 16px;
        height: auto;
        aspect-ratio: 16 / 9;
    }
}

@media (max-width: 480px) {
    .home-journey__image img {
        height: 220px;
    }

    .home-journey__video {
        padding: 16px;
    }

    .home-journey__video-container {
        border-radius: 12px;
    }
}

.home-guides {
    padding: 48px 0;
}

.home-guides__intro {
    max-width: 680px;
    margin: 0 auto 40px;
    text-align: center;
}

.home-guides__grid {
    display: grid;
    gap: 28px;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.home-guides__card {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 18px 36px rgba(0, 0, 50, 0.12);
    display: flex;
    flex-direction: column;
    border-top: 6px solid var(--guide-accent);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.home-guides__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 46px rgba(0, 0, 50, 0.16);
}

.home-guides__media {
    position: relative;
    height: 180px;
    background: rgba(106, 202, 243, 0.15);
}

.home-guides__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-guides__swatch {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--guide-accent), rgba(255, 255, 255, 0.15));
}

.home-guides__content {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.home-guides__content h3 {
    margin: 0;
    font-size: 1.3rem;
    color: #000032;
}

.home-guides__content p {
    margin: 0;
    color: #3a3a3a;
    line-height: 1.6;
}

.home-guides__link {
    align-self: flex-start;
    margin-top: auto;
    font-weight: 600;
    color: var(--guide-accent);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.home-guides__link::after {
    content: '\2192';
    transition: transform 0.2s ease;
}

.home-guides__link:hover::after {
    transform: translateX(3px);
}

.home-faq {
    padding: 0;
}

.home-faq__intro {
    max-width: 680px;
    margin: 0 auto 32px;
    text-align: center;
}

.home-faq__items {
    display: grid;
    gap: 16px;
}

.home-faq__item {
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(255, 248, 242, 0.7), rgba(237, 248, 252, 0.7));
    padding: 0 24px;
    box-shadow: 0 12px 32px rgba(0, 0, 50, 0.1);
}

.home-faq__item summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    font-weight: 600;
    font-size: 1.1rem;
    color: #000032;
    padding: 20px 0;
    list-style: none;
}

.home-faq__item summary:focus {
    outline: none;
    box-shadow: none;
}

.home-faq__item summary::-webkit-details-marker {
    display: none;
}

.home-faq__item summary::after {
    content: '\203A';
    font-size: 1.5rem;
    color: #EE7218;
    transition: transform 0.2s ease;
}

.home-faq__item[open] summary::after {
    transform: rotate(90deg);
}

.home-faq__answer {
    padding: 0 0 20px 0;
    color: #2d2d2d;
}

.home-faq__answer p {
    margin-bottom: 12px;
    line-height: 1.65;
}

.home-faq__answer ul {
    padding-left: 20px;
    margin: 12px 0;
}

.home-faq__cta {
    margin-top: 32px;
    text-align: center;
}

@media (max-width: 640px) {
    .home-about {
        padding: 48px 0;
    }

    .home-guides {
        padding: 24px 0;
    }

    .home-guides__content {
        padding: 24px;
    }

    .home-faq__item {
        padding: 0 18px;
    }

    .home-faq__item summary {
        font-size: 1rem;
    }
}

/* ==========================================================================
   Flexible map full-width helper
   ========================================================================== */

.flxmap-container,
.flxmap-wrapper,
div[id^="flxmap-"] {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    position: relative;
    left: 0;
    right: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.flxmap-container iframe,
.flxmap-container .map-content,
div[id^="flxmap-"] iframe,
div[id^="flxmap-"] .map-content {
    width: 100%;
    height: auto;
    min-height: 400px;
}

.flxmap-full-width {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

@media (max-width: 768px) {
    .flxmap-container,
    div[id^="flxmap-"] {
        margin-left: calc(-50vw + 50%);
        margin-right: calc(-50vw + 50%);
    }

    .flxmap-container iframe,
    div[id^="flxmap-"] iframe {
        min-height: 300px;
    }
}

/* ==========================================================================
   Home Puzzles & Games section
   ========================================================================== */

.home-games {
    padding: 48px 0;
}

.home-games__intro {
    max-width: 680px;
    margin: 0 auto 40px;
    text-align: center;
}

.home-games__intro-text {
    font-size: 1.1rem;
    color: #3a3a3a;
    margin: 12px 0 0;
}

.home-games__grid {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.home-games__card {
    background: #ffffff;
    border-radius: 16px;
    padding: 24px;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 12px 32px rgba(0, 0, 50, 0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    position: relative;
    overflow: hidden;
}

.home-games__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 42px rgba(0, 0, 50, 0.14);
}

.home-games__icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #6ACAF3 0%, #E6007E 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-games__icon i {
    font-size: 1.4rem;
    color: #ffffff;
}

.home-games__icon img {
    width: 32px;
    height: 32px;
    object-fit: contain;
}

.home-games__content {
    flex: 1;
    min-width: 0;
}

.home-games__title {
    margin: 0 0 6px;
    font-size: 1.1rem;
    font-weight: 600;
    color: #000032;
}

.home-games__description {
    margin: 0;
    font-size: 0.95rem;
    color: #555555;
    line-height: 1.5;
}

.home-games__badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: #E6007E;
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 4px 10px;
    border-radius: 12px;
}

.home-games__cta {
    margin-top: 36px;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
}

@media (max-width: 640px) {
    .home-games {
        padding: 32px 0;
    }

    .home-games__grid {
        gap: 16px;
    }

    .home-games__card {
        padding: 20px;
    }

    .home-games__icon {
        width: 40px;
        height: 40px;
    }

    .home-games__icon i {
        font-size: 1.2rem;
    }

    .home-games__cta {
        flex-direction: column;
        align-items: stretch;
    }

    .home-games__cta .home-button {
        width: 100%;
        text-align: center;
    }
}

/* ==========================================================================
   Home tuition & partner sections
   ========================================================================== */

.home-tuition,
.home-partner {
    padding: 48px 0;
}

.home-tuition__wrap,
.home-partner__wrap {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 48px;
    align-items: center;
}

.home-tuition__content,
.home-partner__content {
    display: flex;
    flex-direction: column;
}

.home-tuition__body p,
.home-partner__body p {
    font-size: 1rem;
    line-height: 1.65;
    color: #2d2d2d;
}

.home-tuition__media,
.home-partner__media {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    min-height: 320px;
    box-shadow: 0 24px 48px rgba(0, 0, 50, 0.14);
}

.home-tuition__media img,
.home-partner__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-tuition__placeholder,
.home-partner__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    background: rgba(255, 255, 255, 0.75);
    color: #000032;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.home-partner__body {
    max-width: 540px;
}

@media (max-width: 1024px) {
    .home-tuition,
    .home-partner {
        padding: 60px 0;
    }

    .home-tuition__wrap,
    .home-partner__wrap {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: 32px;
    }

    .home-tuition__media,
    .home-partner__media {
        min-height: 240px;
        order: -1;
    }
}

@media (max-width: 640px) {
    .home-tuition,
    .home-partner {
        padding: 44px 0;
    }

    .home-tuition__body p,
    .home-partner__body p {
        font-size: 0.95rem;
    }

    .home-tuition__media,
    .home-partner__media {
        min-height: 200px;
    }
}

/* ==========================================================================
   Brand Utility Components
   ========================================================================== */

.btn-secondary,
.button-secondary,
.learn-more-btn,
.info-btn,
.outline-btn {
    background-color: var(--lse-secondary-orange) !important;
    border-color: var(--lse-secondary-orange) !important;
    color: var(--lse-white) !important;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.btn-secondary:hover,
.button-secondary:hover,
.learn-more-btn:hover,
.info-btn:hover,
.outline-btn:hover {
    background-color: var(--lse-tertiary-blue) !important;
    border-color: var(--lse-tertiary-blue) !important;
    transform: translateY(-1px);
}

.info-section,
.course-info,
.school-details,
.feature-box,
.highlight-box,
.info-card {
    background-color: rgba(106, 202, 243, 0.1);
    border-left: 4px solid var(--lse-tertiary-blue);
    padding: 20px;
    margin: 15px 0;
}

.info-section h3,
.course-info h3,
.school-details h3,
.feature-box h3 {
    color: var(--lse-structure-navy);
    border-bottom: 2px solid var(--lse-tertiary-blue);
    padding-bottom: 8px;
}



.course_module,
.language-course {
    border: 1px solid #e1e1e1;
    border-radius: 8px;
    background: var(--lse-white);
    transition: all 0.3s ease;
}

.course_module:hover,
.language-course:hover {
    border-color: var(--lse-tertiary-blue);
    box-shadow: 0 4px 16px rgba(106, 202, 243, 0.15);
    transform: translateY(-2px);
}

.lse-card,
.card,
.partner-school-item,
.testimonial-card,
.intro-section,
.section-container,
.content-block,
.widget,
.sidebar-widget,
.course-finder-container,
.course-results-item,
.school-item {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 50, 0.08);
    border: 1px solid rgba(0, 0, 50, 0.05);
    padding: 24px;
    margin-bottom: 24px;
    transition: all 0.3s ease;
}

.lse-card:hover,
.card:hover,
.partner-school-item:hover,
.testimonial-card:hover,
.intro-section:hover,
.section-container:hover,
.content-block:hover,
.widget:hover,
.sidebar-widget:hover,
.course-results-item:hover,
.school-item:hover {
    box-shadow: 0 4px 16px rgba(238, 114, 24, 0.15);
    transform: translateY(-2px);
    border-color: rgba(238, 114, 24, 0.2);
}
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea,
.wpforms-form input[type="text"],
.wpforms-form input[type="email"],
.wpforms-form textarea,
.contact-form input,
.contact-form textarea {
    border: 2px solid var(--lse-light-gray);
    border-radius: 6px;
    padding: 12px;
    transition: border-color 0.3s ease;
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.wpforms-form input:focus,
.wpforms-form textarea:focus,
.contact-form input:focus,
.contact-form textarea:focus {
    border-color: var(--lse-tertiary-blue) !important;
    box-shadow: 0 0 0 3px rgba(106, 202, 243, 0.2);
    outline: none;
}

.course-finder-filters,
.filter-row,
.search-form,
.filter-group {
    background: #ffffff;
    border-radius: 8px;
    padding: 20px;
    border: 1px solid rgba(0, 0, 50, 0.05);
    box-shadow: 0 2px 8px rgba(0, 0, 50, 0.08);
}

input[type="text"],
input[type="email"],
input[type="search"],
select,
textarea {
    background: #ffffff;
    border: 2px solid #e9ecef;
    border-radius: 6px;
    padding: 12px 16px;
    font-size: 16px;
    transition: all 0.3s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 50, 0.05);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
select:focus,
textarea:focus {
    border-color: var(--lse-secondary-orange);
    box-shadow: 0 0 0 3px rgba(238, 114, 24, 0.1);
    outline: none;
}

.cta-section,
.call-to-action {
    background: linear-gradient(135deg, #EE7218, #6ACAF3);
    color: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(238, 114, 24, 0.2);
    padding: 48px;
    margin: 40px 0;
    text-align: center;
}

.cta-section h2,
.call-to-action h2,
.cta-section h3,
.call-to-action h3 {
    color: #ffffff;
    margin-bottom: 16px;
}

.course-grid,
.school-grid,
.content-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 24px;
    padding: 0;
    margin: 24px 0;
}

/* ==========================================================================
   Global Content Utilities (migrated from child style.css)
   ========================================================================== */

img {
    max-width: 100%;
    height: auto;
}

.course-table,
.pricing-table {
    border-collapse: collapse;
    width: 100%;
    margin: 20px 0;
}

.course-table th,
.pricing-table th {
    background-color: var(--lse-structure-navy);
    color: var(--lse-white);
    padding: 12px;
    text-align: left;
}

.course-table td,
.pricing-table td {
    padding: 12px;
    border-bottom: 1px solid var(--lse-light-gray);
}

.course-table tr:hover,
.pricing-table tr:hover {
    background-color: rgba(106, 202, 243, 0.05);
}

.search-form input[type="search"] {
    border: 2px solid var(--lse-light-gray);
    border-radius: 6px 0 0 6px;
    padding: 12px;
}

.search-form button[type="submit"] {
    background-color: var(--lse-primary-magenta);
    border: 2px solid var(--lse-primary-magenta);
    color: var(--lse-white);
    border-radius: 0 6px 6px 0;
    padding: 12px 20px;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

#wpadminbar {
    z-index: 999999;
}

body {
    font-family: 'proxima-nova', 'Proxima Nova', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--lse-structure-navy);
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--lse-structure-navy);
    font-weight: 600;
    line-height: 1.3;
}

h1 {
    font-size: 2.5rem;
    margin-bottom: 1rem;
}

h2 {
    font-size: 2rem;
    margin-bottom: 0.8rem;
    border-bottom: none !important;
    padding-bottom: 0;
    display: block;
}

.h2-underline,
h2,
.schools-carousel-title,
.testimonial_title,
.blog-title,
.content-title,
.results-title,
.home-section-title {
    font-family: 'proxima-nova', 'Proxima Nova', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 2.5rem !important;
    font-weight: 700 !important;
    color: #000032 !important;
    text-align: center !important;
    margin: 40px 0 30px !important;
    padding: 0 !important;
    position: relative !important;
    display: block !important;
    line-height: 1.3 !important;
    text-transform: none !important;
    letter-spacing: 0.5px !important;
    background: none !important;
    border: none !important;
}

.h2-underline::after,
h2::after,
.schools-carousel-title::after,
.testimonial_title::after,
.blog-title::after,
.content-title::after,
.results-title::after,
.home-section-title::after {
    content: '' !important;
    display: block !important;
    width: 300px !important;
    height: 4px !important;
    background: #E6007E !important;
    margin: 15px auto 0 !important;
    border-radius: 2px !important;
}

@media (max-width: 768px) {
    .h2-underline,
    h2,
    .schools-carousel-title,
    .testimonial_title,
    .blog-title,
    .content-title,
    .home-section-title {
        font-size: 2rem !important;
        margin: 32px 0 28px !important;
    }

    .h2-underline::after,
    h2::after,
    .schools-carousel-title::after,
    .testimonial_title::after,
    .blog-title::after,
    .content-title::after,
    .home-section-title::after {
        width: 200px !important;
        height: 3px !important;
        margin: 12px auto 0 !important;
    }
}

h3 {
    font-size: 1.5rem;
    color: var(--lse-secondary-orange);
    margin-bottom: 0.6rem;
}

a,
a:link,
a:visited {
    color: var(--lse-secondary-orange) !important;
    text-decoration: none !important;
    transition: color 0.3s ease;
}

a:hover,
a:focus,
a:active {
    color: var(--lse-structure-navy) !important;
}

.lse-clean-override {
    background: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 50, 0.08) !important;
    border: 1px solid rgba(0, 0, 50, 0.05) !important;
    padding: 24px !important;
}

.menu,
.menu ul,
.menu li,
.nav,
.nav ul,
.nav li,
.navigation ul,
.menu-item ul,
.nav-menu ul,
.widget_nav_menu ul,
#nav_menu-2 ul,
.menu-sitemap,
.menu-sitemap ul,
.menu-sitemap li,
.footer-menu ul,
.footer-menu li,
.header-menu ul,
.header-menu li,
.footer-mega-menu ul,
.footer-mega-menu li,
.service-links,
.service-links li,
.site_navigation ul,
.site_navigation ul li ul,
ul.menu,
ul.nav-menu,
ul.sub-menu {
    list-style: none !important;
    list-style-type: none !important;
    list-style-image: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.menu li,
.nav li,
.navigation li,
.menu-item li,
.nav-menu li,
.widget_nav_menu li,
#nav_menu-2 li,
.footer-menu li,
.header-menu li,
.footer-mega-menu li,
.service-links li,
.site_navigation ul li {
    list-style: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    text-indent: 0 !important;
}

.menu li::before,
.navigation li::before,
.menu-sitemap li::before,
.footer-menu li::before,
.header-menu li::before,
.footer-mega-menu li::before,
.service-links li::before,
.site_navigation ul li::before {
    content: none !important;
    display: none !important;
}

/* ==========================================================================
   Section wrappers & shared backgrounds
   ========================================================================== */

.section_option,
.content-section,
.page-section,
.homepage-section,
.map-section,
.schools-map {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 50, 0.06);
    border: 1px solid rgba(0, 0, 50, 0.05);
    padding: 40px;
    margin: 32px 0;
}

.partner-schools-section,
.schools-carousel-container {
    background: #eeeeee;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 50, 0.06);
    border: 1px solid rgba(0, 0, 50, 0.05);
    padding: 40px;
    margin: 32px 0;
}

.map-section h2,
.schools-map h2 {
    color: #000032;
    font-size: 2rem;
}

@media (max-width: 768px) {
    .section_option,
    .content-section,
    .page-section,
    .homepage-section,
    .map-section,
    .schools-map,
    .partner-schools-section,
    .schools-carousel-container {
        padding: 24px;
        margin: 20px 0;
        border-radius: 10px;
    }

    .map-section h2,
    .schools-map h2 {
        font-size: 1.8rem;
    }
}

/* ==========================================================================
   Footer base palette & language switcher
   ========================================================================== */

.site-footer,
footer {
    background: var(--lse-structure-navy, #000032);
    color: var(--lse-white, #ffffff);
    padding: 40px 0 20px;
}

.site-footer a,
footer a {
    color: var(--lse-tertiary-blue, #6ACAF3);
    transition: color 0.3s ease;
}

.site-footer a:hover,
footer a:hover {
    color: var(--lse-secondary-orange, #EE7218);
}

.footer-section h4,
.footer-widget h4 {
    color: var(--lse-white, #ffffff);
    border-bottom: 2px solid var(--lse-primary-magenta, #E6007E);
    padding-bottom: 8px;
    margin-bottom: 15px;
}

.lse-enhanced-footer {
    background: var(--lse-structure-navy, #000032) !important;
    color: var(--lse-white, #ffffff) !important;
    background-image: none !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.lse-enhanced-footer .footer-mega-menu,
.footer-mega-menu.footer-mega-menu,
.footer-mega-menu {
    background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 50, 1) 100%) !important;
    margin-top: 0 !important;
    padding: 60px 0 40px 0 !important;
    border-bottom: 2px solid rgba(238, 114, 24, 0.2) !important;
}

footer .footer-mega-menu,
.lse-enhanced-footer .footer-mega-menu,
body footer .footer-mega-menu {
    background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 50, 1) 100%) !important;
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 50, 1) 100%) !important;
}

.footer-mega-menu[style] {
    background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 50, 1) 100%) !important;
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 50, 1) 100%) !important;
}

.footer-mega-menu .wrap,
.footer-mega-menu .grid,
.footer-mega-menu .grid__item {
    background-color: transparent !important;
}

.footer-mega-menu .footer-service-section {
    background: rgba(255, 255, 255, 0.02) !important;
    background-color: rgba(255, 255, 255, 0.02) !important;
}

.footer-mega-menu *:not(.footer-btn):not(.service-links a):not(.filter-tag):not(.btn-primary):not(.btn-secondary) {
    background: transparent !important;
    background-color: transparent !important;
}

.footer-service-row {
    width: 100% !important;
    margin-bottom: 40px !important;
    padding: 0 !important;
}

.footer-service-row:last-child {
    margin-bottom: 0 !important;
}

.footer-service-section {
    padding: 30px 20px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: all 0.3s ease !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    background: rgba(255, 255, 255, 0.02) !important;
}

.footer-service-section:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(238, 114, 24, 0.3) !important;
    transform: translateY(-5px) !important;
}

.menu-sitemap,
.menu-sitemap ul,
.menu-sitemap li,
.footer-mega-menu ul,
.footer-mega-menu li,
.service-links,
.service-links li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.footer-mega-menu ul li::before,
.service-links li::before,
.menu-sitemap li::before {
    content: none !important;
    display: none !important;
}

.service-panel-title {
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin: 0 0 15px 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.service-panel-content {
    color: #cccccc !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}

.service-panel-content p {
    margin: 0 0 20px 0 !important;
    color: #cccccc !important;
}

.service-panel-cta,
.footer-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 12px 20px !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-align: center !important;
    transition: all 0.3s ease !important;
    border: 2px solid !important;
    color: #ffffff !important;
    background-color: #EE7218 !important;
    border-color: #EE7218 !important;
}

.service-panel-cta:hover,
.footer-btn:hover {
    background: transparent !important;
    color: #EE7218 !important;
    transform: translateY(-2px) !important;
}

.footer-btn {
    width: 100% !important;
    display: flex !important;
}


.footer-service-panel.london-homestays,
.footer-service-panel.london-homestays.widget_text {
    border-left: 4px solid #2294D2 !important;
    padding-left: 20px !important;
}

.footer-service-panel.london-homestays .service-panel-content,
.footer-service-panel.london-homestays .textwidget {
    border-left: none !important;
    padding-left: 0 !important;
}

.footer-service-panel.london-homestays .service-panel-cta:hover {
    background: transparent !important;
    color: #2294D2 !important;
}

.footer-service-panel.london-homestays .service-panel-title {
    color: #2294D2 !important;
}

.footer-service-panel.london-homestays .service-panel-cta {
    background-color: #2294D2 !important;
    border-color: #2294D2 !important;
}

.footer-service-panel.london-homestays .service-panel-cta:hover {
    background: transparent !important;
    color: #2294D2 !important;
}

.footer-service-panel.uk-residences,
.footer-service-panel.uk-residences.widget_text {
    border-left: 4px solid #B1CB0C !important;
    padding-left: 20px !important;
}

.footer-service-panel.uk-residences .service-panel-content,
.footer-service-panel.uk-residences .textwidget {
    border-left: none !important;
    padding-left: 0 !important;
}

.footer-service-panel.uk-residences .service-panel-cta:hover {
    background: transparent !important;
    color: #B1CB0C !important;
}

.footer-service-panel.uk-residences .service-panel-title {
    color: #B1CB0C !important;
}

.footer-service-panel.uk-residences .service-panel-cta {
    background-color: #B1CB0C !important;
    border-color: #B1CB0C !important;
}

.footer-service-panel.uk-residences .service-panel-cta:hover {
    background: transparent !important;
    color: #B1CB0C !important;
}

.footer-service-panel.study-english,
.footer-service-panel.study-english.widget_text {
    border-left: 4px solid #EE7218 !important;
    padding-left: 20px !important;
}

.footer-service-panel.study-english .service-panel-content,
.footer-service-panel.study-english .textwidget {
    border-left: none !important;
    padding-left: 0 !important;
}

.footer-service-panel.study-english .service-panel-title {
    color: #EE7218 !important;
}

.footer-service-panel.study-english .service-panel-cta {
    background-color: #EE7218 !important;
    border-color: #EE7218 !important;
}

.footer-service-panel.study-english .service-panel-cta:hover {
    background: transparent !important;
    color: #EE7218 !important;
}

@media (max-width: 768px) {
    .footer-mega-menu {
        padding: 40px 0 30px 0 !important;
    }

    .footer-service-section {
        margin-bottom: 30px !important;
        padding: 25px 15px !important;
    }

    .service-title {
        font-size: 1.2rem !important;
        text-align: center !important;
        justify-content: center !important;
    }

    .service-description {
        text-align: center !important;
        margin-bottom: 15px !important;
    }

    .service-links {
        margin-bottom: 20px !important;
    }

    .service-links a {
        text-align: center !important;
        padding: 8px 0 !important;
    }

    .footer-btn {
        padding: 14px 20px !important;
        font-size: 16px !important;
        min-height: 44px !important;
    }

    .service-mega-columns {
        flex-direction: column !important;
        gap: 20px !important;
    }

    .service-column {
        min-width: 100% !important;
        margin-bottom: 20px !important;
    }

    .service-column h4 {
        text-align: center !important;
        font-size: 1rem !important;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .footer-service-section {
        padding: 25px 15px !important;
    }

    .service-title {
        font-size: 1.2rem !important;
    }

    .service-description,
    .service-links a {
        font-size: 13px !important;
    }
}

@media (min-width: 1200px) {
    .footer-mega-menu {
        padding: 80px 0 50px 0 !important;
    }

    .footer-service-section {
        padding: 35px 25px !important;
    }

    .service-title {
        font-size: 1.4rem !important;
    }
}

.service-title {
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin: 0 0 15px 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.service-title i {
    font-size: 1.5rem !important;
    color: #EE7218 !important;
}

.london-homestays .service-title i { color: #ed3036 !important; }
.uk-residences .service-title i { color: #7ac043 !important; }
.study-english .service-title i { color: #E6007E !important; }

.service-description {
    color: #cccccc !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin: 0 0 20px 0 !important;
}

.service-links {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 25px 0 !important;
    flex: 1 !important;
}

.service-links li {
    margin: 0 0 8px 0 !important;
}

.service-links a {
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    display: block !important;
    padding: 6px 0 !important;
    border-bottom: 1px solid transparent !important;
}

.service-links a:hover {
    color: #6ACAF3 !important;
    border-bottom-color: rgba(106, 202, 243, 0.3) !important;
    padding-left: 8px !important;
}

.service-logo {
    text-align: center !important;
    margin: 0 0 20px 0 !important;
}

.footer-service-panel .service-logo img {
    max-width: 180px !important;
    height: auto !important;
    display: inline-block !important;
}

.homestays-logo,
.residences-logo,
.study-english-logo {
    max-width: 200px !important;
    height: auto !important;
    background: rgba(255, 255, 255, 0.9) !important;
    padding: 10px !important;
    border-radius: 8px !important;
}

.service-mega-columns {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 30px !important;
    margin-top: 20px !important;
}

.service-column {
    flex: 1 !important;
    min-width: 200px !important;
    padding: 0 !important;
}

.service-column h4 {
    color: #ffffff !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    margin: 0 0 15px 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-bottom: 2px solid rgba(238, 114, 24, 0.3) !important;
    padding-bottom: 8px !important;
}

.service-column-title--blank {
    color: transparent !important;
}

.london-homestays .service-column h4 {
    border-bottom-color: rgba(34, 148, 210, 0.3) !important;
}

.uk-residences .service-column h4 {
    border-bottom-color: rgba(177, 203, 12, 0.3) !important;
}

.study-english .service-column h4 {
    border-bottom-color: rgba(238, 114, 24, 0.3) !important;
}

.footer-service-panel .widget,
.footer-service-panel .textwidget {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.footer-service-panel .widget ul,
.footer-service-panel .menu {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.footer-service-panel .widget li,
.footer-service-panel .menu li {
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
}

.footer-service-panel .widget a,
.footer-service-panel .menu a {
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    display: block !important;
    padding: 6px 0 !important;
    border-bottom: 1px solid transparent !important;
}

.footer-service-panel .widget a:hover,
.footer-service-panel .menu a:hover {
    color: #6ACAF3 !important;
    border-bottom-color: rgba(106, 202, 243, 0.3) !important;
    padding-left: 8px !important;
}

.footer-service-panel .textwidget {
    color: #cccccc !important;
}

.footer-service-panel .textwidget p {
    margin: 0 0 15px 0 !important;
    line-height: 1.6 !important;
}

.service-cta {
    margin-top: auto !important;
}

.homestay-btn {
    background: linear-gradient(135deg, #2294D2 0%, #1a75a8 100%) !important;
    color: #ffffff !important;
    border-color: #2294D2 !important;
}

.homestay-btn:hover {
    background: transparent !important;
    color: #2294D2 !important;
    transform: translateY(-2px) !important;
}

.residence-btn {
    background: linear-gradient(135deg, #B1CB0C 0%, #8aa209 100%) !important;
    color: #ffffff !important;
    border-color: #B1CB0C !important;
}

.residence-btn:hover {
    background: transparent !important;
    color: #B1CB0C !important;
    transform: translateY(-2px) !important;
}

.english-btn {
    background: linear-gradient(135deg, #EE7218 0%, #c25a13 100%) !important;
    color: #ffffff !important;
    border-color: #EE7218 !important;
}

.english-btn:hover {
    background: transparent !important;
    color: #EE7218 !important;
    transform: translateY(-2px) !important;
}

.guardian-btn {
    background: linear-gradient(135deg, #E6007E 0%, #b8005f 100%) !important;
    color: #ffffff !important;
    border-color: #E6007E !important;
}

.guardian-btn:hover {
    background: transparent !important;
    color: #E6007E !important;
    transform: translateY(-2px) !important;
}

#footer_language_list {
    display: flex;
    flex-direction: column;
    align-items: center;
    visibility: visible;
    opacity: 1;
    background: rgba(255, 255, 255, 0.12);
    padding: 14px 40px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 24px;
    margin: 0 auto;
    max-width: 960px;
    width: auto;
    box-sizing: border-box;
    gap: 6px;
}

#footer_language_list ul.footer-lang-row {
    display: flex;
    align-items: center;
    justify-content: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0 24px;
    flex-wrap: nowrap;
}

#footer_language_list ul li {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 3px 4px;
    color: var(--lse-white, #ffffff);
    white-space: nowrap;
    font-size: 0.88em;
}

#footer_language_list ul li a {
    color: var(--lse-white, #ffffff);
    text-decoration: none;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 2px 0;
}

#footer_language_list ul li a:hover {
    color: rgba(255, 255, 255, 0.8);
}

#footer_language_list .current-language {
    color: var(--lse-white, #ffffff);
    font-weight: 700;
    letter-spacing: 0.02em;
}

#footer_language_list img {
    vertical-align: middle;
    margin-right: 4px;
    position: relative;
    top: -1px;
}

@media (max-width: 760px) {
    #footer_language_list {
        padding: 12px 20px;
        max-width: calc(100% - 48px);
    }

    #footer_language_list ul.footer-lang-row {
        gap: 0 16px;
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 520px) {
    #footer_language_list {
        padding: 12px 16px;
        border-radius: 18px;
        max-width: 100%;
    }

    #footer_language_list ul.footer-lang-row {
        gap: 4px 10px;
        font-size: 0.85em;
    }
}

.footer-language-container {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 0 32px;
    box-sizing: border-box;
}

.footer-middle .wrap {
    display: flex;
    justify-content: center;
}

/* ==========================================================================
   Footer Mega Menu - Simplified Layout & Mobile Accordion
   ========================================================================== */

/* Accordion icon (visible on all sizes, animated on mobile) */
.footer-service-panel .service-panel-title .accordion-icon {
    display: none;
}

/* Simplified panel layout - single column of links + CTA */
.footer-service-panel .service-panel-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
}

/* Logo container - fixed height for vertical alignment across panels */
.footer-service-panel .service-logo {
    max-width: 180px;
    height: 55px; /* Fixed height ensures links start at same position */
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.footer-service-panel .service-logo img {
    max-height: 50px;
    width: auto;
    object-fit: contain;
}

/* Links list fills available space */
.footer-service-panel .service-links {
    flex: 1;
}

/* CTA pushed to bottom */
.footer-service-panel .service-panel-cta {
    margin-top: auto;
}

/* Mobile accordion behavior */
@media (max-width: 768px) {
    /* Show accordion icon on mobile */
    .footer-service-panel .service-panel-title .accordion-icon {
        display: inline-block;
        margin-left: auto;
        font-size: 1.2rem;
        transition: transform 0.3s ease;
    }

    .footer-service-panel .service-panel-title .accordion-icon::before {
        content: '+';
    }

    .footer-service-panel.is-expanded .service-panel-title .accordion-icon::before {
        content: '−';
    }

    /* Make title clickable */
    .footer-service-panel .service-panel-title {
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 0;
        margin-bottom: 0 !important;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
    }

    /* Collapse content by default */
    .footer-service-panel .service-panel-content {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transition: max-height 0.35s ease, opacity 0.25s ease, padding 0.25s ease;
        padding-top: 0;
        padding-bottom: 0;
    }

    /* Expand when active */
    .footer-service-panel.is-expanded .service-panel-content {
        max-height: 600px;
        opacity: 1;
        padding-top: 16px;
        padding-bottom: 16px;
    }

    /* Visual indicator for tap target */
    .footer-service-panel .service-panel-title:active {
        opacity: 0.8;
    }

    /* Ensure 44px minimum tap target */
    .footer-service-panel .service-links a {
        min-height: 44px;
        display: flex;
        align-items: center;
        padding: 10px 0 !important;
    }

    /* Center logo on mobile */
    .footer-service-panel .service-logo {
        text-align: center;
        margin: 0 auto 16px auto;
    }

    /* Stack panels vertically with separator */
    .footer-service-panel {
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .footer-service-panel:last-child {
        border-bottom: none;
    }
}

/* Desktop: panels always visible, horizontal layout option */
@media (min-width: 769px) {
    /* Accordion icon hidden on desktop */
    .footer-service-panel .service-panel-title .accordion-icon {
        display: none;
    }

    /* Content always visible */
    .footer-service-panel .service-panel-content {
        max-height: none !important;
        opacity: 1 !important;
        overflow: visible !important;
    }

    /* Optional: horizontal panels layout */
    .footer-mega-menu > .wrap {
        display: flex;
        flex-wrap: wrap;
        gap: 30px;
        align-items: stretch; /* Equal height panels */
    }

    .footer-service-panel {
        flex: 1 1 calc(50% - 15px);
        min-width: 280px;
        display: flex;
        flex-direction: column;
    }
}

/* Large desktop: 3-column layout */
@media (min-width: 1200px) {
    .footer-service-panel {
        flex: 1 1 calc(33.333% - 20px);
        min-width: 280px;
        display: flex;
        flex-direction: column;
    }

    /* Title alignment - consistent height for visual grid alignment */
    .footer-service-panel .service-panel-title {
        min-height: 2.8em;
        display: flex;
        align-items: flex-start;
        line-height: 1.3;
    }

    /* CTA buttons - prevent wrapping on desktop */
    .footer-service-panel .service-panel-cta {
        white-space: nowrap;
    }
}

/* Tablet (2-col): title alignment */
@media (min-width: 769px) and (max-width: 1199px) {
    .footer-service-panel .service-panel-title {
        min-height: 2.6em;
        display: flex;
        align-items: flex-start;
        line-height: 1.3;
    }
}

/* ==========================================================================
   Footer column layout
   ========================================================================== */

.footer .footer-top .grid,
.footer .wrap .grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    align-items: flex-start;
}

.footer .footer-top .grid__item,
.footer .grid__item {
    width: 50%;
    max-width: 400px;
    min-width: 300px;
    flex: 0 0 50%;
    padding: 20px;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .footer .footer-top .grid__item,
    .footer .grid__item {
        width: 100%;
        max-width: 100%;
        min-width: 100%;
    }
}

.footer .widget_nav_menu,
.footer .footer-column,
#nav_menu-2 {
    width: 100%;
    display: block;
    padding: 20px;
    margin: 0;
    box-sizing: border-box;
}

.footer-top {
    background: rgba(0, 0, 50, 0.8) !important;
    padding: 40px 0 !important;
}

.footer-middle {
    background: rgba(0, 0, 50, 0.9) !important;
    padding: 20px 0 !important;
}

.footer-bottom {
    background: #000020 !important;
    padding: 20px 0 !important;
}

.footer-bottom p,
.footer-bottom a {
    color: #cccccc !important;
    font-size: 14px !important;
}

.footer-bottom a:hover {
    color: #EE7218 !important;
}

.footer_skyline {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.section_latest_blog {
    margin-bottom: 0 !important;
}

.footer .widget_nav_menu h3,
.footer .footer-column h3,
#nav_menu-2 h3,
.footer .widget-title {
    color: #ffffff;
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0 0 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.footer .widget_nav_menu ul,
.footer .footer-column ul,
#nav_menu-2 ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer .widget_nav_menu li,
.footer .footer-column li,
#nav_menu-2 li {
    margin: 0 0 8px;
}

.footer .widget_nav_menu a,
.footer .footer-column a,
#nav_menu-2 a {
    color: var(--lse-secondary-orange) !important;
    text-decoration: none;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.6;
    transition: color 0.3s ease, text-decoration 0.3s ease;
}

.footer .widget_nav_menu a:hover,
.footer .footer-column a:hover,
#nav_menu-2 a:hover {
    color: var(--lse-tertiary-blue) !important;
    text-decoration: underline;
}

.fa:before,
i.fa:before {
    font-family: "FontAwesome" !important;
    font-weight: normal !important;
    font-style: normal !important;
    display: inline-block !important;
    text-decoration: inherit !important;
}

.footer-column {
    padding: 20px !important;
}

.footer-column h3 {
    color: #ffffff !important;
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    margin: 0 0 20px 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.footer-column .contact-info p {
    color: #ffffff !important;
    font-size: 16px !important;
    font-family: 'proxima-nova', 'Proxima Nova', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    line-height: 1.6 !important;
    margin: 0 0 10px 0 !important;
}

.footer-column .contact-info strong {
    color: #ffffff !important;
    font-weight: 600 !important;
}

.footer-column .contact-info a {
    color: #6ACAF3 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}

.footer-column .contact-info a:hover {
    color: #EE7218 !important;
    text-decoration: underline !important;
}

.home-testimonials__carousel .splide__track,
.school-testimonials__carousel .splide__track {
    padding: 16px 0 24px; /* top + bottom padding for author avatar shadow */
    overflow: clip visible; /* horizontal clip, vertical visible for shadows */
}

.home-testimonials__carousel .splide__slide,
.school-testimonials__carousel .splide__slide {
    display: flex;
    justify-content: center;
}

.home-testimonials__item,
.school-testimonials__item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 24px;
    align-items: center;
    max-width: 720px;
    width: 100%;
    margin: 0 auto;
}

.home-testimonials__item .author_image,
.school-testimonials__item .author_image {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.12);
}

.home-testimonials__item .author_image img,
.school-testimonials__item .author_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.author_image--contain img {
    object-fit: contain !important;
    padding: 10px;
}

.home-testimonials__item .testimonial_cont,
.school-testimonials__item .testimonial_cont {
    font-size: 0.95rem;
    line-height: 1.6;
}

.home-testimonials__item .testimonial_cont span,
.school-testimonials__item .testimonial_cont span {
    font-weight: 700;
    letter-spacing: 0.02em;
}

.home-testimonials__carousel .splide__pagination,
.school-testimonials__carousel .splide__pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
    position: static;
}

.home-testimonials__carousel .splide__pagination__page,
.school-testimonials__carousel .splide__pagination__page {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(0, 0, 50, 0.15);
    transition: background 0.3s ease, transform 0.3s ease;
}

.home-testimonials__carousel .splide__pagination__page.is-active,
.home-testimonials__carousel .splide__pagination__page:hover,
.home-testimonials__carousel .splide__pagination__page:focus-visible,
.school-testimonials__carousel .splide__pagination__page.is-active,
.school-testimonials__carousel .splide__pagination__page:hover,
.school-testimonials__carousel .splide__pagination__page:focus-visible {
    background: #E6007E;
    transform: scale(1.15);
}

@media (max-width: 640px) {
    .home-testimonials__item,
    .school-testimonials__item {
        grid-template-columns: 1fr;
        text-align: center;
        max-width: 100%;
    }

    .home-testimonials__item .author_image,
    .school-testimonials__item .author_image {
        justify-self: center;
        width: 80px;
        height: 80px;
    }

    .partner-schools-carousel .splide__pagination,
    .blog_update .splide__pagination,
    .home-testimonials__carousel .splide__pagination,
    .school-testimonials__carousel .splide__pagination {
        display: none;
    }
}

/* ==========================================================================
   Partner logo strip
   ========================================================================== */

.partners-section {
    background: #ffffff !important;
    padding: 50px 0 !important;
    margin-bottom: 0 !important;
    border-top: 1px solid #e9ecef !important;
    border-bottom: 1px solid #e9ecef !important;
}

.partners-section .wrap {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 30px !important;
}

.partners-section .partner-logos-fallback,
.partners-section .widget_partners_logo_widget {
    display: flex !important;
    align-items: center !important;
    justify-content: space-evenly !important;
    gap: 32px !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    overflow-x: auto !important;
    padding: 12px 0 !important;
    scroll-snap-type: x mandatory !important;
}

.partners-section .partner-logos-fallback::-webkit-scrollbar,
.partners-section .widget_partners_logo_widget::-webkit-scrollbar {
    height: 6px;
}

.partners-section .partner-logos-fallback::-webkit-scrollbar-thumb,
.partners-section .widget_partners_logo_widget::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 50, 0.2);
    border-radius: 999px;
}

.partners-section .partner-logos-fallback > a,
.partners-section .partner-logos-fallback > span,
.partners-section .widget_partners_logo_widget > a,
.partners-section .widget_partners_logo_widget > span {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    scroll-snap-align: center !important;
}

.partners-section img {
    display: block !important;
    max-height: 45px !important;
    width: auto !important;
    transition: transform 0.3s ease, opacity 0.3s ease !important;
    pointer-events: none;
}

.partners-section a:hover img {
    transform: scale(1.05) !important;
    opacity: 0.85 !important;
}

@media (max-width: 768px) {
    .partners-section {
        padding: 40px 0 !important;
    }

    .partners-section .wrap {
        padding: 0 15px !important;
    }

    .partners-section .partner-logos-fallback,
    .partners-section .widget_partners_logo_widget {
        gap: 18px !important;
        justify-content: flex-start !important;
    }

    .partners-section img {
        max-height: 38px !important;
    }
}

@media (min-width: 1200px) {
    .partners-section {
        padding: 60px 0 !important;
    }

    .partners-section img {
        max-height: 50px !important;
    }
}

/* ==========================================================================
   Navigation (migrated from parent style.css @1242+ and responsive variants)
   ========================================================================== */

.site_navigation {
    width: 100%;
    border-top: 1px solid #ebebeb;
    position: relative;
    z-index: 900;
}

.site_navigation.desk {
    display: block;
}

.site_navigation.mob {
    display: none;
}

.site_navigation .wrap {
    position: relative;
}

.site_navigation::after {
    content: "";
    display: table;
    clear: both;
}

.site_navigation ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.site_navigation ul li {
    font-family: 'ligurino_condensedregular', 'Proxima Nova', sans-serif;
    float: left;
    width: 25%;
    font-size: 18px;
    line-height: 57px;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
}

.site_navigation ul li i {
    margin-left: 10px;
    position: relative;
    top: -4px;
}

.site_navigation ul li a {
    display: block;
    text-decoration: none;
    color: #fff;
}

.site_navigation ul li .megamenu {
    position: absolute;
    top: 57px;
    left: 0;
    display: none;
    width: 1200px;
    padding: 0 40px;
    overflow: hidden;
    text-align: left;
    font-family: 'proxima-nova', 'Proxima Nova', 'proxima_nova', sans-serif;
}

.megamenu .menu_widget {
    float: left;
    width: 25%;
    padding: 44px 0 36px;
}

.megamenu .menu_widget h3 {
    margin: 0 0 10px;
    padding: 0;
    font-family: 'ligurino_condensedregular', 'Proxima Nova', sans-serif;
    font-size: 20px;
    line-height: 24px;
    color: #fff;
}

.megamenu .menu_widget ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.megamenu .menu_widget ul li {
    margin: 0 0 14px;
    font-family: 'proxima-nova', 'Proxima Nova', 'proxima_nova', sans-serif;
    font-size: 16px;
    line-height: 18px;
    color: #e96587;
    letter-spacing: normal;
    text-transform: none;
    text-align: left;
    background: none !important;
    float: none;
    width: 100%;
}

.megamenu .menu_widget ul li a {
    color: #c9cad3;
    text-decoration: none;
}

.megamenu .menu_widget .menu-london-homestays-container ul li:first-child a,
.megamenu .menu_widget .menu-student-residence-information-container ul li:first-child a {
    font-weight: bold;
    color: #f9ddd0;
}

.megamenu .menu_widget .menu-become-a-host-family-container ul li:first-child a,
.megamenu .menu_widget ul li.lsr a,
.megamenu .menu_widget .menu-year-round-residences-container ul li:first-child a {
    font-weight: bold;
    color: #d6dfd9;
}

/* ==========================================================================
   Enhanced Mobile Navigation System
   ========================================================================== */

.menu_icon.nav-toggle {
    --nav-toggle-size: 48px;
    display: inline-flex;
    background: var(--lse-primary-magenta);
    border: 0;
    border-radius: 8px;
    width: var(--nav-toggle-size);
    height: var(--nav-toggle-size);
    min-width: var(--nav-toggle-size);
    min-height: var(--nav-toggle-size);
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    z-index: 1000;
    transition: background 0.3s ease, transform 0.3s ease;
    margin: 8px 0 0 auto;
    float: right;
    color: var(--lse-white);
}

.menu_icon.nav-toggle:hover {
    background: var(--lse-secondary-orange);
    transform: scale(1.05);
}

.menu_icon.nav-toggle:focus,
.menu_icon.nav-toggle:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue);
    outline-offset: 2px;
    position: relative;
    z-index: 10;
}

.menu_icon.nav-toggle::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 24px;
    height: 2px;
    background: var(--lse-white);
    box-shadow: 0 6px 0 var(--lse-white), 0 12px 0 var(--lse-white);
    transform: translate(-50%, -50%);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.menu_icon.nav-toggle[aria-expanded="true"]::before {
    box-shadow: none;
    transform: translate(-50%, -50%) rotate(45deg);
}

.menu_icon.nav-toggle[aria-expanded="true"]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 24px;
    height: 2px;
    background: var(--lse-white);
    transform: translate(-50%, -50%) rotate(-45deg);
}



.site_navigation.mob {
    position: fixed;
    top: 0;
    right: 0 !important;
    left: auto !important;
    width: 100%;
    max-width: 420px;
    height: 100vh;
    background: var(--lse-structure-navy) !important;
    z-index: 1400;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    overflow: hidden;
    box-shadow: -12px 0 24px rgba(0, 0, 0, 0.25);
    padding: 0;
    box-sizing: border-box;
    transform: translateX(100%);
    color: var(--lse-white);
}

.site_navigation.mob.is-open {
    transform: translateX(0);
}

.mobile-nav-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 50, 0.8);
    z-index: 1350;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    pointer-events: none;
}

.mobile-nav-overlay.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.site_navigation.mob {
    display: flex;
    flex-direction: column;
    pointer-events: none;
}

.site_navigation.mob.is-open {
    pointer-events: auto;
}

.mobile-nav-scroll {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 32px 28px 44px;
    display: flex;
    flex-direction: column;
    gap: 28px;
    box-sizing: border-box;
}

.mobile-nav-section {
    display: block;
}

.mobile-nav-section--primary {
    display: flex;
    flex-direction: column;
    gap: 12px;
    border-bottom: 0;
    padding-bottom: 0;
}

.mobile-primary-menu,
.mobile-primary-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-primary-menu {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mobile-primary-menu > li {
    margin: 0;
}

.mobile-primary-menu > li > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 18px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.05);
    color: var(--lse-white);
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: none;
    transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

.mobile-primary-menu > li > a:hover,
.mobile-primary-menu > li > a:focus,
.mobile-primary-menu > li > a:focus-visible {
    color: var(--lse-white);
    background: rgba(106, 202, 243, 0.18);
    border-color: rgba(255, 255, 255, 0.32);
    outline: none;
}

.mobile-primary-menu li.menu-item-has-children > a::after {
    content: '\25BC';
    font-size: 12px;
    margin-left: 12px;
    color: rgba(255, 255, 255, 0.7);
}

.mobile-primary-menu .sub-menu {
    border: 0;
    padding: 0 18px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.mobile-primary-menu .sub-menu li {
    border: 0;
    margin: 0;
}

.mobile-primary-menu .sub-menu a {
    display: block;
    padding: 0;
    font-size: 15px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    transition: color 0.3s ease;
}

.mobile-primary-menu .sub-menu a:hover,
.mobile-primary-menu .sub-menu a:focus,
.mobile-primary-menu .sub-menu a:focus-visible {
    color: var(--lse-white);
    outline: none;
}

.mobile-primary-menu #menu-item-6242 > a {
    background: linear-gradient(135deg, var(--lse-primary-magenta) 0%, #ff1a94 100%);
    padding: 16px 20px;
    border-radius: 999px;
    border: 0;
    justify-content: center;
    color: var(--lse-white) !important;
    font-weight: 600;
    box-shadow: 0 8px 20px rgba(230, 0, 126, 0.35);
    width: 100%;
    text-align: center;
    text-transform: none !important;
    letter-spacing: 0.04em !important;
}

.mobile-primary-menu #menu-item-6242 > a:hover,
.mobile-primary-menu #menu-item-6242 > a:focus,
.mobile-primary-menu #menu-item-6242 > a:focus-visible {
    color: var(--lse-white) !important;
    border: 0;
}


.mobile-nav-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 24px 28px;
    background: rgba(6, 18, 54, 0.96);
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    position: sticky;
    top: 0;
    z-index: 2;
    box-sizing: border-box;
}

.mobile-nav-languages {
    flex: 1 1 auto;
}

.mobile-nav-section--languages {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mobile-language-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: var(--lse-white);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.02em;
    cursor: pointer;
    text-align: left;
    transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

.mobile-language-toggle:hover,
.mobile-language-toggle:focus,
.mobile-language-toggle:focus-visible {
    background: rgba(106, 202, 243, 0.2);
    border-color: rgba(255, 255, 255, 0.36);
    color: var(--lse-white);
    outline: none;
}

.mobile-language-label {
    color: inherit;
    flex: 1 1 auto;
    text-transform: none;
}

.mobile-language-icon {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
    position: relative;
    flex-shrink: 0;
}

.mobile-language-icon::before,
.mobile-language-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 1.5px;
    background: currentColor;
    transform: translate(-50%, -50%) rotate(45deg);
    transition: transform 0.3s ease;
}

.mobile-language-icon::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.mobile-nav-section--languages.is-open .mobile-language-icon::before {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.mobile-nav-section--languages.is-open .mobile-language-icon::after {
    transform: translate(-50%, -50%) rotate(45deg);
}

.mobile-language-menu {
    list-style: none;
    margin: 8px 0 0;
    padding: 8px 0;
    display: none;
    flex-direction: column;
    gap: 4px;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    background: rgba(6, 18, 54, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 12px;
    box-shadow: 0 16px 30px rgba(0, 0, 0, 0.35);
    z-index: 5;
}

.mobile-language-menu[hidden] {
    display: none;
}

.mobile-nav-section--languages.is-open .mobile-language-menu {
    display: flex;
}

.mobile-language-option {
    margin: 0;
}

.mobile-language-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    transition: color 0.3s ease, background 0.3s ease;
}

.mobile-language-link:hover,
.mobile-language-link:focus,
.mobile-language-link:focus-visible {
    color: var(--lse-white);
    background: rgba(106, 202, 243, 0.12);
    outline: none;
}

.mobile-language-option.is-active .mobile-language-link {
    color: var(--lse-white);
    font-weight: 600;
    background: rgba(255, 255, 255, 0.08);
}

.mobile-language-flag {
    width: 18px;
    height: 12px;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18);
    flex-shrink: 0;
}

.mobile-language-name {
    color: inherit;
    text-transform: none;
}

.mobile-nav-heading {
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0 0 16px;
    color: rgba(255, 255, 255, 0.7);
}

.mobile-brand-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mobile-brand-item {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.02);
}

.mobile-brand-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    background: transparent;
    border: 0;
    color: var(--lse-white);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease, color 0.3s ease;
}

.mobile-brand-toggle:hover,
.mobile-brand-toggle:focus,
.mobile-brand-toggle:focus-visible {
    background: rgba(106, 202, 243, 0.1);
    color: var(--lse-tertiary-blue);
    outline: none;
}

.mobile-brand-icon {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    position: relative;
    flex-shrink: 0;
}

.mobile-brand-icon::before,
.mobile-brand-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 2px;
    background: currentColor;
    transform: translate(-50%, -50%);
}

.mobile-brand-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.mobile-brand-toggle.is-open .mobile-brand-icon::after {
    opacity: 0;
}

.mobile-brand-panel {
    display: none;
    padding: 0 16px 16px;
    background: rgba(0, 0, 50, 0.35);
}

[data-mobile-brand-panel][hidden] {
    display: none !important;
}

.mobile-brand-panel .mobile-brand-link {
    margin: 16px 0 8px;
}

.mobile-brand-panel .mobile-brand-link a {
    color: var(--lse-white);
    font-weight: 600;
    text-decoration: none;
}

.mobile-brand-panel .mobile-brand-link a:hover,
.mobile-brand-panel .mobile-brand-link a:focus,
.mobile-brand-panel .mobile-brand-link a:focus-visible {
    color: var(--lse-white);
    text-decoration: underline;
    outline: none;
}

.mobile-brand-panel .mobile-brand-widgets {
    display: grid;
    gap: 12px;
}

.mobile-brand-panel .menu_widget,
.mobile-brand-panel .menu_widget ul,
.mobile-brand-panel .menu_widget li {
    float: none !important;
}

.mobile-brand-panel .menu_widget ul {
    padding: 0;
    list-style: none;
}

.mobile-brand-panel .menu_widget ul li a {
    display: block;
    padding: 8px 0;
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    font-size: 15px;
}

.mobile-brand-panel .menu_widget ul li a:hover {
    color: var(--lse-tertiary-blue);
}

.mobile-nav-close {
    position: static;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: var(--lse-white);
    width: 44px;
    height: 44px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 28px;
    line-height: 1;
    transition: transform 0.2s ease, color 0.2s ease, background 0.2s ease;
    flex-shrink: 0;
}

.mobile-nav-close:hover,
.mobile-nav-close:focus,
.mobile-nav-close:focus-visible {
    color: var(--lse-tertiary-blue);
    background: rgba(106, 202, 243, 0.18);
    transform: rotate(90deg);
    outline: none;
}

@media (max-width: 767px) {
    .site_navigation.desk {
        display: none;
    }

    .menu_icon.nav-toggle {
        display: inline-flex;
        visibility: visible;
        opacity: 1;
    }

    .header_nav {
        display: none !important;
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
    }

    .site_navigation.mob {
        display: flex !important; /* Override parent theme responsive.css which hides drawer at 560-767px */
        width: 100%;
    }

    .mobile-nav-scroll {
        padding: 28px 20px 36px;
        gap: 24px;
    }

    .header_bottom {
        position: relative;
        z-index: 1001;
    }

    .header_bottom .grid {
        flex-wrap: nowrap;
        gap: 16px;
    }

    .header_controls {
        margin-bottom: 0;
        flex: 1 1 auto;
        justify-content: flex-end;
        max-width: 100%;
        flex-wrap: nowrap;
    }

    .logo img {
        max-height: 60px;
    }

    .header-cta {
        font-size: 0.75rem;
        padding: 6px 12px;
        box-shadow: 0 6px 16px rgba(230, 0, 126, 0.22);
        max-width: 150px;
        white-space: nowrap;
    }

    body .header.sticky .header-cta {
        display: inline-flex;
    }

    .header_bottom .grid__item {
        flex: 0 0 auto;
        max-width: 100%;
    }

    .header_bottom .grid__item.lap--eight-tenths,
    .header_bottom .grid__item.desk--eight-tenths {
        flex: 1 1 auto;
        min-width: 0;
    }

body.mobile-nav-open {
    overflow: hidden;
    position: fixed;
    inset: 0;
    width: 100%;
}

body.mobile-nav-open .header {
    z-index: 997 !important;
}

body.mobile-nav-open .header.sticky {
    box-shadow: none !important;
}

body.mobile-nav-open .header_top,
body.mobile-nav-open .top-bar {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    }

    body.mobile-nav-open .header_bottom .logo,
    body.mobile-nav-open .header_bottom .grid__item:first-child {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.25s ease, visibility 0.25s ease;
    }

    body.mobile-nav-open .header_bottom .grid__item:first-child {
        display: none;
    }
}

@media (max-width: 1024px) {
    .header_top {
        display: none !important;
    }
}

@media (min-width: 768px) {
    .header_controls {
        margin-bottom: 0;
    }

    .header-cta {
        display: none;
    }
}

/* DISABLED: Tablet hamburger (769-1024px) - now using desktop nav at 768+
@media (min-width: 769px) and (max-width: 1024px) {
    .menu_icon.nav-toggle {
        visibility: visible;
        opacity: 1;
    }

    .site_navigation.desk {
        display: none;
    }

    .site_navigation.mob {
        width: 360px;
    }

    body.mobile-nav-open {
        overflow: hidden;
        position: fixed;
        inset: 0;
        width: 100%;
    }

    body.mobile-nav-open .header_top,
body.mobile-nav-open .top-bar {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    body.mobile-nav-open .header_bottom .logo,
    body.mobile-nav-open .header_bottom .grid__item:first-child {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.25s ease, visibility 0.25s ease;
    }

    body.mobile-nav-open .header_bottom .grid__item:first-child {
        display: none;
    }

    .mobile-nav-scroll {
        padding: 40px 32px 44px;
    }
}
*/

@media (min-width: 1025px) {
    .menu_icon.nav-toggle,
    .mobile-nav-overlay,
    .mobile-nav-close {
        display: none;
    }

    .site_navigation.mob {
        display: none;
    }

    .site_navigation.desk {
        display: block;
    }
}

.touch-device .menu_icon.nav-toggle {
    --nav-toggle-size: 52px;
    width: var(--nav-toggle-size);
    height: var(--nav-toggle-size);
    min-width: var(--nav-toggle-size);
    min-height: var(--nav-toggle-size);
}

.slow-connection .site_navigation.mob,
.slow-connection .menu_icon.nav-toggle,
.slow-connection .mobile-nav-overlay {
    transition: none;
}

.css-fallback .site_navigation.mob {
    position: absolute;
    right: -300px;
}

.css-fallback .site_navigation.mob.is-open {
    right: 0;
}

.css-fallback .menu_icon.nav-toggle::before,
.css-fallback .menu_icon.nav-toggle::after {
    display: none;
}

.css-fallback .menu_icon.nav-toggle {
    background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px 24px;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .course-card,
    .course-image img,
    .course-card .cta-button {
        transition: none;
    }

    .course-badge.special-offer {
        animation: none;
    }

    .course-card:hover {
        transform: none;
    }

    .site_navigation.mob,
    .mobile-nav-overlay,
    .menu_icon.nav-toggle,
    .mobile-brand-toggle,
    .mobile-brand-panel,
    .mobile-primary-menu a {
        transition: none;
    }

    .menu_icon.nav-toggle:hover,
    .mobile-primary-menu a:hover,
    .mobile-brand-toggle:hover {
        transform: none;
    }
}

@media (prefers-contrast: high) {
    .menu_icon.nav-toggle {
        border: 3px solid var(--lse-white);
    }

    .mobile-primary-menu > li {
        border-bottom: 2px solid rgba(255, 255, 255, 0.3);
    }

    .mobile-nav-overlay {
        background: rgba(0, 0, 0, 0.9);
    }
}

@media print {
    .no-print,
    .site-header,
    .site-footer,
    .navigation,
    button,
    .btn {
        display: none !important;
    }

    body {
        color: #000000 !important;
        background: #ffffff !important;
    }

    .menu_icon.nav-toggle,
    .site_navigation.mob,
    .mobile-nav-overlay,
    .mobile-nav-close {
        display: none !important;
    }
}

@supports (padding: max(0px)) {
    .site_navigation.mob {
        padding-left: max(24px, env(safe-area-inset-left));
        padding-right: max(24px, env(safe-area-inset-right));
    }

    .mobile-nav-header {
        padding-left: max(24px, env(safe-area-inset-left));
        padding-right: max(24px, env(safe-area-inset-right));
        padding-top: max(20px, env(safe-area-inset-top));
    }
}

/* Default colour palette (raspberry theme) */
.site_navigation ul li,
.site_navigation ul li .megamenu {
    background: #cc3366;
}

.site_navigation ul li.lsr,
.site_navigation ul li.lsr .megamenu {
    background: #684f6d;
}

.site_navigation ul li.sel,
.site_navigation ul li.sel .megamenu {
    background: #356045;
}

.site_navigation ul li.gs,
.site_navigation ul li.gs .megamenu {
    background: #9c1428;
}

/* Contextual palette overrides (lifted from custom.css) */
.lhs .site_navigation ul li,
.lsr .site_navigation ul li,
.sel .site_navigation ul li,
.gs .site_navigation ul li,
.lhs .site_navigation ul li .megamenu,
.lsr .site_navigation ul li .megamenu,
.sel .site_navigation ul li .megamenu,
.gs .site_navigation ul li .megamenu {
    background: #424564;
}

.lhs .site_navigation ul li.lsr,
.lsr .site_navigation ul li.lsr,
.sel .site_navigation ul li.lsr,
.gs .site_navigation ul li.lsr,
.lhs .site_navigation ul li.lsr .megamenu,
.lsr .site_navigation ul li.lsr .megamenu,
.sel .site_navigation ul li.lsr .megamenu,
.gs .site_navigation ul li.lsr .megamenu {
    background: #684f6d;
}

.lhs .site_navigation ul li.sel,
.lsr .site_navigation ul li.sel,
.sel .site_navigation ul li.sel,
.gs .site_navigation ul li.sel,
.lhs .site_navigation ul li.sel .megamenu,
.lsr .site_navigation ul li.sel .megamenu,
.sel .site_navigation ul li.sel .megamenu,
.gs .site_navigation ul li.sel .megamenu {
    background: #356045;
}

.lhs .site_navigation ul li.gs,
.lsr .site_navigation ul li.gs,
.sel .site_navigation ul li.gs,
.gs .site_navigation ul li.gs,
.lhs .site_navigation ul li.gs .megamenu,
.lsr .site_navigation ul li.gs .megamenu,
.sel .site_navigation ul li.gs .megamenu,
.gs .site_navigation ul li.gs .megamenu {
    background: #9c1428;
}

/* Responsive adjustments */
@media (max-width: 1199px) {
    .header_top {
        padding: 10px 0;
    }

    .header_bottom {
        min-height: 88px;
        padding-top: 20px;
    }

    .header_nav {
        padding: 6px 0 0 32px;
    }

    .header_nav ul li {
        padding-left: 28px;
        font-size: 16px;
    }

    #lang_sel {
        position: static;
        left: auto;
        top: auto;
    }

    .language_option {
        height: auto;
    }

    .language_option #lang_sel ul ul,
    .language_option #lang_sel ul li li {
        width: 135px;
    }

    .language_option #lang_sel ul li a {
        font-size: 14px;
        line-height: 18px;
        padding: 8px 14px 9px;
    }

    .language_option img {
        margin: 4px 10px 0 0;
    }

    .site_navigation ul li .megamenu {
        width: 980px;
    }
}

@media (max-width: 1024px) {
    .header_top {
        padding: 10px 0;
    }

    .top_menu ul li {
        font-size: 14px;
        padding: 0 8px 0 0;
    }

    .header_bottom {
        min-height: 80px;
        padding-top: 16px;
    }

    .header_nav {
        padding: 4px 0 0 24px;
    }

    .header_nav ul li {
        padding-left: 20px;
        font-size: 15px;
    }

    .header_social a {
        margin-left: 25px;
    }

    .language_option {
        width: auto;
    }

    #lang_sel {
        position: static;
        left: auto;
        top: auto;
    }

    .site_navigation ul li {
        font-size: 15px;
        line-height: 50px;
    }

    .site_navigation ul li i {
        margin-left: 3px;
    }

    .site_navigation ul li .megamenu {
        top: 50px;
        width: 833px;
        padding: 0 20px;
    }

    .megamenu .menu_widget {
        width: 33.333%;
        padding: 24px 0;
    }

    .megamenu .menu_widget h3 {
        font-size: 18px;
    }

    .megamenu .menu_widget ul li {
        font-size: 14px;
        margin-bottom: 10px;
    }
}

@media (max-width: 900px) {
    .header_top {
        padding: 8px 0;
    }

    .top_menu ul {
        gap: 8px 12px;
    }

    .top_menu ul li {
        font-size: 12px;
        padding-right: 0;
    }

    .top_menu ul li a::before {
        font-size: 12px;
    }

    .language_option a {
        padding: 7px 9px;
        font-size: 12px;
    }

    .language_option img {
        margin-right: 6px;
        margin-top: 3px;
    }

    .header_top .grid__item:last-child {
        justify-content: flex-start;
        gap: 12px;
    }

    .header_top .header_social {
        gap: 12px;
    }

    .header_bottom {
        min-height: 68px;
        padding-top: 14px;
    }

    .header_nav {
        padding: 0 0 0 18px;
    }

    .header_nav ul li {
        padding-left: 14px;
        font-size: 14px;
    }

    #lang_sel {
        position: static;
        left: auto;
        top: auto;
    }

    .site_navigation ul li {
        width: 33.333%;
        font-size: 14px;
        line-height: 44px;
    }

    .site_navigation ul li .megamenu {
        width: calc(100vw - 40px);
    }
}

@media (max-width: 767px) {
    .header_top {
        padding: 8px 0;
    }

    .top_menu ul {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .top_menu ul li {
        font-size: 10px;
        padding: 0;
    }

    .top_menu ul li a::before {
        font-size: 9px;
        top: 1px;
    }

    .language_option a {
        padding: 5px 7px;
        font-size: 10px;
    }

    .language_option img {
        margin-right: 8px;
    }

    .header_top .grid__item:last-child {
        align-items: flex-start;
        gap: 8px;
    }

    .header_top .header_social {
        gap: 10px;
    }

    .header_bottom {
        min-height: 60px;
        padding-top: 12px;
    }

    .header_nav {
        width: 100%;
        padding: 0;
        margin: 5px 0;
        text-align: right;
    }

    .header_nav ul {
        width: 100%;
    }

    .header_nav ul li {
        float: none;
        font-size: 15px;
        padding: 0 !important;
    }

    .header_nav ul li a {
        padding: 6px 10px;
    }

    #lang_sel {
        position: static;
        left: auto;
        top: auto;
        width: 100%;
    }

    .language_option #lang_sel ul ul,
    .language_option #lang_sel ul li li {
        width: 115px;
    }

    .language_option #lang_sel ul li a {
        font-size: 12px;
        line-height: 17px;
        padding: 6px 9px;
    }

    .site_navigation.desk {
        display: none;
    }

    .site_navigation.mob {
        display: block;
    }

    .site_navigation ul {
        display: block;
    }

    .site_navigation ul li {
        float: none;
        width: 100%;
        font-size: 13px;
        line-height: 40px;
        letter-spacing: 2px;
        position: relative;
    }

    .site_navigation ul li i {
        margin-left: 1px;
        top: 0;
    }

    .site_navigation ul li .megamenu {
        position: static;
        top: auto;
        width: 100%;
        padding: 15px;
    }

    .megamenu .menu_widget {
        width: 100%;
        padding: 14px 0;
    }
}

@media (max-width: 480px) {
    .top_menu ul li {
        font-size: 9px;
        padding-left: 6px;
    }

    .top_menu ul li:first-child {
        padding-right: 6px;
    }

    .top_menu ul li a::before {
        font-size: 9px;
    }

    .site_navigation ul li {
        font-size: 12px;
        line-height: 35px;
    }

    .site_navigation ul li .megamenu {
        padding: 12px;
    }
}

@media (max-width: 640px) {
    #lang_sel {
        position: static;
        left: auto;
        top: auto;
        width: 100%;
    }

    .language_option {
        margin: 0;
        width: auto;
    }

    .language_option #lang_sel ul ul,
    .language_option #lang_sel ul li li {
        width: 128px;
    }

    .language_option #lang_sel ul li a {
        font-size: 13px;
        line-height: 15px;
        padding: 7px 10px;
    }
}
.text-muted {
    color: var(--lse-neutral-gray) !important;
}

/* ── Accessible Focus Indicators (WCAG 2.1 §2.4.7) ──
   :focus-visible = keyboard-only (Tab/arrow) — mouse clicks don't trigger.
   !important overrides the ~30 'outline: none' rules scattered throughout
   the parent + child theme, ensuring keyboard users always see a ring.
   Form inputs use :focus (not :focus-visible) so the ring shows on click too. */
*:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue) !important;
    outline-offset: 2px !important;
}

/* Form inputs: visible ring on all focus (keyboard + mouse click) */
input:focus,
select:focus,
textarea:focus {
    outline: 2px solid var(--lse-tertiary-blue);
    outline-offset: 1px;
}

@media (prefers-contrast: high) {
    :root {
        --lse-primary-magenta: #C5005A;
        --lse-secondary-orange: #D66100;
        --lse-tertiary-blue: #0080CC;
        --lse-structure-navy: #000000;
    }
}

.course_search_form .btn,
.course_finder_btn {
    background-color: var(--lse-primary-magenta) !important;
    border-color: var(--lse-primary-magenta) !important;
}

.school_grid_item,
.course_grid_item {
    border: 2px solid var(--lse-light-gray);
    transition: all 0.3s ease;
}

.school_grid_item:hover,
.course_grid_item:hover {
    border-color: var(--lse-tertiary-blue);
    box-shadow: 0 6px 20px rgba(106, 202, 243, 0.2);
}

.acf-field .button,
.acf-frontend-form .button {
    background-color: var(--lse-secondary-orange) !important;
    border-color: var(--lse-secondary-orange) !important;
}

.ls-slide .ls-btn,
.layerslider .ls-btn {
    background-color: var(--lse-primary-magenta) !important;
    color: var(--lse-white) !important;
}

/* Override parent theme brand.css navy background for contact form submit */
.sel .contact_form .wpcf7-form .wpcf7-submit,
.sel2 .contact_form .wpcf7-form .wpcf7-submit,
.sel .contact_form .wpcf7 .wpcf7-submit,
.sel2 .contact_form .wpcf7 .wpcf7-submit,
.sel .contact_form input[type="submit"].wpcf7-submit,
.sel2 .contact_form input[type="submit"].wpcf7-submit,
.sel .contact_form input[type="submit"],
.sel2 .contact_form input[type="submit"],
.contact_form .wpcf7-form .wpcf7-submit,
.contact_form .wpcf7 .wpcf7-submit,
.wpcf7-form .wpcf7-submit,
.wpforms-submit,
.contact_form input[type="submit"].wpcf7-submit {
    background-color: transparent !important;
    background-image: linear-gradient(135deg, #EE7218 0%, #E6007E 100%) !important;
    border: none !important;
    color: #ffffff !important;
    padding: 12px 28px;
    border-radius: 999px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: normal;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 10px 24px rgba(238, 114, 24, 0.25);
}

.sel .contact_form .wpcf7-form .wpcf7-submit:hover,
.sel2 .contact_form .wpcf7-form .wpcf7-submit:hover,
.sel .contact_form input[type="submit"]:hover,
.sel2 .contact_form input[type="submit"]:hover,
.wpcf7-form .wpcf7-submit:hover,
.wpforms-submit:hover {
    background: linear-gradient(135deg, #EE7218 0%, #E6007E 100%) !important;
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(230, 0, 126, 0.25);
}

/* TERTIARY: Utility CTAs (filters, load more, add to compare) */
.clear-filters-btn,
.apply-filters-btn,
.advanced-filters-toggle,
.clear-all-filters,
.load-more-btn,
.clear-comparison,
button.clear-filters-btn,
button.apply-filters-btn,
button.advanced-filters-toggle,
.ukse-btn.ukse-btn--tertiary {
    background-color: var(--lse-secondary-orange);
    border: 1px solid var(--lse-secondary-orange);
    color: #ffffff;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 6px;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.clear-filters-btn:hover,
.apply-filters-btn:hover,
.advanced-filters-toggle:hover,
.clear-all-filters:hover,
.load-more-btn:hover,
.clear-comparison:hover,
button.clear-filters-btn:hover,
button.apply-filters-btn:hover,
button.advanced-filters-toggle:hover,
.ukse-btn.ukse-btn--tertiary:hover,
.ukse-btn.ukse-btn--tertiary:focus {
    background-color: rgba(238, 114, 24, 0.85);
    border-color: var(--lse-secondary-orange);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(238, 114, 24, 0.25);
}

/* Finder utility buttons – layout & orange borders */
.load-more-btn,
.advanced-filters-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.75rem;
    line-height: 1.2;
}

.load-more-btn,
.load-more-btn:hover,
.load-more-btn:focus,
.advanced-filters-toggle,
.advanced-filters-toggle:hover,
.advanced-filters-toggle:focus {
    border-color: var(--lse-secondary-orange) !important;
}

body.home .home-hero {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
}

.home-hero {
    padding: 0 !important;
}

.button.button--small {
    border-radius: 8px;
    padding: 10px 16px;
    font-size: 0.9rem;
}

/* UKSE Course Metadata Enhancements */
.course-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.course-badge--fallback {
    background-color: #F3F4F6;
    color: #6B7280;
    border: 1px solid #E5E7EB;
    font-weight: 500;
    margin-left: 0.5rem;
}

.ukse-schools-hero {
    padding: 0;
    position: relative;
    overflow: hidden;
    background-color: #f4f8fb;
}

.ukse-schools-hero__wrap {
    display: flex;
    align-items: stretch;
    gap: 2rem;
}

.ukse-schools-hero__content {
    flex: 1;
    max-width: 640px;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.ukse-schools-hero__title {
    font-size: clamp(2.25rem, 4vw, 3rem);
    margin-bottom: 1.25rem;
    color: #091a3f;
}

.ukse-schools-hero__intro {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #13315c;
}

.ukse-schools-hero__intro p {
    margin-bottom: 1rem;
}

.ukse-schools-hero__intro p:last-child {
    margin-bottom: 0;
}

.ukse-schools-hero__cta {
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}

.ukse-schools-hero__cta .button {
    padding: 0.85rem 1.75rem;
    font-size: 1rem;
    border-radius: 999px;
    box-shadow: 0 12px 30px rgba(9, 26, 63, 0.12);
}

.ukse-schools-hero__media {
    flex: 0 0 40%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.ukse-schools-hero__media img {
    max-width: 100%;
    max-height: none;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 24px;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
}

@media (max-width: 900px) {
    .ukse-schools-hero__wrap {
        flex-direction: column;
        text-align: center;
    }

    .ukse-schools-hero__media {
        text-align: center;
        width: 100%;
    }

    .ukse-schools-hero__content {
        max-width: 100%;
    }
}

.ukse-cities-hero {
    padding: 0;
    background: linear-gradient(135deg, rgba(1, 66, 141, 0.05), rgba(244, 248, 251, 0.9));
    position: relative;
    overflow: hidden;
}

.ukse-cities-hero__wrap {
    display: flex;
    align-items: stretch;
    gap: 2rem;
}

.ukse-cities-hero__content {
    flex: 1;
    max-width: 620px;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.ukse-cities-hero__title {
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    margin-bottom: 1rem;
    color: #071534;
}

.ukse-cities-hero__intro {
    font-size: 1.05rem;
    line-height: 1.7;
    color: #1e2d52;
}

.ukse-cities-hero__cta {
    margin-top: 1.5rem;
}

.ukse-cities-hero__media {
    flex: 0 0 38%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.ukse-cities-hero__media img {
    max-width: 100%;
    max-height: none;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 20px;
    box-shadow: 0 20px 45px rgba(7, 21, 52, 0.25);
}

@media (max-width: 900px) {
    .ukse-cities-hero__wrap {
        flex-direction: column;
        text-align: center;
    }

    .ukse-cities-hero__media {
        text-align: center;
        width: 100%;
    }

    .ukse-cities-hero__content {
        max-width: 100%;
    }
}

.ukse-city-single-hero {
    width: 100%;
    padding: 4rem 0 4.5rem;
    background-color: #f5f7fb;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
}

.ukse-city-single-hero__inner {
    display: flex;
    align-items: center;
    gap: 3rem;
}

.ukse-city-single-hero__content {
    flex: 1;
    max-width: 640px;
}

.ukse-city-single-hero__eyebrow {
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #e6007e;
    margin: 0 0 0.75rem;
}

.ukse-city-single-hero__title {
    font-size: clamp(2.2rem, 4vw, 3rem);
    margin: 0 0 0.85rem;
    color: #071534;
}

.ukse-city-single-hero__tagline {
    font-size: 1.2rem;
    color: #274064;
    margin: 0 0 1.25rem;
    font-weight: 600;
}

.ukse-city-single-hero__intro {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #263154;
}

.ukse-city-single-hero__intro p {
    margin-bottom: 1rem;
}

.ukse-city-single-hero__intro p:last-child {
    margin-bottom: 0;
}

.ukse-city-single-hero__cta {
    margin-top: 1.75rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.ukse-city-single-hero__cta .home-button {
    padding: 0.9rem 2rem;
    border-radius: 999px;
    box-shadow: 0 20px 45px rgba(9, 26, 63, 0.15);
}

/* City Enquiry CTA (below tabs section) */
.city-enquiry-cta {
    margin-top: 2.5rem;
    text-align: center;
}

.city-enquiry-cta .home-button {
    padding: 0.9rem 2rem;
    border-radius: 999px;
}

.ukse-city-single-hero__media {
    flex: 0 0 38%;
    text-align: right;
}

.ukse-city-single-hero__media img {
    max-width: 100%;
    height: auto;
    border-radius: 24px;
    box-shadow: 0 24px 55px rgba(7, 21, 52, 0.2);
}

@media (max-width: 960px) {
    .ukse-city-single-hero__inner {
        flex-direction: column;
        text-align: center;
    }

    .ukse-city-single-hero__media {
        text-align: center;
        width: 100%;
    }

    .ukse-city-single-hero__content {
        max-width: 100%;
    }
}

.ukse-city-single-content {
    width: 100%;
    padding: 3rem 0;
    background: transparent;
}

.ukse-city-single-content__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
    font-size: 1.05rem;
    line-height: 1.85;
    color: #2c3654;
}

.ukse-city-single-content__inner > *:first-child {
    margin-top: 0;
}

.ukse-city-single-content__inner p {
    margin-bottom: 1.5rem;
}

.ukse-city-single-content__inner p:last-child {
    margin-bottom: 0;
}

.ukse-city-single-schools {
    padding: 4rem 0 4.5rem;
    background: transparent;
}

.ukse-city-single-schools__inner {
    background: transparent;
}

.ukse-city-single-schools__header {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 2.5rem;
    background: transparent;
}

.ukse-city-single-schools__title {
    font-size: clamp(2rem, 3vw, 2.5rem);
    margin-bottom: 0.75rem;
    color: #091a3f;
}

.ukse-city-single-schools__intro {
    font-size: 1.05rem;
    color: #4d5a75;
    margin: 0;
}

.ukse-city-single-schools__empty {
    text-align: center;
    font-size: 1.05rem;
    color: #4d5a75;
    margin-top: 1rem;
}

.ukse-city-single-schools__cta {
    margin-top: 1.25rem;
}

.ukse-schools-list {
    padding: 4rem 0;
    background: #f9fbfd;
}

.ukse-schools-list__inner {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.ukse-schools-list__header {
    text-align: center;
    max-width: 720px;
    margin: 0 auto;
    background: transparent !important;
}

.ukse-schools-list__title {
    font-size: clamp(2rem, 3vw, 2.75rem);
    margin-bottom: 0.75rem;
    color: #091a3f;
}

.ukse-schools-list__intro {
    font-size: 1.05rem;
    color: #4d5a75;
}

.ukse-schools-list__filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    background: #fff;
    padding: 1.5rem;
    border-radius: 20px;
    box-shadow: 0 20px 50px rgba(9, 26, 63, 0.08);
}

.ukse-schools-filter label,
.ukse-schools-filter__label {
    font-weight: 600;
    display: block;
    margin-bottom: 0.35rem;
    color: #091a3f;
}

.ukse-schools-filter select {
    width: 100%;
    border: 1px solid rgba(9, 26, 63, 0.15);
    border-radius: 50px;
    padding: 0.65rem 1rem;
    font-size: 1rem;
    background: #fff;
}

.ukse-schools-filter__options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    font-size: 0.95rem;
    color: #4d5a75;
}

.ukse-schools-filter__options label {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    cursor: not-allowed;
}

.ukse-schools-filter--cta {
    display: flex;
    align-items: stretch;
}

.ukse-schools-filters__actions {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.ukse-schools-filters__apply {
    width: 100%;
}

.ukse-apply-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 0.75rem 1.75rem;
    border-radius: 999px;
    border: none;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.95rem;
    background-image: linear-gradient(135deg, #ff7a18, #e6007e);
    color: #fff;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.16);
    transition: transform 150ms ease, box-shadow 150ms ease;
}

.ukse-apply-button:hover {
    background-image: linear-gradient(135deg, #ff7a18, #e6007e);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
}

.ukse-apply-button:focus-visible {
    box-shadow: 0 0 0 2px rgba(230, 0, 126, 0.35);
}

.ukse-apply-button:active {
    transform: translateY(0);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}

.ukse-schools-filters__clear {
    background: transparent;
    border: none;
    color: #4d5a75;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
    padding: 0.35rem 0;
    transition: color 150ms ease;
    align-self: center;
}

.ukse-schools-filters__clear:hover,
.ukse-schools-filters__clear:focus {
    color: #091a3f;
}

.ukse-schools-filters__clear:focus {
    outline: 2px solid rgba(9, 26, 63, 0.3);
    outline-offset: 2px;
}

.ukse-schools-list__results {
    margin-top: 0.5rem;
}

.ukse-schools-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 340px));
    gap: 1.5rem;
    justify-content: center;
}

.ukse-school-card {
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 25px 60px rgba(9, 26, 63, 0.08);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
    gap: 0;
}

.ukse-school-card__media img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}

.ukse-school-card__body {
    padding: 1.5rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ukse-school-card__logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0.5rem 1rem;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(9, 26, 63, 0.12);
    border: 1px solid rgba(9, 26, 63, 0.08);
    width: 100%;
    height: 72px;
    margin: 0 0 0.5rem;
}

.ukse-school-card__logo {
    max-width: 180px;
    height: auto;
    max-height: 52px;
    display: block;
    margin: 0 auto;
}

.ukse-school-card__title {
    font-size: 1.35rem;
    margin: 0;
    color: #091a3f;
}

.ukse-school-card__meta {
    color: #6a6f85;
    margin: 0;
    margin-top: -0.5rem;
    font-weight: 600;
}

.ukse-school-card__excerpt {
    color: #4d5a75;
    line-height: 1.6;
    font-size: 0.98rem;
    margin: 0;
    margin-top: -0.35rem;
}

.ukse-school-card__cta {
    padding: 0 1.5rem 1.5rem;
    margin-top: auto;
}

.ukse-school-card__cta .home-button {
    width: 100%;
    text-align: center;
    border-radius: 999px;
    display: inline-flex;
    justify-content: center;
}

.ukse-schools-list__empty {
    text-align: center;
    font-size: 1rem;
    color: #4d5a75;
    padding: 2rem 0;
}

@media (max-width: 720px) {
    .ukse-schools-list__filters {
        grid-template-columns: 1fr;
    }

    .ukse-school-card__media img {
        height: 200px;
    }
}

.ukse-cities-list {
    padding: 4rem 0 5rem;
    background: #ffffff;
}

.ukse-cities-list__inner {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.ukse-cities-list__header {
    text-align: center;
    max-width: 760px;
    margin: 0 auto;
}

.ukse-cities-list__title {
    font-size: clamp(2rem, 3vw, 2.5rem);
    color: #071534;
    margin-bottom: 0.75rem;
}

.ukse-cities-list__intro {
    font-size: 1rem;
    color: #4d5a75;
}

.ukse-cities-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
}

.ukse-city-card {
    background: #fff;
    border-radius: 20px;
    border: 1px solid rgba(7, 21, 52, 0.08);
    box-shadow: 0 20px 50px rgba(10, 40, 90, 0.08);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ukse-city-card__media {
    position: relative;
    overflow: hidden;
}

.ukse-city-card__image {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}

.ukse-city-card__image--placeholder {
    background: #eef3f8;
    color: #6c778f;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2rem;
    font-weight: 600;
    font-size: 1rem;
}

.ukse-city-card__body {
    padding: 1.75rem 1.5rem 1.25rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ukse-city-card__title {
    font-size: 1.3rem;
    margin: 0;
    color: #091a3f;
}

.ukse-city-card__meta {
    font-weight: 600;
    color: #62708f;
    margin: 0;
}

.ukse-city-card__excerpt {
    color: #46546f;
    line-height: 1.6;
    font-size: 0.98rem;
}

.ukse-city-card__footer {
    padding: 0 1.5rem 1.5rem;
    margin-top: auto;
}

.ukse-city-card__footer .home-button {
    width: 100%;
    text-align: center;
    border-radius: 999px;
}

.ukse-cities-list__empty {
    text-align: center;
    color: #4d5a75;
    font-size: 1rem;
    padding: 2rem 0;
}

@media (max-width: 720px) {
    .ukse-city-card__image {
        height: 200px;
    }
}

.ukse-course-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.75rem;
    margin-top: 0.75rem;
    font-size: 0.9rem;
}

.ukse-course-meta__item {
    background: #f7f9fc;
    border-radius: 8px;
    padding: 0.65rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-height: 84px;
}

.ukse-course-meta__label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #3a4b67;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ukse-course-meta__value {
    font-weight: 600;
    color: #09204f;
}

.course-calculator {
    margin-top: 1rem;
    background: #f7f9fc;
    border: 1px solid rgba(9, 32, 79, 0.08);
    border-radius: 12px;
    padding: 1rem;
}

.course-calculator__title {
    display: block;
    margin-bottom: 0.5rem;
    color: #09204f;
}

.course-calculator__label {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    font-weight: 600;
    color: #3a4b67;
}

.course-calculator__weeks {
    width: 100%;
    max-width: 120px;
    padding: 0.45rem 0.6rem;
    border-radius: 6px;
    border: 1px solid rgba(9, 32, 79, 0.2);
    font-size: 0.95rem;
}

.course-calculator__line {
    margin: 0.5rem 0;
    color: #09204f;
}

.course-calculator__line--total {
    font-weight: 700;
}

.course-calculator__fees,
.course-calculator__note {
    margin: 0.35rem 0 0;
    font-size: 0.8rem;
    color: #4f6283;
}

/* =========================================
   MOBILE STEPPER BUTTONS (+/-)
   Only visible on mobile viewports (<=1024px)
   ========================================= */

/* Hide steppers on desktop (default) */
.ukse-stepper-wrap {
    display: inline-flex;
    align-items: center;
    gap: 0;
}

.ukse-stepper {
    display: none; /* Hidden by default on desktop */
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid rgba(9, 32, 79, 0.2);
    background: #fff;
    font-size: 1.25rem;
    font-weight: 600;
    color: #09204f;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    transition: background-color 0.15s, border-color 0.15s;
}

.ukse-stepper--minus {
    border-radius: 6px 0 0 6px;
    border-right: none;
}

.ukse-stepper--plus {
    border-radius: 0 6px 6px 0;
    border-left: none;
}

.ukse-stepper:hover,
.ukse-stepper:focus {
    background: #f7f9fc;
    border-color: #09204f;
}

.ukse-stepper:active {
    background: #e8ecf2;
}

/* Input in stepper wrapper - adjust for mobile */
.ukse-stepper-wrap input[type="number"] {
    border-radius: 0;
    text-align: center;
}

/* Mobile-only: show steppers */
@media (max-width: 1024px) {
    .ukse-stepper {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Adjust weeks/hours input width in stepper context */
    .ukse-stepper-wrap .course-calculator__weeks,
    .ukse-stepper-wrap .course-calculator__hours,
    .ukse-stepper-wrap .ukse-weeks,
    .ukse-stepper-wrap .ukse-hours {
        width: 60px;
        min-width: 60px;
        max-width: 80px;
        height: 40px;
        border-radius: 0;
        border-left: none;
        border-right: none;
        font-size: 1rem;
        text-align: center;
    }

    /* Remove native number input spinners on mobile (use our steppers instead) */
    .ukse-stepper-wrap input[type="number"]::-webkit-inner-spin-button,
    .ukse-stepper-wrap input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .ukse-stepper-wrap input[type="number"] {
        -moz-appearance: textfield;
    }
}

/* Course card context: tighter spacing */
.course-card .ukse-stepper-wrap {
    margin: 0;
}

.course-card .ukse-stepper {
    width: 36px;
    height: 36px;
    font-size: 1.1rem;
}

@media (max-width: 1024px) {
    .course-card .ukse-stepper-wrap .course-calculator__weeks,
    .course-card .ukse-stepper-wrap .ukse-weeks {
        height: 36px;
        width: 50px;
        min-width: 50px;
    }
}

/* END MOBILE STEPPER BUTTONS */

.course-accommodation {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    padding: 0.75rem 0.875rem;
    border: 1px solid #f3ded0;
    border-radius: 0.75rem;
    background-color: #fff8f2;
}

.course-accommodation__media {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.course-accommodation__media img {
    max-width: 100%;
    height: auto;
}

.course-accommodation__content {
    flex: 1 1 auto;
}

.course-accommodation__text {
    margin: 0 0 0.5rem;
    font-size: 0.875rem;
    line-height: 1.4;
    color: #162330;
}

.course-accommodation__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 600;
    color: #ee7218;
    text-decoration: none;
}

.course-accommodation__cta:hover,
.course-accommodation__cta:focus {
    text-decoration: underline;
    color: #c45a12;
}

.course-accommodation__icon {
    font-size: 1rem;
    line-height: 1;
}

.course-calculator--compare {
    margin-top: 0.5rem;
}

@media (max-width: 640px) {
    .course-accommodation {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .course-accommodation__media {
        width: 40px;
        height: 40px;
    }
}

.school-courses-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1.5rem;
}

.school-courses-table th,
.school-courses-table td {
    padding: 0.75rem;
    text-align: left;
    border-bottom: 1px solid rgba(9, 32, 79, 0.08);
}

.school-courses-table th {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #3a4b67;
}

.school-courses-table td.course-meta-hours,
.school-courses-table td.course-meta-level,
.school-courses-table td.course-meta-price,
.school-courses-table td.course-meta-start {
    font-weight: 600;
    color: #09204f;
}

@media (max-width: 768px) {
    .ukse-course-meta {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    }

    .school-courses-table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}

/* --- Course comparison --- */
.ukse-compare-tray {
    position: fixed;
    left: 1.5rem;
    bottom: 1.5rem;
    z-index: 1050;
    width: min(100%, 320px);
    background: #ffffff;
    border: 1px solid #d8e2ec;
    border-radius: 0.875rem;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.15);
}

.ukse-compare-tray[hidden] {
    display: none;
}

.ukse-compare-tray__inner {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ukse-compare-tray__summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    color: #1f2a44;
}

.ukse-compare-tray__label {
    display: inline-flex;
    align-items: baseline;
    gap: 0.25rem;
    font-size: 0.95rem;
}

.ukse-compare-tray__count {
    color: #E6007E;
    font-weight: 700;
}

.ukse-compare-tray__clear {
    border: none;
    background: none;
    font-size: 0.85rem;
    color: #536176;
    cursor: pointer;
    text-decoration: underline;
}

.ukse-compare-tray__clear:disabled {
    opacity: 0.4;
    cursor: default;
    text-decoration: none;
}

.ukse-compare-tray__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.ukse-compare-tray__item {
    position: relative;
    flex: 1 1 calc(50% - 0.5rem);
    min-width: 140px;
    background: #f5f9fd;
    border-radius: 0.75rem;
    padding: 0.5rem 0.5rem 0.5rem 0.75rem;
    box-shadow: inset 0 0 0 1px rgba(100, 116, 139, 0.08);
}

.ukse-compare-tray__item:nth-child(odd) {
    background: #f0f7fe;
}

.ukse-compare-tray__remove {
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
    border: none;
    background: transparent;
    font-size: 1.1rem;
    line-height: 1;
    color: #61708a;
    cursor: pointer;
}

.ukse-compare-tray__remove:hover,
.ukse-compare-tray__remove:focus {
    color: #2f3b52;
}

.ukse-compare-tray__link {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    text-decoration: none;
    color: inherit;
}

/* Legacy thumb class (kept for backwards compatibility) */
.ukse-compare-tray__thumb {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: #e5eef6;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.95rem;
    color: #1f3b63;
    overflow: hidden;
}

.ukse-compare-tray__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* New stacked layout: logo wrap (hidden for now – text-only tray) */
.ukse-compare-tray__logo-wrap {
    display: none;
}

.ukse-compare-tray__logo {
    max-width: 75px;
    height: auto;
    max-height: 50px;
    object-fit: contain;
    border-radius: 6px;
    background-color: #fff;
}

/* Fallback avatar when no logo */
.ukse-compare-tray__avatar {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: #e5eef6;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1rem;
    color: #1f3b63;
}

/* Text block (stacked below logo) */
.ukse-compare-tray__text {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.ukse-compare-tray__course-title {
    font-size: 0.85rem;
    font-weight: 600;
    color: #142238;
    line-height: 1.25;
}

.ukse-compare-tray__school-name {
    font-size: 0.75rem;
    color: #4f5d73;
}

/* Legacy meta classes (kept for backwards compatibility) */
.ukse-compare-tray__meta {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.ukse-compare-tray__title {
    font-size: 0.9rem;
    font-weight: 600;
    color: #142238;
}

.ukse-compare-tray__school,
.ukse-compare-tray__city {
    font-size: 0.75rem;
    color: #4f5d73;
}

.ukse-compare-tray__actions {
    display: flex;
    justify-content: flex-end;
}

.ukse-compare-tray__cta {
    display: inline-block;
    padding: 0.65rem 1.25rem;
    background: linear-gradient(135deg, #E6007E 0%, #b8005f 100%);
    color: #fff !important;
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none !important;
    border-radius: 0.5rem;
    text-align: center;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ukse-compare-tray__cta:link,
.ukse-compare-tray__cta:visited {
    color: #fff !important;
}

.ukse-compare-tray__cta:hover,
.ukse-compare-tray__cta:focus {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(230, 0, 126, 0.3);
    color: #fff !important;
    filter: brightness(1.05);
}

.ukse-compare-tray__cta[aria-disabled="true"] {
    pointer-events: none;
    opacity: 0.55;
}

/* Tray header wrapper */
.ukse-compare-tray__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

/* Collapse/expand toggle button */
.ukse-compare-tray__toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: #f0f4f8;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.ukse-compare-tray__toggle:hover,
.ukse-compare-tray__toggle:focus {
    background: #e2e8f0;
}

.ukse-compare-tray__toggle-icon {
    font-size: 1rem;
    line-height: 1;
    color: #4a5568;
    transition: transform 0.2s ease;
}

.ukse-compare-tray--collapsed .ukse-compare-tray__toggle-icon {
    transform: rotate(180deg);
}

/* Collapsed state: hide list and actions */
.ukse-compare-tray--collapsed .ukse-compare-tray__list,
.ukse-compare-tray--collapsed .ukse-compare-tray__actions {
    display: none;
}

.ukse-compare__main {
    padding-bottom: 5rem;
}

.ukse-compare__section {
    margin-top: 1.5rem;
}

.ukse-compare__notice {
    border-radius: 0.75rem;
    padding: 1rem;
    margin-bottom: 1rem;
    font-size: 0.95rem;
}

.ukse-compare__notice--error {
    background: #fdecea;
    color: #7f1d1d;
}

.ukse-compare__notice--warning {
    background: #fff4e5;
    color: #7c3e04;
}

.ukse-compare__empty {
    padding: 1.5rem;
    background: #f1f6fb;
    border-radius: 0.85rem;
    font-size: 0.95rem;
}

.ukse-compare__empty p {
    margin: 0;
}

/* Compare page empty state (no courses selected) */
.ukse-compare-empty {
    max-width: 480px;
    margin: 3rem auto;
    padding: 2.5rem 2rem;
    background: #f8fafc;
    border-radius: 1rem;
    text-align: center;
}

.ukse-compare-empty__title {
    margin: 0 0 1rem;
    font-size: 1.5rem;
    font-weight: 600;
    color: #1f2a44;
}

.ukse-compare-empty__text {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    line-height: 1.6;
    color: #4b5563;
}

.ukse-compare-empty__cta {
    margin: 1.5rem 0 0;
}

.ukse-compare-table-wrapper {
    overflow-x: auto;
    border-radius: 1rem;
    box-shadow: inset 0 0 0 1px rgba(209, 213, 219, 0.5);
    background: #ffffff;
    -webkit-overflow-scrolling: touch; /* Smooth momentum scrolling on iOS */
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
}

.ukse-compare-table-wrapper::-webkit-scrollbar {
    height: 8px;
}

.ukse-compare-table-wrapper::-webkit-scrollbar-track {
    background: transparent;
}

.ukse-compare-table-wrapper::-webkit-scrollbar-thumb {
    background-color: #CBD5E1;
    border-radius: 4px;
}

.ukse-compare-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: auto;
    min-width: 720px;
}

.ukse-compare-table__course {
    min-width: 180px;
}

.ukse-compare-table th,
.ukse-compare-table td {
    border: 1px solid #e1e7ef;
    padding: 1rem;
    vertical-align: top;
    text-align: left;
}

.ukse-compare-table__feature {
    width: 220px;
    background: #f6f9fc;
    font-weight: 600;
    color: #1e2a3d;
}

.ukse-compare-table__course-header {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: flex-start;
}

.ukse-compare-table__course-title {
    font-weight: 700;
    font-size: 1.05rem;
    color: #1f2a44;
}

.ukse-compare-table__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1;
    color: #9CA3AF;
    background: #F3F4F6;
    border-radius: 50%;
    text-decoration: none;
    flex-shrink: 0;
    transition: background 0.15s ease, color 0.15s ease;
}

.ukse-compare-table__remove:hover,
.ukse-compare-table__remove:focus {
    color: #fff;
    background: #E6007E;
    text-decoration: none;
}

.ukse-compare-table__school {
    font-weight: 600;
    color: #1f2a44;
    text-decoration: none;
}

.ukse-compare-table__city {
    margin-top: 0.2rem;
    font-size: 0.85rem;
    color: #4f5d73;
}

.ukse-compare-table__price {
    font-weight: 700;
    color: #102246;
}

.ukse-compare-table__price-note {
    font-size: 0.85rem;
    color: #4f5d73;
}

.ukse-compare-table__flag {
    margin-top: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #E6007E;
}

/* Phase XVIII-E D2: School logo in compare table – stacked, centered layout */
#ukse-compare-page .ukse-compare__school {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.5rem;
}

#ukse-compare-page .ukse-compare__school-logo {
    width: 100px;
    height: 100px;
    object-fit: contain;
    border-radius: 8px;
    background-color: #fff;
}

#ukse-compare-page .ukse-compare__school-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
}

#ukse-compare-page .ukse-compare__school-name {
    font-weight: 600;
    color: #1f2a44;
    text-decoration: none;
}

#ukse-compare-page a.ukse-compare__school-name:hover,
#ukse-compare-page a.ukse-compare__school-name:focus {
    text-decoration: underline;
}

#ukse-compare-page .ukse-compare__school-city {
    font-size: 0.85rem;
    color: #6b7280;
}

/* Phase XVIII-E D2: Course description row */
.ukse-compare__cell--description {
    font-size: 0.9rem;
    line-height: 1.5;
    color: #374151;
}

/* Phase XVIII-E D3c: Actions row – stacked CTAs */
.ukse-compare__cell--actions .ukse-compare__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
}

.ukse-compare__cell--actions .home-button {
    width: 100%;
    text-align: center;
    font-size: 0.9rem;
    padding: 0.5rem 1rem;
}

/* Phase XVIII-E D2: Hide fees line on compare page only (hint stays visible) */
#ukse-compare-page .course-calculator__fees {
    display: none;
}

/* Phase XVIII-E D2: Global hint styling */
.course-calculator__hint {
    margin-top: 0.5rem;
    font-size: 0.85rem;
    line-height: 1.4;
    color: #6b7280;
}

/* Course cards: tighter, single-line hint */
.course-card .course-calculator__hint {
    margin-top: 0.25rem;
    font-size: 0.8rem;
    line-height: 1.3;
    white-space: nowrap;
}

/* Min/Max limits hint – smaller, muted text inline with weeks input */
.calc-hint__limits {
    display: inline-block;
    margin-left: 0.5rem;
    font-size: 0.8rem;
    font-weight: 400;
    color: #6B7280;
    white-space: nowrap;
}
.course-card .calc-hint__limits {
    font-size: 0.75rem;
}

/* Phase XVIII-E D2: Smaller hint on compare page */
#ukse-compare-page .course-calculator__hint {
    font-size: 0.8rem;
}

/* Phase XVIII-E D2: Emphasise summary headline on compare page (brand magenta + bold) */
#ukse-compare-page .course-calculator__headline {
    color: #E6007E;
    font-weight: 700;
}

/* Phase XVIII-E D2: Calculator text wrap & smaller font for compare page */
#ukse-compare-page .course-calculator__line,
#ukse-compare-page .course-calculator__line--price,
#ukse-compare-page .course-calculator__line--total {
    white-space: normal;
    flex-wrap: wrap;
    font-size: 0.88rem;
}

#ukse-compare-page .course-calculator__line span,
#ukse-compare-page .course-calculator__line strong,
#ukse-compare-page .course-calculator__label,
#ukse-compare-page .course-calculator__weekly {
    white-space: normal;
}

#ukse-compare-page .course-calculator__weeks {
    max-width: 100px;
}

/* Phase XVIII-E: Match course card spacing for weeks/hours label + control */
#ukse-compare-page .course-calculator__label {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
    font-weight: 600;
}

/* Desktop: equal column widths for course comparison */
@media (min-width: 901px) {
    .ukse-compare-table {
        table-layout: fixed;
    }
}

@media (max-width: 900px) {
    .ukse-compare-table {
        min-width: 800px;
    }

    .ukse-compare-table__feature {
        width: 140px;
    }

    .ukse-compare-table th,
    .ukse-compare-table td {
        padding: 0.75rem;
    }
}

@media (max-width: 782px) {
    /* Mobile tray: full-width bar docked to bottom of viewport */
    .ukse-compare-tray {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        max-width: 100%;
        border-radius: 1rem 1rem 0 0;
        border-bottom: none;
        z-index: 1050;
        box-shadow: 0 -4px 20px rgba(15, 23, 42, 0.12);
    }

    .ukse-compare-tray__inner {
        padding: 0.75rem 1rem 1rem;
        max-height: 60vh;
        overflow-y: auto;
    }

    .ukse-compare-tray__header {
        padding: 0.5rem 0;
    }

    .ukse-compare-tray__list {
        flex-direction: column;
        gap: 0.5rem;
    }

    .ukse-compare-tray__item {
        flex: 1 1 auto;
        min-width: 0;
        padding: 0.5rem 0.5rem 0.5rem 0.75rem;
    }

    .ukse-compare-tray__course-title {
        font-size: 0.8rem;
    }

    .ukse-compare-tray__school-name {
        font-size: 0.7rem;
    }

    /* Collapsed state on mobile: slim bar showing just header */
    .ukse-compare-tray--collapsed {
        box-shadow: 0 -2px 10px rgba(15, 23, 42, 0.08);
    }

    .ukse-compare-tray--collapsed .ukse-compare-tray__inner {
        padding: 0.5rem 1rem;
        max-height: none;
        overflow: visible;
    }

    /* CTA button full-width on mobile */
    .ukse-compare-tray__actions {
        justify-content: stretch;
    }

    .ukse-compare-tray__cta {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 600px) {
    .ukse-compare-table {
        min-width: 720px;
    }
}

/* === ABSOLUTE OVERRIDE: LANGUAGE NAME VISIBILITY & COLOUR === */
header .top-bar__lang .header-language-menu .screen-reader-text,
header .top-bar__lang .header-language-link .screen-reader-text {
  all: unset !important;
  display: inline !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding-left: 6px !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
  color: #FF9F40 !important;
  font-weight: 600 !important;
  vertical-align: middle;
}

header .top-bar__lang .header-language-link:hover .screen-reader-text {
  color: #FF4FB2 !important;
}

/* === FINAL POLISH: LANGUAGE SWITCHER HOVER + TOGGLE CORNERS === */

/* 1. Change hover text to dark navy */
header .top-bar__lang .header-language-link:hover .screen-reader-text {
  color: #000032 !important;   /* dark navy on magenta hover */
}

/* 2. Remove white background layer / corner artifacts on toggle */
header .top-bar__lang .header-language-toggle {
  background: #000032 !important;   /* match navy background */
  border: none !important;
  border-radius: 0 !important;      /* remove rounded edges */
  box-shadow: none !important;      /* eliminate subtle outline */
}

/* optional: reinforce dropdown border colour for crisp edges */
header .top-bar__lang .header-language-menu {
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 4px;
  overflow: hidden;                 /* trims any remaining white edge */
}
/* === PATCH: REMOVE WHITE GAP ON LANGUAGE TOGGLE HOVER === */
header .top-bar__lang .header-language-toggle {
  position: relative;
  background: #000032 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  top: 0 !important;
}
header .top-bar__lang .header-language-toggle:hover {
  transform: none !important;
  top: 0 !important;
  box-shadow: 0 0 0 1px #000032 inset;
}
/* === CONSOLIDATED MOBILE HEADER (≤767px) – replaces old cleanup + Batches 1B/1C/1D === */
@media (max-width: 767px) {
  .top-bar,
  .partner-bar {
    display: none !important;
  }

  /* Logo: slightly larger for better visibility */
  header .logo img {
    max-height: 64px !important;
    width: auto;
    height: auto;
    margin-right: 0 !important;
  }

  .header_bottom.wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 100%;
  }

  .header_bottom .grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    gap: 12px;
  }

  .header_bottom .grid__item {
    display: flex;
    align-items: center;
  }

  .header_bottom .grid__item:first-child {
    flex: 0 0 auto; /* logo takes only natural width */
  }

  .header_bottom .grid__item:last-child {
    flex: 1 1 auto;
    justify-content: flex-end; /* push controls to right edge */
    margin-left: auto;
  }

  .header_controls {
    display: flex !important;
    align-items: center;
    justify-content: flex-end !important;
    gap: 1rem;
    flex: 0 0 auto;
    margin-left: auto;
  }

  .menu_icon.nav-toggle {
    margin: 0 !important;
    float: none !important;
    flex-shrink: 0;
  }

  .header-cta {
    font-size: 0.8rem;
    padding: 0.5rem 1rem;
    max-width: 170px;
  }

  /* Mobile drawer + nav elements (preserved from original) */
  .site_navigation.mob {
    text-align: center;
  }

  .mobile-nav-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: env(safe-area-inset-bottom, 60px);
    z-index: 2;
  }

  .mobile-nav-overlay {
    z-index: 1;
  }

  .mobile-lang-switcher {
    margin-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 0.75rem;
  }

  .mobile-lang-switcher select,
  .mobile-lang-switcher .wpml-ls {
    text-align: left;
  }

  .mobile-partner-section {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
  }

  .mobile-partner-label {
    display: block;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #f2f2f2;
    margin-bottom: 0.5rem;
  }

  .mobile-partner-logos {
    display: flex;
    justify-content: center;
  }

  .mobile-partner-logos-wrapper {
    background: #fff;
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
  }

  .mobile-partner-logos a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
  }

  .mobile-partner-logos-wrapper img {
    height: 24px;
    width: auto;
    object-fit: contain;
  }

  .mobile-contact {
    margin: 1rem 0;
  }

  .mobile-contact a {
    display: block;
    color: #ffffff;
    font-size: 0.85rem;
    margin: 0.25rem 0;
    text-decoration: none;
  }

  .mobile-contact a i {
    margin-right: 6px;
    color: #FF4FB2;
  }

  .mobile-partner-portal {
    display: inline-block;
    margin: 1rem 0;
    color: #FF9F40;
    font-weight: 600;
    text-decoration: none;
  }

  .mobile-partner-portal:hover {
    color: #FF4FB2;
  }

  /* Sticky header styling for mobile - position:fixed handled by main sticky rules */
  body.header-sticky .header {
    box-shadow: none !important;
  }
}

/* Small phones: hide CTA in header bar entirely, keep it in drawer + menu */
@media (max-width: 600px) {
  .header_bottom .header_controls .header-cta {
    display: none !important;
  }

  .header_bottom.wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* === FINAL COURSE CARD GRID DEFINITIONS — Phase XII-E === */
/* === COURSE CARD: FOUR-COLUMN GRID (REFINED) === */
/* === PHASE XII-G VISUAL ALIGNMENT PATCH === */
body .course-card {
    position: relative;
    display: grid;
    grid-template-columns: 150px minmax(0, 1.4fr) minmax(0, 1fr) minmax(170px, 0.6fr);
    align-items: start;
    align-content: start;
    background-color: #FFFFFF;
    background-image: linear-gradient(
        135deg,
        rgba(255, 159, 64, 0.03),
        rgba(155, 81, 224, 0.03)
    );
    background-origin: border-box;
    background-repeat: no-repeat;
    border: 1px solid #D4DAEC;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    column-gap: 1.5rem;
    row-gap: 0.75rem;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

body .course-card:hover,
body .course-card:focus-within {
    border-color: #C4CCE4;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.12);
}

body .course-card .course-link-overlay {
    display: none;
}

body .course-card > * {
    position: relative;
    z-index: 3;
}

body .course-card .col-logo,
body .course-card .col-details,
body .course-card .col-calc,
body .course-card .col-actions {
    display: flex;
    align-items: center;
}

body .course-card .col-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    padding: 0.5rem 1rem 0.5rem 0.5rem;
    border-right: 1px solid #e6e9f2;
}

body .course-card .col-logo img {
    max-width: 150px;
    max-height: 55px;
    width: auto;
    height: auto;
}

body .course-card .col-details {
    flex-direction: column;
    gap: 0.4rem;
    align-self: start;
    align-items: flex-start;
    padding-right: 0.75rem;
}

body .course-card .course-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #000032;
    margin: 0;
    line-height: 1.3;
}

body .course-card .course-school {
    font-size: 1rem;
    font-weight: 600;
    color: #49536a;
    margin: 0;
}

/* Course card link normalization – override global orange with parent colors (Dec 2024) */
body .course-card .course-title__link {
    color: inherit !important;
}
body .course-card .course-school__link {
    color: inherit !important;
}
body .course-card .col-logo__link {
    color: inherit !important;
}
body .course-card .course-title__link:hover,
body .course-card .course-school__link:hover {
    color: var(--lse-primary-magenta, #E6007E) !important;
}

body .course-card .course-taxonomies {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0.35rem 0 0.25rem;
}

body .course-card .tax-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.7rem;
    font-weight: 500;
    margin-right: 0.35rem;
    margin-bottom: 0.25rem;
    background-color: #FFFFFF;
    border: 1px solid #E5E7EB;
    color: #1F2937;
}

/* Course type / Course family – soft pink accent (swapped with hours/intensity) */
body .course-card .tax-type {
    background-color: rgba(236, 72, 153, 0.10);
    border-color: rgba(236, 72, 153, 0.25);
    color: #BE185D;
}

/* City/location – soft purple accent */
body .course-card .tax-city {
    background-color: rgba(155, 81, 224, 0.12);
    border-color: rgba(155, 81, 224, 0.25);
    color: #6D28D9;
}

/* Schedule, extra – inherit white base with subtle text */
body .course-card .tax-schedule,
body .course-card .tax-extra {
    color: #4B5563;
}

/* Hours/week chip (intensity) – soft orange accent (swapped with course type) */
body .course-card .tax-hours {
    background-color: rgba(255, 159, 64, 0.12);
    border-color: rgba(255, 159, 64, 0.25);
    color: #C05621;
}

/* Level chip – blue accent matching View Course CTA */
body .course-card .tax-level {
    background-color: rgba(34, 148, 210, 0.08);
    border-color: #2294D2;
    color: #2294D2;
    text-transform: uppercase;
}

body .course-card .course-meta {
    font-size: 0.9rem;
    color: #5b5e6f;
    line-height: 1.4;
    margin-top: 0.25rem;
}

body .course-card .course-price {
    display: block;
    font-size: 1rem;
    font-weight: 500;
    color: #E6007E;
    margin: 0.25rem 0 0;
}

body .course-card .course-flags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

body .course-card .col-calc {
    flex-direction: column;
    align-self: start;
    align-items: flex-start;
    gap: 0.75rem;
    padding-right: 0.75rem;
}

body .course-card .col-calc .calc-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    font-size: 0.85rem;
    gap: 0.25rem;
}

body .course-card .col-calc label {
    font-weight: 600;
    margin-bottom: 0.15rem;
}

body .course-card .col-calc .course-calculator {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
    background: none;
    border: none;
    padding: 0;
}

body .course-card .col-calc .course-calculator__title,
body .course-card .col-calc .course-calculator__note,
body .course-card .col-calc .course-calculator__fees {
    display: none;
}

body .course-card .col-calc .course-calculator__label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
    font-weight: 600;
}

body .course-card .col-calc .course-calculator__weeks {
    margin: 0;
}

body .course-card .col-calc select,
body .course-card .col-calc .course-calculator__weeks {
    height: 28px;
    padding: 0 0.35rem;
    font-size: 0.85rem;
}

body .course-card .col-actions {
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    gap: 0.55rem;
    padding-right: 1.5rem;
    padding-left: 0;
    min-width: 150px;
}

body .course-card .col-actions .btn {
    width: 100%;
    min-width: 150px;
    text-align: center;
    border-radius: 6px;
    padding: 0.6rem 1rem;
    font-weight: 600;
    font-size: 0.9rem;
}

body .course-card .btn-view {
    background-color: transparent !important;
    color: #2294D2 !important;
    border: 1.5px solid #2294D2 !important;
    border-radius: 9999px;
    padding: 0.55rem 0.9rem;
    font-weight: 500;
    font-size: 0.85rem;
    box-shadow: none !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

body .course-card .btn-view:hover,
body .course-card .btn-view:focus {
    background-color: rgba(34, 148, 210, 0.08) !important;
    border-color: #1b7cb3 !important;
    color: #2294D2 !important;
    box-shadow: none !important;
}

body .course-card .btn-view:focus-visible {
    outline: 2px solid #2294D2;
    outline-offset: 2px;
}

body .course-card .btn-compare {
    background-color: rgba(238, 114, 24, 0.05) !important;
    border: 1px solid #EE7218 !important;
    border-radius: 9999px;
    color: #EE7218 !important;
    box-shadow: none !important;
    font-weight: 500;
    white-space: nowrap;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

body .course-card .btn-compare:hover,
body .course-card .btn-compare:focus {
    background-color: rgba(238, 114, 24, 0.12) !important;
    border-color: #D96510 !important;
    color: #EE7218 !important;
    box-shadow: none !important;
    transform: none;
}

body .course-card .btn-compare:focus-visible {
    outline: 2px solid #EE7218;
    outline-offset: 2px;
}

body .course-card .btn-quote {
    background: linear-gradient(90deg, #FF4FB2 0%, #E6007E 100%);
    border: none;
    border-radius: 9999px;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 8px 16px rgba(230, 0, 126, 0.2);
}

body .course-card .btn-quote:hover,
body .course-card .btn-quote:focus {
    box-shadow: 0 10px 20px rgba(230, 0, 126, 0.28);
    filter: brightness(1.05);
}

/* Course card CTAs – restore mixed-case labels */
body .course-card .btn-view,
body .course-card .btn-compare,
body .course-card .btn-quote {
    text-transform: none !important;
}

/* === PHASE XVIII-E: Unified course card layout fixes === */

/* Fixed-duration badge – unified styling across all contexts */
.course-calculator__fixed-badge,
.course-card .course-calculator__fixed-badge {
    display: inline-block !important;
    background: #e8f4e8 !important;
    color: #2d6a2d !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    padding: 0.15rem 0.4rem !important;
    border-radius: 3px !important;
    margin-left: 0.5rem !important;
    vertical-align: middle !important;
}

/* CTA column padding – reduce to prevent overflow past card edge */
body .course-card.course-card--finder .col-actions,
body .course-card.course-card--related .col-actions,
body .course-card.course-card--school .col-actions {
    padding-right: 0.5rem !important;
}

/* Vertical padding normalisation across contexts */
body .course-card.course-card--finder,
body .course-card.course-card--related,
body .course-card.course-card--school {
    padding-top: 16px;
    padding-bottom: 16px;
}

@media (max-width: 1024px) {
    body .course-card {
        grid-template-columns: 150px minmax(0, 1fr);
        column-gap: 1.25rem;
        row-gap: 1rem;
        padding: 1.25rem;
    }

    body .course-card .course-link-overlay {
        display: none;
    }

    body .course-card .col-logo {
        border-right: none;
        border-bottom: 1px solid #e6e9f2;
        padding-bottom: 1rem;
        margin-bottom: 1rem;
        justify-content: flex-start;
        grid-column: 1;
        grid-row: 1 / span 3;
    }

    body .course-card .col-details {
        padding-right: 0;
        grid-column: 2;
        grid-row: 1;
    }

    body .course-card .col-calc {
        padding-right: 0;
        grid-column: 2;
        grid-row: 2;
    }

    body .course-card .col-actions {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        min-width: 0;
        padding-right: 0;
        grid-column: 2;
        grid-row: 3;
    }

    body .course-card .col-actions .btn {
        width: 48%;
        min-width: auto;
    }
}

/* === PHASE XVIII-E: Small tablet single-column (769–900px) === */
@media (max-width: 900px) {
    /* Force single-column grid with higher specificity + !important */
    body .course-card,
    body .course-card.course-card--finder,
    body .course-card.course-card--default {
        grid-template-columns: 1fr !important;
        row-gap: 0.75rem;
        padding: 1rem;
    }

    body .course-card .col-logo,
    body .course-card .col-details,
    body .course-card .col-calc,
    body .course-card .col-actions {
        grid-column: 1 !important;
        grid-row: auto !important;
        width: 100% !important;
        padding-left: 0;
        padding-right: 0;
    }

    body .course-card .col-logo {
        border-right: none;
        border-bottom: 1px solid #e6e9f2;
        padding: 0.5rem 0 1rem;
        margin-bottom: 0.5rem;
        justify-content: center;
    }

    body .course-card .col-details {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
        width: 100%;
    }

    body .course-card .course-card__summary {
        max-width: 100%;
    }

    body .course-card .col-calc {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
        width: 100%;
    }

    body .course-card .col-calc .course-calculator {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    body .course-card .course-calculator__line {
        width: 100%;
    }

    body .course-card .col-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        width: 100%;
    }

    body .course-card .col-actions .btn {
        width: 100%;
        min-width: 0;
    }
}

/* === PHASE XVIII-E: Mobile single-column (≤768px) === */
@media (max-width: 768px) {
    /* Force single-column grid with higher specificity + !important */
    body .course-card,
    body .course-card.course-card--finder,
    body .course-card.course-card--default {
        grid-template-columns: 1fr !important;
        row-gap: 0.75rem;
        padding: 0.875rem;
    }

    body .course-card .col-logo,
    body .course-card .col-details,
    body .course-card .col-calc,
    body .course-card .col-actions {
        grid-column: 1 !important;
        grid-row: auto !important;
        width: 100% !important;
        padding-left: 0;
        padding-right: 0;
    }

    body .course-card .col-logo {
        border-bottom: none;
        margin-bottom: 0.5rem;
        padding: 0 0 0.5rem;
        justify-content: center;
    }

    body .course-card .col-details {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
        width: 100%;
    }

    body .course-card .course-card__summary {
        max-width: 100%;
    }

    body .course-card .col-calc {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
        width: 100%;
    }

    body .course-card .col-calc .course-calculator {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    body .course-card .course-calculator__line {
        justify-content: space-between;
        flex-wrap: wrap;
        width: 100%;
    }

    body .course-card .col-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        width: 100%;
    }

    body .course-card .col-actions .btn {
        width: 100%;
        min-width: 0;
    }
}

body .course-card:focus-within {
    outline: 3px solid var(--lse-tertiary-blue);
    outline-offset: 2px;
}
/* === END PATCH === */
/* === PHASE XII-K COMPACT HEIGHT === */

/* Inline price and total labels with values */
.col-calc .weekly,
.col-calc .total {
  display: inline-block !important;
  width: auto !important;
  margin: 0.1rem 0 !important;
}
.col-calc .weekly::after {
  content: " ";
}

/* Prevent label wrapping */
.col-calc label {
  display: inline-block !important;
  margin: 0 0.25rem 0 0 !important;
}

/* Fine-tune vertical rhythm */
.col-calc {
  gap: 0.15rem !important;
  line-height: 1.35 !important;
}

/* Ensure buttons stay contained */
.course-card .col-actions {
  align-self: flex-start !important;
  justify-content: flex-start !important;
}

.course-cards-grid .course-card {
  margin-bottom: 1rem;
  padding: 0.75rem 1rem;
  border-radius: 8px;
}

/* === END COMPACT HEIGHT === */
/* === PHASE XII-K.1 INLINE CALCULATOR FIX === */

/* Make each calculator line compact and inline */
.course-calculator__line {
  display: flex;
  align-items: baseline;
  flex-wrap: nowrap;
  gap: 0.25rem;
  margin: 0.25rem 0;
}

.course-calculator__label,
.course-calculator__weekly,
.course-calculator__line--total {
  display: inline-block;
  white-space: nowrap;
}

/* Tighten vertical rhythm */
.course-calculator__line strong,
.course-calculator__line span {
  font-weight: 500;
  line-height: 1.3;
}

/* Ensure Estimated total sits inline with amount */
.course-calculator__line--total {
  font-weight: 700;
  color: #000032;
}

/* === END INLINE CALCULATOR FIX === */
/* === PHASE XII-K.4 CALCULATOR + SCHOOL CPT PARITY FIX === */

/* Keep price range inline */
.course-calculator__line--price,
.course-calculator__line--total {
  display: flex !important;
  align-items: baseline;
  flex-wrap: nowrap;
  gap: 0.3rem;
  white-space: nowrap;
}

/* Remove unwanted extra text spacing from legacy meta lines */
.course-card .course-meta { display: none !important; }

/* Ensure School CPT uses same grid layout as Finder */
.course-cards-grid {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.course-cards-grid .course-card {
  width: 100%;
  margin: 0;
  padding: 0.75rem 1rem;
  border-radius: 8px;
}
/* === END PHASE XII-K.4 === */
/* === FINAL PHASE XII-G PATCH === */

body .course-card .col-calc {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

body .course-card .col-calc label:not(.course-calculator__label) {
    display: block;
    margin-bottom: 0.25rem;
    font-weight: 600;
}

body .course-card .col-calc select {
    width: 80px;
    margin-bottom: 0.35rem;
}

body .course-card .col-calc .weekly {
    margin-top: 0.25rem;
    margin-bottom: 0.15rem;
    font-weight: 500;
    color: #000032;
    display: block;
}

body .course-card .col-calc .total {
    font-weight: 700;
    color: #000032;
    display: block;
}

body .course-card .col-actions {
    align-self: flex-start;
    margin-left: auto;
}

body .course-card .course-link-overlay {
    display: none !important;
    pointer-events: none !important;
}

/* === END PATCH === */
/* === PHASE XII-H.1 FIX — RESTORE CHILD FLOWS (desktop only) === */
@media (min-width: 901px) {
  html body .course-card {
    display: grid !important;
    grid-template-columns: 150px minmax(0, 1.4fr) minmax(0, 1fr) minmax(170px, 0.6fr) !important;
    align-items: start !important;
    column-gap: 0.75rem;
  }

  /* restore intended child layouts */
  html body .course-card .col-logo { display: flex !important; align-items: center; justify-content: center; }
  html body .course-card .col-details { display: block !important; }
  html body .course-card .col-calc { display: flex !important; flex-direction: column; align-items: flex-start; }
  html body .course-card .col-actions { display: flex !important; flex-direction: column; align-items: flex-end; }
}
/* === END FIX === */
/* === PHASE XII-H.3 VISIBILITY RESTORE === */
.course-card,
.course-card * {
  visibility: visible !important;
  opacity: 1 !important;
}

/* remove hiding/clip rules from legacy wrappers */
.ukse-course-card,
.ukse-course-card--horizontal,
.course-result-card {
  overflow: visible !important;
  height: auto !important;
  position: static !important;
  clip: auto !important;
  max-height: none !important;
  z-index: auto !important;
}

/* make sure grid children are allowed to expand */
.course-card > div {
  min-height: 1px;
}
/* === END RESTORE === */
/* === AUTO-FIX FROM PHASE XII-H.4 === */
.course-card::before,
.course-card::after,
.col.col-logo::before,
.col.col-logo::after,
.col.col-actions::before,
.col.col-actions::after {
  display: none !important;
  opacity: 0 !important;
}

.course-card,
.col.col-logo,
.col.col-actions {
  overflow: visible !important;
  z-index: auto !important;
}
/* === END AUTO-FIX === */
/* === PHASE XII-J GRID RATIO & BUTTON ALIGNMENT (desktop only) === */
@media (min-width: 901px) {
  .course-card {
    grid-template-columns: 150px minmax(0, 1.4fr) minmax(0, 1fr) minmax(170px, 0.6fr);
    column-gap: 1rem;
    align-items: flex-start;
  }

  html body .course-card {
    grid-template-columns: 150px minmax(0, 1.4fr) minmax(0, 1fr) minmax(170px, 0.6fr) !important;
    column-gap: 1rem !important;
    align-items: flex-start !important;
  }

  .course-card .col-calc {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
  }

  .course-card .col-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.55rem;
    padding-top: 0.25rem;
    padding-right: 0.75rem;
  }
  .col-actions .btn {
    width: 100%;
    min-width: 140px;
    text-align: center;
  }
}

/* col-calc label styles (all viewports) */
.col-calc label,
.col-calc .weekly,
.col-calc .total {
  display: block;
  width: 100%;
  margin: 0.15rem 0;
  line-height: 1.4;
}
/* === END PATCH === */

/* === PHASE XII-K.6 META + TAXONOMY PILL FIX === */

/* Inline price range inside calculator */
.course-calculator__line--price {
  display: flex !important;
  align-items: baseline;
  gap: 0.3rem;
  white-space: nowrap;
}

/* School name typography (Finder only) */
.course-school {
  font-size: 0.95rem;
  font-weight: 600;
  color: #222;
  margin: 0 0 0.35rem;
}

/* Canonical taxonomy pill colours – calmer palette (PHASE: swapped Dec 2024) */
/* Base .tax-chip styling for use outside .course-card (e.g. hero sections) */
.tax-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.7rem;
    font-weight: 500;
    background-color: #FFFFFF;
    border: 1px solid #E5E7EB;
    color: #1F2937;
}
/* Course family – pink (swapped with intensity Dec 2024) */
.tax-type {
    background-color: rgba(236, 72, 153, 0.10);
    border-color: rgba(236, 72, 153, 0.25);
    color: #BE185D;
}
/* City – purple */
.tax-city {
    background-color: rgba(155, 81, 224, 0.12);
    border-color: rgba(155, 81, 224, 0.25);
    color: #6D28D9;
}
/* Intensity/hours – orange (swapped with course family Dec 2024) */
.tax-hours {
    background-color: rgba(255, 159, 64, 0.12);
    border-color: rgba(255, 159, 64, 0.25);
    color: #C05621;
}
.tax-schedule,
.tax-extra {
    color: #4B5563;
}
.tax-level {
    background-color: rgba(34, 148, 210, 0.08);
    border-color: #2294D2;
    color: #2294D2;
    text-transform: uppercase;
}

/* Course hero dark background overrides (Dec 2024) */
.single-course .course-hero__meta .tax-chip {
    font-size: 0.875rem;        /* 25% larger than card pills (0.7rem) */
    padding: 0.19rem 0.75rem;   /* 25% larger padding */
    background-color: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.28);
}
.single-course .course-hero__meta .tax-type {
    background-color: rgba(236, 72, 153, 0.30);
    border-color: rgba(236, 72, 153, 0.50);
    color: #fff;
}
.single-course .course-hero__meta .tax-hours {
    background-color: rgba(255, 159, 64, 0.30);
    border-color: rgba(255, 159, 64, 0.50);
    color: #fff;
}
.single-course .course-hero__meta .tax-city {
    background-color: rgba(155, 81, 224, 0.30);
    border-color: rgba(155, 81, 224, 0.50);
    color: #fff;
}
.single-course .course-hero__meta .tax-level {
    background-color: rgba(34, 148, 210, 0.30);
    border-color: rgba(34, 148, 210, 0.50);
    color: #fff;
    text-transform: uppercase;
}

/* Clickable pill links (course type + city) */
.single-course .course-hero__meta a.tax-chip--link {
    text-decoration: none;
    color: inherit;
    transition: background-color 0.15s ease, border-color 0.15s ease;
    cursor: pointer;
}
.single-course .course-hero__meta a.tax-chip--link:hover,
.single-course .course-hero__meta a.tax-chip--link:focus-visible {
    text-decoration: underline;
    text-underline-offset: 2px;
}
.single-course .course-hero__meta a.tax-type.tax-chip--link:hover,
.single-course .course-hero__meta a.tax-type.tax-chip--link:focus-visible {
    background-color: rgba(236, 72, 153, 0.45);
    border-color: rgba(236, 72, 153, 0.65);
}
.single-course .course-hero__meta a.tax-city.tax-chip--link:hover,
.single-course .course-hero__meta a.tax-city.tax-chip--link:focus-visible {
    background-color: rgba(155, 81, 224, 0.45);
    border-color: rgba(155, 81, 224, 0.65);
}

/* === END PHASE XII-K.6 === */

/* /home-english-tuition/ landing layout (page-id-764) */
body.page-id-764 #content {
  padding: 3rem 0 4rem;
  background: #f6f8fc;
}

body.page-id-764 #inner-content {
  max-width: 1200px;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 32px;
  padding: 2.5rem 2.5rem 3rem;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.06);
}

body.page-id-764 #inner-content .article-header {
  margin-bottom: 1.5rem;
}

body.page-id-764 .ukse-home-tuition-landing__audiences {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  align-items: stretch;
  gap: 1.75rem;
  margin-top: 2rem;
}

body.page-id-764 .ukse-home-tuition-landing__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #ffffff;
  border-radius: 18px;
  padding: 1.75rem 2rem 1.5rem;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.06);
}

body.page-id-764 .ukse-home-tuition-landing__card h2 {
  margin-top: 0;
  margin-bottom: 0.75rem;
}

body.page-id-764 .ukse-home-tuition-landing__card p {
  margin: 0 0 0.85rem;
}

body.page-id-764 .ukse-home-tuition-landing__cta {
  margin-top: auto;
  padding-top: 1rem;
}

body.page-id-764 .ukse-home-tuition-landing__lead {
  width: 100%;
  text-align: left;
  margin-bottom: 1.5rem;
  font-size: 1.1rem;
  line-height: 1.6;
}

body.page-id-764 .ukse-home-tuition-landing__card--students {
  background: #f2fcff;
}

body.page-id-764 .ukse-home-tuition-landing__card--hosts {
  background: #fffbec;
}

/* ============================================================================
   BATCH 1A – MOBILE NAV DRAWER VISUAL RE-SKIN
   Scoped to ≤1024px – DOES NOT affect desktop
   ============================================================================ */

@media (max-width: 1024px) {

    /* --- Mobile Primary Menu: Enhanced Card Styling --- */
    .mobile-primary-menu {
        gap: 14px; /* Increased from 12px for clearer separation */
    }

    .mobile-primary-menu > li > a {
        position: relative;
        background: rgba(255, 255, 255, 0.08); /* Slightly more visible than 0.05 */
        border: 1px solid rgba(230, 0, 126, 0.22); /* Magenta-tinted border */
        border-radius: 14px; /* Match hero card radius */
        padding: 16px 20px; /* Roomier tap targets */
        overflow: hidden;
    }

    /* Left accent bar via pseudo-element */
    .mobile-primary-menu > li > a::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px;
        background: linear-gradient(180deg, #EE7218 0%, #E6007E 100%);
        border-radius: 3px 0 0 3px;
        opacity: 0.7;
        transition: opacity 0.3s ease;
    }

    .mobile-primary-menu > li > a:hover::before,
    .mobile-primary-menu > li > a:focus::before,
    .mobile-primary-menu > li > a:focus-visible::before {
        opacity: 1;
    }

    /* Hover/focus state with brand gradient tint */
    .mobile-primary-menu > li > a:hover,
    .mobile-primary-menu > li > a:focus,
    .mobile-primary-menu > li > a:focus-visible {
        background: linear-gradient(
            135deg,
            rgba(230, 0, 126, 0.12) 0%,
            rgba(238, 114, 24, 0.08) 100%
        );
        border-color: rgba(230, 0, 126, 0.4);
        outline: none;
    }

    /* Ensure Apply Now button keeps its existing gradient (no left bar) */
    .mobile-primary-menu #menu-item-6242 > a::before {
        display: none;
    }

    /* Sub-menu items: subtle left indent indicator */
    .mobile-primary-menu .sub-menu a {
        padding-left: 8px;
        border-left: 2px solid rgba(238, 114, 24, 0.3);
        margin-left: 12px;
    }

    .mobile-primary-menu .sub-menu a:hover,
    .mobile-primary-menu .sub-menu a:focus,
    .mobile-primary-menu .sub-menu a:focus-visible {
        border-left-color: rgba(238, 114, 24, 0.7);
        color: var(--lse-white);
    }

} /* END @media (max-width: 1024px) */


/* === HOME HERO FINDER – CONSOLIDATED RESPONSIVE LAYOUT === */

/* Desktop (unchanged) */
@media (min-width: 1025px) {
  .home-hero__finder .quick-search-form .search-inputs-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.75rem;
  }

  .home-hero__finder .quick-search-form .search-input-group {
    flex: 0 0 auto;
    min-width: 0;
    max-width: none;
  }

  .home-hero__finder .quick-search-form .search-cta-btn-wrapper {
    flex: 1 1 100%;
    display: flex;
    justify-content: center;
  }
}

/* Tablet + phone – single-column stack up to 900px */
@media (max-width: 900px) {
  .home-hero__finder .quick-search-form .search-inputs-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    row-gap: 12px;
    column-gap: 0;
    width: 100%;
  }

  .home-hero__finder .quick-search-form .search-input-group,
  .home-hero__finder .quick-search-form .search-cta-btn-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }

  .home-hero__finder .quick-search-form .search-cta-btn {
    width: 100%;
    max-width: none;
    justify-content: center;
  }
}

/* MOBILE DRAWER – REMOVE RASPBERRY BACKGROUND ON LI
   Neutralises the .site_navigation ul li background for the mobile drawer only.
   Desktop megamenu remains using the original rule. */

@media (max-width: 1024px) {
    .site_navigation.mob ul li,
    .site_navigation.mob ul li.menu-item {
        background: transparent !important; /* override global #cc3366 */
    }
}

/* 3) MOBILE DRAWER LANGUAGE SWITCHER – NEUTRALISE WPML WHITE BOX
   Override WPML default styles inside the drawer to match the dark drawer theme. */

@media (max-width: 1024px) {
    .site_navigation.mob .mobile-lang-switcher {
        margin-bottom: 0.75rem;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    }

    /* Reset WPML container backgrounds and padding */
    .site_navigation.mob .mobile-lang-switcher .wpml-ls,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-legacy-dropdown,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-legacy-list,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-legacy-dropdown-click {
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Style the trigger/toggle inside WPML selector */
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-item,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-current-language,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-slot-shortcode_actions {
        background: transparent !important;
        border: none !important;
    }

    .site_navigation.mob .mobile-lang-switcher .wpml-ls-item a,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-current-language a,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-link {
        color: rgba(255, 255, 255, 0.85) !important;
        background: transparent !important;
        border: none !important;
        padding: 8px 12px !important;
        font-size: 14px;
        font-weight: 500;
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }

    .site_navigation.mob .mobile-lang-switcher .wpml-ls-item a:hover,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-item a:focus,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-link:hover,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-link:focus {
        color: #fff !important;
        background: rgba(106, 202, 243, 0.15) !important;
    }

    /* Dropdown sub-menu styling */
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-sub-menu,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls ul {
        background: rgba(6, 18, 54, 0.98) !important;
        border: 1px solid rgba(255, 255, 255, 0.15) !important;
        border-radius: 8px;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
        padding: 4px 0 !important;
        margin-top: 4px !important;
    }

    .site_navigation.mob .mobile-lang-switcher .wpml-ls-sub-menu li a,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls ul li a {
        color: rgba(255, 255, 255, 0.85) !important;
        padding: 8px 12px !important;
    }

    .site_navigation.mob .mobile-lang-switcher .wpml-ls-sub-menu li a:hover,
    .site_navigation.mob .mobile-lang-switcher .wpml-ls ul li a:hover {
        background: rgba(106, 202, 243, 0.15) !important;
        color: #fff !important;
    }

    /* Flag images */
    .site_navigation.mob .mobile-lang-switcher .wpml-ls-flag {
        width: 18px;
        height: 12px;
        border-radius: 2px;
        box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2);
    }

    /* Fallback: If WPML renders a <select> */
    .site_navigation.mob .mobile-lang-switcher select {
        background: rgba(255, 255, 255, 0.08);
        color: rgba(255, 255, 255, 0.9);
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 8px;
        padding: 10px 12px;
        font-size: 14px;
        width: 100%;
        appearance: none;
        -webkit-appearance: none;
        cursor: pointer;
    }

    .site_navigation.mob .mobile-lang-switcher select:focus {
        outline: none;
        border-color: rgba(106, 202, 243, 0.5);
    }
}

/* === MOBILE DRAWER LANGUAGE SWITCHER – REMOVE WHITE BACKGROUND
   Override the global #lang_sel / .language_option white background rules
   inside the mobile drawer only. */

@media (max-width: 1024px) {
    /* Target the WPML/language_option white backgrounds in drawer context */
    .site_navigation.mob #lang_sel,
    .site_navigation.mob .language_option,
    .site_navigation.mob .language_option #lang_sel,
    .site_navigation.mob .language_option #lang_sel a,
    .site_navigation.mob .language_option #lang_sel a.lang_sel_sel,
    .site_navigation.mob .wpml-ls,
    .site_navigation.mob .wpml-ls-item,
    .site_navigation.mob .wpml-ls-link {
        background: transparent !important;
        box-shadow: none !important;
    }

    /* Style the language selector to match dark drawer theme */
    .site_navigation.mob .language_option,
    .site_navigation.mob #lang_sel {
        border: 1px solid rgba(255, 255, 255, 0.15);
        border-radius: 8px;
        padding: 0;
    }

    .site_navigation.mob .language_option #lang_sel a,
    .site_navigation.mob .language_option #lang_sel a.lang_sel_sel {
        color: rgba(255, 255, 255, 0.9) !important;
        padding: 10px 14px !important;
        border-radius: 8px;
    }

    .site_navigation.mob .language_option #lang_sel a:hover,
    .site_navigation.mob .language_option #lang_sel a:focus {
        background: rgba(106, 202, 243, 0.15) !important;
        color: #fff !important;
    }

    /* Dropdown arrow color and position */
    .site_navigation.mob .language_option #lang_sel a.lang_sel_sel::after {
        color: rgba(255, 255, 255, 0.7);
        right: 19px !important;
    }

    /* Dropdown submenu styling */
    .site_navigation.mob .language_option #lang_sel ul ul {
        background: rgba(6, 18, 54, 0.98) !important;
        border: 1px solid rgba(255, 255, 255, 0.15) !important;
        border-radius: 8px;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
    }

    .site_navigation.mob .language_option #lang_sel ul ul a {
        background: transparent !important;
        color: rgba(255, 255, 255, 0.85) !important;
    }

    .site_navigation.mob .language_option #lang_sel ul ul a:hover {
        background: rgba(106, 202, 243, 0.15) !important;
        color: #fff !important;
    }
}

/* === MOBILE DRAWER LANGUAGE SWITCHER – WIDTH & ARROW ALIGNMENT === */

@media (max-width: 1024px) {
  /* Force full-width on all container levels */
  .site_navigation.mob .language_option,
  .site_navigation.mob #lang_sel {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  /* Force UL and LI to not constrain width */
  .site_navigation.mob .language_option #lang_sel > ul,
  .site_navigation.mob .language_option #lang_sel > ul > li {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .site_navigation.mob .language_option #lang_sel a.lang_sel_sel {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100% !important;
    min-height: 44px;
    padding: 10px 40px 10px 14px !important; /* text left, arrow room right */
    position: relative;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 6px;
  }

  .site_navigation.mob .language_option #lang_sel a.lang_sel_sel::after {
    content: "" !important;
    position: absolute !important;
    right: 19px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid currentColor;
    pointer-events: none;
  }
}

/* ==========================================================================
   UKSE Info Pages – Mobile Layout (≤550px)
   Phase XVIII-E: Scoped mobile styles for info/feature cards
   Applies to: About, Home Tuition, Teach & Host, For Schools, etc.
   Do NOT affect .course-card (course finder results).
   ========================================================================== */

@media (max-width: 550px) {

  /* -------------------------------------------------------------------------
     GLOBAL: H2 overflow prevention for info pages
     Targets long headings like "Board options (meals)" that exceed container
     Also handles underline decorations that extend beyond text
     ------------------------------------------------------------------------- */
  .ukse-home-tuition__content h2,
  .ukse-home-tuition__section h2,
  .ukse-teach-and-host__content h2,
  .ukse-teach-and-host__section h2,
  .ukse-for-schools__content h2 {
    max-width: 100% !important;
    width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    hyphens: auto !important;
    box-sizing: border-box !important;
  }

  /* Handle underline pseudo-elements that cause overflow */
  .ukse-home-tuition__section h2::after,
  .ukse-teach-and-host__section h2::after {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Specific fix for "Board options" section heading - force wrapping */
  .ukse-home-tuition__section--board h2,
  .ukse-teach-and-host__section--board h2 {
    font-size: 1.15rem !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* Ensure section has overflow hidden to prevent horizontal scroll */
  .ukse-home-tuition__section--board,
  .ukse-teach-and-host__section--board {
    overflow: hidden !important;
  }

  /* -------------------------------------------------------------------------
     GLOBAL: Flatten ALL nested decorative wrappers on info pages
     These inline-styled divs with padding/background/box-shadow constrain width
     Using high-specificity selectors to override inline styles
     EXCLUDE: all -card and -panel classes to preserve their backgrounds/styling
     ------------------------------------------------------------------------- */
  .ukse-home-tuition__content > div[style]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-home-tuition__content section > div[style]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-home-tuition__content .ukse-home-tuition__section > div[style]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-home-tuition__content div[style*="padding: 40px"]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-home-tuition__content div[style*="padding: 30px"]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-home-tuition__content div[style*="padding: clamp"]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-teach-and-host__content > div[style]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-teach-and-host__content section > div[style]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-teach-and-host__content .ukse-teach-and-host__section > div[style]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-teach-and-host__content div[style*="padding: 40px"]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-teach-and-host__content div[style*="padding: 30px"]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-for-schools__content > div[style]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-for-schools__content section > div[style]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-for-schools__content div[style*="padding: 40px"]:not([class*="-card"]):not([class*="-panel"]),
  .ukse-for-schools__content div[style*="padding: 30px"]:not([class*="-card"]):not([class*="-panel"]) {
    padding: 12px 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Target the outermost white box wrapper that adds 40px padding */
  .ukse-home-tuition__content > div:first-child,
  .ukse-teach-and-host__content > div:first-child,
  .ukse-for-schools__content > div:first-child {
    padding: 16px 10px !important;
    margin: 16px 0 !important;
    background: #fff !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
    border-radius: 12px !important;
  }

  /* -------------------------------------------------------------------------
     About / Home Tuition Students (page-home-tuition-student template)
     Wrapper: .ukse-home-tuition__content
     Cards: .ukse-feature-card, .ukse-home-tuition__card
     ------------------------------------------------------------------------- */
  .ukse-home-tuition__content .wrap,
  .ukse-home-tuition__content .wrap > div,
  .ukse-home-tuition__content .about-section,
  .ukse-home-tuition__content .about-section > div,
  .ukse-home-tuition__content .ukse-home-tuition__section > div[style*="background"],
  .ukse-home-tuition__content section > div[style*="background"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 8px 0 !important;
    margin: 0 !important;
    background: none !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
  }

  .ukse-home-tuition__content div[style*="display: flex"],
  .ukse-home-tuition__content div[style*="display:flex"] {
    display: block !important;
    width: 100% !important;
  }

  .ukse-feature-card,
  .ukse-home-tuition__card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important;
    padding: 16px !important;
    border-radius: 12px !important;
  }

  .ukse-feature-card h2,
  .ukse-feature-card h3,
  .ukse-feature-card h4,
  .ukse-feature-card p,
  .ukse-home-tuition__card h2,
  .ukse-home-tuition__card h3,
  .ukse-home-tuition__card h4,
  .ukse-home-tuition__card p {
    max-width: 100%;
    word-wrap: break-word;
  }

  /* -------------------------------------------------------------------------
     Home English Tuition Landing (page-template-default, page-id-764)
     Wrapper: .entry-content
     Cards: .ukse-home-tuition-landing__card
     ------------------------------------------------------------------------- */
  .ukse-home-tuition-landing__audiences {
    display: block !important;
    width: 100% !important;
  }

  .ukse-home-tuition-landing__card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important;
  }

  /* -------------------------------------------------------------------------
     Teach and Host (page-template-page-teach-and-host)
     Wrapper: .ukse-teach-and-host__content
     Cards: .ukse-teach-and-host__card
     ------------------------------------------------------------------------- */
  .ukse-teach-and-host__content section > div[style*="background"],
  .ukse-teach-and-host__content .ukse-teach-and-host__section > div[style*="background"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 8px !important;
    margin: 0 0 16px 0 !important;
    background: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  .ukse-teach-and-host__content div[style*="display: flex"],
  .ukse-teach-and-host__content div[style*="display:flex"] {
    display: block !important;
    width: 100% !important;
  }

  .ukse-teach-and-host__card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important;
    padding: 16px !important;
    border-radius: 12px !important;
  }

  .ukse-teach-and-host__card h2,
  .ukse-teach-and-host__card h3,
  .ukse-teach-and-host__card h4,
  .ukse-teach-and-host__card p {
    max-width: 100%;
    word-wrap: break-word;
  }

  /* -------------------------------------------------------------------------
     For Schools (page-template-page-for-schools-partner)
     Wrapper: .ukse-for-schools__content
     Cards: .ukse-for-schools__why-card, __tier-card, __investment-card, __ready-card
     ------------------------------------------------------------------------- */
  .ukse-for-schools__content section > div[style*="background"]:not(.ukse-for-schools__ready-card):not(.ukse-for-schools__why-card):not(.ukse-for-schools__tier-card):not(.ukse-for-schools__investment-card),
  .ukse-for-schools__content > div[style*="background"]:not(.ukse-for-schools__ready-card):not(.ukse-for-schools__why-card):not(.ukse-for-schools__tier-card):not(.ukse-for-schools__investment-card) {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 8px !important;
    margin: 0 0 16px 0 !important;
    background: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  .ukse-for-schools__content div[style*="display: flex"],
  .ukse-for-schools__content div[style*="display:flex"] {
    display: block !important;
    width: 100% !important;
  }

  .ukse-for-schools__why-grid,
  .ukse-for-schools__tier-grid {
    display: block !important;
    width: 100% !important;
  }

  .ukse-for-schools__why-card,
  .ukse-for-schools__tier-card,
  .ukse-for-schools__investment-card,
  .ukse-for-schools__ready-card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important;
    padding: 16px !important;
    border-radius: 12px !important;
  }

  .ukse-for-schools__why-card h2,
  .ukse-for-schools__why-card h3,
  .ukse-for-schools__why-card h4,
  .ukse-for-schools__why-card p,
  .ukse-for-schools__tier-card h2,
  .ukse-for-schools__tier-card h3,
  .ukse-for-schools__tier-card h4,
  .ukse-for-schools__tier-card p {
    max-width: 100%;
    word-wrap: break-word;
  }

  /* -------------------------------------------------------------------------
     For Schools: Icon alignment fix
     Icons were -72px offset from headings due to desktop positioning
     ------------------------------------------------------------------------- */
  .ukse-for-schools__why-icon {
    position: static !important;
    display: block !important;
    margin: 0 auto 12px auto !important;
    transform: none !important;
  }

  /* -------------------------------------------------------------------------
     For Schools: Panel and pill mobile adjustments
     Reduce padding on info panels and tier pills
     ------------------------------------------------------------------------- */
  .ukse-for-schools__how-panel,
  .ukse-for-schools__content div[style*="padding: 25px"] {
    padding: 16px 12px !important;
  }

  .ukse-for-schools__tier-pill {
    padding: 8px 12px !important;
    font-size: 0.85rem !important;
  }

  /* -------------------------------------------------------------------------
     For Schools: Tiers comparison table – horizontal scroll
     Prevents entire page from scrolling horizontally
     ------------------------------------------------------------------------- */
  .ukse-for-schools__tiers-table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .ukse-for-schools__tiers-table table {
    min-width: 600px; /* Force table to maintain readable width */
  }

  /* Visual hint that table scrolls */
  .ukse-for-schools__tiers-table::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 20px;
    background: linear-gradient(to right, transparent, rgba(255,255,255,0.8));
    pointer-events: none;
  }

  /* Wrapper needs relative positioning for scroll hint */
  .ukse-for-schools__tiers-table {
    position: relative;
  }

  /* -------------------------------------------------------------------------
     /home-english-tuition/ – H2 underline & CTA pill fixes
     ------------------------------------------------------------------------- */
  .ukse-home-tuition-landing__hero h2 {
    max-width: 100% !important;
    padding-inline: 0 !important;
    overflow-wrap: break-word !important;
  }

  .ukse-home-tuition-landing__hero h2::after {
    max-width: 100% !important;
  }

  .ukse-home-tuition-landing__card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    margin: 0 0 16px 0 !important;
    box-sizing: border-box !important;
  }

  /* -------------------------------------------------------------------------
     Page wrapper padding reduction for info pages
     ------------------------------------------------------------------------- */
  #ukse-home-tuition .ukse-page-inner,
  #ukse-teach-and-host .ukse-page-inner {
    padding: 12px !important;
  }

  #ukse-home-tuition .ukse-home-tuition__article,
  #ukse-teach-and-host .ukse-teach-and-host__article {
    padding: 16px 12px !important;
  }

  /* -------------------------------------------------------------------------
     /home-english-tuition-students/ & /teach-and-host/ – Board options cards
     Keep backgrounds, fix icon positioning
     ------------------------------------------------------------------------- */
  .ukse-home-tuition__section--board,
  .ukse-teach-and-host__section--board {
    padding: 8px 0 !important;
    overflow: hidden !important;
  }

  #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card,
  #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important;
    padding: 48px 16px 16px 16px !important;
    border-radius: 12px !important;
    /* Background colors are set via :nth-of-type in ukse-home-tuition.css */
  }

  /* Preserve nth-child backgrounds - re-declare with higher specificity */
  #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card:nth-of-type(1) {
    background: #fff5ef !important;
  }
  #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card:nth-of-type(2) {
    background: #f3f8ff !important;
  }
  #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card:nth-of-type(3) {
    background: #f3fbf4 !important;
  }
  #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card:nth-of-type(4) {
    background: #fff4fb !important;
  }

  #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card:nth-of-type(1) {
    background: #fff5ef !important;
  }
  #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card:nth-of-type(2) {
    background: #f3f8ff !important;
  }
  #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card:nth-of-type(3) {
    background: #f3fbf4 !important;
  }
  #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card:nth-of-type(4) {
    background: #fff4fb !important;
  }

  /* Icon positioning for board cards */
  #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card::before,
  #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card::before {
    position: absolute !important;
    top: 12px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
  }

  #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card,
  #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card {
    position: relative !important;
  }

  /* -------------------------------------------------------------------------
     /for-schools/ – Content width & why-grid icon alignment
     ------------------------------------------------------------------------- */
  .ukse-for-schools__inner {
    padding: 12px !important;
  }

  .ukse-for-schools__content {
    padding-inline: 0 !important;
  }

  .ukse-for-schools__why-grid {
    display: block !important;
    width: 100% !important;
  }

  .ukse-for-schools__why-card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important;
    padding: 20px 16px !important;
    text-align: center !important;
  }

  .ukse-for-schools__why-icon {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 12px auto !important;
    transform: none !important;
  }

  .ukse-for-schools__why-card h3 {
    text-align: center !important;
  }

  .ukse-for-schools__why-card p {
    text-align: left !important;
  }

  /* Tier cards - keep backgrounds, ensure full width */
  .ukse-for-schools__tier-card,
  .ukse-for-schools__investment-card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important;
  }

  /* =========================================================================
     PHASE XVIII-E: Additional mobile polish (H2, card padding, sections)
     ========================================================================= */

  /* --- Home English Tuition Landing – hero H2 underline + CTA --- */
  .ukse-home-tuition-landing__hero h2 {
    max-width: 100% !important;
    padding-inline: 0 !important;
    box-sizing: border-box !important;
  }

  .ukse-home-tuition-landing__hero h2::after {
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    margin-inline: auto !important;
  }

  /* Make CTA pill full-width and centred */
  .ukse-home-tuition-landing__cta-pill,
  .ukse-home-tuition-landing__card .btn,
  .ukse-home-tuition-landing__card a.button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    margin-top: 16px !important;
  }

  /* --- Home English Tuition Students: board cards + how section --- */
  /* Extra top padding so icon badge doesn't sit on heading */
  .page-template-page-home-tuition-student .ukse-home-tuition__card {
    padding-top: 56px !important;
  }

  /* Flatten nested wrapper in HOW section for breathing space */
  .ukse-home-tuition__section--how > div[style*="padding"],
  .ukse-home-tuition__section--how > div[style*="background"] {
    padding-inline: 8px !important;
    margin-inline: 0 !important;
  }

  /* --- Teach & Host: board cards + pricing/process wrappers --- */
  .page-template-page-teach-and-host .ukse-teach-and-host__card {
    padding-top: 56px !important;
  }

  /* Flatten nested wrappers in pricing/process sections */
  .ukse-teach-and-host__section--pricing > div[style*="padding"],
  .ukse-teach-and-host__section--pricing > div[style*="background"],
  .ukse-teach-and-host__section--process > div[style*="padding"],
  .ukse-teach-and-host__section--process > div[style*="background"] {
    padding-inline: 8px !important;
    margin-inline: 0 !important;
  }

  /* --- For Schools: vertical spacing + ready card --- */
  /* Tighten vertical spacing between sections */
  .ukse-for-schools__content > section {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }

  .ukse-for-schools__content > section + section {
    margin-top: 12px !important;
  }

  /* Restore dark panel for ready card so white text is readable */
  .ukse-for-schools__ready-card {
    background: linear-gradient(135deg, #000032 0%, #2a5298 100%) !important;
    color: #ffffff !important;
    padding: 24px 16px !important;
    border-radius: 12px !important;
  }

  .ukse-for-schools__ready-card h2,
  .ukse-for-schools__ready-card h3,
  .ukse-for-schools__ready-card p,
  .ukse-for-schools__ready-card .ukse-for-schools__ready-body {
    color: #ffffff !important;
  }

  .ukse-for-schools__ready-card .ukse-for-schools__ready-button,
  .ukse-for-schools__ready-card .btn {
    background: #ffffff !important;
    color: #000032 !important;
  }

  /* =========================================================================
     PHASE XVIII-E.2: Additional mobile polish refinements
     ========================================================================= */

  /* -------------------------------------------------------------------------
     1) /home-english-tuition/ (page-id-764) – Hero H2 Underline + CTA Pill
     ------------------------------------------------------------------------- */
  /* H2 underline: centre and constrain width */
  body.page-id-764 .entry-content h2::after,
  .ukse-home-tuition-landing__hero h2::after {
    position: relative !important;
    display: block !important;
    width: 60px !important;
    max-width: 100% !important;
    margin: 8px auto 0 auto !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
  }

  /* Ensure H2 itself is centred text on mobile */
  body.page-id-764 .entry-content h2,
  .ukse-home-tuition-landing__hero h2 {
    text-align: center !important;
    position: relative !important;
  }

  /* CTA pill: full-width centred */
  body.page-id-764 .ukse-home-tuition-landing__cta-pill,
  body.page-id-764 .ukse-home-tuition-landing__card .btn,
  body.page-id-764 .ukse-home-tuition-landing__card a.button,
  body.page-id-764 .entry-content .home-button {
    display: block !important;
    width: 100% !important;
    max-width: 320px !important;
    margin: 16px auto 0 auto !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  /* -------------------------------------------------------------------------
     2) /home-english-tuition-students/ – Board Card Icon Spacing + How Section
     ------------------------------------------------------------------------- */
  /* Increase top padding so icon badge has more breathing room */
  .page-template-page-home-tuition-student #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card {
    padding-top: 64px !important;
  }

  /* Position icon higher */
  .page-template-page-home-tuition-student #ukse-home-tuition .ukse-home-tuition__section--board .ukse-home-tuition__card::before {
    top: 10px !important;
  }

  /* "How" section: flatten nested wrappers more aggressively */
  #ukse-home-tuition .ukse-home-tuition__section--how {
    padding: 16px 10px !important;
    margin-inline: -2px !important;
  }

  #ukse-home-tuition .ukse-home-tuition__section--how > div[style],
  #ukse-home-tuition .ukse-home-tuition__section--how > div[style*="padding"],
  #ukse-home-tuition .ukse-home-tuition__section--how > div[style*="background"] {
    padding: 8px 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* List items: more horizontal room */
  #ukse-home-tuition .ukse-home-tuition__section--how li {
    padding-left: 3.2rem !important;
    padding-right: 12px !important;
  }

  /* -------------------------------------------------------------------------
     3) /teach-and-host/ – Board Card Icon Spacing + Pricing/Process Sections
     ------------------------------------------------------------------------- */
  /* Board card top padding for icon badge */
  .page-template-page-teach-and-host #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card {
    padding-top: 64px !important;
  }

  .page-template-page-teach-and-host #ukse-teach-and-host .ukse-teach-and-host__section--board .ukse-teach-and-host__card::before {
    top: 10px !important;
  }

  /* Pricing/process sections: expand width */
  #ukse-teach-and-host .ukse-teach-and-host__section--pricing,
  #ukse-teach-and-host .ukse-teach-and-host__section--process {
    padding: 16px 10px !important;
    margin-inline: -2px !important;
  }

  #ukse-teach-and-host .ukse-teach-and-host__section--pricing > div[style],
  #ukse-teach-and-host .ukse-teach-and-host__section--pricing > div[style*="padding"],
  #ukse-teach-and-host .ukse-teach-and-host__section--process > div[style],
  #ukse-teach-and-host .ukse-teach-and-host__section--process > div[style*="padding"] {
    padding: 8px 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* List items: more horizontal room */
  #ukse-teach-and-host .ukse-teach-and-host__section--pricing li,
  #ukse-teach-and-host .ukse-teach-and-host__section--process li {
    padding-left: 3.2rem !important;
    padding-right: 12px !important;
  }

  /* -------------------------------------------------------------------------
     4) /for-schools/ – Vertical Rhythm + Why-Icon Alignment + Card Padding
     ------------------------------------------------------------------------- */
  /* Tighten vertical spacing between sections */
  #ukse-for-schools .ukse-for-schools__content > section,
  #ukse-for-schools .ukse-for-schools__content > div > section {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    margin-top: 8px !important;
    margin-bottom: 8px !important;
  }

  /* Consecutive sections: even tighter */
  #ukse-for-schools .ukse-for-schools__content > section + section,
  #ukse-for-schools .ukse-for-schools__content > div + div {
    margin-top: 6px !important;
  }

  /* How-panel and grids: tighter spacing */
  #ukse-for-schools .ukse-for-schools__how-panel {
    padding: 12px 12px 16px !important;
    margin-top: 16px !important;
    margin-bottom: 16px !important;
  }

  #ukse-for-schools .ukse-for-schools__why-grid,
  #ukse-for-schools .ukse-for-schools__tier-highlights,
  #ukse-for-schools .ukse-for-schools__investment-grid {
    gap: 12px !important;
    margin-top: 12px !important;
    margin-bottom: 12px !important;
  }

  /* Why-grid icon alignment fix */
  #ukse-for-schools .ukse-for-schools__why-icon {
    width: 52px !important;
    height: 52px !important;
    font-size: 1.4rem !important;
    margin-bottom: 10px !important;
  }

  #ukse-for-schools .ukse-for-schools__why-icon i {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    line-height: 1 !important;
  }

  /* Why-card: reduce internal padding */
  #ukse-for-schools .ukse-for-schools__why-card {
    padding: 16px 14px !important;
  }

  /* Tier/investment cards: tighter padding */
  #ukse-for-schools .ukse-for-schools__tier-card,
  #ukse-for-schools .ukse-for-schools__investment-card {
    padding: 14px 14px 12px !important;
    margin-bottom: 10px !important;
  }

  /* Ready card: reduce padding but keep dark background */
  #ukse-for-schools .ukse-for-schools__ready-card {
    padding: 20px 14px !important;
    margin-top: 16px !important;
  }

  /* =========================================================================
     PHASE XVIII-E.3: Final mobile polish – CTA pills, bullets, blue box, spacing
     ========================================================================= */

  /* -------------------------------------------------------------------------
     1) /home-english-tuition/ (page-id-764) – CTA Pill Refinement
     Make CTA buttons feel integrated, balanced, and not overpowering
     ------------------------------------------------------------------------- */
  body.page-id-764 .ukse-home-tuition-landing__card .home-button,
  body.page-id-764 .ukse-home-tuition-landing__card a[href*="tuition"],
  body.page-id-764 .ukse-home-tuition-landing__card a[href*="teach"],
  body.page-id-764 .entry-content .ukse-home-tuition-landing__audiences .home-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: 280px !important;
    min-width: 200px !important;
    margin: 12px auto 0 auto !important;
    padding: 10px 20px !important;
    font-size: 0.9rem !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
  }

  /* Centre the CTA within its card */
  body.page-id-764 .ukse-home-tuition-landing__card {
    text-align: center !important;
  }

  body.page-id-764 .ukse-home-tuition-landing__card p {
    text-align: left !important;
  }

  /* -------------------------------------------------------------------------
     2) /home-english-tuition-students/ – CTA Section Bullet List Containment
     ------------------------------------------------------------------------- */
  .page-template-page-home-tuition-student #ukse-home-tuition .ukse-home-tuition__section--inline-cta {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 16px 12px !important;
    overflow: hidden !important;
  }

  .page-template-page-home-tuition-student #ukse-home-tuition .ukse-home-tuition__section--inline-cta ul {
    margin: 0 0 1rem 0 !important;
    padding-left: 1.25rem !important;
    list-style-position: inside !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .page-template-page-home-tuition-student #ukse-home-tuition .ukse-home-tuition__section--inline-cta li {
    margin-bottom: 0.5rem !important;
    padding-left: 0 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* Also target enquiry section bullets if any */
  .page-template-page-home-tuition-student #ukse-home-tuition .ukse-home-tuition__enquiry ul,
  .page-template-page-home-tuition-student #ukse-home-tuition .ukse-home-tuition__content ul {
    max-width: 100% !important;
    padding-left: 1.25rem !important;
    margin-left: 0 !important;
    box-sizing: border-box !important;
  }

  /* -------------------------------------------------------------------------
     3) /teach-and-host/ – Remove Blue Rectangle Artefact
     The blue outline comes from global *:focus style; neutralise on this page
     ------------------------------------------------------------------------- */
  .page-template-page-teach-and-host #ukse-teach-and-host .ukse-teach-and-host__application,
  .page-template-page-teach-and-host #ukse-teach-and-host .ukse-teach-and-host__application > div,
  .page-template-page-teach-and-host #ukse-teach-and-host .ukse-teach-and-host__content section {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
  }

  /* Remove any focus outline on section wrappers */
  .page-template-page-teach-and-host #ukse-teach-and-host section:focus,
  .page-template-page-teach-and-host #ukse-teach-and-host div:focus {
    outline: none !important;
  }

  /* Ensure application section has clean styling */
  .page-template-page-teach-and-host #ukse-teach-and-host .ukse-teach-and-host__application {
    background: transparent !important;
    border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
    padding: 16px 0 !important;
    margin-top: 24px !important;
  }

  /* -------------------------------------------------------------------------
     4) /for-schools/ – Further Vertical Spacing Reduction
     Tighten margins/padding on sections and H2s more aggressively
     ------------------------------------------------------------------------- */
  body.page-template-page-for-schools-partner #ukse-for-schools .ukse-for-schools__content h2 {
    margin-top: 16px !important;
    margin-bottom: 10px !important;
  }

  body.page-template-page-for-schools-partner #ukse-for-schools .ukse-for-schools__content > div {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    margin-top: 4px !important;
    margin-bottom: 4px !important;
  }

  body.page-template-page-for-schools-partner #ukse-for-schools .ukse-for-schools__inner {
    padding: 16px 14px !important;
  }

  /* Reduce spacing around headings in cards */
  body.page-template-page-for-schools-partner #ukse-for-schools .ukse-for-schools__why-card h3,
  body.page-template-page-for-schools-partner #ukse-for-schools .ukse-for-schools__tier-card h3,
  body.page-template-page-for-schools-partner #ukse-for-schools .ukse-for-schools__investment-card h3 {
    margin-top: 0 !important;
    margin-bottom: 6px !important;
  }

  /* Tighter spacing for the ready section */
  body.page-template-page-for-schools-partner #ukse-for-schools .ukse-for-schools__ready-card {
    margin-top: 12px !important;
    padding: 16px 12px !important;
  }

}

/* ==========================================================================
   Course CPT: Phase 1 Uplift Styles (Dec 2025)
   - Level helper block
   - School context block
   - School imagery strip
   ========================================================================== */

/* ---------------------------------------------------------------------
   Level Helper Block – "Not sure of your level?"
   --------------------------------------------------------------------- */
.course-level-helper {
  margin-top: 32px;
  padding: 24px;
  background: var(--ukse-tint, #F7F9FF);
  border-radius: 8px;
  border-left: 4px solid var(--lse-tertiary-blue, #6ACAF3);
}

.course-level-helper__title {
  margin: 0 0 8px 0;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--lse-structure-navy, #000032);
  text-align: left;
}

.course-level-helper__title::after {
  display: none;
}

.course-level-helper__text {
  margin: 0 0 16px 0;
  font-size: 0.95rem;
  color: var(--lse-neutral-gray, #666);
  line-height: 1.5;
}

.course-level-helper__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.course-level-helper__actions .home-button {
  flex-shrink: 0;
}

.course-level-helper__link {
  color: var(--lse-primary-magenta, #E6007E);
  text-decoration: none;
  font-weight: 500;
  font-size: 0.9rem;
}

.course-level-helper__link:hover {
  text-decoration: underline;
}

@media (max-width: 600px) {
  .course-level-helper {
    padding: 16px;
  }

  .course-level-helper__actions {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ---------------------------------------------------------------------
   School Context Block – "About this school"
   --------------------------------------------------------------------- */
.course-section--school-context {
  margin-top: 40px;
}

.course-school-context {
  background: var(--lse-white, #fff);
  border: 1px solid rgba(0, 0, 50, 0.1);
  border-radius: 8px;
  padding: 24px;
}

.course-school-context__heading {
  margin: 0 0 16px 0 !important;
  font-size: 1.5rem !important;
  text-align: left !important;
}

.course-school-context__heading::after {
  display: none !important;
}

.course-school-context__body.has-logo {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}
.course-school-context__logo {
  flex-shrink: 0;
  width: 88px;
  height: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid rgba(0, 0, 50, 0.08);
  border-radius: 10px;
  padding: 8px;
}
.course-school-context__logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.course-school-context__main {
  margin-bottom: 0;
  min-width: 0;
}
@media (max-width: 480px) {
  .course-school-context__body.has-logo {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .course-school-context__logo {
    width: 72px;
    height: 72px;
  }
}

.course-school-context__name {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--lse-structure-navy, #000032);
  margin: 0 0 8px 0;
}

.course-school-context__excerpt {
  font-size: 0.95rem;
  color: var(--lse-neutral-gray, #666);
  line-height: 1.6;
  margin: 0 0 16px 0;
}

.course-school-context__cta {
  margin: 0;
}

.course-school-context__cta .home-button {
  display: inline-block;
}

.course-school-context__contact {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(0, 0, 50, 0.08);
}

.course-school-context__contact-title {
  margin: 0 0 12px 0 !important;
  font-size: 1rem !important;
  font-weight: 600;
  color: var(--lse-structure-navy, #000032);
  text-align: left !important;
}

.course-school-context__contact-title::after {
  display: none !important;
}

.course-school-context__contact-item {
  margin: 0 0 8px 0;
  font-size: 0.9rem;
  color: var(--lse-neutral-gray, #666);
  line-height: 1.5;
}

.course-school-context__contact-item:last-child {
  margin-bottom: 0;
}

.course-school-context__contact-item strong {
  color: var(--lse-structure-navy, #000032);
  font-weight: 600;
  margin-right: 4px;
}

.course-school-context__contact-item a {
  color: var(--lse-primary-magenta, #E6007E);
  text-decoration: none;
}

.course-school-context__contact-item a:hover {
  text-decoration: underline;
}

@media (max-width: 600px) {
  .course-school-context {
    padding: 16px;
  }

  .course-school-context__heading {
    font-size: 1.25rem !important;
  }
}

/* ---------------------------------------------------------------------
   School Imagery Strip – "A glimpse of the school"
   --------------------------------------------------------------------- */
.course-section--school-images {
  margin-top: 40px;
}

.course-school-images {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  position: relative;
}

.course-school-images__item {
  margin: 0;
  overflow: hidden;
  border-radius: 8px;
  aspect-ratio: 4 / 3;
}

.course-school-images__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.course-school-images__item:hover img {
  transform: scale(1.05);
}

.course-school-images__more {
  /* Grid positioning for the CTA within the images grid */
  grid-column: 1 / -1;
  justify-self: center;
  margin-top: 8px;
}

@media (max-width: 768px) {
  .course-school-images {
    grid-template-columns: repeat(2, 1fr);
  }

  .course-school-images__item:nth-child(3) {
    display: none;
  }
}

@media (max-width: 480px) {
  .course-school-images {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .course-school-images__item:nth-child(2),
  .course-school-images__item:nth-child(3) {
    display: none;
  }
}

/* ---------------------------------------------------------------------
   Phase 2: Soften course-school-bar (logo bar below hero)
   Override base styles from ukse-pricebands-detail.css for lighter feel
   --------------------------------------------------------------------- */
.course-school-bar {
  background: linear-gradient(to right, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.98));
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  padding: 0.5rem 0;
}

.course-school-bar__logo {
  max-height: 48px;
  width: auto;
  object-fit: contain;
}

.course-school-bar__name {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--lse-neutral-gray, #666);
}

.course-school-bar__link:hover .course-school-bar__name {
  color: var(--lse-primary-magenta, #E6007E);
}

@media (max-width: 600px) {
  .course-school-bar {
    padding: 0.4rem 0;
  }

  .course-school-bar__logo {
    max-height: 36px;
  }

  .course-school-bar__name {
    font-size: 0.85rem;
  }
}

/* ==========================================================================
   Course CPT: 2-Column Layout (Overview + Sidebar)
   Desktop: overview left, key facts + details right
   Mobile: stacked vertically
   ========================================================================== */

.course-single__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: 2.5rem;
  align-items: flex-start;
  margin-bottom: 1.5rem;
}

.course-section--overview {
  /* Overview takes full left column */
}

/* Note: Overview title styles moved to unified typography section below */

.course-single__sidebar {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  position: sticky;
  top: 2rem;
}

/* Sidebar Key Facts card */
.course-single__sidebar .course-highlights {
  background: var(--lse-white, #ffffff);
  border: 1px solid rgba(0, 0, 50, 0.08);
  border-radius: 8px;
  padding: 1.25rem;
}

/* Note: Unified heading styles moved to "Course CPT: Unified Typography" section below */

.course-highlights__list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.course-single__sidebar .course-highlights__item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.course-single__sidebar .course-highlights__item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.course-single__sidebar .course-highlights__label {
  font-size: 0.85rem;
  color: var(--lse-neutral-gray, #666);
}

.course-single__sidebar .course-highlights__value {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--lse-structure-navy, #000032);
  text-align: right;
}

/* Sidebar Course Details card */
.course-section--details {
  background: var(--lse-white, #fff);
  border: 1px solid rgba(0, 0, 50, 0.1);
  border-radius: 8px;
  padding: 1.25rem;
}

/* Note: Details title styles moved to unified typography section below */

.course-section--details .course-details {
  width: 100%;
  font-size: 0.9rem;
}

.course-section--details .course-details th,
.course-section--details .course-details td {
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.course-section--details .course-details tr:last-child th,
.course-section--details .course-details tr:last-child td {
  border-bottom: none;
}

/* Level helper within sidebar */
.course-section--details .course-level-helper {
  margin-top: 1rem;
  padding: 1rem;
  background: var(--ukse-tint, #F7F9FF);
  border-left-width: 3px;
}

.course-section--details .course-level-helper__title {
  font-size: 0.95rem;
}

.course-section--details .course-level-helper__text {
  font-size: 0.85rem;
}

.course-section--details .course-level-helper__actions {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
}

.course-section--details .course-level-helper__actions .home-button {
  font-size: 0.85rem;
  padding: 0.5rem 1rem;
}

/* Mobile: stack vertically */
@media (max-width: 900px) {
  .course-single__grid {
    display: block;
  }

  .course-single__sidebar {
    margin-top: 1.5rem;
    position: static;
  }
}

/* Mobile: prevent Course CPT layout overflow
   Fixes right-edge clipping caused by parent theme fixed-width .wrap rules
   and insufficient padding reduction for narrow viewports */
@media (max-width: 480px) {
  /* Override parent theme's fixed .wrap width on course pages */
  .single-course .course-single__body.wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
  }

  /* Ensure grid and sections fit within viewport */
  .single-course .course-single__grid,
  .single-course .course-section,
  .single-course .course-section--overview {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  /* Reduce section padding for narrow screens */
  .single-course .course-section {
    padding: 20px;
  }
}

/* Tablet adjustments */
@media (min-width: 901px) and (max-width: 1100px) {
  .course-single__grid {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 2rem;
  }
}

/* ==========================================================================
   Course CPT: Price Bands Section Padding Fix
   Match padding with other card sections
   ========================================================================== */

.course-single #ukse-pricebands {
  padding: 1.5rem 2rem;
  background: var(--lse-white, #fff);
  border: 1px solid rgba(0, 0, 50, 0.08);
  border-radius: 8px;
  margin-bottom: 1.5rem;
}

/* ==========================================================================
   Course CPT: Full-Width Course Details Section
   (Below the price bands, contains levels, start dates, level helper)
   ========================================================================== */

.course-section--details-full {
  background: var(--lse-white, #fff);
  border: 1px solid rgba(0, 0, 50, 0.08);
  border-radius: 8px;
  padding: 1.5rem 2rem;
  margin-bottom: 1.5rem;
  /* Full width - no max-width constraint */
}

.course-section--details-full .course-details {
  width: 100%;
  font-size: 0.95rem;
}

.course-section--details-full .course-details th {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--lse-neutral-gray, #666);
  padding: 0.6rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.course-section--details-full .course-details td {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--lse-structure-navy, #000032);
  padding: 0.6rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.course-section--details-full .course-details tr:last-child th,
.course-section--details-full .course-details tr:last-child td {
  border-bottom: none;
}

/* 2-column grid: table left, level helper right */
.course-details-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: start;
}

.course-details-grid__table {
  /* Table column */
}

.course-details-grid__helper {
  /* Level helper column */
}

.course-details-grid .course-level-helper {
  margin-top: 0;
}

@media (max-width: 768px) {
  .course-details-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

@media (max-width: 600px) {
  .course-section--details-full {
    padding: 1.25rem;
  }
}

/* ==========================================================================
   Course CPT: 2-Column Band (About this school + Ready to enrol)
   Desktop: About school (2/3) | Ready to enrol (1/3)
   Mobile: stacked vertically
   ========================================================================== */

.course-section--school-and-enrol {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 2rem;
  align-items: flex-start;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.course-section--school-and-enrol__about {
  /* About this school takes 2/3 width */
}

.course-section--school-and-enrol__enrol {
  /* Ready to enrol takes 1/3 width */
  background: var(--lse-light-gray, #f5f5f5);
  border-radius: 8px;
  padding: 1.5rem;
}

/* Note: Enrol title styles moved to unified typography section below */

.course-section--school-and-enrol__enrol .course-section__lead {
  font-size: 0.9rem;
  color: var(--lse-neutral-gray, #666);
  margin: 0 0 1rem 0;
  line-height: 1.5;
}

.course-section--school-and-enrol__enrol .course-cta-buttons {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.course-section--school-and-enrol__enrol .course-cta-buttons .home-button {
  text-align: center;
  justify-content: center;
}

@media (max-width: 900px) {
  .course-section--school-and-enrol {
    display: block;
  }

  .course-section--school-and-enrol__enrol {
    margin-top: 2rem;
  }

  .course-section--school-and-enrol__enrol .course-cta-buttons {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

/* ==========================================================================
   Course CPT: Unified Typography (Dec 2025)
   Single consistent style for all H2 section titles with magenta underline
   ========================================================================== */

/* All H2 section titles on the course page - match Price bands canonical style (2rem = 32px) */
.course-single .course-section__title {
  font-size: 2rem !important;
  font-weight: 700 !important;
  color: var(--ukse-ink, var(--lse-structure-navy, #0B0B29)) !important;
  text-align: center !important;
  margin: 0 0 1.25rem 0 !important;
  position: relative !important;
  padding-bottom: 0.75rem !important;
}

/* Magenta underline for all section titles - centered (matches global h2::after) */
.course-single .course-section__title::after {
  content: '' !important;
  display: block !important;
  width: var(--lse-heading-underline-width, 300px) !important;
  height: var(--lse-heading-underline-height, 4px) !important;
  background: var(--lse-primary-magenta, #E6007E) !important;
  margin: var(--lse-heading-underline-margin-top, 15px) auto 0 !important;
  border-radius: 2px !important;
}

/* Body copy normalisation */
.course-single .course-section__content p,
.course-single .course-school-context__excerpt {
  font-size: 1rem;
  line-height: 1.65;
  color: var(--lse-structure-navy, #000032);
  text-align: left;
}

/* Key facts label/value typography - labels match body copy */
.course-single .course-highlights__label {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: normal;
  color: var(--lse-structure-navy, #000032);
  text-transform: none;
  text-align: left;
}

.course-single .course-highlights__value {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--lse-structure-navy, #000032);
  text-align: right;
}

/* Course details table typography - th matches body copy */
.course-single .course-details th {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.65;
  color: var(--lse-structure-navy, #000032);
  text-align: left;
}

.course-single .course-details td {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--lse-structure-navy, #000032);
  text-align: left;
}

/* School context block body text */
.course-single .course-school-context__name {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--lse-structure-navy, #000032);
}

/* Ensure left alignment throughout */
.course-single .course-section,
.course-single .course-highlights,
.course-single .course-school-context {
  text-align: left;
}

/* Override previous per-section rules that hid the underline - centered */
.course-single .course-section--overview .course-section__title::after,
.course-single .course-single__sidebar .course-section__title::after,
.course-single .course-section--details-full .course-section__title::after,
.course-single .course-section--school-and-enrol__enrol .course-section__title::after,
.course-single .course-school-context .course-section__title::after,
.course-single .course-section--school-images .course-section__title::after,
.course-single .course-related .course-section__title::after {
  content: '' !important;
  display: block !important;
  width: var(--lse-heading-underline-width, 300px) !important;
  height: var(--lse-heading-underline-height, 4px) !important;
  background: var(--lse-primary-magenta, #E6007E) !important;
  margin: var(--lse-heading-underline-margin-top, 15px) auto 0 !important;
  border-radius: 2px !important;
}

/* Override previous per-section title size/margin/alignment overrides */
.course-single .course-section--overview .course-section__title,
.course-single .course-single__sidebar .course-section__title,
.course-single .course-section--details-full .course-section__title,
.course-single .course-section--school-and-enrol__enrol .course-section__title,
.course-single .course-school-context .course-section__title,
.course-single .course-section--school-images .course-section__title,
.course-single .course-related .course-section__title {
  font-size: 2rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  margin: 0 0 1.25rem 0 !important;
}

/* ==========================================================================
   About Us Page Styles (ACF-driven sections)
   ========================================================================== */

/* Common section styles */
.about-intro,
.about-brands,
.about-different,
.about-dodont,
.about-how,
.about-values,
.about-cta {
    padding: 60px 0;
}

.about-intro__body,
.about-brands__body,
.about-different__body {
    max-width: 800px;
    margin: 0 auto 2rem;
    text-align: left;
    font-size: 1.1rem;
    line-height: 1.7;
    color: #13315c;
}

/* Subheadings within sections */
.about-section-subheading {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--lse-structure-navy);
    margin: 2.5rem 0 1.25rem;
    text-align: center;
}

.about-section-subheading:first-of-type {
    margin-top: 0;
}

/* Card grids */
.about-cards {
    display: grid;
    gap: 1.5rem;
    margin-top: 2rem;
}

.about-cards--intro,
.about-cards--different {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.about-cards--brands,
.about-cards--values {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

/* Generic card style - accent bar via data-ukse-card system */
.about-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 1.75rem;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.06);
}

.about-card h3 {
    color: var(--lse-structure-navy);
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
}

.about-card h3 i,
.about-value-card h3 i {
    color: var(--card-accent, var(--lse-primary-magenta));
    margin-right: 0.5rem;
}

.about-card p {
    color: #5a6170;
    line-height: 1.6;
    margin: 0;
}

/* Brand cards */
.about-brand-card {
    text-align: center;
    border-radius: 16px;
    padding: 2rem 1.5rem;
    box-shadow: 0 10px 30px rgba(0, 0, 50, 0.06);
}

.about-brand-card__logo {
    height: 60px;
    width: auto;
    object-fit: contain;
    margin-bottom: 1rem;
}

.about-brand-card h4 {
    color: var(--lse-structure-navy);
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.about-brand-card p {
    color: #5a6170;
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0;
}

a.about-brand-card-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s, box-shadow 0.2s;
}
a.about-brand-card-link .about-brand-card {
    flex: 1;
}
a.about-brand-card-link:hover {
    transform: translateY(-3px);
}
a.about-brand-card-link:hover .about-brand-card {
    box-shadow: 0 14px 35px rgba(0, 0, 50, 0.12);
}

/* Dark brand cards (with colored backgrounds and white logos) */
.about-brand-card--dark h4,
.about-brand-card--dark p {
    color: #ffffff;
}

/* Do/Don't section */
.about-dodont__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
}

.about-dodont__card {
    border-radius: 16px;
    padding: 2rem;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.06);
}

.about-dodont__card--do {
    background: linear-gradient(180deg, #e8ffe8 0%, #f9f9f9 100%);
    border-left: 4px solid #08913f;
}

.about-dodont__card--dont {
    background: linear-gradient(180deg, #ffe8f4 0%, #f9f9f9 100%);
    border-left: 4px solid var(--lse-primary-magenta);
}

.about-dodont__card--do h3 {
    color: #08913f;
}

.about-dodont__card--dont h3 {
    color: var(--lse-primary-magenta);
}

.about-dodont__card h3 i {
    margin-right: 0.5rem;
}

.about-dodont__card h3 {
    font-size: 1.3rem;
    margin-bottom: 1rem;
}

.about-dodont__card ul {
    padding-left: 1.25rem;
    margin: 0;
}

.about-dodont__card li {
    color: #5a6170;
    margin-bottom: 0.5rem;
    line-height: 1.5;
}

/* How it works / Steps */
.about-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.about-step {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: #ffffff;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 6px 20px rgba(0, 0, 50, 0.05);
}

.about-step__number {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background: var(--lse-primary-magenta);
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
}

.about-step__content h3 {
    color: var(--lse-structure-navy);
    font-size: 1.1rem;
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.about-step__content p {
    color: #5a6170;
    line-height: 1.5;
    margin: 0;
    font-size: 0.95rem;
}

/* Value cards */
.about-value-card {
    border-radius: 16px;
    padding: 1.75rem;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.06);
}

.about-value-card h3 {
    color: var(--lse-structure-navy);
    font-size: 1.2rem;
    margin-bottom: 0.75rem;
}

.about-value-card p {
    color: #5a6170;
    line-height: 1.6;
    margin: 0;
}

/* CTA section */
.about-cta {
    text-align: center;
}

.about-cta__content {
    max-width: 600px;
    margin: 0 auto;
}

.about-cta__content p {
    color: #5a6170;
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

/* Responsive */
@media (max-width: 768px) {
    .about-intro,
    .about-brands,
    .about-different,
    .about-dodont,
    .about-how,
    .about-values,
    .about-cta {
        padding: 40px 0;
    }

    .about-cards,
    .about-dodont__grid,
    .about-steps {
        grid-template-columns: 1fr;
    }

    .about-step {
        flex-direction: column;
        text-align: center;
    }

    .about-step__number {
        margin: 0 auto;
    }
}

/* ========================================
   For Schools Page Sections
   ======================================== */

.for-schools-why,
.for-schools-tiers,
.for-schools-table,
.for-schools-how,
.for-schools-invest,
.for-schools-faq,
.for-schools-contact {
    padding: 60px 0;
}

/* Why Schools Choose Cards */
.for-schools-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    margin-top: 2rem;
}

.for-schools-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 1.75rem;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.06);
    border-top: 4px solid var(--lse-tertiary-blue);
}

/* Card header with inline icon */
.for-schools-card__header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.for-schools-card__icon {
    width: 50px;
    height: 50px;
    min-width: 50px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--lse-tertiary-blue), var(--lse-primary-magenta));
    display: flex;
    align-items: center;
    justify-content: center;
}

.for-schools-card__icon i {
    color: #ffffff;
    font-size: 1.25rem;
}

.for-schools-card h3 {
    color: var(--lse-structure-navy);
    font-size: 1.2rem;
    margin: 0 0 0.75rem 0;
}

.for-schools-card h3 i {
    color: var(--lse-primary-magenta);
    margin-right: 0.5rem;
}

.for-schools-card p {
    color: #5a6170;
    line-height: 1.6;
    margin: 0;
}

/* Tier Cards */
.for-schools-tier-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 2rem;
}

.for-schools-tier-card {
    border-radius: 16px;
    padding: 1.75rem;
    text-align: center;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.06);
}

.for-schools-tier-card--silver {
    background: linear-gradient(180deg, #f4f4f6 0%, #ffffff 100%);
    border-top: 4px solid #a8a8a8;
}

.for-schools-tier-card--gold {
    background: linear-gradient(180deg, #fff8e8 0%, #ffffff 100%);
    border-top: 4px solid #d4af37;
}

.for-schools-tier-card--platinum {
    background: linear-gradient(180deg, #e8f4ff 0%, #ffffff 100%);
    border-top: 4px solid #6ACAF3;
}

.for-schools-tier-card__pill {
    display: inline-block;
    padding: 0.5rem 1rem;
    border-radius: 999px;
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: 1rem;
}

.for-schools-tier-card--silver .for-schools-tier-card__pill {
    background: #e8e8ea;
    color: #5a5a5a;
}

.for-schools-tier-card--gold .for-schools-tier-card__pill {
    background: #fff0c0;
    color: #8b6914;
}

.for-schools-tier-card--platinum .for-schools-tier-card__pill {
    background: #d0efff;
    color: #2a5298;
}

.for-schools-tier-card p {
    color: #5a6170;
    line-height: 1.6;
    margin: 0;
}

/* Comparison Table */
.for-schools-table__heading {
    text-align: center;
    color: var(--lse-structure-navy);
    font-size: 1.3rem;
    margin-bottom: 1.5rem;
}

.for-schools-table__wrapper {
    overflow-x: auto;
}

.for-schools-table__table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.06);
}

.for-schools-table__table th,
.for-schools-table__table td {
    padding: 1rem;
    text-align: left;
    border-bottom: 1px solid #e8e8ea;
}

.for-schools-table__table th {
    background: var(--lse-structure-navy);
    color: #ffffff;
    font-weight: 600;
}

.for-schools-table__table th:not(:first-child) {
    text-align: center;
}

.for-schools-table__table td:not(:first-child) {
    text-align: center;
}

/* Alt row shading */
.for-schools-table__table tbody tr:nth-child(even) td:first-child {
    background: #f8fafc;
}

/* Table header pills */
.for-schools-table__pill {
    display: inline-block;
    padding: 0.4rem 1rem;
    border-radius: 999px;
    font-weight: 600;
    font-size: 0.95rem;
}

.for-schools-table__pill--silver {
    background: #e8e8ea;
    color: #5a5a5a;
}

.for-schools-table__pill--gold {
    background: #fff0c0;
    color: #8b6914;
}

.for-schools-table__pill--platinum {
    background: #d0efff;
    color: #2a5298;
}

/* Column background shading */
.for-schools-table__table th.for-schools-table__col--silver,
.for-schools-table__table td.for-schools-table__col--silver {
    background: #f8f8fa;
}

.for-schools-table__table th.for-schools-table__col--gold,
.for-schools-table__table td.for-schools-table__col--gold {
    background: #fffbf0;
}

.for-schools-table__table th.for-schools-table__col--platinum,
.for-schools-table__table td.for-schools-table__col--platinum {
    background: #f0f8ff;
}

/* Alt row shading for tier columns */
.for-schools-table__table tbody tr:nth-child(even) td.for-schools-table__col--silver {
    background: #f0f0f4;
}

.for-schools-table__table tbody tr:nth-child(even) td.for-schools-table__col--gold {
    background: #fff5e0;
}

.for-schools-table__table tbody tr:nth-child(even) td.for-schools-table__col--platinum {
    background: #e8f4ff;
}

/* Header row styling */
.for-schools-table__table thead th {
    background: #ffffff;
    color: var(--lse-structure-navy);
    vertical-align: middle;
}

.for-schools-tick {
    color: #08913f;
    font-weight: bold;
}

.for-schools-table__note {
    margin-top: 1.5rem;
    color: #5a6170;
    font-style: italic;
}

/* How Partnership Works Panel */
.for-schools-how__panel {
    background: rgba(230, 240, 255, 0.5);
    border-left: 4px solid #2a5298;
    padding: 2rem;
    border-radius: 12px;
}

.for-schools-how__panel h2 {
    color: var(--lse-structure-navy);
    margin-bottom: 1.5rem;
}

.for-schools-how__steps {
    line-height: 1.8;
    padding-left: 1.5rem;
}

.for-schools-how__steps li {
    margin-bottom: 1rem;
    color: #5a6170;
}

.for-schools-how__steps li strong {
    color: var(--lse-structure-navy);
}

.for-schools-how__note {
    margin-top: 1.5rem;
    color: #5a6170;
}

/* Investment Cards */
.for-schools-cards--invest {
    grid-template-columns: repeat(3, 1fr);
}

/* CTA Section */
.for-schools-cta {
    padding: 60px 0;
}

.for-schools-cta__card {
    background: linear-gradient(135deg, #000032 0%, #2a5298 100%);
    border-radius: 16px;
    padding: 3rem 2rem;
    text-align: center;
    box-shadow: 0 14px 40px rgba(42, 82, 152, 0.15);
}

.for-schools-cta__card h2,
.for-schools-cta__title,
.for-schools-cta .for-schools-cta__card h2.for-schools-cta__title {
    color: #ffffff !important;
    margin-top: 0 !important;
    margin-bottom: 1rem;
    font-size: 1.8rem;
    text-align: center !important;
}

/* Override global h2 underline for CTA */
.for-schools-cta__card h2::after,
h2.for-schools-cta__title::after {
    display: none !important;
}

.for-schools-cta__card p {
    color: #ffffff;
    font-size: 1.1rem;
    margin-bottom: 2rem;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.for-schools-cta__button {
    background: var(--lse-primary-magenta);
    color: #ffffff;
    border: none;
    padding: 1rem 2rem;
    border-radius: 999px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.for-schools-cta__button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(226, 0, 116, 0.3);
}

/* Contact Section */
.for-schools-contact {
    background: #f4f8fb !important;
}

.for-schools-contact__card {
    background: #ffffff;
    border-radius: 12px;
    padding: 2rem;
    max-width: 600px;
    margin: 1.5rem auto 0;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.06);
}

.for-schools-contact__card p {
    margin: 0.75rem 0;
    color: #5a6170;
}

.for-schools-contact__card a {
    color: var(--lse-tertiary-blue);
}

/* Responsive */
@media (max-width: 768px) {
    .for-schools-why,
    .for-schools-tiers,
    .for-schools-table,
    .for-schools-how,
    .for-schools-invest,
    .for-schools-faq,
    .for-schools-contact {
        padding: 40px 0;
    }

    .for-schools-cards,
    .for-schools-tier-cards {
        grid-template-columns: 1fr;
    }

    .for-schools-cards--invest {
        grid-template-columns: 1fr;
    }
}

/* ========================================
   Contact Us Page
   ======================================== */

.contact-content {
    padding: 60px 0;
}

@media (max-width: 768px) {
    .contact-content {
        padding: 40px 0;
    }
}

/* Contact Page Grid Layout */
.contact-page-content {
    max-width: 100%;
}

.contact-intro {
    text-align: center;
    margin-bottom: 2.5rem;
    font-size: 1.1rem;
    color: #5a6170;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 3rem;
    align-items: start;
}

.contact-form-section,
.contact-info-section {
    background: #ffffff;
    border-radius: 16px;
    padding: 2rem;
    box-shadow: 0 8px 24px rgba(0, 0, 50, 0.06);
}

.contact-form-section h2,
.contact-info-section h2 {
    color: var(--lse-structure-navy);
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--lse-primary-magenta);
}

.contact-form-section h2::after,
.contact-info-section h2::after {
    display: none !important;
}

.contact-info-section p {
    margin-bottom: 1.25rem;
    line-height: 1.6;
}

.contact-info-section a {
    color: var(--lse-tertiary-blue);
}

/* Contact Form 7 Styling */
.contact-form-section .wpcf7-form label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: var(--lse-structure-navy);
}

.contact-form-section .wpcf7-form input[type="text"],
.contact-form-section .wpcf7-form input[type="email"],
.contact-form-section .wpcf7-form input[type="tel"],
.contact-form-section .wpcf7-form textarea {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 1rem;
    margin-bottom: 1rem;
}

.contact-form-section .wpcf7-form textarea {
    min-height: 150px;
    resize: vertical;
}

.contact-form-section .wpcf7-form input[type="submit"] {
    background: var(--lse-primary-magenta);
    color: #ffffff;
    border: none;
    padding: 0.875rem 2rem;
    border-radius: 999px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.contact-form-section .wpcf7-form input[type="submit"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(230, 0, 126, 0.3);
}

@media (max-width: 768px) {
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
}

/* ==========================================================================
   Students & Teach-and-Host Page Sections
   ========================================================================== */

/* Section padding - consistent with about-us */
.students-what,
.students-how,
.students-board,
.students-food,
.students-goals,
.students-week,
.students-avail,
.students-practical,
.students-faq,
.students-notsure,
.students-cta,
.tah-intro,
.tah-what,
.tah-students,
.tah-pricing,
.tah-avail,
.tah-standards,
.tah-week,
.tah-board,
.tah-profile,
.tah-process,
.tah-faq,
.tah-cta {
    padding: 60px 0;
}

/* Body text styling */
.students-what__body,
.students-food__body,
.students-goals__body,
.students-avail__body,
.students-practical__body,
.students-notsure__body,
.students-week__timetable,
.tah-what__body,
.tah-students__body,
.tah-pricing__body,
.tah-avail__body,
.tah-standards__body,
.tah-profile__body,
.tah-week__timetable {
    max-width: 800px;
    margin: 0 auto 2rem;
    font-size: 1.1rem;
    line-height: 1.7;
    color: #13315c;
}

/* Bulleted list indentation for body text sections */
.students-what__body ul,
.students-food__body ul,
.students-goals__body ul,
.students-avail__body ul,
.students-practical__body ul,
.students-notsure__body ul,
.students-week__timetable ul,
.tah-what__body ul,
.tah-students__body ul,
.tah-pricing__body ul,
.tah-avail__body ul,
.tah-standards__body ul,
.tah-profile__body ul,
.tah-week__timetable ul,
.about-card ul,
.for-schools-card ul,
.for-schools-why ul,
.for-schools-how ul,
.for-schools-invest ul {
    padding-left: 1.5rem;
    margin-left: 1rem;
}

/* Board intro text */
.students-board__intro,
.tah-board__intro {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 2rem;
    font-size: 1.1rem;
    color: #5a6170;
}

/* Intro cards - constrain to match body text width */
.students-what .about-cards--intro,
.tah-intro .about-cards--intro,
.tah-what .about-cards--intro {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

/* Intro highlight text */
.tah-intro__highlight {
    font-size: 1.3em;
    color: #E6007E;
    font-weight: 600;
    text-align: center;
    margin-bottom: 1rem;
}

/* CTA sections - white text on dark gradient background */
.students-cta,
.tah-cta {
    padding: 60px 0;
}

.students-cta .for-schools-cta__card,
.tah-cta .for-schools-cta__card {
    background: linear-gradient(135deg, #000032 0%, #2a5298 100%);
    border-radius: 16px;
    padding: 3rem 2rem;
    text-align: center;
    box-shadow: 0 14px 40px rgba(42, 82, 152, 0.15);
}

.students-cta .for-schools-cta__card h2,
.students-cta .for-schools-cta__card .for-schools-cta__title,
.students-cta .for-schools-cta__title,
.tah-cta .for-schools-cta__card h2,
.tah-cta .for-schools-cta__card .for-schools-cta__title,
.tah-cta .for-schools-cta__title {
    color: #ffffff !important;
    margin-top: 0 !important;
    margin-bottom: 1rem;
    font-size: 1.8rem;
    text-align: center !important;
}

.students-cta .for-schools-cta__card h2::after,
.students-cta .for-schools-cta__title::after,
.tah-cta .for-schools-cta__card h2::after,
.tah-cta .for-schools-cta__title::after {
    content: '';
    display: block !important;
    width: 60px;
    height: 3px;
    background: var(--lse-primary-magenta);
    margin: 0.75rem auto 0;
}

.students-cta .for-schools-cta__card p,
.students-cta__body,
.students-cta__body p,
.tah-cta .for-schools-cta__card p,
.tah-cta__body,
.tah-cta__body p,
.tah-cta__list,
.tah-cta__list p {
    color: #ffffff;
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

.students-cta__body ul,
.tah-cta__list ul {
    color: #ffffff;
    text-align: left;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
}

.students-cta__body li,
.tah-cta__list li {
    color: #ffffff;
}

.students-cta__body strong,
.tah-cta__list strong {
    color: #6ACAF3;
}

/* Board cards - meal plan icons and colored backgrounds */
.students-board .about-cards,
.tah-board .about-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.students-board .about-card,
.tah-board .about-card {
    position: relative;
    padding-top: 4.75rem;
    text-align: center;
    border-top: none;
}

.students-board .about-card::before,
.tah-board .about-card::before {
    content: "\f2e7";
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free", "Font Awesome", sans-serif;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #ff7e4a, #e6007e);
    color: #fff;
    font-size: 1.6rem;
    position: absolute;
    top: 1rem;
    left: 50%;
    transform: translateX(-50%);
}

/* Self-catering - utensils */
.students-board .about-card:nth-child(1)::before,
.tah-board .about-card:nth-child(1)::before {
    content: "\f2e7";
}
.students-board .about-card:nth-child(1),
.tah-board .about-card:nth-child(1) {
    background: #fff5ef;
}

/* Bed & breakfast - coffee mug */
.students-board .about-card:nth-child(2)::before,
.tah-board .about-card:nth-child(2)::before {
    content: "\f0f4";
}
.students-board .about-card:nth-child(2),
.tah-board .about-card:nth-child(2) {
    background: #f3f8ff;
}

/* Half board - bowl food */
.students-board .about-card:nth-child(3)::before,
.tah-board .about-card:nth-child(3)::before {
    content: "\f2e7";
}
.students-board .about-card:nth-child(3),
.tah-board .about-card:nth-child(3) {
    background: #f3fbf4;
}

/* Full board - star */
.students-board .about-card:nth-child(4)::before,
.tah-board .about-card:nth-child(4)::before {
    content: "\f005";
}
.students-board .about-card:nth-child(4),
.tah-board .about-card:nth-child(4) {
    background: #fff4fb;
}

.students-board .about-card h3,
.tah-board .about-card h3 {
    margin-top: 0;
}

@media (max-width: 768px) {
    .students-board .about-cards,
    .tah-board .about-cards {
        grid-template-columns: 1fr;
    }
}

/* Vertical cards layout (single column for process steps) */
.about-cards--vertical {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    max-width: 800px;
    margin: 2rem auto 0;
}

.about-card--process {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 1.5rem 2rem;
    border-top: none;
    border-left: 4px solid var(--lse-primary-magenta);
}

.about-card__number {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background: var(--lse-primary-magenta);
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
}

.about-card__content {
    flex: 1;
}

.about-card--process h3 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    text-align: left;
}

.about-card--process p {
    margin: 0;
    line-height: 1.6;
    text-align: left;
}

/* Responsive */
@media (max-width: 768px) {
    .students-what,
    .students-how,
    .students-board,
    .students-food,
    .students-goals,
    .students-week,
    .students-avail,
    .students-practical,
    .students-faq,
    .students-notsure,
    .students-cta,
    .tah-intro,
    .tah-what,
    .tah-students,
    .tah-pricing,
    .tah-avail,
    .tah-standards,
    .tah-week,
    .tah-board,
    .tah-profile,
    .tah-process,
    .tah-faq,
    .tah-cta {
        padding: 40px 0;
    }

    .students-cta .for-schools-cta__card,
    .tah-cta .for-schools-cta__card {
        padding: 2rem 1.5rem;
    }

    /* Vertical cards mobile */
    .about-card--process {
        flex-direction: column;
        padding: 1.25rem;
        text-align: center;
    }

    .about-card__number {
        margin: 0 auto 0.75rem;
    }

    .about-card--process h3,
    .about-card--process p {
        text-align: center;
    }
}

/* ==========================================================================
   UK English Adventure Games
   ========================================================================== */

/* Games Hub Layout */
.ukse-games-hub {
    padding: 2rem 1rem;
    max-width: 1200px;
    margin: 0 auto;
}

.ukse-games-hub__header {
    text-align: center;
    margin-bottom: 2rem;
}

.ukse-games-hub__title {
    font-size: 2rem;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 0.5rem;
}

.ukse-games-hub__intro {
    color: #555;
    max-width: 600px;
    margin: 0 auto;
}

.ukse-games-hub__progress {
    margin-top: 1rem;
    font-size: 0.95rem;
    color: var(--lse-structure-navy, #000032);
}

/* Game Cards */
.ukse-games-hub__cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-bottom: 3rem;
}

.ukse-game-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 1.5rem;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.ukse-game-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}

.ukse-game-card--locked {
    opacity: 0.7;
    background: #f9f9f9;
}

.ukse-game-card--completed {
    border-color: var(--lse-primary-magenta, #E6007E);
}

.ukse-game-card__title {
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
    color: var(--lse-structure-navy, #000032);
}

.ukse-game-card__description {
    color: #555;
    font-size: 0.9rem;
    margin-bottom: 1rem;
}

.ukse-game-card__button {
    display: inline-block;
    background-color: var(--lse-secondary-orange, #EE7218);
    color: #fff !important;
    padding: 0.6rem 1.25rem;
    border-radius: 4px;
    border: none;
    text-decoration: none !important;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.ukse-game-card__button:hover,
.ukse-game-card__button:focus {
    background-color: #d56510;
    color: #fff !important;
    text-decoration: none !important;
}

.ukse-game-card__button:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

.ukse-game-card__button--disabled,
.ukse-game-card__button--disabled:hover,
.ukse-game-card__button--disabled:focus {
    background-color: #ccc;
    color: #666 !important;
    cursor: not-allowed;
}

.ukse-game-card__lock-msg {
    font-size: 0.85rem;
    color: #888;
    margin-top: 0.75rem;
    font-style: italic;
}

/* Game Sections */
.ukse-games-hub__game-section {
    margin-bottom: 3rem;
    padding: 1.5rem;
    border-radius: 12px;
}

/* Section wash panels — subtle pastel backgrounds */
.ukse-game-section--tube {
    background: linear-gradient(135deg, #f5faff 0%, #eef5fb 100%);
    border: 1px solid #dde9f3;
}

.ukse-game-section--idioms {
    background: linear-gradient(135deg, #fffef8 0%, #fdfaee 100%);
    border: 1px solid #f0e8d0;
}

/* Inner game containers — subtle pastel-tinted backgrounds */
.ukse-game-section--tube .ukse-twc {
    background: #fbfdff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

.ukse-game-section--idioms .ukse-idiom {
    background: #fffefc;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

/* Keep interactive elements crisp */
.ukse-game-section--tube .ukse-twc__input,
.ukse-game-section--idioms .ukse-idiom__option {
    background: #fff;
}

.ukse-game-section--idioms .ukse-idiom__feedback {
    background: #fff;
}

.ukse-games-hub__section-title {
    font-size: 1.5rem;
    margin-bottom: 1rem;
    color: var(--lse-structure-navy, #000032);
}

/* Tube Word Chain Game */
.ukse-twc {
    background: #fff;
    border-radius: 8px;
    padding: 1.5rem;
}

.ukse-twc--loading,
.ukse-twc--error {
    text-align: center;
    padding: 2rem;
    color: #666;
}

.ukse-twc__error {
    color: #c00;
}

.ukse-twc__header {
    text-align: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #eee;
}

.ukse-twc__title {
    font-size: 1.25rem;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 0.25rem;
}

.ukse-twc__progress,
.ukse-twc__score {
    font-size: 0.9rem;
    color: #555;
    margin: 0.25rem 0;
}

/* Station list (tube line visual) */
.ukse-twc__stations {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem;
}

.ukse-twc__station {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    background: #f0f0f0;
    border-radius: 20px;
    font-size: 0.8rem;
    color: #666;
    transition: all 0.2s ease;
}

.ukse-twc__station--current {
    background: var(--lse-tertiary-blue, #6ACAF3);
    color: #000;
    font-weight: 600;
}

.ukse-twc__station--passed {
    background: var(--lse-primary-magenta, #E6007E);
    color: #fff;
}

.ukse-twc__station-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
}

.ukse-twc__station-name {
    white-space: nowrap;
}

/* Play area */
.ukse-twc__play-area {
    text-align: center;
}

.ukse-twc__last-word {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.ukse-twc__prompt {
    margin-bottom: 1rem;
    color: #555;
}

.ukse-twc__letter {
    display: inline-block;
    background: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    border-radius: 4px;
    font-size: 1.25rem;
}

.ukse-twc__form {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.ukse-twc__input {
    padding: 0.6rem 1rem;
    font-size: 1rem;
    border: 2px solid #ddd;
    border-radius: 4px;
    min-width: 200px;
    transition: border-color 0.2s ease;
}

.ukse-twc__input:focus {
    outline: none;
    border-color: var(--lse-tertiary-blue, #6ACAF3);
}

.ukse-twc__submit,
.ukse-games-hub a.ukse-twc__submit,
.ukse-games-hub a.ukse-twc__submit:link,
.ukse-games-hub a.ukse-twc__submit:visited {
    display: inline-block;
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    background-color: var(--lse-secondary-orange, #EE7218);
    color: #fff !important;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    text-decoration: none !important;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.ukse-twc__submit:hover:not(:disabled),
.ukse-twc__submit:focus:not(:disabled),
.ukse-games-hub a.ukse-twc__submit:hover,
.ukse-games-hub a.ukse-twc__submit:focus,
.ukse-games-hub a.ukse-twc__submit:active {
    background-color: #d56510;
    color: #fff !important;
    text-decoration: none !important;
}

.ukse-twc__submit:focus-visible,
.ukse-games-hub a.ukse-twc__submit:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

.ukse-twc__submit:disabled {
    background-color: #ccc;
    color: #666 !important;
    cursor: not-allowed;
}

/* Feedback */
.ukse-twc__feedback {
    padding: 0.75rem 1rem;
    border-radius: 4px;
    margin-top: 1rem;
    font-weight: 500;
}

.ukse-twc__feedback--success {
    background: #e8f5e9;
    color: #2e7d32;
}

.ukse-twc__feedback--error {
    background: #ffebee;
    color: #c62828;
}

/* Completion */
.ukse-twc__complete {
    margin-top: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border-radius: 8px;
}

.ukse-twc__complete-msg {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2e7d32;
    margin-bottom: 0.5rem;
}

.ukse-twc__final-score {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

.ukse-twc__restart {
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    background-color: var(--lse-structure-navy, #000032);
    color: #fff !important;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.ukse-twc__restart:hover,
.ukse-twc__restart:focus {
    background-color: #1a1a5c;
    color: #fff !important;
}

.ukse-twc__restart:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

/* Game placeholder */
.ukse-game__placeholder {
    text-align: center;
    padding: 2rem;
    background: #f5f5f5;
    border-radius: 8px;
}

.ukse-game__placeholder-title {
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 0.5rem;
}

.ukse-game__placeholder-status {
    color: #888;
    font-style: italic;
}

/* Mobile adjustments */
@media (max-width: 600px) {
    .ukse-games-hub {
        padding: 1rem;
    }

    .ukse-games-hub__title {
        font-size: 1.5rem;
    }

    .ukse-twc__stations {
        gap: 0.35rem;
    }

    .ukse-twc__station {
        padding: 0.25rem 0.5rem;
        font-size: 0.7rem;
    }

    .ukse-twc__input {
        min-width: 150px;
        width: 100%;
    }

    .ukse-twc__form {
        flex-direction: column;
        align-items: stretch;
    }

    .ukse-twc__submit {
        width: 100%;
    }
}

/* ==========================================================================
   Idiom Illustrated Game
   ========================================================================== */

.ukse-idiom {
    background: #fff;
    border-radius: 8px;
    padding: 1.5rem;
}

.ukse-idiom--error,
.ukse-idiom--locked {
    text-align: center;
    padding: 2rem;
    color: #666;
}

.ukse-idiom__error {
    color: #c00;
}

.ukse-idiom__locked-msg {
    font-style: italic;
    color: #888;
}

.ukse-idiom__header {
    text-align: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #eee;
}

.ukse-idiom__title {
    font-size: 1.25rem;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 0.25rem;
}

.ukse-idiom__progress,
.ukse-idiom__score {
    font-size: 0.9rem;
    color: #555;
    margin: 0.25rem 0;
}

.ukse-idiom__question-area {
    text-align: center;
}

.ukse-idiom__idiom-display {
    font-size: 1.35rem;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 0.75rem;
    font-style: italic;
}

.ukse-idiom__question {
    font-size: 1.1rem;
    color: #333;
    margin-bottom: 1.25rem;
}

.ukse-idiom__options {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-width: 500px;
    margin: 0 auto 1.5rem;
}

.ukse-idiom__option {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    background: #f5f5f5;
    border: 2px solid #ddd;
    border-radius: 6px;
    cursor: pointer;
    text-align: left;
    font-size: 1rem;
    transition: all 0.2s ease;
}

.ukse-idiom__option:hover:not(:disabled) {
    background: #eef;
    border-color: var(--lse-tertiary-blue, #6ACAF3);
}

.ukse-idiom__option:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

.ukse-idiom__option:disabled {
    cursor: default;
}

.ukse-idiom__option--correct {
    background: #e8f5e9 !important;
    border-color: #4caf50 !important;
}

.ukse-idiom__option--incorrect {
    background: #ffebee !important;
    border-color: #f44336 !important;
}

.ukse-idiom__option-letter {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    background: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    border-radius: 50%;
    font-weight: 600;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.ukse-idiom__option--correct .ukse-idiom__option-letter {
    background: #4caf50;
}

.ukse-idiom__option--incorrect .ukse-idiom__option-letter {
    background: #f44336;
}

.ukse-idiom__option-text {
    flex: 1;
}

.ukse-idiom__feedback {
    padding: 1rem 1.25rem;
    border-radius: 6px;
    margin-bottom: 1rem;
    text-align: left;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.ukse-idiom__feedback--correct {
    background: #e8f5e9;
    border-left: 4px solid #4caf50;
}

.ukse-idiom__feedback--incorrect {
    background: #fff3e0;
    border-left: 4px solid #ff9800;
}

.ukse-idiom__feedback-result {
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #333;
}

.ukse-idiom__explanation {
    margin-bottom: 0.5rem;
    color: #555;
}

.ukse-idiom__example {
    font-style: italic;
    color: #666;
}

.ukse-idiom__next {
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    background-color: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.ukse-idiom__next:hover,
.ukse-idiom__next:focus {
    background-color: #d56510;
    color: #fff !important;
}

.ukse-idiom__next:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

.ukse-idiom__complete {
    margin-top: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border-radius: 8px;
    text-align: center;
}

.ukse-idiom__complete-msg {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2e7d32;
    margin-bottom: 0.5rem;
}

.ukse-idiom__final-score {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

.ukse-idiom__restart {
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    background-color: var(--lse-structure-navy, #000032);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.ukse-idiom__restart:hover,
.ukse-idiom__restart:focus {
    background-color: #1a1a5c;
}

.ukse-idiom__restart:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

/* Idiom mobile adjustments */
@media (max-width: 600px) {
    .ukse-idiom__idiom-display {
        font-size: 1.15rem;
    }

    .ukse-idiom__question {
        font-size: 1rem;
    }

    .ukse-idiom__option {
        padding: 0.75rem;
        font-size: 0.95rem;
    }

    .ukse-idiom__feedback {
        padding: 0.85rem 1rem;
    }
}

/* Results/completion extras */
.ukse-idiom__results-detail {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.ukse-idiom__bonus {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 1rem;
}

.ukse-twc__word-chain {
    font-size: 0.95rem;
    color: #555;
    margin-bottom: 1rem;
    word-break: break-word;
}

/* ==========================================================================
   Games Page – Scoped Button System
   ========================================================================== */

/* Scoped button base – prevents global anchor styles from bleeding through */
.ukse-games-page .ukse-btn,
.ukse-games-page a.ukse-btn,
.ukse-games-page a.ukse-btn:link,
.ukse-games-page a.ukse-btn:visited,
.ukse-game .ukse-btn,
.ukse-game a.ukse-btn,
.ukse-game a.ukse-btn:link,
.ukse-game a.ukse-btn:visited {
    display: inline-block;
    padding: 0.7rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none !important;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease;
    line-height: 1.4;
    text-align: center;
}

/* Primary – orange */
.ukse-games-page .ukse-btn--primary,
.ukse-games-page a.ukse-btn--primary,
.ukse-games-page a.ukse-btn--primary:link,
.ukse-games-page a.ukse-btn--primary:visited,
.ukse-game .ukse-btn--primary,
.ukse-game a.ukse-btn--primary,
.ukse-game a.ukse-btn--primary:link,
.ukse-game a.ukse-btn--primary:visited {
    background-color: var(--lse-secondary-orange, #EE7218);
    color: #fff !important;
}

.ukse-games-page .ukse-btn--primary:hover,
.ukse-games-page .ukse-btn--primary:focus,
.ukse-games-page a.ukse-btn--primary:hover,
.ukse-games-page a.ukse-btn--primary:focus,
.ukse-game .ukse-btn--primary:hover,
.ukse-game .ukse-btn--primary:focus,
.ukse-game a.ukse-btn--primary:hover,
.ukse-game a.ukse-btn--primary:focus {
    background-color: #d56510;
    color: #fff !important;
    text-decoration: none !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(238, 114, 24, 0.3);
}

/* Secondary – navy */
.ukse-games-page .ukse-btn--secondary,
.ukse-games-page a.ukse-btn--secondary,
.ukse-games-page a.ukse-btn--secondary:link,
.ukse-games-page a.ukse-btn--secondary:visited,
.ukse-game .ukse-btn--secondary,
.ukse-game a.ukse-btn--secondary,
.ukse-game a.ukse-btn--secondary:link,
.ukse-game a.ukse-btn--secondary:visited {
    background-color: var(--lse-structure-navy, #000032);
    color: #fff !important;
}

.ukse-games-page .ukse-btn--secondary:hover,
.ukse-games-page .ukse-btn--secondary:focus,
.ukse-games-page a.ukse-btn--secondary:hover,
.ukse-games-page a.ukse-btn--secondary:focus,
.ukse-game .ukse-btn--secondary:hover,
.ukse-game .ukse-btn--secondary:focus,
.ukse-game a.ukse-btn--secondary:hover,
.ukse-game a.ukse-btn--secondary:focus {
    background-color: #1a1a5c;
    color: #fff !important;
    text-decoration: none !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 50, 0.25);
}

/* Focus-visible ring for all buttons */
.ukse-games-page .ukse-btn:focus-visible,
.ukse-game .ukse-btn:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

/* ==========================================================================
   Games Hero Section
   ========================================================================== */

.ukse-games-hero {
    background: linear-gradient(135deg, #f0f8ff 0%, #e8f4fc 100%);
}

.ukse-games-page .ukse-schools-hero__cta {
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

/* ==========================================================================
   How It Works Section
   ========================================================================== */

.ukse-games-how {
    padding: 3rem 0;
    background: #fff;
}

.ukse-games-how__title {
    text-align: center;
    margin-bottom: 2rem;
}

.ukse-games-how__steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}

.ukse-games-how__step {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.25rem;
    background: #f9f9f9;
    border-radius: 8px;
    border-left: 4px solid var(--lse-secondary-orange, #EE7218);
}

.ukse-games-how__step-num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    background: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    border-radius: 50%;
    font-weight: 700;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.ukse-games-how__step-content h3 {
    font-size: 1.1rem;
    margin: 0 0 0.35rem;
    color: var(--lse-structure-navy, #000032);
}

.ukse-games-how__step-content p {
    margin: 0;
    font-size: 0.95rem;
    color: #555;
}

/* ==========================================================================
   Game Card Enhancements
   ========================================================================== */

.ukse-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
}

.ukse-game-card__badge {
    position: absolute;
    top: -0.5rem;
    right: 1rem;
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 999px;
}

.ukse-game-card__badge--unlocked {
    background: #e8f5e9;
    color: #2e7d32;
}

.ukse-game-card__badge--locked {
    background: #fff3e0;
    color: #e65100;
}

.ukse-game-card__badge--completed {
    background: var(--lse-primary-magenta, #E6007E);
    color: #fff;
}

.ukse-game-card__skills {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ukse-game-card__skills li {
    font-size: 0.8rem;
    padding: 0.25rem 0.6rem;
    background: #f0f0f0;
    border-radius: 4px;
    color: #555;
}

.ukse-game-card .ukse-btn {
    margin-top: auto;
    align-self: flex-start;
}

/* Card gradient variants by game type */
.ukse-game-card[data-game="tube-word-chain"] {
    background: linear-gradient(135deg, #f8fbff 0%, #f0f7fc 100%);
    border-color: #e0edf5;
}

.ukse-game-card[data-game="idiom-illustrated"] {
    background: linear-gradient(135deg, #fffdf8 0%, #fefaef 100%);
    border-color: #f0e8d0;
}

/* Preserve locked state opacity but keep gradient */
.ukse-game-card--locked[data-game="idiom-illustrated"] {
    background: linear-gradient(135deg, #fdfcf9 0%, #faf8f2 100%);
}

/* ==========================================================================
   Adventure Points Badge
   ========================================================================== */

.ukse-games-points {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1.5rem;
    background: linear-gradient(135deg, #fffdf5 0%, #fef9e8 100%);
    border: 1px solid #f0e0a8;
    border-radius: 999px;
    max-width: max-content;
    margin-left: auto;
    margin-right: auto;
}

.ukse-games-points__icon {
    color: #d4a800;
    font-size: 1.1rem;
}

.ukse-games-points__label {
    font-size: 0.85rem;
    font-weight: 500;
    color: #666;
    letter-spacing: 0.02em;
}

.ukse-games-points__value {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--lse-structure-navy, #000032);
    min-width: 2rem;
    text-align: center;
}

.ukse-games-points__reset {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-left: 0.25rem;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.05);
    color: #999;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}

.ukse-games-points__reset:hover,
.ukse-games-points__reset:focus {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
}

.ukse-games-points__reset:focus-visible {
    outline: 2px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

/* Override the section title centered styling for game sections */
.ukse-games-hub__section-title {
    text-align: left;
}

/* ==========================================================================
   Games Page Mobile Adjustments
   ========================================================================== */

@media (max-width: 768px) {
    .ukse-games-page .ukse-schools-hero__wrap {
        flex-direction: column;
        text-align: center;
    }

    .ukse-games-page .ukse-schools-hero__content {
        max-width: 100%;
    }

    .ukse-games-page .ukse-schools-hero__cta {
        justify-content: center;
    }

    .ukse-games-page .ukse-schools-hero__media {
        display: none;
    }

    .ukse-games-how__steps {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   Games Icons
   ========================================================================== */

/* Card icons */
.ukse-game-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 0.75rem;
    background: linear-gradient(135deg, #f0f8ff 0%, #e8f4fc 100%);
    border-radius: 12px;
    color: var(--lse-secondary-orange, #EE7218);
}

.ukse-game-card__icon svg {
    flex-shrink: 0;
}

/* Game header icons */
.ukse-twc__icon,
.ukse-idiom__icon {
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.35rem;
    color: var(--lse-secondary-orange, #EE7218);
}

.ukse-twc__title,
.ukse-idiom__title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
}

/* ==========================================================================
   Tube Word Chain – Line Visual
   ========================================================================== */

.ukse-twc__line-container {
    position: relative;
    padding: 1.5rem 0;
    margin-bottom: 1.5rem;
    overflow-x: auto;
}

/* The "track" line behind stations */
.ukse-twc__line {
    position: absolute;
    top: 50%;
    left: 2rem;
    right: 2rem;
    height: 6px;
    background: #e0e0e0;
    border-radius: 3px;
    transform: translateY(-50%);
    z-index: 0;
}

/* Stations container */
.ukse-twc__stations {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: nowrap;
    gap: 0;
    justify-content: space-between;
    list-style: none;
    padding: 0 1rem;
    margin: 0;
    min-width: max-content;
}

/* Individual station */
.ukse-twc__station {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: transparent;
    border-radius: 0;
    font-size: 0.75rem;
    color: #888;
    transition: all 0.2s ease;
    position: relative;
}

/* Station dot – sits on the line */
.ukse-twc__station-dot {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid #ccc;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
    z-index: 2;
}

.ukse-twc__station-name {
    white-space: nowrap;
    font-weight: 500;
    max-width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

/* Passed stations – magenta */
.ukse-twc__station--passed .ukse-twc__station-dot {
    background: var(--lse-primary-magenta, #E6007E);
    border-color: var(--lse-primary-magenta, #E6007E);
}

.ukse-twc__station--passed .ukse-twc__station-name {
    color: var(--lse-primary-magenta, #E6007E);
}

/* Current station – blue highlight with train marker */
.ukse-twc__station--current .ukse-twc__station-dot {
    background: var(--lse-tertiary-blue, #6ACAF3);
    border-color: var(--lse-tertiary-blue, #6ACAF3);
    width: 22px;
    height: 22px;
    box-shadow: 0 0 0 4px rgba(106, 202, 243, 0.3);
}

.ukse-twc__station--current .ukse-twc__station-name {
    color: var(--lse-structure-navy, #000032);
    font-weight: 700;
}

/* Train marker on current station */
.ukse-twc__station--current::before {
    content: '🚇';
    position: absolute;
    top: -1.25rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 1.25rem;
    animation: trainBounce 1s ease-in-out infinite;
}

@keyframes trainBounce {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(-3px); }
}

/* First and last station styling */
.ukse-twc__station--first,
.ukse-twc__station--last {
    /* Can add terminus styling here if needed */
}

/* Mobile: allow horizontal scroll */
@media (max-width: 600px) {
    .ukse-twc__line-container {
        padding: 1rem 0;
    }

    .ukse-twc__stations {
        padding: 0 0.5rem;
    }

    .ukse-twc__station {
        padding: 0.35rem 0.5rem;
    }

    .ukse-twc__station-name {
        font-size: 0.65rem;
        max-width: 55px;
    }
}

/* ==========================================================================
   Idiom Illustrated – Enhanced Styling
   ========================================================================== */

/* Idiom phrase display with optional icon */
.ukse-idiom__phrase-wrap {
    text-align: center;
    margin-bottom: 1rem;
}

.ukse-idiom__icon-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 0.5rem;
    background: linear-gradient(135deg, #fffdf8 0%, #fefaef 100%);
    border: 1px solid #f5d76e;
    border-radius: 50%;
    color: #e6a700;
    font-size: 1.1rem;
}

.ukse-idiom__phrase {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--lse-structure-navy, #000032);
    text-align: center;
    margin: 0;
    line-height: 1.4;
}

/* Optional clue panel (only shows if idiom has illustration data) */
.ukse-idiom__clue {
    background: #f9f9f9;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    text-align: center;
}

.ukse-idiom__clue-label {
    display: block;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #888;
    margin-bottom: 0.25rem;
}

.ukse-idiom__clue-content {
    display: block;
    font-size: 0.95rem;
    color: #555;
}

/* Improved answer options */
.ukse-idiom__option {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem 1.25rem;
    background: #fff;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    cursor: pointer;
    text-align: left;
    font-size: 1rem;
    transition: all 0.15s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.04);
}

.ukse-idiom__option:hover:not(:disabled) {
    background: #f8f9ff;
    border-color: var(--lse-tertiary-blue, #6ACAF3);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.ukse-idiom__option:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
    border-color: var(--lse-tertiary-blue, #6ACAF3);
}

.ukse-idiom__option:disabled {
    cursor: default;
    transform: none;
}

/* Correct/incorrect states */
.ukse-idiom__option--correct {
    background: #e8f5e9 !important;
    border-color: #4caf50 !important;
    border-width: 2px;
}

.ukse-idiom__option--incorrect {
    background: #ffebee !important;
    border-color: #ef5350 !important;
    border-width: 2px;
}

/* Letter badges */
.ukse-idiom__option-letter {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    background: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    border-radius: 50%;
    font-weight: 700;
    font-size: 0.95rem;
    flex-shrink: 0;
}

.ukse-idiom__option--correct .ukse-idiom__option-letter {
    background: #4caf50;
}

.ukse-idiom__option--incorrect .ukse-idiom__option-letter {
    background: #ef5350;
}

/* Enhanced feedback panel */
.ukse-idiom__feedback {
    padding: 0;
    border-radius: 10px;
    margin-bottom: 1.25rem;
    text-align: left;
    max-width: 100%;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.ukse-idiom__feedback--correct {
    background: #fff;
    border: 2px solid #4caf50;
}

.ukse-idiom__feedback--incorrect {
    background: #fff;
    border: 2px solid #ff9800;
}

.ukse-idiom__feedback-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    font-weight: 700;
    font-size: 1rem;
}

.ukse-idiom__feedback--correct .ukse-idiom__feedback-header {
    background: #e8f5e9;
    color: #2e7d32;
}

.ukse-idiom__feedback--incorrect .ukse-idiom__feedback-header {
    background: #fff3e0;
    color: #e65100;
}

.ukse-idiom__result-icon {
    flex-shrink: 0;
}

.ukse-idiom__feedback-result {
    font-weight: 700;
}

.ukse-idiom__points {
    background: #4caf50;
    color: #fff;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.8rem;
    margin-left: 0.5rem;
}

.ukse-idiom__feedback-body {
    padding: 1rem;
}

.ukse-idiom__meaning-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #888;
    margin: 0 0 0.35rem;
    font-weight: 600;
}

.ukse-idiom__explanation {
    margin: 0 0 0.75rem;
    color: #333;
    line-height: 1.5;
}

.ukse-idiom__example {
    margin: 0;
    color: #666;
    font-size: 0.95rem;
}

/* ==========================================================================
   Game Section Mini Hero Banners
   ========================================================================== */

.ukse-games-page .ukse-game-hero {
    display: flex;
    flex-direction: column;
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: linear-gradient(135deg, #fafbfc 0%, #f5f7fa 100%);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* Tube variant – subtle blue wash */
.ukse-games-page .ukse-game-hero--tube {
    background: linear-gradient(135deg, #f4f9fd 0%, #e8f4fc 100%);
    border-color: rgba(106, 202, 243, 0.2);
}

/* Idioms variant – subtle warm wash */
.ukse-games-page .ukse-game-hero--idioms {
    background: linear-gradient(135deg, #fefcf5 0%, #fdf8e8 100%);
    border-color: rgba(245, 215, 110, 0.25);
}

/* Jenga variant – subtle lavender wash */
.ukse-games-page .ukse-game-hero--jenga {
    background: linear-gradient(135deg, #f8f5ff 0%, #f0eafa 100%);
    border-color: rgba(179, 157, 219, 0.2);
}

/* Tense variant – subtle teal/green wash */
.ukse-games-page .ukse-game-hero--tense {
    background: linear-gradient(135deg, #f2fcfa 0%, #e4f6f3 100%);
    border-color: rgba(128, 203, 196, 0.2);
}

/* Row layout: left (icon + titles) and right (stats) */
.ukse-game-hero__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* Left group: icon + titles */
.ukse-game-hero__left {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    flex: 1;
}

/* Icon badge */
.ukse-games-page .ukse-game-hero__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    font-size: 1.35rem;
}

.ukse-game-hero--tube .ukse-game-hero__icon {
    color: var(--lse-tertiary-blue, #6ACAF3);
}

.ukse-game-hero--idioms .ukse-game-hero__icon {
    color: #e6a700;
}

/* FA icons in game cards */
.ukse-game-card__icon {
    font-size: 2rem;
}

/* Titles block */
.ukse-game-hero__titles {
    flex: 1;
    min-width: 0;
}

.ukse-game-hero__title {
    margin: 0 0 0.15rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    line-height: 1.3;
}

.ukse-game-hero__subtitle {
    margin: 0;
    font-size: 0.8rem;
    color: #666;
    line-height: 1.35;
}

/* Stats cluster – horizontal pill layout */
.ukse-game-hero__stats {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.4rem;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
}

/* Stat pill */
.ukse-game-hero__stat {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    height: 32px;
    padding: 0 0.75rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #555;
    background: rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 999px;
    white-space: nowrap;
}

.ukse-game-hero__stat-icon {
    font-size: 0.7rem;
    opacity: 0.6;
}

.ukse-game-hero__stat-value {
    font-weight: 600;
    color: #333;
}

/* Progress bar placeholder under hero */
.ukse-game-hero__progress {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: rgba(0,0,0,0.06);
    border-radius: 0 0 8px 8px;
    overflow: hidden;
}

.ukse-game-hero__progress-bar {
    height: 100%;
    width: 0%;
    background: currentColor;
    opacity: 0.5;
    transition: width 0.3s ease;
}

/* Enable positioning for progress bar */
.ukse-games-page .ukse-game-hero {
    position: relative;
}

/* --------------------------------------------------------------------------
   Game Hero CSS Motifs (subtle decorative backgrounds)
   -------------------------------------------------------------------------- */

/* Tube motif — faint dots/train line */
.ukse-game-hero--tube::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40%;
    background-image:
        radial-gradient(circle, rgba(106,202,243,0.08) 2px, transparent 2px),
        linear-gradient(90deg, transparent 48%, rgba(106,202,243,0.06) 50%, transparent 52%);
    background-size: 20px 20px, 100% 100%;
    pointer-events: none;
    border-radius: 0 8px 8px 0;
}

/* Idioms motif — faint quote marks */
.ukse-game-hero--idioms::before {
    content: '"';
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    font-size: 5rem;
    font-family: Georgia, serif;
    color: rgba(230, 167, 0, 0.08);
    pointer-events: none;
    line-height: 1;
}

/* Jenga motif — faint stacked blocks */
.ukse-game-hero--jenga::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 35%;
    background-image:
        linear-gradient(90deg, transparent 0%, transparent 30%, rgba(156,39,176,0.04) 30%, rgba(156,39,176,0.04) 70%, transparent 70%),
        linear-gradient(90deg, transparent 15%, rgba(156,39,176,0.04) 15%, rgba(156,39,176,0.04) 55%, transparent 55%),
        linear-gradient(90deg, transparent 40%, rgba(156,39,176,0.04) 40%, rgba(156,39,176,0.04) 80%, transparent 80%);
    background-size: 100% 33.33%;
    background-position: 0 0, 0 33.33%, 0 66.66%;
    background-repeat: no-repeat;
    pointer-events: none;
    border-radius: 0 8px 8px 0;
}

/* Tense motif — faint clock arc */
.ukse-game-hero--tense::before {
    content: '';
    position: absolute;
    top: 50%;
    right: 1.5rem;
    width: 50px;
    height: 50px;
    transform: translateY(-50%);
    border: 3px solid rgba(0,137,123,0.08);
    border-radius: 50%;
    pointer-events: none;
}

.ukse-game-hero--tense::after {
    content: '';
    position: absolute;
    top: 50%;
    right: calc(1.5rem + 23px);
    width: 2px;
    height: 18px;
    background: rgba(0,137,123,0.1);
    transform-origin: bottom center;
    transform: translateY(-100%) rotate(-30deg);
    pointer-events: none;
}

/* Meta / chip – keep compact to not push title */
.ukse-games-page .ukse-game-hero__meta {
    flex-shrink: 0;
    text-align: right;
    max-width: 100px;
}

/* Chip base */
.ukse-games-page .ukse-chip {
    display: inline-block;
    padding: 0.3rem 0.6rem;
    font-size: 0.7rem;
    font-weight: 600;
    border-radius: 999px;
    white-space: nowrap;
}

.ukse-games-page .ukse-chip--unlocked {
    background: #e8f5e9;
    color: #2e7d32;
}

.ukse-games-page .ukse-chip--locked {
    background: #fff3e0;
    color: #e65100;
}

/* Mobile responsiveness – stacked layout with scrollable pills */
@media (max-width: 768px) {
    .ukse-game-hero__row {
        flex-direction: column;
        align-items: stretch;
        gap: 0.6rem;
    }

    .ukse-game-hero__left {
        gap: 0.6rem;
    }

    .ukse-games-page .ukse-game-hero__icon {
        width: 38px;
        height: 38px;
        font-size: 1.15rem;
    }

    .ukse-game-hero__title {
        font-size: 0.95rem;
    }

    .ukse-game-hero__subtitle {
        font-size: 0.75rem;
    }

    /* Horizontally scrollable pills on mobile */
    .ukse-game-hero__stats {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        scrollbar-color: rgba(0,0,0,0.1) transparent;
        padding-bottom: 2px;
        margin: 0 -0.25rem;
        padding-left: 0.25rem;
        padding-right: 0.25rem;
    }

    .ukse-game-hero__stats::-webkit-scrollbar {
        height: 3px;
    }

    .ukse-game-hero__stats::-webkit-scrollbar-thumb {
        background: rgba(0,0,0,0.1);
        border-radius: 3px;
    }

    .ukse-game-hero__stat {
        height: 28px;
        padding: 0 0.6rem;
        font-size: 0.7rem;
    }

    .ukse-games-page .ukse-chip {
        font-size: 0.7rem;
        padding: 0.3rem 0.6rem;
    }
}

/* ==========================================================================
   In-Game HUD (status bar)
   ========================================================================== */

.ukse-game-hud {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    background: #f8f9fa;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
}

.ukse-game-hud__item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.75rem;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 0.85rem;
    color: #555;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

.ukse-game-hud__item strong {
    color: var(--lse-structure-navy, #000032);
    font-weight: 700;
}

.ukse-game-hud__icon {
    flex-shrink: 0;
}

.ukse-game-hud__label {
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
}

/* Line item – accent left border */
.ukse-game-hud__item--line {
    border-left: 3px solid #ccc;
    padding-left: 0.6rem;
}

/* Tube accent */
.ukse-game-hud--tube .ukse-game-hud__item--line {
    border-left-color: var(--lse-tertiary-blue, #6ACAF3);
}

.ukse-game-hud--tube .ukse-game-hud__icon {
    color: var(--lse-tertiary-blue, #6ACAF3);
}

/* Idioms accent */
.ukse-game-hud--idioms .ukse-game-hud__item--line {
    border-left-color: #f5d76e;
}

.ukse-game-hud--idioms .ukse-game-hud__icon {
    color: #e6a700;
}

/* Score highlight */
.ukse-game-hud__item--score strong {
    color: var(--lse-secondary-orange, #EE7218);
}

/* Mobile: stack progress/score under line */
@media (max-width: 480px) {
    .ukse-game-hud {
        padding: 0.6rem 0.75rem;
        gap: 0.4rem;
    }

    .ukse-game-hud__item {
        font-size: 0.8rem;
        padding: 0.35rem 0.6rem;
    }

    .ukse-game-hud__item--line {
        flex: 1 1 100%;
    }
}

/* ==========================================================================
   Games Hub – Sticky Nav + Tab Routing
   ========================================================================== */

/* Sticky hub navigation */
.ukse-games-hub-nav {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.ukse-games-hub-nav__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
}

/* Adventure Points in sticky nav */
.ukse-games-hub-nav .ukse-games-points {
    margin: 0;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(135deg, #fffbf0 0%, #fff5e0 100%);
    border-radius: 8px;
    border: 1px solid #f0e0c0;
}

/* Game tabs container — horizontal scroll, no wrap */
.ukse-games-hub-nav__cards {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.5rem;
    flex: 1;
    justify-content: flex-end;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(0,0,0,0.15) transparent;
    /* Prevent clipping of active glow/border */
    padding: 6px 4px;
    margin: -6px -4px;
}

/* Subtle scrollbar styling */
.ukse-games-hub-nav__cards::-webkit-scrollbar {
    height: 4px;
}

.ukse-games-hub-nav__cards::-webkit-scrollbar-track {
    background: transparent;
}

.ukse-games-hub-nav__cards::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.15);
    border-radius: 2px;
}

/* Individual game tab — taller card layout */
.ukse-game-tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 72px;
    padding: 0.6rem 1rem;
    background: #f5f5f5;
    border: 2px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.85rem;
    font-weight: 500;
    color: #555;
    flex-shrink: 0;
}

/* Top row: icon + label */
.ukse-game-tab__top {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
}

.ukse-game-tab:hover {
    background: #eef;
    border-color: var(--lse-tertiary-blue, #6ACAF3);
}

/* Remove default focus outline on click; keep for keyboard nav */
.ukse-game-tab:focus {
    outline: none;
}

.ukse-game-tab:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

.ukse-game-tab--active {
    /* Keep tinted background; highlight with darker border + subtle glow */
    font-weight: 600;
}

.ukse-game-tab--locked {
    opacity: 0.6;
    cursor: not-allowed;
}

.ukse-game-tab--locked:hover {
    background: #f5f5f5;
    border-color: transparent;
}

.ukse-game-tab__icon {
    font-size: 1.1rem;
    line-height: 1;
}

.ukse-game-tab__label {
    font-size: 0.8rem;
    font-weight: 600;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ukse-game-tab__status {
    font-size: 0.65rem;
    padding: 0.15rem 0.4rem;
    border-radius: 999px;
    font-weight: 600;
    text-transform: uppercase;
}

.ukse-game-tab__status.ukse-chip--unlocked {
    background: #e8f5e9;
    color: #2e7d32;
}

.ukse-game-tab__status.ukse-chip--locked {
    background: #fff3e0;
    color: #e65100;
}

.ukse-game-tab__status.ukse-chip--completed {
    background: #e8f5e9;
    color: #1b5e20;
}

/* Wider screens: more generous tab sizing */
@media (min-width: 768px) {
    .ukse-game-tab {
        min-height: 80px;
        padding: 0.75rem 1.25rem;
    }

    .ukse-game-tab__label {
        max-width: 140px;
        font-size: 0.85rem;
    }

    .ukse-game-tab__icon {
        font-size: 1.25rem;
    }
}

/* Mobile: stack nav vertically, 2x2 grid tabs */
@media (max-width: 600px) {
    .ukse-games-hub-nav__inner {
        flex-direction: column;
        align-items: stretch;
    }

    /* 2x2 grid is set at 768px breakpoint - inherit it */
    .ukse-games-hub-nav__cards {
        gap: 8px;  /* tighter gap on small screens */
    }

    .ukse-game-tab {
        min-height: 64px;
        padding: 0.4rem 0.5rem;
    }

    .ukse-game-tab__label {
        font-size: 0.65rem;
        max-width: none;
    }

    .ukse-games-hub-nav .ukse-games-points {
        text-align: center;
    }
}

/* --------------------------------------------------------------------------
   Per-Game Tab Colour Coding
   -------------------------------------------------------------------------- */

/* Tube tab — blue tint */
.ukse-game-tab[data-game="tube"] {
    background: linear-gradient(135deg, #f0f8ff 0%, #e8f4fc 100%);
}

.ukse-game-tab[data-game="tube"]:hover {
    background: linear-gradient(135deg, #e0f0ff 0%, #d4ebfa 100%);
    border-color: var(--lse-tertiary-blue, #6ACAF3);
}

.ukse-game-tab[data-game="tube"].ukse-game-tab--active {
    border-color: #1a8fcf;
    box-shadow: 0 0 0 3px rgba(106, 202, 243, 0.25);
}

.ukse-game-tab[data-game="tube"].ukse-game-tab--active .ukse-game-tab__icon {
    color: #1565c0;
}

.ukse-game-tab[data-game="tube"] .ukse-game-tab__icon {
    color: #2196f3;
}

/* Idioms tab — warm/amber tint */
.ukse-game-tab[data-game="idioms"] {
    background: linear-gradient(135deg, #fffcf0 0%, #fff8e8 100%);
}

.ukse-game-tab[data-game="idioms"]:hover {
    background: linear-gradient(135deg, #fff5d6 0%, #ffefcc 100%);
    border-color: #f5d76e;
}

.ukse-game-tab[data-game="idioms"].ukse-game-tab--active {
    border-color: #c9a020;
    box-shadow: 0 0 0 3px rgba(245, 215, 110, 0.3);
}

.ukse-game-tab[data-game="idioms"].ukse-game-tab--active .ukse-game-tab__icon {
    color: #b8860b;
}

.ukse-game-tab[data-game="idioms"] .ukse-game-tab__icon {
    color: #e6a700;
}

/* Jenga tab — lavender tint */
.ukse-game-tab[data-game="jenga"] {
    background: linear-gradient(135deg, #faf8ff 0%, #f4f0fc 100%);
}

.ukse-game-tab[data-game="jenga"]:hover {
    background: linear-gradient(135deg, #f0e8ff 0%, #e8e0f8 100%);
    border-color: #b39ddb;
}

.ukse-game-tab[data-game="jenga"].ukse-game-tab--active {
    border-color: #7b1fa2;
    box-shadow: 0 0 0 3px rgba(179, 157, 219, 0.3);
}

.ukse-game-tab[data-game="jenga"].ukse-game-tab--active .ukse-game-tab__icon {
    color: #7b1fa2;
}

.ukse-game-tab[data-game="jenga"] .ukse-game-tab__icon {
    color: #9c27b0;
}

/* Tense tab — teal tint */
.ukse-game-tab[data-game="tense"] {
    background: linear-gradient(135deg, #f0fffc 0%, #e8f8f5 100%);
}

.ukse-game-tab[data-game="tense"]:hover {
    background: linear-gradient(135deg, #d8f5f0 0%, #c8efe8 100%);
    border-color: #80cbc4;
}

.ukse-game-tab[data-game="tense"].ukse-game-tab--active {
    border-color: #00897b;
    box-shadow: 0 0 0 3px rgba(128, 203, 196, 0.3);
}

.ukse-game-tab[data-game="tense"].ukse-game-tab--active .ukse-game-tab__icon {
    color: #00695c;
}

.ukse-game-tab[data-game="tense"] .ukse-game-tab__icon {
    color: #26a69a;
}

/* ==========================================================================
   Sentence Jenga Game
   ========================================================================== */

/* Section wash panel */
.ukse-game-section--jenga {
    background: linear-gradient(135deg, #f8f5ff 0%, #f0ebfa 100%);
    border: 1px solid #e0d8f0;
}

/* Jenga hero accent */
.ukse-game-hero--jenga .ukse-game-hero__icon {
    color: #9c27b0;
}

/* Inner game container */
.ukse-game-section--jenga .ukse-jenga {
    background: #fdfcff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

.ukse-jenga {
    background: #fff;
    border-radius: 8px;
    padding: 1.5rem;
}

.ukse-jenga--error {
    text-align: center;
    padding: 2rem;
    color: #666;
}

.ukse-jenga__error {
    color: #c00;
}

/* Question area */
.ukse-jenga__question-area {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

.ukse-jenga__prompt {
    font-size: 1.15rem;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 1.25rem;
    font-weight: 500;
}

.ukse-jenga__hint {
    font-size: 0.9rem;
    color: #666;
    font-style: italic;
    margin-bottom: 1rem;
}

/* Token bank */
.ukse-jenga__token-bank {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    margin-bottom: 1.5rem;
    min-height: 48px;
    padding: 0.75rem;
    background: #f5f5f5;
    border-radius: 8px;
    border: 2px dashed #ddd;
}

.ukse-jenga__token-bank--empty {
    color: #999;
    font-style: italic;
}

/* Sentence building area */
.ukse-jenga__sentence-area {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    margin-bottom: 1.5rem;
    min-height: 48px;
    padding: 0.75rem;
    background: #fef9e7;
    border-radius: 8px;
    border: 2px solid #f0e0a0;
}

.ukse-jenga__sentence-area--empty::before {
    content: 'Your sentence will appear here';
    color: #999;
    font-style: italic;
}

/* Token buttons */
.ukse-jenga__token {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 0.85rem;
    background: #fff;
    border: 2px solid #9c27b0;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: all 0.15s ease;
}

.ukse-jenga__token:hover {
    background: #f3e5f5;
    transform: translateY(-1px);
}

.ukse-jenga__token:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

.ukse-jenga__token--placed {
    background: #f3e5f5;
    border-color: #7b1fa2;
}

/* Token controls in sentence area */
.ukse-jenga__token-controls {
    display: flex;
    gap: 0.25rem;
    margin-left: 0.25rem;
}

.ukse-jenga__token-move {
    padding: 0.15rem 0.35rem;
    background: #e1bee7;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-size: 0.75rem;
    color: #4a148c;
}

.ukse-jenga__token-move:hover {
    background: #ce93d8;
}

.ukse-jenga__token-remove {
    padding: 0.15rem 0.35rem;
    background: #ffcdd2;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-size: 0.75rem;
    color: #b71c1c;
}

.ukse-jenga__token-remove:hover {
    background: #ef9a9a;
}

/* Check button */
.ukse-jenga__check {
    padding: 0.7rem 1.75rem;
    font-size: 1rem;
    background-color: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.ukse-jenga__check:hover,
.ukse-jenga__check:focus {
    background-color: #d56510;
}

.ukse-jenga__check:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

.ukse-jenga__check:disabled {
    background-color: #ccc;
    cursor: not-allowed;
}

/* Feedback */
.ukse-jenga__feedback {
    padding: 1rem 1.25rem;
    border-radius: 6px;
    margin: 1.5rem auto 1rem;
    text-align: left;
    max-width: 500px;
}

.ukse-jenga__feedback--correct {
    background: #e8f5e9;
    border-left: 4px solid #4caf50;
}

.ukse-jenga__feedback--incorrect {
    background: #fff3e0;
    border-left: 4px solid #ff9800;
}

.ukse-jenga__feedback-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.ukse-jenga__feedback-result {
    font-weight: 600;
    color: #333;
}

.ukse-jenga__points {
    color: #2e7d32;
    font-size: 0.9rem;
}

.ukse-jenga__correct-answer {
    color: #555;
    font-size: 0.95rem;
}

/* Next button */
.ukse-jenga__next {
    margin-top: 1rem;
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    background-color: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.ukse-jenga__next:hover,
.ukse-jenga__next:focus {
    background-color: #d56510;
}

/* Completion */
.ukse-jenga__complete {
    margin-top: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border-radius: 8px;
    text-align: center;
}

.ukse-jenga__complete-msg {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2e7d32;
    margin-bottom: 0.5rem;
}

.ukse-jenga__results-detail {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.ukse-jenga__final-score {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

.ukse-jenga__bonus {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 1rem;
}

.ukse-jenga__restart {
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    background-color: var(--lse-structure-navy, #000032);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.ukse-jenga__restart:hover,
.ukse-jenga__restart:focus {
    background-color: #1a1a5c;
}

/* ==========================================================================
   Tense Time Machine Game
   ========================================================================== */

/* Section wash panel */
.ukse-game-section--tense {
    background: linear-gradient(135deg, #f5fff8 0%, #e8f5eb 100%);
    border: 1px solid #c8e6c9;
}

/* Tense hero accent */
.ukse-game-hero--tense .ukse-game-hero__icon {
    color: #2e7d32;
}

/* Inner game container */
.ukse-game-section--tense .ukse-tense {
    background: #fcfffc;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

.ukse-tense {
    background: #fff;
    border-radius: 8px;
    padding: 1.5rem;
}

.ukse-tense--error {
    text-align: center;
    padding: 2rem;
    color: #666;
}

.ukse-tense__error {
    color: #c00;
}

/* Sentence display with blank */
.ukse-tense__sentence {
    font-size: 1.2rem;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 1.5rem;
    line-height: 1.6;
    text-align: center;
}

.ukse-tense__blank {
    display: inline-block;
    min-width: 100px;
    padding: 0.25rem 0.5rem;
    background: #fff9c4;
    border-bottom: 3px solid #f9a825;
    font-weight: 600;
    color: #f57f17;
}

.ukse-tense__blank--filled {
    background: #e8f5e9;
    border-bottom-color: #4caf50;
    color: #2e7d32;
}

.ukse-tense__blank--incorrect {
    background: #ffebee;
    border-bottom-color: #f44336;
    color: #c62828;
}

/* Options - reuse idiom option styling */
.ukse-tense__options {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-width: 500px;
    margin: 0 auto 1.5rem;
}

.ukse-tense__option {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    background: #f5f5f5;
    border: 2px solid #ddd;
    border-radius: 6px;
    cursor: pointer;
    text-align: left;
    font-size: 1rem;
    transition: all 0.2s ease;
}

.ukse-tense__option:hover:not(:disabled) {
    background: #e8f5e9;
    border-color: #4caf50;
}

.ukse-tense__option:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

.ukse-tense__option:disabled {
    cursor: default;
}

.ukse-tense__option--correct {
    background: #e8f5e9 !important;
    border-color: #4caf50 !important;
}

.ukse-tense__option--incorrect {
    background: #ffebee !important;
    border-color: #f44336 !important;
}

.ukse-tense__option-letter {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    background: #2e7d32;
    color: #fff;
    border-radius: 50%;
    font-weight: 600;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.ukse-tense__option--correct .ukse-tense__option-letter {
    background: #4caf50;
}

.ukse-tense__option--incorrect .ukse-tense__option-letter {
    background: #f44336;
}

.ukse-tense__option-text {
    flex: 1;
}

/* Feedback - reuse idiom feedback styling */
.ukse-tense__feedback {
    padding: 1rem 1.25rem;
    border-radius: 6px;
    margin-bottom: 1rem;
    text-align: left;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    background: #fff;
}

.ukse-tense__feedback--correct {
    background: #e8f5e9;
    border-left: 4px solid #4caf50;
}

.ukse-tense__feedback--incorrect {
    background: #fff3e0;
    border-left: 4px solid #ff9800;
}

.ukse-tense__feedback-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.ukse-tense__feedback-result {
    font-weight: 600;
    color: #333;
}

.ukse-tense__points {
    color: #2e7d32;
    font-size: 0.9rem;
}

.ukse-tense__feedback-body {
    color: #555;
}

.ukse-tense__tense-label {
    font-size: 0.85rem;
    color: #888;
    margin-bottom: 0.25rem;
}

.ukse-tense__explanation {
    margin-bottom: 0.5rem;
}

.ukse-tense__example {
    font-style: italic;
    color: #666;
}

/* Next button */
.ukse-tense__next {
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    background-color: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.ukse-tense__next:hover,
.ukse-tense__next:focus {
    background-color: #d56510;
}

.ukse-tense__next:focus-visible {
    outline: 3px solid var(--lse-tertiary-blue, #6ACAF3);
    outline-offset: 2px;
}

/* Completion */
.ukse-tense__complete {
    margin-top: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border-radius: 8px;
    text-align: center;
}

.ukse-tense__complete-msg {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2e7d32;
    margin-bottom: 0.5rem;
}

.ukse-tense__results-detail {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.ukse-tense__final-score {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

.ukse-tense__bonus {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 1rem;
}

.ukse-tense__restart {
    padding: 0.6rem 1.5rem;
    font-size: 1rem;
    background-color: var(--lse-structure-navy, #000032);
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.ukse-tense__restart:hover,
.ukse-tense__restart:focus {
    background-color: #1a1a5c;
}

/* Tense HUD accent */
.ukse-game-hud--tense .ukse-game-hud__item--line {
    border-left-color: #4caf50;
}

.ukse-game-hud--tense .ukse-game-hud__icon {
    color: #2e7d32;
}

/* Jenga HUD accent */
.ukse-game-hud--jenga .ukse-game-hud__item--line {
    border-left-color: #9c27b0;
}

.ukse-game-hud--jenga .ukse-game-hud__icon {
    color: #9c27b0;
}

/* Mobile adjustments */
@media (max-width: 600px) {
    .ukse-jenga__token {
        padding: 0.4rem 0.65rem;
        font-size: 0.9rem;
    }

    .ukse-tense__sentence {
        font-size: 1.05rem;
    }

    .ukse-tense__option {
        padding: 0.75rem;
        font-size: 0.95rem;
    }
}

/* ==========================================================================
   NEW GAMES v2 — Section Wash Panels
   ========================================================================== */

.ukse-game-section--platform {
    background: linear-gradient(135deg, #f5faff 0%, #eef5fb 100%);
    border: 1px solid #dde9f3;
}

.ukse-game-section--market {
    background: linear-gradient(135deg, #fffef8 0%, #fdfaee 100%);
    border: 1px solid #f0e8d0;
}

.ukse-game-section--rooftop {
    background: linear-gradient(135deg, #f8f5ff 0%, #f0ecfb 100%);
    border: 1px solid #e0d8f0;
}

.ukse-game-section--postcard {
    background: linear-gradient(135deg, #f5fff8 0%, #eefbf0 100%);
    border: 1px solid #d0f0d8;
}

/* ==========================================================================
   PLATFORM PANIC — Letter Tile Word Builder
   ========================================================================== */

.ukse-pp {
    padding: 1rem;
    border-radius: 8px;
    background: #fbfdff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

/* Clue display */
.ukse-pp__clue {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    text-align: left;
    margin: 1rem auto;
    max-width: 480px;
    padding: 0.75rem 1rem;
    background: #fffbf0;
    border: 1px solid #f0e0c0;
    border-radius: 0.5rem;
    font-size: 1.05rem;
    color: var(--lse-structure-navy, #000032);
    line-height: 1.4;
}

.ukse-pp__clue-icon {
    color: var(--lse-secondary-orange, #EE7218);
    font-size: 1.2rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.ukse-pp__clue-text {
    font-weight: 500;
}

/* Hint row (partial word reveal) */
.ukse-pp__hint-row {
    text-align: center;
    margin: 0.75rem 0 0.5rem;
}

.ukse-pp__hint {
    display: inline-block;
    font-family: 'Courier New', Courier, monospace;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 0.35em;
    color: var(--lse-structure-navy, #000032);
    background: #f0f4f8;
    padding: 0.4rem 1rem;
    border-radius: 0.4rem;
}

/* Hint button */
.ukse-pp__hint-btn {
    font-size: 0.85rem;
}

.ukse-pp__hint-btn i {
    margin-right: 0.25rem;
}

/* Legacy category (unused but harmless) */
.ukse-pp__category {
    text-align: center;
    margin: 1rem 0;
    font-size: 1.1rem;
    color: var(--lse-structure-navy, #000032);
}

.ukse-pp__category-label {
    font-weight: 400;
    color: #666;
    margin-right: 0.35rem;
}

.ukse-pp__category-name {
    font-weight: 700;
    color: var(--lse-secondary-orange, #EE7218);
}

/* Station progress (reuses tube pattern) */
.ukse-pp__stations {
    margin: 0.75rem 0;
}

ol.ukse-pp__stations,
.ukse-pp__stations {
    display: flex;
    flex-direction: row;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 0;
    justify-content: center;
    position: relative;
}

.ukse-pp__line-container {
    position: relative;
    margin: 0.75rem 0;
}

.ukse-pp__station {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    flex: 1;
    max-width: 100px;
}

.ukse-pp__station-dot {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #ddd;
    border: 2px solid #ccc;
    transition: all 0.3s ease;
    position: relative;
    z-index: 1;
}

.ukse-pp__station--passed .ukse-pp__station-dot {
    background: var(--lse-primary-magenta, #E6007E);
    border-color: var(--lse-primary-magenta, #E6007E);
}

.ukse-pp__station--current .ukse-pp__station-dot {
    background: var(--lse-tertiary-blue, #6ACAF3);
    border-color: var(--lse-tertiary-blue, #6ACAF3);
    box-shadow: 0 0 0 4px rgba(106, 202, 243, 0.25);
}

.ukse-pp__station-name {
    font-size: 0.6rem;
    color: #999;
    text-align: center;
    margin-top: 4px;
    line-height: 1.1;
    max-width: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ukse-pp__station--current .ukse-pp__station-name,
.ukse-pp__station--passed .ukse-pp__station-name {
    color: #333;
    font-weight: 600;
}

/* Train carriages */
.ukse-pp__train {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin: 1.25rem 0;
    flex-wrap: wrap;
}

.ukse-pp__carriage {
    background: linear-gradient(180deg, #e8e8e8 0%, #d0d0d0 100%);
    border-radius: 8px;
    padding: 0.5rem;
    border: 2px solid #bbb;
    position: relative;
}

.ukse-pp__carriage::before {
    content: '';
    display: block;
    height: 3px;
    background: var(--lse-tertiary-blue, #6ACAF3);
    border-radius: 2px;
    margin-bottom: 0.4rem;
}

.ukse-pp__door {
    display: flex;
    gap: 0.4rem;
}

/* Letter tiles */
.ukse-pp__tile {
    width: 48px;
    height: 48px;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--lse-structure-navy, #000032);
    background: #fff;
    border: 2px solid var(--lse-tertiary-blue, #6ACAF3);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.15s ease, opacity 0.2s ease, box-shadow 0.15s ease;
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.ukse-pp__tile:hover {
    transform: scale(1.08);
    box-shadow: 0 2px 8px rgba(106, 202, 243, 0.3);
}

.ukse-pp__tile:active {
    transform: scale(0.95);
}

.ukse-pp__tile--used {
    opacity: 0.25;
    pointer-events: none;
    transform: scale(0.9);
}

/* Word building area */
.ukse-pp__word-area {
    text-align: center;
    margin: 1.5rem 0 1rem;
}

.ukse-pp__slots {
    display: flex;
    justify-content: center;
    gap: 0.35rem;
    margin-bottom: 1rem;
    min-height: 52px;
}

.ukse-pp__slot {
    width: 44px;
    height: 44px;
    border: 2px dashed #ccc;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--lse-structure-navy, #000032);
    background: #fafafa;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease, transform 0.15s ease;
    user-select: none;
    -webkit-user-select: none;
}

.ukse-pp__slot--filled {
    border-style: solid;
    border-color: var(--lse-secondary-orange, #EE7218);
    background: #fff8f0;
}

.ukse-pp__slot--filled:hover {
    transform: scale(1.05);
    background: #fff0e0;
}

.ukse-pp__slot--cursor {
    border-style: dashed;
    border-color: #ccc;
    animation: ppCursorPulse 1.2s ease-in-out infinite;
}

@keyframes ppCursorPulse {
    0%, 100% { border-color: #ccc; }
    50% { border-color: var(--lse-secondary-orange, #EE7218); }
}

.ukse-pp__controls {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    margin-top: 0.75rem;
}

/* Feedback animations */
.ukse-pp__word-area--correct {
    animation: ppCorrect 0.6s ease;
}

.ukse-pp__word-area--shake {
    animation: ppShake 0.4s ease;
}

@keyframes ppCorrect {
    0% { transform: scale(1); }
    30% { transform: scale(1.05); }
    60% { transform: scale(0.98); }
    100% { transform: scale(1); }
}

@keyframes ppShake {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-8px); }
    40% { transform: translateX(8px); }
    60% { transform: translateX(-5px); }
    80% { transform: translateX(5px); }
}

/* Feedback text */
.ukse-pp__feedback {
    text-align: center;
    min-height: 1.5rem;
    margin: 0.5rem 0;
}

.ukse-pp__feedback--error {
    color: #d32f2f;
    font-weight: 600;
}

.ukse-pp__feedback--success {
    color: #2e7d32;
    font-weight: 600;
}

/* Completion */
.ukse-pp__complete {
    padding: 1.5rem;
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border-radius: 8px;
    text-align: center;
}

.ukse-pp__complete-msg {
    font-size: 1.25rem;
    font-weight: 700;
    color: #2e7d32;
    margin-bottom: 0.5rem;
}

.ukse-pp__final-score {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

/* Platform HUD accent */
.ukse-game-hud--platform .ukse-game-hud__item--line {
    border-left-color: var(--lse-tertiary-blue, #6ACAF3);
}

/* ==========================================================================
   MARKET STALL MATCH — Idiom Sorting
   ========================================================================== */

.ukse-ms {
    padding: 1rem;
    border-radius: 8px;
    background: #fefdfb;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

/* Wave progress dots */
.ukse-ms__progress {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin: 0.75rem 0 1.25rem;
}

.ukse-ms__dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ddd;
    transition: all 0.3s ease;
}

.ukse-ms__dot--done {
    background: var(--lse-primary-magenta, #E6007E);
}

.ukse-ms__dot--current {
    background: var(--lse-secondary-orange, #EE7218);
    box-shadow: 0 0 0 3px rgba(238, 114, 24, 0.25);
}

/* Market stalls */
.ukse-ms__stalls {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.ukse-ms__stall {
    background: #fff;
    border: 2px solid #ddd;
    border-radius: 10px;
    padding: 1rem 0.75rem;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    position: relative;
    overflow: hidden;
    min-height: 100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.ukse-ms__stall:hover:not(.ukse-ms__stall--done) {
    border-color: var(--lse-secondary-orange, #EE7218);
    box-shadow: 0 2px 8px rgba(238, 114, 24, 0.15);
}

/* Stall awning stripe */
.ukse-ms__stall-awning {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 5px;
    background: repeating-linear-gradient(
        90deg,
        var(--lse-secondary-orange, #EE7218),
        var(--lse-secondary-orange, #EE7218) 12px,
        #fff 12px,
        #fff 24px
    );
}

.ukse-ms__stall-start {
    font-size: 1rem;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 0.35rem;
}

.ukse-ms__stall-slot {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--lse-secondary-orange, #EE7218);
    letter-spacing: 0.1em;
}

/* Completed stall */
.ukse-ms__stall--done {
    background: linear-gradient(135deg, #e8f5e9 0%, #f0faf0 100%);
    border-color: #4caf50;
    cursor: default;
}

.ukse-ms__stall--done .ukse-ms__stall-awning {
    background: repeating-linear-gradient(
        90deg,
        #4caf50,
        #4caf50 12px,
        #fff 12px,
        #fff 24px
    );
}

.ukse-ms__stall-phrase {
    font-size: 1rem;
    font-weight: 700;
    color: #2e7d32;
    margin-bottom: 0.25rem;
}

.ukse-ms__stall-meaning {
    font-size: 0.8rem;
    color: #666;
    font-style: italic;
}

/* Stall target state — glow when fragment is selected */
.ukse-ms__stall--target {
    border-color: var(--lse-secondary-orange, #EE7218);
    box-shadow: 0 0 0 3px rgba(238, 114, 24, 0.2), 0 2px 8px rgba(238, 114, 24, 0.15);
    animation: msTargetPulse 1s ease-in-out infinite;
}

.ukse-ms__stall--target .ukse-ms__stall-slot {
    color: var(--lse-secondary-orange, #EE7218);
    font-weight: 700;
}

@keyframes msTargetPulse {
    0%, 100% { box-shadow: 0 0 0 3px rgba(238, 114, 24, 0.2), 0 2px 8px rgba(238, 114, 24, 0.15); }
    50% { box-shadow: 0 0 0 5px rgba(238, 114, 24, 0.3), 0 2px 12px rgba(238, 114, 24, 0.25); }
}

/* Instruction hint */
.ukse-ms__instruction {
    text-align: center;
    padding: 0.5rem;
    font-size: 0.9rem;
    color: #888;
    font-style: italic;
}

.ukse-ms__instruction i {
    margin-right: 0.25rem;
}

/* Wave clear summary */
.ukse-ms__wave-summary {
    text-align: center;
    padding: 1.25rem 1rem;
}

.ukse-ms__wave-clear-msg {
    font-size: 1.1rem;
    font-weight: 600;
    color: #2e7d32;
    margin-bottom: 1rem;
}

.ukse-ms__wave-clear-msg i {
    margin-right: 0.35rem;
}

.ukse-ms__wave-review {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
    text-align: left;
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
}

.ukse-ms__review-item {
    font-size: 0.95rem;
    line-height: 1.4;
    padding: 0.4rem 0.6rem;
    background: #f8faf8;
    border-radius: 0.35rem;
    border-left: 3px solid #2e7d32;
}

.ukse-ms__next-wave i {
    margin-left: 0.35rem;
}

/* Stall shake animation */
.ukse-ms__stall--shake {
    animation: msShake 0.4s ease;
}

@keyframes msShake {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-6px); }
    40% { transform: translateX(6px); }
    60% { transform: translateX(-4px); }
    80% { transform: translateX(4px); }
}

/* Stall bounce on complete */
.ukse-ms__stall--bounce {
    animation: msBounce 0.5s ease;
}

@keyframes msBounce {
    0% { transform: scale(1); }
    30% { transform: scale(1.06); }
    50% { transform: scale(0.97); }
    70% { transform: scale(1.02); }
    100% { transform: scale(1); }
}

/* Fragment cards */
.ukse-ms__fragments {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.ukse-ms__fragment {
    padding: 0.6rem 1.1rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    background: #fff;
    border: 2px solid #ccc;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.ukse-ms__fragment:hover {
    border-color: var(--lse-secondary-orange, #EE7218);
    background: #fff8f0;
}

.ukse-ms__fragment--selected {
    border-color: var(--lse-secondary-orange, #EE7218);
    background: var(--lse-secondary-orange, #EE7218);
    color: #fff;
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(238, 114, 24, 0.3);
}

.ukse-ms__fragment--used {
    opacity: 0.3;
    pointer-events: none;
    text-decoration: line-through;
}

/* Feedback area */
.ukse-ms__feedback {
    text-align: center;
    min-height: 1.5rem;
    margin: 0.5rem 0;
    font-weight: 600;
}

.ukse-ms__feedback--success {
    color: #2e7d32;
}

.ukse-ms__feedback--combo {
    color: var(--lse-secondary-orange, #EE7218);
}

/* Completion */
.ukse-ms__complete {
    padding: 1.5rem;
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border-radius: 8px;
    text-align: center;
}

.ukse-ms__complete-msg {
    font-size: 1.25rem;
    font-weight: 700;
    color: #2e7d32;
    margin-bottom: 0.5rem;
}

.ukse-ms__final-score {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.ukse-ms__summary {
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 1rem;
}

/* Market HUD accent */
.ukse-game-hud--market .ukse-game-hud__item--line {
    border-left-color: var(--lse-secondary-orange, #EE7218);
}

/* ==========================================================================
   ROOFTOP RESCUE — Grammar Runner
   ========================================================================== */

.ukse-rr {
    padding: 1rem;
    border-radius: 8px;
    background: #fbfaff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

/* Skyline progress */
.ukse-rr__skyline {
    margin: 0.75rem 0 1.25rem;
    padding: 0.75rem 0;
}

.ukse-rr__progress-track {
    position: relative;
    height: 6px;
    background: #e0d8f0;
    border-radius: 3px;
    overflow: visible;
}

.ukse-rr__progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #9c27b0, #ce93d8);
    border-radius: 3px;
    transition: width 0.5s ease;
}

.ukse-rr__runner {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: left 0.5s ease;
    font-size: 1.4rem;
    color: #9c27b0;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.2));
}

/* Rooftop scene */
.ukse-rr__scene {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 0;
    margin: 1rem 0;
    min-height: 60px;
}

.ukse-rr__rooftop {
    height: 30px;
    flex: 1;
    max-width: 200px;
    border-radius: 4px 4px 0 0;
}

.ukse-rr__rooftop--left {
    background: linear-gradient(180deg, #5d4e7a 0%, #3e3252 100%);
}

.ukse-rr__rooftop--right {
    background: linear-gradient(180deg, #5d4e7a 0%, #3e3252 100%);
}

.ukse-rr__gap {
    width: 80px;
    height: 30px;
    position: relative;
    display: flex;
    align-items: flex-end;
}

.ukse-rr__plank {
    width: 100%;
    height: 8px;
    background: #8d6e63;
    border-radius: 2px;
    position: absolute;
    bottom: 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.ukse-rr__plank--hidden {
    transform: scaleX(0);
    opacity: 0;
}

.ukse-rr__plank--placed {
    transform: scaleX(1);
    opacity: 1;
    animation: rrPlankSlam 0.3s ease;
}

@keyframes rrPlankSlam {
    0% { transform: scaleX(0) translateY(-10px); }
    60% { transform: scaleX(1.05) translateY(0); }
    100% { transform: scaleX(1) translateY(0); }
}

.ukse-rr__plank--cracked {
    animation: rrPlankCrack 0.4s ease;
    background: #d32f2f;
}

@keyframes rrPlankCrack {
    0%, 100% { transform: translateX(0) rotate(0deg); }
    25% { transform: translateX(-4px) rotate(-2deg); }
    50% { transform: translateX(4px) rotate(2deg); }
    75% { transform: translateX(-2px) rotate(-1deg); }
}

/* Sentence display */
.ukse-rr__sentence {
    text-align: center;
    font-size: 1.15rem;
    line-height: 1.6;
    color: var(--lse-structure-navy, #000032);
    margin: 1rem 0;
    padding: 0.75rem;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0d8f0;
}

.ukse-rr__blank {
    display: inline-block;
    min-width: 80px;
    padding: 0.15rem 0.5rem;
    border-bottom: 3px solid #9c27b0;
    color: #9c27b0;
    font-weight: 700;
    transition: all 0.3s ease;
}

.ukse-rr__blank--filled {
    background: rgba(156, 39, 176, 0.08);
    border-bottom-style: solid;
}

/* Grammar label */
.ukse-rr__grammar {
    text-align: center;
    font-size: 0.8rem;
    color: #9c27b0;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.75rem;
}

/* Timer bar */
.ukse-rr__timer {
    height: 4px;
    background: #e0e0e0;
    border-radius: 2px;
    margin: 0 0 1rem;
    overflow: hidden;
}

.ukse-rr__timer-bar {
    height: 100%;
    background: linear-gradient(90deg, #4caf50, #ff9800, #f44336);
    border-radius: 2px;
    transition: width 0.1s linear;
    width: 100%;
}

/* Option tiles */
.ukse-rr__options {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.6rem;
    max-width: 500px;
    margin: 0 auto 1rem;
}

.ukse-rr__option {
    padding: 0.75rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    background: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.ukse-rr__option:hover:not(:disabled) {
    border-color: #9c27b0;
    background: #f8f0ff;
}

.ukse-rr__option:active:not(:disabled) {
    transform: scale(0.97);
}

.ukse-rr__option--correct {
    background: #e8f5e9 !important;
    border-color: #4caf50 !important;
    color: #2e7d32 !important;
    animation: rrCorrectPulse 0.4s ease;
}

@keyframes rrCorrectPulse {
    0% { transform: scale(1); }
    40% { transform: scale(1.04); }
    100% { transform: scale(1); }
}

.ukse-rr__option--wrong {
    background: #ffebee !important;
    border-color: #ef5350 !important;
    color: #c62828 !important;
    opacity: 0.6;
    animation: rrWrongShake 0.35s ease;
}

@keyframes rrWrongShake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    50% { transform: translateX(5px); }
    75% { transform: translateX(-3px); }
}

.ukse-rr__option-sep {
    display: inline-block;
    margin: 0 0.25em;
    opacity: 0.45;
    font-weight: 700;
}

/* Feedback panel */
.ukse-rr__feedback {
    display: none;
    text-align: center;
    padding: 1rem;
    margin: 0.75rem 0;
    background: #f3e5f5;
    border-radius: 8px;
    border: 1px solid #ce93d8;
}

.ukse-rr__feedback--visible {
    display: block;
    animation: rrFeedbackIn 0.3s ease;
}

@keyframes rrFeedbackIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.ukse-rr__explanation {
    font-size: 0.95rem;
    color: #4a148c;
    margin-bottom: 0.75rem;
    font-style: italic;
}

/* Completion */
.ukse-rr__complete {
    padding: 1.5rem;
    background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
    border-radius: 8px;
    text-align: center;
}

.ukse-rr__complete-msg {
    font-size: 1.25rem;
    font-weight: 700;
    color: #6a1b9a;
    margin-bottom: 0.5rem;
}

.ukse-rr__final-score {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.ukse-rr__summary {
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 1rem;
}

/* Rooftop HUD accent */
.ukse-game-hud--rooftop .ukse-game-hud__item--line {
    border-left-color: #9c27b0;
}

/* ==========================================================================
   POSTCARD DETECTIVE — Reading Comprehension
   ========================================================================== */

.ukse-pd {
    padding: 1rem;
    border-radius: 8px;
    background: #fbfefb;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

/* Progress dots */
.ukse-pd__progress {
    display: flex;
    justify-content: center;
    gap: 0.4rem;
    margin: 0.75rem 0 1.25rem;
}

.ukse-pd__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ddd;
    transition: all 0.3s ease;
}

.ukse-pd__dot--correct {
    background: #4caf50;
}

.ukse-pd__dot--wrong {
    background: #ef5350;
}

.ukse-pd__dot--current {
    background: var(--lse-secondary-orange, #EE7218);
    box-shadow: 0 0 0 3px rgba(238, 114, 24, 0.2);
}

/* Postcard container */
.ukse-pd__postcard {
    background: #fff;
    border: 2px solid #d0e8d4;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.25rem;
    position: relative;
}

.ukse-pd__header {
    text-align: center;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 1rem;
}

.ukse-pd__header i {
    margin-right: 0.4rem;
    color: var(--lse-secondary-orange, #EE7218);
}

/* Clue cards */
.ukse-pd__clues {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
    margin-bottom: 1rem;
}

.ukse-pd__clue {
    padding: 0.75rem;
    border-radius: 8px;
    border: 2px solid #e0e0e0;
    min-height: 70px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: all 0.3s ease;
}

/* Fog state (unrevealed) */
.ukse-pd__clue--fog {
    background: linear-gradient(135deg, #f0f0f0 0%, #e4e4e4 100%);
    cursor: pointer;
    text-align: center;
    border-style: dashed;
}

.ukse-pd__clue--fog:hover {
    background: linear-gradient(135deg, #e8e8e8 0%, #ddd 100%);
    border-color: var(--lse-secondary-orange, #EE7218);
}

.ukse-pd__clue-number {
    font-weight: 700;
    font-size: 0.85rem;
    color: #666;
    display: block;
    margin-bottom: 0.2rem;
}

.ukse-pd__clue-cost {
    font-size: 0.75rem;
    color: #999;
}

/* Revealed state */
.ukse-pd__clue--revealed {
    background: #fff;
    border-color: #4caf50;
    border-style: solid;
    animation: pdReveal 0.4s ease;
}

@keyframes pdReveal {
    from { opacity: 0.5; transform: scale(0.97); }
    to { opacity: 1; transform: scale(1); }
}

.ukse-pd__clue--revealed .ukse-pd__clue-number {
    color: #4caf50;
}

.ukse-pd__clue-text {
    font-size: 0.9rem;
    color: #333;
    line-height: 1.4;
}

/* Points hint */
.ukse-pd__points-hint {
    text-align: center;
    font-size: 0.8rem;
    color: #888;
    margin-bottom: 0.5rem;
}

/* Destination options */
.ukse-pd__options {
    margin-bottom: 1rem;
}

.ukse-pd__options-label {
    display: block;
    text-align: center;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    margin-bottom: 0.6rem;
    font-size: 0.95rem;
}

.ukse-pd__options-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.ukse-pd__option {
    padding: 0.7rem 0.75rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    background: #fff;
    border: 2px solid #ddd;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.ukse-pd__option:hover:not(:disabled) {
    border-color: var(--lse-secondary-orange, #EE7218);
    background: #fff8f0;
}

.ukse-pd__option--selected {
    border-color: var(--lse-secondary-orange, #EE7218);
    background: var(--lse-secondary-orange, #EE7218);
    color: #fff;
}

.ukse-pd__option--correct {
    border-color: #4caf50 !important;
    background: #e8f5e9 !important;
    color: #2e7d32 !important;
}

.ukse-pd__option--wrong {
    border-color: #ef5350 !important;
    background: #ffebee !important;
    color: #c62828 !important;
}

.ukse-pd__submit {
    display: block;
    margin: 0 auto;
}

.ukse-pd__submit:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Result card */
.ukse-pd__result {
    padding: 1.25rem;
    border-radius: 8px;
    text-align: center;
    margin: 1rem 0;
    animation: pdResultIn 0.4s ease;
}

@keyframes pdResultIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.ukse-pd__result--correct {
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border: 1px solid #a5d6a7;
}

.ukse-pd__result--wrong {
    background: linear-gradient(135deg, #ffebee 0%, #ffcdd2 100%);
    border: 1px solid #ef9a9a;
}

.ukse-pd__result-verdict {
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.ukse-pd__result--correct .ukse-pd__result-verdict {
    color: #2e7d32;
}

.ukse-pd__result--wrong .ukse-pd__result-verdict {
    color: #c62828;
}

.ukse-pd__result-fact {
    font-size: 0.9rem;
    color: #555;
    font-style: italic;
    margin-bottom: 0.5rem;
    line-height: 1.4;
}

.ukse-pd__result-points {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--lse-secondary-orange, #EE7218);
    margin-bottom: 0.75rem;
}

/* Completion */
.ukse-pd__complete {
    padding: 1.5rem;
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border-radius: 8px;
    text-align: center;
}

.ukse-pd__complete-msg {
    font-size: 1.25rem;
    font-weight: 700;
    color: #2e7d32;
    margin-bottom: 0.5rem;
}

.ukse-pd__final-score {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.ukse-pd__summary {
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 1rem;
}

/* Postcard HUD accent */
.ukse-game-hud--postcard .ukse-game-hud__item--line {
    border-left-color: #4caf50;
}

/* ==========================================================================
   SHARED GAME ANIMATIONS — Toast, Score Pop
   ========================================================================== */

.ukse-game__toast {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    background: var(--lse-structure-navy, #000032);
    color: #fff;
    padding: 0.6rem 1.2rem;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 600;
    z-index: 9999;
    pointer-events: none;
    animation: toastIn 0.3s ease;
}

.ukse-game__toast--fade {
    opacity: 0;
    transition: opacity 0.3s ease;
}

@keyframes toastIn {
    from { opacity: 0; transform: translateX(-50%) translateY(10px); }
    to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

/* Score pop animation (used by games on point awards) */
.ukse-game__score-pop {
    position: absolute;
    font-weight: 700;
    color: var(--lse-secondary-orange, #EE7218);
    font-size: 1.1rem;
    pointer-events: none;
    animation: scorePop 0.8s ease forwards;
    z-index: 10;
}

@keyframes scorePop {
    0% { opacity: 1; transform: translateY(0) scale(1); }
    50% { opacity: 1; transform: translateY(-20px) scale(1.2); }
    100% { opacity: 0; transform: translateY(-40px) scale(0.8); }
}

/* ==========================================================================
   NEW GAMES v2 — Mobile Responsive
   ========================================================================== */

@media (max-width: 640px) {
    /* Market stalls: stack vertically on mobile */
    .ukse-ms__stalls {
        grid-template-columns: 1fr;
    }

    /* Postcard clues: single column */
    .ukse-pd__clues {
        grid-template-columns: 1fr;
    }

    /* Postcard options: single column */
    .ukse-pd__options-grid {
        grid-template-columns: 1fr;
    }

    /* Rooftop options: single column */
    .ukse-rr__options {
        grid-template-columns: 1fr;
    }

    /* Platform tiles: slightly smaller */
    .ukse-pp__tile {
        width: 42px;
        height: 42px;
        font-size: 1.2rem;
    }

    .ukse-pp__slot {
        width: 38px;
        height: 38px;
        font-size: 1.1rem;
    }

    /* Station names: hide on mobile to save space */
    .ukse-pp__station-name {
        display: none;
    }
}

@media (max-width: 400px) {
    .ukse-pp__tile {
        width: 36px;
        height: 36px;
        font-size: 1.1rem;
    }

    .ukse-pp__slot {
        width: 34px;
        height: 34px;
        font-size: 1rem;
    }

    .ukse-pp__train {
        gap: 0.5rem;
    }

    .ukse-pp__door {
        gap: 0.25rem;
    }
}

/* ==========================================================================
   HIGH-SPECIFICITY OVERRIDES — Game Hero Title + Mobile Hub Layout
   MARKER: These overrides fix global h2 bleeding into game components
   ========================================================================== */

/* Game Hero Title — left-aligned, no underline, no center */
.ukse-games-page .ukse-game-hero .ukse-game-hero__title {
    text-align: left !important;
    margin: 0 0 0.15rem !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    font-size: 1rem;
    font-weight: 600;
    color: var(--lse-structure-navy, #000032);
    line-height: 1.3;
}

/* Kill any pseudo-element underlines */
.ukse-games-page .ukse-game-hero .ukse-game-hero__title::before,
.ukse-games-page .ukse-game-hero .ukse-game-hero__title::after {
    content: none !important;
    display: none !important;
}

/* ==========================================================================
   Mobile Hub Layout Fix — 2x2 Grid for Tabs
   MARKER: Points badge row 1, tabs 2x2 grid row 2
   ========================================================================== */

@media (max-width: 768px) {
    /* Make hub a column on mobile */
    .ukse-games-hub-nav__inner {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
        padding: 0.5rem;
    }

    /* Points badge full-width on row 1 */
    .ukse-games-hub-nav .ukse-games-points {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    /* Tabs container: 2x2 grid instead of horizontal scroll */
    .ukse-games-hub-nav__cards {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        width: 100%;
        overflow: visible;  /* no horizontal scroll */
        margin: 0;
        padding: 4px;
    }

    /* Ensure no parent clips the tabs */
    .ukse-games-hub-nav {
        overflow: visible;
    }

    /* Tabs fill their grid cell */
    .ukse-game-tab {
        width: 100%;
        min-width: unset;
        min-height: 72px;
        padding: 0.5rem 0.6rem;
    }

    .ukse-game-tab__label {
        font-size: 0.7rem;
    }
}

/* =====================================================
   Games: Shared Actions Row & Toast
   ===================================================== */
.ukse-game__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
    margin-top: 1.25rem;
}

.ukse-game__toast {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    background: #1a1a2e;
    color: #fff;
    padding: 0.6rem 1.25rem;
    border-radius: 2rem;
    font-size: 0.9rem;
    font-weight: 500;
    z-index: 9999;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    transition: opacity 0.3s ease;
}

.ukse-game__toast--fade {
    opacity: 0;
}

@media (max-width: 640px) {
    .ukse-game__actions {
        flex-direction: column;
        align-items: stretch;
    }
    .ukse-game__actions .ukse-btn {
        width: 100%;
        text-align: center;
    }
}

/* ==========================================================================
   Games Hub Nav: Two-Column Layout
   ========================================================================== */

/* Left column: points badge + progress strip stacked */
.ukse-games-hub-nav__left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

/* Desktop: two-column layout (left: badges, right: tabs) */
@media (min-width: 769px) {
    .ukse-games-hub-nav__inner {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1.5rem;
    }

    .ukse-games-hub-nav__left {
        align-items: flex-start;
    }

    .ukse-games-hub-nav__left .ukse-games-points {
        margin-bottom: 0;
    }
}

/* ==========================================================================
   Games Progress Strip (Completed X/4)
   ========================================================================== */

.ukse-games-progress-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.4rem 0.9rem;
    background: linear-gradient(135deg, #f0fdf4 0%, #e8f5e9 100%);
    border: 1px solid #c8e6c9;
    border-radius: 999px;
    font-size: 0.8rem;
    color: #2e7d32;
    white-space: nowrap;
}

.ukse-games-progress-strip i {
    color: #4caf50;
    font-size: 0.85rem;
}

.ukse-games-progress-strip strong {
    font-weight: 700;
}

/* ==========================================================================
   Game Tab Best Score Subline
   ========================================================================== */

.ukse-game-tab__best {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    font-size: 0.7rem;
    color: #888;
    margin-top: 0.25rem;
}

.ukse-game-tab__best i {
    color: #d4a800;
    font-size: 0.65rem;
}

/* When tab is active, subtle highlight */
.ukse-game-tab--active .ukse-game-tab__best {
    color: #666;
}

/* When tab is locked, dim the best score */
.ukse-game-tab--locked .ukse-game-tab__best {
    opacity: 0.5;
}

/* ==========================================================================
   Idiom Illustrated: Next Button Styling
   Button now appears above feedback panel for better UX.
   ========================================================================== */

.ukse-idiom__next {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

/* ==========================================================================
   Reusable Section Heading (.ukse-section-heading)
   Ported from partner portal fieldset legend styling.
   Use on <h2 class="ukse-section-heading"> or <h3 class="ukse-section-heading">

   Overrides:
   - Global h2::after underline (line ~88, uses !important)
   - .entry-content h2 centered styling (line ~4693)
   - .entry-content h2::after 300px underline (line ~4703)
   ========================================================================== */

.ukse-section-heading,
h2.ukse-section-heading,
h3.ukse-section-heading,
.entry-content h2.ukse-section-heading,
.entry-content h3.ukse-section-heading,
html body div h2.ukse-section-heading,
html body article h2.ukse-section-heading,
html body section h2.ukse-section-heading,
html body .blog-single__content h2.ukse-section-heading,
html body div h3.ukse-section-heading,
html body article h3.ukse-section-heading,
html body section h3.ukse-section-heading,
html body .blog-single__content h3.ukse-section-heading {
    font-size: 1.15rem !important;
    font-weight: 600 !important;
    color: var(--lse-dark-blue, #000032) !important;
    margin-top: 2.5rem !important;
    margin-bottom: 1rem !important;
    padding-bottom: 0.6rem !important;
    border-bottom: 1px solid #E6007E !important;
    /* Reset theme defaults */
    text-align: left !important;
    position: static !important;
    background: none !important;
    text-decoration: none !important;
    letter-spacing: 0 !important;
    line-height: 1.35 !important;
}

.ukse-section-heading:first-child,
.entry-content .ukse-section-heading:first-child {
    margin-top: 0 !important;
}

/* Slightly larger for h2 */
h2.ukse-section-heading,
.entry-content h2.ukse-section-heading,
html body div h2.ukse-section-heading,
html body article h2.ukse-section-heading {
    font-size: 1.3rem !important;
}

/* Neutralise global h2::after underline for section headings */
.ukse-section-heading::after,
h2.ukse-section-heading::after,
h3.ukse-section-heading::after,
.entry-content h2.ukse-section-heading::after,
.entry-content h3.ukse-section-heading::after,
html body div h2.ukse-section-heading::after,
html body article h2.ukse-section-heading::after,
html body section h2.ukse-section-heading::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    margin: 0 !important;
}

/* ==========================================================================
   Heading Hierarchy Fix — h3 → h2 semantic conversion (19 Feb 2026)
   These classes were h3 tags to avoid the global h2 forced styling (centered,
   magenta underline, 40px). Now converted to h2 for correct heading hierarchy.
   Override the global h2 / h2::after rules with !important.
   ========================================================================== */

/* --- Reset global h2 forced styles for converted headings --- */
h2.school-desc-section__title,
h2.school-contact-block__title,
h2.ukse-course-modal__success-title,
.home-school-map__overlay-empty h2,
#initial-message h2,
#no-results h2 {
    text-align: left !important;
    font-weight: 700 !important;
    padding: 0 !important;
    position: relative !important;
}

/* Per-class font-size overrides (match existing h3 styling) */
h2.school-desc-section__title {
    font-size: clamp(1.25rem, 2.5vw, 1.5rem) !important;
    margin: 0 0 16px !important;
}
h2.school-contact-block__title {
    font-size: 1.15rem !important;
    margin: 0 0 16px !important;
}
h2.ukse-course-modal__success-title {
    font-size: 1.3rem !important;
    text-align: center !important;
    margin: 0 0 12px !important;
}
.home-school-map__overlay-empty h2 {
    font-size: 1.1rem !important;
    margin: 0 0 8px !important;
}
#initial-message h2 {
    font-size: 1.5rem !important;
    text-align: center !important;
    margin: 0 0 16px !important;
}
#no-results h2 {
    font-size: 1.3rem !important;
    text-align: center !important;
    margin: 0 0 12px !important;
}

/* --- Remove h2::after magenta underline for converted headings --- */
h2.school-desc-section__title::after,
h2.school-contact-block__title::after,
h2.ukse-course-modal__success-title::after,
.home-school-map__overlay-empty h2::after,
#initial-message h2::after,
#no-results h2::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    margin: 0 !important;
}

/* ==========================================================================
   Cookie Consent Banner
   Lightweight GDPR-style consent UI (GA4-ready)
   ========================================================================== */

.ukse-cookie-consent {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    background: #ffffff;
    border-top: 1px solid #e5e7eb;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.1);
    padding: 1rem;
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.ukse-cookie-consent.is-visible {
    transform: translateY(0);
}

.ukse-cookie-consent__inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.ukse-cookie-consent__text {
    flex: 1 1 400px;
    font-size: 0.9rem;
    line-height: 1.5;
    color: #374151;
}

.ukse-cookie-consent__text a {
    color: var(--lse-magenta, #e6007e);
    text-decoration: underline;
}

.ukse-cookie-consent__text a:hover {
    color: var(--lse-dark-blue, #000032);
}

.ukse-cookie-consent__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    flex-shrink: 0;
}

.ukse-cookie-consent__btn {
    display: inline-block;
    padding: 0.6rem 1.25rem;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    border: none;
    transition: background 0.2s, color 0.2s, transform 0.1s;
}

.ukse-cookie-consent__btn:hover {
    transform: translateY(-1px);
}

.ukse-cookie-consent__btn:active {
    transform: translateY(0);
}

.ukse-cookie-consent__btn--accept {
    background: linear-gradient(135deg, #EE7218 0%, #E6007E 100%);
    color: #ffffff;
}

.ukse-cookie-consent__btn--accept:hover {
    background: linear-gradient(135deg, #d96615 0%, #cc006e 100%);
    color: #ffffff;
}

.ukse-cookie-consent__btn--reject {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
}

.ukse-cookie-consent__btn--reject:hover {
    background: #e5e7eb;
    color: #1f2937;
}

/* Responsive: compact layout on mobile */
@media (max-width: 768px) {
    .ukse-cookie-consent {
        padding: 10px 12px;
        /* Prevent banner from covering more than ~35% of screen */
        max-height: 35vh;
        overflow: hidden;
    }

    .ukse-cookie-consent__inner {
        flex-direction: column;
        text-align: center;
        gap: 8px;
        max-height: calc(35vh - 20px);
    }

    .ukse-cookie-consent__text {
        font-size: 0.75rem;
        line-height: 1.35;
        /* Allow text to scroll if very long (rare) */
        max-height: 12vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .ukse-cookie-consent__actions {
        width: 100%;
        flex-direction: row;
        justify-content: center;
        gap: 8px;
        flex-shrink: 0;
    }

    .ukse-cookie-consent__btn {
        flex: 0 0 auto;
        min-width: 100px;
        padding: 8px 12px;
        font-size: 0.8rem;
    }
}

/* Extra compact on small phones */
@media (max-width: 400px) {
    .ukse-cookie-consent {
        padding: 8px 10px;
        max-height: 30vh;
    }

    .ukse-cookie-consent__inner {
        gap: 6px;
        max-height: calc(30vh - 16px);
    }

    .ukse-cookie-consent__text {
        font-size: 0.7rem;
        max-height: 10vh;
    }

    .ukse-cookie-consent__btn {
        padding: 6px 10px;
        font-size: 0.75rem;
        min-width: 80px;
    }
}

/* iOS Safari: extra bottom padding for home indicator + toolbar overlap */
@supports (-webkit-touch-callout: none) {
    @media (max-width: 768px) {
        .ukse-cookie-consent {
            padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
        }
    }
    @media (max-width: 400px) {
        .ukse-cookie-consent {
            padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
        }
    }
}

/* ==========================================================================
   School Single Page: Gallery → Overview Transition + Tab Panel Polish
   Phase XIX-A/B: Modular School CPT polish
   ========================================================================== */

/* Gallery → Overview transition: subtle divider + spacing */
.single-school .ukse-school-single-gallery + .school-overview {
    margin-top: 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 51, 0.08);
}

/* Mobile adjustments for gallery → overview */
@media (max-width: 768px) {
    .single-school .ukse-school-single-gallery + .school-overview {
        margin-top: 1.75rem;
        padding-top: 1.5rem;
    }
}

/* Hide duplicate tab panel titles (all viewports)
   Tab titles duplicate the tab nav labels (desktop) and accordion toggle text (mobile).
   Using display:none since tabs/accordions already provide accessible labels. */
.single-school .school-details-tabs .tab-content > .tab-title {
    display: none !important;
}

/* Ensure section headings inside tab panels remain visible */
.single-school .school-details-tabs .tab-content .ukse-section-heading {
    display: block !important;
}

/* Ensure both facilities and services sections are visible */
.single-school .school-details-tabs .tab-content .facilities-section,
.single-school .school-details-tabs .tab-content .services-section {
    display: block !important;
}

/* Languages Spoken — pill/tag layout */
.languages-section {
    margin-top: 2rem;
}
.languages-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.language-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    background: #f0f4fa;
    border: 1px solid #dce3ef;
    font-size: 0.875rem;
    line-height: 1.3;
    color: #1a2340;
    white-space: nowrap;
}
.language-pill__flag {
    font-size: 1.1em;
    line-height: 1;
}
.language-pill__label {
    font-weight: 500;
}

/* ==========================================================================
   UKSE UI Components — Tabs/Accordion (opt-in)
   Shared module for tabs→accordion pattern.
   Opt-in via [data-ukse-tabs] attribute on container.
   JS: js/ukse-tabs-accordion.js
   ========================================================================== */

/* --- Accordion Toggle Base Styling ---
   Applied to .ukse-tabs__toggle (default) or custom class via data-ukse-tabs-toggle-class
   These are injected by JS only on mobile viewports. */

[data-ukse-tabs] .ukse-tabs__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 16px 20px;
    margin-top: 12px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--lse-dark-blue, #000032);
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
}

[data-ukse-tabs] .ukse-tabs__toggle:hover {
    border-color: rgba(0, 0, 50, 0.15);
    box-shadow: 0 2px 8px rgba(0, 0, 50, 0.06);
}

/* Plus/minus indicator */
[data-ukse-tabs] .ukse-tabs__toggle::after {
    content: '+';
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--lse-accent-color, var(--lse-primary-magenta, #E6007E));
    transition: transform 0.2s ease;
}

/* Active toggle state */
[data-ukse-tabs] .ukse-tabs__toggle.active {
    background: var(--lse-dark-blue, #000032);
    border-color: var(--lse-dark-blue, #000032);
    color: #ffffff;
    border-radius: 12px 12px 0 0;
    margin-bottom: 0;
}

[data-ukse-tabs] .ukse-tabs__toggle.active::after {
    content: '−';
    color: var(--lse-accent-color, var(--lse-primary-magenta, #E6007E));
}

/* Panel styling when accordion is active (toggle adjacent) */
[data-ukse-tabs] .ukse-tabs__toggle.active + .tab-content {
    margin-top: 0;
    border-radius: 0 0 12px 12px;
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-top: none;
}

/* --- Exemption: .ukse-ui-exempt ---
   Containers inside exempt wrappers should not receive tabs styling.
   JS skips initialization; this CSS ensures no visual bleed. */
.ukse-ui-exempt [data-ukse-tabs] .ukse-tabs__toggle {
    display: none !important;
}

/* --- Variant: Gradient Toggle (City/School style) ---
   Add data-ukse-tabs-variant="gradient" to use magenta→orange gradient for active state */
[data-ukse-tabs][data-ukse-tabs-variant="gradient"] .ukse-tabs__toggle.active {
    background: linear-gradient(135deg, var(--lse-primary-magenta, #E6007E), var(--lse-secondary-orange, #EE7218));
    border-color: transparent;
    box-shadow: 0 10px 24px rgba(230, 0, 126, 0.18);
}

[data-ukse-tabs][data-ukse-tabs-variant="gradient"] .ukse-tabs__toggle.active::after {
    color: #ffffff;
}

/* ==========================================================================
   City Details Tabs (Phase XVIII-E → Extracted 2026-01-05)
   Mirrors the School CPT tabs pattern from school-profile.css
   Updated 2026-01-05: Flat bar + underline active indicator (School-aligned)
   ========================================================================== */

.city-details-tabs {
    margin: 48px 0;
}

/* Tab nav container - flat bar with subtle gradient background */
.city-details-tabs .tabs-nav {
    display: flex;
    justify-content: flex-start;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 6px 8px;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid rgba(0, 0, 50, 0.06);
    border-radius: 14px;
    box-shadow:
        inset 0 1px 2px rgba(0, 0, 50, 0.03),
        0 1px 0 rgba(255, 255, 255, 0.8);
}

/* Tab list items - left-aligned, natural width */
.city-details-tabs .tabs-nav li {
    flex: 0 0 auto;
}

/* Tab links - generous click area with underline indicator */
.city-details-tabs .tabs-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 16px 16px 18px;
    text-align: center;
    text-decoration: none;
    color: rgba(0, 0, 50, 0.55);
    font-weight: 600;
    font-size: 0.9rem;
    letter-spacing: 0.01em;
    background: transparent;
    border-radius: 10px;
    white-space: nowrap;
    transition:
        color 0.2s ease,
        background-color 0.2s ease;
}

/* Animated underline indicator */
.city-details-tabs .tabs-nav a::after {
    content: '';
    position: absolute;
    bottom: 6px;
    left: 50%;
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--lse-orange, #f58025), var(--lse-primary-magenta, #E6007E), var(--lse-tertiary-blue, #6acaf3));
    border-radius: 3px;
    transform: translateX(-50%);
    transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover state - underline only (no background) */
.city-details-tabs .tabs-nav a:hover {
    color: var(--lse-dark-blue, #000032);
}

.city-details-tabs .tabs-nav a:hover::after {
    width: 40%;
}

/* Active state - dark text + underline only (no background) */
.city-details-tabs .tabs-nav a.active {
    color: var(--lse-dark-blue, #000032);
}

.city-details-tabs .tabs-nav a.active::after {
    width: 60%;
}

/* Focus state - accessibility */
.city-details-tabs .tabs-nav a:focus {
    outline: none;
}

.city-details-tabs .tabs-nav a:focus-visible {
    outline: 2px solid var(--lse-tertiary-blue, #6acaf3);
    outline-offset: 2px;
    border-radius: 10px;
    z-index: 1;
}

.city-details-tabs .tabs-nav a.active:hover,
.city-details-tabs .tabs-nav a.active:focus {
    color: var(--lse-dark-blue, #000032);
}

/* --- CTA in tabs nav (Enquire Now button) --- */

.city-details-tabs .tabs-nav__cta-item {
    flex: 0 0 auto;
    margin-left: auto;
    display: flex;
    align-items: center;
    padding: 8px 4px;
}

.city-details-tabs .tabs-nav__cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    background: var(--lse-orange, #f58025);
    color: #ffffff;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
    transition:
        background-color 0.2s ease,
        transform 0.15s ease,
        box-shadow 0.2s ease;
    box-shadow: 0 2px 6px rgba(245, 128, 37, 0.25);
}

.city-details-tabs .tabs-nav__cta-btn:hover {
    background: #e06d1a;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(245, 128, 37, 0.35);
}

.city-details-tabs .tabs-nav__cta-btn:active {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(245, 128, 37, 0.25);
}

.city-details-tabs .tabs-nav__cta-btn:focus-visible {
    outline: 2px solid var(--lse-tertiary-blue, #6acaf3);
    outline-offset: 3px;
}

.city-details-tabs .tab-content {
    display: none;
    padding: 24px 28px;
    background: linear-gradient(180deg, #edf8fc 0%, #fff 45%, #fff8f2 100%);
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(0,0,50,0.08);
    margin-top: 8px;
    line-height: 1.7;
    color: #374151;
}

.city-details-tabs .tab-content.active {
    display: block;
}

/* Typography inside tab content (WYSIWYG output) */
.city-details-tabs .tab-content h2 {
    font-size: 1.75rem;
    color: var(--lse-dark-blue, #000032);
    margin: 0 0 1rem;
}

.city-details-tabs .tab-content h3 {
    font-size: 1.35rem;
    color: var(--lse-secondary-orange, #EE7218);
    font-weight: 700;
    margin: 1.75rem 0 0.75rem;
}

.city-details-tabs .tab-content h4 {
    font-size: 1.1rem;
    color: var(--lse-dark-blue, #000032);
    margin: 1.5rem 0 0.5rem;
}

.city-details-tabs .tab-content p {
    margin-bottom: 1rem;
}

/* Bullet list spacing */
.city-details-tabs .tab-content ul {
    margin: 0 0 1.25rem 1.5rem;
    padding-left: 0;
    list-style: disc;
}

.city-details-tabs .tab-content li {
    margin-bottom: 0.35rem;
}

.city-details-tabs .tab-content ol {
    margin: 0 0 1.25rem 1.5rem;
    padding-left: 0;
}

/* Nested lists */
.city-details-tabs .tab-content ul ul,
.city-details-tabs .tab-content ol ol,
.city-details-tabs .tab-content ul ol,
.city-details-tabs .tab-content ol ul {
    margin: 0.5rem 0 0.5rem 1rem;
}

.city-tab-placeholder {
    text-align: center;
    padding: 36px;
    border-radius: 14px;
    background: #f7f9fc;
    color: rgba(0, 0, 50, 0.6);
    font-style: italic;
}

/* --- Tab Media Images (generic rule for all tabs) --- */

.city-tab-media img {
    max-width: 500px;
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto 1.5rem auto;
    border-radius: 18px;
}

/* --- Student Life Tab Layout (image + text side-by-side on desktop) --- */

.city-tab-student-life {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.city-tab-media--student-life {
    margin: 0 !important;
    max-width: none !important;
    width: 100%;
}

.city-tab-media--student-life img {
    margin-bottom: 0;
    max-height: none !important;
    max-width: none !important;
    height: 100%;
    width: 100%;
}

.city-tab-text {
    flex: 1;
}

@media (min-width: 769px) {
    .city-tab-student-life {
        flex-direction: row;
        align-items: stretch; /* Allow image column to match content height */
    }

    .city-tab-media--student-life {
        flex: 0 0 40%;
        max-width: 40%;
        width: 40%;
        display: flex;
        flex-direction: column;
        margin: 0 !important; /* Override base 1.75rem bottom margin */
    }

    .city-tab-media--student-life img {
        flex: 1; /* Grow to fill container height */
        min-height: 300px;
        max-height: none !important; /* Override base 400px limit */
        max-width: none !important; /* Override base 500px limit */
        height: 100%;
        width: 100% !important;
        object-fit: cover;
        object-position: center;
    }

    .city-tab-text {
        flex: 1;
        display: flex;
        flex-direction: column;
    }
}

/* --- City Tab Media (edge-to-edge images with accent bar) --- */
/* No inset frame: image fills wrapper, gradient accent bar overlays top edge */

.city-tab-media {
    position: relative;
    max-width: 600px;
    margin: 0 auto 1.75rem;
    padding: 0; /* Edge-to-edge: no inset padding */
    background: transparent; /* No box around image */
    border: none;
    border-radius: 18px;
    box-shadow: 0 4px 16px rgba(0, 0, 50, 0.06), 0 2px 4px rgba(0, 0, 50, 0.03);
    overflow: hidden; /* Clip image corners & gradient bar */
}

/* Gradient accent bar on top (orange → magenta → light blue) */
.city-tab-media::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--lse-orange, #f58025), var(--lse-primary-magenta, #E6007E), var(--lse-tertiary-blue, #6acaf3));
    border-radius: 18px 18px 0 0;
}

/* Disable double gradient bar for Tab 1 (highlight wrapper has its own) */
.city-overview-highlight .city-tab-media::before {
    display: none;
}

.city-tab-media img {
    display: block;
    max-height: 400px;
    width: 100%;
    height: auto;
    object-fit: cover;
    border: none; /* Edge-to-edge: wrapper clips corners */
    box-shadow: none;
    border-radius: 0; /* Wrapper handles rounding */
}

/* --- City Tab Body (WYSIWYG content wrapper) --- */

.city-tab-body {
    max-width: 78ch;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.75;
    color: var(--vision-text-secondary, #4b5563);
}

.city-tab-body > *:first-child {
    margin-top: 0;
}

.city-tab-body > *:last-child {
    margin-bottom: 0;
}

/* Student Life: body inherits flex sizing, no max-width constraint */
.city-tab-student-life .city-tab-body {
    max-width: none;
}

/* --- City Tab Wide Split Layout (Practical tab only) --- */
/* Desktop: cards left, image right; remaining cards full-width below */

body.single-city .city-tab-layout--wide-split {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

body.single-city .city-tab-split-row {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Split cards column - remove max-width constraint */
body.single-city .city-tab-split-cards {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: none;
}

/* Split cards inherit sectioned styling */
body.single-city .city-tab-split-cards .city-subsection-card {
    margin: 0;
}

/* Rest cards below split row - full width */
body.single-city .city-tab-rest-cards {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: none;
}

/* Media inside split row - edge-to-edge styling */
body.single-city .city-tab-layout--wide-split .city-tab-media {
    margin: 0;
    max-width: none;
    padding: 0; /* Edge-to-edge: no inset padding */
}

body.single-city .city-tab-layout--wide-split .city-tab-media img {
    margin-bottom: 0;
    display: block;
    border-radius: 0; /* Wrapper clips corners */
}

/* Tab 3 (Practical): no gradient bar on image */
body.single-city .city-tab-layout--practical .city-tab-media::before {
    display: none;
}

/* Desktop: side-by-side layout */
@media (min-width: 769px) {
    body.single-city .city-tab-split-row {
        flex-direction: row;
        align-items: stretch; /* Image stretches to match cards height */
    }

    /* Practical tab: cards LEFT (60%), image RIGHT (40%) - image matches cards height */
    body.single-city .city-tab-layout--practical .city-tab-split-row .city-tab-split-cards {
        flex: 0 0 60%;
        max-width: 60%;
    }

    body.single-city .city-tab-layout--practical .city-tab-split-row .city-tab-media {
        flex: 0 0 38%;
        max-width: 38%;
        display: flex;
        flex-direction: column;
        margin: 0 !important; /* Override base bottom margin */
    }

    body.single-city .city-tab-layout--practical .city-tab-split-row .city-tab-media img {
        flex: 1;
        width: 100%;
        height: 100%;
        max-height: none !important;
        object-fit: cover;
    }
}

/* Tablet: reduce gap, adjust widths */
@media (min-width: 641px) and (max-width: 900px) {
    body.single-city .city-tab-split-row {
        gap: 1rem;
    }

    body.single-city .city-tab-layout--practical .city-tab-split-row .city-tab-split-cards {
        flex: 0 0 58%;
        max-width: 58%;
    }

    body.single-city .city-tab-layout--practical .city-tab-split-row .city-tab-media {
        flex: 0 0 40%;
        max-width: 40%;
    }
}

/* Mobile: stack vertically */
@media (max-width: 640px) {
    body.single-city .city-tab-split-row {
        flex-direction: column;
    }

    body.single-city .city-tab-layout--wide-split .city-tab-media {
        max-width: 100%;
    }

    body.single-city .city-tab-layout--wide-split .city-tab-media img {
        max-height: 300px;
    }
}

/* --- City Tab Subsection Cards (Practical & Fit tabs) --- */
/* Sections WYSIWYG content into styled cards by H2 (or H3 fallback) */

body.single-city .city-tab-body--sectioned {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Ensure intentional spacing between tab media and sectioned cards */
body.single-city .city-tab-media + .city-tab-body--sectioned {
    margin-top: 0.5rem;
}

body.single-city .city-subsection-card {
    position: relative;
    background: #fff;
    border-radius: 12px;
    padding: 1.5rem 1.75rem;
    box-shadow: 0 2px 8px rgba(0, 0, 51, 0.06);
    border: 1px solid rgba(0, 0, 51, 0.08);
    overflow: visible; /* Allow accent bar outside */
}

/* Accent bar OUTSIDE right edge (same style as top gradient bar on images) */
body.single-city .city-subsection-card::before {
    content: '';
    position: absolute;
    right: -4px;
    left: auto;
    top: 8px;
    bottom: 8px;
    width: 4px;
    background: linear-gradient(180deg, var(--lse-orange, #f58025) 0%, var(--lse-primary-magenta, #E6007E) 50%, var(--lse-tertiary-blue, #6acaf3) 100%);
    border-radius: 0 6px 6px 0;
    pointer-events: none;
}

/* Card headings: smaller than panel title, no underline (cards have accent bar) */
/* Font-size matches School CPT non-highlight: .school-desc-section:not(.is-highlight) */
/* !important overrides generic h2 { font-size: var(--lse-heading-h2-size) !important } */
body.single-city .city-subsection-card h2 {
    font-size: clamp(1.15rem, 2.2vw, 1.35rem) !important;
    font-weight: 700;
    color: var(--lse-dark-blue, #000032);
    margin: 0 0 0.75rem 0;
    line-height: 1.3;
    text-align: left !important; /* Override .entry-content h2 center */
}

body.single-city .city-subsection-card h3 {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--lse-dark-blue, #000032);
    margin: 0 0 0.6rem 0;
    line-height: 1.35;
}

/* Remove global underline from card headings - cards have accent bar */
body.single-city .city-subsection-card h2::after,
body.single-city .city-subsection-card h3::after {
    content: none !important;
    display: none !important;
}

/* Body text inside cards */
body.single-city .city-subsection-card p {
    margin: 0 0 0.85rem 0;
    line-height: 1.7;
}

body.single-city .city-subsection-card p:last-child {
    margin-bottom: 0;
}

/* Lists inside cards */
body.single-city .city-subsection-card ul,
body.single-city .city-subsection-card ol {
    margin: 0.5rem 0 1rem 1.25rem;
    padding: 0;
}

body.single-city .city-subsection-card li {
    margin-bottom: 0.4rem;
    line-height: 1.6;
}

/* Desktop adjustments */
@media (min-width: 769px) {
    body.single-city .city-tab-body--sectioned {
        gap: 1.75rem;
    }

    body.single-city .city-subsection-card {
        padding: 1.75rem 2rem;
    }
    /* H2 font-size removed - clamp() handles responsive sizing */
}

/* Tablet 700–900px */
@media (min-width: 700px) and (max-width: 900px) {
    body.single-city .city-subsection-card {
        padding: 1.35rem 1.5rem;
    }
}

/* Mobile: tighter padding */
@media (max-width: 599px) {
    body.single-city .city-subsection-card {
        padding: 1.25rem 1rem;
        border-radius: 10px;
    }

    body.single-city .city-subsection-card::before {
        right: -3px;
        width: 3px;
        top: 6px;
        bottom: 6px;
        border-radius: 0 4px 4px 0;
    }
    /* H2 font-size removed - clamp() handles responsive sizing */

    body.single-city .city-subsection-card h3 {
        font-size: 1.05rem;
    }
}

/* --- Lead Card Styling (first card in sectioned tabs) --- */
/* Matches School CPT .school-desc-section.is-highlight styling */

body.single-city .city-subsection-card--lead {
    padding: 1.75rem 2rem;
    margin-bottom: 0.25rem;
    background: #fefafe; /* Subtle warm tint - matches School highlight */
    border: 1px solid rgba(0, 0, 50, 0.1);
    box-shadow: 0 2px 8px rgba(0, 0, 50, 0.06), 0 12px 28px rgba(0, 0, 50, 0.05);
    overflow: hidden;
}

/* Gradient accent line on lead card - matches School highlight ::before */
/* Override base ::before (right-side bar) with top bar */
body.single-city .city-subsection-card--lead::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: auto; /* Reset base rule */
    width: auto; /* Reset base rule */
    height: 4px;
    background: linear-gradient(90deg, #EE7218 0%, #E6007E 50%, #6ACAF3 100%);
    border-radius: 12px 12px 0 0;
}

/* Lead card H2 - larger to match School highlight section */
/* !important overrides generic h2 { font-size: var(--lse-heading-h2-size) !important } */
body.single-city .city-subsection-card--lead h2 {
    font-size: clamp(1.35rem, 2.8vw, 1.65rem) !important;
}

/* Desktop lead adjustments */
@media (min-width: 769px) {
    body.single-city .city-subsection-card--lead {
        padding: 2rem 2.25rem;
    }
}

/* Mobile lead adjustments */
@media (max-width: 599px) {
    body.single-city .city-subsection-card--lead {
        padding: 1.35rem 1.15rem;
    }
}

/* --- City Tab Wide Media (full-width edge-to-edge for Tabs 1 & 4) --- */
/* Full-width image, no inset frame, accent bar overlays top edge */

.city-tab-media--wide {
    max-width: none; /* Override base 600px limit */
    margin: 0 0 1rem; /* Tighter spacing below image */
    padding: 0; /* Edge-to-edge: no inset padding */
}

.city-tab-media--wide img {
    max-width: none; /* Override base 500px limit */
    max-height: 420px; /* Reasonable landscape constraint */
    width: 100%;
    object-fit: cover;
    object-position: center 40%; /* Bias toward upper portion */
    margin-bottom: 0;
    display: block;
    border-radius: 0; /* Wrapper clips corners */
}

/* --- City Tab Cards Grid (2-column for Tab 1) --- */

.city-tab-cards-grid {
    display: block; /* Wrapper for sectioned content */
}

.city-tab-cards-grid .city-tab-body--sectioned {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Tab 1 (Overview): Single-column cards matching Tab 4 layout */
body.single-city #city-overview .city-tab-cards-grid .city-tab-body--sectioned {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

@media (min-width: 769px) {
    body.single-city #city-overview .city-tab-cards-grid .city-tab-body--sectioned {
        gap: 1.75rem;
    }
}

/* --- Legacy: City Overview Highlight (deprecated, kept for backward compat) --- */

.city-overview-highlight {
    position: relative;
    max-width: 600px;
    margin: 0 auto 1.5rem;
    padding: 18px;
    background: #fefafe; /* warm tint - matches School highlight */
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-radius: 18px;
    box-shadow: 0 4px 16px rgba(0, 0, 50, 0.06), 0 2px 4px rgba(0, 0, 50, 0.03);
    overflow: hidden;
}

/* Gradient accent bar on top */
.city-overview-highlight::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--lse-orange, #f58025), var(--lse-primary-magenta, #E6007E), var(--lse-tertiary-blue, #6acaf3));
    border-radius: 18px 18px 0 0;
}

/* Reset image margin inside highlight */
.city-overview-highlight .city-tab-media {
    margin-bottom: 0;
}

.city-overview-highlight .city-tab-media img {
    margin-bottom: 0;
    border: none;
    box-shadow: none;
    max-height: 320px;
    width: 100%;
    object-fit: cover;
}

/* Tighten spacing: first heading after overview highlight */
.city-overview-highlight + .city-tab-body > h2:first-child,
.city-overview-highlight + .city-tab-body > h3:first-child,
.city-overview-highlight + .city-tab-body--sectioned .city-subsection-card:first-child h2:first-child,
.city-overview-highlight + .city-tab-body--sectioned .city-subsection-card:first-child h3:first-child {
    margin-top: 0.5rem;
}

/* --- City Tab Body Typography Rhythm --- */

.city-tab-body h2 {
    font-size: clamp(1.35rem, 2.8vw, 1.65rem);
    font-weight: 700;
    color: var(--lse-dark-blue, #000032);
    margin: 2rem 0 1rem;
    line-height: 1.3;
}

.city-tab-body h3 {
    font-size: clamp(1.15rem, 2.2vw, 1.35rem);
    font-weight: 700;
    color: var(--lse-secondary-orange, #EE7218);
    margin: 1.75rem 0 0.75rem;
    line-height: 1.35;
}

.city-tab-body h4 {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--lse-dark-blue, #000032);
    margin: 1.5rem 0 0.5rem;
}

.city-tab-body p {
    margin: 0 0 1em;
}

.city-tab-body ul,
.city-tab-body ol {
    margin: 0 0 1.25em;
    padding-left: 1.5em;
}

.city-tab-body li {
    margin-bottom: 0.5em;
}

/* --- City Inline CTA (Overview tab) --- */

.city-inline-cta {
    margin-top: 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 50, 0.08);
}

.city-inline-cta__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    max-width: 78ch;
    margin: 0 auto;
    padding: 24px 28px;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-radius: 12px;
    box-shadow: 0 1px 4px rgba(0, 0, 50, 0.04), 0 6px 16px rgba(0, 0, 50, 0.03);
    position: relative;
    overflow: hidden;
}

/* Gradient accent line at top */
.city-inline-cta__inner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--lse-orange, #f58025), var(--lse-primary-magenta, #E6007E), var(--lse-tertiary-blue, #6acaf3));
}

.city-inline-cta__text {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--lse-dark-blue, #000032);
}

.city-inline-cta__btn {
    flex-shrink: 0;
    padding: 14px 28px;
    background: var(--lse-orange, #f58025);
    color: #ffffff;
    font-size: 1rem;
    font-weight: 700;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.city-inline-cta__btn:hover {
    background: #e06d1a;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(245, 128, 37, 0.35);
}

.city-inline-cta__btn:active {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(245, 128, 37, 0.25);
}

/* Mobile: stack vertically */
@media (max-width: 640px) {
    .city-inline-cta__inner {
        flex-direction: column;
        text-align: center;
        gap: 16px;
        padding: 20px 24px;
    }

    .city-inline-cta__btn {
        width: 100%;
    }
}

/* --- Tab Title (shared style for .tab-title headings) --- */

.city-details-tabs .tab-title,
.city-schools-section .tab-title {
    display: block;
    font-size: 1.9rem;
    color: var(--lse-dark-blue, #000032);
    margin: 0 0 30px;
    padding: 0;
    text-align: center;
    width: 100%;
}

.city-details-tabs .tab-title::after,
.city-schools-section .tab-title::after {
    content: '';
    display: block;
    width: 120px;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--lse-primary-magenta, #E6007E), var(--lse-secondary-orange, #EE7218));
    margin: 15px auto 0;
}

/* --- Schools Section --- */

.city-schools-section {
    margin-top: 48px;
    padding-bottom: 48px;
}

.city-schools-inner {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem;
    background: #fefafe; /* Warm tint matching city tab frames */
    border: 1px solid rgba(0, 0, 50, 0.08);
    border-radius: 18px;
    box-shadow: 0 4px 16px rgba(0, 0, 50, 0.06), 0 2px 4px rgba(0, 0, 50, 0.03);
    overflow: hidden;
}

/* Gradient accent bar on top */
.city-schools-inner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--lse-orange, #f58025), var(--lse-primary-magenta, #E6007E), var(--lse-tertiary-blue, #6acaf3));
    border-radius: 18px 18px 0 0;
}

.city-schools-intro {
    margin-bottom: 32px;
    padding: 28px;
    background: #ffffff;
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(0,0,50,0.08);
    line-height: 1.7;
    color: #374151;
}

.city-schools-intro h3 {
    font-size: 1.35rem;
    color: var(--lse-secondary-orange, #EE7218);
    font-weight: 700;
    margin: 0 0 0.75rem;
}

.city-schools-intro p {
    margin-bottom: 1rem;
}

.city-schools-intro p:last-child {
    margin-bottom: 0;
}

/* Bullet list spacing */
.city-schools-section ul {
    margin-left: 1.5rem;
}

.city-schools-intro ul,
.city-schools-intro ol {
    margin: 0 0 1.25rem 1.5rem;
    padding-left: 0;
    list-style: disc;
}

.city-schools-intro ul li,
.city-schools-intro ol li {
    margin-bottom: 0.35rem;
}

/* --- Tablet Breakpoint (769-1024px) --- */

@media (min-width: 769px) and (max-width: 1024px) {
    .city-details-tabs .tabs-nav {
        padding: 5px 6px;
    }

    .city-details-tabs .tabs-nav a {
        padding: 14px 10px 16px;
        font-size: 0.85rem;
    }

    .city-details-tabs .tabs-nav a::after {
        bottom: 5px;
    }

    .city-details-tabs .tabs-nav__cta-btn {
        padding: 8px 14px;
        font-size: 0.8rem;
    }
}

/* --- Mobile / Tablet Breakpoints (≤768px) --- */

@media (max-width: 768px) {
    .city-details-tabs .tabs-nav {
        flex-wrap: wrap;
        border-radius: 12px;
        gap: 0.25rem;
        padding: 6px;
    }

    .city-details-tabs .tabs-nav li {
        flex: 1 1 calc(50% - 0.25rem);
    }

    .city-details-tabs .tabs-nav a {
        padding: 12px 10px 14px;
        font-size: 0.85rem;
    }

    .city-details-tabs .tabs-nav a::after {
        bottom: 4px;
        height: 2px;
    }

    /* CTA wraps to full width below tabs on tablet */
    .city-details-tabs .tabs-nav__cta-item {
        flex: 1 1 100%;
        margin-left: 0;
        margin-top: 6px;
        justify-content: center;
    }

    .city-details-tabs .tabs-nav__cta-btn {
        width: 100%;
        justify-content: center;
        padding: 12px 18px;
    }

    .city-details-tabs .tab-content {
        padding: 18px 16px;
    }

    .city-details-tabs .tab-content h2 {
        font-size: 1.5rem;
    }

    .city-schools-intro {
        padding: 20px 18px;
    }

    .city-details-tabs .tab-title,
    .city-schools-section .tab-title {
        font-size: 1.5rem;
    }
}

/* --- Mobile Accordion (≤640px) --- */

@media (max-width: 640px) {
    /* Hide tabs nav when accordion active */
    .city-details-tabs .tabs-nav[hidden] {
        display: none !important;
    }

    /* Hide in-nav CTA when accordion mode - use standalone CTA instead */
    .city-details-tabs .tabs-nav__cta-item {
        display: none;
    }

    /* Schools section mobile */
    .city-schools-section {
        margin-top: 32px;
        padding-bottom: 32px;
    }

    .city-schools-intro {
        padding: 18px 16px;
        margin-bottom: 24px;
    }
}

/* ==========================================================================
   Phase C: Cross-sell Thank-You + City Selection
   ========================================================================== */

/* Cross-sell section in modal success */
.ukse-crosssell-section {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e0e0e0;
}

.ukse-crosssell-heading {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 12px;
    color: #333;
}

.ukse-crosssell-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    margin-bottom: 8px;
    cursor: pointer;
    transition: border-color 0.2s;
}

.ukse-crosssell-card:hover {
    border-color: #f47920;
}

.ukse-crosssell-card input[type="checkbox"] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin: 0;
}

.ukse-crosssell-info {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
}

.ukse-crosssell-card img {
    width: 40px;
    height: 40px;
    object-fit: contain;
    border-radius: 4px;
    flex-shrink: 0;
}

.ukse-crosssell-card .school-name {
    font-weight: 500;
    color: #333;
}

.ukse-crosssell-card .school-city {
    font-size: 13px;
    color: #666;
    margin-left: auto;
    flex-shrink: 0;
}

.ukse-crosssell-actions {
    margin-top: 12px;
    display: flex;
    gap: 12px;
    align-items: center;
}

.ukse-crosssell-submit {
    background: #f47920;
    color: #fff;
    border: none;
    padding: 8px 20px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: background-color 0.2s;
}

.ukse-crosssell-submit:hover {
    background: #e06810;
}

.ukse-crosssell-submit:disabled {
    background: #ccc;
    cursor: not-allowed;
}

.ukse-crosssell-dismiss {
    color: #666;
    font-size: 13px;
    cursor: pointer;
    text-decoration: underline;
}

.ukse-crosssell-dismiss:hover {
    color: #333;
}

.ukse-crosssell-thanks {
    color: #155724;
    font-size: 14px;
    margin: 0;
}

/* City selection toggle for /enquire/ */
.ukse-city-toggle {
    flex-direction: row;
}

.ukse-city-select-wrap select {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 16px;
    box-sizing: border-box;
}

/* ==========================================================================
   Promo Card Tint (base — loads on all pages, not just Finder)
   ========================================================================== */

.course-card.course-card--has-promo {
    background: linear-gradient(145deg, #fff0f4 0%, #fce8ee 100%);
    border-left: 3px solid #E6007E;
}

/* ==========================================================================
   Promo Badge (base — loads on all pages, not just Finder)
   ========================================================================== */

.promo-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #E6007E;
    color: #fff;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
}
.promo-badge__pct {
    font-weight: 700;
}
.promo-badge__urgency {
    font-weight: 400;
    font-size: 11px;
    opacity: 0.9;
}
.promo-badge--urgent {
    animation: ukse-promo-pulse 2s ease-in-out infinite;
}

/* Card-level promo savings line */
.ukse-card-promo-savings {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
    margin-top: 4px;
    font-size: 13px;
    color: #333;
    clear: both;
}
.ukse-card-promo-savings del {
    color: #999;
    text-decoration: line-through;
}
.ukse-card-promo-savings .ukse-promo-saved {
    color: #E6007E;
    font-weight: 600;
}

/* ==========================================================================
   Promo Banner (Single Course Page)
   ========================================================================== */

.ukse-promo-banner {
    background: linear-gradient(135deg, #fff0f4 0%, #fce8ee 100%);
    border: 1px solid rgba(230, 0, 126, 0.2);
    border-left: 4px solid #E6007E;
    border-radius: 8px;
    padding: 16px 20px;
    margin-bottom: 24px;
}
.ukse-promo-banner .promo-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #E6007E;
    color: #fff;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
}
.ukse-promo-banner__description {
    margin: 8px 0 0;
    font-size: 15px;
    color: #333;
}
.ukse-promo-banner__expiry {
    margin: 4px 0 0;
    font-size: 13px;
    color: #666;
}
.ukse-promo-banner__urgency {
    margin: 4px 0 0;
    font-size: 14px;
    font-weight: 600;
    color: #E6007E;
}

/* --- Announcement banner variant (dark blue) --- */
.ukse-promo-banner--announcement {
    background: linear-gradient(135deg, #f0f4ff 0%, #e8eeff 100%);
    border: 1px solid rgba(0, 93, 170, 0.2);
    border-left: 4px solid #005DAA;
}
.promo-badge--announcement {
    background: #005DAA !important;
}
.ukse-promo-banner__urgency--announcement {
    color: #005DAA;
}

/* --- School card promo ribbon overlay --- */
.ukse-school-card__media {
    position: relative;
    overflow: hidden;
}
.ukse-school-card__promo-ribbon {
    position: absolute;
    top: 10px;
    left: 0;
    background: #E6007E;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 12px 4px 8px;
    border-radius: 0 14px 14px 0;
    line-height: 1.3;
    z-index: 2;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.ukse-school-card__promo-ribbon--announcement {
    background: #005DAA;
}
/* Carousel variant: position inside .school-image-wrapper */
.school-image-wrapper {
    position: relative;
}
.ukse-school-card__promo-ribbon--carousel {
    top: auto;
    bottom: 40px;
}

/* Promo headline strikethrough */
.ukse-pricebands__headline--promo del {
    color: #999;
    text-decoration: line-through;
    font-weight: 400;
}
.ukse-pricebands__headline--promo ins {
    text-decoration: none;
}
.ukse-pricebands__headline--promo ins strong {
    color: #333;
}
.ukse-promo-save {
    display: inline-block;
    background: #E6007E;
    color: #fff;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    vertical-align: middle;
    margin-left: 4px;
}

/* CPT calculator promo savings line */
.ukse-promo-savings {
    font-size: 14px;
    margin-top: 6px;
    line-height: 1.4;
}
.ukse-promo-savings del {
    color: #999;
    text-decoration: line-through;
    font-weight: 400;
}
.ukse-promo-savings .ukse-promo-saved {
    color: #E6007E;
    font-weight: 600;
}

/* ── Back to Top ─────────────────────────────────────────── */

/* Hide parent-theme back-to-top if present */
.back_to_top { display: none !important; }

.ukse-back-to-top {
    position: fixed;
    bottom: 24px;
    left: 24px;
    z-index: 900;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 10px;
    background: #29235C;
    color: #fff;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease, background 0.15s ease, bottom 0.25s ease;
    -webkit-tap-highlight-color: transparent;
}

.ukse-back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.ukse-back-to-top:hover {
    background: #E6007E;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.ukse-back-to-top:active {
    transform: scale(0.93);
}

.ukse-back-to-top svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .ukse-back-to-top {
        width: 36px;
        height: 36px;
        bottom: 16px;
        left: 16px;
        border-radius: 8px;
    }
}

/* =========================================================================
 * Course-Type Landing Pages
 * Scoped under .page-template-page-course-type-landing
 * ======================================================================= */

/* Hero */
.ukse-ct-hero {
    background: linear-gradient(135deg, #13315c 0%, #1a4a8a 100%);
    color: #fff;
    padding: 3rem 0;
}
.ukse-ct-hero__inner {
    display: flex;
    align-items: center;
    gap: 2.5rem;
}
.ukse-ct-hero__content {
    flex: 1 1 55%;
}
.ukse-ct-hero__title {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 0.75rem;
    color: #fff;
}
.ukse-ct-hero__subtitle {
    font-size: 1.15rem;
    line-height: 1.6;
    opacity: 0.9;
    margin: 0 0 1.5rem;
}
.ukse-ct-hero__cta {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}
/* Override global a { color: orange !important } and
   .home-button--outline { color: #000032 !important } for dark hero bg */
.ukse-ct-hero__cta .home-button--outline,
.ukse-ct-hero__cta .home-button--outline:link,
.ukse-ct-hero__cta .home-button--outline:visited {
    border-color: rgba(255,255,255,0.5);
    color: #b8d4f0 !important;
}
.ukse-ct-hero__cta .home-button--outline:hover,
.ukse-ct-hero__cta .home-button--outline:focus {
    border-color: #fff;
    background: rgba(255,255,255,0.1);
    color: #fff !important;
}
.ukse-ct-hero__media {
    flex: 0 0 40%;
    max-width: 40%;
}
.ukse-ct-hero__media img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: cover;
}

/* Stats Bar — card grid matching home-info-bar pattern */
.ukse-ct-stats-bar {
    background: linear-gradient(180deg, #F5F7FB 0%, #FFFFFF 70%);
    padding: 20px 0 12px;
    margin-bottom: 0;
}
.ukse-ct-stats-bar__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}
.ukse-ct-stats-bar__card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    text-align: left;
    background: #fff;
    border: 1px solid rgba(9, 26, 63, 0.08);
    border-radius: 16px;
    padding: 14px 16px;
    box-shadow: 0 10px 24px rgba(9, 26, 63, 0.06);
}
.ukse-ct-stats-bar__icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    color: #E6007E;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ukse-ct-stats-bar__icon i {
    font-size: 28px;
    line-height: 1;
    color: inherit;
}
.ukse-ct-stats-bar__text {
    flex: 1;
    min-width: 0;
}
.ukse-ct-stats-bar__value {
    margin: 0 0 2px;
    font-size: 1.2rem;
    font-weight: 700;
    color: #000032;
}
.ukse-ct-stats-bar__label {
    margin: 0;
    font-size: 0.85rem;
    line-height: 1.35;
    color: #49536a;
}

/* About Section */
.ukse-ct-about {
    padding: 3rem 0;
}
.ukse-ct-about__body {
    max-width: 800px;
    margin: 0 auto;
    font-size: 1.1rem;
    line-height: 1.7;
    color: #13315c;
}
.ukse-ct-about__body ul,
.ukse-ct-about__body ol {
    padding-left: 1.5rem;
}

/* Featured Courses — full-width stacked like school microsite */
.ukse-ct-courses {
    padding: 3rem 0;
    background: #f8fafc;
}
.ukse-ct-courses h2 {
    text-align: center;
    margin-bottom: 1.5rem;
    color: #13315c;
}
.ukse-ct-courses__cta {
    text-align: center;
    margin-top: 1.5rem;
}

/* Schools Grid */
.ukse-ct-schools {
    padding: 3rem 0;
}
.ukse-ct-schools h2 {
    text-align: center;
    margin-bottom: 1.5rem;
    color: #13315c;
}

/* Cities */
.ukse-ct-cities {
    padding: 3rem 0;
    background: #f8fafc;
}
.ukse-ct-cities h2 {
    text-align: center;
    margin-bottom: 1.5rem;
    color: #13315c;
}
.ukse-ct-cities__pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
}
.ukse-ct-cities__pill,
.ukse-ct-cities__pill:link,
.ukse-ct-cities__pill:visited {
    display: inline-block;
    padding: 0.4rem 1rem;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #e2e8f0;
    color: #13315c !important;
    font-size: 0.9rem;
    text-decoration: none !important;
    transition: all 0.15s ease;
}
.ukse-ct-cities__pill:hover,
.ukse-ct-cities__pill:focus {
    background: #13315c;
    color: #fff !important;
    border-color: #13315c;
}

/* FAQ — reuses .home-faq styles */
.ukse-ct-faq {
    padding: 3rem 0;
}

/* Bottom CTA — reuses .for-schools-cta__card pattern */
.ukse-ct-cta {
    padding: 3rem 0;
}
.ukse-ct-cta__buttons {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    margin-top: 1.25rem;
    flex-wrap: wrap;
}
/* Light blue outline text on dark CTA bg — override global a !important */
.ukse-ct-cta .home-button--outline,
.ukse-ct-cta .home-button--outline:link,
.ukse-ct-cta .home-button--outline:visited {
    color: #b8d4f0 !important;
    border-color: rgba(255,255,255,0.4);
}
.ukse-ct-cta .home-button--outline:hover,
.ukse-ct-cta .home-button--outline:focus {
    color: #fff !important;
    border-color: #fff;
    background: rgba(255,255,255,0.1);
}

/* Browse by Course Type cards (on /courses/ Finder page) */
.ukse-ct-browse {
    padding: 3rem 0;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
}
.ukse-ct-browse h2 {
    text-align: center;
    margin-bottom: 1.5rem;
    color: #13315c;
}
.ukse-ct-browse__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
}
a.ukse-ct-browse__card,
a.ukse-ct-browse__card:link,
a.ukse-ct-browse__card:visited {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    text-decoration: none !important;
    color: inherit !important;
    transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
a.ukse-ct-browse__card:hover,
a.ukse-ct-browse__card:focus {
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    border-color: #e87722;
    transform: translateY(-2px);
    color: inherit !important;
    text-decoration: none !important;
}
.ukse-ct-browse__card-img {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}
.ukse-ct-browse__card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}
a.ukse-ct-browse__card:hover .ukse-ct-browse__card-img img {
    transform: scale(1.05);
}
.ukse-ct-browse__card-body {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.ukse-ct-browse__card-body h3 {
    margin: 0 0 0.4rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: #13315c !important;
}
.ukse-ct-browse__card-meta {
    font-size: 0.82rem;
    color: #718096 !important;
    margin: 0 0 0.6rem;
}
.ukse-ct-browse__card-desc {
    font-size: 0.88rem;
    color: #4a5568 !important;
    line-height: 1.5;
    margin: 0 0 1rem;
    flex: 1;
}
.ukse-ct-browse__card-cta {
    font-weight: 600;
    color: #e87722 !important;
    font-size: 0.9rem;
    display: inline-block;
    transition: color 0.15s ease;
}
a.ukse-ct-browse__card:hover .ukse-ct-browse__card-cta {
    color: #d06518 !important;
}

/* Responsive */
@media (max-width: 1024px) {
    .ukse-ct-stats-bar__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .ukse-ct-browse__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
    .ukse-ct-hero__inner {
        flex-direction: column;
        text-align: center;
    }
    .ukse-ct-hero__media {
        flex: 0 0 auto;
        max-width: 80%;
    }
    .ukse-ct-hero__cta {
        justify-content: center;
    }
    .ukse-ct-hero__title {
        font-size: 1.8rem;
    }
    .ukse-ct-stats-bar__grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .ukse-ct-browse__grid {
        grid-template-columns: 1fr;
    }
}

/* ============================================================================
   UKSE Video Grid — School microsite video tab (§100)
   ============================================================================ */
/* Adaptive layout: 1 video = full width, 2 = side by side, 3+ = grid */
.ukse-video-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.25rem;
    margin-top: 1rem;
}

.ukse-video-grid--single {
    grid-template-columns: 1fr;
    max-width: 800px;
}

.ukse-video-grid--pair {
    grid-template-columns: repeat(2, 1fr);
}

.ukse-video-card {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    background: #1a1a2e;
}

.ukse-video-card__facade {
    position: relative;
    aspect-ratio: 16 / 9;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ukse-video-card__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: transform 0.2s ease, opacity 0.2s ease;
    opacity: 0.85;
    z-index: 1;
}

.ukse-video-card__play:hover {
    transform: translate(-50%, -50%) scale(1.12);
    opacity: 1;
}

.ukse-video-card__play-icon {
    display: block;
    width: 68px;
    height: 48px;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.3));
}

.ukse-video-card__provider-label {
    position: absolute;
    bottom: 10px;
    left: 10px;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    font-size: 0.75rem;
    padding: 2px 8px;
    border-radius: 3px;
    pointer-events: none;
}

.ukse-video-card__iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    border: none;
    display: block;
}

@media (max-width: 640px) {
    .ukse-video-grid,
    .ukse-video-grid--pair {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   Home page: off-white finder section background
   Makes white course cards pop against the surface.
   ========================================================================== */

.home-course-finder,
.ukse-finder-lab-embed {
    background-color: #f3f6fa;
    padding-bottom: 48px !important;
    margin-bottom: 0 !important;
    box-shadow: 0 6px 20px rgba(0, 0, 40, 0.08) !important;
}

.ukse-finder-lab-embed #course-finder-wrapper,
.ukse-finder-lab-embed .course-finder-shortcode,
.ukse-finder-lab-embed .course-finder-main,
.ukse-finder-lab-embed .course-results-section,
.ukse-finder-lab-embed .results-grid,
.home-course-finder #course-finder-wrapper,
.home-course-finder .course-finder-shortcode,
.home-course-finder .course-finder-main,
.home-course-finder .course-results-section,
.home-course-finder .results-grid {
    background-color: transparent;
}

.ukse-finder-lab-embed .finder-lab-school-filter-bar {
    background-color: #fff;
}

.ukse-finder-lab-embed .finder-lab-hero-filters {
    background: #fdf2f8;
    border-color: #f0c6e0;
}

@media (max-width: 768px) {
    .ukse-finder-lab-embed .finder-lab-hero-filters,
    .ukse-finder-lab-embed .finder-lab-hero-filters__header {
        background: #fdf2f8;
    }
}