/* Estilos Adicionais para Ateliê ++ */
html {
    scroll-behavior: auto;
    /* overflow-x: hidden; REMOVED */
    /* Controlado via JS */
}

/* 
  Estilos Adicionais para Ateliê ++ 
*/

:root {
    /* ... variable definitions ... */
    /* Nova Paleta de Cores - Ateliê ++ */
    --color-white: #FFFFFF;
    --color-pearl: #FAF8F5;
    --color-khaki: #DFDACF;
    --color-taupe: #A3968D;
    --color-cacao: #4D403A;
    --color-leather: #262626;
    --color-luxe-oat: #ede6da;
    /* Tom bege mais aquecido solicitado */

    /* Mapeamento de Uso */
    --bg-primary: var(--color-pearl);
    --bg-secondary: var(--color-taupe);
    /* Atualizado para Taupe (#A3968D) conforme solicitado */
    --accent-light: var(--color-khaki);
    --accent-gold: var(--color-taupe);
    --text-main: var(--color-leather);
    --text-muted: var(--color-cacao);
    --text-on-dark: var(--color-pearl);
    /* Contraste para fundo escuro */

    --glass-bg: rgba(250, 248, 245, 0.45);
    /* Pearl com transparência */
    --glass-border: rgba(163, 150, 141, 0.3);
    /* Taupe com transparência */
    --glass-blur: blur(15px);

    --font-serif: 'Cormorant Garamond', serif;
    --font-sans: 'Montserrat', sans-serif;
    --transition-smooth: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* FIX: Sticky Scroll Issue - Removing overflow from html if possible or handling differently */
html {
    /* overflow-x: hidden; REMOVE to fix sticky */
    overflow-x: clip;
    /* Modern way to prevent overflow without breaking sticky */
}

body {
    /* overflow-x: hidden; REMOVE to fix sticky */
    overflow-x: clip;
}

/* ... (mantém header, etc) ... */

/* ... (mantém header, etc) ... */

h1,
h2,
h3,
h4 {
    font-family: var(--font-serif);
    font-weight: 400;
    /* Cormorant Garamond fica melhor em 400/500 */
    line-height: 1.1;
    color: var(--text-main);
}

body {
    background-color: var(--bg-primary);
    color: var(--text-main);
    font-family: var(--font-sans);
    font-size: 17.6px;
    /* Novo padrão P solicitado */
    line-height: 1.7;
    /* overflow-x: hidden; REMOVED */
}

h1 {
    font-size: 3.2rem;
    margin-bottom: 25px;
}

h2 {
    font-size: 2.8rem;
    margin-bottom: 20px;
}

h3 {
    font-size: 2.2rem;
    margin-bottom: 18px;
}

h4 {
    font-size: 1.6rem;
    margin-bottom: 15px;
}

/* Headings Span Style (as seen in reference) */
h1 span,
h2 span,
h3 span {
    font-style: italic;
    color: var(--color-taupe);
    font-weight: 400;
}

p {
    font-family: var(--font-sans);
    font-size: 17.6px;
    color: var(--text-muted);
    margin-bottom: 1.5rem;
}

/* Badge (Rio Verde e Região) */
.badge {
    display: inline-block;
    font-family: var(--font-sans);
    font-size: 17.6px;
    font-weight: 500;
    color: var(--color-cacao);
    margin-bottom: 15px;
    letter-spacing: 0.5px;
}

h5 {
    font-family: var(--font-sans);
    font-size: 17.6px;
    font-weight: 600;
}

h6 {
    font-family: var(--font-sans);
    font-size: 17.6px;
    font-weight: 600;
}


/* Utilities */
.glass-effect {
    background: var(--glass-bg);
    -webkit-backdrop-filter: var(--glass-blur);
    backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
}

.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: var(--transition-smooth);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.mb-25 {
    margin-bottom: 25px;
}

.d-block {
    display: block;
}

.p-0 {
    padding: 0 !important;
}

.partner-logos-flex {
    display: flex;
    gap: 25px;
    margin-bottom: 25px;
    align-items: center;
}

/* Scroll Depth Blur Effect */
.scroll-blur-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 180px;
    z-index: 50;
    /* Reduzido para não cobrir o menu mobile (1050) */
    pointer-events: none;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    -webkit-mask-image: linear-gradient(to bottom, black 0%, transparent 100%);
    mask-image: linear-gradient(to bottom, black 0%, transparent 100%);
}

/* Header */
header {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    max-width: 1200px;
    z-index: 1000;
    padding: 12px 30px;
    border-radius: 50px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 40px;
    transition: var(--transition-smooth);
}

header.header-scrolled {
    top: 10px;
    width: 95%;
    background: rgba(255, 255, 255, 0.45);
    /* Vidro mais etéreo */
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05);
}

.logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    margin-right: auto;
}

.logo img {
    height: 45px;
    /* Tamanho elegante para o cabeçalho */
    width: auto;
    object-fit: contain;
}

nav ul {
    display: flex;
    list-style: none;
    gap: 20px;
    /* Reduzido levemente para caber os textos longos */
    align-items: center;
}

nav ul li {
    position: relative;
}

nav ul li a {
    text-decoration: none;
    color: var(--text-main);
    font-size: 0.75rem;
    /* Retornado ao tamanho elegante original */
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: var(--transition-smooth);
    padding: 10px 0;
}

nav ul li a:hover {
    color: var(--accent-gold);
}

/* Dropdown Styles */
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--color-white);
    min-width: 250px;
    padding: 15px 0;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: var(--transition-smooth);
    list-style: none;
    display: block;
    border: 1px solid var(--accent-light);
}

.dropdown:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-menu li {
    width: 100%;
}

.dropdown-menu li a {
    display: block;
    padding: 10px 25px;
    font-size: 0.7rem;
    /* Retornado ao tamanho original */
    color: var(--text-main);
    white-space: nowrap;
}

.dropdown-menu li a:hover {
    background: var(--color-pearl);
    color: var(--accent-gold);
    padding-left: 30px;
}

.btn-contact {
    display: inline-block;
    padding: 11px 26px;
    border-radius: 50px;
    text-decoration: none;
    font-size: 0.85rem;
    /* Retornado ao tamanho original */
    font-weight: 600;
    transition: var(--transition-smooth);
    border: 1px solid transparent;
}

/* Botão Principal (Showroom) */
.btn-filled {
    background: var(--accent-gold);
    color: var(--color-white);
}

.btn-filled:hover {
    background: var(--color-leather);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* Botão Secundário (WhatsApp) */
.btn-outline {
    background: transparent;
    color: var(--text-main);
    border-color: var(--accent-gold);
    margin-right: 12px;
}

.btn-outline:hover {
    background: rgba(163, 150, 141, 0.1);
    transform: translateY(-2px);
}

/* Hero Area */
.hero {
    height: 90vh;
    width: 100vw;
    max-width: none;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    position: relative;
    z-index: 10;
    /* Blindagem contra fundo fixo */
    background-color: var(--bg-primary);
    overflow: hidden;
}

.hero-carousel {
    position: absolute;
    top: 55px;
    /* Alinhado com a metade da altura aproximada do menu */
    left: 5vw;
    width: 90vw;
    height: 80vh;
    z-index: 1;
    overflow: hidden;
    border-radius: 15px 15px 60px 60px;
    /* Topo levemente arredondado, base bem arredondada */
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

.carousel-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}

.carousel-slide.active {
    opacity: 1;
}

.carousel-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Degradê mais escuro em baixo para o texto */
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.2) 40%, transparent 100%);
    z-index: 2;
}

.carousel-text-content {
    position: absolute;
    bottom: 60px;
    left: 50%;
    /* Centralização horizontal combinada com a posição inicial da animação */
    transform: translateX(-50%) translateY(30px);
    width: 95%;
    /* Ocupa quase toda a largura disponível do carrossel */
    max-width: 1600px;
    /* Esticamento máximo */
    z-index: 5;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 60px;
    padding: 50px 80px;
    border-radius: 40px;
    color: white;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    opacity: 0;
    transition: var(--transition-smooth);
}

/* Estado ativo combinando o translateX de centralização com o translateY final da animação */
.carousel-text-content.reveal.active {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.carousel-text-content .text-left {
    flex: 1;
}

.carousel-text-content .text-left h2 {
    font-size: 2.22rem;
    font-weight: 500;
    line-height: 1.2;
    width: 100%;
    color: var(--color-white);
    /* Fonte branca conforme solicitado */
}

.carousel-text-content .text-right {
    flex: 1;
}

.carousel-text-content .text-right p {
    font-size: 17.6px;
    /* Padronizado */
    line-height: 1.6;
    opacity: 1;
    width: 100%;
    color: var(--color-white);
    /* Fonte branca conforme solicitado */
    margin-bottom: 0;
}

@media (max-width: 968px) {
    .carousel-text-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        bottom: 30px;
    }

    .carousel-text-content .text-left h2 {
        font-size: 1.5rem;
    }
}

.about-section {
    padding: 100px 0 160px 0;
    /* Aumentado o fundo para dar mais espaço aos logos */
    background-color: var(--bg-primary);
    position: relative;
    overflow: visible;
    /* Garante que o selo e o texto gigante vazem */
    z-index: 10;
}

.about-container {
    width: 90vw;
    max-width: 1400px;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.about-flex {
    display: flex;
    align-items: center;
    gap: 80px;
    text-align: left;
}

.about-text-side {
    flex: 1.23;
}

.about-image-side {
    flex: 0.77;
}

.about-image-side img {
    width: 100%;
    height: auto;
    border-radius: 80px 0 0 0;
    /* Apenas superior esquerdo arredondado */
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

/* Stamp Seal Styles */
.about-image-side {
    position: relative;
}

.stamp-seal {
    position: absolute;
    top: -40px;
    right: -40px;
    width: 140px;
    height: 140px;
    background: var(--color-pearl);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    z-index: 20;
    /* Animação removida daqui para o logo não girar */
}

.rotating-text {
    position: absolute;
    width: 100%;
    height: 100%;
    animation: rotateStamp 20s linear infinite;
    display: flex;
    align-items: center;
    justify-content: center;
}

.circular-text {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.circular-text path {
    fill: none;
}

.circular-text text {
    fill: var(--color-taupe);
    font-size: 5.4px;
    /* Reduzido para garantir que caibam as duas frases */
    font-family: var(--font-sans);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.inner-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    /* Tamanho ajustado para o iso */
    height: 60px;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Removido a animação reversa para eliminar o efeito de movimento independente */
}

.inner-logo img {
    width: 100%;
    height: auto;
    filter: grayscale(100%) brightness(0.6);
    border-radius: 0;
    box-shadow: none;
}

@keyframes rotateStamp {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes rotateStampReverse {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(-360deg);
    }
}

@media (max-width: 968px) {
    .stamp-seal {
        width: 100px;
        height: 100px;
        top: -20px;
        right: -10px;
    }

    .inner-logo {
        width: 30px;
        height: 30px;
    }
}

/* Heading styling handled globally for standardisation */

.about-text-side p {
    font-size: 17.6px;
    /* Padronizado */
    line-height: 1.7;
    max-width: 600px;
    margin-bottom: 30px;
}

.partner-brands {
    margin-top: 50px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 45px;
}

.partner-brands img {
    width: auto;
    filter: brightness(0) opacity(0.35);
    /* Força silhueta uniforme */
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    object-fit: contain;
}

/* Ajustes Ópticos Individuais */
.partner-brands img[alt*="Uniflex"] {
    height: 22px;
    transform: translateY(1px);
    /* Nudge para alinhar base visual */
}

.partner-brands img[alt*="Donatelli"] {
    height: 34px;
    transform: translateY(-2px);
    /* Sobe para compensar subtexto 'Desde 1943' */
}

.partner-brands img[alt*="Maison"] {
    height: 26px;
    transform: translateY(0);
}

.partner-brands img[alt*="Muse"] {
    height: 38px;
    transform: translateY(-4px);
    /* Sobe para compensar texto manuscrito na base */
}

.partner-brands img:hover {
    filter: brightness(1) opacity(1);
    transform: translateY(-6px);
    /* Elevação perceptível a partir da base corrigida */
}

/* Big Typography Divider */
/* Big Typography Divider */
.big-type-divider {
    font-family: var(--font-serif);
    font-size: 24vw;
    /* Massivo */
    font-weight: 400;
    line-height: 0.8;
    text-align: center;
    color: var(--color-luxe-oat);
    /* Preenchimento sólido cor da dobra */
    /* Stroke removido para efeito flat */
    opacity: 1;
    /* Opacidade total para fusão perfeita */
    position: absolute;
    bottom: -13vw;
    /* Descido um pouco mais para fundir melhor e dar espaço aos logos */
    left: -12vw;
    /* Empurrado bem para a esquerda (canto) */
    width: auto;
    /* Remove centralização forçada */
    z-index: -1;
    /* Colocado definitivamente atrás da imagem e de todo o conteúdo */
    pointer-events: none;
    letter-spacing: -0.05em;
    white-space: nowrap;
    /* Impede quebra de linha crítica */
    -webkit-user-select: none;
    user-select: none;
}

/* Parent Section Adjustment */

/* Sections General */
section {
    padding: 120px 8%;
    max-width: 1400px;
    margin: 0 auto;
}

.section-header {
    text-align: center;
    margin-bottom: 60px;
    padding: 0 8%;
}

.section-title {
    max-width: 800px;
    /* Aperta a caixa para distribuir melhor o texto em 2 linhas */
    margin-left: auto;
    margin-right: auto;
}

.subtitle {
    color: var(--text-muted);
    max-width: 850px;
    margin: 0 auto;
    text-align: center;
    /* Centralização do parágrafo padrão P */
}

/* Seção com Fundo Luxe Oat (Técnica Segura) */
.benefits-section {
    position: relative;
    padding: 220px 0 100px 0;
    /* Aumentado para dar mais "altura" à dobra clara */
    /* Aumentado top para compensar margin removida */
    margin-top: 0;
    /* Remove gap transparente */
    z-index: 2;
    /* Garante cobertura */
}

.benefits-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    background-color: var(--color-luxe-oat);
    z-index: -1;
}



/* Grid Layout: 2 Blocos por linha */
.benefits-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /* Força 2 colunas */
    gap: 25px;
    margin-top: 60px;
}

@media (max-width: 768px) {
    .benefits-grid {
        grid-template-columns: 1fr;
        /* Volta para 1 coluna no mobile */
    }
}

/* Card Styling: Taupe & Cacao Theme */
.benefit-card {
    padding: 60px 40px;
    /* Aumentado para elegância */
    border-radius: 35px;
    /* Default: Gradiente Taupe Suave (Ajuste fino para sutileza) */
    background: linear-gradient(145deg, var(--color-taupe) 0%, #968a82 100%);
    color: var(--color-pearl);
    /* Texto Claro */
    border: none;
    transition: var(--transition-smooth);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    cursor: default;
    position: relative;
    overflow: hidden;
}

.benefit-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Pontinhos brancos com opacidade reduzida em 10% */
    background-image: radial-gradient(rgba(250, 248, 245, 0.18) 1.2px, transparent 1.2px);
    background-size: 8px 8px;
    /* Começa forte no topo e vai sumindo */
    -webkit-mask-image: linear-gradient(to bottom, black 0%, transparent 60%);
    mask-image: linear-gradient(to bottom, black 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

/* Hover Effect: Elevação e Profundidade */
.benefit-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.15);
}

/* "Um deles Cacao" - Escolhendo o segundo para destaque */
.benefit-card:nth-child(2) {
    /* Gradiente Cacao Suave */
    background: linear-gradient(145deg, var(--color-cacao) 0%, #3e332e 100%);
}

/* Ícones Minimalistas - Container */
.benefit-card .icon {
    width: 60px;
    height: 60px;
    background: rgba(250, 248, 245, 0.1);
    /* Círculo sutil */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
    color: var(--color-pearl);
    transition: var(--transition-smooth);
    position: relative;
    z-index: 2;
}

/* Ícones SVG */
.benefit-card .icon svg {
    width: 28px;
    height: 28px;
    fill: currentColor;
    /* Herda a cor Pearl */
}

/* Ícone PNG */
.benefit-card .icon .icon-iso {
    width: 28px;
    height: 28px;
    background: url('iso.png') no-repeat center center / contain;
    /* Torna o ícone branco (Pearl) inicialmente */
    filter: brightness(0) invert(1);
    transition: var(--transition-smooth);
}

/* Hover no Ícone: Inversão de Cores */
.benefit-card:hover .icon {
    background: var(--color-pearl);
    color: var(--color-taupe);
    transform: scale(1.1);
}

/* No hover do card, o ícone volta a ser escuro */
.benefit-card:hover .icon .icon-iso {
    filter: brightness(0.25);
    /* Taupe aproximado */
}

/* Ajuste específico para o card Cacao no hover */
.benefit-card:nth-child(2):hover .icon {
    color: var(--color-cacao);
}

.benefit-card h4 {
    /* Herda h4 global */
    color: var(--color-pearl);
    position: relative;
    z-index: 2;
}

.benefit-card p {
    color: rgba(250, 248, 245, 0.85);
    /* Pearl com leve transparência */
    font-size: 17.6px;
    /* Padronizado */
    line-height: 1.6;
    position: relative;
    z-index: 2;
}

/* Visual Break: Full Width Fixed Reveal */
/* Visual Break: Full Width Image */
.visual-break {
    position: relative;
    width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    margin-top: 0;
    margin-bottom: 50px;
    height: 95vh;

    /* Imagem aplicada diretamente na seção */
    background: url('FOTOS ATELIE/DSC1532.webp') no-repeat center center;
    background-size: cover;
    background-attachment: fixed;

    max-width: none !important;
    padding: 0 !important;
    overflow: hidden;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Filtro de Pixels de TV (Pontinhos) */
.visual-break::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Overlay para escurecer um pouco mais conforme solicitado */
    background-color: rgba(0, 0, 0, 0.35);
    /* Malha de pixels com presença sutilmente maior */
    background-image: radial-gradient(rgba(0, 0, 0, 0.3) 1px, transparent 1px),
        radial-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1px);
    background-size: 3px 3px;
    background-position: 0 0, 1.5px 1.5px;
    z-index: 1;
    pointer-events: none;
}

/* Texto Marca D'água - Assinatura */
.visual-break .watermark-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Qwitcher Grypen', cursive;
    font-weight: 400;
    font-style: normal;
    font-size: clamp(8rem, 25vw, 18rem);
    color: rgba(255, 255, 255, 0.65);
    pointer-events: none;
    z-index: 2;
    text-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    white-space: nowrap;
    opacity: 0.95;
    letter-spacing: 0.02em;
}

/* Garante que elementos internos não atrapalhem o background */
.visual-break .image-wrapper,
.visual-break img {
    display: none;
}

/* 4. Camadas de Cobertura (Sections Vizinhas devem tapar a imagem) */

/* Ajuste específico para Produtos (Full Width Background) */
.products-showcase {
    position: relative;
    /* Técnica de Full Width Breakout */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    max-width: none;

    margin-top: 0;
    padding-top: 100px;
    padding-bottom: 80px;

    /* Fundo Split */
    background: linear-gradient(to bottom, var(--bg-primary) 60%, var(--color-luxe-oat) 60%);
}

/* Container interno para centralizar o conteúdo */
.products-showcase .product-info-block {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 8%;
    text-align: left;
    /* Alinhamento à esquerda solicitado */
}

.products-showcase .section-title {
    margin-left: 0;
    max-width: none;
    text-align: left;
}

.products-showcase p {
    text-align: left;
    margin-left: 0;
}

/* Ajuste específico para Decor Section (Full Width Background) */
.decor-section {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    max-width: none;
    background-color: var(--color-luxe-oat);
}

.decor-section .who-we-are {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 8% !important;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
}

@media (max-width: 768px) {
    .decor-section .who-we-are {
        grid-template-columns: 1fr;
    }
}

/* Layout da lista clean com checkbox */
.decor-section .clean-list {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-left: 0;
}

.decor-section .clean-list li {
    list-style: none;
    display: flex;
    align-items: flex-start;
    gap: 15px;
    font-size: 17.6px;
    /* Padronizado */
    line-height: 1.5;
    color: var(--color-cacao);
}

/* Ícone Checkbox customizado via CSS */
.decor-section .clean-list li::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    margin-top: 2px;

    /* SVG de Check sutil em Cacao escuro */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234D403A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

/* -- Estilos Restaurados de Produtos -- */
.product-categories {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 40px;
    margin-top: 50px;
}

/* Estilo Base de Card para Todos */
.cat-item {
    background: #A3968D;
    padding: 35px;
    border-radius: 30px;
    height: 100%;
    /* Garante altura total */
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: hidden;
}

.cat-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Pontinhos brancos com opacidade reduzida em 10% */
    background-image: radial-gradient(rgba(255, 255, 255, 0.22) 1.2px, transparent 1.2px);
    background-size: 8px 8px;
    /* Começa mais forte no topo e vai sumindo para baixo */
    -webkit-mask-image: linear-gradient(to bottom, black 0%, transparent 60%);
    mask-image: linear-gradient(to bottom, black 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.cat-item h3 {
    /* Herda h3 global */
    font-size: 1.8rem;
    /* Tamanho específico para o card */
    color: #FFFFFF;
    position: relative;
    z-index: 2;
}

.cat-item ul {
    list-style: none;
    flex-grow: 1;
    position: relative;
    z-index: 2;
}

.cat-item ul li {
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    margin-bottom: 12px;
    font-size: 17.6px;
    /* Padronizado */
    color: rgba(255, 255, 255, 0.9);
}

/* Card de Destaque (Automação) */
.highlighting {
    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('MG_0542-555384cd.webp');
    background-size: cover;
    background-position: center;
    color: white;
}

.highlighting h3 {
    color: var(--color-pearl);
    font-family: var(--font-serif);
    /* Mantendo consistência opcional */
}

.highlighting ul li {
    border-color: rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.85);
}

/* Contact Section */
.contact-section {
    position: relative;
    background: #A3968D !important;
    /* Cor Taupe Sólida Protegida */
    padding: 120px 8%;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    max-width: none;
    color: var(--color-pearl);
    z-index: 100;
    margin-top: -2px;
    border: none !important;
}

.contact-section::before {
    content: none !important;
    display: none !important;
}

/* Divisor de Pontinhos Restaurado (Halftone Transition) */
/* Divisor de Pontinhos Restaurado (Halftone Transition) */
.contact-section::after {
    content: '';
    position: absolute;
    top: -150px;
    left: 0;
    width: 100%;
    height: 155px;
    background-image: radial-gradient(#A3968D 1.3px, transparent 1.3px);
    background-size: 6px 6px;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, black 100%);
    pointer-events: none;
    z-index: 101;
}

/* Fix for Products Page Artifacts ("Crack") */
.contact-page-specific {
    margin-top: -5px !important;
    /* Forces a tighter overlap to hide 1px gaps */
}

.contact-page-specific::after {
    /* Explicitly prevent mask tiling which can cause horizontal line artifacts */
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    /* Ensure background dots repeat seamlessly */
    background-repeat: repeat;
    /* Shift slightly to align with pixel grid */
    top: -151px;
    height: 156px;
}

.contact-container {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 100px;
    align-items: flex-start;
}

.contact-info .section-title {
    /* Herda h2 global */
    color: var(--color-pearl);
    margin-bottom: 40px;
    max-width: none;
    /* No contato a largura é controlada pelo grid */
    margin-left: 0;
}

.contact-info .section-title span {
    /* Estilização específica para contraste no fundo Taupe do contato */
    color: var(--color-cacao);
    font-style: italic;
}

.contact-details {
    list-style: none;
    padding: 0;
}

.contact-details li {
    margin-bottom: 25px;
    display: flex;
    flex-direction: row;
    /* Alinhamento horizontal para o ícone */
    align-items: flex-start;
    gap: 15px;
}

.contact-details li .contact-icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    margin-top: 4px;
    color: var(--color-cacao);
    /* Cor de destaque nos ícones */
}

.contact-details li .contact-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.contact-details li strong {
    font-family: var(--font-sans);
    text-transform: uppercase;
    font-size: 17.6px;
    /* Padronizado */
    letter-spacing: 1px;
    color: var(--color-cacao);
}

.contact-details li span {
    font-size: 17.6px;
    /* Padronizado */
    font-family: var(--font-sans);
    font-weight: 500;
    line-height: 1.4;
}

.instagram-link {
    color: inherit;
    text-decoration: none;
    transition: var(--transition-smooth);
}

.instagram-link:hover {
    color: var(--color-cacao);
    text-decoration: underline;
}

/* Form Styling */
.contact-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
    background: rgba(255, 255, 255, 0.05);
    padding: 40px;
    border-radius: 30px;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid var(--color-cacao);
    /* Borda Sólida Cacao */
}

.form-group input,
.form-group textarea {
    width: 100%;
    padding: 15px 25px;
    border-radius: 15px;
    border: 1px solid var(--color-cacao);
    /* Borda Sólida Cacao */
    background: rgba(255, 255, 255, 0.1);
    color: var(--color-cacao);
    font-family: var(--font-sans);
    font-size: 17.6px;
    /* Padronizado */
    font-weight: 700;
    /* Espessura igual ao 'strong' */
    transition: var(--transition-smooth);
}

.form-group input::placeholder,
.form-group textarea::placeholder {
    color: rgba(77, 64, 58, 0.6);
    font-weight: 600;
    /* Levemente mais fino que o texto real para legibilidade */
}

.form-group input:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--color-cacao);
    background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 0 0 1px var(--color-cacao);
    /* Reforço no foco */
}

.contact-form .btn-filled {
    margin-top: 20px;
    background: var(--color-cacao);
    color: var(--color-pearl);
    border: none;
    align-self: flex-start;
    padding: 15px 40px;
    border-radius: 50px;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition-smooth);
}

.contact-form .btn-filled:hover {
    background: var(--color-leather);
    transform: translateY(-2px);
}

/* Mobile Adjustments for Contact */
@media (max-width: 968px) {
    .contact-container {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .contact-info .section-title {
        text-align: center;
    }

    .contact-details {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .contact-details li {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }

    .contact-details li .contact-text {
        align-items: center;
    }

    .contact-form .btn-filled {
        align-self: center;
        width: 100%;
    }
}

/* Footer */
footer {
    padding: 6px 8%;
    /* Faixa ultra-estreita e minimalista */
    background: #4D403A !important;
    text-align: center;
    font-size: 17.6px;
    color: var(--color-white) !important;
    border: none !important;
    margin-top: -1px;
    position: relative;
    z-index: 100;
}

footer p,
footer span {
    color: var(--color-white) !important;
    padding: 0;
    margin: 0;
}

.dev-credits {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 0;
    line-height: 1;
    /* Garante altura mínima do texto */
    /* Removido para centralizar na faixa estreita */
    opacity: 0.8;
    text-decoration: none;
    /* Remove sublinhado do link */
    cursor: pointer;
    transition: opacity 0.3s ease;
}

.dev-credits:hover {
    opacity: 1;
}

.dev-credits span {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--color-white) !important;
}

.dev-logo {
    height: 12px;
    /* Extremamente pequeno e discreto */
    width: auto;
    filter: brightness(0) invert(1);
    /* Deixa o logo branco para contrastar com o fundo escuro */
}


/* Mobile */
@media (max-width: 968px) {

    .header-btns,
    nav {
        display: none;
    }

    .hero {
        height: auto;
        padding-top: 120px;
        flex-direction: column;
    }

    .hero-bg {
        position: relative;
        width: 100%;
        right: 0;
        min-height: 300px;
        margin-top: 30px;
    }

    .hero h1 {
        font-size: 2.5rem;
    }

    .hero-content {
        padding: 30px;
    }
}

/* Logotipos de Parceiros Padronizados */
.brand-logo {
    height: 25px !important;
    /* Tamanho reduzido visualmente */
    width: auto;
    object-fit: contain;
    /* Tom de cinza uniforme */
    filter: grayscale(100%) brightness(0) opacity(0.6);
    transition: all 0.3s ease;
}

.brand-logo:hover {
    filter: grayscale(0%) brightness(1) opacity(1);
}

/* Carousel Slides */
.slide-1 {
    background-image: url('CARROSSEL HOME/01.webp');
}

.slide-2 {
    background-image: url('CARROSSEL HOME/02.webp');
}

.slide-3 {
    background-image: url('CARROSSEL HOME/03.webp');
}

.slide-4 {
    background-image: url('CARROSSEL HOME/04.webp');
}

.slide-5 {
    background-image: url('CARROSSEL HOME/05.webp');
}

.stats-img {
    width: 100%;
    border-radius: 40px;
    height: 500px;
    object-fit: cover;
}

/* --- QUEM SOMOS PAGE HERO STYLES --- */

.quem-somos-hero {
    width: 100%;
    min-height: 85vh;
    /* Occupy good portion of the screen */
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-white);
    padding: 140px 20px 60px;
    /* Top padding to clear fixed header */
}

.quem-somos-hero .hero-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 900px;
    margin: 0 auto;
}

.hero-overline {
    font-family: var(--font-sans);
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-leather);
    /* Close to black */
    text-transform: capitalize;
    margin-bottom: 20px;
    letter-spacing: -0.01em;
}

.hero-title {
    font-family: var(--font-serif);
    font-size: 5.5rem;
    /* Large impact */
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-leather);
    margin: 0 0 30px 0;
}

.hero-description {
    font-family: var(--font-sans);
    font-size: 1.125rem;
    /* approx 18px */
    line-height: 1.6;
    color: var(--color-leather);
    opacity: 0.9;
    max-width: 650px;
    margin-bottom: 40px;
    font-weight: 500;
}

.hero-buttons {
    display: flex;
    align-items: center;
    gap: 20px;
}

/* Specific Button Styles for Quem Somos */
.btn-brown {
    background-color: #79604C;
    /* Warm brown */
    color: #fff;
    border: 1px solid #79604C;
}

.btn-brown:hover {
    background-color: var(--color-cacao);
    border-color: var(--color-cacao);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.btn-light-outline {
    background-color: transparent;
    color: var(--color-leather);
    border: 1px solid #E6E6E6;
    /* Very subtle border */
}

.btn-light-outline:hover {
    border-color: var(--color-leather);
    background-color: var(--color-white);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}

/* Responsive */
@media (max-width: 768px) {
    .quem-somos-hero {
        padding: 120px 20px 60px;
        min-height: unset;
    }

    .hero-title {
        font-size: 3.2rem;
        margin-bottom: 20px;
    }

    .hero-description {
        font-size: 1rem;
        padding: 0 10px;
        margin-bottom: 30px;
    }

    .hero-buttons {
        width: 100%;
        justify-content: center;
    }

    .btn-contact {
        padding: 12px 30px;
        /* Slightly larger targets */
    }
}

/* --- Origin Section (Segunda Dobra Quem Somos) --- */

.origin-section {
    background-color: var(--color-pearl);
    padding: 120px 8%;
    display: flex;
    justify-content: center;
    text-align: center;
}

.origin-content {
    max-width: 800px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.origin-label {
    display: block;
    font-family: var(--font-sans);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--color-leather);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 25px;
}

.origin-content h2 {
    font-size: 3rem;
    /* Ajustado levemente para impacto */
    margin-bottom: 30px;
    line-height: 1.15;
    color: var(--color-leather);
}

.origin-content p {
    font-size: 1.1rem;
    line-height: 1.7;
    color: var(--color-cacao);
    margin-bottom: 45px;
    max-width: 700px;
    /* Limita a largura do texto para leitura confortável */
}

.origin-actions {
    display: flex;
    align-items: center;
    gap: 30px;
}

/* Botão Marcas (Light Filled) */
.btn-light-filled {
    background-color: #F0EBE5;
    /* Um tom levemente mais escuro que Pearl */
    color: var(--color-leather);
    border: 1px solid transparent;
}

.btn-light-filled:hover {
    background-color: var(--color-taupe);
    /* Gold/Taupe no hover */
    color: var(--color-white);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}

/* Link Saiba Mais */
.link-arrow {
    font-family: var(--font-sans);
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-leather);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: var(--transition-smooth);
}

.link-arrow .arrow {
    display: inline-block;
    transition: transform 0.3s ease;
}

.link-arrow:hover {
    color: var(--color-taupe);
}

.link-arrow:hover .arrow {
    transform: translateX(5px);
}

/* Mobile Responsiveness for Origin */
@media (max-width: 768px) {
    .origin-section {
        padding: 80px 20px;
    }

    .origin-content h2 {
        font-size: 2.2rem;
        word-wrap: break-word;
        /* Evita quebra forçada */
    }

    .origin-content p {
        font-size: 1rem;
    }

    .origin-actions {
        flex-direction: row;
        /* Mantém em linha como no design, se couber */
        gap: 25px;
    }
}

/* --- Scroll Stack Cards (Terceira Dobra) --- */

.scroll-stack-container {
    width: 100%;
    position: relative;
    padding-bottom: 0;
    /* No padding bottom to let next section flow naturally */
}

.stack-card {
    position: -webkit-sticky;
    /* Safari support */
    position: sticky;
    top: 0;
    height: 100vh;
    /* Ocupa a tela toda */
    width: 100%;
    max-width: none;
    /* Override global section max-width */
    margin: 0;
    /* Override global section margin */
    background-color: var(--color-white);
    /* Garante overlay opaco */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 80px 8%;
    box-shadow: 0 -25px 50px rgba(0, 0, 0, 0.08);
    /* Sombra mais pronunciada para visualização do efeito */
    z-index: 1;
    border-top: 1px solid rgba(0, 0, 0, 0.03);
}

/* Garante que o segundo card fique por cima */
.section-curadoria {
    z-index: 1;
}

.section-consultoria {
    z-index: 2;
}

.section-materiais {
    z-index: 3;
}

.section-acabamento {
    z-index: 4;
}

.stack-content {
    max-width: 1400px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    /* Centraliza verticalmente o conteúdo */
    justify-content: space-between;
    gap: 60px;
    position: relative;
}

/* Coluna de Texto */
.stack-text-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    max-width: 550px;
    position: relative;
}

.stack-index {
    position: absolute;
    top: 100px;
    /* Ajuste para não colar no topo absoluto da tela */
    left: 0;
    font-family: var(--font-sans);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--color-leather);
    letter-spacing: 0.5px;
}

.stack-main-text {
    margin-top: 0;
    /* Centralizado natural */
}

.stack-overline {
    display: block;
    font-family: var(--font-sans);
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--color-leather);
    margin-bottom: 15px;
    text-transform: capitalize;
}

.stack-title {
    font-size: 3.5rem;
    line-height: 1.1;
    margin-bottom: 30px;
    color: var(--color-leather);
}

.stack-desc {
    font-size: 1.1rem;
    line-height: 1.7;
    color: var(--color-cacao);
    margin-bottom: 40px;
    max-width: 480px;
}

.stack-actions {
    display: flex;
    align-items: center;
    gap: 25px;
}

.btn-outline-dark {
    display: inline-block;
    padding: 12px 30px;
    border-radius: 50px;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 600;
    background: transparent;
    color: var(--color-leather);
    border: 1px solid #E6E6E6;
    transition: var(--transition-smooth);
}

.btn-outline-dark:hover {
    border-color: var(--color-leather);
    transform: translateY(-2px);
}

/* Coluna de Imagem */
.stack-image-col {
    flex: 1.2;
    height: 80%;
    /* Altura relativa ao card */
    display: flex;
    justify-content: center;
    align-items: center;
}

.image-wrapper-stack {
    width: 100%;
    height: 100%;
    background-color: #E6E6E6;
    /* Placeholder color bg */
    border-radius: 40px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

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

/* Mobile Responsiveness for Stack Cards */
@media (max-width: 968px) {
    .stack-card {
        padding: 120px 20px 40px;
        /* Top padding maior para compensar header fixo */
        height: auto;
        min-height: 100vh;
        flex-direction: column;
        justify-content: flex-start;
    }

    .stack-content {
        flex-direction: column;
        gap: 40px;
    }

    .stack-text-col {
        max-width: 100%;
        height: auto;
        justify-content: flex-start;
        text-align: left;
    }

    .stack-index {
        position: relative;
        top: 0;
        margin-bottom: 30px;
        display: block;
    }

    .stack-title {
        font-size: 2.5rem;
    }

    .stack-image-col {
        width: 100%;
        height: 400px;
        flex: none;
    }

    .image-wrapper-stack {
        border-radius: 30px;
    }
}

/* --- Timeline Section (Trajetória) --- */

.timeline-section {
    background-color: var(--color-pearl);
    padding: 120px 8%;
    position: relative;
    overflow: hidden;
}

.timeline-section .section-header {
    text-align: center;
    margin-bottom: 100px;
}

.section-overline {
    display: block;
    font-family: var(--font-sans);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--color-taupe);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.timeline-main-title {
    font-family: var(--font-serif);
    font-size: 3.2rem;
    line-height: 1.1;
    color: var(--color-leather);
    margin-bottom: 25px;
}

.timeline-subtitle {
    font-family: var(--font-sans);
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--color-cacao);
    max-width: 600px;
    margin: 0 auto;
}

.timeline-container {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
}

/* Linha Central */
.timeline-line {
    position: absolute;
    left: 50%;
    top: 50px;
    bottom: 50px;
    width: 1px;
    background-color: var(--color-khaki);
    transform: translateX(-50%);
    z-index: 1;
}

.timeline-line-progress {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    background-color: var(--color-taupe);
    height: 0%;
    /* Controlado via JS */
    transition: height 0.1s linear;
    /* Glow Effect */
    box-shadow: 0 0 10px 1px rgba(163, 150, 141, 0.5);
}

/* Linha com ponto inicial e final decorativos */
/* Estados Ativos para Start/End */
.timeline-line.active-start::before {
    box-shadow: 0 0 15px rgba(163, 150, 141, 0.8);
    transition: box-shadow 0.3s ease;
}

.timeline-line.active-end::after {
    box-shadow: 0 0 15px rgba(163, 150, 141, 0.8);
    transition: box-shadow 0.3s ease;
}

.timeline-line::before,
.timeline-line::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 8px;
    /* Ligeiramente maior */
    height: 8px;
    background-color: var(--color-taupe);
    /* Já são preenchidos por padrão */
    border-radius: 50%;
    z-index: 2;
}

.timeline-line::before {
    top: 0;
}

.timeline-line::after {
    bottom: 0;
}


.timeline-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 120px;
    position: relative;
    z-index: 2;
}

.timeline-row:last-child {
    margin-bottom: 0;
}

.timeline-col {
    width: 45%;
    /* Menos que 50% para dar espaço ao centro */
}

/* Imagem */
.timeline-img-wrapper {
    width: 100%;
    aspect-ratio: 1/1;
    /* Quadrado conforme referência */
    border-radius: 40px;
    overflow: hidden;
    /* transition: transform 0.6s ease; */
    background-color: #E6E6E6;
}

/* Correção de enquadramento para foto 2024 */
.img-adjust-top {
    object-position: top !important;
}

.timeline-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.8s ease, filter 0.8s ease;
    /* Adicionado transição para filter */
    filter: grayscale(100%);
    /* Padrão: Preto e Branco */
}

/* Quando a linha (row) fica ativa, a imagem ganha cor */
.timeline-row.active .timeline-img {
    filter: grayscale(0%);
}

.timeline-img-wrapper:hover .timeline-img {
    transform: scale(1.05);
    /* Zoom sutil */
    filter: grayscale(0%);
    /* Hover também revela a cor */
}

/* Texto */
.timeline-text-side {
    position: relative;
    padding: 0 40px;
}

/* Ponto de conexão no eixo central para cada item */
.timeline-row::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 14px;
    height: 14px;
    background-color: var(--color-pearl);
    /* Centro vazio padrão */
    border: 2px solid var(--color-taupe);
    border-radius: 50%;
    z-index: 3;
    transition: all 0.4s ease;
}

/* Estado Ativo: Preenchimento e Glow */
.timeline-row.active::after {
    background-color: var(--color-taupe);
    box-shadow: 0 0 15px rgba(163, 150, 141, 0.6);
    transform: translate(-50%, -50%) scale(1.2);
    /* Pulsação sutil */
}

/* Date Marker */
.timeline-date {
    display: block;
    font-family: var(--font-serif);
    font-size: 1.5rem;
    color: var(--color-taupe);
    margin-bottom: 15px;
    font-style: italic;
}

.timeline-heading {
    font-family: var(--font-serif);
    font-size: 2.2rem;
    color: var(--color-leather);
    margin-bottom: 20px;
    line-height: 1.2;
}

.timeline-desc {
    font-family: var(--font-sans);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--color-cacao);
    margin-bottom: 30px;
}

.timeline-actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.timeline-tag {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
    color: var(--color-taupe);
    padding: 5px 15px;
    border: 1px solid var(--color-khaki);
    border-radius: 50px;
}

/* Layout Alternado */
/* O padrão já é Img Esq / Texto Dir. */
/* Reverse: Texto Esq / Img Dir */
/* .timeline-row.reverse .timeline-col:first-child { order: 2; } REMOVIDO PARA CORREÇÃO ZIGZAG */

/* Mas na verdade queremos que o texto fique na esquerda (45%) e img na direita (45%) */
/* O HTML já inverte a ordem dos colunas: TextSide vem primeiro no HTML do .reverse */
/* Então TextSide (1o filho) fica na esquerda, ImgSide (2o filho) na direita. Tudo certo. */

.timeline-row.reverse .timeline-text-side {
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}


/* Mobile Timeline */
@media (max-width: 968px) {
    .timeline-section {
        padding: 80px 20px;
    }

    .timeline-line {
        left: 20px;
        /* Linha vai para a esquerda */
        transform: none;
        top: -50px;
        /* Sobe o ponto inicial para separar do primeiro item */
        bottom: 0;
    }

    .timeline-line::before,
    .timeline-line::after {
        left: 50%;
        /* Mantém centralizado na linha (que já tem width 1px) */
        transform: translateX(-50%);
    }

    .timeline-row,
    .timeline-row.reverse {
        flex-direction: column;
        /* Pilha vertical sempre */
        margin-bottom: 80px;
        align-items: flex-start;
        padding-left: 50px;
        /* Espaço para a linha */
    }

    .timeline-row::after {
        left: 20px;
        /* Ponto na linha */
        top: 0;
        /* No topo do item (ao lado da data) */
        transform: translate(-50%, 50%);
        /* Ajuste fino */
    }

    .timeline-col {
        width: 100%;
        margin-bottom: 30px;
    }

    .timeline-image-side {
        order: 2;
        /* Imagem sempre depois do texto no mobile */
    }

    .timeline-text-side {
        order: 1;
        /* Texto sempre primeiro */
        padding: 0;
        text-align: left !important;
        /* Força alinhamento esquerdo mesmo no reverse */
        align-items: flex-start !important;
    }

    .timeline-date {
        margin-top: -5px;
        /* Alinha visualmente com o ponto */
    }

    .timeline-heading {
        font-size: 1.8rem;
    }

    .timeline-img-wrapper {
        border-radius: 20px;
    }

}

/* --- Products Page Partners Section --- */
/* --- Products Page Partners Section --- */
.partners-section {
    padding: 60px 0;
    /* Mais compacto verticalmente */
    background-color: var(--color-pearl);
    /* Fundo bege */
    text-align: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.partners-label {
    font-family: var(--font-sans);
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--color-taupe);
    margin-bottom: 40px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.partners-logos {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    /* Linha única */
    gap: 70px;
    /* Espaçamento generoso */
    max-width: 100%;
    margin: 0 auto;
    overflow-x: auto;
    /* Scroll horizontal elegante se necessário */
    padding-bottom: 10px;
    /* Para scrollbar invisivel não cortar */
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

.partners-logos::-webkit-scrollbar {
    display: none;
}

.partners-logos img {
    height: 22px;
    /* Logo pequeno e elegante */
    width: auto;
    /* Uniformiza todos os logos como silhuetas negras primeiro */
    filter: grayscale(100%) brightness(0);
    opacity: 0.5;
    /* Controla tom de cinza final via transparencia */
    transition: all 0.4s ease;
    cursor: default;
    flex-shrink: 0;
}

/* Hover Effect Removed - Always Gray */
.partners-logos img:hover {
    opacity: 0.8;
    /* Slight darkening only */
    transform: none;
    filter: grayscale(100%) brightness(0);
    /* Keep gray/black */
}

/* Muse Logo Adjustment */
.partners-logos img.logo-muse {
    height: 38px;
    /* Significantly larger */
    margin-top: -4px;
    /* Optical adjustment */
}

@media (max-width: 768px) {
    .partners-section {
        padding: 50px 0;
    }

    .partners-logos {
        justify-content: flex-start;
        /* Alinhado a esquerda para scroll */
        padding-left: 20px;
        padding-right: 20px;
        gap: 40px;
    }

    .partners-logos img {
        height: 20px;
    }

    .partners-logos .mobile-hide {
        display: block;
        /* Garante visibilidade no mobile */
    }
}

/* --- Brands Showcase / References Section --- */
.brands-showcase-section {
    padding: 100px 5%;
    background-color: var(--color-pearl);
    /* Alterado para bege */
}

.brands-showcase-container {
    max-width: 1200px;
    margin: 0 auto;
}

.brands-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 80px;
    gap: 50px;
}

.header-left {
    flex: 1;
}

.header-text {
    flex: 1;
    text-align: left;
}

.header-text p {
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--color-leather);
}

.section-title-large {
    font-family: var(--font-serif);
    font-size: 3.5rem;
    line-height: 1.1;
    color: var(--color-leather);
    margin-top: 10px;
}

.brands-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    margin-bottom: 60px;
}

.brand-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

/* New Logo Wrapper Styles */
.brand-logo-wrapper {
    height: 50px;
    /* Altura fixa para alinhamento */
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 25px;
}

.brand-logo-img {
    height: 28px;
    /* Logo tamanho padrao */
    width: auto;
    filter: invert(0) grayscale(100%) brightness(0);
    /* Preto puro */
    opacity: 0.8;
}

/* Ajuste específico para Muse para compensar visual */
.brand-logo-img.muse-adjust {
    height: 38px;
    margin-left: -4px;
}

.brand-item h3 {
    font-family: var(--font-serif);
    font-size: 1.5rem;
    font-weight: 400;
    margin-bottom: 15px;
    color: var(--color-leather);
}

.brand-item p {
    font-family: var(--font-sans);
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--color-taupe);

}

/* --- Features Split Section --- */
.features-split-section {
    padding: 100px 5%;
    /* Standard padding */
    margin-bottom: 250px;
    /* Large gap to separate from contact section */
    background-color: var(--color-white);
    position: relative;
    z-index: 10;
    /* Ensures it interacts correctly with contact section's z-index */
}

.features-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 80px;
}

.features-image {
    flex: 1;
}

.features-carousel {
    width: 100%;
    height: 500px;
    background-color: #E6E6E6;
    border-radius: 40px;
    position: relative;
    overflow: hidden;
}

.carousel-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}

.carousel-slide.active {
    opacity: 1;
}

.placeholder-icon {
    width: 64px;
    height: 64px;
    stroke: #999;
    stroke-width: 1.5;
}

.features-content {
    flex: 1;
}

.features-list {
    list-style: none;
    padding: 0;
    margin: 0 0 50px 0;
}

.feature-item {
    display: flex;
    gap: 25px;
    margin-bottom: 40px;
    align-items: flex-start;
}

.feature-item:last-child {
    margin-bottom: 0;
}

.feature-icon {
    flex-shrink: 0;
    margin-top: 2px;
    color: var(--color-leather);
    /* Cor marrom escuro */
}

.feature-text h3 {
    font-family: var(--font-serif);
    font-size: 1.6rem;
    /* H4 size per styleguide or slightly larger for this context */
    font-weight: 500;
    /* Medium for better readability */
    line-height: 1.1;
    /* Style guide standard */
    margin-bottom: 8px;
    color: var(--color-leather);
}

.feature-text p {
    font-family: var(--font-sans);
    font-size: 1rem;
    /* Standard body size approx 16px */
    line-height: 1.6;
    color: var(--color-cacao);
}

.features-actions {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 60px;
    /* More spacing as per clean layout */
}

@media (max-width: 968px) {

    /* --- Home: Hero --- */
    .hero {
        height: 60vh !important;
        /* Reduzido para ~metade da tela */
        background-position: center bottom;
    }

    .hero-carousel {
        height: 52vh !important;
        /* Carrossel proporcionalmente menor */
        top: 50px !important;
        /* Descido para alinhar com o meio do menu */
        width: 94vw !important;
        /* Um pouco mais largo */
        left: 3vw !important;
        border-radius: 20px 20px 40px 40px !important;
    }

    .carousel-text-content {
        bottom: 15% !important;
        /* Levanta o texto para não cortar */
        width: 90%;
        left: 50%;
        transform: translateX(-50%);
        padding: 10px 20px;
        /* Padding mínimo */
    }

    .carousel-text-content h2 {
        font-size: 2.4rem !important;
        /* Igualando ao título abaixo */
        line-height: 1.1;
        margin-bottom: 0px;
    }

    .carousel-text-content p {
        display: none;
        /* Simplificação radical para mobile para focar no título */
    }

    /* --- Home: About Section --- */
    .about-section {
        padding: 30px 0;
        /* Padding reduzido pela metade */
    }

    .about-flex {
        flex-direction: column;
        gap: 50px;
    }

    .about-text-side,
    .about-image-side {
        width: 100%;
        text-align: left;
        /* Mantém alinhamento elegante */
    }

    .about-text-side h1 {
        font-size: 2.8rem;
        /* Padronizado com os demais títulos (ex: Benefits) */
    }

    /* --- Marquee Automático (Mobile) --- */
    .partner-brands.marquee-active,
    .partner-logos-decor.marquee-active {
        display: block;
        /* Remove flex padrão */
        overflow: hidden;
        /* Esconde o excesso */
        white-space: nowrap;
        width: 100%;
        position: relative;
        mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
        -webkit-mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
        padding: 10px 0;
    }

    .marquee-track {
        display: flex;
        align-items: center;
        /* Centraliza verticalmente logos de tamanhos diferentes */
        width: fit-content;
        gap: 0;
        animation: scrollInfinite 20s linear infinite;
        will-change: transform;
        /* Otimização de performance */
    }

    .marquee-track img {
        height: 28px !important;
        /* Tamanho otimizado */
        width: auto !important;
        margin: 0 35px;
        /* Espaço generoso entre logos */
        flex-shrink: 0;
        transform: translateZ(0);
        /* Força GPU */
    }

    @keyframes scrollInfinite {
        0% {
            transform: translateX(0);
        }

        100% {
            transform: translateX(-25%);
        }

        /* 4 cópias -> move 25% para completar 1 ciclo */
    }

    /* Fallback (se JS falhar, oculta overflow) */
    .partner-brands:not(.marquee-active) {
        justify-content: center;
        flex-wrap: wrap;
        gap: 20px;
    }

    /* Esconde imagens diretas se o track existir (prevenção) */
    .partner-brands.marquee-active>img,
    .partner-logos-decor.marquee-active>img {
        display: none;
    }

    .big-type-divider {
        display: none;
        /* Remove ruído visual no mobile */
    }

    /* --- Home: Benefits --- */
    .benefits-section {
        padding-top: 30px !important;
        /* Reduz espaço bege superior */
        padding-bottom: 30px;
    }

    .benefits-section .section-header {
        text-align: left !important;
        padding: 0 20px !important;
    }

    .benefits-section .section-title,
    .benefits-section .subtitle {
        text-align: left !important;
        margin-left: 0 !important;
    }

    .benefits-grid {
        grid-template-columns: 1fr;
        /* Stack vertical */
        gap: 20px;
    }

    .benefit-card {
        padding: 30px 25px;
        /* Mais respiro interno */
    }

    /* --- Visual Break (Exclusividade) --- */
    .visual-break {
        height: 50vh !important;
        /* Altura reduzida no mobile */
        background-attachment: scroll !important;
        /* Corrige bug de fixed no iOS */
        background-position: center center !important;
    }

    .visual-break .watermark-text {
        font-size: 6rem !important;
        /* Ajuste proporcional do texto */
    }

    /* --- Home: Products --- */
    .products-showcase .product-info-block {
        padding: 0 5px;
        /* Padding extra reduzido */
    }

    .product-categories {
        flex-direction: column;
        gap: 30px;
    }

    .cat-item {
        width: 100%;
        margin-bottom: 20px;
    }

    .features-split-section {
        padding: 40px 20px;
    }

    .features-container {
        flex-direction: column;
        gap: 60px;
    }

    .features-content {
        order: 1;
        /* Content first on mobile */
    }

    .features-image {
        order: 2;
        width: 100%;
    }

    .image-placeholder {
        height: 350px;
    }

    /* --- Decor Section (Tecidos & Papéis) --- */
    /* --- Decor Section (Tecidos & Papéis) --- */
    .decor-section {
        width: 100% !important;
        min-width: 100% !important;
        margin: 0 !important;
        left: 0 !important;
        right: 0 !important;
        position: relative !important;
        background-color: var(--color-luxe-oat);
        padding: 40px 0;
        box-sizing: border-box !important;
        transform: none !important;
        /* Desativa qualquer transform herdado */
    }

    .decor-section .who-we-are {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 20px !important;
        grid-template-columns: 1fr !important;
        display: flex;
        flex-direction: column;
        gap: 40px;
        overflow-x: hidden;
        box-sizing: border-box !important;
    }

    .decor-section .who-content {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 30px;
    }

    /* Reduz título para garantir que caiba */
    .decor-section .section-title {
        font-size: 2.8rem;
        margin-left: 0;
    }

    /* Wrap para os logos dos parceiros (correção de overflow) */
    /* Agora controlado pelo marquee se ativo */
    /* Agora controlado pelo marquee se ativo */
    .partner-logos-decor:not(.marquee-active) {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 20px !important;
        max-width: 100% !important;
    }

    .partner-logos-decor.marquee-active {
        margin-bottom: 20px;
        /* Garante espaço antes do título */
    }

    /* Aumentar logo Muse no mobile conforme pedido */
    .partner-logos-decor img[alt*="Muse"] {
        height: 52px !important;
        transform: translateY(-5px) translateZ(0);
    }

    /* Garante que o texto quebre corretamente */
    .decor-section .who-we-are h2,
    .decor-section .who-we-are p,
    .decor-section .who-we-are ul {
        max-width: 100%;
        word-wrap: break-word;
    }

    .decor-section .who-we-are ul li {
        display: flex;
        width: 100%;
    }

    .decor-section .clean-list {
        width: 100%;
        margin-top: 30px;
    }
}

.brands-actions {
    display: flex;
    gap: 20px;
    align-items: center;
}

@media (max-width: 768px) {
    .brands-header {
        flex-direction: column;
        gap: 20px;
    }

    .section-title-large {
        font-size: 2.5rem;
    }

    .brands-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    /* Reusing styles for logos on mobile */
    .brand-logo-img {
        height: 24px;
    }

    .brand-logo-img.muse-adjust {
        height: 34px;
    }
}

/* --- Map Section --- */

/* --- Map Section --- */
.map-section {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    height: 450px;
    position: relative;
    max-width: none;
    margin-bottom: 0;
    padding: 0;
}

.map-section iframe {
    width: 100%;
    height: 100%;
    display: block;
    filter: grayscale(100%);
    transition: filter 0.3s ease;
    pointer-events: none;
    /* Prevents scroll interference */
}

.map-section.active-map iframe {
    pointer-events: auto;
    /* Re-enable on click */
}

.map-section iframe:hover {
    filter: grayscale(0%);
}

/* --- WhatsApp Floating Button --- */
.whatsapp-float {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    text-decoration: none;
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* O círculo do botão em si - escalado separadamente */
.whatsapp-float::before {
    content: '';
    position: absolute;
    inset: 0;
    background-color: var(--color-cacao);
    border-radius: 50%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    z-index: 1;
}

.whatsapp-float svg {
    width: 30px;
    height: 30px;
    fill: var(--color-pearl);
    position: relative;
    z-index: 2;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.whatsapp-float:hover::before {
    background-color: var(--color-leather);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

.whatsapp-bubble {
    position: absolute;
    right: 75px;
    background: rgba(43, 38, 35, 0.7);
    /* Efeito Fumê Premium */
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 12px 20px;
    border-radius: 20px;
    color: var(--color-white);
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 1;
    /* Visível desde o início */
    visibility: visible;
    transform: translateX(0);
    transition: all 0.4s ease;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    font-family: var(--font-sans);
    z-index: 3;
}

/* Hover effect refinements */
.whatsapp-float:hover .whatsapp-bubble {
    background: rgba(43, 38, 35, 0.85);
    /* Slightly darker on hover */
}

@media (max-width: 768px) {
    .whatsapp-float {
        bottom: 20px;
        right: 20px;
        width: 65px;
        /* Aumentado em 30% (era 50px) */
        height: 65px;
    }

    .whatsapp-float svg {
        width: 33px;
        /* Aumentado proporcionalmente */
        height: 33px;
    }

    .whatsapp-bubble {
        display: none !important;
    }
}

.nav-mobile-footer {
    display: none;
}

/* --- Mobile Navigation --- */
.mobile-menu-toggle {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 26px;
    height: 18px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 1100;
}

.mobile-menu-toggle span {
    width: 100%;
    height: 1.5px;
    background-color: var(--color-cacao);
    border-radius: 2px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 968px) {
    header {
        top: 10px !important;
        width: 92% !important;
        padding: 10px 20px !important;
        justify-content: space-between !important;
        gap: 0 !important;
        border-radius: 40px !important;
        z-index: 1000;
        /* Base */
    }

    header.menu-open {
        z-index: 1100 !important;
        /* Fica acima do overlay (1040) */
    }

    header.header-scrolled {
        top: 5px !important;
    }

    .mobile-menu-toggle {
        display: flex;
    }

    nav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 80%;
        height: 100vh;
        background: rgba(248, 245, 240, 0.98);
        /* Pearl mais sólido para legibilidade */
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        padding: 100px 40px;
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        box-shadow: -15px 0 45px rgba(0, 0, 0, 0.1);
        z-index: 1050;
        display: flex;
        flex-direction: column;
    }

    header.menu-open nav {
        right: 0;
    }

    nav ul {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        width: 100%;
    }

    nav ul li a {
        font-size: 1.3rem;
        color: var(--color-cacao);
        letter-spacing: 1px;
        padding: 15px 0;
        display: block;
        width: 100%;
    }

    .header-btns {
        display: none !important;
        /* Hidden on header for mobile */
    }

    /* WhatsApp Button inside mobile menu */
    .nav-mobile-footer {
        margin-top: auto;
        padding-top: 30px;
        border-top: 1px solid rgba(0, 0, 0, 0.05);
    }

    .nav-mobile-footer .btn-contact {
        width: 100%;
        justify-content: center;
        padding: 16px;
        font-size: 1rem;
        display: flex;
    }

    /* Animation for hamburger */
    header.menu-open .mobile-menu-toggle span:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    header.menu-open .mobile-menu-toggle span:nth-child(2) {
        opacity: 0;
        transform: translateX(10px);
    }

    header.menu-open .mobile-menu-toggle span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    /* Overlay background when menu is open */
    .menu-overlay {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
        opacity: 0;
        visibility: hidden;
        transition: all 0.4s ease;
        z-index: 1040;
    }

    body.menu-open .menu-overlay {
        opacity: 1;
        visibility: visible;
    }

    body.menu-open {
        overflow: hidden;
    }
}