

        :root {
            --black: #070707;
            --dark: #101010;
            --dark2: #171717;
            --white: #ffffff;
            --gray: #999999;
            --light: #f3f3f3;
            --red: #e50914;
            --border: rgba(255,255,255,.12);
        }

        * {
            box-sizing: border-box;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            margin: 0;
            background: var(--black);
            color: #fff;
            font-family: "Inter", sans-serif;
        }

        a {
            text-decoration: none;
        }

        .section-padding {
            padding: 110px 0;
        }

        .section-label {
            color: var(--red);
            font-size: 12px;
            letter-spacing: 4px;
            text-transform: uppercase;
            font-weight: 700;
        }

        .section-title {
            font-family: "Oswald", sans-serif;
            font-size: clamp(45px, 7vw, 90px);
            line-height: .9;
            text-transform: uppercase;
            font-weight: 600;
        }

        /* =========================
           NAVBAR
        ========================== */

        .navbar {
            position: absolute;
            width: 100%;
            top: 0;
            left: 0;
            z-index: 1000;
            padding: 25px 0;
            transition: .3s;
        }

        .navbar.scrolled {
            position: fixed;
            background: rgba(0,0,0,.94);
            backdrop-filter: blur(15px);
            padding: 14px 0;
        }

        .navbar-brand {
            color: #fff !important;
            font-family: "Oswald", sans-serif;
            font-size: 28px;
            line-height: 1;
            text-transform: uppercase;
        }

        .navbar-brand span {
            color: var(--red);
        }

        .navbar-brand small {
            display: block;
            font-family: "Inter", sans-serif;
            font-size: 8px;
            letter-spacing: 2px;
            color: #999;
            margin-top: 5px;
        }

        .navbar .nav-link {
            color: rgba(255,255,255,.8);
            text-transform: uppercase;
            font-size: 12px;
            letter-spacing: 1px;
            margin: 0 7px;
        }

        .navbar .nav-link:hover {
            color: #fff;
        }

        /* =========================
           BUTTONS
        ========================== */

        .btn-main {
            background: var(--red);
            border: 1px solid var(--red);
            color: #fff;
            padding: 14px 26px;
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: 1px;
            font-weight: 700;
            transition: .3s;
        }

        .btn-main:hover {
            background: #fff;
            border-color: #fff;
            color: #000;
        }

        .btn-outline-custom {
            color: #fff;
            border: 1px solid rgba(255,255,255,.5);
            padding: 14px 26px;
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: 1px;
            transition: .3s;
        }

        .btn-outline-custom:hover {
            background: #fff;
            color: #000;
        }

        /* =========================
           HERO
        ========================== */

        .hero {
            min-height: 100vh;
            position: relative;
            display: flex;
            align-items: flex-end;
            overflow: hidden;

            background:
                linear-gradient(
                    90deg,
                    rgba(0,0,0,.92),
                    rgba(0,0,0,.45),
                    rgba(0,0,0,.2)
                ),
                linear-gradient(
                    0deg,
                    rgba(0,0,0,.95),
                    transparent 60%
                ),
                url("../images/top-back.jpg")
                center / cover;
        }

        .hero-content {
            max-width: 950px;
            padding-bottom: 100px;
        }

        .hero-small {
            text-transform: uppercase;
            letter-spacing: 5px;
            font-size: 12px;
            color: #ccc;
            margin-bottom: 25px;
        }

        .hero h1 {
            font-family: "Oswald", sans-serif;
            font-size: clamp(65px, 10vw, 145px);
            line-height: .8;
            text-transform: uppercase;
            font-weight: 600;
            letter-spacing: -3px;
            margin: 0;
        }

        .hero h1 span {
            color: var(--red);
        }

        .hero-description {
            max-width: 650px;
            color: #ccc;
            line-height: 1.7;
            font-size: 16px;
            margin-top: 30px;
        }

        .hero-buttons {
            margin-top: 35px;
        }

        .scroll-text {
            position: absolute;
            right: 40px;
            bottom: 40px;
            writing-mode: vertical-rl;
            text-transform: uppercase;
            letter-spacing: 3px;
            color: #888;
            font-size: 10px;
        }

        /* =========================
           INTRO
        ========================== */

        .intro {
            background: #fff;
            color: #111;
        }

        .intro-number {
            font-family: "Oswald", sans-serif;
            font-size: 110px;
            color: #ddd;
            line-height: 1;
        }

        .intro-text {
            font-size: 24px;
            line-height: 1.6;
        }

        /* =========================
           CORE AREAS
        ========================== */

        .areas {
            background: #0d0d0d;
        }

        .area-card {
            position: relative;
            height: 400px;
            overflow: hidden;
            background: #181818;
        }

        .area-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: .6s;
        }

        .area-card:hover img {
            transform: scale(1.08);
        }

        .area-card:after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(
                to top,
                rgba(0,0,0,.95),
                rgba(0,0,0,.05)
            );
        }

        .area-content {
            position: absolute;
            z-index: 2;
            bottom: 0;
            padding: 30px;
        }

        .area-content span {
            color: #aaa;
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: 2px;
        }

        .area-content h3 {
            font-family: "Oswald", sans-serif;
            font-size: 40px;
            text-transform: uppercase;
            margin-top: 7px;
        }

        /* =========================
           TRAINING
        ========================== */

        .training {
            background: #f4f4f4;
            color: #111;
        }

        .training-list {
            border-top: 1px solid #ccc;
        }

        .training-item {
            padding: 22px 0;
            border-bottom: 1px solid #ccc;
            font-family: "Oswald", sans-serif;
            font-size: 24px;
            text-transform: uppercase;
        }

        .training-item span {
            color: var(--red);
            font-family: "Inter", sans-serif;
            font-size: 12px;
            margin-right: 20px;
        }

        /* =========================
           PHILOSOPHY
        ========================== */

        .philosophy {
            background: #111;
        }

        .quote {
            font-family: "Oswald", sans-serif;
            font-size: clamp(45px, 7vw, 90px);
            line-height: .95;
            text-transform: uppercase;
        }

        .quote span {
            color: var(--red);
        }

        /* =========================
           OPPORTUNITIES
        ========================== */

        .opportunities {
            background: #fff;
            color: #111;
        }

        .opportunity {
            border-top: 1px solid #ddd;
            padding: 30px 0;
            transition: .3s;
        }

        .opportunity:hover {
            padding-left: 15px;
        }

        .opportunity-number {
            font-family: "Oswald", sans-serif;
            color: var(--red);
            font-size: 20px;
        }

        .opportunity h3 {
            font-family: "Oswald", sans-serif;
            font-size: 30px;
            text-transform: uppercase;
        }

        .opportunity p {
            color: #777;
            line-height: 1.7;
        }

        /* =========================
           FREE WORKSHOP
        ========================== */

        .workshop {
            min-height: 650px;
            display: flex;
            align-items: center;

            background:
                linear-gradient(
                    rgba(0,0,0,.78),
                    rgba(0,0,0,.78)
                ),
                url("../images/workshop.webp")
                center / cover fixed;
        }

        .workshop-number {
            font-family: "Oswald", sans-serif;
            font-size: clamp(100px, 15vw, 220px);
            line-height: .7;
            color: var(--red);
        }

        /* =========================
           LOCATIONS
        ========================== */

        .locations {
            background: #101010;
        }

        .location {
            border-top: 1px solid var(--border);
            padding: 30px 0;
        }

        .location-name {
            font-family: "Oswald", sans-serif;
            text-transform: uppercase;
            font-size: 32px;
        }

        .location small {
            color: #777;
            text-transform: uppercase;
            letter-spacing: 2px;
        }

        /* =========================
           PRODUCTIONS
        ========================== */

        .productions {
            background: #f3f3f3;
            color: #111;
        }

        .production-card {
            background: #fff;
            padding: 30px;
            height: 100%;
            border-bottom: 4px solid transparent;
            transition: .3s;
        }

        .production-card:hover {
            border-color: var(--red);
            transform: translateY(-5px);
        }

        .production-card h3 {
            font-family: "Oswald", sans-serif;
            text-transform: uppercase;
            font-size: 28px;
        }

        /* =========================
           FOUNDER
        ========================== */

        .founder {
            background: #111;
        }

        .founder-image {
            min-height: 600px;
            background:
                url("../images/about.jpg")
                center / cover;
        }

        .founder-content {
            padding: 60px;
        }

        .founder-role {
            color: #888;
            text-transform: uppercase;
            letter-spacing: 2px;
            font-size: 11px;
        }

        /* =========================
           SAF MESSAGE
        ========================== */

        .message {
            background: #fff;
            color: #111;
        }

        .message-box {
            border-left: 5px solid var(--red);
            padding-left: 30px;
        }

        .message-box h3 {
            font-family: "Oswald", sans-serif;
            text-transform: uppercase;
            font-size: 35px;
        }

        .message-box p {
            color: #666;
            line-height: 1.8;
        }

        /* =========================
           CONTACT
        ========================== */

        .contact {
            background: #171717;
        }

        .form-control-custom {
            background: transparent;
            color: #fff;
            border: 0;
            border-bottom: 1px solid #555;
            border-radius: 0;
            padding: 18px 0;
        }

        .form-control-custom:focus {
            background: transparent;
            color: #fff;
            border-color: var(--red);
            box-shadow: none;
        }

        .form-control-custom::placeholder {
            color: #777;
        }

        /* =========================
           FOOTER
        ========================== */

        footer {
            background: #050505;
            border-top: 1px solid #222;
        }

        .footer-logo {
            font-family: "Oswald", sans-serif;
            font-size: 38px;
            text-transform: uppercase;
        }

        .footer-logo span {
            color: var(--red);
        }

        .footer-link {
            color: #777;
            display: block;
            margin-bottom: 10px;
        }

        .footer-link:hover {
            color: #fff;
        }

        .social {
            width: 42px;
            height: 42px;
            border: 1px solid #333;
            color: #aaa;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-right: 5px;
            transition: .3s;
        }

        .social:hover {
            background: #fff;
            color: #000;
        }

        /* =========================
           RESPONSIVE
        ========================== */

        @media(max-width: 991px) {

            .navbar {
                background: rgba(0,0,0,.9);
            }

            .navbar-collapse {
                background: #111;
                padding: 20px;
                margin-top: 15px;
            }

            .hero {
                min-height: 850px;
            }

            .scroll-text {
                display: none;
            }

            .section-padding {
                padding: 80px 0;
            }

            .founder-image {
                min-height: 450px;
            }

            .founder-content {
                padding: 40px 20px;
            }

            .workshop {
                background-attachment: scroll;
            }
        }

        @media(max-width: 575px) {

            .hero h1 {
                font-size: 62px;
                letter-spacing: -1px;
            }

            .hero-description {
                font-size: 14px;
            }

            .hero-buttons .btn {
                width: 100%;
                margin-bottom: 10px;
            }

            .intro-text {
                font-size: 19px;
            }

            .area-card {
                height: 360px;
            }

            .section-padding {
                padding: 65px 0;
            }
        }


@media (max-width: 991px) {

    .navbar {
        background: rgba(0,0,0,.95);
    }

    .navbar-collapse {
        background: #111;
        padding: 20px;
        margin-top: 15px;
    }

    .hero {
        min-height: 850px;
    }

    .scroll-text {
        display: none;
    }

    .section-padding {
        padding: 80px 0;
    }

    .founder-image {
        min-height: 450px;
    }

    .founder-content {
        padding: 40px 20px;
    }

    .workshop {
        background-attachment: scroll;
    }
}





/* =========================================
   FULL DARK THEME
========================================= */

html,
body {
    background: #050505;
    color: #fff;
}

/* Light sections → Dark */
.intro,
.training,
.opportunities,
.productions,
.message {
    background: #050505 !important;
    color: #fff !important;
}

/* Intro */
.intro-number {
    color: #222;
}

.intro-text {
    color: #fff;
}

.intro .text-secondary,
.training .text-secondary,
.opportunities .text-secondary,
.message .text-secondary {
    color: #999 !important;
}

/* Training */
.training-list {
    border-top-color: #292929;
}

.training-item {
    border-bottom-color: #292929;
    color: #fff;
}

/* Opportunities */
.opportunity {
    border-top-color: #292929;
}

.opportunity h3 {
    color: #fff;
}

.opportunity p {
    color: #888 !important;
}

/* Productions */
.production-card {
    background: #111;
    color: #fff;
    border: 1px solid #222;
    border-bottom: 4px solid transparent;
}

.production-card:hover {
    border-bottom-color: var(--red);
}

.production-card p {
    color: #888 !important;
}

/* Message */
.message-box {
    border-left-color: var(--red);
}

.message-box h3 {
    color: #fff;
}

.message-box p {
    color: #999 !important;
}

.message-box .text-dark {
    color: #fff !important;
}

/* Locations */
.locations {
    background: #050505;
}

/* Philosophy */
.philosophy {
    background: #0b0b0b;
}

/* Contact */
.contact {
    background: #111;
}

/* Footer */
footer {
    background: #000;
}

/* Navbar */
.navbar.scrolled {
    background: rgba(0, 0, 0, 0.97);
}

/* Cards / hover */
.area-card {
    background: #111;
}

/* Buttons */
.btn-main {
    background: var(--red);
    color: #fff;
}

.btn-main:hover {
    background: #fff;
    color: #000;
}

/* Mobile navbar */
@media (max-width: 991px) {
    .navbar {
        background: rgba(0, 0, 0, .95);
    }

    .navbar-collapse {
        background: #0b0b0b;
    }
}

    