html { scroll-behavior: smooth; } body { margin: 0; font-family: 'Inter', sans-serif; color: #333333; background: #F4F7F9; } .ebc-container { width: min(1180px, calc(100% - 32px)); margin: 0 auto; } .ebc-section { padding: 80px 0; } .ebc-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #FF5733; } .ebc-eyebrow::before { content: ""; width: 28px; height: 2px; background: #FF5733; } .ebc-heading { margin: 0; font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.1; font-weight: 800; letter-spacing: -.035em; color: #104A74; } .ebc-subheading { max-width: 760px; margin: 18px auto 0; font-size: 18px; line-height: 1.7; color: #64748B; } .ebc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 14px 26px; border-radius: 10px; font-size: 15px; font-weight: 800; text-decoration: none; transition: all .2s ease; } .ebc-btn:hover { transform: translateY(-2px); } .ebc-btn-primary { color: #ffffff; background: #FF5733; box-shadow: 0 10px 25px rgba(255,87,51,.22); } .ebc-btn-primary:hover { background: #e94b2a; box-shadow: 0 14px 30px rgba(255,87,51,.28); } .ebc-btn-secondary { color: #104A74; background: #ffffff; border: 1px solid #D8E0E7; } .ebc-btn-secondary:hover { border-color: #104A74; } /* ================================
   HERO — APPLE-INSPIRED
   Keeps existing EBC colour palette
   Navy: #104A74
   Orange: #FF5733
================================ */

.ebc-hero {
    position: relative;
    overflow: hidden;
    background: #ffffff;
    color: #104A74;
}

.ebc-hero::before {
    content: "";
    position: absolute;
    width: 620px;
    height: 620px;
    right: -300px;
    top: -300px;
    border-radius: 50%;
    background: rgba(16, 74, 116, .035);
    pointer-events: none;
}

.ebc-hero::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    left: -240px;
    bottom: -260px;
    border-radius: 50%;
    background: rgba(255, 87, 51, .035);
    pointer-events: none;
}

.ebc-hero-inner {
    position: relative;
    z-index: 2;

    min-height: 700px;

    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(360px, .68fr);
    align-items: center;
    gap: 90px;

    padding: 100px 0 110px;
}

.ebc-hero-copy {
    max-width: 820px;
}

.ebc-hero .ebc-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    margin-bottom: 28px;

    color: #FF5733;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.ebc-hero .ebc-eyebrow::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #FF5733;
}

.ebc-hero h1 {
    max-width: 900px;

    margin: 0 0 34px;

    color: #104A74;

    font-size: clamp(3.7rem, 6.5vw, 6rem);
    line-height: .96;
    letter-spacing: -.065em;
    font-weight: 700;
}

.ebc-hero h1 span {
    display: block;
    margin-top: 8px;
    color: #FF5733;
}

.ebc-hero-text {
    max-width: 670px;

    margin: 0;

    color: #64748B;

    font-size: clamp(18px, 2vw, 21px);
    line-height: 1.58;
    letter-spacing: -.01em;
}

.ebc-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 38px;
}

.ebc-hero .ebc-btn {
    min-height: 52px;
    padding: 14px 24px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 800;
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}

.ebc-hero .ebc-btn:hover {
    transform: translateY(-2px);
}

.ebc-hero .ebc-btn-primary {
    color: #ffffff;
    background: #FF5733;
    box-shadow: 0 10px 28px rgba(255, 87, 51, .20);
}

.ebc-hero .ebc-btn-primary:hover {
    box-shadow: 0 14px 34px rgba(255, 87, 51, .28);
}

.ebc-hero .ebc-btn-primary span {
    transition: transform .2s ease;
}

.ebc-hero .ebc-btn-primary:hover span {
    transform: translateX(3px);
}

.ebc-hero .ebc-btn-secondary {
    color: #104A74;
    background: #ffffff;
    border: 1px solid #D8E0E7;
}

.ebc-hero .ebc-btn-secondary:hover {
    border-color: #104A74;
}

.ebc-hero-note {
    margin: 24px 0 0;

    color: #94A3B8;

    font-size: 13px;
    line-height: 1.5;
}


/* ================================
   HERO PANEL
================================ */

.ebc-hero-panel {
    position: relative;

    padding: 34px 34px 18px;

    background: rgba(248, 250, 251, .82);

    border: 1px solid rgba(16, 74, 116, .09);
    border-radius: 30px;

    box-shadow: 0 28px 70px rgba(16, 74, 116, .09);

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.ebc-hero-panel::before {
    content: "";

    position: absolute;
    top: 0;
    left: 34px;

    width: 42px;
    height: 3px;

    border-radius: 0 0 4px 4px;

    background: #FF5733;
}

.ebc-hero-panel-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 10px;
}

.ebc-hero-panel-title {
    margin: 0;

    color: #104A74;

    font-size: 13px;
    font-weight: 800;
    letter-spacing: .01em;
}

.ebc-hero-panel-mark {
    color: #A8B3C0;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
}

.ebc-hero-list {
    border-top: 1px solid #E2E8EE;
}

.ebc-hero-list-item {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 14px;

    padding: 23px 0;

    border-bottom: 1px solid #E2E8EE;
}

.ebc-hero-check {
    width: 27px;
    height: 27px;

    display: grid;
    place-items: center;

    margin-top: 1px;

    border-radius: 50%;

    background: #104A74;
    color: #ffffff;

    font-size: 12px;
    font-weight: 900;
}

.ebc-hero-list-item strong {
    display: block;

    margin-bottom: 5px;

    color: #104A74;

    font-size: 15px;
    font-weight: 800;
    letter-spacing: -.01em;
}

.ebc-hero-list-item span {
    display: block;

    color: #64748B;

    font-size: 13px;
    line-height: 1.5;
}


/* ================================
   HERO RESPONSIVE OVERRIDES
================================ */

@media (max-width: 900px) {

    .ebc-hero-inner {
        grid-template-columns: 1fr;
        min-height: auto;
        gap: 60px;
        padding: 80px 0;
    }

    .ebc-hero-copy {
        max-width: 850px;
    }

    .ebc-hero-panel {
        max-width: 680px;
    }
}

@media (max-width: 767px) {

    .ebc-hero-inner {
        padding: 68px 0 76px;
    }

    .ebc-hero h1 {
        font-size: clamp(2.9rem, 12vw, 4.2rem);
        letter-spacing: -.06em;
    }

    .ebc-hero-text {
        font-size: 17px;
    }

    .ebc-hero-actions {
        flex-direction: column;
        max-width: 320px;
    }

    .ebc-hero-actions .ebc-btn {
        width: 100%;
    }

    .ebc-hero-panel {
        padding: 30px 25px 15px;
        border-radius: 24px;
    }

    .ebc-hero-panel::before {
        left: 25px;
    }
}

@media (max-width: 520px) {

    .ebc-hero-panel {
        padding: 26px 22px 12px;
    }

    .ebc-hero-list-item {
        gap: 12px;
        padding: 21px 0;
    }
}
/* ================================ TRUST ================================ */ 
.ebc-trust { background: #ffffff; border-top: 1px solid #E8EDF1;border-bottom: 1px solid #E8EDF1; } .ebc-trust-inner { padding: 28px 0; } .ebc-trust-label { margin: 0 0 22px; text-align: center; font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #94A3B8; } .logo-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 24px; align-items: center; } .logo-container { height: 44px; display: flex; align-items: center; justify-content: center; } .logo-container img, .logo-container svg { max-width: 100%; max-height: 32px; filter: grayscale(100%); opacity: .48; transition: opacity .25s ease, filter .25s ease; } .logo-container:hover img, .logo-container:hover svg { filter: grayscale(0%); opacity: 1; } .fallback-text { display: none; font-size: 12px; font-weight: 800; color: #94A3B8; } 
/* ================================ INTRO ================================ */ 
.ebc-intro { background: #F4F7F9; text-align: center; } .ebc-section-header { margin-bottom: 48px; text-align: center; } .ebc-intro-copy { max-width: 820px; margin: 0 auto; } .ebc-intro-copy p { margin: 0; font-size: 18px; line-height: 1.75; color: #64748B; } .ebc-intro-copy p + p { margin-top: 20px; } .ebc-highlight { margin-top: 34px; padding: 24px 28px; border-left: 4px solid #FF5733; background: #ffffff; border-radius: 0 12px 12px 0; text-align: left; box-shadow: 0 8px 25px rgba(16,74,116,.05); } .ebc-highlight strong { color: #104A74; } 
/* ================================ DUAL BENEFIT ================================ */ 
.ebc-dual { background: #ffffff; } .ebc-dual-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; } .ebc-benefit-card { position: relative; padding: 38px; border: 1px solid #E2E8EE; border-radius: 20px; background: #F8FAFB; transition: transform .25s ease, box-shadow .25s ease; } .ebc-benefit-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(16,74,116,.09); } .ebc-benefit-number { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 22px; border-radius: 12px; background: #104A74; color: #ffffff; font-weight: 800; } .ebc-benefit-card:nth-child(2) .ebc-benefit-number { background: #FF5733; } .ebc-benefit-card h3 { margin: 0 0 14px; font-size: 25px; line-height: 1.2; font-weight: 800; color: #104A74; } .ebc-benefit-card p { margin: 0; font-size: 16px; line-height: 1.7; color: #64748B; } .ebc-benefit-card p + p { margin-top: 14px; } .ebc-benefit-link { display: inline-flex; margin-top: 24px; color: #104A74; font-size: 14px; font-weight: 800; text-decoration: none; } .ebc-benefit-link:hover { color: #FF5733; } 
/* ================================ COACH ================================ */ 
.ebc-coach { background: #F4F7F9; } .ebc-coach-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 64px; align-items: center; } .ebc-coach-image { position: relative; } .ebc-coach-image img { display: block; width: 100%; max-width: 440px; margin: 0 auto; border-radius: 22px; box-shadow: 0 25px 60px rgba(16,74,116,.14); } .ebc-coach-badge { position: absolute; right: 10px; bottom: -18px; padding: 16px 20px; border-radius: 14px; background: #ffffff; box-shadow: 0 12px 30px rgba(16,74,116,.12); } .ebc-coach-badge strong { display: block; color: #104A74; font-size: 14px; } .ebc-coach-badge span { display: block; margin-top: 3px; color: #64748B; font-size: 12px; } .ebc-coach-copy h2 { margin-bottom: 10px; } .ebc-coach-role { margin-bottom: 24px; font-size: 18px; font-weight: 700; color: #104A74; } .ebc-coach-copy p { margin: 0 0 18px; font-size: 16px; line-height: 1.75; color: #64748B; } .ebc-coach-copy p:last-child { color: #104A74; } 
/* ================================ FOCUS AREAS ================================ */ 
.ebc-focus { background: #ffffff; } .ebc-focus-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; } .ebc-focus-card { padding: 28px; border: 1px solid #E2E8EE; border-radius: 16px; background: #ffffff; transition: border-color .2s ease, transform .2s ease; } .ebc-focus-card:hover { border-color: #FF5733; transform: translateY(-3px); } .ebc-focus-icon { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 10px; background: #FFF1ED; color: #FF5733; font-size: 20px; font-weight: 800; } .ebc-focus-card h3 { margin: 0 0 9px; font-size: 18px; font-weight: 800; color: #104A74; } .ebc-focus-card p { margin: 0; font-size: 14px; line-height: 1.6; color: #64748B; } .ebc-focus-cta { margin-top: 38px; text-align: center; } 
/* ================================ TESTIMONIALS ================================ */ 
.ebc-testimonials { background: #F4F7F9; } .ebc-testimonial-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; } .ebc-testimonial-card { display: flex; flex-direction: column; height: 100%; padding: 30px; background: #ffffff; border: 1px solid #E4EAF0; border-radius: 18px; box-shadow: 0 8px 25px rgba(16,74,116,.04); } .ebc-stars { margin-bottom: 18px; color: #FF5733; letter-spacing: 3px; } .ebc-testimonial-card blockquote { margin: 0 0 26px; font-size: 15px; line-height: 1.7; font-style: italic; color: #475569; } .ebc-testimonial-person { display: flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 20px; border-top: 1px solid #EEF2F5; } .ebc-avatar { width: 44px; height: 44px; flex: 0 0 44px; display: grid; place-items: center; border-radius: 50%; background: #EAF2F7; color: #104A74; font-weight: 800; } .ebc-testimonial-person strong { display: block; color: #104A74; font-size: 14px; } .ebc-testimonial-person span { display: block; margin-top: 3px; font-size: 11px; line-height: 1.4; color: #94A3B8; } 
/* ================================ SERVICES ================================ */ 
/* =========================================================
   SERVICES
   Clean / centred / Apple-inspired
   Designed to work with the existing EBC stylesheet
   ========================================================= */

.ebc-services {
    position: relative;
    padding: 110px 0 120px;
    background: #ffffff;
}


/* =========================================================
   SECTION HEADER
   ========================================================= */

.ebc-services-head {
    width: 100%;
    max-width: 820px;
    margin: 0 auto 64px;

    text-align: center;
}


.ebc-services-head .ebc-eyebrow {
    display: flex;
    justify-content: center;
    align-items: center;

    margin-bottom: 20px;
}


/* Remove the left-positioned line from the global eyebrow */

.ebc-services-head .ebc-eyebrow::before {
    display: none;
}


/* Small orange line ABOVE the eyebrow */

.ebc-services-head .ebc-eyebrow::after {
    content: "";

    position: absolute;

    width: 30px;
    height: 2px;

    margin-top: -34px;

    background: #FF5733;
}


.ebc-services-head h2 {
    margin: 0 auto 22px;

    color: #104A74;

    font-size: clamp(2.8rem, 5vw, 4.4rem);
    line-height: 1;
    letter-spacing: -.055em;
    font-weight: 800;
}


.ebc-services-lead {
    max-width: 680px;

    margin: 0 auto;

    color: #64748B;

    font-size: 18px;
    line-height: 1.65;
}


/* =========================================================
   SERVICE GRID
   ========================================================= */

.ebc-services-grid {

    width: 100%;
    max-width: 1040px;

    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 22px;
}


/* =========================================================
   SERVICE CARD
   ========================================================= */

.ebc-service-card {
    position: relative;

    min-height: 455px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 42px 44px 38px;

    background: #F8FAFB;

    border: 1px solid #E2E8EE;
    border-radius: 24px;

    text-align: left;

    overflow: hidden;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}


.ebc-service-card:hover {

    transform: translateY(-5px);

    border-color: #D4DDE5;

    box-shadow:
        0 22px 55px rgba(16,74,116,.10);
}


/* Very subtle top accent */

.ebc-service-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 3px;

    background: #104A74;
}


.ebc-service-card:nth-child(2)::before {
    background: #FF5733;
}


/* =========================================================
   NUMBER / CATEGORY
   ========================================================= */

.ebc-service-tag {

    display: flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 58px;

    color: #FF5733;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: .14em;
    text-transform: uppercase;
}


/* Don't inherit the global eyebrow line */

.ebc-service-tag::before {
    display: none;
}


/* =========================================================
   SERVICE TITLE
   ========================================================= */

.ebc-service-card h3 {

    margin: 0 0 20px;

    color: #104A74;

    font-size: clamp(2.1rem, 3.5vw, 3.15rem);
    line-height: 1;

    letter-spacing: -.055em;

    font-weight: 800;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.ebc-service-card p {

    max-width: 480px;

    margin: 0;

    color: #64748B;

    font-size: 15.5px;

    line-height: 1.7;
}


/* =========================================================
   TAGS
   ========================================================= */

.ebc-service-list {

    display: flex;
    flex-wrap: wrap;

    gap: 7px;

    margin-top: 28px;
}


.ebc-service-list span {

    display: inline-flex;
    align-items: center;

    padding: 7px 11px;

    color: #52677C;

    background: #ffffff;

    border: 1px solid #E1E7EC;

    border-radius: 999px;

    font-size: 11px;

    line-height: 1;

    transition:
        background .2s ease,
        border-color .2s ease;
}


.ebc-service-card:hover .ebc-service-list span {

    background: #F8FAFB;

    border-color: #DDE5EB;
}


/* =========================================================
   LINK
   ========================================================= */

.ebc-service-link {

    display: inline-flex;
    align-items: center;

    gap: 9px;

    width: fit-content;

    margin-top: 42px;

    color: #104A74;

    font-size: 14px;
    font-weight: 800;

    text-decoration: none;
}


.ebc-service-link span {

    color: #FF5733;

    font-size: 19px;

    transition: transform .2s ease;
}


.ebc-service-link:hover span {

    transform: translateX(4px);
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 900px) {

    .ebc-services {

        padding: 90px 0 100px;
    }

    .ebc-services-head {

        margin-bottom: 50px;
    }

    .ebc-services-grid {

        grid-template-columns: 1fr;

        max-width: 620px;
    }

    .ebc-service-card {

        min-height: 420px;
    }
}


@media (max-width: 767px) {

    .ebc-services {

        padding: 70px 0 85px;
    }

    .ebc-services-head h2 {

        font-size: 2.8rem;
    }

    .ebc-services-lead {

        font-size: 17px;
    }

    .ebc-service-card {

        min-height: 400px;

        padding: 34px 28px 32px;

        border-radius: 20px;
    }

    .ebc-service-tag {

        margin-bottom: 48px;
    }

    .ebc-service-card h3 {

        font-size: 2.35rem;
    }
}

/* ================================ FINAL CTA ================================ */ .ebc-final-cta { position: relative; overflow: hidden; background: #104A74; color: #ffffff; } .ebc-final-cta::after { content: ""; position: absolute; width: 420px; height: 420px; right: -180px; top: -180px; border-radius: 50%; border: 70px solid rgba(255,255,255,.04); } .ebc-final-inner { position: relative; z-index: 2; max-width: 850px; margin: 0 auto; text-align: center; } .ebc-final-inner h2 { margin: 0; font-size: clamp(2.1rem, 4vw, 3.5rem); line-height: 1.1; font-weight: 800; letter-spacing: -.035em; } .ebc-final-inner p { max-width: 700px; margin: 20px auto 30px; font-size: 18px; line-height: 1.7; color: rgba(255,255,255,.78); } .ebc-final-note { margin-top: 16px !important; font-size: 13px !important; color: rgba(255,255,255,.55) !important; } /* ================================ MOBILE CTA ================================ */ .ebc-mobile-cta { display: none; } /* ================================ RESPONSIVE ================================ */ @media (max-width: 900px) { .ebc-hero-inner { grid-template-columns: 1fr; min-height: auto; padding: 80px 0; } .ebc-hero-panel { max-width: 600px; } .logo-grid { grid-template-columns: repeat(3, 1fr); } .ebc-coach-grid { grid-template-columns: 1fr; gap: 45px; } .ebc-coach-copy { text-align: center; } .ebc-coach-image img { max-width: 360px; } .ebc-focus-grid { grid-template-columns: repeat(2, 1fr); } .ebc-testimonial-grid { grid-template-columns: 1fr; max-width: 650px; margin: 0 auto; } .ebc-services-grid { grid-template-columns: 1fr; } } @media (max-width: 767px) { .ebc-section { padding: 60px 0; } .ebc-hero h1 { font-size: clamp(2.5rem, 12vw, 3.6rem); } .ebc-hero-text { font-size: 17px; } .ebc-hero-actions { flex-direction: column; } .ebc-hero-actions .ebc-btn { width: 100%; } .ebc-dual-grid { grid-template-columns: 1fr; } .ebc-benefit-card { padding: 28px; } .ebc-focus-grid { grid-template-columns: 1fr; } .ebc-mobile-cta { position: fixed; z-index: 100; left: 12px; right: 12px; bottom: 12px; display: block; padding: 5px; border-radius: 14px; background: rgba(16,74,116,.96); box-shadow: 0 12px 35px rgba(0,0,0,.18); backdrop-filter: blur(8px); } .ebc-mobile-cta a { display: flex; align-items: center; justify-content: center; min-height: 50px; border-radius: 10px; background: #FF5733; color: #ffffff; font-size: 14px; font-weight: 800; text-decoration: none; } } @media (max-width: 520px) { .ebc-container { width: min(100% - 24px, 1180px); } .logo-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; } .ebc-hero-panel { padding: 24px; } .ebc-highlight { padding: 20px; } }