/* =========================================================
   LYGS HEADER
========================================================= */
body {
    margin: 0;

    background: #ffffff;
    color: #111111;

    font-family: "Montserrat", Arial, sans-serif;

    font-size: 16px;
    line-height: 1.65;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.font-display {
    font-family: "Montserrat", Arial, sans-serif;
}



/* =========================================================
   GLOBAL LAYOUT CONTAINER
========================================================= */

.app-container {
    width: 100%;
    max-width: 1440px;

    margin-left: auto;
    margin-right: auto;

    padding-left: 20px;
    padding-right: 20px;
}


/* Small screens */
@media (min-width: 640px) {

    .app-container {
        padding-left: 28px;
        padding-right: 28px;
    }

}


/* Desktop */
@media (min-width: 1024px) {

    .app-container {
        padding-left: 40px;
        padding-right: 40px;
    }

}


/* Large desktop */
@media (min-width: 1280px) {

    .app-container {
        padding-left: 48px;
        padding-right: 48px;
    }

}


/* Extra-large displays */
@media (min-width: 1536px) {

    .app-container {
        padding-left: 56px;
        padding-right: 56px;
    }

}


/* =========================================================
   DESKTOP NAV LINKS
========================================================= */

.nav-link {
    position: relative;

    display: inline-flex;
    align-items: center;
    gap: 0.45rem;

    height: 100%;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;

    color: #171717;

    transition:
        color 0.2s ease,
        opacity 0.2s ease;
}


.nav-link::after {
    content: "";

    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    height: 3px;

    background: var(--lygs-red);

    transform: scaleX(0);
    transform-origin: center;

    transition: transform 0.25s ease;
}


.nav-link:hover 
.nav-link:focus-visible{
    color: var(--lygs-red);
}

.nav-link:hover::after {
    transform: scaleX(1);
}

.nav-link:hover::after,
.nav-link:focus-visible::after,
.nav-dropdown.is-open > .nav-link::after {
    right: 0;
}


.nav-dropdown.is-open > .nav-link {
    color: #ffffff;
}


.nav-dropdown.is-open
.nav-dropdown-trigger
.fa-chevron-down {
    transform: rotate(180deg);
}


/* =========================================================
   DESKTOP DROPDOWN
========================================================= */

.nav-dropdown-menu {
    position: absolute;

    top: 100%;
    left: 50%;

    min-width: 340px;

    padding-top: 12px;

    opacity: 0;
    visibility: hidden;

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

    pointer-events: none;

    transition:
        opacity 0.2s ease,
        transform 0.2s ease,
        visibility 0.2s ease;
}


.nav-dropdown-menu-right {
    left: auto;
    right: 0;

    transform: translateY(8px);
}


.nav-dropdown:hover > .nav-dropdown-menu,
.nav-dropdown:focus-within > .nav-dropdown-menu,
.nav-dropdown.is-open > .nav-dropdown-menu {
    opacity: 1;
    visibility: visible;

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

    pointer-events: auto;
}


.nav-dropdown:hover > .nav-dropdown-menu-right,
.nav-dropdown:focus-within > .nav-dropdown-menu-right,
.nav-dropdown.is-open > .nav-dropdown-menu-right {
    transform: translateY(0);
}


/* =========================================================
   MENU CARD
========================================================= */

.nav-menu-card {
    width: 380px;

    overflow: hidden;

    background: #ffffff;
    color: #111111;

    border-top: 3px solid #E50014;

    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.28);
}


.nav-menu-card-small {
    width: 270px;
}


/* =========================================================
   DROPDOWN TYPOGRAPHY
========================================================= */

.dropdown-eyebrow {
    display: block;

    margin-bottom: 5px;

    color: #E50014;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.15em;
    text-transform: uppercase;
}


.dropdown-heading {
    margin: 0;

    color: #090909;

    font-family: "Montserrat", Arial, sans-serif;

    font-size: 23px;
    font-weight: 900;

    line-height: 1.15;

    letter-spacing: -0.03em;
    text-transform: uppercase;
}


/* =========================================================
   FEATURE DROPDOWN LINKS
========================================================= */

.dropdown-link {
    display: flex;
    align-items: flex-start;

    gap: 13px;

    padding: 12px;

    color: #111111;

    transition:
        background 0.2s ease,
        transform 0.2s ease;
}


.dropdown-link:hover {
    background: #f5f5f5;
}


.dropdown-icon {
    flex-shrink: 0;

    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #090909;
    color: #E50014;

    font-size: 12px;
}


.dropdown-link strong {
    display: block;

    color: #111111;

    font-size: 13px;
    font-weight: 700;

    line-height: 1.4;
}


.dropdown-link small {
    display: block;

    margin-top: 4px;

    color: #6b6b6b;

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

    line-height: 1.5;
}


/* =========================================================
   SMALL LINKS
========================================================= */

.dropdown-small-link {
    display: flex;
    align-items: center;

    min-height: 42px;

    padding: 10px 12px;

    background: #f6f6f6;

    color: #333333;

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

    text-transform: uppercase;
    letter-spacing: 0.04em;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}


.dropdown-small-link:hover {
    background: #090909;
    color: #ffffff;
}


/* =========================================================
   SIMPLE DROPDOWN LINKS
========================================================= */

.simple-dropdown-link {
    position: relative;

    min-height: 44px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 11px 13px;

    color: #333333;

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

    border-bottom: 1px solid #eeeeee;

    transition:
        color 0.2s ease,
        padding 0.2s ease,
        background 0.2s ease;
}


.simple-dropdown-link:last-child {
    border-bottom: 0;
}


.simple-dropdown-link::after {
    content: "\f061";

    font-family: "Font Awesome 6 Free";
    font-weight: 900;

    color: #E50014;

    font-size: 9px;

    opacity: 0;

    transform: translateX(-5px);

    transition:
        opacity 0.2s ease,
        transform 0.2s ease;
}


.simple-dropdown-link:hover {
    padding-left: 17px;

    background: #f7f7f7;

    color: #090909;
}


.simple-dropdown-link:hover::after {
    opacity: 1;

    transform: translateX(0);
}


/* =========================================================
   DROPDOWN FOOTER
========================================================= */

.dropdown-footer-link {
    min-height: 50px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 18px;

    background: #090909;
    color: #ffffff;

    font-size: 10px;
    font-weight: 900;

    letter-spacing: 0.1em;
    text-transform: uppercase;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}


.dropdown-footer-link:hover {
    background: #E50014;
}


/* =========================================================
   MOBILE NAVIGATION
========================================================= */

.mobile-nav-group {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}


.mobile-nav-summary {
    min-height: 60px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    list-style: none;

    color: #ffffff;

    font-family: "Montserrat", Arial, sans-serif;

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

    letter-spacing: -0.02em;
    text-transform: uppercase;

    cursor: pointer;
}


.mobile-nav-summary::-webkit-details-marker {
    display: none;
}


.mobile-nav-group[open]
.mobile-nav-summary {
    color: #E50014;
}


.mobile-nav-group[open]
.mobile-nav-summary i {
    transform: rotate(45deg);
}


.mobile-nav-summary i {
    transition: transform 0.2s ease;
}


.mobile-submenu {
    padding:
        0
        0
        15px
        15px;
}


.mobile-submenu a {
    min-height: 42px;

    display: flex;
    align-items: center;

    color: rgba(255, 255, 255, 0.62);

    font-size: 12px;
    font-weight: 600;

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

    transition:
        color 0.2s ease,
        padding 0.2s ease;
}


.mobile-submenu a:hover {
    padding-left: 5px;

    color: #ffffff;
}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.nav-link:focus-visible,
.dropdown-link:focus-visible,
.simple-dropdown-link:focus-visible,
.mobile-nav-summary:focus-visible,
.mobile-submenu a:focus-visible {

    outline: 2px solid #E50014;
    outline-offset: 3px;

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .nav-link,
    .nav-link::after,
    .nav-dropdown-menu,
    .dropdown-link,
    .simple-dropdown-link,
    .mobile-nav-summary i {

        transition: none !important;

    }

}




/* =========================================================
   LYGS STATISTICS
========================================================= */

.lygs-stat {
    position: relative;

    min-height: 150px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 20px 24px;

    border-left: 1px solid #e8e8e8;
}


.lygs-stat-number {
    display: flex;
    align-items: flex-start;

    color: #090909;

    font-family: "Montserrat", Arial, sans-serif;

    font-size: clamp(38px, 4vw, 56px);
    font-weight: 900;

    line-height: 1;

    letter-spacing: -0.055em;
}


.lygs-stat-number span {
    margin-top: 3px;
    margin-left: 3px;

    color: #E50014;

    font-size: 0.48em;
    font-weight: 900;
}


.lygs-stat-label {
    margin-top: 11px;

    max-width: 150px;

    color: #737373;

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

    line-height: 1.45;

    letter-spacing: 0.04em;
    text-transform: uppercase;
}


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

@media (max-width: 767px) {

    .lygs-stat {
        min-height: 130px;

        padding: 20px 16px;

        border-left: 0;
        border-top: 1px solid #e8e8e8;
    }


    .lygs-stat:nth-child(even) {
        border-left: 1px solid #e8e8e8;
    }


    .lygs-stat-number {
        font-size: 38px;
    }

}



/* =========================================================
   CREDIBILITY
========================================================= */

.credibility-item {
    padding: 24px 28px;
}

.credibility-item + .credibility-item {
    border-left: 1px solid #e8e8e8;
}

.credibility-icon {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 20px;

    border-radius: 50%;

    background: #090909;
    color: #E50014;

    font-size: 14px;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}


.credibility-item:hover .credibility-icon {
    background: #E50014;
    color: #ffffff;

    transform: translateY(-3px);
}

.credibility-item h3 {
    max-width: 190px;

    color: #090909;

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

    line-height: 1.35;
    letter-spacing: -0.025em;
}

.credibility-item p {
    margin-top: 10px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.7;
}

@media (max-width: 639px) {

    .credibility-item {
        padding: 24px 0;
        border-top: 1px solid #e8e8e8;
    }

    .credibility-item + .credibility-item {
        border-left: 0;
    }

}





/* =========================================================
   PROGRAM CARDS
========================================================= */

.program-card {
    position: relative;
    overflow: hidden;

    display: block;

    background: #090909;
    color: #ffffff;
}

.program-card > img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.7s ease;
}

.program-card:hover > img {
    transform: scale(1.045);
}

.program-card-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(0, 0, 0, 0.94) 0%,
            rgba(0, 0, 0, 0.52) 52%,
            rgba(0, 0, 0, 0.08) 100%
        );
}

.program-card-content {
    position: absolute;
    z-index: 2;

    left: 0;
    right: 0;
    bottom: 0;

    padding: 28px;
}

.program-number {
    display: block;

    margin-bottom: 12px;

    color: #E50014;

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

    letter-spacing: 0.1em;
}

.program-card h3 {
    color: #ffffff;

    font-family: "Montserrat", Arial, sans-serif;

    font-size: clamp(25px, 3vw, 38px);
    font-weight: 900;

    line-height: 1;

    letter-spacing: -0.045em;
}

.program-card p {
    max-width: 480px;

    margin-top: 13px;

    color: rgba(255, 255, 255, 0.65);

    font-size: 13px;
    font-weight: 500;

    line-height: 1.7;
}

.program-link {
    display: flex;
    align-items: center;
    gap: 10px;

    margin-top: 20px;

    color: #ffffff;

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

    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.program-link i {
    color: #E50014;

    transition: transform 0.25s ease;
}

.program-card:hover .program-link i {
    transform: translateX(5px);
}




/* =========================================================
   LYGS DEVELOPMENT SYSTEM
========================================================= */

.development-pillar {
    position: relative;

    min-height: 390px;

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

    padding: 28px 26px;

    border-right: 1px solid rgba(255, 255, 255, 0.18);
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);

    /*
     * Semi-transparent background allows the
     * facility video to remain visible.
     */
    background: rgba(0, 0, 0, 0.28);

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

    transition:
        background 0.35s ease,
        transform 0.35s ease;
}


.development-pillar:hover {
    background: rgba(0, 0, 0, 0.56);
}


/* =========================================================
   PILLAR TOP
========================================================= */

.development-pillar-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.development-number {
    color: rgba(255, 255, 255, 0.50);

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

    letter-spacing: 0.12em;
}


/* =========================================================
   ICON
========================================================= */

.development-icon-wrap {
    width: 44px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 50%;

    background: rgba(0, 0, 0, 0.20);

    color: #E50014;

    font-size: 15px;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}


.development-pillar:hover .development-icon-wrap {
    background: #E50014;
    border-color: #E50014;

    color: #ffffff;

    transform: translateY(-3px);
}


/* =========================================================
   PILLAR CONTENT
========================================================= */

.development-pillar-content {
    margin-top: 70px;
}


.development-small-label {
    display: block;

    margin-bottom: 10px;

    color: #E50014;

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

    letter-spacing: 0.12em;
    text-transform: uppercase;
}


.development-pillar h3 {
    margin: 0;

    color: #ffffff;

    font-family: "Montserrat", Arial, sans-serif;

    font-size: 31px;
    font-weight: 900;

    line-height: 1;

    letter-spacing: -0.05em;
}


.development-pillar p {
    margin-top: 16px;

    color: rgba(255, 255, 255, 0.74);

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* =========================================================
   PATHWAY
========================================================= */

.development-pillar-pathway {
    background: rgba(229, 0, 20, 0.78);
}


.development-pillar-pathway:hover {
    background: rgba(229, 0, 20, 0.94);
}


.development-pillar-pathway .development-number {
    color: rgba(255, 255, 255, 0.65);
}


.development-pillar-pathway .development-small-label {
    color: rgba(255, 255, 255, 0.75);
}


.development-pillar-pathway p {
    color: rgba(255, 255, 255, 0.82);
}


.development-icon-wrap-light {
    background: rgba(0, 0, 0, 0.16);

    border-color: rgba(255, 255, 255, 0.35);

    color: #ffffff;
}


.development-pillar-pathway:hover
.development-icon-wrap-light {
    background: #ffffff;
    border-color: #ffffff;

    color: #E50014;
}


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

.development-pathway-link {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    margin-top: 25px;

    color: #ffffff;

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

    letter-spacing: 0.05em;
    text-transform: uppercase;
}


.development-pathway-link i {
    font-size: 9px;

    transition: transform 0.25s ease;
}


.development-pathway-link:hover i {
    transform: translate(3px, -3px);
}


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

@media (max-width: 1279px) {

    .development-pillar {
        min-height: 320px;
    }


    .development-pillar-content {
        margin-top: 50px;
    }

}


@media (max-width: 639px) {

    .development-pillar {
        min-height: 290px;

        padding: 26px 22px;
    }


    .development-pillar-content {
        margin-top: 45px;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .development-pillar,
    .development-icon-wrap,
    .development-pathway-link i {
        transition: none;
    }

}







/* =========================================================
   REAL DEVELOPMENT
========================================================= */

.real-development-point {
    min-height: 94px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 18px 20px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    transition:
        background 0.3s ease,
        transform 0.3s ease;
}

.real-development-point:hover {
    background: #f7f7f7;
}

.real-development-point span {
    margin-bottom: 5px;

    color: #E50014;

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

    letter-spacing: 0.12em;
}

.real-development-point strong {
    color: #111111;

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

    letter-spacing: -0.01em;
}






/* =========================================================
   BALLERSINK BRIDGE
========================================================= */

.ballersink-audience {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 18px;

    padding: 24px 0;

    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.ballersink-audience:first-child {
    border-top: 1px solid rgba(255, 255, 255, 0.10);
}

.ballersink-audience > span {
    padding-top: 4px;

    color: #F36B21;

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

    letter-spacing: 0.12em;
}

.ballersink-audience h3 {
    color: #ffffff;

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

    letter-spacing: -0.02em;
}

.ballersink-audience p {
    max-width: 360px;

    margin-top: 7px;

    color: rgba(255, 255, 255, 0.52);

    font-size: 13px;
    font-weight: 500;

    line-height: 1.7;
}





/* =========================================================
   LYGS TV
========================================================= */

.lygs-tv-item {
    flex: 1;

    display: grid;
    grid-template-columns: 32px 1fr;
    gap: 15px;

    padding: 25px 24px;

    border-bottom: 1px solid #e5e7eb;
}

.lygs-tv-number {
    padding-top: 3px;

    color: #E50014;

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

    letter-spacing: 0.12em;
}

.lygs-tv-category {
    display: block;

    margin-bottom: 7px;

    color: #737373;

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

    letter-spacing: 0.10em;
    text-transform: uppercase;
}

.lygs-tv-item h3 {
    color: #111111;

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

    line-height: 1.45;
    letter-spacing: -0.02em;
}

.lygs-tv-item a {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-top: 14px;

    color: #111111;

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

    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.lygs-tv-item a:hover {
    color: #E50014;
}





/* =========================================================
   FOR PARENTS
========================================================= */

.parent-topic {
    position: relative;

    min-height: 275px;

    padding: 28px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    transition: background 0.3s ease;
}

.parent-topic:hover {
    background: #fafafa;
}

.parent-topic-number {
    position: absolute;

    top: 25px;
    right: 25px;

    color: #d4d4d4;

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

    letter-spacing: 0.12em;
}

.parent-topic > i {
    color: #E50014;

    font-size: 18px;
}

.parent-topic h3 {
    margin-top: 40px;

    color: #111111;

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

    letter-spacing: -0.03em;
}

.parent-topic p {
    margin-top: 12px;

    max-width: 300px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}






/* =========================================================
   UPCOMING EVENTS
========================================================= */

.event-row {
    display: grid;

    grid-template-columns:
        100px
        130px
        minmax(0, 1fr)
        auto;

    align-items: center;

    gap: 24px;

    min-height: 145px;

    padding: 24px 0;

    border-bottom: 1px solid #e5e7eb;

    transition:
        padding 0.3s ease,
        background 0.3s ease;
}


/* DATE */

.event-date {
    display: flex;
    flex-direction: column;

    line-height: 1;
}


.event-month {
    margin-bottom: 5px;

    color: #E50014;

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

    letter-spacing: 0.12em;
    text-transform: uppercase;
}


.event-day {
    color: #111111;

    font-family: "Montserrat", Arial, sans-serif;

    font-size: 44px;
    font-weight: 900;

    letter-spacing: -0.06em;
}


/* TYPE */

.event-type span {
    display: inline-flex;

    padding: 7px 10px;

    background: #f5f5f5;

    color: #525252;

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

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


/* DETAILS */

.event-details h3 {
    color: #111111;

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

    line-height: 1.35;
    letter-spacing: -0.025em;
}


.event-meta {
    display: flex;
    flex-wrap: wrap;

    gap: 18px;

    margin-top: 9px;
}


.event-meta span {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    color: #737373;

    font-size: 11px;
    font-weight: 600;
}


.event-meta i {
    color: #E50014;

    font-size: 10px;
}


/* ACTION */

.event-action a {
    display: inline-flex;
    align-items: center;

    gap: 14px;

    color: #111111;

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

    letter-spacing: 0.05em;
    text-transform: uppercase;
}


.event-action a > span {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #111111;
    color: #ffffff;

    transition:
        background 0.3s ease,
        transform 0.3s ease;
}


.event-row:hover .event-action a > span {
    background: #E50014;

    transform: translateX(4px);
}


/* RESPONSIVE */

@media (max-width: 900px) {

    .event-row {
        grid-template-columns: 75px 1fr;

        gap: 20px;

        padding: 28px 0;
    }


    .event-type {
        grid-column: 2;
        grid-row: 1;
    }


    .event-details {
        grid-column: 2;
    }


    .event-action {
        grid-column: 2;
    }

}


@media (max-width: 520px) {

    .event-row {
        grid-template-columns: 60px 1fr;
    }


    .event-day {
        font-size: 36px;
    }


    .event-details h3 {
        font-size: 17px;
    }

}







/* =========================================================
   NEWS & INSIGHTS
========================================================= */

.news-card {
    background: #ffffff;

    overflow: hidden;
}


/* IMAGE */

.news-card-image {
    position: relative;

    height: 280px;

    overflow: hidden;

    background: #e5e5e5;
}


.news-card-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}


.news-card:hover .news-card-image img {
    transform: scale(1.04);
}


/* IMAGE ARROW */

.news-card-arrow {
    position: absolute;

    right: 18px;
    bottom: 18px;

    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #ffffff;
    color: #111111;

    font-size: 11px;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}


.news-card:hover .news-card-arrow {
    background: #E50014;
    color: #ffffff;

    transform: translate(2px, -2px);
}


/* CONTENT */

.news-card-content {
    padding: 25px;
}


/* META */

.news-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    margin-bottom: 14px;
}


.news-card-category {
    color: #E50014;

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

    letter-spacing: 0.09em;
    text-transform: uppercase;
}


.news-card-meta time {
    color: #a3a3a3;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: 0.04em;
}


/* TITLE */

.news-card h3 {
    color: #111111;

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

    line-height: 1.4;
    letter-spacing: -0.03em;
}


.news-card h3 a {
    transition: color 0.25s ease;
}


.news-card h3 a:hover {
    color: #E50014;
}


/* EXCERPT */

.news-card-content > p {
    margin-top: 13px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* READ ARTICLE */

.news-card-link {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-top: 22px;

    color: #111111;

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

    letter-spacing: 0.06em;
    text-transform: uppercase;

    transition: color 0.25s ease;
}


.news-card-link i {
    font-size: 8px;

    transition: transform 0.25s ease;
}


.news-card-link:hover {
    color: #E50014;
}


.news-card-link:hover i {
    transform: translateX(3px);
}


/* RESPONSIVE */

@media (max-width: 1023px) {

    .news-card-image {
        height: 250px;
    }

}


@media (max-width: 639px) {

    .news-card-image {
        height: 230px;
    }


    .news-card-content {
        padding: 22px;
    }

}



/* =========================================================
   ABOUT PAGE
========================================================= */

.about-reason {
    position: relative;

    min-height: 285px;

    padding: 30px 26px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    transition:
        background 0.3s ease,
        transform 0.3s ease;
}


.about-reason:hover {
    background: #ffffff;
}


.about-reason-number {
    position: absolute;

    top: 25px;
    right: 25px;

    color: #d4d4d4;

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

    letter-spacing: 0.12em;
}


.about-reason > i {
    color: #E50014;

    font-size: 19px;
}


.about-reason h3 {
    margin-top: 46px;

    color: #111111;

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

    letter-spacing: -0.025em;
}


.about-reason p {
    margin-top: 13px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* =========================================================
   GLOBAL PERSPECTIVE
========================================================= */

.global-region {
    position: relative;

    min-height: 330px;

    padding: 30px;

    border-right: 1px solid rgba(255,255,255,.10);
    border-bottom: 1px solid rgba(255,255,255,.10);
}


.global-region > span {
    color: #E50014;

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

    letter-spacing: .12em;
}


.global-region h3 {
    margin-top: 80px;

    color: #ffffff;

    font-size: 24px;
    font-weight: 900;

    letter-spacing: -.035em;
}


.global-region p {
    margin-top: 17px;

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

    font-size: 13px;
    font-weight: 600;

    line-height: 2;
}


@media (prefers-reduced-motion: reduce) {

    .about-hero-video {
        display: none;
    }

}



/* =========================================================
   OUR STORY — REGIONS
========================================================= */

.story-region {
    position: relative;

    min-height: 360px;

    padding: 32px;

    border-right: 1px solid rgba(255,255,255,.10);
    border-bottom: 1px solid rgba(255,255,255,.10);
}


.story-region-number {
    position: absolute;

    top: 30px;
    right: 30px;

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

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

    letter-spacing: .12em;
}


.story-region > i {
    color: #E50014;

    font-size: 21px;
}


.story-region h3 {
    margin-top: 72px;

    color: #ffffff;

    font-size: 27px;
    font-weight: 900;

    letter-spacing: -.04em;
}


.story-region-countries {
    margin-top: 8px;

    color: #E50014;

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

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


.story-region-description {
    margin-top: 25px;

    max-width: 330px;

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

    font-size: 13px;
    font-weight: 500;

    line-height: 1.8;
}


/* =========================================================
   STORY — DEVELOPMENT LESSONS
========================================================= */

.story-lessons {
    border-top: 1px solid #e5e7eb;
}


.story-lesson {
    display: grid;

    grid-template-columns: 60px 1fr;

    gap: 20px;

    padding: 26px 0;

    border-bottom: 1px solid #e5e7eb;
}


.story-lesson > span {
    padding-top: 4px;

    color: #E50014;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.story-lesson h3 {
    color: #111111;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.story-lesson p {
    margin-top: 7px;

    max-width: 500px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* =========================================================
   STORY — COMMUNITY
========================================================= */

.story-community-card {
    min-height: 270px;

    padding: 30px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;

    transition:
        transform .3s ease,
        background .3s ease;
}


.story-community-card:hover {
    background: #fafafa;
}


.story-community-card > i {
    color: #E50014;

    font-size: 20px;
}


.story-community-card h3 {
    margin-top: 55px;

    color: #111111;

    font-size: 21px;
    font-weight: 900;

    letter-spacing: -.03em;
}


.story-community-card p {
    margin-top: 12px;

    max-width: 320px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


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

@media (max-width: 767px) {

    .story-region {
        min-height: 300px;
        padding: 26px;
    }


    .story-region h3 {
        margin-top: 55px;
    }


    .story-lesson {
        grid-template-columns: 42px 1fr;
    }


    .story-community-card {
        min-height: 230px;
        padding: 26px;
    }

}


/* =========================================================
   WHY LYGS — COMMUNITY
========================================================= */

.why-community-list {
    border-top: 1px solid rgba(255,255,255,.10);
}


.why-community-item {
    display: grid;

    grid-template-columns: 52px 1fr;

    gap: 20px;

    padding: 25px 0;

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


.why-community-item > span {
    padding-top: 4px;

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

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.why-community-item i {
    color: #E50014;

    font-size: 15px;
}


.why-community-item h3 {
    margin-top: 10px;

    color: #ffffff;

    font-size: 17px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.why-community-item p {
    margin-top: 7px;

    max-width: 450px;

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

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* =========================================================
   WHY LYGS — OPPORTUNITY
========================================================= */

.why-opportunity-step {
    min-height: 140px;

    padding: 25px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;
}


.why-opportunity-step span {
    display: block;

    color: #E50014;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.why-opportunity-step strong {
    display: block;

    margin-top: 35px;

    color: #111111;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}


/* =========================================================
   WHY LYGS — EXPECT
========================================================= */

.why-expect-card {
    min-height: 270px;

    padding: 28px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    transition: background .3s ease;
}


.why-expect-card:hover {
    background: #fafafa;
}


.why-expect-card > i {
    color: #E50014;

    font-size: 19px;
}


.why-expect-card h3 {
    margin-top: 55px;

    color: #111111;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.why-expect-card p {
    margin-top: 12px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


@media (max-width: 767px) {

    .why-community-item {
        grid-template-columns: 40px 1fr;
    }


    .why-expect-card {
        min-height: 225px;
        padding: 25px;
    }

}



/* =========================================================
   ALYPROTRAINER — GLOBAL JOURNEY
========================================================= */

.aly-region {
    position: relative;

    min-height: 350px;

    padding: 32px;

    border-right: 1px solid rgba(255,255,255,.10);
    border-bottom: 1px solid rgba(255,255,255,.10);
}


.aly-region-number {
    position: absolute;

    top: 30px;
    right: 30px;

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

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.aly-region > i {
    color: #E50014;

    font-size: 20px;
}


.aly-region h3 {
    margin-top: 70px;

    color: #ffffff;

    font-size: 25px;
    font-weight: 900;

    letter-spacing: -.035em;
}


.aly-region-locations {
    margin-top: 8px !important;

    color: #E50014 !important;

    font-size: 10px !important;
    font-weight: 800 !important;

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


.aly-region > p:last-child {
    margin-top: 24px;

    max-width: 330px;

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

    font-size: 13px;
    font-weight: 500;

    line-height: 1.8;
}


/* =========================================================
   COACHING PRINCIPLES
========================================================= */

.aly-principles {
    border-top: 1px solid #e5e7eb;
}


.aly-principle {
    display: grid;

    grid-template-columns: 55px 1fr;

    gap: 20px;

    padding: 27px 0;

    border-bottom: 1px solid #e5e7eb;
}


.aly-principle > span {
    padding-top: 4px;

    color: #E50014;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.aly-principle h3 {
    color: #111111;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.aly-principle p {
    margin-top: 7px;

    max-width: 520px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* =========================================================
   DEVELOPMENT PILLARS
========================================================= */

.aly-development-pillar {
    position: relative;

    min-height: 270px;

    padding: 27px 24px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;

    transition:
        background .3s ease,
        transform .3s ease;
}


.aly-development-pillar:hover {
    background: #fafafa;
}


.aly-development-pillar > span {
    position: absolute;

    top: 25px;
    right: 25px;

    color: #d4d4d4;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.aly-development-pillar > i {
    color: #E50014;

    font-size: 19px;
}


.aly-development-pillar h3 {
    margin-top: 58px;

    color: #111111;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.aly-development-pillar p {
    margin-top: 11px;

    color: #737373;

    font-size: 12px;
    font-weight: 500;

    line-height: 1.7;
}


/* PATHWAY */

.aly-development-pillar-pathway {
    background: #E50014;
}


.aly-development-pillar-pathway:hover {
    background: #cf0012;
}


.aly-development-pillar-pathway > span {
    color: rgba(255,255,255,.40);
}


.aly-development-pillar-pathway > i,
.aly-development-pillar-pathway h3,
.aly-development-pillar-pathway p {
    color: #ffffff;
}


.aly-development-pillar-pathway p {
    color: rgba(255,255,255,.72);
}


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

@media (max-width: 767px) {

    .aly-region {
        min-height: 300px;
        padding: 26px;
    }


    .aly-region h3 {
        margin-top: 55px;
    }


    .aly-principle {
        grid-template-columns: 40px 1fr;
    }


    .aly-development-pillar {
        min-height: 225px;
    }

}


/* =========================================================
   OUR COACHES — CARDS
========================================================= */

.coach-card-image {
    aspect-ratio: 4 / 5;
}


.coach-card {
    min-width: 0;
}


/* =========================================================
   OUR COACHES — PRINCIPLES
========================================================= */

.coach-principles {
    border-top: 1px solid rgba(255,255,255,.10);
}


.coach-principle {
    display: grid;

    grid-template-columns: 55px 1fr;

    gap: 20px;

    padding: 27px 0;

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


.coach-principle > span {
    padding-top: 4px;

    color: #E50014;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.coach-principle h3 {
    color: #ffffff;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.coach-principle p {
    margin-top: 7px;

    max-width: 520px;

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

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* =========================================================
   COACHES — DEVELOPMENT PILLARS
========================================================= */

.coach-development-pillar {
    position: relative;

    min-height: 260px;

    padding: 27px 24px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;

    transition: background .3s ease;
}


.coach-development-pillar:hover {
    background: #fafafa;
}


.coach-development-pillar > span {
    position: absolute;

    top: 25px;
    right: 25px;

    color: #d4d4d4;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.coach-development-pillar > i {
    color: #E50014;

    font-size: 19px;
}


.coach-development-pillar h3 {
    margin-top: 58px;

    color: #111111;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.coach-development-pillar p {
    margin-top: 11px;

    color: #737373;

    font-size: 12px;
    font-weight: 500;

    line-height: 1.7;
}


/* PATHWAY */

.coach-development-pillar-pathway {
    background: #E50014;
}


.coach-development-pillar-pathway:hover {
    background: #cf0012;
}


.coach-development-pillar-pathway > span {
    color: rgba(255,255,255,.4);
}


.coach-development-pillar-pathway > i,
.coach-development-pillar-pathway h3 {
    color: #ffffff;
}


.coach-development-pillar-pathway p {
    color: rgba(255,255,255,.72);
}


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

@media (max-width: 767px) {

    .coach-principle {
        grid-template-columns: 40px 1fr;
    }


    .coach-development-pillar {
        min-height: 225px;
    }

}



/* =========================================================
   PROGRAMS — FIND YOUR FIT
========================================================= */

.program-factor {
    min-height: 220px;

    padding: 26px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;
}


.program-factor > i {
    color: #E50014;
    font-size: 18px;
}


.program-factor h3 {
    margin-top: 45px;

    color: #111111;

    font-size: 16px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.program-factor p {
    margin-top: 8px;

    color: #737373;

    font-size: 12px;
    font-weight: 500;

    line-height: 1.7;
}


/* =========================================================
   PROGRAM CARDS
========================================================= */

.program-card {
    min-width: 0;
}


.program-card-content {
    min-height: 300px;
}


/* =========================================================
   PROGRAM CHOOSER
========================================================= */

.program-chooser {
    border-top: 1px solid #e5e7eb;
}


.program-choice {
    display: grid;

    grid-template-columns: 55px 1fr;

    gap: 20px;

    padding: 25px 0;

    border-bottom: 1px solid #e5e7eb;
}


.program-choice > span {
    padding-top: 4px;

    color: #E50014;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.program-choice h3 {
    color: #111111;

    font-size: 17px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.program-choice p {
    margin-top: 7px;

    max-width: 540px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* =========================================================
   DEVELOPMENT SYSTEM
========================================================= */

.program-development-pillar {
    position: relative;

    min-height: 255px;

    padding: 26px 23px;

    border-right: 1px solid rgba(255,255,255,.10);
    border-bottom: 1px solid rgba(255,255,255,.10);
}


.program-development-pillar > span {
    position: absolute;

    top: 24px;
    right: 24px;

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

    font-size: 9px;
    font-weight: 900;

    letter-spacing: .1em;
}


.program-development-pillar > i {
    color: #E50014;

    font-size: 18px;
}


.program-development-pillar h3 {
    margin-top: 58px;

    color: #ffffff;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}


.program-development-pillar p {
    margin-top: 10px;

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

    font-size: 12px;
    font-weight: 500;

    line-height: 1.7;
}


.program-development-pathway {
    background: #E50014;
}


.program-development-pathway > i,
.program-development-pathway h3 {
    color: #ffffff;
}


.program-development-pathway p {
    color: rgba(255,255,255,.72);
}


/* =========================================================
   TRAINING FLOW
========================================================= */

.program-flow-step {
    min-height: 115px;

    padding: 20px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;
}


.program-flow-step span {
    display: block;

    color: #E50014;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: .1em;
}


.program-flow-step strong {
    display: block;

    margin-top: 28px;

    color: #111111;

    font-size: 13px;
    font-weight: 900;

    letter-spacing: .04em;
}


/* =========================================================
   UPCOMING PROGRAM SESSIONS
========================================================= */

.program-session {
    display: grid;

    grid-template-columns:
        80px
        minmax(0, 1.5fr)
        minmax(0, 1fr)
        130px;

    gap: 30px;

    align-items: center;

    padding: 28px 0;

    border-bottom: 1px solid #e5e7eb;
}


.program-session-month {
    display: block;

    color: #E50014;

    font-size: 9px;
    font-weight: 900;

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


.program-session-day {
    display: block;

    margin-top: 3px;

    color: #111111;

    font-size: 28px;
    font-weight: 900;

    line-height: 1;
}


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

@media (max-width: 1023px) {

    .program-session {
        grid-template-columns: 65px 1fr;
    }


    .program-session > div:nth-child(3),
    .program-session > div:nth-child(4) {
        grid-column: 2;
    }

}


@media (max-width: 767px) {

    .program-factor {
        min-height: 190px;
        padding: 21px;
    }


    .program-factor h3 {
        margin-top: 35px;
    }


    .program-card-content {
        min-height: auto;
    }


    .program-choice {
        grid-template-columns: 40px 1fr;
    }


    .program-development-pillar {
        min-height: 220px;
    }


    .program-session {
        gap: 18px;
    }

}




/* =========================================================
   PROGRAM DETAIL
========================================================= */


/* HERO META
--------------------------------------------------------- */

.program-hero-meta {
    display: inline-flex;
    align-items: center;
    gap: 9px;

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

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

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

.program-hero-meta i {
    color: #E50014;
    font-size: 11px;
}


/* RICH TEXT
--------------------------------------------------------- */

.program-rich-text p + p,
.program-dark-rich-text p + p {
    margin-top: 18px;
}


/* PROGRAM INFORMATION
--------------------------------------------------------- */

.program-info-row {
    display: flex;
    align-items: center;
    gap: 14px;
}

.program-info-row > i {
    width: 18px;

    color: #E50014;

    font-size: 12px;
    text-align: center;
}

.program-info-row > div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.program-info-row span {
    color: #9ca3af;

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

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

.program-info-row strong {
    color: #111111;

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


/* FOCUS CARDS
--------------------------------------------------------- */

.program-focus-card {
    min-height: 285px;

    padding: 28px;

    background: #ffffff;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
}

.program-focus-card:nth-child(3n + 1) {
    border-left: 1px solid #e5e7eb;
}

.program-focus-card:nth-child(-n + 3) {
    border-top: 1px solid #e5e7eb;
}


/* BENEFITS
--------------------------------------------------------- */

.program-benefit-row {
    display: grid;

    grid-template-columns: 55px 1fr;

    gap: 22px;

    padding: 27px 0;

    border-bottom: 1px solid #e5e7eb;
}

.program-benefit-icon {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #F7F7F7;

    color: #E50014;

    font-size: 13px;
}

.program-benefit-row h3 {
    color: #111111;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}

.program-benefit-row p {
    margin-top: 7px;

    max-width: 570px;

    color: #737373;

    font-size: 13px;
    font-weight: 500;

    line-height: 1.75;
}


/* HOW WE TRAIN
--------------------------------------------------------- */

.program-training-step {
    min-height: 115px;

    padding: 20px;

    border-right: 1px solid rgba(255,255,255,.10);
    border-bottom: 1px solid rgba(255,255,255,.10);
}

.program-training-step span {
    display: block;

    color: #E50014;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: .1em;
}

.program-training-step strong {
    display: block;

    margin-top: 30px;

    color: #ffffff;

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

    letter-spacing: .05em;
}


/* DEVELOPMENT SYSTEM
--------------------------------------------------------- */

.program-system-pillar {
    position: relative;

    min-height: 250px;

    padding: 26px 23px;

    background: #ffffff;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
}

.program-system-pillar > span {
    position: absolute;

    top: 23px;
    right: 23px;

    color: #d1d5db;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: .1em;
}

.program-system-pillar > i {
    color: #E50014;

    font-size: 18px;
}

.program-system-pillar h3 {
    margin-top: 58px;

    color: #111111;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -.025em;
}

.program-system-pillar p {
    margin-top: 10px;

    color: #737373;

    font-size: 12px;
    font-weight: 500;

    line-height: 1.7;
}

.program-system-pathway {
    background: #E50014;
}

.program-system-pathway > span {
    color: rgba(255,255,255,.40);
}

.program-system-pathway > i,
.program-system-pathway h3 {
    color: #ffffff;
}

.program-system-pathway p {
    color: rgba(255,255,255,.72);
}


/* PROGRAM SESSION
--------------------------------------------------------- */

.program-session {
    display: grid;

    grid-template-columns:
        80px
        minmax(0, 1.4fr)
        minmax(220px, 1fr)
        160px;

    gap: 30px;

    align-items: center;

    padding: 30px 0;

    border-bottom: 1px solid #e5e7eb;
}

.program-session-date span {
    display: block;

    color: #E50014;

    font-size: 9px;
    font-weight: 900;

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

.program-session-date strong {
    display: block;

    margin-top: 4px;

    color: #111111;

    font-size: 30px;
    font-weight: 900;

    line-height: 1;
}

.program-session-small-meta {
    color: #9ca3af;

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

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

.program-session-details {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.program-session-details p {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    color: #737373;

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

    line-height: 1.6;
}

.program-session-details i {
    width: 14px;

    padding-top: 2px;

    color: #E50014;

    text-align: center;
}

.program-session-action {
    text-align: right;
}

.program-session-price span {
    display: block;

    color: #9ca3af;

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

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

.program-session-price strong {
    display: block;

    margin-top: 3px;

    color: #111111;

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


/* FAQ
--------------------------------------------------------- */

.program-faq {
    border-bottom: 1px solid #e5e7eb;
}

.program-faq summary {
    min-height: 82px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    cursor: pointer;

    list-style: none;

    color: #111111;

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

    letter-spacing: -.015em;
}

.program-faq summary::-webkit-details-marker {
    display: none;
}

.program-faq summary i {
    color: #E50014;

    font-size: 11px;

    transition: transform .25s ease;
}

.program-faq[open] summary i {
    transform: rotate(45deg);
}

.program-faq-answer {
    max-width: 700px;

    padding: 0 50px 26px 0;

    color: #737373;

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

    line-height: 1.8;
}

.program-faq-answer p + p {
    margin-top: 15px;
}


/* RESPONSIVE
--------------------------------------------------------- */

@media (max-width: 1023px) {

    .program-focus-card:nth-child(3n + 1),
    .program-focus-card:nth-child(-n + 3) {
        border-left: 0;
        border-top: 0;
    }

    .program-focus-card:nth-child(2n + 1) {
        border-left: 1px solid #e5e7eb;
    }

    .program-focus-card:nth-child(-n + 2) {
        border-top: 1px solid #e5e7eb;
    }


    .program-session {
        grid-template-columns: 70px 1fr;
    }

    .program-session-details,
    .program-session-action {
        grid-column: 2;
    }

    .program-session-action {
        text-align: left;
    }

}


@media (max-width: 639px) {

    .program-focus-card {
        min-height: 240px;
    }

    .program-focus-card:nth-child(n) {
        border-left: 1px solid #e5e7eb;
        border-top: 0;
    }

    .program-focus-card:first-child {
        border-top: 1px solid #e5e7eb;
    }


    .program-benefit-row {
        grid-template-columns: 45px 1fr;

        gap: 16px;
    }


    .program-session {
        grid-template-columns: 55px 1fr;

        gap: 18px;
    }


    .program-faq summary {
        min-height: 76px;

        font-size: 14px;
    }

}




/* =========================================================
   LYGS ELITE TEAM PAGE
========================================================= */


/* ---------------------------------------------------------
   PRINCIPLES
--------------------------------------------------------- */

.team-principle {
    position: relative;

    padding: 32px 24px 34px 0;

    border-bottom: 1px solid #e5e7eb;
}

.team-principle-number {
    display: block;

    margin-bottom: 26px;

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

    letter-spacing: 0.18em;

    color: #9ca3af;
}

.team-principle > i {
    margin-bottom: 20px;

    font-size: 20px;

    color: #E50014;
}

.team-principle h3 {
    margin-bottom: 10px;

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

    color: #050505;
}

.team-principle p {
    max-width: 230px;

    font-size: 13px;
    line-height: 1.7;

    color: #737373;
}


@media (min-width: 640px) {

    .team-principle {
        padding-left: 22px;
        padding-right: 22px;
    }

}


@media (min-width: 1024px) {

    .team-principle {
        min-height: 260px;

        padding:
            32px
            22px;

        border-bottom: 0;
        border-right: 1px solid #e5e7eb;
    }

    .team-principle:first-child {
        padding-left: 0;
    }

    .team-principle:last-child {
        border-right: 0;
    }

}



/* ---------------------------------------------------------
   TEAM OPPORTUNITIES
--------------------------------------------------------- */

.team-opportunity {
    position: relative;

    min-height: 330px;

    padding: 36px;

    transition:
        background-color 0.3s ease,
        transform 0.3s ease;
}

.team-opportunity:hover {
    background: #151515;
}

.team-opportunity-icon {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    margin-bottom: 50px;

    background: #E50014;

    color: #ffffff;

    font-size: 16px;
}

.team-opportunity h3 {
    margin-bottom: 14px;

    font-size: 23px;
    font-weight: 900;

    letter-spacing: -0.025em;

    color: #ffffff;
}

.team-opportunity p {
    max-width: 390px;

    margin-bottom: 28px;

    font-size: 14px;
    line-height: 1.75;

    color: rgba(255, 255, 255, 0.6);
}

.team-opportunity a {
    display: inline-flex;

    align-items: center;

    gap: 10px;

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

    letter-spacing: 0.12em;

    text-transform: uppercase;

    color: #ffffff;

    transition: color 0.25s ease;
}

.team-opportunity a i {
    font-size: 10px;

    transition: transform 0.25s ease;
}

.team-opportunity a:hover {
    color: #E50014;
}

.team-opportunity a:hover i {
    transform: translateX(4px);
}



/* ---------------------------------------------------------
   INTEREST FORM
--------------------------------------------------------- */

.team-interest-form {
    padding: 32px;

    background: #F7F7F7;

    border-top: 4px solid #E50014;
}

.team-interest-form fieldset {
    padding: 0;
    margin: 0 0 34px;

    border: 0;
}

.team-interest-form legend {
    width: 100%;

    margin-bottom: 22px;
    padding-bottom: 12px;

    border-bottom: 1px solid #e5e7eb;

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

    letter-spacing: 0.12em;

    text-transform: uppercase;

    color: #050505;
}

.team-form-group {
    display: flex;

    flex-direction: column;

    gap: 8px;
}

.team-form-group + .team-form-group {
    margin-top: 20px;
}

.team-interest-form .grid .team-form-group + .team-form-group {
    margin-top: 0;
}

.team-form-group label {
    font-size: 12px;
    font-weight: 700;

    color: #27272a;
}

.team-form-group label span {
    color: #E50014;
}

.team-form-group input,
.team-form-group select,
.team-form-group textarea {
    width: 100%;

    border: 1px solid #d4d4d8;

    background: #ffffff;

    padding: 13px 14px;

    border-radius: 0;

    outline: none;

    font-family: inherit;

    font-size: 14px;

    color: #050505;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.team-form-group input,
.team-form-group select {
    min-height: 50px;
}

.team-form-group textarea {
    resize: vertical;

    min-height: 130px;
}

.team-form-group input:focus,
.team-form-group select:focus,
.team-form-group textarea:focus {
    border-color: #E50014;

    box-shadow:
        0 0 0 3px
        rgba(229, 0, 20, 0.08);
}

.team-form-group input::placeholder,
.team-form-group textarea::placeholder {
    color: #a1a1aa;
}


@media (min-width: 640px) {

    .team-interest-form {
        padding: 40px;
    }

}


@media (min-width: 1024px) {

    .team-interest-form {
        padding: 48px;
    }

}





/* =========================================================
   SPOTLIGHT
========================================================= */


/* ---------------------------------------------------------
   SECTION ANCHORS
--------------------------------------------------------- */

.spotlight-anchor {
    position: relative;

    padding-bottom: 5px;

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

    letter-spacing: 0.14em;
    text-transform: uppercase;

    color: rgba(255, 255, 255, 0.55);

    transition: color 0.25s ease;
}

.spotlight-anchor::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 0;
    height: 1px;

    background: #E50014;

    transition: width 0.25s ease;
}

.spotlight-anchor:hover {
    color: #ffffff;
}

.spotlight-anchor:hover::after {
    width: 100%;
}


/* ---------------------------------------------------------
   TYPOGRAPHY
--------------------------------------------------------- */

.spotlight-eyebrow {
    display: block;

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

    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #E50014;
}

.spotlight-section-title {
    margin-top: 14px;

    font-size: clamp(2.25rem, 5vw, 3.7rem);
    line-height: 0.98;

    font-weight: 900;

    letter-spacing: -0.04em;

    color: #050505;
}

.spotlight-section-title span {
    display: block;

    color: #E50014;
}

.spotlight-date {
    font-size: 11px;
    font-weight: 800;

    letter-spacing: 0.15em;
    text-transform: uppercase;

    color: #737373;
}


/* ---------------------------------------------------------
   RISING PLAYER
--------------------------------------------------------- */

.rising-player-card {
    position: relative;
}

.rising-player-card img {
    transition: transform 0.6s cubic-bezier(.22, 1, .36, 1);
}

.rising-player-card:hover img {
    transform: scale(1.035);
}

.spotlight-card-label {
    font-size: 10px;
    font-weight: 800;

    letter-spacing: 0.14em;
    text-transform: uppercase;

    color: #E50014;
}


/* ---------------------------------------------------------
   VALUES
--------------------------------------------------------- */

.spotlight-value {
    min-height: 110px;

    display: flex;

    align-items: center;

    padding: 22px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

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

    letter-spacing: 0.04em;
    text-transform: uppercase;

    color: #050505;

    transition:
        background-color 0.25s ease,
        color 0.25s ease;
}

.spotlight-value:hover {
    background: #050505;

    color: #ffffff;
}


/* ---------------------------------------------------------
   EMPTY STATE
--------------------------------------------------------- */

.spotlight-empty {
    min-height: 260px;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: center;

    text-align: center;

    padding: 40px;

    border: 1px solid #e5e7eb;

    background: #fafafa;
}

.spotlight-empty > i {
    margin-bottom: 18px;

    font-size: 24px;

    color: #E50014;
}

.spotlight-empty h3 {
    font-size: 18px;
    font-weight: 800;

    color: #050505;
}

.spotlight-empty p {
    margin-top: 8px;

    font-size: 13px;

    color: #737373;
}



/* =========================================================
   CAMPS & EVENTS
========================================================= */


/* ---------------------------------------------------------
   FILTER
--------------------------------------------------------- */

.event-filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    min-height: 38px;

    padding: 0 15px;

    border: 1px solid #e5e7eb;

    background: #ffffff;

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

    letter-spacing: 0.08em;
    text-transform: uppercase;

    color: #737373;

    transition:
        background-color 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease;
}

.event-filter span {
    display: inline-flex;

    min-width: 20px;
    height: 20px;

    align-items: center;
    justify-content: center;

    padding: 0 5px;

    background: #f3f4f6;

    font-size: 9px;

    color: #737373;
}

.event-filter:hover {
    border-color: #050505;

    color: #050505;
}

.event-filter.is-active {
    border-color: #050505;

    background: #050505;

    color: #ffffff;
}

.event-filter.is-active span {
    background: rgba(255, 255, 255, 0.12);

    color: #ffffff;
}


/* ---------------------------------------------------------
   SECTION TYPOGRAPHY
--------------------------------------------------------- */

.event-eyebrow {
    display: block;

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

    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #E50014;
}

.event-section-title {
    margin-top: 13px;

    font-size: clamp(2.25rem, 5vw, 3.7rem);
    line-height: 0.98;

    font-weight: 900;

    letter-spacing: -0.04em;

    color: #050505;
}

.event-section-title span {
    display: block;

    color: #E50014;
}


/* ---------------------------------------------------------
   EVENT TYPE
--------------------------------------------------------- */

.event-type-badge {
    display: inline-flex;
    align-items: center;

    min-height: 29px;

    padding: 0 11px;

    background: #E50014;

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

    letter-spacing: 0.12em;
    text-transform: uppercase;

    color: #ffffff;
}


/* ---------------------------------------------------------
   EVENT META
--------------------------------------------------------- */

.event-meta-row {
    display: flex;
    align-items: center;

    gap: 11px;

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

.event-meta-row > i {
    width: 16px;

    color: #E50014;
}

.event-meta-row-dark {
    color: rgba(255, 255, 255, 0.65);
}


/* ---------------------------------------------------------
   EVENT CARD
--------------------------------------------------------- */

.event-card-image {
    position: relative;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    background: #f3f4f6;
}

.event-card-image > img {
    transition:
        transform 0.65s cubic-bezier(.22, 1, .36, 1);
}

.event-card:hover .event-card-image > img {
    transform: scale(1.035);
}

.event-card-image .event-type-badge {
    position: absolute;

    left: 16px;
    top: 16px;
}


/* ---------------------------------------------------------
   DATE BLOCK
--------------------------------------------------------- */

.event-date-block {
    position: absolute;

    right: 16px;
    bottom: 16px;

    width: 58px;
    height: 65px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    background: #ffffff;

    color: #050505;
}

.event-date-month {
    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.12em;
    text-transform: uppercase;

    color: #E50014;
}

.event-date-day {
    margin-top: 1px;

    font-size: 23px;
    line-height: 1;

    font-weight: 900;

    letter-spacing: -0.04em;
}


/* ---------------------------------------------------------
   REGISTRATION STATUS
--------------------------------------------------------- */

.event-registration-status {
    display: inline-flex;
    align-items: center;

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

    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.event-status-open {
    color: #166534;
}

.event-status-coming_soon {
    color: #9a6700;
}

.event-status-full,
.event-status-closed {
    color: #737373;
}

.event-status-cancelled {
    color: #E50014;
}


/* ---------------------------------------------------------
   EVENT CATEGORY
--------------------------------------------------------- */

.event-category-card {
    min-height: 330px;

    display: flex;
    flex-direction: column;

    padding: 30px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;

    transition:
        background-color 0.3s ease,
        color 0.3s ease;
}

.event-category-icon {
    width: 44px;
    height: 44px;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #050505;

    font-size: 15px;

    color: #ffffff;

    transition:
        background-color 0.3s ease;
}

.event-category-card h3 {
    margin-top: 26px;

    font-size: 21px;
    font-weight: 900;

    letter-spacing: -0.025em;

    color: #050505;
}

.event-category-card p {
    margin-top: 13px;

    font-size: 13px;
    line-height: 1.75;

    color: #737373;
}

.event-category-card > a {
    display: inline-flex;

    align-items: center;
    gap: 9px;

    margin-top: auto;
    padding-top: 26px;

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

    letter-spacing: 0.12em;
    text-transform: uppercase;

    color: #050505;
}

.event-category-card:hover {
    background: #050505;
}

.event-category-card:hover .event-category-icon {
    background: #E50014;
}

.event-category-card:hover h3,
.event-category-card:hover > a {
    color: #ffffff;
}

.event-category-card:hover p {
    color: rgba(255, 255, 255, 0.6);
}


/* ---------------------------------------------------------
   EMPTY STATE
--------------------------------------------------------- */

.event-empty-state {
    min-height: 320px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    padding: 40px 20px;

    border: 1px solid #e5e7eb;

    text-align: center;

    background: #fafafa;
}

.event-empty-icon {
    width: 52px;
    height: 52px;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #050505;

    color: #ffffff;
}

.event-empty-state h3 {
    margin-top: 20px;

    font-size: 20px;
    font-weight: 900;

    color: #050505;
}

.event-empty-state p {
    max-width: 480px;

    margin-top: 9px;

    font-size: 13px;
    line-height: 1.7;

    color: #737373;
}

.event-empty-link {
    display: inline-flex;

    align-items: center;
    gap: 9px;

    margin-top: 23px;

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

    letter-spacing: 0.12em;
    text-transform: uppercase;

    color: #E50014;
}



/* =========================================================
   BASKETBALL CAMPS
========================================================= */

.camp-eyebrow {
    display: block;

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

    letter-spacing: 0.2em;
    text-transform: uppercase;

    color: #E50014;
}


.camp-section-title {
    margin-top: 13px;

    font-size: clamp(2.25rem, 5vw, 3.7rem);
    line-height: 0.98;

    font-weight: 900;

    letter-spacing: -0.045em;

    color: #050505;
}

.camp-section-title span {
    display: block;

    color: #E50014;
}


/* =========================================================
   DEVELOPMENT
========================================================= */

.camp-development-card {
    position: relative;

    min-height: 320px;

    display: flex;
    flex-direction: column;

    padding: 27px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;

    transition:
        background-color 0.3s ease,
        color 0.3s ease;
}

.camp-development-number {
    font-size: 9px;
    font-weight: 800;

    letter-spacing: 0.12em;

    color: #a3a3a3;
}

.camp-development-card > i {
    margin-top: 45px;

    font-size: 22px;

    color: #E50014;
}

.camp-development-card h3 {
    margin-top: 22px;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -0.025em;

    color: #050505;
}

.camp-development-card p {
    margin-top: 10px;

    font-size: 12px;
    line-height: 1.7;

    color: #737373;
}

.camp-development-card:hover {
    background: #050505;
}

.camp-development-card:hover h3 {
    color: #ffffff;
}

.camp-development-card:hover p {
    color: rgba(255, 255, 255, 0.55);
}


/* =========================================================
   BADGE
========================================================= */

.camp-badge {
    display: inline-flex;
    align-items: center;

    min-height: 29px;

    padding: 0 11px;

    background: #E50014;

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

    letter-spacing: 0.12em;
    text-transform: uppercase;

    color: #ffffff;
}


/* =========================================================
   META
========================================================= */

.camp-meta-row {
    display: flex;
    align-items: center;

    gap: 11px;

    font-size: 12px;
    font-weight: 600;

    color: rgba(255, 255, 255, 0.65);
}

.camp-meta-row > i {
    width: 16px;

    color: #E50014;
}


/* =========================================================
   CAMP CARD
========================================================= */

.camp-card-image {
    position: relative;

    display: block;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    background: #f3f4f6;
}

.camp-card-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

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

.camp-card:hover .camp-card-image img {
    transform: scale(1.035);
}

.camp-card-image .camp-badge {
    position: absolute;

    left: 16px;
    top: 16px;
}


/* =========================================================
   DATE
========================================================= */

.camp-date {
    position: absolute;

    right: 16px;
    bottom: 16px;

    width: 58px;
    height: 65px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    background: #ffffff;

    color: #050505;
}

.camp-date span {
    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.12em;
    text-transform: uppercase;

    color: #E50014;
}

.camp-date strong {
    margin-top: 1px;

    font-size: 23px;
    line-height: 1;

    font-weight: 900;

    letter-spacing: -0.04em;
}


/* =========================================================
   STATUS
========================================================= */

.camp-status {
    font-size: 9px;
    font-weight: 800;

    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.camp-status-open {
    color: #166534;
}

.camp-status-coming_soon {
    color: #9a6700;
}

.camp-status-full,
.camp-status-closed {
    color: #737373;
}

.camp-status-cancelled {
    color: #E50014;
}


/* =========================================================
   AUDIENCE
========================================================= */

.camp-audience-card {
    min-height: 230px;

    padding: 28px;

    background: #ffffff;
}

.camp-audience-card > span {
    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.12em;

    color: #E50014;
}

.camp-audience-card h3 {
    margin-top: 36px;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -0.025em;

    color: #050505;
}

.camp-audience-card p {
    margin-top: 10px;

    font-size: 12px;
    line-height: 1.75;

    color: #737373;
}


/* =========================================================
   EMPTY
========================================================= */

.camp-empty {
    min-height: 320px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    padding: 40px 20px;

    border: 1px solid #e5e7eb;

    background: #fafafa;

    text-align: center;
}

.camp-empty > div {
    width: 52px;
    height: 52px;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #050505;

    color: #ffffff;
}

.camp-empty h3 {
    margin-top: 20px;

    font-size: 20px;
    font-weight: 900;

    color: #050505;
}

.camp-empty p {
    max-width: 480px;

    margin-top: 9px;

    font-size: 13px;
    line-height: 1.7;

    color: #737373;
}

.camp-empty > a {
    display: inline-flex;

    align-items: center;
    gap: 9px;

    margin-top: 23px;

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

    letter-spacing: 0.12em;
    text-transform: uppercase;

    color: #E50014;
}



/* =========================================================
   BASKETBALL CLINICS
========================================================= */

.clinic-principle {
    position: relative;

    min-height: 310px;

    display: flex;
    flex-direction: column;

    padding: 28px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;

    transition: background-color 0.3s ease;
}

.clinic-principle > span {
    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.12em;

    color: #a3a3a3;
}

.clinic-principle > i {
    margin-top: 45px;

    font-size: 20px;

    color: #E50014;
}

.clinic-principle h3 {
    margin-top: 22px;

    font-size: 19px;
    font-weight: 900;

    letter-spacing: -0.025em;

    color: #050505;
}

.clinic-principle p {
    margin-top: 10px;

    font-size: 12px;
    line-height: 1.75;

    color: #737373;
}

.clinic-principle:hover {
    background: #050505;
}

.clinic-principle:hover h3 {
    color: #ffffff;
}

.clinic-principle:hover p {
    color: rgba(255, 255, 255, 0.58);
}


/* =========================================================
   BASKETBALL TRYOUTS
========================================================= */

.tryout-standard {
    min-height: 320px;

    display: flex;
    flex-direction: column;

    padding: 27px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;

    transition: background-color 0.3s ease;
}

.tryout-standard > span {
    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.12em;

    color: #a3a3a3;
}

.tryout-standard > i {
    margin-top: 44px;

    font-size: 20px;

    color: #E50014;
}

.tryout-standard h3 {
    margin-top: 22px;

    font-size: 18px;
    font-weight: 900;

    letter-spacing: -0.025em;

    color: #050505;
}

.tryout-standard p {
    margin-top: 10px;

    font-size: 12px;
    line-height: 1.7;

    color: #737373;
}

.tryout-standard:hover {
    background: #050505;
}

.tryout-standard:hover h3 {
    color: #ffffff;
}

.tryout-standard:hover p {
    color: rgba(255, 255, 255, 0.58);
}


/* ---------------------------------------------------------
   TRYOUT PREPARATION
--------------------------------------------------------- */

.tryout-prep {
    display: grid;

    grid-template-columns: 42px 1fr;

    gap: 20px;

    padding: 25px 0;
}

.tryout-prep > span {
    padding-top: 3px;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.12em;

    color: #E50014;
}

.tryout-prep h3 {
    font-size: 17px;
    font-weight: 900;

    letter-spacing: -0.02em;

    color: #050505;
}

.tryout-prep p {
    max-width: 600px;

    margin-top: 7px;

    font-size: 13px;
    line-height: 1.75;

    color: #737373;
}

.upcoming-category {
    min-height: 145px;

    display: grid;
    grid-template-columns: auto 1fr auto;

    align-items: center;
    gap: 18px;

    padding: 28px;

    background: #ffffff;

    transition:
        background-color 0.3s ease,
        color 0.3s ease;
}

.upcoming-category > i:first-child {
    font-size: 18px;
    color: #E50014;
}

.upcoming-category span {
    font-size: 14px;
    font-weight: 900;

    letter-spacing: -0.02em;

    color: #050505;
}

.upcoming-category > i:last-child {
    font-size: 11px;
    color: #050505;
}

.upcoming-category:hover {
    background: #050505;
}

.upcoming-category:hover span,
.upcoming-category:hover > i:last-child {
    color: #ffffff;
}



/* =========================================================
   UPCOMING BASKETBALL EVENTS
========================================================= */


/* ---------------------------------------------------------
   VIEW SWITCH
--------------------------------------------------------- */

.events-view-switch {
    min-height: 36px;

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

    gap: 7px;

    padding: 0 13px;

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

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #737373;

    transition:
        background-color 0.25s ease,
        color 0.25s ease;
}

.events-view-switch:hover {
    color: #050505;
}

.events-view-switch.is-active {
    background: #050505;

    color: #ffffff;
}


/* ---------------------------------------------------------
   EVENT FILTER
--------------------------------------------------------- */

.event-filter {
    min-height: 36px;

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

    padding: 0 14px;

    border: 1px solid #e5e7eb;

    background: #ffffff;

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

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #737373;

    transition:
        border-color 0.25s ease,
        background-color 0.25s ease,
        color 0.25s ease;
}

.event-filter:hover {
    border-color: #050505;

    color: #050505;
}

.event-filter.is-active {
    border-color: #050505;

    background: #050505;

    color: #ffffff;
}


/* =========================================================
   CALENDAR CONTROLS
========================================================= */

.calendar-control {
    width: 40px;
    height: 40px;

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

    flex-shrink: 0;

    border: 1px solid #dedede;

    background: #ffffff;

    font-size: 10px;

    color: #050505;

    transition:
        background-color 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease;
}

.calendar-control:hover {
    border-color: #050505;

    background: #050505;

    color: #ffffff;
}


.calendar-today-button {
    min-height: 40px;

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

    padding: 0 16px;

    border: 1px solid #dedede;

    background: #ffffff;

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

    letter-spacing: 0.11em;
    text-transform: uppercase;

    color: #050505;

    transition:
        background-color 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease;
}

.calendar-today-button:hover {
    border-color: #E50014;

    background: #E50014;

    color: #ffffff;
}


/* =========================================================
   CALENDAR WEEK
========================================================= */

.calendar-weekday {
    padding: 14px 8px;

    border-right: 1px solid rgba(255, 255, 255, 0.1);

    text-align: center;

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

    letter-spacing: 0.12em;
    text-transform: uppercase;

    color: rgba(255, 255, 255, 0.65);
}

.calendar-weekday:last-child {
    border-right: 0;
}


/* =========================================================
   CALENDAR DAY
========================================================= */

.calendar-day {
    position: relative;

    min-height: 155px;

    padding: 12px;

    border-right: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    background: #ffffff;
}

.calendar-day:nth-child(7n) {
    border-right: 0;
}


.calendar-day-muted {
    background: #fafafa;
}

.calendar-day-muted .calendar-day-number {
    color: #c5c5c5;
}


.calendar-day-today {
    box-shadow:
        inset 0 3px 0 #E50014;
}


.calendar-day-number {
    font-size: 11px;
    font-weight: 800;

    color: #050505;
}


.calendar-today-label {
    font-size: 7px;
    font-weight: 900;

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #E50014;
}


/* =========================================================
   EVENT INSIDE CALENDAR
========================================================= */

.calendar-event {
    position: relative;

    display: block;

    padding: 7px 8px 7px 11px;

    overflow: hidden;

    background: #f5f5f5;

    transition:
        background-color 0.2s ease;
}

.calendar-event::before {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;
    left: 0;

    width: 3px;

    background: #050505;
}


.calendar-event > span {
    display: block;

    font-size: 7px;
    font-weight: 700;

    color: #8b8b8b;
}


.calendar-event > strong {
    display: block;

    margin-top: 2px;

    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;

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

    color: #050505;
}


.calendar-event:hover {
    background: #ebebeb;
}


/* EVENT TYPES */

.calendar-event-camp::before {
    background: #E50014;
}

.calendar-event-clinic::before {
    background: #F36B21;
}

.calendar-event-tryout::before {
    background: #050505;
}


/* =========================================================
   CALENDAR LEGEND
========================================================= */

.calendar-legend {
    display: inline-flex;
    align-items: center;

    gap: 7px;

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

    letter-spacing: 0.08em;
    text-transform: uppercase;

    color: #737373;
}


.calendar-legend > span {
    width: 8px;
    height: 8px;

    display: inline-block;
}


.calendar-legend-camp {
    background: #E50014;
}

.calendar-legend-clinic {
    background: #F36B21;
}

.calendar-legend-tryout {
    background: #050505;
}


/* =========================================================
   EVENT DISCOVERY
========================================================= */

.event-discovery-card {
    position: relative;

    min-height: 290px;

    display: flex;
    flex-direction: column;

    padding: 30px;

    background: #ffffff;

    transition:
        background-color 0.3s ease,
        color 0.3s ease;
}


.event-discovery-icon {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #050505;

    font-size: 15px;

    color: #ffffff;

    transition:
        background-color 0.3s ease;
}


.event-discovery-card > div:nth-child(2) {
    margin-top: auto;
}


.event-discovery-card > div:nth-child(2) > span {
    display: block;

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

    letter-spacing: 0.13em;
    text-transform: uppercase;

    color: #E50014;
}


.event-discovery-card h3 {
    margin-top: 6px;

    font-size: 20px;
    font-weight: 900;

    letter-spacing: -0.03em;

    color: #050505;
}


.event-discovery-card p {
    max-width: 310px;

    margin-top: 9px;

    font-size: 12px;
    line-height: 1.7;

    color: #737373;
}


.event-discovery-arrow {
    position: absolute;

    top: 31px;
    right: 30px;

    font-size: 11px;

    color: #050505;

    transition:
        transform 0.3s ease,
        color 0.3s ease;
}


.event-discovery-card:hover {
    background: #050505;
}


.event-discovery-card:hover .event-discovery-icon {
    background: #E50014;
}


.event-discovery-card:hover h3 {
    color: #ffffff;
}


.event-discovery-card:hover p {
    color: rgba(255, 255, 255, 0.58);
}


.event-discovery-card:hover .event-discovery-arrow {
    transform: translateX(4px);

    color: #ffffff;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .event-discovery-card {
        min-height: 240px;
    }

}


/* =========================================================
   RESOURCES
========================================================= */

.resource-eyebrow {
    display: block;

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

    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #E50014;
}


.resource-section-title {
    margin-top: 10px;

    font-size: clamp(2rem, 4vw, 3.5rem);

    line-height: 0.98;

    font-weight: 900;

    letter-spacing: -0.045em;

    color: #050505;
}


.resource-section-title span {
    display: block;

    color: #E50014;
}


.resource-body {
    font-size: 14px;

    line-height: 1.8;

    color: #666666;
}



/* =========================================================
   RESOURCE CARDS
========================================================= */

.resource-card {
    position: relative;

    min-height: 350px;

    display: flex;
    flex-direction: column;

    padding: 30px;

    background: #ffffff;

    overflow: hidden;

    transition:
        background-color 0.3s ease,
        color 0.3s ease;
}


.resource-card-number {
    position: absolute;

    top: 24px;
    right: 28px;

    font-size: 10px;
    font-weight: 900;

    letter-spacing: 0.12em;

    color: #c9c9c9;
}


.resource-card-icon {
    width: 44px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #050505;

    color: #ffffff;

    transition: background-color 0.3s ease;
}


.resource-card-label {
    display: block;

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

    letter-spacing: 0.14em;
    text-transform: uppercase;

    color: #E50014;
}


.resource-card h3 {
    margin-top: 7px;

    font-size: 23px;
    font-weight: 900;

    letter-spacing: -0.035em;

    color: #050505;
}


.resource-card p {
    max-width: 320px;

    margin-top: 10px;

    font-size: 12px;
    line-height: 1.7;

    color: #737373;
}


.resource-card-arrow {
    position: absolute;

    right: 30px;
    bottom: 31px;

    font-size: 11px;

    color: #050505;

    transition:
        transform 0.3s ease,
        color 0.3s ease;
}


.resource-card:hover {
    background: #050505;
}


.resource-card:hover .resource-card-icon {
    background: #E50014;
}


.resource-card:hover h3,
.resource-card:hover .resource-card-arrow {
    color: #ffffff;
}


.resource-card:hover p {
    color: rgba(255, 255, 255, 0.6);
}


.resource-card:hover .resource-card-arrow {
    transform: translateX(4px);
}



/* =========================================================
   PARENT DEVELOPMENT
========================================================= */

.parent-development-card {
    position: relative;

    min-height: 290px;

    padding: 26px;

    background: #ffffff;
}


.parent-development-card > span {
    display: block;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.12em;

    color: #b5b5b5;
}


.parent-development-card > i {
    display: block;

    margin-top: 45px;

    font-size: 20px;

    color: #E50014;
}


.parent-development-card h3 {
    margin-top: 18px;

    font-size: 20px;
    font-weight: 900;

    color: #050505;
}


.parent-development-card p {
    margin-top: 8px;

    font-size: 11px;
    line-height: 1.7;

    color: #737373;
}



/* =========================================================
   PARENT QUESTIONS
========================================================= */

.parent-question {
    display: grid;

    grid-template-columns: 45px 1fr;

    gap: 18px;

    padding: 23px 0;

    border-bottom: 1px solid #e5e7eb;
}


.parent-question span {
    padding-top: 2px;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.1em;

    color: #E50014;
}


.parent-question p {
    font-size: 15px;
    font-weight: 700;

    line-height: 1.55;

    color: #171717;
}



/* =========================================================
   PARENT HELP
========================================================= */

.parent-help-card {
    min-height: 220px;

    padding: 28px;

    background: #111111;
}


.parent-help-card i {
    font-size: 18px;

    color: #E50014;
}


.parent-help-card h3 {
    margin-top: 32px;

    font-size: 18px;
    font-weight: 900;

    color: #ffffff;
}


.parent-help-card p {
    margin-top: 8px;

    max-width: 280px;

    font-size: 11px;
    line-height: 1.7;

    color: rgba(255, 255, 255, 0.55);
}



/* =========================================================
   PARENT FORM
========================================================= */

.parent-form-label {
    display: block;

    margin-bottom: 8px;

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

    letter-spacing: 0.09em;
    text-transform: uppercase;

    color: #404040;
}


.parent-form-label span {
    color: #E50014;
}


.parent-form-input {
    width: 100%;

    min-height: 48px;

    padding: 0 14px;

    border: 1px solid #dedede;

    border-radius: 0;

    background: #ffffff;

    font-size: 13px;

    color: #050505;

    outline: none;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


textarea.parent-form-input {
    min-height: 145px;

    padding-top: 13px;
    padding-bottom: 13px;
}


.parent-form-input:focus {
    border-color: #050505;

    box-shadow:
        inset 3px 0 0 #E50014;
}



/* =========================================================
   NEXT RESOURCE
========================================================= */

.parent-next-card {
    min-height: 210px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    padding: 30px;

    background: #ffffff;

    transition:
        background-color 0.3s ease,
        color 0.3s ease;
}


.parent-next-card span {
    font-size: 9px;
    font-weight: 800;

    letter-spacing: 0.14em;
    text-transform: uppercase;

    color: #E50014;
}


.parent-next-card h2 {
    margin-top: 6px;

    font-size: 22px;
    font-weight: 900;

    letter-spacing: -0.03em;

    color: #050505;
}


.parent-next-card p {
    max-width: 380px;

    margin-top: 8px;

    font-size: 12px;
    line-height: 1.7;

    color: #737373;
}


.parent-next-card > i {
    font-size: 12px;

    color: #050505;

    transition: transform 0.3s ease;
}


.parent-next-card:hover {
    background: #050505;
}


.parent-next-card:hover h2,
.parent-next-card:hover > i {
    color: #ffffff;
}


.parent-next-card:hover p {
    color: rgba(255, 255, 255, 0.6);
}


.parent-next-card:hover > i {
    transform: translateX(5px);
}



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

@media (max-width: 767px) {

    .resource-card {
        min-height: 290px;
    }

    .parent-development-card {
        min-height: 240px;
    }

    .parent-help-card {
        min-height: 190px;
    }

}


/* =========================================================
   FAQS
========================================================= */

.faq-category-link {
    display: inline-flex;
    align-items: center;

    min-height: 40px;

    padding: 0 17px;

    border: 1px solid #dedede;

    background: #ffffff;

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

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #303030;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease;
}

.faq-category-link:hover {
    border-color: #050505;
    background: #050505;
    color: #ffffff;
}


.faq-section {
    padding-top: 72px;
    padding-bottom: 72px;
}

.faq-layout {
    display: grid;

    grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);

    gap: 70px;
}


.faq-heading > span {
    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.14em;

    color: #E50014;
}

.faq-heading h2 {
    margin-top: 14px;

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

    line-height: 1;

    font-weight: 900;

    letter-spacing: -0.04em;

    color: #050505;
}

.faq-heading h2 strong {
    display: block;

    color: #E50014;
}

.faq-heading p {
    max-width: 300px;

    margin-top: 17px;

    font-size: 12px;
    line-height: 1.7;

    color: #737373;
}


.faq-list {
    border-top: 1px solid #d9d9d9;
}


.faq-item {
    border-bottom: 1px solid #d9d9d9;
}


.faq-item summary {
    position: relative;

    min-height: 78px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    padding: 20px 4px;

    cursor: pointer;

    list-style: none;

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

    line-height: 1.5;

    color: #111111;
}

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


.faq-item summary i {
    width: 30px;
    height: 30px;

    flex-shrink: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #050505;

    font-size: 9px;

    color: #ffffff;

    transition:
        transform 0.25s ease,
        background-color 0.25s ease;
}


.faq-item[open] summary i {
    transform: rotate(45deg);

    background: #E50014;
}


.faq-answer {
    padding:
        0
        55px
        25px
        4px;
}


.faq-answer p {
    max-width: 680px;

    font-size: 13px;
    line-height: 1.8;

    color: #666666;
}


.faq-answer a {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-top: 15px;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #E50014;
}

.faq-answer a i {
    font-size: 8px;

    transition: transform 0.2s ease;
}

.faq-answer a:hover i {
    transform: translateX(4px);
}


@media (max-width: 1023px) {

    .faq-layout {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .faq-heading p {
        max-width: 600px;
    }

}


@media (max-width: 639px) {

    .faq-section {
        padding-top: 55px;
        padding-bottom: 55px;
    }

    .faq-item summary {
        min-height: 70px;

        font-size: 13px;
    }

    .faq-answer {
        padding-right: 15px;
    }

}


/* =========================================================
   NEWS & INSIGHTS
========================================================= */

.news-topic-scroll {
    scrollbar-width: none;
}

.news-topic-scroll::-webkit-scrollbar {
    display: none;
}


.news-topic-link {
    flex-shrink: 0;

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

    min-height: 36px;

    padding: 0 15px;

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

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #737373;

    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

.news-topic-link:hover {
    color: #050505;
}

.news-topic-link.is-active {
    background: #050505;

    color: #ffffff;
}


/* CARD */

.news-card-image {
    position: relative;

    display: block;

    aspect-ratio: 16 / 10;

    overflow: hidden;

    background: #e9e9e9;
}


.news-card-category {
    position: absolute;

    left: 14px;
    bottom: 14px;

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

    min-height: 27px;

    padding: 0 10px;

    background: #E50014;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #ffffff;
}


.news-card-date {
    display: block;

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

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #999999;
}


.news-card-title {
    margin-top: 8px;

    font-size: 20px;
    font-weight: 900;

    line-height: 1.25;

    letter-spacing: -0.025em;

    color: #111111;
}


.news-card-title a {
    transition: color 0.2s ease;
}

.news-card-title a:hover {
    color: #E50014;
}


.news-card-excerpt {
    margin-top: 10px;

    font-size: 12px;
    line-height: 1.75;

    color: #737373;
}


.news-card-link {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-top: 18px;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: 0.11em;
    text-transform: uppercase;

    color: #050505;
}


.news-card-link i {
    font-size: 8px;

    transition: transform 0.2s ease;
}


.news-card-link:hover {
    color: #E50014;
}

.news-card-link:hover i {
    transform: translateX(4px);
}


/* PAGINATION */

.news-pagination-link {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #111111;

    transition: color 0.2s ease;
}

.news-pagination-link:hover {
    color: #E50014;
}


/* RESOURCE BRIDGE */

.news-resource-bridge {
    min-height: 320px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;

    padding: 32px;

    background: #ffffff;

    transition:
        background-color 0.3s ease,
        color 0.3s ease;
}


.news-resource-icon {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 55px;

    background: #050505;

    font-size: 13px;

    color: #ffffff;

    transition: background-color 0.3s ease;
}


.news-resource-bridge span {
    display: block;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: 0.14em;
    text-transform: uppercase;

    color: #E50014;
}


.news-resource-bridge h2 {
    margin-top: 6px;

    font-size: 25px;
    font-weight: 900;

    letter-spacing: -0.035em;

    color: #050505;
}


.news-resource-bridge p {
    max-width: 390px;

    margin-top: 9px;

    font-size: 12px;
    line-height: 1.7;

    color: #737373;
}


.news-resource-bridge > i {
    margin-bottom: 5px;

    font-size: 11px;

    color: #050505;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.news-resource-bridge:hover {
    background: #050505;
}


.news-resource-bridge:hover .news-resource-icon {
    background: #E50014;
}


.news-resource-bridge:hover h2,
.news-resource-bridge:hover > i {
    color: #ffffff;
}


.news-resource-bridge:hover p {
    color: rgba(255, 255, 255, 0.55);
}


.news-resource-bridge:hover > i {
    transform: translateX(5px);
}



/* =========================================================
   LYGS SHOP
========================================================= */

.shop-eyebrow {
    display: block;

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

    letter-spacing: 0.18em;
    text-transform: uppercase;

    color: #E50014;
}


.shop-section-title {
    margin-top: 10px;

    max-width: 850px;

    font-size: clamp(2.1rem, 4.2vw, 3.7rem);

    line-height: 0.96;

    font-weight: 900;

    letter-spacing: -0.05em;

    color: #050505;
}


.shop-section-title span {
    display: block;

    color: #E50014;
}


.shop-body {
    font-size: 14px;

    line-height: 1.8;

    color: #666666;
}



/* =========================================================
   CATEGORY PREVIEWS
========================================================= */

.shop-category-card {
    position: relative;

    min-height: 570px;

    background: #050505;

    overflow: hidden;
}


.shop-category-image {
    position: absolute;

    inset: 0;

    overflow: hidden;
}


.shop-category-image img {
    transition: transform 0.7s ease;
}


.shop-category-card:hover .shop-category-image img {
    transform: scale(1.035);
}


.shop-category-content {
    position: absolute;

    inset:
        auto
        0
        0
        0;

    z-index: 2;

    padding: 30px;
}


.shop-category-number {
    position: absolute;

    right: 30px;
    bottom: 32px;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.12em;

    color: rgba(255, 255, 255, 0.35);
}


.shop-category-label {
    display: block;

    font-size: 9px;
    font-weight: 900;

    letter-spacing: 0.15em;
    text-transform: uppercase;

    color: #E50014;
}


.shop-category-content h3 {
    margin-top: 7px;

    font-size: 28px;
    font-weight: 900;

    letter-spacing: -0.04em;

    color: #ffffff;
}


.shop-category-content p {
    max-width: 270px;

    margin-top: 8px;

    font-size: 11px;
    line-height: 1.7;

    color: rgba(255, 255, 255, 0.58);
}



/* =========================================================
   FORM
========================================================= */

.shop-form-label {
    display: block;

    margin-bottom: 8px;

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

    letter-spacing: 0.1em;
    text-transform: uppercase;

    color: #404040;
}


.shop-form-label span {
    color: #E50014;
}


.shop-form-input {
    width: 100%;

    min-height: 50px;

    padding: 0 15px;

    border: 1px solid #dddddd;

    border-radius: 0;

    background: #ffffff;

    font-size: 13px;

    color: #050505;

    outline: none;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


.shop-form-input::placeholder {
    color: #aaaaaa;
}


.shop-form-input:focus {
    border-color: #050505;

    box-shadow:
        inset 3px 0 0 #E50014;
}



/* =========================================================
   ECOSYSTEM CARDS
========================================================= */

.shop-ecosystem-card {
    position: relative;

    min-height: 300px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 25px;

    padding: 30px;

    background: #ffffff;

    transition:
        background-color 0.3s ease,
        color 0.3s ease;
}


.shop-ecosystem-icon {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 55px;

    background: #050505;

    font-size: 13px;

    color: #ffffff;

    transition: background-color 0.3s ease;
}


.shop-ecosystem-card span {
    display: block;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: 0.15em;
    text-transform: uppercase;

    color: #E50014;
}


.shop-ecosystem-card h3 {
    margin-top: 6px;

    font-size: 22px;
    font-weight: 900;

    letter-spacing: -0.035em;

    color: #050505;

    transition: color 0.3s ease;
}


.shop-ecosystem-card p {
    max-width: 290px;

    margin-top: 9px;

    font-size: 11px;
    line-height: 1.7;

    color: #737373;

    transition: color 0.3s ease;
}


.shop-ecosystem-card > i {
    margin-bottom: 5px;

    flex-shrink: 0;

    font-size: 10px;

    color: #050505;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.shop-ecosystem-card:hover {
    background: #050505;
}


.shop-ecosystem-card:hover .shop-ecosystem-icon {
    background: #E50014;
}


.shop-ecosystem-card:hover h3,
.shop-ecosystem-card:hover > i {
    color: #ffffff;
}


.shop-ecosystem-card:hover p {
    color: rgba(255, 255, 255, 0.55);
}


.shop-ecosystem-card:hover > i {
    transform: translateX(5px);
}



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

@media (max-width: 1023px) {

    .shop-category-card {
        min-height: 500px;
    }

}


@media (max-width: 767px) {

    .shop-category-card {
        min-height: 460px;
    }

    .shop-category-content {
        padding: 25px;
    }

    .shop-category-number {
        right: 25px;
        bottom: 27px;
    }

    .shop-ecosystem-card {
        min-height: 260px;
    }

}










































































/* =========================================================
   LYGS FOOTER
========================================================= */

.footer-heading {
    margin: 0;

    color: #ffffff;

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

    letter-spacing: 0.06em;
    text-transform: uppercase;
}


/* =========================================================
   FOOTER LINKS
========================================================= */

.footer-links {
    margin-top: 20px;

    display: flex;
    flex-direction: column;

    gap: 13px;
}


.footer-links a {
    width: fit-content;

    color: rgba(255, 255, 255, 0.48);

    font-size: 13px;
    font-weight: 500;

    line-height: 1.5;

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}


.footer-links a:hover {
    color: #ffffff;

    transform: translateX(3px);
}


/* =========================================================
   SOCIAL LINKS
========================================================= */

.footer-social-link {
    width: 42px;
    height: 42px;

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

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

    color: rgba(255, 255, 255, 0.7);

    font-size: 14px;

    transition:
        background 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease;
}


.footer-social-link:hover {
    background: #E50014;

    border-color: #E50014;

    color: #ffffff;

    transform: translateY(-2px);
}


/* =========================================================
   LEGAL LINKS
========================================================= */

.footer-legal-link {
    color: rgba(255, 255, 255, 0.35);

    font-size: 10px;
    font-weight: 600;

    transition: color 0.2s ease;
}


.footer-legal-link:hover {
    color: #ffffff;
}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.footer-links a:focus-visible,
.footer-social-link:focus-visible,
.footer-legal-link:focus-visible {

    outline: 2px solid #E50014;
    outline-offset: 4px;

}