/* ============================================================
   BASE Engenharia & Consultoria — folha de estilo partilhada
   ============================================================ */

:root{
  --brand-blue: #1E32EB;
  --brand-blue-dark: #141F9E;
  --ink: #0B1220;
  --ink-soft: #1B2333;
  --concrete: #F4F5F7;
  --concrete-deep: #E9EBEF;
  --steel: #5B6472;
  --steel-light: #9AA1AC;
  --paper: #FFFFFF;
  --signal: #FF6A1A;
  --signal-dark: #E2530C;
  --line: rgba(11,18,32,0.09);
}

html{ scroll-behavior:smooth; }

body{
  background-color: var(--paper);
  color: var(--ink);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.font-display{
  font-family: 'Manrope', 'Inter', sans-serif;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0.5rem;
  font-family:'Manrope', sans-serif;
  font-weight:600;
  font-size:0.95rem;
  letter-spacing:0.005em;
  padding: 0.85rem 1.75rem;
  border-radius: 9999px;
  transition: all .2s ease;
  white-space:nowrap;
}
.btn-primary{
  background: var(--signal);
  color: var(--paper);
  box-shadow: 0 8px 20px -6px rgba(255,106,26,0.45);
}
.btn-primary:hover{
  background: var(--signal-dark);
  box-shadow: 0 10px 24px -6px rgba(255,106,26,0.55);
  transform: translateY(-1px);
}
.btn-secondary{
  background: var(--paper);
  color: var(--ink);
  border: 1.5px solid var(--line);
}
.btn-secondary:hover{
  border-color: var(--ink);
  background: var(--concrete);
}
.btn-light{
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 8px 20px -8px rgba(11,18,32,0.25);
}
.btn-light:hover{
  background: var(--concrete);
}
.btn-whatsapp{
  background:#25D366;
  color:#fff;
  box-shadow: 0 8px 20px -6px rgba(37,211,102,0.5);
}
.btn-whatsapp:hover{
  background:#1FB855;
  box-shadow: 0 10px 24px -6px rgba(37,211,102,0.6);
  transform: translateY(-1px);
}

/* ---------- Tags / eyebrows ---------- */
.eyebrow{
  font-family:'Manrope', sans-serif;
  font-size:0.8rem;
  font-weight:700;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color: var(--signal-dark);
}
.eyebrow-light{
  color:#FFA36B;
}
.tag-pill{
  display:inline-flex;
  align-items:center;
  font-family:'Manrope', sans-serif;
  font-size:0.72rem;
  font-weight:700;
  letter-spacing:0.05em;
  text-transform:uppercase;
  color: var(--signal-dark);
  background: rgba(255,106,26,0.1);
  padding: 0.35rem 0.85rem;
  border-radius: 9999px;
}
.tag-pill-blue{
  color: var(--brand-blue);
  background: rgba(30,50,235,0.09);
}
.tag-pill-dark{
  color:#fff;
  background: rgba(255,255,255,0.12);
}

/* ---------- Cards ---------- */
.card{
  background: var(--paper);
  border:1px solid var(--line);
  border-radius: 1.25rem;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.card:hover{
  border-color: transparent;
  box-shadow: 0 20px 40px -20px rgba(11,18,32,0.25);
  transform: translateY(-3px);
}

/* ---------- Nav link underline ---------- */
.nav-link{ position:relative; }
.nav-link::after{
  content:"";
  position:absolute;
  left:0; bottom:-4px;
  width:0; height:2px;
  border-radius:2px;
  background: var(--signal);
  transition: width .2s ease;
}
.nav-link:hover::after{ width:100%; }

/* ---------- Form fields ---------- */
.field{
  width:100%;
  background: var(--paper);
  border:1.5px solid var(--line);
  border-radius: 0.85rem;
  padding: 0.85rem 1.1rem;
  font-family:'Inter',sans-serif;
  font-size:0.95rem;
  color: var(--ink);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.field:focus{
  outline:none;
  border-color: var(--brand-blue);
  box-shadow: 0 0 0 4px rgba(30,50,235,0.1);
}
.field::placeholder{ color: var(--steel-light); }

/* ---------- Focus visibility ---------- */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline: 2px solid var(--brand-blue);
  outline-offset: 2px;
  border-radius: 0.5rem;
}

/* ---------- Check list ---------- */
.check-item{
  display:flex;
  gap:0.7rem;
  align-items:flex-start;
}
.check-icon{
  flex-shrink:0;
  width:1.35rem; height:1.35rem;
  border-radius:9999px;
  background: rgba(30,50,235,0.1);
  color: var(--brand-blue);
  display:flex; align-items:center; justify-content:center;
  margin-top:0.1rem;
}

/* ---------- Photo frames ---------- */
.photo-frame{
  border-radius: 1.5rem;
  overflow:hidden;
  position:relative;
  background: var(--concrete-deep);
}
.photo-frame img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- WhatsApp float ---------- */
.wa-float{
  position:fixed;
  right:1.25rem;
  bottom:1.25rem;
  z-index:50;
  box-shadow: 0 10px 30px -8px rgba(37,211,102,0.55);
}

/* ---------- Cookie banner ---------- */
#cookie-banner{
  position:fixed; left:1rem; right:1rem; bottom:1rem; z-index:60;
  transform: translateY(140%);
  transition: transform .35s ease;
  border-radius: 1.25rem;
  box-shadow: 0 20px 45px -15px rgba(11,18,32,0.35);
}
#cookie-banner.show{ transform: translateY(0); }

/* ---------- Utility: number labels ---------- */
.plan-label{
  font-family:'Manrope', sans-serif;
  font-size:0.72rem;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color: var(--steel-light);
}

/* Soft radial accent used behind hero photos */
.accent-blob{
  position:absolute;
  border-radius: 9999px;
  filter: blur(60px);
  opacity:0.35;
  z-index:0;
}