/* __VITRINE_LAYOUTS_V1__ (issue #74): overrides por data-layout no . Classico = baseline (index.css + vitrine.css). Compacto e editorial sobrescrevem aqui. */ /* --- Tokens compartilhados --- */ [data-layout="classico"] { --layout-hero-vh: 80vh; --layout-hero-min-h: 500px; --layout-card-radius: 16px; --layout-destaque-w: 11rem; --layout-destaque-img-h: 7rem; } [data-layout="compacto"] { --layout-hero-vh: 40vh; --layout-hero-min-h: 220px; --layout-card-radius: 12px; --layout-destaque-w: 9rem; --layout-destaque-img-h: 5.5rem; } [data-layout="editorial"] { --layout-hero-vh: 58vh; --layout-hero-min-h: 380px; --layout-card-radius: 20px; --layout-destaque-w: 13rem; --layout-destaque-img-h: 9rem; --shell-header-h: 4.5rem; --shell-bg-body: #F8F7F4; --shell-editorial-band: color-mix(in srgb, var(--cor-primaria, #5C6B3A) 4%, #ffffff); --shell-editorial-ink: #0F172A; --shell-editorial-muted: #64748B; --shell-editorial-line: color-mix(in srgb, var(--cor-primaria, #5C6B3A) 10%, #e2e8f0); } /* --- Hero --- */ [data-layout] .hero-section { height: var(--layout-hero-vh); min-height: var(--layout-hero-min-h); } [data-layout="compacto"] .hero-title { font-size: 1.75rem; } [data-layout="compacto"] .btn-hero { padding: 0.65rem 1.5rem; font-size: 0.875rem; } [data-layout="editorial"] .hero-title { font-size: 2.25rem; } @media (min-width: 1024px) { [data-layout="editorial"] .hero-title { font-size: 3.5rem; } } /* --- Header (fallback antes do shell v2 aplicar) --- */ [data-layout="editorial"] #main-header.premium-header:not(.shell-header-editorial) { background: var(--cor-primaria, #5C6B3A); backdrop-filter: none; -webkit-backdrop-filter: none; } /* --- Destaques carousel --- */ [data-layout] #destaques-list .product-card:not(.shell-bento-cell) { width: var(--layout-destaque-w); border-radius: var(--layout-card-radius); } [data-layout] #destaques-list .product-card:not(.shell-bento-cell) img, [data-layout] #destaques-list .product-card:not(.shell-bento-cell) .img-placeholder { height: var(--layout-destaque-img-h) !important; } /* v2 shells: destaques nao usam largura fixa do carrossel v1 */ [data-layout="compacto"] #destaques-list.shell-destaques-strip .shell-destaque-strip.product-card { width: auto; } [data-layout="editorial"] #destaques-list.shell-destaques-bento .shell-bento-cell.product-card { width: 100%; min-width: 0; display: block; background-color: #e2e8f0; } /* Bento v2: foto cobre o card inteiro (anula altura fixa do carrossel v1 em L73-76) */ [data-layout="editorial"] #destaques-list.shell-destaques-bento .shell-bento-cell.product-card img, [data-layout="editorial"] #destaques-list.shell-destaques-bento .shell-bento-cell.product-card .img-placeholder { width: 100% !important; height: 100% !important; min-height: 100%; object-fit: cover; object-position: center center; } /* --- Product grid density --- */ [data-layout="compacto"] .product-grid { grid-template-columns: 1fr !important; gap: 0; } [data-layout="editorial"] .product-grid { grid-template-columns: 1fr; gap: 1.25rem; } @media (min-width: 768px) { [data-layout="editorial"] .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (min-width: 1024px) { [data-layout="editorial"] .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; } } [data-layout="editorial"] #produtos-wrap > section { margin-bottom: 4rem; } [data-layout="editorial"] #produtos-wrap > section h2 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.5rem; } /* --- Cards: classico (explicito p/ paridade de radius) --- */ [data-layout="classico"] .product-grid .product-card { border-radius: var(--layout-card-radius); } /* --- Cards: compacto (lista horizontal densa) --- */ [data-layout="compacto"] .product-grid .product-card { flex-direction: row !important; align-items: stretch; border-radius: var(--layout-card-radius); min-height: 4.5rem; } [data-layout="compacto"] .product-grid .product-card .product-info { order: 2; flex: 1; padding: 0.5rem 0.75rem; align-items: flex-start !important; text-align: left !important; } [data-layout="compacto"] .product-grid .product-card .product-info h3 { font-size: 0.875rem; font-weight: 600; margin-bottom: 0.125rem; font-family: Inter, ui-sans-serif, system-ui, sans-serif; } [data-layout="compacto"] .product-grid .product-card .product-info p { line-clamp: 1; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 0.25rem; } [data-layout="compacto"] .product-grid .product-card .product-info .text-primaria { font-size: 1rem; } [data-layout="compacto"] .product-grid .product-card .product-media { order: 1; width: 4.5rem; min-width: 4.5rem; height: 4.5rem; flex-shrink: 0; position: relative; } @media (min-width: 640px) { [data-layout="compacto"] .product-grid .product-card .product-media { width: 5rem; min-width: 5rem; height: 5rem; } } [data-layout="compacto"] .product-grid .product-card .product-media img, [data-layout="compacto"] .product-grid .product-card .product-media .img-placeholder { width: 100% !important; height: 100% !important; object-fit: cover; } [data-layout="compacto"] .product-grid .product-card .product-add-wrap { order: 3; display: flex; align-items: center; padding-right: 0.5rem; flex-shrink: 0; } [data-layout="compacto"] .product-grid .product-card .product-add-wrap button { position: static !important; width: 2rem; height: 2rem; font-size: 1.125rem; } [data-layout="compacto"] .cat-tab { font-size: 0.75rem; padding: 0.35rem 0.75rem; } [data-layout="compacto"] #produtos-wrap > section h2 { font-size: 1.125rem; font-weight: 600; font-family: Inter, ui-sans-serif, system-ui, sans-serif; } /* --- Cards: editorial (foto dominante, coluna, altura flexivel) --- */ [data-layout="editorial"] .product-grid .product-card { flex-direction: column !important; border-radius: var(--layout-card-radius); border: 1px solid var(--shell-editorial-line); box-shadow: none; transition: box-shadow 0.25s ease, transform 0.25s ease; } [data-layout="editorial"] .product-grid .product-card:hover { box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08); transform: translateY(-2px); } [data-layout="editorial"] .product-grid .product-card .product-info { order: 2; align-items: flex-start !important; text-align: left !important; padding: 1rem 1.25rem 1.25rem; } [data-layout="editorial"] .product-grid .product-card .product-info h3 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.125rem; line-height: 1.25; color: var(--shell-editorial-ink); } [data-layout="editorial"] .product-grid .product-card .product-info p { line-clamp: 2; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; color: var(--shell-editorial-muted); } [data-layout="editorial"] .product-grid .product-card .product-info .flex { justify-content: flex-start !important; } [data-layout="editorial"] .product-grid .product-card .product-media { order: 1; width: 100% !important; position: relative; overflow: hidden; } [data-layout="editorial"] .product-grid .product-card .product-media img, [data-layout="editorial"] .product-grid .product-card .product-media .img-placeholder { width: 100% !important; height: auto !important; min-height: 11rem; max-height: 18rem; object-fit: cover; object-position: center center; } @media (min-width: 640px) { [data-layout="editorial"] .product-grid .product-card .product-media img, [data-layout="editorial"] .product-grid .product-card .product-media .img-placeholder { min-height: 13rem; max-height: 20rem; } } [data-layout="editorial"] .product-grid .product-card .product-add-wrap button { width: 2.75rem; height: 2.75rem; } /* Reviews: max 2 cols no editorial */ [data-layout="editorial"] #reviews-grid { grid-template-columns: 1fr; } @media (min-width: 768px) { [data-layout="editorial"] #reviews-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } /* Acessibilidade: respeita prefers-reduced-motion em todos os layouts */ @media (prefers-reduced-motion: reduce) { [data-layout] .product-card, [data-layout] .hero-title, [data-layout] .hero-subtitle, [data-layout] .btn-hero { animation: none !important; transition: none !important; } [data-layout] .product-card:hover { transform: none !important; } } /* ═══════════════════════════════════════════════════════════════════════════ __VITRINE_LAYOUTS_V2__ (issue #75) — Shell Compacto ("app de pedido") ═══════════════════════════════════════════════════════════════════════════ */ [data-layout="compacto"] { --shell-header-h: 3.25rem; --shell-bg-body: #ffffff; --shell-search-h: 3.5rem; } [data-layout="compacto"] body, [data-layout="compacto"] #app { background: var(--shell-bg-body); } [data-layout="compacto"] #app { display: flex; flex-direction: column; } /* Ordem visual: header -> busca -> destaques -> fidelidade -> catalogo -> faq -> reviews -> footer */ [data-layout="compacto"] #hero { order: 0; } [data-layout="compacto"] #main-header { order: 1; } [data-layout="compacto"] #shell-search-wrap { order: 2; } [data-layout="compacto"] #sec-destaques { order: 3; } [data-layout="compacto"] #fidelidade-banner { order: 4; } [data-layout="compacto"] #shell-catalog { order: 5; } [data-layout="compacto"] #sec-faq { order: 6; } [data-layout="compacto"] #reviews-section { order: 7; } [data-layout="compacto"] #sec-about { order: 8; } [data-layout="compacto"] footer { order: 9; } /* Hero oculto no compacto */ [data-layout="compacto"] #hero.shell-hero-hidden, [data-layout="compacto"] .shell-hero-hidden#hero { display: none !important; margin: 0; min-height: 0; height: 0; } /* Header branco minimalista */ [data-layout="compacto"] #main-header.shell-header-compact { background: #ffffff !important; color: #18181b; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 1px solid #e4e4e7; box-shadow: none; } [data-layout="compacto"] #main-header.shell-header-compact #hdr-nome { font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #18181b; } [data-layout="compacto"] #main-header.shell-header-compact svg { color: #3f3f46; } [data-layout="compacto"] #main-header.shell-header-compact #btn-conta:hover, [data-layout="compacto"] #main-header.shell-header-compact button:hover { background: #f4f4f5; } [data-layout="compacto"] #main-header.shell-header-compact > div:last-child { color: #71717a; } [data-layout="compacto"] #main-header.shell-header-compact .text-white, [data-layout="compacto"] #main-header.shell-header-compact .text-white\/80 { color: #71717a !important; } /* Busca sticky e proeminente */ [data-layout="compacto"] #shell-search-wrap.shell-search-sticky { position: sticky; top: var(--shell-chrome-h, var(--shell-header-h)); z-index: 25; background: #ffffff; border-bottom: 1px solid #f4f4f5; padding-top: 0.75rem; padding-bottom: 0.75rem; } [data-layout="compacto"] #shell-search-wrap.shell-search-sticky .max-w-xl { max-width: none; } [data-layout="compacto"] #shell-search-wrap #busca-produto { border-radius: 0.75rem; padding-top: 0.75rem; padding-bottom: 0.75rem; font-size: 0.9375rem; border-color: #e4e4e7; box-shadow: none; } /* Destaques em faixa horizontal (strip) */ [data-layout="compacto"] .shell-destaques-strip-wrap { padding-top: 0.75rem; padding-bottom: 0.25rem; } [data-layout="compacto"] .shell-destaques-strip-wrap h2 { font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 1rem; font-weight: 700; margin-bottom: 0.5rem; color: #3f3f46; } [data-layout="compacto"] #destaques-list.shell-destaques-strip { gap: 0.5rem; padding-bottom: 0.5rem; } [data-layout="compacto"] .shell-destaque-strip { font-family: Inter, ui-sans-serif, system-ui, sans-serif; } /* Catalogo: chips sticky + sidebar desktop */ [data-layout="compacto"] #shell-catalog.shell-catalog-sidebar { width: 100%; max-width: 72rem; margin-left: auto; margin-right: auto; } [data-layout="compacto"] #cat-tabs-wrap { position: sticky; top: calc(var(--shell-chrome-h, 5.5rem) + var(--shell-search-h, 3.5rem)); z-index: 20; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); border-bottom: 1px solid #f4f4f5; padding-top: 0.5rem; padding-bottom: 0.5rem; } @media (min-width: 1024px) { [data-layout="compacto"] #shell-catalog.shell-catalog-sidebar { display: grid; grid-template-columns: 12.5rem minmax(0, 1fr); gap: 1.25rem; align-items: start; padding-left: 1rem; padding-right: 1rem; } [data-layout="compacto"] #shell-catalog.shell-catalog-sidebar #cat-tabs-wrap { position: sticky; top: calc(var(--shell-chrome-h, 5.5rem) + 0.5rem); flex-direction: column; overflow: visible; align-items: stretch; max-height: calc(100vh - var(--shell-header-h) - 1rem); overflow-y: auto; border: 1px solid #e4e4e7; border-radius: 0.75rem; padding: 0.5rem; background: #ffffff; } [data-layout="compacto"] #shell-catalog.shell-catalog-sidebar .cat-tab { width: 100%; text-align: left; border-radius: 0.5rem; white-space: normal; } [data-layout="compacto"] #shell-catalog.shell-catalog-sidebar #produtos-wrap { padding-left: 0; padding-right: 0; } } /* Produtos densos com divisores — fundo uniforme (sem zebra por categoria) */ [data-layout="compacto"] #produtos-wrap > section { background: var(--shell-bg-body); padding: 0.75rem 0; border-bottom: 1px solid #e4e4e7; } [data-layout="compacto"] .product-grid .product-card { border-bottom: 1px solid #e4e4e7; border-radius: 0; box-shadow: none; background: transparent; } [data-layout="compacto"] .product-grid .product-card:last-child { border-bottom: none; } /* FAQ accordion compacto */ [data-layout="compacto"] #sec-faq.shell-faq-compact { padding: 1.5rem 1rem; } [data-layout="compacto"] #sec-faq.shell-faq-compact .faq-title { font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 1.125rem; text-align: left; margin-bottom: 1rem; } [data-layout="compacto"] #sec-faq.shell-faq-compact .faq-item { border-radius: 0.5rem; margin-bottom: 0.5rem; box-shadow: none; border: 1px solid #e4e4e7; } [data-layout="compacto"] #sec-faq.shell-faq-compact .faq-question { padding: 0.875rem 1rem; font-size: 0.875rem; } /* Reviews compactos — scroll horizontal */ [data-layout="compacto"] #reviews-section.shell-reviews-compact h2 { font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 1.25rem; } [data-layout="compacto"] #reviews-section.shell-reviews-compact #reviews-list { display: flex; flex-direction: row; gap: 0.75rem; overflow-x: auto; padding-bottom: 0.5rem; scroll-snap-type: x mandatory; } [data-layout="compacto"] #reviews-section.shell-reviews-compact #reviews-list > div { flex: 0 0 min(85%, 18rem); scroll-snap-align: start; padding: 0.75rem 1rem; border-radius: 0.75rem; } [data-layout="compacto"] #reviews-section.shell-reviews-compact #reviews-list p { line-clamp: 2; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; } /* Sobre colapsado no footer */ [data-layout="compacto"] #sec-about.shell-about-hidden { display: none !important; } [data-layout="compacto"] .shell-footer-about { font-family: Inter, ui-sans-serif, system-ui, sans-serif; line-height: 1.5; } [data-layout="compacto"] .shell-footer-about__text { display: block; white-space: pre-line; } [data-layout="compacto"] .shell-footer-about__toggle { background: none; border: none; cursor: pointer; } [data-layout="compacto"] .shell-footer-about__toggle:hover { opacity: 0.85; } [data-layout="compacto"] .shell-footer-about__toggle:focus-visible { outline: 2px solid var(--cor-primaria, #5C6B3A); outline-offset: 2px; border-radius: var(--radius-sm, 8px); } /* Sobre compacto: secao completa visivel (paridade de capacidades) */ [data-layout="compacto"] #sec-about.shell-about-compact { padding-top: 1.25rem; padding-bottom: 1.25rem; } [data-layout="compacto"] #sec-about.shell-about-compact .about-title { font-family: 'Playfair Display', Georgia, serif; font-size: 1.125rem; } [data-layout="compacto"] #sec-about.shell-about-compact .about-text { font-size: 0.875rem; line-height: 1.5; } /* WA FAB: canto inferior, sem pulse; some com carrinho ativo; header no desktop */ [data-layout="compacto"] #wa-fab { bottom: max(1rem, env(safe-area-inset-bottom, 0px)); right: max(1rem, env(safe-area-inset-right, 0px)); animation: none; } [data-layout="compacto"] #wa-fab.wa-fab--cart-active { opacity: 0; pointer-events: none; transform: scale(0.85); } [data-layout="compacto"] #hdr-wa { display: none !important; } @media (min-width: 1024px) { [data-layout="compacto"] #wa-fab { display: none !important; } [data-layout="compacto"] #hdr-wa:not(.hidden) { display: flex !important; } [data-layout="compacto"] #main-header.shell-header-compact #hdr-wa:hover { background: #f4f4f5; } } /* Touch 44px nos botoes + do catalogo compacto */ [data-layout="compacto"] .product-add-btn { position: relative; min-width: 2.75rem; min-height: 2.75rem; width: 2.75rem; height: 2.75rem; } [data-layout="compacto"] .shell-destaque-strip__add { position: relative; min-width: 2.75rem; min-height: 2.75rem; width: 2.75rem; height: 2.75rem; } /* ═══════════════════════════════════════════════════════════════════════════ __VITRINE_LAYOUTS_V2__ (issue #75) — Shell Editorial ("revista") ═══════════════════════════════════════════════════════════════════════════ */ [data-layout="editorial"] body, [data-layout="editorial"] #app { background: var(--shell-bg-body); } [data-layout="editorial"] #app { display: flex; flex-direction: column; } [data-layout="editorial"] #hero.shell-hero-editorial { order: 1; margin-bottom: 0; width: 100%; max-width: none; padding-top: calc(var(--shell-header-h, 4.5rem) + env(safe-area-inset-top, 0px)); align-items: flex-end; justify-content: flex-start; text-align: left; background-size: cover; background-position: center center; } [data-layout="editorial"] #hero.shell-hero-editorial .hero-overlay { background: linear-gradient(to top, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.28) 42%, rgba(0, 0, 0, 0.18) 100%); } [data-layout="editorial"] #hero.shell-hero-editorial .hero-title, [data-layout="editorial"] #hero.shell-hero-editorial .hero-subtitle { text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8), 0 1px 3px rgba(0, 0, 0, 0.95); } [data-layout="editorial"] #hero.shell-hero-editorial .hero-content { position: relative; width: 100%; max-width: 48rem; margin: 0 auto; padding: 1.5rem 1.5rem 2.75rem; text-align: left; } [data-layout="editorial"] #hero.shell-hero-editorial .hero-title { font-family: 'Playfair Display', Georgia, serif; letter-spacing: -0.02em; margin-left: 0; margin-right: auto; } [data-layout="editorial"] #hero.shell-hero-editorial .hero-subtitle { margin-left: 0; margin-right: auto; max-width: 28rem; } [data-layout="editorial"] #hero.shell-hero-editorial .btn-hero { margin-left: 0; } [data-layout="editorial"] #main-header.shell-header-editorial { order: 0; position: fixed; top: 0; left: 0; right: 0; z-index: 40; padding-top: env(safe-area-inset-top, 0px); background: transparent !important; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 1px solid transparent; box-shadow: none !important; transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; } [data-layout="editorial"] #main-header.shell-header-editorial:not(.scrolled) #hdr-nome { text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45); } [data-layout="editorial"] #main-header.shell-header-editorial.scrolled { background: color-mix(in srgb, var(--cor-primaria, #5C6B3A) 97%, transparent) !important; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); border-bottom-color: rgba(255, 255, 255, 0.12); box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important; } [data-layout="editorial"] #shell-search-wrap.shell-search-editorial { order: 2; padding: 1.25rem 1.5rem; background: #ffffff; border-bottom: 1px solid var(--shell-editorial-line); width: 100%; max-width: none; } [data-layout="editorial"] #shell-search-wrap.shell-search-editorial .max-w-xl { max-width: 48rem; margin-left: auto; margin-right: auto; } [data-layout="editorial"] #shell-search-wrap.shell-search-editorial #busca-produto { border-radius: 0.25rem; border-color: var(--shell-editorial-line); box-shadow: none; padding-top: 0.75rem; padding-bottom: 0.75rem; font-size: 0.875rem; } [data-layout="editorial"] #sec-destaques.shell-destaques-bento-wrap { order: 3; } [data-layout="editorial"] #fidelidade-banner { order: 4; } [data-layout="editorial"] #cat-tabs-wrap.shell-cat-tabs-editorial { order: 5; } [data-layout="editorial"] #produtos-wrap.shell-catalog-bands { order: 6; } [data-layout="editorial"] #sec-faq { order: 7; } [data-layout="editorial"] #reviews-section { order: 8; } [data-layout="editorial"] #sec-about { order: 9; } [data-layout="editorial"] footer { order: 10; } /* Bento destaques */ [data-layout="editorial"] .shell-destaques-bento-wrap { padding: 2.5rem 1.5rem 1.5rem; max-width: 48rem; margin-left: auto; margin-right: auto; width: 100%; } [data-layout="editorial"] .shell-destaques-bento-wrap h2 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.75rem; margin-bottom: 1.25rem; color: var(--shell-editorial-ink); } [data-layout="editorial"] #destaques-list.shell-destaques-bento { display: block; overflow: visible; } [data-layout="editorial"] .shell-destaques-bento-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 1rem; align-items: stretch; } [data-layout="editorial"] .shell-destaques-bento-grid--solo { grid-template-columns: 1fr; } [data-layout="editorial"] .shell-bento-cell { border-radius: var(--layout-card-radius); width: 100%; position: relative; overflow: hidden; } [data-layout="editorial"] .shell-bento-cell__media { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; } [data-layout="editorial"] .shell-bento-cell__media img, [data-layout="editorial"] .shell-bento-cell__media .img-placeholder { display: block; width: 100% !important; height: 100% !important; min-height: 100%; object-fit: cover; object-position: center center; } [data-layout="editorial"] .shell-bento-cell__overlay { background: linear-gradient( to top, rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.35) 38%, transparent 100% ) !important; } [data-layout="editorial"] .shell-bento-cell__body p { text-shadow: 0 1px 8px rgba(0, 0, 0, 0.85); } [data-layout="editorial"] .shell-bento-cell--hero { grid-row: 1 / span 2; min-height: 20rem; } [data-layout="editorial"] .shell-bento-stack { display: grid; grid-template-rows: 1fr 1fr; gap: 1rem; min-height: 20rem; } [data-layout="editorial"] .shell-bento-cell--sm { min-height: 9.5rem; } [data-layout="editorial"] .shell-bento-cell__add { position: absolute; top: 0.75rem; right: 0.75rem; z-index: 2; } @media (max-width: 639px) { [data-layout="editorial"] .shell-destaques-bento-grid { grid-template-columns: 1fr; } [data-layout="editorial"] .shell-bento-cell--hero { grid-row: auto; min-height: 16rem; } [data-layout="editorial"] .shell-bento-stack { display: flex; flex-direction: column; gap: 1rem; min-height: 0; } [data-layout="editorial"] .shell-bento-cell--sm { min-height: 12rem; } } /* Categorias: faixa fina de ancora */ [data-layout="editorial"] #cat-tabs-wrap.shell-cat-tabs-editorial { position: static !important; top: auto !important; background: transparent; backdrop-filter: none; border-bottom: 1px solid #f1f5f9; justify-content: center; flex-wrap: wrap; } [data-layout="editorial"] #cat-tabs-wrap.shell-cat-tabs-editorial .cat-tab { font-family: 'Playfair Display', Georgia, serif; font-size: 0.8125rem; background: transparent; box-shadow: none; border-radius: 0; border: none; border-bottom: 2px solid transparent; padding: 0.5rem 0.75rem; } [data-layout="editorial"] #cat-tabs-wrap.shell-cat-tabs-editorial .cat-tab.active { background: transparent; color: var(--cor-primaria, #5C6B3A); border-bottom-color: var(--cor-primaria, #5C6B3A); } /* Faixas alternadas por categoria */ [data-layout="editorial"] #produtos-wrap.shell-catalog-bands { padding-left: 0; padding-right: 0; gap: 0; } [data-layout="editorial"] #produtos-wrap.shell-catalog-bands > section.shell-cat-band { padding: 4rem 1.5rem; margin-bottom: 0; } @media (min-width: 1024px) { [data-layout="editorial"] #produtos-wrap.shell-catalog-bands > section.shell-cat-band { padding: 5rem 2rem; } } [data-layout="editorial"] #produtos-wrap.shell-catalog-bands > section.shell-cat-band { background: #ffffff; } [data-layout="editorial"] #produtos-wrap.shell-catalog-bands > section.shell-cat-band--alt { background: var(--shell-editorial-band); } [data-layout="editorial"] #produtos-wrap.shell-catalog-bands > section h2 { font-family: 'Playfair Display', Georgia, serif; font-size: 1.75rem; max-width: 48rem; margin-left: auto; margin-right: auto; } [data-layout="editorial"] #produtos-wrap.shell-catalog-bands .product-grid { max-width: 48rem; margin-left: auto; margin-right: auto; } /* FAQ editorial */ [data-layout="editorial"] #sec-faq.shell-faq-editorial { padding: 4rem 1.5rem; } [data-layout="editorial"] #sec-faq.shell-faq-editorial .faq-title { font-family: 'Playfair Display', Georgia, serif; } [data-layout="editorial"] #sec-faq.shell-faq-editorial .faq-list { display: flex; flex-direction: column; gap: 0.75rem; max-width: 48rem; margin: 0 auto; } [data-layout="editorial"] #sec-faq.shell-faq-editorial .faq-item { width: 100%; } [data-layout="editorial"] #sec-faq.shell-faq-editorial .faq-question span { font-family: 'Playfair Display', Georgia, serif; font-size: 0.9375rem; } /* Reviews editorial */ [data-layout="editorial"] #reviews-section.shell-reviews-editorial { padding-bottom: 4rem; } [data-layout="editorial"] #reviews-section.shell-reviews-editorial h2 { font-family: 'Playfair Display', Georgia, serif; } [data-layout="editorial"] .shell-reviews-editorial-layout { display: grid; gap: 1rem; } @media (min-width: 768px) { [data-layout="editorial"] .shell-reviews-editorial-layout { grid-template-columns: 1.2fr 1fr; align-items: start; } } [data-layout="editorial"] .shell-review-featured { min-height: 12rem; } [data-layout="editorial"] .shell-reviews-editorial-rest { display: flex; flex-direction: column; gap: 0.75rem; } [data-layout="editorial"] #reviews-section.shell-reviews-editorial #reviews-list { display: block; } /* Sobre full-bleed editorial */ [data-layout="editorial"] #sec-about.shell-about-editorial { background: transparent; border-radius: 0; margin: 0; box-shadow: none; padding: 0; width: 100%; max-width: none; } [data-layout="editorial"] #sec-about.shell-about-editorial .about-grid { display: grid; grid-template-columns: 1fr; gap: 0; max-width: none; } @media (min-width: 768px) { [data-layout="editorial"] #sec-about.shell-about-editorial .about-grid { grid-template-columns: 1fr 1fr; min-height: 24rem; } [data-layout="editorial"] #sec-about.shell-about-editorial .about-grid:has(.about-image:not(.hidden)) { grid-template-columns: 1.1fr 0.9fr; } } [data-layout="editorial"] #sec-about.shell-about-editorial .about-image:not(.hidden) { width: 100%; height: 100%; min-height: 16rem; object-fit: cover; border-radius: 0; box-shadow: none; } [data-layout="editorial"] #sec-about.shell-about-editorial .about-grid > div { padding: 3rem 1.5rem; display: flex; flex-direction: column; justify-content: center; } @media (min-width: 1024px) { [data-layout="editorial"] #sec-about.shell-about-editorial .about-grid > div { padding: 4rem 3rem; } } [data-layout="editorial"] #sec-about.shell-about-editorial .about-title { font-family: 'Playfair Display', Georgia, serif; font-size: 2.25rem; } /* Polish: respiro extra no hero editorial com header fixo */ [data-layout="editorial"] #shell-search-wrap.shell-search-editorial { margin-top: 0; } /* Acessibilidade: shells respeitam reduced-motion (v2c) */ @media (prefers-reduced-motion: reduce) { [data-layout="editorial"] #main-header.shell-header-editorial, [data-layout="compacto"] #shell-search-wrap.shell-search-sticky { transition: none !important; } }