/* ==========================================================================
   Responsive: all @media consolidated (large -> small)
   Merged equals: 1200/1199.98/1199, 991.98/991, 768/767.98/767, 576/575.98/575
   ========================================================================== */

@media (max-width: 1728px) {
    .logo {
        width: 188px;
        height: auto;
    }

    header {
        padding: 26px 0;
    }

    /* .header-nav {
    gap: 20px;
  } */
    /* .header-nav a {
    font-size: 15px;
    line-height: 22px;
    white-space: nowrap;
  } */
    .btn-component-white {
        padding: 9px 14px;
        font-size: 15px;
        white-space: nowrap;
    }

    .container-home {
        width: 88vw;
    }

    .text-hero p {
        font-size: 36px;
        line-height: 40px;
    }

    .text-hero span {
        font-size: 46px;
        line-height: 54px;
        width: 430px;
    }

    .text-hero.text-hero-left {
        left: 14%;
    }

    .text-hero.text-hero-right {
        right: 12%;
        bottom: 24%;
    }

    .text-hero.text-hero-right span {
        font-size: 28px;
        line-height: 40px;
        width: 460px;
    }

    .text-hero.text-hero-right span p {
        font-size: 32px;
        line-height: 40px;
    }

    .about-content {
        padding: 100px 0 140px;
    }

    .product-card {
        width: min(28vw, 360px);
    }

    .products-stage .owl-nav button.owl-prev {
        left: 24%;
    }

    .products-stage .owl-nav button.owl-next {
        right: 24%;
    }

    .combo-slide-copy h3 {
        font-size: 36px;
        line-height: 44px;
    }

    .bestsellers-inner {
        height: auto;
        padding: 80px 6vw;
        gap: 4vw;
    }

    .bestsellers-media {
        width: 440px;
        height: 500px;
    }

    .bestsellers-panel {
        /* max-width: 520px; */
        /* height: 420px; */
    }

    .bestsellers-item p {
        font-size: 26px;
        line-height: 34px;
    }

    .science {
        height: 540px;
    }

    .science-copy h2 {
        font-size: 42px;
        line-height: 50px;
    }

    .experts-copy-inner h2 {
        font-size: 42px;
        line-height: 50px;
    }

    .experts-track {
        height: 440px;
    }
}

@media (max-width: 1512px) {
    .logo {
        width: 176px;
    }

    header {
        padding: 24px 0;
    }

    /* .header-nav {
    gap: 16px;
  } */
    /* .header-nav a {
    font-size: 14px;
    line-height: 20px;
  } */
    .btn-component-white {
        padding: 8px 12px;
        font-size: 14px;
    }

    .container-home {
        width: 90vw;
    }

    .text-hero {
        bottom: 28%;
    }

    .text-hero p {
        font-size: 34px;
        line-height: 38px;
    }

    .text-hero span {
        font-size: 42px;
        line-height: 50px;
        width: 400px;
    }

    .text-hero.text-hero-left {
        left: 12%;
    }

    .text-hero.text-hero-right {
        right: 10%;
        bottom: 25%;
    }

    .text-hero.text-hero-right span {
        font-size: 30px;
        line-height: 38px;
        width: 420px;
    }

    .text-hero.text-hero-right span p {
        font-size: 30px;
        line-height: 38px;
    }

    .about-content {
        padding: 90px 0 120px;
    }

    .about-content .title {
        font-size: 40px;
        line-height: 48px;
    }

    .product-card {
        width: min(30vw, 350px);
    }

    .products-stage .owl-nav button.owl-prev {
        left: 22%;
    }

    .products-stage .owl-nav button.owl-next {
        right: 22%;
    }

    .combo-slide-copy h3 {
        font-size: 32px;
        line-height: 40px;
    }

    .bestsellers-inner {
        height: auto;
        padding: 70px 5vw;
        gap: 3.5vw;
    }

    .bestsellers-media {
        width: 400px;
        height: 460px;
    }

    .bestsellers-panel {
        /* max-width: 480px; */
        /* height: 380px; */
    }

    .bestsellers-item p {
        font-size: 24px;
        line-height: 32px;
    }

    .science {
        height: 480px;
    }

    .science-copy h2 {
        font-size: 38px;
        line-height: 46px;
    }

    .experts-copy-inner h2 {
        font-size: 38px;
        line-height: 46px;
    }

    .experts-track {
        height: 400px;
    }
}

@media (max-width: 1440px) {
    .logo {
        width: 164px;
    }

    header {
        padding: 20px 0;
    }

    /* .header-nav {
    gap: 12px;
  } */
    /* .header-nav a {
    font-size: 13.5px;
    line-height: 19px;
  } */
    .btn-component-white {
        padding: 7px 11px;
        font-size: 13.5px;
    }

    #product {
        transform: none;
    }

    .product-fallback,
    .product-fallback.is-ready {
        width: 95px !important;
        height: auto !important;
        aspect-ratio: 136.432 / 435;
    }

    .container-home {
        width: 90vw;
    }

    .text-hero {
        bottom: 24%;
    }

    .text-hero p {
        font-size: 34px;
        line-height: 38px;
    }

    .text-hero span {
        font-size: 42px;
        line-height: 48px;
        width: 380px;
    }

    .text-hero.text-hero-left {
        left: 15%;
    }

    .text-hero.text-hero-right {
        right: 15%;
        bottom: 24%;
    }

    .text-hero.text-hero-right span {
        font-size: 28px;
        line-height: 38px;
        width: 380px;
    }

    .text-hero.text-hero-right span p {
        font-size: 30px;
        line-height: 38px;
    }

    .about-center {
        width: 9vw;
        height: 9vw;
        max-width: 130px;
        max-height: 130px;
    }

    .about-content {
        padding: 80px 0 100px;
        gap: 56px;
    }

    .about-content .title {
        font-size: 36px;
        line-height: 44px;
    }

    .about-content-item {
        width: min(400px, 44%);
    }

    .about-content-item h3 {
        font-size: 26px;
        line-height: 34px;
    }

    .about-content-item div {
        font-size: 18px;
        line-height: 23px;
    }

    .product-card {
        width: min(30vw, 340px);
    }

    .products-stage .owl-nav button.owl-prev {
        left: 30%;
    }

    .products-stage .owl-nav button.owl-next {
        right: 30%;
    }

    .combo-head {
        padding: 60px 0 32px;
    }

    .combo-head .title {
        font-size: 36px;
        line-height: 44px;
    }

    .combo-slide-copy {
        left: 60px;
        bottom: 40px;
    }

    .combo-slide-copy h3 {
        font-size: 32px;
        line-height: 40px;
    }

    .combo-slide-copy p,
    .combo-slide-copy span {
        font-size: 16px;
        line-height: 24px;
    }

    .combo-slide-buy {
        right: 60px;
        bottom: 40px;
    }

    .bestsellers-inner {
        height: auto;
        padding: 60px 5vw;
        gap: 3.5vw;
    }

    .bestsellers-media {
        width: 360px;
        height: 420px;
    }

    .bestsellers-panel {
        /* max-width: 460px; */
        /* height: 360px; */
    }

    .bestsellers-panel h2 {
        font-size: 22px;
        line-height: 30px;
    }

    .bestsellers-item {
        padding: 24px 0 32px;
    }

    .bestsellers-item p {
        font-size: 24px;
        line-height: 32px;
    }

    .science {
        height: 450px;
    }

    .science-inner {
        width: 70vw;
        padding-top: 50px;
        gap: 36px;
    }

    .science-copy h2 {
        font-size: 38px;
        line-height: 46px;
    }

    .science-copy p {
        width: 65vw;
        font-size: 15px;
        line-height: 23px;
    }

    .experts {
        padding: 50px 5vw;
    }

    .experts-copy-inner {
        width: 26vw;
    }

    .experts-copy-inner h2 {
        font-size: 38px;
        line-height: 46px;
        margin-bottom: 36px;
    }

    .experts-copy-inner>p {
        font-size: 15px;
        line-height: 23px;
        margin-bottom: 24px;
        padding-top: 24px;
    }

    .experts-track {
        height: 380px;
    }

    .expert-id h3 {
        font-size: 24px;
        line-height: 30px;
    }

    .footer {
        padding: 80px 5vw 36px;
    }

    .footer-main {
        gap: 40px;
    }

    .contact-page {
        padding-top: 0;
    }

    .pdp-page .container-home {
        max-width: 1260px;
    }

    .pdp-reviews {
        padding-left: max(20px, (100% - 1260px) / 2);
        padding-right: max(20px, (100% - 1260px) / 2);
    }

    .pdp-related {
        padding-left: max(20px, (100% - 1260px) / 2);
        padding-right: max(20px, (100% - 1260px) / 2);
    }

    .pdp-sticky {
        padding-left: max(20px, (100% - 1260px) / 2);
        padding-right: max(20px, (100% - 1260px) / 2);
    }

    .pdp-sticky-inner {
        max-width: 1260px;
    }

    .checkout-page .container-home {
        max-width: 1260px;
    }

    .cart-page .container-home {
        max-width: 1260px;
    }

    .blog-page .container-home {
        max-width: 1260px;
    }

    .account-body .container-home {
        max-width: 1260px;
    }
}

@media (max-width: 1400px) {
    .b2b-hero {
        padding: 40px 48px 32px 48px;
    }

    .b2b-hero__title {
        font-size: 46px;
    }

    .b2b-hero .b2b-benefits-row {
        grid-template-columns: repeat(2, 1fr);
    }

    .b2b-panel {
        padding: 32px 48px;
    }
}

 @media (max-width: 1366px) {
    .container {
        max-width: 1230px;
    }

    .logo {
        width: 152px;
    }

    header {
        padding: 18px 0;
    }

    /* .header-nav {
    gap: 10px;
  } */
    /* .header-nav a {
    font-size: 13px;
    line-height: 18px;
  } */
    .btn-component-white {
        padding: 7px 10px;
        font-size: 13px;
    }

    #product {
        transform: none;
    }

    .product-fallback,
    .product-fallback.is-ready {
        width: 88px !important;
        height: auto !important;
        aspect-ratio: 136.432 / 435;
    }

    .container-home {
        width: 90vw;
    }

    .text-hero {
        bottom: 22%;
    }

    .text-hero p {
        font-family: var(--font-NotoSerif_ExtraCondensed-Bold);
        font-size: 28px;
        line-height: 32px;
    }

    .text-hero span {
        font-family: var(--font-NotoSerif_ExtraCondensed-Bold);
        font-size: 34px;
        line-height: 40px;
        width: 340px;
    }

    .text-hero.text-hero-left {
        left: 12%;
        transform: translateX(-24px);
    }

    .text-hero.text-hero-right {
        right: 12%;
        bottom: 22%;
        transform: translateX(24px);
    }

    .text-hero.text-hero-right span {
        font-size: 26px;
        line-height: 34px;
        width: 340px;
    }

    .text-hero.text-hero-right span p {
        font-size: 26px;
        line-height: 34px;
    }

    .about-center {
        width: 8vw;
        height: 8vw;
        max-width: 110px;
        max-height: 110px;
    }

    .about-content {
        padding: 60px 0 80px;
        gap: 48px;
    }

    .about-content .title {
        font-size: 32px;
        line-height: 40px;
    }

    .about-content-item {
        width: min(360px, 46%);
    }

    .about-content-item h3 {
        font-size: 24px;
        line-height: 32px;
    }

    .about-content-item div {
        font-size: 14px;
        line-height: 22px;
    }

    .product-card {
        width: min(32vw, 320px);
    }

    .products-stage .owl-nav button.owl-prev {
        left: 28%;
    }

    .products-stage .owl-nav button.owl-next {
        right: 28%;
    }

    .combo-head {
        padding: 50px 0 28px;
    }

    .combo-head .title {
        font-size: 32px;
        line-height: 40px;
    }

    .combo-slide-copy {
        left: 48px;
        bottom: 32px;
    }

    .combo-slide-copy h3 {
        font-size: 26px;
        line-height: 34px;
    }

    .combo-slide-copy p,
    .combo-slide-copy span {
        font-size: 15px;
        line-height: 22px;
    }

    .combo-slide-buy {
        right: 48px;
        bottom: 32px;
    }

    .bestsellers-inner {
        height: auto;
        padding: 48px 4vw;
        gap: 3vw;
    }

    .bestsellers-media {
        width: 310px;
        height: 360px;
    }

    .bestsellers-panel {
        /* height: 300px; */
    }

    .bestsellers-panel h2 {
        font-size: 20px;
        line-height: 28px;
    }

    .bestsellers-item {
        padding: 20px 0 28px;
    }

    .bestsellers-item p {
        font-size: 20px;
        line-height: 28px;
    }

    .science {
        height: 380px;
    }

    .science-inner {
        width: 75vw;
        padding-top: 40px;
        gap: 28px;
    }

    .science-copy h2 {
        font-size: 28px;
        line-height: 36px;
    }

    .science-copy p {
        width: 70vw;
        font-size: 14px;
        line-height: 22px;
    }

    .experts {
        padding: 40px 4vw;
    }

    .experts-copy-inner {
        width: 28vw;
    }

    .experts-copy-inner h2 {
        font-size: 28px;
        line-height: 36px;
        margin-bottom: 28px;
    }

    .experts-copy-inner>p {
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 20px;
        padding-top: 20px;
    }

    .experts-track {
        height: 350px;
    }

    .expert-id h3 {
        font-size: 22px;
        line-height: 28px;
    }

    .footer {
        padding: 60px 4vw 32px;
    }

    .footer-main {
        gap: 32px;
    }

    .pdp-buy-grid {
        gap: 40px;
    }

    .pdp-desc-copy {
        padding: 32px 40px 32px 48px;
    }

    .pdp-desc--howto .pdp-desc-copy {
        padding: 32px 48px 32px 40px;
    }

    .pdp-ingredients-grid {
        grid-template-columns: minmax(0, 1fr) minmax(240px, 320px) minmax(0, 1fr);
        gap: 24px;
    }
}

@media (max-width: 1199.98px) {
    .ep-hero-visual {
        margin-right: 0;
    }

    .ep-hero-badge {
        left: 0;
    }

    .ep-hero-badge-name {
        font-size: 28px;
        line-height: 36px;
    }

    .ep-hero-photo--beth {
        max-width: 440px;
    }

    .ep-hero-stat-col .ep-hero-stat-num {
        white-space: normal;
    }

    .ep-philosophy-card {
        padding: 48px 40px;
        border-radius: 120px;
    }

    .b2b-hero {
        padding: 32px 36px 28px 36px;
    }

    .b2b-hero__title {
        font-size: 38px;
    }

    .b2b-hero .b2b-stat__value {
        font-size: 28px;
        line-height: 34px;
    }

    .b2b-panel {
        padding: 24px 32px;
    }

    .b2b-kpi-summary-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .b2b-profile-grid {
        flex-direction: column;
    }

    .b2b-profile-sidebar {
        width: 100%;
        min-width: 100%;
    }

    .team-hero {
        padding-top: 280px;
        padding-bottom: 56px;
    }

    .team-hero-title {
        top: 140px;
        font-size: 70px;
    }

    .team-hero-intro {
        gap: 48px;
        padding-top: 40px;
    }

    .team-intro-title {
        font-size: 36px;
        line-height: 44px;
    }

    .team-section-title {
        font-size: 40px;
        line-height: 48px;
    }

    .team-member {
        grid-template-columns: 360px minmax(0, 1fr);
        gap: 48px;
    }

    .team-member-photo {
        max-width: 360px;
        height: 460px;
    }

    .team-consult-card {
        gap: 48px;
        padding: 48px 36px;
    }

    .header-toggle {
        display: grid;
        grid-column: 1;
    }

    .header-inner {
        grid-template-columns: 40px 1fr auto;
    }

    .header-brand {
        grid-column: auto;
    }

    .header-nav--start {
        display: none;
    }

    .header-nav--end {
        gap: 16px;
    }

    .header-nav--end>li:not(.header-tool):not(.header-auth) {
        display: none;
    }

    .header-nav--end .header-auth-guest,
    .header-nav--end .header-auth-guest:hover,
    header.header-white .header-nav--end .header-auth-guest,
    header.header-white .header-nav--end .header-auth-guest:hover,
    body:has(.hero) header.absolute .header-nav--end .header-auth-guest,
    body:has(.hero) header.absolute .header-nav--end .header-auth-guest:hover {
        min-height: 0;
        width: 24px;
        height: 24px;
        padding: 0;
        gap: 0;
        background: transparent !important;
        box-shadow: none;
        border-radius: 0;
        transform: none;
        color: inherit !important;
    }

    .header-nav--end .header-auth-guest-label {
        display: none;
    }

    .header-nav--end .header-auth-guest-icon {
        display: block !important;
        width: 24px !important;
        height: 24px;
    }

    .header-nav--end .header-user-name,
    .header-nav--end .header-user-caret {
        display: none;
    }

    .text-hero p {
        font-size: 28px;
        line-height: 34px;
    }

    .text-hero span {
        font-size: 32px;
        line-height: 38px;
        width: min(280px, 36vw);
    }

    .text-hero.text-hero-left {
        left: 4%;
    }

    .text-hero.text-hero-right {
        right: 4%;
        bottom: 22%;
    }

    .text-hero.text-hero-right span {
        font-size: 22px;
        line-height: 28px;
        width: min(300px, 38vw);
    }

    .text-hero.text-hero-right span p {
        font-size: 22px;
        line-height: 28px;
    }

    .scroll-down {
        display: none;
    }

    .hero {
        overflow: hidden;
    }

    .hero-pin {
        position: absolute;
        inset: 0;
        z-index: 8;
        display: flex;
        align-items: center;
        justify-content: center;
        pointer-events: none;
    }

    .product-fallback {
        position: fixed;
        left: 50%;
        top: 50%;
        z-index: 26;
        width: 110px;
        height: auto;
        aspect-ratio: 136.432 / 435;
        transform: translate(-50%, -50%);
    }

    .product-fallback.is-ready {
        opacity: 0;
        visibility: hidden;
    }

    .about-center {
        display: none;
        position: fixed;
        left: 0;
        right: 0;
        top: auto;
        bottom: 10%;
        margin-left: auto;
        margin-right: auto;
        width: 22vw;
        height: 22vw;
        max-width: 88px;
        max-height: 88px;
        opacity: 0;
        transform: none;
        translate: none;
    }

    .products-stage .owl-nav {
        opacity: 1;
        visibility: visible;
    }

    .product-card.is-active .product-card-image {
        visibility: visible;
    }

    .about-content {
        width: min(85.89744vw, 100% - 80px);
        padding: 80px 0 120px;
        gap: 64px;
    }

    .about-content-item {
        width: min(411px, 42%);
    }

    .about-content .title {
        font-size: 36px;
        line-height: 44px;
    }

    .about-content-item h3 {
        font-size: 28px;
        line-height: 36px;
    }

    .about-content-item-flex {
        margin-bottom: 120px;
    }

    .trusted {
        padding-top: 64px;
    }

    .trusted h2 {
        font-size: 36px;
        line-height: 44px;
        margin-bottom: 32px;
    }

    .trusted-item img {
        width: 160px;
        height: 160px;
    }

    .journey-head {
        padding: 64px 40px;
    }

    .journey-head h2,
    .hybrid-intro h2,
    .method h2 {
        font-size: 36px;
        line-height: 44px;
    }

    .journey-block {
        padding: 40px 40px 56px;
        gap: 24px;
    }

    .journey-copy h3 {
        font-size: 28px;
        line-height: 36px;
    }

    .journey-num {
        font-size: 140px;
    }

    .hybrid-intro {
        padding-top: 48px;
    }

    .hybrid-card {
        margin-top: -80px;
    }

    .method-cols .col-4,
    .method-cols .col-md-4 {
        padding: 0 20px;
    }

    .method-item {
        gap: 32px;
        padding: 40px 16px;
    }

    .hero-contact {
        padding: 48px 0 48px;
    }

    .contact-hero h1 {
        font-size: 36px;
        line-height: 44px;
    }

    .contact-support {
        padding: 48px 0;
        margin-top: 0;
    }

    .contact-support-head h2 {
        font-size: 32px;
        line-height: 40px;
    }

    .contact-support-grid {
        grid-template-columns: 1fr;
    }

    .contact-office-list {
        grid-template-rows: none;
        height: auto;
    }

    .contact-office-card {
        min-height: 280px;
    }

    .contact-faq {
        padding: 56px 0;
    }

    .catalog-card-media,
    .catalog-card-media-link {
        border-radius: 12px;
    }

    .catalog-card-cta {
        left: auto;
        right: 10px;
        bottom: 10px;
        width: 40px;
        height: 40px;
        min-height: 40px;
        padding: 0;
        gap: 0;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.94);
        box-shadow: 0 4px 18px rgba(4, 26, 52, 0.12);
        font-size: 0;
        line-height: 0;
        color: transparent;
    }

    .catalog-card-cta img {
        display: block !important;
        width: 18px !important;
        height: 18px;
        position: absolute;
    }

    .catalog-card-cta[data-select-type]::before {
        content: "";
        position: absolute;
        width: 13px;
        height: 13px;
        border: 1.5px solid #005788;
        border-radius: 3px;
        box-shadow: 3px 3px 0 -1px #fff, 3px 3px 0 0 #005788;
    }

    .guide-section {
        padding: 140px 0 100px;
    }

    .guide-shell {
        padding: 40px 32px;
        gap: 24px;
        border-radius: 24px;
    }

    .guide-article h2 {
        font-size: 32px;
        line-height: 40px;
    }

    .guide-faq-title {
        font-size: 26px !important;
        line-height: 34px !important;
    }

    .header-nav--end .header-auth-guest,
    .header-nav--end .header-auth-guest:hover {
        min-height: 0;
        width: 24px;
        height: 24px;
        padding: 0;
        gap: 0;
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0;
        transform: none;
        color: inherit !important;
    }

    .hybrid-detail-intro h1,
    .hybrid-detail-story-head h2,
    .hybrid-detail-pillars h2,
    .hybrid-detail-diff h2,
    .hybrid-detail-faq .contact-section-title {
        font-size: 40px;
        line-height: 48px;
    }

    .hybrid-detail-pillars-dna {
        width: 1400px;
        height: auto;
        bottom: -120px;
    }
}

@media (max-width: 1100px) {
    .container {
        max-width: 1090px;
    }

    .checkout-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .checkout-aside {
        position: static;
    }

    .cart-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .cart-aside {
        position: static;
        width: 100%;
    }

    .cam-nang-featured-grid {
        grid-template-columns: 1fr;
    }

    .cam-nang-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .team-process-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: none;
        margin: 0;
    }

    .team-process-card {
        height: auto;
        min-height: 340px;
    }

    .team-member {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .team-member-photo {
        max-width: 443px;
        margin: 0 auto;
        height: 480px;
    }

    .team-consult-card {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 32px 24px;
    }

    .ep-story-grid {
        grid-template-columns: 1fr;
    }

    .ep-story-copy {
        padding-left: 0;
    }

    .ep-press {
        grid-template-columns: 1fr;
    }

    .ep-gallery-grid {
        grid-template-columns: 1fr 1fr;
        height: auto;
    }

    .ep-gallery-main {
        grid-column: 1/-1;
        height: 320px;
    }

    .ep-consult-card {
        flex-direction: column;
        gap: 32px;
        padding: 32px 24px;
    }

    .ep-consult-aside {
        width: 100%;
        height: auto;
        padding-top: 0;
    }

    .ep-consult-photo {
        flex: none;
        width: min(294px, 100%);
        height: auto;
        margin: 16px auto 0;
    }

    .ep-process-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .ep-process-step {
        flex-direction: row;
        gap: 16px;
        align-items: center;
        padding: 24px 0;
        border-bottom: 0;
    }

    .ep-process-step:not(:last-child) {
        border-right: 0;
    }
}

@media (max-width: 1024px) {

    .error-solutions-grid,
    .error-knowledge-grid,
    .error-connect-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .metric-card__info .metric-value {
        font-size: 18px !important;
    }
}

@media (max-width: 991.98px) {
    .about-intro {
        padding-bottom: 48px;
    }

    .account-sidebar {
        max-width: none;
    }

    .account-form {
        padding-left: 16px;
        padding-right: 16px;
    }

    .orders-head {
        flex-direction: column;
        align-items: stretch;
    }

    .orders-search {
        max-width: none;
    }

    .order-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .order-item-right {
        width: 100%;
        justify-content: space-between;
        gap: 16px;
        padding-left: 72px;
    }

    .order-detail-aside {
        max-width: none;
        margin-top: 16px;
    }

    .order-detail-contacts {
        flex-direction: column;
    }

    .order-detail-contact {
        padding-right: 0;
        padding-bottom: 16px;
        border-right: 0;
        border-bottom: 1px solid #dce5ee;
    }

    .order-detail-contact:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }

    .b2b-hero {
        min-height: auto;
        padding: 48px 24px;
    }

    .b2b-panel {
        min-height: auto;
        padding: 40px 20px;
    }

    .b2b-sidebar {
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        transform: translateX(-100%);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    }

    .b2b-sidebar.show {
        transform: translateX(0);
    }

    .b2b-topbar__left .b2b-sidebar-toggle {
        display: block;
    }

    .text-hero {
        left: 24px;
        right: 24px;
        width: auto;
        transform: none;
    }

    .text-hero p {
        font-size: 24px;
        line-height: 30px;
    }

    .text-hero span {
        font-size: 28px;
        line-height: 34px;
        width: auto;
    }

    .text-hero.text-hero-right {
        left: 0;
        right: 24px;
        bottom: 18%;
        text-align: center;
    }

    .text-hero.text-hero-right span,
    .text-hero.text-hero-right span p {
        font-size: 20px;
        line-height: 26px;
        width: auto;
    }

    .product-card {
        width: min(72vw, 320px);
        min-width: 0;
    }

    .product-card-info h3 {
        font-size: 22px;
    }

    .product-card-meta {
        font-size: 16px;
    }

    .products-nav-prev {
        left: 16px;
    }

    .products-nav-next {
        right: 16px;
    }

    .about-content {
        width: calc(100% - 48px);
        margin-top: 0;
        padding: 64px 0 80px;
        gap: 48px;
    }

    .about-content-item {
        width: min(411px, 46%);
    }

    .about-content .title {
        font-size: 28px;
        line-height: 36px;
    }

    .about-content-item h3 {
        font-size: 22px;
        line-height: 30px;
    }

    .about-content-item div {
        font-size: 16px;
        line-height: 24px;
    }

    .about-content-item-flex {
        margin-bottom: 80px;
    }

    .combo-head {
        padding: 48px 20px 32px;
    }

    .combo-slider .owl-carousel,
    .combo-slider .owl-stage-outer,
    .combo-slider .owl-stage,
    .combo-slider .owl-item,
    .combo-slider .combo-slide {
        height: 64vw;
        min-height: 360px;
    }

    .combo-slider .owl-nav button.owl-prev {
        left: 16px;
    }

    .combo-slider .owl-nav button.owl-next {
        right: 16px;
    }

    .combo-slide-copy {
        left: 24px;
        bottom: 24px;
        max-width: calc(100% - 48px);
        gap: 8px;
    }

    .combo-slide-copy h3 {
        font-size: 28px;
        line-height: 36px;
    }

    .combo-slide-buy {
        right: 24px;
        bottom: 24px;
    }

    .bestsellers-inner {
        height: auto;
        min-height: 0;
        padding: 48px 32px;
        gap: 32px;
    }

    .bestsellers-media {
        width: min(42vw, 320px);
        height: min(48vw, 360px);
    }

    .bestsellers-panel {
        max-width: none;
        height: auto;
        overflow: visible;
    }

    .bestsellers-item {
        position: relative;
        padding: 20px 0;
    }

    .bestsellers-item p {
        font-size: 22px;
        line-height: 30px;
        white-space: normal;
    }

    .science {
        height: auto;
        min-height: 420px;
    }

    .science-inner {
        width: calc(100% - 48px);
        padding: 48px 0 56px;
        gap: 28px;
    }

    .science-copy h2 {
        font-size: 32px;
        line-height: 40px;
    }

    .science-copy p {
        width: 100%;
    }

    .experts {
        padding: 48px 24px;
    }

    .experts-shell {
        flex-direction: column;
        border-radius: 20px;
    }

    .experts-copy {
        width: 100%;
    }

    .experts-copy-inner {
        width: auto;
        padding: 40px 32px 16px;
    }

    .experts-copy-inner h2 {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 16px;
    }

    .experts-copy-inner>p {
        margin-bottom: 24px;
        padding-top: 16px;
    }

    .experts-slider {
        padding: 16px 24px 32px;
    }

    .experts-track {
        height: 420px;
    }

    .footer-top,
    .footer-bottom {
        flex-direction: column;
        gap: 40px;
    }

    .footer-contact,
    .footer-form-wrap,
    .footer-brand,
    .footer-policy {
        width: 100%;
        max-width: none;
    }

    .footer-form-wrap h2 {
        font-size: 32px;
        line-height: 40px;
    }

    .footer-form-wrap>p {
        margin-bottom: 20px;
    }

    .footer-form-row {
        grid-template-columns: minmax(0, 1fr) 56px;
    }

    .footer-form-row>.footer-field:first-child {
        grid-column: 1/-1;
    }

    .footer-submit {
        justify-self: flex-end;
    }

    .footer-nav-cols {
        gap: 32px;
    }

    .footer-nav,
    .footer-policy {
        gap: 16px;
    }

    .footer-copy {
        white-space: normal;
    }

    .footer-top,
    .footer-bottom {
        flex-direction: column;
        gap: 32px;
    }

    .footer-contact,
    .footer-form-wrap,
    .footer-brand,
    .footer-nav,
    .footer-policy {
        width: 100%;
        max-width: none;
    }

    .footer-nav,
    .footer-policy {
        gap: 16px;
    }

    .footer-copy {
        white-space: normal;
    }

    .hero:has(+ .trusted) {
        display: block;
        height: 46svh;
        min-height: 240px;
        padding: 0;
    }

    .trusted .row>[class*=col-] {
        margin-bottom: 32px;
    }

    .trusted .row {
        padding-bottom: 8px;
    }

    .trusted-item {
        gap: 12px;
    }

    .trusted-item img {
        width: 140px;
        height: 140px;
    }

    .trusted-item p {
        font-size: 16px;
        line-height: 24px;
    }

    .journey-head {
        padding: 48px 24px;
    }

    .journey-head h2,
    .hybrid-intro h2,
    .method h2,
    .partners h2 {
        font-size: 28px;
        line-height: 36px;
    }

    .journey-block {
        flex-direction: column;
        align-items: stretch;
        padding: 32px 24px 40px;
        gap: 16px;
    }

    .journey-copy {
        max-width: none;
    }

    .journey-copy h3 {
        font-size: 24px;
        line-height: 32px;
    }

    .ep-award-logo {
        width: 40px;
        height: 40px;
    }

    .ep-press-slider .owl-dots {
        display: none;
    }

    .journey-num {
        font-size: 96px;
        align-self: flex-end;
    }

    .journey-body {
        text-align: left;
    }

    .hybrid-intro {
        padding-top: 40px;
        padding-bottom: 48px;
    }

    .hybrid-intro h2 {
        margin-bottom: 16px;
    }

    .hybrid-intro p {
        margin: 0;
        max-width: none;
    }

    .about-intro .about-intro-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .about-intro .about-intro-actions .btn-pill {
        width: 100%;
        justify-content: center;
        min-height: 52px;
        font-size: 16px;
    }

    .method-item p {
        height: auto;
    }

    .hybrid-card {
        margin-top: 10px;
        padding: 24px 16px;
    }

    .result-quote {
        background: linear-gradient(180deg, #004b8800 3.42%, #041a34 64.94%);
    }

    .hybrid-point {
        padding: 16px 8px 24px;
    }

    .hybrid-quote {
        flex-direction: column;
        min-height: 0;
        margin-top: 32px;
    }

    .hybrid-portrait {
        width: min(100%, 360px);
        margin: 24px auto 0;
    }

    .hybrid-chip {
        left: 16px;
        transform: none;
    }

    .method {
        padding: 48px 0;
    }

    .method-cols .col-4,
    .method-cols .col-md-4 {
        padding: 0;
    }

    .method-cols .col-4:not(:last-child),
    .method-cols .col-md-4:not(:last-child) {
        border-right: 0;
    }

    .method-item {
        gap: 24px;
        padding: 32px 0;
    }

    .partners {
        margin-top: 48px;
    }

    .partners h2 {
        margin-bottom: 32px;
    }

    .partners-track {
        gap: 40px;
    }

    .result-quote {
        opacity: 1;
    }

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

    .hero-contact {
        padding: 32px 0 40px;
    }

    .contact-direct {
        margin-top: 32px;
    }

    .contact-direct-label {
        margin-bottom: 20px;
        font-size: 16px;
        line-height: 24px;
    }

    .contact-card {
        padding: 24px 20px;
        gap: 20px;
    }

    .contact-card-copy h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .contact-support-form-card {
        padding: 24px 20px;
    }

    .contact-field-row {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .contact-faq .contact-section-title {
        font-size: 32px;
        line-height: 40px;
    }

    .catalog-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .catalog-toolbar-actions {
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 12px 16px;
    }

    .catalog-sort {
        margin-left: auto;
    }

    .guide-section {
        padding: 88px 0 72px;
        background: linear-gradient(180deg, transparent 0, transparent 48px, #004a86 48px, #004a86 calc(100% - 160px), #041a34 100%);
    }

    .guide-shell {
        grid-template-columns: 1fr;
        padding: 28px 20px;
        gap: 20px;
        border-radius: 20px;
    }

    .guide-toc {
        position: static;
        width: 100%;
        order: -1;
        padding: 16px 18px;
    }

    .guide-toc.is-position-fixed {
        position: static !important;
    }

    .guide-toc-links {
        padding-top: 16px;
    }

    .guide-toc-links .toc-list {
        gap: 12px;
    }

    .guide-toc-links .toc-link {
        font-size: 14px;
        line-height: 22px;
    }

    .pdp-page .container-home {
        width: calc(100% - 40px);
        max-width: none;
    }

    .pdp-buy {
        padding: 20px 0;
    }

    .pdp-buy-grid {
        grid-template-columns: 1fr;
        gap: 28px;
        display: block !important;
    }
    .team-process-card-copy{
        max-height: unset;
    }

    .pdp-gallery {
        position: static;
    }

    .pdp-thumbs {
        width: 64px;
    }

    .pdp-thumb {
        width: 64px;
        height: 64px;
    }

    .pdp-title {
        font-size: 25px;
        line-height: 36px;
    }

    .pdp-meta,
    .pdp-sizes {
        flex-wrap: wrap;
    }

    .cam-nang-badge {
        height: 30px;
        font-size: 12px;
    }

    .pdp-desc {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .pdp-desc-copy,
    .pdp-desc--howto .pdp-desc-copy {
        padding: 40px 28px;
        overflow: visible;
    }

    .pdp-desc-media {
        min-height: 360px;
    }

    .pdp-ingredients-grid {
        grid-template-columns: 1fr 1fr;
        gap: 28px 20px;
    }

    .pdp-ing-center {
        grid-column: 1 / -1;
        width: min(280px, 50%);
        order: -1;
    }

    .pdp-ing-col {
        width: 100%;
        max-width: none;
    }

    .pdp-ing-col h2 {
        font-size: 28px;
        line-height: 36px;
    }

    .pdp-reviews,
    .pdp-related {
        padding-left: 20px;
        padding-right: 20px;
    }

    .pdp-reviews-title,
    .pdp-related>h2 {
        font-size: 32px;
        line-height: 40px;
    }

    .pdp-sticky {
        z-index: 90;
        padding-left: 20px;
        padding-right: 20px;
    }

    .terms-header .header-nav {
        gap: 14px;
        flex-wrap: wrap;
    }

    .terms-header .btn-component-white {
        padding: 8px 14px;
    }

    .terms-hero {
        padding-top: 40px;
    }

    .terms-hero-copy h1 {
        font-size: 40px;
        line-height: 48px;
    }

    .terms-table {
        min-width: 760px;
    }

    .treatment-process .treatment-process-grid,
    .treatment-process .treatment-process-slider {
        padding: 32px 0;
    }

    .treatment-process .treatment-step-card {
        padding: 0 20px;
    }

    .treatment-process .owl-nav {
        display: none;
    }

    .treatment-consult .treatment-consult-card {
        padding: 40px 24px;
    }

    .treatment-consult .consult-info {
        padding-right: 0;
        margin-bottom: 32px;
    }

    .blog-toc {
        position: static;
        margin-bottom: 24px;
    }

    .blog-page .container-home,
    body:has(.blog-page) .page-crumb .container-home {
        width: 100%;
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }

    .blog-page .row {
        margin-left: 0;
        margin-right: 0;
    }

    .blog-page [class*=col-] {
        padding-left: 0;
        padding-right: 0;
    }

    .blog-toc.is-position-fixed {
        position: static !important;
        width: 100% !important;
        left: auto !important;
        top: auto !important;
    }

    .hybrid-detail-hero {
        min-height: 420px;
    }

    .hybrid-detail-copy h2 {
        font-size: 22px;
        line-height: 26px;
    }

    .hybrid-detail-copy h3 {
        font-size: 16px;
        line-height: 26px;
    }

    .hybrid-detail-copy {
        gap: 0;
    }


    .hybrid-detail-copy p {
        font-size: 14px;
        margin-top: 10px;
    }

    .hybrid-detail-media {
        min-height: auto;
    }

    .treatment-benefits {
        padding: 30px 0;
    }

    .hybrid-detail-pillars h2 {
        text-align: left;
    }

    .treatment-benefits .treatment-benefit-card h3 {
        font-size: 16px;
        font-weight: 600;
        color: #fff;
        margin-bottom: 12px;
    }

    .hybrid-detail-pillars-grid {
        max-width: none;
        margin-left: 0;
    }

    .team-hero {
        padding-top: 200px;
        padding-bottom: 48px;
    }

    .team-hero-title {
        top: 100px;
        font-size: clamp(48px, 10vw, 72px);
        width: 94%;
    }

    .team-hero-intro {
        grid-template-columns: 1fr;
        gap: 32px;
        padding-top: 32px;
    }

    .team-intro-title {
        font-size: 32px;
        line-height: 40px;
    }

    .team-intro-desc {
        font-size: 16px;
        line-height: 24px;
    }

    .team-section-title {
        font-size: 36px;
        line-height: 44px;
    }

    .team-process {
        padding: 56px 0;
    }

    .team-process-tabs {
        margin: 28px 0;
        gap: 12px;
    }

    .team-process-tab {
        padding: 10px 20px;
        font-size: 15px;
    }

    .team-roster {
        padding: 48px 0;
    }

    .team-roster .team-section-title {
        margin-bottom: 32px;
    }

    .team-member {
        padding: 32px 0;
        gap: 24px;
    }

    .team-member-photo {
        width: 100%;
        max-width: none;
        height: min(68vw, 440px);
    }

    .team-member-quote p {
        font-size: 20px;
        line-height: 28px;
    }

    .team-consult {
        padding: 48px 0 64px;
    }

    .ep-hero {
        padding: 100px 0 40px;
        min-height: auto;
    }

    .ep-hero-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    /*.ep-page[data-layout="clinician"] .ep-hero-content {*/
    /*    order: 2;*/
    /*    gap: 28px;*/
    /*    padding-bottom: 24px;*/
    /*}*/

    /*.ep-page[data-layout="clinician"] .ep-hero-visual {*/
    /*    order: 1;*/
    /*    justify-content: center;*/
    /*}*/

    .ep-hero-content {
        gap: 32px;
        width: 100%;
        padding-bottom: 0;
    }

    .ep-hero-visual {
        justify-content: center;
    }

    .ep-hero-title {
        font-size: 36px;
        line-height: 44px;
    }

    .ep-hero-stats-grid {
        max-width: none;
        gap: 20px;
    }

    .ep-hero-stats-row {
        flex-direction: column;
        gap: 16px;
    }

    .ep-hero-stat-divider {
        width: 100%;
        height: 1px;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.25) 50%, rgba(255, 255, 255, 0) 100%);
    }

    .ep-hero-badge {
        position: static;
        margin-top: 12px;
        align-items: center;
        text-align: center;
    }

    .ep-hero-badge-prefix {
        font-size: 20px;
        line-height: 28px;
        letter-spacing: 0.04em;
    }

    .ep-hero-badge-name {
        font-size: 24px;
        line-height: 32px;
        text-align: center;
    }

    .ep-hero-photo,
    .ep-hero-photo--beth {
        max-width: min(100%, 400px);
        margin: 0 auto;
    }

    .ep-breadcrumb .container {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        row-gap: 4px;
    }

    .ep-philosophy {
        padding: 48px 0;
    }

    .ep-philosophy-card {
        border-radius: 32px;
        padding: 36px 24px;
        border-width: 4px;
        margin-top: 28px;
    }

    .ep-philosophy-text {
        font-size: 18px;
        line-height: 28px;
    }

    .ep-philosophy-author .name {
        white-space: normal;
    }

    .ep-fields .ep-title,
    .ep-achieve-section .ep-title {
        font-size: 32px;
        line-height: 40px;
    }

    .ep-field-card {
        height: 240px;
    }

    .ep-achieve-section {
        padding: 56px 0;
    }

    .ep-achieve-row {
        margin-top: 32px;
        margin-bottom: 40px;
    }

    .ep-achieve-col-wrap {
        margin-bottom: 32px;
    }

    .ep-achieve-col {
        padding: 16px 0;
    }

    .ep-consult-card {
        grid-template-columns: 1fr;
        padding: 36px 24px;
        gap: 36px;
    }
}

@media (max-width: 900px) {
    .checkout-pay-detail {
        flex-direction: column;
        align-items: center;
        padding: 24px 16px;
        gap: 24px;
    }

    .ep-fields-grid {
        grid-template-columns: 1fr;
    }

    .ep-achieve-grid {
        grid-template-columns: 1fr;
    }

    .ep-press-body {
        padding: 32px 24px;
    }

    .ep-test-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .cta-fixed {
        right: 16px;
        bottom: 135px;
        gap: 10px;
    }

    /* B2B Admin Filter Bar */
    .b2b-admin-filter-bar {
        padding: 12px 14px;
        gap: 8px;
        border-radius: 12px;
        align-items: stretch;
    }

    .b2b-admin-filter-bar .filter-input-icon-wrap {
        width: 100%;
        flex: 1 1 100%;
        min-width: 100%;
    }

    .b2b-admin-filter-bar .filter-input-icon-wrap .filter-input-with-icon {
        width: 100%;
        height: 40px;
    }

    .b2b-admin-filter-bar .filter-select-item {
        flex: 1 1 calc(50% - 4px);
        width: calc(50% - 4px);
        min-width: 0;
    }

    .b2b-admin-filter-bar .filter-select-item .custom-select-control {
        width: 100%;
        height: 40px;
        font-size: 13.5px;
        padding-right: 28px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .b2b-admin-filter-bar .filter-date-item {
        flex: 1 1 calc(50% - 4px);
        width: calc(50% - 4px);
        min-width: 0;
    }

    .b2b-admin-filter-bar .filter-date-item .filter-date-input {
        width: 100%;
        height: 40px;
        font-size: 13.5px;
    }

    .b2b-admin-filter-bar .filter-date-range-combined {
        width: 100%;
        flex: 1 1 100%;
    }

    .b2b-admin-filter-bar .filter-date-range-combined .filter-date-item {
        flex: 1;
        width: auto;
        min-width: 0;
    }

    .b2b-admin-filter-bar .btn-b2b-primary,
    .b2b-admin-filter-bar .btn-admin-filter-submit {
        flex: 1 1 0;
        height: 40px;
        padding: 0 16px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 600;
        white-space: nowrap;
    }

    .b2b-admin-filter-bar .btn-filter-reset {
        flex: 1 1 0;
        height: 40px;
        padding: 0 14px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: #F2F4F7;
        color: #475467;
        border: 1px solid #D0D5DD;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 500;
        text-decoration: none;
        transition: all 0.2s ease;
        white-space: nowrap;
    }

    .b2b-admin-filter-bar .btn-filter-reset:hover {
        background: #EAECF0;
        color: #1D2939;
        text-decoration: none;
    }

    /* B2B Filter Toolbar */
    .b2b-filter-toolbar .filter-date-wrap,
    .b2b-filter-toolbar .filter-select,
    .b2b-filter-toolbar select.filter-select,.b2b-filter-toolbar .filter-input-search {
        min-width: 100%;
        flex: unset;
        width: 100%;
    }
    .b2b-profile-user-card .user-card-info .user-stats-row .stat-col .stat-num{
        font-size:14px;
    }
    .b2b-page-header .b2b-page-title{
        font-size: 18px;
    }
    .form-card-subtitle{
        font-size: 14px;
    }

    .b2b-profile-user-card .user-card-info .user-stats-row .stat-col:nth-child(2){
        padding:0 10px
    }

    .btn-pill.btn-pill--primary span ,.b2b-topbar .topbar-account-arrow ,.b2b-topbar__left .topbar-welcome {
        display: none;
    }

    .cta-fixed li a {
        width: 42px;
        height: 42px;
    }

    .cta-fixed .cta-phone img,
    .cta-fixed a[href^="tel:"] img {
        width: 20px;
        height: 20px;
    }

    .cta-fixed .cta-zalo img,
    .cta-fixed a[href*="zalo.me"] img {
        width: 25px;
        height: 25px;
    }

    .cta-fixed .cta-messenger img,
    .cta-fixed a[href*="m.me"] img,
    .cta-fixed a[href*="facebook.com"] img {
        width: 23px;
        height: 23px;
    }
}

@media (max-width: 767.98px) {
    .container {
        max-width: 764px;
    }

    .ep-consult-photo {
        display: none;
    }

    .ep-process-step h3 {
        font-size: 18px !important;
    }

    .ep-process-grid {
        gap: 0 !important;
    }

    .ep-process-icon {
        width: 40px !important;
        height: 40px !important;
    }

    .ep-results,
    .ep-fields {
        padding: 30px 0 !important;
    }

    .pdp-gallery {
        flex-direction: column-reverse;
        gap: 10px;
    }

    /*.header-auth {*/
    /*    display: flex;*/
    /*}*/

    .pdp-thumbs {
        display: flex;
        flex-direction: row;
        width: 100%;
        gap: 8px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .pdp-thumbs::-webkit-scrollbar {
        display: none;
    }

    .pdp-thumb {
        flex-shrink: 0;
        width: 56px;
        height: 56px;
        border-radius: 8px;
    }

    .pdp-tag {
        font-size: 13px;
        line-height: 20px;
    }

    .pdp-title {
        font-size: 26px;
        line-height: 34px;
    }

    .pdp-meta,
    .pdp-sold,
    .pdp-benefits,
    .pdp-benefits li {
        font-size: 15px;
        line-height: 22px;
        padding: 0;
    }

    .pdp-info {
        gap: 10px;
    }

    .pdp-pay {
        margin: 20px 0;
    }

    .pdp-price {
        font-size: 22px;
        line-height: 30px;
    }

    .pdp-sizes .btn-chip {
        min-height: 44px;
        padding: 10px 16px;
        font-size: 15px;
        line-height: 22px;
    }

    .pdp-actions {
        align-items: stretch;
        gap: 10px;
    }

    .pdp-qty {
        width: 148px;
        height: 52px;
    }

    .pdp-qty-value {
        font-size: 16px;
    }

    .pdp-actions .js-pdp-add-to-cart {
        width: 100%;
        min-height: 52px;
        padding: 12px 20px;
        font-size: 16px;
        line-height: 24px;
    }

    .pdp-actions .js-pdp-add-to-cart img {
        width: 20px !important;
        height: 20px;
    }

    .pdp-trust-card {
        padding: 14px 10px;
    }

    .pdp-trust-card strong,
    .pdp-trust-card p {
        font-size: 13px;
        line-height: 20px;
    }

    .pdp-fbt-foot {
        flex-direction: column;
        align-items: stretch;
    }

    .pdp-fbt-foot .btn-pill {
        width: 100%;
        min-height: 52px;
        font-size: 16px;
    }

    .pdp-desc-copy,
    .pdp-desc--howto .pdp-desc-copy {
        padding: 28px 20px;
        gap: 20px;
    }

    .pdp-reviews-title {
        font-size: 25px !important;
    }

    .pdp-reviews {
        padding: 20px;
    }

    .pdp-desc-copy h2,
    .pdp-ing-col h2,
    .pdp-reviews-title,
    .pdp-related>h2,
    .pdp-science h2 {
        font-size: 26px;
        line-height: 34px;
    }

    .pdp-desc-block p,
    .pdp-desc-block ul,
    .pdp-ing-item p {
        font-size: 15px;
        line-height: 22px;
    }

    .pdp-desc-media {
        min-height: 280px;
    }

    .pdp-ingredients-grid {
        grid-template-columns: 1fr;
    }

    .pdp-ingredients--has-mobile .pdp-ingredients-banner {
        display: none;
    }

    .pdp-ingredients-mobile {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .pdp-ing-center {
        width: min(240px, 64vw);
    }

    .pdp-reviews-write {
        min-height: 48px;
        padding: 10px 18px;
        font-size: 15px;
        line-height: 22px;
    }

    .pdp-reviews-summary {
        flex-direction: column;
        align-items: stretch;
    }

    .pdp-reviews-score {
        min-width: 0;
    }

    .pdp-reviews-sep {
        width: 100%;
        height: 1px;
    }

    .pdp-reviews-more .btn-pill {
        min-height: 48px;
        font-size: 15px;
    }

    .pdp-science {
        height: auto;
        min-height: 320px;
        padding-bottom: 40px;
    }

    .pdp-related {
        padding-top: 48px;
        padding-bottom: 64px;
        gap: 24px;
    }

    .pdp-sticky {
        padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
    }

    .pdp-sticky-copy strong {
        font-size: 15px;
        line-height: 22px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .pdp-sticky-copy p {
        font-size: 14px;
        line-height: 20px;
    }

    .pdp-sticky .btn-pill {
        flex: 0 0 auto;
        min-width: 0;
        min-height: 52px;
        padding: 12px 18px;
        font-size: 16px;
        line-height: 24px;
    }

    .checkout-body {
        padding: 24px 0 40px;
    }

    .checkout-page .page-crumb .container-home,
    .checkout-body .container-home {
        width: 100%;
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    .checkout-layout {
        gap: 16px;
    }

    .checkout-section-title {
        font-size: 18px;
        line-height: 26px;
    }

    .checkout-card {
        padding: 12px;
        gap: 12px;
        border-radius: 12px;
    }

    .checkout-card .checkout-info-grid {
        flex-direction: column;
        gap: 12px;
        margin-bottom: 12px;
    }

    .checkout-pay-row {
        padding: 12px;
        font-size: 15px;
        line-height: 22px;
    }

    .checkout-pay-detail {
        padding: 16px;
        gap: 16px;
    }

    .checkout-sum,
    .checkout-trust {
        padding: 16px;
    }

    .checkout-sum {
        gap: 16px;
    }

    .checkout-submit {
        min-height: 52px;
        font-size: 16px;
        line-height: 24px;
    }

    .checkout-terms {
        font-size: 14px;
        line-height: 22px;
    }

    .checkout-line-name {
        font-size: 14px;
        line-height: 20px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .checkout-line-thumb {
        width: 56px;
        height: 56px;
    }

    .checkout-total strong {
        font-size: 20px;
        line-height: 26px;
    }

    .checkout-nearby-store {
        padding: 12px;
    }

    .checkout-ship-grid {
        grid-template-columns: 1fr;
    }

    .checkout-bank-row {
        flex-direction: column;
        gap: 4px;
    }

    .checkout-bank-row>span {
        width: auto;
    }

    .checkout-bank-row>strong,
    .checkout-bank-row .checkout-bank-copy {
        justify-content: flex-start;
        text-align: left;
    }

    .checkout-success {
        padding: 16px 20px 24px;
    }

    .checkout-success-illust {
        width: 160px;
        height: 160px;
    }

    .checkout-success-row {
        flex-direction: column;
        gap: 4px;
    }

    .checkout-success-row p {
        text-align: left;
    }

    .checkout-success-actions {
        flex-direction: column;
    }

    .address-modal .modal-dialog {
        margin: 1rem;
        max-width: none;
    }

    .address-modal-head h2 {
        font-size: 20px;
        line-height: 28px;
    }

    .cart-body {
        padding: 24px 0 40px;
    }

    .cart-page .page-crumb .container-home,
    .cart-body .container {
        width: 100%;
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    .cart-layout {
        gap: 16px;
    }

    .cart-panel-body {
        padding: 16px;
        gap: 16px;
    }

    .cart-layout:not(.is-empty) .js-cart-items {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .cart-layout:not(.is-empty) .cart-item {
        grid-template-columns: 18px 64px minmax(0, 1fr);
        grid-template-areas:
            "check thumb copy"
            "check thumb side";
        column-gap: 10px;
        row-gap: 8px;
        align-items: start;
        padding: 12px;
        border: 1px solid #dce5ee;
        border-radius: 12px;
        background: #fff;
    }

    .cart-layout:not(.is-empty) .cart-item:last-child {
        padding-bottom: 12px;
        border-bottom: 1px solid #dce5ee;
    }

    .cart-layout:not(.is-empty) .cart-item>.cart-check {
        grid-area: check;
        align-self: start;
        margin-top: 2px;
    }

    .cart-layout:not(.is-empty) .cart-item-thumb {
        grid-area: thumb;
        width: 64px;
        height: 64px;
    }

    .cart-layout:not(.is-empty) .cart-item-copy {
        grid-area: copy;
        padding-left: 0;
        gap: 4px;
    }

    .cart-layout:not(.is-empty) .cart-item-name {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: 14px;
        line-height: 20px;
    }

    .cart-layout:not(.is-empty) .cart-item-variant {
        max-width: 100%;
        flex-wrap: wrap;
    }

    .cart-layout:not(.is-empty) .cart-item-variant-label,
    .cart-layout:not(.is-empty) .cart-item-variant select,
    .cart-layout:not(.is-empty) .cart-item-variant .js-cart-variant,
    .cart-layout:not(.is-empty) .cart-item-variant-btn {
        font-size: 13px;
        line-height: 20px;
    }

    .cart-layout:not(.is-empty) .cart-item-variant select,
    .cart-layout:not(.is-empty) .cart-item-variant .js-cart-variant {
        max-width: 120px;
    }

    .cart-layout:not(.is-empty) .cart-item-side {
        grid-area: side;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 8px;
    }

    .cart-layout:not(.is-empty) .cart-item-price {
        font-size: 14px;
        line-height: 20px;
    }

    .cart-layout:not(.is-empty) .cart-item-controls {
        flex-shrink: 0;
        gap: 8px;
        margin-left: 0;
    }

    .treatment-process-progress {
        display: none;
    }

    .cart-layout:not(.is-empty) .cart-qty {
        height: 28px;
        padding: 0 6px;
    }

    .cart-layout:not(.is-empty) .cart-qty-value {
        width: 28px;
        font-size: 14px;
        line-height: 20px;
    }

    .cart-sum,
    .cart-trust {
        padding: 16px;
    }

    .cart-submit {
        min-height: 52px;
        width: 100%;
        font-size: 16px;
        line-height: 24px;
    }

    .cart-total strong {
        font-size: 20px;
        line-height: 26px;
    }

    .cam-nang-hero {
        min-height: 0;
    }

    .cam-nang-hero .container-home {
        width: 100%;
        padding: 88px 20px 32px;
    }

    .cam-nang-hero-title {
        font-size: 18px;
        line-height: 22px;
    }

    .cam-nang-section-title {
        font-size: 28px;
        line-height: 36px;
    }

    .cam-nang-hero-inner {
        gap: 20px;
    }

    .cam-nang-hero-sub {
        font-size: 13px;
        line-height: 22px;
    }

    .cam-nang-search {
        max-width: 100%;
        padding: 6px 6px 6px 14px;
    }

    .cam-nang-search button {
        height: 40px;
        padding: 0 16px;
        font-size: 15px;
        line-height: 22px;
    }

    .cam-nang-chips {
        padding: 12px 0;
    }

    .cam-nang-chip {
        height: 36px;
        padding: 8px 14px;
    }

    .cam-nang-featured,
    .news-featured {
        display: none;
    }

    .cam-nang-posts {
        display: grid;
        /*grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);*/
        gap: 12px;
    }

    .cam-nang-posts>.cam-nang-promo {
        grid-column: 1 / -1;
    }

    .cam-nang-posts>.cam-nang-card {
        min-height: 0;
    }

    .cam-nang-posts>.cam-nang-card .cam-nang-card-media {
        height: 120px;
    }

    .cam-nang-posts>.cam-nang-card .cam-nang-card-excerpt,
    .cam-nang-posts>.cam-nang-card hr,
    .cam-nang-posts>.cam-nang-card .cam-nang-card-foot {
        display: none;
    }

    .cam-nang-posts>.cam-nang-card .cam-nang-card-body {
        padding: 10px;
        gap: 8px;
    }

    .cam-nang-posts>.cam-nang-card h3 {
        font-size: 14px;
        line-height: 20px;
    }

    .cam-nang-section-title {
        font-size: 24px;
        line-height: 34px;
        margin-bottom: 20px;
    }

    .cam-nang-card.is-feature {
        min-height: 320px;
        border-radius: 12px;
    }

    .cam-nang-card.is-feature h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .cam-nang-card:not(.is-feature) {
        flex-direction: column;
        min-height: 0;
        min-width: 0;
        max-width: 100%;
        width: 100%;
    }

    .cam-nang-card:not(.is-feature) .cam-nang-card-media {
        width: 100%;
        max-width: 100%;
        height: 180px;
    }

    .cam-nang-page>.container {
        width: 100%;
        max-width: 100%;
        overflow-x: clip;
    }

    .cam-nang-card.is-compact .cam-nang-card-media {
        height: 160px;
    }

    .cam-nang-card-body h3 {
        font-size: 16px;
        line-height: 24px;
    }

    .cam-nang-card-excerpt {
        font-size: 14px;
        line-height: 22px;
    }

    .cam-nang-read {
        font-size: 15px;
        line-height: 22px;
    }

    .cam-nang-meta span.dot {
        display: none;
    }

    .cam-nang-layout {
        padding: 32px 0 48px;
        gap: 32px;
    }

    .cam-nang-main-head {
        margin-bottom: 20px;
        align-items: flex-start;
        gap: 8px;
    }

    .cam-nang-meta span:first-child {
        font-size: 12px;
        line-height: 6px;
    }

    .cam-nang-meta span.time {
        font-size: 12px;
        line-height: 13px;
    }

    .news-topics {
        display: none;
    }

    .cam-nang-badge {
        height: 30px;
        font-size: 12px;
        display: none;
    }

    .cam-nang-sort>span,
    .cam-nang-sort button {
        font-size: 15px;
        line-height: 22px;
    }

    .cam-nang-promo {
        padding: 16px;
    }

    .cam-nang-promo-head h3 {
        font-size: 16px;
        line-height: 24px;
    }

    .blog-article h1 {
        font-size: 24px;
        line-height: 32px;
    }

    .blog-page {
        padding-bottom: 40px;
    }

    .blog-layout {
        padding-top: 16px;
    }

    .blog-header,
    .blog-article {
        gap: 16px;
    }

    .blog-article h1 {
        font-size: 24px;
        line-height: 34px;
    }

    .blog-deck {
        font-size: 15px;
        line-height: 22px;
        padding-left: 12px;
    }

    .blog-hero {
        border-radius: 12px;
    }

    .blog-toc {
        margin-bottom: 16px;
    }

    .blog-toc-links {
        padding-top: 12px;
    }

    .blog-toc-links .toc-list {
        gap: 10px;
    }

    .blog-byline-author .name,
    .blog-byline-meta {
        font-size: 14px;
        line-height: 22px;
    }

    .blog-share {
        flex-wrap: wrap;
        gap: 8px;
    }

    .blog-author-card {
        padding: 16px;
    }

    .blog-author-card-stats {
        gap: 8px;
    }

    .blog-author-card-stats .stat {
        font-size: 20px;
        line-height: 28px;
    }

    .blog-author-card-stats .label {
        font-size: 12px;
        line-height: 18px;
    }

    .blog-body h2 {
        font-size: 20px;
        line-height: 28px;
    }

    .blog-body p,
    .blog-body li {
        font-size: 15px;
        line-height: 24px;
    }

    .news-page .cam-nang-layout {
        padding-top: 48px;
    }

    .error-hero {
        min-height: 0;
    }

    .error-hero-bg {
        height: 760px;
    }

    .error-hero-inner h1,
    .error-solutions h2,
    .error-knowledge h2 {
        font-size: 20px;
        line-height: 34px;
    }

    .error-search {
        flex-wrap: wrap;
        height: auto;
        border-radius: 24px;
    }

    .error-search button {
        width: 100%;
        height: 44px;
    }

    .error-solutions-grid,
    .error-knowledge-grid,
    .error-connect-cards {
        grid-template-columns: 1fr;
    }

    .team-hero {
        padding-top: 140px;
        padding-bottom: 36px;
    }

    .team-hero-title {
        top: 72px;
        font-size: clamp(36px, 11vw, 52px);
    }

    .team-hero-intro {
        padding-top: 24px;
        gap: 24px;
    }

    .team-intro-title {
        font-size: 28px;
        line-height: 36px;
    }

    .team-intro-desc {
        font-size: 16px;
        line-height: 24px;
    }

    .team-intro-right {
        gap: 20px;
    }

    .team-section-title {
        font-size: 28px;
        line-height: 36px;
    }

    .team-process {
        padding: 48px 0;
    }

    .team-process-tabs {
        flex-wrap: nowrap;
        margin: 24px 0;
        overflow-x: scroll;
        overflow-y: hidden;
        justify-content: space-around;
    }

    .team-process-tab {
        white-space: nowrap !important;
    }

    .team-process-grid {
        grid-template-columns: 1fr;
        max-width: 480px;
        margin: 0 auto;
        gap: 20px;
    }

    .team-process-card {
        min-height: 0;
    }

    .team-process-card-media {
        height: 168px;
    }

    .team-process-card-body {
        padding: 20px 16px 16px;
    }

    .team-process-card-body h3 {
        font-size: 18px;
        line-height: 26px;
    }

    .team-process-card-copy p {
        font-size: 15px;
        line-height: 22px;
    }

    .team-process-card-badge {
        right: 16px;
        width: 48px;
        height: 55px;
        top: -28px;
    }

    .team-roster {
        padding: 40px 0;
    }

    .team-roster .team-section-title {
        margin-bottom: 24px;
    }

    .team-member {
        padding: 28px 0;
        gap: 20px;
    }

    .team-member-photo {
        height: auto;
        max-width: none;
    }

    .team-member-body {
        gap: 16px;
        padding: 0;
    }

    .team-member-quote p {
        font-size: 18px;
        line-height: 26px;
    }

    .team-member-foot {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .team-member-body .btn-pill {
        width: 100%;
        justify-content: center;
    }

    .team-consult {
        padding: 40px 0 56px;
    }

    .team-consult-card {
        padding: 28px 20px;
        border-radius: 24px;
        gap: 24px;
    }

    .team-consult-copy h2 {
        font-size: 26px;
        line-height: 34px;
    }

    .team-consult-input {
        height: 48px;
        padding: 10px 18px;
    }

    .team-consult-textarea {
        padding: 14px 18px;
    }

    .ep-title {
        font-size: 24px;
        line-height: 32px;
    }

    .ep-hero {
        padding: 88px 0 32px;
    }

    .ep-hero-title {
        font-size: 28px;
        line-height: 36px;
    }

    .ep-hero-subtitle {
        font-size: 18px;
        line-height: 26px;
    }

    .ep-hero-stats {
        flex-direction: column;
        gap: 16px;
    }

    .ep-hero-divider {
        width: 100%;
        height: 1px;
    }

    .ep-hero-stat-col .ep-hero-stat-num {
        font-size: 15px;
        line-height: 22px;
        white-space: normal;
    }

    .ep-hero-stat-col .ep-hero-stat-label {
        font-size: 14px;
        line-height: 20px;
    }

    .ep-hero-badge {
        position: absolute;
        margin-top: 16px;
        align-items: center;
        text-align: center;
    }

    .ep-hero-badge-prefix {
        font-size: 16px;
        line-height: 24px;
    }

    .ep-hero-badge-name {
        font-size: 20px;
        line-height: 26px;
    }

    .ep-hero-badge-title {
        font-size: 13px;
        line-height: 20px;
        text-align: center;
        max-width: 100%;
    }

    .ep-breadcrumb {
        padding-top: 16px;
    }

    .ep-breadcrumb a,
    .ep-breadcrumb .active,
    .ep-breadcrumb .divider {
        font-size: 13px;
        line-height: 20px;
    }

    .ep-story-quote {
        position: relative;
        right: 0;
        bottom: auto;
        width: 100%;
        max-width: 100%;
        margin-top: -40px;
    }

    .ep-story-years-num {
        font-size: 96px;
        line-height: 88px;
    }

    .ep-story {
        padding: 40px 0 48px;
    }

    .ep-story .ep-title {
        margin-bottom: 24px;
    }

    .ep-story-visual {
        min-height: 0;
        padding-bottom: 0;
    }

    .ep-story-photo {
        height: auto;
        aspect-ratio: 700 / 432;
    }

    .ep-story-copy {
        gap: 20px;
    }

    .ep-story-copy .btn-pill {
        white-space: normal;
        max-width: 100%;
        text-align: center;
    }

    .ep-story-years-num {
        font-size: 72px;
        line-height: 68px;
    }

    .ep-fields {
        padding: 40px 0;
    }

    .ep-fields .ep-title {
        margin-bottom: 24px;
        font-size: 24px;
        line-height: 32px;
    }

    .ep-field-card {
        height: 200px;
    }

    .ep-field-card-body {
        padding: 20px 16px;
        gap: 8px;
    }

    .ep-field-num {
        font-size: 32px;
        line-height: 36px;
    }

    .ep-field-card-body h3 {
        font-size: 16px;
        line-height: 24px;
    }

    .ep-award {
        min-height: 280px;
    }

    .ep-press-body {
        min-height: 0;
        padding: 24px 16px;
    }

    .ep-consult {
        padding: 40px 0;
    }

    .ep-consult-copy h2 {
        font-size: 24px;
        line-height: 32px;
    }

    .ep-consult-label strong {
        white-space: normal;
    }

    .ep-achieve-head {
        flex-direction: column;
    }

    .ep-press-media {
        height: 220px;
    }

    .ep-philosophy {
        padding: 36px 0;
    }

    .ep-philosophy-card {
        border-radius: 24px;
        padding: 28px 18px;
        border-width: 3px;
        gap: 16px;
        margin-top: 20px;
    }

    .ep-philosophy-quote-icon {
        width: 40px;
        height: 32px;
    }

    .ep-philosophy-text {
        font-size: 14px;
        line-height: 24px;
    }

    .ep-consult-card-headings .ep-consult-card-title {
        font-size: 20px;
        line-height: 20px;
    }


    .ep-consult-card-headings .ep-consult-card-quote {
        font-size: 14px;
    }

    .ep-hero-grid {
        display: flex;
        flex-direction: column-reverse;
    }

    .ep-achieve-section {
        padding: 40px 0 48px;
    }

    .ep-achieve-section .ep-title {
        font-size: 24px;
        line-height: 32px;
    }

    .ep-achieve-row {
        margin-top: 24px;
        margin-bottom: 28px;
    }

    .ep-achieve-col-wrap {
        margin-bottom: 20px;
    }

    .ep-achieve-col {
        padding: 12px 0;
        gap: 14px;
    }

    .ep-achieve-col img {
        width: 56px;
        height: 56px;
    }

    .ep-achieve-col p {
        font-size: 16px;
        line-height: 24px;
    }

    .ep-consult-card {
        padding: 28px 18px;
        border-radius: 24px;
        gap: 28px;
    }

    .b2b-hero__title {
        font-size: 32px;
        letter-spacing: -0.5px;
    }

    .b2b-hero__subtitle {
        font-size: 15px;
        line-height: 22px;
    }

    .b2b-topbar {
        padding: 0 16px;
    }

    .b2b-topbar__right {
        gap: 10px;
    }

    .b2b-topbar .btn-b2b-outline {
        display: none;
    }

    .b2b-topbar .topbar-user .user-info {
        display: none;
    }

    .header-search {
        display: none;
    }

    .b2b-content,
    .b2b-history-page,
    .b2b-history-main,
    .b2b-dashboard-content {
        padding: 16px;
    }

    .b2b-topbar .topbar-user {
        gap: 0;
    }

    .ep-achieve {
        gap: 30px;
        margin: 0;
    }

    body:has(.hero) {
        overflow-x: hidden;
    }

    .container-home {
        width: calc(100% - 40px);
    }

    body:has(.hero) header.absolute {
        padding: 3.2vw 0;
    }



    .hero {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        height: auto;
        min-height: 900px;
        max-height: none;
        padding: 88px 20px 36px;
        overflow: hidden;
        gap: 0;
        background: #000e1c;
        box-sizing: border-box;
    }

    /* Mobile / Zalo: ảnh fallback, không dùng video */
    .bg-video {
        display: none !important;
    }

    .no-home {
        display: block !important;
    }

    .bg-video-fallback {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center;
        z-index: 1;
    }

    /* Mobile: chữ trên → chai → chữ dưới (không absolute / không đè nhau) */
    .text-hero,
    .text-hero.text-hero-left,
    .text-hero.text-hero-right {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        width: 100% !important;
        max-width: 320px;
        margin: 0 auto;
        padding: 0 8px;
        text-align: center !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        z-index: 9;
    }

    .text-hero.text-hero-left {
        order: 1;
        flex: 0 0 auto;
        padding-top: 0;
    }

    .text-hero.text-hero-left p {
        font-size: 16px;
        line-height: 22px;
        letter-spacing: 0;
        margin: 0 0 6px;
        font-style: italic;
    }

    .text-hero.text-hero-left span {
        display: block;
        font-size: 22px;
        line-height: 1.25;
        letter-spacing: 0.02em;
        width: auto !important;
        max-width: 100%;
        text-transform: uppercase;
    }

    .hero-pin {
        order: 2;
        position: relative !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 260px;
        margin: 12px 0;
        z-index: 8;
        pointer-events: none;
    }

    .text-hero.text-hero-right {
        order: 3;
        flex: 0 0 auto;
        margin-top: -16px;
        transform: translateY(-190px) !important;
    }

    .text-hero.text-hero-right span,
    .text-hero.text-hero-right span p {
        display: block;
        font-size: 15px;
        line-height: 22px;
        width: auto !important;
        max-width: 280px;
        margin: 0 auto;
        text-transform: none !important;
        letter-spacing: 0;
        font-style: normal;
    }

    /* Canvas full màn — chai vẽ giữa; text đã tách trên/dưới nên không đè */
    #product {
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        transform: none !important;
        translate: none !important;
        z-index: 7 !important;
    }

    .decor-1 {
        left: -9%;
    }

    .decor-2 {
        right: 0;
    }

    .product-fallback,
    .product-fallback.is-ready {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
        width: 140px !important;
        height: auto !important;
        max-height: none !important;
        aspect-ratio: 136.432 / 435;
        z-index: 8;
        margin: 0 auto;
    }

    .product-fallback.is-ready {
        opacity: 0 !important;
        visibility: hidden !important;
    }

    .about-center {
        display: none !important;
    }

    .about {
        background: #004b88;
        margin-top: 0;
        overflow: visible;
        padding-top: 0;
    }

    /* .about::before,
  .essence__shade {
    background: linear-gradient(180deg, rgba(4, 26, 52, 0.35) 0%, #004b88 38%, #004b88 100%);
  } */
    .about-video {
        height: 100svh;
        min-height: 100svh;
        max-height: none;
        position: sticky;
        top: 0;
    }

    .about-content {
        width: calc(100% - 40px);
        margin: -100svh auto 0;
        padding: 64px 0;
        gap: 0;
        overflow: hidden;
    }

    .about-content .title,
    .about .title {
        font-size: 28px;
        line-height: 1.15;
        text-align: left;
        margin: 0 0 16px;
    }

    .about-content-item {
        width: 100%;
        max-width: none;
        gap: 12px;
    }

    .about-content-item-flex {
        justify-content: flex-start;
    }

    .about-content-item-flex:nth-of-type(even) {
        justify-content: flex-start;
    }

    .about-content-item h3 {
        font-size: 19px;
        line-height: 1.2;
    }

    .about-content-item div {
        font-size: 16px;
        line-height: 24px;
    }

    .products {
        padding: 32px 0 56px;
        background: #004b88;
        overflow: hidden;
    }

    .products,
    .products-stage {
        min-height: 0;
    }

    .products-stage .owl-stage-outer {
        overflow: hidden;
    }

    .products-stage .owl-item .product-card,
    .product-card {
        width: min(86vw, 340px);
        min-width: 0;
        max-width: 340px;
        gap: 16px;
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        opacity: 1;
    }

    .product-card-visual {
        width: 100%;
        height: auto;
        aspect-ratio: 1;
        margin: 0 auto;
        overflow: visible;
    }

    .product-card-circle {
        inset: auto;
        top: 50%;
        left: 50%;
        width: 78%;
        height: 78%;
        transform: translate(-50%, -50%);
    }

    .product-card-circle img {
        -webkit-mask-image: none;
        mask-image: none;
        border-radius: 50%;
        object-fit: cover;
    }

    .product-card-ring {
        inset: auto;
        top: 50%;
        left: 50%;
        width: 100%;
        height: 100%;
        transform: translate(-50%, -50%);
        opacity: 1;
    }

    .product-card-ring img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .product-card-image,
    .product-card-image-fit,
    .product-card-image-wide {
        position: absolute;
        overflow: visible;
        inset: auto;
        top: 50%;
        left: 50%;
        width: 34%;
        height: 90%;
        transform: translate(-50%, -50%);
        z-index: 2;
        opacity: 1;
        visibility: visible;
    }

    .product-card-info {
        gap: 4px;
        padding: 0;
        text-align: center;
    }

    .product-card-info h3 {
        font-size: 22px;
        line-height: 1.2;
    }

    .product-card-meta {
        font-size: 16px;
        line-height: 24px;
    }

    .product-card .btn-pill {
        display: inline-flex;
        width: fit-content;
        margin: 0 auto;
        font-size: 16px;
        line-height: 24px;
        padding: 10px 24px;
        min-height: 44px;
        border-width: 1px;
        border-radius: 52px;
    }

    .products-stage .owl-nav,
    .products-stage .owl-nav.is-show,
    .products-stage .owl-nav.is-visible {
        opacity: 1;
        visibility: visible;
    }

    .products-stage .owl-nav button {
        top: calc(min(86vw, 340px) / 2);
        width: 40px;
        height: 40px;
        background: #ffffff !important;
        border: 0;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
    }

    .products-stage .owl-nav button:hover,
    .products-stage .owl-nav button:focus,
    .products-stage .owl-nav button:active {
        background: #ffffff !important;
        transform: translateY(-50%);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
    }

    .products-stage .owl-nav button img {
        width: 22px;
        height: 22px;
        filter: none;
    }

    .products-stage .owl-nav button.owl-prev,
    .products-nav-prev {
        left: 8px;
    }

    .products-stage .owl-nav button.owl-next,
    .products-nav-next {
        right: 8px;
    }

    .products-nav {
        top: calc(min(86vw, 340px) / 2);
        width: 40px;
        height: 40px;
        background: #ffffff;
        border: 0;
    }

    .products-nav img {
        width: 22px;
        height: 22px;
        filter: none;
    }

    .combo-head {
        padding: 48px 20px 24px;
    }

    .combo-head .title {
        font-size: 28px;
        line-height: 1.15;
        max-width: none;
    }

    .sub-title {
        font-size: 14px;
        line-height: 20px;
        padding: 0;
    }

    .combo-slider .owl-carousel,
    .combo-slider .owl-stage-outer,
    .combo-slider .owl-stage,
    .combo-slider .owl-item,
    .combo-slider .combo-slide {
        height: 100vw;
        min-height: 200px;
        max-height: 200px;
    }

    .combo-slide-media {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .combo-slider .owl-nav button.owl-prev {
        left: 12px;
    }

    .combo-slider .owl-nav button.owl-next {
        right: 12px;
    }

    .combo-slider .owl-dots {
        display: none;
    }

    .combo-slide-copy {
        left: 20px;
        right: 20px;
        bottom: 8px;
        max-width: none;
        gap: 8px;
        text-align: center;
        align-items: center;
    }

    .combo-slide-copy h3 {
        font-size: 16px;
        line-height: 1.2;
    }

    .combo-slide-copy p,
    .combo-slide-copy div,
    .combo-slide-copy span {
        font-size: 12px;
        line-height: 24px;
    }

    .combo-slider .owl-nav {
        display: none;
    }

    .combo-slide-buy {
        left: 50%;
        right: auto;
        bottom: 24px;
        transform: translateX(-50%);
        padding: 10px 24px;
        min-height: 0;
        font-size: 16px;
        line-height: 24px;
        border-radius: 52px;
        border-width: 1px;
    }

    .bestsellers-inner {
        flex-direction: column;
        align-items: stretch;
        padding: 40px 20px 48px;
        gap: 16px;
        height: auto;
        min-height: 0;
    }

    .bestsellers-dna {
        display: none;
    }

    .bestsellers-count {
        order: 0;
    }

    .bestsellers-count-current {
        font-size: 32px;
        line-height: 1;
    }

    .bestsellers-media {
        width: 100%;
        height: auto;
        border-radius: 16px;
        flex-shrink: 0;
    }

    .bestsellers-panel {
        max-width: none;
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .bestsellers-list {
        overflow: visible;
    }

    .bestsellers-spacer {
        display: none;
    }

    .bestsellers-panel h2 {
        font-size: 22px;
        line-height: 1.25;
        padding-bottom: 12px;
    }

    .bestsellers-item {
        position: relative;
        top: auto;
        padding: 14px 0;
        gap: 12px;
        flex-wrap: nowrap;
        align-items: center;
    }

    .bestsellers-item p {
        font-size: 16px;
        line-height: 1.35;
        white-space: normal;
        flex: 1;
        min-width: 0;
    }

    .bestsellers-item .bestsellers-explore {
        font-size: 14px;
        line-height: 20px;
    }

    .bestsellers-item.is-passed {
        opacity: 1;
        pointer-events: auto;
    }

    .science {
        height: auto;
        min-height: 0;
    }

    .science-inner {
        width: calc(100% - 40px);
        padding: 56px 0;
        gap: 24px;
    }

    .science-copy h2 {
        font-size: 28px;
        line-height: 1.2;
    }

    .science-copy p {
        width: 100%;
        font-size: 14px;
        line-height: 24px;
    }

    .experts {
        padding: 40px 20px 56px;
    }

    .experts-shell {
        border-radius: 16px;
    }

    .experts-copy-inner {
        padding: 32px 20px 12px;
    }

    .experts-copy-inner h2 {
        font-size: 28px;
        line-height: 1.2;
        margin-bottom: 16px;
    }

    .experts-copy-inner h2 br {
        display: none;
    }

    .experts-copy-inner>p {
        font-size: 16px;
        line-height: 24px;
    }

    .experts-slider {
        padding: 8px 16px 24px;
    }

    .experts-track {
        height: auto;
    }

    .experts-track .owl-dots {
        display: none;
    }

    .experts-track .owl-stage-outer,
    .experts-track .owl-stage,
    .experts-track .owl-item,
    .expert {
        height: auto;
    }

    .expert {
        flex: none;
        width: 100%;
        aspect-ratio: 3/4;
    }

    .expert-info,
    .expert-extra {
        padding: 20px;
        left: 10px;
        right: 10px;
    }

    .expert-id {
        left: 20px;
        right: 20px;
        bottom: 20px;
    }

    .expert-id h3 {
        font-size: 20px;
        line-height: 1.25;
    }

    .footer {
        padding: 12.82051vw 7.05128vw 6.15385vw;
    }

    .footer-main {
        gap: 32px;
    }

    .footer-top,
    .footer-bottom {
        gap: 32px;
    }

    .catalog-card:hover .catalog-card-cta {
        font-size: 0;
    }

    .footer-label {
        font-size: 14px;
        line-height: 20px;
    }

    .footer-contact,
    .footer-form-wrap,
    .footer-brand,
    .footer-nav,
    .footer-policy {
        width: 100%;
        max-width: none;
    }

    .footer-contact-block>p,
    .footer-email,
    .footer-line,
    .footer-form-wrap>p,
    .footer-nav ul a,
    .footer-policy ul a {
        font-size: 14px;
        line-height: 20px;
    }

    .footer-form-row {
        flex-direction: column;
        gap: 12px;
    }

    .footer-field,
    .footer-select-btn {
        height: 48px;
        padding: 12px 18px;
    }

    .footer-form-wrap h2 {
        font-size: 7.69231vw;
        line-height: 1.15;
    }

    .footer-submit {
        width: 48px;
        height: 48px;
        align-self: flex-end;
    }

    .footer-bottom {
        padding-top: 32px;
    }

    .footer-logo {
        width: 220px;
        height: auto;
    }

    .footer-social {
        flex-wrap: wrap;
        gap: 12px;
    }

    .footer-nav-cols {
        flex-direction: column;
        gap: 6.15385vw;
    }

    .footer-nav ul,
    .footer-policy ul {
        gap: 8px;
    }

    .footer-copy {
        white-space: normal;
        letter-spacing: 0.5px;
        font-size: 12px;
        line-height: 18px;
    }

    .footer-marquee {
        margin: 8.20513vw -7.05128vw 0;
    }

    .footer-marquee-track span {
        font-size: 9.2vw;
        line-height: 1.15;
    }

    .footer-social a,
    .footer-social-circle,
    .footer-social a img {
        width: 11.28205vw;
        height: 11.28205vw;
    }

    .footer-zalo-word {
        width: 32px;
        height: 12px;
    }

    .footer {
        padding: 48px 14px 24px;
    }

    .footer-main {
        gap: 32px;
    }

    .footer-label,
    .footer-contact-block>p,
    .footer-email,
    .footer-line,
    .footer-form-wrap>p,
    .footer-nav ul a,
    .footer-policy ul a {
        font-size: 14px;
        line-height: 20px;
    }

    .footer-form-row {
        gap: 12px;
    }

    .footer-form {
        gap: 12px;
    }

    .footer-form-row {
        grid-template-columns: minmax(0, 1fr) 48px;
    }

    .footer-field,
    .footer-select-btn {
        height: 48px;
        padding: 12px 18px;
        font-size: 14px;
        line-height: 20px;
    }

    .footer-submit {
        width: 48px;
        height: 48px;
        align-self: flex-end;
    }

    .footer-form-wrap h2 {
        font-size: 30px;
        line-height: 36px;
    }

    .footer-form-wrap>p {
        margin-bottom: 16px;
    }

    .footer-select-list {
        max-height: 240px;
        overflow: auto;
    }

    .footer-bottom {
        padding-top: 32px;
    }

    .footer-logo {
        width: 220px;
        height: auto;
    }

    .footer-social {
        flex-wrap: wrap;
        gap: 12px;
    }

    .footer-social a,
    .footer-social-circle,
    .footer-social a img {
        width: 44px;
        height: 44px;
    }

    .footer-zalo-word {
        width: 32px;
        height: 12px;
    }

    .footer-nav-cols {
        flex-direction: column;
        gap: 24px;
    }

    .footer-nav ul,
    .footer-policy ul {
        gap: 8px;
    }

    .footer-copy {
        font-size: 12px;
        line-height: 18px;
        letter-spacing: 0.5px;
    }

    .footer-marquee {
        margin: 32px -24px 0;
    }

    .footer-marquee-track {
        gap: 24px;
    }

    .footer-marquee-track span {
        font-size: 36px;
        line-height: 1.15;
    }

    .footer-marquee-track img {
        width: 20px;
        height: 22px;
    }

    .about-title {
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 24px;
    }

    .about-intro .about-intro-title {
        font-size: 26px;
        line-height: 34px;
        margin-bottom: 20px;
    }

    .about-intro .about-intro-desc {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 24px;
    }

    .hero:has(+ .trusted) {
        display: block;
        height: 38svh;
        min-height: 200px;
        max-height: 320px;
        padding: 0;
    }

    header.header-white {
        position: sticky;
        z-index: 9;
        top: 0;
    }

    .about-intro {
        padding-bottom: 28px;
    }

    .about-intro .about-intro-title {
        font-size: 21px;
        line-height: 34px;
    }

    .about-intro .about-intro-desc {
        font-size: 15px;
        line-height: 22px;
    }

    .about-intro .about-intro-actions .btn-pill {
        width: 100%;
        min-height: 52px;
        font-size: 16px;
        line-height: 24px;
    }

    .trusted {
        padding-top: 32px;
    }

    .trusted h2,
    .about-title {
        font-size: 24px;
        line-height: 34px;
        padding: 0;
        margin-bottom: 24px;
    }

    .trusted-item img {
        width: 112px;
        height: 112px;
    }

    .trusted-item p {
        font-size: 14px;
        line-height: 20px;
    }

    .trusted-item {
        margin-bottom: 20px;
        gap: 10px;
    }

    .trusted .row {
        padding-bottom: 0;
        border-bottom: 1px solid #005788;
    }

    .journey-head {
        padding: 32px 16px;
    }

    .journey-head h2,
    .hybrid-intro h2,
    .method h2,
    .partners h2,
    .method .about-title {
        font-size: 20px;
        line-height: 30px;
    }

    .hybrid-intro p {
        font-size: 14px;
    }

    .journey-block {
        padding: 24px 16px 28px;
    }

    .journey-label {
        font-size: 13px;
        line-height: 20px;
    }

    .journey-copy h3 {
        font-size: 18px;
        line-height: 30px;
        margin-bottom: 16px;
    }

    .journey-person {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .journey-photo {
        width: min(180px, 100%);
    }

    .journey-name {
        font-size: 18px;
        line-height: 26px;
    }

    .journey-body {
        font-size: 15px;
        line-height: 22px;
    }

    .journey-num {
        display: none;
        font-size: 56px;
        -webkit-text-stroke-width: 1.5px;
    }

    .hybrid {
        padding-bottom: 40px;
    }

    .hybrid-dna {
        height: 200px;
    }

    .hybrid-intro {
        padding-top: 28px;
        padding-bottom: 32px;
    }

    .hybrid-point {
        padding: 12px 4px 16px;
    }

    .hybrid-point h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .hybrid-quote-copy img {
        margin-bottom: 18px;
    }

    .hybrid-quote-copy p {
        font-size: 18px;
        line-height: 28px;
        margin: 0;
    }

    .hybrid-chip {
        position: static;
        width: 100%;
        height: auto;
        margin-top: 12px;
        justify-content: flex-start;
        transform: none;
    }

    .hybrid-chip-name,
    .hybrid-chip-role {
        white-space: normal;
    }

    .method {
        padding: 40px 0;
    }

    .method-item {
        padding: 24px 0;
        gap: 16px;
        text-align: center;
        align-items: center;
    }

    .method-item img {
        width: 56px;
        height: 56px;
    }

    .method-item h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .method-item p {
        height: auto;
        font-size: 15px;
        line-height: 22px;
    }

    .partners-track {
        gap: 32px;
    }

    .partner-logo {
        width: 100px;
        height: 54px;
    }

    .results-slider {
        margin-top: 32px;
    }

    .result-quote {
        gap: 20px;
        padding: 20px 14px;
    }

    .result-card {
        aspect-ratio: 320/420;
        border-radius: 14px;
    }

    .result-card>img {
        border-radius: 14px;
    }

    .result-quote>p {
        font-size: 14px;
        line-height: 20px;
    }

    .result-person img {
        width: 36px;
        height: 36px;
    }

    .result-name,
    .result-role {
        font-size: 13px;
        line-height: 18px;
    }

    .result-quote>p,
    .result-name,
    .result-role {
        white-space: normal;
    }

    .hero-contact {
        padding: 80px 0 32px;
    }

    .contact-hero h1 {
        font-size: 26px;
        line-height: 34px;
    }

    .contact-hero .title-sub {
        font-size: 15px;
        line-height: 22px;
        margin-bottom: 20px;
    }

    .contact-card {
        padding: 20px 16px;
        border-radius: 16px;
    }

    .contact-card-copy p {
        font-size: 15px;
        line-height: 22px;
    }

    .contact-btn-pill {
        height: 48px;
        padding: 8px 14px;
        min-width: 0;
    }

    .contact-btn-pill span {
        font-size: 15px;
        line-height: 22px;
        white-space: nowrap;
    }

    .contact-support {
        padding: 40px 0;
    }

    .contact-support-head {
        margin-bottom: 24px;
    }

    .contact-support-head h2 {
        font-size: 25px;
        line-height: 34px;
    }

    .contact-support-head p {
        font-size: 15px;
        line-height: 22px;
    }

    .contact-support-form-card {
        padding: 20px 16px;
    }

    .contact-support-form-card h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .contact-field span {
        font-size: 15px;
        line-height: 22px;
    }

    .contact-input {
        height: 48px;
        font-size: 15px;
    }

    .contact-upload {
        min-height: 112px;
        padding: 16px;
    }

    .contact-upload-copy strong {
        font-size: 14px;
        line-height: 20px;
    }

    .contact-consent span:last-child {
        font-size: 14px;
        line-height: 20px;
    }

    .contact-submit {
        min-height: 52px;
        font-size: 16px;
    }

    .contact-office-card {
        min-height: 240px;
        border-radius: 16px;
    }

    .contact-office-copy {
        top: 16px;
        left: 16px;
        right: 16px;
    }

    .contact-office-copy h3 {
        font-size: 20px;
        line-height: 28px;
    }

    .contact-office-actions {
        left: 16px;
        right: 16px;
        bottom: 16px;
    }

    .contact-office-actions .btn-pill {
        min-height: 40px;
        padding: 8px 12px;
        font-size: 14px;
    }

    .contact-faq {
        padding: 40px 0;
    }

    .contact-faq .contact-section-title {
        font-size: 26px;
        line-height: 34px;
        margin-bottom: 24px;
    }

    .contact-faq-question {
        padding: 14px 16px;
        gap: 8px;
    }

    .contact-faq-index,
    .contact-faq-text {
        font-size: 15px;
        line-height: 22px;
    }

    .contact-faq-toggle {
        width: 24px;
        height: 24px;
    }

    .contact-faq-answer,
    .contact-faq-item.is-open .contact-faq-answer {
        padding-left: 16px;
        padding-right: 16px;
    }

    .contact-faq-item.is-open .contact-faq-answer {
        max-height: 480px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .contact-faq-answer p {
        font-size: 14px;
        line-height: 22px;
    }

    .contact-faq-cta p {
        font-size: 16px;
        line-height: 24px;
    }

    .contact-faq-button {
        width: 100%;
        min-height: 52px;
        font-size: 16px;
    }

    .search-hero {
        min-height: 0;
        padding: 24px 16px;
    }

    .search-hero-glow {
        width: 220px;
        height: 220px;
        right: -80px;
        bottom: -80px;
    }

    .search-hero-form {
        max-width: none;
        min-height: 48px;
        padding: 6px 6px 6px 14px;
    }

    .search-hero-form .btn-pill {
        min-width: 0;
        min-height: 40px;
        padding: 0 14px;
        font-size: 15px;
        line-height: 22px;
    }

    .search-title {
        font-size: 18px;
        line-height: 26px;
        overflow-wrap: anywhere;
    }

    .search-page .catalog-listing {
        padding-top: 24px;
        padding-bottom: 48px;
    }

    .search-page .catalog-listing .container {
        width: 100%;
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    .search-page .catalog-toolbar {
        flex-direction: column;
        align-items: stretch;
        margin-top: 16px;
    }

    .search-page .catalog-results {
        font-size: 14px;
        line-height: 22px;
    }

    .search-page .catalog-grid>[class*=col-] {
        flex: 0 0 50%;
        max-width: 50%;
        padding-left: 6px;
        padding-right: 6px;
    }

    .option-drawer-panel {
        width: 100%;
    }

    .option-drawer-body {
        padding: 0 24px 32px;
    }

    .b2b-page-header {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 16px;
    }

    .b2b-page-header .b2b-date-filter {
        width: 100%;
        flex-direction: column;
        align-items: flex-start !important;
        gap: 8px;
    }

    .b2b-page-header .b2b-date-filter .date-range-picker {
        width: 100%;
    }

    .b2b-page-header .b2b-date-filter .date-range-picker .date-input-wrap {
        flex: 1;
        width: 50%;
    }

    .filter-modal-panel {
        width: 100%;
    }

    .filter-modal-head,
    .filter-modal-foot {
        padding: 12px 16px;
    }

    .filter-modal-head p {
        font-size: 18px;
        line-height: 24px;
    }

    .filter-modal-body {
        padding: 16px;
        gap: 20px;
    }

    .filter-group-toggle span {
        font-size: 16px;
        line-height: 24px;
    }

    .filter-check span {
        font-size: 15px;
        line-height: 22px;
    }

    .filter-price-fields {
        gap: 8px;
    }

    .filter-price-field {
        height: 42px;
        padding: 0 12px;
    }

    .filter-price-field input,
    .filter-price-field span {
        font-size: 14px;
        line-height: 20px;
    }

    .filter-modal-foot {
        padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    }

    .filter-modal-foot .filter-link {
        flex-shrink: 0;
    }

    .filter-modal-foot .btn-pill {
        flex: 1;
        min-height: 44px;
        padding: 10px 16px;
        font-size: 16px;
        line-height: 22px;
    }

    .catalog-toolbar {
        margin: 20px 0;
    }

    .catalog-results {
        font-size: 16px;
        line-height: 24px;
    }

    .catalog-filter,
    .catalog-sort select,
    .catalog-sort span {
        font-size: 14px;
        line-height: 20px;
    }

    .catalog-filter {
        gap: 8px;
    }

    .catalog-filter img {
        filter: brightness(0);
    }

    .catalog-filter strong {
        width: 18px;
        height: 18px;
        font-size: 12px;
        line-height: 18px;
    }

    .catalog-title {
        font-size: 25px;
        line-height: 44px;
    }

    .catalog-toolbar-actions {
        width: 100%;
        justify-content: space-between;
        align-items: center;
    }

    .catalog-sort {
        padding-left: 0;
        border-left: 0;
        margin-left: 0;
    }

    .catalog-grid {
        margin-left: -6px;
        margin-right: -6px;
    }

    .catalog-card {
        margin-bottom: 20px;
    }

    .catalog-card-copy {
        padding-top: 8px;
    }

    .btn-pill--md {
        min-height: 47px;
        padding: 10px 24px;
        font-size: 14px;
        line-height: 26px;
        border-radius: 40px;
    }

    .catalog-card-copy h2 {
        font-size: 13px !important;
        line-height: 18px !important;
        display: -webkit-box;
        margin-bottom: 0 !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .catalog-card-copy p {
        font-size: 13px;
        line-height: 18px;
    }

    .catalog-card-copy span {
        margin: 0 4px;
    }

    .catalog-card-tag {
        font-size: 10px !important;
        line-height: 14px !important;
        letter-spacing: 0.06em;
    }

    .catalog-card-cta {
        right: 8px;
        bottom: 8px;
        width: 36px;
        height: 36px;
        min-height: 36px;
        padding: 0;
    }

    .pdp-ingredients {
        padding: 0;
    }

    .guide-section {
        padding: 64px 0 48px;
    }

    .guide-shell {
        padding: 20px 16px;
        gap: 16px;
        border-radius: 16px;
    }

    .guide-article,
    .guide-article-body {
        gap: 16px;
    }

    .guide-block {
        gap: 12px;
    }

    .guide-article h2 {
        font-size: 18px;
        line-height: 32px;
    }

    .guide-block h3 {
        font-size: 17px;
        line-height: 24px;
    }

    .guide-block p,
    .guide-block li,
    .guide-faq-answer p {
        font-size: 14px;
        line-height: 22px;
    }

    .guide-faq-title {
        font-size: 22px !important;
        line-height: 28px !important;
    }

    .guide-faq-question {
        gap: 8px;
        padding: 12px 14px;
    }

    .guide-faq-index,
    .guide-faq-text {
        font-size: 15px;
        line-height: 22px;
    }

    .guide-faq-toggle {
        width: 24px;
        height: 24px;
    }

    .guide-faq-answer,
    .guide-faq-item.is-open .guide-faq-answer {
        padding-left: 14px;
        padding-right: 14px;
    }

    .guide-faq-item.is-open .guide-faq-answer {
        max-height: 480px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .terms-header {
        padding: 18px 0;
    }

    .terms-header .logo {
        max-width: 160px;
    }

    .terms-hero-copy h1 {
        font-size: 32px;
        line-height: 40px;
    }

    .terms-content {
        padding-bottom: 64px;
    }

    .terms-table {
        min-width: 680px;
    }

    .terms-table th,
    .terms-table td {
        padding: 12px 16px;
    }

    .treatment-intro .treatment-title {
        font-size: 32px;
    }

    .treatment-pain h2 {
        font-size: 24px;
    }

    .treatment-products {
        padding: 30px 0;
        background: #fff;
    }

    .treatment-section-title {
        font-size: 16px;
        margin-bottom: 32px;
    }

    .treatment-process .treatment-step-card h3 {
        font-size: 14px;
    }

    .treatment-benefits .treatment-benefits-box {
        padding: 24px 16px;
    }

    .treatment-consult .consult-info .consult-title {
        font-size: 22px;
    }

    .treatment-intro-head .treatment-title {
        font-size: 20px;
        line-height: 28px;
    }

    .hybrid-detail-intro,
    .hybrid-detail-story,
    .hybrid-detail-pillars,
    .hybrid-detail-diff,
    .hybrid-detail-faq {
        padding: 30px 0;
    }
    .treatment-pain-badge {
        margin-bottom: 5px;
    }
    .treatment-intro-head .treatment-subtitle {
        font-size: 12px;
    }

    .treatment-intro-head .treatment-desc {
        font-size: 14px;
    }

    .hybrid-detail-hero {
        min-height: 300px;
    }

    .hybrid-detail-intro h1,
    .hybrid-detail-story-head h2,
    .hybrid-detail-pillars h2,
    .hybrid-detail-faq .contact-section-title {
        margin-bottom: 32px;
        font-size: 24px;
        line-height: 40px;
    }

    .hybrid-detail-diff h2 {
        margin-bottom: 32px;
        font-size: 20px;
        line-height: 40px;
    }

    .treatment-process {
        padding: 30px 0;
    }

    .hybrid-detail-diff .container-home,
    .hybrid-detail-diff-block {
        gap: 32px;
    }

    .hybrid-detail-story-head p {
        font-size: 16px;
        line-height: 26px;
    }

    .hybrid-detail-pillars-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .hybrid-detail-pillars-dna {
        width: 900px;
        left: 0;
        transform: none;
        opacity: 0.55;
    }

    .treatment-products-progress {
        display: none;
    }

    .hybrid-detail-faq .contact-faq-button {
        width: 100%;
    }

    .treatment-products .treatment-products-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .treatment-products .treatment-products-head .treatment-products-note {
        text-align: left;
    }
}

@media (max-width: 700px) {
    .ep-gallery-more-label {
        padding: 20px;
    }

    .ep-gallery-main {
        height: 220px;
    }

    .ep-gallery-item,
    .ep-gallery-more {
        height: 180px;
        flex: none;
    }

    .ep-gallery-more-label {
        padding: 16px;
        font-size: 14px;
        line-height: 22px;
    }

    .footer-form-wrap span {
        margin: 0 0 16px;
        font-size: 18px;
        line-height: 35px;
    }

    .expert-more {
        font-size: 14px;
    }

    .register-type-label {
        font-size: 14px;
    }

    .register-input input,
    .login-field input {
        font-size: 14px;
    }
}

@media (max-width: 575.98px) {
    .login-modal .modal-dialog {
        margin: 0.5rem;
    }

    .login-modal-body {
        overflow-y: scroll;
        height: 600px;
    }

    .login-modal-head,
    .login-modal-body {
        padding-left: 20px;
        padding-right: 20px;
    }

    .login-modal-welcome {
        font-size: 20px;
        line-height: 28px;
    }

    .login-social-row {
        flex-direction: column;
    }

    .register-otp-grid {
        gap: 8px;
    }

    .register-otp-cell {
        height: 52px;
        font-size: 24px;
        line-height: 32px;
    }

    .ep-hero-stats-row {
        flex-direction: column;
        gap: 16px;
    }

    .ep-hero-stat-divider {
        display: none;
    }

    .ep-hero-title {
        font-size: 20px;
        line-height: 25px;
    }

    .ep-consult-card-form .submit-btn {
        font-size: 14px;
    }

    .ep-award-foot {
        bottom: 13px;
        gap: 0;
    }

    .ep-hero-stat-num {
        font-size: 20px;
        line-height: 20px;
    }

    .ep-story-quote p {
        font-size: 14px;
    }

    .ep-press-card p {
        font-size: 14px;
        line-height: 24px;
    }

    .ep-hero-subtitle {
        font-size: 14px;
        line-height: 20px;
    }

    .ep-philosophy-card {
        border-radius: 20px;
        padding: 24px 16px;
    }

    .ep-philosophy-text {
        font-size: 15px;
        line-height: 22px;
    }

    .ep-field-card {
        height: 180px;
    }

    .team-hero {
        padding-top: 112px;
        padding-bottom: 28px;
    }

    .team-hero-title {
        top: 75px;
        font-size: 32px;
        line-height: 1.1;
    }

    .team-intro-title {
        font-size: 24px;
        line-height: 32px;
    }

    .team-section-title {
        font-size: 24px;
        line-height: 32px;
    }

    /*.team-member-photo {*/
    /*    height: 280px;*/
    /*}*/

    .team-member-quote p {
        font-size: 16px;
        line-height: 24px;
    }

    .team-consult-copy h2 {
        font-size: 22px;
        line-height: 30px;
    }

    .b2b-panel__intro .intro-title {
        font-size: 26px;
        line-height: 34px;
    }

    .b2b-panel .b2b-otp-box {
        height: 52px;
        font-size: 20px;
        border-radius: 8px;
    }

    .b2b-topbar__left .topbar-welcome {
        font-size: 15px;
    }

    .b2b-topbar .btn-b2b-primary {
        padding: 0 10px;
        font-size: 12px;
    }

    .hero-banner__title {
        font-size: 20px;
        line-height: 28px;
    }

    .b2b-kpi-summary-grid {
        grid-template-columns: 1fr;
    }

    .account-panel-head {
        flex-wrap: wrap;
    }

    .account-radios {
        gap: 20px;
    }

    .orders-tabs.nav-tabs .nav-link {
        padding-left: 16px;
        padding-right: 16px;
    }

    .order-card-meta {
        flex-wrap: wrap;
    }

    .order-card-summary {
        flex-direction: column;
    }

    .order-item-right {
        padding-left: 0;
    }

    .order-detail-head {
        flex-wrap: wrap;
    }

    .order-step-time {
        flex-direction: column;
        gap: 0;
    }

    .order-step-name,
    .order-step-time {
        font-size: 12px;
        line-height: 18px;
    }

    .address-head {
        flex-direction: column;
        align-items: stretch;
    }

    .address-item {
        flex-direction: column;
    }

    .address-item-actions {
        align-self: flex-end;
    }

    .logout-modal .modal-content {
        padding: 24px 20px 32px;
    }

    .logout-modal-actions {
        flex-direction: column;
    }

    .b2b-hero .b2b-stat {
        margin-bottom: 16px;
        padding-right: 0;
    }

    .b2b-hero .b2b-stat:last-child {
        margin-bottom: 0;
    }

    .b2b-hero .b2b-benefits-row {
        grid-template-columns: 1fr;
    }

    .treatment-process .treatment-step-card {
        padding: 0 16px;
        border-right: none;
    }
}

.treatment-pc {
    display: block;
}

.treatment-mobile {
    display: none;
}

@media (max-width: 480px) {
    .b2b-panel .b2b-otp-grid {
        gap: 8px;
    }
}

@media (max-width: 756px) {
    .treatment-pc {
        display: none;
    }

    .treatment-mobile {
        display: block;
    }

    .treatment-process .treatment-process-grid:not(.owl-loaded) {
        flex-direction: column;
        text-align: center;
    }

    .treatment-process .treatment-step-card {
        padding: 16px;
    }

    .treatment-process .treatment-step-card .step-icon {
        margin: 0 auto 24px auto;
    }

    .treatment-process .treatment-process-grid:not(.owl-loaded) .treatment-step-card {
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }

    .treatment-benefits .treatment-benefit-card {
        text-align: center;
    }

    .treatment-benefits .treatment-benefit-card .benefit-icon-circle {
        margin: 0 auto 24px auto;
    }

    .treatment-process .treatment-process-grid {
        margin-bottom: 0;
        border-bottom: unset;
    }

    .hybrid-detail-table tbody th:first-child,
    .hybrid-detail-table thead th:first-child {
        width: 200px;
    }

    .blog-body table p {
        font-size: 12px;
        margin-bottom: 0;
    }

    .blog-body .table td, .table th {
        padding: 0.25rem;
        font-size: 12px;
    }

    .blog-body iframe {
        max-width: 100%;
        height: auto;
    }
}

@media (min-width: 992px) {
    .ep-achieve-col-wrap:not(:last-child) {
        border-right: 1px solid rgba(178, 203, 231, 0.2);
    }

}

@media (hover: none) {
    .catalog-card-cta {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 400px) {
    .hybrid-detail-story-head p {
        font-size: 15px !important;
    }

    .science-copy p {
        font-size: 13px !important;
    }

    .expert-id p {
        font-size: 11px !important;
    }

    .about-intro .about-intro-title {
        font-size: 19px;
    }
}