/* ============================================================
   CSCS / CITB Booking — Complete Stylesheet v2
   Mobile-first · Glassmorphism · Fully Responsive
   ============================================================ */

/* ═══════════════════════════════════════════════════
   CSS CUSTOM PROPERTIES
   ═══════════════════════════════════════════════════ */
:root {
    --brand-primary:   #1B4F8A;
    --brand-secondary: #F5A623;
    --brand-accent:    #E8380D;
    --brand-dark:      #0D1B2E;
    --brand-light:     #EEF4FF;

    --gray-50:  #F8FAFC;
    --gray-100: #F1F5F9;
    --gray-200: #E2E8F0;
    --gray-300: #CBD5E1;
    --gray-400: #94A3B8;
    --gray-500: #64748B;
    --gray-600: #475569;
    --gray-700: #334155;
    --gray-800: #1E293B;
    --gray-900: #0F172A;

    --success: #16A34A;
    --warning: #D97706;
    --error:   #DC2626;
    --info:    #2563EB;

    /* card accent colours */
    --col-green:  #16A34A;
    --col-blue:   #2563EB;
    --col-gold:   #B45309;
    --col-black:  #1E293B;
    --col-silver: #64748B;
    --col-red:    #DC2626;

    --font-display: 'Fraunces', Georgia, serif;
    --font-body:    'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

    --sp-1:  0.25rem;  --sp-2:  0.5rem;  --sp-3:  0.75rem; --sp-4:  1rem;
    --sp-5:  1.25rem;  --sp-6:  1.5rem;  --sp-8:  2rem;    --sp-10: 2.5rem;
    --sp-12: 3rem;     --sp-16: 4rem;    --sp-20: 5rem;

    --r-sm:   0.375rem;
    --r-md:   0.75rem;
    --r-lg:   1.25rem;
    --r-xl:   2rem;
    --r-full: 9999px;

    --sh-sm:    0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.06);
    --sh-md:    0 4px 16px rgba(0,0,0,.10),0 2px 4px rgba(0,0,0,.06);
    --sh-lg:    0 10px 40px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.08);
    --sh-xl:    0 20px 60px rgba(0,0,0,.16);
    --sh-brand: 0 8px 32px rgba(27,79,138,.25);
    --sh-amber: 0 8px 32px rgba(245,166,35,.30);

    --glass-bg:  rgba(255,255,255,.78);
    --glass-br:  rgba(255,255,255,.92);
    --glass-blur:blur(18px);

    --t-fast:   150ms ease;
    --t-mid:    260ms ease;
    --t-slow:   420ms ease;

    --max-w:   1200px;
    --header-h: 72px;
}

/* ═══════════════════════════════════════════════════
   RESET & BASE
   ═══════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:var(--font-body);font-size:1rem;line-height:1.65;color:var(--gray-800);background:var(--gray-50);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand-primary);text-decoration:none}
a:hover{text-decoration:underline}
ul,ol{list-style:none}
address{font-style:normal}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);line-height:1.2;font-weight:700;color:var(--gray-900)}
button{font-family:var(--font-body)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ═══════════════════════════════════════════════════
   LAYOUT UTILITIES
   ═══════════════════════════════════════════════════ */
.container{max-width:var(--max-w);margin:0 auto;padding:0 var(--sp-5)}
.text-center{text-align:center}
.section{padding:var(--sp-20) 0}

/* ═══════════════════════════════════════════════════
   HEADER / NAV
   ═══════════════════════════════════════════════════ */
.site-header{
    position:sticky;top:0;z-index:1000;
    height:var(--header-h);
    background:var(--glass-bg);
    backdrop-filter:var(--glass-blur);
    -webkit-backdrop-filter:var(--glass-blur);
    border-bottom:1px solid var(--glass-br);
    box-shadow:var(--sh-sm);
    transition:box-shadow var(--t-mid);
}
.site-header.scrolled{box-shadow:var(--sh-md)}
.nav-container{
    max-width:var(--max-w);margin:0 auto;padding:0 var(--sp-5);
    height:100%;display:flex;align-items:center;
    justify-content:space-between;gap:var(--sp-8)
}
.nav-logo{
    display:flex;align-items:center;gap:var(--sp-2);
    font-family:var(--font-display);font-size:1.5rem;font-weight:700;
    color:var(--brand-dark);text-decoration:none;flex-shrink:0
}
.logo-icon{display:none}
.logo-image{
    height:36px;
    width:auto;
    object-fit:contain;
    border-radius:4px
}
.logo-accent{color:var(--brand-secondary)}
.nav-menu{display:flex;align-items:center;gap:var(--sp-5)}
.nav-link{
    font-weight:600;font-size:.9375rem;color:var(--gray-700);
    text-decoration:none;padding:var(--sp-2) var(--sp-1);
    border-bottom:2px solid transparent;
    transition:color var(--t-fast),border-color var(--t-fast)
}
.nav-link:hover{color:var(--brand-primary);border-color:var(--brand-primary);text-decoration:none}
.nav-link.nav-cta{
    background:var(--brand-primary);color:#fff;
    padding:var(--sp-3) var(--sp-5);border-radius:var(--r-full);
    border-bottom:none;box-shadow:var(--sh-brand);
    transition:transform var(--t-fast),box-shadow var(--t-fast),background var(--t-fast)
}
.nav-link.nav-cta:hover{background:var(--brand-dark);transform:translateY(-1px);box-shadow:0 12px 40px rgba(27,79,138,.35);color:#fff}
.nav-toggle{
    display:none;flex-direction:column;gap:5px;
    background:none;border:none;cursor:pointer;padding:var(--sp-2)
}
.nav-toggle span{
    display:block;width:26px;height:2px;
    background:var(--gray-700);border-radius:2px;
    transition:transform var(--t-mid),opacity var(--t-fast)
}

/* ═══════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════ */
.hero{
    background: linear-gradient(135deg,var(--brand-dark) 0%,var(--brand-primary) 60%,#2E6DB4 100%);
    min-height:calc(100vh - var(--header-h));
    display:flex;align-items:center;
    position:relative;overflow:hidden;padding:var(--sp-20) 0
}
.hero::before{
    content:'';position:absolute;inset:0;
    background:radial-gradient(circle at 20% 80%,rgba(245,166,35,.15) 0%,transparent 50%),
               radial-gradient(circle at 80% 20%,rgba(255,255,255,.06) 0%,transparent 40%);
    pointer-events:none
}
.hero::after{
    content:'';position:absolute;inset:0;
    background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),
                     linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
    background-size:60px 60px;pointer-events:none;
    animation:gridScroll 22s linear infinite
}
@keyframes gridScroll{to{transform:translateY(60px)}}
.hero-inner{
    position:relative;z-index:1;display:grid;
    grid-template-columns:1fr 1fr;gap:var(--sp-16);align-items:center;
    max-width:var(--max-w);margin:0 auto;padding:0 var(--sp-5)
}
.hero-badge{
    display:inline-flex;align-items:center;gap:var(--sp-2);
    background:rgba(245,166,35,.18);border:1px solid rgba(245,166,35,.40);
    color:var(--brand-secondary);font-size:.8125rem;font-weight:700;
    letter-spacing:.08em;text-transform:uppercase;
    padding:var(--sp-2) var(--sp-4);border-radius:var(--r-full);margin-bottom:var(--sp-5)
}
.hero-title{
    font-size:clamp(2rem,5vw,3.75rem);font-weight:700;color:#fff;
    line-height:1.1;margin-bottom:var(--sp-5)
}
.hero-title .highlight{color:var(--brand-secondary);font-style:italic}
.hero-subtitle{
    font-size:1.125rem;color:rgba(255,255,255,.82);
    max-width:520px;margin-bottom:var(--sp-8);line-height:1.75
}
.hero-actions{display:flex;gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-10)}
.hero-trust{display:flex;gap:var(--sp-6);flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:var(--sp-2);color:rgba(255,255,255,.75);font-size:.875rem;font-weight:500}
.trust-icon{font-size:1.125rem}

.hero-card{
    background:var(--glass-bg);backdrop-filter:var(--glass-blur);
    -webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-br);
    border-radius:var(--r-xl);padding:var(--sp-8);box-shadow:var(--sh-xl)
}
.hero-card-title{font-size:1.375rem;color:var(--gray-900);margin-bottom:var(--sp-5)}

.split-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--sp-10);
    align-items:center;
}
.split-copy{max-width:34rem}
.split-img-card{
    background:#fff;
    border-radius:var(--r-xl);
    overflow:hidden;
    box-shadow:var(--sh-xl);
    border:1px solid rgba(15,23,42,.08);
    position:relative;
}
.split-img-card::before{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(135deg, rgba(0,0,0,.3) 0%, rgba(50,50,50,.4) 100%);
    pointer-events:none;
    z-index:1;
}
.split-img-card img{display:block;width:100%;height:auto;position:relative;z-index:0;}

@media (max-width:960px){
    .hero-inner{grid-template-columns:1fr}
    .split-grid{grid-template-columns:1fr}
}
.postcode-form{display:flex;flex-direction:column;gap:var(--sp-3)}

/* ═══════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════ */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
    padding:var(--sp-3) var(--sp-6);border:2px solid transparent;border-radius:var(--r-full);
    font-family:var(--font-body);font-size:.9375rem;font-weight:700;cursor:pointer;
    text-decoration:none;transition:transform var(--t-fast),box-shadow var(--t-fast),background var(--t-fast),color var(--t-fast);
    white-space:nowrap;user-select:none;line-height:1
}
.btn:hover{text-decoration:none;transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn:disabled,.btn[disabled]{opacity:.55;cursor:not-allowed;transform:none!important}
.btn-primary{background:var(--brand-primary);color:#fff;box-shadow:var(--sh-brand)}
.btn-primary:hover{background:var(--brand-dark);box-shadow:0 12px 40px rgba(27,79,138,.35);color:#fff}
.btn-secondary{background:var(--brand-secondary);color:var(--brand-dark);box-shadow:var(--sh-amber)}
.btn-secondary:hover{background:#E8950F;color:var(--brand-dark)}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn-outline:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
.btn-ghost{background:transparent;color:var(--brand-primary);border-color:var(--brand-primary)}
.btn-ghost:hover{background:var(--brand-primary);color:#fff}
.btn-lg{padding:var(--sp-4) var(--sp-8);font-size:1.0625rem}
.btn-sm{padding:var(--sp-2) var(--sp-4);font-size:.8125rem}
.btn-full{width:100%;justify-content:center}

/* ═══════════════════════════════════════════════════
   STATS BAR
   ═══════════════════════════════════════════════════ */
.stats-bar{background:var(--brand-primary);padding:var(--sp-8) 0}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-8);text-align:center}
.stat-item{color:#fff}
.stat-number{
    font-size:clamp(1.75rem,4vw,2.75rem);font-weight:800;
    font-family:var(--font-display);color:var(--brand-secondary);
    display:block;line-height:1;margin-bottom:var(--sp-2)
}
.stat-label{font-size:.875rem;color:rgba(255,255,255,.75);font-weight:500}

/* ═══════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════ */
.section-header{text-align:center;max-width:700px;margin:0 auto var(--sp-12)}
.section-label{
    display:inline-block;font-size:.8125rem;font-weight:700;
    letter-spacing:.1em;text-transform:uppercase;
    color:var(--brand-secondary);margin-bottom:var(--sp-3)
}
.section-title{font-size:clamp(1.75rem,4vw,2.5rem);margin-bottom:var(--sp-4);color:var(--gray-900)}
.section-subtitle{font-size:1.0625rem;color:var(--gray-500);line-height:1.75}

/* ═══════════════════════════════════════════════════
   TEST TYPE CARDS (landing page)
   ═══════════════════════════════════════════════════ */
.test-types-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:var(--sp-5)
}
.test-type-card{
    background:#fff;border:1.5px solid var(--gray-200);border-radius:var(--r-lg);
    padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-3);
    position:relative;overflow:hidden;
    transition:transform var(--t-mid),box-shadow var(--t-mid),border-color var(--t-mid)
}
.test-type-card::before{
    content:'';position:absolute;top:0;left:0;right:0;height:3px;
    border-radius:var(--r-lg) var(--r-lg) 0 0
}
.test-type-card.green::before{background:var(--col-green)}
.test-type-card.blue::before{background:var(--col-blue)}
.test-type-card.gold::before{background:var(--col-gold)}
.test-type-card.red::before{background:var(--col-red)}
.test-type-card.black::before{background:var(--col-black)}
.test-type-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);border-color:transparent}
.test-tag{
    display:inline-block;font-size:.6875rem;font-weight:700;
    letter-spacing:.07em;text-transform:uppercase;
    padding:.2rem .55rem;border-radius:var(--r-full);
    position:absolute;top:.875rem;right:.875rem
}
.test-tag.green{background:#DCFCE7;color:#166534}
.test-tag.blue{background:#DBEAFE;color:#1E40AF}
.test-tag.gold{background:#FEF9C3;color:#854D0E}
.test-tag.red{background:#FEE2E2;color:#991B1B}
.test-tag.black{background:#F1F5F9;color:#475569}
.test-icon{font-size:2.25rem;display:block}
.test-name{font-size:1.0625rem;font-weight:700;color:var(--gray-900)}
.test-desc{font-size:.9rem;color:var(--gray-500);line-height:1.6;flex:1}

/* ═══════════════════════════════════════════════════
   CSCS CARD GRID (landing page) — NO PRICES
   ═══════════════════════════════════════════════════ */
.cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:var(--sp-5)
}
.card-type-item{
    background:#fff;border:1.5px solid var(--gray-200);border-radius:var(--r-lg);
    padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-3);
    position:relative;overflow:hidden;
    transition:transform var(--t-mid),box-shadow var(--t-mid),border-color var(--t-mid)
}
.card-type-item::before{
    content:'';position:absolute;top:0;left:0;right:0;height:4px;
    border-radius:var(--r-lg) var(--r-lg) 0 0
}
.card-type-item.green::before{background:var(--col-green)}
.card-type-item.blue::before{background:var(--col-blue)}
.card-type-item.gold::before{background:var(--col-gold)}
.card-type-item.black::before{background:var(--col-black)}
.card-type-item.white::before{background:var(--col-silver)}
.card-type-item.red::before{background:var(--col-red)}
.card-type-item:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);border-color:transparent}
.card-chip{
    display:inline-flex;align-items:center;gap:var(--sp-2);
    padding:.2rem .625rem;border-radius:var(--r-full);
    font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
    width:fit-content
}
.card-chip.green{background:var(--col-green);color:#fff}
.card-chip.blue{background:var(--col-blue);color:#fff}
.card-chip.gold{background:var(--col-gold);color:#fff}
.card-chip.black{background:var(--col-black);color:#fff}
.card-chip.silver{background:var(--col-silver);color:#fff}
.card-chip.red{background:var(--col-red);color:#fff}
.card-subtitle{font-size:.8125rem;font-weight:700;color:var(--brand-primary);margin-top:-.25rem}
.card-type-desc{font-size:.9rem;color:var(--gray-500);line-height:1.6;flex:1}

/* ═══════════════════════════════════════════════════
   HOW IT WORKS
   ═══════════════════════════════════════════════════ */
.steps-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
    gap:var(--sp-5)
}
.step-card{
    background:#fff;border:1px solid var(--gray-200);border-radius:var(--r-lg);
    padding:var(--sp-8) var(--sp-5);text-align:center;
    transition:transform var(--t-mid),box-shadow var(--t-mid);box-shadow:var(--sh-sm)
}
.step-card:hover{transform:translateY(-4px);box-shadow:var(--sh-md)}
.step-icon{font-size:2.5rem;display:block;margin-bottom:var(--sp-4)}
.step-number{
    width:44px;height:44px;border-radius:50%;background:var(--brand-primary);
    color:#fff;font-weight:800;font-size:1.125rem;font-family:var(--font-display);
    display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-4)
}
.step-title{font-size:1.0625rem;margin-bottom:var(--sp-3)}
.step-desc{font-size:.9rem;color:var(--gray-500);line-height:1.65}

/* ═══════════════════════════════════════════════════
   CITY GRID
   ═══════════════════════════════════════════════════ */
.city-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
    gap:var(--sp-4)
}
.city-card{
    background:#fff;border:1.5px solid var(--gray-200);border-radius:var(--r-lg);
    padding:var(--sp-5);text-align:center;text-decoration:none;
    display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);
    transition:transform var(--t-mid),box-shadow var(--t-mid),border-color var(--t-mid)
}
.city-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:var(--brand-primary);text-decoration:none}
.city-icon{font-size:2rem}
.city-card strong{font-size:1rem;color:var(--gray-900)}
.city-card span{font-size:.8125rem;color:var(--gray-400)}

/* ═══════════════════════════════════════════════════
   FAQ
   ═══════════════════════════════════════════════════ */
.faq-list{max-width:760px;margin:0 auto}
.faq-item{
    border:1px solid var(--gray-200);border-radius:var(--r-md);
    margin-bottom:var(--sp-3);overflow:hidden;
    transition:box-shadow var(--t-mid)
}
.faq-item:hover{box-shadow:var(--sh-sm)}
.faq-question{
    width:100%;background:#fff;border:none;
    padding:var(--sp-5) var(--sp-6);
    display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);
    cursor:pointer;font-family:var(--font-body);font-size:1rem;font-weight:700;
    color:var(--gray-800);text-align:left;transition:background var(--t-fast)
}
.faq-question:hover{background:var(--gray-50)}
.faq-icon{
    width:28px;height:28px;border-radius:50%;
    background:var(--brand-light);color:var(--brand-primary);
    display:flex;align-items:center;justify-content:center;
    font-size:1.25rem;flex-shrink:0;
    transition:transform var(--t-mid),background var(--t-mid)
}
.faq-item.open .faq-icon{transform:rotate(45deg);background:var(--brand-primary);color:#fff}
.faq-answer{
    max-height:0;overflow:hidden;
    transition:max-height var(--t-slow);background:var(--gray-50)
}
.faq-answer p{padding:0 var(--sp-6) var(--sp-5);color:var(--gray-600);line-height:1.75}
.faq-item.open .faq-answer{max-height:400px}

/* ═══════════════════════════════════════════════════
   CTA BANNER
   ═══════════════════════════════════════════════════ */
.cta-banner{
    background:linear-gradient(135deg,var(--brand-dark) 0%,var(--brand-primary) 100%);
    padding:var(--sp-20) 0
}
.cta-title{font-size:clamp(1.75rem,4vw,2.75rem);color:#fff;margin-bottom:var(--sp-4)}
.cta-sub{font-size:1.125rem;color:rgba(255,255,255,.8);max-width:560px;margin:0 auto var(--sp-8);line-height:1.7}
.cta-actions{display:flex;gap:var(--sp-4);justify-content:center;flex-wrap:wrap}

/* ═══════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════ */
.site-footer{position:relative;background:#111827;color:rgba(255,255,255,.9);padding:var(--sp-20) 0 var(--sp-8);overflow:hidden}
.site-footer::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 12% 20%,rgba(245,166,35,.12) 0%,transparent 28%),radial-gradient(circle at 88% 12%,rgba(59,130,246,.1) 0%,transparent 24%);pointer-events:none}
.footer-inner{position:relative;z-index:1;max-width:var(--max-w);margin:0 auto;padding:0 var(--sp-5)}
/* Task 2: Social section removed — grid updated from 4→3 columns */
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--sp-10);margin-bottom:var(--sp-12);align-items:start}
.footer-brand{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:1.25rem;padding:var(--sp-8);box-shadow:0 18px 60px rgba(0,0,0,.22)}
.footer-logo{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-3);font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:#fff;text-decoration:none;margin-bottom:var(--sp-4)}
.footer-logo .logo-icon{font-size:1.6rem}
.footer-brand p{font-size:.95rem;line-height:1.75;color:rgba(255,255,255,.76);max-width:38rem;margin-bottom:var(--sp-5)}
.footer-visual{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;margin-bottom:var(--sp-5)}
.footer-visual img{width:100%;height:128px;object-fit:cover;border-radius:1rem;border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 40px rgba(0,0,0,.2)}
.footer-badges{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-bottom:var(--sp-5)}
.badge{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:999px;padding:.75rem 1rem;font-size:.8125rem;font-weight:700;color:#fff;backdrop-filter:blur(12px)}
.footer-contact{display:flex;flex-direction:column;gap:.65rem;font-size:.95rem;color:rgba(255,255,255,.72);margin-top:var(--sp-4)}
.footer-contact a{color:#fff;text-decoration:none;transition:color var(--t-fast);word-break:break-word;overflow-wrap:anywhere}
.footer-contact a:hover{color:var(--brand-primary)}
.footer-contact span{color:rgba(255,255,255,.55)}
.footer-gallery{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:1.25rem;padding:var(--sp-8);box-shadow:0 18px 60px rgba(0,0,0,.14)}
.footer-gallery h3{font-size:.875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin-bottom:var(--sp-5)}

.footer-gallery-grid img{width:100%;height:140px;object-fit:cover;border-radius:1rem;border:1px solid rgba(255,255,255,.12);box-shadow:0 14px 36px rgba(0,0,0,.18)}
.footer-links{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:1.25rem;padding:var(--sp-8);box-shadow:0 18px 60px rgba(0,0,0,.12)}
.footer-links h3{font-size:.875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin-bottom:var(--sp-5)}
.footer-links ul{list-style:none;margin:0;padding:0;display:grid;gap:.85rem}
.footer-links a{color:rgba(255,255,255,.75);font-size:.95rem;text-decoration:none;transition:color var(--t-fast)}
.footer-links a:hover{color:#fff}
/* .footer-social removed — social links section deleted (Task 2) */
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:var(--sp-6);font-size:.8125rem;color:rgba(255,255,255,.5);display:flex;flex-direction:column;gap:.5rem;text-align:center}
.footer-wave{line-height:0;overflow:hidden;background:transparent;position:relative;z-index:1}
.footer-wave svg{display:block;width:100%;height:72px}
@media(max-width:1024px){.footer-grid{grid-template-columns:1.6fr 1fr}}
@media(max-width:860px){.footer-grid{grid-template-columns:1fr 1fr};.footer-gallery-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.footer-grid{grid-template-columns:1fr};.footer-brand .footer-visual{grid-template-columns:1fr 1fr;}.footer-links{padding:1.25rem}}
/* ═══════════════════════════════════════════════════
   PAGE HERO (interior pages)
   ═══════════════════════════════════════════════════ */
.page-hero{
    background:linear-gradient(135deg,var(--brand-dark),var(--brand-primary));
    padding:var(--sp-12) 0 var(--sp-10);text-align:center
}
.page-hero-title{font-size:clamp(1.75rem,4vw,2.5rem);color:#fff;margin-bottom:var(--sp-3)}
.page-hero-sub{font-size:1.0625rem;color:rgba(255,255,255,.78);max-width:560px;margin:0 auto}

/* ═══════════════════════════════════════════════════
   WIZARD PROGRESS
   ═══════════════════════════════════════════════════ */
.booking-wizard{max-width:860px;margin:0 auto}
.wizard-progress{
    display:flex;align-items:flex-start;justify-content:center;
    margin-bottom:var(--sp-10);overflow-x:auto;padding:var(--sp-2) 0;
    gap:0
}
.wizard-step{
    display:flex;flex-direction:column;align-items:center;
    gap:var(--sp-2);position:relative;flex:1;min-width:70px
}
.wizard-step+.wizard-step::before{
    content:'';position:absolute;top:18px;right:50%;width:100%;height:2px;
    background:var(--gray-200);z-index:0;transition:background var(--t-mid)
}
.wizard-step.completed+.wizard-step::before{background:var(--brand-primary)}
.step-dot{
    width:36px;height:36px;border-radius:50%;
    border:2px solid var(--gray-300);background:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:.875rem;font-weight:700;color:var(--gray-400);
    z-index:1;transition:all var(--t-mid)
}
.wizard-step.active .step-dot{
    border-color:var(--brand-primary);background:var(--brand-primary);color:#fff;
    box-shadow:0 0 0 4px rgba(27,79,138,.15)
}
.wizard-step.completed .step-dot{
    border-color:var(--brand-primary);background:var(--brand-primary);color:#fff
}
.step-label{font-size:.6875rem;font-weight:600;color:var(--gray-400);text-align:center;line-height:1.3}
.wizard-step.active .step-label,.wizard-step.completed .step-label{color:var(--brand-primary)}
.wizard-panel{display:none;animation:fadeSlideIn .3s ease}
.wizard-panel.active{display:block}
@keyframes fadeSlideIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* ═══════════════════════════════════════════════════
   FORM CARD
   ═══════════════════════════════════════════════════ */
.form-card{
    background:#fff;border:1px solid var(--gray-200);
    border-radius:var(--r-xl);box-shadow:var(--sh-md);overflow:visible
}
.form-card-header{
    background:var(--brand-light);border-bottom:1px solid var(--gray-200);
    padding:var(--sp-6) var(--sp-8)
}
.form-card-title{font-size:1.375rem;color:var(--gray-900);margin-bottom:.25rem}
.form-card-sub{font-size:.9375rem;color:var(--gray-500)}
.form-card .form-grid,.form-card .test-select-grid,
.form-card .lang-grid,.form-card .centres-list,
.form-card .dates-grid,.form-card .times-grid,
.form-card .booking-summary,.form-card .terms-box,
.form-card .card-payment-section,.form-card .form-actions,
.form-card .postcode-search-row{
    padding-left:var(--sp-8);padding-right:var(--sp-8)
}
.form-card .form-grid{padding-top:var(--sp-6)}
.form-card .form-actions{padding-bottom:var(--sp-6)}

/* ═══════════════════════════════════════════════════
   FORM CONTROLS
   ═══════════════════════════════════════════════════ */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5)}
.form-group{display:flex;flex-direction:column;gap:var(--sp-2)}
.form-group.full{grid-column:1/-1}
.form-label{font-size:.875rem;font-weight:600;color:var(--gray-700)}
.form-label .required{color:var(--error);margin-left:2px}
.form-control{
    padding:var(--sp-3) var(--sp-4);border:1.5px solid var(--gray-200);
    border-radius:var(--r-md);font-family:var(--font-body);font-size:.9375rem;
    color:var(--gray-900);background:#fff;
    transition:border-color var(--t-fast),box-shadow var(--t-fast);width:100%
}
.form-control:focus{outline:none;border-color:var(--brand-primary);box-shadow:0 0 0 3px rgba(27,79,138,.10)}
.form-control.is-invalid{border-color:var(--error)}
.form-control.is-valid{border-color:var(--success)}
select.form-control{
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2364748B' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 14px center;padding-right:40px
}
.form-error{font-size:.8125rem;color:var(--error);display:flex;align-items:center;gap:var(--sp-1)}
.form-hint{font-size:.8125rem;color:var(--gray-400)}
.form-actions{
    display:flex;justify-content:space-between;align-items:center;
    margin-top:var(--sp-6);gap:var(--sp-4);flex-wrap:wrap;
    padding-top:var(--sp-5);border-top:1px solid var(--gray-100)
}

/* SEARCHABLE SELECT */
.search-select{position:relative}
.search-select-trigger{
    width:100%;border:1.5px solid var(--gray-200);border-radius:var(--r-md);
    background:#fff;padding:var(--sp-3) 2.75rem var(--sp-3) var(--sp-4);
    min-height:54px;text-align:left;font-family:var(--font-body);cursor:pointer;
    position:relative;transition:border-color var(--t-fast),box-shadow var(--t-fast)
}
.search-select-trigger::after{
    content:'';position:absolute;right:14px;top:50%;width:12px;height:8px;transform:translateY(-50%);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2364748B' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-size:12px 8px
}
.search-select.open .search-select-trigger,.search-select-trigger:focus{
    outline:none;border-color:var(--brand-primary);box-shadow:0 0 0 3px rgba(27,79,138,.10)
}
.search-select-placeholder{font-size:.9375rem;color:var(--gray-500)}
.search-select-title{display:block;font-size:.9375rem;font-weight:700;color:var(--gray-900)}
.search-select-sub{display:block;font-size:.8125rem;color:var(--gray-500);margin-top:2px}
.search-select-dropdown{
    position:absolute;top:calc(100% + 10px);left:0;right:0;z-index:999;
    background:#fff;border:1px solid var(--gray-200);border-radius:var(--r-lg);
    box-shadow:var(--sh-lg);padding:var(--sp-3);display:none;max-height:min(70vh,460px);overflow:visible;
}
.search-select.open .search-select-dropdown{display:block}
.search-select-search{padding-bottom:var(--sp-2);border-bottom:1px solid var(--gray-100)}
.search-select-options{max-height:calc(min(70vh,460px) - 80px);overflow-y:auto;padding-top:var(--sp-2);display:flex;flex-direction:column;gap:var(--sp-2);-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior:contain}
.search-select-option{
    width:100%;border:1px solid var(--gray-200);border-radius:var(--r-md);background:#fff;
    padding:var(--sp-3) var(--sp-4);text-align:left;cursor:pointer;
    transition:border-color var(--t-fast),background var(--t-fast),transform var(--t-fast)
}
.search-select-option:hover,.search-select-option.selected{
    border-color:var(--brand-primary);background:var(--brand-light);transform:translateY(-1px)
}
.search-select-option-title{display:block;font-size:.9375rem;font-weight:700;color:var(--gray-900)}
.search-select-option-sub{display:block;font-size:.8125rem;color:var(--gray-500);margin-top:2px}
.search-select-empty{padding:var(--sp-3) var(--sp-2);font-size:.875rem;color:var(--gray-500)}
.search-select-meta{font-size:.8125rem;color:var(--gray-400);margin-top:var(--sp-2)}

/* ═══════════════════════════════════════════════════
   TEST OPTION CARDS (Step 2)
   ═══════════════════════════════════════════════════ */
.test-select-grid{
    display:flex;flex-direction:column;gap:var(--sp-3);
    padding-top:var(--sp-6);padding-bottom:var(--sp-4)
}
.test-option-card{
    border:2px solid var(--gray-200);border-radius:var(--r-md);
    cursor:pointer;transition:border-color var(--t-fast),background var(--t-fast),box-shadow var(--t-fast);
    outline:none
}
.test-option-card:hover{border-color:var(--brand-primary);background:var(--brand-light)}
.test-option-card.selected{border-color:var(--brand-primary);background:var(--brand-light);box-shadow:0 0 0 3px rgba(27,79,138,.12)}
.test-option-card:focus-visible{box-shadow:0 0 0 3px rgba(27,79,138,.2)}
.test-option-inner{
    display:flex;align-items:center;gap:var(--sp-4);
    padding:var(--sp-4) var(--sp-5)
}
.test-option-icon{font-size:1.625rem;flex-shrink:0;width:36px;text-align:center}
.test-option-body{flex:1;min-width:0}
.test-option-name{display:block;font-size:.9375rem;font-weight:700;color:var(--gray-900)}
.test-option-desc{display:block;font-size:.8125rem;color:var(--gray-500);margin-top:1px}
.test-option-badge{
    background:var(--brand-secondary);color:var(--brand-dark);
    font-size:.6875rem;font-weight:700;padding:.2rem .5rem;
    border-radius:var(--r-full);white-space:nowrap;flex-shrink:0
}
.test-option-check{
    width:24px;height:24px;border-radius:50%;border:2px solid var(--gray-300);
    display:flex;align-items:center;justify-content:center;
    font-size:.75rem;color:transparent;flex-shrink:0;
    transition:all var(--t-fast);background:#fff
}
.test-option-card.selected .test-option-check{
    background:var(--brand-primary);border-color:var(--brand-primary);color:#fff
}

/* ═══════════════════════════════════════════════════
   LANGUAGE GRID (Step 3)
   ═══════════════════════════════════════════════════ */
.lang-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
    gap:var(--sp-3);padding-top:var(--sp-6);padding-bottom:var(--sp-4)
}
.lang-option{
    border:2px solid var(--gray-200);border-radius:var(--r-md);
    padding:var(--sp-3) var(--sp-4);cursor:pointer;
    display:flex;align-items:center;gap:var(--sp-3);
    font-size:.9375rem;font-weight:600;color:var(--gray-700);
    transition:border-color var(--t-fast),background var(--t-fast);
    background:#fff
}
.lang-option:hover{border-color:var(--brand-primary);background:var(--brand-light)}
.lang-option.selected{border-color:var(--brand-primary);background:var(--brand-light);color:var(--brand-primary)}
.lang-option input{display:none}

/* ═══════════════════════════════════════════════════
   POSTCODE SEARCH ROW + CENTRES LIST
   ═══════════════════════════════════════════════════ */
.postcode-search-row{
    display:flex;gap:var(--sp-4);align-items:flex-end;
    flex-wrap:wrap;padding-top:var(--sp-6);padding-bottom:var(--sp-2)
}
.centres-list{display:flex;flex-direction:column;gap:var(--sp-4)}
.centres-placeholder{
    text-align:center;padding:var(--sp-10);
    border:2px dashed var(--gray-200);border-radius:var(--r-lg);
    color:var(--gray-400)
}
.centres-placeholder span{font-size:2.5rem;display:block;margin-bottom:var(--sp-3)}
.centres-placeholder p{font-size:.9375rem}
.centre-card{
    background:#fff;border:2px solid var(--gray-200);border-radius:var(--r-lg);
    padding:var(--sp-5);display:flex;align-items:center;gap:var(--sp-4);
    cursor:pointer;transition:all var(--t-mid)
}
.centre-card:hover{border-color:var(--brand-primary);box-shadow:var(--sh-md);transform:translateX(3px)}
.centre-card.selected{border-color:var(--brand-primary);background:var(--brand-light);box-shadow:0 0 0 3px rgba(27,79,138,.12)}
.centre-radio{width:20px;height:20px;accent-color:var(--brand-primary);flex-shrink:0;cursor:pointer}
.centre-info{flex:1;min-width:0}
.centre-name{font-size:1rem;font-weight:700;margin-bottom:2px;color:var(--gray-900)}
.centre-addr{font-size:.875rem;color:var(--gray-500)}
.centre-distance{
    font-size:.875rem;font-weight:700;color:var(--brand-primary);
    background:var(--brand-light);padding:var(--sp-2) var(--sp-3);
    border-radius:var(--r-full);white-space:nowrap;flex-shrink:0
}

/* ═══════════════════════════════════════════════════
   DATE GRID — Sundays disabled
   ═══════════════════════════════════════════════════ */
.slot-section-title{
    font-size:1rem;font-weight:700;color:var(--gray-700);
    margin-bottom:var(--sp-4);
    padding:0 var(--sp-8)
}
.dates-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));
    gap:var(--sp-3);padding:0 var(--sp-8) var(--sp-2)
}
.date-btn{
    padding:var(--sp-3) var(--sp-2);border:2px solid var(--gray-200);
    border-radius:var(--r-md);background:#fff;cursor:pointer;
    font-family:var(--font-body);text-align:center;
    transition:all var(--t-fast)
}
.date-btn .day{font-size:.6875rem;color:var(--gray-500);font-weight:600;text-transform:uppercase;letter-spacing:.06em;display:block}
.date-btn .date{font-size:1.375rem;font-weight:800;color:var(--gray-800);font-family:var(--font-display);display:block;line-height:1.2}
.date-btn .month{font-size:.6875rem;color:var(--gray-400);display:block}
.date-btn:hover:not(.disabled){border-color:var(--brand-primary);background:var(--brand-light);transform:translateY(-2px);box-shadow:var(--sh-sm)}
.date-btn.selected{border-color:var(--brand-primary);background:var(--brand-primary)}
.date-btn.selected .day,.date-btn.selected .date,.date-btn.selected .month{color:#fff}

/* Sunday = disabled/frozen */
.date-btn.disabled{
    opacity:.45;cursor:not-allowed;pointer-events:none;
    background:var(--gray-100);border-color:var(--gray-200)
}
.date-btn.disabled .day{color:var(--error);opacity:.7}

/* Alternative date label */
.dates-alt-label{
    padding:var(--sp-2) var(--sp-8) 0;
    font-size:.8125rem;color:var(--gray-400);font-weight:600
}

/* ═══════════════════════════════════════════════════
   TIME GRID — Morning/Afternoon/Evening only
   ═══════════════════════════════════════════════════ */
.time-options{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3);padding:0 var(--sp-8) var(--sp-4)
}
.time-option{
    border:2px solid var(--gray-200);border-radius:var(--r-lg);background:#fff;cursor:pointer;
    padding:var(--sp-4);text-align:left;transition:all var(--t-fast);display:flex;flex-direction:column;gap:.35rem;
}
.time-option:hover{border-color:var(--brand-primary);background:var(--brand-light);transform:translateY(-2px);box-shadow:var(--sh-sm)}
.time-option.selected{border-color:var(--brand-primary);background:var(--brand-primary);color:#fff}
.time-option.disabled{opacity:.6;cursor:not-allowed;background:var(--gray-100);border-color:var(--gray-200)}
.time-option-label{font-size:1rem;font-weight:700}
.time-option-meta{font-size:.8125rem;color:var(--gray-500)}

.times-grid{
    display:flex;gap:var(--sp-4);flex-wrap:wrap;
    padding:0 var(--sp-8) var(--sp-4)
}
.slot-hint{padding:0 var(--sp-8);font-size:.9rem;color:var(--gray-400)}
.time-btn{
    flex:1;min-width:140px;padding:var(--sp-5) var(--sp-4);
    border:2px solid var(--gray-200);border-radius:var(--r-lg);
    background:#fff;cursor:pointer;font-family:var(--font-body);
    text-align:center;transition:all var(--t-fast)
}
.time-btn-icon{font-size:2rem;display:block;margin-bottom:var(--sp-2)}
.time-btn-label{display:block;font-size:1.0625rem;font-weight:700;color:var(--gray-800);margin-bottom:var(--sp-1)}
.time-btn-range{display:block;font-size:.8125rem;color:var(--gray-400)}
.time-btn:hover{border-color:var(--brand-primary);background:var(--brand-light);transform:translateY(-2px);box-shadow:var(--sh-sm)}
.time-btn.selected{border-color:var(--brand-primary);background:var(--brand-primary)}
.time-btn.selected .time-btn-label,.time-btn.selected .time-btn-range{color:#fff}
.time-btn.selected .time-btn-icon{filter:grayscale(1) brightness(5)}
.time-btn.unavailable{opacity:.45;cursor:not-allowed;pointer-events:none;background:var(--gray-100)}

/* ═══════════════════════════════════════════════════
   RETAKE OPTION
   ═══════════════════════════════════════════════════ */
.retake-box{
    margin:var(--sp-6) var(--sp-8);
    background:#FFF9ED;border:2px solid var(--brand-secondary);
    border-radius:var(--r-lg);padding:var(--sp-5);
    transition:background var(--t-fast)
}
.retake-label{display:flex;align-items:flex-start;gap:var(--sp-4);cursor:pointer}
.retake-checkbox{
    width:22px;height:22px;flex-shrink:0;
    accent-color:var(--brand-secondary);margin-top:2px;cursor:pointer
}
.retake-content{flex:1}
.retake-title{
    display:flex;align-items:center;gap:var(--sp-3);
    font-size:1rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--sp-2)
}
.retake-price-badge{
    background:var(--brand-secondary);color:var(--brand-dark);
    font-size:.8125rem;font-weight:700;padding:.2rem .6rem;border-radius:var(--r-full)
}
.retake-desc{font-size:.9rem;color:var(--gray-600);line-height:1.6}

/* ═══════════════════════════════════════════════════
   BOOKING SUMMARY
   ═══════════════════════════════════════════════════ */
.booking-summary{
    background:var(--brand-light);border:1px solid var(--gray-200);
    border-radius:var(--r-lg);padding:var(--sp-5) var(--sp-6);
    margin:var(--sp-6) var(--sp-8)
}
.summary-row{
    display:flex;justify-content:space-between;align-items:flex-start;
    gap:var(--sp-4);padding:var(--sp-3) 0;border-bottom:1px solid var(--gray-200)
}
.summary-row:last-child{border-bottom:none}
.summary-label{font-size:.9375rem;color:var(--gray-500);font-weight:500;flex-shrink:0}
.summary-value{font-size:.9375rem;font-weight:700;color:var(--gray-800);text-align:right}
.summary-total .summary-label,.summary-total .summary-value{font-size:1.125rem;color:var(--gray-900);font-weight:800}
.summary-total .summary-value{color:var(--brand-primary)}

/* ═══════════════════════════════════════════════════
   TERMS & CONDITIONS
   ═══════════════════════════════════════════════════ */
.terms-box{
    margin:0 var(--sp-8) var(--sp-4);
    background:var(--gray-50);border:1.5px solid var(--gray-200);
    border-radius:var(--r-md);padding:var(--sp-4) var(--sp-5)
}
.terms-label{display:flex;align-items:flex-start;gap:var(--sp-3);cursor:pointer}
.terms-checkbox{
    width:20px;height:20px;flex-shrink:0;
    accent-color:var(--brand-primary);margin-top:2px;cursor:pointer
}
.terms-text{font-size:.9rem;color:var(--gray-600);line-height:1.65}
.terms-text a{color:var(--brand-primary);font-weight:600}
.terms-error{font-size:.8125rem;color:var(--error);margin-top:var(--sp-2);padding-left:32px}
.terms-box.error-state{border-color:var(--error);background:#FEF2F2}

/* ═══════════════════════════════════════════════════
   CARD PAYMENT SECTION
   ═══════════════════════════════════════════════════ */
.card-payment-section{
    margin:var(--sp-2) var(--sp-8) var(--sp-4);
    background:#fff;border:1.5px solid var(--gray-200);
    border-radius:var(--r-lg);padding:var(--sp-6)
}
.payment-section-title{
    font-size:1.0625rem;font-weight:700;color:var(--gray-900);
    margin-bottom:var(--sp-4);display:flex;align-items:center;gap:var(--sp-2)
}
.card-logos{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-5);flex-wrap:wrap}
.card-logo{height:28px;border-radius:4px;border:1px solid var(--gray-200)}
.card-logo-text{
    background:var(--gray-100);border:1px solid var(--gray-200);
    border-radius:4px;padding:.2rem .5rem;font-size:.75rem;font-weight:700;color:var(--gray-600)
}
.payment-form-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)
}
.card-input-wrap{position:relative}
.card-input-wrap .form-control{padding-right:2.75rem}
.card-input-wrap .card-type-icon{
    position:absolute;right:.875rem;top:50%;transform:translateY(-50%);
    font-size:1.1rem;pointer-events:none;user-select:none
}
.card-number-input{letter-spacing:.1em;font-size:1.0625rem;font-weight:600}
.cvc-help-btn{
    display:inline-flex;align-items:center;justify-content:center;
    width:18px;height:18px;border-radius:50%;border:1.5px solid var(--brand-primary);
    background:transparent;color:var(--brand-primary);
    font-size:.6875rem;font-weight:800;cursor:pointer;margin-left:var(--sp-2);
    transition:background var(--t-fast),color var(--t-fast)
}
.cvc-help-btn:hover{background:var(--brand-primary);color:#fff}
.cvc-tooltip{
    position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2000;
    background:rgba(0,0,0,.5);inset:0;display:flex;align-items:center;justify-content:center
}
.cvc-tooltip-inner{
    background:#fff;border-radius:var(--r-lg);padding:var(--sp-6);
    max-width:340px;box-shadow:var(--sh-xl)
}
.cvc-tooltip-inner strong{display:block;margin-bottom:var(--sp-3);font-size:1rem}
.cvc-tooltip-inner p{font-size:.9375rem;color:var(--gray-600);margin-bottom:var(--sp-2)}
.pay-btn{
    display:flex;margin:0 var(--sp-8) var(--sp-4);
    font-size:1.125rem;padding:var(--sp-5);border-radius:var(--r-lg)
}
.secure-payment{
    display:flex;align-items:center;justify-content:center;gap:var(--sp-3);
    color:var(--gray-400);font-size:.8125rem;font-weight:600;
    margin:0 var(--sp-8) var(--sp-4);flex-wrap:wrap;text-align:center
}

/* ═══════════════════════════════════════════════════
   TOAST NOTIFICATIONS
   ═══════════════════════════════════════════════════ */
.toast-container{
    position:fixed;top:calc(var(--header-h) + var(--sp-4));right:var(--sp-5);
    z-index:9998;display:flex;flex-direction:column;gap:var(--sp-3);max-width:380px
}
.toast{
    background:#fff;border-radius:var(--r-md);box-shadow:var(--sh-lg);
    padding:var(--sp-4) var(--sp-5);display:flex;align-items:center;gap:var(--sp-3);
    animation:slideInRight .3s ease;border-left:4px solid var(--brand-primary)
}
.toast.success{border-color:var(--success)}
.toast.error{border-color:var(--error)}
.toast.warning{border-color:var(--warning)}
@keyframes slideInRight{from{transform:translateX(110%);opacity:0}to{transform:translateX(0);opacity:1}}

/* ═══════════════════════════════════════════════════
   LOADING OVERLAY
   ═══════════════════════════════════════════════════ */
.loading-overlay{
    position:fixed;inset:0;background:rgba(255,255,255,.88);backdrop-filter:blur(4px);
    display:flex;align-items:center;justify-content:center;
    z-index:9999;opacity:0;visibility:hidden;
    transition:opacity var(--t-mid),visibility var(--t-mid)
}
.loading-overlay.visible{opacity:1;visibility:visible}
.loading-card{
    background:#fff;border-radius:var(--r-lg);padding:var(--sp-8) var(--sp-10);
    box-shadow:var(--sh-xl);display:flex;flex-direction:column;align-items:center;gap:var(--sp-4)
}
.spinner{
    width:48px;height:48px;border:4px solid var(--gray-200);
    border-top-color:var(--brand-primary);border-radius:50%;
    animation:spin .75s linear infinite
}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-text{font-weight:600;color:var(--gray-600);animation:pulse 1.5s ease infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}

/* ═══════════════════════════════════════════════════
   ALERTS
   ═══════════════════════════════════════════════════ */
.alert{
    padding:var(--sp-4) var(--sp-5);border-radius:var(--r-md);
    display:flex;align-items:flex-start;gap:var(--sp-3);
    margin-bottom:var(--sp-4);font-size:.9375rem;
    animation:slideDown .3s ease
}
@keyframes slideDown{from{transform:translateY(-8px);opacity:0}to{transform:translateY(0);opacity:1}}
.alert-success{background:#DCFCE7;border:1px solid #86EFAC;color:#166534}
.alert-error{background:#FEE2E2;border:1px solid #FCA5A5;color:#991B1B}
.alert-warning{background:#FEF9C3;border:1px solid #FDE047;color:#854D0E}
.alert-info{background:#DBEAFE;border:1px solid #93C5FD;color:#1E40AF}

/* ═══════════════════════════════════════════════════
   SKELETON
   ═══════════════════════════════════════════════════ */
.skeleton{
    background:linear-gradient(90deg,var(--gray-200) 25%,var(--gray-100) 50%,var(--gray-200) 75%);
    background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--r-sm)
}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ═══════════════════════════════════════════════════
   CONFIRMATION PAGE
   ═══════════════════════════════════════════════════ */
.confirmation-box{
    text-align:center;padding:var(--sp-10) var(--sp-8);background:#fff;
    border-radius:var(--r-xl);box-shadow:var(--sh-lg);max-width:600px;margin:0 auto
}
.confirm-icon{
    width:80px;height:80px;border-radius:50%;background:#DCFCE7;
    display:flex;align-items:center;justify-content:center;font-size:2.5rem;
    margin:0 auto var(--sp-6);animation:bounceIn .5s ease
}
@keyframes bounceIn{0%{transform:scale(0);opacity:0}60%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}
.booking-ref{
    background:var(--brand-light);border:2px dashed var(--brand-primary);
    border-radius:var(--r-md);padding:var(--sp-4);
    font-size:1.5rem;font-weight:800;font-family:var(--font-display);
    color:var(--brand-primary);letter-spacing:.08em;margin:var(--sp-5) 0
}

/* ═══════════════════════════════════════════════════
   CSCS CARD APPLICATION PAGE
   ═══════════════════════════════════════════════════ */
.card-app-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5);margin-bottom:var(--sp-6)}
.app-type-card{
    border:2px solid var(--gray-200);border-radius:var(--r-lg);
    padding:var(--sp-6);cursor:pointer;text-align:center;
    transition:all var(--t-mid);background:#fff
}
.app-type-card:hover{border-color:var(--brand-primary);background:var(--brand-light)}
.app-type-card.selected{border-color:var(--brand-primary);background:var(--brand-light);box-shadow:0 0 0 3px rgba(27,79,138,.12)}
.app-type-icon{font-size:2.5rem;display:block;margin-bottom:var(--sp-3)}
.app-type-title{font-size:1.125rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--sp-2)}
.app-type-desc{font-size:.875rem;color:var(--gray-500);line-height:1.6}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — TABLET (≤1024px)
   ═══════════════════════════════════════════════════ */
@media(max-width:1024px){
    .hero-inner{grid-template-columns:1fr;text-align:center}
    .hero{padding:var(--sp-16) 0;min-height:unset}
    .hero-card{max-width:540px;margin:0 auto}
    .hero-subtitle{max-width:100%}
    .hero-actions,.hero-trust{justify-content:center}
    .footer-grid{grid-template-columns:1fr 1fr;gap:var(--sp-8)}
    .payment-form-grid{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — MOBILE (≤768px)
   ═══════════════════════════════════════════════════ */
@media(max-width:768px){
    :root{--header-h:60px}
    .nav-toggle{display:flex}
    .nav-menu{
        position:fixed;top:var(--header-h);left:0;right:0;
        background:#fff;flex-direction:column;
        padding:var(--sp-5) var(--sp-5) var(--sp-6);gap:var(--sp-1);
        box-shadow:var(--sh-lg);
        transform:translateY(-110%);opacity:0;
        transition:transform var(--t-mid),opacity var(--t-mid);
        z-index:999;align-items:flex-start
    }
    .nav-menu.open{transform:translateY(0);opacity:1}
    .nav-link{width:100%;padding:var(--sp-3) var(--sp-2);border-bottom:0;border-radius:var(--r-sm)}
    .nav-link.nav-cta{margin-top:var(--sp-3);width:auto;align-self:flex-start}
    .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
    .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
    .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

    .section{padding:var(--sp-12) 0}
    .form-grid{grid-template-columns:1fr}
    .form-card-header{padding:var(--sp-4) var(--sp-5)}
    .form-card .form-grid,.form-card .test-select-grid,
    .form-card .lang-grid,.form-card .centres-list,
    .form-card .dates-grid,.form-card .times-grid,
    .form-card .booking-summary,.form-card .terms-box,
    .form-card .card-payment-section,.form-card .form-actions,
    .form-card .postcode-search-row,
    .slot-section-title,.dates-alt-label,.slot-hint{
        padding-left:var(--sp-4);padding-right:var(--sp-4)
    }
    .booking-summary{margin:var(--sp-4) var(--sp-4)}
    .retake-box{margin:var(--sp-4)}
    .retake-mandatory-box{margin:var(--sp-4) var(--sp-4)}
    .terms-box{margin:0 var(--sp-4) var(--sp-4)}
    .card-payment-section{margin:var(--sp-2) var(--sp-4)}
    .pay-btn{margin:var(--sp-4) var(--sp-4) !important; width: calc(100% - 2rem) !important;}
    .secure-payment{margin:0 var(--sp-4) var(--sp-4)}
    .crosssell-banner{margin:var(--sp-4) var(--sp-4)}
    .fee-display-box{margin:var(--sp-2) var(--sp-4) var(--sp-4)}
    .app-type-selected-display{margin:var(--sp-4) var(--sp-4) 0}
    .app-type-select-wrap{padding:var(--sp-4) var(--sp-4) 0}
    .centre-search-block{padding:var(--sp-4) var(--sp-4) var(--sp-2)}
    form#cardFlowDetailsForm{padding:0 var(--sp-4) !important}
    .form-card .dates-grid{padding:0 var(--sp-4) var(--sp-2) !important}
    .form-card .times-grid{padding:0 var(--sp-4) var(--sp-4) !important}
    .form-card .time-options{padding:0 var(--sp-4) var(--sp-4) !important}
    .date-section-heading{padding:var(--sp-4) var(--sp-4) var(--sp-3) !important}
    .date-section-hint{padding:0 var(--sp-4) !important}
    .slot-section-title{padding:0 var(--sp-4) !important}
    .dates-alt-label{padding:var(--sp-2) var(--sp-4) 0 !important}
    .slot-hint{padding:0 var(--sp-4) !important}
    .form-actions{flex-direction:column-reverse}
    .form-actions .btn{width:100%;justify-content:center}
    .postcode-search-row{flex-direction:column}
    .postcode-search-row .btn{width:100%;justify-content:center}

    .times-grid{flex-direction:column}
    .time-btn{min-width:unset}
    .wizard-progress{gap:0;padding:0 var(--sp-2)}
    .step-label{display:none}
    .dates-grid{grid-template-columns:repeat(4,1fr)}
    .footer-grid{grid-template-columns:1fr;gap:var(--sp-8)}
    .stats-grid{grid-template-columns:repeat(2,1fr);gap:var(--sp-6)}
    .toast-container{left:var(--sp-3);right:var(--sp-3);max-width:none}
    .centre-card{flex-wrap:wrap}
    .cta-actions{flex-direction:column;align-items:stretch}
    .cta-actions .btn{justify-content:center}
    .steps-grid{grid-template-columns:repeat(2,1fr)}
    .test-types-grid{grid-template-columns:1fr}
    .cards-grid{grid-template-columns:1fr}
    .city-grid{grid-template-columns:repeat(2,1fr)}
    .lang-grid{grid-template-columns:repeat(2,1fr)}
    .card-app-grid{grid-template-columns:1fr}
    .payment-form-grid{grid-template-columns:1fr}
    .cvc-tooltip{padding:var(--sp-4)}
    .footer-brand, .footer-gallery, .footer-links {
        padding: var(--sp-5) !important;
    }
    .cscs-info-banner {
        padding: var(--sp-5) var(--sp-4) !important;
    }
    .cscs-info-banner > div:last-child {
        min-width: unset !important;
        width: 100% !important;
    }
    .gc-pricing-card {
        padding: var(--sp-5) var(--sp-4) !important;
    }
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — SMALL MOBILE (≤480px)
   ═══════════════════════════════════════════════════ */
@media(max-width:480px){
    .hero-actions{flex-direction:column;align-items:stretch}
    .hero-actions .btn{justify-content:center}
    .dates-grid{grid-template-columns:repeat(3,1fr)}
    .steps-grid{grid-template-columns:1fr}
    .city-grid{grid-template-columns:1fr}
    .lang-grid{grid-template-columns:1fr}
    .confirmation-box{padding:var(--sp-6) var(--sp-4)}
    .booking-ref{font-size:1.125rem;letter-spacing:.04em}
    .btn {
        white-space: normal !important;
        text-align: center;
        padding-left: var(--sp-3) !important;
        padding-right: var(--sp-3) !important;
        line-height: 1.3 !important;
    }
    .badge {
        padding: 0.5rem 0.75rem !important;
        font-size: 0.75rem !important;
    }
    .summary-row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.25rem !important;
    }
    .summary-value {
        text-align: left !important;
        width: 100% !important;
    }
    .gc-price-panel {
        min-width: unset !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ═══════════════════════════════════════════════════
   PRINT
   ═══════════════════════════════════════════════════ */
@media print{
    .site-header,.site-footer,.btn,.wizard-progress,.toast-container,.loading-overlay{display:none!important}
    body{font-size:12pt}
    .confirmation-box{box-shadow:none;border:1px solid #000}
}

/* ═══════════════════════════════════════════════════
   BOOKING TYPE SELECTION (booking.php)
   ═══════════════════════════════════════════════════ */
.booking-type-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)
}
.booking-type-card{
    background:#fff;border:2px solid var(--gray-200);border-radius:var(--r-xl);
    cursor:pointer;overflow:hidden;
    transition:transform var(--t-mid),box-shadow var(--t-mid),border-color var(--t-mid);
    position:relative
}
.booking-type-card::before{
    content:'';position:absolute;top:0;left:0;right:0;height:4px
}
#typeIndividual::before{background:var(--brand-primary)}
#typeGroup::before{background:var(--brand-secondary)}
.booking-type-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);border-color:var(--brand-primary)}
.booking-type-card.selected#typeIndividual{border-color:var(--brand-primary);box-shadow:0 0 0 3px rgba(27,79,138,.15)}
.booking-type-card.selected#typeGroup{border-color:var(--brand-secondary);box-shadow:0 0 0 3px rgba(245,166,35,.25)}
.booking-type-inner{padding:var(--sp-8)}
.booking-type-icon{font-size:3rem;margin-bottom:var(--sp-4)}
.booking-type-title{font-size:1.5rem;font-weight:800;color:var(--gray-900);margin-bottom:var(--sp-3)}
.booking-type-desc{font-size:.9375rem;color:var(--gray-500);line-height:1.7;margin-bottom:var(--sp-5)}
.booking-type-perks{display:flex;flex-direction:column;gap:var(--sp-2);margin-bottom:var(--sp-6)}
.booking-type-perks li{font-size:.9rem;color:var(--gray-600);font-weight:500}
.booking-type-action{padding-top:var(--sp-4);border-top:1px solid var(--gray-100)}

/* ═══════════════════════════════════════════════════
   GROUP BOOKING PAGE
   ═══════════════════════════════════════════════════ */
.group-booking-layout{
    display:grid;grid-template-columns:1.1fr 0.9fr;gap:var(--sp-10);align-items:start
}
.group-why-card{
    background:#fff;border:1px solid var(--gray-200);border-radius:var(--r-xl);overflow:hidden
}
.group-why-header{
    background:linear-gradient(135deg,var(--brand-dark),var(--brand-primary));
    padding:var(--sp-8)
}
.group-why-header h2{font-size:1.375rem;color:#fff;margin-bottom:var(--sp-3)}
.group-why-header p{font-size:.9375rem;color:rgba(255,255,255,.78);line-height:1.7}
.group-benefits-list{display:flex;flex-direction:column;gap:0;padding:var(--sp-5)}
.group-benefit-item{
    display:flex;gap:var(--sp-4);align-items:flex-start;
    padding:var(--sp-5) 0;border-bottom:1px solid var(--gray-100)
}
.group-benefit-item:last-child{border-bottom:none}
.group-benefit-icon{font-size:1.625rem;flex-shrink:0;width:40px;text-align:center;margin-top:.1rem}
.group-benefit-item strong{display:block;font-size:1rem;color:var(--gray-900);margin-bottom:.3rem}
.group-benefit-item p{font-size:.875rem;color:var(--gray-500);line-height:1.65;margin:0}
.group-trust-box{
    display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
    background:var(--gray-200);border-radius:var(--r-lg);overflow:hidden;
    margin-top:var(--sp-5)
}
.group-trust-stat{
    background:#fff;padding:var(--sp-5);text-align:center
}
.group-trust-number{
    display:block;font-size:1.625rem;font-weight:800;
    font-family:var(--font-display);color:var(--brand-primary);margin-bottom:.2rem
}
.group-trust-label{font-size:.8125rem;color:var(--gray-500);font-weight:500}
.group-contact-alt{
    margin-top:var(--sp-5);background:var(--gray-50);
    border:1px solid var(--gray-200);border-radius:var(--r-lg);padding:var(--sp-6)
}
.group-contact-alt p{font-size:.9375rem;color:var(--gray-600);margin-bottom:var(--sp-4);font-weight:500}
.btn-outline-dark{
    background:transparent;color:var(--gray-800);border:2px solid var(--gray-300);
    border-radius:var(--r-full);font-weight:700;
    transition:all var(--t-fast)
}
.btn-outline-dark:hover{background:var(--gray-800);color:#fff;border-color:var(--gray-800)}

/* ═══════════════════════════════════════════════════
   ENQUIRY PAGE
   ═══════════════════════════════════════════════════ */
.enquiry-layout{
    display:grid;grid-template-columns:1.3fr 0.7fr;gap:var(--sp-8);align-items:start
}
.enquiry-info-card{
    background:#fff;border:1px solid var(--gray-200);border-radius:var(--r-lg);padding:var(--sp-6)
}
.enquiry-info-card h3{font-size:1.0625rem;color:var(--gray-900);margin-bottom:var(--sp-3)}
.enquiry-info-card p{font-size:.9rem;color:var(--gray-500);line-height:1.65}
.enquiry-quick-link{
    display:flex;align-items:center;gap:var(--sp-2);
    font-size:.9375rem;font-weight:600;color:var(--brand-primary);
    padding:var(--sp-2) 0;transition:color var(--t-fast)
}
.enquiry-quick-link:hover{color:var(--brand-dark);text-decoration:none}
.enquiry-process-card{
    background:var(--brand-light);border:1px solid var(--gray-200);border-radius:var(--r-lg);padding:var(--sp-6)
}
.enquiry-process-card h3{font-size:1.0625rem;color:var(--gray-900);margin-bottom:var(--sp-4)}
.enquiry-steps{
    display:flex;flex-direction:column;gap:var(--sp-3);list-style:none
}
.enquiry-steps li{
    display:flex;align-items:center;gap:var(--sp-3);
    font-size:.9375rem;color:var(--gray-700);font-weight:500
}
.enquiry-steps li span{
    width:28px;height:28px;border-radius:50%;
    background:var(--brand-primary);color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:.8125rem;font-weight:800;flex-shrink:0
}

/* ═══════════════════════════════════════════════════
   COURSES TAB SYSTEM
   ═══════════════════════════════════════════════════ */
.course-tab-nav{
    display:flex;gap:var(--sp-3);margin-bottom:var(--sp-8);
    border-bottom:2px solid var(--gray-200);padding-bottom:0
}
.course-tab-btn{
    display:flex;align-items:center;gap:var(--sp-2);
    padding:var(--sp-4) var(--sp-6);
    background:none;border:none;border-bottom:3px solid transparent;
    margin-bottom:-2px;cursor:pointer;
    font-family:var(--font-body);font-size:1rem;font-weight:700;
    color:var(--gray-500);transition:color var(--t-fast),border-color var(--t-fast)
}
.course-tab-btn:hover{color:var(--brand-primary)}
.course-tab-btn.active{color:var(--brand-primary);border-bottom-color:var(--brand-primary)}
.course-tab-icon{font-size:1.25rem}
.course-tab-panel{display:none}
.course-tab-panel.active{display:block}

/* ═══════════════════════════════════════════════════
   GREEN CARD COURSE (Level 1 Tab)
   ═══════════════════════════════════════════════════ */
.gc-hero-banner{
    background:linear-gradient(135deg,#051f0e 0%,#0d4a26 40%,#0f6b37 70%,#16a34a 100%);
    border-radius:var(--r-xl);padding:var(--sp-10);
    display:grid;grid-template-columns:1fr auto;gap:var(--sp-10);align-items:center;
    position:relative;overflow:hidden
}
.gc-hero-banner::before{
    content:'';position:absolute;inset:0;
    background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    pointer-events:none
}
.gc-hero-banner::after{
    content:'';position:absolute;top:-80px;right:280px;
    width:350px;height:350px;border-radius:50%;
    background:radial-gradient(circle,rgba(255,255,255,0.06) 0%,transparent 70%);
    pointer-events:none
}
.gc-hero-content{position:relative;z-index:1}
.gc-hero-badge{
    display:inline-block;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);
    color:#fff;font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
    padding:var(--sp-2) var(--sp-4);border-radius:var(--r-full);margin-bottom:var(--sp-4)
}
.gc-hero-title{font-size:clamp(1.5rem,3vw,2.25rem);color:#fff;margin-bottom:var(--sp-3);font-weight:800}
.gc-hero-subtitle{font-size:1.0625rem;color:rgba(255,255,255,.85);margin-bottom:var(--sp-5);line-height:1.65}
.gc-hero-tags{display:flex;gap:var(--sp-3);flex-wrap:wrap}
.gc-hero-tags span{
    background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);
    color:#fff;font-size:.875rem;font-weight:600;
    padding:var(--sp-2) var(--sp-4);border-radius:var(--r-full);
    display:flex;align-items:center;gap:.35rem;
    backdrop-filter:blur(4px)
}
.gc-price-panel{
    background:rgba(255,255,255,.97);border-radius:var(--r-xl);
    padding:var(--sp-7) var(--sp-7) var(--sp-6);
    text-align:center;min-width:240px;
    box-shadow:0 20px 60px rgba(0,0,0,.25),0 4px 12px rgba(0,0,0,.1);
    position:relative;z-index:1;flex-shrink:0;
    border-top:4px solid #16a34a;
    transition:transform var(--t-mid),box-shadow var(--t-mid)
}
.gc-price-panel:hover{transform:translateY(-3px);box-shadow:0 24px 72px rgba(0,0,0,.3)}
.gc-price-savings{
    display:inline-block;background:#dcfce7;color:#166534;
    font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
    padding:.2rem .7rem;border-radius:var(--r-full);margin-bottom:var(--sp-3)
}
.gc-price-label{font-size:.8125rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-500);margin-bottom:var(--sp-2)}
.gc-price-amount{
    font-size:3rem;font-weight:800;font-family:var(--font-display);
    color:var(--gray-900);line-height:1;
    background:linear-gradient(135deg,#0d7a4e,#16a34a);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text
}
.gc-price-vat{font-size:.9375rem;font-weight:500;color:var(--gray-400);-webkit-text-fill-color:var(--gray-400)}
.gc-price-total{font-size:1rem;color:#15803d;font-weight:700;margin:var(--sp-2) 0 var(--sp-5)}
.gc-price-cta{
    margin-bottom:var(--sp-3);
    background:linear-gradient(135deg,#15803d,#16a34a);
    border-color:transparent;
    box-shadow:0 6px 20px rgba(22,163,74,.35);
    font-size:1.0625rem;font-weight:800;
    letter-spacing:.01em
}
.gc-price-cta:hover{
    background:linear-gradient(135deg,#14532d,#15803d);
    box-shadow:0 8px 28px rgba(22,163,74,.5);
    transform:translateY(-2px)
}
.gc-price-note{font-size:.8125rem;color:var(--gray-400)}
.gc-section-heading{font-size:1.375rem;color:var(--gray-900);margin-bottom:var(--sp-6)}
.gc-section-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-10)}
.gc-features-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-4)}
.gc-feature-card{
    display:flex;gap:var(--sp-4);align-items:flex-start;padding:var(--sp-4);
    background:#fff;border:1px solid var(--gray-200);border-radius:var(--r-lg);
    transition:box-shadow var(--t-mid)
}
.gc-feature-card:hover{box-shadow:var(--sh-md)}
.gc-feature-icon{font-size:1.75rem;flex-shrink:0;margin-top:.1rem}
.gc-feature-card strong{display:block;font-size:.9375rem;color:var(--gray-900);margin-bottom:.2rem}
.gc-feature-card p{font-size:.875rem;color:var(--gray-500);line-height:1.6;margin:0}
.gc-steps-list{display:flex;flex-direction:column;gap:var(--sp-4);list-style:none}
.gc-steps-list li{display:flex;gap:var(--sp-4);align-items:flex-start}
.gc-step-num{
    width:36px;height:36px;border-radius:50%;
    background:var(--brand-primary);color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:.9375rem;font-weight:800;flex-shrink:0;font-family:var(--font-display)
}
.gc-steps-list strong{display:block;font-size:.9375rem;color:var(--gray-900);margin-bottom:.2rem}
.gc-steps-list p{font-size:.875rem;color:var(--gray-500);line-height:1.6;margin:0}
.gc-learn-section{margin-top:var(--sp-12);padding:var(--sp-10);background:var(--brand-light);border-radius:var(--r-xl)}
.gc-learn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--sp-4)}
.gc-learn-card{display:flex;gap:var(--sp-3);align-items:flex-start;padding:var(--sp-4);background:#fff;border-radius:var(--r-lg)}
.gc-learn-icon{font-size:1.75rem;flex-shrink:0}
.gc-learn-card strong{display:block;font-size:.9375rem;color:var(--gray-900);margin-bottom:.2rem}
.gc-learn-card p{font-size:.875rem;color:var(--gray-500);line-height:1.6;margin:0}
.gc-who-section{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-8);margin-top:var(--sp-12)}
.gc-who-content p{font-size:.9375rem;color:var(--gray-600);line-height:1.75;margin-bottom:var(--sp-5)}
.gc-who-list{display:flex;flex-direction:column;gap:var(--sp-3)}
.gc-who-list li{font-size:.9375rem;color:var(--gray-700);font-weight:500}
.gc-requirements-box{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--r-xl);padding:var(--sp-6)}
.gc-req-list{display:flex;flex-direction:column;gap:var(--sp-5)}
.gc-req-list li{display:flex;gap:var(--sp-3);align-items:flex-start}
.gc-req-icon{font-size:1.25rem;flex-shrink:0;margin-top:.1rem}
.gc-req-list strong{display:block;font-size:.9375rem;color:var(--gray-900)}
.gc-req-list small{font-size:.8125rem;color:var(--gray-500);line-height:1.6}
.gc-pricing-section{margin-top:var(--sp-12)}
.gc-pricing-card{
    display:flex;justify-content:space-between;align-items:center;gap:var(--sp-8);
    background:#fff;border:2px solid var(--gray-200);border-radius:var(--r-xl);
    padding:var(--sp-8);margin-bottom:var(--sp-4)
}
.gc-pricing-title{font-size:1.125rem;font-weight:700;color:var(--gray-900);margin-bottom:var(--sp-4)}
.gc-pricing-includes{display:flex;flex-direction:column;gap:var(--sp-2)}
.gc-pricing-includes li{font-size:.9375rem;color:var(--gray-600)}
.gc-pricing-right{text-align:center;flex-shrink:0}
.gc-pricing-ex{font-size:1.375rem;color:var(--gray-500);font-weight:600;margin-bottom:.25rem}
.gc-pricing-ex small{font-size:.875rem}
.gc-pricing-inc{font-size:2.25rem;font-weight:800;font-family:var(--font-display);color:var(--brand-primary);margin-bottom:var(--sp-5)}
.gc-pricing-inc small{font-size:.875rem;font-weight:500;color:var(--gray-400)}
.gc-pricing-note{
    display:flex;gap:var(--sp-6);justify-content:center;flex-wrap:wrap;
    font-size:.875rem;color:var(--gray-400);font-weight:600
}
.gc-revision-banner{
    background:linear-gradient(135deg,#1e3a5f,var(--brand-primary));
    border-radius:var(--r-xl);padding:var(--sp-8);margin-top:var(--sp-10)
}
.gc-revision-content{display:flex;gap:var(--sp-6);align-items:flex-start}
.gc-revision-icon{font-size:2.5rem;flex-shrink:0}
.gc-revision-content h3{font-size:1.25rem;color:#fff;margin-bottom:var(--sp-2)}
.gc-revision-content p{font-size:.9375rem;color:rgba(255,255,255,.78);line-height:1.7;margin-bottom:var(--sp-5)}
.gc-revision-links{display:flex;gap:var(--sp-3);flex-wrap:wrap}
.gc-enquiry-section{
    margin-top:var(--sp-12);background:var(--gray-50);
    border-radius:var(--r-xl);padding:var(--sp-10);
    border:1px solid var(--gray-200)
}
.gc-enquiry-inner{max-width:760px;margin:0 auto}
.gc-enquiry-header{text-align:center;margin-bottom:var(--sp-8)}
.gc-enquiry-header p{font-size:.9375rem;color:var(--gray-500);margin-top:.25rem}

/* ═══════════════════════════════════════════════════
   NVQ COURSES
   ═══════════════════════════════════════════════════ */
.nvq-intro{
    background:linear-gradient(135deg,#1E3A5F,var(--brand-primary));
    border-radius:var(--r-xl);padding:var(--sp-8);margin-bottom:var(--sp-6)
}
.nvq-intro-content h2{font-size:1.5rem;color:#fff;margin-bottom:var(--sp-3)}
.nvq-intro-content p{font-size:.9375rem;color:rgba(255,255,255,.8);line-height:1.7;margin-bottom:var(--sp-6);max-width:700px}
.nvq-external-links{display:flex;gap:var(--sp-3);flex-wrap:wrap}
.nvq-filter-bar{
    background:#fff;border:1px solid var(--gray-200);border-radius:var(--r-xl);
    padding:var(--sp-6);margin-bottom:var(--sp-6)
}
.nvq-filter-row{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:var(--sp-4);align-items:end}
.nvq-filter-label{display:block;font-size:.8125rem;font-weight:700;color:var(--gray-700);margin-bottom:var(--sp-2)}
.nvq-select{font-size:.9375rem}
.nvq-info-display{
    padding:var(--sp-3) var(--sp-4);border:1.5px solid var(--gray-200);border-radius:var(--r-md);
    font-size:.9375rem;color:var(--gray-400);background:var(--gray-50);font-weight:500;
    min-height:50px;display:flex;align-items:center
}
.nvq-results-list{margin-bottom:var(--sp-6)}
.nvq-results-placeholder{
    text-align:center;padding:var(--sp-10);
    border:2px dashed var(--gray-200);border-radius:var(--r-lg);color:var(--gray-400)
}
.nvq-results-placeholder span{font-size:2.5rem;display:block;margin-bottom:var(--sp-3)}
.nvq-results-placeholder p{font-size:.9375rem}
.nvq-result-card{
    background:#fff;border:1.5px solid var(--gray-200);border-radius:var(--r-xl);
    padding:var(--sp-6);margin-bottom:var(--sp-4)
}
.nvq-result-card .occ-title{font-size:1.375rem;font-weight:800;color:var(--gray-900);margin-bottom:var(--sp-3)}
.nvq-result-meta{display:flex;gap:var(--sp-4);flex-wrap:wrap;align-items:center;margin-bottom:var(--sp-4)}
.nvq-level-badge{
    background:var(--brand-light);color:var(--brand-primary);
    font-size:.8125rem;font-weight:700;padding:var(--sp-2) var(--sp-4);border-radius:var(--r-full)
}
.nvq-card-badge{
    font-size:.8125rem;font-weight:700;padding:var(--sp-2) var(--sp-4);border-radius:var(--r-full)
}
.nvq-card-badge.green{background:#DCFCE7;color:#166534}
.nvq-card-badge.blue{background:#DBEAFE;color:#1E40AF}
.nvq-card-badge.gold{background:#FEF9C3;color:#854D0E}
.nvq-card-badge.black{background:#F1F5F9;color:#334155}
.nvq-all-courses{margin-top:var(--sp-8)}
.nvq-course-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--sp-5)
}
.nvq-course-item{
    background:#fff;border:1.5px solid var(--gray-200);border-radius:var(--r-lg);
    padding:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-3);
    transition:transform var(--t-mid),box-shadow var(--t-mid),border-color var(--t-mid);
    position:relative;overflow:hidden
}
.nvq-course-item::before{
    content:'';position:absolute;top:0;left:0;right:0;height:3px
}
.nvq-course-item.green::before{background:var(--col-green)}
.nvq-course-item.blue::before{background:var(--col-blue)}
.nvq-course-item.gold::before{background:var(--col-gold)}
.nvq-course-item.black::before{background:var(--col-black)}
.nvq-course-item:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:transparent}
.nvq-occ-name{font-size:1rem;font-weight:700;color:var(--gray-900)}
.nvq-occ-level{font-size:.8125rem;color:var(--brand-primary);font-weight:600}
.nvq-occ-card{margin-top:auto}

/* ═══════════════════════════════════════════════════
   POLICY PAGES (Privacy / Terms)
   ═══════════════════════════════════════════════════ */
.policy-page-content{
    background:#fff;border:1px solid var(--gray-200);
    border-radius:var(--r-xl);padding:var(--sp-10);
    box-shadow:var(--sh-sm)
}
.policy-placeholder-notice{
    text-align:center;padding:var(--sp-10) var(--sp-4)
}
.policy-placeholder-icon{font-size:3.5rem;display:block;margin-bottom:var(--sp-5)}
.policy-placeholder-notice h2{
    font-size:1.625rem;color:var(--gray-900);margin-bottom:var(--sp-4)
}
.policy-placeholder-notice p{
    font-size:1.0625rem;color:var(--gray-500);
    max-width:480px;margin:0 auto;line-height:1.75
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE — NEW COMPONENTS
   ═══════════════════════════════════════════════════ */
@media(max-width:1024px){
    .booking-type-grid{grid-template-columns:1fr}
    .group-booking-layout{grid-template-columns:1fr}
    .enquiry-layout{grid-template-columns:1fr}
    .gc-section-grid{grid-template-columns:1fr}
    .gc-who-section{grid-template-columns:1fr}
    .gc-hero-banner{grid-template-columns:1fr;text-align:center}
    .gc-hero-tags{justify-content:center}
    .gc-price-panel{max-width:320px;margin:0 auto}
    .nvq-filter-row{grid-template-columns:1fr}
    .gc-pricing-card{flex-direction:column;text-align:center}
}
@media(max-width:768px){
    .course-tab-nav{flex-direction:column;border-bottom:none;gap:var(--sp-2)}
    .course-tab-btn{border:1.5px solid var(--gray-200);border-radius:var(--r-md);border-bottom-color:var(--gray-200);margin:0}
    .course-tab-btn.active{border-color:var(--brand-primary);background:var(--brand-light)}
    .gc-hero-banner{padding:var(--sp-6)}
    .gc-revision-content{flex-direction:column}
    .nvq-course-grid{grid-template-columns:1fr}
    .gc-learn-grid{grid-template-columns:1fr}
    .gc-enquiry-section{padding:var(--sp-6) var(--sp-4)}
    .group-trust-box{grid-template-columns:1fr}
    .booking-type-inner{padding:var(--sp-6)}
    .nvq-external-links{flex-direction:column}
    .gc-pricing-note{flex-direction:column;align-items:center;gap:var(--sp-2)}
}

/* ═══════════════════════════════════════════════════
   GLASSMORPHISM CSCS CARD TYPES
   ═══════════════════════════════════════════════════ */
.glass-cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
    gap:var(--sp-5)
}
.glass-card{
    position:relative;overflow:hidden;
    background:rgba(255,255,255,0.72);
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
    border:1.5px solid rgba(255,255,255,0.85);
    border-radius:var(--r-xl);
    padding:var(--sp-6);
    display:flex;flex-direction:column;gap:var(--sp-3);
    box-shadow:0 4px 24px rgba(0,0,0,.07),0 1px 4px rgba(0,0,0,.05);
    transition:transform var(--t-mid),box-shadow var(--t-mid);
    border-top:3px solid var(--card-accent,#2563eb)
}
.glass-card::before{
    content:'';position:absolute;inset:0;
    background:linear-gradient(135deg,rgba(255,255,255,.45) 0%,transparent 70%);
    pointer-events:none
}
.glass-card-glow{
    position:absolute;top:-30%;right:-20%;
    width:180px;height:180px;border-radius:50%;
    background:var(--card-glow,rgba(37,99,235,.15));
    filter:blur(40px);pointer-events:none
}
.glass-card:hover{
    transform:translateY(-6px) scale(1.01);
    box-shadow:0 16px 48px var(--card-glow,rgba(37,99,235,.20)),0 4px 12px rgba(0,0,0,.10)
}
.glass-card-badge{
    display:inline-flex;align-items:center;gap:var(--sp-2);
    padding:.25rem .75rem;border-radius:var(--r-full);
    font-size:.8125rem;font-weight:700;letter-spacing:.05em;
    background:var(--card-accent,#2563eb);color:#fff;width:fit-content
}
.glass-card-image-wrap{
    width:100%;
    aspect-ratio:1.586/1;
    border-radius:var(--r-lg);
    overflow:hidden;
    position:relative;
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    background:var(--gray-100);
    margin-bottom:var(--sp-2);
    border:1px solid rgba(0,0,0,.06)
}
.glass-card-img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform var(--t-mid) ease
}
.glass-card:hover .glass-card-img{
    transform:scale(1.04)
}
.glass-card-sub{font-size:.8125rem;font-weight:700;color:var(--card-accent,#2563eb);margin:-.25rem 0}
.glass-card-desc{font-size:.9rem;color:var(--gray-600);line-height:1.6;flex:1}
.glass-card-cta{
    margin-top:auto;font-size:.875rem;font-weight:700;
    color:var(--card-accent,#2563eb);text-decoration:none;
    display:inline-flex;align-items:center;gap:.25rem;
    padding-top:var(--sp-3);border-top:1px solid var(--gray-100);
    transition:gap var(--t-fast),opacity var(--t-fast)
}
.glass-card-cta:hover{gap:.5rem;text-decoration:none;opacity:.8}

/* ═══════════════════════════════════════════════════
   COMPANY INTRO CARDS
   ═══════════════════════════════════════════════════ */
.intro-cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:var(--sp-5)
}
.intro-card{
    background:var(--gray-50);
    border:1.5px solid var(--gray-200);
    border-radius:var(--r-xl);
    padding:var(--sp-8) var(--sp-6);
    text-align:center;
    transition:transform var(--t-mid),box-shadow var(--t-mid),border-color var(--t-mid)
}
.intro-card:hover{
    transform:translateY(-5px);
    box-shadow:var(--sh-lg);
    border-color:var(--brand-primary)
}
.intro-card-icon{
    font-size:2.5rem;
    width:64px;height:64px;border-radius:50%;
    background:var(--brand-light);
    display:flex;align-items:center;justify-content:center;
    margin:0 auto var(--sp-5)
}
.intro-card h3{font-size:1.125rem;margin-bottom:var(--sp-3);color:var(--gray-900)}
.intro-card p{font-size:.9375rem;color:var(--gray-500);line-height:1.7}

/* ═══════════════════════════════════════════════════
   PROCESS FLOW
   ═══════════════════════════════════════════════════ */
.process-flow{
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
    gap:0;align-items:start;
    max-width:1100px;margin:0 auto var(--sp-8)
}
.process-step{text-align:center;padding:var(--sp-4)}
.process-connector-line{
    display:flex;align-items:flex-start;padding-top:2.2rem;
    opacity:.4
}
.process-connector-line::after{
    content:'';display:block;width:100%;height:2px;min-width:24px;
    background:linear-gradient(90deg,var(--brand-primary),var(--brand-secondary))
}
.process-icon-wrap{position:relative;display:inline-block;margin-bottom:var(--sp-5)}
.process-icon{
    width:80px;height:80px;border-radius:50%;
    background:linear-gradient(135deg,var(--brand-primary),#2E6DB4);
    display:flex;align-items:center;justify-content:center;
    font-size:2rem;margin:0 auto;
    box-shadow:0 8px 32px rgba(27,79,138,.25);
    transition:transform var(--t-mid),box-shadow var(--t-mid)
}
.process-step:hover .process-icon{
    transform:scale(1.08);
    box-shadow:0 12px 40px rgba(27,79,138,.35)
}
.process-step-num{
    position:absolute;top:-6px;right:-6px;
    width:26px;height:26px;border-radius:50%;
    background:var(--brand-secondary);color:var(--brand-dark);
    font-size:.8125rem;font-weight:800;
    display:flex;align-items:center;justify-content:center;
    border:2px solid #fff
}
.process-step h3{font-size:1.0625rem;color:var(--gray-900);margin-bottom:var(--sp-3)}
.process-step p{font-size:.9rem;color:var(--gray-500);line-height:1.65;max-width:220px;margin:0 auto}
@media(max-width:860px){
    .process-flow{grid-template-columns:1fr 1fr;gap:var(--sp-6)}
    .process-connector-line{display:none}
}
@media(max-width:520px){.process-flow{grid-template-columns:1fr}}

/* ═══════════════════════════════════════════════════
   FOOTER REDESIGN — Wave + Contact inline + Trust
   ═══════════════════════════════════════════════════ */
/* footer override block removed because footer styles are centralized above */
/* ═══════════════════════════════════════════════════
   NVQ POPUP MODAL
   ═══════════════════════════════════════════════════ */
.nvq-popup-overlay{
    position:fixed;inset:0;z-index:9000;
    background:rgba(15,23,42,.75);
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
    display:flex;align-items:center;justify-content:center;
    padding:2rem var(--sp-5);
    overflow-y:auto
}
.nvq-popup{
    background:#fff;border-radius:var(--r-xl);
    width:100%;max-width:520px;
    max-height:100%;
    overflow-y:auto;
    padding:var(--sp-10) var(--sp-8);
    box-shadow:0 24px 80px rgba(0,0,0,.3);
    animation:popupIn .35s cubic-bezier(.22,1,.36,1)
}
@keyframes popupIn{
    from{opacity:0;transform:scale(.9) translateY(20px)}
    to{opacity:1;transform:scale(1) translateY(0)}
}
.nvq-popup-header{text-align:center;margin-bottom:var(--sp-8)}
.nvq-popup-icon{font-size:3rem;display:block;margin-bottom:var(--sp-4)}
.nvq-popup-header h2{font-size:1.5rem;color:var(--gray-900);margin-bottom:var(--sp-3)}
.nvq-popup-header p{font-size:.9375rem;color:var(--gray-500);line-height:1.7}
.nvq-popup .form-group{margin-bottom:var(--sp-4)}

/* ═══════════════════════════════════════════════════
   CSCS CARD APP TYPE — 3 cols + Lost variant
   ═══════════════════════════════════════════════════ */
.card-app-grid-3{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:var(--sp-4);margin-bottom:var(--sp-6)
}
.app-type-card--lost.selected{
    border-color:#ca8a04;background:#fefce8
}
@media(max-width:640px){.card-app-grid-3{grid-template-columns:1fr}}

/* ═══════════════════════════════════════════════════
   PAYMENT BUTTON — Disabled gate glow
   ═══════════════════════════════════════════════════ */
.pay-btn{margin:var(--sp-4) var(--sp-8);width:calc(100% - 4rem)}
.pay-btn:disabled{
    opacity:.4;cursor:not-allowed;
    transform:none!important;box-shadow:none!important;filter:grayscale(.5)
}
.pay-btn:not(:disabled){animation:payPulse 2.5s ease-in-out infinite}
@keyframes payPulse{
    0%,100%{box-shadow:0 8px 32px rgba(245,166,35,.30)}
    50%{box-shadow:0 12px 48px rgba(245,166,35,.55)}
}

/* ═══════════════════════════════════════════════════
   PRIVACY / TERMS — Minimal clean layout
   ═══════════════════════════════════════════════════ */
.legal-content{
    max-width:800px;margin:0 auto;
    padding:var(--sp-16) var(--sp-5) var(--sp-20)
}
.legal-content h2{
    font-size:1.375rem;color:var(--gray-900);
    margin:var(--sp-10) 0 var(--sp-4);
    padding-bottom:var(--sp-3);
    border-bottom:2px solid var(--gray-100)
}
.legal-content h2:first-of-type{margin-top:0}
.legal-content p{
    font-size:1rem;color:var(--gray-600);
    line-height:1.85;margin-bottom:var(--sp-4)
}
.legal-content ul{list-style:disc;padding-left:1.5rem;margin-bottom:var(--sp-4)}
.legal-content ul li{
    font-size:1rem;color:var(--gray-600);
    line-height:1.75;margin-bottom:var(--sp-2)
}
.legal-content a{color:var(--brand-primary);font-weight:600}
.legal-last-updated{
    display:inline-block;
    background:var(--gray-100);border-radius:var(--r-full);
    padding:var(--sp-2) var(--sp-4);
    font-size:.8125rem;font-weight:600;color:var(--gray-500);
    margin-bottom:var(--sp-8)
}

/* ═══════════════════════════════════════════════════
   NAV — ACTIVE STATE & 6-ITEM RESPONSIVE
   ═══════════════════════════════════════════════════ */
.nav-link.active{
    color:var(--brand-primary);
    border-bottom:2px solid var(--brand-primary);
    font-weight:700
}
@media(max-width:1024px){
    .nav-menu{gap:var(--sp-3)}
    .nav-link{font-size:.875rem}
}
@media(max-width:860px){
    .nav-toggle{display:flex}
    .nav-menu{
        display:none;flex-direction:column;
        position:absolute;top:var(--header-h);left:0;right:0;
        background:rgba(255,255,255,.97);
        backdrop-filter:blur(20px);
        border-bottom:1px solid var(--gray-200);
        padding:var(--sp-4) var(--sp-5);
        gap:var(--sp-1);box-shadow:var(--sh-lg);z-index:999
    }
    .nav-menu.open{display:flex}
    .nav-link{
        padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);
        border-bottom:none;font-size:.9375rem;
        transition:background var(--t-fast)
    }
    .nav-link:hover,.nav-link.active{
        background:var(--brand-light);color:var(--brand-primary);
        border-bottom:none
    }
    .nav-link.active{
        background:var(--brand-primary);color:#fff
    }
}

/* ═══════════════════════════════════════════════════
   RETAKE TOGGLE — Yes/No mandatory selection
   ═══════════════════════════════════════════════════ */
.retake-mandatory-box{
    margin:var(--sp-6) var(--sp-8);
    background:linear-gradient(135deg,#FFF9ED,#FFFDF5);
    border:2px solid var(--brand-secondary);
    border-radius:var(--r-lg);padding:var(--sp-6);
    transition:border-color var(--t-fast)
}
.retake-mandatory-box.error-state{border-color:var(--error);background:#FEF2F2}
.retake-mandatory-title{
    font-size:1rem;font-weight:700;color:var(--gray-900);
    margin-bottom:var(--sp-2);display:flex;align-items:center;gap:var(--sp-2)
}
.retake-mandatory-desc{font-size:.9rem;color:var(--gray-600);margin-bottom:var(--sp-4);line-height:1.6}
.retake-toggle-row{display:flex;gap:var(--sp-3);flex-wrap:wrap}
.retake-yn-btn{
    flex:1;min-width:120px;padding:var(--sp-4) var(--sp-5);
    border:2px solid var(--gray-200);border-radius:var(--r-lg);
    background:#fff;cursor:pointer;font-family:var(--font-body);
    font-size:1rem;font-weight:700;color:var(--gray-700);
    display:flex;align-items:center;justify-content:center;gap:var(--sp-2);
    transition:all var(--t-fast)
}
.retake-yn-btn:hover{border-color:var(--brand-primary);background:var(--brand-light)}
.retake-yn-btn.selected-yes{
    border-color:var(--success);background:#DCFCE7;color:#166534
}
.retake-yn-btn.selected-no{
    border-color:var(--gray-400);background:var(--gray-100);color:var(--gray-700)
}
.retake-error{font-size:.8125rem;color:var(--error);margin-top:var(--sp-3);display:none}
.retake-error.visible{display:block}

/* ═══════════════════════════════════════════════════
   SECONDARY DATE SECTION
   ═══════════════════════════════════════════════════ */
.date-section-wrap{margin-bottom:var(--sp-6)}
.date-section-heading{
    padding:var(--sp-4) var(--sp-8) var(--sp-3);
    font-size:1rem;font-weight:700;color:var(--gray-800);
    display:flex;align-items:center;gap:var(--sp-2)
}
.date-section-heading .date-badge{
    font-size:.75rem;font-weight:700;
    padding:.15rem .5rem;border-radius:var(--r-full);
    background:var(--brand-primary);color:#fff
}
.date-section-heading .date-badge.secondary{background:var(--gray-400)}
.date-section-hint{
    padding:0 var(--sp-8);font-size:.8125rem;
    color:var(--gray-400);margin-bottom:var(--sp-3)
}
.secondary-date-section{
    border-top:1px dashed var(--gray-200);
    padding-top:var(--sp-2);margin-top:var(--sp-4)
}

/* ═══════════════════════════════════════════════════
   DOB PICKER — Day/Month/Year dropdowns
   ═══════════════════════════════════════════════════ */
.dob-picker-row{
    display:grid;grid-template-columns:1fr 2fr 1fr;
    gap:var(--sp-2)
}
.dob-picker-row select.form-control{font-size:.9rem}

/* ═══════════════════════════════════════════════════
   CENTRE SEARCH — city/postcode dual
   ═══════════════════════════════════════════════════ */
.centre-search-block{padding:var(--sp-6) var(--sp-8) var(--sp-2)}
.centre-search-divider{
    text-align:center;font-size:.8125rem;font-weight:700;
    color:var(--gray-400);padding:var(--sp-2) 0;position:relative
}
.centre-search-divider::before{
    content:'';position:absolute;top:50%;left:0;right:0;height:1px;
    background:var(--gray-200);z-index:0
}
.centre-search-divider span{
    position:relative;z-index:1;background:#fff;padding:0 var(--sp-3)
}
.centre-available-badge{
    font-size:.75rem;font-weight:700;
    background:#DCFCE7;color:#166534;
    padding:.15rem .5rem;border-radius:var(--r-full);
    white-space:nowrap;flex-shrink:0
}
.centre-card-meta{
    display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-2)
}
.centre-meta-chip{
    font-size:.75rem;color:var(--gray-500);
    background:var(--gray-100);padding:.15rem .45rem;
    border-radius:var(--r-full)
}

/* ═══════════════════════════════════════════════════
   CROSS-SELL BANNER
   ═══════════════════════════════════════════════════ */
.crosssell-banner{
    margin:var(--sp-4) var(--sp-8);
    background:linear-gradient(135deg,#1B4F8A,#2E6DB4);
    border-radius:var(--r-lg);padding:var(--sp-5) var(--sp-6);
    display:flex;align-items:center;justify-content:space-between;
    gap:var(--sp-4);flex-wrap:wrap;box-shadow:var(--sh-brand)
}
.crosssell-banner.amber{background:linear-gradient(135deg,#B45309,#D97706)}
.crosssell-content{flex:1;min-width:200px}
.crosssell-label{
    font-size:.75rem;font-weight:700;letter-spacing:.08em;
    text-transform:uppercase;color:rgba(255,255,255,.7);
    margin-bottom:var(--sp-1)
}
.crosssell-title{font-size:1rem;font-weight:700;color:#fff;margin-bottom:var(--sp-1)}
.crosssell-sub{font-size:.875rem;color:rgba(255,255,255,.8)}
.crosssell-btn{
    background:#fff;color:var(--brand-primary);
    padding:var(--sp-3) var(--sp-5);border-radius:var(--r-full);
    font-weight:700;font-size:.9rem;text-decoration:none;
    white-space:nowrap;flex-shrink:0;
    transition:transform var(--t-fast),box-shadow var(--t-fast)
}
.crosssell-btn:hover{transform:translateY(-2px);box-shadow:var(--sh-md);text-decoration:none;color:var(--brand-primary)}
.crosssell-banner.amber .crosssell-btn{color:var(--warning)}
.crosssell-actions{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}

/* ═══════════════════════════════════════════════════
   FEE DISPLAY BOX
   ═══════════════════════════════════════════════════ */
.fee-display-box{
    margin:var(--sp-2) var(--sp-8) var(--sp-4);
    background:linear-gradient(135deg,#DCFCE7,#F0FDF4);
    border:2px solid #86EFAC;border-radius:var(--r-lg);
    padding:var(--sp-5) var(--sp-6);
    display:flex;align-items:center;justify-content:space-between;
    flex-wrap:wrap;gap:var(--sp-3)
}
.fee-label{font-size:.9375rem;font-weight:600;color:#166534}
.fee-amount{font-size:1.75rem;font-weight:800;color:#166534;font-family:var(--font-display)}
.fee-note{font-size:.8125rem;color:#15803D;width:100%}

.selected-flow-badge{
    display:inline-flex;align-items:center;gap:var(--sp-2);width:fit-content;
    padding:var(--sp-3) var(--sp-4);border-radius:var(--r-full);
    background:var(--brand-light);color:var(--brand-primary);font-weight:700;font-size:.9375rem
}

.stripe-field{
    display:flex !important;align-items:center !important;min-height:48px;padding:0 16px !important;box-sizing:border-box !important
}
.stripe-field.StripeElement{
    width:100%
}
.stripe-field iframe{
    width:100% !important
}
.stripe-fallback-input{
    width:100%;border:0;outline:0;background:transparent;
    color:var(--gray-700);font:inherit;
    padding:12px 0;
    box-sizing:border-box
}
.stripe-fallback-input::placeholder{color:#94a3b8}
.stripe-field.StripeElement--focus{border-color:var(--brand-primary);box-shadow:0 0 0 3px rgba(27,79,138,.10)}
.stripe-field.StripeElement--invalid{border-color:var(--error)}

/* ═══════════════════════════════════════════════════
   LEGAL TABS
   ═══════════════════════════════════════════════════ */
.legal-tab-nav{
    display:flex;gap:0;border-bottom:2px solid var(--gray-200);
    margin-bottom:var(--sp-8)
}
.legal-tab-btn{
    padding:var(--sp-4) var(--sp-8);font-weight:700;font-size:1rem;
    color:var(--gray-500);border-bottom:3px solid transparent;
    margin-bottom:-2px;cursor:pointer;text-decoration:none;
    background:none;border-top:none;border-left:none;border-right:none;
    font-family:var(--font-body);
    transition:color var(--t-fast),border-color var(--t-fast)
}
.legal-tab-btn:hover{color:var(--brand-primary);text-decoration:none}
.legal-tab-btn.active{color:var(--brand-primary);border-bottom:3px solid var(--brand-primary)}
.legal-section{display:none}
.legal-section.active{display:block}
.legal-prose h2{font-size:1.375rem;margin:var(--sp-8) 0 var(--sp-3)}
.legal-prose h3{font-size:1.0625rem;margin:var(--sp-5) 0 var(--sp-2);color:var(--gray-700)}
.legal-prose p,.legal-prose li{
    font-size:.9375rem;color:var(--gray-600);
    line-height:1.8;margin-bottom:var(--sp-3)
}
.legal-prose ul,.legal-prose ol{
    padding-left:var(--sp-6);
    display:flex;flex-direction:column;gap:var(--sp-2)
}
.legal-prose ul{list-style:disc}
.legal-prose ol{list-style:decimal}

/* ═══════════════════════════════════════════════════
   REVISION MATERIAL CARDS
   ═══════════════════════════════════════════════════ */
.revision-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:var(--sp-5)
}
.revision-card{
    background:#fff;border:1.5px solid var(--gray-200);
    border-radius:var(--r-lg);padding:var(--sp-6);
    display:flex;flex-direction:column;gap:var(--sp-3);
    transition:transform var(--t-mid),box-shadow var(--t-mid),border-color var(--t-mid);
    text-decoration:none
}
.revision-card:hover{
    transform:translateY(-4px);box-shadow:var(--sh-lg);
    border-color:var(--brand-primary);text-decoration:none
}
.revision-card-icon{font-size:2.5rem}
.revision-card-tag{
    display:inline-block;font-size:.6875rem;font-weight:700;
    letter-spacing:.07em;text-transform:uppercase;
    padding:.2rem .55rem;border-radius:var(--r-full);
    background:var(--brand-light);color:var(--brand-primary);
    width:fit-content
}
.revision-card-title{font-size:1rem;font-weight:700;color:var(--gray-900)}
.revision-card-desc{font-size:.9rem;color:var(--gray-500);line-height:1.65;flex:1}
.revision-card-cta{
    font-size:.875rem;font-weight:700;color:var(--brand-primary);
    display:flex;align-items:center;gap:var(--sp-2);margin-top:auto
}

/* ═══════════════════════════════════════════════════
   APP TYPE DROPDOWN
   ═══════════════════════════════════════════════════ */
.app-type-select-wrap{padding:var(--sp-6) var(--sp-8) 0}
.app-type-select-label{
    font-size:.875rem;font-weight:600;color:var(--gray-700);
    display:block;margin-bottom:var(--sp-2)
}
.app-type-selected-display{
    margin:var(--sp-4) var(--sp-8) 0;
    padding:var(--sp-4) var(--sp-5);
    border-radius:var(--r-md);background:var(--brand-light);
    border:1.5px solid var(--gray-200);
    font-size:.9375rem;font-weight:600;color:var(--brand-primary);
    display:none
}
.app-type-selected-display.visible{display:block}

/* ═══════════════════════════════════════════════════
   RESPONSIVE ADJUSTMENTS — NEW
   ═══════════════════════════════════════════════════ */
@media(max-width:640px){
    .crosssell-banner{flex-direction:column;align-items:flex-start}
    .dob-picker-row{grid-template-columns:1fr 1fr}
    .dob-picker-row .dob-year{grid-column:1/-1}
    .retake-toggle-row{flex-direction:column}
    .retake-yn-btn{min-width:unset}
    .fee-display-box{flex-direction:column}
    .legal-tab-btn{padding:var(--sp-3) var(--sp-4);font-size:.9rem}
}

/* ═══════════════════════════════════════════════════
   TERMS & CONDITIONS — HIGHLIGHTED LINK
   ═══════════════════════════════════════════════════ */
.terms-link-highlight {
    background: rgba(255, 215, 0, 0.30);
    color: #92400e;
    font-weight: 700;
    border-radius: 3px;
    padding: 1px 5px;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: background var(--t-fast), color var(--t-fast);
    display: inline;
    border: none;
    font-family: inherit;
    font-size: inherit;
}
.terms-link-highlight:hover {
    background: rgba(255, 180, 0, 0.50);
    color: #78350f;
    text-decoration: underline;
}

/* ═══════════════════════════════════════════════════
   T&C MODAL OVERLAY + PANEL
   ═══════════════════════════════════════════════════ */
.tc-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 9000;
    background: rgba(15, 23, 42, 0.72);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.28s ease, visibility 0.28s ease;
}
.tc-modal-overlay.open {
    opacity: 1;
    visibility: visible;
}
.tc-modal {
    background: #fff;
    border-radius: 1.25rem;
    box-shadow: 0 24px 80px rgba(0,0,0,.28);
    max-width: 680px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(24px) scale(0.97);
    transition: transform 0.28s cubic-bezier(.22,1,.36,1);
}
.tc-modal-overlay.open .tc-modal {
    transform: translateY(0) scale(1);
}
.tc-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.75rem;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient(135deg, #1B4F8A 0%, #2E6DB4 100%);
    flex-shrink: 0;
}
.tc-modal-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: #fff;
    margin: 0;
    font-family: var(--font-display);
}
.tc-modal-close-x {
    background: rgba(255,255,255,0.18);
    border: 1.5px solid rgba(255,255,255,0.3);
    color: #fff;
    border-radius: 50%;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1.1rem;
    flex-shrink: 0;
    transition: background 0.15s ease;
}
.tc-modal-close-x:hover { background: rgba(255,255,255,0.32); }
.tc-modal-body {
    overflow-y: auto;
    padding: 1.5rem 1.75rem;
    flex: 1;
    line-height: 1.75;
    color: #334155;
    font-size: 0.9375rem;
}
.tc-modal-body h3 {
    font-size: 1rem;
    font-weight: 700;
    color: #1B4F8A;
    margin: 1.25rem 0 0.5rem;
    font-family: var(--font-display);
}
.tc-modal-body h3:first-child { margin-top: 0; }
.tc-modal-body p { margin-bottom: 0.85rem; color: #475569; }
.tc-modal-body ul { margin: 0 0 0.85rem 1.25rem; list-style: disc; }
.tc-modal-body ul li { margin-bottom: 0.35rem; color: #475569; }
.tc-modal-footer {
    padding: 1rem 1.75rem 1.25rem;
    border-top: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    flex-shrink: 0;
    background: #f8fafc;
}
.tc-modal-footer-note {
    font-size: 0.8125rem;
    color: #64748b;
}
.tc-modal-agree-btn {
    background: #16A34A;
    color: #fff;
    border: none;
    border-radius: 9999px;
    padding: 0.75rem 1.75rem;
    font-family: var(--font-body);
    font-size: 0.9375rem;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 16px rgba(22,163,74,0.3);
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.tc-modal-agree-btn:hover {
    background: #15803d;
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(22,163,74,0.35);
}
.tc-modal-agree-btn:active { transform: translateY(0); }

/* ═══════════════════════════════════════════════════
   SUPPORT EMAIL — HEADER BAR
   Task 1: Added responsive mobile breakpoints (360px, 320px)
   ═══════════════════════════════════════════════════ */
.support-bar {
    background: #1B4F8A;
    padding: 0.375rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;          /* Task 1: prevent overflow on small screens */
    gap: 0.5rem 1.25rem;
    font-size: 0.8125rem;
    min-height: 32px;
}
.support-bar-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: rgba(255,255,255,0.90);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.15s ease;
    min-width: 0; /* allow shrink */
}
/* Task 1: Email link — clamp text on very small screens */
.support-bar-link#supportEmailLink {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: calc(100vw - 160px); /* leave room for WhatsApp button */
}
.support-bar-link:hover { color: #fff; text-decoration: none; }
.support-bar-link svg { flex-shrink: 0; }

/* ── Task 1: 520px — slightly smaller font, stacked layout ── */
@media (max-width: 520px) {
    .support-bar {
        font-size: 0.75rem;
        padding: 0.5rem 0.875rem;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.35rem;
    }
    .support-bar-link#supportEmailLink {
        max-width: 100% !important;
        white-space: normal !important;
        word-break: break-all !important;
        text-align: center;
    }
}

/* ── Task 1: 360px — reduced font,Centered stack ── */
@media (max-width: 360px) {
    .support-bar {
        font-size: 0.6875rem;  /* 11px */
        padding: 0.4rem 0.75rem;
        gap: 0.3rem;
    }
    .support-bar-link#supportEmailLink {
        font-size: 0.6875rem;
        max-width: 100% !important;
    }
    .support-bar-link svg {
        width: 12px;
        height: 12px;
    }
}

/* ── Task 1: 320px — minimum viable Centered layout ── */
@media (max-width: 320px) {
    .support-bar {
        font-size: 0.625rem;   /* 10px */
        padding: 0.3rem 0.625rem;
        gap: 0.25rem;
    }
    .support-bar-link#supportEmailLink {
        font-size: 0.625rem;
        max-width: 100% !important;
    }
    .support-bar-link svg {
        width: 11px;
        height: 11px;
    }
}

/* ═══════════════════════════════════════════════════
   WHATSAPP FLOATING BUTTON
   ═══════════════════════════════════════════════════ */
.wa-float {
    position: fixed;
    bottom: 1.75rem;
    right: 1.75rem;
    z-index: 8000;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #25D366;
    box-shadow: 0 6px 24px rgba(37,211,102,0.50), 0 2px 6px rgba(0,0,0,0.18);
    cursor: pointer;
    text-decoration: none;
    border: none;
    padding: 0;
    animation: waPulse 2.4s ease-in-out infinite;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.wa-float:hover {
    transform: scale(1.10);
    box-shadow: 0 10px 36px rgba(37,211,102,0.60), 0 4px 10px rgba(0,0,0,0.20);
    animation: none;
    text-decoration: none;
}
.wa-float:hover .wa-tooltip { opacity: 1; transform: translateX(0); }
.wa-float svg { width: 32px; height: 32px; display: block; }
@keyframes waPulse {
    0%,100% { box-shadow: 0 6px 24px rgba(37,211,102,0.50), 0 2px 6px rgba(0,0,0,0.18), 0 0 0 0 rgba(37,211,102,0.45); }
    60%      { box-shadow: 0 6px 24px rgba(37,211,102,0.50), 0 2px 6px rgba(0,0,0,0.18), 0 0 0 14px rgba(37,211,102,0); }
}
.wa-tooltip {
    position: absolute;
    right: calc(100% + 14px);
    top: 50%;
    transform: translateX(8px) translateY(-50%);
    background: #0f172a;
    color: #fff;
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
    padding: 0.45rem 0.85rem;
    border-radius: 0.5rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
    font-family: var(--font-body);
    box-shadow: 0 4px 16px rgba(0,0,0,0.20);
}
.wa-tooltip::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
    border: 5px solid transparent;
    border-left-color: #0f172a;
}
@media(max-width:480px){
    .wa-float { bottom: 1rem; right: 1rem; width: 50px; height: 50px; }
    .wa-float svg { width: 26px; height: 26px; }
}

/* ============================================================
   ACCESSIBILITY & BREADCRUMBS STYLES
   ============================================================ */

/* Accessibility Skip Link */
.skip-to-main {
    position: absolute;
    top: -100px;
    left: 20px;
    background: var(--brand-primary);
    color: #fff;
    padding: var(--sp-3) var(--sp-5);
    border-radius: var(--r-sm);
    z-index: 2000;
    transition: top var(--t-fast);
    font-weight: 600;
    box-shadow: var(--sh-md);
}
.skip-to-main:focus {
    top: 20px;
    outline: 2px solid var(--brand-secondary);
    outline-offset: 2px;
}

/* Breadcrumbs Styling */
.breadcrumbs-nav {
    padding: var(--sp-3) 0;
    margin-bottom: var(--sp-4);
    font-size: 0.875rem;
}
.breadcrumbs-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    list-style: none;
    padding: 0;
    margin: 0;
}
.breadcrumbs-item {
    display: flex;
    align-items: center;
    color: var(--gray-500);
}
.breadcrumbs-item a {
    color: var(--brand-primary);
    font-weight: 500;
    transition: color var(--t-fast);
}
.breadcrumbs-item a:hover {
    color: var(--brand-secondary);
    text-decoration: none;
}
.breadcrumbs-separator {
    color: var(--gray-400);
    user-select: none;
    font-size: 0.75rem;
}

/* ============================================================
   ADDITIONAL RESPONSIVE OVERRIDES (MOBILE & TABLET)
   ============================================================ */

/* Global responsive font scaling */
@media (max-width: 768px) {
    html {
        font-size: 15px !important;
    }
}
@media (max-width: 480px) {
    html {
        font-size: 14px !important;
    }
}
@media (max-width: 360px) {
    html {
        font-size: 13px !important;
    }
}

/* Postcode/City Search Rows - align elements fully across cards on tablet/mobile */
@media (max-width: 768px) {
    .postcode-search-row {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .postcode-search-row .btn {
        width: 100% !important;
        justify-content: center !important;
        align-self: stretch !important;
    }
    .gc-price-panel, 
    .cscs-info-banner {
        min-width: unset !important;
        width: 100% !important;
    }
}

/* Specific Mobile Overrides (Time Options, Payment Button, Summary Rows) */
@media (max-width: 480px) {
    /* Time preference option stacking */
    .time-options {
        grid-template-columns: 1fr !important;
    }
    .time-option {
        text-align: center !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* Secure Booking & Payment button stacking */
    .pay-btn {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: var(--sp-2) !important;
        height: auto !important;
        padding: var(--sp-4) !important;
    }
    .pay-btn span {
        margin-left: 0 !important;
        font-size: 1.25rem !important;
    }
    
    /* Summary layout vertical stacking */
    .summary-row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: var(--sp-1) !important;
    }
    .summary-value {
        text-align: left !important;
        width: 100% !important;
    }
}

/* Responsive padding for forms inside cards (e.g. Enquiry and Group Booking) */
.responsive-form-card {
    padding: var(--sp-6) var(--sp-8);
}
@media (max-width: 768px) {
    .responsive-form-card {
        padding: 0 !important;
    }
}