/* ============================================================================
   ToldosHaus — camada de identidade sobre o chb-base.css
   Sistema reto/industrial: sem cantos arredondados, tipografia Sora/DM Sans/
   DM Mono, amarelo só em CTA e detalhe. Carregado só em páginas CH Builder.
   ============================================================================ */

/* ── Tokens (":root:root" vence o bloco inline #chb-brand, que usa ":root") ── */
:root:root {
	--chb-font: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--chb-font-display: 'Sora', 'DM Sans', system-ui, sans-serif;
	--chb-font-condensed: 'DM Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
	--chb-title-tracking: -0.02em;
	--chb-title-weight: 800;

	--chb-radius: 0px;
	--chb-radius-lg: 0px;
	--chb-shadow: 0 1px 0 rgba(14, 14, 14, .04), 0 24px 48px -30px rgba(14, 14, 14, .35);

	--chb-shell: 1240px;
	--chb-shell-narrow: 820px;
	--chb-section-y: clamp(4.5rem, 3rem + 5vw, 7.5rem);

	/* Neutros quentes do design (o padrão do plugin é azulado) */
	--chb-ink:       #141414;
	--chb-ink-soft:  #4A4A46;
	--chb-ink-mute:  #8A8A82;
	--chb-paper:     #FFFFFF;
	--chb-paper-alt: #F4F4F1;
	--chb-line:      #E3E3DE;
}

body.chb-site {
	font-family: var(--chb-font);
	color: var(--chb-ink);
	-webkit-font-smoothing: antialiased;
}

/* Títulos: text-wrap balance, tracking negativo (marca) */
.chb-site h1, .chb-site h2, .chb-site h3, .chb-site h4 { text-wrap: balance; }
.chb-site p { text-wrap: pretty; }

/* ── Botões ── */
.chb-btn { border-radius: 0; font-family: var(--chb-font-display); font-weight: 700; letter-spacing: .005em; }
.chb-btn--primary {
	/* canto chanfrado (diagonal 12px em dois vértices opostos) */
	clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
}
.chb-btn--ghost { border-width: 1px; }
.chb-hero .chb-btn--ghost { border-color: rgba(255, 255, 255, .45); }
.chb-hero .chb-btn--ghost:hover { border-color: var(--chb-accent); color: var(--chb-accent); background: transparent; }

/* ── Cabeçalho (fundo #0E0E0E vem das Configurações; aqui só o acabamento) ── */
.chb-header { backdrop-filter: none; border-bottom: 1px solid #232323; }
.chb-header__inner { min-height: 72px; }
.chb-header__logo img { max-height: 46px; }
/* O acesso ao WhatsApp já está no CTA do menu + botão flutuante + barra mobile;
   o botão verde padrão do plugin no cabeçalho fica redundante e fora da paleta. */
.chb-header__wa { display: none; }
.chb-nav__list a { border-radius: 0; font-weight: 500; letter-spacing: .01em; }
.chb-nav__list .chb-nav-cta a {
	border-radius: 0;
	clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
}
@media (max-width: 768px) {
	.chb-nav { inset-block-start: 72px; }
	.chb-nav__list .chb-nav-cta a { clip-path: none; margin-top: .4em; }
}

/* ── Cabeçalho de seção: alinhado à esquerda (o padrão do plugin centraliza) ── */
.chb-section-header { text-align: left; margin-bottom: clamp(2rem, 1rem + 3vw, 3rem); }
.chb-section-header .chb-section__lead { margin-inline: 0; }
.chb-section__eyebrow {
	font-family: var(--chb-font-condensed); font-weight: 500; letter-spacing: .14em;
	font-size: 12px; text-transform: uppercase; color: var(--chb-accent-text, #B98700);
}
.chb-section__title { max-width: 22ch; font-size: clamp(1.75rem, 1.2rem + 2.4vw, 2.75rem); line-height: 1.12; }
.chb-section__lead { color: var(--chb-ink-soft); max-width: 60ch; }
.chb-section__cta { text-align: left; }
/* CTA em faixa continua centralizado (final da home, fim de página de solução) */
.chb-cta .chb-cta__inner { text-align: center; }

/* ── Hero ── */
.chb-hero { min-height: min(88vh, 760px); }
.chb-hero--compact { min-height: 0; }
.chb-hero:not(.chb-hero--compact) { align-items: flex-end; }
.chb-hero__inner { align-items: flex-start; text-align: left; }
.chb-hero__title { max-width: 16ch; margin-inline: 0; line-height: 1.03; }
.chb-hero__sub { margin-inline: 0; font-weight: 700; opacity: 1; color: #fff; max-width: 52ch; }
.chb-hero__text { margin-inline: 0; color: #B9B9B4; opacity: 1; max-width: 56ch; }
.chb-hero__actions { justify-content: flex-start; }
/* rótulo do hero: traço amarelo + texto mono, sem pílula */
.chb-hero__eyebrow {
	display: inline-flex; align-items: center; gap: 10px;
	background: none; padding: 0; border-radius: 0;
	color: var(--chb-accent); font-family: var(--chb-font-condensed); font-weight: 500;
	letter-spacing: .14em; font-size: 12px; text-transform: uppercase;
}
.chb-hero__eyebrow::before { content: ""; width: 28px; height: 3px; background: var(--chb-accent); display: block; flex: none; }
/* sem foto real ainda: textura industrial em vez do gradiente amarelo padrão */
.chb-hero--plain {
	background:
		linear-gradient(180deg, rgba(14, 14, 14, .12) 0%, rgba(14, 14, 14, .94) 78%),
		repeating-linear-gradient(135deg, #1c1c1c 0 14px, #171717 14px 28px);
	color: #fff;
}
@media (min-width: 820px) {
	.chb-hero--split .chb-hero__inner { align-items: stretch; }
}

/* ── Texto + Imagem ── */
.chb-text-image__media img,
.chb-text-image__media .chb-media-placeholder { box-shadow: none; border: 1px solid var(--chb-line); }
.chb-text-image__content .chb-section-header { text-align: left; }

/* ── Cards (Diferenciais, Como funciona) ── */
.chb-cards .chb-card { border-radius: 0; }
.chb-cards .chb-card::before {
	content: ""; display: block; width: 34px; height: 3px;
	background: var(--chb-accent); margin-bottom: 16px;
}
.chb-cards .chb-card:hover { transform: none; box-shadow: none; border-color: var(--chb-accent); }
.chb-card__eyebrow { font-family: var(--chb-font-condensed); color: var(--chb-accent-text, #B98700); letter-spacing: .12em; }
.chb-card__title { line-height: 1.25; }

/* ── link-cards (Soluções, Projetos) ── */
.chb-link-card { border-radius: 0; }
.chb-link-card__title { line-height: 1.25; }
.chb-link-card__claim { color: var(--chb-ink); }
.chb-link-cards__chip { border-radius: 0; font-family: var(--chb-font-display); }

/* ── CTA ── */
.chb-cta__title { font-size: clamp(1.9rem, 1.3rem + 2.6vw, 3rem); }
.chb-cta__text { opacity: 1; }
.chb-cta .chb-cta__inner .chb-cta__text { color: inherit; }
/* faixa amarela (assistente): texto escuro de apoio mais legível */
.chb-cta:not(.chb-cta--has-bg):not(.chb-cta--radial) .chb-cta__text { color: #3B3100; }

/* ── FAQ ── */
.chb-faq__item { border-radius: 0; }
.chb-faq .chb-section-header { text-align: left; }
.chb-faq__q { font-family: var(--chb-font-display); }

/* ── Galeria: tiles de placeholder vazios discretos (a borda amarela cheia
   fica pra quando houver foto de verdade) ── */
.chb-gallery__item:has(.chb-media-placeholder) { border-color: var(--chb-line); box-shadow: none; }

/* ── Contato ── */
.chb-contact__form { border-radius: 0; }
.chb-contact__form input, .chb-contact__form textarea, .chb-contact__form select { border-radius: 0 !important; }

/* ── Seções invertidas (A ToldosHaus, faixas escuras) ── */
.chb-section--invert { background: #0E0E0E; }
.chb-section--invert .chb-section__eyebrow { color: var(--chb-accent); }

/* ── Rodapé ── */
.chb-footer h2 { color: var(--chb-accent); opacity: 1; letter-spacing: .04em; }
.chb-footer__logo img { max-height: 48px; }
.chb-footer__tagline { max-width: 34ch; }

/* ── Botão flutuante do WhatsApp: pílula preta com borda amarela ── */
.chb-wa-float {
	width: auto; height: 52px; border-radius: 0; gap: 10px; padding: 0 20px;
	background: #0E0E0E; color: #fff; border: 1px solid var(--chb-accent);
	font-family: var(--chb-font-display); font-weight: 700; font-size: 14px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
}
.chb-wa-float:hover { background: var(--chb-accent); color: #0E0E0E; transform: none; }
.chb-wa-float svg { width: 18px; height: 18px; flex: none; }
.chb-wa-float::after { content: "Solicite um orçamento"; white-space: nowrap; }

/* ── Movimento: entrada suave das seções (reveal via IntersectionObserver no
   toldoshaus-assistente.js — classe .th-reveal / .th-in). Sem JS ou com
   prefers-reduced-motion, o conteúdo aparece normal. ── */
@media (prefers-reduced-motion: no-preference) {
	.chb-main > section.th-reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
	.chb-main > section.th-reveal.th-in { opacity: 1; transform: none; }
}
