/* 
    Design System - Premium Sales Page 
    Focus: Conversion, Speed, and Rich Aesthetics
*/

/* --- Local Fonts: Neulis Sans --- */
@font-face {
    font-family: 'Neulis Sans';
    src: url('fonts/NeulisSans-Regular.woff2') format('woff2'),
         url('fonts/NeulisSans-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neulis Sans';
    src: url('fonts/NeulisSans-Medium.woff2') format('woff2'),
         url('fonts/NeulisSans-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neulis Sans';
    src: url('fonts/NeulisSans-SemiBold.woff2') format('woff2'),
         url('fonts/NeulisSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neulis Sans';
    src: url('fonts/NeulisSans-Bold.woff2') format('woff2'),
         url('fonts/NeulisSans-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Neulis Sans';
    src: url('fonts/NeulisSans-ExtraBold.woff2') format('woff2'),
         url('fonts/NeulisSans-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

:root {
    /* --- Exact Spacing & Sizing from outher.html --- */
    --spacing-0-5: 0.125rem;
    --spacing-1: 0.25rem;
    --spacing-1-5: 0.375rem;
    --spacing-2: 0.5rem;
    --spacing-2-5: 0.625rem;
    --spacing-3: 0.75rem;
    --spacing-3-5: 0.875rem;
    --spacing-4: 1rem;
    --spacing-4-5: 1.125rem;
    --spacing-5: 1.25rem;
    --spacing-5-5: 1.375rem;
    --spacing-6: 1.5rem;
    --spacing-6-5: 1.625rem;
    --spacing-7: 1.75rem;
    --spacing-7-5: 1.875rem;
    --spacing-8: 2rem;
    --spacing-8-5: 2.125rem;
    --spacing-9: 2.25rem;
    --spacing-9-5: 2.375rem;
    --spacing-10: 2.5rem;
    --spacing-11: 2.75rem;
    --spacing-12: 3rem;
    --spacing-14: 3.5rem;
    --spacing-16: 4rem;
    --spacing-18: 4.5rem;
    --spacing-20: 5rem;
    --spacing-24: 6rem;
    --spacing-28: 7rem;
    --spacing-32: 8rem;
    --spacing-36: 9rem;
    --spacing-40: 10rem;
    --spacing-44: 11rem;
    --spacing-48: 12rem;
    --spacing-52: 13rem;
    --spacing-56: 14rem;
    --spacing-60: 15rem;
    --spacing-64: 16rem;
    --spacing-72: 18rem;
    --spacing-80: 20rem;
    --spacing-96: 24rem;

    /* --- Container & Section Logic --- */
    --container-max-width: 1600px;
    --container-narrow-max-width: 1350px;
    --container-gutter: var(--spacing-5);
    --section-outer-spacing-block: var(--spacing-12);
    --section-inner-max-spacing-block: var(--spacing-10);
    --section-inner-spacing-inline: var(--container-gutter);
    --section-stack-spacing-block: var(--spacing-8);
    --grid-gutter: var(--spacing-5);
    
    /* --- Typography Foundation --- */
    --text-h0: 3.125rem;
    --text-h1: 2.5rem;
    --text-h2: 2.25rem;
    --text-h3: 1.875rem;
    --text-h4: 1.375rem;
    --text-h5: 1.125rem;
    --text-h6: 1rem;
    --text-xs: 0.6875rem;
    --text-sm: 0.75rem;
    --text-base: 0.875rem;
    --text-lg: 1.125rem;

    /* --- Core Palette (RGB) --- */
    --text-primary: 1 19 57;
    --accent: 255 164 27;
    --background-primary: 255 255 255;
    --border-color: var(--text-color, var(--text-primary)) / 0.12;
    
    /* --- UI Components --- */
    --rounded-button: 0.625rem;
    --button-background-primary: 255 164 27;
    --button-text-primary: 1 19 57;
    
    /* --- Specific Logic --- */
    --impact-text-font-size: calc(min(20vw, 65px) * 1);
    --impact-text-auto-columns: 85vw;
    --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

    /* --- Rounded Tokens --- */
    --rounded-xs: 0.25rem;
    --rounded-sm: 0.375rem;
    --rounded: 0.75rem;
    --rounded-lg: 1.5rem;
    --rounded-full: 9999px;
    --white: 255 255 255;
}

.rounded { border-radius: var(--rounded) !important; }
.rounded-sm { border-radius: var(--rounded-sm) !important; }
.rounded-lg { border-radius: var(--rounded-lg) !important; }
.rounded-full { border-radius: var(--rounded-full) !important; }

/* Animations */
@keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 1; }
}

/* Benefits List Section */
.benefits-checklist {
    background-color: #DFF9FF;
    border: 1px solid #D1E8F7;
    border-radius: 12px;
    padding: 20px;
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.benefit-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.benefit-item img {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
}

.benefit-item p {
    font-size: 0.9rem;
    color: #000B2E;
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
}

/* Testimonial Card - Lado a Lado (Global) */
.testimonial-card {
    background-color: #DFF9FF;
    border: 1px solid #D1E8F7;
    border-radius: 12px;
    padding: 10px !important; 
    margin: 10px 0 !important;
    display: flex !important;
    flex-direction: row !important; /* Lado a Lado por padrão */
    align-items: center !important;
    gap: 12px !important;
}

.testimonial-img {
    width: 60px !important;
    height: 60px !important;
    border-radius: 10px !important;
    object-fit: cover;
    flex: 0 0 60px;
}

.testimonial-content {
    flex: 1;
    min-width: 0;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
}

.testimonial-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: -3px !important; /* Margem negativa para "colar" no texto abaixo */
    padding: 0 !important;
}

.testimonial-author {
    font-size: 0.85rem;
    font-weight: 800;
    color: #000B2E;
    line-height: 1;
}

.testimonial-stars {
    display: flex;
    gap: 1px;
}

.testimonial-stars svg {
    width: 11px;
    height: 11px;
    fill: #FFA800;
}

.testimonial-text {
    font-size: 0.78rem;
    color: #000B2E;
    line-height: 1.2;
    margin: 0 !important;
    padding: 0 !important;
    font-weight: 500;
}

.testimonial-nav-arrow {
    display: none;
}

/* Reset & Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

html, body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
    overflow-x: hidden;
    background-color: #0c0c0c; /* Previne vãos brancos no final */
}

body {
    font-family: 'Neulis Sans', sans-serif;
    color: rgb(var(--text-primary));
    line-height: 1.6;
    background-color: #ffffff; /* Fundo principal da página */
    font-size: var(--text-base);
}

h1, h2, h3, h4 {
    font-family: 'Neulis Sans', sans-serif;
    line-height: 1.2;
    margin: 0;
}

img {
    max-width: 100%;
    display: block;
}

/* Utils */
.container {
    width: 100%;
    max-width: 600px; /* Base para mobile */
    margin: 0 auto;
    padding: 0 10px !important; 
}

@media (min-width: 768px) {
    .container {
        max-width: 900px;
    }
}

@media (min-width: 1024px) {
    .container {
        max-width: 1200px;
    }
}

@media (min-width: 1400px) {
    .container {
        max-width: 1400px;
    }
}

.text-center { text-align: center; }

/* Announcement Bar */
.announcement-bar {
    background-color: rgb(237, 0, 64);
    color: #ffffff;
    padding: 10px 0;
    overflow: hidden;
    position: relative;
    white-space: nowrap;
    display: flex;
    align-items: center;
}

.announcement-bar__scrolling-list {
    display: flex;
    animation: marquee 30s linear infinite;
}

.announcement-bar__item {
    display: flex;
    align-items: center;
    padding-right: 20px;
}

.announcement-bar__item p {
    font-size: 0.85rem;
    font-weight: 700; /* Mais negrito no Print 1 */
    margin: 0 15px;
    letter-spacing: 0.02em;
    color: #ffffff;
}

.announcement-bar__item a {
    color: #ffffff;
    text-decoration: none;
    transition: opacity 0.2s;
}

.announcement-bar__item a:hover {
    opacity: 0.8;
}

.shape-circle {
    display: inline-block;
    width: 6px;
    height: 6px;
    background-color: #ffffff;
    border-radius: 50%;
    margin: 0 10px;
}

@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Header */
.main-header {
    background-color: #000B2E; /* Azul Marinho do Print 1 */
    padding: 15px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 70px;
    margin: 0; /* Removendo qualquer margem residual */
}

.main-header .container {
    display: flex;
    justify-content: center;
    align-content: center;
}

.main-header .logo img {
    width: 140px; /* Reduzido para mais elegância */
    max-width: 100%;
    height: auto;
    display: block;
    filter: brightness(0) invert(1); /* Torna a logo azul em branca para o fundo escuro */
}

/* Product Gallery */
.product-gallery {
    padding: 0; /* Zerado para colar no menu */
}

.gallery-main {
    position: relative;
    width: 100%;
    margin: 0; /* Totalmente colado no topo e laterais */
    padding: 0;
    overflow: hidden;
    background-color: #fff;
    border-radius: 0;
}

.gallery-slider-track {
    display: flex;
    width: 100%;
    transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}

.slider-item {
    flex: 0 0 100%; /* Cada imagem ocupa exatamente 100% do telão */
    width: 100%;
}

.slider-item img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

/* Camada Invisível de Navegação (Split-Click) */
.gallery-nav-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    z-index: 10;
    cursor: pointer;
}

.nav-prev, .nav-next {
    width: 50%;
    height: 100%;
}

.nav-prev:hover, .nav-next:hover {
     background: rgba(0,0,0,0.02); /* Feedback visual sutil no hover */
}

/* Miniaturas - Ajuste de Alinhamento */
.container--gallery {
    padding: 15px 0; /* Espaço apenas vertical para as miniaturas */
}

.gallery-thumbnails {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 0 15px; /* Padding lateral para o scroll começar alinhado */
    justify-content: flex-start; /* Alinha ao início para carrossel mobile */
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.gallery-thumbnails::-webkit-scrollbar {
    display: none; /* Esconde scrollbar no Chrome/Safari */
}

.thumb-item {
    flex: 0 0 65px;
    height: 65px;
    border: 2px solid #eee; /* Borda padrão leve */
    border-radius: 10px;
    overflow: hidden;
    padding: 2px;
    background: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
}

.thumb-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
}

.thumb-item.active {
    border-color: #004CFF; /* Azul vibrante igual ao print */
    border-width: 2px;
}

/* Product Intro & Headlines */
.product-intro {
    padding-top: 20px;
    padding-bottom: 30px;
}

.rating-vstar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}

.rating-vstar .stars {
    display: flex;
    gap: 3px;
}

.rating-vstar .stars svg {
    width: 20px;
    height: 20px;
}

.rating-text {
    font-size: var(--font-size-rating);
    color: #666; /* Um pouco mais suave */
    font-weight: 500;
}

.headlines {
    margin-bottom: 25px;
}

.main-title {
    font-size: var(--font-size-title);
    color: #000B2E;
    margin-bottom: 10px;
    font-weight: 800;
    line-height: 1.2;
}

.sub-title {
    font-size: var(--font-size-subtitle);
    color: #000B2E;
    font-weight: 400;
    line-height: 1.3;
}

.sub-title strong {
    font-weight: 800;
}

/* Info Cards Grid */
.info-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 20px;
}

.info-card {
    background-color: #DFF9FF;
    border: 1px solid #d1e8f7;
    border-radius: 12px;
    padding: 12px 6px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 110px;
}

.info-card img {
    width: 32px;
    height: 32px;
    margin-bottom: 8px;
    object-fit: contain;
}

.info-card h3 {
    font-size: 0.75rem;
    font-weight: 700;
    color: #011339;
    margin: 0;
    line-height: 1.2;
}

.info-card p {
    font-size: 0.68rem;
    color: #011339;
    margin-top: 4px;
    line-height: 1.2;
}

/* Specific icon sizes for better visual balance */
.info-card:nth-child(2) img { width: 28px; height: 28px; }
.info-card:nth-child(3) img { width: 25px; height: 25px; }

@media (max-width: 768px) {
    .main-title { font-size: var(--font-size-title); }
    .sub-title { font-size: var(--font-size-subtitle); }
}

/* Urgency Components - Sketch Redesign */
/* Urgency Components - Sketch Redesign */
.urgency-container {
    margin-top: 15px;
}

.limited-stock-alert-centered {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 8px;
}

.blink-dot {
    width: 8px;
    height: 8px;
    background-color: #008000;
    border-radius: 50%;
    animation: blink 1s infinite;
    flex-shrink: 0;
}

.limited-stock-alert-centered p {
    font-size: 0.95rem;
    font-weight: 700;
    color: #000B2E;
    margin: 0;
}

.section-divider-title {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 15px 0;
}

.section-divider-title::before,
.section-divider-title::after {
    content: "";
    flex: 1;
    border-bottom: 2px solid #D1E8F7;
}

.section-divider-title span {
    padding: 0 12px;
    font-size: 0.9rem;
    font-weight: 700;
    color: #000B2E;
}

.offer-timer-box-sketch {
    background-color: #BAF4FF;
    border-radius: 12px;
    padding: 12px;
    text-align: center;
    margin-top: 5px;
    width: 100%;
}

.offer-timer-box-sketch p {
    font-size: var(--font-size-subtitle);
    font-weight: 800;
    color: #000B2E;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

#countdown-timer {
    font-variant-numeric: tabular-nums;
}

/* Bundles Selection Section - High Fidelity */
.bundles-selection {
    margin: 25px auto;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.bundle-card {
    position: relative;
    background: #FFFFFF;
    border: 1.5px solid #D1E8F7;
    border-radius: 15px;
    padding: 15px 10px;
    display: grid;
    grid-template-columns: 60px 1fr auto; /* Voltando para 60px no mobile */
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: var(--transition-smooth);
    user-select: none;
}

.bundle-card.active {
    border: 3.5px solid #008BFF;
    background-color: #F0F8FF; /* Azul suave para confirmar a seleção */
    box-shadow: 0 10px 25px rgba(0, 139, 255, 0.15);
}

/* Imagem do Produto */
.bundle-img {
    width: 60px; /* Voltando para 60px no mobile */
    height: 60px;
    object-fit: contain;
}

/* Informações Centrais */
.bundle-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.bundle-title {
    font-size: 0.9rem; /* Voltando para 0.9rem no mobile */
    font-weight: 800;
    color: #000B2E;
    line-height: 1.1;
    margin-bottom: 2px;
}

.bundle-subtitle {
    font-size: 0.72rem; /* Voltando para 0.72rem no mobile */
    color: #666;
    font-weight: 500;
    margin-bottom: 5px;
}

/* Tag de Frete */
.shipping-tag {
    background-color: #FFD700;
    color: #000B2E;
    font-size: 0.7rem; /* Voltando para 0.7rem no mobile */
    font-weight: 900;
    padding: 3px 8px;
    border-radius: 5px;
    align-self: flex-start;
    text-transform: uppercase;
}

/* Bloco de Preço (Direita) */
.bundle-pricing {
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 0px;
    min-width: 95px; /* Voltando para 95px no mobile */
}

.old-price {
    font-size: 0.75rem;
    color: #A0AEC0;
    text-decoration: line-through;
    font-weight: 500;
}

.current-price {
    font-size: 1.25rem; /* Voltando para 1.25rem no mobile */
    font-weight: 900;
    color: #008BFF;
    line-height: 1;
    white-space: nowrap; 
}

.savings-tag {
    font-size: 0.7rem; /* Voltando para 0.7rem no mobile */
    font-weight: 800;
    color: #38A169;
}

.shipping-info {
    font-size: 0.65rem; /* Voltando para 0.65rem no mobile */
    color: #718096;
}

/* Badges de Destaque */
.bundle-badge {
    position: absolute;
    top: -12px;
    right: 15px;
    background-color: #FFD700;
    color: #000B2E;
    font-size: 0.7rem; /* Voltando para 0.7rem no mobile */
    font-weight: 900;
    padding: 4px 10px;
    border-radius: 6px;
    box-shadow: 0 4px 10px rgba(255, 215, 0, 0.3);
    z-index: 10;
    text-transform: uppercase;
}

/* Ajustes Mobile Finos */
@media (max-width: 380px) {
    .bundle-card {
        grid-template-columns: 60px 1fr auto;
        gap: 6px;
    }
}

/* Checkout Footer Social Proof - Discreet Design */
.checkout-footer-msg {
    position: relative;
    background-color: #FFF9E1;
    border: 1px solid #FFE5A0;
    border-radius: 12px;
    padding: 15px 18px;
    text-align: left;
    margin: 15px auto 20px;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    overflow: hidden; /* Necessário para o efeito de brilho */
    box-shadow: 0 10px 30px rgba(212, 160, 23, 0.12), 0 4px 8px rgba(212, 160, 23, 0.05);
    animation: pulseTrustShadow 4s infinite ease-in-out;
}

/* Efeito de Brilho (Luz) que atravessa o card */
.checkout-footer-msg::after {
    content: "";
    position: absolute;
    top: 0;
    left: -150%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.6) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: skewX(-25deg);
    animation: shimmerTrust 6s infinite ease-in-out;
}

.checkout-trust-icon {
    width: 24px;
    height: 24px;
    fill: #D4A017;
    flex-shrink: 0;
}

.checkout-footer-msg p {
    font-size: 0.9rem;
    color: #4A3A00;
    line-height: 1.4;
    margin: 0;
    font-weight: 500;
}

.checkout-footer-msg strong {
    color: #000;
    font-weight: 800;
    font-size: 0.92rem;
}

/* Animations */
@keyframes pulseBadge {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

@keyframes shimmerTrust {
    0% { left: -150%; }
    30% { left: 150%; }
    100% { left: 150%; }
}

@keyframes pulseTrustShadow {
    0% { box-shadow: 0 10px 30px rgba(212, 160, 23, 0.12); }
    50% { box-shadow: 0 15px 40px rgba(212, 160, 23, 0.25); }
    100% { box-shadow: 0 10px 30px rgba(212, 160, 23, 0.12); }
}

.bundle-badge {
    animation: pulseBadge 2.5s infinite ease-in-out;
}

.bundle-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
    border-color: #B2D8FF;
}

.bundle-card:active {
    transform: scale(0.98);
}

/* Checkout Action Area */
.checkout-action-area {
    padding: 10px 0 25px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.btn-checkout-premium {
    position: relative;
    width: 100%;
    max-width: 500px;
    background: linear-gradient(135deg, #ff9a00 0%, #ff6a00 100%);
    color: #fff !important;
    text-decoration: none;
    border: none;
    padding: 18px 30px;
    font-family: 'Outfit', sans-serif;
    font-size: 1.2rem;
    font-weight: 800;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 12px 30px rgba(255, 106, 0, 0.35), 0 5px 15px rgba(255, 106, 0, 0.2);
    overflow: hidden;
}

/* Efeito de Brilho (Glint) */
.btn-checkout-premium::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -100%;
    width: 50%;
    height: 200%;
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.4) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: rotate(30deg);
    animation: glintButton 4s infinite ease-in-out;
}

@keyframes glintButton {
    0% { left: -100%; }
    20% { left: 150%; }
    100% { left: 150%; }
}

.btn-checkout-premium:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 15px 35px rgba(255, 106, 0, 0.4);
    filter: brightness(1.1);
}

.btn-checkout-premium:active {
    transform: translateY(-2px) scale(0.98);
}

.btn-arrow-icon {
    width: 24px;
    height: 24px;
    fill: currentColor;
    transition: transform 0.3s ease;
}

.btn-checkout-premium:hover .btn-arrow-icon {
    transform: translateX(5px);
}

.payment-methods-img {
    max-width: 320px;
    width: 100%;
    opacity: 0.95;
    filter: drop-shadow(0 4px 6px rgba(0,0,0,0.05));
    margin-bottom: 25px; /* Espaço extra antes do novo componente */
}

/* Treatment Recommendations Component */
.recommendations-box {
    background-color: #EFFCFF;
    border: 1px solid #d1e8f7;
    border-radius: 14px;
    padding: 22px;
    margin: 10px auto 30px;
    text-align: left;
    width: 100%;
    box-shadow: 0 8px 20px rgba(209, 232, 247, 0.3);
}

.recommendations-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.recommendation-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.check-circle {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    background-color: #d1e8f7;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #011339;
    font-size: 14px;
    font-weight: 800;
    box-shadow: 0 4px 8px rgba(1, 19, 57, 0.05);
}

.recommendation-content {
    font-size: 0.95rem;
    color: #011339;
    line-height: 1.6;
    font-family: 'Inter', sans-serif;
}

.recommendation-content strong {
    font-family: 'Outfit', sans-serif;
    font-weight: 800;
    color: #000;
}

@media (max-width: 480px) {
    .recommendations-box {
        padding: 18px;
    }
    .recommendation-content {
        font-size: 0.9rem;
    }
    .check-circle {
        width: 22px;
        height: 22px;
        font-size: 12px;
    }
}

/* Product Info Details (Accordions) */
.product-info-details {
    margin-top: 25px;
    border-top: 1.5px solid #D1E8F7; /* Azul sutil do design original */
    padding-top: 5px;
}

.info-accordion {
    border-bottom: 1.5px solid #D1E8F7;
}

.info-accordion summary {
    list-style: none;
    padding: 18px 5px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-family: 'Outfit', sans-serif;
    font-size: 1.15rem;
    font-weight: 800;
    color: #000B2E;
}

.info-accordion summary::-webkit-details-marker {
    display: none;
}

.accordion-icon {
    width: 32px;
    height: 32px;
    background-color: #F1F5F9;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--transition-smooth);
    border: 1px solid #D1E8F7;
    flex-shrink: 0;
}

.accordion-icon svg {
    width: 20px;
    height: 20px;
    fill: #000B2E;
    transition: transform 0.4s ease;
}

.info-accordion[open] .accordion-icon {
    background-color: #000B2E;
    border-color: #000B2E;
}

.info-accordion[open] .accordion-icon svg {
    fill: #FFF;
    transform: rotate(180deg);
}

.accordion-content {
    padding: 0 5px 25px 5px;
    font-size: 0.98rem;
    line-height: 1.7;
    color: #334155;
    animation: fadeInAccordion 0.4s ease-out;
}

.accordion-content p {
    margin-bottom: 12px;
}

.accordion-content ul {
    margin: 15px 0;
    padding-left: 22px;
    list-style-type: none;
}

.accordion-content li {
    margin-bottom: 8px;
    position: relative;
}

.accordion-content li::before {
    content: "•";
    color: var(--primary);
    font-weight: bold;
    position: absolute;
    left: -15px;
}

.accordion-content strong {
    color: #000B2E;
}

@keyframes fadeInAccordion {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Authenticity Notice - Red Box */
.authenticity-notice {
    background-color: rgba(252, 90, 133, 0.15); 
    border: 1px solid #a70000;
    border-radius: 12px;
    padding: 24px;
    margin: 30px auto;
    width: 100%;
}

.authenticity-notice p {
    font-size: 1rem;
    color: #000;
    line-height: 1.6;
    margin: 0;
    text-align: left;
}

.authenticity-notice strong {
    font-family: 'Outfit', sans-serif;
    font-weight: 800;
    color: #000;
}

/* ===========================
   UGC Video Section
   =========================== */
.ugc-section {
    margin-top: 35px;
    margin-bottom: 20px;
}

.ugc-title {
    font-family: 'Outfit', sans-serif;
    font-size: 1.5rem;
    font-weight: 900;
    color: #000B2E;
    line-height: 1.3;
    margin-bottom: 22px;
    text-align: left;
}

.ugc-slider-wrapper {
    overflow: hidden;
    /* Permite o swipe horizontal sem mostrar barra de rolagem */
}

.ugc-slider {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    padding-bottom: 8px;
    /* Estende além das margens do container para fade nas bordas */
    padding-left: 2px;
    padding-right: 2px;
}

.ugc-slider::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
}

.ugc-slide {
    scroll-snap-align: start;
    flex-shrink: 0;
}

.ugc-video-circle {
    width: 86px;
    height: 86px;
    border-radius: 50%;
    overflow: hidden;
    /* Borda azul ciano exatamente como no print */
    border: 3px solid #00C2FF;
    box-shadow: 0 0 0 2px rgba(0, 194, 255, 0.25);
    position: relative;
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.ugc-video-circle:hover {
    transform: scale(1.06);
    box-shadow: 0 0 0 3px rgba(0, 194, 255, 0.5), 0 6px 20px rgba(0, 0, 0, 0.15);
}

.ugc-video-circle video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

/* ===========================
   Media With Text Section
   =========================== */
.media-with-text-section {
    width: calc(100% - 32px); /* Margens laterais para o card ter espaço */
    margin: 30px auto 20px;
    display: flex;
    flex-direction: column;
    border-radius: 20px;        /* Card inteiro arredondado, igual ao "rounded" do Shopify */
    overflow: hidden;            /* Faz a imagem respeitar o border-radius */
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

.media-with-text__media {
    width: 100%;
    line-height: 0;
}

.media-with-text__media img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.media-with-text__content {
    background-color: #DFF9FF;
    padding: 28px 24px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
}

.media-with-text__title {
    font-family: 'Outfit', sans-serif;
    font-size: 1.6rem;
    font-weight: 900;
    color: #011339;
    line-height: 1.25;
    margin: 0;
}

.media-with-text__desc {
    font-family: 'Inter', sans-serif;
    font-size: 0.97rem;
    color: #011339;
    line-height: 1.7;
    margin: 0;
}

.media-with-text__desc strong {
    font-weight: 700;
    color: #011339;
}

/* Botão CTA da seção Mídia — mesmo estilo do botão Finalizar compra */
.btn-media-cta {
    position: relative;
    display: block;
    width: 100%;
    background: linear-gradient(135deg, #ff9a00 0%, #ff6a00 100%);
    color: #fff;
    border: none;
    padding: 14px 20px;
    font-family: 'Outfit', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    border-radius: 12px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 12px 30px rgba(255, 106, 0, 0.35), 0 5px 15px rgba(255, 106, 0, 0.2);
    overflow: hidden;
    box-sizing: border-box;
    margin-top: 4px;
}

.btn-media-cta::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -100%;
    width: 50%;
    height: 200%;
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.4) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: rotate(30deg);
    animation: glintButton 4s infinite ease-in-out;
}

.btn-media-cta:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 15px 35px rgba(255, 106, 0, 0.4);
    filter: brightness(1.1);
}

.btn-media-cta:active {
    transform: translateY(-2px) scale(0.98);
}

@media (max-width: 480px) {
    .media-with-text-section {
        width: calc(100% - 24px);
        border-radius: 16px;
    }
    .media-with-text__title {
        font-size: 1.4rem;
    }
    .media-with-text__content {
        padding: 24px 18px 28px;
    }
}

/* ===========================
   Seção: Provas Sociais (Facebook Style)
   =========================== */
.fb-section {
    padding: 40px 0 32px;
    background: transparent;
    overflow: hidden;
}

.fb-section__title {
    font-family: 'Outfit', sans-serif;
    font-size: 1.65rem;
    font-weight: 900;
    color: #011339;
    text-align: center;
    line-height: 1.25;
    margin: 0 16px 28px;
}

/* Navigation Arrows (PC only) */
.fb-nav {
    display: none; /* Hide on mobile */
}

.fb-section {
    position: relative;
}

/* Outer: clips horizontally to create the peek effect */
.fb-outer {
    overflow: hidden;
    padding-left: 16px;
    /* No right padding: the track overflows and gets clipped naturally */
}

/* Track: flex row, gap between cards */
.fb-track {
    display: flex;
    gap: 16px;
    transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
    padding-bottom: 8px; /* room for shadow */
}

/* Each card: fixed 258px wide (matches original Swiper values),
   with the peek of the next card visible on the right */
.fb-card {
    min-width: 258px;
    max-width: 258px;
    flex-shrink: 0;
    background: #ffffff;
    border: 1.5px solid #d8e4f8;
    border-radius: 14px;
    padding: 16px 16px 10px;
    box-shadow: 0 2px 8px rgba(0, 50, 150, 0.07);
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-sizing: border-box;
}

/* Author row */
.fb-card__top {
    display: flex;
    align-items: center;
    gap: 10px;
}

.fb-card__avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.fb-card__name {
    font-family: 'Outfit', sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: #050505;
    margin: 0 0 2px;
    line-height: 1.2;
}

.fb-card__time {
    font-family: 'Inter', sans-serif;
    font-size: 0.78rem;
    color: #65676b;
    margin: 0;
}

/* Review text */
.fb-card__text {
    font-family: 'Inter', sans-serif;
    font-size: 0.93rem;
    color: #1c1e21;
    line-height: 1.6;
    margin: 0;
}

/* Reactions row */
.fb-card__react-row {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0;
}

/* The three overlapping circular FB icons */
.fb-icons {
    display: flex;
    align-items: center;
}

.fb-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid #fff;
    margin-right: -5px;
    position: relative;
    flex-shrink: 0;
}

.fb-ic svg {
    width: 18px;
    height: 18px;
    display: block;
}

.fb-ic--like { z-index: 3; }
.fb-ic--love { z-index: 2; }
.fb-ic--haha { z-index: 1; }

.fb-count {
    font-family: 'Inter', sans-serif;
    font-size: 0.85rem;
    color: #65676b;
    margin-left: 10px;
}

.fb-comments {
    font-family: 'Inter', sans-serif;
    font-size: 0.85rem;
    color: #65676b;
    margin-left: auto;
}

/* Horizontal divider */
.fb-card__divider {
    height: 1px;
    background: #e4e6eb;
    margin: 0 -16px;
}

/* Action buttons */
.fb-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    margin-bottom: 2px;
}

.fb-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    padding: 7px 10px;
    border-radius: 8px;
    font-family: 'Inter', sans-serif;
    font-size: 0.82rem;
    font-weight: 600;
    color: #65676b;
    cursor: pointer;
    transition: background 0.15s ease;
    flex: 1 0 40%;
}

.fb-btn:hover {
    background: #f0f2f5;
    color: #050505;
}

.fb-btn svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    stroke: #65676b;
}

/* Navigation dots */
.fb-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 20px;
    padding: 0 16px;
}

.fb-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #c9cdd4;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
}

.fb-dot--active {
    background: #011339;
    transform: scale(1.35);
}

/* Fix: Carousel Drag & Selection */
.fb-track {
    user-select: none;
    -webkit-user-select: none;
    cursor: grab;
    touch-action: pan-y; /* Permite scroll vertical da página */
}
.fb-track:active {
    cursor: grabbing;
}
.fb-card img {
    pointer-events: none; /* Impede arrastar a imagem em si */
}

/* ===========================
   Seção: Quiz / Auto-Identificação
   =========================== */
.quiz-section {
    padding: 60px 0 40px;
    background: #ffffff;
}

.quiz-badge {
    display: inline-block;
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #ffa41b;
    background: #fdf2e1;
    padding: 6px 16px;
    border-radius: 6px;
    margin-bottom: 20px;
    font-weight: 700;
}

.quiz-title {
    font-size: clamp(32px, 5vw, 52px);
    line-height: 1.1;
    color: #011339;
    font-weight: 800;
    margin-bottom: 16px;
}

.quiz-subtitle {
    font-size: 17px;
    line-height: 1.6;
    color: #011339;
    max-width: 600px;
    margin-bottom: 40px;
}

.quiz-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr;
    margin-bottom: 48px;
}

@media (min-width: 768px) {
    .quiz-grid {
        grid-template-columns: 1fr 1fr;
    }
}

.quiz-card {
    background: #ffffff;
    border: 2px solid #8de0f5; /* Cor do outher.html */
    border-radius: 16px;
    padding: 24px;
    position: relative;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
}

.quiz-card:active {
    transform: scale(0.97);
}

.quiz-card--active {
    background: #fdf2e1 !important;
    border-color: #ffa41b !important;
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(255, 164, 27, 0.15);
}

.quiz-checkbox {
    width: 28px;
    height: 28px;
    border: 2px solid #8de0f5;
    border-radius: 50%;
    position: absolute;
    top: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.quiz-card--active .quiz-checkbox {
    background: #ffa41b;
    border-color: #ffa41b;
}

.quiz-checkbox svg {
    width: 18px;
    height: 18px;
    opacity: 0;
    transform: scale(0.5);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.quiz-card--active .quiz-checkbox svg {
    opacity: 1;
    transform: scale(1);
}

.quiz-q {
    font-size: 17px;
    font-weight: 700;
    color: #0b1f3a;
    line-height: 1.4;
    margin: 0 0 12px 0;
    font-style: italic;
    padding-right: 40px;
}

.quiz-s {
    font-size: 14px;
    color: #223258;
    line-height: 1.55;
    margin: 0;
}

.quiz-footer {
    text-align: center;
}

.quiz-progress {
    position: relative;
    width: 110px;
    height: 110px;
    margin: 0 auto 32px;
}

.quiz-ring-svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.quiz-ring-bg {
    fill: none;
    stroke: #f0f2f5;
    stroke-width: 6;
}

.quiz-ring-fill {
    fill: none;
    stroke: #ffa41b;
    stroke-width: 6;
    stroke-linecap: round;
    stroke-dasharray: 314;
    stroke-dashoffset: 314;
    transition: stroke-dashoffset 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.quiz-progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 32px;
    font-weight: 800;
    color: #0b1f3a;
}

.quiz-tot {
    font-size: 20px;
    color: #4a5a71;
}

.quiz-divider {
    width: 60px;
    height: 3px;
    background: #ffa41b;
    border: none;
    border-radius: 2px;
    margin: 0 auto 32px;
}

.quiz-result-header h3 {
    font-size: clamp(26px, 4.5vw, 40px);
    line-height: 1.1;
    color: #0b1f3a;
    font-weight: 800;
    margin-bottom: 16px;
}

.quiz-result-header p {
    font-size: 16px;
    line-height: 1.65;
    color: #011339;
    max-width: 580px;
    margin: 0 auto 28px;
}

.quiz-hl {
    color: #ffa41b !important;
}

.quiz-strong {
    color: #0b1f3a !important;
    font-weight: 700;
}

.quiz-cta {
    opacity: 1;
    transform: translateY(0);
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: all 0.3s ease;
}

.btn--quiz {
    background: #ffa41b;
    color: #fff;
    padding: 20px 40px;
    font-size: 17px;
    font-weight: 800;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(255, 164, 27, 0.3);
    width: 100%;
    max-width: 450px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn--quiz:hover {
    background: #ff8c00;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 164, 27, 0.4);
}

.btn--impact {
    background: #ffa41b;
    color: #fff !important;
    padding: 14px 24px;
    font-size: 14px;
    font-weight: 800;
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(255, 164, 27, 0.25);
    display: inline-block;
    text-decoration: none;
    transition: all 0.3s ease;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
}

.btn--impact:hover {
    background: #ff8c00;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 164, 27, 0.35);
}

.quiz-guarantee {
    margin-top: 14px;
    font-size: 13px;
    color: #011339;
    font-weight: 500;
}

.quiz-hint {
    margin-top: 50px;
    font-size: 14px;
    color: #011339;
    line-height: 1.6;
}

.quiz-arrow {
    margin-top: 10px;
    color: #ffa41b;
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-10px);}
    60% {transform: translateY(-5px);}
}

/* ===========================
   Seção: Benefícios contra o Estresse
   =========================== */
/* ===========================
   Seção: Benefícios contra o Estresse
   =========================== */
.benefits-stress-section {
    /* --- Isolated Design System for this component --- */
    --spacing-5: 1.25rem;
    --spacing-8: 2rem;
    --container-max-width: 1600px;
    --container-gutter: 20px; /* Reduzido para Mobile */
    --section-outer-spacing-block: 80px;
    --text-h1: 2.5rem;   /* 40px */
    --text-h3: 1.5rem;   /* 24px */
    --text-base: 1.0625rem; /* 17px */
    --heading-letter-spacing: -0.02em;
    --background-rgb: 223 249 255;
    --text-color-rgb: 1 19 57;

    background: rgb(var(--background-rgb));
    color: rgb(var(--text-color-rgb));
    
    /* Original Padding Logic */
    padding-inline-start: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
    padding-inline-end: max(var(--container-gutter), 50% - var(--container-max-width) / 2);
    padding-block-start: var(--section-outer-spacing-block);
    padding-block-end: var(--section-outer-spacing-block);
    
    line-height: 1.6;
    text-align: start;
}

@media (min-width: 990px) {
    .benefits-stress-section {
        --container-gutter: 60px; /* Aumentado somente no PC */
    }
}

.benefits-stress-section .container {
    max-width: 100%; /* Largura controlada pelo padding da seção */
    padding: 0 !important;
}

.benefits-stress-section h2 {
    font-size: var(--text-h1);
    font-weight: 500; /* Identical to brand weight */
    letter-spacing: var(--heading-letter-spacing);
    margin-bottom: var(--spacing-8);
    line-height: 1.1;
}

.benefits-stress-section p {
    font-size: var(--text-base);
    margin-bottom: var(--spacing-5);
    opacity: 0.95;
}

.benefits-stress-section h3 {
    font-size: var(--text-h3);
    font-weight: 800; /* No original os h3 no prose são bem negritos */
    margin-top: var(--spacing-8);
    margin-bottom: 0.5rem;
    line-height: 1.25;
}

.benefits-stress-section strong {
    font-weight: 800;
    color: inherit;
}

/* ===========================
   Seção: Estatísticas de Impacto
   =========================== */

/* ===========================
   Seção: Estatísticas de Impacto (Precision Refinement)
   =========================== */
/* ===========================
   Seção: Estatísticas de Impacto (Precision Refinement)
   =========================== */
.impact-stats-section {
    /* --- Local Variables Mapping to Global System --- */
    --text-color: var(--text-primary);
    --container-max-width: 1200px;
    --calculated-section-spacing-inline: var(--spacing-5);
    --calculated-section-spacing-block-start: var(--spacing-12);
    --calculated-section-spacing-block-end: var(--spacing-12);
    --background-differs-from-previous: 1; 
    --impact-text-auto-columns: 64vw; /* Permite ver um pedaço do próximo item no mobile */
    
    background-color: #FFFFFF !important;
    color: rgb(var(--text-color));
    
    /* --- Standard Section Padding Logic --- */
    padding-inline-start: max(var(--calculated-section-spacing-inline), 50% - var(--container-max-width) / 2);
    padding-inline-end: max(var(--calculated-section-spacing-inline), 50% - var(--container-max-width) / 2);
    padding-block-start: calc(var(--background-differs-from-previous) * var(--calculated-section-spacing-block-start));
    padding-block-end: var(--calculated-section-spacing-block-end);
    
    font-size: var(--text-base);
    line-height: 1.6;
    overflow: hidden;
}

.impact-text {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-12);
    align-items: center;
    width: 100%;
}

.impact-text::-webkit-scrollbar { display: none; }

.snap-center {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-5);
    text-align: center;
    padding-inline: var(--spacing-5);
    max-width: 600px; /* Evita que o texto fique largo demais no mobile */
}

.impact-text__text {
    font-size: var(--impact-text-font-size, 3.5rem);
    margin: 0;
    line-height: 1.1;
    font-weight: 800;
}

.impact-text__content .prose h3.h4 {
    font-size: var(--text-h4);
    font-weight: 700;
    margin-bottom: var(--spacing-4, 1rem);
    line-height: 1.3;
}

.impact-text__content .prose p {
    font-size: var(--text-base);
    margin-bottom: var(--spacing-5);
    line-height: 1.6;
    color: rgba(var(--text-color), 0.85);
}

.cta-wrapper {
    margin-top: var(--spacing-8);
}

.impact-stats-section .button--xl {
    display: inline-block;
    background-color: rgb(255 164 27);
    color: rgb(1 19 57);
    font-size: 1.125rem;
    font-weight: 800;
    text-decoration: none;
    padding: 1.125rem 2.25rem;
    border-radius: 0.625rem;
    transition: all 0.3s ease;
}

.impact-stats-section .button--xl:hover {
    transform: scale(1.02);
    opacity: 0.9;
}

/* Desktop Grid Layout */
@media (min-width: 990px) {
    .impact-stats-section {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: flex !important;
        justify-content: center !important;
    }

    /* Ajustado para 1100px para não esticar demais e ficar centralizado como na print 2 */
    .impact-stats-section .section-template--25473106084163__ss_steps_12_Xc8rBA-settings {
        max-width: 1100px !important;
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 0 20px !important;
    }

    .impact-text {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-around !important; /* Melhor que space-between para centralizar o bloco todo */
        align-items: flex-start !important;
        gap: 20px !important;
        width: 100% !important;
        overflow: visible !important;
    }

    .snap-center {
        flex: 1 !important;
        max-width: 33% !important;
        padding: 0 !important;
        border-right: none !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .impact-text__text {
        font-size: 3.5rem !important; /* Tamanho mais fixo e controlado */
        text-align: center !important;
        margin-bottom: 15px !important;
        line-height: 1.1 !important;
        font-weight: 800 !important;
    }

    .impact-text__content {
        text-align: center !important;
        width: 100% !important;
    }

    .impact-text__content .prose {
        max-width: 280px !important; 
        margin: 0 auto !important;
    }

    .impact-text__content .prose h3.h4 {
        font-size: 1rem !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
        margin-bottom: 10px !important;
    }

    .impact-text__content .prose p {
        font-size: 0.8rem !important;
        line-height: 1.4 !important;
        opacity: 0.8 !important;
    }
}
/* ===========================
   Seção: Media Grid (Lifestyle Gallery)
   =========================== */
.media-grid-section {
    background-color: #FFFFFF;
    padding-block: 80px;
}

.media-grid-section .container {
    max-width: 1200px !important;
    padding: 0 20px !important;
}

.media-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Mobile: 2 colunas */
    gap: var(--spacing-4);
    width: 100%;
}

@media (min-width: 1024px) {
    .media-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: 290px 290px !important;
        gap: 20px !important;
        width: 100% !important;
        grid-auto-flow: dense !important;
    }
    
    .media-grid__item {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
    }
    
    .media-grid__item:nth-child(2) {
        grid-row: span 2 !important;
    }
}

.media-grid__item {
    display: block;
    position: relative;
    overflow: hidden; /* Crucial para mostrar o arredondamento */
    grid-column: span var(--media-grid-column-span, 1);
    grid-row: span var(--media-grid-row-span, 1);
    border-radius: var(--rounded-lg);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.media-grid__item.shadow {
    box-shadow: var(--shadow);
}

.media-grid__item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.content-over-media {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: rgb(var(--background, 0 0 0));
    border-radius: inherit; /* Herda o arredondamento do pai */
    overflow: hidden;
}

.content-over-media__media {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.media-grid__item:hover .zoom-image {
    transform: scale(1.05);
}

/* Aspect Ratios based on spans to keep grid tight */
.media-grid__item[style*="--media-grid-row-span: 1"] {
    aspect-ratio: auto;
}

.media-grid__item[style*="--media-grid-row-span: 2"] {
    aspect-ratio: auto;
}

@media (max-width: 699px) {
    /* No mobile, forçamos um pouco mais de altura se necessário */
    .media-grid {
        grid-template-columns: 1fr; /* Coluna única no mobile para melhor visibilidade se preferir stack */
    }
    .media-grid__item {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
        aspect-ratio: 16/9;
    }
}

/* ===========================
   Seção: Video Slider (Clean Version)
   =========================== */
.video-slider-section {
    padding: var(--spacing-xl) 0;
    overflow: hidden;
    background: #fff;
}

.video-slider-section .container {
    max-width: 100%;
    padding: 0;
}

.video-slider__container {
    width: 100%;
    position: relative;
}

.video-slider__track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 40px calc(50vw - 110px); /* Centers 220px item */
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    cursor: grab;
    user-select: none;
}

.video-slider__track.grabbing {
    cursor: grabbing;
    scroll-snap-type: none; /* Disable snap while dragging for smoother movement */
}

.video-slider__track::-webkit-scrollbar {
    display: none;
}

.video-item {
    flex: 0 0 220px;
    scroll-snap-align: center;
    scroll-snap-stop: always;
    position: relative;
    aspect-ratio: 9/16;
    border-radius: 24px;
    overflow: hidden;
    background: #000;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.6s ease;
    opacity: 0.8;
}

.video-item.is-active {
    transform: scale(1.05) translateY(-20px);
    opacity: 1;
    z-index: 2;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

.video-item video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Controls Overlay */
.video-item__controls {
    position: absolute;
    top: 16px;
    right: 16px;
    display: flex;
    gap: 8px;
    z-index: 10;
}

.control-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.control-btn:hover {
    background: rgba(255, 255, 255, 0.4);
    transform: scale(1.05);
}

.control-btn svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

/* Toggle States */
.control-btn .icon-off,
.control-btn.active .icon-on {
    display: none;
}

.control-btn.active .icon-off,
.control-btn .icon-on {
    display: block;
}


@media (min-width: 768px) {
    .video-item {
        flex: 0 0 260px;
    }
    .video-slider__track {
        padding: 60px calc(50vw - 130px);
    }
}

/* ===========================
   Seção: Ingredientes Poderosos
   =========================== */
.ingredients-section {
    padding: var(--spacing-12) 0; /* Reduced from 20 to 12 */
    background: rgb(223 249 255);
    overflow: hidden;
    font-family: 'Neulis Sans', sans-serif !important;
    color: rgb(1 19 57);
}

.ingredients-body {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-6);
    position: relative;
}

@media (min-width: 992px) {
    .ingredients-body {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-areas: 
            "header header"
            "content visual";
        gap: var(--spacing-12);
        align-items: center;
    }

    .ingredients-header { 
        grid-area: header;
        text-align: left;
    }
    
    .ingredients-content { 
        grid-area: content;
        padding-right: var(--spacing-10);
    }
    
    .ingredients-visual { 
        grid-area: visual;
        display: flex;
        justify-content: flex-end;
    }
}

.ingredients-content {
    flex: 1;
    z-index: 5;
}

.ingredients-header {
    text-align: center;
    margin-bottom: var(--spacing-8);
}

.ingredients-header .h2 {
    font-size: var(--text-h2);
    font-weight: 700;
    line-height: 1.1;
    color: rgb(1 19 57);
    margin-bottom: var(--spacing-4);
}

.ingredients-header .text-custom {
    font-size: var(--text-lg);
    opacity: 0.8;
    color: rgb(1 19 57);
}

/* Tabs: Icons */
.feature-tabs-icons {
    display: flex;
    gap: var(--spacing-5);
    margin: var(--spacing-8) 0 var(--spacing-4);
}

.feature-tab-icon {
    position: relative;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--transition-smooth);
}

.feature-tab-icon img {
    width: 32px;
    height: 32px;
    object-fit: contain;
    z-index: 2;
    transition: var(--transition-smooth);
}

.feature-tab-icon .progress-circle {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.feature-tab-icon .progress-circle circle:first-child {
    stroke: rgba(1, 19, 57, 0.05);
}

.feature-tab-icon .progress-indicator {
    stroke: rgb(var(--accent));
    stroke-dasharray: 283;
    stroke-dashoffset: 283;
    transition: stroke-dashoffset 0.6s ease;
}

.feature-tab-icon.active {
    transform: scale(1.1);
}

.feature-tab-icon.active .progress-indicator {
    stroke-dashoffset: 0;
    stroke-width: 6;
}

/* Tabs: Labels */
.feature-tabs-labels {
    display: flex;
    gap: var(--spacing-5);
    margin-bottom: var(--spacing-8);
}

.feature-tabs-labels .tab-label {
    flex: 0 0 64px;
    text-align: center;
    font-size: var(--text-xs);
    font-weight: 700;
    color: rgb(1 19 57);
    opacity: 0.5;
    transition: var(--transition-smooth);
}

.feature-tabs-labels .tab-label.active {
    opacity: 1;
}

/* Panes */
.feature-text-panes {
    position: relative;
    min-height: 280px;
}

.feature-pane {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition: var(--transition-smooth);
}

.feature-pane.active {
    position: relative;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.pane-title {
    font-size: var(--text-h3);
    font-weight: 700;
    color: rgb(1 19 57);
    margin-bottom: var(--spacing-6);
}

.pane-content p {
    font-size: var(--text-base);
    line-height: 1.6;
    margin-bottom: var(--spacing-4);
    color: rgba(1, 19, 57, 0.85);
}

.pane-dose {
    display: inline-block;
    padding: var(--spacing-2) var(--spacing-4);
    background: rgba(var(--accent), 0.1);
    border-radius: var(--rounded-sm);
    font-weight: 700;
    color: rgb(1 19 57);
    margin-top: var(--spacing-4) !important;
}

.feature-cta {
    margin-top: var(--spacing-6); /* Reduced from 10 to 6 */
}

/* Visuals */
.ingredients-visual {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    min-height: 300px; /* Reduced from 400 */
}

@media (min-width: 992px) {
    .ingredients-visual {
        min-height: 500px;
    }
}

.feature-images-wrapper {
    position: relative;
    width: 100%;
    max-width: 500px;
    aspect-ratio: 12 / 8;
}

.feature-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 12 / 8;
    border-radius: var(--rounded-lg);
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.9);
    transition: all 0.7s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1;
    box-shadow: 0 20px 40px rgba(1, 19, 57, 0.15);
}

.feature-img.active {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
    z-index: 10;
}

@media (max-width: 991px) {
    .ingredients-section {
        padding: var(--spacing-10) 0;
    }
    .ingredients-body {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
    }
    .ingredients-header {
        order: 1 !important;
        margin-bottom: var(--spacing-6) !important;
        text-align: center !important;
    }
    .ingredients-header .h2 {
        font-size: 26px !important; /* Reduced mobile title size specifically for this section */
        padding: 0 var(--spacing-4);
    }
    .ingredients-visual {
        order: 2 !important;
        min-height: 250px !important;
        margin-bottom: var(--spacing-8) !important;
    }
    .ingredients-content {
        order: 3 !important;
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 10px !important;
        justify-items: center !important;
    }
    
    /* Reordering Icons and Labels into Interlaced Grid */
    .feature-tabs-icons, .feature-tabs-labels {
        display: contents !important;
    }
    
    /* Row 1: First 3 Icons */
    .feature-tab-icon:nth-child(1) { order: 1; }
    .feature-tab-icon:nth-child(2) { order: 2; }
    .feature-tab-icon:nth-child(3) { order: 3; }
    
    /* Row 2: First 3 Labels */
    .tab-label:nth-child(1) { order: 4; }
    .tab-label:nth-child(2) { order: 5; }
    .tab-label:nth-child(3) { order: 6; }
    
    /* Row 3: Next 3 Icons */
    .feature-tab-icon:nth-child(4) { order: 7; }
    .feature-tab-icon:nth-child(5) { order: 8; }
    .feature-tab-icon:nth-child(6) { order: 9; }
    
    /* Row 4: Next 3 Labels */
    .tab-label:nth-child(4) { order: 10; }
    .tab-label:nth-child(5) { order: 11; }
    .tab-label:nth-child(6) { order: 12; }

    .feature-tab-icon {
        width: 50px !important;
        height: 50px !important;
        margin: 0 !important;
    }
    
    .feature-tabs-labels .tab-label {
        flex: none !important;
        width: 100% !important;
        font-size: 10px !important;
        line-height: 1.2 !important;
        opacity: 0.7;
        margin: 0 !important;
        text-align: center;
    }
    
    .feature-tabs-labels .tab-label.active {
        opacity: 1;
        color: rgb(var(--accent));
    }

    /* Details and CTA span full width at the bottom of the grid */
    .feature-text-panes {
        order: 13 !important;
        grid-column: 1 / -1 !important;
        margin-top: var(--spacing-6);
        min-height: auto !important;
    }
    
    .feature-cta {
        order: 14 !important;
        grid-column: 1 / -1 !important;
        width: 100%;
        display: flex;
        justify-content: center;
    }
}

/* ==========================================================================
   Seção: Depoimentos (Testimonials)
   ========================================================================== */
.testimonials-section {
    background-color: rgb(223 249 255);
    padding: var(--spacing-10) 0; /* Reduzido de 16 para 10 */
    color: rgb(var(--text-primary));
    overflow: hidden;
}

.testimonials-carousel-wrapper {
    position: relative;
    margin-top: var(--spacing-6); /* Reduzido de 10 para 6 */
}

.testimonials-list {
    display: flex;
    gap: var(--spacing-6);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none; /* Firefox */
    padding-bottom: var(--spacing-8);
    -webkit-overflow-scrolling: touch;
}

.testimonials-list::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
}

.testimonials-list .testimonial-card {
    flex: 0 0 85%;
    background-color: rgb(206 241 250);
    padding: var(--spacing-6); /* Reduzido de 8 para 6 */
    border-radius: var(--rounded-lg);
    scroll-snap-align: center;
    display: flex !important;
    flex-direction: column !important; /* Carrossel no final continua em coluna no mobile */
    gap: var(--spacing-6);
    transition: transform 0.3s ease;
}

@media (min-width: 768px) {
    .testimonials-list .testimonial-card {
        flex: 0 0 45%;
    }
}

@media (min-width: 1024px) {
    .testimonials-list .testimonial-card {
        flex: 0 0 31%; /* Corrigido seletor para garantir que 3 cards apareçam no PC */
    }
}

.testimonial-header {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-4);
}

.testimonial-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
}

.testimonial-meta {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-1);
}

.rating-stars {
    display: flex;
    gap: 2px;
    color: #ffb800;
}

.rating-stars svg {
    width: 15px;
    height: 15px;
}

.testimonial-author {
    font-size: var(--text-sm);
    color: var(--text-subdued);
    font-weight: 600;
}

.testimonial-content {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-3);
}

.testimonial-title {
    font-weight: 800;
    font-size: var(--text-base);
    line-height: 1.3;
}

.testimonial-content p:not(.testimonial-title) {
    font-size: var(--text-sm);
    line-height: 1.6;
}

/* Carousel Controls */
.carousel-controls {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-6);
    margin-top: var(--spacing-4);
}

.carousel-scrollbar {
    width: 100%;
    height: 2px;
    background: rgba(1, 19, 57, 0.1);
    position: relative;
    border-radius: 1px;
}

.scrollbar-progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: rgb(var(--text-primary));
    width: 0%;
    transition: width 0.1s ease;
}

.carousel-buttons {
    display: flex;
    justify-content: flex-end;
    gap: var(--spacing-4);
}

.carousel-btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(1, 19, 57, 0.2);
    background: transparent;
    color: rgb(var(--text-primary));
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.carousel-btn:hover:not(:disabled) {
    background: rgb(var(--text-primary));
    color: white;
}

.carousel-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.carousel-btn svg {
    width: 24px;
    height: 24px;
}

/* ==========================================================================
   Seção: Cronograma de Transformação (Steps) - Alta Fidelidade (CENTRALIZADO)
   ========================================================================== */
.transformation-steps {
    font-family: Neulis Sans, sans-serif !important;
    box-sizing: border-box;
    border-style: solid;
    border-width: 0;
    margin: 0;
    border-radius: 0px;
    overflow: hidden;
    background-color: #ffffff; /* Fundo branco conforme Print 1 */
    padding-top: 60px;
    padding-bottom: 60px;
    text-align: center; /* Centraliza todo o texto */
}

.section-template--25473106084163__ss_steps_12_Xc8rBA-settings {
    max-width: 800px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
}

.steps-content-template--25473106084163__ss_steps_12_Xc8rBA {
    display: flex;
    flex-direction: column;
    align-items: center; /* Centraliza os filhos */
}

.steps-heading-heading_VkDcKz {
    margin-bottom: 15px;
}

.steps-heading-heading_VkDcKz p {
    font-size: 2.8rem;
    font-weight: 800;
    line-height: 1.1;
    color: rgb(1, 19, 57);
    margin: 0;
}

.steps-text-text_NND6Kx {
    margin-bottom: 50px;
}

.steps-text-text_NND6Kx p {
    font-size: 1.4rem;
    color: rgb(1, 19, 57);
    margin: 0;
}

.steps-wrap-template--25473106084163__ss_steps_12_Xc8rBA {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.steps-progress-bar-template--25473106084163__ss_steps_12_Xc8rBA {
    display: none !important;
}

.steps-progress-bar-background-template--25473106084163__ss_steps_12_Xc8rBA,
.steps-progress-bar-progress-template--25473106084163__ss_steps_12_Xc8rBA {
    display: none !important;
}

.steps-items-template--25473106084163__ss_steps_12_Xc8rBA {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.steps-item-template--25473106084163__ss_steps_12_Xc8rBA {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 60px;
    z-index: 2;
    width: 100%;
}

.steps-item-template--25473106084163__ss_steps_12_Xc8rBA:last-child {
    margin-bottom: 0;
}

/* Círculo Azul claro do Ícone */
.steps-item-dot-overlay-template--25473106084163__ss_steps_12_Xc8rBA {
    position: relative;
    margin-bottom: 15px;
    width: 50px;
    height: 50px;
    background-color: #4dc2e6; /* Azul claro do ícone na Print 1 */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.steps-item-icon-template--25473106084163__ss_steps_12_Xc8rBA {
    color: #ffffff; /* Ícone branco sobre fundo azul claro */
    display: flex;
    align-items: center;
    justify-content: center;
}

.steps-item-icon-template--25473106084163__ss_steps_12_Xc8rBA svg {
    width: 24px;
    height: 24px;
}

.steps-item-content-template--25473106084163__ss_steps_12_Xc8rBA {
    width: 100%;
}

/* Badge Branca com Borda Escura */
.steps-item-badge-template--25473106084163__ss_steps_12_Xc8rBA {
    display: inline-block;
    background-color: #ffffff;
    color: rgb(1, 19, 57);
    padding: 6px 20px;
    border: 1.5px solid rgb(1, 19, 57);
    border-radius: 25px;
    font-size: 0.85rem;
    font-weight: 700;
    margin-bottom: 20px;
}

.steps-item-heading-template--25473106084163__ss_steps_12_Xc8rBA p,
.steps-item-heading-template--25473106084163__ss_steps_12_Xc8rBA h3 {
    font-size: 1.8rem;
    font-weight: 800;
    margin-bottom: 15px;
    color: rgb(1, 19, 57);
    line-height: 1.2;
}

.steps-item-text-template--25473106084163__ss_steps_12_Xc8rBA p {
    font-size: 1.1rem;
    line-height: 1.6;
    color: rgb(1, 19, 57);
    max-width: 600px;
    margin: 0 auto 10px;
}

.steps-item-text-template--25473106084163__ss_steps_12_Xc8rBA strong {
    font-weight: 800;
}

@media (max-width: 768px) {
    .steps-heading-heading_VkDcKz p {
        font-size: 2rem;
    }
    .steps-item-heading-template--25473106084163__ss_steps_12_Xc8rBA p,
    .steps-item-heading-template--25473106084163__ss_steps_12_Xc8rBA h3 {
        font-size: 1.5rem;
    }
}

/* Botão do Guia - Estilo Shopify button--xl Idêntico */
.guide-download-btn-v2 {
    display: inline-block;
    background-color: rgb(40, 210, 250);
    color: #ffffff;
    font-size: 1.125rem;
    font-weight: 800;
    text-decoration: none;
    padding: 1.125rem 2.25rem;
    border-radius: 0.625rem;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}

.guide-download-btn-v2:hover {
    transform: translateY(-2px);
    opacity: 0.9;
    box-shadow: 0 5px 15px rgba(40, 210, 250, 0.3);
}

/* ===========================
   Seção: Reviews (Identical Trustoo Style)
   =========================== */
.reviews-section {
    background-color: #ffffff;
    padding: 80px 0;
    font-family: 'Neulis Sans', sans-serif !important;
}

.reviews-container {
    max-width: 600px;
    margin: 0 auto;
    padding: 0 20px;
}

@media (min-width: 990px) {
    .reviews-container {
        max-width: 1400px !important;
        width: 95% !important;
    }
}

/* AI Summary Block */
.tt-ai-summary {
    background: #ffffff;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 32px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

.tt-header-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    font-size: 1.125rem;
    font-weight: 800;
    color: #1a1a1a;
}

.tt-header-icon svg {
    width: 20px;
    height: 20px;
}

.tt-summary-text {
    font-size: 0.9375rem;
    line-height: 1.5;
    color: #333333;
    margin-bottom: 24px;
}

.tt-ai-section {
    border-top: 1px solid #f0f0f0;
    padding-top: 20px;
}

.tt-ai-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.tt-ai-title {
    font-size: 0.75rem;
    font-weight: 700;
    color: #999999;
    text-transform: uppercase;
}

.tt-keywords-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tt-keyword-badge {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #f8f8f8;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.875rem;
    font-weight: 700;
    color: #333333;
}

.tt-keyword-icon svg {
    width: 16px;
    height: 16px;
}

.tt-percentage {
    color: #666;
    font-weight: 400;
    margin-left: 2px;
}

/* Reviews Wrapper */
.trustoo-reviews-wrapper {
    margin-top: 24px;
}

.tt-head-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding: 0 8px;
}

.product-rating {
    display: flex;
    align-items: center;
    gap: 8px;
}

.big-point {
    font-size: 1.5rem;
    font-weight: 800;
    color: #1a1a1a;
}

.reviews-num {
    font-size: 0.875rem;
    color: #666;
    margin-top: 4px;
}

.vstar-star {
    display: flex;
    gap: 2px;
    align-items: center;
}

.vstar-star svg {
    width: 16px;
    height: 16px;
}

.product-rating .vstar-star svg {
    width: 20px;
    height: 20px;
}

.tt-write-reviews {
    background: #1a1a1a;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
}

/* Review Cards */
.tt-review-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.list-review {
    background: #ffffff;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.03);
}

.user-message {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.tt-review-avatar {
    width: 40px;
    height: 40px;
    background: #f0f0f0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    color: #333;
    position: relative;
    text-transform: uppercase;
}

.trustoo-badge-icon {
    position: absolute;
    bottom: -2px;
    right: -2px;
    background: #fff;
    border-radius: 50%;
}

.author-name {
    font-weight: 700;
    color: #1a1a1a;
    font-size: 0.9375rem;
    text-transform: capitalize;
}

.verified-text {
    font-size: 0.75rem;
    color: #666;
}

.reviews-text {
    font-size: 0.9375rem;
    line-height: 1.6;
    color: #333;
    margin-top: 12px;
}

.display-text {
    color: #1a1a1a;
    font-weight: 700;
    cursor: pointer;
    margin-left: 4px;
}

/* Merchant Reply */
.merchant-reply {
    margin-top: 20px;
    background: rgb(223 249 255);
    border-radius: 8px;
    padding: 16px;
}

.tt-shop-avatar img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    margin-right: 8px;
}

.reply-content {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #444;
    white-space: pre-line;
}

/* Pagination */
.page-control {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    list-style: none;
    margin-top: 32px;
}

.page-control-item {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 700;
    color: #666;
}

.page-control-item.active {
    background: #1a1a1a;
    color: #fff;
}

.page-control-button {
    cursor: pointer;
    padding: 8px;
}

@media (max-width: 768px) {
    .reviews-section {
        padding: 40px 0;
    }
    }
    
    .tt-head-content {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
    }
}

/* FAQ Section Styles */
.faq-section {
    padding-block: 80px;
    background: rgb(var(--background, 248 248 248));
}

.section-stack {
    display: flex;
    flex-direction: column;
    gap: 48px;
    max-width: 600px; /* Ajustado para o padrão do projeto (conforme solicitado) */
    margin-inline: auto;
    padding-inline: 15px; /* Reduzido para ficar mais próximo da borda em mobile */
}

.section-stack--center {
    align-items: center;
}

.section-stack__intro .h2 {
    font-size: clamp(1.5rem, 5vw, 2.25rem);
    color: #011339;
    margin-bottom: 0;
    font-weight: 700;
}

.section-stack__main {
    width: 100%;
}

.accordion-box {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.accordion {
    border-bottom: 1px solid #f0f0f0;
}

.accordion:last-child {
    border-bottom: none;
}

.accordion summary {
    list-style: none;
    cursor: pointer;
    padding: 24px;
}

.accordion summary::-webkit-details-marker {
    display: none;
}

.accordion__toggle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    font-size: 1.05rem;
    color: #011339;
    font-weight: 600;
}

.circle-chevron {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #f5f5f5;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    flex-shrink: 0;
}

.circle-chevron svg {
    width: 10px;
    height: 10px;
    color: #011339;
}

.accordion[open] .circle-chevron {
    transform: rotate(180deg);
}

/* Suave opening logic with Grid */
.accordion__content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 0 24px;
}

.accordion[open] .accordion__content {
    grid-template-rows: 1fr;
    padding-bottom: 24px;
}

.accordion__content > div {
    overflow: hidden;
    color: #4a4a4a;
    line-height: 1.6;
    font-size: 0.95rem;
}

.accordion__content p {
    margin-bottom: 1em;
}

.accordion__content p:last-child {
    margin-bottom: 0;
}

.faq-footer {
    width: 100%;
}

.faq-availability {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    text-align: center;
    padding: 32px 24px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.faq-availability .v-stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.faq-availability img {
    max-width: 100%;
    width: 260px;
    border-radius: 8px;
    height: auto;
}

.faq-availability p {
    font-weight: 600;
    color: #011339;
    margin: 0;
    line-height: 1.4;
}

.text-subdued {
    color: #6a6a6a;
    font-size: 0.9rem;
}

.faq-contact-btn {
    background: #011339;
    color: white;
    padding: 16px 40px;
    border-radius: 50px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
    width: fit-content;
    font-size: 1rem;
}

.faq-contact-btn:hover {
    background: #081e4d;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(1, 19, 57, 0.2);
}

@media (max-width: 768px) {
    .faq-section {
        padding-block: 48px;
    }
    
    .section-stack {
        gap: 32px;
        padding-inline: 10px; /* Ainda mais próximo da borda em mobile extremo */
    }
    
    .accordion summary {
        padding: 16px 20px;
    }
    
    .accordion__content {
        padding: 0 20px;
    }
    
    .accordion[open] .accordion__content {
        padding-bottom: 16px;
    }
    
    .faq-availability {
        padding: 20px;
    }
    
    .faq-contact-btn {
        width: 100%;
        text-align: center;
    }
}

/* --- Main Footer --- */
.main-footer {
    background-image: linear-gradient(139deg, #0C0C0C 0%, #181818 100%);
    color: #ffffff;
    padding: 80px 20px 60px;
    font-family: 'Neulis Sans', sans-serif;
    width: 100%;
    margin: 0;
    box-sizing: border-box;
}

.main-footer .container {
    max-width: 1200px; /* Standard wide container for footer content */
    margin: 0 auto;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 40px;
}

.footer-logo {
    margin-bottom: 24px;
}

.footer-logo svg {
    max-width: 180px;
    height: auto;
}

.footer-info p {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 12px;
}

.footer-legal {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
}

.footer-legal a {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s;
}

.footer-legal a:hover {
    color: #ffffff;
}

.footer-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 24px;
    color: #ffffff;
}

.footer-text p {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 8px;
    line-height: 1.6;
}

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

.footer-list li {
    margin-bottom: 12px;
}

.footer-list a {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    font-size: 0.875rem;
    transition: all 0.3s;
}

.footer-list a svg {
    color: #ffffff;
}

.footer-list a:hover {
    color: #ffffff;
    transform: translateX(4px);
}

/* Responsive Footer */
@media (max-width: 1024px) {
    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px 30px;
    }
}

@media (max-width: 600px) {
    .main-footer {
        padding: 60px 20px 40px;
        text-align: left;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .footer-list a {
        justify-content: flex-start;
    }

    .footer-logo {
        display: flex;
        justify-content: flex-start;
    }
}

/* ==========================================================================
   Desktop Responsive Layout (PC ONLY) - Safe Implementation
   ========================================================================== */

/* ===========================
   ESTRUTURA DESKTOP (PC ONLY)
   =========================== */

/* Fallback: Wrappers não afetam o mobile */
.pc-layout-wrapper, .pc-content-column {
    display: contents !important;
}

@media (min-width: 1024px) {
    /* Main Layout PC - Mais largo e aproveitando melhor o espaço */
    .pc-layout-wrapper {
        display: flex !important;
        max-width: 1600px !important;
        margin: 0 auto !important;
        padding: 40px 20px !important;
        gap: 50px !important;
        align-items: flex-start !important;
    }

    .product-gallery {
        flex: 0 0 48% !important;
        position: sticky !important;
        top: 40px !important;
        width: 48% !important;
        z-index: 10 !important;
    }

    .gallery-main, .slider-item img {
        border-radius: 24px !important;
        overflow: hidden !important;
    }

    .pc-content-column {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 !important;
        min-width: 0 !important;
    }

    /* LARGURAS TOTAIS NO PC */
    .pc-content-column section,
    .pc-content-column > div,
    .pc-content-column .container,
    .pc-content-column .offer-timer-box-sketch,
    .pc-content-column .btn-checkout-premium {
        max-width: 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }

    /* Ajuste de Padding para componentes que estavam "colados" na borda no PC */
    .pc-content-column .bundle-card {
        padding: 12px 24px !important; /* Reduzido (~80% do anterior) */
        width: 100% !important;
        box-sizing: border-box !important;
        grid-template-columns: 80px 1fr auto !important; /* Imagem reduzida de 110px */
        gap: 20px !important;
    }

    .pc-content-column .bundle-img {
        width: 80px !important;
        height: 80px !important;
        mix-blend-mode: multiply; 
    }

    .pc-content-column .bundle-title {
        font-size: 1.25rem !important; /* Reduzido */
    }

    .pc-content-column .bundle-subtitle {
        font-size: 1rem !important;
    }

    .pc-content-column .current-price {
        font-size: 1.8rem !important; /* Reduzido de 2.2rem */
    }

    .pc-content-column .old-price {
        font-size: 1rem !important;
    }

    .pc-content-column .bundle-badge {
        font-size: 0.9rem !important;
        top: -15px !important;
        padding: 6px 15px !important;
    }

    .pc-content-column .shipping-tag {
        font-size: 1.05rem !important; /* Aumentado */
        padding: 6px 15px !important;
    }

    .pc-content-column .savings-tag {
        font-size: 1.15rem !important; /* Aumentado */
    }

    .pc-content-column .shipping-info {
        font-size: 1.1rem !important; /* Aumentado */
    }

    .pc-content-column .checkout-footer-msg {
        padding: 20px 80px !important; /* Mais distância das bordas laterais */
        width: 100% !important;
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .pc-content-column .checkout-footer-msg p {
        font-size: 0.95rem !important;
        white-space: nowrap !important; /* Força linha única */
        margin: 0 !important;
    }

    .pc-content-column .checkout-trust-icon {
        flex-shrink: 0 !important;
        margin-right: 8px !important; /* Texto mais colado no ícone */
    }

    .pc-content-column .authenticity-notice {
        padding: 30px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Ajuste de Alinhamento Julie Die (PC) - Lado a Lado */
    .pc-content-column .testimonial-card {
        display: flex !important;
        flex-direction: row !important; /* Voltar para row */
        padding: 20px !important;
        align-items: center !important; /* Alinha verticalmente imagem e texto */
        gap: 20px !important;
        margin-bottom: 15px !important;
    }

    .pc-content-column .testimonial-img {
        width: 80px !important;
        height: 80px !important;
    }

    .pc-content-column .testimonial-header {
        flex-wrap: nowrap !important;
        margin-bottom: 2px !important;
    }

    .pc-content-column .testimonial-text {
        font-size: 0.9rem !important;
    }

    /* Espaçamentos e Alinhamentos PC - Unificados e Curtos como no celular */
    .pc-content-column > section, 
    .pc-content-column > div,
    .pc-content-column .urgency-container,
    .pc-content-column .bundles-selection,
    .pc-content-column .ugc-section,
    .pc-content-column .product-info-details,
    .pc-content-column .authenticity-notice,
    .pc-content-column .checkout-footer-msg {
        margin-top: 0 !important;
        margin-bottom: 12px !important; /* Valor padrão unificado */
    }

    .pc-content-column .rating-vstar, 
    .pc-content-column .headlines, 
    .pc-content-column .info-cards-grid, 
    .pc-content-column .benefits-checklist, 
    .pc-content-column .urgency-container, 
    .pc-content-column .bundles-selection, 
    .pc-content-column .product-info-details, 
    .pc-content-column .authenticity-notice, 
    .pc-content-column .ugc-section {
        text-align: left !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }

    .pc-content-column .ugc-title { text-align: left !important; margin-left: 0 !important; margin-top: 0 !important; }

    /* Seções Centralizadas após a primeira sessão (PC) - Agora mais largas */
    .media-with-text-section,
    .fb-section,
    .quiz-section,
    .faq-section,
    .shipping-section,
    .authenticity-notice-bottom {
        max-width: 1400px !important; /* Quase 100% da tela como solicitado */
        margin-left: auto !important;
        margin-right: auto !important;
        width: calc(100% - 80px) !important; /* Espaçamento padrão das bordas */
        margin-top: 0 !important;
        margin-bottom: 12px !important;
    }

    .ingredients-section {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 80px 0 !important;
    }

    .ingredients-section .container {
        max-width: 1200px !important;
        margin: 0 auto !important;
        padding: 0 20px !important;
    }

    /* Seção Mídia + Texto (PC): Lado a Lado + Larga + Texto Centralizado no Bloco */
    .media-with-text-section {
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
        background: #DFF9FF !important;
        border-radius: 24px !important; /* Mantido arredondado */
        overflow: hidden !important;
        min-height: 240px !important; /* Altura reduzida mais ainda */
        width: 100% !important;
        max-width: 1100px !important; /* Espaçamento padrão das bordas */
        margin: 40px auto !important; /* Centralizado */
    }

    .media-with-text__media {
        width: 50% !important;
        flex: 1 !important;
        height: auto !important;
    }

    .media-with-text__media img {
        height: 100% !important;
        width: 100% !important;
        object-fit: cover !important;
        display: block !important;
    }

    .media-with-text__content {
        width: 50% !important;
        flex: 1 !important;
        padding: 20px 40px !important; /* Padding reduzido para caber em 240px */
        text-align: center !important; 
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
    }

    /* Seção de Transformação (Steps) no PC - centralizado, organizado */
    .steps-wrap-template--25473106084163__ss_steps_12_Xc8rBA {
        max-width: 700px !important;
        margin: 0 auto !important;
    }

    .media-with-text__title {
        font-size: 1.5rem !important; /* Ainda menor */
        text-align: center !important;
        line-height: 1.1 !important;
        margin-bottom: 8px !important;
    }

    .media-with-text__description {
        font-size: 0.95rem !important; 
        line-height: 1.4 !important;
        max-width: 450px !important;
        margin: 0 auto !important;
    }

    .btn-media-cta {
        width: auto !important;
        padding: 18px 45px !important;
        margin-top: 25px !important;
        font-size: 0.95rem !important;
    }

    /* Garantir que containers internos não limitem a largura dentro das seções centralizadas */
    .fb-section .container,
    .quiz-section .container,
    .faq-section .container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .fb-section {
        max-width: 1400px;
        margin-left: auto;
        margin-right: auto;
        padding: 60px 40px;
        position: relative;
    }

    .fb-nav {
        display: flex !important;
        position: absolute;
        top: 55%;
        transform: translateY(-50%);
        width: 48px;
        height: 48px;
        background: #ffffff;
        border: 1px solid #d8e4f8;
        border-radius: 50%;
        cursor: pointer;
        z-index: 100;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 12px rgba(0, 40, 120, 0.12);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        color: #011339;
    }

    .fb-nav svg {
        width: 24px;
        height: 24px;
    }

    .fb-nav:hover {
        background: #011339;
        color: #ffffff;
        transform: translateY(-50%) scale(1.1);
        box-shadow: 0 6px 16px rgba(0, 40, 120, 0.2);
    }

    .fb-nav--prev { left: 50px; }
    .fb-nav--next { right: 50px; }

    .fb-outer {
        padding: 20px 20px; /* Mais espaço lateral para garantir que nada seja cortado */
        margin: 0 auto;
        max-width: 1100px; /* Aumentado para acomodar o padding extra e os 3 cards */
        overflow: hidden;
        position: relative;
    }

    .fb-track {
        gap: 24px !important; /* Espaçamento mais claro entre cards no PC */
    }

    .fb-card {
        width: calc(33.333% - 16px) !important; 
        min-width: 0 !important;   /* IMPORTANTE: Resetar os valores fixos do mobile */
        max-width: none !important; /* IMPORTANTE: Resetar os valores fixos do mobile */
        flex-shrink: 0;
        margin-right: 0 !important; /* Usaremos o gap do track */
    }

    /* Refinamento do Quiz no PC */
    .quiz-section {
        text-align: center !important;
        padding: 80px 0 !important;
    }

    .quiz-section .container {
        max-width: 1200px !important;
        margin: 0 auto !important;
        width: 100% !important;
        padding: 0 40px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .quiz-badge {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .quiz-title {
        text-align: center !important;
        margin-bottom: 20px !important;
    }

    .quiz-subtitle {
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
        max-width: 600px !important;
        margin-bottom: 50px !important;
    }

    .quiz-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* Voltando para 2 colunas como no outher.html */
        gap: 24px !important;
        max-width: 1000px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
    }

    .quiz-card {
        text-align: left !important;
        padding: 30px !important;
    }

    .quiz-footer {
        width: 100% !important;
        max-width: 800px !important;
        margin: 40px auto 0 !important;
    }

    .quiz-result-header p {
        max-width: 600px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* Ajuste de scroll para garantir que o topo da seção de checkout seja visível */
#checkout-anchor {
    scroll-margin-top: 8px;
}

@media (min-width: 992px) {
    .main-footer {
        margin-top: 100px !important;
    }
}
