/* =========================================================
   MEDIA FILE ORDER REFERENCE

   index.html    : video1.mp4, image2.jpg, image3.jpg
   about.html    : image4.jpg, image5.jpg, image6.jpg, image7.jpg
   programs.html : image8.jpg, image9.jpg, image10.jpg, image11.jpg
   contact.html  : image12.jpg

   The inquiry form and owner dashboard do not add images.
   ========================================================= */


/* =========================================================
   ROOT
   ========================================================= */

:root {
    --background: #050505;
    --background-soft: #090a0b;
    --surface: #101113;
    --surface-light: #151618;
    --text: #f7f5f0;
    --text-soft: #b3b3af;
    --text-muted: #7e8083;
    --accent: #ff9d00;
    --line: #292a2d;
    --line-soft: rgba(255, 255, 255, 0.08);
    --white: #ffffff;
    --black: #000000;
    --success: #7ee2a8;
    --danger: #ff7a7a;

    --heading-font: "Archivo Black", Arial, sans-serif;
    --body-font: "Inter", Arial, sans-serif;

    --container-width: 1180px;
    --header-height: 78px;
    --transition: 220ms ease;
}


/* =========================================================
   RESET
   ========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top:
        calc(
            var(--header-height) + 28px
        );
}

body {
    margin: 0;
    min-width: 320px;
    overflow-x: hidden;

    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(255, 157, 0, 0.045),
            transparent 28rem
        ),
        var(--background);

    color: var(--text);

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

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

    -webkit-font-smoothing:
        antialiased;
}

body.menu-open {
    overflow: hidden;
}

img,
video {
    display: block;
    width: 100%;
    max-width: 100%;
}

img.is-missing {
    opacity: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
textarea,
select {
    color: inherit;
    font: inherit;
}

button,
input,
textarea {
    border-radius: 0;
}

button {
    cursor: pointer;
}

h1,
h2,
h3,
p,
figure,
blockquote,
dl,
dd {
    margin-top: 0;
}

h1,
h2,
h3 {
    overflow: visible;
    text-wrap: balance;
}

p {
    color:
        var(--text-soft);
}

address {
    font-style: normal;
}

::selection {
    background:
        var(--accent);

    color:
        var(--black);
}

[hidden] {
    display: none !important;
}


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

.skip-link {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 9999;

    padding:
        10px 15px;

    background:
        var(--accent);

    color:
        var(--black);

    font-weight: 800;

    transform:
        translateY(-150%);

    transition:
        transform var(--transition);
}

.skip-link:focus {
    transform:
        translateY(0);
}


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

.container {
    width:
        min(
            calc(100% - 40px),
            var(--container-width)
        );

    margin-inline: auto;
}

.section {
    padding-block:
        98px;
}

.section-dark {
    border-top:
        1px solid var(--line-soft);

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

    background:
        var(--background-soft);
}

.narrow-content {
    width:
        min(
            100%,
            820px
        );
}

.philosophy-section
.narrow-content {
    margin-inline: auto;
}

.eyebrow {
    display: flex;

    gap:
        10px;

    align-items:
        center;

    margin-bottom:
        18px;

    color:
        var(--accent);

    font-size:
        0.69rem;

    font-weight:
        800;

    letter-spacing:
        0.16em;

    line-height:
        1.4;

    text-transform:
        uppercase;
}

.eyebrow::before {
    width:
        20px;

    height:
        2px;

    flex:
        0 0 20px;

    background:
        var(--accent);

    content:
        "";
}

.title-accent,
.section-title span {
    display:
        block;

    color:
        var(--accent);
}

.section-title {
    margin-bottom:
        25px;

    padding-top:
        3px;

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

    font-size:
        clamp(
            2.1rem,
            4vw,
            3.85rem
        );

    letter-spacing:
        -0.045em;

    line-height:
        1.03;

    text-transform:
        uppercase;
}

.lead-copy {
    color:
        var(--text);

    font-size:
        clamp(
            1.05rem,
            1.8vw,
            1.24rem
        );

    line-height:
        1.65;
}

.section-heading {
    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1.25fr
        )
        minmax(
            260px,
            0.75fr
        );

    gap:
        clamp(
            40px,
            7vw,
            85px
        );

    align-items:
        end;

    margin-bottom:
        46px;
}

.section-heading > * {
    min-width:
        0;
}

.section-heading
.section-title {
    margin-bottom:
        0;
}

.section-heading > p {
    width:
        min(
            100%,
            470px
        );

    margin-bottom:
        0;

    justify-self:
        end;
}


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

.site-header {
    position:
        sticky;

    top:
        0;

    z-index:
        1000;

    height:
        var(--header-height);

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

    background:
        rgba(
            5,
            5,
            5,
            0.9
        );

    backdrop-filter:
        blur(18px);
}

.header-inner {
    display:
        flex;

    height:
        100%;

    align-items:
        center;

    justify-content:
        space-between;
}

.brand {
    display:
        inline-flex;

    flex-shrink:
        0;

    gap:
        11px;

    align-items:
        center;
}

.brand-mark {
    display:
        grid;

    width:
        35px;

    height:
        35px;

    place-items:
        center;

    background:
        var(--accent);

    color:
        var(--black);

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

    font-size:
        1rem;
}

.brand-text {
    display:
        flex;

    flex-direction:
        column;

    line-height:
        1.05;
}

.brand-text strong {
    font-family:
        var(--heading-font);

    font-size:
        0.84rem;

    letter-spacing:
        -0.02em;

    text-transform:
        uppercase;
}

.brand-text small {
    margin-top:
        5px;

    color:
        var(--text-muted);

    font-size:
        0.59rem;

    font-weight:
        800;

    letter-spacing:
        0.13em;

    text-transform:
        uppercase;
}


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

.main-navigation {
    display:
        flex;

    gap:
        29px;

    align-items:
        center;
}

.main-navigation >
a:not(.navigation-cta) {
    position:
        relative;

    color:
        var(--text-soft);

    font-size:
        0.73rem;

    font-weight:
        800;

    letter-spacing:
        0.08em;

    text-transform:
        uppercase;

    transition:
        color
        var(--transition);
}

.main-navigation >
a:not(.navigation-cta)::after {
    position:
        absolute;

    right:
        0;

    bottom:
        -9px;

    left:
        0;

    height:
        2px;

    background:
        var(--accent);

    content:
        "";

    transform:
        scaleX(0);

    transition:
        transform
        var(--transition);
}

.main-navigation >
a:not(.navigation-cta):hover,

.main-navigation >
a:not(.navigation-cta).active {
    color:
        var(--white);
}

.main-navigation >
a:not(.navigation-cta):hover::after,

.main-navigation >
a:not(.navigation-cta).active::after {
    transform:
        scaleX(1);
}

.navigation-cta {
    padding:
        12px 18px;

    background:
        var(--accent);

    color:
        var(--black);

    font-size:
        0.7rem;

    font-weight:
        800;

    letter-spacing:
        0.08em;

    text-transform:
        uppercase;

    transition:
        background
        var(--transition),
        transform
        var(--transition);
}

.navigation-cta:hover {
    background:
        var(--white);

    transform:
        translateY(-2px);
}

.menu-toggle {
    display:
        none;

    width:
        44px;

    height:
        44px;

    padding:
        10px;

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

    background:
        var(--surface);
}

.menu-toggle span {
    display:
        block;

    width:
        100%;

    height:
        2px;

    margin-block:
        5px;

    background:
        var(--white);

    transition:
        transform
        var(--transition),
        opacity
        var(--transition);
}

.menu-toggle[
aria-expanded="true"
]
span:nth-child(1) {
    transform:
        translateY(7px)
        rotate(45deg);
}

.menu-toggle[
aria-expanded="true"
]
span:nth-child(2) {
    opacity:
        0;
}

.menu-toggle[
aria-expanded="true"
]
span:nth-child(3) {
    transform:
        translateY(-7px)
        rotate(-45deg);
}


/* =========================================================
   BUTTONS
   ========================================================= */

.button-group {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        13px;

    align-items:
        center;
}

.button {
    display:
        inline-flex;

    min-height:
        49px;

    align-items:
        center;

    justify-content:
        center;

    padding:
        13px 20px;

    border:
        1px solid
        transparent;

    background:
        transparent;

    font-size:
        0.71rem;

    font-weight:
        800;

    letter-spacing:
        0.075em;

    line-height:
        1.3;

    text-align:
        center;

    text-transform:
        uppercase;

    transition:
        background
        var(--transition),
        border-color
        var(--transition),
        color
        var(--transition),
        transform
        var(--transition);
}

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

.button:disabled {
    cursor:
        wait;

    opacity:
        0.65;

    transform:
        none;
}

.button-primary {
    background:
        var(--accent);

    color:
        var(--black);
}

.button-primary:hover {
    background:
        var(--white);
}

.button-secondary {
    border-color:
        var(--line);

    background:
        var(--surface);

    color:
        var(--white);
}

.button-secondary:hover {
    border-color:
        var(--accent);
}

.button-full {
    width:
        100%;
}


/* =========================================================
   MEDIA
   ========================================================= */

.media-frame {
    position:
        relative;

    overflow:
        hidden;

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

    background:
        var(--surface);
}

.media-frame img,
.media-frame video {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;
}

.media-caption {
    position:
        absolute;

    right:
        18px;

    bottom:
        18px;

    left:
        18px;

    display:
        flex;

    min-height:
        66px;

    flex-direction:
        column;

    justify-content:
        center;

    padding:
        13px 17px;

    border-left:
        3px solid
        var(--accent);

    background:
        rgba(
            4,
            4,
            4,
            0.88
        );

    backdrop-filter:
        blur(9px);
}

.media-caption small {
    margin-bottom:
        2px;

    color:
        var(--accent);

    font-size:
        0.61rem;

    font-weight:
        800;

    letter-spacing:
        0.12em;

    text-transform:
        uppercase;
}

.media-caption strong {
    color:
        var(--white);

    font-size:
        0.78rem;

    letter-spacing:
        0.02em;

    text-transform:
        uppercase;
}

.tall-media {
    width:
        min(
            100%,
            490px
        );

    aspect-ratio:
        5 / 6;

    justify-self:
        start;
}

.page-hero-media {
    width:
        min(
            100%,
            560px
        );

    aspect-ratio:
        4 / 3;

    justify-self:
        end;
}


/* =========================================================
   HOME HERO
   ========================================================= */

.home-hero {
    display:
        flex;

    min-height:
        calc(
            100vh -
            var(--header-height)
        );

    align-items:
        center;

    padding-block:
        74px 80px;
}

.home-hero-grid {
    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1.03fr
        )
        minmax(
            360px,
            0.82fr
        );

    gap:
        clamp(
            55px,
            8vw,
            112px
        );

    align-items:
        center;
}

.home-hero-content {
    min-width:
        0;
}

.home-title {
    margin-bottom:
        28px;

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

    font-size:
        clamp(
            4rem,
            7.4vw,
            7.1rem
        );

    letter-spacing:
        -0.06em;

    line-height:
        0.94;

    text-transform:
        uppercase;
}

.home-title span {
    display:
        block;
}

.hero-description {
    width:
        min(
            100%,
            620px
        );

    margin-bottom:
        30px;

    font-size:
        1rem;
}

.rating-line {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        8px 12px;

    align-items:
        center;

    margin-top:
        22px;

    color:
        var(--text-muted);

    font-size:
        0.72rem;
}

.rating-stars {
    color:
        var(--accent);

    letter-spacing:
        0.08em;
}

.rating-line strong {
    color:
        var(--white);
}

.home-hero-media {
    position:
        relative;

    width:
        min(
            100%,
            490px
        );

    justify-self:
        end;
}

.hero-media {
    aspect-ratio:
        5 / 6;
}

.hero-video {
    background:
        #050505;
}

.floating-detail {
    position:
        absolute;

    top:
        44px;

    left:
        -48px;

    display:
        grid;

    width:
        245px;

    grid-template-columns:
        42px 1fr;

    gap:
        13px;

    align-items:
        center;

    padding:
        14px 16px;

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

    background:
        rgba(
            16,
            17,
            19,
            0.96
        );

    box-shadow:
        0 20px 55px
        rgba(
            0,
            0,
            0,
            0.38
        );
}

.floating-detail > span {
    color:
        var(--accent);

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

    font-size:
        1.45rem;
}

.floating-detail small,
.floating-detail strong {
    display:
        block;

    text-transform:
        uppercase;
}

.floating-detail small {
    color:
        var(--text-muted);

    font-size:
        0.56rem;

    font-weight:
        800;

    letter-spacing:
        0.12em;
}

.floating-detail strong {
    margin-top:
        3px;

    color:
        var(--white);

    font-size:
        0.66rem;

    line-height:
        1.45;
}


/* =========================================================
   METRICS
   ========================================================= */

.metric-bar {
    border-top:
        1px solid
        var(--line-soft);

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

    background:
        var(--surface);
}

.metric-grid {
    display:
        grid;

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

.metric-item {
    min-width:
        0;

    padding:
        23px 28px;

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

.metric-item:last-child {
    border-right:
        0;
}

.metric-item strong,
.metric-item span {
    display:
        block;

    text-transform:
        uppercase;
}

.metric-item strong {
    color:
        var(--accent);

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

    font-size:
        0.96rem;
}

.metric-item span {
    margin-top:
        2px;

    color:
        var(--text-muted);

    font-size:
        0.6rem;

    font-weight:
        800;

    letter-spacing:
        0.1em;
}


/* =========================================================
   SPLIT SECTIONS
   ========================================================= */

.split-section {
    display:
        grid;

    grid-template-columns:
        minmax(
            320px,
            0.9fr
        )
        minmax(
            0,
            1.1fr
        );

    gap:
        clamp(
            55px,
            8vw,
            115px
        );

    align-items:
        center;
}

.split-content {
    min-width:
        0;
}

.split-content >
p:not(.eyebrow) {
    width:
        min(
            100%,
            620px
        );
}

.feature-list {
    display:
        grid;

    gap:
        9px;

    margin-block:
        30px 28px;
}

.feature-row {
    display:
        grid;

    grid-template-columns:
        54px 1fr;

    gap:
        18px;

    align-items:
        start;

    padding:
        17px 19px;

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

    background:
        var(--surface);
}

.feature-row > span {
    color:
        var(--accent);

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

    font-size:
        1.2rem;
}

.feature-row h3 {
    margin-bottom:
        3px;

    color:
        var(--white);

    font-size:
        0.78rem;

    letter-spacing:
        0.03em;

    text-transform:
        uppercase;
}

.feature-row p {
    margin-bottom:
        0;

    font-size:
        0.78rem;
}

.text-link {
    display:
        inline-flex;

    gap:
        8px;

    align-items:
        center;

    color:
        var(--white);

    font-size:
        0.68rem;

    font-weight:
        800;

    letter-spacing:
        0.08em;

    text-transform:
        uppercase;
}

.text-link span {
    color:
        var(--accent);
}

.tag-list {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        8px;

    margin-block:
        24px 30px;
}

.tag-list span {
    padding:
        7px 10px;

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

    color:
        var(--text-soft);

    font-size:
        0.59rem;

    font-weight:
        800;

    letter-spacing:
        0.08em;

    text-transform:
        uppercase;
}


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

.home-program-grid {
    display:
        grid;

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

    gap:
        18px;
}

.home-program-card {
    position:
        relative;

    min-height:
        255px;

    padding:
        27px;

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

    background:
        var(--surface);

    transition:
        border-color
        var(--transition),
        transform
        var(--transition);
}

.home-program-card:hover {
    border-color:
        var(--accent);

    transform:
        translateY(-5px);
}

.home-program-top {
    display:
        flex;

    justify-content:
        space-between;

    gap:
        20px;

    margin-bottom:
        42px;
}

.home-program-top span {
    color:
        var(--accent);

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

    font-size:
        1.2rem;
}

.home-program-top small {
    color:
        var(--accent);

    font-size:
        0.56rem;

    font-weight:
        800;

    letter-spacing:
        0.09em;

    text-transform:
        uppercase;
}

.home-program-card h3 {
    margin-bottom:
        10px;

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

    font-size:
        1.25rem;

    line-height:
        1.1;

    text-transform:
        uppercase;
}

.home-program-card p {
    margin-bottom:
        0;

    font-size:
        0.79rem;
}

.card-arrow {
    position:
        absolute;

    right:
        22px;

    bottom:
        19px;

    color:
        var(--accent);
}


/* =========================================================
   PAGE HERO
   ========================================================= */

.page-hero {
    padding-block:
        76px 72px;

    border-bottom:
        1px solid
        var(--line-soft);
}

.page-hero-grid {
    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            0.92fr
        )
        minmax(
            390px,
            1.08fr
        );

    gap:
        clamp(
            55px,
            8vw,
            100px
        );

    align-items:
        center;
}

.page-title {
    margin-bottom:
        26px;

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

    font-size:
        clamp(
            3.3rem,
            6.4vw,
            6rem
        );

    letter-spacing:
        -0.055em;

    line-height:
        0.96;

    text-transform:
        uppercase;
}

.page-title span {
    display:
        block;
}

.page-hero-content >
p:not(.eyebrow) {
    width:
        min(
            100%,
            600px
        );

    margin-bottom:
        28px;
}

.programs-title {
    font-size:
        clamp(
            3.2rem,
            6.2vw,
            5.8rem
        );
}


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

.coach-profile {
    grid-template-columns:
        minmax(
            320px,
            0.86fr
        )
        minmax(
            0,
            1.14fr
        );
}

.coach-quality-grid {
    display:
        grid;

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

    gap:
        10px;

    margin-top:
        29px;
}

.coach-quality-grid article {
    min-height:
        130px;

    padding:
        20px;

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

    background:
        var(--surface);
}

.coach-quality-grid
article > span {
    display:
        block;

    margin-bottom:
        12px;

    color:
        var(--accent);

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

    font-size:
        0.9rem;
}

.coach-quality-grid h3 {
    margin-bottom:
        5px;

    font-size:
        0.7rem;

    text-transform:
        uppercase;
}

.coach-quality-grid p {
    margin-bottom:
        0;

    font-size:
        0.72rem;
}

.experience-grid {
    display:
        grid;

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

    gap:
        18px;
}

.experience-item {
    position:
        relative;

    height:
        390px;

    overflow:
        hidden;

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

    background:
        var(--surface);
}

.experience-item img {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;
}

.experience-item figcaption {
    position:
        absolute;

    right:
        0;

    bottom:
        0;

    left:
        0;

    display:
        flex;

    gap:
        9px;

    padding:
        16px;

    background:
        linear-gradient(
            transparent,
            rgba(
                0,
                0,
                0,
                0.86
            )
        );

    color:
        var(--white);

    font-size:
        0.66rem;

    font-weight:
        800;

    letter-spacing:
        0.07em;

    text-transform:
        uppercase;
}

.experience-item
figcaption span {
    color:
        var(--accent);
}

.testimonial-grid {
    display:
        grid;

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

    gap:
        18px;
}

.testimonial-card {
    min-height:
        230px;

    padding:
        28px;

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

    background:
        var(--surface);
}

.testimonial-stars {
    margin-bottom:
        19px;

    color:
        var(--accent);

    letter-spacing:
        0.08em;
}

.testimonial-card > p {
    min-height:
        92px;

    color:
        var(--white);

    font-size:
        0.88rem;
}

.testimonial-card footer {
    color:
        var(--text-muted);

    font-size:
        0.57rem;

    font-weight:
        800;

    letter-spacing:
        0.1em;

    text-transform:
        uppercase;
}


/* =========================================================
   PROGRAMS
   ========================================================= */

.featured-program-list {
    display:
        grid;

    gap:
        22px;
}

.featured-program {
    display:
        grid;

    grid-template-columns:
        54px
        minmax(
            0,
            1fr
        )
        minmax(
            330px,
            0.9fr
        );

    gap:
        28px;

    align-items:
        center;

    padding:
        23px;

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

    background:
        var(--surface);
}

.program-number {
    align-self:
        start;

    color:
        var(--accent);

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

    font-size:
        1.6rem;
}

.featured-program-content {
    min-width:
        0;
}

.featured-program-content > small,
.additional-program > small {
    display:
        block;

    margin-bottom:
        10px;

    color:
        var(--accent);

    font-size:
        0.57rem;

    font-weight:
        800;

    letter-spacing:
        0.11em;

    text-transform:
        uppercase;
}

.featured-program h2,
.additional-program h2 {
    margin-bottom:
        12px;

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

    font-size:
        clamp(
            1.5rem,
            2.2vw,
            2.25rem
        );

    letter-spacing:
        -0.04em;

    line-height:
        1.05;

    text-transform:
        uppercase;
}

.featured-program-content > p,
.additional-program > p {
    margin-bottom:
        18px;

    font-size:
        0.84rem;
}

.program-media {
    aspect-ratio:
        4 / 3;

    overflow:
        hidden;
}

.program-media img {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;
}

.program-points {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        8px;

    margin:
        0;

    padding:
        0;

    list-style:
        none;
}

.program-points li {
    padding:
        6px 9px;

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

    color:
        var(--text-soft);

    font-size:
        0.55rem;

    font-weight:
        800;

    letter-spacing:
        0.05em;

    text-transform:
        uppercase;
}

.program-points li::before {
    margin-right:
        5px;

    color:
        var(--accent);

    content:
        "✓";
}

.additional-programs {
    display:
        grid;

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

    gap:
        22px;

    margin-top:
        22px;
}

.additional-program {
    min-height:
        320px;

    padding:
        30px;

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

    background:
        var(--surface);
}

.additional-program > span {
    display:
        block;

    margin-bottom:
        36px;

    color:
        var(--accent);

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

    font-size:
        1.5rem;
}

.process-grid {
    display:
        grid;

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

    gap:
        18px;
}

.process-card {
    min-height:
        205px;

    padding:
        26px;

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

    background:
        var(--surface);
}

.process-card > span {
    color:
        var(--accent);

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

    font-size:
        1.2rem;
}

.process-card h3 {
    margin:
        40px 0 7px;

    font-size:
        0.78rem;

    text-transform:
        uppercase;
}

.process-card p {
    margin-bottom:
        0;

    font-size:
        0.76rem;
}


/* =========================================================
   CONTACT
   ========================================================= */

.contact-grid {
    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1.15fr
        )
        minmax(
            330px,
            0.72fr
        );

    gap:
        clamp(
            55px,
            8vw,
            100px
        );

    align-items:
        start;
}

.contact-card-list {
    display:
        grid;

    gap:
        11px;
}

.contact-card {
    display:
        grid;

    grid-template-columns:
        48px 1fr;

    gap:
        16px;

    align-items:
        center;

    min-height:
        96px;

    padding:
        18px 20px;

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

    background:
        var(--surface);
}

.contact-card > span {
    color:
        var(--accent);

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

    font-size:
        1rem;
}

.contact-card small {
    display:
        block;

    margin-bottom:
        4px;

    color:
        var(--text-muted);

    font-size:
        0.55rem;

    font-weight:
        800;

    letter-spacing:
        0.1em;

    text-transform:
        uppercase;
}

.contact-card h3 {
    margin-bottom:
        0;

    font-size:
        0.83rem;

    line-height:
        1.55;
}

.hours-card {
    padding:
        30px;

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

    background:
        var(--surface);
}

.hours-card h2 {
    margin-bottom:
        22px;

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

    font-size:
        2.25rem;

    line-height:
        1;

    text-transform:
        uppercase;
}

.hours-list {
    margin-bottom:
        18px;
}

.hours-list > div {
    display:
        grid;

    grid-template-columns:
        1fr auto;

    gap:
        20px;

    padding-block:
        11px;

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

.hours-list dt {
    color:
        var(--text-soft);

    font-size:
        0.72rem;
}

.hours-list dd {
    color:
        var(--white);

    font-size:
        0.72rem;

    font-weight:
        800;
}

.hours-card > p:last-child {
    margin-bottom:
        0;

    font-size:
        0.7rem;
}


/* =========================================================
   INQUIRY FORM
   ========================================================= */

.inquiry-grid {
    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            0.82fr
        )
        minmax(
            440px,
            1.18fr
        );

    gap:
        clamp(
            55px,
            8vw,
            105px
        );

    align-items:
        start;
}

.inquiry-intro >
p:not(.eyebrow) {
    width:
        min(
            100%,
            520px
        );
}

.inquiry-note {
    display:
        grid;

    grid-template-columns:
        45px 1fr;

    gap:
        16px;

    margin-top:
        13px;

    padding:
        17px 0;

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

.inquiry-note > span {
    color:
        var(--accent);

    font-family:
        var(--heading-font);
}

.inquiry-note strong {
    display:
        block;

    margin-bottom:
        3px;

    font-size:
        0.73rem;

    letter-spacing:
        0.05em;

    text-transform:
        uppercase;
}

.inquiry-note p {
    margin-bottom:
        0;

    font-size:
        0.76rem;
}

.inquiry-form-card {
    padding:
        clamp(
            26px,
            4vw,
            42px
        );

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

    border-left:
        3px solid
        var(--accent);

    background:
        linear-gradient(
            140deg,
            rgba(
                255,
                157,
                0,
                0.035
            ),
            transparent 46%
        ),
        var(--surface);
}

.inquiry-form {
    display:
        grid;

    gap:
        22px;
}

.form-two-column {
    display:
        grid;

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

    gap:
        16px;
}

.field-group {
    display:
        grid;

    gap:
        8px;
}

.field-group > span {
    color:
        var(--white);

    font-size:
        0.64rem;

    font-weight:
        800;

    letter-spacing:
        0.09em;

    text-transform:
        uppercase;
}

.field-group input,
.field-group textarea {
    width:
        100%;

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

    outline:
        0;

    background:
        #0a0b0c;

    color:
        var(--white);

    transition:
        border-color
        var(--transition),
        box-shadow
        var(--transition);
}

.field-group input {
    min-height:
        53px;

    padding:
        0 15px;
}

.field-group textarea {
    min-height:
        190px;

    padding:
        14px 15px;

    resize:
        vertical;

    line-height:
        1.6;
}

.field-group input::placeholder,
.field-group textarea::placeholder {
    color:
        #66686b;
}

.field-group input:focus,
.field-group textarea:focus {
    border-color:
        var(--accent);

    box-shadow:
        0 0 0 3px
        rgba(
            255,
            157,
            0,
            0.08
        );
}

.honeypot-field {
    position:
        absolute !important;

    width:
        1px !important;

    height:
        1px !important;

    overflow:
        hidden !important;

    clip:
        rect(
            0,
            0,
            0,
            0
        ) !important;

    white-space:
        nowrap !important;
}

.form-actions {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        16px;

    align-items:
        center;
}

.form-status {
    margin:
        0;

    color:
        var(--text-muted);

    font-size:
        0.74rem;
}

.form-status.is-success {
    color:
        var(--success);
}

.form-status.is-error {
    color:
        var(--danger);
}


/* =========================================================
   SOCIAL ICONS
   ========================================================= */

.social-icon-list {
    display:
        flex;

    gap:
        11px;

    align-items:
        center;
}

.social-icon {
    display:
        grid;

    width:
        38px;

    height:
        38px;

    place-items:
        center;

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

    background:
        var(--surface);

    transition:
        border-color
        var(--transition),
        transform
        var(--transition);
}

.social-icon:hover {
    border-color:
        var(--accent);

    transform:
        translateY(-2px);
}

.social-icon i {
    font-size:
        20px;
}

.social-icon.instagram i {
    background:
        radial-gradient(
            circle at 30% 107%,
            #fdf497 0%,
            #fdf497 5%,
            #fd5949 45%,
            #d6249f 60%,
            #285aeb 90%
        );

    background-clip:
        text;

    -webkit-background-clip:
        text;

    color:
        transparent;

    -webkit-text-fill-color:
        transparent;
}

.social-icon.facebook {
    border-color:
        #1877f2;

    background:
        #1877f2;

    color:
        #ffffff;
}

.contact-socials {
    margin-top:
        8px;
}


/* =========================================================
   MAP
   ========================================================= */

.map-grid {
    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1.45fr
        )
        minmax(
            300px,
            0.72fr
        );

    gap:
        22px;
}

.map-frame {
    min-height:
        480px;

    overflow:
        hidden;

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

    background:
        var(--surface);
}

.map-frame iframe {
    display:
        block;

    width:
        100%;

    height:
        100%;

    min-height:
        480px;

    filter:
        grayscale(1)
        contrast(0.92);
}

.map-information {
    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    padding:
        32px;

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

    background:
        var(--surface);
}

.map-information h2 {
    margin-bottom:
        24px;

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

    font-size:
        2.2rem;

    line-height:
        1;

    text-transform:
        uppercase;
}

.map-information address {
    margin-bottom:
        28px;

    color:
        var(--text-soft);

    line-height:
        1.9;
}


/* =========================================================
   FAQ
   ========================================================= */

.faq-grid {
    display:
        grid;

    grid-template-columns:
        minmax(
            300px,
            0.75fr
        )
        minmax(
            0,
            1.25fr
        );

    gap:
        clamp(
            55px,
            8vw,
            100px
        );

    align-items:
        start;
}

.faq-list {
    border-top:
        1px solid
        var(--line);
}

.faq-item {
    border-bottom:
        1px solid
        var(--line);
}

.faq-question {
    display:
        grid;

    width:
        100%;

    grid-template-columns:
        1fr 34px;

    gap:
        18px;

    align-items:
        center;

    padding:
        20px 0;

    border:
        0;

    background:
        transparent;

    color:
        var(--white);

    font-size:
        0.78rem;

    font-weight:
        800;

    text-align:
        left;
}

.faq-icon {
    display:
        grid;

    width:
        30px;

    height:
        30px;

    place-items:
        center;

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

    color:
        var(--accent);

    transition:
        transform
        var(--transition);
}

.faq-answer {
    display:
        grid;

    grid-template-rows:
        0fr;

    transition:
        grid-template-rows
        var(--transition);
}

.faq-answer > p {
    min-height:
        0;

    overflow:
        hidden;

    margin-bottom:
        0;

    font-size:
        0.8rem;
}

.faq-item.open
.faq-answer {
    grid-template-rows:
        1fr;
}

.faq-item.open
.faq-answer > p {
    padding-bottom:
        20px;
}

.faq-item.open
.faq-icon {
    transform:
        rotate(45deg);
}


/* =========================================================
   CTA
   ========================================================= */

.cta-section {
    padding-block:
        0 94px;
}

.cta-panel {
    display:
        flex;

    gap:
        35px;

    align-items:
        center;

    justify-content:
        space-between;

    padding:
        34px 37px;

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

    border-left:
        3px solid
        var(--accent);

    background:
        linear-gradient(
            90deg,
            rgba(
                255,
                157,
                0,
                0.045
            ),
            transparent 40%
        ),
        var(--surface);
}

.cta-panel > div {
    min-width:
        0;
}

.cta-panel .eyebrow {
    margin-bottom:
        12px;
}

.cta-panel h2 {
    margin-bottom:
        6px;

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

    font-size:
        clamp(
            1.7rem,
            3.3vw,
            2.7rem
        );

    letter-spacing:
        -0.04em;

    line-height:
        1.05;

    text-transform:
        uppercase;
}

.cta-panel p:last-child {
    margin-bottom:
        0;

    font-size:
        0.8rem;
}


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

.site-footer {
    padding-block:
        54px 20px;

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

    background:
        #030303;
}

.footer-grid {
    display:
        grid;

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

    gap:
        40px;

    padding-bottom:
        42px;
}

.footer-intro p {
    width:
        min(
            100%,
            300px
        );

    margin:
        20px 0 0;

    font-size:
        0.72rem;
}

.footer-grid h2 {
    margin-bottom:
        14px;

    color:
        var(--white);

    font-size:
        0.61rem;

    font-weight:
        800;

    letter-spacing:
        0.11em;

    text-transform:
        uppercase;
}

.footer-links {
    display:
        grid;

    gap:
        8px;
}

.footer-links a,
.footer-grid address {
    color:
        var(--text-muted);

    font-size:
        0.68rem;
}

.footer-links a:hover {
    color:
        var(--accent);
}

.footer-bottom {
    display:
        flex;

    gap:
        20px;

    align-items:
        center;

    justify-content:
        space-between;

    padding-top:
        17px;

    border-top:
        1px solid
        var(--line-soft);
}

.footer-bottom p {
    margin-bottom:
        0;

    color:
        var(--text-muted);

    font-size:
        0.58rem;
}


/* =========================================================
   ADMIN DASHBOARD
   ========================================================= */

.admin-body {
    min-height:
        100vh;

    background:
        var(--background);
}

.admin-shell {
    width:
        min(
            calc(100% - 40px),
            1320px
        );

    margin-inline:
        auto;
}

.admin-topbar {
    display:
        flex;

    min-height:
        82px;

    gap:
        24px;

    align-items:
        center;

    justify-content:
        space-between;

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

.admin-topbar-actions {
    display:
        flex;

    gap:
        10px;

    align-items:
        center;
}

.admin-main {
    padding-block:
        65px 90px;
}

.admin-auth-card {
    width:
        min(
            100%,
            560px
        );

    margin-inline:
        auto;

    padding:
        38px;

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

    border-left:
        3px solid
        var(--accent);

    background:
        var(--surface);
}

.admin-auth-card h1,
.admin-dashboard-heading h1 {
    margin-bottom:
        12px;

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

    font-size:
        clamp(
            2.3rem,
            5vw,
            4rem
        );

    letter-spacing:
        -0.05em;

    line-height:
        1;

    text-transform:
        uppercase;
}

.admin-auth-card form {
    display:
        grid;

    gap:
        20px;

    margin-top:
        26px;
}

.admin-dashboard-heading {
    display:
        flex;

    gap:
        30px;

    align-items:
        flex-end;

    justify-content:
        space-between;

    margin-bottom:
        28px;
}

.admin-dashboard-heading
.eyebrow {
    margin-bottom:
        10px;
}

.admin-count {
    margin-bottom:
        8px;

    color:
        var(--text-muted);

    font-size:
        0.7rem;

    font-weight:
        800;

    letter-spacing:
        0.09em;

    text-transform:
        uppercase;
}

.admin-stat-grid {
    display:
        grid;

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

    gap:
        14px;

    margin-bottom:
        28px;
}

.admin-stat-card {
    padding:
        22px;

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

    background:
        var(--surface);
}

.admin-stat-card strong {
    display:
        block;

    color:
        var(--accent);

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

    font-size:
        2rem;

    line-height:
        1;
}

.admin-stat-card span {
    display:
        block;

    margin-top:
        8px;

    color:
        var(--text-muted);

    font-size:
        0.62rem;

    font-weight:
        800;

    letter-spacing:
        0.08em;

    text-transform:
        uppercase;
}

.admin-loading {
    color:
        var(--text-muted);

    font-size:
        0.75rem;
}

.admin-list {
    display:
        grid;

    gap:
        14px;
}

.admin-inquiry-card {
    display:
        grid;

    grid-template-columns:
        minmax(
            210px,
            0.7fr
        )
        minmax(
            0,
            1.5fr
        )
        auto;

    gap:
        25px;

    align-items:
        start;

    padding:
        24px;

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

    background:
        var(--surface);
}

.admin-inquiry-meta {
    min-width:
        0;
}

.admin-inquiry-meta h2 {
    margin:
        10px 0 3px;

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

    font-size:
        1.2rem;

    text-transform:
        uppercase;
}

.admin-status-badge {
    display:
        inline-flex;

    padding:
        5px 8px;

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

    color:
        var(--text-soft);

    font-size:
        0.54rem;

    font-weight:
        800;

    letter-spacing:
        0.08em;

    text-transform:
        uppercase;
}

.admin-status-badge[
data-status="new"
] {
    border-color:
        var(--accent);

    color:
        var(--accent);
}

.admin-status-badge[
data-status="contacted"
] {
    border-color:
        #b8c5ff;

    color:
        #b8c5ff;
}

.admin-status-badge[
data-status="closed"
] {
    color:
        var(--text-muted);
}

.admin-phone {
    display:
        block;

    margin-bottom:
        5px;

    color:
        var(--white);

    font-size:
        0.76rem;

    font-weight:
        700;
}

.admin-date {
    color:
        var(--text-muted);

    font-size:
        0.63rem;
}

.admin-inquiry-message p {
    margin-bottom:
        0;

    color:
        var(--text-soft);

    white-space:
        pre-wrap;

    overflow-wrap:
        anywhere;
}

.admin-inquiry-actions {
    display:
        flex;

    width:
        150px;

    flex-direction:
        column;

    gap:
        7px;
}

.admin-small-button {
    width:
        100%;

    min-height:
        34px;

    padding:
        7px 9px;

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

    background:
        #0b0c0d;

    color:
        var(--white);

    font-size:
        0.57rem;

    font-weight:
        800;

    letter-spacing:
        0.06em;

    text-transform:
        uppercase;
}

.admin-small-button:hover {
    border-color:
        var(--accent);
}

.admin-small-button.is-danger:hover {
    border-color:
        var(--danger);

    color:
        var(--danger);
}

.admin-empty {
    padding:
        45px 25px;

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

    background:
        var(--surface);

    text-align:
        center;
}

.admin-empty h2 {
    margin-bottom:
        8px;

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

    text-transform:
        uppercase;
}

.admin-empty p {
    margin-bottom:
        0;
}


/* =========================================================
   REVEAL
   ========================================================= */

.reveal {
    opacity:
        0;

    transform:
        translateY(22px);

    transition:
        opacity
        700ms ease,
        transform
        700ms ease;
}

.reveal.visible {
    opacity:
        1;

    transform:
        translateY(0);
}


/* =========================================================
   MEDIUM DESKTOP
   ========================================================= */

@media
(max-width: 1180px) {

    .home-hero-grid,
    .page-hero-grid {
        gap:
            55px;
    }

    .home-title {
        font-size:
            clamp(
                3.7rem,
                7vw,
                5.7rem
            );
    }

    .floating-detail {
        left:
            -25px;
    }

    .featured-program {
        grid-template-columns:
            48px
            minmax(
                0,
                1fr
            )
            minmax(
                290px,
                0.82fr
            );
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media
(max-width: 1020px) {

    :root {
        --header-height:
            72px;
    }


    .menu-toggle {
        display:
            block;
    }


    .main-navigation {
        position:
            fixed;

        top:
            var(--header-height);

        right:
            0;

        left:
            0;

        display:
            block;

        max-height:
            calc(
                100vh -
                var(--header-height)
            );

        overflow-y:
            auto;

        padding:
            19px 20px 30px;

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

        background:
            rgba(
                5,
                5,
                5,
                0.98
            );

        opacity:
            0;

        pointer-events:
            none;

        transform:
            translateY(-15px);

        transition:
            opacity
            var(--transition),
            transform
            var(--transition);
    }


    .main-navigation.open {
        opacity:
            1;

        pointer-events:
            auto;

        transform:
            translateY(0);
    }


    .main-navigation >
    a:not(.navigation-cta) {
        display:
            block;

        padding:
            17px 4px;

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

        font-size:
            0.83rem;
    }


    .main-navigation >
    a:not(.navigation-cta)::after {
        display:
            none;
    }


    .navigation-cta {
        display:
            block;

        margin-top:
            23px;

        text-align:
            center;
    }


    .home-hero {
        min-height:
            auto;
    }


    .home-hero-grid,
    .page-hero-grid,
    .split-section,
    .contact-grid,
    .inquiry-grid,
    .map-grid,
    .faq-grid {
        grid-template-columns:
            1fr;
    }


    .home-hero-media,
    .page-hero-media,
    .tall-media {
        width:
            100%;

        max-width:
            650px;

        justify-self:
            stretch;
    }


    .home-hero-media,
    .page-hero-media {
        justify-self:
            start;
    }


    .hero-media,
    .tall-media {
        aspect-ratio:
            5 / 5.4;
    }


    .page-hero-media {
        aspect-ratio:
            16 / 10;
    }


    .page-title,
    .programs-title,
    .contact-title {
        width:
            min(
                100%,
                760px
            );

        font-size:
            clamp(
                3rem,
                8vw,
                5.5rem
            );
    }


    .section-heading {
        grid-template-columns:
            1fr;

        gap:
            21px;
    }


    .section-heading > p {
        justify-self:
            start;
    }


    .featured-program {
        grid-template-columns:
            50px
            minmax(
                0,
                1fr
            );

        gap:
            25px;
    }


    .program-media {
        grid-column:
            1 / -1;

        aspect-ratio:
            16 / 8;
    }


    .home-program-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            );
    }


    .home-program-card:last-child {
        grid-column:
            1 / -1;
    }


    .testimonial-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            );
    }


    .testimonial-card:last-child {
        grid-column:
            1 / -1;
    }


    .footer-grid {
        grid-template-columns:
            1.3fr
            repeat(
                2,
                0.7fr
            );
    }


    .footer-grid >
    div:last-child {
        grid-column:
            2;
    }


    .admin-inquiry-card {
        grid-template-columns:
            minmax(
                210px,
                0.65fr
            )
            minmax(
                0,
                1.35fr
            );
    }


    .admin-inquiry-actions {
        grid-column:
            1 / -1;

        width:
            100%;

        flex-direction:
            row;

        flex-wrap:
            wrap;
    }


    .admin-small-button {
        width:
            auto;

        flex:
            1 1 130px;
    }

}


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

@media
(max-width: 700px) {


    .container {
        width:
            min(
                calc(100% - 28px),
                var(--container-width)
            );
    }


    .section {
        padding-block:
            67px;
    }


    .brand-text strong {
        font-size:
            0.71rem;
    }


    .brand-text small {
        font-size:
            0.52rem;
    }


    .home-hero {
        padding-block:
            57px 64px;
    }


    .home-title {
        font-size:
            clamp(
                3rem,
                15.5vw,
                4.8rem
            );
    }


    .hero-media,
    .tall-media {
        aspect-ratio:
            4 / 5;
    }


    .page-hero-media {
        aspect-ratio:
            4 / 3;
    }


    .floating-detail {
        position:
            relative;

        top:
            auto;

        left:
            auto;

        width:
            100%;

        margin-top:
            10px;

        box-shadow:
            none;
    }


    .metric-grid {
        grid-template-columns:
            1fr;
    }


    .metric-item {
        border-right:
            0;

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


    .metric-item:last-child {
        border-bottom:
            0;
    }


    .home-program-grid,
    .testimonial-grid,
    .experience-grid,
    .additional-programs,
    .process-grid,
    .coach-quality-grid,
    .admin-stat-grid {
        grid-template-columns:
            1fr;
    }


    .home-program-card:last-child,
    .testimonial-card:last-child {
        grid-column:
            auto;
    }


    .home-program-card {
        min-height:
            245px;
    }


    .experience-item {
        height:
            335px;
    }


    .page-hero {
        padding-block:
            59px 48px;
    }


    .page-title,
    .programs-title,
    .contact-title {
        font-size:
            clamp(
                2.8rem,
                13vw,
                4.5rem
            );
    }


    .featured-program {
        grid-template-columns:
            1fr;

        gap:
            18px;

        padding:
            20px;
    }


    .program-number {
        font-size:
            1.5rem;
    }


    .program-media {
        grid-column:
            auto;

        aspect-ratio:
            4 / 3;
    }


    .additional-program {
        min-height:
            0;

        padding:
            25px;
    }


    .form-two-column {
        grid-template-columns:
            1fr;
    }


    .map-frame,
    .map-frame iframe {
        min-height:
            400px;
    }


    .hours-card,
    .map-information,
    .inquiry-form-card {
        padding:
            24px;
    }


    .cta-panel {
        flex-direction:
            column;

        align-items:
            stretch;

        padding:
            27px 23px;
    }


    .cta-panel .button {
        width:
            100%;
    }


    .footer-grid {
        grid-template-columns:
            1fr;

        gap:
            33px;
    }


    .footer-grid >
    div:last-child {
        grid-column:
            auto;
    }


    .footer-bottom {
        flex-direction:
            column;

        gap:
            7px;

        align-items:
            flex-start;
    }


    .admin-shell {
        width:
            min(
                calc(100% - 24px),
                1320px
            );
    }


    .admin-topbar {
        align-items:
            flex-start;

        padding-block:
            16px;
    }


    .admin-topbar-actions {
        flex-direction:
            column;

        align-items:
            stretch;
    }


    .admin-topbar-actions
    .button {
        min-height:
            40px;

        padding:
            9px 12px;

        font-size:
            0.6rem;
    }


    .admin-main {
        padding-block:
            40px 60px;
    }


    .admin-auth-card {
        padding:
            25px;
    }


    .admin-dashboard-heading {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            10px;
    }


    .admin-inquiry-card {
        grid-template-columns:
            1fr;
    }


    .admin-inquiry-actions {
        grid-column:
            auto;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media
(max-width: 440px) {


    .button-group,
    .form-actions {
        flex-direction:
            column;

        align-items:
            stretch;
    }


    .button-group .button,
    .form-actions .button {
        width:
            100%;
    }


    .media-caption {
        right:
            12px;

        bottom:
            12px;

        left:
            12px;
    }


    .hours-list > div {
        gap:
            10px;
    }


    .admin-topbar {
        flex-direction:
            column;
    }


    .admin-topbar-actions {
        width:
            100%;

        flex-direction:
            row;
    }


    .admin-topbar-actions
    .button {
        flex:
            1 1 0;
    }

}


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

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


    html {
        scroll-behavior:
            auto;
    }


    *,
    *::before,
    *::after {
        transition-duration:
            0.01ms !important;

        animation-duration:
            0.01ms !important;

        animation-iteration-count:
            1 !important;
    }


    .reveal {
        opacity:
            1;

        transform:
            none;
    }

}