﻿:root {
    --mud-drawer-width-left: 100vw !important;
    --mud-drawer-width-right: 100vw !important;
}

.mud-toolbar-gutters {
    padding-left: 40px !important;
    padding-right: 40px !important;
}

.index-fab .mud-fab-label {
    color: #003B3C;
}


/*font-family*/
.stix-two-text-normal {
    font-family: "STIX Two Text", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.stix-two-text-medium, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: "STIX Two Text", serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}

.inter-text-medium {
    font-family: "Inter", serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}

.stix-two-text-semibol {
    font-family: "STIX Two Text", serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
}

.stix-two-text-bold {
    font-family: "STIX Two Text", serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.font-medium {
    font-weight: 500;
}

@media only screen and (min-width : 1440px) and (max-width : 1680px) {
    .about-page {
        padding: 50px;
    }
}

@media only screen and (min-width : 974px) and (max-width : 1440px) {
    .about-page {
        padding: 50px;
    }
}

/* --Phone-- */
@media only screen and (max-width : 974px) {
    .about-page {
        padding: 50px;
    }
}

@media (min-width: 1025px) {
    .cc-faq .disclosure__title {
        font-size: 24px !important;
    }

    .cc-faq .section--padded {
        padding-top: 110px;
        padding-bottom: 123px;
    }
}

.employee-discount-banner {
    background-color: #009296;
    border: 1px solid #f0f8ff;
    padding: 10px;
    text-align: center;
    font-weight: bold;
    color: #f0f8ff;
}
.h0, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, .font-heading {
    margin: 0 0 .5em;
    color: rgb(var(--heading-color));
    font-family: var(--heading-font-family);
    font-style: var(--heading-font-style);
    font-weight: var(--heading-font-weight);
    line-height: calc(4px + 2.4ex);
    text-transform: var(--heading-text-transform);
}

/* --- ABOUT PAGE LAYOUT --- */
.about-page .reading-width {
    max-width: 1600px;
    margin: 3rem auto;
    padding: 50px 0 50px 0;
    font-size: 16px;
}

.spacer {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

/* Paragraph readability */
.about-page .article-content p {
    line-height: 1.75;
    margin: 0.75rem 0;
    color: #1f2937; /* neutral-800 */
}

/* Callout quote style (copied from inline styles in Shopify) */
.about-page .quote-callout {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    padding-left: 1.25rem;
    border-left: 2px solid rgba(0, 0, 0, 1.0);
    text-transform: uppercase;
    font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    font-weight: 700;
    font-size: 1.33rem;
    line-height: 2.33rem;
    letter-spacing: 0.1rem;
}

/* Responsive YouTube embeds */
.youtube-video-container {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    overflow: hidden;
    border-radius: 8px;
    margin: 1.25rem 0;
    background: #000;
}

    .youtube-video-container iframe {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        border: 0;
    }

/* Optional: scrollable tables if the page ever includes tables */
.scrollable-table {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.reading-width {
    max-width: 820px;
    margin: 3rem auto;
}

.article-content p, .mud-typography {
    line-height: 1.75;
    margin: .75rem 0;
    color: #202020;
}

.contact-link {
    color: #202020;
    text-decoration: none;
}

    .contact-link.underline {
        text-decoration: underline;
    }
