/* ============================================
   HIGIDUTOS — Design v3: fiel ao folheto, com acabamento web moderno
   ============================================ */
:root{
  --navy: #1B1464;
  --navy-deep: #100B3D;
  --lime: #A6CE39;
  --lime-deep: #87AC28;
  --sky: #4FA8D8;
  --gold: #E8B923;
  --red: #D64545;
  --paper: #FFFFFF;
  --paper-dim: #F6F6F3;
  --ink: #16151F;
  --ink-soft: #55545F;
  --line: rgba(20,20,26,0.10);

  --display: "Poppins", "Arial Black", sans-serif;
  --body: "Inter", -apple-system, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;

  --max: 1180px;
  --radius: 14px;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0; font-family: var(--body); color: var(--ink);
  background: var(--paper); line-height: 1.6; -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration:none; }
h1,h2,h3,h4{
  font-family: var(--display); font-weight: 800; letter-spacing: -0.01em;
  line-height: 1.05; margin: 0 0 0.4em; text-transform: uppercase;
}
p{ margin: 0 0 1em; color: var(--ink-soft); }
.container{ max-width: var(--max); margin: 0 auto; padding: 0 28px; }

.eyebrow{
  font-family: var(--mono); font-size: 0.75rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--navy); display: inline-flex; align-items:center; gap:8px;
  margin-bottom: 14px; font-weight:600;
}
.eyebrow::before{ content:""; width: 22px; height: 3px; background: var(--lime); display:inline-block; border-radius:2px; }
.eyebrow.on-dark{ color: var(--lime); }
.eyebrow.on-dark::before{ background: var(--gold); }

/* ============================================
   HEADER
   ============================================ */
.site-header{ position: sticky; top:0; z-index: 50; background: var(--navy); box-shadow: 0 2px 24px -4px rgba(16,11,61,0.35); }
.site-header .inner{ max-width: var(--max); margin:0 auto; padding: 14px 28px; display:flex; align-items:center; justify-content: space-between; gap:24px; }
.brand img.logo{ height: 42px; width:auto; }
nav.main-nav{ display:flex; align-items:center; gap: 26px; }
nav.main-nav a{ color: rgba(255,255,255,0.82); font-size: 0.88rem; font-weight: 600; padding: 6px 2px; border-bottom: 2px solid transparent; transition: border-color .15s, color .15s; }
nav.main-nav a:hover, nav.main-nav a[aria-current="page"]{ color: var(--white,#fff); border-color: var(--lime); }
.btn{
  display:inline-flex; align-items:center; gap:8px; font-family: var(--body); font-weight: 700;
  font-size: 0.88rem; padding: 13px 24px; border-radius: 100px; border: none; cursor:pointer;
  transition: transform .15s, box-shadow .15s;
}
.btn:hover{ transform: translateY(-2px); }
.btn-lime{ background: var(--lime); color: var(--navy-deep); box-shadow: 0 6px 18px -6px rgba(166,206,57,0.5); }
.btn-lime:hover{ box-shadow: 0 12px 26px -6px rgba(166,206,57,0.65); }
.btn-outline{ background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,0.4); }
.btn-outline:hover{ border-color: var(--lime); background: rgba(255,255,255,0.06); }
.btn-navy{ background: var(--navy); color: #fff; box-shadow: 0 6px 18px -6px rgba(27,20,100,0.4); }

/* ============================================
   HERO — real photography, not illustration
   ============================================ */
.hero{ background: var(--navy-deep); color: #fff; position: relative; overflow: hidden; }
.hero .container{ position:relative; z-index:2; display:grid; grid-template-columns: 1fr; gap: 0; padding: 100px 28px 90px; max-width: var(--max); margin:0 auto; }
.hero-copy{ max-width: 640px; }
.hero h1{ color:#fff; font-size: clamp(2.3rem, 4.2vw, 3.5rem); margin-bottom: 20px; }
.hero h1 em{ font-style:normal; color: var(--lime); }
.hero p.lead{ color: rgba(255,255,255,0.82); font-size: 1.1rem; max-width: 480px; margin-bottom: 30px; }
.hero .cta-row{ display:flex; gap:14px; flex-wrap:wrap; }
.hero .phc-bg-wrap{ position:absolute; inset:0; z-index:0; }
.hero .phc-scrim{ position:absolute; inset:0; z-index:1; background: linear-gradient(100deg, rgba(16,11,61,0.95) 0%, rgba(16,11,61,0.82) 40%, rgba(16,11,61,0.45) 100%); }

.hero-strip{ background: var(--lime); color: var(--navy-deep); clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%); position:relative; }
.hero-strip .inner{ max-width: var(--max); margin:0 auto; padding: 34px 28px 38px; display:grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.stat{ padding-left: 20px; border-left: 2px solid rgba(16,11,61,0.22); }
.stat:first-child{ border-left:none; padding-left:0; }
.stat .num{ font-family: var(--display); font-weight: 800; font-size: 2.6rem; line-height:1; display:block; margin-bottom: 6px; }
.stat .label{ font-size: 0.9rem; font-weight:600; }

/* ============================================
   SECTIONS
   ============================================ */
section{ padding: 88px 0; }
section.tight{ padding: 64px 0; }
.section-head{ max-width: 640px; margin-bottom: 48px; }
.section-head h2{ font-size: clamp(2rem, 3.4vw, 2.7rem); color: var(--navy); }
.section-head p{ font-size: 1.04rem; }

/* Process — numbered squares like the folheto */
.process{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 36px; }
.process .step{ background: var(--paper-dim); border-radius: var(--radius); padding: 30px 26px; }
.process .step .idx{
  width:44px; height:44px; border: 2px solid var(--navy); border-radius: 10px;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--display); font-weight:800; color: var(--navy); margin-bottom:18px;
}
.process .step h3{ font-size: 1.15rem; color: var(--ink); text-transform:none; letter-spacing:0; }
.process .step p{ font-size: 0.95rem; margin-bottom:0; }

/* Diagonal color bands */
.band{ padding: 68px 0; position: relative; }
.band-lime{ background: linear-gradient(120deg, var(--lime) 0%, var(--lime-deep) 100%); color: var(--navy-deep); }
.band-navy{ background: linear-gradient(120deg, var(--navy) 0%, var(--navy-deep) 100%); color: #fff; }
.band-slant-r{ clip-path: polygon(0 0, 100% 0, 94% 100%, 0 100%); }
.band-slant-l{ clip-path: polygon(6% 0, 100% 0, 100% 100%, 0 100%); }
.band .stat-row{ display:grid; grid-template-columns: repeat(3,1fr); gap: 26px; margin-top: 14px; }
.band .stat-row .stat{ border-left-color: rgba(255,255,255,0.3); }
.band-lime .stat-row .stat{ border-left-color: rgba(16,11,61,0.22); }

/* Cards */
.card-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 26px; }
.card{
  background: var(--paper); border-radius: var(--radius); padding: 30px;
  box-shadow: 0 4px 22px -8px rgba(20,20,26,0.12); border-top: 4px solid var(--lime);
  transition: transform .15s, box-shadow .15s;
}
.card:hover{ transform: translateY(-4px); box-shadow: 0 14px 34px -10px rgba(20,20,26,0.18); }
.card h3{ font-size: 1.08rem; text-transform:none; letter-spacing:0; color: var(--navy); margin-bottom: 10px; }
.card p{ font-size: 0.94rem; margin-bottom: 14px; }

/* Photo grid — for real jobsite images */
.photo-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.photo-grid figure{ margin:0; border-radius: var(--radius); overflow:hidden; box-shadow: 0 6px 24px -10px rgba(20,20,26,0.18); }
.photo-grid img{ width:100%; height: 220px; object-fit: cover; display:block; }
.photo-grid figcaption{ background: var(--paper-dim); padding: 12px 16px; font-family: var(--mono); font-size: 0.74rem; color: var(--ink-soft); }
.photo-split{ display:grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items:center; }
.photo-split img{ width:100%; border-radius: var(--radius); box-shadow: 0 10px 34px -12px rgba(20,20,26,0.22); }
@media (max-width: 800px){ .photo-grid{ grid-template-columns: 1fr 1fr; } .photo-split{ grid-template-columns: 1fr; } }
@media (max-width: 560px){ .photo-grid{ grid-template-columns: 1fr; } }
.badge{
  display:inline-block; font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.03em;
  background: var(--paper-dim); border: 1px solid var(--line); color: var(--navy);
  padding: 5px 10px; border-radius: 100px; margin: 0 6px 6px 0; font-weight:600;
}
.norms-strip{ display:flex; flex-wrap:wrap; gap:10px; margin-top: 10px; }

/* Stat tiles (Quem Somos style) */
.tile-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.tile{ padding: 30px 24px; border-radius: 4px; }
.tile:nth-child(odd){ background: var(--lime); color: var(--navy-deep); }
.tile:nth-child(even){ background: var(--navy); color: #fff; }
.tile .num{ font-family: var(--display); font-weight:800; font-size: 2rem; display:block; margin-bottom:6px; }
.tile .label{ font-family: var(--mono); font-size: 0.72rem; letter-spacing:0.04em; text-transform:uppercase; opacity:0.9; }

/* Client wall */
.client-wall{ display:grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.client-wall .client{ background: var(--paper-dim); border-radius: 10px; padding: 20px 20px; border-left: 4px solid var(--sky); }
.client-wall .client .name{ font-family: var(--display); font-weight: 800; font-size: 1.02rem; text-transform: uppercase; color: var(--navy); margin-bottom: 4px; }
.client-wall .client .city{ font-family: var(--mono); font-size: 0.74rem; color: var(--ink-soft); }

/* Table */
.data-table{ width:100%; border-collapse: separate; border-spacing:0; border-radius: var(--radius); overflow:hidden; box-shadow: 0 4px 22px -10px rgba(20,20,26,0.14); }
.data-table th{ background: var(--lime); color: var(--navy-deep); text-align:left; font-family: var(--mono); font-size: 0.76rem; letter-spacing: 0.05em; text-transform: uppercase; padding: 14px 20px; }
.data-table td{ padding: 13px 20px; border-bottom: 1px solid var(--line); font-size: 0.94rem; background: var(--paper); }
.data-table tr:nth-child(even) td{ background: var(--paper-dim); }
.data-table tr:last-child td{ border-bottom:none; }

/* CTA band */
.cta-band{ background: linear-gradient(150deg, var(--navy) 0%, var(--navy-deep) 100%); color: #fff; text-align:center; padding: 76px 0; position:relative; overflow:hidden; }
.cta-band::before{ content:""; position:absolute; width:400px; height:400px; border-radius:50%; background: radial-gradient(circle, rgba(166,206,57,0.22), transparent 70%); top:-140px; right:-100px; }
.cta-band h2{ color: #fff; font-size: clamp(1.9rem,3vw,2.5rem); position:relative; }
.cta-band p{ color: rgba(255,255,255,0.78); max-width: 520px; margin: 0 auto 28px; position:relative; }
.cta-band .cta-row{ display:flex; gap: 14px; justify-content:center; flex-wrap:wrap; position:relative; }

/* Footer */
footer.site-footer{ background: var(--navy-deep); color: rgba(255,255,255,0.6); padding: 54px 0 26px; font-size: 0.9rem; }
footer.site-footer .inner{ display:grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 32px; margin-bottom: 34px; }
footer.site-footer h4{ color: #fff; font-size: 0.78rem; letter-spacing: 0.08em; margin-bottom: 14px; text-transform:uppercase; font-family: var(--mono); }
footer.site-footer a{ display:block; margin-bottom: 9px; color: rgba(255,255,255,0.6); }
footer.site-footer a:hover{ color: var(--lime); }
footer.site-footer .verse{ font-family: var(--mono); font-size: 0.8rem; color: rgba(255,255,255,0.42); border-top: 1px solid rgba(255,255,255,0.12); padding-top: 20px; }

/* Social icon buttons */
.header-actions{ display:flex; align-items:center; gap:14px; }
.social-icon-header{ width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:center; transition:background .15s, transform .15s; flex-shrink:0; }
.social-icon-header:hover{ background:var(--lime); transform:translateY(-2px); }
.social-icon-header svg{ width:18px; height:18px; fill:#fff; transition:fill .15s; }
.social-icon-header:hover svg{ fill:var(--navy-deep); }
.social-row{ display:flex; gap:10px; margin-top:10px; }
.social-icon{ width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:center; transition:background .15s, transform .15s; }
.social-icon:hover{ background:var(--lime); transform:translateY(-2px); }
.social-icon svg{ width:18px; height:18px; fill:#fff; transition:fill .15s; }
.social-icon:hover svg{ fill:var(--navy-deep); }

/* Legal pages */
.legal-body{ max-width:760px; margin:0 auto; }
.legal-body .updated{ font-family:var(--mono); font-size:0.78rem; color:var(--ink-soft); display:block; margin-bottom:2em; }
.legal-body h2{ font-size:1.3rem; margin-top:2em; color:var(--navy); text-transform:none; letter-spacing:0; }
.legal-body h3{ font-size:1.05rem; margin-top:1.4em; text-transform:none; letter-spacing:0; color:var(--ink); }
.legal-body p, .legal-body li{ font-size:0.96rem; color:var(--ink-soft); line-height:1.75; }
.legal-body ul{ padding-left:1.3em; margin-bottom:1em; }
.legal-body strong{ color:var(--ink); }

/* Footer legal links row */
.legal-links{ margin-top:16px; display:flex; gap:18px; flex-wrap:wrap; font-size:0.8rem; }
.legal-links a{ color:rgba(255,255,255,0.5); }
.legal-links a:hover{ color:var(--lime); }

/* Nav dropdown for legal pages */
.nav-dropdown{ position:relative; }
.nav-dropdown > a::after{ content:" ▾"; font-size:0.7em; opacity:0.7; }
.nav-dropdown-menu{
  position:absolute; top:100%; left:0; margin-top:14px;
  background:var(--navy-deep); min-width:220px; padding:8px 0; border-radius:6px;
  box-shadow:0 14px 30px -8px rgba(0,0,0,0.4);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .15s, transform .15s, visibility .15s; z-index:100;
}
.nav-dropdown:hover .nav-dropdown-menu, .nav-dropdown:focus-within .nav-dropdown-menu{
  opacity:1; visibility:visible; transform:translateY(0);
}
.nav-dropdown-menu a{ display:block; padding:10px 18px; font-size:0.85rem; font-weight:500; color:rgba(255,255,255,0.8); border-bottom:none; }
.nav-dropdown-menu a:hover, .nav-dropdown-menu a[aria-current="page"]{ background:rgba(255,255,255,0.06); color:var(--lime); }

/* Page hero (interior) */
.page-hero{ background: linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); color: #fff; padding: 68px 0 58px; position:relative; overflow:hidden; }
.page-hero::before{ content:""; position:absolute; width:420px; height:420px; border-radius:50%; background: radial-gradient(circle, rgba(166,206,57,0.22), transparent 70%); top:-160px; right:-100px; }
.page-hero .container{ position:relative; }
.page-hero h1{ color:#fff; font-size: clamp(2.1rem, 4vw, 3.1rem); }
.page-hero p{ color: rgba(255,255,255,0.8); max-width: 620px; font-size: 1.04rem; }

/* Page hero carousel — replaces solid navy title block with rotating photos */
.page-hero-carousel{ position:relative; overflow:hidden; min-height:380px; display:flex; align-items:flex-end; }
.phc-bg-wrap{ position:absolute; inset:0; }
.phc-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.4s ease; }
.phc-bg.active{ opacity:1; }
.phc-scrim{ position:absolute; inset:0; background:linear-gradient(100deg, rgba(16,11,61,0.94) 0%, rgba(16,11,61,0.8) 42%, rgba(16,11,61,0.4) 100%); }
.phc-content{ position:relative; z-index:2; padding:64px 0 48px; width:100%; }
.phc-content h1{ color:#fff; font-size: clamp(2.1rem, 4vw, 3.1rem); }
.phc-content p{ color:rgba(255,255,255,0.82); max-width:620px; font-size:1.04rem; }
@media (max-width:700px){ .page-hero-carousel{ min-height:320px; } }

/* WhatsApp float */
.wa-float{ position: fixed; right: 24px; bottom: 24px; z-index: 60; background: var(--lime); color: var(--navy-deep); width: 58px; height:58px; border-radius: 50%; display:flex; align-items:center; justify-content:center; box-shadow: 0 10px 26px -6px rgba(0,0,0,0.4); font-size: 1.5rem; }

/* Responsive */
@media (max-width: 900px){
  nav.main-nav{ display:none; }
  .hero .container{ grid-template-columns: 1fr; }
  .hero-strip .inner, .band .stat-row, .process, footer.site-footer .inner, .tile-grid{ grid-template-columns: 1fr 1fr; }
  .stat{ border-left:none !important; padding-left:0 !important; border-top: 2px solid rgba(255,255,255,0.25); padding-top: 12px; }
  .band-lime .stat-row .stat{ border-top-color: rgba(16,11,61,0.22); }
  .stat-row .stat:first-child{ border-top:none; padding-top:0; }
}
@media (max-width: 560px){
  .hero-strip .inner, .process, footer.site-footer .inner, .tile-grid{ grid-template-columns: 1fr; }
}


/* Original Home page components */

.founder{ background:var(--navy-deep); color:#fff; position:relative; overflow:hidden; padding:88px 0; }
.founder::before{ content:""; position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle, rgba(166,206,57,0.16), transparent 70%); top:-140px; left:-100px; }
.founder .container{ position:relative; display:grid; grid-template-columns:280px 1fr; gap:48px; align-items:center; }
.founder .portrait{ position:relative; }
.founder .portrait img{ width:100%; border-radius:var(--radius); box-shadow:0 20px 44px -16px rgba(0,0,0,0.5); }
.founder .portrait .badge-cert{ position:absolute; bottom:-14px; left:-14px; background:var(--lime); color:var(--navy-deep); font-family:var(--mono); font-size:0.68rem; font-weight:700; letter-spacing:0.03em; padding:8px 14px; border-radius:100px; box-shadow:0 8px 18px -6px rgba(0,0,0,0.4); }
.founder .copy p.quote{ font-size:1.3rem; font-weight:500; color:#fff; line-height:1.4; margin-bottom:22px; }
.founder .copy .name{ font-family:var(--display); font-weight:800; font-size:1.15rem; text-transform:uppercase; color:var(--lime); margin-bottom:2px; }
.founder .copy .role{ font-family:var(--mono); font-size:0.78rem; color:rgba(255,255,255,0.6); margin-bottom:22px; }
@media (max-width:760px){ .founder .container{ grid-template-columns:1fr; } .founder .portrait{ max-width:220px; margin:0 auto; } }
.photo-grid{ display:grid; grid-template-columns: 1.4fr 1fr; grid-template-rows: 1fr 1fr; gap:16px; height:520px; }
.photo-grid figure{ margin:0; border-radius:var(--radius); overflow:hidden; box-shadow:0 8px 28px -12px rgba(20,20,26,0.25); position:relative; height:100%; }
.photo-grid figure.big{ grid-row: 1 / 3; }
.photo-grid img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s; }
.photo-grid figure:hover img{ transform:scale(1.04); }
.photo-grid figcaption{ position:absolute; left:0; right:0; bottom:0; padding:16px 20px; background:linear-gradient(0deg, rgba(16,11,61,0.85), transparent); color:#fff; font-family:var(--mono); font-size:0.76rem; }
@media (max-width:860px){ .photo-grid{ grid-template-columns:1fr; grid-template-rows:auto; height:auto; } .photo-grid figure.big{ grid-row:auto; } .photo-grid figure{ height:240px; } }

/* Carousel */
.carousel{ position:relative; border-radius:var(--radius); overflow:hidden; box-shadow:0 12px 36px -14px rgba(20,20,26,0.3); }
.carousel-track{ display:flex; transition:transform .6s cubic-bezier(.4,0,.2,1); }
.carousel-slide{ min-width:100%; position:relative; flex-shrink:0; }
.carousel-slide img{ width:100%; height:480px; object-fit:cover; display:block; }
.carousel-caption{ position:absolute; left:0; right:0; bottom:0; padding:22px 30px; background:linear-gradient(0deg, rgba(16,11,61,0.88) 0%, transparent 100%); color:#fff; }
.carousel-caption .k{ font-family:var(--mono); font-size:0.72rem; letter-spacing:0.05em; color:var(--lime); display:block; margin-bottom:4px; text-transform:uppercase; }
.carousel-caption .v{ font-family:var(--display); font-weight:700; font-size:1.1rem; text-transform:uppercase; }
.carousel-nav{ position:absolute; top:50%; transform:translateY(-50%); width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,0.92); display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,0.25); border:none; font-size:1.3rem; color:var(--navy); z-index:2; transition:background .15s, transform .15s; }
.carousel-nav:hover{ background:var(--lime); transform:translateY(-50%) scale(1.06); }
.carousel-nav.prev{ left:18px; } .carousel-nav.next{ right:18px; }
.carousel-dots{ position:absolute; bottom:18px; left:50%; transform:translateX(-50%); display:flex; gap:9px; z-index:2; }
.carousel-dots button{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,0.55); cursor:pointer; border:none; padding:0; transition:width .2s, background .2s; }
.carousel-dots button.active{ background:var(--lime); width:26px; border-radius:5px; }
@media (max-width:700px){ .carousel-slide img{ height:320px; } .carousel-nav{ width:38px; height:38px; font-size:1.1rem; } }