@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Oswald:wght@200..700&family=Roboto:ital,wght@0,100..900;1,100..900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Oswald:wght@200..700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --Font-Oswald: "Oswald",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
    --Font-Roboto: "Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
    --primary-color: #003366;
    --secondary-color: #161922;
    --dark-gray: #252525;
    --sky-blue: #4D9BD9;
    --black: #000000;
    --white: #ffffff;
    --gray: #808080;
    --text-para:#262626;
    --orange:#FF7107;

    --footer-bg: #232022;
    --footer-bg-bottom: #1a1819;
    --footer-heading: #ffffff;
    --footer-link: #cccccc;
    --footer-link-hover: #ffffff;
    --footer-copyright: #a8a8a8;

    /* Site header (hero strip — matches reference layout) */
    --site-header-overlay: rgba(22, 22, 26, 0.82);
    --site-header-link: #ffffff;
    --site-header-link-hover: rgba(255, 255, 255, 0.85);
    --site-header-underline-duration: 0.35s;
    --site-header-underline-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --header-dd-glass-hero: linear-gradient(
        180deg,
        color-mix(in srgb, var(--secondary-color) 90%, transparent) 0%,
        color-mix(in srgb, var(--secondary-color) 82%, transparent) 100%
    );
    --header-dd-glass-scrolled: linear-gradient(
        180deg,
        color-mix(in srgb, var(--primary-color) 96%, transparent) 0%,
        color-mix(in srgb, var(--primary-color) 94%, transparent) 100%
    );
    --header-dd-border: color-mix(in srgb, var(--white) 12%, transparent);
    --header-dd-border-soft: color-mix(in srgb, var(--white) 10%, transparent);
    --header-dd-rule: color-mix(in srgb, var(--white) 20%, transparent);
    --header-dd-rule-mid: color-mix(in srgb, var(--white) 18%, transparent);
    --header-dd-rule-soft: color-mix(in srgb, var(--white) 15%, transparent);
    --header-dd-rule-muted: color-mix(in srgb, var(--white) 14%, transparent);
    --header-dd-shadow: 0 20px 48px color-mix(in srgb, var(--black) 35%, transparent);
    --header-dd-shadow-hero: 0 20px 50px color-mix(in srgb, var(--black) 55%, transparent);
    --header-dd-inset: 0 0 0 1px color-mix(in srgb, var(--black) 25%, transparent) inset;
    --header-dd-hover: color-mix(in srgb, var(--white) 8%, transparent);
    --header-dd-active: color-mix(in srgb, var(--white) 10%, transparent);
    --header-dd-chip: color-mix(in srgb, var(--white) 6%, transparent);
    --header-dd-text-dim: color-mix(in srgb, var(--white) 88%, transparent);
    --header-dd-text-body: color-mix(in srgb, var(--white) 92%, transparent);
    --header-dd-text-title: color-mix(in srgb, var(--white) 95%, transparent);
    --header-dd-backdrop: color-mix(in srgb, var(--black) 45%, transparent);
    --header-dd-drawer: color-mix(in srgb, var(--secondary-color) 96%, transparent);
    --header-dd-drawer-shadow: -12px 0 40px color-mix(in srgb, var(--black) 35%, transparent);
    --header-dd-accordion-bg: color-mix(in srgb, var(--black) 20%, transparent);
    --product-mega-bg: var(--white);
    --product-mega-border: color-mix(in srgb, var(--black) 6%, var(--white));
    --product-mega-shadow: 0 20px 50px color-mix(in srgb, var(--black) 16%, transparent),
        0 0 1px color-mix(in srgb, var(--black) 8%, transparent);
    --product-mega-desc: var(--gray);
    --product-mega-icon-bg: color-mix(in srgb, var(--gray) 15%, var(--white));
    --product-mega-icon-color: var(--gray);
    --product-mega-title: var(--secondary-color);
    --product-mega-see-all: var(--sky-blue);
    --locations-mega-shadow: var(--header-dd-shadow);
    --locations-mega-line: var(--header-dd-border-soft);
    --locations-mega-active: color-mix(in srgb, var(--white) 6%, transparent);
    --locations-mega-icon-well: color-mix(in srgb, var(--white) 8%, transparent);
    --surface-hover-light: color-mix(in srgb, var(--white) 96%, var(--gray));
}
.text-primary{
    color:var(--primary-color) !important;
}
.text-secondary{
  color:var(--secondary-color) !important;
}
.Font-Roboto{
    font-family:var(--Font-Roboto);
}
.site-header__backdrop {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
    background-color:#003366;
    opacity:0.23;
    border-bottom:1px solid #ffffff36;
}



.site-header__backdrop::before {
    content: '';
    position: absolute;
    inset: -1.5rem;
    background: var(--site-header-bg-image) center center / cover no-repeat;
    filter: blur(14px);
    transform: scale(1.08);
}

.site-header__backdrop::after {
    content: '';
    position: absolute;
    inset: 0;
    backdrop-filter: blur(5.2px);
}

.site-header__bar {
    position: relative;
    z-index: 2;
    padding-left: 0 !important;
     padding-right:6px !important;

}
.site-header__desktop {
    justify-content: flex-start;
    flex-wrap: nowrap;
}
/* Single nav group, right-aligned: logo stays left, all links pack to the right */
.site-header__desktop .site-header__col--left {
    flex: 0 0 auto;
    margin-left: auto;
}
.site-header__brand-center {
    min-width: 205px;
}
.site-header__logo {
    display: block;
    height: auto;
    width: auto;
    max-height: 60px;
    filter: brightness(0) invert(1);
    object-fit:contain;
    margin: auto;
}
.site-header.scrolled .site-header__logo {
    filter: none;
}

.site-header__link {
    position: relative;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    font-weight: 500;
    line-height:21px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--white) !important;
    padding: 0 !important;
    border-bottom: none;
    transition: none !important;
}
.navbar-nav li{
padding: 3px 20px !important;

}
/* Underline uses ::before so .dropdown-toggle can keep ::after hidden (Bootstrap caret) */
.site-header__link::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 100%;
    height: 2px;
    border-top: none;
    background-color: currentColor;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform var(--site-header-underline-duration) var(--site-header-underline-ease);
    display:inline-block;
}

/* normal hover */
.site-header__link:hover::before {
    transform: scaleX(1);
}

/* Dropdown: hover on nav item still reveals underline (desktop mega menus) */
.nav-item.dropdown:hover .site-header__link::before {
    transform: scaleX(1);
}

/* Dropdown open (click / keyboard) */
.site-header__link.show::before {
    transform: scaleX(1);
}


header.site-header.scrolled .navbar-toggler {
    color: #000;
    border: 1px solid var(--primary-color);
}

header.site-header.scrolled .navbar-toggler-icon {
    filter: invert(1);
}
.site-header__link:hover::before,
.site-header__link:focus-visible::before,
.site-header__link.active::before {
    transform: scaleX(1);
}

/* Custom chevron (down = closed, up = open); hide Bootstrap default caret */
.site-header .site-header__link.dropdown-toggle::after {
    display: none !important;
    content: none !important;
    border: none !important;
    margin: 0 !important;
}

.site-header__dropdown-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    opacity: 0.9;
    transition: transform 0.25s var(--site-header-underline-ease);
    position: relative;
    top: -2px;
}

.site-header .dropdown.show > .dropdown-toggle .site-header__dropdown-chevron,
.site-header .dropdown-toggle[aria-expanded="true"] .site-header__dropdown-chevron {
    transform: rotate(180deg);
}
/*.site-header__cta {*/
/*    font-family: var(--Font-Roboto);*/
/*    font-size: 15px;*/
/*    letter-spacing: 0.10em;*/
/*    border: 1px solid var(--white);*/
/*    text-decoration: none;*/
/*    color: var(--white);*/
/*    background-color: rgba(255, 113, 7, 0);*/
/*    border-radius: 18px;*/
/*    font-weight: 400;*/
/*    transition: 0.5s;*/
/*    padding: 12px 35px;*/
/*}*/
.site-header__cta {
  font-family: var(--Font-Roboto);
  font-size: 15px;
  letter-spacing: 0.02em;
  border: 1px solid var(--orange);
  text-decoration: none;
  color: var(--white);
  background-color: var(--orange);
  border-radius: 18px;
  font-weight: 400;
  transition: 0.5s;
  padding: 10px 33px;
    margin-left:20px;
}
   .navbar-nav li {
    padding: 3px 21px !important;
}
.site-header.scrolled .site-header__cta {
    border: 1px solid var(--orange);
    color: var(--white);
}

.site-header__cta:hover,
.site-header__cta:focus {
    color: var(--white);
    background-color: #e06305;
    border-color: #e06305;
}

/* SCROLLED STATE (more specific) */
.site-header.scrolled .site-header__cta:hover,
.site-header.scrolled .site-header__cta:focus {
    background-color: #e06305 !important;
    color: var(--white) !important;
    border-color: #e06305 !important;
}


.site-header.scrolled .site-header__cta {
    color: var(--white) !important;
    background-color: var(--orange) !important;
    border-color: var(--orange) !important;
}

/* Header dropdown: outer ul is Popper target (transparent); inner panel slides up as a unit */
.site-header .site-header__dropdown-menu {
    margin-top: 3px !important;
    padding: 0;
    min-width: 17.5rem;
    border: none;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    left:0;
}

/* Centred under the Locations link. Bootstrap turns Popper off inside a
   .navbar, so this is plain CSS against the Locations <li> (Bootstrap's
   .dropdown is position: relative); [data-bs-popper] would otherwise reset
   left to 0 when the menu is opened by click. At 1200px, the narrowest
   desktop width, the card still sits fully on screen (x 76-930). */
.site-header .site-header__dropdown-menu--locations,
.site-header .site-header__dropdown-menu--locations[data-bs-popper] {
    left: 50%;
    transform: translateX(-50%);
    min-width: min(56rem, calc(100vw - 1.5rem));
    max-width: min(64rem, calc(100vw - 1rem));
}

.site-header .site-header__dropdown-menu--product-mega {
    min-width: 0;
    max-width: min(52rem, calc(100vw - 1.5rem));
}

/* Holistics-style product mega: Offerings | Features & capabilities */
.site-header__product-mega {
    display: grid;
    grid-template-columns: minmax(12rem, 31%) minmax(0, 1fr);
    gap: 0 1.75rem;
    padding: 1.75rem 1.85rem 1.65rem;
    background: var(--product-mega-bg);
    border-radius: 12px;
    border: 1px solid var(--product-mega-border);
    box-shadow: var(--product-mega-shadow);
    text-align: left;
}

.site-header__product-mega-offerings {
    padding-right: 1.5rem;
    border-right: 1px solid var(--product-mega-border);
}

.site-header__product-mega-label {
    font-family: var(--Font-Roboto);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--product-mega-desc);
    margin: 0 0 1rem;
}

.site-header__product-mega-label--lg {
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    margin: 0;
}

.site-header__product-mega-tile {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 0.7rem 0.6rem;
    margin: 0 -0.6rem;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.2s ease;
}

.site-header__product-mega-tile:hover,
.site-header__product-mega-tile:focus {
    background-color: var(--surface-hover-light);
}

.site-header__product-mega-icon-wrap {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 10px;
    background: var(--product-mega-icon-bg);
    color: var(--product-mega-icon-color);
    font-size: 1.1rem;
}

.site-header__product-mega-icon-wrap--sm {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 0.95rem;
    border-radius: 8px;
}

.site-header__product-mega-copy {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.site-header__product-mega-title {
    font-family: var(--Font-Roboto);
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--product-mega-title);
}

.site-header__product-mega-desc {
    font-family: var(--Font-Roboto);
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.45;
    color: var(--product-mega-desc);
}

.site-header__product-mega-features-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.1rem;
    flex-wrap: wrap;
}

.site-header__product-mega-see-all {
    font-family: var(--Font-Roboto);
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--product-mega-see-all);
    text-decoration: none;
    white-space: nowrap;
}

.site-header__product-mega-see-all:hover,
.site-header__product-mega-see-all:focus {
    color: var(--primary-color);
    text-decoration: underline;
}

.site-header__product-mega-feature {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.55rem 0.5rem;
    margin: 0 -0.5rem;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    height: 100%;
    transition: background-color 0.2s ease;
}

.site-header__product-mega-feature:hover,
.site-header__product-mega-feature:focus {
    background-color: var(--surface-hover-light);
}

.site-header__dropdown-menu.show .site-header__product-mega {
    animation: site-header-dropdown-panel-slide 0.4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.site-header__dropdown-mount {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

.site-header__dropdown-panel {
    width: 100%;
    min-width: 100%;
    border-radius: 14px;
    overflow: hidden;
    padding: 6px 10px;
        background: var(--white);
    backdrop-filter: brightness(0.5);
    -webkit-backdrop-filter: blur(20px);
}

.site-header__dropdown-rule {
    height: 0;
    margin: 0 1.25rem;
    padding: 0;
    list-style: none;
    border: 0;
    border-top: 1px solid var(--header-dd-rule);
}

.site-header__dropdown-item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    font-weight: 500;
    line-height:21px;
    /*letter-spacing: 0.12em;*/
    /*text-transform: uppercase;*/
    color: var(--primary-color) !important;
    background-color: transparent !important;
    white-space: normal;
    transition: background-color 0.2s ease, color 0.2s ease;
    /*border-bottom: 1px solid var(--header-dd-rule-mid) !important;*/
    padding: 9px 20px !important;
    border-radius:10px;
    margin:7px 0px;
}
.site-header__dropdown-item:last-child {
    border-bottom: none !important;

}

.site-header__dropdown-item:hover,
.site-header__dropdown-item:focus {
    background-color: #00336612 !important;
}

.site-header__dropdown-icon {
    display: flex;
    flex-shrink: 0;
    width: 1.5rem;
    align-items: center;
    justify-content: center;
    color: inherit;
}

.site-header__dropdown-icon svg {
    display: block;
}

.site-header__dropdown-label {
    line-height: 1.25;
}

.site-header__dropdown-menu.show .site-header__dropdown-panel {
    animation: site-header-dropdown-panel-slide 0.4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* Locations mega: Bootstrap 5 vertical tabs (Holistics-style white panel) */
.site-header__dropdown-panel--mega {
    padding: 0 !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
    overflow: visible;
}

.site-header__locations-mega--tabs {
    background: var(--white);
    border-radius: 14px;
    border: none;
    box-shadow: var(--locations-mega-shadow);
    padding: 1.75rem 1.85rem 1.75rem 1.75rem;
    text-align: left;
    width: 100%;
}

.site-header__dropdown-menu.show .site-header__locations-mega--tabs {
    animation: site-header-dropdown-panel-slide 0.4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.site-header__locations-tab-sidebar {
    flex: 0 0 auto;
    width: 100%;
    padding-right: 1.75rem;
    border-right: 1px solid var(--locations-mega-line);
}

.site-header__locations-tab-label {
    font-family: var(--Font-Roboto);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gray);
    margin: 0 0 1.15rem;
}

.site-header__locations-nav-pills {
    gap: 0.25rem;
}

.site-header__locations-nav-pills--rail {
    width: 100%;
}

.site-header__locations-tab-content--pane {
    min-height: 0;
}

.site-header__locations-flyout-link {
    font-family: var(--Font-Roboto);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--secondary-color);
    text-decoration: none;
    display: block;
    padding: 0.3rem 0;
    line-height: 1.35;
}

.site-header__locations-flyout-link:hover,
.site-header__locations-flyout-link:focus {
    color: var(--primary-color);
    text-decoration: underline;
}

.site-header__locations-flyout-placeholder {
    font-family: var(--Font-Roboto);
    font-size: 0.875rem;
}

.site-header__locations-nav-pills .nav-link.site-header__locations-tab-trigger {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    width: 100%;
    margin: 0;
    padding: 0.8rem 0.75rem;
    border: none !important;
    border-radius: 10px;
    background: transparent;
    color: var(--secondary-color);
    text-align: left;
    transition: background-color 0.18s ease;
    box-shadow: none !important;
}

.site-header__locations-nav-pills .nav-link.site-header__locations-tab-trigger:hover,
.site-header__locations-nav-pills .nav-link.site-header__locations-tab-trigger:focus {
    background-color: var(--surface-hover-light);
    color: var(--secondary-color);
}

.site-header__locations-nav-pills .nav-link.site-header__locations-tab-trigger.active {
    background-color: var(--locations-mega-active);
    color: var(--secondary-color);
}

.site-header__locations-nav-pills .nav-link.site-header__locations-tab-trigger:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

.site-header__locations-tab-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    border: none;
    background: var(--locations-mega-icon-well);
    color: var(--gray);
}

.site-header__locations-tab-icon svg {
    display: block;
}

.site-header__locations-tab-text {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.site-header__locations-tab-title {
    font-family: var(--Font-Roboto);
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--secondary-color);
}

.site-header__locations-tab-desc {
    font-family: var(--Font-Roboto);
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.4;
    color: var(--gray);
    margin-top: 0.15rem;
}

.site-header__locations-tab-content-wrap {
    min-width: 0;
    padding-left: 1.75rem;
}

.site-header__locations-tab-content {
    min-height: 11rem;
    max-height: min(26rem, 56vh);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-right: 0.15rem;
}

.site-header__locations-pane-head {
    margin-bottom: 1.1rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid var(--locations-mega-line);
}

.site-header__locations-pane-title {
    display: block;
    font-family: var(--Font-Roboto);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--secondary-color);
}

.site-header__locations-pane-tile {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.35rem 0.4rem;
    margin: 0 -0.4rem;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.18s ease;
}

.site-header__locations-pane-tile:hover,
.site-header__locations-pane-tile:focus {
    background-color: var(--surface-hover-light);
}

.site-header__locations-pane-tile:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 1px;
}

.site-header__locations-pane-tile-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 8px;
    border: none;
    background: var(--locations-mega-icon-well);
    color: var(--gray);
    font-size: 0.95rem;
}

.site-header__locations-pane-tile-body {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
    padding-top: 0.1rem;
}

.site-header__locations-pane-tile-name {
    font-family: var(--Font-Roboto);
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--secondary-color);
}

.site-header__locations-pane-tile-meta {
    font-family: var(--Font-Roboto);
    font-size: 0.8125rem;
    line-height: 1.4;
    font-weight: 400;
    color: var(--gray);
}
@keyframes site-header-dropdown-panel-slide {
    from {
        opacity: 0;
        transform: translateY(1rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.site-header.scrolled .site-header__dropdown-panel:not(.site-header__dropdown-panel--mega) {
    background: var(--header-dd-glass-scrolled);
    border: 1px solid var(--header-dd-border);
    box-shadow: var(--header-dd-shadow);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.site-header.scrolled .site-header__dropdown-item {
    color: var(--white) !important;
}

.site-header.scrolled .site-header__dropdown-item:hover,
.site-header.scrolled .site-header__dropdown-item:focus {
    color: var(--white) !important;
    font-weight: 400;
    background-color:#1f5285 !important;
}

 /* Locations mega inner card: match About Us dropdown after scroll (mega panel is excluded from rule above) */
/*.site-header.scrolled .location_dd_main {*/
/*    border: 1px solid var(--header-dd-border);*/
/*    box-shadow: var(--header-dd-shadow);*/
/*    background: #00000061;*/
/*    backdrop-filter: brightness(0.5);*/
/*}*/

/* Scrolled styling goes on the card (.location_dd_main) only, never on the
   outer menu <ul>: that wrapper is 21px wider than the card on each side,
   so a border, shadow or backdrop blur on it draws a square frame around
   the rounded card. */
.site-header.scrolled .location_dd_main {
    /*box-shadow: var(--header-dd-shadow);*/
    /*backdrop-filter: blur(18px);*/
    background: var(--header-dd-glass-scrolled);
    border: 1px solid var(--header-dd-border);
     box-shadow: var(--header-dd-shadow);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}


.site-header.scrolled .site-header__locations-mega--tabs {
    box-shadow: var(--locations-mega-shadow);
}
html,body{
    overflow-x: hidden;
    width: 100%;
}
body {
    overflow-x: hidden;
    padding-bottom:0px !important;
    font-family:var(--Font-Roboto);

}

.Font-Oswald {
    font-family: var(--Font-Oswald);
}

.Font-Roboto {
    font-family: var(--Font-Roboto);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--Font-Oswald);
}
.fw-400{font-weight: 400;}
.fw-500{font-weight: 500;}
.fw-600{font-weight: 600;}
.fw-700{font-weight: 700;}
.f9{font-size: 9px;}
.f10{font-size: 10px;}
.f11{font-size: 11px;}
.f12{font-size: 12px;}
.f13{font-size: 13px;}
.f14{font-size: 14px;}
.f15{font-size: 15px;}
.f16{font-size: 16px;}
.f17{font-size: 17px;}

:focus-visible {
    outline: none;
}
h4{
    color:var(--secondary-color);
}

/* ——— start footer ——— */

.site-footer__main {
    background-color: #2F2F2F;
    background-image: linear-gradient(156deg, #003366 28%, #000000 80%);
    background-position: left top;
    background-repeat: no-repeat;
    padding: 50px 0 0;
}

.site-footer__cols {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    padding-bottom: 50px;
}

.site-footer__col {
    flex: 0 0 16.6667%;
    max-width: 16.6667%;
}

.site-footer__col--wide {
    flex: 0 0 20%;
    max-width: 20%;
}

/* The brand column stays hard left; margin-right:auto soaks up all the spare
   space after it, pushing the four link columns across so the last one sits
   flush with the right edge of the container. */
.site-footer__col--brand {
    flex: 0 0 264px;
    max-width: 264px;
    margin-right: auto;
}

.site-footer__logo img {
    display: block;
    width: 226px;
    height: auto;
    /* Source lockup is dark navy; the footer needs the white version. */
    filter: brightness(0) invert(1);
}

.site-footer__social {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 18px;
}

.site-footer__social a {
    color: var(--white);
    font-size: 30px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.site-footer__social a:hover {
    color: var(--sky-blue);
}

.site-footer__heading {
    font-size: 19px;
    line-height: 25px;
    letter-spacing: 0px;
    font-family: var(--Font-Roboto);
    color: var(--white);
    margin-bottom: 10px;
    font-weight: 500;
}

.site-footer .site-footer__list li {
    margin: 0;
    padding: 0;
    line-height: 25px;
}

.site-footer__list li a {
    text-decoration: none;
    font-size: 15px;
    color: var(--white);
    font-weight: 300;
    font-family: var(--Font-Roboto);
    line-height: 22.5px;
}

.site-footer__list li a:hover{
    color: var(--sky-blue);
}

.site-footer__link:hover,
.site-footer__link:focus {
    color: var(--footer-link-hover);
}

.site-footer__link:focus-visible {
    outline: 2px solid var(--footer-link-hover);
    outline-offset: 2px;
}

.site-footer__bottom {
    background-color: #252525;
    padding: 20px 0 35px;
}

.site-footer__copyright {
    font-family: "Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
    color: #cccccc;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.02em;
    text-align: center;
}

.site-footer__sep {
    margin: 0 0.35rem;
    opacity: 0.7;
}
/* footer end */

/* header */


.site-header__nav {
    /*background: #00000080;*/
    padding: 14.5px 0;
}

.site-header.scrolled .site-header__nav {
    background: var(--white);
}

/* Default (top pe transparent) */

/* Scroll ke baad visible */
.site-header.scrolled .site-header__backdrop {
    opacity: 1;
}
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    color: var(--white);
    z-index: 9999;
}

/*NEW CSS 24 JUNE END*/

/* new dropdown
 */


.location_dd_main {
    text-align: left;
    border-radius: 14px;
     background: var(--white);
     color:var(--primary-color);
    backdrop-filter: brightness(0.5);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--header-dd-border-soft);
    box-shadow: var(--header-dd-shadow-hero), var(--header-dd-inset);
    overflow: hidden;
}


.location_dd_tab_content {
    color: var(--header-dd-text-body);
    min-height: 12rem;
    max-height: min(70vh, 28rem);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background-color:rgba(55,93,168,0.05);
}

.location_dd_region {
    border-radius: 0;
}

.location_dd_region-head {
    font-family: var(--Font-Roboto);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--header-dd-text-title);
    background-color: var(--header-dd-active);
    padding: 0.55rem 0.75rem;
    margin: 0;
}

.location_dd_region-list {
    padding: 20px 28px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
        /*background: rgba(55,93,168,0.05);*/
    color: var(--primary-color);

}

.location_dd_pills {
    padding: 8px 0;
    margin: 0 12px 0 8px;
    border-right: 1px solid var(--header-dd-rule-soft);
}

.location_dd_region-list li {
    margin-bottom: 0.35rem;
    width: 50%;
    padding: 8px 10px !important;
    border-radius: 10px;
}
.location_dd_region-list li:hover {
    background-color:#00336612;
}

.site-header.scrolled .location_dd_region-list li:hover {
    background-color:#1f5285;
}
.location_dd_region-list a {
    font-family: var(--Font-Roboto);
    font-size: 15px;
    font-weight: 400;
    color: var(--primary-color);
    text-decoration: none;
    line-height: 23px;
}

.location_dd_region-list a:hover,
.location_dd_region-list a:focus {
    color: var(--primary-color);
}

/* Fixed pin beside every clinic (design-data/location-pin-icons-24px): the
   outlined pin normally, the filled one while the row is hovered or the link
   has keyboard focus. Orange on the white panel, light blue once the header
   scrolls and the panel turns navy. Flex keeps a two-line name beside its
   pin rather than wrapping underneath it. */
.location_dd_region-list a {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}
.location_dd_pin {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    color: #FF8205;
}
.location_dd_pin--hover,
.location_dd_region-list li:hover .location_dd_pin,
.location_dd_region-list a:focus-visible .location_dd_pin {
    display: none;
}
.location_dd_region-list li:hover .location_dd_pin--hover,
.location_dd_region-list a:focus-visible .location_dd_pin--hover {
    display: block;
}
.site-header.scrolled .location_dd_pin {
    color: #B5D5F5;
}

.location_dd_pills .nav-item {
    margin-bottom: 0 !important;
    border-bottom: 1px solid var(--header-dd-rule-muted);
    padding:0px !important;
}

.location_dd_pills .nav-item:last-child {
    border-bottom: none;
}

.location_dd_item {
    font-family: var(--Font-Roboto);
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--primary-color) !important;
    padding: 14px 18px !important;
    background-color: transparent !important;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
    text-align: left;
    box-shadow: none !important;
    line-height:21px;
    margin-bottom:9px;
}

/*.site-header.scrolled .location_dd_item:hover,*/
/*.site-header.scrolled .location_dd_pills .nav-link.location_dd_item.active,.location_dd_item:hover,.location_dd_pills .nav-link.location_dd_item.active, .site-header.scrolled .location_dd_item:focus {*/
/*    background-color: #999b9e1c !important;*/
/*    color:var(--white) !important;*/
/*            border-radius:4px;*/

/*}*/

.location_dd_item:hover, .location_dd_item.active, .location_dd_item:focus{
        background-color: #00336612 !important;
        border-radius:10px;
            color:var(--primary-color) !important;


}
.site-header.scrolled .location_dd_item,.site-header.scrolled .location_dd_region-list a {
    color:var(--white) !important;
}

.site-header.scrolled .location_dd_item:hover {
        background-color: #1f5285 !important;
}

/* Services mega dropdown — full-width 4-column grid */
/* Bootstrap turns Popper off for dropdowns inside a .navbar, so these menus
   are placed by CSS alone, against the nearest positioned ancestor. For the
   Services item that was its own <li>, so the panel started at the Services
   link and ran off the right of the screen. Taking the <li> out of the chain
   anchors the panel to .site-header__bar (the header .container) instead:
   it spans the site width and lines up with the logo on the left. */
.site-header .site-header__dropdown--services {
    position: static;
}

.site-header .site-header__dropdown-menu--services,
.site-header .site-header__dropdown-menu--services[data-bs-popper] {
    left: 0;
    right: 0;
    /* auto = directly under the Services link, as the other menus sit.
       Bootstrap's [data-bs-popper] top:100% would now measure from the
       container and leave a gap on click. */
    top: auto;
    min-width: 0;
    max-width: none;
}

/* The mount is an <li> inside .navbar-nav, so it picks up the nav items'
   21px side padding and would inset the panel from the container edges.
   padding-top sets how far below the Services link the panel opens: each
   1px here moves it 1px. Padding rather than margin on purpose: the
   transparent strip belongs to the Services <li>, so hover holds while the
   pointer crosses the gap. */
.site-header .site-header__dropdown-menu--services > .site-header__dropdown-mount {
    padding-top: 20px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.site-header__dropdown-panel--services {
    padding: 1.25rem 1.5rem;
}

.site-header__services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
}

.site-header__services-grid-item {
    /* Flex row, not block: the icon is an inline <img> followed by the label,
       so on a two-line label the text used to wrap underneath the icon and
       the icon sat on the first line's baseline. As a flex row the icon
       centres on the item and a wrapped label stays beside it. */
    display: flex;
    align-items: center;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    font-weight: 500;
    color: var(--primary-color) !important;
    text-decoration: none;
    padding: 9px 21px;
    border-radius: 10px;
    transition: background-color 0.2s ease;
    line-height:21px;
}

/* The icon keeps its 22px however long the label is. The 8px gap to the text
   is the img's own inline margin-right, set in the header markup. */
.site-header__services-grid-item img {
    flex: 0 0 auto;
}

.site-header__services-grid-item:hover,
.site-header__services-grid-item:focus {
    background-color: #00336612;
    color: var(--primary-color) !important;
    text-decoration: none;
}

.site-header.scrolled .site-header__dropdown-panel--services {
    background: var(--header-dd-glass-scrolled);
    border: 1px solid var(--header-dd-border);
    box-shadow: var(--header-dd-shadow);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.site-header.scrolled .site-header__services-grid-item {
    color: var(--white) !important;

}
.site-header.scrolled .site-header__services-grid-item:hover, .site-header.scrolled .site-header__services-grid-item:focus {
        background-color: #1f5285;

}

/* Two-tone menu icons (Services and Products, frontend/partials/menu-icon):
   the dark version on the white panel, the regular light one once the
   header scrolls and the panel turns navy. Only rendered as a pair when both
   are uploaded; a lone icon has neither modifier and always shows. */
.site-header__menu-icon--light {
    display: none;
}

.site-header.scrolled .site-header__menu-icon--light {
    display: block;
}

.site-header.scrolled .site-header__menu-icon--dark {
    display: none;
}

/* Products mega dropdown — a narrower 3-column grid, kept as its own set of
   classes so it can be tuned independently of Services. See the Services
   block above for why the <li> goes static. */
.site-header .site-header__dropdown--products {
    position: static;
}

/* Pinned to the right edge of the header container, so it opens on the
   Products side of the nav and lines up with the Book Now button; width
   sets how far it reaches back to the left. */
.site-header .site-header__dropdown-menu--products,
.site-header .site-header__dropdown-menu--products[data-bs-popper] {
    left: auto;
    right: 0;
    top: auto;
    width: min(960px, 100%);
    min-width: 0;
    max-width: none;
}

/* padding-top: how far below the Products link the panel opens. */
.site-header .site-header__dropdown-menu--products > .site-header__dropdown-mount {
    padding-top: 20px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.site-header__dropdown-panel--products {
    padding: 1.25rem 1.5rem;
}

.site-header__products-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
}

/* Flex row so a wrapped label stays beside its icon (see Services item). */
.site-header__products-grid-item {
    display: flex;
    align-items: center;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    font-weight: 500;
    color: var(--primary-color) !important;
    text-decoration: none;
    padding: 9px 21px;
    border-radius: 10px;
    transition: background-color 0.2s ease;
    line-height: 21px;
}

.site-header__products-grid-item img {
    flex: 0 0 auto;
}

.site-header__products-grid-item:hover,
.site-header__products-grid-item:focus {
    background-color: #00336612;
    color: var(--primary-color) !important;
    text-decoration: none;
}

.site-header.scrolled .site-header__dropdown-panel--products {
    background: var(--header-dd-glass-scrolled);
    border: 1px solid var(--header-dd-border);
    box-shadow: var(--header-dd-shadow);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.site-header.scrolled .site-header__products-grid-item {
    color: var(--white) !important;
}

.site-header.scrolled .site-header__products-grid-item:hover,
.site-header.scrolled .site-header__products-grid-item:focus {
    background-color: #1f5285;
}
.about_content_block h1, .main_space_custom h1,.mainheading-block-center h1{
    color: var(--primary-color);
    font-weight: 600;
    font-family: var(--Font-Oswald);
    font-size: 48px;
    line-height:55px;
    margin-bottom:14px;
    text-transform: uppercase;
}
.about_content_block h2, .main_space_custom h2{
    color: var(--primary-color);
    font-size: 40px;
    line-height: 46px;
    font-weight: 500;
    letter-spacing: 0px;
}
.about_content_block h3, .main_space_custom h3{
    color: var(--primary-color);
    font-size: 35px;
    line-height: 50px;
    font-weight: 700;
    letter-spacing: 0px;
    /*margin:51px 0 15px;*/
}
.about_content_block h4, .main_space_custom h4{
    color: var(--secondary-color);
    font-size: 30px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0px;
}
.about_content_block a {
    /*font-size: 24px;*/
    color: var(--primary-color);
}
.about_content_block p {
    color: var(--text-para) !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    font-family:var(--Font-Roboto);
}
.services-inner-wrapper ul li{
       font-size: 18px;
    font-weight: 400;
    line-height: 26px;
}
.main_space_custom p {
    font-weight: 400;
    font-size: 18px;
    line-height: 26px;
    color: var(--text-para);
    margin-bottom:15px;
}
.services_block {
    background-color: rgba(55,93,168,0.05);
    border-radius: 12px;
    border:1px solid rgba(96,96,96,0.3);
    padding: 38px 9px 27px 17px;
}
.services_block ul {
    padding-left: 36px;
    margin-top: 26px;
}
.services_block li a {
    font-size: 16px;
    color: var(--primary-color);
    font-weight: 400;
    font-family: var(--Font-Roboto);
    word-break: break-word;
    text-decoration: none;
    line-height:26px;
    border-radius:6px;
    padding: 5px 10px;
}
.services_block li a:hover {
    color: #474747;
    background-color: #e5eaf4;
    background-color: #e5eaf4;
    border-radius: 6px;
    opacity: 1;
    padding: 5px 10px;


}
.services_block li{
    margin-bottom:10px;
}
.services_block h3 {
    color: var(--primary-color);
    font-size: 40px;
    line-height: 48px;
    font-weight: 500;
    letter-spacing: 0px;
    margin-bottom:15px;
}
.forms_block {
    background-color: var(--primary-color);
    border-radius: 7px;
    padding: 3px 12px;
    margin-bottom: 12px;
}
.forms_block h2 a {
    color: var(--white);
    font-size: 20px;
    text-decoration: none;
}
.about_inner_main {
    background: url("../new_img/bg_inner_about.jpg");
    background-repeat: no-repeat;
    background-position: top left;
    background-size:cover;
    height: 225px;
    position:relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
}
.about_inner_main h1 {
    font-size: 48px;
    letter-spacing: 2px;
    font-weight: 600;
    text-transform: uppercase;
    text-shadow: 2px 2px 5px #000000;
    position:relative;
    z-index:1;
}
.bg-img-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.59) 100%);
    top: 0;
    left: 0;
}
div.homebutblock .homethreebthblock {
    padding: 12px 6px;
    width: 100%;
    background-color: #f9f9fb;
    border: 1px solid #cfcfcf;
    margin:auto;
}
.homebutblock .homethreebthblock .appointmentbtn > a {
    color: #535353;
    font-size: 12px;
    line-height: 15px;
    padding: 10px 17px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    border: 1px solid #cfcfcf;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 7px;
    margin: auto;
    justify-content: center;
}
.bookappointmentbtn a {
    color: #fff;
    font-size: 12px;
    line-height: 15px;
    padding: 10px 17px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    border: 0;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 7px;
    margin: auto;
    justify-content: center;
    background-color: var(--primary-color);
}
#fl_survey_button {
    display: none;
}
.contact_links_cus {
    font-size: 16px !important;
    line-height: 30px;
}
.about_content_block > br {
    display: none;
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
    width: 100%;
    padding-right: var(--bs-gutter-x, .75rem);
    padding-left: var(--bs-gutter-x, .75rem);
    margin-right: auto;
    margin-left: auto
}

.video_inner_wrapper:hover{
    background-color:rgba(55,93,168,0.15);
}
.video_inner_wrapper {
    padding: 24px 15px 40px;
    transition: 0.9s;
    border-radius: 15px;
    text-align: center;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;

}
.video_inner_wrapper .vidtext {
    font-size: 16px;
    color: var(--text-para);
    font-weight: 400;
    margin: 27px 0 29px;
    font-family: var( --Font-Roboto);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: auto;

}

.blue_btn {
    background-color: #2196f3;
    text-decoration: none;
    color: #fff !important;
    padding: 8.8px 20px;
    font-size: 15px !important;
    margin-top: 13px;
    border-radius: 5px;
    font-family: var( --Font-Roboto);
    font-weight: 400;
    width: 100%;
    line-height: 18px;
}
.blue_btn:hover {
    background-color: var(--orange);
}
.back_video_btn a {
    font-weight: 400;
    font-family: var(--Font-Oswald);
    text-decoration: none;
}

.video_inner_wrapper .ux-thumb-wrap {
    display: block;
    overflow: hidden; /* important */
    border-radius:15px;
}

.video_inner_wrapper .ux-thumb-wrap img {
       height: 234px;
    width: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
    border-radius:15px;
}

.video_inner_wrapper .ux-thumb-wrap:hover img {
    transform: scale(1.1);
}
.custom-accordion .accordion-item {
    border: 1px solid #e5e5e5;
    margin-bottom: 10px;
    border-radius: 6px;
    overflow: hidden;
}

.custom-accordion-btn {
    display: flex;
    align-items: center;
    color: var(--black);
    font-size: 18px;
    font-family: var(--Font-Oswald);
    font-weight: 400;
    text-transform: uppercase;
    box-shadow: 0 0 0 0 #FFFFFF;
    background: #FFFFFF;
    padding: 14px 14px 14px 60px;
    border-color: rgba(148, 148, 148, 0.31) !important;;
    border-radius:5px !important;
    line-height:26px;
}

.custom-accordion .accordion-button:not(.collapsed) {
    color: var(--orange) !important;
}
.custom-accordion .accordion-button::after {
    display: none;
}

/* + icon */
.custom-accordion-btn::before {
    content: "\f067";
    color: var(--orange);
    font-size: 15px;
    margin-right: 15px;
    width: 49px;
    height: 100%;
    border-right: 1px solid rgba(148,148,148,0.31);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    display: flex;
    margin: auto;
    justify-content: center;
    align-items: center;
    font-family: 'FontAwesome';

}

/* − icon when open */
.custom-accordion-btn:not(.collapsed)::before {
     content: "\f068";
       color: var(--orange);
    font-size: 15px;
    margin-right: 15px;
    margin-right: 15px;
    width: 49px;
    height: 100%;
    border-right: 1px solid rgba(148,148,148,0.31);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    display: flex;
    margin: auto;
    justify-content: center;
    align-items: center;
    font-family: 'FontAwesome';

}

.custom-accordion .accordion-button:not(.collapsed) {
    background: transparent;
    color: var(--orange);
    box-shadow: none !important;
    border-bottom: 1px solid;
    border-radius: 0 !important;
}

.custom-accordion .accordion-body {
    background: #fff;
    padding: 20px;
    border-top: 1px solid rgba(148, 148, 148, 0.31);
}
.accordion_body_a{
    font-size:16px !important;
    color: var(--text-para) !important;
    font-family:var(--Font-Roboto);
        text-decoration: none;
}

/* CARD DESIGN */
.team-card {
    padding: 10px 19.5px;
}

.team-img img {
    max-width: 100%;
    height: 201.2px;
    width:201.2px;
    object-fit: contain;
    text-align: center;
    margin: auto;
    display: flex;
    justify-content: center;
}

.btn-book {
    background-color: var(--primary-color);
    padding: 6px 30px;
    border-radius: 6px;
    font-weight: 500;
    color: var(--white) !important;
    border: 1px solid var(--primary-color);
    font-size: 16px !important;

}
.btn-book:hover {
    background-color: var(--white);
    color: var(--primary-color) !important;
    border:1px solid var(--primary-color);
}

.team-name {
font-size: 16px;
    font-weight: 500;
    line-height: 23px;
    color:#000;
        font-family:var(--Font-Oswald);
        margin-top:14px;
        margin-bottom:10px;
            text-align:center;


}

.team-card .team-role {
    font-size: 16px !important;
    color: var(--text-para) !important;
    margin-bottom: 5px;
    font-weight:400 !important;
    line-height:25px !important;
    color:#5e5f60 !important;
text-align:center !important;

}


.view-bio {
    font-size: 16px !important;
    color: #2196f3 !important;
    font-weight: 500;
    text-decoration: none;
    line-height: 26px;
    background-color: transparent;
    padding: 5px 5px;
    width: 100%;
    display: block;
    border-radius: 4px;
    text-align:center;
}
.view-bio:hover {
    background-color: #daecfe;
}
.btn-closed {
    position: absolute;
    right: -9px;
    top: -11px;
    background: #00000096;
    color: #fff;
    font-size: 16px;
    border: 1px solid #fff;
    border-radius: 100px;
    height: 30px;
    width: 30px;
    display: flex;
    margin: auto;
    justify-content: center;
    align-items: center;
}
.member_bio_inner_left {
border-radius: 12px;
    border: 2px solid rgba(152, 152, 152, 0.34);
    position: relative;
    height: 450px;
}
.member_bio_inner_left .media-object {
    max-width: 100%;
    height: 100%;
    object-fit: contain;
    padding-top: 45px;
}
.member_bio_inner_left a {
    position: absolute;
    bottom: 0;
    display: flex;
    margin: auto;
    justify-content: center;
    align-items: center;
    left: 0;
    right: 0;
    height: 450px;
}
.lang_text_cus {
    font-size: 22px;
    font-weight: 600;
    color: #111111;
}
.found_dec_cus{
    font-size:20px;
}
.orange-btn {
    font-size: 18px;
    border-radius: 20px 20px 20px 20px;
    background-color:  var(--orange);
    color: #fff !important;
    padding: 16.5px 20px;
    text-decoration: none;
}
.orange-btn:hover {
background-color:#E36100;

}
.darkblue-btn {
    font-size: 18px;
    border-radius: 20px 20px 20px 20px;
    background-color:var(--primary-color);
    color: #fff !important;
    padding: 16.5px 30px;
    text-decoration: none;
}
.darkblue-btn:hover {
    background-color:#014E9A;
}
/*loaction page*/
.clinic-hours-grid {
  clear: both;
  width: 100%;
  text-align: left;
}
.clinic-hours-row > [class*="col-"] {
  margin-bottom: 0.75rem;
}
.clinic-hours-title {
  color: #2f55aa;
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 0 0.25rem 0;
}
.clinic-hours-day-label {
  font-weight: 600;
  color: #333;
  font-size: 15px;
  line-height: 1.35;
  margin-bottom: 0.2rem;
}
/*.clinic-hours-time {*/
/*  color: #ed940c;*/
/*  font-size: 15px;*/
/*  line-height: 1.35;*/
/*}*/
/*.clinic-hours-grid h3{*/
/*    font-size: 32px;*/
/*}*/
.ac-location-band__title {
    font-size: 24px;
    font-family:var(--Font-Oswald);
    font-weight: 600;
    color: var(--primary-color);
    line-height:55px;
}

/*.park_list_custom{*/
/*    height:320px;*/
/*    overflow-y:scroll;*/
/*}*/
.video_inner_iframe iframe {
    max-width: 100%;
    width: 100%;
}

.about_content_block h3 a {
    font-size: 21px;
}
.about_mainblock{
    padding-top: 73px;
}
.mainheading-block-center h1 {
    margin-bottom: 60px;
    text-transform: uppercase;
}

  .site-header__dropdown--hover:hover > .dropdown-menu {
    display: block;
    margin-top: 0;
    opacity: 1;
    visibility: visible;
  }



/*location page*/
ac-location-page {
    overflow-x: hidden;
}

.ac-location-hero__title {
    text-align: center;
    font-size: clamp(1.75rem, 4vw, 2.35rem);
    line-height: 1.2;
    font-weight: 800;
    color: #111;
    margin: 0 auto 2.25rem;
    max-width: 56rem;
    font-family: var(--Font-Oswald), system-ui, sans-serif;
}
.ac-location-hero__address {
    text-align: left;
    margin-bottom: 1.25rem;
}
.ac-location-hero__address-line {
    font-size: 33px;
    color: #5a5a5a;
    line-height: 41px;
    font-family: var(--Font-Roboto);
    font-weight: 500;
}

.ac-location-hero__action-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem 0.75rem;
    padding-top: 0.25rem;
    margin-bottom: 1.25rem;
}
.ac-location-hero__tab-triggers {
    flex-basis: auto;
}
.ac-location-hero__action-bar .orange-btn {
    background-color: var(--orange);
    color: #fff !important;
    padding: 11px 20px;
    text-decoration: none;
    font-size: 16px;
    border: 2.5px solid var(--orange);
    border-radius: 15px;
    line-height:19px;
}
.ac-location-hero__action-bar .orange-btn:hover {
    background-color: #E75100;
    border-color:#E75100;
}
.ac-location-hero__action-bar .darkblue-btn {
    color: #fff !important;
    padding: 11px 20px;
    text-decoration: none;
    background-color: var(--primary-color);
    font-size: 16px;
   border: 2.5px solid var(--primary-color);
border-radius: 15px;        line-height:19px;

}
.ac-location-hero__action-bar .darkblue-btn:hover {
    background-color: #014E9A;
     border-color: #014E9A;
}

.ac-location-hero__contact {
    font-size: 24px;
    font-weight: 500;
    color: #000;
    margin-bottom: 1.5rem;
    line-height: 26px;
    font-family: var(--Font-Roboto);
    display:flex;
}
.ac-location-hero__contact-link {
    color: inherit;
    text-decoration: none;
}
.ac-location-hero__contact-link:hover {
    color: var(--primary-color);
}
.ac-location-hero__contact-sep::before {
    content: "";
    display: inline-block;
    width: 1px;
    height: 0.85em;
    margin: 0 0.65rem;
    background: #ccc;
    vertical-align: middle;
}
.ac-location-hero__hours-heading {
    font-size: 32px;
    font-weight: 500;
    line-height:37px;
    color: var(--primary-color);
    margin-bottom: 33px;
    font-family: var(--Font-Oswald);
}
.ac-location-hero__hours .clinic-hours-day-label {
    font-weight: 500;
    color: var(--text-para);
    font-size: 16px;
    text-transform: capitalize;
    letter-spacing: 0.02em;
    line-height: 18px;
    font-family: var(--Font-Roboto);
    margin-bottom:14px;
}
.ac-location-hero__hours .clinic-hours-time {
    font-size: 16px;
    font-weight: 500;
    color: var(--orange);
    line-height: 22px;
}
.ac-location-hero__figure {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
    background: #f0f0f0;
}
.ac-location-hero__img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 200px;
    object-fit: cover;
    aspect-ratio: 4 / 3;
}
.ac-location-band {
    background: #f4f7fa;
}
.ac-location-band__inner li {
    color: #474747;
    font-size: 18px;
    line-height:21px;
    font-weight:400;
    font-family: var(--Font-Roboto);
        margin-bottom: 10px;
    list-style-type: disc !important;
}

,.ac-location-band__inner li span,.ac-location-band__inner li p, .ac-location-band__inner p  {
    color: #474747;
    font-size: 16px;
    line-height:24px;
    font-weight:400;
    font-family: var(--Font-Roboto);
        margin-bottom: 10px;
}
.ac-location-map-wrap {
    margin-top: 1.5rem;
    overflow: hidden;
    position:relative;
    bottom:-50px;
}

.ac-location-team-outer {
    padding: 2.5rem 0 3rem;
    background: #fff;
}
/*.ac-location-team-container .custom-accordion-btn .title {*/
/*    font-weight: 700;*/
/*    color: #3a3a3a;*/
/*    letter-spacing: 0.04em;*/
/*}*/
.ac-location-page-heading {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 800;
    color: #111;
    margin: 0 0 0.5rem;
    font-family: var(--Font-Oswald), system-ui, sans-serif;
    text-align: left;
}
/*.clinic-hours-separator {*/
/*    border: 0;*/
/*    border-top: 1px solid #e5e5e5;*/
/*    margin: 0.75rem 0 0.9rem;*/
/*    opacity: 1;*/
/*}*/
/* 1st column → Monday, Tuesday (2 items) */
.clinic-hours-row > div:nth-child(1) .clinic-hours-block:first-child {
    border-bottom: 1px dashed rgba(0,0,0,.08);
    padding-bottom: 15px;
    margin-bottom: 16px;
}

/* 2nd column → only first item (Wednesday = 3rd overall) */
.clinic-hours-row > div:nth-child(2) .clinic-hours-block:first-child {
    border-bottom: 1px dashed rgba(0,0,0,.08);
    padding-bottom: 15px;
    margin-bottom: 16px;
}
/* 2nd column → only first item (Wednesday = 3rd overall) */
.clinic-hours-row > div:nth-child(3) .clinic-hours-block:first-child {
    border-bottom: 1px dashed rgba(0,0,0,.08);
    padding-bottom: 15px;
    margin-bottom: 16px;
}
.video_inner_iframe iframe {
    max-width: 100%;
    width: 100%;
}
.img_block {
    /*max-width: 600px;*/
    width: 100%;
    height: 450px;
}
.img_block img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 15px !important;
}

.about_content_block h3 a {
    font-size: 21px;
}

  /*.site-header__dropdown--hover:hover > .dropdown-menu {*/
  /*  display: block;*/
  /*  margin-top: 0;*/
  /*  opacity: 1;*/
  /*  visibility: visible;*/
  /*}*/

  .site-header__dropdown-menu {
    display: none;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
  }
.biography_block  p {
    color: var(--text-para);
    font-family:var(--Font-Roboto);
    line-height:26px;
}
.our-team-descri-cus p {
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: var(--text-para) !important;
}
input#doctorSearch {
    height: 48px;
    font-size: 16px;
    font-family: var(--Font-Roboto);
    font-weight: 400;
    line-height: 26px;
    color: var(--text-para);
    margin: 29px 0 34px;
}
input#doctorSearch:focus{
    outline:0;
    box-shadow:unset;
    border-color:#ced4da;
}
.services-inner-wrapper h2, .services-inner-wrapper h4{
    margin-bottom: 15px;
}
.services-inner-wrapper img {
    margin: 23px 0;
}
.services-inner-wrapper h2 + a {
    display: inline-block;
    margin-bottom: 10px;
}
.services-inner-wrapper a {
    display:block;
}
.services-inner-box-design {
    display: flex;
    margin-bottom: 20px;
}

.services-inner-box-design-image img {
    border: 1px solid #ccc;
    margin: 5px 10px 5px 0;
}

.services-inner-box-design-text {
    flex: 1;
}
.services-inner-box-design-text a {
    margin-bottom: 10px;
    font-weight: 600;
    font-family: var(--Font-Family);
}
.services-inner-wrapper ul li {
    font-family: var(--Font-Roboto);
    color: #474747;
}

.video_inner_wrapper .ux-thumb-wrap img {
    height: auto !important;
}

/* LEFT SLIDE ANIMATION */
.fade-left {
  opacity: 0;
  transform: translateX(-50px);
  animation: fadeLeftAnim 0.8s ease forwards;
}

/* KEYFRAME */
@keyframes fadeLeftAnim {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* DELAY CLASSES (one by one effect) */
.delay-1 { animation-delay: 0.2s; }
.delay-2 { animation-delay: 0.4s; }
.delay-3 { animation-delay: 0.6s; }
.delay-4 { animation-delay: 0.8s; }
.delay-5 { animation-delay: 1s; }
.delay-6 { animation-delay: 1.2s; }

.fade-top {
  opacity: 0;
  transform: translateY(-60px); /* upar se start hoga */
  transition: all 0.8s ease;
}

.fade-top.show {
  opacity: 1;
  transform: translateY(0);
}

/* delay (one by one) */
.delaytop-1 { transition-delay: 0.3s; }
.delaytop-2 { transition-delay: 0.5s; }
.delaytop-3 { transition-delay: 0.7s; }
.delaytop-4 { transition-delay: 0.9s; }



#owl-carousel-location .owl-stage-outer {
  position: relative;
}

#owl-carousel-location .owl-nav {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  pointer-events: none; /* important */
  opacity: 0;
  transition: 0.3s;
}

#owl-carousel-location:hover .owl-nav {
  opacity: 1;
}

/* buttons */
#owl-carousel-location .owl-nav button {
  pointer-events: all;
  background: var(--primary-color) !important;
  color: #fff !important;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  font-size: 22px;
}

/* thoda andar spacing */
#owl-carousel-location .owl-prev {
  margin-left: -24px;
}

#owl-carousel-location .owl-next {
  margin-right: -24px;
}
/* disabled state */
#owl-carousel-location .owl-nav button.disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

/* initial hidden state */
.fade-right {
  opacity: 0;
  transform: translateX(80px); /* right se start */
  transition: all 0.8s ease;
}

/* jab visible ho */
.fade-right.show {
  opacity: 1;
  transform: translateX(0);
}

.abouts-insurance-logos img {
    max-height: 70px;
    object-fit: contain;
    width: 100%;
    max-width: 200px;
    margin: 0px 10px 24px;
}
.ac-location-team-container {
    font-size: 18px;
    line-height:25px;
    font-weight:400;
}

.read-more-content {
    max-height: 270px;
    overflow: hidden;
    position: relative;
    transition: max-height 0.4s ease;
    font-size:18px;
}



/* expanded */
.read-more-wrapper.active .read-more-content {
    max-height: 1000px;
}

.read-more-wrapper.active .read-more-content::after {
    display: none;
}

/* button */
.read-more-btn {
    border: none;
    background: none;
    cursor: pointer;
    margin-top: 10px;
text-decoration: underline;
    padding-left: 4px;
    transition: transform 0.3s ease;
        color: var(--primary-color);
    font-weight: 600;
    font-size: 16px;
    font-family: var(--Font-Roboto);
    box-shadow:none;
    text-transform:capitalize;
}

/* rotate icon */
.read-more-wrapper.active .read-more-btn .icon {
    transform: rotate(180deg);
    display: inline-block;
}
.ac-location-band ul li {
    list-style-type: disc !important;
}
.location-section {
  padding: 80px 0;
  background: #f5f5f5;
}

/* LEFT */
.location-icon {
  width: 70px;
  margin-right: 25px;
}

.location-content {
  max-width: 500px;
}

.location-title {
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #333;
}

.location-text {
    font-size: 16px;
    line-height: 22px;
    color: #5c5c4c;
    font-weight: 400;
}
/* RIGHT BUTTONS */
.btn-find {
  display: block;
  width: 280px;
  margin: 0 auto 20px;
  padding: 14px;
  background: #0c3c6c;
  color: #fff;
  border-radius: 40px;
  font-size: 20px;
  text-align: center;
  text-decoration: none;
}

.btn-book {
  display: block;
  width: 280px;
  margin: 0 auto;
  padding: 14px;
  background: #f58220;
  color: #fff;
  border-radius: 40px;
  font-size: 20px;
  text-align: center;
  text-decoration: none;
}

/* HOVER */
.btn-find:hover {
  background: #082c4d;
}

.btn-book:hover {
  background: #d96d10;
}

/*loaction page css*/
.loc-input-group{
  font-family: var(--Font-Roboto);
    font-size: 19px;
    color: rgb(38, 38, 38);
    background: #ffffff;
    border: 1px solid #b4b4b4 !important;
    border-radius: 10px !important;
    padding: 10px 45px 10px 14px;
    outline: none;
    box-sizing: border-box;
    height: 50px;
    min-width: 1200px;
    width: 100%;
}
.search-icon-loc {
    position: absolute;
    top: 0;
    right: 16px;
    height: 100%;
    display: flex;
    align-items: center;
    pointer-events: none;
}
.location-card h4 {
    font-size: 22px;
}

.location-card .btn {
    border-radius: 10px;
    padding: 10px;
}
.loc-img-hover-zoom {
    overflow: hidden;
    border-radius: 10px; /* optional for rounded look */
     width: 100%;
    height: 229px;
    object-fit:cover;
    margin-bottom: 40px;

}

.loc-img-hover-zoom img {
    width: 100%;
    transition: transform 0.4s ease;
       width:100%;
   height:100%;
    object-fit:cover;
}

.loc-img-hover-zoom:hover img {
    transform: scale(1.1);
}
.loca-accor-data-card h3 {
    font-size: 32px;
    font-weight: 400;
    color: var(--secondary-color);
    font-family: var(--Font-Oswald);
    line-height: 40px;
    display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-height: 78px;
}
.address-loc-text {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: #262626;
    display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
      margin: 11px 0 13px;

}
.loc-btn {
    font-family: var(--Font-Roboto);
    font-weight: 400;
    width: 100%;
    display: block;
    color: #fff !important;
    background: #2096f3;
    border-radius: 12px;
    font-size: 20px;
    text-decoration: none;
    padding: 12px 32px;
}
.loc-btn:hover {
    background: #ff9605;
}
.loca-accor-data-card {
    padding: 0px 5.4px;
}
.view-clinic-loc{
    font-family: var(--Font-Roboto);
    color: var(--primary-color) !important;
    font-size:18px;
    font-weight: 500;
    line-height:26px;
    text-decoration:none;
    padding: 14px 0 20px !important;
    display: block;


}
.view-clinic-loc-image{
   height:229px;
}
.view-clinic-loc:hover{
    color:#2196F3 !important;
}
.location-card-new {
    margin: 0px 8px !important;
}

/* Accordion main */

.location-custom-accordion .accordion-item{
    border:none;
    background:transparent;
    border-bottom: 1px solid #b4b4b4 !important;
    border-radius:0;
}

/* remove bootstrap icon */

.location-custom-accordion .accordion-button::after{
display:none;
}

.location-custom-accordion-btn{
background:transparent !important;
padding:22px 0 !important;
display:flex;
justify-content:space-between;
align-items:center;
box-shadow:none !important;
border:none !important;
}
/* text */
.location-custom-accordion-btn .title {
    font-size: 52px;
    font-weight: 500;
    line-height: 60px;
    color: #3e3e3e;
    font-family: var(--Font-Roboto);;
}
/* remove blue background */

.location-custom-accordion-button:not(.collapsed),
.location-custom-accordion-btn:not(.collapsed){
background:transparent !important;
box-shadow:none !important;
}

/* icon */
.custom-arrow{
font-size:30px;
color:#003366;
transition:.4s ease;
}
/* rotate when open */
.location-custom-accordion-btn:not(.collapsed) .custom-arrow{
transform:rotate(180deg);
}

/* ==========================================================================
   Find a clinic — locations listing (frontend/locations/index.blade.php)
   ========================================================================== */
.clinics-index {
    padding: 60px 0 90px;
}

.clinics-index__title {
    font-family: var(--Font-Oswald);
    font-size: 48px;
    font-weight: 600;
    line-height: 55px;
    text-transform: uppercase;
    color: var(--primary-color);
    text-align: center;
    margin: 0 0 40px;
}

.clinics-search {
    max-width: 1300px;
    margin: 0 auto 50px;
}

.clinics-search__input {
    width: 100%;
    padding: 14px 20px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    color: var(--text-para);
    background: var(--white);
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    outline: none;
}

.clinics-search__input::placeholder {
    color: #8a8a8a;
}

.clinics-search__input:focus {
    border-color: var(--sky-blue);
    box-shadow: 0 0 0 3px rgba(77, 155, 217, 0.18);
}

.clinics-search__empty {
    margin: 16px 2px 0;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    color: var(--gray);
}

.clinics-region__header {
    margin: 0;
}

.clinics-region__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 22px 4px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #b4b4b4;
    font-family: var(--Font-Roboto);
    font-size: 52px;
    font-weight: 500;
    line-height: 60px;
    color: var(--secondary-color);
    text-align: left;
    cursor: pointer;
}

/* Triangle points down when the region is closed, up when it is open. */
.clinics-region__chevron {
    flex: 0 0 auto;
    width: 0;
    height: 0;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    border-top: 11px solid var(--primary-color);
    transition: transform 0.2s ease;
}

.clinics-region__btn:not(.collapsed) .clinics-region__chevron {
    transform: rotate(180deg);
}

.clinics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 40px 30px;
    padding: 40px 0 50px;
}

.clinic-card {
    display: flex;
    flex-direction: column;
    text-align: center;
}

.clinic-card__media {
    display: block;
    overflow: hidden;
    border-radius: 10px;
    background: #eef1f4;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

.clinic-card__media img,
.clinic-card__media--empty {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.clinic-card__media img {
    transition: transform 0.3s ease;
}

.clinic-card:hover .clinic-card__media img {
    transform: scale(1.04);
}

/* min-height reserves room for two-line names so the address, button and
   link below stay aligned across every card in a row. */
.clinic-card__name {
    margin: 22px 0 0;
    min-height: 78px;
    font-family: var(--Font-Oswald);
    font-size: 32px;
    font-weight: 400;
    line-height: 1.35;
    color: var(--secondary-color);
}

.clinic-card__name a {
    color: inherit;
    text-decoration: none;
}

.clinic-card__name a:hover {
    color: var(--primary-color);
}

/* Long site names clamp to two lines so every card keeps the same rhythm. */
.clinic-card__address {
    margin: 14px 0 0;
    font-family: var(--Font-Roboto);
    font-size: 15px;
    line-height: 1.6;
    color: #555555;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.clinic-card__book {
    display: block;
    margin-top: 18px;
    padding: 13px 16px;
    border-radius: 6px;
    background: #2196F3;
    color: var(--white);
    font-family: var(--Font-Roboto);
    font-size: 17px;
    font-weight: 400;
    line-height: 1.2;
    text-decoration: none;
    transition: background 0.2s ease;
}

.clinic-card__book:hover {
    background: #1579c8;
    color: var(--white);
}

.clinic-card__view {
    display: block;
    margin-top: 16px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-color);
    text-decoration: none;
}

.clinic-card__view:hover {
    text-decoration: underline;
}

.clinics-index__none {
    font-family: var(--Font-Roboto);
    color: var(--gray);
    text-align: center;
    padding: 40px 0;
}

/* ==========================================================================
   Product listing — category page (frontend/products/category.blade.php)
   ========================================================================== */
.product-list {
    padding: 55px 0 90px;
}

.product-list__title {
    font-family: var(--Font-Oswald);
    font-size: 48px;
    font-weight: 600;
    line-height: 55px;
    margin: 0 0 34px;
}

.product-list__title-main {
    color: var(--primary-color);
    text-transform: uppercase;
}

.product-list__title-sub {
    color: #6b6b6b;
    font-weight: 400;
}

.product-list__tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin-bottom: 44px;
}

.product-list__search {
    position: relative;
    flex: 1 1 420px;
}

.product-list__search-input {
    width: 100%;
    padding: 13px 46px 13px 18px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    color: var(--text-para);
    background: var(--white);
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    outline: none;
}

.product-list__search-input::placeholder {
    color: #8a8a8a;
}

.product-list__search-input:focus {
    border-color: var(--sky-blue);
    box-shadow: 0 0 0 3px rgba(77, 155, 217, 0.18);
}

.product-list__search-icon {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    color: #6b6b6b;
    pointer-events: none;
}

.product-list__select {
    padding: 13px 16px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    color: var(--text-para);
    background: var(--white);
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    outline: none;
    cursor: pointer;
}

.product-list__intro {
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 1.7;
    color: var(--text-para);
    margin-bottom: 34px;
}

.product-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
}

.product-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 50px 24px 30px;
    background: rgba(55,93,168,0.1);
    border-radius: 12px;
    text-decoration: none;
    transition: box-shadow 0.2s ease;
}

.product-card:hover {
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.12);
}

/* White well the product photo sits in. */
.product-card__media {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80%;
    aspect-ratio: 1 / 1;
    padding: 14px;
    background: var(--white);
    border-radius: 10px;
    overflow: hidden;
}

.product-card__media img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.product-card__name {
    margin-top: 22px;
    font-family: var(--Font-Oswald);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--primary-color);
    text-align: center;
}

.product-card__meta {
    margin-top: 8px;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    line-height: 1.5;
    color: #6b6b6b;
    text-align: center;
}

.product-list__none {
    font-family: var(--Font-Roboto);
    color: var(--gray);
    padding: 30px 0;
}

/* ==========================================================================
   Product detail (frontend/products/show.blade.php)
   Values measured from stage.athletescare.com/index.php/products-description/
   ========================================================================== */
.product-detail__category {
    padding: 35px 0;
}

.product-detail__category-title {
    font-family: var(--Font-Oswald);
    font-size: 48px;
    font-weight: 600;
    line-height: 55px;
    text-transform: uppercase;
    color: var(--primary-color);
    text-align: center;
    margin: 0;
}

.product-detail__category-title a {
    color: inherit;
    text-decoration: none;
}

.product-detail__category-title a:hover {
    text-decoration: underline;
}

.product-detail__main {
    background-color: rgba(55, 93, 168, 0.1);
    padding: 110px 0 151px;
}

.product-detail__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 40px;
}

.product-detail__media {
    display: flex;
    align-items: flex-end;
    justify-content: end;
}

.product-detail__media img {
    display: block;
    width: 500px;
    max-width: 100%;
    height: auto;
    border: 1px solid rgba(193, 193, 193, 0.49);
    border-radius: 14px;
}

.product-detail__media--empty {
    display: block;
    width: 500px;
    max-width: 100%;
    aspect-ratio: 1 / 1;
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(193, 193, 193, 0.49);
    border-radius: 14px;
}

.product-detail__info {
    padding-left: 54px;
}

.product-detail__name {
    font-family: var(--Font-Oswald);
    font-size: 35px;
    font-weight: 600;
    line-height: 1.15;
    color: var(--primary-color);
    margin: 0 0 14px;
}

.product-detail__tagline {
    font-family: var(--Font-Roboto);
    font-size: 19px;
    font-weight: 500;
    line-height: 25px;
    color: #111111;
    margin: 0 0 22px;
}

.product-detail__conditions {
    font-family: var(--Font-Roboto);
    font-size: 19px;
    font-weight: 400;
    line-height: 26px;
    color: var(--text-para);
    margin: 0 0 15px;
}

.product-detail__conditions strong {
    font-weight: 700;
}

.product-detail__description,
.product-detail__description p {
    font-family: var(--Font-Roboto);
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: var(--text-para);
    margin: 0 0 15px;
}

.product-detail__services-label {
    font-family: var(--Font-Roboto);
    font-size: 19px;
    font-weight: 600;
    line-height: 26px;
    color: var(--text-para);
    margin: 34px 0 15px;
}

.product-detail__services {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.product-detail__service,
.associated-products__item {
    display: inline-flex;
    align-items: center;
    padding: 12px 20px;
    border-radius: 5px;
    background: rgba(112, 147, 188, 0.15);
    font-family: var(--Font-Roboto);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2;
    color: #606060;
}

/* The chips are links to the service pages; keep the chip look, lose the
   underline until hover. */
a.product-detail__service,
a.associated-products__item {
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}

a.product-detail__service:hover,
a.product-detail__service:focus,
a.associated-products__item:hover,
a.associated-products__item:focus {
    background: #3461A5;
    color: var(--white);
}

/* "Associated Products" sits above the services list inside the same sidebar
   card. Same chips as the service buttons on a product page; the list just
   wraps in a narrower column. The top margin matches the spacing
   .services_block ul puts under its own heading, and the bottom margin
   separates it from the "Services Offered" heading that follows. */
/* Its own size and colour: smaller and black, so "Services Offered" below it
   still reads as the sidebar's main heading.

   Scoped to .services_block on purpose. ".services_block h3" is a class plus
   an element, so it outranks a bare class and would win at every width —
   including the responsive overrides further down that drop the heading to
   39px and 28px. */
.services_block h3.associated-products__title {
    font-size: 32px;
    line-height: 40px;
    color: var(--black);
}

.associated-products__list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 26px 0 38px;
    padding-left: 8px;
}

/* ==========================================================================
   Links section landing page (frontend/content/links.blade.php)
   ========================================================================== */
.content-links {
    list-style: none;
    margin: 24px 0 0;
    padding: 0;
}

.content-links__item {
    border-bottom: 1px solid #e2e2e2;
}

.content-links__link {
    display: block;
    padding: 14px 2px;
    font-family: var(--Font-Roboto);
    font-size: 17px;
    font-weight: 500;
    color: var(--primary-color);
    text-decoration: none;
}

.content-links__link:hover {
    color: var(--sky-blue);
    text-decoration: underline;
}

/* Child-page list on the Newsletter and Media landing pages — same rows as
   .content-links, with a heading that separates them from the editable copy. */
.content-listing__title {
    margin: 34px 0 0;
    font-family: var(--Font-Roboto);
    font-size: 24px;
    font-weight: 600;
    color: var(--primary-color);
}

.content-listing {
    margin-top: 12px;
    border-top: 1px solid #e2e2e2;
}

.content-article__back {
    margin-top: 34px;
    padding-top: 18px;
    border-top: 1px solid #e2e2e2;
}

/* ==========================================================================
   Breadcrumbs (partials/breadcrumbs.blade.php)
   ========================================================================== */
.ac-breadcrumb {
    margin: 0 0 18px;
}

.ac-breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    line-height: 1.4;
}

.ac-breadcrumb__item {
    display: flex;
    align-items: center;
    gap: 6px 10px;
}

/* The separator belongs to the trail, not the copy, so it is drawn rather
   than written into the markup where a screen reader would read it out. */
.ac-breadcrumb__item + .ac-breadcrumb__item::before {
    content: "\203A";
    color: #9a9a9a;
}

.ac-breadcrumb__link {
    color: var(--primary-color);
    text-decoration: none;
}

.ac-breadcrumb__link:hover,
.ac-breadcrumb__link:focus {
    color: var(--orange);
    text-decoration: underline;
}

.ac-breadcrumb__current {
    color: #6d6d6d;
}

/* ==========================================================================
   Home exercise program — embedded static page
   ========================================================================== */
/* ==========================================================================
   Public forms — registration and feedback (frontend/forms/*)
   ========================================================================== */
.ac-form {
    padding: 55px 0 80px;
}

.ac-form__title {
    font-family: var(--Font-Oswald);
    font-size: 48px;
    font-weight: 600;
    line-height: 55px;
    text-transform: uppercase;
    color: var(--primary-color);
    text-align: center;
    margin: 0 0 24px;
}

.ac-form__intro,
.ac-form__success,
.ac-form__errors {
    max-width: 760px;
    margin: 0 auto 26px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 27px;
}

.ac-form__intro {
    color: #4a4a4a;
    text-align: center;
}

.ac-form__success {
    padding: 16px 20px;
    border-radius: 10px;
    background: #e8f5ec;
    color: #1c6b39;
}

.ac-form__errors {
    padding: 16px 20px;
    border-radius: 10px;
    background: #fdecec;
    color: #b3261e;
}

.ac-form__errors-title {
    margin: 0 0 6px;
    font-weight: 600;
}

.ac-form__errors ul {
    margin: 0;
    padding-left: 20px;
}

.ac-form__form {
    max-width: 760px;
    margin: 0 auto;
}

.ac-form__section {
    margin: 0 0 28px;
    padding: 22px 24px;
    border: 1px solid #e2e2e2;
    border-radius: 12px;
}

.ac-form__legend {
    padding: 0 8px;
    font-family: var(--Font-Roboto);
    font-size: 18px;
    font-weight: 600;
    color: var(--primary-color);
    width: auto;
}

.ac-form__row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 16px;
    margin-bottom: 16px;
}

.ac-form__row--stacked {
    flex-direction: column;
    align-items: stretch;
}

.ac-form__label {
    flex: 0 0 190px;
    font-family: var(--Font-Roboto);
    font-size: 15px;
    font-weight: 500;
    color: #2b2b2b;
}

.ac-form__label span {
    color: #b3261e;
}

.ac-form__input {
    flex: 1 1 260px;
    min-width: 0;
    padding: 11px 13px;
    font-size: 16px;
    font-family: inherit;
    color: #2b2b2b;
    border: 1px solid #cfcfcf;
    border-radius: 8px;
    background: #fff;
}

.ac-form__input:focus {
    outline: none;
    border-color: var(--sky-blue, #145698);
}

.ac-form__input--short {
    flex: 0 1 220px;
}

.ac-form__textarea {
    flex: 1 1 auto;
    width: 100%;
    resize: vertical;
}

.ac-form__hint {
    flex: 1 1 100%;
    margin-left: 206px;
    font-size: 13px;
    color: #7a7a7a;
}

/* "How did you hear about us?" — two columns on desktop, one on mobile. */
.ac-form__checks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 20px;
    margin-bottom: 18px;
}

.ac-form__check,
.ac-form__choice {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 15px;
    color: #2b2b2b;
    cursor: pointer;
}

.ac-form__reveal.is-hidden {
    display: none;
}

.ac-form__question {
    padding: 14px 0;
    border-bottom: 1px solid #ededed;
}

.ac-form__question:last-child {
    border-bottom: 0;
}

.ac-form__question-text {
    margin: 0 0 8px;
    font-size: 16px;
    line-height: 25px;
    color: #2b2b2b;
}

.ac-form__choices {
    display: flex;
    gap: 26px;
}

.ac-form__actions {
    text-align: center;
    padding: 8px 0 0;
}

.ac-form__submit {
    padding: 13px 44px;
    font-family: var(--Font-Roboto);
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    background: #FF8205;
    border: 0;
    border-radius: 12px;
    cursor: pointer;
}

.ac-form__submit:hover {
    background: #e0722a;
}

/* ==========================================================================
   Testimonials (frontend/content/testimonials.blade.php)
   Content is written straight into the blade; these rules give whatever is
   pasted in a readable measure and consistent spacing.
   ========================================================================== */
.testimonials {
    padding: 55px 0 80px;
}

.testimonials__title {
    font-family: var(--Font-Oswald);
    font-size: 48px;
    font-weight: 600;
    line-height: 55px;
    text-transform: uppercase;
    color: var(--primary-color);
    text-align: center;
    margin: 0 0 40px;
}

.testimonials__body {
    max-width: 900px;
    margin: 0 auto;
    font-family: var(--Font-Roboto);
    font-size: 17px;
    line-height: 30px;
    color: #2b2b2b;
}

.testimonials__body h2,
.testimonials__body h3 {
    font-family: var(--Font-Roboto);
    font-size: 22px;
    font-weight: 600;
    color: var(--primary-color);
    margin: 34px 0 10px;
}

.testimonials__body p {
    margin: 0 0 18px;
}

.testimonials__body blockquote {
    margin: 0 0 24px;
    padding: 4px 0 4px 20px;
    border-left: 3px solid #FF8205;
    font-style: italic;
}

.testimonials__body cite {
    display: block;
    margin-top: 8px;
    font-size: 15px;
    font-style: normal;
    color: #7a7a7a;
}

.testimonials__body ul,
.testimonials__body ol {
    margin: 0 0 18px;
    padding-left: 22px;
}

/* Shown until the content is written into the blade; delete with it. */
.testimonials__placeholder {
    padding: 60px 24px;
    color: var(--gray);
    text-align: center;
}

.exercise-program {
    padding: 55px 0 80px;
}

.exercise-program__title {
    font-family: var(--Font-Oswald);
    font-size: 48px;
    font-weight: 600;
    line-height: 55px;
    text-transform: uppercase;
    color: var(--primary-color);
    text-align: center;
    margin: 0 0 40px;
}

/* The embedded document sets its own height, so the frame is given a generous
   viewport-based minimum rather than a fixed aspect ratio. */
.exercise-program__frame {
    border: 1px solid #e2e2e2;
    border-radius: 12px;
    overflow: hidden;
    background: var(--white);
}

.exercise-program__frame iframe {
    display: block;
    width: 100%;
    min-height: min(1100px, 78vh);
    border: 0;
}

/* Shown until the iframe is pasted into the blade; delete with it. */
.exercise-program__placeholder {
    margin: 0;
    padding: 80px 24px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    color: var(--gray);
    text-align: center;
}

/* ==========================================================================
   Webinars (frontend/webinars/*)
   Deliberately its own block rather than shared with .video-*: webinars carry
   topics and an upcoming state, so the two are free to diverge.
   ========================================================================== */
.webinar-index,
.webinar-detail {
    padding: 55px 0 90px;
}

.webinar-index__title {
    font-family: var(--Font-Oswald);
    font-size: 48px;
    font-weight: 600;
    line-height: 55px;
    text-transform: uppercase;
    color: var(--primary-color);
    text-align: center;
    margin: 0 0 34px;
}

/* --- Topic filter --------------------------------------------------------- */
.webinar-topics {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 0 50px;
}

.webinar-topics__pill {
    display: inline-block;
    padding: 9px 20px;
    font-family: var(--Font-Roboto);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--primary-color);
    background: #eef1f4;
    border: 1px solid transparent;
    border-radius: 999px;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}

.webinar-topics__pill:hover {
    background: #dde4ea;
    color: var(--primary-color);
}

.webinar-topics__pill.is-active {
    background: #FF8205;
    color: var(--white);
}

/* --- Cards ---------------------------------------------------------------- */
.webinar-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 52px 40px;
}

.webinar-card {
    display: flex;
    flex-direction: column;
}

.webinar-card__media {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 12px;
    background: #eef1f4;
}

/* The thumbnail is a <button> when the webinar is playable, so the browser's
   default button chrome has to be stripped back to look like the <a> version. */
.webinar-card__media--play {
    padding: 0;
    border: 0;
    cursor: pointer;
}

.webinar-card__media img,
.webinar-card__media--empty {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 12px;
    transition: transform 0.3s ease;
}

.webinar-card:hover .webinar-card__media img {
    transform: scale(1.04);
}

.webinar-card__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55);
    color: var(--white);
    font-size: 22px;
    padding-left: 4px; /* optically centres the triangle */
    transition: background 0.2s ease, transform 0.2s ease;
    pointer-events: none;
}

.webinar-card__media--play:hover .webinar-card__play {
    background: #2196F3;
    transform: translate(-50%, -50%) scale(1.06);
}

.webinar-card__flag {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 5px 12px;
    font-family: var(--Font-Roboto);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--white);
    background: #FF8205;
    border-radius: 999px;
}

/* Grows to fill, so buttons line up across a row of uneven captions. */
.webinar-card__caption {
    flex: 1 1 auto;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    font-weight: 500;
    line-height: 25px;
    margin: 14px 0 6px;
}

.webinar-card__caption a {
    color: var(--primary-color);
    text-decoration: none;
}

.webinar-card__caption a:hover {
    text-decoration: underline;
}

.webinar-card__date {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 600;
    color: #FF8205;
}

.webinar-card__topics {
    margin: 0 0 10px;
    font-size: 13px;
    color: #7a7a7a;
}

.webinar-card__topics a {
    color: #7a7a7a;
    text-decoration: none;
}

.webinar-card__topics a:hover {
    text-decoration: underline;
}

.webinar-card__btn {
    align-self: flex-start;
    padding: 9px 18px;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    font-weight: 500;
    color: var(--white);
    background: var(--primary-color);
    border-radius: 8px;
    text-decoration: none;
}

.webinar-card__btn:hover {
    background: #0d3f70;
    color: var(--white);
}

.webinar-index__none {
    padding: 40px 0;
    text-align: center;
    font-size: 17px;
    color: #7a7a7a;
}

/* --- Detail --------------------------------------------------------------- */
.webinar-detail__eyebrow {
    margin: 0 0 10px;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.webinar-detail__eyebrow a {
    color: var(--sky-blue, #145698);
    text-decoration: none;
}

.webinar-detail__title {
    font-family: var(--Font-Oswald);
    font-size: 36px;
    font-weight: 600;
    line-height: 44px;
    color: var(--primary-color);
    margin: 0 0 10px;
}

.webinar-detail__topics {
    margin: 0 0 26px;
    font-size: 14px;
    color: #7a7a7a;
}

.webinar-detail__topics a {
    color: #7a7a7a;
}

.webinar-detail__player {
    margin: 0 0 30px;
    border-radius: 12px;
    overflow: hidden;
    background: #000;
}

.webinar-detail__player iframe,
.webinar-detail__player img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
    object-fit: cover;
}

/* Upcoming sessions have no recording yet, so the panel replaces the player. */
.webinar-detail__upcoming {
    margin: 0 0 30px;
    padding: 26px 28px;
    border: 1px solid #ffd7ab;
    border-radius: 12px;
    background: #fff6ec;
}

.webinar-detail__upcoming-title {
    margin: 0 0 6px;
    font-family: var(--Font-Roboto);
    font-size: 20px;
    font-weight: 600;
    color: var(--primary-color);
}

.webinar-detail__upcoming-date {
    margin: 0 0 16px;
    font-size: 16px;
    font-weight: 600;
    color: #FF8205;
}

.webinar-detail__register {
    display: inline-block;
    padding: 11px 26px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    font-weight: 700;
    color: var(--white);
    background: #FF8205;
    border-radius: 10px;
    text-decoration: none;
}

.webinar-detail__register:hover {
    background: #e0722a;
    color: var(--white);
}

.webinar-detail__body {
    font-size: 16px;
    line-height: 27px;
    color: #2b2b2b;
}

.webinar-detail__source,
.webinar-detail__back {
    margin: 22px 0 0;
    font-size: 15px;
}

.webinar-detail__related-title {
    margin: 46px 0 24px;
    font-family: var(--Font-Oswald);
    font-size: 26px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--primary-color);
}

/* ==========================================================================
   Media videos (frontend/videos/*)
   ========================================================================== */
.video-index,
.video-detail {
    padding: 55px 0 90px;
}

.video-index__title,
.video-detail__title {
    font-family: var(--Font-Oswald);
    font-size: 48px;
    font-weight: 600;
    line-height: 55px;
    text-transform: uppercase;
    color: var(--primary-color);
    text-align: center;
    margin: 0 0 60px;
}

.video-detail__title {
    font-size: 36px;
    line-height: 44px;
    text-transform: none;
    margin-bottom: 30px;
}

.video-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 52px 40px;
}

.video-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.video-card__media {
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 12px;
    background: #eef1f4;
}

/* The thumbnail is a <button> when the video is playable, so the browser's
   default button chrome has to be stripped back to look like the <a> version. */
.video-card__media--play {
    position: relative;
    padding: 0;
    border: 0;
    cursor: pointer;
}

.video-card__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55);
    color: var(--white);
    font-size: 22px;
    padding-left: 4px; /* optically centres the triangle */
    transition: background 0.2s ease, transform 0.2s ease;
    pointer-events: none;
}

.video-card__media--play:hover .video-card__play {
    background: #2196F3;
    transform: translate(-50%, -50%) scale(1.06);
}

/* --- Video lightbox ------------------------------------------------------- */
.video-lightbox .modal-content {
    background: #000;
    border: 0;
    border-radius: 12px;
    overflow: hidden;
}

.video-lightbox iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
}

.video-lightbox__close {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.6);
    color: var(--white);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
}

.video-lightbox__close:hover {
    background: rgba(0, 0, 0, 0.85);
}

.video-card__media img,
.video-card__media--empty {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 12px;
    transition: transform 0.3s ease;
}

.video-card:hover .video-card__media img {
    transform: scale(1.04);
}

/* Grows to fill, so buttons line up across a row of uneven captions. */
.video-card__caption {
    flex: 1 1 auto;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 24px;
    color: var(--text-para);
    margin: 22px 0 0;
}

.video-card__caption a {
    color: inherit;
    text-decoration: none;
}

.video-card__caption a:hover {
    color: var(--primary-color);
}

.video-card__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: center;
    margin-top: 22px;
    padding: 11px 22px;
    border-radius: 6px;
    background: #2196F3;
    color: var(--white);
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 1.2;
    text-decoration: none;
    transition: background 0.2s ease;
}

.video-card__btn:hover {
    background: #1579c8;
    color: var(--white);
}

.video-detail__player {
    max-width: 900px;
    margin: 0 auto 30px;
}

.video-detail__player iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: 12px;
}

.video-detail__player img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.video-detail__body {
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 26px;
    color: var(--text-para);
    max-width: 900px;
    margin: 0 auto 20px;
}

.video-detail__source{
    max-width: 900px;
    margin: 0 auto 30px;
    font-family: var(--Font-Roboto);
}

.video-detail__back {
    max-width: 100%;
    margin: 75px 20px 0px;
    text-align: center;
    font-family: var(--Font-Roboto);
}

.video-detail__back a{
    text-decoration: none;
}
.video-detail__back a:hover{
    text-decoration: underline;
}

.video-detail__related-title {
    font-family: var(--Font-Oswald);
    font-size: 30px;
    font-weight: 600;
    color: var(--primary-color);
    margin: 50px 0 26px;
}

.video-index__none {
    font-family: var(--Font-Roboto);
    color: var(--gray);
    text-align: center;
    padding: 40px 0;
}

/* ==========================================================================
   Blog — listing, post body and the monthly archive sidebar
   ========================================================================== */
.blog-index,
.blog-post {
    padding: 50px 0 80px;
}

/* ==========================================================================
   Employee blog — password gate and signed-in bar
   ========================================================================== */
.blog-login {
    padding: 60px 0 90px;
}

.blog-login__card {
    max-width: 460px;
    margin: 0 auto;
    padding: 36px 32px;
    border: 1px solid #e2e2e2;
    border-radius: 14px;
    background: #fff;
}

.blog-login__title {
    font-family: var(--Font-Oswald);
    font-size: 32px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--primary-color);
    margin: 0 0 12px;
}

.blog-login__intro {
    font-size: 16px;
    line-height: 26px;
    color: #4a4a4a;
    margin: 0 0 22px;
}

.blog-login__notice,
.blog-login__error {
    font-size: 15px;
    line-height: 22px;
    padding: 10px 14px;
    border-radius: 8px;
    margin: 0 0 18px;
}

.blog-login__notice {
    background: #eef4fb;
    color: #145698;
}

.blog-login__error {
    background: #fdecec;
    color: #b3261e;
}

.blog-login__form {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.blog-login__label {
    font-size: 14px;
    font-weight: 500;
    color: #4a4a4a;
}

.blog-login__input {
    width: 100%;
    padding: 12px 14px;
    font-size: 16px;
    border: 1px solid #cfcfcf;
    border-radius: 8px;
}

.blog-login__input:focus {
    outline: none;
    border-color: var(--sky-blue, #145698);
}

.blog-login__btn {
    margin-top: 10px;
    padding: 12px 20px;
    font-size: 17px;
    font-weight: 700;
    color: #fff;
    background: #FF8205;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
}

.blog-login__btn:hover {
    background: #e0722a;
}

.blog-login__help {
    margin: 18px 0 0;
    font-size: 14px;
    color: #7a7a7a;
}

/* Bar across the top of every internal blog page, so it is obvious you are
   inside the gated area and how to leave it. */
.internal-blog__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 22px;
    padding: 10px 14px;
    border-radius: 10px;
    background: #eef4fb;
}

.internal-blog__badge {
    font-size: 14px;
    font-weight: 600;
    color: #145698;
}

.internal-blog__signout {
    margin: 0;
}

.internal-blog__signout-btn {
    padding: 6px 14px;
    font-size: 14px;
    font-weight: 500;
    color: #145698;
    background: transparent;
    border: 1px solid #145698;
    border-radius: 8px;
    cursor: pointer;
}

.internal-blog__signout-btn:hover {
    color: #fff;
    background: #145698;
}

.blog-login__remember {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    font-size: 14px;
    color: #4a4a4a;
}

/* ==========================================================================
   Member area — Knowledge Base
   ========================================================================== */
.member-area {
    padding: 40px 0 80px;
}

.member-bar__links {
    display: flex;
    align-items: center;
    gap: 10px;
}

.member-bar__link {
    font-size: 14px;
    font-weight: 500;
    color: #145698;
    text-decoration: none;
}

.member-bar__link:hover {
    text-decoration: underline;
}

.kb-nav__title {
    font-family: var(--Font-Roboto);
    font-size: 18px;
    font-weight: 600;
    color: var(--primary-color);
    margin: 0 0 12px;
}

.kb-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.kb-nav__item {
    border-bottom: 1px solid #ededed;
}

.kb-nav__item--empty {
    padding: 10px 2px;
    font-size: 14px;
    color: #7a7a7a;
}

.kb-nav__link {
    display: block;
    padding: 10px 2px;
    font-size: 15px;
    color: #333;
    text-decoration: none;
}

.kb-nav__link:hover,
.kb-nav__link.is-active {
    color: var(--sky-blue, #145698);
    font-weight: 500;
}

.kb-item {
    padding: 18px 0;
    border-bottom: 1px solid #ededed;
}

.kb-item__title {
    font-family: var(--Font-Roboto);
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 4px;
}

.kb-item__title a {
    color: var(--primary-color);
    text-decoration: none;
}

.kb-item__title a:hover {
    text-decoration: underline;
}

.kb-item__category,
.kb-page__category {
    margin: 0 0 8px;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #8a8a8a;
}

.kb-item__actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.kb-item__download {
    font-size: 15px;
    font-weight: 500;
    color: #145698;
    text-decoration: none;
}

.kb-item__download:hover {
    text-decoration: underline;
}

.kb-item__flag {
    font-size: 14px;
    color: #7a7a7a;
}

.kb-empty {
    padding: 40px 0;
    font-size: 16px;
    color: #7a7a7a;
}

.kb-page__title {
    font-family: var(--Font-Oswald);
    font-size: 30px;
    font-weight: 600;
    color: var(--primary-color);
    margin: 0 0 8px;
}

.kb-page__file,
.kb-page__video {
    margin: 0 0 14px;
}

.kb-page__missing {
    font-size: 15px;
    color: #b3261e;
}

.kb-page__body {
    font-size: 16px;
    line-height: 27px;
    color: #2b2b2b;
}

/* Section name above a post title. Replaces the old duplicate h1, which put
   the blog's name at the top of every post instead of the post's own. */
.blog-post__eyebrow {
    margin: 0 0 10px;
    font-family: var(--Font-Roboto);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.blog-post__eyebrow a {
    color: var(--sky-blue, #145698);
    text-decoration: none;
}

.blog-post__eyebrow a:hover {
    text-decoration: underline;
}

.blog-index__title,
.blog-post__title {
    font-family: var(--Font-Oswald);
    font-size: 40px;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--primary-color);
    margin: 0 0 32px;
}

.blog-post__title {
    text-transform: none;
    font-size: 34px;
    margin-bottom: 10px;
}

/* --- Recent-post cards ---------------------------------------------------- */
.blog-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 46px 34px;
}

.blog-card__media {
    display: block;
    overflow: hidden;
    border-radius: 12px;
    background: #eef1f4;
}

.blog-card__media img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    /* Matches the wrapper so the corners stay clean while the image scales
       on hover — a transformed child can otherwise bleed past the clip. */
    border-radius: 12px;
    transition: transform 0.3s ease;
}

.blog-card:hover .blog-card__media img {
    transform: scale(1.04);
}

/* Byline on the left, read-more on the right, both above the title. */
.blog-card__meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin: 18px 0 10px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 26px;
    color: #b7b7b7;
}

.blog-card__meta i {
    margin-right: 4px;
}

.blog-card__author {
    text-decoration: underline;
}

.blog-card__title {
    font-family: var(--Font-Oswald);
    font-size: 32px;
    font-weight: 500;
    line-height: 40px;
    margin: 0 0 15px;
}

.blog-card__title a {
    color: var(--secondary-color);
    text-decoration: none;
}

.blog-card__title a:hover {
    color: var(--primary-color);
}

.blog-card__more {
    white-space: nowrap;
    color: var(--primary-color);
    text-decoration: none;
}

.blog-card__more:hover {
    text-decoration: underline;
}

.blog-entry {
    padding-bottom: 34px;
    margin-bottom: 34px;
    border-bottom: 1px solid #e2e2e2;
}

.blog-entry:last-child {
    border-bottom: 0;
}

.blog-entry__title {
    font-family: var(--Font-Oswald);
    font-size: 30px;
    font-weight: 600;
    line-height: 1.25;
    margin: 0 0 8px;
}

.blog-entry__title a {
    color: var(--primary-color);
    text-decoration: none;
}

.blog-entry__title a:hover {
    text-decoration: underline;
}

.blog-entry__meta,
.blog-post__meta {
    font-family: var(--Font-Roboto);
    font-size: 14px;
    color: var(--gray);
    margin: 0 0 18px;
}

/* Sits above the title as an outlined pill, as on the design. */
.blog-post__date {
    display: inline-block;
    font-family: var(--Font-Roboto);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
    border-radius: 18px;
    padding: 11px 26px;
    margin: 0 0 18px;
}

.blog-post__header {
    align-items: center;
    margin-bottom: 34px;
}

/* Post pages drop the archives rail and run the full container width — no
   cap, matching the design. */
.blog-index__main--full {
    max-width: none;
}

/* --- Post banner ---------------------------------------------------------
   The right-hand half of the header row, beside the date and title. */
.blog-post__figure {
    margin: 0;
}

.blog-post__figure img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
}

.blog-entry__body,
.blog-post__body {
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 1.7;
    color: var(--text-para);
}

.blog-entry__body p,
.blog-post__body p {
    margin: 0 0 15px;
}

.blog-entry__body img,
.blog-post__body img {
    max-width: 100%;
    height: auto;
}

.blog-index__none {
    font-family: var(--Font-Roboto);
    color: var(--gray);
    padding: 30px 0;
}

/* --- "Previous Blogs" sidebar: month pills + Show Archived ---------------- */
.blog-archives {
    background: rgba(55, 93, 168, 0.05);
    border-radius: 12px;
    padding: 38px 24px 30px;
}

.blog-archives__heading {
    font-family: var(--Font-Oswald);
    font-size: 32px;
    font-weight: 500;
    line-height: 40px;
    color: var(--secondary-color);
    margin: 0 0 15px;
}

.blog-archives__list,
.blog-archives__posts {
    list-style: none;
    margin: 0;
    padding: 0;
}

.blog-archives__month {
    margin-bottom: 11px;
}

.blog-archives__pill {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 12px 25px;
    border: 0;
    border-radius: 5px;
    background: rgba(112, 147, 188, 0.15);
    font-family: var(--Font-Roboto);
    font-size: 16px;
    font-weight: 400;
    line-height: 19.2px;
    color: #606060;
    text-align: left;
    cursor: pointer;
    transition: background 0.2s ease;
}

.blog-archives__pill:hover,
.blog-archives__pill:not(.collapsed) {
    background: rgba(112, 147, 188, 0.28);
    color: var(--primary-color);
}

.blog-archives__count {
    font-size: 12px;
    color: var(--gray);
}

.blog-archives__posts {
    padding: 10px 0 4px 12px;
}

.blog-archives__posts li {
    margin-bottom: 7px;
}

.blog-archives__show-archived {
    display: inline-block;
    margin-top: 10px;
    padding: 0;
    background: transparent;
    border: 0;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    color: var(--gray);
    cursor: pointer;
}

.blog-archives__show-archived:hover {
    color: var(--primary-color);
    text-decoration: underline;
}

.blog-archives__posts a {
    font-family: var(--Font-Roboto);
    font-size: 14px;
    line-height: 1.45;
    color: var(--text-para);
    text-decoration: none;
}

.blog-archives__posts a:hover {
    color: var(--primary-color);
    text-decoration: underline;
}

/* ==========================================================================
   Contact page — collapsible list of every clinic
   ========================================================================== */
.contact-locations {
    margin-top: 30px;
}

.contact-locations__item {
    border: 1px solid #e2e2e2;
    background: var(--white);
    margin-bottom: 10px;
}

.contact-locations__btn {
    display: flex;
    align-items: stretch;
    width: 100%;
    padding: 0;
    background: transparent;
    border: 0;
    text-align: left;
    cursor: pointer;
}

/* The +/- box on the left, divided from the label by a hairline. */
.contact-locations__icon {
    position: relative;
    flex: 0 0 50px;
    align-self: stretch;
    min-height: 52px;
    border-right: 1px solid #e2e2e2;
}

.contact-locations__icon::before,
.contact-locations__icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 13px;
    height: 2px;
    background: var(--orange);
    transform: translate(-50%, -50%);
}

/* The vertical stroke is only present while the row is collapsed, turning
   the minus into a plus. */
.contact-locations__btn:not(.collapsed) .contact-locations__icon::after {
    display: none;
}

.contact-locations__icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.contact-locations__name {
    flex: 1 1 auto;
    padding: 15px 18px;
    font-family: var(--Font-Oswald);
    font-size: 17px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #333333;
}

.contact-locations__btn:not(.collapsed) .contact-locations__name {
    color: var(--orange);
}

.contact-locations__body {
    padding: 16px 18px;
    border-top: 1px solid #e2e2e2;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 1.6;
    color: var(--text-para);
}
.contact-locations__body a {
    display: inline;
}
.contact-locations__address {
    color: var(--text-para);
    text-decoration: none;
}

.contact-locations__address:hover {
    text-decoration: underline;
}

.contact-locations__address:hover {
    color: var(--primary-color);
}

.contact-locations__tel, .contact-locations__email {
    margin-left: 6px;
    white-space: nowrap;
    display: block;
}

.contact-locations__tel a , .contact-locations__email a{
    color: #1155cc;
    text-decoration: none;
    display: inline;
}

.contact-locations__tel a:hover , .contact-locations__email a:hover{
    text-decoration: underline;
}

/* Book Appointment / Directions, matching the clinic page's buttons.
   .contact-locations__body a forces display:inline and outranks .orange-btn
   on specificity, so the buttons have to opt back out of it here. */
.contact-locations__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 16px;
}

.contact-locations__body .contact-locations__actions a {
    display: inline-flex;
    align-items: center;
    line-height: 1.2;
    /* The clinic page uses 16.5px padding at 18px type; a touch tighter here,
       since these sit inside an accordion panel rather than a page header. */
    font-size: 16px;
    padding: 12px 22px;
    white-space: nowrap;
}


/* ==========================================================================
   Service page FAQs

   Its own classes rather than the .custom-accordion the location pages use:
   this is body copy inside the content column, not a card grid, so it wants a
   lighter treatment and can change without touching the team accordions.
   ========================================================================== */
.service-faqs {
    margin-top: 50px;
    padding-top: 40px;
    border-top: 1px solid rgba(193, 193, 193, 0.49);
}

.service-faqs__title {
    font-family: var(--Font-Oswald);
    font-size: 32px;
    line-height: 40px;
    font-weight: 500;
    color: var(--primary-color);
    margin: 0 0 24px;
}

.service-faqs__item {
    border: 1px solid rgba(148, 148, 148, 0.31);
    border-radius: 6px;
    margin-bottom: 10px;
    overflow: hidden;
    background: var(--white);
}

.service-faqs__header {
    margin: 0;
}

/* The question row. Bootstrap's own chevron is hidden; the +/- sits in a
   ruled gutter on the left, matching the accordions elsewhere on the site. */
.service-faqs__question.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 16px 18px 16px 60px;
    font-family: var(--Font-Roboto);
    font-size: 17px;
    font-weight: 500;
    line-height: 26px;
    text-align: left;
    color: var(--primary-color);
    background: var(--white);
    border: 0;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.service-faqs__question.accordion-button::after {
    display: none;
}

.service-faqs__question.accordion-button::before {
    content: "\f067";
    font-family: 'FontAwesome';
    font-size: 14px;
    color: var(--orange);
    position: absolute;
    left: 0;
    top: 0;
    width: 46px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid rgba(148, 148, 148, 0.31);
}

.service-faqs__question.accordion-button:not(.collapsed) {
    color: var(--orange);
    background: var(--white);
}

.service-faqs__question.accordion-button:not(.collapsed)::before {
    content: "\f068";
}

.service-faqs__question.accordion-button:focus {
    outline: none;
    box-shadow: none !important;
}

.service-faqs__answer {
    padding: 4px 18px 20px 60px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 1.7;
    color: var(--text-para);
    border-top: 1px solid rgba(148, 148, 148, 0.31);
}

.service-faqs__answer p {
    margin: 0 0 12px;
}

.service-faqs__answer p:last-child,
.service-faqs__answer ul:last-child {
    margin-bottom: 0;
}

.service-faqs__answer ul {
    margin: 0 0 12px;
    padding-left: 20px;
    list-style: disc;
}

.service-faqs__answer li {
    margin-bottom: 6px;
}

@media (max-width: 575px) {
    .service-faqs__title {
        font-size: 26px;
        line-height: 34px;
    }

    .service-faqs__question.accordion-button {
        font-size: 16px;
        padding-left: 52px;
    }

    .service-faqs__answer {
        padding-left: 18px;
    }
}

/* ==========================================================================
   Referring Physicians page (/referring-physician)
   Measured from stage.athletescare.com/referring-physician/. Everything on it
   is edited in the admin under Site Content > Referring Physicians; phone and
   tablet rules are in the Responsive overrides below.
   ========================================================================== */

/* The global h1 rule leaves 60px under the heading; stage has ~136px to the
   intro, so the rest is this block's margin. */
.referring-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 54px;
    align-items: start;
    margin-top: 76px;
    padding-bottom: 70px;
}

.referring-heading {
    font-family: var(--Font-Oswald);
    font-size: 40px;
    font-weight: 500;
    line-height: 46px;
    color: var(--primary-color);
    margin: 0 0 15px;
}

/* Copy written in the admin editor: plain p / ul / a, so the element
   selectors carry the styling. */
.referring-copy {
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 26px;
    color: var(--text-para);
}

.referring-copy p,
.referring-copy ul,
.referring-copy ol {
    margin: 0 0 15px;
}

.referring-copy ul,
.referring-copy ol {
    padding-left: 22px;
}

.referring-copy ul {
    list-style: disc;
}

.referring-copy li {
    margin-bottom: 4px;
}

.referring-copy > :last-child {
    margin-bottom: 0;
}

.referring-copy a {
    color: var(--primary-color);
}

.referring-copy a:hover,
.referring-copy a:focus {
    color: var(--orange);
}

/* The two referral-form downloads: full-width bars, as stage. */
.referring-forms {
    display: flex;
    flex-direction: column;
    gap: 21px;
    max-width: 560px;
    margin-top: 53px;
}

.referring-forms__btn {
    display: block;
    padding: 15px 20px;
    border-radius: 5px;
    font-family: var(--Font-Roboto);
    font-size: 15px;
    font-weight: 400;
    line-height: 23px;
    text-align: center;
    text-decoration: none;
    color: var(--white) !important;
    transition: background-color 0.2s ease;
}

.referring-forms__btn--primary {
    background-color: var(--orange);
}

.referring-forms__btn--primary:hover,
.referring-forms__btn--primary:focus {
    background-color: #e06305;
}

.referring-forms__btn--secondary {
    background-color: rgba(0, 51, 102, 0.6);
}

.referring-forms__btn--secondary:hover,
.referring-forms__btn--secondary:focus {
    background-color: rgba(0, 51, 102, 0.8);
}

/* A specialty, and the FAQs: each opens with a full-width rule. */
.referring-block {
    border-top: 1px solid #dfdfdf;
    padding: 72px 0 78px;
}

.referring-block:last-child {
    padding-bottom: 0;
}

.referring-block__intro {
    margin-bottom: 40px;
}

.referring-block__link {
    display: inline-block;
    margin-top: 29px;
    font-family: var(--Font-Roboto);
    font-size: 16px;
    line-height: 19px;
    color: var(--primary-color);
    text-decoration: none;
}

.referring-block__link:hover,
.referring-block__link:focus {
    color: var(--orange);
    text-decoration: underline;
}

/* Accordion rows (specialty sections and FAQs), the same look as the clinic
   pages' accordion: Oswald uppercase titles, +/- in a ruled 49px gutter. */
.referring-accordion__item {
    border: 1px solid rgba(148, 148, 148, 0.31);
    border-radius: 5px;
    margin-bottom: 5px;
    overflow: hidden;
    background: var(--white);
}

.referring-accordion__header {
    margin: 0;
}

.referring-accordion__button.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 14px 14px 14px 60px;
    font-family: var(--Font-Oswald);
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    text-transform: uppercase;
    color: var(--black);
    background: var(--white);
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.referring-accordion__button.accordion-button::after {
    display: none;
}

.referring-accordion__button.accordion-button::before {
    content: "\f067";
    font-family: 'FontAwesome';
    font-size: 15px;
    color: var(--orange);
    position: absolute;
    left: 0;
    top: 0;
    width: 49px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid rgba(148, 148, 148, 0.31);
}

.referring-accordion__button.accordion-button:not(.collapsed) {
    color: var(--orange);
    background: var(--white);
    box-shadow: none;
}

.referring-accordion__button.accordion-button:not(.collapsed)::before {
    content: "\f068";
}

.referring-accordion__button.accordion-button:focus {
    box-shadow: none;
}

.referring-accordion__button.accordion-button:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: -2px;
}

.referring-accordion__body.accordion-body {
    padding: 15px 20px 20px;
    border-top: 1px solid rgba(148, 148, 148, 0.31);
}

/* ==========================================================================
   Responsive overrides

   Every @media block in one place, one block per query. Ordered so the
   narrowest max-width and the widest min-width come last: media queries
   add no specificity, so the later block is the one that wins where two
   ranges overlap.
   ========================================================================== */

@media (min-width: 576px) {
    .container,
    .container-sm {
        max-width: 650px
    }
}

@media (min-width: 768px) {
    .container,
    .container-md,
    .container-sm {
        max-width: 790px
    }
}

@media (min-width: 991px) {
/*    .site-header.scrolled .site-header__link {*/
/*    color: var(--primary-color) !important;*/
/*    font-weight:500;*/
/*}*/
.about_content_block {
    padding-right: 50px;
}
.main_space_custom {
    padding-right: 12px;
}
.services_offered_block{
    width: 348px;
    max-width: 348px;
    margin-left: auto;
}
.biography_block {
    width: 83.333%;
}
}

@media (min-width: 992px) {
    .site-header__locations-tab-sidebar {
        border-right-width: 3px;
        border-right-color: var(--primary-color);
    }
    .container,
    .container-lg,
    .container-md,
    .container-sm {
        max-width: 992px
    }
  .clinic-hours-row > [class*="col-"] {
    margin-bottom: 0;
  }
}

@media (min-width: 1199px) {
    .site-header__collapse-backdrop {
        display: none !important;
    }
       .site-header.scrolled .site-header__link {
    color: var(--primary-color) !important;
}
}

@media (min-width: 1200px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1280px
    }
}

@media (min-width: 1350px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1350px
    }
}

@media (min-width: 1420px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1400px
    }
}

@media (max-width: 1200px) {
    .site-header__services-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 1199px) {
    /* Full-screen overlay; inner panel slides in from the right (not top-down collapse) */
    #siteHeaderNav.site-header__collapse.navbar-collapse {
        display: flex !important;
        flex-direction: row;
        align-items: stretch;
        justify-content: flex-start;
        position: fixed !important;
        inset: 0;
        width: 100% !important;
        height: 100vh !important;
        max-height: none !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        z-index: 1040;
        overflow: hidden !important;
        border: none;
        border-radius: 0;
        background: transparent !important;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    #siteHeaderNav.site-header__collapse:not(.show):not(.collapsing) {
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
    }

    #siteHeaderNav.site-header__collapse.show,
    #siteHeaderNav.site-header__collapse.collapsing {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }

    /* Skip Bootstrap height animation so .show toggles quickly; drawer slide handles motion */
    #siteHeaderNav.site-header__collapse,
    #siteHeaderNav.site-header__collapse.collapsing {
        height: 100vh !important;
        transition: none !important;
    }

    .site-header__collapse-backdrop {
        flex: 1 1 auto;
        min-width: 0;
        align-self: stretch;
        border: 0;
        padding: 0;
        margin: 0;
        background: var(--header-dd-backdrop);
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    .site-header__collapse-panel {
        flex: 1 0 min(24rem, 88vw);
        width: min(24rem, 88vw);
        max-width: 100%;
        align-self: stretch;
        background:#004da6;
        box-shadow: var(--header-dd-drawer-shadow);
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        transform: translateX(100%);
        transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
     padding:11px 20px 30px 10px;
    }

    #siteHeaderNav.site-header__collapse.show .site-header__collapse-panel {
        transform: translateX(0);
    }

    .site-header__bar {
        position: relative;
        z-index: 1050;

    }
    .site-header__link {
        padding: 6px 15px !important;
    font-size:20px;
    }
    .site-header__mobile-submenu-chevron {
        display: inline-flex;
        font-size: 20px;
        opacity: 0.85;
        transition: transform 0.25s var(--site-header-underline-ease);
    }

    .site-header__mobile-submenu-btn[aria-expanded="true"] .site-header__mobile-submenu-chevron {
        transform: rotate(180deg);
    }

    .site-header__mobile-submenu {
        padding: 0 0 0.5rem 0.5rem;
    }

    .site-header__mobile-submenu-link {
        display: block;
        font-family: var(--Font-Roboto);
        font-size: 18px;
        color: var(--header-dd-text-dim);
        text-decoration: none;
        padding: 0.4rem 0.5rem;
        letter-spacing: 0.06em;
    }

    .site-header__mobile-submenu-link:hover,
    .site-header__mobile-submenu-link:focus {
        color: var(--white);
        text-decoration: underline;
    }

    .site-header__mobile-loc-accordion.accordion-flush .accordion-item {
        background: transparent;
        border-color: var(--header-dd-border);
    }

    .site-header__mobile-acc-btn.accordion-button {
        font-family: var(--Font-Roboto);
        font-size: 20px;
        font-weight: 600;
        letter-spacing: 0.06em;
        color: var(--header-dd-text-title) !important;
        background-color: var(--header-dd-chip) !important;
        box-shadow: none !important;
        padding: 0.65rem 0.85rem;
    }

    .site-header__mobile-acc-btn.accordion-button:not(.collapsed) {
        background-color: var(--header-dd-active) !important;
        color: var(--white) !important;
    }

    .site-header__mobile-acc-btn.accordion-button::after {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

    .site-header__mobile-loc-accordion .accordion-body {
        padding: 0.5rem 0.75rem 0.85rem;
        background: var(--header-dd-accordion-bg);
    }

    .site-header__mobile-loc-list a {
        font-family: var(--Font-Roboto);
        font-size: 18px;
        color: var(--header-dd-text-dim);
        text-decoration: none;
        display: block;
        padding: 0.3rem 0;
        line-height: 1.35;
    }

    .site-header__mobile-loc-list a:hover,
    .site-header__mobile-loc-list a:focus {
        color: var(--white);
        text-decoration: underline;
    }
    .navbar-nav li {
    padding: 11px 20px !important;
    border-bottom: 1px solid #ffffff21;
}
    .site-header.scrolled .site-header__nav{
    background:var(--primary-color);
}
.site-header.scrolled .site-header__logo {
    filter: brightness(0) invert(1) !important;
}
/*.site-header__bar {*/
/*    background:var(--primary-color);*/
/*}*/
/*.site-header__cta {*/
/*    color: var(--primary-color);*/
/*    background-color: #fff;*/
/*}*/
    .clinics-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
    .site-header__product-mega {
        grid-template-columns: 1fr;
        gap: 1.25rem;
        padding: 1.35rem;
    }

    .site-header__product-mega-offerings {
        padding-right: 0;
        border-right: none;
        border-bottom: 1px solid var(--product-mega-border);
        padding-bottom: 1.25rem;
    }
}

@media (max-width: 991.98px) {
    .site-header__locations-tab-content--pane {
        border: 1px solid var(--locations-mega-line);
        border-radius: 0.75rem;
    }
    .site-header__locations-mega--tabs {
        padding: 1.35rem 1.25rem;
    }

    .site-header__locations-tab-sidebar {
        padding-right: 0;
        padding-bottom: 1.35rem;
        margin-bottom: 1.35rem;
        border-right: none;
        border-bottom: 1px solid var(--locations-mega-line);
    }

    .site-header__locations-tab-content-wrap {
        padding-left: 0;
    }
    .site-header__services-grid,
    .site-header__products-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    /* Referring Physicians: the forms column drops under the intro. */
    .referring-top {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 45px;
        margin-top: 40px;
        padding-bottom: 55px;
    }
    .referring-forms {
        margin-top: 30px;
    }
    .referring-block {
        padding: 55px 0 60px;
    }
}

@media (max-width: 991px) {
    .site-footer__col,
    .site-footer__col--wide {
        flex: 0 0 50%;
        max-width: 50%;
        margin-bottom: 30px;
    }
    .site-footer__col--brand {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 30px;
    }
    .site-header__nav{
        padding:0;
    }
    .about_inner_main h1 {
        font-size: 32px;
        text-align:left;
    }
      .about_inner_main h2 {
        font-size: 30px;
        text-align:left;
    }
    .services_block h3 {
        color: var(--primary-color);
        font-size: 28px;

    }
    .about_content_block h1, .mainheading-block-center h1  {
                font-size: 37px;
        line-height: 45px;
        text-align:center;

    }
   .mainheading-block-center h1 {
    margin-bottom: 30px !important;
}
    .about_content_block {
        text-align: left !important;
    }
    .about_content_block div{
        text-align: left !important;
    }
    .about_content_block h3{
        text-align:left !important;
        margin:0px 0px 10px;
        font-size: 24px;
        line-height: 33px;
    }
    .about_content_block p{
        text-align:left !important;
    }
    .about_mainblock {
    padding-top: 58px !important;

}
.paddingcms_custom{
        padding-left:25px;
    padding-right:25px;
}
    .biography_block{
        text-align: center;
    }
    .member_bio_inner_right {
        text-align: center;
    }
    .team-card {
    padding: 10px 55px;
}
    .biography_block{
        text-align: center;
    }
    .member_bio_inner_right {
        text-align: center;
    }
    .product-list__title { font-size: 34px; line-height: 40px; }
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
    .product-card__name { font-size: 20px; }
    .product-detail__category { padding: 24px 0; }
    .product-detail__category-title { font-size: 34px; line-height: 40px; }
    .product-detail__main { padding: 50px 0 60px; }
    .product-detail__grid { grid-template-columns: minmax(0, 1fr); gap: 30px; }
    .product-detail__info { padding-left: 0; }
    .product-detail__name { font-size: 28px; }
    .product-detail__tagline,
    .product-detail__conditions { font-size: 17px; }
    .exercise-program__title { font-size: 34px; line-height: 40px; }
    .exercise-program__frame iframe { min-height: 70vh; }
    .webinar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 28px; }
    .webinar-index__title { font-size: 36px; line-height: 42px; }
    .video-index__title { font-size: 34px; line-height: 40px; margin-bottom: 40px; }
    .video-detail__title { font-size: 26px; line-height: 34px; }
    .video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px; }
    .blog-post__figure {
        margin-top: 24px;
    }
    .blog-index__title { font-size: 30px; }
    .blog-post__title { font-size: 26px; }
    .blog-entry__title { font-size: 24px; }
    .clinics-index__title { font-size: 34px; }
    .clinics-region__btn { font-size: 30px; padding: 18px 4px; }
    .clinics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 20px; }
    .clinic-card__name { font-size: 23px; margin-top: 18px; }
    .clinic-card__book { font-size: 16px; padding: 12px 14px; }
}

@media (max-width: 768px) {
    .services-inner-box-design {
    display: block;
}
.services-inner-box-design-image img {
    width:100%;
            margin: 0px !important;
}
    .clinic-hours-row > div:nth-child(1) .clinic-hours-block:first-child,.clinic-hours-row > div:nth-child(2) .clinic-hours-block:first-child,.clinic-hours-row > div:nth-child(3) .clinic-hours-block:first-child{
    border-bottom: 0 !important;
}
#owl-carousel-location .owl-prev {
    margin-left: -18px;
}
#owl-carousel-location .owl-next {
    margin-right: -18px;
}
.ac-location-hero__address-line {
    font-size: 27px;
        line-height: 35px;
}
.ac-location-hero__contact {
    font-size: 27px;
    line-height: 32px;
}
.ac-location-map-wrap {

    bottom: -43px;
}
.img_block {
    height: 350px;
}
  .location-section {
    text-align: center;
  }

  .location-icon {
    margin: 0 auto 20px;
  }

  .location-title {
    font-size: 32px;
  }
     .homebanner-block.banner_bg2 {
        min-height: 400px;
    }
    .blue-banner-overlay {
        min-height: 400px !important;
    }
    .video-overlay-grid {
        height: 400px;
    }
    div.homebanner-block .bannerblock1 {
        min-height: 400px !important;
        padding-top: 0px !important;
        margin: 0;
    }
    .mainheading-block-center {
        margin: 0 !important;
text-align: left !important;
        display: flex;
    }
.clinic-lo-row .col-md-3 {
    width: unset !important;
}
.ac-location-hero__address {
    text-align: center;
    margin-bottom: 34px;
}
.ac-location-hero__action-bar a {
    width: 100%;
    text-align: center;
}
.ac-location-hero__contact {
    display:block;
    text-align:center;
    margin: 15px 0 46px;
}
.ac-location-hero__hours-heading {
    text-align: center;
}
.ac-location-band__title {
    text-align: center;
}
.site-header__bar {
    padding: 0px 19px !important;
}
.ac-location-hero__hours .clinic-hours-day-label {
    font-size: 22px;
}
.ac-location-page-heading {
    font-size: 28px;
}
.ac-location-hero__container {
    padding: 0;
}
.ac-location-hero {
    padding: 0px 25px;
}
.ac-location-team-outer {
    padding-left: 25px;
    padding-right: 25px;
}
.mainheading-location-page {
    padding-left: 25px !important;
    padding-right: 25px !important;
    text-align:center !important;
            display: flex;
        align-items: center;
        justify-content: center;

}
/*font size change 29 may*/
.about_content_block h2, .main_space_custom h2 {
    font-size: 43px;
    line-height: 50px;
}
.about_content_block p {
    font-size: 21px;
}
.services-inner-wrapper ul li {
    font-size: 21px;
}
.site-header__backdrop::after {
    background-color: rgba(0,51,102,0.36);
}
    .loca-accor-data-card h3 {
    font-size: 26px;
    min-height: 100%;
}
.address-loc-text {
    font-size: 19px;
}
.loc-btn {
       font-size: 20px;
}
.location-custom-accordion-btn{
padding:8px 0 !important;
}
.location-custom-accordion-btn .title{
font-size:34px;
}
.custom-arrow{
font-size:18px;
}
.location-custom-accordion-btn .title {
    font-size: 36px;
    line-height: 44px;
}
.loc-input-group{
    font-size:16px;
}
}

@media (max-width: 767px) {
    .ac-form { padding: 36px 0 55px; }
    .ac-form__title { font-size: 32px; line-height: 38px; }
    .ac-form__section { padding: 18px 16px; }
    .ac-form__label { flex: 1 1 100%; }
    .ac-form__input { flex: 1 1 100%; }
    .ac-form__hint { margin-left: 0; }
    .ac-form__checks { grid-template-columns: 1fr; }
    .testimonials { padding: 36px 0 55px; }
    .testimonials__title { font-size: 34px; line-height: 40px; margin-bottom: 26px; }
    .testimonials__body { font-size: 16px; line-height: 27px; }
    .blog-cards { grid-template-columns: minmax(0, 1fr); gap: 34px; }
    .blog-card__title { font-size: 24px; line-height: 32px; }
}

@media (max-width: 575px) {
    .site-footer__col,
    .site-footer__col--wide {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .product-list { padding: 35px 0 60px; }
    .product-list__title { font-size: 27px; line-height: 33px; }
    .product-grid { grid-template-columns: minmax(0, 1fr); }
    .exercise-program { padding: 35px 0 60px; }
    .exercise-program__title { font-size: 27px; line-height: 33px; }
    .webinar-index,
    .webinar-detail { padding: 35px 0 60px; }
    .webinar-grid { grid-template-columns: 1fr; gap: 34px; }
    .webinar-index__title { font-size: 28px; line-height: 34px; margin-bottom: 22px; }
    .webinar-detail__title { font-size: 26px; line-height: 33px; }
    .webinar-topics { margin-bottom: 32px; }
    .video-index, .video-detail { padding: 35px 0 60px; }
    .video-index__title { font-size: 27px; line-height: 33px; }
    .video-grid { grid-template-columns: minmax(0, 1fr); }
    .contact-locations__actions { gap: 10px; }
    .contact-locations__body .contact-locations__actions a {
        flex: 1 1 100%;
        justify-content: center;
    }
    .clinics-index { padding: 40px 0 60px; }
    .clinics-index__title { font-size: 27px; }
    .clinics-region__btn { font-size: 24px; }
    .clinics-grid { grid-template-columns: minmax(0, 1fr); }
    .referring-top { margin-top: 20px; padding-bottom: 40px; }
    .referring-heading { font-size: 30px; line-height: 36px; }
    .referring-block { padding: 40px 0 45px; }
    .referring-block__intro { margin-bottom: 28px; }
    .referring-accordion__button.accordion-button {
        font-size: 16px;
        line-height: 23px;
        padding-left: 58px;
    }
    .referring-accordion__body.accordion-body { padding: 14px 16px 18px; }
}

@media (min-width: 991px) and (max-width: 1075px) {
    .services_offered_block {
    width: 300px;
    max-width: 300px;
    margin-left: unset;
}
.services_block h3 {
    font-size: 39px;
}
}

@media (min-width: 1150px) and (max-width: 1290px) {
.site-header__brand-center {
    min-width: 130px;
}
}

@media (prefers-reduced-motion: reduce) {
    .site-header__link::before {
        transition-duration: 0.01ms;
    }

    .site-header__dropdown-chevron {
        transition-duration: 0.01ms;
    }
    .site-header__dropdown-menu.show .site-header__dropdown-panel {
        animation: none;
        opacity: 1;
        transform: none;
    }

    .site-header__dropdown-menu.show .site-header__locations-mega--tabs {
        animation: none;
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 991.98px) and (prefers-reduced-motion: reduce) {
    .site-header__collapse-panel {
        transition-duration: 0.01ms;
    }

    #siteHeaderNav.site-header__collapse:not(.show) .site-header__collapse-panel {
        transform: translateX(100%);
    }

    #siteHeaderNav.site-header__collapse.show .site-header__collapse-panel {
        transform: translateX(0);
    }
}