/* MEDIA QUERIES:MIN ==================== */
@media (min-width: 391px) {
    .hidden-device-2xs {
        display: none !important;
    }
}

@media (min-width: 576px) {
    .hidden-device-xs {
        display: none !important;
    }
}

@media (min-width: 768px) {
    .hidden-device-sm {
        display: none !important;
    }
}

@media (min-width: 992px) {
    .hidden-device-md {
        display: none !important;
    }

    :root {
        --font-size-h1: 4rem;
        --font-size-h2: 3.2rem;
        --font-size-h3: 2.4rem;

        --line-height-h1: 1.2;
        --line-height-h2: 1.25;
        --line-height-h3: 1.1666666667;
    }

    /* FOOTER ==================== */
    .footer-nav {
        padding: var(--spacing-3xl) var(--spacing-container);
    }

    .footer-nav .accordion-container {
        display: flex;
        justify-content: space-between;
        grid-gap: var(--spacing-xs);
    }

    .footer-nav .accordion > .entry-title {
        pointer-events: none;
    }

    .footer-nav .accordion > .entry-title:after {
        content: "";
    }

    .footer-nav .accordion > .entry-panel {
        display: block !important;
        padding-bottom: 0;
    }

    .footer-nav .entry-panel > ul {
        grid-gap: var(--spacing-4xs);
    }

    html.no-touchevents .footer-nav .entry-panel > ul a:hover {
        opacity: 0.5;
    }

    .footer-nav .footer-misc {
        max-width: 33.1rem;
    }

    .footer-nav .footer-social,
    .footer-nav .footer-address {
        margin-bottom: var(--spacing-2sm);
    }

    /* ELEMENT ====================*/
    .section-nav .swiper {
        width: fit-content;
        margin: 0;
    }

    /* PAGE */
    /* PAGE: INDEX */
    /* Results */
    [data-section="results"] .tab-links .swiper-wrapper {
        transform: none !important;
        flex-direction: column;
        gap: var(--spacing-4xs);
    }

    /* PAGE: FAQ */
    /* Tab Contents */
    [data-section="tabs-content"] .tab-links .swiper-wrapper {
        flex-direction: column;
        transform: none !important;
        grid-gap: var(--spacing-4xs);
    }
}

@media (min-width: 1280px) {
    .hidden-device-lg {
        display: none !important;
    }
}

@media (min-width: 1440px) {
    .hidden-device-xl {
        display: none !important;
    }
}

/* MEDIA QUERIES:MAX ==================== */
@media (max-width: 1439px) {
    .show-xl {
        display: none !important;
    }
}

@media (max-width: 1279px) {
    .show-lg {
        display: none !important;
    }
}

@media (max-width: 991px) {
    .show-md {
        display: none !important;
    }

    :root {
        --header-height: 5.7rem;
        --spacing-container: var(--spacing-xs);
        --logo-height: 4rem;

        --gap-section: 6rem;
    }

    .mb-size-h1 {
        font-size: var(--font-size-h1) !important;
        line-height: var(--line-height-h1) !important;
    }
    .mb-size-h2 {
        font-size: var(--font-size-h2) !important;
        line-height: var(--line-height-h2) !important;
    }
    .mb-size-h3 {
        font-size: var(--font-size-h3) !important;
        line-height: var(--line-height-h3) !important;
    }
    .mb-size-body {
        font-size: var(--font-size-body) !important;
        line-height: var(--line-height-body) !important;
    }
    .mb-size-button {
        font-size: var(--font-size-button) !important;
        line-height: var(--line-height-button) !important;
    }
    .mb-size-description {
        font-size: var(--font-size-description) !important;
        line-height: var(--line-height-description) !important;
    }
    .mb-size-description2 {
        font-size: var(--font-size-description2) !important;
        line-height: var(--line-height-description2) !important;
    }
    .mb-size-overline {
        font-size: var(--font-size-overline) !important;
        line-height: var(--line-height-overline) !important;
    }

    .sc-inner.pc-t-header {
        padding-top: var(--header-height);
    }
    .sc-inner.pc-t-2xs {
        padding-top: calc(var(--gap-section) / 4);
    }
    .sc-inner.pc-b-2xs {
        padding-bottom: calc(var(--gap-section) / 4);
    }
    .sc-inner.mb-t-xs {
        padding-top: calc(var(--gap-section) / 2);
    }
    .sc-inner.mb-t-sm {
        padding-top: calc(var(--gap-section) * 3 / 4);
    }
    .sc-inner.mb-t-base {
        padding-top: var(--gap-section);
    }
    .sc-inner.mb-t-2sm {
        padding-top: calc(var(--gap-section) * 1.25);
    }
    .sc-inner.mb-t-md {
        padding-top: calc(var(--gap-section) * 1.5);
    }
    .sc-inner.mb-t-lg {
        padding-top: calc(var(--gap-section) * 2);
    }
    .sc-inner.pc-b-header {
        padding-bottom: var(--header-height);
    }
    .sc-inner.mb-b-xs {
        padding-bottom: calc(var(--gap-section) / 2);
    }
    .sc-inner.mb-b-sm {
        padding-bottom: calc(var(--gap-section) * 3 / 4);
    }
    .sc-inner.mb-b-base {
        padding-bottom: var(--gap-section);
    }
    .sc-inner.mb-b-2sm {
        padding-bottom: calc(var(--gap-section) * 1.25);
    }
    .sc-inner.mb-b-md {
        padding-bottom: calc(var(--gap-section) * 1.5);
    }
    .sc-inner.mb-b-lg {
        padding-bottom: calc(var(--gap-section) * 2);
    }
    .sc-inner.mb-t-0 {
        padding-top: 0;
    }
    .sc-inner.mb-b-0 {
        padding-bottom: 0;
    }

    .field.half-width {
        width: 100%;
    }

    /* HEADER ==================== */
    .header-nav {
        padding: var(--spacing-4xs) var(--spacing-container);
    }

    .panel {
        position: fixed;
        z-index: 99;
        top: var(--header-height);
        right: 0;
        width: 100vw;
        height: calc(100dvh - var(--header-height));
        background-color: var(--color-white);
        overflow: hidden;
        z-index: 95;
        transform: translateX(100%);
        transition: transform var(--duration-x2) cubic-bezier(0.83, 0, 0.17, 1);
    }

    .panel-overlay {
        position: fixed;
        top: var(--header-height);
        left: 0;
        z-index: 90;
        width: 100vw;
        height: calc(100dvh - var(--header-height));
        background-color: rgba(var(--color-black-rgb), 0.8);
        opacity: 0;
        transition: opacity var(--duration-x2) var(--timing-function);
        pointer-events: none;
    }

    html.header-menu-enabled .panel {
        transform: translateX(0);
    }

    html.header-menu-enabled .panel-overlay {
        opacity: 1;
        pointer-events: auto;
    }

    .panel-scroll {
        --mask-box-image-offset: var(--spacing-2sm);
        height: 100%;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -ms-scroll-chaining: none;
        overscroll-behavior: contain;
        -webkit-mask-box-image: -webkit-linear-gradient(
            -90deg,
            transparent 0%,
            white var(--mask-box-image-offset),
            white calc(100% - var(--mask-box-image-offset)),
            transparent 100%
        );
    }

    .panel-body {
        padding: var(--mask-box-image-offset) var(--spacing-container);
    }

    .header-menu .menu {
        align-items: flex-start;
        flex-direction: column;
    }

    .submenu {
        top: 0;
        left: 0;
        width: 100%;
        height: 100dvh;
        overflow: auto;
    }

    .submenu::before {
        content: none;
    }

    .submenu-back {
        display: flex;
        align-items: center;
        grid-gap: var(--spacing-xs);
        color: var(--color-text) !important;
        margin: var(--mask-box-image-offset) 0;
        text-transform: uppercase;
    }

    .submenu .swiper-nav {
        display: none;
    }

    .submenu .swiper-wrapper {
        flex-direction: column;
        transform: none !important;
        grid-gap: var(--spacing-xs);
        margin-bottom: calc(var(--mask-box-image-offset) * 4);
    }

    .submenu.active .submenu-inner {
        transition-delay: 0s;
        background-color: var(--color-white);
    }

    .submenu.active .card-wrapper {
        transition-delay: calc(var(--duration) + (0.1s * var(--index)));
    }

    /* .submenu.active .card[data-card="submenu"] {
        transition-delay: calc(var(--duration) + (0.1s * var(--index)));
    } */

    .submenu .swiper-slide {
        padding-left: 0;
        padding-right: 0;
    }

    .card[data-card="submenu"] {
        width: 100%;
        display: flex;
        grid-gap: var(--spacing-xs);
        align-items: center;
    }

    [data-card="submenu"] .card-media {
        width: 33%;
        margin-bottom: 0;
        flex-shrink: 0;
    }

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

    /* COMPONENT */
    /* DEFAULT ====================*/

    /* SECTION ====================*/
    /* Slider Template 1 */
    [data-section="slider-template-1"] [class*="block-content-"] {
        gap: var(--spacing-xs);
    }

    [data-section="slider-template-1"] .card-marquee {
        margin-top: var(--spacing-2md);
    }

    [data-card="slider-service"] {
        width: 80.7692307692vw;
    }

    [data-card="slider-service"] .card-ttl > * {
        font-size: 2.4rem !important;
        line-height: 1.1666666667 !important;
    }

    [data-card="slider-service"] .card-subttl > * {
        font-size: var(--font-size-body) !important;
        line-height: var(--line-height-body) !important;
    }

    /* Contact */
    [data-section="contact"] .contact-content {
        grid-template-columns: 1fr;
        grid-template-rows: unset;
        column-gap: var(--spacing-lg);
        row-gap: var(--spacing-lg);
    }

    [data-section="contact"] .contact-form .field:has(.input-file) {
        width: 100%;
    }

    [data-section="contact"] .contact-map {
        grid-column: unset;
        grid-row: unset;
    }

    /* Contact Full Page */
    [data-section="contact"].full-page .contact-content {
        grid-template-columns: 1fr;
        grid-row: unset;
        row-gap: var(--spacing-lg);
    }

    [data-section="contact"].full-page .contact-map {
        grid-column: 1;
        grid-row: 1;
    }

    [data-section="contact"].full-page .contact-map .map {
        aspect-ratio: 1;
    }

    [data-section="contact"].full-page .contact-info {
        grid-column: 1;
        grid-row: 2;
    }

    [data-section="contact"].full-page .contact-form {
        grid-column: 1;
        grid-row: 3;
    }

    /* Image Banner */
    [data-section="image-banner"] {
        aspect-ratio: 1.21875;
    }

    [data-section="image-banner"] .image-banner-header {
        bottom: var(--spacing-container);
    }

    /* Content Template */
    .section-nav + [data-section*="content-template-"] .sc-inner,
    [data-section="image-banner"] + [data-section*="content-template-"] .sc-inner {
        padding-top: calc(var(--gap-section) * 1.5);
    }

    /* Content Template 1 */
    [data-section="content-template-1"] .container {
        grid-gap: calc(var(--gap-section) * 1.5);
    }

    [data-section="content-template-1"] .block-item {
        flex-direction: column !important;
        grid-gap: var(--spacing-2sm);
    }

    [data-section="content-template-1"] .block-item [class*="block-content-"] {
        width: 100%;
    }

    /* Content Template 2 */
    [data-section="content-template-2"] .card-container {
        --column: 1.7;
        --gap-x: var(--spacing-4xs);
        margin-top: var(--spacing-md);
    }

    [data-section="content-template-2"] .swiper-nav {
        margin-top: var(--spacing-md);
    }

    /* Content Template 3 */
    [data-section="content-template-3"] [class*="swiper-button-"] {
        background-color: rgba(var(--color-white-rgb), 0.3);
    }

    [data-section="content-template-3"] .swiper-button-next {
        right: var(--spacing-3xs);
    }

    [data-section="content-template-3"] .swiper-button-prev {
        left: var(--spacing-3xs);
    }

    [data-section="content-template-3"] .swiper-slide .media-container {
        height: auto;
        aspect-ratio: 1.4338235294;
    }

    [data-section="content-template-3"] .swiper-slide .media {
        aspect-ratio: unset;
        width: 100%;
    }

    /* Content Template 4 */
    [data-section="content-template-4"] .container {
        flex-direction: column;
        grid-gap: var(--spacing-2sm);
    }

    [data-section="content-template-4"] .sc-ttl {
        position: static;
        width: 100%;
    }

    /* Content Template 5 */
    /* 
    [data-section="content-template-5"] .media {
        aspect-ratio: 1.4338235294;
    } */

    /* Play Button */
    .video-play-button,
    .video-play-button.playing {
        left: var(--spacing-xs);
        bottom: var(--spacing-xs);
        opacity: 1;
    }

    .video-volume-button {
        opacity: 1;
        bottom: var(--spacing-xs);
        left: calc(var(--spacing-xs) + 5rem + var(--spacing-2xs));
    }

    /* Content Template 6 */
    [data-section="content-template-6"] .swiper {
        margin-top: var(--spacing-2sm);
    }

    [data-section="content-template-6"] .swiper .swiper-nav {
        margin-top: var(--spacing-2sm);
    }

    /* Content Template 7 */
    [data-section="content-template-7"] .results-marquee .marquee {
        gap: var(--spacing-xs);
        padding-left: var(--spacing-xs);
    }

    [data-section="content-template-7"] .results-marquee .object-fit,
    [data-section="content-template-7"] .results-marquee .object-fit * {
        height: calc(100vw - var(--spacing-container) * 2);
    }

    /* Contact Media */
    [data-section="contact-media"] .container {
        flex-direction: column;
    }

    [data-section="contact-media"] .media-block {
        aspect-ratio: 1.33;
        padding: var(--spacing-xs) var(--spacing-2sm);
        padding-top: var(--spacing-lg);
    }

    [data-section="contact-media"] .contact-block {
        width: 100%;
        min-width: unset;
        padding: var(--spacing-lg) var(--spacing-2sm) var(--spacing-4lg);
    }

    /* ELEMENT ====================*/
    /* Hero Text Banner */
    .hero-text-banner {
        height: 32rem;
        aspect-ratio: unset;
    }

    .hero-text-banner.about-hero {
        height: auto;
        aspect-ratio: unset;
    }

    .hero-text-banner.about-hero .container {
        width: 100vw;
        padding-top: calc(var(--header-height) + var(--spacing-lg));
    }

    /* Section Nav */
    .section-nav .nav-container {
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        grid-gap: 0;
    }

    .section-nav .nav-header {
        position: absolute;
        top: 0;
        left: var(--spacing-container);
        transform: translateY(-100%);
    }

    .section-nav .swiper {
        overflow: visible;
    }

    /* Caption Gallery */
    .caption-gallery .card-container {
        --column: 1.1;
    }

    /* PAGE */
    /* PAGE: INDEX */
    /* Content Media Template 1 */
    [data-section="content-media-template-1"] .media {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
    }

    /* Gallery Template 1 */
    /* [data-section="gallery-template-1"] .swiper-slide .media {
        aspect-ratio: 1;
    } */

    [data-section="gallery-template-1"] .gallery-marquee .object-fit,
    [data-section="gallery-template-1"] .gallery-marquee .object-fit * {
        height: 100vw;
    }

    .gallery-marquee .volume-button {
        opacity: 1;
        pointer-events: auto;
    }

    /* Results */
    [data-section="results"] .tab-container.main {
        --padding-y: var(--spacing-2md);
        --heading-offset: var(--spacing-2sm);
        flex-direction: column;
        grid-gap: 0;
    }

    [data-section="results"] .tab-contents.main {
        padding-bottom: 0;
    }

    [data-section="results"] .tab-links.main {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
    }

    [data-section="results"] .tab-links.main .swiper {
        --gap-x: var(--spacing-4xs);
        overflow: visible;
        margin-left: calc(var(--gap-x) / -2);
        margin-right: calc(var(--gap-x) / -2);
    }

    [data-section="results"] .tab-links.main .swiper-slide {
        width: auto !important;
        padding-left: calc(var(--gap-x) / 2);
        padding-right: calc(var(--gap-x) / 2);
    }

    [data-section="results"] .tab-header {
        flex-direction: column;
        margin-bottom: var(--spacing-2md);
    }

    .tab-contents.gender .card-container {
        --column: 2;
        --gap-x: var(--spacing-sm);
        --gap-y: var(--spacing-5xs);
        padding-bottom: var(--spacing-2md);
    }

    /* Fancy Box */
    .fancybox__dialog .fancybox__slide .f-panzoom__viewport {
        padding: 0;
    }

    .fancybox__dialog .is-horizontal.is-ltr .f-button.is-arrow.is-next {
        right: var(--spacing-3xs);
    }

    .fancybox__dialog .is-horizontal.is-ltr .f-button.is-arrow.is-prev {
        left: var(--spacing-3xs);
    }

    .fancybox__dialog .fancybox__slide.has-html.has-iframe .f-html iframe {
        height: 85%;
    }

    .fancybox__dialog .f-panzoom__wrapper {
        height: auto;
        max-height: 100% !important;
        max-width: 100% !important;
    }

    .fancybox__dialog .f-caption {
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 10;
        padding: var(--spacing-2xs);
        width: 100vw;
    }

    /* PAGE: TESTIMONIAL */
    [data-section="testimonial"] .sc-header {
        flex-direction: column;
        align-items: flex-start;
        grid-gap: var(--spacing-2sm);
    }

    [data-section="testimonial"] .sc-header .sc-text {
        grid-gap: var(--spacing-2sm);
    }

    [data-section="testimonial"] .tab-contents.gender .card-container {
        --column: 2;
        --gap-x: var(--spacing-sm);
        --gap-y: var(--spacing-5xs);
        padding-bottom: var(--spacing-2md);
    }

    /* TEMPLATE: BEFORE AFTER */
    [data-section="testimonial"].before-after-template .tab-contents.gender .card-container {
        --column: 2;
        --gap-x: var(--spacing-xs);
        --gap-y: var(--spacing-xs);
    }

    /* PAGE: BLOGS */
    /* Highlight Blog */
    [data-section="highlight-blog"] .container {
        gap: 0;
        flex-direction: column-reverse;
    }

    [data-section="highlight-blog"] .container > * {
        width: 100%;
    }

    [data-section="highlight-blog"] .blog-text {
        padding: var(--spacing-2md) var(--spacing-2sm);
        align-items: flex-start;
    }

    [data-section="highlight-blog"] .blog-text [class*="block-content-"] {
        max-width: unset;
    }

    [data-section="highlight-blog"] .blog-media::before {
        content: none;
    }

    /* Blog */
    [data-section="blog"] .sc-ttl {
        position: static;
    }

    [data-section="blog"] .container {
        flex-direction: column;
    }

    [data-section="blog"] .blog-list {
        width: 100%;
    }

    [data-section="blog"] .card-container {
        --column: 1;
    }

    /* PAGE: BLOG SINGLE */
    [data-section="template-single"] .container:first-child {
        flex-direction: column;
        gap: var(--spacing-3xl);
    }

    [data-section="template-single"] .doctor-media {
        width: 100%;
    }

    [data-section="template-single"] .template-single-other {
        width: 100%;
        position: static;
    }

    [data-section="template-single"] .gallery-container {
        margin-top: var(--gap);
    }

    /* PAGE: EXPERTISE */
    [data-section="expertise"] .doctor.card-container {
        --column: 1;
        margin-bottom: calc(var(--gap-section) * 1.5);
        padding-bottom: calc(var(--gap-section) * 1.5);
    }

    /* PAGE: FAQ */
    /* Tab Contents */
    [data-section="tabs-content"] .sc-inner {
        margin: 0;
    }

    [data-section="tabs-content"] .container {
        flex-direction: column;
        gap: var(--spacing-2lg);
    }

    [data-section="tabs-content"] .tab-links {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        padding: var(--spacing-2md) var(--spacing-container);
        padding-top: calc(var(--header-height) + var(--spacing-2md));
        position: static;
        min-height: unset;
    }

    [data-section="tabs-content"] .tab-links .swiper {
        overflow: visible;
    }

    [data-section="tabs-content"] .tab-links .swiper-slide {
        width: auto !important;
    }

    [data-section="tabs-content"] .tab-links .swiper-slide:not(:last-child) {
        padding-right: var(--spacing-4xs);
    }

    [data-section="tabs-content"] .tab-links .sc-ttl {
        margin-bottom: var(--spacing-2sm);
    }

    [data-section="tabs-content"] .content-ttl {
        margin-top: 0;
        margin-bottom: var(--spacing-4xs);
    }

    [data-section="tabs-content"] .accordion .entry-title {
        padding: var(--spacing-2xs) var(--spacing-xs);
    }

    [data-section="tabs-content"] .accordion .entry-panel {
        padding-left: 0;
        padding-top: var(--spacing-2sm);
        padding-bottom: var(--spacing-2sm);
    }

    /* PAGE: CONTACT */
    /* Full Screen Slide */
    [data-section="full-screen-slide"] .media {
        width: 100vw;
        height: auto !important;
        aspect-ratio: 1;
    }

    /* PAGE: NOT FOUND */
    [data-section="not-found"] .container::before {
        height: auto;
        width: 126.6666666667vw;
    }
}

@media (max-width: 767px) {
    .show-sm {
        display: none !important;
    }
}

@media (max-width: 575px) {
    .show-xs {
        display: none !important;
    }
}

@media (max-width: 390px) {
    .show-2xs {
        display: none !important;
    }

    /* FOOTER ==================== */
    .footer-social .social {
        justify-content: space-between;
    }
}

@media (max-width: 389px) {
    /* PAGE */
    /* PAGE: TESTIMONIAL */
    [data-section="testimonial"] .sc-nav {
        flex-wrap: wrap;
    }

    [data-section="testimonial"] .popup-content {
        right: unset;
        left: 0;
    }
}
