/* Consells — site institucional
   Paleta: preto (marca), laranja (acento), azul (cor histórica da marca/logo)
   Tipografia: Inter (mesma fonte usada no ProGuardia, produto irmão da Consells) */

:root{
  --paper:#FFFFFF;
  --paper-alt:#F1F3F5;
  --ink:#0B0B0C;
  --ink-soft:#4A4A4A;
  --ink-faint:#8A8A8A;
  --line:#E3E3E3;
  --blue:#4D61AC;
  --blue-dark:#3A3E7A;
  --orange:#EF6A17;
  --orange-dark:#B44E12;
  --on-dark:#F5F5F3;
  --on-dark-soft:#B9B9B8;
  --on-dark-line:#2A2B2D;
  --banner:#151B32;
  --radius:8px;
  --radius-lg:16px;
  --shadow-sm:0 1px 2px rgba(15,15,20,.04);
  --shadow-md:0 1px 2px rgba(15,15,20,.03), 0 10px 28px rgba(15,15,20,.06);
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}

@media (prefers-color-scheme: dark){
  :root{
    --paper:#0E0E0F;
    --paper-alt:#17181A;
    --ink:#F2F2F0;
    --ink-soft:#C7C7C5;
    --ink-faint:#8C8C8A;
    --line:#2A2B2D;
    --blue:#8E9BD1;
    --blue-dark:#A9B4E0;
    --orange:#FF7E2E;
    --orange-dark:#FFB07F;
    --shadow-sm:0 1px 2px rgba(0,0,0,.3);
    --shadow-md:0 1px 2px rgba(0,0,0,.3), 0 10px 28px rgba(0,0,0,.4);
  }
}
:root[data-theme="dark"]{
  --paper:#0E0E0F; --paper-alt:#17181A; --ink:#F2F2F0; --ink-soft:#C7C7C5;
  --ink-faint:#8C8C8A; --line:#2A2B2D; --blue:#8E9BD1; --blue-dark:#A9B4E0;
  --orange:#FF7E2E; --orange-dark:#FFB07F;
  --shadow-sm:0 1px 2px rgba(0,0,0,.3); --shadow-md:0 1px 2px rgba(0,0,0,.3), 0 10px 28px rgba(0,0,0,.4);
}
:root[data-theme="light"]{
  --paper:#FFFFFF; --paper-alt:#F1F3F5; --ink:#0B0B0C; --ink-soft:#4A4A4A;
  --ink-faint:#8A8A8A; --line:#E3E3E3; --blue:#4D61AC; --blue-dark:#3A3E7A;
  --orange:#EF6A17; --orange-dark:#B44E12;
  --shadow-sm:0 1px 2px rgba(15,15,20,.04); --shadow-md:0 1px 2px rgba(15,15,20,.03), 0 10px 28px rgba(15,15,20,.06);
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink-soft);
  font-family:var(--font);
  line-height:1.6;
  font-weight:400;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1120px; margin:0 auto; padding:0 32px;}

.eyebrow{
  font-size:12.5px; font-weight:600; text-transform:uppercase;
  letter-spacing:1.6px; color:var(--orange-dark); display:inline-block;
}

/* ---------- topbar ---------- */
.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0; border-bottom:1px solid var(--line);
}
.topbar .wrap{display:flex; align-items:center; justify-content:space-between; width:100%;}
.brand{display:flex; align-items:center; gap:14px;}
.brand-mark{height:40px; width:auto; flex-shrink:0;}
.brand-mark rect{fill:none; stroke:var(--blue); stroke-opacity:.45; stroke-width:1.3;}
.brand-mark polygon{fill:var(--blue);}
.brand-text{display:flex; align-items:center; gap:12px;}
.brand-word{font-size:22px; letter-spacing:-0.3px; color:var(--blue); white-space:nowrap;}
.brand-word-light{font-weight:400;}
.brand-word-bold{font-weight:800;}
.brand-divider{width:1px; height:24px; background:var(--blue); opacity:.4;}
.brand-tag{font-size:8px; line-height:1.4; letter-spacing:1px; text-transform:uppercase; color:var(--blue); opacity:.8; font-weight:500;}
nav.mainnav{display:flex; gap:30px; font-size:14.5px; font-weight:500; color:var(--ink-soft);}
nav.mainnav a:hover, nav.mainnav a.ativo{color:var(--orange-dark);}
.nav-toggle{display:none;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 24px; font-size:14.5px; font-weight:600;
  border-radius:var(--radius); border:1px solid transparent;
  cursor:pointer; background:none; font-family:inherit;
}
.btn-primary{background:var(--orange); color:#fff;}
.btn-primary:hover{background:var(--orange-dark);}
.btn-outline{border-color:var(--on-dark-soft); color:var(--on-dark);}
.btn-outline:hover{border-color:#fff; color:#fff;}
.btn-outline-light{border-color:var(--line); color:var(--ink);}
.btn-outline-light:hover{border-color:var(--ink-faint);}

/* ---------- banner (hero + page-hero): azul escuro com marca d'água repetida do logo ---------- */
.hero, .page-hero{
  background-color:var(--banner);
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http://www.w3.org/2000/svg'%20width%3D'110'%20height%3D'110'%20viewBox%3D'0%200%20110%20110'%3E%3Cg%20fill%3D'%237685BC'%20fill-opacity%3D'0.14'%3E%3Cpolygon%20points%3D'43,33%2072,33%2064,43%2038,43'/%3E%3Cpolygon%20points%3D'38,45%2049,45%2041,55%2030,55'/%3E%3Cpolygon%20points%3D'30,57%2041,57%2048,67%2037,67'/%3E%3Cpolygon%20points%3D'38,69%2064,69%2072,80%2043,80'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:110px 110px;
  color:var(--on-dark);
}

/* ---------- hero (páginas internas, sem grid de 2 colunas) ---------- */
.page-hero{padding:64px 0;}
.page-hero .eyebrow{color:var(--orange);}
.page-hero h1{font-size:40px; font-weight:700; letter-spacing:-1px; line-height:1.15; margin:16px 0 14px; color:#fff;}
.page-hero p{font-size:17px; color:var(--on-dark-soft); max-width:60ch; margin:0;}

/* ---------- hero da home ---------- */
.hero{padding:100px 0 90px;}
.hero .wrap{display:grid; grid-template-columns:1.2fr 0.8fr; gap:60px; align-items:center;}
.hero .eyebrow{color:var(--orange);}
.hero h1{font-size:50px; font-weight:700; letter-spacing:-1.5px; line-height:1.12; margin:18px 0 22px; color:#fff;}
.hero h1 .accent{color:var(--orange);}
.hero p.lead{font-size:19px; font-weight:400; color:var(--on-dark-soft); max-width:46ch; margin:0 0 34px;}
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap;}
.hero-side{background:rgba(255,255,255,.03); border:1px solid var(--on-dark-line); border-radius:var(--radius-lg); padding:30px;}
.hero-side h3{font-size:12.5px; text-transform:uppercase; letter-spacing:1.6px; color:var(--on-dark-soft); font-weight:600; margin:0 0 20px;}
.hero-side .row{display:flex; justify-content:space-between; align-items:baseline; padding:14px 0; border-bottom:1px solid var(--on-dark-line); font-size:14px;}
.hero-side .row:last-child{border-bottom:none; padding-bottom:0;}
.hero-side .row .plan{color:#fff; font-weight:500;}
.hero-side .row .price{color:var(--orange); font-weight:700;}

/* ---------- seções ---------- */
section.block{padding:72px 0;}
section.block + section.block{border-top:1px solid var(--line);}
section.block.sem-borda{border-bottom:none;}
section.block.alt{background:var(--paper-alt);}
.block-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:40px; flex-wrap:wrap;}
.block-head h2{font-size:32px; font-weight:700; letter-spacing:-0.7px; color:var(--ink); margin:10px 0 0;}
.block-head h2.pequeno{font-size:25px; letter-spacing:-0.4px;}
.block-head p{font-size:15.5px; color:var(--ink-soft); margin:0; max-width:52ch;}

/* ---------- grupo de serviço (delimita cada pilar claramente) ---------- */
.servico-grupo{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
  padding:40px;
  margin-bottom:28px;
}
.servico-grupo:last-child{margin-bottom:0;}
.servico-grupo .block-head{margin-bottom:32px;}

/* ---------- pilares / serviços (resumo da home) ---------- */
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.pillar{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm); padding:28px 26px;
}
.pillar .idx{
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:50%;
  background:var(--paper-alt); color:var(--blue-dark);
  font-size:13px; font-weight:700; margin-bottom:16px;
}
.pillar h3{font-size:19px; font-weight:700; letter-spacing:-0.3px; color:var(--ink); margin:0 0 10px;}
.pillar p{font-size:14px; color:var(--ink-soft); margin:0 0 22px;}
.pillar .from{font-size:12.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:1px; border-top:1px solid var(--line); padding-top:16px;}
.pillar .from b{color:var(--orange-dark); font-size:16px; letter-spacing:0; text-transform:none;}

/* ---------- tabelas de plano (servicos.php) ---------- */
.planos{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:8px;}
.plano{background:var(--paper-alt); border:1px solid var(--line); border-radius:var(--radius-lg); padding:26px 24px;}
.plano.destaque{border-color:var(--orange); border-width:2px; box-shadow:var(--shadow-sm);}
.plano .selo{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:1.2px; color:var(--orange-dark); margin-bottom:10px;}
.plano h4{font-size:17px; font-weight:700; letter-spacing:-0.2px; color:var(--ink); margin:0 0 6px;}
.plano .preco{font-size:27px; font-weight:700; letter-spacing:-0.5px; color:var(--ink); margin:6px 0 18px;}
.plano .preco span{font-size:13px; font-weight:400; color:var(--ink-faint); letter-spacing:0;}
.plano ul{list-style:none; margin:0; padding:0;}
.plano li{font-size:13.5px; color:var(--ink-soft); padding:9px 0; border-top:1px solid var(--line);}
.plano li:first-child{border-top:none;}
.nota-precos{font-size:12.5px; color:var(--ink-faint); margin-top:20px; font-style:italic;}

/* ---------- produtos ---------- */
.products{display:grid; grid-template-columns:1.3fr 1fr; gap:20px;}
.product-card{padding:32px; color:#fff; background:var(--blue-dark); border-radius:var(--radius-lg); box-shadow:var(--shadow-md);}
.product-card .kicker{font-size:12px; text-transform:uppercase; letter-spacing:1.4px; color:#D9DDF0; margin-bottom:12px; font-weight:600;}
.product-card h3{font-size:23px; font-weight:700; letter-spacing:-0.4px; margin:0 0 12px;}
.product-card p{font-size:14.5px; color:#DEE1F2; margin:0 0 20px; max-width:44ch;}
.product-card a.out{font-size:13.5px; font-weight:600; color:var(--orange);}
.content-list{background:var(--paper-alt); border:1px solid var(--line); border-radius:var(--radius-lg); padding:28px;}
.content-list h3{font-size:17px; font-weight:700; letter-spacing:-0.2px; color:var(--ink); margin:0 0 16px;}
.site-row{display:flex; justify-content:space-between; align-items:center; padding:11px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--ink-soft);}
.site-row:last-child{border-bottom:none;}
.site-row a{color:var(--blue-dark); font-weight:500;}
.status{font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; padding:4px 10px; border-radius:999px; white-space:nowrap;}
.status.live{background:var(--blue); color:#fff;}
.status.soon{background:transparent; color:var(--ink-faint); border:1px solid var(--line);}

/* ---------- ecossistema ---------- */
.ecosystem{display:flex; gap:12px; flex-wrap:wrap;}
.eco-chip{border:1px dashed var(--ink-faint); border-radius:999px; padding:10px 18px; font-size:13px; font-weight:500; color:var(--ink-soft);}

/* ---------- sobre / texto corrido ---------- */
.prosa{max-width:72ch; font-size:16px; color:var(--ink-soft);}
.prosa h2{font-size:25px; font-weight:700; letter-spacing:-0.5px; color:var(--ink); margin:44px 0 16px;}
.prosa h2:first-child{margin-top:0;}
.prosa p{margin:0 0 18px;}
.de-para{
  display:grid; grid-template-columns:1fr auto 1fr; gap:24px; align-items:center;
  margin:30px 0 40px; padding:28px; background:var(--paper-alt);
  border:1px solid var(--line); border-radius:var(--radius-lg);
}
.de-para .lado{font-size:15px;}
.de-para .lado .tag{font-size:11px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color:var(--ink-faint); display:block; margin-bottom:8px;}
.de-para .lado.para .tag{color:var(--orange-dark);}
.de-para .lado.para{font-weight:600; color:var(--ink);}
.de-para .seta{font-size:22px; color:var(--orange); font-weight:700;}

/* ---------- contato ---------- */
.contato-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.contato-card{background:var(--paper-alt); border:1px solid var(--line); border-radius:var(--radius-lg); padding:28px; border-left:3px solid var(--orange);}
.contato-card h3{font-size:12.5px; text-transform:uppercase; letter-spacing:1.4px; color:var(--ink-faint); font-weight:600; margin:0 0 12px;}
.contato-card .valor{font-size:19px; color:var(--ink); font-weight:600;}
.contato-card a.valor{color:var(--blue-dark);}

/* ---------- rodapé ---------- */
footer{background:var(--ink); color:var(--on-dark-soft); padding:36px 0; font-size:12.5px;}
footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
footer .fbrand{color:#fff; font-weight:700; letter-spacing:-0.2px; font-size:14px;}
footer nav{display:flex; gap:20px;}
footer nav a:hover{color:#fff;}

/* ---------- responsivo ---------- */
@media (max-width: 860px){
  .hero .wrap{grid-template-columns:1fr;}
  .pillars, .planos{grid-template-columns:1fr;}
  .products{grid-template-columns:1fr;}
  .contato-grid{grid-template-columns:1fr;}
  .de-para{grid-template-columns:1fr; text-align:center;}
  .hero h1{font-size:34px;}
  .page-hero h1{font-size:28px;}
  .servico-grupo{padding:26px;}
  .topbar .wrap{flex-wrap:wrap; gap:14px;}
  nav.mainnav{
    order:3; width:100%; gap:18px; flex-wrap:wrap;
    font-size:13px; padding-top:14px; border-top:1px solid var(--line);
  }
}