/* ==========================================================================
   Site chrome: the parts printed on every front page around the content.
   The top navigation (#frontNav), the trust strip under it (.subNavContainer),
   the partner showcase, the register call to action and the footer, restyled
   in the approved design language (landing-page.css tokens: Plus Jakarta Sans
   for display, Inter for body, the 1180px measure, the glass card, the deep
   navy plate, the arrow pill). Loaded by front/app.blade.php after the
   global sheets. The legacy component sheets (frontnav.*.css, main.css,
   registerinclude.*.css, brandswiper.*.css) are linked inside the includes,
   after this file, and several of their rules carry !important; the same
   weight is used here only where needed to win.
   ========================================================================== */

:root {
    --sc-scale: 1;
    --sc-font-display: 'Plus Jakarta Sans', Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --sc-font-body: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --sc-ink: #0b1220;
    --sc-ink-2: #253247;
    --sc-ink-3: #3f4d66;
    --sc-line: rgba(30, 58, 138, 0.1);
    --sc-navy: #0d1b2a;
    --sc-navy-2: #0f2340;
    --sc-blue: #2563eb;
    --sc-blue-deep: #1d4ed8;
    --sc-green: #059669;
    --sc-gold: #ffd000;
    --sc-measure: calc(1180px * var(--sc-scale));
    --sc-pad-x: 24px;
    --sc-radius: 26px;
    --sc-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --sc-shadow: 0 24px 60px -32px rgba(15, 23, 42, 0.28);
    --sc-plate: linear-gradient(150deg, #0b1f3a 0%, #12325c 55%, #16407a 100%);
    --sc-nav-scale: min(var(--sc-scale), 1.08);
}

@media (min-width: 1600px) { :root { --sc-scale: 1.08; } }
@media (min-width: 1800px) { :root { --sc-scale: 1.16; } }
@media (min-width: 2200px) { :root { --sc-scale: 1.28; } }

/* ==========================================================================
   1. Top navigation
   ========================================================================== */

/* The bar is full width, its content sits on the page measure: the logo
   starts where the sections start and the pills end where they end, on a
   1440 as on a 2560 monitor. The surface is the deep plate with a blue
   light top left and a faint aurora hairline along the bottom edge. */
body #frontNav {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: clamp(16px, 2vw, 32px);
    min-height: calc(74px * var(--sc-nav-scale));
    padding: 0 max(24px, calc((100% - var(--sc-measure)) / 2 + var(--sc-pad-x))) !important;
    box-sizing: border-box;
    font-family: var(--sc-font-display);
    background:
        radial-gradient(70% 160% at 8% 0%, rgba(37, 99, 235, 0.38) 0%, rgba(37, 99, 235, 0) 60%),
        radial-gradient(50% 160% at 92% 100%, rgba(5, 150, 105, 0.22) 0%, rgba(5, 150, 105, 0) 60%),
        linear-gradient(180deg, #0f2238 0%, #0b1a2c 100%) !important;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.06) !important;
    transition: background 0.3s var(--sc-ease), box-shadow 0.3s var(--sc-ease) !important;
}

body #frontNav::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, rgba(5, 150, 105, 0) 0%, rgba(5, 150, 105, 0.7) 22%, rgba(255, 208, 0, 0.75) 50%, rgba(255, 136, 62, 0.7) 78%, rgba(255, 136, 62, 0) 100%);
    opacity: 0.9;
    pointer-events: none;
}

html[lang="en-GB"] body #frontNav::after {
    background: linear-gradient(90deg, rgba(1, 33, 105, 0) 0%, rgba(96, 165, 250, 0.7) 22%, rgba(255, 255, 255, 0.8) 50%, rgba(200, 16, 46, 0.7) 78%, rgba(200, 16, 46, 0) 100%);
}

@media only screen and (min-width: 1201px) {
    /* scrolled: the bar stays fully opaque (a translucent bar over moving
       content made the menu read blurred), only the shadow deepens */
    body #frontNav.is-scrolled {
        box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.06), 0 18px 40px -26px rgba(0, 0, 0, 0.75) !important;
    }
}

#frontNav .logoMainLink {
    display: inline-flex;
    align-items: center;
    border-radius: 12px;
    outline: 0;
}

#frontNav .logoMainLink:focus-visible {
    box-shadow: 0 0 0 3px rgba(255, 208, 0, 0.55);
}

#frontNav #mainLogo {
    display: flex;
    align-items: center;
}

/* Menu items: the display face, small caps tracking, a gold underline that
   grows from the centre. The FAQ item keeps its gold attention colour. */
@media only screen and (min-width: 1201px) {
    #frontNav #navMenu {
        display: flex;
        align-items: center;
        justify-content: center;
        column-gap: clamp(4px, 0.6vw, 12px);
    }
}

#frontNav,
#frontNav .navItem,
#frontNav a {
    font-family: var(--sc-font-display) !important;
}

#frontNav .hover-underline-animation {
    position: relative;
    display: inline-block;
    color: rgba(255, 255, 255, 0.84);
    text-decoration: none;
    border-radius: 12px;
    outline: 0;
    transition: color 0.2s var(--sc-ease), background 0.25s var(--sc-ease), box-shadow 0.25s var(--sc-ease);
}

#frontNav .hover-underline-animation:hover,
#frontNav .hover-underline-animation:focus-visible {
    background: rgba(255, 255, 255, 0.07);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

/* one hover state only: the glass pill and white type. The legacy sheet's
   sliding underline (and any second line) is switched off. */
#frontNav .hover-underline-animation::after,
#frontNav .hover-underline-animation::before {
    display: none !important;
}

#frontNav .hover-underline-animation:hover,
#frontNav .hover-underline-animation:focus-visible {
    color: #ffffff;
}

#frontNav .navItem {
    padding: 13px 16px;
    font-size: calc(13.5px * var(--sc-nav-scale));
    font-weight: 800;
    letter-spacing: 0.07em;
    line-height: 1;
    text-transform: uppercase;
    color: inherit;
    white-space: nowrap;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

#frontNav .navItem.menuColor {
    color: inherit;
}

#frontNav #attentionItem {
    color: var(--sc-gold);
}

/* Login and Register: the two pills of the site. The blade used to carry
   their look inline with mouse handlers; the classes own it now. */
#frontNav #loginMenu {
    display: flex;
    align-items: center;
    column-gap: 12px;
    padding-right: 0;
}

#frontNav .frontNav-login-btn,
#frontNav .frontNav-register-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: calc(44px * var(--sc-nav-scale));
    padding: 0 calc(22px * var(--sc-nav-scale));
    border-radius: 999px;
    font-family: var(--sc-font-display) !important;
    font-size: calc(15px * var(--sc-nav-scale));
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
    box-sizing: border-box;
    cursor: pointer;
    outline: 0;
    transition: transform 0.25s var(--sc-ease), box-shadow 0.25s var(--sc-ease), background 0.25s var(--sc-ease), border-color 0.25s var(--sc-ease), color 0.25s var(--sc-ease);
}

#frontNav .frontNav-login-btn svg,
#frontNav .frontNav-register-btn svg {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
}

#frontNav .frontNav-login-btn {
    color: #0a0a0a;
    background: linear-gradient(135deg, #ffe45c 0%, var(--sc-gold) 60%, #ffb800 100%);
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 12px 26px -14px rgba(255, 190, 0, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.55), inset 0 -1px 0 rgba(0, 0, 0, 0.06);
}

#frontNav .frontNav-login-btn:hover,
#frontNav .frontNav-login-btn:focus-visible {
    background: linear-gradient(135deg, #fff07a 0%, #ffd91a 100%);
    transform: translateY(-2px);
    box-shadow: 0 16px 30px -14px rgba(255, 208, 0, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

#frontNav .frontNav-register-btn {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.55);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#frontNav .frontNav-register-btn:hover,
#frontNav .frontNav-register-btn:focus-visible {
    background: rgba(255, 255, 255, 0.14);
    border-color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px -18px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

#frontNav .frontNav-login-btn:focus-visible,
#frontNav .frontNav-register-btn:focus-visible {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35);
}

#frontNav #hamButton {
    color: rgba(255, 255, 255, 0.92);
    border-radius: 10px;
}

@media only screen and (max-width: 1200px) {
    body #frontNav {
        min-height: 0;
        height: 60px !important;
        padding: 0 12px !important;
        background: var(--sc-navy) !important;
    }

    #frontNav .frontNav-login-btn,
    #frontNav .frontNav-register-btn {
        height: 40px;
        padding: 0 16px;
        font-size: 14px;
    }
}

@media only screen and (max-width: 480px) {
    #frontNav .frontNav-register-btn {
        display: none;
    }
}

/* ==========================================================================
   2. Trust strip under the navigation: a light ledge under the deep bar.
   The original palette (teal-navy type and marks on the soft blue-mint
   gradient) stays; the four proofs sit in one calm row divided by hairlines,
   no tiles, no chips.
   ========================================================================== */

.subNavContainer {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0 !important;
    --subnav-brand: #003049;
    background:
        radial-gradient(1200px 600px at 10% -10%, #d7eefc 0%, transparent 60%),
        radial-gradient(900px 500px at 110% 20%, #e6fff0 0%, transparent 55%),
        linear-gradient(180deg, #fbfdfe 0%, #eef3f7 100%) !important;
    border-top: 0 !important;
    border-bottom: 1px solid rgba(0, 48, 73, 0.1) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 10px 30px -24px rgba(0, 48, 73, 0.45);
    font-family: var(--sc-font-body) !important;
    overflow: hidden;
}

body .subNavContainer .subInnerNav {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: center;
    gap: 0;
    width: 100%;
    max-width: var(--sc-measure);
    min-height: calc(50px * var(--sc-nav-scale));
    margin: 0 auto;
    padding: 0 var(--sc-pad-x);
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
}

.subNavContainer .subNavElement {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 clamp(20px, 2.4vw, 40px);
    flex: 0 0 auto;
}

/* a hairline between neighbours, fading at both ends */
.subNavContainer .subNavElement + .subNavElement::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 22px;
    transform: translateY(-50%);
    background: linear-gradient(180deg, rgba(0, 48, 73, 0) 0%, rgba(0, 48, 73, 0.22) 50%, rgba(0, 48, 73, 0) 100%);
}

/* the team page keeps its signature line under the strip */
.subNavContainer.subNav--irishLine {
    padding-bottom: 4px !important;
    border-bottom: 0 !important;
}

/* every mark is a 20px teal-navy glyph, no plate behind it (inline marks
   keep their own fill or stroke: the shamrock is filled, the single-course
   platforms draw a stroked glyph) */
.subNavContainer .subNavSvg,
.subNavContainer .subNavImg,
.subNavContainer .subNavIcon {
    display: inline-grid;
    place-items: center;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    padding: 0;
    border-radius: 0;
    background: none;
    color: var(--subnav-brand);
    box-sizing: border-box;
}

.subNavContainer .subNavIcon svg {
    width: 20px;
    height: 20px;
    stroke-width: 2;
}

.subNavContainer .subNavImg {
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(16%) sepia(40%) saturate(1556%) hue-rotate(166deg) brightness(89%) contrast(102%);
}

.subNavContainer .subNavText {
    font-family: var(--sc-font-body) !important;
    font-size: calc(14px * var(--sc-scale));
    font-weight: 600;
    letter-spacing: 0.005em;
    line-height: 1.2;
    color: var(--subnav-brand);
}

/* the mobile strip (swiper) takes the same palette, every slide centred */
.subNavMobile {
    --subnav-brand: #003049;
    font-family: var(--sc-font-body) !important;
    background:
        radial-gradient(900px 400px at 10% -10%, #d7eefc 0%, transparent 60%),
        radial-gradient(700px 400px at 110% 20%, #e6fff0 0%, transparent 55%),
        linear-gradient(180deg, #fbfdfe 0%, #eef3f7 100%) !important;
    border-bottom: 1px solid rgba(0, 48, 73, 0.1) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* one fixed height for the strip, the wrapper and every slide, so the row
   is centred whatever the legacy sheets say about heights */
body .subNavMobile {
    height: 48px !important;
    min-height: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
    align-items: center;
    overflow: hidden;
}

body .subNavMobile .swiper-wrapper {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    align-items: center;
}

body .subNavMobile .swiper-slide {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    height: 100% !important;
}

body .subNavMobile .subNavElement {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin: 0 auto;
    padding: 0;
    white-space: nowrap;
    color: var(--subnav-brand);
}

/* the label in the site face, the desktop strip's weight and size */
body .subNavMobile .subNavElement span:not(.subNavIcon) {
    font-family: var(--sc-font-body) !important;
    font-size: 14.5px;
    font-weight: 600;
    letter-spacing: 0.005em;
    line-height: 1.2;
    color: var(--subnav-brand);
}

.subNavMobile .subNavImg,
.subNavMobile .subNavSvg,
.subNavMobile .subNavIcon {
    display: inline-grid;
    place-items: center;
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    padding: 0;
    border-radius: 0;
    background: none;
    color: var(--subnav-brand);
    box-sizing: border-box;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(16%) sepia(40%) saturate(1556%) hue-rotate(166deg) brightness(89%) contrast(102%);
}

.subNavMobile .subNavIcon,
.subNavMobile .subNavSvg {
    filter: none;
}

.subNavMobile .subNavIcon svg {
    width: 19px;
    height: 19px;
    stroke-width: 2;
}

/* ==========================================================================
   3. Partner showcase: the head on the measure, two rows of logo cards
   running in opposite directions from one edge of the screen to the other,
   continuously (a requestAnimationFrame loop in registerInclude; nothing
   reacts to the pointer), on a lit stage.
   ========================================================================== */

/* the legacy sheet boxes the whole section to a max-width; here it is the
   full band, the head on the measure, the strips edge to edge */
body .partner-showcase {
    position: relative;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: calc(76px * var(--sc-scale)) 0 calc(84px * var(--sc-scale));
    box-sizing: border-box;
    background:
        radial-gradient(60% 70% at 50% 78%, rgba(37, 99, 235, 0.07) 0%, rgba(37, 99, 235, 0) 70%),
        radial-gradient(40% 60% at 12% 90%, rgba(5, 150, 105, 0.06) 0%, rgba(5, 150, 105, 0) 70%),
        radial-gradient(40% 60% at 88% 90%, rgba(251, 191, 36, 0.07) 0%, rgba(251, 191, 36, 0) 70%),
        linear-gradient(180deg, #ffffff 0%, #f5f8fe 100%);
    overflow: hidden;
}

.partner-showcase .partner-head {
    width: 100%;
    max-width: var(--sc-measure);
    margin: 0 auto calc(40px * var(--sc-scale));
    padding: 0 var(--sc-pad-x);
    box-sizing: border-box;
    text-align: center;
}

.partner-showcase .partner-title {
    margin: 0;
    font-family: var(--sc-font-display) !important;
    font-size: clamp(26px, 2.6vw, calc(34px * var(--sc-scale)));
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--sc-ink);
    text-wrap: balance;
}

.partner-showcase .logo-rows {
    display: grid;
    gap: calc(18px * var(--sc-scale));
}

/* each strip runs from one edge of the screen to the other, fading at the
   ends; the motion is on the track's transform, written by the script */
body .partner-showcase .logo-strip {
    position: relative;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 6px 0;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
    overflow: hidden;
}

body .partner-showcase .logo-strip .logos-track {
    animation: none !important;
    will-change: transform;
}

.partner-showcase .logo-card {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    position: relative;
    width: auto;
    min-width: calc(150px * var(--sc-scale));
    height: calc(88px * var(--sc-scale));
    padding: 0 calc(26px * var(--sc-scale));
    box-sizing: border-box;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcfe 100%);
    border: 1px solid rgba(30, 58, 138, 0.08);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 10px 30px -24px rgba(11, 18, 32, 0.4);
    overflow: hidden;
    transition: none;
    pointer-events: none;
}

.partner-showcase .logo-card img {
    display: block;
    width: auto;
    height: auto;
    max-width: calc(170px * var(--sc-scale));
    max-height: calc(46px * var(--sc-scale));
    object-fit: contain;
    transition: none;
}

/* nothing reacts to the pointer: the legacy sheet's lift and shadow and
   its own pseudo elements are switched off */
.partner-showcase .logo-card:hover,
.partner-showcase .logo-card:focus-visible {
    transform: none;
    border-color: rgba(30, 58, 138, 0.08);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 10px 30px -24px rgba(11, 18, 32, 0.4);
}

.partner-showcase .logo-card:hover img {
    transform: none;
}

.partner-showcase .logo-card::before {
    display: none;
}

/* the strips are a picture, not a control */
body .partner-showcase .logo-strip {
    cursor: default;
}

@media (max-width: 768px) {
    .partner-showcase .logo-rows {
        gap: 12px;
    }

    .partner-showcase .logo-card {
        min-width: 132px;
        height: 72px;
        padding: 0 18px;
        border-radius: 14px;
    }

    .partner-showcase .logo-card img {
        max-width: 132px;
        max-height: 38px;
    }
}

@media (prefers-reduced-motion: reduce) {
    /* no motion: the rows stay put and can be scrolled by hand */
    body .partner-showcase .logo-strip {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-mask-image: none;
        mask-image: none;
        scrollbar-width: thin;
    }
}

/* ==========================================================================
   4. Register call to action: one deep band from edge to edge, an aurora
   that drifts, a lantern: a cool light exactly under the pointer and a warm
   gold light trailing it with inertia (site-chrome.js writes --sc-mx/--sc-my
   and --sc-lx/--sc-ly), a fine dot field the light reveals, bokeh leaning
   with the pointer, the orange arrow pill of the page heroes.
   ========================================================================== */

/* a deep band from edge to edge; the content sits on the measure */
body .register-cta {
    position: relative;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    isolation: isolate;
    overflow: hidden;
    border-radius: 0;
    background: var(--sc-plate);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
    --sc-mx: 50%;
    --sc-my: 40%;
    --sc-lx: 50%;
    --sc-ly: 40%;
}

.register-cta .register-cta__background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

/* a still diagonal sheen across the plate */
.register-cta .register-cta__background {
    background: linear-gradient(112deg, rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, 0.035) 50%, rgba(255, 255, 255, 0) 62%);
}

/* aurora: two large soft lights drifting slowly across the plate */
.register-cta .register-cta__gradient {
    position: absolute;
    inset: -30%;
    background:
        radial-gradient(38% 46% at 22% 30%, rgba(37, 99, 235, 0.55) 0%, rgba(37, 99, 235, 0) 70%),
        radial-gradient(34% 44% at 78% 72%, rgba(5, 150, 105, 0.42) 0%, rgba(5, 150, 105, 0) 70%),
        radial-gradient(28% 36% at 62% 18%, rgba(251, 191, 36, 0.22) 0%, rgba(251, 191, 36, 0) 70%);
    filter: blur(18px);
    animation: sc-aurora 26s ease-in-out infinite alternate;
    opacity: 1;
}

@keyframes sc-aurora {
    0% { transform: translate3d(-4%, -3%, 0) rotate(0deg) scale(1); }
    50% { transform: translate3d(3%, 4%, 0) rotate(6deg) scale(1.06); }
    100% { transform: translate3d(-2%, 5%, 0) rotate(-4deg) scale(1.02); }
}

/* the field of stars: a canvas site-chrome.js draws (the stars around the
   pointer grow, brighten and warm; a few twinkle at rest) */
.register-cta .register-cta__stars {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    pointer-events: none;
}

.register-cta.has-stars .register-cta__background::before {
    display: none;
}

/* the fallback field when there is no canvas: dots the lantern reveals */
.register-cta .register-cta__background::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255, 255, 255, 0.7) 1.4px, transparent 2.2px);
    background-size: 26px 26px;
    background-position: 13px 13px;
    -webkit-mask-image: radial-gradient(340px 340px at var(--sc-mx) var(--sc-my), #000 0%, rgba(0, 0, 0, 0.3) 45%, transparent 72%);
    mask-image: radial-gradient(340px 340px at var(--sc-mx) var(--sc-my), #000 0%, rgba(0, 0, 0, 0.3) 45%, transparent 72%);
    opacity: 0;
    transition: opacity 0.5s var(--sc-ease);
}

/* the lantern: a cool light under the pointer, a warm gold light that
   trails it (site-chrome.js closes the gap a little every frame) */
.register-cta .register-cta__background::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(90px 90px at var(--sc-mx) var(--sc-my), rgba(255, 255, 255, 0.16) 0%, transparent 70%),
        radial-gradient(560px 560px at var(--sc-mx) var(--sc-my), rgba(147, 197, 253, 0.18) 0%, rgba(147, 197, 253, 0.06) 35%, transparent 68%),
        radial-gradient(420px 420px at var(--sc-lx) var(--sc-ly), rgba(251, 191, 36, 0.22) 0%, rgba(251, 146, 60, 0.07) 40%, transparent 70%);
    mix-blend-mode: screen;
    opacity: 0;
    transition: opacity 0.5s var(--sc-ease);
}

.register-cta.is-lit .register-cta__background::before,
.register-cta.is-lit .register-cta__background::after {
    opacity: 1;
}

/* the old particles become bokeh: soft discs of different sizes, blurred,
   drifting slowly, the whole field leaning a little with the pointer
   (site-chrome.js writes --sc-px / --sc-py from -1 to 1) */
.register-cta .register-cta__particles {
    position: absolute;
    inset: 0;
    transform: translate3d(calc(var(--sc-px, 0) * 14px), calc(var(--sc-py, 0) * 10px), 0);
    transition: transform 0.6s var(--sc-ease);
    pointer-events: none;
}

.register-cta .register-cta__particles span {
    position: absolute;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.12) 55%, rgba(255, 255, 255, 0) 72%);
    filter: blur(6px);
    opacity: 0;
    animation: sc-orb 18s ease-in-out infinite;
}

.register-cta .register-cta__particles span:nth-child(1) { left: 10%; top: 68%; animation-delay: 0s; width: 64px; height: 64px; filter: blur(10px); }
.register-cta .register-cta__particles span:nth-child(2) { left: 26%; top: 20%; animation-delay: 3.5s; width: 28px; height: 28px; filter: blur(4px); }
.register-cta .register-cta__particles span:nth-child(3) { left: 60%; top: 78%; animation-delay: 7s; width: 36px; height: 36px; background: radial-gradient(circle, rgba(255, 214, 102, 0.5) 0%, rgba(255, 214, 102, 0.1) 55%, rgba(255, 214, 102, 0) 72%); }
.register-cta .register-cta__particles span:nth-child(4) { left: 78%; top: 16%; animation-delay: 10.5s; width: 54px; height: 54px; filter: blur(9px); }
.register-cta .register-cta__particles span:nth-child(5) { left: 90%; top: 58%; animation-delay: 14s; width: 24px; height: 24px; filter: blur(3px); }

@keyframes sc-orb {
    0%, 100% { transform: translate3d(0, 0, 0) scale(0.9); opacity: 0; }
    18% { opacity: 0.85; }
    50% { transform: translate3d(18px, -44px, 0) scale(1.08); opacity: 0.55; }
    82% { opacity: 0.85; }
}

/* a light disc breathing behind the words */
.register-cta .register-cta__content::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 46%;
    z-index: -1;
    width: min(760px, 90vw);
    height: 380px;
    transform: translate(-50%, -50%);
    background: radial-gradient(50% 50% at 50% 50%, rgba(56, 130, 246, 0.28) 0%, rgba(56, 130, 246, 0.08) 45%, rgba(56, 130, 246, 0) 72%);
    filter: blur(14px);
    animation: sc-breathe 9s ease-in-out infinite;
    pointer-events: none;
}

@keyframes sc-breathe {
    0%, 100% { transform: translate(-50%, -50%) scale(0.94); opacity: 0.85; }
    50% { transform: translate(-50%, -50%) scale(1.06); opacity: 1; }
}

.register-cta .register-cta__content {
    position: relative;
    z-index: 1;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: calc(940px * var(--sc-scale));
    margin: 0 auto;
    padding: calc(96px * var(--sc-scale)) var(--sc-pad-x) calc(100px * var(--sc-scale));
    box-sizing: border-box;
}

.register-cta .register-cta__title {
    margin: 0;
    font-family: var(--sc-font-display) !important;
    font-size: clamp(34px, 3.6vw, calc(50px * var(--sc-scale)));
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.028em;
    color: #ffffff;
    text-wrap: balance;
    /* a quiet metal: white into a pale gold at the baseline. The fill is
       clipped to the box, so the box takes padding for the descenders and
       gives it back as margin */
    padding: 0.14em 0.12em;
    margin: -0.14em -0.12em;
    background: linear-gradient(180deg, #ffffff 0%, #f3f6ff 56%, #ffedc2 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none;
    overflow: visible;
}

.register-cta .register-cta__subtitle {
    margin: calc(20px * var(--sc-scale)) 0 0;
    max-width: none;
    font-family: var(--sc-font-body) !important;
    font-size: calc(18.5px * var(--sc-scale));
    font-weight: 500;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.82);
}

/* the sentence is short: on desktop it stays on one line */
@media (min-width: 900px) {
    .register-cta .register-cta__subtitle {
        white-space: nowrap;
    }
}

/* the orange arrow pill of the page heroes, with the deep navy ripple on hover */
.register-cta .register-cta__button {
    --btn-glow-x: 50%;
    --btn-glow-y: 50%;
    --btn-glow-opacity: 0;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: calc(58px * var(--sc-scale));
    margin-top: calc(34px * var(--sc-scale));
    padding: 0 calc(34px * var(--sc-scale));
    border-radius: 999px;
    overflow: hidden;
    font-family: var(--sc-font-display) !important;
    font-size: calc(16.5px * var(--sc-scale));
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 1;
    color: #ffffff;
    text-decoration: none;
    background: linear-gradient(135deg, #ff8a1f 0%, #f26a00 100%);
    border: 0;
    box-shadow: 0 18px 40px -18px rgba(242, 106, 0, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    transform: translate3d(var(--sc-bx, 0px), var(--sc-by, 0px), 0);
    transition: transform 0.35s var(--sc-ease), box-shadow 0.3s var(--sc-ease), background 0.3s var(--sc-ease);
    will-change: transform;
    animation: sc-pill-glow 3.6s ease-in-out infinite;
}

@keyframes sc-pill-glow {
    0%, 100% { box-shadow: 0 18px 40px -18px rgba(242, 106, 0, 0.85), 0 0 0 0 rgba(255, 138, 31, 0.0), inset 0 1px 0 rgba(255, 255, 255, 0.35); }
    50% { box-shadow: 0 22px 48px -18px rgba(242, 106, 0, 0.95), 0 0 0 10px rgba(255, 138, 31, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.4); }
}

.register-cta .register-cta__button:hover,
.register-cta .register-cta__button:focus-visible {
    animation: none;
}

.register-cta .register-cta__button::before {
    content: '';
    position: absolute;
    left: var(--btn-glow-x);
    top: var(--btn-glow-y);
    width: 220%;
    padding-top: 220%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 60%);
    transform: translate(-50%, -50%);
    opacity: var(--btn-glow-opacity);
    transition: opacity 0.3s var(--sc-ease);
    pointer-events: none;
}

/* on hover the pill turns white with navy type: the strongest contrast the
   deep plate allows, with the pointer glow still breathing underneath */
.register-cta .register-cta__button:hover,
.register-cta .register-cta__button:focus-visible {
    color: #0b1f3a;
    background: linear-gradient(135deg, #ffffff 0%, #f1f5ff 100%);
    box-shadow: 0 24px 50px -20px rgba(255, 255, 255, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 0 0 1px rgba(255, 255, 255, 0.5);
}

.register-cta .register-cta__button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.45);
}

.register-cta .register-cta__button::after {
    display: none !important;
}

.register-cta .register-cta__button:hover {
    transform: translate3d(var(--sc-bx, 0px), var(--sc-by, 0px), 0) scale(1.03);
    border-color: transparent;
}

.register-cta .register-cta__button .register-cta__button-text {
    position: relative;
    z-index: 1;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
}

.register-cta .btn-ripple {
    z-index: 0 !important;
}

/* the national mark on the plate: gold leaf (Ireland) or pale crown (UK) */
html[lang="en-IE"] .register-cta::after,
html[lang="en-GB"] .register-cta::after {
    content: '';
    position: absolute;
    left: max(-52px, calc((100% - var(--sc-measure)) / 2 - 52px));
    right: auto;
    bottom: -64px;
    z-index: 0;
    width: 300px;
    height: 300px;
    opacity: 0.06;
    pointer-events: none;
}

html[lang="en-IE"] .register-cta::after {
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g fill='%23f8e7ab'><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z'/><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z' transform='rotate(90 50 50)'/><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z' transform='rotate(270 50 50)'/><path d='M50 50C52 62 50 70 58 80 51 76 46 68 47 55Z'/></g></svg>") no-repeat center / contain;
    transform: rotate(12deg);
}

html[lang="en-GB"] .register-cta::after {
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='%23f8e7ab'><path d='M5 16 3.2 6.6a.5.5 0 0 1 .8-.5L8.6 9.6 11.56 4.3a.5.5 0 0 1 .88 0l2.96 5.3 4.6-3.5a.5.5 0 0 1 .8.5L19 16H5Z'/><path d='M5.2 17.6h13.6a.9.9 0 0 1 .9.9v.8a.9.9 0 0 1-.9.9H5.2a.9.9 0 0 1-.9-.9v-.8a.9.9 0 0 1 .9-.9Z'/></g></svg>") no-repeat center / contain;
    transform: rotate(8deg);
}

@media (max-width: 768px) {
    .register-cta .register-cta__content {
        padding: 64px 22px 68px;
    }

    .register-cta .register-cta__button {
        width: 100%;
        max-width: 360px;
        margin-top: 26px;
    }

    html[lang="en-IE"] .register-cta::after,
    html[lang="en-GB"] .register-cta::after {
        width: 220px;
        height: 220px;
        left: -40px;
        right: auto;
        bottom: -48px;
    }
}

/* ==========================================================================
   5. Footer: light. The page canvas deepens into a soft blue-lavender-mint
   gradient, the national hairline runs along the top, and the five columns
   sit on one large white glass plate in the measure, the way every card on
   the site is built. Ink headings, quiet links that turn royal blue with
   one thin line, the payment proofs in their own colours straight on the
   glass, the national mark faint in the plate's corner, a hairline and the
   copyright under it.
   ========================================================================== */

body .footer-wrapper {
    position: relative;
    padding: calc(72px * var(--sc-scale)) 0 0 !important;
    font-family: var(--sc-font-body) !important;
    color: var(--sc-ink-2);
    background:
        radial-gradient(60% 70% at 100% 0%, rgba(191, 219, 254, 0.55) 0%, rgba(191, 219, 254, 0) 70%),
        radial-gradient(50% 60% at 0% 100%, rgba(167, 243, 208, 0.4) 0%, rgba(167, 243, 208, 0) 70%),
        radial-gradient(40% 50% at 50% 100%, rgba(221, 214, 254, 0.35) 0%, rgba(221, 214, 254, 0) 70%),
        linear-gradient(180deg, #f6f8fe 0%, #ecf1fb 55%, #e4ecf8 100%) !important;
    overflow: hidden;
}

/* the hairline: tricolour on Irish platforms, Union colours on UK ones */
body .footer-wrapper::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    z-index: 2;
    background: linear-gradient(90deg, var(--sc-green) 0%, var(--sc-green) 33.33%, #ffffff 33.33%, #ffffff 66.66%, #ff883e 66.66%, #ff883e 100%);
}

html[lang="en-GB"] body .footer-wrapper::before {
    background: linear-gradient(90deg, #012169 0%, #012169 33.33%, #ffffff 33.33%, #ffffff 66.66%, #c8102e 66.66%, #c8102e 100%);
}

body .footer-wrapper::after {
    display: none;
}

/* the glass plate */
body .footer-wrapper .footer-container {
    position: relative;
    z-index: 1;
    width: calc(100% - 2 * var(--sc-pad-x));
    max-width: calc(var(--sc-measure) - 2 * var(--sc-pad-x));
    margin: 0 auto;
    padding: calc(44px * var(--sc-scale)) calc(40px * var(--sc-scale)) calc(46px * var(--sc-scale));
    box-sizing: border-box;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, max-content)) minmax(0, max-content);
    justify-content: space-between;
    gap: clamp(16px, 2vw, 34px);
    border-radius: var(--sc-radius);
    background: rgba(255, 255, 255, 0.78);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
    border: 1px solid rgba(255, 255, 255, 0.95);
    box-shadow: 0 0 0 1px var(--sc-line), var(--sc-shadow);
    overflow: hidden;
}

body .footer-wrapper .footer-container:has(> .footer-section:nth-child(4):last-child) {
    grid-template-columns: repeat(3, minmax(0, max-content)) minmax(0, max-content);
}

/* the national mark, faint, in the plate's corner */
html[lang="en-IE"] body .footer-wrapper .footer-container::after,
html[lang="en-GB"] body .footer-wrapper .footer-container::after {
    content: '';
    position: absolute;
    right: -34px;
    bottom: -46px;
    width: 200px;
    height: 200px;
    opacity: 0.06;
    pointer-events: none;
}

html[lang="en-IE"] body .footer-wrapper .footer-container::after {
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g fill='%23169B62'><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z'/><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z' transform='rotate(90 50 50)'/><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z' transform='rotate(270 50 50)'/><path d='M50 50C52 62 50 70 58 80 51 76 46 68 47 55Z'/></g></svg>") no-repeat center / contain;
    transform: rotate(-14deg);
}

html[lang="en-GB"] body .footer-wrapper .footer-container::after {
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='%23d97706'><path d='M5 16 3.2 6.6a.5.5 0 0 1 .8-.5L8.6 9.6 11.56 4.3a.5.5 0 0 1 .88 0l2.96 5.3 4.6-3.5a.5.5 0 0 1 .8.5L19 16H5Z'/><path d='M5.2 17.6h13.6a.9.9 0 0 1 .9.9v.8a.9.9 0 0 1-.9.9H5.2a.9.9 0 0 1-.9-.9v-.8a.9.9 0 0 1 .9-.9Z'/></g></svg>") no-repeat center / contain;
    transform: rotate(-8deg);
}

body .footer-wrapper .footer-section {
    position: relative;
    z-index: 1;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

body .footer-wrapper .footer-section .footer-heading {
    margin: 0 0 calc(18px * var(--sc-scale));
    padding: 0;
    font-family: var(--sc-font-display) !important;
    font-size: calc(13px * var(--sc-scale));
    font-weight: 800;
    letter-spacing: 0.1em;
    line-height: 1.3;
    text-transform: uppercase;
    color: var(--sc-ink);
}

body .footer-wrapper .footer-heading::after {
    display: none;
}

body .footer-wrapper .footer-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

body .footer-wrapper .footer-section .footer-item {
    margin: 0 0 calc(11px * var(--sc-scale));
    font-size: calc(15.5px * var(--sc-scale));
    font-weight: 500;
    line-height: 1.5;
    color: var(--sc-ink-2);
}

/* one hover line only: the legacy sheet's background-image line is off */
body .footer-wrapper .footer-link,
body .footer-wrapper .footer-link:link,
body .footer-wrapper .footer-link:visited {
    position: relative;
    display: inline-block;
    padding-bottom: 0;
    color: var(--sc-ink-2);
    font-weight: 500;
    text-decoration: none !important;
    background-image: none !important;
    transition: color 0.2s var(--sc-ease);
}

body .footer-wrapper .footer-link::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -3px;
    height: 1px;
    background: var(--sc-blue-deep);
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform 0.25s var(--sc-ease);
}

body .footer-wrapper .footer-link:hover,
body .footer-wrapper .footer-link:focus-visible {
    color: var(--sc-blue-deep);
    background-image: none !important;
    outline: 0;
}

body .footer-wrapper .footer-link:hover::after,
body .footer-wrapper .footer-link:focus-visible::after {
    transform: scaleX(1);
}

/* buyer protection: caption, proof, caption, proof in one rhythm; the proofs
   in their own colours straight on the glass, no chips */
body .footer-wrapper .footer-protection .note-line {
    margin: 0 0 calc(10px * var(--sc-scale));
    font-size: calc(13.5px * var(--sc-scale));
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.4;
    color: var(--sc-ink-3);
}

body .footer-wrapper .footer-protection .logos-line {
    margin: 0 0 calc(26px * var(--sc-scale));
    line-height: 0;
}

body .footer-wrapper .footer-protection .logos-line:last-child {
    margin-bottom: 0;
}

body .footer-wrapper .footer-protection .stripe-line .footerStripe {
    display: block;
    height: calc(36px * var(--sc-scale));
    width: auto;
    max-width: none;
    filter: none;
    opacity: 1;
}

body .footer-wrapper .footer-protection .cards-logos {
    display: flex;
    align-items: center;
    gap: calc(14px * var(--sc-scale));
    flex-wrap: nowrap;
}

body .footer-wrapper .footer-protection .cards-logos .card-logo {
    display: block;
    height: calc(22px * var(--sc-scale));
    width: auto;
    filter: none;
    opacity: 1;
}

body .footer-wrapper .footer-bottom {
    position: relative;
    z-index: 1;
    margin-top: calc(40px * var(--sc-scale));
    padding: calc(22px * var(--sc-scale)) var(--sc-pad-x);
    border-top: 1px solid var(--sc-line);
    background: rgba(255, 255, 255, 0.35);
    text-align: center;
}

body .footer-wrapper .footer-bottom p.footer-text {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px 8px;
    max-width: none;
    margin: 0;
    font-family: var(--sc-font-body) !important;
    font-size: calc(14px * var(--sc-scale));
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.01em;
    color: var(--sc-ink-3);
}

body .footer-wrapper .footer-text .irelandFlag,
body .footer-wrapper .footer-text .ukFlag {
    height: 14px;
    width: auto;
    border-radius: 2px;
    vertical-align: middle;
}

@media (max-width: 1024px) {
    body .footer-wrapper .footer-container,
    body .footer-wrapper .footer-container:has(> .footer-section:nth-child(4):last-child) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 36px 28px;
        padding: 36px 32px;
    }
}

@media (max-width: 640px) {
    body .footer-wrapper {
        padding-top: 48px !important;
    }

    body .footer-wrapper .footer-container,
    body .footer-wrapper .footer-container:has(> .footer-section:nth-child(4):last-child) {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
        padding: 28px 22px;
        border-radius: 22px;
    }

    body .footer-wrapper .footer-section .footer-item {
        margin-bottom: 8px;
    }

    body .footer-wrapper .footer-bottom {
        margin-top: 32px;
    }

    body .footer-wrapper .footer-bottom {
        padding: 20px 16px 24px;
        background: rgba(255, 255, 255, 0.45);
    }

    /* two intentional lines: the year, flag and company on the first, the
       rights on the second (the markup's own break). The first line does
       not wrap; the size follows the viewport so it fits from 340px up */
    body .footer-wrapper .footer-bottom p.footer-text {
        display: block;
        max-width: none;
        margin: 0 auto;
        text-align: center;
        font-size: clamp(11.5px, 3.3vw, 13px);
        line-height: 1.9;
        white-space: nowrap;
    }

    body .footer-wrapper .footer-text .irelandFlag,
    body .footer-wrapper .footer-text .ukFlag {
        display: inline-block;
        height: 12px;
        width: auto;
        margin: 0 3px;
        vertical-align: -1px;
        border-radius: 2px;
        box-shadow: 0 0 0 1px rgba(11, 18, 32, 0.08);
    }

    body .footer-wrapper .footer-text .mobile-break {
        display: inline;
    }

    html[lang="en-IE"] body .footer-wrapper .footer-container::after,
    html[lang="en-GB"] body .footer-wrapper .footer-container::after {
        width: 150px;
        height: 150px;
        right: -30px;
        bottom: -40px;
    }
}

@media (max-width: 339px) {
    body .footer-wrapper .footer-bottom p.footer-text {
        white-space: normal;
    }
}

/* ==========================================================================
   6. The mobile menu (#responsiveNav, opened by #hamButton): the deep plate
   with its blue light, the logo at the bar's size, glass rows with the icon
   in a disc, the two pills of the site, the tagline quiet at the foot, the
   national mark in the corner. The legacy sheet writes every rule with
   !important, so these do too.
   ========================================================================== */

body #responsiveNav .mobileNav-panel {
    background:
        radial-gradient(70% 50% at 8% 0%, rgba(37, 99, 235, 0.42) 0%, rgba(37, 99, 235, 0) 60%),
        radial-gradient(60% 50% at 100% 100%, rgba(5, 150, 105, 0.28) 0%, rgba(5, 150, 105, 0) 60%),
        linear-gradient(180deg, #0f2238 0%, #0b1a2c 100%) !important;
    font-family: var(--sc-font-display) !important;
}

html[lang="en-IE"] body #responsiveNav .mobileNav-panel::after,
html[lang="en-GB"] body #responsiveNav .mobileNav-panel::after {
    content: '';
    position: absolute;
    right: -40px;
    bottom: 40px;
    width: 220px;
    height: 220px;
    opacity: 0.06;
    pointer-events: none;
}

html[lang="en-IE"] body #responsiveNav .mobileNav-panel::after {
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g fill='%23f8e7ab'><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z'/><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z' transform='rotate(90 50 50)'/><path d='M50 46C41 38 33 34 33 25 33 17 41 14 46 18 48 20 49 22 50 26 51 22 52 20 54 18 59 14 67 17 67 25 67 34 59 38 50 46Z' transform='rotate(270 50 50)'/><path d='M50 50C52 62 50 70 58 80 51 76 46 68 47 55Z'/></g></svg>") no-repeat center / contain;
    transform: rotate(-14deg);
}

html[lang="en-GB"] body #responsiveNav .mobileNav-panel::after {
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><g fill='%23f8e7ab'><path d='M5 16 3.2 6.6a.5.5 0 0 1 .8-.5L8.6 9.6 11.56 4.3a.5.5 0 0 1 .88 0l2.96 5.3 4.6-3.5a.5.5 0 0 1 .8.5L19 16H5Z'/><path d='M5.2 17.6h13.6a.9.9 0 0 1 .9.9v.8a.9.9 0 0 1-.9.9H5.2a.9.9 0 0 1-.9-.9v-.8a.9.9 0 0 1 .9-.9Z'/></g></svg>") no-repeat center / contain;
    transform: rotate(-8deg);
}

body #responsiveNav .mobileNav-header {
    padding: 16px 22px 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body #responsiveNav .mobileNav-logo img {
    height: 54px !important;
    width: auto !important;
}

body #responsiveNav .mobileNav-close {
    top: 50% !important;
    right: 18px !important;
    transform: translateY(-50%) !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    background: rgba(255, 255, 255, 0.07) !important;
    color: #ffffff !important;
}

body #responsiveNav .mobileNav-links {
    padding: 14px 16px 6px !important;
}

body #responsiveNav .mobileNav-link {
    position: relative;
    gap: 14px !important;
    padding: 14px 14px !important;
    margin: 0 0 4px !important;
    border-radius: 16px !important;
    font-family: var(--sc-font-display) !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    letter-spacing: -0.005em !important;
    color: rgba(255, 255, 255, 0.9) !important;
    text-decoration: none !important;
    transition: background 0.2s var(--sc-ease) !important;
}

body #responsiveNav .mobileNav-link:hover,
body #responsiveNav .mobileNav-link:active {
    background: rgba(255, 255, 255, 0.07) !important;
}

/* the icon in a 40px disc */
body #responsiveNav .mobileNav-link svg {
    box-sizing: content-box !important;
    width: 20px !important;
    height: 20px !important;
    padding: 10px !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.82) !important;
}

body #responsiveNav .mobileNav-link--highlight {
    color: var(--sc-gold) !important;
}

body #responsiveNav .mobileNav-link--highlight svg {
    background: rgba(255, 208, 0, 0.14) !important;
    color: var(--sc-gold) !important;
}

body #responsiveNav .mobileNav-divider {
    margin: 10px 22px !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

body #responsiveNav .mobileNav-actions {
    gap: 12px !important;
    padding: 12px 22px 6px !important;
}

body #responsiveNav .mobileNav-btn {
    min-height: 54px !important;
    padding: 0 26px !important;
    border-radius: 999px !important;
    font-family: var(--sc-font-display) !important;
    font-size: 16.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.01em !important;
    text-decoration: none !important;
}

body #responsiveNav .mobileNav-btn svg {
    width: 18px !important;
    height: 18px !important;
}

body #responsiveNav .mobileNav-btn--login {
    color: #0a0a0a !important;
    background: linear-gradient(135deg, #ffe45c 0%, var(--sc-gold) 60%, #ffb800 100%) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 14px 30px -16px rgba(255, 190, 0, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
}

body #responsiveNav .mobileNav-btn--register {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
}

body #responsiveNav .mobileNav-footer {
    position: relative;
    z-index: 1;
    padding: 20px 26px 34px !important;
}

body #responsiveNav .mobileNav-footer p {
    margin: 0 auto !important;
    max-width: 280px;
    font-family: var(--sc-font-body) !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    line-height: 1.6 !important;
    text-transform: uppercase !important;
    color: rgba(255, 255, 255, 0.5) !important;
}

@media (prefers-reduced-motion: reduce) {
    .register-cta .register-cta__gradient,
    .register-cta .register-cta__particles span,
    .register-cta .register-cta__content::before,
    .register-cta .register-cta__button {
        animation: none;
    }

    .register-cta .register-cta__button,
    #frontNav .frontNav-login-btn,
    #frontNav .frontNav-register-btn,
    .partner-showcase .logo-card {
        transition: none;
    }
}