/*
Theme Name: PP Galpões — Engenharia Pré-Moldada
Theme URI: https://galpao-premoldado.com
Author: Agência MR
Description: Tema institucional para PP Galpões, com identidade de engenharia técnica (blueprint), estimador estrutural interativo e mapa de obras. Construído para eliminar páginas geo em escala e priorizar conteúdo consolidado e único por região.
Version: 1.0.0
Text Domain: pp-galpoes
*/

/* ==========================================================================
   DESIGN TOKENS
   Paleta: cinza-concreto (estrutura), azul-aço (autoridade/engenharia),
   âmbar-segurança (ação — referência a sinalização de canteiro de obra,
   não um gradiente decorativo).
   Tipografia: Space Grotesk (display, geométrica/técnica) + Inter (corpo)
   + IBM Plex Mono (dados técnicos: m², R$, dimensões, prazos).
   ========================================================================== */
:root{
  --concreto-950:#15161A;
  --concreto-900:#1C1E24;
  --concreto-700:#3A3D46;
  --concreto-400:#8A8D97;
  --concreto-100:#E7E6E1;
  --concreto-50:#F3F2EE;

  --aco-700:#1F3A5C;
  --aco-500:#2E5680;
  --aco-300:#7C9BC0;

  --ambar-600:#D98A1F;
  --ambar-500:#F2A63C;
  --ambar-100:#FBE6C4;

  --ok-600:#2F7D4F;

  --font-display:'Space Grotesk', 'Arial Narrow', sans-serif;
  --font-body:'Inter', -apple-system, sans-serif;
  --font-mono:'IBM Plex Mono', 'Courier New', monospace;

  --radius:2px; /* sharp, técnico — não cartão suave */
  --linha:1px solid var(--concreto-100);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--concreto-900);
  background:#fff;
  line-height:1.6;
  font-size:16px;
}
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-0.01em;
  margin:0 0 0.5em;
}
h1{font-size:clamp(2.2rem,5vw,3.6rem);}
h2{font-size:clamp(1.6rem,3vw,2.2rem);}
h3{font-size:1.25rem;}
a{color:var(--aco-700);text-decoration:none;}
.mono, .dado-tecnico{font-family:var(--font-mono);}
img{max-width:100%;height:auto;display:block;}
.container{max-width:1160px;margin:0 auto;padding:0 24px;}
.eyebrow{
  font-family:var(--font-mono);
  font-size:0.75rem;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ambar-600);
  display:flex;align-items:center;gap:8px;
}
.eyebrow::before{content:"";width:18px;height:2px;background:var(--ambar-500);display:inline-block;}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-mono);
  font-size:0.9rem;
  padding:14px 22px;
  border:1px solid var(--concreto-900);
  border-radius:var(--radius);
  background:var(--concreto-900);
  color:#fff;
  cursor:pointer;
  transition:transform .12s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn-amber{background:var(--ambar-500);border-color:var(--ambar-600);color:var(--concreto-950);}
.btn-outline{background:transparent;color:var(--concreto-900);}

/* Régua de medição — elemento estrutural reutilizável, referência a
   desenho técnico de arquitetura (não decoração aleatória) */
.regua{
  display:flex;align-items:center;gap:0;
  height:14px;margin:8px 0 24px;
}
.regua span{flex:1;border-left:1px solid var(--concreto-400);height:100%;}
.regua span:last-child{border-right:1px solid var(--concreto-400);}

/* Seção blueprint (fundo escuro com grade técnica) */
.blueprint{
  background:
    linear-gradient(var(--aco-700) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(90deg, var(--aco-700) 1px, transparent 1px) 0 0 / 32px 32px,
    var(--concreto-950);
  background-blend-mode:overlay;
  color:#fff;
  padding:64px 0;
}
.blueprint .eyebrow{color:var(--ambar-500);}

@media (max-width:720px){
  .container{padding:0 18px;}
}