/* Google Fonts loaded in HTML with media="print" trick for better performance */

/* Font-display fallback for any @font-face that might be defined */
@font-face {
    font-display: swap;
}

/* --- CSS Variables --- */
:root {
    /* Colors */
    --color-primary: #E31013; /* Red */
    --color-primary-dark: #C20C0F;
    --color-primary-light: #F93D40;
    --color-secondary: #212529; /* Dark Gray / Almost Black */
    --color-secondary-dark: #1A1E21;
    --color-secondary-light: #343A40;
    --color-accent: #FFC107; /* Yellow Accent */
    --color-white: #FFFFFF;
    --color-black: #000000;
    --color-gray-100: #F8F9FA; /* Off-white */
    --color-gray-200: #E9ECEF;
    --color-gray-700: #495057; /* Darker text gray */
    --color-gray-800: #343A40; /* Dark text gray */
    --color-gray-900: #212529;

    /* Backgrounds */
    --color-background-light: var(--color-white);
    --color-background-alt: var(--color-gray-100);
    --color-background-dark: var(--color-secondary);

    /* Text */
    --color-text-light-bg: var(--color-gray-800);
    --color-text-dark-bg: var(--color-gray-200);
    --color-heading-light-bg: var(--color-secondary);
    --color-heading-dark-bg: var(--color-white);

    /* Typography */
    --font-family-base: 'Poppins', sans-serif;
    --font-size-base: 16px;
    --font-size-sm: 0.875rem;  /* 14px */
    --font-size-md: 1rem;      /* 16px */
    --font-size-lg: 1.125rem;  /* 18px */
    --font-size-xl: 1.25rem;   /* 20px */
    --font-size-2xl: 1.5rem;   /* 24px */
    --font-size-3xl: 2.25rem;  /* 36px */
    --font-size-4xl: 3rem;     /* 48px */
    --font-size-5xl: 4rem;     /* 64px */
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --line-height-base: 1.6;
    --line-height-heading: 1.2;

    /* Spacing */
    --spacing-1: 0.25rem;  /* 4px */
    --spacing-2: 0.5rem;   /* 8px */
    --spacing-3: 0.75rem;  /* 12px */
    --spacing-4: 1rem;     /* 16px */
    --spacing-6: 1.5rem;   /* 24px */
    --spacing-8: 2rem;     /* 32px */
    --spacing-10: 2.5rem;  /* 40px */
    --spacing-12: 3rem;    /* 48px */
    --spacing-16: 4rem;    /* 64px */
    --spacing-20: 5rem;    /* 80px */
    --spacing-24: 6rem;    /* 96px */
    --section-padding-y-desktop: 80px;
    --section-padding-y-mobile: 40px;
    --container-max-width: 1140px;
    --container-padding-x: 1rem;
    --mobile-margin-x: 20px;

    /* Borders & Radius */
    --border-radius-md: 8px;
    --border-radius-lg: 12px;
    --border-radius-xl: 16px;
    --border-radius-full: 9999px;

    /* Shadows */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 20px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 15px 30px rgba(0, 0, 0, 0.15);
    --shadow-primary-glow: 0 0 25px rgba(227, 16, 19, 0.3);

    /* Transitions */
    --transition-fast: 0.2s ease-out;
    --transition-normal: 0.3s ease-out;
    --transition-slow: 0.5s ease-out;

    /* Z-Index */
    --z-index-back-to-top: 999;
    --z-index-header: 1000;
    --z-index-mobile-menu: 1010;
    --z-index-preloader: 2000;
}

/* --- Reset & Base Styles --- */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: var(--font-size-base);
    scroll-behavior: smooth;
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
}

body {
    font-family: var(--font-family-base);
    font-size: var(--font-size-md);
    line-height: var(--line-height-base);
    color: var(--color-text-light-bg);
    background-color: var(--color-background-light);
    overflow-x: hidden;
    max-width: 100vw;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    position: relative;
}

body.no-scroll {
    overflow: hidden;
}

a {
    text-decoration: none;
    color: var(--color-primary);
    transition: color var(--transition-fast);
}

a:hover {
    color: var(--color-primary-dark);
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

button {
    font-family: inherit;
    font-size: inherit;
    outline: none;
    border: none;
    color: inherit;
    cursor: pointer;
    background: none;
}

h1, h2, h3, h4, h5, h6 {
    margin-bottom: var(--spacing-4);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-heading);
    color: var(--color-heading-light-bg);
}

h1 { font-size: var(--font-size-4xl); }
h2 { font-size: var(--font-size-3xl); }
h3 { font-size: var(--font-size-xl); }

h1, h2 {
    text-align: center;
    margin-bottom: var(--spacing-6);
}

p {
    margin-bottom: var(--spacing-4);
}
p:last-child {
    margin-bottom: 0;
}

/* --- Layout --- */
.container {
    width: 100%;
    max-width: var(--container-max-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--container-padding-x);
    padding-right: var(--container-padding-x);
    box-sizing: border-box;
}

.section {
    padding-top: var(--section-padding-y-desktop);
    padding-bottom: var(--section-padding-y-desktop);
    overflow: hidden;
    width: 100%;
    max-width: 100vw;
}

.bg-light { background-color: var(--color-background-alt); }
.bg-dark { background-color: var(--color-background-dark); }
.bg-white { background-color: var(--color-background-light); }

.bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4 {
    color: var(--color-heading-dark-bg);
}
.bg-dark p, .bg-dark li {
    color: var(--color-text-dark-bg);
}
.bg-dark .section-subtitle {
    color: var(--color-white);
}

/* --- Components --- */

/* Section Header */
.section-header {
    text-align: center;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--spacing-12);
}

.section-subtitle {
    display: block;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: var(--spacing-2);
    text-align: center;
}

.section-title {
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--spacing-4);
}

.section-description {
    font-size: var(--font-size-lg);
    color: var(--color-gray-700);
    max-width: 650px;
    margin-left: auto;
    margin-right: auto;
}

/* Buttons */
.btn {
    display: inline-block;
    font-weight: var(--font-weight-semibold);
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    border: 2px solid transparent;
    padding: var(--spacing-3) var(--spacing-6);
    font-size: var(--font-size-md);
    border-radius: var(--border-radius-full);
    transition: all var(--transition-normal);
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: relative;
    overflow: hidden;
}

.btn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

.btn:hover::before {
    width: 300px;
    height: 300px;
}

.btn:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg);
}

.btn:active {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.btn-primary {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: var(--color-white);
    border-color: #10b981;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    border-color: #059669;
    color: var(--color-white);
    box-shadow: 0 8px 25px rgba(16, 185, 129, 0.4);
}

.btn-lg {
    padding: var(--spacing-4) var(--spacing-8);
    font-size: var(--font-size-lg);
}

.btn-with-icon {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-2);
}

.btn-with-icon i {
    transition: transform var(--transition-fast);
}

.btn-with-icon:hover i {
    transform: scale(1.1);
}

/* Preloader */
.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-secondary);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: var(--z-index-preloader);
    transition: opacity var(--transition-slow), visibility var(--transition-slow);
}

.preloader.hide {
    opacity: 0;
    visibility: hidden;
}

.spinner {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(255, 255, 255, 0.2);
    border-top: 5px solid var(--color-primary);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Back to Top Button */
.back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    background-color: var(--color-primary);
    color: var(--color-white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    box-shadow: var(--shadow-lg);
    transition: all var(--transition-normal);
    opacity: 0;
    visibility: hidden;
    z-index: var(--z-index-back-to-top);
}

.back-to-top.active {
    opacity: 1;
    visibility: visible;
}

.back-to-top:hover {
    background-color: var(--color-primary-dark);
    transform: translateY(-5px);
}

/* --- Header --- */
.main-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-index-header);
    background-color: transparent;
    padding: var(--spacing-6) 0;
    transition: background-color var(--transition-normal), box-shadow var(--transition-normal), padding var(--transition-normal);
}

.main-header.scrolled {
    background-color: rgba(33, 37, 41, 0.9);
    backdrop-filter: blur(10px);
    box-shadow: var(--shadow-md);
    padding: var(--spacing-4) 0;
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.site-logo img {
    max-height: 40px;
    transition: transform var(--transition-fast);
}

.site-logo:hover img {
    transform: scale(1.05);
}

.main-nav {
    display: flex;
    justify-content: center;
    flex-grow: 1;
}

.main-nav ul {
    display: flex;
    align-items: center;
    gap: var(--spacing-8);
}

.main-nav a {
    color: var(--color-white);
    font-weight: var(--font-weight-medium);
    padding: var(--spacing-2) 0;
    position: relative;
}

.main-nav a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--color-primary);
    transition: width var(--transition-normal);
}

.main-nav a:hover,
.main-nav a.active {
    color: var(--color-primary-light);
}

.main-nav a:hover::after,
.main-nav a.active::after {
    width: 100%;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-6);
}

.btn-whatsapp-header {
    color: var(--color-white);
    font-size: 20px;
    transition: color var(--transition-fast), transform var(--transition-fast);
    display: block; /* Visível por padrão */
}

.btn-whatsapp-header:hover {
    color: #25D366;
    transform: scale(1.1);
}

.mobile-menu-toggle {
    display: none;
    font-size: var(--font-size-2xl);
    color: var(--color-white);
    z-index: calc(var(--z-index-mobile-menu) + 1);
}

/* --- Hero Section --- */
.hero-section {
    background-color: var(--color-secondary);
    padding-top: calc(var(--section-padding-y-desktop) + 80px);
    color: var(--color-white);
}

.hero-content {
    display: flex;
    align-items: center;
    gap: var(--spacing-16);
}

.hero-text {
    flex: 1;
    width: 100%;
}

.hero-text h1 {
    font-size: var(--font-size-5xl);
    font-weight: var(--font-weight-extrabold);
    color: var(--color-white);
    margin-bottom: var(--spacing-6);
}

.hero-text p {
    font-size: var(--font-size-lg);
    color: var(--color-gray-200);
    margin-bottom: var(--spacing-8);
    max-width: 100%;
}

.hero-image {
    flex: 1;
    max-width: 500px;
    width: 100%;
}

.hero-image img {
    transform: perspective(1000px) rotateY(-10deg) scale(1.05);
    transition: transform var(--transition-slow);
    max-width: 100%;
    height: auto;
}

.hero-image:hover img {
    transform: perspective(1000px) rotateY(0deg) scale(1.1);
}

/* --- Overview Section --- */
.overview-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-8);
    margin-top: var(--spacing-12);
    width: 100%;
    max-width: 100%;
}

.feature-box {
    background-color: var(--color-white);
    padding: var(--spacing-8);
    border-radius: var(--border-radius-lg);
    text-align: center;
    box-shadow: var(--shadow-md);
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.feature-box:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-xl);
}

.feature-icon {
    font-size: 2.5rem;
    color: var(--color-primary);
    margin-bottom: var(--spacing-6);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(227, 16, 19, 0.1);
    width: 80px;
    height: 80px;
    border-radius: 50%;
    transition: all var(--transition-normal);
}

.feature-box:hover .feature-icon {
    background-color: var(--color-primary);
    color: var(--color-white);
    transform: rotate(15deg) scale(1.1);
}

.feature-box h3 {
    font-size: var(--font-size-xl);
    margin-bottom: var(--spacing-2);
    min-height: 2.4em; /* Reserve space for two lines */
}

.feature-box p {
    color: var(--color-gray-700);
    font-size: var(--font-size-md);
    line-height: 1.6;
}

/* --- Technology Section --- */
.tech-content {
    display: flex;
    align-items: stretch; /* Changed from center to stretch */
    gap: var(--spacing-16);
    width: 100%;
    max-width: 100%;
}

.tech-image {
    margin: 0 auto;
    flex: 1;
    width: 100%;
    max-width: 100%;
}

.tech-image img {
    border-radius: var(--border-radius-lg);
    width: 100%;
    height: auto;
}

/* Tech Section Video Styles - 9:16 Aspect Ratio */
.tech-video-container {
    position: relative;
    max-width: 320px;
    flex-shrink: 0;
}

.tech-image video.tech-video {
    border-radius: var(--border-radius-lg);
    width: 100%;
    height: auto;
    aspect-ratio: 9 / 16;
    object-fit: cover;
    box-shadow: var(--shadow-xl);
}

/* Video Sound Button */
.video-sound-btn {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.7);
    color: var(--color-white);
    border: 2px solid rgba(255, 255, 255, 0.3);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    transition: all var(--transition-normal);
    z-index: 10;
}

.video-sound-btn:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    transform: scale(1.1);
}

.video-sound-btn.sound-on {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

/* Tech Text Large - Match Video Height */
.tech-text-large {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 568px; /* Matches 9:16 video at 320px width */
}

.tech-text-large .section-subtitle {
    font-size: var(--font-size-md);
    margin-bottom: var(--spacing-4);
}

.tech-text-large .section-title {
    font-size: var(--font-size-4xl);
    margin-bottom: var(--spacing-6);
    line-height: 1.1;
}

.tech-text-large .tech-description {
    font-size: var(--font-size-xl);
    line-height: 1.7;
    margin-bottom: var(--spacing-8);
}

.tech-features-large li {
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-6);
    padding: var(--spacing-3) 0;
}

.tech-features-large i {
    font-size: 1.4em;
}

.img-square {
    aspect-ratio: 1 / 1;
    width: 100%;
    object-fit: cover;
}

.tech-text {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    max-width: 100%;
}

.tech-features-list {
    list-style: none;
    padding-left: 0;
    margin-top: var(--spacing-6);
    margin-bottom: var(--spacing-8);
}

.tech-features-list li {
    display: flex;
    align-items: center;
    gap: var(--spacing-4);
    margin-bottom: var(--spacing-4);
    font-size: var(--font-size-md);
}

.tech-features-list i {
    color: var(--color-primary-light);
    font-size: 1.2em;
}

/* --- Gallery Section --- */
.gallery-container {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--spacing-4);
    margin-top: var(--spacing-12);
}

.gallery-item {
    overflow: hidden;
    border-radius: var(--border-radius-md);
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition-normal);
}

.gallery-item img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    transition: transform var(--transition-slow), filter var(--transition-normal);
}

.gallery-item:hover {
    transform: scale(1.03);
    z-index: 2;
}

.gallery-item:hover img {
    transform: scale(1.1);
    filter: brightness(1.1);
}

.gallery-item {
    cursor: pointer;
}

/* --- New Gallery Carousel --- */
.gallery-carousel-wrapper {
    position: relative;
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 60px; /* Space for arrows */
}

.gallery-carousel-container {
    overflow: hidden;
    width: 100%;
}

.gallery-carousel-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.gallery-carousel-wrapper .gallery-item {
    flex-shrink: 0;
    width: 20%; /* Default for desktop */
    padding: 0 15px;
    box-sizing: border-box;
}

.gallery-carousel-wrapper .gallery-item img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 50%;
    border: 4px solid var(--color-white);
    box-shadow: var(--shadow-lg);
    transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.gallery-carousel-wrapper .gallery-item:hover img {
    transform: scale(1.05);
    box-shadow: var(--shadow-xl);
}

.carousel-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--color-white);
    color: var(--color-primary);
    border: 1px solid var(--color-gray-200);
    border-radius: 50%;
    width: 50px;
    height: 50px;
    font-size: 1.2rem;
    cursor: pointer;
    z-index: 10;
    transition: all var(--transition-normal);
    box-shadow: var(--shadow-md);
}

.carousel-arrow:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
    transform: translateY(-50%) scale(1.1);
}

.carousel-arrow.prev {
    left: 0;
}

.carousel-arrow.next {
    right: 0;
}

/* --- Reviews Section --- */
.reviews-section {
    display: none;
}

.testimonial-slider {
    position: relative;
    max-width: 800px;
    margin: var(--spacing-12) auto 0;
    overflow: hidden;
}

.testimonial-wrapper {
    display: flex;
    transition: transform var(--transition-slow);
}

.testimonial-item {
    flex: 0 0 100%;
    padding: var(--spacing-8);
    background-color: var(--color-white);
    border-radius: var(--border-radius-lg);
    text-align: center;
    box-shadow: var(--shadow-md);
}

.testimonial-item p {
    font-style: italic;
    font-size: var(--font-size-lg);
    color: var(--color-gray-700);
    margin-bottom: var(--spacing-6);
    position: relative;
}

.testimonial-item p::before {
    content: '\f10d';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: var(--color-primary);
    font-size: 1.5rem;
    margin-right: var(--spacing-2);
    opacity: 0.5;
}

.testimonial-author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-4);
}

.testimonial-author-image img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--color-primary);
}

.testimonial-author-info h4 {
    font-weight: var(--font-weight-semibold);
    margin-bottom: 0;
}

.testimonial-author-info p {
    color: var(--color-gray-700);
    font-size: var(--font-size-sm);
    margin-bottom: 0;
}

.testimonial-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: var(--spacing-8);
    gap: var(--spacing-4);
}

.testimonial-prev, .testimonial-next {
    background-color: var(--color-primary);
    color: var(--color-white);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--transition-fast);
}

.testimonial-prev:hover, .testimonial-next:hover {
    background-color: var(--color-primary-dark);
    transform: scale(1.1);
}

.testimonial-dots {
    display: flex;
    gap: var(--spacing-2);
}

.testimonial-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: var(--color-gray-200);
    cursor: pointer;
    transition: background-color var(--transition-fast);
}

.testimonial-dot.active {
    background-color: var(--color-primary);
}

/* --- CTA Section --- */
.cta-section {
    background: linear-gradient(45deg, var(--color-primary), var(--color-primary-dark));
    color: var(--color-white);
    text-align: center;
}

.cta-section .section-title {
    color: var(--color-white);
}

.cta-section .section-description {
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: var(--spacing-6);
}

.price-display {
    margin-bottom: var(--spacing-6);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-3);
}

.promotion-badge {
    background: linear-gradient(45deg, var(--color-primary), var(--color-primary-light));
    color: var(--color-white);
    padding: var(--spacing-2) var(--spacing-4);
    border-radius: 25px;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 15px rgba(227, 16, 19, 0.3);
    animation: pulse 2s infinite;
    margin-top: 20px;
}

/* AUTO-FIX: Consolidada animação pulse (removidas duplicatas das linhas 1816-1826 e 2127-2134) */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.price-comparison {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-1);
}

.price-installment {
    font-size: var(--font-size-lg);
    color: var(--text-secondary);
    font-weight: 500;
}

.price-old {
    font-size: var(--font-size-lg);
    text-decoration: line-through;
    opacity: 0.7;
    color: var(--color-gray-700);
    font-weight: var(--font-weight-medium);
}

.price-new {
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-bold);
}

.payment-info {
    margin-top: var(--spacing-4);
    font-size: var(--font-size-sm);
    opacity: 0.8;
}

/* --- Footer --- */
.main-footer {
    background-color: var(--color-secondary-dark);
    color: var(--color-text-dark-bg);
    padding-top: var(--spacing-16);
    padding-bottom: var(--spacing-8);
    margin-top: auto;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-8);
    margin-bottom: var(--spacing-12);
}

.footer-column h4 {
    color: var(--color-white);
    font-size: var(--font-size-lg);
    margin-bottom: var(--spacing-6);
    position: relative;
    padding-bottom: var(--spacing-2);
}

.footer-column h4::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 2px;
    background-color: var(--color-primary);
}

.footer-column p {
    color: var(--color-gray-200);
    font-size: var(--font-size-sm);
}

.footer-logo {
    max-width: 150px;
    margin-bottom: var(--spacing-4);
}

.footer-column ul {
    padding-left: 0;
}

.footer-column ul li {
    margin-bottom: var(--spacing-2);
}

.footer-column ul a, .footer-column ul li {
    color: var(--color-gray-200);
    font-size: var(--font-size-sm);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.footer-column ul a:hover {
    color: var(--color-primary-light);
}

.footer-security img {
    margin-bottom: var(--spacing-4);
}

.footer-column.links ul li {
    margin-bottom: var(--spacing-2);
}

.footer-column.links a {
    color: var(--color-gray-200);
    font-size: var(--font-size-sm);
}

.footer-column.links a:hover {
    color: var(--color-primary-light);
    padding-left: 5px;
}

.social-links {
    display: flex;
    gap: var(--spacing-4);
    margin-top: var(--spacing-4);
}

.social-links a {
    color: var(--color-white);
    background-color: rgba(255, 255, 255, 0.1);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all var(--transition-fast);
}

.social-links a:hover {
    background-color: var(--color-primary);
    transform: translateY(-3px);
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: var(--spacing-6) 0 0;
    text-align: center;
    font-size: var(--font-size-sm);
    color: var(--color-gray-200);
}

.footer-bottom p {
    margin-bottom: var(--spacing-2);
}

/* --- Video Section --- */
.video-section {
    position: relative;
    width: 100%;
    height: 70vh;
    min-height: 400px;
    max-height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--color-white);
    padding: 0;
    margin: 0;
    overflow: hidden;
    /* Prevent CLS by reserving space */
    aspect-ratio: 16 / 9;
    contain: layout style paint;
}

.video-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
}

.video-background::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 1;
    pointer-events: none;
}

.video-background iframe,
.video-background video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 56.25vw; /* 16:9 Aspect Ratio */
    min-height: 100vh;
    min-width: 177.77vh; /* 16:9 Aspect Ratio */
    transform: translate(-50%, -50%);
    pointer-events: none;
    border: none;
    object-fit: cover;
}

/* Mobile & Tablet - Video Section Adjustments */
@media (max-width: 1024px) {
    .video-section {
        height: 50vh;
        min-height: 300px;
        max-height: 400px;
    }
}

.video-content {
    position: relative;
    z-index: 1;
}

.video-content .section-subtitle,
.video-content .section-title,
.video-content p {
    display: none;
}

.video-content .section-title {
    color: var(--color-white);
}

.video-content p {
    font-size: var(--font-size-lg);
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* --- Lightbox --- */
.lightbox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2000;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--transition-normal), visibility var(--transition-normal);
}

.lightbox.active {
    opacity: 1;
    visibility: visible;
}

.lightbox-content {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
}

.lightbox-image {
    max-width: 100%;
    max-height: 90vh;
    border-radius: var(--border-radius-md);
}

.lightbox-close {
    position: absolute;
    top: -40px;
    right: 0;
    color: var(--color-white);
    font-size: 2.5rem;
    cursor: pointer;
    transition: color var(--transition-fast);
}

.lightbox-close:hover {
    color: var(--color-primary);
}

.lightbox-prev, .lightbox-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.2);
    color: var(--color-white);
    border: none;
    font-size: 2rem;
    cursor: pointer;
    padding: var(--spacing-4);
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color var(--transition-fast);
}

.lightbox-prev {
    left: -80px;
}

.lightbox-next {
    right: -80px;
}

.lightbox-prev:hover, .lightbox-next:hover {
    background-color: rgba(255, 255, 255, 0.4);
}

/* --- Desktop Specific Styles --- */
@media (min-width: 1025px) {
    /* All base styles are desktop-first */
}

/* --- Tablet Specific Styles --- */
@media (max-width: 1024px) {
    h1 { font-size: var(--font-size-3xl); }
    .section-title { font-size: var(--font-size-2xl); }

    .hero-content {
        flex-direction: column;
        text-align: center;
        gap: var(--spacing-10);
        align-items: center;
        width: 100%;
    }

    .hero-text {
        order: 2;
        width: 100%;
        max-width: 100%;
    }

    .hero-image {
        order: 1;
        max-width: 450px;
        width: 100%;
        margin: 0 auto;
        display: block;
    }

    .hero-text p {
        max-width: 100%;
        width: 100%;
    }

    .hero-image img {
        transform: none;
        margin: 0 auto;
        width: 100%;
    }

    .overview-grid {
        grid-template-columns: 1fr;
    }

    .tech-content {
        flex-direction: column;
        text-align: center;
        align-items: center;
    }

    .tech-features-list {
        display: inline-block;
        text-align: left;
    }

    .gallery-container {
        grid-template-columns: repeat(3, 1fr);
    }

    .gallery-item:nth-child(4), .gallery-item:nth-child(5) {
        grid-column: span 1;
    }
    
    .gallery-item:nth-child(4) {
        grid-column-start: 1;
    }
    
    .gallery-item:nth-child(5) {
        grid-column-start: 2;
        grid-column-end: 4;
    }

    .gallery-carousel-wrapper .gallery-item {
        width: 33.333%; /* Show 3 items on tablet */
        padding: 0 10px;
    }

    .footer-content {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* --- Mobile Specific Styles --- */
@media (max-width: 767px) {
    :root {
        --font-size-5xl: 2.5rem; /* Reduz de 4rem para 2.5rem no mobile */
    }

    .section {
        padding-top: var(--section-padding-y-mobile);
        padding-bottom: var(--section-padding-y-mobile);
        width: 100%;
        max-width: 100vw;
        overflow-x: hidden;
    }

    .container {
        padding-left: var(--mobile-margin-x);
        padding-right: var(--mobile-margin-x);
        width: 100%;
        max-width: 100%;
    }

    h1 {
        font-size: var(--font-size-2xl);
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    .section-title {
        font-size: var(--font-size-xl);
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    .section-description {
        font-size: var(--font-size-md);
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    /* Header Mobile */
    .main-header {
        padding: var(--spacing-4) 0;
    }
    
    .main-header.scrolled {
        padding: var(--spacing-2) 0;
    }

    .site-logo img {
        max-height: 30px;
    }

    .mobile-menu-toggle {
        display: block;
    }
    
    .main-nav {
        order: 3; /* Garante que o menu venha depois dos ícones */
    }
    
    .header-actions {
        gap: var(--spacing-4);
    }
    

    .main-nav {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: var(--color-secondary-dark);
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .main-nav.active {
        display: flex;
    }

    .main-nav ul {
        flex-direction: column;
        gap: var(--spacing-6);
    }

    .main-nav a {
        font-size: var(--font-size-xl);
    }

    /* Hero Mobile */
    .hero-section {
        padding-top: calc(var(--section-padding-y-mobile) + 60px);
        width: 100%;
        max-width: 100vw;
        overflow-x: hidden;
    }

    .hero-content {
        width: 100%;
        gap: var(--spacing-6);
    }

    .hero-text {
        width: 100%;
        text-align: center;
    }

    .hero-text h1 {
        font-size: 1.75rem !important; /* Força tamanho menor em mobile */
        line-height: 1.2;
        margin-bottom: var(--spacing-4);
    }

    .hero-text p {
        font-size: var(--font-size-md);
        margin-bottom: var(--spacing-6);
    }

    .hero-image {
        width: 100%;
        max-width: 100%;
        padding: 0 var(--spacing-4);
    }

    .hero-image img {
        width: 100%;
        max-width: 350px;
        margin: 0 auto;
        display: block;
    }

    .btn, .btn-lg {
        width: 100%;
        max-width: 320px;
        margin-left: auto;
        margin-right: auto;
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .btn-with-icon {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    /* Gallery Mobile */
    .gallery-container {
        grid-template-columns: 1fr;
        width: 100%;
        max-width: 100%;
    }

    .gallery-item img {
        height: 250px;
        width: 100%;
        object-fit: cover;
    }

    .gallery-item:nth-child(n+3) {
        display: none; /* Hide some items on mobile for brevity */
    }

    .gallery-carousel-wrapper {
        padding: 0;
        width: 100%;
        max-width: 100vw;
        overflow: hidden;
    }

    .gallery-carousel-container {
        width: 100%;
        max-width: 100%;
    }

    .gallery-carousel-wrapper .gallery-item {
        width: 50%; /* Show 2 items on mobile */
        padding: 0 5px;
        min-width: 0;
        flex-shrink: 0;
    }

    .gallery-carousel-wrapper .gallery-item img {
        width: 100%;
        height: auto;
    }

    .carousel-arrow {
        width: 40px;
        height: 40px;
        font-size: 1rem;
        /* The top/transform properties are inherited from the desktop rule */
    }

    .carousel-arrow.prev {
        left: 5px;
    }

    .carousel-arrow.next {
        right: 5px;
    }

    /* Footer Mobile */
    .footer-content {
        grid-template-columns: 1fr;
        text-align: center;
        width: 100%;
    }

    .footer-column {
        width: 100%;
    }

    .footer-column h4::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .social-links {
        justify-content: center;
    }

    .footer-security {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: var(--spacing-4);
    }

    /* Reorder tech sections on mobile */
    #design-inteligente .tech-image,
    #durabilidade .tech-image {
        order: 1;
        width: 100%;
    }

    #design-inteligente .tech-text,
    #durabilidade .tech-text {
        order: 2;
        width: 100%;
    }

    .tech-content {
        width: 100%;
        gap: var(--spacing-8);
    }

    .tech-image,
    .tech-text {
        width: 100%;
        max-width: 100%;
    }

    /* Video 9:16 Mobile Styles */
    .tech-video-container {
        max-width: 280px;
        margin: 0 auto;
    }

    .tech-text-large {
        min-height: auto;
        text-align: center;
    }

    .tech-text-large .section-title {
        font-size: var(--font-size-2xl);
    }

    .tech-text-large .tech-description {
        font-size: var(--font-size-md);
    }

    .tech-features-large li {
        font-size: var(--font-size-md);
        margin-bottom: var(--spacing-4);
    }

    .video-sound-btn {
        width: 44px;
        height: 44px;
        bottom: 15px;
        right: 15px;
        font-size: 1rem;
    }

    .back-to-top.active {
        bottom: 30px;
        transition: bottom var(--transition-normal);
    }

    /* AUTO-FIX: Corrigido seletores órfãos - apenas .feature-box existe no HTML */
    .feature-box .feature-icon {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

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

/* --- Policy Pages --- */
.policy-content-section {
    padding-top: 120px;
    padding-bottom: 80px;
    background-color: var(--color-white);
}

.policy-content-section .container {
    max-width: 800px;
    padding: 2rem;
}

.policy-content-section h1 {
    font-size: var(--font-size-3xl);
    /* margin-bottom and text-align are handled by the global h1, h2 rule */
    color: var(--color-heading-light-bg);
}

.policy-content-section p,
.policy-content-section li {
    margin-bottom: var(--spacing-4);
    /* line-height is now inherited from body's --line-height-base (1.6) */
    color: var(--color-gray-700);
}

.policy-content-section ul {
    list-style: disc;
    padding-left: var(--spacing-6);
}
.payment-logo {
    max-width: 250px;
    margin: var(--spacing-6) auto;
}

/* --- Contact Form --- */
.contact-form .form-group {
    margin-bottom: var(--spacing-6);
}
.contact-form .form-control {
    width: 100%;
    padding: var(--spacing-4);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--border-radius-md);
    font-size: var(--font-size-md);
    font-family: var(--font-family-base);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.contact-form .form-control:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(227, 16, 19, 0.1);
    outline: none;
}
.contact-form textarea.form-control {
    resize: vertical;
    min-height: 150px;
}

/* --- Fixed Bottom Bar (REMOVIDO) --- */
/* AUTO-FIX: Removed 67 lines of commented code (lines 1663-1730) */

/* CTA Inline - Strategic CTAs throughout the page */
.cta-inline {
    text-align: center;
    margin-top: var(--spacing-4);   /* 16px - reduzido de 40px */
    padding-top: var(--spacing-2);  /* 8px - reduzido de 32px */
}

/* CTA Button - Verde para checkout */
.cta-button,
.btn-cta {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    color: var(--color-white) !important;
    border-color: #10b981 !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.3) !important;
}

.cta-button:hover,
.btn-cta:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
    color: var(--color-white) !important;
    border-color: #059669 !important;
    box-shadow: 0 8px 25px rgba(16, 185, 129, 0.4) !important;
}

/* --- Extra Small Mobile (320px - 480px) --- */
@media (max-width: 480px) {
    :root {
        --mobile-margin-x: 15px;
        --spacing-4: 0.75rem;
        --spacing-6: 1rem;
        --spacing-8: 1.25rem;
    }

    .hero-text h1 {
        font-size: 1.5rem !important;
        line-height: 1.3;
    }

    .section-title {
        font-size: 1.25rem !important;
    }

    .section-description {
        font-size: 0.9rem;
    }

    .feature-box {
        padding: var(--spacing-6);
    }

    /* AUTO-FIX: Removidos estilos mobile órfãos de .fixed-bottom-bar e .btn-buy-now (não existem no HTML) */

    .btn, .btn-lg {
        font-size: 0.875rem;
        padding: 0.625rem 1rem;
    }
}

/* --- Animações Customizadas --- */
/* AUTO-FIX: Animação pulse duplicada removida - usando definição principal (linha 924) */

/* Scroll Progress Indicator */
.scroll-progress {
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 4px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
    z-index: 9999;
    transition: width 0.1s ease-out;
    box-shadow: 0 2px 10px rgba(227, 16, 19, 0.3);
}

/* Loading States */
.btn-loading {
    pointer-events: none;
    opacity: 0.7;
    position: relative;
}

.btn-loading::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    border: 2px solid var(--color-white);
    border-radius: 50%;
    border-top-color: transparent;
    animation: spinner 0.6s linear infinite;
}

@keyframes spinner {
    to { transform: rotate(360deg); }
}

/* Success/Error Animations */
.form-success {
    animation: successShake 0.5s ease-in-out;
}

.form-error {
    animation: errorShake 0.5s ease-in-out;
}

@keyframes successShake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-10px); }
    75% { transform: translateX(10px); }
}

@keyframes errorShake {
    0%, 100% { transform: translateX(0); }
    10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }
    20%, 40%, 60%, 80% { transform: translateX(5px); }
}

/* Skeleton Loader */
.skeleton {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeletonLoading 1.5s ease-in-out infinite;
}

@keyframes skeletonLoading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Tooltip Styles */
.tooltip {
    position: relative;
    display: inline-block;
    cursor: help;
}

.tooltip-text {
    visibility: hidden;
    width: 220px;
    background-color: var(--color-secondary);
    color: var(--color-white);
    text-align: center;
    border-radius: var(--border-radius-md);
    padding: var(--spacing-2) var(--spacing-4);
    position: absolute;
    z-index: 1000;
    bottom: 125%;
    left: 50%;
    margin-left: -110px;
    opacity: 0;
    transition: opacity 0.3s, visibility 0.3s;
    font-size: var(--font-size-sm);
    line-height: 1.4;
    box-shadow: var(--shadow-lg);
}

.tooltip-text::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: var(--color-secondary) transparent transparent transparent;
}

.tooltip:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* Trust Badges */
.trust-badges {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-6);
    margin-top: var(--spacing-6);
    flex-wrap: wrap;
}

.trust-badge {
    display: flex;
    align-items: center;
    gap: var(--spacing-2);
    padding: var(--spacing-2) var(--spacing-4);
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: var(--border-radius-md);
    font-size: var(--font-size-sm);
    color: var(--color-white);
    transition: background-color var(--transition-fast);
}

.trust-badge:hover {
    background-color: rgba(255, 255, 255, 0.2);
}

.trust-badge i {
    font-size: 1.2em;
    color: var(--color-accent);
}

/* Image Zoom Container */
.image-zoom-container {
    position: relative;
    overflow: hidden;
    cursor: zoom-in;
}

.image-zoom-container img {
    transition: transform var(--transition-slow);
}

.image-zoom-container:hover img {
    transform: scale(1.2);
}

/* Skip Navigation */
.skip-navigation {
    position: absolute;
    top: -100px;
    left: 0;
    background: var(--color-primary);
    color: var(--color-white);
    padding: var(--spacing-2) var(--spacing-4);
    text-decoration: none;
    z-index: 10000;
    transition: top var(--transition-fast);
}

.skip-navigation:focus {
    top: 0;
}

/* Enhanced Focus States */
*:focus-visible {
    outline: 3px solid var(--color-accent);
    outline-offset: 3px;
}

/* Form Field Enhancements */
.form-control {
    position: relative;
}

.form-control.has-error {
    border-color: #dc3545;
    animation: errorShake 0.5s ease-in-out;
}

.form-control.has-success {
    border-color: #28a745;
}

.form-feedback {
    display: none;
    font-size: var(--font-size-sm);
    margin-top: var(--spacing-2);
}

.form-feedback.error {
    display: block;
    color: #dc3545;
}

.form-feedback.success {
    display: block;
    color: #28a745;
}

/* Stagger Animations for Lists */
.stagger-animation > * {
    opacity: 0;
    animation: fadeInUp 0.6s ease-out forwards;
}

.stagger-animation > *:nth-child(1) { animation-delay: 0.1s; }
.stagger-animation > *:nth-child(2) { animation-delay: 0.2s; }
.stagger-animation > *:nth-child(3) { animation-delay: 0.3s; }
.stagger-animation > *:nth-child(4) { animation-delay: 0.4s; }
.stagger-animation > *:nth-child(5) { animation-delay: 0.5s; }

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Parallax Effect */
.parallax-section {
    position: relative;
    overflow: hidden;
}

.parallax-bg {
    position: absolute;
    top: -50%;
    left: 0;
    width: 100%;
    height: 200%;
    background-size: cover;
    background-position: center;
    transition: transform 0.1s ease-out;
}

/* Mobile Touch Targets Enhancement */
@media (max-width: 767px) {
    .btn, .btn-lg {
        min-height: 48px;
        min-width: 48px;
    }

    .mobile-menu-toggle,
    .btn-whatsapp-header,
    .back-to-top {
        min-width: 48px;
        min-height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}