:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-c06c1f5 *//* =========================================================
   A LEVEL ENGLISH LANGUAGE TUTOR PAGE
   PART 1 OF 3
   Base, Typography, Buttons, Hero, Intro, Cards and Topics
   ========================================================= */


/* =========================================================
   1. PAGE VARIABLES AND RESET
   ========================================================= */

.etl-alevel-language-page {
    --etl-navy-950: #071321;
    --etl-navy-900: #0b1c2d;
    --etl-navy-850: #10263b;
    --etl-navy-800: #142d45;
    --etl-navy-700: #1b3a56;
    --etl-gold-600: #b98a2e;
    --etl-gold-500: #cda349;
    --etl-gold-400: #dfbd70;
    --etl-gold-300: #ead39b;
    --etl-cream-100: #f4efe4;
    --etl-cream-50: #faf7f0;
    --etl-white: #ffffff;
    --etl-text-dark: #172432;
    --etl-text-mid: #546271;
    --etl-text-light: #dfe7ee;
    --etl-border-light: rgba(11, 28, 45, 0.12);
    --etl-border-gold: rgba(205, 163, 73, 0.38);
    --etl-shadow-soft: 0 18px 55px rgba(7, 19, 33, 0.1);
    --etl-shadow-card: 0 22px 65px rgba(7, 19, 33, 0.16);
    --etl-shadow-dark: 0 26px 80px rgba(0, 0, 0, 0.26);
    --etl-radius-small: 12px;
    --etl-radius-medium: 20px;
    --etl-radius-large: 30px;
    --etl-transition: 0.3s ease;
    position: relative;
    width: 100%;
    overflow: hidden;
    background: var(--etl-white);
    color: var(--etl-text-dark);
    font-family: "Inter", "Segoe UI", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.etl-alevel-language-page,
.etl-alevel-language-page *,
.etl-alevel-language-page *::before,
.etl-alevel-language-page *::after {
    box-sizing: border-box;
}

.etl-alevel-language-page h1,
.etl-alevel-language-page h2,
.etl-alevel-language-page h3,
.etl-alevel-language-page p,
.etl-alevel-language-page ul,
.etl-alevel-language-page li {
    margin-top: 0;
}

.etl-alevel-language-page h1,
.etl-alevel-language-page h2,
.etl-alevel-language-page h3 {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 700;
    letter-spacing: -0.025em;
}

.etl-alevel-language-page h2 {
    margin-bottom: 22px;
    color: var(--etl-navy-900);
    font-size: clamp(2rem, 4vw, 3.45rem);
    line-height: 1.08;
}

.etl-alevel-language-page h3 {
    margin-bottom: 14px;
    color: var(--etl-navy-900);
    font-size: 1.38rem;
    line-height: 1.25;
}

.etl-alevel-language-page p {
    margin-bottom: 20px;
    color: var(--etl-text-mid);
}

.etl-alevel-language-page p:last-child {
    margin-bottom: 0;
}

.etl-alevel-language-page a {
    color: inherit;
    text-decoration: none;
}

.etl-alevel-language-page img {
    display: block;
    max-width: 100%;
}


/* =========================================================
   2. SHARED LAYOUT
   ========================================================= */

.etl-alevel-language-container {
    position: relative;
    z-index: 2;
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
}

.etl-alevel-language-narrow {
    width: min(880px, calc(100% - 48px));
    text-align: center;
}

.etl-alevel-language-section {
    position: relative;
    padding: 110px 0;
}

.etl-alevel-language-section-light {
    background: var(--etl-white);
}

.etl-alevel-language-section-cream {
    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(205, 163, 73, 0.09),
            transparent 30%
        ),
        var(--etl-cream-50);
}

.etl-alevel-language-section-navy {
    background:
        radial-gradient(
            circle at 8% 20%,
            rgba(205, 163, 73, 0.12),
            transparent 27%
        ),
        radial-gradient(
            circle at 92% 80%,
            rgba(255, 255, 255, 0.04),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            var(--etl-navy-950),
            var(--etl-navy-800)
        );
}

.etl-alevel-language-section-gold {
    background:
        linear-gradient(
            135deg,
            #d2a84e 0%,
            #e1c177 50%,
            #c59637 100%
        );
}

.etl-alevel-language-section-heading {
    width: min(780px, 100%);
    margin: 0 auto 56px;
    text-align: center;
}

.etl-alevel-language-section-heading p {
    max-width: 720px;
    margin-right: auto;
    margin-left: auto;
    font-size: 1.06rem;
}

.etl-alevel-language-section-label,
.etl-alevel-language-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: var(--etl-gold-600);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    line-height: 1.3;
    text-transform: uppercase;
}

.etl-alevel-language-section-label::before,
.etl-alevel-language-eyebrow::before {
    width: 34px;
    height: 1px;
    background: currentColor;
    content: "";
}

.etl-alevel-language-heading-light h2,
.etl-alevel-language-light-copy h2,
.etl-alevel-language-about-content h2 {
    color: var(--etl-white);
}

.etl-alevel-language-heading-light p,
.etl-alevel-language-light-copy p,
.etl-alevel-language-about-content p {
    color: rgba(223, 231, 238, 0.82);
}

.etl-alevel-language-heading-light .etl-alevel-language-section-label,
.etl-alevel-language-light-copy .etl-alevel-language-section-label,
.etl-alevel-language-about-content .etl-alevel-language-section-label {
    color: var(--etl-gold-400);
}

.etl-alevel-language-heading-dark h2,
.etl-alevel-language-heading-dark p {
    color: var(--etl-navy-950);
}

.etl-alevel-language-label-dark {
    color: var(--etl-navy-800);
}

.etl-alevel-language-lead {
    margin-bottom: 26px;
    color: var(--etl-navy-800) !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.2rem, 2vw, 1.55rem);
    line-height: 1.55;
}

.etl-alevel-language-lead-small {
    color: var(--etl-navy-800) !important;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.24rem;
    line-height: 1.55;
}

.etl-alevel-language-two-column {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.88fr);
    gap: 76px;
    align-items: center;
}

.etl-alevel-language-two-column-reverse {
    grid-template-columns: minmax(360px, 0.88fr) minmax(0, 1fr);
}

.etl-alevel-language-about-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(340px, 0.78fr);
    gap: 76px;
    align-items: center;
}


/* =========================================================
   3. BUTTONS AND TEXT LINKS
   ========================================================= */

.etl-alevel-language-button-row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 20px;
    align-items: center;
    margin-top: 34px;
}

.etl-alevel-language-button-row-centred {
    justify-content: center;
}

.etl-alevel-language-button {
    display: inline-flex;
    min-height: 54px;
    align-items: center;
    justify-content: center;
    padding: 14px 25px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.94rem;
    font-weight: 800;
    letter-spacing: 0.015em;
    line-height: 1.2;
    text-align: center;
    transition:
        transform var(--etl-transition),
        box-shadow var(--etl-transition),
        border-color var(--etl-transition),
        background-color var(--etl-transition),
        color var(--etl-transition);
}

.etl-alevel-language-button:hover {
    transform: translateY(-3px);
}

.etl-alevel-language-button:focus-visible,
.etl-alevel-language-text-link:focus-visible,
.etl-alevel-language-related-card:focus-visible,
.etl-alevel-language-faq-item summary:focus-visible {
    outline: 3px solid rgba(223, 189, 112, 0.72);
    outline-offset: 4px;
}

.etl-alevel-language-button-primary {
    background: linear-gradient(
        135deg,
        var(--etl-gold-400),
        var(--etl-gold-600)
    );
    box-shadow: 0 14px 34px rgba(185, 138, 46, 0.27);
    color: var(--etl-navy-950) !important;
}

.etl-alevel-language-button-primary:hover {
    box-shadow: 0 18px 42px rgba(185, 138, 46, 0.37);
}

.etl-alevel-language-button-secondary {
    border-color: rgba(223, 189, 112, 0.52);
    background: rgba(255, 255, 255, 0.045);
    color: var(--etl-white) !important;
}

.etl-alevel-language-button-secondary:hover {
    border-color: var(--etl-gold-400);
    background: rgba(223, 189, 112, 0.1);
}

.etl-alevel-language-button-gold {
    background: linear-gradient(
        135deg,
        var(--etl-gold-300),
        var(--etl-gold-500)
    );
    box-shadow: 0 16px 40px rgba(205, 163, 73, 0.28);
    color: var(--etl-navy-950) !important;
}

.etl-alevel-language-button-outline {
    border-color: rgba(255, 255, 255, 0.46);
    background: rgba(255, 255, 255, 0.04);
    color: var(--etl-white) !important;
}

.etl-alevel-language-button-outline:hover {
    border-color: var(--etl-white);
    background: rgba(255, 255, 255, 0.1);
}

.etl-alevel-language-text-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 8px;
    color: var(--etl-gold-600) !important;
    font-weight: 800;
    line-height: 1.4;
}

.etl-alevel-language-text-link span {
    transition: transform var(--etl-transition);
}

.etl-alevel-language-text-link:hover span {
    transform: translateX(5px);
}


/* =========================================================
   4. HERO SECTION
   ========================================================= */

.etl-alevel-language-hero {
    position: relative;
    isolation: isolate;
    min-height: 760px;
    overflow: hidden;
    padding: 130px 0 115px;
    background:
        linear-gradient(
            105deg,
            rgba(7, 19, 33, 0.99) 0%,
            rgba(11, 28, 45, 0.98) 48%,
            rgba(20, 45, 69, 0.96) 100%
        );
}

.etl-alevel-language-hero::before {
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: 0.16;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px);
    background-size: 58px 58px;
    content: "";
    mask-image: linear-gradient(to bottom, #000, transparent 90%);
}

.etl-alevel-language-hero::after {
    position: absolute;
    right: -160px;
    bottom: -240px;
    z-index: -1;
    width: 680px;
    height: 680px;
    border: 1px solid rgba(223, 189, 112, 0.18);
    border-radius: 50%;
    box-shadow:
        0 0 0 80px rgba(223, 189, 112, 0.025),
        0 0 0 160px rgba(223, 189, 112, 0.018);
    content: "";
}

.etl-alevel-language-hero-glow {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    filter: blur(8px);
    pointer-events: none;
}

.etl-alevel-language-glow-one {
    top: -220px;
    left: -190px;
    width: 600px;
    height: 600px;
    background: radial-gradient(
        circle,
        rgba(205, 163, 73, 0.22),
        transparent 70%
    );
}

.etl-alevel-language-glow-two {
    right: 8%;
    bottom: -270px;
    width: 650px;
    height: 650px;
    background: radial-gradient(
        circle,
        rgba(65, 104, 137, 0.25),
        transparent 68%
    );
}

.etl-alevel-language-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.16fr) minmax(360px, 0.84fr);
    gap: 72px;
    align-items: center;
}

.etl-alevel-language-hero-content {
    max-width: 730px;
}

.etl-alevel-language-hero .etl-alevel-language-eyebrow {
    color: var(--etl-gold-400);
}

.etl-alevel-language-hero h1 {
    max-width: 760px;
    margin-bottom: 24px;
    color: var(--etl-white);
    font-size: clamp(3.2rem, 6vw, 5.8rem);
    line-height: 0.98;
}

.etl-alevel-language-hero h1 span {
    display: block;
    margin-top: 17px;
    color: var(--etl-gold-400);
    font-size: 0.47em;
    line-height: 1.15;
    letter-spacing: -0.015em;
}

.etl-alevel-language-hero-intro {
    max-width: 690px;
    margin-bottom: 28px !important;
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 1.16rem;
    line-height: 1.72;
}

.etl-alevel-language-hero-benefits {
    display: grid;
    gap: 13px;
    margin-top: 30px;
}

.etl-alevel-language-hero-benefit {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.98rem;
    line-height: 1.55;
}

.etl-alevel-language-check {
    display: inline-flex;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
    border: 1px solid rgba(223, 189, 112, 0.52);
    border-radius: 50%;
    background: rgba(223, 189, 112, 0.08);
    color: var(--etl-gold-400);
    font-size: 0.77rem;
    font-weight: 900;
}

.etl-alevel-language-hero-note {
    max-width: 610px;
    margin-top: 24px;
    margin-bottom: 0 !important;
    padding-left: 17px;
    border-left: 2px solid rgba(223, 189, 112, 0.46);
    color: rgba(255, 255, 255, 0.58) !important;
    font-size: 0.85rem;
    line-height: 1.6;
}


/* =========================================================
   5. HERO FEATURE CARD
   ========================================================= */

.etl-alevel-language-hero-card {
    position: relative;
    overflow: hidden;
    padding: 40px 38px;
    border: 1px solid rgba(223, 189, 112, 0.25);
    border-radius: var(--etl-radius-large);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.105),
            rgba(255, 255, 255, 0.035)
        );
    box-shadow: var(--etl-shadow-dark);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.etl-alevel-language-hero-card::before {
    position: absolute;
    top: -120px;
    right: -100px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(223, 189, 112, 0.13),
        transparent 72%
    );
    content: "";
}

.etl-alevel-language-card-accent {
    position: absolute;
    top: 0;
    left: 34px;
    width: 86px;
    height: 4px;
    border-radius: 0 0 8px 8px;
    background: linear-gradient(
        90deg,
        var(--etl-gold-400),
        var(--etl-gold-600)
    );
}

.etl-alevel-language-card-label {
    display: block;
    margin-bottom: 15px;
    color: var(--etl-gold-400);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.etl-alevel-language-hero-card h2 {
    margin-bottom: 18px;
    color: var(--etl-white);
    font-size: clamp(2rem, 3vw, 2.65rem);
    line-height: 1.12;
}

.etl-alevel-language-hero-card > p {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.94rem;
    line-height: 1.72;
}

.etl-alevel-language-focus-list {
    display: grid;
    gap: 12px;
    margin-top: 28px;
}

.etl-alevel-language-focus-item {
    display: grid;
    grid-template-columns: 43px 1fr;
    gap: 13px;
    align-items: center;
    padding: 15px 16px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 14px;
    background: rgba(5, 15, 25, 0.26);
    transition:
        transform var(--etl-transition),
        border-color var(--etl-transition),
        background-color var(--etl-transition);
}

.etl-alevel-language-focus-item:hover {
    transform: translateX(4px);
    border-color: rgba(223, 189, 112, 0.32);
    background: rgba(223, 189, 112, 0.065);
}

.etl-alevel-language-focus-item > span {
    display: inline-flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(223, 189, 112, 0.4);
    border-radius: 50%;
    color: var(--etl-gold-400);
    font-size: 0.72rem;
    font-weight: 900;
}

.etl-alevel-language-focus-item strong {
    display: block;
    margin-bottom: 2px;
    color: var(--etl-white);
    font-size: 0.92rem;
    line-height: 1.3;
}

.etl-alevel-language-focus-item small {
    display: block;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.76rem;
    line-height: 1.45;
}


/* =========================================================
   6. INTRODUCTION SECTION
   ========================================================= */

.etl-alevel-language-narrow h2 {
    margin-right: auto;
    margin-left: auto;
}

.etl-alevel-language-narrow > p:not(.etl-alevel-language-lead) {
    font-size: 1.02rem;
}

.etl-alevel-language-narrow::after {
    display: block;
    width: 84px;
    height: 2px;
    margin: 38px auto 0;
    background: linear-gradient(
        90deg,
        transparent,
        var(--etl-gold-500),
        transparent
    );
    content: "";
}


/* =========================================================
   7. SERVICE CARDS
   ========================================================= */

.etl-alevel-language-card-grid {
    display: grid;
    gap: 22px;
}

.etl-alevel-language-card-grid-four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.etl-alevel-language-service-card {
    position: relative;
    min-height: 100%;
    overflow: hidden;
    padding: 34px 28px 30px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: var(--etl-radius-medium);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.075),
            rgba(255, 255, 255, 0.025)
        );
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.13);
    transition:
        transform var(--etl-transition),
        border-color var(--etl-transition),
        box-shadow var(--etl-transition);
}

.etl-alevel-language-service-card::after {
    position: absolute;
    right: -50px;
    bottom: -60px;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(205, 163, 73, 0.13),
        transparent 70%
    );
    content: "";
}

.etl-alevel-language-service-card:hover {
    transform: translateY(-7px);
    border-color: rgba(223, 189, 112, 0.34);
    box-shadow: 0 26px 55px rgba(0, 0, 0, 0.2);
}

.etl-alevel-language-service-number {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    border: 1px solid rgba(223, 189, 112, 0.4);
    border-radius: 50%;
    color: var(--etl-gold-400);
    font-size: 0.76rem;
    font-weight: 900;
}

.etl-alevel-language-service-card h3 {
    position: relative;
    z-index: 1;
    color: var(--etl-white);
    font-size: 1.27rem;
}

.etl-alevel-language-service-card p {
    position: relative;
    z-index: 1;
    color: rgba(223, 231, 238, 0.7);
    font-size: 0.91rem;
    line-height: 1.68;
}


/* =========================================================
   8. FEATURE PANELS
   ========================================================= */

.etl-alevel-language-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.etl-alevel-language-feature-panel {
    position: relative;
    min-height: 100%;
    overflow: hidden;
    padding: 34px 30px 32px;
    border: 1px solid var(--etl-border-light);
    border-radius: var(--etl-radius-medium);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: var(--etl-shadow-soft);
    transition:
        transform var(--etl-transition),
        border-color var(--etl-transition),
        box-shadow var(--etl-transition);
}

.etl-alevel-language-feature-panel::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(
        90deg,
        var(--etl-gold-600),
        var(--etl-gold-300)
    );
    content: "";
    transform: scaleX(0.28);
    transform-origin: left;
    transition: transform var(--etl-transition);
}

.etl-alevel-language-feature-panel:hover {
    transform: translateY(-7px);
    border-color: var(--etl-border-gold);
    box-shadow: var(--etl-shadow-card);
}

.etl-alevel-language-feature-panel:hover::before {
    transform: scaleX(1);
}

.etl-alevel-language-feature-icon {
    display: inline-flex;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border: 1px solid rgba(185, 138, 46, 0.25);
    border-radius: 15px;
    background: linear-gradient(
        145deg,
        rgba(205, 163, 73, 0.17),
        rgba(205, 163, 73, 0.06)
    );
    color: var(--etl-gold-600);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.25rem;
    font-weight: 700;
}

.etl-alevel-language-feature-panel h3 {
    font-size: 1.38rem;
}

.etl-alevel-language-feature-panel p {
    font-size: 0.95rem;
    line-height: 1.7;
}

/* =========================================================
   TUITION PROCESS
========================================================= */

.etl-alevel-language-process-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:28px;
    margin-top:60px;
}

.etl-alevel-language-process-step{
    position:relative;
    overflow:hidden;
    padding:40px 32px;
    border-radius:24px;
    background:rgba(255,255,255,.18);
    border:1px solid rgba(7,19,33,.12);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    box-shadow:0 18px 45px rgba(7,19,33,.12);
    transition:
        transform .35s ease,
        box-shadow .35s ease,
        background .35s ease;
}

.etl-alevel-language-process-step::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(
        90deg,
        #b98a2e,
        #ead39b
    );
}

.etl-alevel-language-process-step:hover{
    transform:translateY(-8px);
    background:rgba(255,255,255,.28);
    box-shadow:0 28px 60px rgba(7,19,33,.18);
}

.etl-alevel-language-process-number{
    display:flex;
    align-items:center;
    justify-content:center;
    width:60px;
    height:60px;
    margin-bottom:26px;
    border-radius:50%;
    background:linear-gradient(
        135deg,
        #0b1c2d,
        #163955
    );
    color:#dfbd70;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.45rem;
    font-weight:700;
    box-shadow:
        0 12px 28px rgba(7,19,33,.22);
}

.etl-alevel-language-process-step h3{
    margin-bottom:18px;
    color:#071321;
    font-size:1.45rem;
    line-height:1.25;
}

.etl-alevel-language-process-step p{
    margin:0;
    color:#263746;
    font-size:.96rem;
    line-height:1.75;
}


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

@media (max-width:1100px){

.etl-alevel-language-process-grid{
    grid-template-columns:repeat(2,1fr);
}

}

@media (max-width:767px){

.etl-alevel-language-process-grid{
    grid-template-columns:1fr;
    gap:22px;
}

.etl-alevel-language-process-step{
    padding:32px 26px;
}

.etl-alevel-language-process-number{
    width:52px;
    height:52px;
    font-size:1.2rem;
}

.etl-alevel-language-process-step h3{
    font-size:1.3rem;
}

}



/* =========================================================
   9. TOPIC CARDS
   ========================================================= */

.etl-alevel-language-topic-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 23px;
}

.etl-alevel-language-topic-grid-four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.etl-alevel-language-topic-card {
    position: relative;
    min-height: 100%;
    padding: 31px 28px 29px;
    border: 1px solid var(--etl-border-light);
    border-radius: var(--etl-radius-medium);
    background: var(--etl-white);
    box-shadow: 0 14px 42px rgba(7, 19, 33, 0.075);
    transition:
        transform var(--etl-transition),
        border-color var(--etl-transition),
        box-shadow var(--etl-transition);
}

.etl-alevel-language-topic-card:hover {
    transform: translateY(-6px);
    border-color: var(--etl-border-gold);
    box-shadow: 0 22px 52px rgba(7, 19, 33, 0.12);
}

.etl-alevel-language-topic-number {
    display: block;
    margin-bottom: 19px;
    color: var(--etl-gold-600);
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.14em;
}

.etl-alevel-language-topic-number::after {
    display: inline-block;
    width: 34px;
    height: 1px;
    margin-left: 10px;
    vertical-align: middle;
    background: rgba(185, 138, 46, 0.38);
    content: "";
}

.etl-alevel-language-topic-card h3 {
    font-size: 1.3rem;
}

.etl-alevel-language-topic-card p {
    margin-bottom: 0;
    font-size: 0.92rem;
    line-height: 1.68;
}


/* =========================================================
   10. BOARD BOX AND GOLD LIST
   ========================================================= */

.etl-alevel-language-board-box {
    position: relative;
    overflow: hidden;
    padding: 38px 38px 34px;
    border: 1px solid rgba(185, 138, 46, 0.22);
    border-radius: var(--etl-radius-large);
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.96),
            rgba(250, 247, 240, 0.94)
        );
    box-shadow: var(--etl-shadow-card);
}

.etl-alevel-language-board-box::before {
    position: absolute;
    top: -80px;
    right: -70px;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(205, 163, 73, 0.15),
        transparent 72%
    );
    content: "";
}

.etl-alevel-language-board-title {
    position: relative;
    z-index: 1;
    display: block;
    margin-bottom: 23px;
    color: var(--etl-navy-900);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.35;
}

.etl-alevel-language-gold-list {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 11px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.etl-alevel-language-gold-list li {
    position: relative;
    padding-left: 27px;
    color: var(--etl-text-mid);
    font-size: 0.93rem;
    line-height: 1.55;
}

.etl-alevel-language-gold-list li::before {
    position: absolute;
    top: 0.68em;
    left: 2px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--etl-gold-500);
    box-shadow: 0 0 0 4px rgba(205, 163, 73, 0.12);
    content: "";
    transform: translateY(-50%);
}
/* =========================================================
   PART 2 OF 3
   Results, Comparison, Benefits, Locations,
   Related Cards, FAQ, CTA and Responsive
   ========================================================= */


/* =========================================================
   11. RESULTS PANEL
   ========================================================= */

.etl-alevel-language-results-panel{
    position:relative;
    overflow:hidden;
    padding:40px;
    border-radius:30px;
    border:1px solid rgba(223,189,112,.22);
    background:linear-gradient(145deg,
        rgba(255,255,255,.08),
        rgba(255,255,255,.03));
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    box-shadow:var(--etl-shadow-dark);
}

.etl-alevel-language-results-panel::before{
    content:"";
    position:absolute;
    top:-120px;
    right:-120px;
    width:260px;
    height:260px;
    border-radius:50%;
    background:radial-gradient(circle,
        rgba(223,189,112,.14),
        transparent 72%);
}

.etl-alevel-language-results-kicker{
    display:block;
    margin-bottom:26px;
    color:var(--etl-gold-400);
    text-transform:uppercase;
    letter-spacing:.18em;
    font-size:.74rem;
    font-weight:800;
}

.etl-alevel-language-result-item{
    display:grid;
    gap:8px;
    padding:20px 0;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.etl-alevel-language-result-item:last-child{
    border-bottom:none;
}

.etl-alevel-language-result-item strong{
    color:#fff;
    font-size:1rem;
}

.etl-alevel-language-result-item span{
    color:rgba(255,255,255,.72);
    line-height:1.65;
    font-size:.94rem;
}


/* =========================================================
   12. COMPARISON BOX
   ========================================================= */

.etl-alevel-language-comparison-box{
    display:grid;
    gap:24px;
    align-items:center;
    padding:42px;
    border-radius:28px;
    background:#fff;
    border:1px solid rgba(11,28,45,.08);
    box-shadow:var(--etl-shadow-card);
}

.etl-alevel-language-comparison-item{
    display:grid;
    gap:10px;
}

.etl-alevel-language-comparison-item span{
    color:var(--etl-gold-600);
    text-transform:uppercase;
    letter-spacing:.14em;
    font-size:.74rem;
    font-weight:800;
}

.etl-alevel-language-comparison-item strong{
    color:var(--etl-navy-900);
    line-height:1.6;
    font-size:1rem;
}

.etl-alevel-language-comparison-divider{
    display:flex;
    justify-content:center;
    align-items:center;
    width:56px;
    height:56px;
    margin:auto;
    border-radius:50%;
    background:linear-gradient(135deg,
        var(--etl-gold-400),
        var(--etl-gold-600));
    color:#071321;
    font-size:1.3rem;
    font-weight:700;
}


/* =========================================================
   13. BENEFIT GRID
   ========================================================= */

.etl-alevel-language-benefit-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:24px;
}

.etl-alevel-language-benefit-card{
    position:relative;
    overflow:hidden;
    padding:34px 30px;
    border-radius:22px;
    background:#fff;
    border:1px solid rgba(11,28,45,.08);
    box-shadow:var(--etl-shadow-soft);
    transition:.3s;
}

.etl-alevel-language-benefit-card:hover{
    transform:translateY(-6px);
    border-color:rgba(205,163,73,.35);
    box-shadow:var(--etl-shadow-card);
}

.etl-alevel-language-benefit-icon{
    display:flex;
    justify-content:center;
    align-items:center;
    width:52px;
    height:52px;
    margin-bottom:20px;
    border-radius:14px;
    background:linear-gradient(135deg,
        rgba(205,163,73,.18),
        rgba(205,163,73,.08));
    color:var(--etl-gold-600);
    font-weight:800;
}

.etl-alevel-language-benefit-card h3{
    font-size:1.28rem;
}

.etl-alevel-language-benefit-card p{
    margin-bottom:0;
    font-size:.94rem;
}


/* =========================================================
   14. QUOTE CARD
   ========================================================= */

.etl-alevel-language-quote-card{
    position:relative;
    padding:44px;
    border-radius:30px;
    background:linear-gradient(145deg,
        rgba(255,255,255,.10),
        rgba(255,255,255,.04));
    border:1px solid rgba(223,189,112,.18);
    backdrop-filter:blur(14px);
}

.etl-alevel-language-quote-mark{
    display:block;
    margin-bottom:18px;
    color:var(--etl-gold-400);
    font-size:5rem;
    line-height:.8;
}

.etl-alevel-language-quote-card p{
    color:#fff;
    font-family:Georgia,serif;
    font-size:1.25rem;
    line-height:1.7;
}

.etl-alevel-language-quote-card strong{
    display:block;
    margin-top:26px;
    color:var(--etl-gold-400);
}


/* =========================================================
   15. LOCATION CARDS
   ========================================================= */

.etl-alevel-language-location-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:28px;
}

.etl-alevel-language-location-card{
    padding:38px;
    border-radius:26px;
    background:#fff;
    border:1px solid rgba(11,28,45,.08);
    box-shadow:var(--etl-shadow-soft);
    transition:.3s;
}

.etl-alevel-language-location-card:hover{
    transform:translateY(-6px);
    box-shadow:var(--etl-shadow-card);
}

.etl-alevel-language-location-tag{
    display:inline-block;
    margin-bottom:18px;
    padding:7px 16px;
    border-radius:999px;
    background:rgba(205,163,73,.12);
    color:var(--etl-gold-600);
    font-size:.72rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.14em;
}


/* =========================================================
   16. RELATED CARDS
   ========================================================= */

.etl-alevel-language-related-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
}

.etl-alevel-language-related-card{
    display:block;
    padding:36px;
    border-radius:24px;
    background:#fff;
    border:1px solid rgba(11,28,45,.08);
    box-shadow:var(--etl-shadow-soft);
    transition:.3s;
}

.etl-alevel-language-related-card:hover{
    transform:translateY(-6px);
    border-color:rgba(205,163,73,.35);
    box-shadow:var(--etl-shadow-card);
}

.etl-alevel-language-related-card span{
    display:block;
    margin-bottom:16px;
    color:var(--etl-gold-600);
    text-transform:uppercase;
    letter-spacing:.14em;
    font-size:.72rem;
    font-weight:800;
}

.etl-alevel-language-related-card strong{
    display:block;
    margin-top:24px;
    color:var(--etl-gold-600);
}


/* =========================================================
   17. FAQ
   ========================================================= */

.etl-alevel-language-faq-layout{
    display:grid;
    grid-template-columns:380px 1fr;
    gap:60px;
}

.etl-alevel-language-faq-list{
    display:grid;
    gap:18px;
}

.etl-alevel-language-faq-item{
    overflow:hidden;
    border-radius:18px;
    border:1px solid rgba(11,28,45,.08);
    background:#fff;
    box-shadow:0 8px 24px rgba(7,19,33,.05);
}

.etl-alevel-language-faq-item summary{
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
    list-style:none;
    padding:22px 28px;
    font-weight:700;
    color:var(--etl-navy-900);
}

.etl-alevel-language-faq-item summary::-webkit-details-marker{
    display:none;
}

.etl-alevel-language-faq-answer{
    padding:0 28px 26px;
}

.etl-alevel-language-faq-answer p{
    margin:0;
}


/* =========================================================
   18. FINAL CTA
   ========================================================= */

.etl-alevel-language-final-cta{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    background:linear-gradient(135deg,
        var(--etl-navy-950),
        var(--etl-navy-800));
    text-align:center;
}

.etl-alevel-language-final-glow{
    position:absolute;
    left:50%;
    top:-260px;
    transform:translateX(-50%);
    width:700px;
    height:700px;
    border-radius:50%;
    background:radial-gradient(circle,
        rgba(205,163,73,.22),
        transparent 72%);
}

.etl-alevel-language-final-inner{
    position:relative;
    z-index:2;
}

.etl-alevel-language-final-inner h2{
    color:#fff;
}

.etl-alevel-language-final-inner p{
    max-width:760px;
    margin:0 auto 36px;
    color:rgba(255,255,255,.78);
    font-size:1.08rem;
}


/* =========================================================
   19. RESPONSIVE
   ========================================================= */

@media (max-width:1100px){

.etl-alevel-language-hero-grid,
.etl-alevel-language-two-column,
.etl-alevel-language-two-column-reverse,
.etl-alevel-language-about-grid,
.etl-alevel-language-faq-layout{
grid-template-columns:1fr;
gap:50px;
}

.etl-alevel-language-card-grid-four,
.etl-alevel-language-benefit-grid,
.etl-alevel-language-topic-grid-four,
.etl-alevel-language-feature-grid,
.etl-alevel-language-topic-grid,
.etl-alevel-language-related-grid{
grid-template-columns:repeat(2,1fr);
}

}

@media (max-width:768px){

.etl-alevel-language-section{
padding:80px 0;
}

.etl-alevel-language-container{
width:min(100% - 32px,1180px);
}

.etl-alevel-language-hero{
padding:90px 0 80px;
}

.etl-alevel-language-hero h1{
font-size:2.8rem;
}

.etl-alevel-language-button-row{
flex-direction:column;
align-items:stretch;
}

.etl-alevel-language-button{
width:100%;
}

.etl-alevel-language-card-grid-four,
.etl-alevel-language-benefit-grid,
.etl-alevel-language-topic-grid,
.etl-alevel-language-topic-grid-four,
.etl-alevel-language-feature-grid,
.etl-alevel-language-related-grid,
.etl-alevel-language-location-grid{
grid-template-columns:1fr;
}

.etl-alevel-language-board-box,
.etl-alevel-language-results-panel,
.etl-alevel-language-quote-card,
.etl-alevel-language-location-card,
.etl-alevel-language-related-card,
.etl-alevel-language-benefit-card{
padding:28px;
}

.etl-alevel-language-faq-item summary{
padding:20px;
}

.etl-alevel-language-faq-answer{
padding:0 20px 20px;
}

}/* End custom CSS */