*,

        *::before,

        *::after {

            box-sizing: border-box;

            margin: 0;

            padding: 0

        }



        :root {

            --green: #2A8A1E;

            --green-mid: #3AAD2A;

            --green-light: #E8F7E5;

            --green-pale: #F2FBF0;

            --teal: #009BBF;

            --teal-mid: #00B8E0;

            --teal-light: #E0F6FB;

            --teal-pale: #F0FBFD;

            --grad: linear-gradient(135deg, #3AAD2A 0%, #009BBF 100%);

            --white: #FFFFFF;

            --off-white: #F7F9F8;

            --surface: #EFF4F1;

            --border: rgba(0, 0, 0, 0.08);

            --border-mid: rgba(0, 0, 0, 0.14);

            --ink: #0F1F0D;

            --ink-mid: #2A3D28;

            --ink-muted: #556652;

            --ink-faint: #8EA68A;

            --radius: 16px;

            --radius-sm: 10px;

            --font-head: 'Sora', sans-serif;

            --font-body: 'Plus Jakarta Sans', sans-serif;

            --shadow-sm: 0 2px 12px rgba(42, 138, 30, 0.07);

            --shadow-md: 0 8px 32px rgba(42, 138, 30, 0.11);

            --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.1);

        }



        html {

            scroll-behavior: smooth

        }



        body {

            font-family: var(--font-body);

            background: var(--white);

            color: var(--ink);

            line-height: 1.65;

            overflow-x: hidden

        }



        /* NAV */

        nav {

            position: fixed;

            top: 0;

            left: 0;

            right: 0;

            z-index: 100;

            height: 66px;

            padding: 0 5vw;

            display: flex;

            align-items: center;

            justify-content: space-between;

            background: rgba(255, 255, 255, .95);

            backdrop-filter: blur(18px);

            border-bottom: 1px solid #EEE9E3;

            transition: box-shadow .3s

        }



        nav.scrolled {

            box-shadow: 0 2px 20px rgba(0, 0, 0, .07)

        }



        .nav-logo {

            display: flex;

            align-items: center;

            text-decoration: none

        }



        .nav-logo img {

            height: 38px;

            width: auto;

            display: block

        }



        .nav-links {

            display: flex;

            align-items: center;

            gap: 1.5rem;

            list-style: none

        }



        .nav-links a {

            font-size: .84rem;

            font-weight: 500;

            color: #556652;

            text-decoration: none;

            transition: color .2s

        }



        .nav-links a:hover,

        .nav-links a.active {

            color: #2A8A1E

        }



        .nav-cta {

            background: var(--grad) !important;

            color: #fff !important;

            padding: .48rem 1.25rem !important;

            border-radius: 100px !important;

            font-weight: 600 !important;

            font-size: .84rem !important;

            transition: opacity .2s, transform .2s !important

        }



        .nav-cta:hover {

            opacity: .88 !important;

            transform: translateY(-1px) !important

        }



        .hamburger {

            display: none;

            flex-direction: column;

            gap: 5px;

            cursor: pointer;

            padding: 4px;

            background: none;

            border: none

        }



        .hamburger span {

            display: block;

            width: 22px;

            height: 2px;

            background: #1A2E18;

            border-radius: 2px;

            transition: transform .3s, opacity .3s

        }



        .hamburger.open span:nth-child(1) {

            transform: translateY(7px) rotate(45deg)

        }



        .hamburger.open span:nth-child(2) {

            opacity: 0

        }



        .hamburger.open span:nth-child(3) {

            transform: translateY(-7px) rotate(-45deg)

        }



        /* HERO */

        .hero {

            min-height: auto;

            padding: 88px 6vw 16px;

            display: flex;

            align-items: center;

            background: linear-gradient(155deg, var(--green-pale) 0%, var(--white) 50%, var(--teal-pale) 100%);

            position: relative;

            overflow: hidden

        }



        .hero::before {

            content: '';

            position: absolute;

            top: -180px;

            right: -180px;

            width: 560px;

            height: 560px;

            border-radius: 50%;

            background: radial-gradient(circle, rgba(0, 155, 191, .07) 0%, transparent 65%);

            pointer-events: none

        }



        .hero::after {

            content: '';

            position: absolute;

            bottom: -100px;

            left: -80px;

            width: 460px;

            height: 460px;

            border-radius: 50%;

            background: radial-gradient(circle, rgba(58, 173, 42, .06) 0%, transparent 65%);

            pointer-events: none

        }



        /* floating orbs */

        .hero-orb {

            position: absolute;

            border-radius: 50%;

            pointer-events: none;

            animation: orbFloat 6s ease-in-out infinite

        }



        .hero-orb1 {

            width: 120px;

            height: 120px;

            top: 18%;

            left: 8%;

            background: radial-gradient(circle, rgba(58, 173, 42, .08), transparent 70%);

            animation-delay: 0s

        }



        .hero-orb2 {

            width: 80px;

            height: 80px;

            top: 60%;

            right: 12%;

            background: radial-gradient(circle, rgba(0, 155, 191, .1), transparent 70%);

            animation-delay: 2s

        }



        @keyframes  orbFloat {



            0%,

            100% {

                transform: translateY(0)

            }



            50% {

                transform: translateY(-18px)

            }

        }



        .hero-inner {

            max-width: 1180px;

            margin: 0 auto;

            display: grid;

            grid-template-columns: 1fr 360px;

            gap: 3.5rem;

            align-items: center;

            position: relative;

            z-index: 1;

            width: 100%

        }



        .hero-content {

            text-align: left

        }



        .hero-badge {

            display: inline-flex;

            align-items: center;

            gap: 8px;

            background: var(--white);

            border: 1.5px solid rgba(42, 138, 30, .2);

            border-radius: 100px;

            padding: 6px 16px;

            font-size: .75rem;

            font-weight: 600;

            color: var(--green);

            letter-spacing: .07em;

            text-transform: uppercase;

            margin-bottom: 1.5rem;

            box-shadow: var(--shadow-sm);

            animation: fadeSlideDown .6s ease both

        }



        .badge-dot {

            width: 7px;

            height: 7px;

            border-radius: 50%;

            background: var(--green-mid);

            animation: blink 2s infinite

        }



        @keyframes  blink {



            0%,

            100% {

                opacity: 1;

                transform: scale(1)

            }



            50% {

                opacity: .4;

                transform: scale(.6)

            }

        }



        @keyframes  fadeSlideDown {

            from {

                opacity: 0;

                transform: translateY(-10px)

            }



            to {

                opacity: 1;

                transform: translateY(0)

            }

        }



        @keyframes  fadeSlideUp {

            from {

                opacity: 0;

                transform: translateY(16px)

            }



            to {

                opacity: 1;

                transform: translateY(0)

            }

        }



        h1 {

            font-family: var(--font-head);

            font-size: clamp(2rem, 4.5vw, 3rem);

            font-weight: 700;

            line-height: 1.1;

            letter-spacing: -.03em;

            color: var(--ink);

            margin-bottom: 1rem;

            animation: fadeSlideUp .7s .1s ease both

        }



        .grad-text {

            background: var(--grad);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

            background-clip: text

        }



        /* typing cursor */

        .typed-cursor {

            display: inline-block;

            width: 3px;

            height: .85em;

            background: var(--green);

            border-radius: 2px;

            margin-left: 3px;

            vertical-align: middle;

            animation: cursorBlink .75s step-end infinite

        }



        @keyframes  cursorBlink {



            0%,

            100% {

                opacity: 1

            }



            50% {

                opacity: 0

            }

        }



        .hero-sub {

            font-size: clamp(1rem, 1.5vw, 1.2rem);

            color: var(--ink-muted);

            max-width: 700px;

            margin: 1rem 0 1.5rem;

            font-weight: 400;

            line-height: 1.8;

            animation: fadeSlideUp .7s .2s ease both

        }



        .hero-checks {

            display: flex;

            flex-direction: column;

            gap: 8px;

            margin-bottom: 1.75rem;

            animation: fadeSlideUp .7s .3s ease both

        }



        .hero-check {

            display: flex;

            align-items: center;

            gap: 9px;

            font-size: .94rem;

            color: var(--ink-mid);

            font-weight: 500

        }



        .hero-check::before {

            content: '';

            width: 18px;

            height: 18px;

            border-radius: 50%;

            background: var(--green-light);

            border: 1.5px solid rgba(42, 138, 30, .25);

            flex-shrink: 0;

            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232A8A1E' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E");

            background-size: 12px;

            background-repeat: no-repeat;

            background-position: center

        }



        .hero-actions {

            display: flex;

            align-items: center;

            gap: .85rem;

            flex-wrap: wrap;

            margin-bottom: 2rem;

            animation: fadeSlideUp .7s .4s ease both

        }



        .btn-primary {

            display: inline-flex;

            align-items: center;

            gap: 8px;

            background: var(--grad);

            color: #fff;

            font-family: var(--font-body);

            font-size: .95rem;

            font-weight: 600;

            padding: .78rem 1.85rem;

            border-radius: 100px;

            text-decoration: none;

            border: none;

            cursor: pointer;

            box-shadow: 0 6px 24px rgba(42, 138, 30, .28);

            transition: transform .2s, box-shadow .2s;

            letter-spacing: -.01em

        }



        .btn-primary:hover {

            transform: translateY(-3px);

            box-shadow: 0 14px 36px rgba(42, 138, 30, .36)

        }



        .btn-outline {

            display: inline-flex;

            align-items: center;

            gap: 8px;

            background: var(--white);

            color: var(--green);

            font-family: var(--font-body);

            font-size: .95rem;

            font-weight: 600;

            padding: .78rem 1.85rem;

            border-radius: 100px;

            text-decoration: none;

            border: 1.5px solid rgba(42, 138, 30, .3);

            cursor: pointer;

            transition: all .2s

        }



        .btn-outline:hover {

            border-color: var(--green);

            background: var(--green-pale)

        }



        .hero-right {

            display: flex;

            flex-direction: column;

            gap: 1rem

        }



        /* Stats — 4 individual cards */

        .hero-stats {

            display: flex;

            flex-wrap: wrap;

            gap: .5rem;

            animation: fadeSlideUp .7s .2s ease both

        }



        .hero-stat {

            background: #fff;

            border: 1px solid #E4EDE1;

            border-radius: 10px;

            padding: .48rem .8rem .48rem .55rem;

            position: relative;

            overflow: hidden;

            transition: transform .2s, box-shadow .2s;

            cursor: default;

            display: flex;

            align-items: center;

            gap: .5rem

        }



        .hero-stat::before {

            content: '';

            position: absolute;

            left: 0;

            top: 0;

            bottom: 0;

            width: 2.5px;

            background: var(--grad)

        }



        .hero-stat:hover {

            transform: translateY(-2px);

            box-shadow: 0 5px 16px rgba(42, 138, 30, .12)

        }



        .hs-icon {

            width: 26px;

            height: 26px;

            border-radius: 7px;

            background: var(--green-light);

            display: flex;

            align-items: center;

            justify-content: center;

            flex-shrink: 0

        }



        .hs-icon svg {

            width: 13px;

            height: 13px;

            stroke: var(--green);

            stroke-width: 2;

            fill: none

        }



        .hs-text {

            display: flex;

            align-items: baseline;

            gap: 4px

        }



        .hero-stat-num {

            font-family: var(--font-head);

            font-size: 1.05rem;

            font-weight: 700;

            background: var(--grad);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

            background-clip: text;

            line-height: 1;

            opacity: 0;

            animation: statPop .5s ease forwards

        }



        .hero-stat:nth-child(1) .hero-stat-num {

            animation-delay: .35s

        }



        .hero-stat:nth-child(2) .hero-stat-num {

            animation-delay: .5s

        }



        .hero-stat:nth-child(3) .hero-stat-num {

            animation-delay: .65s

        }



        .hero-stat:nth-child(4) .hero-stat-num {

            animation-delay: .8s

        }



        @keyframes  statPop {

            0% {

                opacity: 0;

                transform: scale(.7) translateY(6px)

            }



            70% {

                transform: scale(1.1) translateY(-2px)

            }



            100% {

                opacity: 1;

                transform: scale(1) translateY(0)

            }

        }



        .hero-stat-label {

            font-size: .6rem;

            font-weight: 600;

            color: var(--ink-muted);

            text-transform: uppercase;

            letter-spacing: .04em;

            line-height: 1

        }



        /* scroll indicator */

        .scroll-hint {

            position: absolute;

            bottom: 28px;

            left: 50%;

            transform: translateX(-50%);

            display: flex;

            flex-direction: column;

            align-items: center;

            gap: 6px;

            animation: fadeSlideUp .7s .8s ease both;

            cursor: pointer;

            text-decoration: none

        }



        .scroll-hint span {

            font-size: .65rem;

            font-weight: 600;

            letter-spacing: .1em;

            text-transform: uppercase;

            color: var(--ink-faint)

        }



        .scroll-mouse {

            width: 22px;

            height: 34px;

            border: 2px solid rgba(42, 138, 30, .3);

            border-radius: 12px;

            display: flex;

            justify-content: center;

            padding-top: 5px

        }



        .scroll-wheel {

            width: 3px;

            height: 7px;

            border-radius: 3px;

            background: var(--green);

            animation: scrollWheel 1.6s ease infinite

        }



        @keyframes  scrollWheel {

            0% {

                opacity: 1;

                transform: translateY(0)

            }



            80% {

                opacity: 0;

                transform: translateY(10px)

            }



            100% {

                opacity: 0;

                transform: translateY(0)

            }

        }



        /* HERO FORM */

        .hero-form-card {

            background: var(--white);

            border: 1px solid var(--border-mid);

            border-radius: 22px;

            padding: 1.6rem 1.5rem;

            box-shadow: 0 24px 64px rgba(0, 0, 0, .11), 0 4px 16px rgba(42, 138, 30, .08);

            position: relative;

            overflow: hidden;

            animation: fadeSlideUp .7s .3s ease both

        }



        .hero-form-card::before {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            height: 3px;

            background: var(--grad)

        }



        .hero-form-title {

            font-family: var(--font-head);

            font-size: 1rem;

            font-weight: 700;

            color: var(--ink);

            letter-spacing: -.02em

        }



        .hero-form-sub {

            font-size: .74rem;

            color: var(--ink-muted);

            line-height: 1.4

        }



        .hf-group {

            margin-bottom: .85rem

        }



        .hf-label {

            display: block;

            font-size: .67rem;

            font-weight: 600;

            color: var(--ink-mid);

            letter-spacing: .04em;

            text-transform: uppercase;

            margin-bottom: .3rem

        }



        .hf-input {

            width: 100%;

            padding: .6rem .9rem;

            border: 1.5px solid var(--border-mid);

            border-radius: 10px;

            font-family: var(--font-body);

            font-size: .85rem;

            color: var(--ink);

            background: var(--off-white);

            transition: border-color .2s, box-shadow .2s;

            outline: none

        }



        .hf-input:focus {

            border-color: var(--green);

            box-shadow: 0 0 0 3px rgba(42, 138, 30, .1);

            background: var(--white)

        }



        .hf-input::placeholder {

            color: var(--ink-faint)

        }



        select.hf-input {

            cursor: pointer;

            appearance: none;

            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238EA68A' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");

            background-repeat: no-repeat;

            background-position: right .82rem center;

            padding-right: 2.1rem

        }



        .hf-btn {

            width: 100%;

            padding: .78rem;

            background: var(--grad);

            color: #fff;

            border: none;

            border-radius: 100px;

            font-family: var(--font-body);

            font-size: .92rem;

            font-weight: 700;

            cursor: pointer;

            letter-spacing: -.01em;

            box-shadow: 0 6px 20px rgba(42, 138, 30, .3);

            transition: transform .2s, box-shadow .2s;

            margin-top: .2rem

        }



        .hf-btn:hover {

            transform: translateY(-2px);

            box-shadow: 0 12px 28px rgba(42, 138, 30, .4)

        }



        .hf-wa {

            display: flex;

            align-items: center;

            justify-content: center;

            gap: 8px;

            width: 100%;

            padding: .7rem;

            background: linear-gradient(135deg, #FF416C, #FF4B2B);

            color: #fff;

            border: none;

            border-radius: 100px;

            font-family: var(--font-body);

            font-size: .86rem;

            font-weight: 700;

            cursor: pointer;

            text-decoration: none;

            transition: transform .2s, box-shadow .2s;

            box-shadow: 0 6px 20px rgba(255, 65, 108, .35);

            position: relative;

            overflow: hidden

        }



        .hf-wa::before {

            content: '';

            position: absolute;

            inset: 0;

            background: linear-gradient(135deg, rgba(255, 255, 255, .12), transparent);

            pointer-events: none

        }



        .hf-wa:hover {

            transform: translateY(-2px);

            box-shadow: 0 12px 28px rgba(255, 65, 108, .45)

        }



        .hf-wa svg {

            flex-shrink: 0

        }



        .hf-divider {

            display: flex;

            align-items: center;

            gap: .6rem;

            margin: .7rem 0;

            font-size: .67rem;

            color: var(--ink-faint);

            font-weight: 600;

            letter-spacing: .05em;

            text-transform: uppercase

        }



        .hf-divider::before,

        .hf-divider::after {

            content: '';

            flex: 1;

            height: 1px;

            background: var(--border)

        }



        .hf-note {

            text-align: center;

            font-size: .68rem;

            color: var(--ink-faint);

            margin-top: .55rem

        }



        .hf-note span {

            color: var(--green);

            font-weight: 600

        }



        /* mobile hero */

        @media(max-width:768px) {

            .hero {

                padding: 80px 5vw 28px;

                min-height: auto;

                height: auto;

                background: linear-gradient(165deg, #E8F7E5 0%, #fff 35%, #E0F6FB 65%, #F2FBF0 100%)

            }



            .hero::before {

                width: 300px;

                height: 300px;

                top: -100px;

                right: -80px;

                background: radial-gradient(circle, rgba(0, 155, 191, .12) 0%, transparent 65%)

            }



            .hero::after {

                width: 280px;

                height: 280px;

                bottom: -60px;

                left: -50px;

                background: radial-gradient(circle, rgba(58, 173, 42, .1) 0%, transparent 65%)

            }



            .hero-inner {

                grid-template-columns: 1fr;

                gap: 1.6rem

            }



            .hero-content {

                text-align: center

            }



            /* Glowing badge */

            .hero-badge {

                font-size: .68rem;

                padding: 5px 14px;

                gap: 6px;

                background: rgba(255, 255, 255, .85);

                backdrop-filter: blur(12px);

                -webkit-backdrop-filter: blur(12px);

                box-shadow: 0 2px 16px rgba(42, 138, 30, .15), 0 0 0 1px rgba(42, 138, 30, .1);

                border: none

            }



            .badge-dot {

                width: 8px;

                height: 8px;

                box-shadow: 0 0 8px rgba(58, 173, 42, .6)

            }



            /* Heading */

            h1 {

                font-size: clamp(1.65rem, 7.5vw, 2.3rem);

                line-height: 1.15;

                margin-bottom: .75rem

            }



            /* Sub text */

            .hero-sub {

                font-size: .92rem;

                margin: .5rem auto 1rem;

                max-width: 340px;

                line-height: 1.7

            }



            /* Stats — horizontal glass strip */

            .hero-stats {

                display: flex;

                flex-direction: row;

                flex-wrap: nowrap;

                gap: 0;

                background: rgba(255, 255, 255, .7);

                backdrop-filter: blur(14px);

                -webkit-backdrop-filter: blur(14px);

                border-radius: 16px;

                border: 1px solid rgba(42, 138, 30, .12);

                box-shadow: 0 4px 24px rgba(42, 138, 30, .1);

                padding: 0;

                overflow: hidden;

                margin-bottom: .75rem;

                justify-content: center;

                width: fit-content;

                margin-left: auto;

                margin-right: auto

            }



            .hero-stat {

                background: transparent;

                border: none;

                border-radius: 0;

                border-right: 1px solid rgba(42, 138, 30, .1);

                padding: .65rem .9rem;

                gap: .4rem;

                flex: 1;

                justify-content: center;

                min-width: 0

            }



            .hero-stat::before {

                display: none

            }



            .hero-stat:last-child {

                border-right: none

            }



            .hero-stat:hover {

                transform: none;

                box-shadow: none

            }



            .hs-icon {

                width: 24px;

                height: 24px;

                border-radius: 6px

            }



            .hs-icon svg {

                width: 12px;

                height: 12px

            }



            .hero-stat-num {

                font-size: 1.1rem

            }



            .hero-stat-label {

                font-size: .55rem;

                letter-spacing: .05em

            }



            /* Checks — compact 2-column pill grid */

            .hero-checks {

                display: grid;

                grid-template-columns: 1fr 1fr;

                gap: 6px;

                margin-bottom: 1.25rem;

                max-width: 380px;

                margin-left: auto;

                margin-right: auto

            }



            .hero-check {

                font-size: .73rem;

                gap: 6px;

                background: rgba(255, 255, 255, .75);

                backdrop-filter: blur(8px);

                -webkit-backdrop-filter: blur(8px);

                border: 1px solid rgba(42, 138, 30, .1);

                border-radius: 10px;

                padding: 8px 10px;

                line-height: 1.35;

                text-align: left

            }



            .hero-check::before {

                width: 15px;

                height: 15px;

                min-width: 15px;

                background-size: 10px

            }



            /* Buttons — stacked with glow */

            .hero-actions {

                flex-direction: column;

                gap: .55rem;

                margin-bottom: 1.2rem;

                max-width: 320px;

                margin-left: auto;

                margin-right: auto;

                width: 100%

            }



            .btn-primary {

                width: 100%;

                justify-content: center;

                padding: .85rem 1.5rem;

                font-size: .95rem;

                box-shadow: 0 6px 28px rgba(42, 138, 30, .35), 0 0 0 4px rgba(42, 138, 30, .08);

                animation: btnGlow 3s ease-in-out infinite

            }



            .btn-outline {

                width: 100%;

                justify-content: center;

                padding: .75rem 1.5rem;

                font-size: .9rem;

                background: rgba(255, 255, 255, .8);

                backdrop-filter: blur(8px);

                -webkit-backdrop-filter: blur(8px)

            }



            /* Form card — elevated glassmorphism */

            .hero-right {

                gap: .6rem

            }



            .hero-form-card {

                padding: 1.35rem 1.25rem;

                border-radius: 20px;

                background: rgba(255, 255, 255, .88);

                backdrop-filter: blur(16px);

                -webkit-backdrop-filter: blur(16px);

                border: 1px solid rgba(42, 138, 30, .1);

                box-shadow: 0 12px 40px rgba(0, 0, 0, .08), 0 2px 12px rgba(42, 138, 30, .06)

            }



            .hero-form-card::before {

                height: 3px;

                background: linear-gradient(90deg, #3AAD2A, #009BBF, #3AAD2A);

                background-size: 200% 100%;

                animation: gradSlide 3s linear infinite

            }



            /* Scroll & Orbs */

            .scroll-hint {

                display: none

            }



            .hero-orb1,

            .hero-orb2 {

                display: none

            }

        }



        /* Mobile hero glow animation */

        @keyframes  btnGlow {



            0%,

            100% {

                box-shadow: 0 6px 28px rgba(42, 138, 30, .35), 0 0 0 4px rgba(42, 138, 30, .08)

            }



            50% {

                box-shadow: 0 6px 28px rgba(42, 138, 30, .45), 0 0 0 8px rgba(42, 138, 30, .06)

            }

        }



        @keyframes  gradSlide {

            0% {

                background-position: 0% 0

            }



            100% {

                background-position: 200% 0

            }

        }



        /* Extra small phones */

        @media(max-width:380px) {

            .hero-checks {

                grid-template-columns: 1fr

            }



            .hero-stat {

                padding: .55rem .6rem

            }



            .hero-stat-num {

                font-size: .95rem

            }



            h1 {

                font-size: 1.5rem

            }

        }



        /* MARQUEE */

        .marquee-wrap {

            border-top: 1px solid var(--border);

            border-bottom: 1px solid var(--border);

            background: var(--white);

            overflow: hidden

        }



        .marquee-track {

            display: flex;

            animation: scroll 32s linear infinite;

            white-space: nowrap

        }



        @keyframes  scroll {

            0% {

                transform: translateX(0)

            }



            100% {

                transform: translateX(-50%)

            }

        }



        .marquee-item {

            display: inline-flex;

            align-items: center;

            gap: 10px;

            padding: 14px 2.5rem;

            font-size: .79rem;

            font-weight: 600;

            color: var(--ink-muted);

            letter-spacing: .05em;

            text-transform: uppercase;

            border-right: 1px solid var(--border);

            flex-shrink: 0

        }



        .marquee-dot {

            width: 18px;

            height: 18px;

            border-radius: 50%;

            background: var(--grad);

            flex-shrink: 0

        }



        /* SECTION LABELS */

        .section-label {

            display: inline-flex;

            align-items: center;

            gap: 7px;

            font-size: .72rem;

            font-weight: 600;

            letter-spacing: .1em;

            text-transform: uppercase;

            color: var(--teal);

            margin-bottom: .75rem

        }



        .section-label::before {

            content: '';

            width: 16px;

            height: 2px;

            border-radius: 2px;

            background: var(--teal);

            flex-shrink: 0

        }



        h2 {

            font-family: var(--font-head);

            font-size: clamp(1.3rem, 3.5vw, 2.5rem);

            font-weight: 600;

            line-height: 1.1;

            letter-spacing: -.025em;

            color: var(--ink);

            margin-bottom: 1rem

        }



        @media(max-width:640px) {

            h2 {

                font-size: clamp(1.25rem, 6vw, 1.75rem)

            }

        }



        h2 .g {

            color: var(--green)

        }



        h2 .t {

            color: var(--teal)

        }



        .section-desc {

            font-size: 1.02rem;

            color: var(--ink-muted);

            font-weight: 400;

            line-height: 1.78

        }



        .divider {

            height: 3px;

            width: 56px;

            border-radius: 3px;

            background: var(--grad);

            margin: 1rem 0 1.5rem

        }



        .divider.center {

            margin: 1rem auto 1.5rem

        }



        /* WHAT IS */

        .what-section {

            padding: 100px 5vw;

            background: #F9F7F4;

            position: relative;

            overflow: hidden

        }



        .what-section::before {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            height: 3px;

            background: linear-gradient(90deg, #2A8A1E, #009BBF)

        }



        /* grid */

        .what-grid {

            display: grid;

            grid-template-columns: 1fr 1fr;

            gap: 5rem;

            align-items: start;

            max-width: 1160px;

            margin: 0 auto

        }



        /* left */

        .what-label {

            display: inline-flex;

            align-items: center;

            gap: 8px;

            font-size: .72rem;

            font-weight: 600;

            letter-spacing: .1em;

            text-transform: uppercase;

            color: #2A8A1E;

            margin-bottom: 1rem

        }



        .what-label::before {

            content: '';

            width: 14px;

            height: 2px;

            border-radius: 2px;

            background: #2A8A1E;

            flex-shrink: 0

        }



        .what-heading {

            font-family: var(--font-head);

            font-size: clamp(1.9rem, 3.2vw, 2.8rem);

            font-weight: 600;

            line-height: 1.12;

            letter-spacing: -.03em;

            color: #1A2E18;

            margin-bottom: 1.1rem

        }



        .what-heading .gh {

            color: #2A8A1E

        }



        .what-desc {

            font-size: .97rem;

            color: #556652;

            line-height: 1.85;

            margin-bottom: 1.8rem

        }



        /* VS comparison — clean light style */

        .what-vs {

            display: flex;

            flex-direction: column;

            gap: .5rem;

            margin-bottom: 2rem;

            background: #fff;

            border: 1px solid #E2EBE0;

            border-radius: 14px;

            padding: 1.1rem 1.2rem

        }



        .vs-heading {

            font-size: .68rem;

            font-weight: 600;

            letter-spacing: .08em;

            text-transform: uppercase;

            color: #8EA68A;

            margin-bottom: .6rem

        }



        .vs-row {

            display: grid;

            grid-template-columns: 1fr 20px 1fr;

            align-items: center;

            gap: .5rem;

            font-size: .82rem

        }



        .vs-bad {

            color: #9CA3AF;

            text-decoration: line-through;

            text-decoration-color: #ECA0A0;

            background: #F9F9F9;

            border: 1px solid #EFEFEF;

            padding: .35rem .75rem;

            border-radius: 7px

        }



        .vs-arrow {

            color: #CBD5C8;

            text-align: center;

            font-size: .75rem

        }



        .vs-good {

            color: #1A5215;

            font-weight: 600;

            background: #EDF7EB;

            border: 1px solid #C6E3C2;

            padding: .35rem .75rem;

            border-radius: 7px

        }



        /* stat pills */

        .what-pills {

            display: flex;

            gap: .65rem;

            flex-wrap: wrap

        }



        .what-pill {

            display: flex;

            align-items: center;

            gap: .55rem;

            background: #fff;

            border: 1px solid #DDE8DA;

            border-radius: 12px;

            padding: .55rem 1rem;

            box-shadow: 0 1px 4px rgba(0, 0, 0, .04)

        }



        .what-pill-num {

            font-family: var(--font-head);

            font-size: 1.25rem;

            font-weight: 600;

            color: #2A8A1E;

            line-height: 1

        }



        .what-pill-text {

            font-size: .72rem;

            font-weight: 600;

            color: #8EA68A;

            letter-spacing: .04em;

            text-transform: uppercase

        }



        /* feature cards grid */

        .what-cards {

            display: grid;

            grid-template-columns: 1fr 1fr;

            gap: 1rem

        }



        .wcard {

            background: #fff;

            border: 1px solid #E4EDE1;

            border-radius: 18px;

            padding: 1.5rem;

            transition: box-shadow .25s, transform .25s;

            position: relative

        }



        .wcard:hover {

            box-shadow: 0 8px 28px rgba(42, 138, 30, .1);

            transform: translateY(-3px)

        }



        .wcard-icon {

            width: 44px;

            height: 44px;

            border-radius: 12px;

            display: flex;

            align-items: center;

            justify-content: center;

            margin-bottom: 1rem;

            flex-shrink: 0

        }



        .wcard-icon svg {

            width: 22px;

            height: 22px;

            stroke-width: 1.8

        }



        .wcard-icon.amber {

            background: #FEF3C7

        }



        .wcard-icon.amber svg {

            stroke: #D97706

        }



        .wcard-icon.sky {

            background: #E0F2FE

        }



        .wcard-icon.sky svg {

            stroke: #0284C7

        }



        .wcard-icon.violet {

            background: #EDE9FE

        }



        .wcard-icon.violet svg {

            stroke: #7C3AED

        }



        .wcard-icon.sage {

            background: #DCFCE7

        }



        .wcard-icon.sage svg {

            stroke: #16A34A

        }



        .wcard h4 {

            font-family: var(--font-head);

            font-size: .92rem;

            font-weight: 600;

            color: #1A2E18;

            margin-bottom: .45rem;

            letter-spacing: -.01em

        }



        .wcard p {

            font-size: .79rem;

            color: #556652;

            line-height: 1.65

        }



        .wcard-tag {

            display: inline-flex;

            align-items: center;

            gap: 5px;

            margin-top: .7rem;

            font-size: .67rem;

            font-weight: 600;

            letter-spacing: .05em;

            text-transform: uppercase;

            color: #2A8A1E;

            background: #EDF7EB;

            border: 1px solid #C6E3C2;

            border-radius: 100px;

            padding: 2px 9px

        }



        /* scroll-reveal */

        .reveal {

            opacity: 0;

            transform: translateY(24px);

            transition: opacity .6s cubic-bezier(.22, 1, .36, 1), transform .6s cubic-bezier(.22, 1, .36, 1)

        }



        .reveal.visible {

            opacity: 1;

            transform: translateY(0)

        }



        .reveal-delay-1 {

            transition-delay: .1s

        }



        .reveal-delay-2 {

            transition-delay: .2s

        }



        .reveal-delay-3 {

            transition-delay: .32s

        }



        .reveal-delay-4 {

            transition-delay: .44s

        }



        .reveal-delay-5 {

            transition-delay: .56s

        }



        /* HIGHLIGHTS — Program Dashboard */

        .highlights-section {

            padding: 96px 5vw;

            background: #fff;

            border-top: 1px solid #EEE9E3

        }



        .hl-header {

            text-align: center;

            max-width: 560px;

            margin: 0 auto 3.5rem

        }



        .hl-header .section-label {

            justify-content: center

        }



        .hl-header p {

            font-size: .97rem;

            color: #556652;

            line-height: 1.8;

            margin-top: .6rem

        }



        /* top row: 4 big stat cards */

        .hl-top {

            display: grid;

            grid-template-columns: repeat(4, 1fr);

            gap: 1.1rem;

            max-width: 1160px;

            margin: 0 auto 1.1rem

        }



        .hl-stat {

            border-radius: 18px;

            padding: 1.6rem 1.4rem;

            border: 1px solid transparent;

            transition: transform .25s, box-shadow .25s;

            position: relative;

            overflow: hidden

        }



        .hl-stat:hover {

            transform: translateY(-4px);

            box-shadow: 0 12px 32px rgba(0, 0, 0, .09)

        }



        .hl-stat.c-green {

            background: #F0FDF4;

            border-color: #BBF7D0

        }



        .hl-stat.c-amber {

            background: #FFFBEB;

            border-color: #FDE68A

        }



        .hl-stat.c-sky {

            background: #F0F9FF;

            border-color: #BAE6FD

        }



        .hl-stat.c-violet {

            background: #F5F3FF;

            border-color: #DDD6FE

        }



        .hl-stat-icon {

            width: 40px;

            height: 40px;

            border-radius: 10px;

            display: flex;

            align-items: center;

            justify-content: center;

            margin-bottom: 1rem

        }



        .hl-stat-icon svg {

            width: 20px;

            height: 20px;

            stroke-width: 1.8;

            fill: none

        }



        .c-green .hl-stat-icon {

            background: #DCFCE7

        }



        .c-green .hl-stat-icon svg {

            stroke: #16A34A

        }



        .c-amber .hl-stat-icon {

            background: #FEF3C7

        }



        .c-amber .hl-stat-icon svg {

            stroke: #D97706

        }



        .c-sky .hl-stat-icon {

            background: #E0F2FE

        }



        .c-sky .hl-stat-icon svg {

            stroke: #0284C7

        }



        .c-violet .hl-stat-icon {

            background: #EDE9FE

        }



        .c-violet .hl-stat-icon svg {

            stroke: #7C3AED

        }



        .hl-stat-val {

            font-family: var(--font-head);

            font-size: 2rem;

            font-weight: 600;

            line-height: 1;

            margin-bottom: .35rem;

            letter-spacing: -.03em

        }



        .c-green .hl-stat-val {

            color: #15803D

        }



        .c-amber .hl-stat-val {

            color: #B45309

        }



        .c-sky .hl-stat-val {

            color: #0369A1

        }



        .c-violet .hl-stat-val {

            color: #6D28D9

        }



        .hl-stat-label {

            font-size: .72rem;

            font-weight: 600;

            text-transform: uppercase;

            letter-spacing: .07em;

            color: #94A3A0;

            margin-bottom: .2rem

        }



        .hl-stat-note {

            font-size: 1rem;

            color: #6B7280;

            line-height: 1.5;

            margin-top: .4rem

        }



        /* bottom row: 3 info cards + 1 schedule visual */

        .hl-bottom {

            display: grid;

            grid-template-columns: 1fr 1fr 1fr 1.6fr;

            gap: 1.1rem;

            max-width: 1160px;

            margin: 0 auto

        }



        .hl-info {

            background: #F9F7F4;

            border: 1px solid #E8E3DC;

            border-radius: 18px;

            padding: 1.4rem;

            display: flex;

            align-items: flex-start;

            gap: .9rem;

            transition: box-shadow .25s

        }



        .hl-info:hover {

            box-shadow: 0 6px 22px rgba(0, 0, 0, .07)

        }



        .hl-info-icon {

            width: 36px;

            height: 36px;

            border-radius: 9px;

            display: flex;

            align-items: center;

            justify-content: center;

            flex-shrink: 0

        }



        .hl-info-icon svg {

            width: 18px;

            height: 18px;

            stroke-width: 1.8;

            fill: none

        }



        .hl-info-icon.teal-i {

            background: #CCFBF1;

        }



        .hl-info-icon.teal-i svg {

            stroke: #0D9488

        }



        .hl-info-icon.rose-i {

            background: #FFF1F2;

        }



        .hl-info-icon.rose-i svg {

            stroke: #E11D48

        }



        .hl-info-icon.slate-i {

            background: #F1F5F9;

        }



        .hl-info-icon.slate-i svg {

            stroke: #475569

        }



        .hl-info-label {

            font-size: .68rem;

            font-weight: 600;

            text-transform: uppercase;

            letter-spacing: .07em;

            color: #94A3A0;

            margin-bottom: .3rem

        }



        .hl-info-val {

            font-family: var(--font-head);

            font-size: .97rem;

            font-weight: 600;

            color: #1A2E18

        }



        .hl-info-sub {

            font-size: 1rem;

            color: #8EA68A;

            margin-top: .2rem

        }



        /* schedule visual card */

        .hl-schedule {

            background: #1A2E18;

            border-radius: 18px;

            padding: 1.5rem 1.6rem;

            color: #fff

        }



        .hl-schedule-title {

            font-size: .68rem;

            font-weight: 600;

            text-transform: uppercase;

            letter-spacing: .08em;

            color: rgba(255, 255, 255, .45);

            margin-bottom: 1.1rem

        }



        .hl-days {

            display: flex;

            gap: .45rem;

            margin-bottom: .9rem

        }



        .hl-day {

            flex: 1;

            border-radius: 9px;

            padding: .5rem .35rem;

            text-align: center;

            background: rgba(255, 255, 255, .07);

            border: 1px solid rgba(255, 255, 255, .1)

        }



        .hl-day-name {

            font-size: .6rem;

            font-weight: 600;

            letter-spacing: .06em;

            text-transform: uppercase;

            color: rgba(255, 255, 255, .45);

            margin-bottom: .3rem

        }



        .hl-day-bar {

            height: 36px;

            border-radius: 5px;

            background: linear-gradient(180deg, #3AAD2A, #2A8A1E);

            margin-bottom: .3rem;

            position: relative;

            overflow: hidden

        }



        .hl-day-bar::after {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            height: 50%;

            background: rgba(255, 255, 255, .1);

            border-radius: 5px 5px 0 0

        }



        .hl-day-hrs {

            font-size: .65rem;

            font-weight: 600;

            color: rgba(255, 255, 255, .5)

        }



        .hl-schedule-footer {

            font-family: var(--font-head);

            font-size: 1rem;

            font-weight: 600;

            color: rgba(255, 255, 255, .85);

            display: flex;

            align-items: center;

            justify-content: space-between

        }



        .hl-schedule-footer span {

            font-size: .72rem;

            color: rgba(58, 173, 42, .8);

            font-weight: 600;

            background: rgba(58, 173, 42, .12);

            padding: 3px 10px;

            border-radius: 100px;

            border: 1px solid rgba(58, 173, 42, .2)

        }



        /* CURRICULUM */

        .curriculum-section {

            padding: 96px 5vw;

            background: linear-gradient(180deg, #F6FAF5 0%, #fff 60%)

        }



        .curriculum-header {

            text-align: center;

            max-width: 580px;

            margin: 0 auto 2rem

        }



        .curriculum-header .section-label {

            justify-content: center

        }



        .curriculum-header p {

            font-size: .95rem;

            color: #556652;

            line-height: 1.75;

            margin-top: .5rem

        }



        .week-tabs-wrap {

            text-align: center;

            margin-bottom: 3rem

        }



        .week-tabs {

            display: inline-flex;

            background: #EFF4EE;

            border: 1px solid #DDE8DA;

            border-radius: 100px;

            padding: 4px;

            gap: 4px

        }



        .week-tab {

            padding: .52rem 1.35rem;

            border-radius: 100px;

            font-size: .84rem;

            font-weight: 600;

            cursor: pointer;

            transition: all .25s;

            color: #556652;

            background: transparent;

            border: none;

            font-family: var(--font-body);

            white-space: nowrap

        }



        .week-tab.active {

            background: var(--grad);

            color: #fff;

            box-shadow: 0 4px 14px rgba(42, 138, 30, .25)

        }



        .curriculum-body {

            max-width: 720px;

            margin: 0 auto

        }



        .week-panel {

            display: none

        }



        .week-panel.active {

            display: flex;

            flex-direction: column

        }



        /* Timeline items */

        .tl-item {

            display: grid;

            grid-template-columns: 52px 1fr;

            align-items: stretch

        }



        .tl-spine {

            display: flex;

            flex-direction: column;

            align-items: center

        }



        .tl-badge {

            width: 40px;

            height: 40px;

            border-radius: 50%;

            background: var(--grad);

            display: flex;

            align-items: center;

            justify-content: center;

            font-family: var(--font-head);

            font-size: .78rem;

            font-weight: 700;

            color: #fff;

            flex-shrink: 0;

            box-shadow: 0 4px 12px rgba(42, 138, 30, .28);

            position: relative;

            z-index: 1;

            margin-top: .1rem

        }



        .tl-line {

            flex: 1;

            width: 2px;

            background: linear-gradient(180deg, rgba(58, 173, 42, .25), rgba(0, 155, 191, .12));

            margin: .35rem 0

        }



        .tl-item:last-child .tl-line {

            opacity: 0

        }



        .tl-card {

            background: #fff;

            border: 1px solid #E4EDE1;

            border-radius: 16px;

            padding: 1.25rem 1.4rem;

            margin: 0 0 .9rem .75rem;

            transition: box-shadow .25s, border-color .25s

        }



        .tl-card:hover {

            border-color: rgba(42, 138, 30, .28);

            box-shadow: 0 6px 22px rgba(42, 138, 30, .1)

        }



        .tl-card-top {

            display: flex;

            align-items: flex-start;

            justify-content: space-between;

            gap: .75rem;

            margin-bottom: .45rem

        }



        .tl-title {

            font-family: var(--font-head);

            font-size: .94rem;

            font-weight: 700;

            color: #1A2E18;

            line-height: 1.25

        }



        .tl-chip {

            font-size: .6rem;

            font-weight: 700;

            letter-spacing: .06em;

            text-transform: uppercase;

            padding: 3px 9px;

            border-radius: 100px;

            white-space: nowrap;

            flex-shrink: 0;

            margin-top: 2px

        }



        .chip-onboard {

            background: #EDF7EB;

            color: #16A34A;

            border: 1px solid #C6E3C2

        }



        .chip-tech {

            background: #ECFDF5;

            color: #1D4ED8;

            border: 1px solid #BFDBFE

        }



        .chip-process {

            background: #FFF7ED;

            color: #C2410C;

            border: 1px solid #FED7AA

        }



        .chip-project {

            background: #F5F3FF;

            color: #6D28D9;

            border: 1px solid #DDD6FE

        }



        .chip-review {

            background: #FFF1F2;

            color: #BE123C;

            border: 1px solid #FECDD3

        }



        .chip-exec {

            background: #ECFDF5;

            color: #065F46;

            border: 1px solid #A7F3D0

        }



        .chip-iter {

            background: #F0FDF4;

            color: #15803D;

            border: 1px solid #BBF7D0

        }



        .chip-peer {

            background: #FEF9C3;

            color: #854D0E;

            border: 1px solid #FDE68A

        }



        .chip-present {

            background: #F0F9FF;

            color: #075985;

            border: 1px solid #BAE6FD

        }



        .chip-cert {

            background: linear-gradient(135deg, #EDF7EB, #E0F6FB);

            color: #1A5215;

            border: 1px solid #C6E3C2

        }



        .tl-desc {

            font-size: .83rem;

            color: #556652;

            line-height: 1.7

        }



        /* mobile */

        @media(max-width:600px) {

            .curriculum-section {

                padding: 72px 4vw

            }



            .week-tabs {

                width: 100%

            }



            .week-tab {

                flex: 1;

                padding: .5rem .6rem;

                font-size: .78rem;

                text-align: center

            }



            .tl-badge {

                width: 34px;

                height: 34px;

                font-size: .72rem

            }



            .tl-card {

                padding: 1rem 1.1rem;

                margin-bottom: .75rem

            }



            .tl-title {

                font-size: .88rem

            }



            .tl-desc {

                font-size: .8rem

            }

        }



        /* SCHEDULE */

        .schedule-section {

            padding: 100px 5vw;

            background: #fff;

            border-top: 1px solid #EEE9E3

        }



        .sched-header {

            text-align: center;

            max-width: 540px;

            margin: 0 auto 3.5rem

        }



        .sched-header .section-label {

            justify-content: center

        }



        .sched-header p {

            font-size: .97rem;

            color: #556652;

            line-height: 1.8;

            margin-top: .5rem

        }



        /* two-column layout */

        .sched-layout {

            display: grid;

            grid-template-columns: 280px 1fr;

            gap: 3.5rem;

            max-width: 1060px;

            margin: 0 auto;

            align-items: start

        }



        /* LEFT sticky panel */

        .sched-panel {

            position: sticky;

            top: 96px

        }



        .sched-panel-card {

            background: #F9F7F4;

            border: 1px solid #E8E3DC;

            border-radius: 20px;

            padding: 1.8rem 1.6rem;

            margin-bottom: 1rem

        }



        .sched-panel-title {

            font-family: var(--font-head);

            font-size: .72rem;

            font-weight: 700;

            letter-spacing: .09em;

            text-transform: uppercase;

            color: #8EA68A;

            margin-bottom: 1.2rem

        }



        .sched-stat-row {

            display: flex;

            align-items: center;

            gap: .8rem;

            padding: .6rem 0;

            border-bottom: 1px solid #EDE9E3

        }



        .sched-stat-row:last-child {

            border-bottom: none

        }



        .sched-stat-icon {

            width: 32px;

            height: 32px;

            border-radius: 8px;

            display: flex;

            align-items: center;

            justify-content: center;

            flex-shrink: 0

        }



        .sched-stat-icon svg {

            width: 16px;

            height: 16px;

            fill: none;

            stroke-width: 1.8

        }



        .ssi-green {

            background: #DCFCE7

        }



        .ssi-green svg {

            stroke: #16A34A

        }



        .ssi-amber {

            background: #FEF3C7

        }



        .ssi-amber svg {

            stroke: #D97706

        }



        .ssi-sky {

            background: #E0F2FE

        }



        .ssi-sky svg {

            stroke: #0284C7

        }



        .ssi-violet {

            background: #EDE9FE

        }



        .ssi-violet svg {

            stroke: #7C3AED

        }



        .sched-stat-info strong {

            display: block;

            font-family: var(--font-head);

            font-size: .97rem;

            font-weight: 700;

            color: #1A2E18;

            line-height: 1.2

        }



        .sched-stat-info span {

            font-size: .74rem;

            color: #8EA68A

        }



        /* day bar visual */

        .sched-bar-card {

            background: #1A2E18;

            border-radius: 20px;

            padding: 1.5rem 1.6rem

        }



        .sched-bar-label {

            font-size: .68rem;

            font-weight: 700;

            text-transform: uppercase;

            letter-spacing: .08em;

            color: rgba(255, 255, 255, .4);

            margin-bottom: .9rem

        }



        .sched-bar-track {

            height: 10px;

            background: rgba(255, 255, 255, .1);

            border-radius: 100px;

            position: relative;

            overflow: hidden;

            margin-bottom: .55rem

        }



        .sched-bar-fill {

            height: 100%;

            width: 0;

            background: linear-gradient(90deg, #3AAD2A, #009BBF);

            border-radius: 100px;

            transition: width 1.2s cubic-bezier(.22, 1, .36, 1)

        }



        .sched-bar-ticks {

            display: flex;

            justify-content: space-between;

            font-size: .62rem;

            color: rgba(255, 255, 255, .35);

            font-weight: 600

        }



        /* RIGHT: accordion cards */

        .sched-cards {

            display: flex;

            flex-direction: column;

            gap: .65rem

        }



        .sched-card {

            background: #F9F7F4;

            border: 1px solid #E8E3DC;

            border-radius: 16px;

            overflow: hidden;

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

            cursor: pointer

        }



        .sched-card:hover {

            border-color: #C8D9C4;

            box-shadow: 0 4px 18px rgba(0, 0, 0, .07)

        }



        .sched-card.open {

            border-color: #B8D4B2;

            box-shadow: 0 6px 24px rgba(42, 138, 30, .09)

        }



        .sched-card-head {

            display: grid;

            grid-template-columns: auto 1fr auto;

            align-items: center;

            gap: 1rem;

            padding: 1rem 1.2rem

        }



        .sched-time {

            font-family: var(--font-head);

            font-size: .78rem;

            font-weight: 700;

            color: #2A8A1E;

            white-space: nowrap;

            min-width: 62px

        }



        .sched-card-main {

            display: flex;

            align-items: center;

            gap: .7rem

        }



        .sched-type {

            display: inline-flex;

            align-items: center;

            gap: 5px;

            font-size: .64rem;

            font-weight: 700;

            letter-spacing: .06em;

            text-transform: uppercase;

            border-radius: 100px;

            padding: 2px 9px;

            flex-shrink: 0

        }



        .type-meeting {

            background: #ECFDF5;

            color: #1D4ED8;

            border: 1px solid #BFDBFE

        }



        .type-learning {

            background: #FFFBEB;

            color: #92400E;

            border: 1px solid #FDE68A

        }



        .type-work {

            background: #F0FDF4;

            color: #15803D;

            border: 1px solid #BBF7D0

        }



        .type-break {

            background: #F8FAFC;

            color: #475569;

            border: 1px solid #E2E8F0

        }



        .type-mentor {

            background: #F5F3FF;

            color: #5B21B6;

            border: 1px solid #DDD6FE

        }



        .type-review {

            background: #F0FDFA;

            color: #0F766E;

            border: 1px solid #99F6E4

        }



        .type-reflect {

            background: #FFF1F2;

            color: #BE123C;

            border: 1px solid #FECDD3

        }



        .sched-title {

            font-family: var(--font-head);

            font-size: .9rem;

            font-weight: 700;

            color: #1A2E18

        }



        .sched-chevron {

            width: 20px;

            height: 20px;

            flex-shrink: 0;

            transition: transform .3s cubic-bezier(.22, 1, .36, 1)

        }



        .sched-chevron svg {

            width: 16px;

            height: 16px;

            stroke: #8EA68A;

            stroke-width: 2;

            fill: none

        }



        .sched-card.open .sched-chevron {

            transform: rotate(180deg)

        }



        .sched-body {

            max-height: 0;

            overflow: hidden;

            transition: max-height .35s cubic-bezier(.22, 1, .36, 1), padding .35s

        }



        .sched-card.open .sched-body {

            max-height: 200px

        }



        .sched-body-inner {

            padding: 0 1.2rem 1rem 1.2rem;

            padding-left: calc(1.2rem + 62px + 1rem)

        }



        .sched-body-inner p {

            font-size: .84rem;

            color: #556652;

            line-height: 1.7;

            border-top: 1px solid #E8E3DC;

            padding-top: .85rem

        }



        /* left accent per type */

        .sched-card {

            border-left: 3px solid transparent

        }



        .sched-card[data-type="meeting"] {

            border-left-color: #3B82F6

        }



        .sched-card[data-type="learning"] {

            border-left-color: #F59E0B

        }



        .sched-card[data-type="work"] {

            border-left-color: #22C55E

        }



        .sched-card[data-type="break"] {

            border-left-color: #94A3B8

        }



        .sched-card[data-type="mentor"] {

            border-left-color: #8B5CF6

        }



        .sched-card[data-type="review"] {

            border-left-color: #14B8A6

        }



        .sched-card[data-type="reflect"] {

            border-left-color: #F43F5E

        }



        /* BENEFITS */

        .benefits-section {

            padding: 100px 5vw;

            background: #F9F7F4;

            border-top: 1px solid #EEE9E3

        }



        .ben-wrap {

            max-width: 1160px;

            margin: 0 auto

        }



        /* header — left aligned, paired with intro */

        .ben-top {

            display: grid;

            grid-template-columns: 1fr 1fr;

            gap: 4rem;

            align-items: end;

            margin-bottom: 3rem

        }



        .ben-top-right p {

            font-size: .97rem;

            color: #556652;

            line-height: 1.8

        }



        .ben-count {

            font-family: var(--font-head);

            font-size: 3.5rem;

            font-weight: 700;

            color: #E8E3DC;

            line-height: 1;

            margin-bottom: .25rem;

            letter-spacing: -.04em

        }



        .ben-count span {

            font-size: 1rem;

            font-weight: 600;

            color: #8EA68A;

            letter-spacing: .05em;

            text-transform: uppercase;

            vertical-align: super;

            margin-left: 4px

        }



        /* featured row: 1 wide + 2 regular */

        .ben-row-1 {

            display: grid;

            grid-template-columns: 2fr 1fr 1fr;

            gap: 1rem;

            margin-bottom: 1rem

        }



        /* regular rows */

        .ben-row-2,

        .ben-row-3 {

            display: grid;

            grid-template-columns: repeat(4, 1fr);

            gap: 1rem;

            margin-bottom: 1rem

        }



        .ben-row-3 {

            grid-template-columns: repeat(3, 1fr)

        }



        /* card base */

        .bcard {

            background: #fff;

            border: 1px solid #E4EDE1;

            border-radius: 18px;

            padding: 1.6rem;

            position: relative;

            overflow: hidden;

            transition: transform .28s cubic-bezier(.22, 1, .36, 1), box-shadow .28s, border-color .28s

        }



        .bcard:hover {

            transform: translateY(-4px);

            box-shadow: 0 10px 32px rgba(0, 0, 0, .09);

            border-color: #C8D4C4

        }



        /* featured card */

        .bcard.featured {

            padding: 2rem;

            display: flex;

            flex-direction: column;

            justify-content: space-between;

            min-height: 200px

        }



        .bcard.featured .bcard-body {

            display: flex;

            gap: 1.5rem;

            align-items: flex-start

        }



        .bcard.featured .bcard-icon {

            width: 52px;

            height: 52px;

            border-radius: 14px;

            flex-shrink: 0

        }



        .bcard.featured h4 {

            font-family: var(--font-head);

            font-size: 1.15rem;

            font-weight: 700;

            color: #1A2E18;

            margin-bottom: .55rem

        }



        .bcard.featured p {

            font-size: .88rem;

            color: #556652;

            line-height: 1.7

        }



        .bcard-ribbon {

            display: inline-flex;

            align-items: center;

            gap: 5px;

            font-size: .66rem;

            font-weight: 700;

            letter-spacing: .07em;

            text-transform: uppercase;

            background: #EDF7EB;

            color: #16A34A;

            border: 1px solid #C6E3C2;

            border-radius: 100px;

            padding: 3px 10px;

            margin-top: 1.1rem;

            width: fit-content

        }



        /* standard card */

        .bcard-icon {

            width: 44px;

            height: 44px;

            border-radius: 12px;

            display: flex;

            align-items: center;

            justify-content: center;

            margin-bottom: 1rem;

            flex-shrink: 0

        }



        .bcard-icon svg {

            width: 20px;

            height: 20px;

            fill: none;

            stroke-width: 1.8

        }



        .bcard h4 {

            font-family: var(--font-head);

            font-size: .9rem;

            font-weight: 700;

            color: #1A2E18;

            margin-bottom: .4rem;

            letter-spacing: -.01em

        }



        .bcard p {

            font-size: .79rem;

            color: #556652;

            line-height: 1.65

        }



        /* colour themes */

        .bc-green .bcard-icon {

            background: #DCFCE7

        }



        .bc-green .bcard-icon svg {

            stroke: #16A34A

        }



        .bc-amber .bcard-icon {

            background: #FEF3C7

        }



        .bc-amber .bcard-icon svg {

            stroke: #D97706

        }



        .bc-sky .bcard-icon {

            background: #E0F2FE

        }



        .bc-sky .bcard-icon svg {

            stroke: #0284C7

        }



        .bc-violet .bcard-icon {

            background: #EDE9FE

        }



        .bc-violet .bcard-icon svg {

            stroke: #7C3AED

        }



        .bc-teal .bcard-icon {

            background: #CCFBF1

        }



        .bc-teal .bcard-icon svg {

            stroke: #0D9488

        }



        .bc-rose .bcard-icon {

            background: #FFF1F2

        }



        .bc-rose .bcard-icon svg {

            stroke: #E11D48

        }



        .bc-slate .bcard-icon {

            background: #F1F5F9

        }



        .bc-slate .bcard-icon svg {

            stroke: #475569

        }



        /* top accent line per theme */

        .bcard::before {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            height: 3px;

            border-radius: 18px 18px 0 0

        }



        .bc-green::before {

            background: #22C55E

        }



        .bc-amber::before {

            background: #F59E0B

        }



        .bc-sky::before {

            background: #38BDF8

        }



        .bc-violet::before {

            background: #8B5CF6

        }



        .bc-teal::before {

            background: #2DD4BF

        }



        .bc-rose::before {

            background: #FB7185

        }



        .bc-slate::before {

            background: #94A3B8

        }



        /* WHO */

        /* WHO */

        .who-section {

            padding: 100px 5vw;

            background: #fff;

            border-top: 1px solid #EEE9E3

        }



        .who-header {

            text-align: center;

            max-width: 520px;

            margin: 0 auto 3rem

        }



        .who-header p {

            font-size: .97rem;

            color: #556652;

            line-height: 1.8;

            margin-top: .5rem

        }



        .who-grid {

            display: grid;

            grid-template-columns: repeat(3, 1fr);

            gap: 1.1rem;

            max-width: 1120px;

            margin: 0 auto 2.5rem

        }



        .who-card {

            background: #F9F7F4;

            border: 1px solid #E4EDE1;

            border-radius: 20px;

            padding: 1.75rem 1.6rem;

            position: relative;

            overflow: hidden;

            transition: transform .28s cubic-bezier(.22, 1, .36, 1), box-shadow .28s, border-color .28s;

            cursor: default

        }



        .who-card:hover {

            transform: translateY(-5px);

            box-shadow: 0 12px 36px rgba(0, 0, 0, .09);

            border-color: #C0D4BA

        }



        .who-card::after {

            content: '';

            position: absolute;

            bottom: 0;

            left: 0;

            right: 0;

            height: 3px;

            border-radius: 0 0 20px 20px;

            background: linear-gradient(90deg, #3AAD2A, #009BBF);

            transform: scaleX(0);

            transform-origin: left;

            transition: transform .35s cubic-bezier(.22, 1, .36, 1)

        }



        .who-card:hover::after {

            transform: scaleX(1)

        }



        .who-card-role {

            display: inline-flex;

            align-items: center;

            gap: 6px;

            font-size: .68rem;

            font-weight: 700;

            letter-spacing: .08em;

            text-transform: uppercase;

            color: #2A8A1E;

            background: #EDF7EB;

            border: 1px solid #C6E3C2;

            border-radius: 100px;

            padding: 3px 11px;

            margin-bottom: 1.1rem

        }



        .who-card-role svg {

            width: 11px;

            height: 11px;

            stroke: #2A8A1E;

            stroke-width: 2;

            fill: none

        }



        .who-card h4 {

            font-family: var(--font-head);

            font-size: .97rem;

            font-weight: 700;

            color: #1A2E18;

            margin-bottom: .55rem;

            line-height: 1.35;

            letter-spacing: -.01em

        }



        .who-card p {

            font-size: .81rem;

            color: #556652;

            line-height: 1.7

        }



        .who-card-icon {

            width: 42px;

            height: 42px;

            border-radius: 12px;

            display: flex;

            align-items: center;

            justify-content: center;

            margin-bottom: 1.1rem

        }



        .who-card-icon svg {

            width: 20px;

            height: 20px;

            fill: none;

            stroke-width: 1.8

        }



        .wci-green {

            background: #DCFCE7

        }



        .wci-green svg {

            stroke: #16A34A

        }



        .wci-sky {

            background: #E0F2FE

        }



        .wci-sky svg {

            stroke: #0284C7

        }



        .wci-amber {

            background: #FEF3C7

        }



        .wci-amber svg {

            stroke: #D97706

        }



        .wci-violet {

            background: #EDE9FE

        }



        .wci-violet svg {

            stroke: #7C3AED

        }



        .wci-rose {

            background: #FFF1F2

        }



        .wci-rose svg {

            stroke: #E11D48

        }



        .wci-teal {

            background: #CCFBF1

        }



        .wci-teal svg {

            stroke: #0D9488

        }



        /* bottom CTA strip */

        .who-cta-strip {

            max-width: 1120px;

            margin: 0 auto;

            background: #1A2E18;

            border-radius: 20px;

            padding: 1.6rem 2rem;

            display: flex;

            align-items: center;

            justify-content: space-between;

            gap: 1.5rem

        }



        .who-cta-strip p {

            font-size: .95rem;

            color: rgba(255, 255, 255, .7);

            line-height: 1.6;

            max-width: 560px

        }



        .who-cta-strip p strong {

            color: #fff;

            font-weight: 700

        }



        .who-cta-btn {

            display: inline-flex;

            align-items: center;

            gap: 8px;

            background: linear-gradient(135deg, #3AAD2A, #009BBF);

            color: #fff;

            font-family: var(--font-head);

            font-size: .88rem;

            font-weight: 700;

            padding: .7rem 1.6rem;

            border-radius: 100px;

            text-decoration: none;

            white-space: nowrap;

            box-shadow: 0 6px 20px rgba(42, 138, 30, .3);

            transition: transform .2s, box-shadow .2s;

            flex-shrink: 0

        }



        .who-cta-btn:hover {

            transform: translateY(-2px);

            box-shadow: 0 10px 28px rgba(42, 138, 30, .38)

        }



        /* CERTIFICATE */

        .cert-section {

            padding: 100px 5vw;

            background: var(--white)

        }



        .cert-inner {

            max-width: 1120px;

            margin: 0 auto;

            display: grid;

            grid-template-columns: 1.15fr 1fr;

            gap: 4.5rem;

            align-items: center

        }



        .cert-visual {

            background: var(--white);

            border: 1px solid var(--border);

            border-radius: var(--radius);

            padding: 2.5rem;

            box-shadow: var(--shadow-lg);

            position: relative;

            overflow: hidden

        }



        .cert-visual::before {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            height: 4px;

            background: var(--grad)

        }



        .cert-header {

            display: flex;

            justify-content: space-between;

            align-items: center;

            margin-bottom: 2rem

        }



        .cert-org {

            font-family: var(--font-head);

            font-size: 1.1rem;

            font-weight: 600;

            background: var(--grad);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

            background-clip: text

        }



        .cert-seal {

            width: 58px;

            height: 58px;

            border-radius: 50%;

            background: linear-gradient(var(--white), var(--white)) padding-box, var(--grad) border-box;

            border: 2px solid transparent;

            display: flex;

            align-items: center;

            justify-content: center;

            text-align: center;

            font-size: .5rem;

            font-weight: 700;

            color: var(--green);

            letter-spacing: .04em;

            text-transform: uppercase;

            line-height: 1.3

        }



        .cert-tag {

            font-size: .7rem;

            color: var(--ink-faint);

            text-transform: uppercase;

            letter-spacing: .1em;

            margin-bottom: 5px

        }



        .cert-main-title {

            font-family: var(--font-head);

            font-size: 1.5rem;

            font-weight: 600;

            color: var(--ink);

            letter-spacing: -.02em;

            margin-bottom: 1.75rem

        }



        .cert-awardee-label {

            font-size: .7rem;

            color: var(--ink-faint);

            text-transform: uppercase;

            letter-spacing: .1em;

            margin-bottom: 4px

        }



        .cert-awardee-name {

            font-family: var(--font-head);

            font-size: 1.2rem;

            font-weight: 600;

            background: var(--grad);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

            background-clip: text;

            padding-bottom: 12px;

            border-bottom: 1px solid var(--border);

            margin-bottom: 1.5rem

        }



        .cert-body-text {

            font-size: .82rem;

            color: var(--ink-muted);

            line-height: 1.75;

            margin-bottom: 1.5rem

        }



        .cert-meta {

            display: grid;

            grid-template-columns: repeat(3, 1fr);

            gap: 1rem

        }



        .cert-meta-item .tag {

            font-size: .67rem;

            color: var(--ink-faint);

            text-transform: uppercase;

            letter-spacing: .08em;

            margin-bottom: 3px

        }



        .cert-meta-item strong {

            font-size: .88rem;

            font-weight: 600;

            color: var(--ink)

        }



        /* TESTIMONIALS */

        /* TESTIMONIALS — slider */

        .testi-section {

            padding: 100px 5vw;

            background: #F9F7F4;

            border-top: 1px solid #EEE9E3;

            overflow: hidden

        }



        .testi-head {

            text-align: center;

            max-width: 520px;

            margin: 0 auto 3rem

        }



        .testi-head .section-label {

            justify-content: center

        }



        .testi-head p {

            font-size: .97rem;

            color: #556652;

            line-height: 1.8;

            margin-top: .5rem

        }



        /* slider layout */

        .testi-slider-wrap {

            position: relative;

            max-width: 840px;

            margin: 0 auto

        }



        /* track — overflow hidden for slide effect */

        .testi-track {

            overflow: hidden;

            border-radius: 24px

        }



        .testi-slides {

            display: flex;

            transition: transform .55s cubic-bezier(.22, 1, .36, 1)

        }



        .testi-slide {

            min-width: 100%;

            background: #fff;

            border: 1px solid #E4EDE1;

            border-radius: 24px;

            padding: 3rem 3.5rem;

            box-sizing: border-box;

            position: relative;

            overflow: hidden

        }



        .testi-slide::before {

            content: '\201C';

            position: absolute;

            top: .5rem;

            left: 2rem;

            font-size: 8rem;

            line-height: 1;

            color: #E8F4E5;

            font-family: Georgia, serif;

            pointer-events: none;

            user-select: none

        }



        /* stars */

        .testi-stars {

            display: flex;

            gap: 3px;

            margin-bottom: 1.4rem

        }



        .testi-stars svg {

            width: 16px;

            height: 16px

        }



        /* quote text */

        .testi-quote {

            font-size: 1.07rem;

            color: #2A3D28;

            line-height: 1.85;

            font-style: italic;

            margin-bottom: 2rem;

            position: relative;

            z-index: 1

        }



        /* author row */

        .testi-author {

            display: flex;

            align-items: center;

            gap: 1rem;

            border-top: 1px solid #EEE9E3;

            padding-top: 1.4rem

        }



        .testi-av {

            width: 46px;

            height: 46px;

            border-radius: 50%;

            background: linear-gradient(135deg, #3AAD2A, #009BBF);

            display: flex;

            align-items: center;

            justify-content: center;

            font-family: var(--font-head);

            font-size: .8rem;

            font-weight: 700;

            color: #fff;

            flex-shrink: 0;

            letter-spacing: .03em

        }



        .testi-name {

            font-family: var(--font-head);

            font-size: .92rem;

            font-weight: 700;

            color: #1A2E18;

            margin-bottom: 2px

        }



        .testi-role {

            font-size: .76rem;

            color: #8EA68A;

            font-weight: 500

        }



        .testi-placed {

            margin-left: auto;

            display: inline-flex;

            align-items: center;

            gap: 5px;

            font-size: .7rem;

            font-weight: 700;

            text-transform: uppercase;

            letter-spacing: .06em;

            color: #16A34A;

            background: #EDF7EB;

            border: 1px solid #C6E3C2;

            border-radius: 100px;

            padding: 3px 10px;

            white-space: nowrap

        }



        .testi-placed svg {

            width: 11px;

            height: 11px;

            stroke: #16A34A;

            stroke-width: 2;

            fill: none

        }



        /* arrows */

        .testi-arrow {

            position: absolute;

            top: 50%;

            transform: translateY(-50%);

            width: 44px;

            height: 44px;

            border-radius: 50%;

            background: #fff;

            border: 1.5px solid #E4EDE1;

            display: flex;

            align-items: center;

            justify-content: center;

            cursor: pointer;

            z-index: 5;

            transition: border-color .2s, box-shadow .2s, transform .2s;

            box-shadow: 0 2px 10px rgba(0, 0, 0, .07)

        }



        .testi-arrow:hover {

            border-color: #2A8A1E;

            box-shadow: 0 4px 18px rgba(42, 138, 30, .15);

            transform: translateY(-50%) scale(1.07)

        }



        .testi-arrow svg {

            width: 16px;

            height: 16px;

            stroke: #2A8A1E;

            stroke-width: 2;

            fill: none

        }



        .testi-prev {

            left: -22px

        }



        .testi-next {

            right: -22px

        }



        /* dots + progress */

        .testi-footer {

            display: flex;

            flex-direction: column;

            align-items: center;

            gap: 1rem;

            margin-top: 1.6rem

        }



        .testi-dots {

            display: flex;

            gap: .55rem

        }



        .testi-dot {

            width: 8px;

            height: 8px;

            border-radius: 100px;

            background: #D9E8D6;

            border: none;

            cursor: pointer;

            transition: width .3s, background .3s;

            padding: 0

        }



        .testi-dot.active {

            width: 26px;

            background: #2A8A1E

        }



        /* progress bar */

        .testi-progress-wrap {

            width: 200px;

            height: 3px;

            background: #E4EDE1;

            border-radius: 100px;

            overflow: hidden

        }



        .testi-progress-bar {

            height: 100%;

            width: 0;

            background: linear-gradient(90deg, #3AAD2A, #009BBF);

            border-radius: 100px;

            transition: width linear

        }



        /* mini cards strip below */

        .testi-strip {

            display: grid;

            grid-template-columns: repeat(5, 1fr);

            gap: .65rem;

            max-width: 840px;

            margin: 1.4rem auto 0

        }



        .testi-mini {

            background: #fff;

            border: 1.5px solid #E4EDE1;

            border-radius: 14px;

            padding: .85rem 1rem;

            cursor: pointer;

            transition: border-color .2s, box-shadow .2s;

            text-align: left

        }



        .testi-mini.active {

            border-color: #2A8A1E;

            box-shadow: 0 4px 14px rgba(42, 138, 30, .12)

        }



        .testi-mini:hover {

            border-color: #B8D4B2

        }



        .testi-mini-av {

            width: 32px;

            height: 32px;

            border-radius: 50%;

            background: linear-gradient(135deg, #3AAD2A, #009BBF);

            display: flex;

            align-items: center;

            justify-content: center;

            font-family: var(--font-head);

            font-size: .62rem;

            font-weight: 700;

            color: #fff;

            margin-bottom: .5rem

        }



        .testi-mini-name {

            font-family: var(--font-head);

            font-size: .73rem;

            font-weight: 700;

            color: #1A2E18;

            line-height: 1.2;

            margin-bottom: 2px

        }



        .testi-mini-role {

            font-size: .65rem;

            color: #8EA68A;

            line-height: 1.3

        }



        .testi-name {

            font-size: .88rem;

            font-weight: 600;

            color: var(--ink)

        }



        .testi-role {

            font-size: .74rem;

            color: var(--ink-faint)

        }



        /* FAQ */

        /* FAQ */

        .faq-section {

            padding: 100px 5vw;

            background: #F9F7F4;

            border-top: 1px solid #EEE9E3

        }



        .faq-layout {

            display: grid;

            grid-template-columns: 320px 1fr;

            gap: 4rem;

            max-width: 1100px;

            margin: 0 auto

        }



        /* left panel */

        .faq-left {

            position: sticky;

            top: 96px;

            align-self: start

        }



        .faq-left .section-label {

            margin-bottom: .75rem

        }



        .faq-left h2 {

            margin-bottom: .9rem

        }



        .faq-left-desc {

            font-size: .93rem;

            color: #556652;

            line-height: 1.8;

            margin-bottom: 2rem

        }



        .faq-contact-card {

            background: #1A2E18;

            border-radius: 18px;

            padding: 1.5rem;

            color: #fff

        }



        .faq-contact-title {

            font-family: var(--font-head);

            font-size: .88rem;

            font-weight: 700;

            color: rgba(255, 255, 255, .9);

            margin-bottom: .35rem

        }



        .faq-contact-sub {

            font-size: .76rem;

            color: rgba(255, 255, 255, .5);

            line-height: 1.6;

            margin-bottom: 1.1rem

        }



        .faq-contact-btns {

            display: flex;

            flex-direction: column;

            gap: .55rem

        }



        .faq-contact-btn {

            display: flex;

            align-items: center;

            gap: .6rem;

            padding: .6rem .9rem;

            border-radius: 10px;

            font-size: .8rem;

            font-weight: 600;

            text-decoration: none;

            transition: background .2s

        }



        .faq-contact-btn.call {

            background: rgba(58, 173, 42, .18);

            color: #6EE05E;

            border: 1px solid rgba(58, 173, 42, .25)

        }



        .faq-contact-btn.call:hover {

            background: rgba(58, 173, 42, .28)

        }



        .faq-contact-btn.chat {

            background: rgba(0, 184, 224, .14);

            color: #67D9F0;

            border: 1px solid rgba(0, 184, 224, .22)

        }



        .faq-contact-btn.chat:hover {

            background: rgba(0, 184, 224, .24)

        }



        .faq-contact-btn svg {

            width: 15px;

            height: 15px;

            fill: none;

            stroke: currentColor;

            stroke-width: 1.8;

            flex-shrink: 0

        }



        /* right: accordion */

        .faq-list {

            display: flex;

            flex-direction: column;

            gap: .65rem

        }



        .faq-item {

            background: #fff;

            border: 1.5px solid #E4EDE1;

            border-radius: 16px;

            overflow: hidden;

            transition: border-color .25s, box-shadow .25s

        }



        .faq-item.open {

            border-color: #B8D4B2;

            box-shadow: 0 6px 24px rgba(42, 138, 30, .09)

        }



        .faq-q {

            width: 100%;

            background: none;

            border: none;

            text-align: left;

            padding: 1.2rem 1.4rem;

            display: flex;

            justify-content: space-between;

            align-items: center;

            cursor: pointer;

            font-family: var(--font-head);

            font-size: .92rem;

            font-weight: 700;

            color: #1A2E18;

            gap: 1rem;

            transition: color .2s;

            line-height: 1.4

        }



        .faq-q:hover {

            color: #2A8A1E

        }



        .faq-item.open .faq-q {

            color: #2A8A1E

        }



        .faq-icon-wrap {

            width: 28px;

            height: 28px;

            border-radius: 8px;

            border: 1.5px solid #E4EDE1;

            display: flex;

            align-items: center;

            justify-content: center;

            flex-shrink: 0;

            transition: all .3s;

            background: #F9F7F4

        }



        .faq-icon-wrap svg {

            width: 14px;

            height: 14px;

            stroke: #8EA68A;

            stroke-width: 2.2;

            fill: none;

            transition: transform .35s cubic-bezier(.22, 1, .36, 1)

        }



        .faq-item.open .faq-icon-wrap {

            background: linear-gradient(135deg, #3AAD2A, #009BBF);

            border-color: transparent

        }



        .faq-item.open .faq-icon-wrap svg {

            stroke: #fff;

            transform: rotate(45deg)

        }



        .faq-a {

            max-height: 0;

            overflow: hidden;

            transition: max-height .38s cubic-bezier(.22, 1, .36, 1)

        }



        .faq-item.open .faq-a {

            max-height: 320px

        }



        .faq-a-inner {

            padding: 0 1.4rem 1.3rem;

            border-top: 1px solid #EEE9E3;

            margin: 0 1.4rem;

            padding-top: 1rem

        }



        .faq-a-inner p {

            font-size: .86rem;

            color: #556652;

            line-height: 1.82

        }



        /* category tags on questions */

        .faq-tag {

            display: inline-flex;

            font-size: .62rem;

            font-weight: 700;

            letter-spacing: .06em;

            text-transform: uppercase;

            border-radius: 100px;

            padding: 2px 8px;

            margin-right: .5rem;

            flex-shrink: 0;

            white-space: nowrap

        }



        .ftag-program {

            background: #EDF7EB;

            color: #16A34A;

            border: 1px solid #C6E3C2

        }



        .ftag-career {

            background: #ECFDF5;

            color: #1D4ED8;

            border: 1px solid #BFDBFE

        }



        .ftag-fees {

            background: #FFFBEB;

            color: #92400E;

            border: 1px solid #FDE68A

        }



        .ftag-general {

            background: #F5F3FF;

            color: #5B21B6;

            border: 1px solid #DDD6FE

        }



        /* PLACEMENTS */

        .placements-section {

            padding: 100px 5vw;

            background: #fff;

            border-top: 1px solid #EEE9E3

        }



        .placements-header {

            text-align: center;

            max-width: 600px;

            margin: 0 auto 3.5rem

        }



        .placements-header .section-label {

            justify-content: center

        }



        .placements-header p {

            font-size: .97rem;

            color: #556652;

            line-height: 1.8;

            margin-top: .6rem

        }



        .placements-stats {

            display: flex;

            justify-content: center;

            gap: 2.5rem;

            flex-wrap: wrap;

            margin-bottom: 3.5rem

        }



        .pl-stat {

            text-align: center

        }



        .pl-stat-num {

            font-family: var(--font-head);

            font-size: 2rem;

            font-weight: 700;

            background: var(--grad);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

            background-clip: text;

            line-height: 1

        }



        .pl-stat-label {

            font-size: .7rem;

            font-weight: 600;

            text-transform: uppercase;

            letter-spacing: .07em;

            color: #8EA68A;

            margin-top: 4px

        }



        .placements-grid {

            display: grid;

            grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));

            gap: 1.25rem;

            max-width: 1160px;

            margin: 0 auto

        }



        .pl-card {

            background: #fff;

            border: 1px solid #E4EDE1;

            border-radius: 20px;

            padding: 1.5rem;

            display: flex;

            flex-direction: column;

            gap: .75rem;

            transition: transform .25s, box-shadow .25s;

            position: relative;

            overflow: hidden

        }



        .pl-card::before {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            height: 3px;

            background: var(--grad)

        }



        .pl-card:hover {

            transform: translateY(-4px);

            box-shadow: 0 12px 36px rgba(42, 138, 30, .12)

        }



        .pl-avatar {

            width: 52px;

            height: 52px;

            border-radius: 50%;

            object-fit: cover;

            border: 2px solid #E4EDE1

        }



        .pl-avatar-fallback {

            width: 52px;

            height: 52px;

            border-radius: 50%;

            background: var(--grad);

            display: flex;

            align-items: center;

            justify-content: center;

            font-family: var(--font-head);

            font-size: 1.1rem;

            font-weight: 700;

            color: #fff;

            flex-shrink: 0

        }



        .pl-info {

            flex: 1

        }



        .pl-name {

            font-family: var(--font-head);

            font-size: .95rem;

            font-weight: 700;

            color: #1A2E18;

            margin-bottom: 2px

        }



        .pl-role {

            font-size: .78rem;

            color: #556652;

            font-weight: 500;

            margin-bottom: .5rem

        }



        .pl-company {

            display: inline-flex;

            align-items: center;

            gap: 5px;

            font-size: .73rem;

            font-weight: 600;

            color: var(--teal);

            background: var(--teal-light);

            border: 1px solid rgba(0, 155, 191, .18);

            border-radius: 100px;

            padding: 3px 10px

        }



        .pl-footer {

            display: flex;

            align-items: center;

            justify-content: space-between;

            padding-top: .75rem;

            border-top: 1px solid #F0F4EF

        }



        .pl-package {

            font-family: var(--font-head);

            font-size: 1.1rem;

            font-weight: 700;

            color: #2A8A1E

        }



        .pl-badge {

            font-size: .62rem;

            font-weight: 700;

            text-transform: uppercase;

            letter-spacing: .06em;

            padding: 2px 8px;

            border-radius: 100px

        }



        .pl-badge.fresher {

            background: #EDF7EB;

            color: #16A34A;

            border: 1px solid #C6E3C2

        }



        .pl-badge.professional {

            background: #ECFDF5;

            color: #1D4ED8;

            border: 1px solid #BFDBFE

        }



        .pl-year {

            font-size: .7rem;

            color: #8EA68A;

            font-weight: 500

        }



        /* CTA */

        .cta-section {

            padding: 100px 5vw;

            background: linear-gradient(135deg, var(--green-pale) 0%, var(--teal-pale) 100%)

        }



        .cta-inner {

            max-width: 1120px;

            margin: 0 auto;

            display: grid;

            grid-template-columns: 1fr 1fr;

            gap: 3rem;

            align-items: center

        }



        .cta-card {

            background: var(--white);

            border: 1px solid rgba(42, 138, 30, .15);

            border-radius: var(--radius);

            padding: 2.75rem;

            box-shadow: var(--shadow-md);

            position: relative;

            overflow: hidden

        }



        .cta-card::before {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            height: 4px;

            background: var(--grad)

        }



        .fee-label {

            font-size: .72rem;

            font-weight: 600;

            color: var(--ink-faint);

            text-transform: uppercase;

            letter-spacing: .1em;

            margin-bottom: 8px

        }



        .fee-title {

            font-family: var(--font-head);

            font-size: 1.7rem;

            font-weight: 600;

            color: var(--ink);

            letter-spacing: -.02em;

            margin-bottom: .4rem

        }



        .fee-sub {

            font-size: .88rem;

            color: var(--ink-muted);

            margin-bottom: 2rem;

            line-height: 1.6

        }



        .fee-includes {

            display: flex;

            flex-direction: column;

            gap: 10px;

            margin-bottom: 2rem

        }



        .fee-row {

            display: flex;

            align-items: center;

            gap: 10px;

            font-size: .85rem;

            color: var(--ink-muted)

        }



        .fee-row::before {

            content: '✓';

            width: 20px;

            height: 20px;

            border-radius: 50%;

            background: var(--grad);

            display: flex;

            align-items: center;

            justify-content: center;

            flex-shrink: 0;

            font-size: .65rem;

            font-weight: 700;

            color: #fff;

            box-shadow: 0 2px 8px rgba(42, 138, 30, .2)

        }



        .cta-right h2 {

            margin-bottom: 1rem

        }



        .cta-right p {

            color: var(--ink-muted);

            font-size: 1rem;

            line-height: 1.8;

            margin-bottom: 2rem

        }



        .cta-points {

            display: flex;

            flex-direction: column;

            gap: .7rem;

            margin-bottom: 2rem

        }



        .cta-point {

            display: flex;

            align-items: center;

            gap: 10px;

            font-size: .9rem;

            color: var(--ink-muted)

        }



        .cta-point::before {

            content: '';

            width: 8px;

            height: 8px;

            border-radius: 50%;

            background: var(--grad);

            flex-shrink: 0

        }



        .cta-btns {

            display: flex;

            flex-direction: column;

            gap: .75rem

        }



        .btn-outline-teal {

            display: inline-flex;

            align-items: center;

            justify-content: center;

            gap: 8px;

            background: var(--white);

            color: var(--teal);

            font-family: var(--font-body);

            font-size: 1rem;

            font-weight: 600;

            padding: .9rem 2rem;

            border-radius: 100px;

            text-decoration: none;

            border: 1.5px solid rgba(0, 155, 191, .35);

            cursor: pointer;

            transition: all .2s

        }



        .btn-outline-teal:hover {

            border-color: var(--teal);

            background: var(--teal-light)

        }



        /* ========================================================
           ABOUT SECTION - EXACT REPLICATION OF DESIGN SPEC
           ======================================================== */
        .about-section {
            padding: 100px 5vw;
            background: #FFFFFF;
            position: relative;
            overflow: hidden;
            border-top: 1px solid #F1F5F9;
        }

        /* Decorative Dot Matrix in Background */
        .about-dots-top-right {
            position: absolute;
            top: 36px;
            right: 4%;
            z-index: 1;
            pointer-events: none;
            opacity: 0.85;
        }

        .about-dots-left {
            position: absolute;
            top: 50%;
            left: 0.5%;
            transform: translateY(-50%);
            z-index: 1;
            pointer-events: none;
            opacity: 0.7;
        }

        .about-grid {
            display: grid;
            grid-template-columns: 1fr 1.08fr;
            gap: 4.8rem;
            align-items: center;
            max-width: 1180px;
            margin: 0 auto;
            position: relative;
            z-index: 2;
        }

        /* LEFT: Visual Container */
        .about-visual {
            position: relative;
        }

        .about-img-wrap {
            position: relative;
            border-radius: 28px;
            overflow: hidden;
            aspect-ratio: 4 / 4.75;
            background: #064E3B;
            box-shadow: 0 20px 45px -15px rgba(6, 78, 56, 0.16);
        }

        .about-img-wrap img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            border-radius: 28px;
            transition: transform 6s ease;
        }

        .about-img-wrap:hover img {
            transform: scale(1.04);
        }

        /* Gradient Overlay at Bottom of Image */
        .about-img-wrap::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(4, 78, 56, 0) 48%, rgba(4, 78, 56, 0.6) 72%, rgba(4, 78, 56, 0.96) 100%);
            border-radius: 28px;
            pointer-events: none;
        }

        /* 4x4 Green Dot Grid inside bottom-right of photo */
        .about-photo-dots {
            position: absolute;
            bottom: 22px;
            right: 22px;
            z-index: 3;
            pointer-events: none;
            opacity: 0.95;
        }

        /* Pin Badge pinned top-left */
        .about-loc-badge {
            position: absolute;
            top: 1.4rem;
            left: 1.4rem;
            z-index: 4;
            background: rgba(9, 44, 30, 0.88);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid rgba(52, 211, 153, 0.35);
            border-radius: 14px;
            padding: 0.55rem 0.95rem;
            display: flex;
            align-items: center;
            gap: 0.7rem;
            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
        }

        .about-pin-wrap {
            display: flex;
            align-items: center;
            justify-content: center;
            color: #34D399;
            flex-shrink: 0;
        }

        .about-pin-text {
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        .about-pin-title {
            font-size: 0.68rem;
            font-weight: 800;
            color: #FFFFFF;
            letter-spacing: 0.06em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .about-pin-sub {
            font-size: 0.58rem;
            font-weight: 700;
            color: #A7F3D0;
            letter-spacing: 0.08em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        /* Floating stat cards on photo */
        .about-float-card {
            position: absolute;
            background: #FFFFFF;
            border: 1px solid rgba(226, 232, 240, 0.9);
            border-radius: 18px;
            padding: 0.8rem 1.2rem;
            box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.03);
            display: flex;
            align-items: center;
            gap: 0.85rem;
            z-index: 5;
        }

        .about-float-top-right {
            top: 2.2rem;
            right: -2rem;
            animation: floatB 4.5s ease-in-out infinite;
        }

        .about-float-bottom-left {
            bottom: 2.2rem;
            left: -2rem;
            animation: floatA 4s ease-in-out infinite;
        }

        @keyframes floatA {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(-8px);
            }
        }

        @keyframes floatB {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(8px);
            }
        }

        .about-float-icon-box {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .afi-box-amber {
            background: #FEF3C7;
            color: #D97706;
        }

        .afi-box-green {
            background: #DCFCE7;
            color: #059669;
        }

        .about-float-num {
            font-family: var(--font-head, 'Outfit', 'Inter', sans-serif);
            font-size: 1.35rem;
            font-weight: 800;
            color: #0F172A;
            line-height: 1;
        }

        .about-float-label {
            font-size: 0.62rem;
            color: #64748B;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            margin-top: 3px;
        }

        /* RIGHT: Content Column */
        .about-content {
            position: relative;
        }

        .about-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-bottom: 0.85rem;
        }

        .about-eyebrow-bar {
            width: 20px;
            height: 3px;
            background: #059669;
            border-radius: 2px;
            display: inline-block;
        }

        .about-eyebrow-text {
            font-size: 0.82rem;
            font-weight: 800;
            color: #0284C7;
            letter-spacing: 0.1em;
            text-transform: uppercase;
        }

        .about-title {
            font-family: var(--font-head, 'Outfit', 'Inter', sans-serif);
            font-size: 2.65rem;
            font-weight: 800;
            color: #0F172A;
            line-height: 1.18;
            letter-spacing: -0.02em;
            margin-bottom: 1.25rem;
        }

        .about-title-highlight {
            color: #059669;
        }

        .about-desc {
            font-size: 0.98rem;
            color: #475569;
            line-height: 1.78;
            margin-bottom: 1.25rem;
        }

        .about-desc strong {
            color: #0F172A;
            font-weight: 700;
        }

        /* Quote box with green accent */
        .about-quote-box {
            background: linear-gradient(135deg, #F0FDF4 0%, #F5FBF7 100%);
            border-left: 3.5px solid #10B981;
            border-radius: 0 16px 16px 0;
            padding: 1rem 1.35rem;
            margin: 1.4rem 0;
            display: flex;
            align-items: flex-start;
            gap: 14px;
        }

        .about-quote-badge {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            background: #DCFCE7;
            color: #059669;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            margin-top: 2px;
        }

        .about-quote-text {
            font-size: 0.94rem;
            font-style: italic;
            color: #334155;
            line-height: 1.68;
        }

        /* Modern 3-Column Stat Cards Row */
        .about-stats-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 14px;
            margin-top: 1.8rem;
        }

        .about-stat-card {
            border-radius: 18px;
            padding: 1.1rem 1.15rem;
            display: flex;
            align-items: center;
            gap: 12px;
            transition: transform 0.25s ease, box-shadow 0.25s ease;
        }

        .about-stat-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 10px 24px rgba(0, 0, 0, 0.05);
        }

        .card-green {
            background: linear-gradient(180deg, #F0FDF4 0%, #E7F8EE 100%);
            border: 1px solid #D1FAE5;
        }

        .card-blue {
            background: linear-gradient(180deg, #F0F9FF 0%, #E0F2FE 100%);
            border: 1px solid #BAE6FD;
        }

        .card-amber {
            background: linear-gradient(180deg, #FFFBEB 0%, #FEF3C7 100%);
            border: 1px solid #FDE68A;
        }

        .about-stat-icon-wrap {
            width: 44px;
            height: 44px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .icon-green {
            background: #DCFCE7;
            color: #059669;
        }

        .icon-blue {
            background: #E0F2FE;
            color: #0284C7;
        }

        .icon-amber {
            background: #FEF3C7;
            color: #D97706;
        }

        .about-stat-info {
            display: flex;
            flex-direction: column;
        }

        .about-stat-dash {
            display: block;
            width: 20px;
            height: 3px;
            border-radius: 2px;
            margin-bottom: 5px;
        }

        .dash-green {
            background: #059669;
        }

        .dash-blue {
            background: #059669;
        }

        .dash-amber {
            background: #D97706;
        }

        .about-stat-number {
            font-family: var(--font-head, 'Outfit', 'Inter', sans-serif);
            font-size: 1.7rem;
            font-weight: 800;
            color: #0F172A;
            line-height: 1.1;
            letter-spacing: -0.01em;
        }

        .about-stat-title {
            font-size: 0.64rem;
            font-weight: 700;
            color: #64748B;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            margin-top: 3px;
        }



        /* FOOTER */

        footer {

            background: #0F1F0D;

            padding: 3.5rem 5vw 0

        }



        .ft-top {

            max-width: 1120px;

            margin: 0 auto;

            display: grid;

            grid-template-columns: 1.6fr 1fr 1fr 1fr;

            gap: 2.5rem;

            padding-bottom: 2.5rem;

            border-bottom: 1px solid rgba(255, 255, 255, .07)

        }



        .ft-brand-logo {

            display: inline-block;

            margin-bottom: .5rem;

            text-decoration: none

        }



        .ft-brand-logo img {

            height: 36px;

            width: auto;

            display: block;

            filter: brightness(0) invert(1);

            opacity: .85;

            transition: opacity .2s

        }



        .ft-brand-logo:hover img {

            opacity: 1

        }



        .ft-brand-tag {

            font-size: .79rem;

            color: rgba(255, 255, 255, .36);

            line-height: 1.7;

            max-width: 220px;

            margin-bottom: 1.2rem

        }



        .ft-social {

            display: flex;

            gap: 8px

        }



        .ft-social a {

            width: 34px;

            height: 34px;

            border-radius: 9px;

            border: 1px solid rgba(255, 255, 255, .1);

            display: flex;

            align-items: center;

            justify-content: center;

            color: rgba(255, 255, 255, .42);

            text-decoration: none;

            font-size: .7rem;

            font-weight: 700;

            font-family: var(--font-head);

            transition: border-color .2s, color .2s, background .2s

        }



        .ft-social a:hover {

            border-color: #3AAD2A;

            color: #fff;

            background: rgba(58, 173, 42, .14)

        }



        .ft-col h5 {

            font-size: .67rem;

            text-transform: uppercase;

            letter-spacing: .12em;

            color: rgba(255, 255, 255, .3);

            margin-bottom: .9rem;

            font-weight: 600

        }



        .ft-col ul {

            list-style: none;

            display: flex;

            flex-direction: column;

            gap: .55rem

        }



        .ft-col a {

            font-size: .83rem;

            color: rgba(255, 255, 255, .48);

            text-decoration: none;

            transition: color .2s

        }



        .ft-col a:hover {

            color: #fff

        }



        .ft-bottom {

            max-width: 1120px;

            margin: 0 auto;

            padding: 1.4rem 0;

            display: flex;

            justify-content: space-between;

            align-items: center;

            flex-wrap: wrap;

            gap: .75rem

        }



        .ft-bottom p {

            font-size: .74rem;

            color: rgba(255, 255, 255, .24)

        }



        .ft-bottom-links {

            display: flex;

            gap: 1.25rem

        }



        .ft-bottom-links a {

            font-size: .74rem;

            color: rgba(255, 255, 255, .3);

            text-decoration: none;

            transition: color .2s

        }



        .ft-bottom-links a:hover {

            color: rgba(255, 255, 255, .7)

        }



        /* INQUIRY POPUP MODAL */

        .inq-overlay {

            position: fixed;

            inset: 0;

            z-index: 9999;

            background: rgba(15, 31, 13, .55);

            backdrop-filter: blur(6px);

            -webkit-backdrop-filter: blur(6px);

            display: flex;

            align-items: center;

            justify-content: center;

            padding: 1.5rem;

            opacity: 0;

            pointer-events: none;

            transition: opacity .35s ease

        }



        .inq-overlay.active {

            opacity: 1;

            pointer-events: auto

        }



        .inq-modal {

            background: #1A2E18;

            border-radius: 24px;

            max-width: 440px;

            width: 100%;

            padding: 0;

            position: relative;

            overflow: hidden;

            transform: translateY(30px) scale(.96);

            transition: transform .4s cubic-bezier(.22, 1, .36, 1);

            box-shadow: 0 32px 80px rgba(0, 0, 0, .35), 0 0 0 1px rgba(255, 255, 255, .06)

        }



        .inq-overlay.active .inq-modal {

            transform: translateY(0) scale(1)

        }



        /* Top accent bar */

        .inq-modal::before {

            content: '';

            position: absolute;

            top: 0;

            left: 0;

            right: 0;

            height: 4px;

            background: linear-gradient(90deg, #3AAD2A, #009BBF, #3AAD2A);

            background-size: 200% 100%;

            animation: gradSlide 3s linear infinite

        }



        /* Close button */

        .inq-close {

            position: absolute;

            top: 1rem;

            right: 1rem;

            width: 36px;

            height: 36px;

            border-radius: 50%;

            border: 1px solid rgba(255, 255, 255, .12);

            background: rgba(255, 255, 255, .06);

            display: flex;

            align-items: center;

            justify-content: center;

            cursor: pointer;

            z-index: 2;

            transition: background .2s, border-color .2s

        }



        .inq-close:hover {

            background: rgba(255, 255, 255, .12);

            border-color: rgba(255, 255, 255, .2)

        }



        .inq-close svg {

            width: 16px;

            height: 16px;

            stroke: #fff;

            stroke-width: 2;

            fill: none

        }



        /* Header area */

        .inq-header {

            padding: 2rem 2rem 0;

            text-align: center;

            position: relative

        }



        .inq-header-icon {

            width: 56px;

            height: 56px;

            border-radius: 16px;

            background: linear-gradient(135deg, rgba(58, 173, 42, .2), rgba(0, 155, 191, .2));

            border: 1px solid rgba(58, 173, 42, .25);

            display: flex;

            align-items: center;

            justify-content: center;

            margin: 0 auto 1rem

        }



        .inq-header-icon svg {

            width: 26px;

            height: 26px;

            stroke: #3AAD2A;

            stroke-width: 1.8;

            fill: none

        }



        .inq-header h3 {

            font-family: var(--font-head);

            font-size: 1.35rem;

            font-weight: 700;

            color: #fff;

            letter-spacing: -.02em;

            margin-bottom: .35rem

        }



        .inq-header p {

            font-size: .84rem;

            color: rgba(255, 255, 255, .5);

            line-height: 1.5

        }



        /* Trust badges */

        .inq-trust {

            display: flex;

            justify-content: center;

            gap: .5rem;

            padding: .9rem 2rem;

            margin-top: 1.2rem;

            border-top: 1px solid rgba(255, 255, 255, .06);

            border-bottom: 1px solid rgba(255, 255, 255, .06);

            background: rgba(255, 255, 255, .02)

        }



        .inq-trust-item {

            display: flex;

            align-items: center;

            gap: 5px;

            font-size: .65rem;

            font-weight: 600;

            color: rgba(255, 255, 255, .4);

            letter-spacing: .03em;

            text-transform: uppercase

        }



        .inq-trust-item svg {

            width: 12px;

            height: 12px;

            stroke: #3AAD2A;

            stroke-width: 2;

            fill: none;

            flex-shrink: 0

        }



        /* Form body */

        .inq-body {

            padding: 1.4rem 2rem 2rem

        }



        .inq-field {

            margin-bottom: 1rem

        }



        .inq-field label {

            display: block;

            font-size: .68rem;

            font-weight: 700;

            color: rgba(255, 255, 255, .45);

            letter-spacing: .06em;

            text-transform: uppercase;

            margin-bottom: .4rem

        }



        .inq-field input,

        .inq-field select {

            width: 100%;

            padding: .75rem 1rem;

            border-radius: 12px;

            border: 1.5px solid rgba(255, 255, 255, .1);

            background: rgba(255, 255, 255, .06);

            font-family: var(--font-body);

            font-size: .88rem;

            color: #fff;

            outline: none;

            transition: border-color .2s, box-shadow .2s, background .2s

        }



        .inq-field input::placeholder {

            color: rgba(255, 255, 255, .28)

        }



        .inq-field input:focus,

        .inq-field select:focus {

            border-color: rgba(58, 173, 42, .5);

            box-shadow: 0 0 0 3px rgba(58, 173, 42, .12);

            background: rgba(255, 255, 255, .08)

        }



        .inq-field select {

            cursor: pointer;

            appearance: none;

            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='rgba(255,255,255,0.35)' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");

            background-repeat: no-repeat;

            background-position: right 1rem center;

            padding-right: 2.2rem

        }



        .inq-field select option {

            background: #1A2E18;

            color: #fff

        }



        /* Submit button */

        .inq-submit {

            width: 100%;

            padding: .85rem;

            background: linear-gradient(135deg, #3AAD2A, #009BBF);

            color: #fff;

            border: none;

            border-radius: 100px;

            font-family: var(--font-body);

            font-size: .95rem;

            font-weight: 700;

            cursor: pointer;

            letter-spacing: -.01em;

            box-shadow: 0 8px 28px rgba(42, 138, 30, .4);

            transition: transform .2s, box-shadow .2s;

            position: relative;

            overflow: hidden

        }



        .inq-submit::before {

            content: '';

            position: absolute;

            inset: 0;

            background: linear-gradient(135deg, rgba(255, 255, 255, .12), transparent);

            pointer-events: none

        }



        .inq-submit:hover {

            transform: translateY(-2px);

            box-shadow: 0 14px 36px rgba(42, 138, 30, .5)

        }



        /* WhatsApp row */

        .inq-or {

            display: flex;

            align-items: center;

            gap: .6rem;

            margin: .85rem 0;

            font-size: .65rem;

            color: rgba(255, 255, 255, .25);

            font-weight: 600;

            letter-spacing: .06em;

            text-transform: uppercase

        }



        .inq-or::before,

        .inq-or::after {

            content: '';

            flex: 1;

            height: 1px;

            background: rgba(255, 255, 255, .08)

        }



        .inq-wa {

            display: flex;

            align-items: center;

            justify-content: center;

            gap: 8px;

            width: 100%;

            padding: .75rem;

            background: linear-gradient(135deg, #25D366, #128C7E);

            color: #fff;

            border: none;

            border-radius: 100px;

            font-family: var(--font-body);

            font-size: .88rem;

            font-weight: 700;

            cursor: pointer;

            text-decoration: none;

            transition: transform .2s, box-shadow .2s;

            box-shadow: 0 6px 20px rgba(37, 211, 102, .3)

        }



        .inq-wa:hover {

            transform: translateY(-2px);

            box-shadow: 0 12px 28px rgba(37, 211, 102, .4)

        }



        .inq-wa svg {

            width: 17px;

            height: 17px;

            fill: currentColor;

            flex-shrink: 0

        }



        .inq-footer-note {

            text-align: center;

            font-size: .66rem;

            color: rgba(255, 255, 255, .28);

            margin-top: .8rem

        }



        .inq-footer-note span {

            color: #3AAD2A;

            font-weight: 600

        }



        /* Modal responsive */

        @media(max-width:480px) {

            .inq-modal {

                border-radius: 20px;

                max-width: 100%

            }



            .inq-header {

                padding: 1.6rem 1.4rem 0

            }



            .inq-body {

                padding: 1.2rem 1.4rem 1.6rem

            }



            .inq-trust {

                padding: .75rem 1.4rem;

                gap: .35rem;

                flex-wrap: wrap;

                justify-content: center

            }



            .inq-header h3 {

                font-size: 1.15rem

            }



            .inq-header-icon {

                width: 48px;

                height: 48px;

                border-radius: 14px

            }

        }



        /* FLOATING CONTACT BAR */

        .float-bar {

            position: fixed;

            bottom: 0;

            left: 0;

            right: 0;

            z-index: 999;

            display: flex;

            align-items: stretch;

            background: rgba(26, 46, 24, .92);

            backdrop-filter: blur(16px);

            -webkit-backdrop-filter: blur(16px);

            border-top: 1px solid rgba(255, 255, 255, .08);

            box-shadow: 0 -4px 32px rgba(0, 0, 0, .18);

            transform: translateY(100%);

            transition: transform .45s cubic-bezier(.22, 1, .36, 1);

            padding: 0

        }



        .float-bar.visible {

            transform: translateY(0)

        }



        .float-btn {

            flex: 1;

            display: flex;

            align-items: center;

            justify-content: center;

            gap: 8px;

            padding: .85rem .5rem;

            text-decoration: none;

            font-family: var(--font-body);

            font-size: .8rem;

            font-weight: 700;

            letter-spacing: .01em;

            border: none;

            cursor: pointer;

            transition: background .2s;

            position: relative;

            color: #fff

        }



        .float-btn::after {

            content: '';

            position: absolute;

            right: 0;

            top: 18%;

            bottom: 18%;

            width: 1px;

            background: rgba(255, 255, 255, .1)

        }



        .float-btn:last-child::after {

            display: none

        }



        .float-btn svg {

            width: 18px;

            height: 18px;

            flex-shrink: 0

        }



        .float-btn:active {

            background: rgba(255, 255, 255, .08)

        }



        /* WhatsApp */

        .float-btn.fb-wa {

            background: linear-gradient(135deg, rgba(37, 211, 102, .18), rgba(18, 140, 126, .12))

        }



        .float-btn.fb-wa svg {

            fill: #25D366

        }



        .float-btn.fb-wa:hover {

            background: rgba(37, 211, 102, .25)

        }



        /* Call */

        .float-btn.fb-call {

            background: transparent

        }



        .float-btn.fb-call svg {

            stroke: #3AAD2A;

            fill: none;

            stroke-width: 1.8

        }



        .float-btn.fb-call:hover {

            background: rgba(58, 173, 42, .12)

        }



        /* Enquire */

        .float-btn.fb-enquire {

            background: linear-gradient(135deg, #3AAD2A, #009BBF);

            position: relative;

            overflow: hidden

        }



        .float-btn.fb-enquire::before {

            content: '';

            position: absolute;

            inset: 0;

            background: linear-gradient(135deg, rgba(255, 255, 255, .1), transparent);

            pointer-events: none

        }



        .float-btn.fb-enquire::after {

            display: none

        }



        .float-btn.fb-enquire svg {

            stroke: #fff;

            fill: none;

            stroke-width: 2

        }



        .float-btn.fb-enquire:hover {

            filter: brightness(1.1)

        }



        /* Pulse dot on enquire button */

        .fb-pulse {

            position: absolute;

            top: 10px;

            right: 10px;

            width: 8px;

            height: 8px;

            border-radius: 50%;

            background: #FF416C;

            animation: fbPulse 2s ease-in-out infinite

        }



        @keyframes  fbPulse {



            0%,

            100% {

                transform: scale(1);

                opacity: 1

            }



            50% {

                transform: scale(1.6);

                opacity: .4

            }

        }



        /* Label below icon on mobile */

        .float-btn-label {

            font-size: .68rem;

            font-weight: 600;

            letter-spacing: .03em

        }



        /* Desktop: compact right-side FAB stack instead of bottom bar */

        @media(min-width:769px) {

            .float-bar {

                bottom: auto;

                top: 50%;

                left: auto;

                right: 1.2rem;

                transform: translateX(100px) translateY(-50%);

                flex-direction: column;

                width: auto;

                border-top: none;

                border-radius: 16px;

                border: 1px solid rgba(255, 255, 255, .08);

                padding: .35rem;

                gap: .25rem;

                box-shadow: 0 8px 32px rgba(0, 0, 0, .18)

            }



            .float-bar.visible {

                transform: translateX(0) translateY(-50%)

            }



            .float-btn {

                flex: none;

                width: 52px;

                height: 52px;

                padding: 0;

                border-radius: 12px;

                flex-direction: column;

                gap: 0

            }



            .float-btn::after {

                right: 12%;

                bottom: 0;

                left: 12%;

                top: auto;

                width: auto;

                height: 1px

            }



            .float-btn:last-child::after {

                display: none

            }



            .float-btn-label {

                display: none

            }



            .float-btn svg {

                width: 20px;

                height: 20px

            }



            .fb-pulse {

                top: 6px;

                right: 6px;

                width: 7px;

                height: 7px

            }



            .float-btn.fb-enquire {

                border-radius: 12px

            }



            /* tooltip on hover */

            .float-btn[data-tip] {

                position: relative

            }



            .float-btn[data-tip]::before {

                content: attr(data-tip);

                position: absolute;

                right: calc(100% + 10px);

                top: 50%;

                transform: translateY(-50%) scale(.9);

                background: #1A2E18;

                color: #fff;

                font-size: .72rem;

                font-weight: 600;

                padding: 5px 12px;

                border-radius: 8px;

                white-space: nowrap;

                opacity: 0;

                pointer-events: none;

                transition: opacity .2s, transform .2s;

                border: 1px solid rgba(255, 255, 255, .08);

                box-shadow: 0 4px 16px rgba(0, 0, 0, .2)

            }



            .float-btn[data-tip]:hover::before {

                opacity: 1;

                transform: translateY(-50%) scale(1)

            }

        }



        /* on small screens add safe area padding */

        @media(max-width:768px) {

            .float-bar {

                padding-bottom: env(safe-area-inset-bottom, 0)

            }



            .float-btn {

                flex-direction: column;

                gap: 3px;

                padding: .7rem .3rem .6rem

            }



            .float-btn svg {

                width: 20px;

                height: 20px

            }



            /* give body bottom padding so content isn't hidden behind bar */

            body {

                padding-bottom: 72px

            }

        }



        /* ANIMATIONS */

        .fade-up {

            opacity: 0;

            transform: translateY(28px);

            transition: opacity .65s ease, transform .65s ease

        }



        .fade-up.visible {

            opacity: 1;

            transform: none

        }



        /* RESPONSIVE */

        @media(max-width:960px) {



            .what-grid,

            .cert-inner,

            .cta-inner,

            .about-grid {

                grid-template-columns: 1fr;

                gap: 2.5rem

            }



            .about-float-1,
            .about-float-bottom-left {
                left: 0.5rem;
            }

            .about-float-2,
            .about-float-top-right {
                right: 0.5rem;
            }

            .about-dots-top-right,
            .about-dots-left {
                display: none;
            }



            .what-cards {

                margin-top: 0

            }



            .sched-layout {

                grid-template-columns: 1fr

            }



            .sched-panel {

                position: static

            }



            .sched-body-inner {

                padding-left: 1.2rem

            }



            .hl-top {

                grid-template-columns: repeat(2, 1fr)

            }



            .hl-bottom {

                grid-template-columns: 1fr 1fr

            }



            .ben-top {

                grid-template-columns: 1fr;

                gap: 1.2rem

            }



            .ben-row-1 {

                grid-template-columns: 1fr 1fr

            }



            .ben-row-1 .bcard.featured {

                grid-column: 1/-1

            }



            .ben-row-2,

            .ben-row-3 {

                grid-template-columns: 1fr 1fr

            }



            .who-grid {

                grid-template-columns: 1fr 1fr

            }



            .who-cta-strip {

                flex-direction: column;

                text-align: center

            }



            .testi-strip {

                grid-template-columns: repeat(3, 1fr)

            }



            .testi-prev {

                left: -14px

            }



            .testi-next {

                right: -14px

            }



            .faq-layout {

                grid-template-columns: 1fr

            }



            .faq-left {

                position: static

            }



            .nav-links {

                display: none

            }



            .hamburger {

                display: flex

            }



            .nav-logo img {

                height: 32px

            }



            .ft-brand-logo img {

                height: 30px

            }



            .mobile-menu {

                display: none;

                position: fixed;

                top: 66px;

                left: 0;

                right: 0;

                background: #fff;

                padding: 1.2rem 5vw 1.8rem;

                border-bottom: 1px solid #EEE9E3;

                flex-direction: column;

                gap: 0;

                z-index: 99;

                box-shadow: 0 12px 32px rgba(0, 0, 0, .08)

            }



            .mobile-menu.open {

                display: flex

            }



            .mobile-menu a {

                font-size: .95rem;

                font-weight: 600;

                color: #556652;

                text-decoration: none;

                padding: .8rem 0;

                border-bottom: 1px solid #F0EDE8;

                transition: color .2s

            }



            .mobile-menu a:last-child {

                border: none;

                color: #2A8A1E;

                margin-top: .3rem

            }



            .ft-top {

                grid-template-columns: 1fr 1fr

            }



            .hero-inner {

                grid-template-columns: 1fr;

                gap: 2.5rem

            }



            .hero-content {

                text-align: center

            }



            .hero-sub {

                margin: .5rem auto 1.5rem

            }



            .hero-actions {

                justify-content: center

            }



            .hero-stats {

                margin: 0 auto;

                margin-bottom: 1rem

            }



            .hero-checks {

                align-items: center

            }



            .placements-grid {

                grid-template-columns: repeat(2, 1fr)

            }



            .cta-card {

                padding: 2rem

            }



            .cta-right h2 {

                font-size: 1.5rem

            }

        }



        @media(max-width:600px) {



            /* Sections general */

            .what-section,

            .highlights-section,

            .schedule-section,

            .benefits-section,

            .who-section,

            .cert-section,

            .testi-section,

            .faq-section,

            .placements-section,

            .cta-section,

            .about-section {

                padding: 60px 4vw

            }



            .section-desc {

                font-size: .9rem

            }



            /* What section */

            .what-cards {

                grid-template-columns: 1fr

            }



            .what-heading {

                font-size: clamp(1.5rem, 6vw, 2rem)

            }



            .what-vs .vs-row {

                grid-template-columns: 1fr;

                gap: .25rem;

                text-align: center

            }



            .vs-arrow {

                display: none

            }



            .what-pills {

                justify-content: center

            }



            /* Highlights */

            .hl-top {

                grid-template-columns: 1fr

            }



            .hl-bottom {

                grid-template-columns: 1fr

            }



            .hl-schedule {

                order: 5

            }



            .hl-stat {

                padding: 1.2rem 1rem

            }



            .hl-stat-val {

                font-size: 1.6rem

            }



            .hl-days {

                flex-wrap: wrap

            }



            /* Curriculum */

            .week-panel.active {

                grid-template-columns: 1fr

            }



            /* Schedule */

            .sched-card-head {

                grid-template-columns: 1fr;

                gap: .5rem

            }



            .sched-time {

                min-width: auto

            }



            .sched-bar-card {

                padding: 1.2rem

            }



            /* Benefits */

            .ben-row-1,

            .ben-row-2,

            .ben-row-3 {

                grid-template-columns: 1fr

            }



            .ben-count {

                font-size: 2.5rem

            }



            .bcard {

                padding: 1.2rem

            }



            .bcard.featured {

                padding: 1.4rem

            }



            .bcard.featured .bcard-body {

                flex-direction: column;

                gap: 1rem

            }



            /* Who */

            .who-grid {

                grid-template-columns: 1fr

            }



            .who-cta-strip {

                padding: 1.4rem;

                gap: 1rem

            }



            .who-cta-strip p {

                font-size: .88rem

            }



            .who-cta-btn {

                width: 100%;

                justify-content: center

            }



            /* Certificate */

            .cert-visual {

                padding: 1.5rem

            }



            .cert-main-title {

                font-size: 1.2rem

            }



            .cert-meta {

                grid-template-columns: 1fr 1fr

            }



            /* Testimonials */

            .testi-slide {

                padding: 2rem 1.5rem

            }



            .testi-slide::before {

                font-size: 5rem;

                top: .2rem;

                left: 1rem

            }



            .testi-placed {

                display: none

            }



            .testi-prev {

                left: -10px

            }



            .testi-next {

                right: -10px

            }



            .testi-strip {

                grid-template-columns: repeat(2, 1fr)

            }



            .testi-quote {

                font-size: .95rem

            }



            .testi-author {

                flex-wrap: wrap;

                gap: .75rem

            }



            /* FAQ */

            .faq-q {

                font-size: .85rem;

                padding: 1rem 1.1rem

            }



            .faq-a-inner {

                padding: 0 1.1rem 1rem;

                margin: 0 1.1rem

            }



            .faq-contact-card {

                padding: 1.2rem

            }



            /* Placements */

            .placements-grid {

                grid-template-columns: 1fr

            }



            .placements-stats {

                gap: 1.5rem

            }



            .pl-stat-num {

                font-size: 1.6rem

            }



            /* CTA */

            .cta-card {

                padding: 1.5rem

            }



            .fee-title {

                font-size: 1.3rem

            }



            .cta-btns {

                width: 100%

            }



            .cta-btns .btn-primary,

            .cta-btns .btn-outline-teal {

                width: 100%;

                justify-content: center

            }



            /* About */
            .about-float,
            .about-float-card {
                padding: .6rem .85rem;
            }

            .about-float-num {
                font-size: 1.1rem;
            }

            .about-title {
                font-size: 2.1rem;
            }

            .about-stats,
            .about-stats-grid {
                grid-template-columns: 1fr;
                gap: 12px;
            }

            .about-stat-num,
            .about-stat-number {
                font-size: 1.45rem;
            }



            /* Footer */

            .ft-top {

                grid-template-columns: 1fr

            }



            .ft-bottom {

                flex-direction: column;

                text-align: center

            }



            .ft-bottom-links {

                justify-content: center

            }

        }

        .error{

            color: red;

        }

        .inerror{

            color: red;

        }

        .success-box {

    text-align: center; /* 🔥 main fix */

    padding: 30px 20px;

    display: flex;

    flex-direction: column;

    align-items: center; /* 🔥 center everything */

    justify-content: center;

}



.success-icon {

    width: 55px;

    height: 55px;

    margin-bottom: 12px;

}



.success-title {

    font-size: 18px;

    font-weight: 600;

    color: #16a34a;

    margin-bottom: 6px;

    text-align: center;

}



.success-text {

    font-size: 14px;

    color: gray;

    max-width: 260px;

    text-align: center; /* 🔥 fix */

}

    

/* ==============================================================================
   IMAGE 2 EXACT REPLICA HERO STYLES (LaunchPad Pro)
   ============================================================================== */
.hero-exact-replica-image2 {
  position: relative;
  background-color: #F0FAF7;
  background-image: url('/images/launchpad/placmentherobgimg.webp'), url('/images/launchpad/placmentherobgimg.png');
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  padding: 60px 0 80px;
  overflow: visible;
  min-height: 720px;
  display: flex;
  align-items: center;
}

.hero2-container {
  max-width: 1360px;
  width: 100%;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 2;
  gap: 30px;
}

.hero2-left-col {
  flex: 0 0 540px;
  max-width: 540px;
}

/* 1. Badge Pill */
.hero2-badge-wrap {
  margin-bottom: 18px;
}
.hero2-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #FFFFFF;
  border: 1px solid rgba(16, 185, 129, 0.35);
  border-radius: 999px;
  padding: 6px 16px 6px 12px;
  box-shadow: 0 2px 10px rgba(16, 185, 129, 0.08);
}
.hero2-badge-green {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #10B981;
  font-weight: 800;
  font-size: 12.5px;
  letter-spacing: 0.4px;
}
.hero2-lightning-icon {
  animation: pulseLight 1.8s infinite ease-in-out;
}
@keyframes pulseLight {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.2); opacity: 0.8; }
}
.hero2-badge-sep {
  width: 1px;
  height: 14px;
  background: #CBD5E1;
}
.hero2-badge-date {
  color: #475569;
  font-size: 12.5px;
  font-weight: 600;
}

/* 2. Main Title */
.hero2-title {
  font-family: 'Sora', 'Plus Jakarta Sans', sans-serif;
  font-size: 52px;
  font-weight: 800;
  line-height: 1.15;
  color: #FFFFFF;
  margin: 0 0 16px;
  letter-spacing: -1px;
}
.text-green-brand {
  color: #10B981;
}
.text-teal-brand {
  color: #009BBF;
}
.relative-real {
  position: relative;
  display: inline-block;
}
.real-underline-svg {
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 14px;
  pointer-events: none;
}

/* 3. Subtitle */
.hero2-subtitle {
  font-size: 16.5px;
  line-height: 1.6;
  color: #E2E8F0;
  margin: 0 0 24px;
  max-width: 510px;
  font-weight: 450;
}

/* 4. Three Metric Boxes */
.hero2-metrics-row {
  display: flex;
  gap: 12px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.hero2-metric-card {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(16, 185, 129, 0.28);
  border-radius: 12px;
  padding: 8px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.metric-icon-box {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: #E8F7E5;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.metric-details {
  display: flex;
  flex-direction: column;
}
.metric-number {
  font-size: 15px;
  font-weight: 800;
  color: #047857;
  line-height: 1.2;
}
.metric-label-unit {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  color: #047857;
}
.metric-caption {
  font-size: 11px;
  color: #64748B;
  font-weight: 600;
}

/* 5. Checklist */
.hero2-checklist {
  list-style: none;
  padding: 0;
  margin: 0 0 26px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.hero2-check-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14.5px;
  color: #F8FAFC;
  line-height: 1.4;
}
.hero2-check-circle {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #10B981;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* 6. Action Buttons */
.hero2-actions-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 28px;
}
.hero2-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #10B981 0%, #009BBF 100%);
  color: #FFFFFF !important;
  font-weight: 700;
  font-size: 15px;
  padding: 13px 26px;
  border-radius: 999px;
  text-decoration: none;
  box-shadow: 0 6px 20px rgba(16, 185, 129, 0.35);
  transition: all 0.25s ease;
}
.hero2-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(0, 155, 191, 0.4);
}
.hero2-btn-how {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #FFFFFF;
  border: 1.5px solid #10B981;
  color: #0F172A !important;
  font-weight: 700;
  font-size: 15px;
  padding: 11px 24px;
  border-radius: 999px;
  text-decoration: none;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04);
  transition: all 0.25s ease;
}
.hero2-btn-how:hover {
  background: #F0FDF4;
  transform: translateY(-2px);
}
.play-btn-circle {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #10B981;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 2px;
}

/* 7. Trust Bar Work At */
.hero2-trust-work-at {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: 14px;
  padding: 10px 18px;
  display: inline-flex;
  flex-direction: column;
  gap: 6px;
  box-shadow: 0 6px 24px rgba(0,0,0,0.06);
}
.trust-work-label {
  font-size: 11.5px;
  color: #475569;
  font-weight: 600;
}
.trust-work-label strong {
  color: #0F172A;
}
.trust-work-logos {
  display: flex;
  align-items: center;
  gap: 16px;
}
.trust-brand-img {
  height: 18px;
  width: auto;
  max-width: 65px;
  object-fit: contain;
  filter: grayscale(15%);
  transition: filter 0.2s;
}
.trust-brand-img:hover {
  filter: grayscale(0%);
}

/* RIGHT COLUMN: Glowing Consultation Card */
.hero2-right-col {
  flex: 0 0 420px;
  max-width: 420px;
}
.hero2-counsel-card {
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(20px);
  border-radius: 24px;
  border: 1.5px solid #00B8E0;
  box-shadow: 0 0 35px rgba(0, 184, 224, 0.45), 0 20px 60px rgba(15, 31, 13, 0.12);
  padding: 28px 24px 22px;
  position: relative;
}
.counsel-card-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.counsel-phone-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #E8F7E5;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.counsel-heading {
  font-size: 19px;
  font-weight: 800;
  color: #0F172A;
  margin: 0 0 2px;
  font-family: 'Sora', sans-serif;
}
.counsel-subheading {
  font-size: 12px;
  color: #64748B;
  margin: 0;
  line-height: 1.35;
}

.counsel-trust-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #F8FAFC;
  border-radius: 8px;
  padding: 7px 10px;
  margin: 12px 0 16px;
  border: 1px dashed rgba(16, 185, 129, 0.35);
}
.counsel-trust-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  color: #047857;
}

.counsel-lead-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.counsel-form-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.counsel-label {
  font-size: 12px;
  font-weight: 700;
  color: #334155;
  letter-spacing: 0.2px;
}
.counsel-req {
  color: #EF4444;
}
.counsel-input-box {
  position: relative;
  display: flex;
  align-items: center;
}
.counsel-input-icon {
  position: absolute;
  left: 12px;
  display: flex;
  align-items: center;
  pointer-events: none;
}
.counsel-input {
  width: 100%;
  height: 42px;
  padding: 0 12px 0 38px;
  border: 1.5px solid #E2E8F0;
  border-radius: 10px;
  font-size: 13.5px;
  color: #0F172A;
  background: #F8FAFC;
  transition: all 0.2s;
  box-sizing: border-box;
}
.counsel-input:focus {
  outline: none;
  border-color: #00B8E0;
  background: #FFFFFF;
  box-shadow: 0 0 0 3px rgba(0, 184, 224, 0.15);
}
.counsel-select {
  width: 100%;
  height: 42px;
  padding: 0 32px 0 38px;
  border: 1.5px solid #E2E8F0;
  border-radius: 10px;
  font-size: 13.5px;
  color: #0F172A;
  background: #F8FAFC;
  transition: all 0.2s;
  appearance: none;
  cursor: pointer;
  box-sizing: border-box;
}
.counsel-select:focus {
  outline: none;
  border-color: #00B8E0;
  background: #FFFFFF;
  box-shadow: 0 0 0 3px rgba(0, 184, 224, 0.15);
}
.counsel-select-arrow {
  position: absolute;
  right: 12px;
  display: flex;
  align-items: center;
  pointer-events: none;
}

.counsel-submit-btn {
  margin-top: 4px;
  width: 100%;
  height: 46px;
  background: linear-gradient(135deg, #10B981 0%, #009BBF 100%);
  color: #FFFFFF;
  border: none;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(16, 185, 129, 0.35);
  transition: all 0.25s ease;
}
.counsel-submit-btn:hover {
  transform: translateY(-1.5px);
  box-shadow: 0 8px 25px rgba(0, 155, 191, 0.45);
}
.counsel-security-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 11.5px;
  color: #64748B;
  margin-top: 6px;
}

@media (max-width: 1080px) {
  .hero-exact-replica-image2 {
    background-position: 70% center;
    padding: 40px 0 60px;
  }
  .hero2-container {
    flex-direction: column;
    align-items: center;
  }
  .hero2-left-col {
    flex: 1;
    max-width: 100%;
  }
  .hero2-right-col {
    width: 100%;
    max-width: 480px;
  }
  .hero2-title {
    font-size: 38px;
  }
}
@media (max-width: 640px) {
  .hero2-title {
    font-size: 32px;
  }
  .hero2-metrics-row {
    flex-direction: column;
  }
  .hero2-actions-row {
    flex-direction: column;
    align-items: stretch;
  }
  .hero2-btn-primary, .hero2-btn-how {
    justify-content: center;
  }
}