#es-product-page, #es-product-page * { box-sizing: border-box; }
#es-product-page { width:100%; max-width:1920px; margin:0 auto; }

  /* =========================================================
   PHONAK AUDÉO EON SPHERE
   COMPLETE UPDATED CSS
   ZIPHEARING STYLE
========================================================= */


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

/* =========================================================
   MAIN PAGE
========================================================= */

.product-page {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 50px 25px;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.product-page .breadcrumb {
    width: 100%;
    height: 52px;

    display: flex;
    align-items: center;

    gap: 16px;

    font-size: 15px;
    line-height: 1.2;

    color: #718098;

    white-space: nowrap;
    overflow: hidden;
}

.product-page .breadcrumb span {
    flex-shrink: 0;
}

.product-page .breadcrumb .arrow {
    font-size: 23px;
    line-height: 1;
    color: #c5cbd1;
}

.product-page .breadcrumb .current {
    color: #718098;
}


/* =========================================================
   MAIN GRID
========================================================= */

.product-page .product-grid {
    width: 100%;

    display: grid;

    grid-template-columns: minmax(0, 1fr) minmax(620px, 52%);

    gap: 35px;

    align-items: start;
}


/* =========================================================
   LEFT PRODUCT INFORMATION
========================================================= */

.product-page .product-info {
    width: 100%;
    min-width: 0;
}


/* =========================================================
   PRODUCT TITLE
========================================================= */

.product-page .product-title {
    width: 100%;

    margin: 10px 0 3px;
    padding: 0;

    display: flex;
    align-items: center;

    gap: 8px;

    color: #2b3d5b;

    font-size: 38px;
    line-height: 1.08;

    font-weight: 700;

    letter-spacing: -0.5px;
}

.product-page .product-title .audio-icon {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    margin: 0;

    color: #2b3d5b;

    font-size: 25px;

    line-height: 1;
}


/* =========================================================
   SUBTITLE
========================================================= */

.product-page .subtitle {
    margin: 3px 0 14px;

    color: #23466e;

    font-size: 20px;
    line-height: 1.25;

    font-weight: 700;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.product-page .description {
    width: 100%;
    max-width: 850px;

    margin: 0 0 13px;

    color: #385474;

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

    font-weight: 400;
}


/* =========================================================
   RATING
========================================================= */

.product-page .rating-row {
    display: flex;

    align-items: center;

    gap: 7px;

    margin: 9px 0 21px;
}

.product-page .stars {
    color: #f23851;

    font-size: 21px;

    line-height: 1;

    letter-spacing: -3px;

    white-space: nowrap;
}

.product-page .rating-number {
    margin-left: 5px;

    color: #233f63;

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

    font-weight: 700;
}

.product-page .reviews {
    color: #214d82;

    font-size: 15px;
    line-height: 1.2;
}


/* =========================================================
   PRODUCT OPTIONS
========================================================= */

.product-page .option-grid {
    width: 100%;
    max-width: 850px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 9px;
}

.product-page .product-option {
    width: 100%;
    height: 53px;

    display: flex;

    align-items: center;

    padding: 0 14px;

    border: 2px solid #cbd0d6;

    border-radius: 8px;

    background: #ffffff;

    cursor: pointer;

    transition:
        border-color 0.2s ease,
        background 0.2s ease;
}

.product-page .product-option:hover {
    border-color: #045cb4;
}

.product-page .product-option.active {
    border-color: #045cb4;

    background: #ffffff;
}


/* =========================================================
   RADIO
========================================================= */

.product-page .radio {
    width: 20px;
    height: 20px;

    min-width: 20px;

    margin-right: 10px;

    border: 2px solid #cbd1d7;

    border-radius: 50%;

    position: relative;
}

.product-page .product-option.active .radio {
    border-color: #045cb4;
}

.product-page .product-option.active .radio::after {
    content: "";

    position: absolute;

    width: 8px;
    height: 8px;

    left: 4px;
    top: 4px;

    border-radius: 50%;

    background: #045cb4;
}


/* =========================================================
   OPTION TEXT
========================================================= */

.product-page .option-name {
    min-width: 0;

    color: #294668;

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

    font-weight: 700;
}

.product-page .option-level {
    margin-left: auto;

    padding-left: 8px;

    color: #788496;

    font-size: 15px;
    line-height: 1.2;

    font-weight: 400;

    white-space: nowrap;
}


/* =========================================================
   PRICE
========================================================= */

.product-page .price {
    display: flex;

    align-items: baseline;

    gap: 7px;

    margin-top: 19px;
}

.product-page .price-amount {
    color: #234467;

    font-size: 36px;
    line-height: 1;

    font-weight: 700;
}

.product-page .price-unit {
    color: #244467;

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

    font-weight: 400;
}


/* =========================================================
   SAVINGS
========================================================= */

.product-page .savings {
    margin-top: 9px;

    color: #0a9d38;

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

    font-weight: 700;
}


/* =========================================================
   BENEFITS
========================================================= */

.product-page .benefits {
    width: 100%;

    margin-top: 14px;
    margin-bottom: 21px;
}

.product-page .benefit {
    display: flex;

    align-items: center;

    gap: 9px;

    margin: 7px 0;

    color: #2e4b70;

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

    font-weight: 400;
}

.product-page .check {
    width: 23px;
    height: 23px;

    min-width: 23px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #dff2dc;

    color: #5bb85c;

    font-size: 14px;
    line-height: 1;

    font-weight: 700;
}


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

.product-page .main-cta {
    width: 100%;
    max-width: 850px;

    height: 65px;

    margin: 0;
    padding: 0 20px;

    border: 0;
    border-radius: 8px;

    background: #df2038;

    color: #ffffff;

    font-size: 19px;
    line-height: 1;

    font-weight: 700;

    letter-spacing: 0.8px;

    cursor: pointer;

    transition: background 0.2s ease;
}

.product-page .main-cta:hover {
    background: #c91830;
}

.product-page .cta-arrow {
    display: inline-block;

    margin-left: 7px;

    font-size: 30px;

    line-height: 0;

    vertical-align: -5px;
}


/* =========================================================
   RIGHT PRODUCT AREA
========================================================= */

.product-page .product-visual {
    width: 100%;

    min-height: 675px;

    display: grid;

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

    gap: 17px;

    padding: 15px;

    border-radius: 17px;

    background: #f5f5f7;
}


/* =========================================================
   IMAGE AREA
========================================================= */

.product-page .image-area {
    width: 100%;
    min-width: 0;
    min-height: 635px;
    padding: 28px 24px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    background: #ffffff;
    border: 1px solid #dfe7ef;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(15,35,73,.06);
}

.product-page .product-image {
    display: block;
    width: min(100%, 500px);
    max-width: 500px;
    height: 440px;
    margin: 0 auto;
    object-fit: contain;
    object-position: center;
    transition: opacity .18s ease, transform .18s ease;
}

.product-page .product-image.image-changing { opacity: .35; }


/* =========================================================
   COLOR TITLE
========================================================= */

.product-page .color-title {
    margin-top: 5px;
    margin-bottom: 16px;

    color: #273f5f;

    font-size: 14px;
    line-height: 1.2;

    font-weight: 700;

    text-align: center;

    text-transform: uppercase;
}


/* =========================================================
   COLORS
========================================================= */

.product-page .colors {
    width: 100%;

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 12px;
}

.product-page .color {
    width: 29px;
    height: 29px;

    flex: 0 0 29px;

    border-radius: 50%;

    border: 2px solid transparent;

    cursor: pointer;

    transition: transform 0.15s ease;
}

.product-page .color:hover {
    transform: scale(1.08);
}

.product-page .color.active {
    outline: 3px solid #bcbcbc;
    outline-offset: 4px;
}


/* =========================================================
   COLORS
========================================================= */

.product-page .color-1 {
    background: #c5c5c3;
}

.product-page .color-2 {
    background: #aaa794;
}

.product-page .color-3 {
    background: #c6a98d;
}

.product-page .color-4 {
    background: #5f6262;
}

.product-page .color-5 {
    background: #8d7966;
}

.product-page .color-6 {
    background: #000000;
}

.product-page .color-7 {
    background: #995f4e;
}

.product-page .color-8 {
    background: #86352d;
}


/* =========================================================
   SIDE CARDS
========================================================= */

.product-page .side-cards {
    width: 100%;

    display: flex;

    flex-direction: column;

    gap: 16px;
}


/* =========================================================
   INFORMATION CARD
========================================================= */

.product-page .info-card {
    width: 100%;

    padding: 16px 19px;

    border-radius: 15px;

    background: #ffffff;

    box-shadow:
        0 2px 7px rgba(0, 0, 0, 0.10);
}


/* =========================================================
   CARD TITLE
========================================================= */

.product-page .info-card h3 {
    margin: 0 0 9px;
    padding: 0;

    color: #123c6b;

    font-size: 20px;
    line-height: 1.25;

    font-weight: 400;
}


/* =========================================================
   CARD TEXT
========================================================= */

.product-page .info-card p {
    margin: 0;

    color: #355c89;

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

    font-weight: 400;
}


/* =========================================================
   NEXT STEPS
========================================================= */

.product-page .next-steps {
    list-style: none;

    margin: 0;
    padding: 0;
}

.product-page .next-steps li {
    margin: 0;

    color: #355c89;

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

    font-weight: 400;
}

.product-page .next-steps li span {
    color: #045cb4;
}




/* =========================================================
   PLAY BUTTON
========================================================= */

.product-page .play-button {
    position: absolute;

    width: 48px;
    height: 48px;

    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);

    display: flex;

    align-items: center;
    justify-content: center;

    padding-left: 3px;

    border-radius: 50%;

    background: #045cb4;

    color: #ffffff;

    font-size: 20px;

    line-height: 1;
}



/* =========================================================
   1450 PX
========================================================= */

@media (max-width: 1450px) {

    .product-page {
        padding-left: 40px;
        padding-right: 40px;
    }

    .product-page .product-grid {
        grid-template-columns: minmax(0, 1fr) minmax(560px, 48%);
        gap: 35px;
    }

    .product-page .product-title {
        font-size: 36px;
    }

    .product-page .subtitle {
        font-size: 19px;
    }

    .product-page .description {
        font-size: 15px;
    }

    .product-page .product-visual {
        grid-template-columns: minmax(0, 1fr) 285px;
    }

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

    .product-page .info-card p,
    .product-page .next-steps li {
        font-size: 15px;
    }
}


/* =========================================================
   1200 PX
========================================================= */

@media (max-width: 1200px) {

    .product-page {
        padding-left: 30px;
        padding-right: 30px;
    }

    .product-page .product-grid {
        grid-template-columns: minmax(0, 1fr) 590px;
        gap: 25px;
    }

    .product-page .product-title {
        font-size: 34px;
    }

    .product-page .subtitle {
        font-size: 18px;
    }

    .product-page .description {
        font-size: 15px;
    }

    .product-page .product-visual {
        grid-template-columns: minmax(0, 1fr) 255px;
    }
}


/* =========================================================
   1050 PX
========================================================= */

@media (max-width: 1050px) {

    .product-page .product-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .product-page .product-title {
        font-size: 36px;
    }

    .product-page .subtitle {
        font-size: 20px;
    }

    .product-page .description {
        max-width: 900px;
        font-size: 16px;
    }

    .product-page .option-grid {
        max-width: 900px;
    }

    .product-page .main-cta {
        max-width: 900px;
    }

    .product-page .product-visual {
        grid-template-columns: minmax(0, 1fr) 320px;
        min-height: 600px;
    }

    .product-page .image-area {
        min-height: 560px;
    }

    .product-page .product-image {
        max-width: 500px;
        height: 400px;
    }
}


/* =========================================================
   700 PX - MOBILE
========================================================= */

@media (max-width: 700px) {

    .product-page {
        padding: 0 15px 20px;
    }


    /* Breadcrumb */

    .product-page .breadcrumb {
        height: 43px;

        gap: 7px;

        font-size: 12px;
    }

    .product-page .breadcrumb .arrow {
        font-size: 19px;
    }


    /* Title */

    .product-page .product-title {
        margin-top: 8px;

        font-size: 28px;
        line-height: 1.08;

        gap: 6px;
    }

    .product-page .product-title .audio-icon {
        font-size: 22px;
    }


    /* Subtitle */

    .product-page .subtitle {
        margin-top: 7px;
        margin-bottom: 13px;

        font-size: 18px;
        line-height: 1.3;
    }


    /* Description */

    .product-page .description {
        margin-bottom: 12px;

        font-size: 15px;
        line-height: 1.5;
    }


    /* Rating */

    .product-page .rating-row {
        margin-top: 9px;
        margin-bottom: 18px;
    }

    .product-page .stars {
        font-size: 20px;
    }

    .product-page .rating-number,
    .product-page .reviews {
        font-size: 14px;
    }


    /* Options */

    .product-page .option-grid {
        grid-template-columns: 1fr;
        gap: 9px;
    }

    .product-page .product-option {
        height: 51px;
    }

    .product-page .option-name {
        font-size: 15px;
    }

    .product-page .option-level {
        font-size: 14px;
    }


    /* Price */

    .product-page .price {
        margin-top: 18px;
    }

    .product-page .price-amount {
        font-size: 33px;
    }

    .product-page .price-unit {
        font-size: 15px;
    }


    /* Savings */

    .product-page .savings {
        font-size: 15px;
    }


    /* Benefits */

    .product-page .benefits {
        margin-top: 13px;
        margin-bottom: 20px;
    }

    .product-page .benefit {
        margin: 7px 0;

        font-size: 14px;
    }


    /* CTA */

    .product-page .main-cta {
        height: 60px;

        font-size: 16px;
    }

    .product-page .cta-arrow {
        font-size: 28px;
    }


    /* Right Section */

    .product-page .product-visual {
        grid-template-columns: 1fr;

        min-height: auto;

        gap: 15px;

        margin-top: 22px;

        padding: 14px;
    }


    /* Image */

    .product-page .image-area {
        min-height: 390px;
        padding: 18px;
        border-radius: 14px;
    }

    .product-page .product-image {
        max-width: 380px;
        height: 300px;
    }


    /* Colors */

    .product-page .color-title {
        margin-top: 5px;
        margin-bottom: 15px;

        font-size: 13px;
    }

    .product-page .colors {
        gap: 11px;
    }

    .product-page .color {
        width: 27px;
        height: 27px;

        flex-basis: 27px;
    }


    /* Cards */

    .product-page .side-cards {
        gap: 13px;
    }

    .product-page .info-card {
        padding: 15px 17px;

        border-radius: 14px;
    }

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

    .product-page .info-card p,
    .product-page .next-steps li {
        font-size: 15px;
    }
}


/* =========================================================
   420 PX - SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .product-page {
        padding-left: 12px;
        padding-right: 12px;
    }

    .product-page .breadcrumb {
        font-size: 11px;
    }

    .product-page .product-title {
        font-size: 25px;
    }

    .product-page .product-title .audio-icon {
        font-size: 20px;
    }

    .product-page .subtitle {
        font-size: 17px;
    }

    .product-page .description {
        font-size: 14px;
    }

    .product-page .stars {
        font-size: 19px;
    }

    .product-page .rating-number,
    .product-page .reviews {
        font-size: 13px;
    }

    .product-page .option-name {
        font-size: 14px;
    }

    .product-page .option-level {
        font-size: 13px;
    }

    .product-page .price-amount {
        font-size: 31px;
    }

    .product-page .price-unit {
        font-size: 14px;
    }

    .product-page .savings {
        font-size: 14px;
    }

    .product-page .benefit {
        font-size: 13px;
    }

    .product-page .main-cta {
        height: 58px;

        font-size: 15px;
    }

    .product-page .product-visual {
        padding: 12px;
    }

    .product-page .image-area {
        min-height: 360px;
    }

    .product-page .product-image {
        height: 280px;
    }

    .product-page .colors {
        gap: 9px;
    }

    .product-page .color {
        width: 25px;
        height: 25px;

        flex-basis: 25px;
    }

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

    .product-page .info-card p,
    .product-page .next-steps li {
        font-size: 14px;
    }
}


/* =========================================================
   WHY IN-PERSON CARE SECTION
========================================================= */

.product-page .care-section {
    width: 100%;
    margin-top: 55px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 64px;
    align-items: stretch;
}

.product-page .care-viewer {
    min-width: 0;
    min-height: 600px;
    padding: 32px 36px 25px;
    border-radius: 17px;
    background: #f5f5f7;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.product-page .care-image-wrap {
    width: 100%;
    height: 485px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.product-page .care-image {
    display: block;
    width: 100%;
    max-width: 590px;
    height: 100%;
    object-fit: contain;
}


.product-page .care-content {
    min-width: 0;
    padding-top: 5px;
}

.product-page .care-eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 9px;
    color: #045cb4;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: .5px;
}

.product-page .care-location-icon {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #e6f0fa;
    color: #045cb4;
    font-size: 22px;
}

.product-page .care-title {
    margin: 0 0 18px;
    color: #213f64;
    font-size: 32px;
    line-height: 1.2;
    font-weight: 700;
}

.product-page .care-text {
    margin: 0 0 26px;
    color: #55708f;
    font-size: 18px;
    line-height: 1.58;
}

.product-page .care-text + .care-text {
    margin-top: 0;
}

.product-page .care-text strong {
    color: #1f3d61;
    font-weight: 700;
}

.product-page .care-guarantee {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 24px;
    padding: 16px 20px;
    border: 1px solid #b9e8c8;
    border-radius: 10px;
    background: #ecfbf0;
    color: #189a37;
    font-size: 16px;
    line-height: 1.35;
    font-weight: 700;
}

.product-page .care-check {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #21a43a;
    color: #fff;
    font-size: 17px;
    line-height: 1;
}

.product-page .manufacturer-box {
    width: 100%;
    padding: 24px 27px;
    border: 1px solid #dfe4e9;
    border-radius: 13px;
    background: #fff;
}

.product-page .manufacturer-box h3 {
    margin: 0 0 18px;
    color: #203f63;
    font-size: 22px;
    line-height: 1.25;
    font-weight: 700;
}

.product-page .manufacturer-copy {
    margin: 0;
    padding-left: 20px;
    border-left: 4px solid #045cb4;
    color: #6b819a;
    font-size: 18px;
    line-height: 1.55;
}

.product-page .manufacturer-copy strong {
    color: #294667;
    font-weight: 700;
}

@media (max-width: 1050px) {
    .product-page .care-section {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .product-page .care-viewer {
        min-height: 560px;
    }
}

@media (max-width: 700px) {
    .product-page .care-section {
        margin-top: 35px;
        gap: 25px;
    }

    .product-page .care-viewer {
        min-height: 430px;
        padding: 20px 18px 22px;
    }

    .product-page .care-image-wrap {
        height: 330px;
    }
.product-page .care-eyebrow {
        font-size: 13px;
        gap: 9px;
    }

    .product-page .care-location-icon {
        width: 38px;
        height: 38px;
        font-size: 19px;
    }

    .product-page .care-title {
        font-size: 25px;
        line-height: 1.25;
        margin-bottom: 15px;
    }

    .product-page .care-text {
        font-size: 15px;
        line-height: 1.55;
        margin-bottom: 21px;
    }

    .product-page .care-guarantee {
        padding: 13px 14px;
        font-size: 14px;
    }

    .product-page .manufacturer-box {
        padding: 20px;
    }

    .product-page .manufacturer-box h3 {
        font-size: 19px;
    }

    .product-page .manufacturer-copy {
        font-size: 15px;
        padding-left: 15px;
    }
}


/* =========================================================
   BENEFITS STRIP + PRODUCT TABS
========================================================= */
.product-page .benefits-tabs-section {
    width: calc(100% + 100px);
    margin-left: -50px;
    margin-top: 58px;
    background: #f5f6f7;
    padding: 72px 50px 0;
}

.product-page .benefits-strip {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: end;
    gap: 25px;
    min-height: 300px;
}

.product-page .benefit-item {
    min-width: 0;
    text-align: center;
    color: #9aa7bb;
    font-size: 19px;
    line-height: 1.25;
    font-weight: 400;
}

.product-page .benefit-icon {
    width: 92px;
    height: 92px;
    margin: 0 auto 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #045cb4;
}

.product-page .benefit-icon svg {
    width: 78px;
    height: 78px;
    display: block;
}

.product-page .benefit-item.local-care {
    color: #9aa7bb;
    font-weight: 700;
}

.product-page .benefit-item.local-care .benefit-icon {
    width: 150px;
    height: 150px;
    margin-top: -35px;
    margin-bottom: -5px;
    border-radius: 50%;
    background: rgba(4,92,180,.07);
}

.product-page .benefit-item.local-care .benefit-icon svg {
    width: 105px;
    height: 105px;
}

.product-page .product-tabs {
    width: 100%;
    margin-top: 52px;
    background: #fff;
    border: 1px solid #e2e5e8;
    border-bottom: 0;
}

.product-page .tab-buttons {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-bottom: 1px solid #e1e5e8;
}

.product-page .tab-button {
    min-height: 91px;
    padding: 18px 12px;
    border: 0;
    border-right: 1px solid #e1e5e8;
    background: #fff;
    color: #234a78;
    font-family: inherit;
    font-size: 19px;
    font-weight: 400;
    cursor: pointer;
    position: relative;
}

.product-page .tab-button:last-child {
    border-right: 0;
}

.product-page .tab-button.active {
    color: #045cb4;
    font-weight: 500;
}

.product-page .tab-button.active::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -1px;
    height: 3px;
    background: #045cb4;
}

.product-page .tab-panels {
    min-height: 230px;
    padding: 38px 42px 45px;
}

.product-page .tab-panel {
    display: none;
    color: #526d8c;
    font-size: 17px;
    line-height: 1.6;
}

.product-page .tab-panel.active {
    display: block;
}

.product-page .tab-panel h3 {
    margin: 0 0 12px;
    color: #213f64;
    font-size: 23px;
}

.product-page .tab-panel p {
    margin: 0 0 12px;
}

@media (max-width: 1100px) {
    .product-page .benefits-tabs-section {
        width: calc(100% + 60px);
        margin-left: -30px;
        padding-left: 30px;
        padding-right: 30px;
    }

    .product-page .benefits-strip {
        gap: 12px;
    }

    .product-page .benefit-item {
        font-size: 16px;
    }

    .product-page .tab-button {
        font-size: 17px;
    }
}

@media (max-width: 700px) {
    .product-page .benefits-tabs-section {
        width: calc(100% + 30px);
        margin-left: -15px;
        margin-top: 38px;
        padding: 42px 15px 0;
    }

    .product-page .benefits-strip {
        grid-template-columns: repeat(2, 1fr);
        gap: 35px 10px;
        min-height: auto;
    }

    .product-page .benefit-item {
        font-size: 14px;
    }

    .product-page .benefit-icon {
        width: 70px;
        height: 70px;
        margin-bottom: 10px;
    }

    .product-page .benefit-icon svg {
        width: 58px;
        height: 58px;
    }

    .product-page .benefit-item.local-care .benefit-icon {
        width: 95px;
        height: 95px;
        margin-top: -15px;
        margin-bottom: -2px;
    }

    .product-page .benefit-item.local-care .benefit-icon svg {
        width: 70px;
        height: 70px;
    }

    .product-page .product-tabs {
        margin-top: 35px;
        overflow-x: auto;
    }

    .product-page .tab-buttons {
        min-width: 650px;
    }

    .product-page .tab-button {
        min-height: 70px;
        font-size: 14px;
    }

    .product-page .tab-panels {
        min-width: 650px;
        padding: 28px 20px 35px;
    }
}


/* =========================================================
   OVERVIEW ARTICLE
========================================================= */
.product-page .overview-article {
    width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 365px;
    gap: 68px;
    padding: 70px 56px 80px;
    background: #fff;
}

.product-page .overview-main {
    min-width: 0;
}

.product-page .overview-title {
    margin: 0 0 40px;
    color: #2d3e5c;
    font-size: 40px;
    line-height: 1.5;
    font-weight: 700;
    letter-spacing: -0.7px;
}

.product-page .author-meta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 25px;
    align-items: center;
    margin-bottom: 48px;
}

.product-page .author-left {
    display: flex;
    align-items: center;
    gap: 23px;
}

.product-page .author-avatar {
    width: 96px;
    height: 96px;
    flex: 0 0 96px;
    border-radius: 50%;
    border: 2px solid #045cb4;
    background: #eef4f7;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2d3e5c;
    font-size: 27px;
    font-weight: 700;
}

.product-page .author-name {
    margin: 0 0 12px;
    color: #045cb4;
    font-size: 18px;
    line-height: 1.2;
}

.product-page .author-role {
    margin: 0;
    color: #64728a;
    font-size: 17px;
    line-height: 1.3;
}

.product-page .publish-meta {
    text-align: right;
    color: #999;
    font-size: 14px;
    line-height: 2.1;
    white-space: nowrap;
}

.product-page .publish-meta a {
    color: #045cb4;
    text-decoration: none;
}

.product-page .overview-copy {
    color: #526984;
    font-size: 17px;
    line-height: 1.8;
}

.product-page .overview-copy p {
    margin: 0 0 24px;
}

.product-page .overview-copy strong {
    color: #273d5c;
    font-weight: 700;
}

.product-page .quick-nav {
    align-self: start;
    background: #fafafa;
    border-radius: 5px;
    padding: 38px 39px 28px;
}

.product-page .quick-nav-title {
    margin: 0 0 18px;
    padding-bottom: 18px;
    border-bottom: 2px dashed #ddd;
    color: #49627e;
    font-size: 27px;
    line-height: 1.2;
    font-weight: 300;
}

.product-page .quick-nav-list {
    list-style: none;
    padding: 0;
    margin: 0 0 32px;
}

.product-page .quick-nav-list li {
    margin: 0 0 18px;
}

.product-page .quick-nav-list a {
    color: #045cb4;
    font-size: 16px;
    line-height: 1.45;
    text-decoration: none;
}

.product-page .quick-nav-list a:hover {
    text-decoration: underline;
}

.product-page .overview-cta {
    display: block;
    width: 100%;
    min-height: 90px;
    padding: 16px 20px;
    border-radius: 7px;
    background: #df2038;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 15px;
    line-height: 1.55;
    font-weight: 700;
    letter-spacing: 1px;
}

.product-page .overview-cta:hover {
    background: #c91830;
}

@media (max-width: 1200px) {
    .product-page .overview-article {
        grid-template-columns: minmax(0, 1fr) 320px;
        gap: 40px;
        padding: 55px 40px 65px;
    }

    .product-page .overview-title {
        font-size: 34px;
    }

    .product-page .author-meta {
        grid-template-columns: 1fr;
    }

    .product-page .publish-meta {
        text-align: left;
    }
}

@media (max-width: 850px) {
    .product-page .overview-article {
        grid-template-columns: 1fr;
        gap: 38px;
        padding: 45px 25px 55px;
    }

    .product-page .overview-title {
        font-size: 30px;
        line-height: 1.25;
        margin-bottom: 30px;
    }

    .product-page .author-meta {
        margin-bottom: 35px;
    }

    .product-page .quick-nav {
        padding: 28px 25px 25px;
    }
}

@media (max-width: 520px) {
    .product-page .overview-article {
        padding: 35px 18px 45px;
    }

    .product-page .overview-title {
        font-size: 25px;
    }

    .product-page .author-left {
        gap: 15px;
    }

    .product-page .author-avatar {
        width: 75px;
        height: 75px;
        flex-basis: 75px;
        font-size: 22px;
    }

    .product-page .author-name {
        font-size: 16px;
    }

    .product-page .author-role,
    .product-page .overview-copy {
        font-size: 15px;
    }

    .product-page .publish-meta {
        font-size: 12px;
        white-space: normal;
    }

    .product-page .quick-nav-title {
        font-size: 22px;
    }

    .product-page .quick-nav-list a {
        font-size: 14px;
    }
}


/* =========================================================
   UPDATED PRODUCT TABS — ALL SECTIONS VISIBLE
   Clicking a tab scrolls to that section instead of hiding it.
========================================================= */
.product-page .product-tabs{
    width:100%;
    margin-top:52px;
    background:#fff;
    border:1px solid #e2e5e8;
}

.product-page .tab-buttons{
    position:sticky;
    top:0;
    z-index:100;
    width:100%;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    background:#fff;
    border-bottom:1px solid #e1e5e8;
    box-shadow:0 2px 8px rgba(0,0,0,.04);
}

.product-page .tab-button{
    min-height:80px;
    padding:18px 12px;
    border:0;
    border-right:1px solid #e1e5e8;
    background:#fff;
    color:#234a78;
    font-family:inherit;
    font-size:19px;
    font-weight:400;
    cursor:pointer;
    position:relative;
}

.product-page .tab-button:last-child{border-right:0}
.product-page .tab-button:hover{color:#045cb4}
.product-page .tab-button.active{color:#045cb4;font-weight:500}
.product-page .tab-button.active::before{
    content:"";
    position:absolute;
    left:0;right:0;top:0;height:3px;
    background:#045cb4;
}

.product-page .tab-panels{
    min-height:0;
    padding:0;
}

.product-page .tab-panel{
    display:block !important;
    width:100%;
    min-height:0;
    padding:0;
    margin:0;
    color:#526d8c;
    font-size:17px;
    line-height:1.6;
    scroll-margin-top:90px;
    border-bottom:1px solid #e4e7ea;
}

.product-page .tab-panel:last-child{border-bottom:0}
.product-page .tab-panel > h3{
    margin:0;
    color:#213f64;
    font-size:28px;
}

.product-page .tab-panel > p{margin:0 0 12px}

.product-page #tab-reviews .review-section{
    padding:42px 58px 80px;
}

.product-page .faq-section{
    padding:70px 42px 80px;
    color:#29405f;
}

.product-page .faq-section h2{
    margin:0 0 30px;
    padding-bottom:22px;
    border-bottom:4px solid #e9ebed;
    color:#294368;
    font-size:40px;
    line-height:1.2;
}

.product-page .faq-categories{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-bottom:1px solid #e2e6e9;
    margin-bottom:48px;
}

.product-page .faq-category{
    min-height:85px;
    border:0;
    border-bottom:3px solid transparent;
    background:#fff;
    color:#29405f;
    font:inherit;
    font-size:21px;
    cursor:pointer;
    padding:15px 12px;
}

.product-page .faq-category span{margin-left:7px}
.product-page .faq-category.active{
    color:#045cb4;
    border-bottom-color:#045cb4;
}

.product-page .faq-group{display:none}
.product-page .faq-group.active{display:block}

.product-page .faq-item{
    margin-bottom:26px;
    border:1px solid #e2e5e8;
    border-radius:7px;
    overflow:hidden;
    background:#f7f8f9;
}

.product-page .faq-item button{
    width:100%;
    min-height:94px;
    padding:22px 28px;
    border:0;
    background:#f7f8f9;
    color:#23476f;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    text-align:left;
    font:inherit;
    font-size:21px;
    font-weight:700;
    cursor:pointer;
}

.product-page .faq-item button b{
    font-size:30px;
    line-height:1;
    font-weight:400;
    transition:transform .2s ease;
}

.product-page .faq-item.open button b{transform:rotate(180deg)}
.product-page .faq-answer{
    display:none;
    padding:0 28px 25px;
    color:#5b708a;
    background:#fff;
    font-size:17px;
    line-height:1.65;
}
.product-page .faq-item.open .faq-answer{display:block}

.product-page .apps-section{
    padding:70px 48px 85px;
    color:#29405f;
}

.product-page .apps-section > h2{
    margin:0 0 40px;
    color:#294368;
    font-size:40px;
    line-height:1.2;
    padding-bottom:22px;
    border-bottom:4px solid #e9ebed;
}

.product-page .app-feature,
.product-page .accessory-feature{
    display:grid;
    grid-template-columns:540px minmax(0,1fr);
    gap:48px;
    align-items:start;
    margin-bottom:70px;
}

.product-page .app-image-card,
.product-page .accessory-image-card{
    min-height:430px;
    border:1px solid #d9dfe4;
    border-radius:7px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    overflow:hidden;
    background:#fff;
    padding:30px;
}

.product-page .app-image-card img{
    width:260px;
    height:260px;
    object-fit:contain;
}

.product-page .accessory-image-card{
    flex-direction:column;
    min-height:540px;
}
.product-page .accessory-image-card img{
    width:85%;
    height:390px;
    object-fit:contain;
}
.product-page .accessory-image-card > small{
    color:#29405f;
    margin-top:8px;
}

.product-page .app-rating-badge{
    position:absolute;
    left:34px;
    top:0;
    width:84px;
    height:120px;
    padding-top:14px;
    background:#045cb4;
    color:#fff;
    text-align:center;
    clip-path:polygon(0 0,100% 0,100% 75%,50% 100%,0 75%);
    z-index:2;
}
.product-page .app-rating-badge small{
    display:block;
    font-size:12px;
    font-weight:700;
}
.product-page .app-rating-badge strong{
    display:block;
    margin-top:5px;
    font-size:44px;
    line-height:1;
}

.product-page .app-copy h3,
.product-page .accessory-copy h3{
    margin:0 0 20px;
    color:#2d3e5c;
    font-size:36px;
    font-weight:400;
}
.product-page .app-ratings{
    display:grid;
    gap:13px;
    margin-bottom:32px;
    color:#777;
    font-size:20px;
}
.product-page .app-ratings span{
    color:#ffb000;
    letter-spacing:-2px;
}
.product-page .app-copy p,
.product-page .accessory-copy p{
    color:#526984;
    font-size:19px;
    line-height:1.7;
}
.product-page .app-copy .app-actions{
    display:flex;
    flex-wrap:wrap;
    gap:28px;
    margin-top:28px;
}
.product-page .outline-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:58px;
    padding:0 25px;
    border:3px solid #045cb4;
    border-radius:9px;
    color:#29405f;
    text-decoration:none;
    font-size:15px;
    font-weight:700;
    letter-spacing:1px;
}
.product-page .accessories-heading{
    margin:0 0 38px;
    color:#294368;
    font-size:34px;
    font-weight:400;
}
.product-page .accessory-copy .muted{color:#7d899a}

@media(max-width:1000px){
    .product-page .faq-categories{grid-template-columns:repeat(2,1fr)}
    .product-page .app-feature,
    .product-page .accessory-feature{grid-template-columns:1fr;gap:30px}
    .product-page .app-image-card{min-height:360px}
}

@media(max-width:700px){
    .product-page .tab-buttons{
        position:sticky;
        top:0;
        min-width:650px;
    }
    .product-page .product-tabs{overflow:visible}
    .product-page .tab-buttons-wrap{overflow-x:auto}
    .product-page .tab-button{min-height:68px;font-size:14px}
    .product-page .tab-panels{width:100%}

    .product-page #tab-reviews .review-section{
        padding:30px 18px 55px;
    }
    .product-page .faq-section,
    .product-page .apps-section{
        padding:42px 18px 55px;
    }
    .product-page .faq-section h2,
    .product-page .apps-section > h2{
        font-size:28px;
    }
    .product-page .faq-categories{grid-template-columns:1fr 1fr}
    .product-page .faq-category{font-size:14px;min-height:70px}
    .product-page .faq-item button{font-size:16px;min-height:72px;padding:18px}
    .product-page .faq-answer{padding:0 18px 20px;font-size:15px}
    .product-page .app-image-card{min-height:300px}
    .product-page .app-image-card img{width:200px;height:200px}
    .product-page .app-copy h3,
    .product-page .accessory-copy h3{font-size:28px}
    .product-page .app-copy p,
    .product-page .accessory-copy p{font-size:16px}
    .product-page .accessory-image-card{min-height:380px}
    .product-page .accessory-image-card img{height:270px}
}


/* =========================================================
   RELATED PRODUCTS + INTEREST SECTION
========================================================= */
.product-page .related-products-section{
    padding:55px 0 70px;
}
.product-page .related-products-section > h2,
.product-page .interest-section > h2{
    margin:0 0 32px;
    color:#2d3e5c;
    font-size:40px;
    line-height:1.2;
    font-weight:700;
}
.product-page .related-products-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}
.product-page .related-product-card{
    display:block;
    border:1px solid #d5dce3;
    border-radius:7px;
    overflow:hidden;
    background:#fff;
    color:inherit;
    text-decoration:none;
    text-align:center;
}
.product-page .related-product-image{
    height:420px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:25px;
    background:#fff;
}
.product-page .related-product-image img{
    width:100%;
    height:100%;
    object-fit:contain;
}
.product-page .related-product-card h3{
    margin:0;
    padding:0 18px 18px;
    color:#2d3e5c;
    font-size:23px;
    line-height:1.3;
}
.product-page .related-stars{
    padding-bottom:25px;
    color:#ef4056;
    font-size:25px;
    letter-spacing:-2px;
}
.product-page .interest-section{
    padding:20px 0 80px;
}
.product-page .interest-section > h2{
    padding-bottom:28px;
    border-bottom:2px solid #e7eaed;
}
.product-page .interest-grid{
    display:grid;
    grid-template-columns:minmax(0,2fr) minmax(360px,1fr);
    gap:45px;
}
.product-page .interest-main,
.product-page .interest-small{
    position:relative;
    display:block;
    overflow:hidden;
    border-radius:7px;
    background:#222;
    text-decoration:none;
}
.product-page .interest-main{
    min-height:620px;
}
.product-page .interest-small{
    min-height:300px;
}
.product-page .interest-side{
    display:grid;
    gap:45px;
}
.product-page .interest-main img,
.product-page .interest-small img{
    width:100%;
    height:100%;
    position:absolute;
    inset:0;
    object-fit:cover;
}
.product-page .interest-main::after,
.product-page .interest-small::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.88),rgba(0,0,0,.05) 65%);
}
.product-page .interest-overlay{
    position:absolute;
    left:45px;
    right:35px;
    bottom:32px;
    z-index:2;
    color:#fff;
}
.product-page .interest-overlay span{
    display:inline-block;
    margin-bottom:28px;
    padding:10px 17px;
    border-radius:25px;
    background:rgba(0,0,0,.55);
    font-size:15px;
}
.product-page .interest-overlay h3{
    margin:0 0 10px;
    color:#fff;
    font-size:34px;
    line-height:1.2;
}
.product-page .interest-overlay p{
    margin:0;
    color:#fff;
    font-size:19px;
}
.product-page .interest-small .interest-overlay{
    left:25px;
    right:25px;
    bottom:25px;
}
.product-page .interest-small .interest-overlay span{
    margin-bottom:12px;
}
.product-page .interest-small .interest-overlay h3{
    font-size:23px;
}
@media(max-width:1000px){
    .product-page .related-products-grid{grid-template-columns:1fr 1fr}
    .product-page .interest-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
    .product-page .related-products-section,
    .product-page .interest-section{padding:35px 0 50px}
    .product-page .related-products-section > h2,
    .product-page .interest-section > h2{font-size:29px}
    .product-page .related-products-grid{grid-template-columns:1fr}
    .product-page .related-product-image{height:300px}
    .product-page .interest-main{min-height:420px}
    .product-page .interest-small{min-height:250px}
    .product-page .interest-side{gap:25px}
    .product-page .interest-overlay{left:22px;right:20px;bottom:22px}
    .product-page .interest-overlay h3{font-size:25px}
    .product-page .interest-overlay p{font-size:16px}
}


/* Dummy image styling — replace placeholder URLs with real images later */
.product-page img{
    background:#e9edf2;
}





/* =========================================================
   DESKTOP / LAPTOP SIZE & SPACING TUNING
   Keeps the layout spacious without making it oversized.
   ========================================================= */

.product-page,
.product-page .product-page .container,
.product-page .page-container,
.product-page .section-container {
  width: min(100% - 48px, 1440px);
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

.product-page .product-grid {
  grid-template-columns: minmax(0, 1fr) minmax(620px, 52%);
  gap: 35px;
  align-items: start;
}

.product-page .product-main,
.product-page .product-info {
  min-width: 0;
}

.product-page h1 {
  font-size: clamp(38px, 3.15vw, 58px);
  line-height: 1.08;
  margin-bottom: 18px;
}

.product-page h2 {
  font-size: clamp(28px, 2.15vw, 40px);
  line-height: 1.15;
}

.product-page h3 {
  font-size: clamp(21px, 1.55vw, 29px);
  line-height: 1.25;
}

.product-page p,
.product-page li {
  font-size: clamp(16px, 1.08vw, 19px);
  line-height: 1.65;
}

.product-page img {
  max-width: 100%;
  height: auto;
}

.product-page .hero-image,
.product-page .product-image {
  max-height: 560px;
  object-fit: contain;
}

.product-page .section {
  padding-top: 58px;
  padding-bottom: 58px;
}

.product-page .section + .section {
  margin-top: 0;
}

.product-page .feature-grid,
.product-page .two-column,
.product-page .content-grid {
  gap: 42px;
}

.product-page .tabs {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.product-page .tabs-nav {
  min-height: 72px;
}

.product-page .tab-content {
  padding: 54px 56px;
}

.product-page .reviews-grid,
.product-page .faq-grid,
.product-page .accessories-grid {
  gap: 42px;
}

.product-page .card {
  border-radius: 12px;
}

.product-page .related-products {
  gap: 24px;
}

/* Laptop: reduce oversized typography and horizontal padding */
@media (max-width: 1440px) {
  .product-page .container,
  .product-page .page-container,
  .product-page .section-container {
    width: min(100% - 64px, 1320px);
  }

  .product-page .product-grid {
    grid-template-columns: minmax(0, 1fr) minmax(620px, 52%);
    gap: 32px;
  }

  .product-page .tab-content {
    padding: 48px 46px;
  }

  .product-page .section {
    padding-top: 52px;
    padding-bottom: 52px;
  }
}

/* Standard laptop */
@media (max-width: 1200px) {
  .product-page .container,
  .product-page .page-container,
  .product-page .section-container {
    width: calc(100% - 48px);
  }

  .product-page .product-grid {
    grid-template-columns: minmax(0, 1fr) minmax(620px, 52%);
    gap: 28px;
  }

  .product-page h1 {
    font-size: 44px;
  }

  .product-page h2 {
    font-size: 32px;
  }

  .product-page p,
  .product-page li {
    font-size: 17px;
    line-height: 1.6;
  }

  .product-page .tab-content {
    padding: 42px 38px;
  }

  .product-page .feature-grid,
  .product-page .two-column,
  .product-page .content-grid,
  .product-page .reviews-grid,
  .product-page .faq-grid,
  .product-page .accessories-grid {
    gap: 30px;
  }
}

/* Tablet */
@media (max-width: 900px) {
  .product-page .container,
  .product-page .page-container,
  .product-page .section-container {
    width: calc(100% - 32px);
  }

  .product-page .product-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .product-page .tab-content {
    padding: 36px 28px;
  }

  .product-page .section {
    padding-top: 44px;
    padding-bottom: 44px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  .product-page .container,
  .product-page .page-container,
  .product-page .section-container {
    width: calc(100% - 24px);
  }

  .product-page h1 {
    font-size: 32px;
  }

  .product-page h2 {
    font-size: 27px;
  }

  .product-page h3 {
    font-size: 21px;
  }

  .product-page p,
  .product-page li {
    font-size: 16px;
    line-height: 1.55;
  }

  .product-page .product-grid {
    gap: 24px;
  }

  .product-page .tab-content {
    padding: 30px 20px;
  }

  .product-page .section {
    padding-top: 36px;
    padding-bottom: 36px;
  }

  .product-page .feature-grid,
  .product-page .two-column,
  .product-page .content-grid,
  .product-page .reviews-grid,
  .product-page .faq-grid,
  .product-page .accessories-grid {
    gap: 24px;
  }
}




/* =====================================================
   REVIEWS TAB - SCOPED TO REVIEW PANEL ONLY
===================================================== */
#tab-reviews .review-section{padding:42px 58px 80px;color:#29405f;font-family:Arial,Helvetica,sans-serif;}
#tab-reviews .review-title{margin:0;font-size:42px;line-height:1.2;font-weight:700;color:#294368;}
#tab-reviews .review-divider{height:4px;background:#e9ebed;margin:18px 0 62px;}
#tab-reviews .review-heading{margin:0 0 20px;font-size:30px;font-weight:400;color:#294368;}
#tab-reviews .review-summary{display:grid;grid-template-columns:420px minmax(0,1fr);gap:76px;align-items:start;}
#tab-reviews .rating-card{border:1px solid #e1e5e8;border-radius:5px;padding:42px 38px;background:#fff;}
#tab-reviews .rating-card h4,#tab-reviews .customers-say h4{margin:0 0 14px;font-size:23px;font-weight:400;color:#173f6d;}
#tab-reviews .rating-main{display:flex;align-items:center;gap:12px;}
#tab-reviews .review-stars,#tab-reviews .single-stars{color:#ef4056;font-size:22px;letter-spacing:-2px;}
#tab-reviews .rating-main strong{font-size:17px;}
#tab-reviews .rating-note{font-size:12px;margin-top:3px;color:#536a84;}
#tab-reviews .rating-bars{margin-top:18px;}
#tab-reviews .rating-row{display:grid;grid-template-columns:55px 1fr 40px;align-items:center;gap:12px;margin:17px 0;font-size:15px;}
#tab-reviews .rating-row>span{color:#045cb4;font-weight:600;}
#tab-reviews .rating-row b{font-weight:400;text-align:right;}
#tab-reviews .progress{height:25px;background:#e9e9e9;border:1px solid #d8d8d8;border-radius:3px;overflow:hidden;}
#tab-reviews .progress i{display:block;height:100%;background:#ef4056;}
#tab-reviews .customers-say{padding-top:45px;}
#tab-reviews .customers-say p{max-width:1050px;margin:0;font-size:19px;line-height:1.65;color:#526987;}
#tab-reviews .select-title{margin-top:28px!important;}
#tab-reviews .review-links{line-height:2.7;font-size:18px;}
#tab-reviews .review-links a{color:#045cb4;text-decoration:none;}
#tab-reviews .review-links a:hover{text-decoration:underline;}
#tab-reviews .review-links span{color:#ddd;margin:0 12px;}
#tab-reviews .review-content{display:grid;grid-template-columns:420px minmax(0,1fr);gap:76px;margin-top:42px;}
#tab-reviews .review-filters h3,#tab-reviews .review-list>h3{margin:0 0 20px;font-size:30px;font-weight:400;color:#294368;}
#tab-reviews .filter-card,#tab-reviews .single-review{border:1px solid #e1e5e8;border-radius:5px;background:#fff;}
#tab-reviews .filter-card{padding:30px 20px;}
#tab-reviews .filter-card p{margin:0;font-size:16px;color:#526987;}
#tab-reviews .single-review{padding:38px 42px;margin-bottom:22px;}
#tab-reviews .single-review strong{font-size:17px;color:#293d59;}
#tab-reviews .single-review strong span{font-weight:400;}
#tab-reviews .review-model{margin-top:5px;color:#526987;font-size:16px;}
#tab-reviews .single-stars{margin-top:15px;}
@media(max-width:900px){
 #tab-reviews .review-section{padding:30px 20px 60px;}
 #tab-reviews .review-title{font-size:30px;}
 #tab-reviews .review-divider{margin-bottom:35px;}
 #tab-reviews .review-summary,#tab-reviews .review-content{grid-template-columns:1fr;gap:30px;}
 #tab-reviews .customers-say{padding-top:0;}
 #tab-reviews .rating-card{padding:28px 22px;}
 #tab-reviews .customers-say p{font-size:16px;}
 #tab-reviews .review-links{font-size:16px;}
 #tab-reviews .review-heading,#tab-reviews .review-filters h3,#tab-reviews .review-list>h3{font-size:25px;}
}
@media(max-width:520px){
 #tab-reviews .review-title{font-size:26px;}
 #tab-reviews .rating-row{grid-template-columns:48px 1fr 32px;gap:7px;font-size:13px;}
 #tab-reviews .review-links span{display:none;}
 #tab-reviews .review-links a{display:inline-block;margin-right:10px;}
 #tab-reviews .single-review{padding:25px 20px;}
}


/* =====================================================
   REVIEWS TAB - SCOPED TO REVIEW PANEL ONLY
===================================================== */
#tab-reviews .review-section{padding:42px 58px 80px;color:#29405f;font-family:Arial,Helvetica,sans-serif;}
#tab-reviews .review-title{margin:0;font-size:42px;line-height:1.2;font-weight:700;color:#294368;}
#tab-reviews .review-divider{height:4px;background:#e9ebed;margin:18px 0 62px;}
#tab-reviews .review-heading{margin:0 0 20px;font-size:30px;font-weight:400;color:#294368;}
#tab-reviews .review-summary{display:grid;grid-template-columns:420px minmax(0,1fr);gap:76px;align-items:start;}
#tab-reviews .rating-card{border:1px solid #e1e5e8;border-radius:5px;padding:42px 38px;background:#fff;}
#tab-reviews .rating-card h4,#tab-reviews .customers-say h4{margin:0 0 14px;font-size:23px;font-weight:400;color:#173f6d;}
#tab-reviews .rating-main{display:flex;align-items:center;gap:12px;}
#tab-reviews .review-stars,#tab-reviews .single-stars{color:#ef4056;font-size:22px;letter-spacing:-2px;}
#tab-reviews .rating-main strong{font-size:17px;}
#tab-reviews .rating-note{font-size:12px;margin-top:3px;color:#536a84;}
#tab-reviews .rating-bars{margin-top:18px;}
#tab-reviews .rating-row{display:grid;grid-template-columns:55px 1fr 40px;align-items:center;gap:12px;margin:17px 0;font-size:15px;}
#tab-reviews .rating-row>span{color:#045cb4;font-weight:600;}
#tab-reviews .rating-row b{font-weight:400;text-align:right;}
#tab-reviews .progress{height:25px;background:#e9e9e9;border:1px solid #d8d8d8;border-radius:3px;overflow:hidden;}
#tab-reviews .progress i{display:block;height:100%;background:#ef4056;}
#tab-reviews .customers-say{padding-top:45px;}
#tab-reviews .customers-say p{max-width:1050px;margin:0;font-size:19px;line-height:1.65;color:#526987;}
#tab-reviews .select-title{margin-top:28px!important;}
#tab-reviews .review-links{line-height:2.7;font-size:18px;}
#tab-reviews .review-links a{color:#045cb4;text-decoration:none;}
#tab-reviews .review-links a:hover{text-decoration:underline;}
#tab-reviews .review-links span{color:#ddd;margin:0 12px;}
#tab-reviews .review-content{display:grid;grid-template-columns:420px minmax(0,1fr);gap:76px;margin-top:42px;}
#tab-reviews .review-filters h3,#tab-reviews .review-list>h3{margin:0 0 20px;font-size:30px;font-weight:400;color:#294368;}
#tab-reviews .filter-card,#tab-reviews .single-review{border:1px solid #e1e5e8;border-radius:5px;background:#fff;}
#tab-reviews .filter-card{padding:30px 20px;}
#tab-reviews .filter-card p{margin:0;font-size:16px;color:#526987;}
#tab-reviews .single-review{padding:38px 42px;margin-bottom:22px;}
#tab-reviews .single-review strong{font-size:17px;color:#293d59;}
#tab-reviews .single-review strong span{font-weight:400;}
#tab-reviews .review-model{margin-top:5px;color:#526987;font-size:16px;}
#tab-reviews .single-stars{margin-top:15px;}
@media(max-width:900px){
 #tab-reviews .review-section{padding:30px 20px 60px;}
 #tab-reviews .review-title{font-size:30px;}
 #tab-reviews .review-divider{margin-bottom:35px;}
 #tab-reviews .review-summary,#tab-reviews .review-content{grid-template-columns:1fr;gap:30px;}
 #tab-reviews .customers-say{padding-top:0;}
 #tab-reviews .rating-card{padding:28px 22px;}
 #tab-reviews .customers-say p{font-size:16px;}
 #tab-reviews .review-links{font-size:16px;}
 #tab-reviews .review-heading,#tab-reviews .review-filters h3,#tab-reviews .review-list>h3{font-size:25px;}
}
@media(max-width:520px){
 #tab-reviews .review-title{font-size:26px;}
 #tab-reviews .rating-row{grid-template-columns:48px 1fr 32px;gap:7px;font-size:13px;}
 #tab-reviews .review-links span{display:none;}
 #tab-reviews .review-links a{display:inline-block;margin-right:10px;}
 #tab-reviews .single-review{padding:25px 20px;}
}


/* =========================================================
   v2.0.9 LAYOUT FIX
   The in-person care section must sit BELOW the product hero,
   not inside the 315px side-card column.
========================================================= */

.product-page .product-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 35px !important;
    align-items: start;
}

.product-page .product-visual {
    width: 100%;
    min-width: 0;
}

.product-page .side-cards {
    width: 100%;
    min-width: 0;
}

.product-page .care-section {
    width: 100%;
    max-width: 100%;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 64px;
    clear: both;
}

@media (max-width: 1050px) {
    .product-page .product-grid {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }

    .product-page .care-section {
        grid-template-columns: 1fr;
        gap: 35px;
    }
}

@media (max-width: 700px) {
    .product-page .care-section {
        grid-template-columns: 1fr;
        gap: 25px;
    }
}

/* v2.3.1: hero image + color image fix */
.product-page .product-grid {
    grid-template-columns: minmax(0, 0.92fr) minmax(620px, 1.08fr) !important;
    gap: 28px !important;
}

.product-page .product-visual {
    background: #eef4fa;
    border-radius: 18px;
    padding: 14px;
    gap: 16px;
}

.product-page .image-area {
    background: #ffffff;
    border: 1px solid #dbe5ef;
    border-radius: 16px;
    min-height: 635px;
    padding: 24px;
    box-shadow: 0 6px 20px rgba(15,35,73,.05);
}

.product-page .product-image {
    width: min(100%, 520px);
    max-width: 520px;
    height: 450px;
    background: transparent !important;
    object-fit: contain;
    object-position: center;
}

.product-page .color-title {
    color: #045cb4;
}

.product-page .color.active {
    outline-color: #045cb4;
}

@media (max-width: 1250px) {
    .product-page .product-grid {
        grid-template-columns: minmax(0, 0.9fr) minmax(570px, 1.1fr) !important;
    }
    .product-page .product-visual {
        grid-template-columns: minmax(0, 1fr) 260px;
    }
}

@media (max-width: 1050px) {
    .product-page .product-grid {
        grid-template-columns: 1fr !important;
    }
    .product-page .product-visual {
        grid-template-columns: minmax(0, 1fr) 320px;
    }
}

@media (max-width: 700px) {
    .product-page .product-visual {
        grid-template-columns: 1fr;
    }
    .product-page .image-area {
        min-height: 390px;
        padding: 18px;
    }
    .product-page .product-image {
        height: 300px;
        max-width: 380px;
    }
}

/* v2.1.2: intentionally hide related/recommendation sections without changing layout structure */
.product-page .related-products-section, .product-page .interest-section { display:none !important; }

/* =========================================================
   ARTICLE CONTENT — RICH EDITOR MEDIA
========================================================= */
.product-page .author-avatar-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 50%;
}

.product-page .overview-copy img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 28px auto;
    border-radius: 4px;
}

.product-page .overview-copy figure {
    margin: 28px 0;
}

.product-page .overview-copy figure img {
    margin: 0 auto 10px;
}

.product-page .overview-copy figcaption {
    text-align: center;
    color: #6b7890;
    font-size: 14px;
    line-height: 1.5;
}

.product-page .overview-copy h2,
.product-page .overview-copy h3,
.product-page .overview-copy h4 {
    color: #2d3e5c;
    line-height: 1.25;
    margin: 38px 0 18px;
}

.product-page .overview-copy h2 { font-size: 34px; }
.product-page .overview-copy h3 { font-size: 28px; }
.product-page .overview-copy h4 { font-size: 22px; }

.product-page .overview-copy ul,
.product-page .overview-copy ol {
    margin: 0 0 24px 24px;
    padding-left: 18px;
}

.product-page .overview-copy li {
    margin-bottom: 8px;
}

.product-page .overview-copy a {
    color: #045cb4;
}

@media (max-width: 520px) {
    .product-page .overview-copy h2 { font-size: 27px; }
    .product-page .overview-copy h3 { font-size: 23px; }
    .product-page .overview-copy h4 { font-size: 19px; }
}

/* esa-normal-faq-v226 */
.esa-normal-faq-v226{width:100%;margin:0 auto}
.esa-normal-faq-v226 .faq-item{margin:0 0 14px;border:1px solid #dfe5eb;border-radius:8px;overflow:hidden;background:#fff}
.esa-normal-faq-v226 .faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;border:0;background:#f6f8fa;color:#0F2349;font:600 18px/1.4 inherit;text-align:left;cursor:pointer}
.esa-normal-faq-v226 .faq-answer{display:none;padding:20px 24px;color:#334155;font-size:16px;line-height:1.65;background:#fff}
.esa-normal-faq-v226 .faq-item.open .faq-answer{display:block}
.esa-normal-faq-v226 .faq-arrow{font-size:22px;transition:transform .2s ease}
.esa-normal-faq-v226 .faq-item.open .faq-arrow{transform:rotate(180deg)}


/* ESA v2.2.8 - Ear Solutions brand palette override */
:root{
  --esa-primary:#045cb4;
  --esa-primary-dark:#0F2349;
  --esa-accent:#045cb4;
  --esa-text:#0F2349;
}


/* v2.3.8: single combined image box (image + side cards inside ONE gray box) */
.product-page .product-visual {
    background: #f1f1f1;
    border-radius: 18px;
    padding: 18px;
    gap: 16px;
    min-height: 0;
    align-items: stretch;
}

.product-page .image-area {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    min-height: 0;
}

.product-page .product-image {
    width: 100%;
    max-width: 100%;
    height: 400px;
}

.product-page .info-card {
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
}

@media (max-width: 1050px) {
    .product-page .product-image {
        max-width: 380px;
        height: 300px;
    }
}

/* v2.3.8: slightly narrower right box so the product title stays on one line */
@media (min-width: 1051px) {
    .product-page .product-grid {
        grid-template-columns: minmax(0, 1.18fr) minmax(560px, 0.82fr) !important;
    }
    .product-page .product-visual {
        grid-template-columns: minmax(0, 1fr) 280px;
    }
}


/* =========================================================
   v2.3.8: wider sections, tighter row gaps, smaller headings,
   sticky Quick Navigation (no empty gap on the right)
   Prefixed with #es-product-page so it wins over the inline
   <style> block that the template prints after this file.
========================================================= */

/* ---- wider page (all sections) ---- */
#es-product-page.product-page {
    width: min(100% - 32px, 1840px);
    max-width: 1840px;
    padding-left: 16px;
    padding-right: 16px;
}

/* ---- FAQ spacing (all screens) ---- */
#es-product-page .faq-item {
    margin-top: 12px;
    margin-bottom: 0;
}
#es-product-page .faq-item button {
    min-height: 62px;
    padding: 14px 22px;
    font-size: 18px;
}
#es-product-page .faq-answer {
    padding: 12px 22px 16px;
    font-size: 16px;
    line-height: 1.6;
}
#es-product-page .faq-categories { margin-bottom: 14px; }

@media (min-width: 901px) {

    /* section padding: less side space = wider content */
    #es-product-page .overview-article { padding: 34px 28px 44px; gap: 40px; }
    #es-product-page #tab-reviews .review-section { padding: 30px 28px 48px; }
    #es-product-page .faq-section { padding: 30px 28px 44px; }
    #es-product-page .apps-section { padding: 30px 28px 44px; }

    /* ---- Overview ---- */
    #es-product-page .overview-title { font-size: 30px; line-height: 1.3; margin: 0 0 20px; letter-spacing: -0.4px; }
    #es-product-page .author-meta { margin-bottom: 24px; gap: 18px; }
    #es-product-page .author-avatar { width: 72px; height: 72px; flex-basis: 72px; font-size: 22px; }
    #es-product-page .author-left { gap: 16px; }
    #es-product-page .author-name { margin-bottom: 6px; font-size: 17px; }
    #es-product-page .author-role { font-size: 15px; }
    #es-product-page .publish-meta { line-height: 1.8; font-size: 13px; }
    #es-product-page .overview-copy { font-size: 16px; line-height: 1.65; }
    #es-product-page .overview-copy p { margin: 0 0 12px; }
    #es-product-page .overview-copy h2,
    #es-product-page .overview-copy h3,
    #es-product-page .overview-copy h4 { margin: 24px 0 10px; line-height: 1.25; }
    #es-product-page .overview-copy h2 { font-size: 26px; }
    #es-product-page .overview-copy h3 { font-size: 22px; }
    #es-product-page .overview-copy h4 { font-size: 18px; }
    #es-product-page .overview-copy ul,
    #es-product-page .overview-copy ol { margin: 0 0 14px 20px; }
    #es-product-page .overview-copy li { margin-bottom: 4px; }
    #es-product-page .overview-copy img { margin: 16px auto; }
    #es-product-page .overview-copy figure { margin: 16px 0; }

    /* ---- Reviews ---- */
    #es-product-page #tab-reviews .review-title { font-size: 30px; }
    #es-product-page #tab-reviews .review-divider { margin: 12px 0 26px; height: 3px; }
    #es-product-page #tab-reviews .review-heading,
    #es-product-page #tab-reviews .review-filters h3,
    #es-product-page #tab-reviews .review-list > h3 { font-size: 22px; margin-bottom: 12px; }
    #es-product-page #tab-reviews .rating-card h4,
    #es-product-page #tab-reviews .customers-say h4 { font-size: 18px; margin-bottom: 8px; }
    #es-product-page #tab-reviews .review-summary,
    #es-product-page #tab-reviews .review-content { grid-template-columns: 340px minmax(0, 1fr); gap: 36px; }
    #es-product-page #tab-reviews .review-content { margin-top: 24px; }
    #es-product-page #tab-reviews .rating-card { padding: 24px 26px; }
    #es-product-page #tab-reviews .rating-bars { margin-top: 10px; }
    #es-product-page #tab-reviews .rating-row { margin: 9px 0; }
    #es-product-page #tab-reviews .progress { height: 20px; }
    #es-product-page #tab-reviews .customers-say { padding-top: 20px; }
    #es-product-page #tab-reviews .customers-say p { font-size: 16px; line-height: 1.55; }
    #es-product-page #tab-reviews .select-title { margin-top: 16px !important; }
    #es-product-page #tab-reviews .review-links { font-size: 16px; line-height: 2.1; }
    #es-product-page #tab-reviews .filter-card { padding: 18px 20px; }
    #es-product-page #tab-reviews .single-review { padding: 22px 26px; margin-bottom: 12px; }

    /* ---- Common Questions ---- */
    #es-product-page .faq-section h2 { font-size: 30px; margin: 0 0 16px; padding-bottom: 12px; border-bottom-width: 3px; }
    #es-product-page .faq-category { min-height: 60px; padding: 10px 12px; font-size: 18px; }

    /* ---- Apps & Accessories ---- */
    #es-product-page .apps-section > h2 { font-size: 30px; margin: 0 0 20px; padding-bottom: 12px; border-bottom-width: 3px; }
    #es-product-page .app-feature,
    #es-product-page .accessory-feature { grid-template-columns: 420px minmax(0, 1fr); gap: 32px; margin-bottom: 32px; }
    #es-product-page .app-image-card { min-height: 320px; padding: 20px; }
    #es-product-page .accessory-image-card { min-height: 400px; padding: 20px; }
    #es-product-page .accessory-image-card img { height: 300px; }
    #es-product-page .app-copy h3,
    #es-product-page .accessory-copy h3 { font-size: 26px; margin-bottom: 12px; }
    #es-product-page .app-ratings { gap: 8px; margin-bottom: 16px; font-size: 18px; }
    #es-product-page .app-copy p,
    #es-product-page .accessory-copy p { font-size: 16px; line-height: 1.6; }
    #es-product-page .app-copy .app-actions { margin-top: 16px; gap: 16px; }
    #es-product-page .accessories-heading { font-size: 26px; margin-bottom: 20px; }
}

/* ---- Quick Navigation: narrower, tighter, follows the scroll ---- */
@media (min-width: 1201px) {
    #es-product-page .overview-article { grid-template-columns: minmax(0, 1fr) 320px; }
    #es-product-page .quick-nav {
        position: sticky;
        top: 100px;
        max-height: calc(100vh - 120px);
        overflow-y: auto;
        padding: 24px 24px 20px;
    }
    #es-product-page .quick-nav-title { font-size: 19px; margin-bottom: 12px; padding-bottom: 12px; }
    #es-product-page .quick-nav-list { margin-bottom: 18px; }
    #es-product-page .quick-nav-list li { margin-bottom: 9px; }
    #es-product-page .quick-nav-list a { font-size: 15px; line-height: 1.35; }
    #es-product-page .overview-cta { min-height: 68px; padding: 12px 16px; }
}

/* v2.3.8: product image at the top, color name + swatches directly below it */
#es-product-page .image-area {
    justify-content: flex-start;
    align-self: start;
    padding: 6px 0 0;
}
#es-product-page .image-area .product-image {
    margin: 0 auto 6px;
}
#es-product-page .image-area .color-title {
    margin-top: 0;
    margin-bottom: 12px;
}

/* v2.3.8: review topic tags were inheriting the pale separator color (#ddd) */
#es-product-page #tab-reviews .review-links .review-tag {
    color: #045cb4;
    margin: 0 18px 0 0;
    display: inline-block;
}


/* =========================================================
   v2.3.8: bottom info bar (hours / phone / location)
========================================================= */
#es-product-page .info-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 24px 40px;
    margin-top: 40px;
    padding: 24px 40px;
    background: #fafafa;
    border-radius: 8px;
}
#es-product-page .info-bar-item {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}
#es-product-page .info-bar-icon {
    flex: 0 0 64px;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #045cb4;
    color: #fff;
}
#es-product-page .info-bar-icon svg { width: 32px; height: 32px; display: block; }
#es-product-page .info-bar-text { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
#es-product-page .info-bar-text strong { color: #2b3d5b; font-size: 19px; line-height: 1.2; font-weight: 600; }
#es-product-page .info-bar-text span,
#es-product-page .info-bar-text a { color: #5b708a; font-size: 18px; line-height: 1.3; text-decoration: none; }
#es-product-page .info-bar-text a:hover { color: #045cb4; text-decoration: underline; }

@media (max-width: 900px) {
    #es-product-page .info-bar { flex-direction: column; align-items: flex-start; padding: 20px; gap: 18px; }
}


/* =========================================================
   v2.3.8: mobile tabs (like ZipHearing) - product name bar on top,
   4 equal tabs that fit the screen, short labels (FAQ / Apps)
========================================================= */
#es-product-page .tab-mobile-title { display: none; }
#es-product-page .tab-label-short { display: none; }

@media (max-width: 700px) {
    #es-product-page .product-tabs { overflow: visible; }

    #es-product-page .tab-mobile-title {
        display: block;
        position: sticky;
        top: 0;
        z-index: 101;
        height: 48px;
        padding: 0 14px;
        background: #eceef0;
        color: #2b3d5b;
        font-size: 16px;
        font-weight: 600;
        line-height: 48px;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    #es-product-page .tab-buttons {
        top: 48px;
        min-width: 0;
        width: 100%;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    #es-product-page .tab-button {
        min-height: 56px;
        padding: 0 4px;
        font-size: 15px;
        line-height: 1.2;
    }
    #es-product-page .tab-button.active { color: #045cb4; font-weight: 700; }

    #es-product-page .tab-label-full { display: none; }
    #es-product-page .tab-label-short { display: inline; }

    #es-product-page .tab-panels { min-width: 0; width: 100%; padding: 0; }
    #es-product-page .tab-panel { scroll-margin-top: 112px; }
}


/* v2.3.8: benefits strip icons uploaded from the backend (images) */
#es-product-page .benefit-icon img {
    width: 78px;
    height: 78px;
    display: block;
    object-fit: contain;
    background: transparent !important;
}
#es-product-page .benefit-item.local-care .benefit-icon img {
    width: 105px;
    height: 105px;
}
@media (max-width: 700px) {
    #es-product-page .benefit-icon img { width: 58px; height: 58px; }
    #es-product-page .benefit-item.local-care .benefit-icon img { width: 70px; height: 70px; }
}


/* =========================================================
   v2.3.8: "Find a provider near me" popup
   (global classes: the popup is moved to <body> by the JS)
========================================================= */
html.esa-quote-open { overflow: hidden; }

.esa-quote-modal {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    font-family: inherit;
}
.esa-quote-modal[hidden] { display: none !important; }

.esa-quote-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .6);
}

.esa-quote-dialog {
    position: relative;
    width: 100%;
    max-width: 640px;
    max-height: calc(100vh - 36px);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .35);
}
.esa-quote-dialog.has-image {
    max-width: 1180px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.esa-quote-close {
    position: absolute;
    top: 10px;
    right: 14px;
    z-index: 3;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    color: #1a1f36;
    font-size: 28px;
    line-height: 40px;
    text-align: center;
    cursor: pointer;
    padding: 0;
}
.esa-quote-close:hover { background: #fff; color: #045cb4; }

.esa-quote-left {
    padding: 54px 52px 44px;
    overflow-y: auto;
    color: #1a1f36;
}

.esa-quote-right { position: relative; min-height: 360px; background: #eef2f7; }
.esa-quote-right img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.esa-quote-modal .fhead h3 {
    margin: 0 0 20px;
    color: #1a1f36;
    font-size: 30px;
    line-height: 1.25;
    font-weight: 700;
}
.esa-quote-modal .fhead p {
    margin: 0 0 28px;
    color: #6b7280;
    font-size: 17px;
    line-height: 1.75;
}

.esa-quote-modal .esa-quote-label {
    display: block;
    margin: 0 0 8px;
    color: #374151;
    font-size: 14px;
    font-weight: 600;
}
.esa-quote-modal input[type="text"],
.esa-quote-modal input[type="tel"],
.esa-quote-modal input[type="email"] {
    display: block;
    width: 100%;
    height: 58px;
    margin: 0 0 18px;
    padding: 0 22px;
    border: 1px solid #c9ced6;
    border-radius: 8px;
    background: #fff;
    color: #1a1f36;
    font-size: 18px;
    box-sizing: border-box;
    box-shadow: none;
}
.esa-quote-modal input:focus {
    outline: none;
    border-color: #045cb4;
    box-shadow: 0 0 0 3px rgba(4, 92, 180, .15);
}
.esa-quote-modal .pill {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 58px;
    margin: 0;
    padding: 0 20px;
    border: 0;
    border-radius: 8px;
    background: #045cb4;
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
    cursor: pointer;
}
.esa-quote-modal .pill:hover { background: #034a90; }

.esa-quote-modal .safe {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 22px;
    color: #8a93a2;
    font-size: 15px;
}
.esa-quote-modal .esa-lock { width: 18px; height: 18px; flex: 0 0 18px; }

@media (max-width: 800px) {
    .esa-quote-dialog.has-image { grid-template-columns: minmax(0, 1fr); }
    .esa-quote-right { display: none; }
    .esa-quote-left { padding: 44px 24px 30px; }
    .esa-quote-modal .fhead h3 { font-size: 24px; }
    .esa-quote-modal .fhead p { font-size: 15px; line-height: 1.65; margin-bottom: 22px; }
}


/* v2.3.8: popup sized/typeset like the reference (wide, full-bleed image) */
.esa-quote-modal { padding: 10px; }
.esa-quote-dialog { max-width: 700px; border-radius: 14px; }
.esa-quote-dialog.has-image {
    max-width: min(1410px, 100%);
    height: min(790px, calc(100vh - 20px));
    max-height: none;
}
.esa-quote-dialog.has-image .esa-quote-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 40px 56px;
}
.esa-quote-right { min-height: 0; }
.esa-quote-modal .fhead h3 { font-size: 34px; line-height: 1.3; margin-bottom: 22px; }
.esa-quote-modal .fhead p { font-size: 21px; line-height: 1.85; font-weight: 300; color: #6b6f76; margin-bottom: 36px; }
.esa-quote-modal .esa-quote-label { font-size: 15px; }
.esa-quote-modal input[type="text"],
.esa-quote-modal input[type="tel"],
.esa-quote-modal input[type="email"] { height: 66px; font-size: 21px; padding: 0 22px; margin-bottom: 20px; border-color: #c4c8ce; }
.esa-quote-modal .pill { height: 66px; font-size: 20px; }
.esa-quote-modal .safe { font-size: 17px; margin-top: 24px; }
.esa-quote-modal .esa-lock { width: 20px; height: 20px; flex-basis: 20px; }

@media (max-width: 1100px) {
    .esa-quote-modal .fhead h3 { font-size: 28px; }
    .esa-quote-modal .fhead p { font-size: 17px; line-height: 1.7; }
    .esa-quote-modal input[type="text"], .esa-quote-modal input[type="tel"], .esa-quote-modal input[type="email"], .esa-quote-modal .pill { height: 58px; font-size: 18px; }
}
@media (max-width: 800px) {
    .esa-quote-dialog.has-image { height: auto; max-height: calc(100vh - 20px); }
    .esa-quote-dialog.has-image .esa-quote-left { padding: 44px 24px 30px; display: block; }
    .esa-quote-modal .fhead h3 { font-size: 24px; }
    .esa-quote-modal .fhead p { font-size: 15px; margin-bottom: 22px; }
    .esa-quote-modal .safe { font-size: 14px; }
}

/* v2.3.10 – smaller popup + ZipHearing-style phone card */
.esa-quote-avatar{display:none}
@media(min-width:801px){
 .esa-quote-dialog.has-image{max-width:min(1020px,100%);height:auto;max-height:calc(100vh - 40px)}
 .esa-quote-dialog.has-image .esa-quote-left{padding:40px 44px}
 .esa-quote-right{min-height:480px}
 .esa-quote-modal .fhead h3{font-size:26px;margin-bottom:14px}
 .esa-quote-modal .fhead p{font-size:16px;line-height:1.6;margin-bottom:22px}
 .esa-quote-modal input[type=text],.esa-quote-modal input[type=tel],.esa-quote-modal input[type=email]{height:52px;font-size:16px}
 .esa-quote-modal .pill{height:52px;font-size:16px}
 .esa-quote-modal .safe{font-size:14px}
}
@media(max-width:800px){
 .esa-quote-modal{padding:16px}
 .esa-quote-dialog,.esa-quote-dialog.has-image{max-width:420px;height:auto;max-height:calc(100vh - 32px);border-radius:22px;grid-template-columns:1fr}
 .esa-quote-right{display:none!important}
 .esa-quote-left,.esa-quote-dialog.has-image .esa-quote-left{padding:26px 22px 24px;text-align:center;display:block}
 .esa-quote-avatar{display:block;width:104px;height:104px;border-radius:50%;object-fit:cover;margin:0 auto 14px}
 .esa-quote-close{top:12px;right:12px;width:34px;height:34px;background:#e3e3e3;color:#555;font-size:22px;line-height:1;box-shadow:none}
 .esa-quote-modal .fhead h3{font-size:22px;line-height:1.3;margin-bottom:10px;text-align:center}
 .esa-quote-modal .fhead p{font-size:15px;line-height:1.55;font-weight:300;margin-bottom:18px;text-align:center}
 .esa-quote-modal input[type=text],.esa-quote-modal input[type=tel],.esa-quote-modal input[type=email]{height:50px;font-size:16px;border-radius:12px;text-align:left}
 .esa-quote-modal .pill{height:50px;font-size:16px;width:100%}
 .esa-quote-modal .safe{font-size:13px;text-align:center;justify-content:center}
}

/* v2.3.11 – phone: never cut off, scroll inside card, fit short screens */
@media(max-width:800px){
 .esa-quote-modal{padding:10px;align-items:center}
 .esa-quote-dialog,.esa-quote-dialog.has-image{display:flex;flex-direction:column;max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px);overflow:hidden}
 .esa-quote-left,.esa-quote-dialog.has-image .esa-quote-left{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:20px 20px 22px}
 .esa-quote-avatar{width:84px;height:84px;margin-bottom:10px}
 .esa-quote-modal .fhead h3{font-size:20px;margin-bottom:8px}
 .esa-quote-modal .fhead p{font-size:14px;line-height:1.5;margin-bottom:12px}
 .esa-quote-modal input[type=text],.esa-quote-modal input[type=tel],.esa-quote-modal input[type=email]{height:46px}
 .esa-quote-modal .pill{height:46px}
}
@media(max-width:800px) and (max-height:620px){
 .esa-quote-avatar{width:64px;height:64px}
 .esa-quote-modal .fhead p{font-size:13px}
}

/* v2.3.12 – no labels in popup form; inputs spaced */
.esa-quote-modal .esa-quote-label{display:none!important}
.esa-quote-modal #esaQuoteDetailsForm input{margin-bottom:12px}

#es-product-page .rating-row{cursor:pointer}
#es-product-page .rating-row:hover .rating-number{text-decoration:underline}

/* v2.3.15 – review filters + sticky filter column */
#es-product-page #tab-reviews .review-content{align-items:start}
#es-product-page #tab-reviews .review-filters{position:sticky;top:96px;align-self:start;max-height:calc(100vh - 116px);overflow-y:auto}
#es-product-page #tab-reviews .filter-card{padding:22px 20px}
#es-product-page #tab-reviews .filter-count{margin:0 0 14px;font-size:16px;color:#526987}
#es-product-page #tab-reviews .filter-group{border-top:1px solid #e1e5e8;padding:14px 0 6px}
#es-product-page #tab-reviews .filter-group h5{margin:0 0 8px;font-size:16px;font-weight:700;color:#173f6d}
#es-product-page #tab-reviews .filter-opt{display:flex;align-items:center;gap:10px;padding:5px 0;cursor:pointer;font-size:15px;color:#294368}
#es-product-page #tab-reviews .filter-opt input{width:17px;height:17px;accent-color:#045cb4;margin:0}
#es-product-page #tab-reviews .filter-opt em{margin-left:auto;font-style:normal;color:#7b8aa0;font-size:14px}
#es-product-page #tab-reviews .fo-stars{color:#ef4056;letter-spacing:1px}
#es-product-page #tab-reviews .fo-stars i{font-style:normal;color:#d5dae1}
#es-product-page #tab-reviews .filter-clear{margin-top:12px;background:none;border:1px solid #045cb4;color:#045cb4;border-radius:999px;padding:8px 18px;font-weight:700;cursor:pointer}
#es-product-page #tab-reviews .review-tag[data-topic]{cursor:pointer}
#es-product-page #tab-reviews .review-tag.on{background:#045cb4;color:#fff;border-color:#045cb4}
#es-product-page #tab-reviews .review-empty{color:#526987;padding:20px 0}
@media(max-width:900px){#es-product-page #tab-reviews .review-filters{position:static;max-height:none;overflow:visible}}

/* v2.3.16 – brand typography colours: headings #05559c, body text #3B414D */
#es-product-page h1,#es-product-page h2,#es-product-page h3,#es-product-page h4,#es-product-page h5,#es-product-page h6,
.esa-quote-modal h1,.esa-quote-modal h2,.esa-quote-modal h3,.esa-quote-modal h4,
#es-product-page .review-title,#es-product-page .review-heading,#es-product-page .tab-mobile-title,
#es-product-page .single-review-title,#es-product-page .faq-item button,#es-product-page .faq-question{color:#05559c!important}
#es-product-page p,#es-product-page li,#es-product-page dd,#es-product-page td,#es-product-page .rating-note,
#es-product-page .filter-count,#es-product-page .filter-opt,#es-product-page .review-model,
#es-product-page .faq-answer,#es-product-page .faq-item div,
.esa-quote-modal p{color:#3B414D!important}

/* v2.3.17 – quick nav active item */
#es-product-page .quick-nav-list a.active{color:#05559c;font-weight:700}
#es-product-page .overview-copy h2,#es-product-page .overview-copy h3{scroll-margin-top:110px}

/* v2.3.20 – CTA arrow centred, breadcrumb links */
#es-product-page .main-cta{display:flex;align-items:center;justify-content:center;gap:8px}
#es-product-page .main-cta .cta-arrow{display:inline-flex;align-items:center;margin:0;line-height:1;font-size:0;vertical-align:baseline}
#es-product-page .breadcrumb a{color:inherit;text-decoration:none}
#es-product-page .breadcrumb a:hover{text-decoration:underline}

/* v2.3.21 – JS-driven sticky tab bar */
#es-product-page .esa-tabbar-ph{position:relative}
#es-product-page .esa-tabbar{position:relative;z-index:100;background:#fff}
#es-product-page .esa-tabbar.is-fixed{position:fixed;z-index:1000;box-shadow:0 2px 8px rgba(15,35,73,.08)}
#es-product-page .esa-tabbar .tab-buttons,#es-product-page .esa-tabbar .tab-mobile-title{position:relative!important;top:auto!important}