* {
  margin: 0;
  padding: 0;
}

 .product-header {
        --badge-size: 8rem;
        --banner-height: 250px;

        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        position: relative;
        font-family: sans-serif;
        container-type: inline-size;
    }

    .product-header__banner {
        width: 100%;
        height: var(--banner-height);
        position: relative;
        display: flex;
        justify-content: center;
    }

    .product-header__banner figure {
        width: 100%;
        height: 100%;
        margin: 0;
    }

    .product-header__banner-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .product-header__badge {
        position: absolute;
        bottom: calc(var(--badge-size) / -2);
        width: var(--badge-size);
        height: var(--badge-size);
        background-color: #ff9900;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        z-index: 10;
    }

    .product-header__badge-img {
        max-width: 90px;
        max-height: 90px;
        object-fit: contain;
    }

    .product-header__body {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: calc(var(--badge-size) / 2 + 1.1rem) 0.3rem 2.5rem;
        text-align: center;
    }

    .product-header__brand {
        color: #ff9900;
        font-size: 0.75rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        margin-bottom: 0.5rem;
    }

    .product-header__title {
        font-size: clamp(1.4rem, 4vw, 2.4rem);
        line-height: clamp(1.6rem, 4vw, 3.1rem);
        font-weight: 600;
        max-width: 50rem;
        text-wrap: pretty;
    }

    .product-header__subtitle {
        color: #8a8a8a;
        font-size: clamp(1rem, 2vw, 1.2rem);
        line-height: 120%;
        margin-top: 1rem;
        max-width: 52rem;
        text-wrap: pretty;
    }

    @media (max-width: 768px) {
        .product-header {
        --banner-height: 180px;
        }
    }

    @media (max-width: 470px) {
        .product-header__subtitle {
        text-align: justify;
        font-size: clamp(0.9rem, 2vw, 1.2rem);
        }
    }

/* Section-28 - Base do layout */
.section-28 {
                --s8-color-brand: #003da5;
                --s8-color-ink: #081844;
                --s8-color-muted: #5b6682;
                --s8-color-soft: #dfeaff;
                --s8-color-line: #dbe5f4;
                --s8-color-surface: #ffffff;

                width: 100%;
                position: relative;
                padding: 0 1rem 1.5rem;
                font-family: Roboto, Arial, sans-serif;
                color: var(--s8-color-ink);
                overflow-wrap: anywhere;
            }

            .section-28__title-accessible {
                width: 1px;
                height: 1px;
                position: absolute;
                overflow: hidden;
                margin: 0;
                padding: 0;
                clip-path: inset(50%);
                white-space: nowrap;
            }

            .section-28__inner {
                width: 100%;
                display: flex;
                flex-direction: column;
                align-items: start;
                gap: 1rem;
                padding: 1rem;
                overflow: hidden;
                border: 1px solid rgba(8, 24, 68, 0.08);
                border-radius: 1.5rem;
                background: var(--s8-color-surface);
                box-shadow: 0 1rem 2.5rem rgba(3, 33, 82, 0.1);
            }

            .section-28__tabs {
                width: 100%;
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                align-items: start;
                gap: 1rem;
                order: 1;
            }

            .section-28__option {
                min-width: 0;
                position: relative;
            }

            .section-28__control {
                position: absolute;
                width: 1px;
                height: 1px;
                opacity: 0;
                pointer-events: none;
            }

            .section-28__tab {
                width: 100%;
                min-height: 3.5rem;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 0.5rem;
                padding: 1rem;
                border: 1px solid var(--s8-color-line);
                border-radius: 999px;
                background: var(--s8-color-surface);
                color: var(--s8-color-brand);
                cursor: pointer;
                transition:
                    background-color 240ms ease,
                    border-color 240ms ease,
                    color 240ms ease,
                    transform 240ms ease;
            }

            .section-28__control:focus-visible+.section-28__tab {
                outline: 0.125rem solid var(--s8-color-brand);
                outline-offset: 0.25rem;
            }

            .section-28__tab-icon {
                width: 1.5rem;
                height: 1.5rem;
                flex: 0 0 1.5rem;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .section-28__tab-icon-svg {
                width: 1.5rem;
                height: 1.5rem;
                display: block;
            }

            .section-28__tab-text {
                min-width: 0;
                color: currentColor;
                font-size: clamp(0.75rem, 2.8vw, 0.9375rem);
                font-weight: 700;
                line-height: 1.3;
                text-align: center;
                overflow-wrap: anywhere;
            }

            .section-28__viewport {
                width: 100%;
                display: grid;
                align-items: start;
                overflow: hidden;
                border-radius: 1.5rem;
                background: var(--s8-color-surface);
            }

            .section-28__panel {
                width: 100%;
                min-width: 0;
                position: relative;
                grid-area: 1 / 1;
                display: flex;
                flex-direction: column;
                align-items: start;
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
                transform: translateX(1rem);
                transition:
                    opacity 320ms ease,
                    transform 320ms ease,
                    visibility 0s linear 320ms;
            }

            .section-28__figure {
                width: 100%;
                margin: 0;
                overflow: hidden;
                aspect-ratio: 36/18;
                border-radius: 1.5rem 1.5rem 0 0;
                background: var(--s8-color-soft);
            }

            .section-28__image {
                width: 100%;
                height: 100%;
                display: block;
                object-fit: cover;
            }

            /* MOBILE: caixa abaixo da imagem */

            .section-28__content {
                width: 100%;
                min-width: 0;
                display: flex;
                flex-direction: column;
                align-items: start;
                padding: 1.5rem;
                border: 1px solid var(--s8-color-line);
                border-top: 0;
                border-radius: 0 0 1.5rem 1.5rem;
                background: var(--s8-color-surface);
                overflow-wrap: anywhere;
            }

            .section-28__title {
                margin: 0;
                color: var(--s8-color-ink);
                font-size: clamp(1.25rem, 5vw, 1.75rem);
                font-weight: 500;
                line-height: 1.2;
                overflow-wrap: anywhere;
                text-wrap: balance;
            }

            .section-28__rule {
                width: 3rem;
                height: 0.125rem;
                margin: 1rem 0;
                border-radius: 999px;
                background: var(--s8-color-brand);
            }

            .section-28__copy {
                margin: 0;
                color: var(--s8-color-muted);
                font-size: clamp(0.875rem, 3.5vw, 1rem);
                font-weight: 400;
                line-height: 1.6;
                overflow-wrap: anywhere;
                text-wrap: pretty;
            }

            .section-28__dots {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 1rem;
            }

            .section-28__dot {
                width: 1rem;
                height: 1rem;
                border: 1px solid var(--s8-color-brand);
                border-radius: 50%;
                background: var(--s8-color-surface);
                transition:
                    background-color 240ms ease,
                    transform 240ms ease;
            }

            .section-28:has(.section-28__control--protection:checked) .section-28__tab--protection,
            .section-28:has(.section-28__control--care:checked) .section-28__tab--care,
            .section-28:has(.section-28__control--fragrance:checked) .section-28__tab--fragrance,
            .section-28:has(.section-28__control--application:checked) .section-28__tab--application {
                border-color: var(--s8-color-brand);
                background: var(--s8-color-brand);
                color: var(--s8-color-surface);
                transform: translateY(-0.5rem);
            }

            .section-28:has(.section-28__control--protection:checked) .section-28__panel--protection,
            .section-28:has(.section-28__control--care:checked) .section-28__panel--care,
            .section-28:has(.section-28__control--fragrance:checked) .section-28__panel--fragrance,
            .section-28:has(.section-28__control--application:checked) .section-28__panel--application {
                opacity: 1;
                visibility: visible;
                pointer-events: auto;
                transform: translateX(0);
                transition-delay: 0s;
                z-index: 1;
            }

            .section-28:has(.section-28__control--protection:checked) .section-28__dot--protection,
            .section-28:has(.section-28__control--care:checked) .section-28__dot--care,
            .section-28:has(.section-28__control--fragrance:checked) .section-28__dot--fragrance,
            .section-28:has(.section-28__control--application:checked) .section-28__dot--application {
                background: var(--s8-color-brand);
                transform: scale(1.25);
            }

            @media (min-width: 576px) {
                .section-28 {
                    padding: 0 1.5rem 1.5rem;
                }

                .section-28__inner {
                    padding: 1.5rem;
                }

                .section-28__content {
                    padding: 2rem;
                }

                .section-28__tab-text {
                    font-size: clamp(0.875rem, 2vw, 1rem);
                }
            }

            @media (min-width: 768px) {
                .section-28 {
                    padding: 0 2rem 1.5rem;
                }

                .section-28__inner {
                    gap: 1.5rem;
                }

                .section-28__panel {
                    display: block;
                }

                .section-28__figure {
                    border-radius: 1.5rem;
                    aspect-ratio: 36/18;
                }

                /* DESKTOP: caixa totalmente contida dentro da imagem */

                .section-28__content {
                    width: min(38%, 28rem);
                    position: absolute;
                    overflow: auto;
                    padding: 1.5rem;
                    border: 1px solid var(--s8-color-line);
                    border-radius: 1.5rem;
                    background: var(--s8-color-surface);
                    box-shadow: 0 1rem 2.5rem rgba(3, 33, 82, 0.16);
                }

                .section-28__title {
                    font-size: clamp(1.375rem, 2.5vw, 2rem);
                }

                .section-28__copy {
                    font-size: clamp(0.875rem, 1.5vw, 1rem);
                }

                /* POSICIONAMENTO INDEPENDENTE DE CADA CAIXA */

                .section-28__panel--protection .section-28__content {
                    top: 10%;
                    left: 5%;
                }

                .section-28__panel--care .section-28__content {
                    top: 18%;
                    left: 52%;
                }
            }

            @media (min-width: 992px) {
                .section-28 {
                    padding: 0 2.5rem 1.5rem;
                }

                .section-28__tabs {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                }

                .section-28__content {
                    width: min(36%, 28rem);
                    max-height: calc(100% - 4rem);
                    padding: 2rem;
                }
            }

            @media (min-width: 1200px) {
                .section-28 {
                    padding: 0 3rem 1.5rem;
                }

                .section-28__content {
                    width: min(34%, 28rem);
                    max-height: calc(100% - 6rem);
                }

            }

            @media (min-width: 1400px) {
                .section-28 {
                    padding: 0 3rem 1.5rem;
                }
            }

/* Aviso ilustrativo - Layout Lab */
.p__end {
  color: #8a8a8a;
  font-family: sans-serif;
  font-size: clamp(1rem, 2vw, 1.2rem);
  text-wrap: pretty;
  text-align: center;
  margin: 0;
  padding: 16px 0;
}

@media (prefers-contrast: more) {
  .p__end {
    color: #000;
  }
}

/* FAQ - Layout Lab */



.senko-section-flow {
  display: flex !important;
  flex-direction: column !important;
  gap: clamp(18px, 3vw, 34px) !important;
  row-gap: clamp(18px, 3vw, 34px) !important;
  width: 100%;
}
.senko-section-flow > * {
  min-width: 0;
}
.senko-section-flow > * + * {
  margin-top: 0 !important;
}
.senko-section-stack {
  display: grid;
  gap: 0;
  width: 100%;
  max-width: none;
  overflow: hidden;
}
.senko-section-stack > * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.senko-section-flow > .senko-section-stack {
  margin-top: 0 !important;
}
.lp-container > :not(style) + :not(style) {
  margin-top: clamp(18px, 3vw, 34px) !important;
}
.lp-container .p__end {
  margin: 0 !important;
  padding: 16px 0 !important;
}
.senko-section-stack--section32 :is(.section-32, .section-32-container, .section-32__container, .section-32__groupimage-section, .c32-carousel, .c32-slides, .c32-slide) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border: 0 !important;
  outline: 0 !important;
}
.senko-section-stack--section32 :is(.section-32, .section-32-container, .section-32__container, .section-32__groupimage-section, .c32-carousel, .c32-slides, .c32-slide) {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.senko-section-stack--section32 :is(.section-32__groupimage-section, .section-32__groupimage-section picture, .c32-slide picture) {
  display: block !important;
  line-height: 0 !important;
}
.senko-section-stack--section32 :is(.section-32__groupimage-section img, .c32-slide img) {
  display: block !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 auto !important;
  border: 0 !important;
  outline: 0 !important;
}
.senko-section-stack--section32 > :is(section, article, div),
.senko-section-stack--section32 > .senko-section-stack__item > :is(section, article, div):first-child {
  max-width: none !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.senko-section-stack--section32 :is(.section-32, .section-32-container, .section-32__container) {
  width: 100% !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border: 0 !important;
}
.senko-section-stack--section32 .senko-preview-block {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
}
.senko-section-stack--section32 > :not(:first-child),
.senko-section-stack--section32 > :not(:first-child) :is(section, article, div, figure, picture, img, .section-32, .section-32-container, .section-32__container, .section-32__groupimage-section),
.senko-section-stack--section32 > .senko-section-stack__item:not(:first-child),
.senko-section-stack--section32 > .senko-section-stack__item:not(:first-child) > :is(section, article, div):first-child,
.senko-section-stack--section32 > .senko-section-stack__item:not(:first-child) :is(section, article, div, figure, picture, img, .section-32, .section-32-container, .section-32__container, .section-32__groupimage-section) {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}
.senko-section-stack--section32 > :not(:last-child),
.senko-section-stack--section32 > :not(:last-child) :is(section, article, div, figure, picture, img, .section-32, .section-32-container, .section-32__container, .section-32__groupimage-section),
.senko-section-stack--section32 > .senko-section-stack__item:not(:last-child),
.senko-section-stack--section32 > .senko-section-stack__item:not(:last-child) > :is(section, article, div):first-child,
.senko-section-stack--section32 > .senko-section-stack__item:not(:last-child) :is(section, article, div, figure, picture, img, .section-32, .section-32-container, .section-32__container, .section-32__groupimage-section) {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.senko-section-stack--section32 > .senko-section-stack__item {
  display: block;
}



/* Mantem as secoes 8 e 28 dentro da largura real do conteudo. */
.senko-content-fit,
.senko-content-fit [class*="wrapper"],
.senko-content-fit [class*="container"] {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.senko-content-fit [class*="section"] {
  box-sizing: border-box;
  max-width: 100% !important;
  min-width: 0 !important;
}

.senko-content-fit :is(section, article, div, figure, picture) {
  max-width: 100% !important;
  min-width: 0 !important;
}

.senko-content-fit [style*="width"],
.senko-content-fit [style*="min-width"] {
  max-width: 100% !important;
  min-width: 0 !important;
}

.senko-content-fit *,
.senko-content-fit *::before,
.senko-content-fit *::after {
  box-sizing: border-box;
  min-width: 0;
}

.senko-content-fit :is(img, picture, video, iframe, canvas, svg) {
  max-width: 100% !important;
}

.senko-content-fit .image-col-section-8,
.senko-content-fit .text-col-section-8 {
  min-width: 0 !important;
}

.senko-content-fit .bg-image-section-8 {
  width: calc(100% - 1rem) !important;
  max-width: calc(100% - 1rem) !important;
  height: auto !important;
  min-height: 0 !important;
}

.senko-content-fit .wrapper-section-8,
.senko-content-fit [class*="wrapper"],
.senko-content-fit [class*="container"] {
  flex-wrap: wrap !important;
}

.senko-content-fit .p__end {
  margin: 0 !important;
  padding: 16px 0 !important;
}

@media (max-width: 760px) {
  .senko-content-fit .wrapper-section-8 {
    flex-direction: column-reverse !important;
    min-height: 0 !important;
  }

  .senko-content-fit .text-col-section-8,
  .senko-content-fit .image-col-section-8 {
    flex: 0 1 auto !important;
    width: 100% !important;
  }

  .senko-content-fit .bg-image-section-8 {
    width: calc(100% - 1.2rem) !important;
    max-width: calc(100% - 1.2rem) !important;
    min-height: 0 !important;
    aspect-ratio: 26 / 17;
  }

  .senko-content-fit [class*="grid"],
  .senko-content-fit [class*="row"] {
    min-width: 0 !important;
  }
}