/* ═══════════════════════════════════════════════════════ CONDUIT HERO STYLES — layout independente do tema Classes reais do template: .hero → section .hero-text → bloco de texto .hero-media → wrapper da foto .hero-photo → Aplicado via [data-hero="xxx"] no Valores: fullscreen | split | bold | editorial ═══════════════════════════════════════════════════════ */ /* ── reset base para todos os hero styles ── */ [data-hero] .hero { position: relative; overflow: hidden; } [data-hero] .hero-media::after { content: ''; position: absolute; inset: 0; pointer-events: none; } [data-hero] .hero-photo { width: 100%; height: 100%; object-fit: cover; display: block; } /* ══════════════════════════════════════════════ FULLSCREEN — foto fullbleed, texto centrado ══════════════════════════════════════════════ */ [data-hero="fullscreen"] .hero { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; min-height: 100svh !important; padding: 0 !important; } [data-hero="fullscreen"] .hero-media { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; z-index: 0; } [data-hero="fullscreen"] .hero-media::after { background: radial-gradient(ellipse at center, rgba(0,0,0,0.28) 0%, rgba(0,0,0,0.68) 100%); z-index: 1; } [data-hero="fullscreen"] .hero-text { position: relative !important; z-index: 2 !important; max-width: 820px !important; padding: 7rem 2rem 5rem !important; display: flex !important; flex-direction: column !important; align-items: center !important; } [data-hero="fullscreen"] .hero-title, [data-hero="fullscreen"] .hero-sub, [data-hero="fullscreen"] .hero-title-inner, [data-hero="fullscreen"] .section-label { color: #fff !important; text-shadow: 0 2px 16px rgba(0,0,0,0.35); } /* ══════════════════════════════════════════════ SPLIT — texto esquerda, foto direita ══════════════════════════════════════════════ */ [data-hero="split"] .hero { display: grid !important; grid-template-columns: 1fr 1fr !important; align-items: stretch !important; min-height: 100svh !important; padding: 0 !important; } [data-hero="split"] .hero-text { order: 1 !important; display: flex !important; flex-direction: column !important; justify-content: center !important; padding: 7rem 4rem 7rem 6rem !important; position: relative; z-index: 1; } [data-hero="split"] .hero-media { order: 2 !important; position: relative !important; inset: unset !important; min-height: 100svh !important; overflow: hidden !important; } [data-hero="split"] .hero-media::after { background: linear-gradient(to right, var(--bg, #fff) 0%, transparent 20%) !important; } @media (max-width: 768px) { [data-hero="split"] .hero { grid-template-columns: 1fr !important; grid-template-rows: 55svh auto !important; } [data-hero="split"] .hero-media { order: 1 !important; min-height: 55svh !important; } [data-hero="split"] .hero-text { order: 2 !important; padding: 3rem 1.5rem !important; } } /* ══════════════════════════════════════════════ BOLD — foto fullbleed, texto em baixo ══════════════════════════════════════════════ */ [data-hero="bold"] .hero { display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-end !important; min-height: 100svh !important; padding: 0 0 5rem 0 !important; } [data-hero="bold"] .hero-media { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; z-index: 0; } [data-hero="bold"] .hero-media::after { background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.35) 55%, transparent 100%) !important; z-index: 1; } [data-hero="bold"] .hero-photo { filter: none !important; opacity: 1 !important; } [data-hero="bold"] .hero-text { position: relative !important; z-index: 2 !important; padding: 2rem 4rem !important; max-width: 800px !important; text-align: left !important; } [data-hero="bold"] .hero-title, [data-hero="bold"] .hero-sub, [data-hero="bold"] .hero-title-inner, [data-hero="bold"] .section-label { color: #fff !important; } [data-hero="bold"] .hero-title, [data-hero="bold"] .hero-title-inner { font-size: clamp(3.5rem, 9vw, 8rem) !important; font-weight: 800 !important; line-height: 0.92 !important; letter-spacing: -0.03em !important; } @media (max-width: 768px) { [data-hero="bold"] .hero-text { padding: 2rem 1.5rem !important; } } /* ══════════════════════════════════════════════ EDITORIAL — título gigante, foto pequena direita ══════════════════════════════════════════════ */ [data-hero="editorial"] .hero { display: grid !important; grid-template-columns: 1fr 380px !important; align-items: center !important; min-height: 100svh !important; padding: 0 !important; } [data-hero="editorial"] .hero-text { order: 1 !important; display: flex !important; flex-direction: column !important; justify-content: center !important; padding: 8rem 3rem 8rem 6rem !important; } [data-hero="editorial"] .hero-title, [data-hero="editorial"] .hero-title-inner { font-size: clamp(4rem, 9vw, 10rem) !important; line-height: 0.9 !important; letter-spacing: -0.04em !important; } [data-hero="editorial"] .hero-media { order: 2 !important; position: relative !important; inset: unset !important; height: 100svh !important; overflow: hidden !important; } [data-hero="editorial"] .hero-photo { filter: grayscale(20%) !important; object-position: center top !important; } [data-hero="editorial"] .hero-media::after { background: none !important; } @media (max-width: 900px) { [data-hero="editorial"] .hero { grid-template-columns: 1fr !important; grid-template-rows: auto 300px !important; } [data-hero="editorial"] .hero-media { height: 300px !important; order: 2 !important; } [data-hero="editorial"] .hero-text { order: 1 !important; padding: 5rem 1.5rem 2rem !important; } } /* ══════════════════════════════════════════════ NAVBAR — cor baseada no hero style ══════════════════════════════════════════════ */ /* Heroes escuros → links brancos */ [data-hero="fullscreen"] #site-header:not(.scrolled) .nav-link, [data-hero="fullscreen"] #site-header:not(.scrolled) .nav-logo, [data-hero="bold"] #site-header:not(.scrolled) .nav-link, [data-hero="bold"] #site-header:not(.scrolled) .nav-logo { color: #fff !important; } [data-hero="fullscreen"] #site-header:not(.scrolled) .hamburger span, [data-hero="bold"] #site-header:not(.scrolled) .hamburger span { background: #fff !important; } /* Heroes claros → links escuros */ [data-hero="split"] #site-header:not(.scrolled) .nav-link, [data-hero="split"] #site-header:not(.scrolled) .nav-logo, [data-hero="editorial"] #site-header:not(.scrolled) .nav-link, [data-hero="editorial"] #site-header:not(.scrolled) .nav-logo { color: var(--text, #111) !important; } [data-hero="split"] #site-header:not(.scrolled) .hamburger span, [data-hero="editorial"] #site-header:not(.scrolled) .hamburger span { background: var(--text, #111) !important; }