/* =========================================================
   GRUPO SORAN — Design System v3
   Referência estrutural: template institucional de construção
   (topbar, hero full-bleed, icon-boxes, contadores, parallax fixo)
   Paleta própria: azul-marinho + dourado, com toques de glassmorphism.
   ========================================================= */

:root{
  --navy-950:#060f1f;
  --navy-900:#0a1a33;
  --navy-800:#0f2247;
  --navy-700:#122a52;
  --navy-600:#1c3a6b;
  --navy-500:#2b4d84;

  --gold-100:#f6e7bd;
  --gold-300:#e9c464;
  --gold-500:#c9a227;
  --gold-600:#b38f1f;
  --gold-700:#8f701c;

  --ink:#1c2130;
  --paper:#f7f8fa;
  --paper-2:#eef1f5;
  --muted:#66707e;
  --white:#ffffff;

  --line: rgba(15,34,71,.10);
  --line-dark: rgba(255,255,255,.14);

  --glass-bg: rgba(255,255,255,0.10);
  --glass-border: rgba(255,255,255,0.22);

  --shadow-sm: 0 6px 20px rgba(10,26,51,.08);
  --shadow-md: 0 16px 40px rgba(10,26,51,.14);
  --shadow-lg: 0 24px 60px rgba(10,26,51,.22);

  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;

  --ff-display: 'Montserrat', 'Inter', Arial, sans-serif;
  --ff-body: 'Inter', Arial, sans-serif;

  --container: 1240px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--ff-body);
  color:var(--ink);
  background:var(--paper);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{font-family:var(--ff-display); margin:0 0 .5em; color:var(--navy-900); line-height:1.2; font-weight:700;}
p{line-height:1.75; color:var(--muted); margin:0 0 1em;}
.container{max-width:var(--container); margin:0 auto; padding:0 24px;}
section{position:relative;}

/* ---------- Kicker label ---------- */
.kicker{
  display:inline-flex; align-items:center; gap:10px; margin-bottom:16px;
  font-size:.78rem; letter-spacing:2px; text-transform:uppercase;
  color:var(--gold-600); font-weight:700;
}
.kicker::before{content:""; width:26px; height:3px; background:var(--gold-500); border-radius:2px;}
.on-dark .kicker, .kicker.on-dark{color:var(--gold-300);}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 32px; border-radius:6px; font-weight:700; font-size:.85rem; letter-spacing:.4px;
  border:2px solid transparent; cursor:pointer; transition:.3s ease; font-family:var(--ff-body);
}
.btn svg{width:16px; height:16px;}
.btn-gold{background:var(--gold-500); color:var(--navy-950); box-shadow:0 10px 26px rgba(201,162,39,.35);}
.btn-gold:hover{background:var(--gold-600); transform:translateY(-2px); box-shadow:0 14px 32px rgba(201,162,39,.45);}
.btn-outline{background:transparent; border-color:rgba(255,255,255,.55); color:var(--white);}
.btn-outline:hover{background:rgba(255,255,255,.12); border-color:var(--white);}
.btn-outline-navy{background:transparent; border-color:var(--navy-800); color:var(--navy-800);}
.btn-outline-navy:hover{background:var(--navy-800); color:var(--white);}
.btn-text{padding:0; border:none; background:none; color:var(--navy-800); border-bottom:2px solid var(--gold-500); border-radius:0; padding-bottom:4px;}
.btn-text:hover{color:var(--gold-600); gap:16px;}
.btn-text.light{color:var(--white);}
.btn-text.light:hover{color:var(--gold-300);}

/* ---------- Glass ---------- */
.glass{
  background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:var(--radius-md);
  backdrop-filter:blur(18px) saturate(150%); -webkit-backdrop-filter:blur(18px) saturate(150%);
}
.glass-light{
  background:rgba(255,255,255,.65); border:1px solid rgba(15,34,71,.1); border-radius:var(--radius-lg);
  backdrop-filter:blur(16px) saturate(160%); -webkit-backdrop-filter:blur(16px) saturate(160%);
  box-shadow:var(--shadow-md);
}

/* ---------- Topbar ---------- */
.top-bar{
  background:var(--navy-950); color:rgba(255,255,255,.7); font-size:.8rem;
  padding:9px 0; position:relative; z-index:1001;
}
.top-bar .container{display:flex; justify-content:space-between; align-items:center;}
.top-bar-info{display:flex; gap:26px;}
.top-bar-info a{color:rgba(255,255,255,.75); display:inline-flex; align-items:center; gap:7px;}
.top-bar-info a:hover{color:var(--gold-300);}
.top-bar-info svg{width:14px; height:14px;}
.top-bar-social{display:flex; gap:14px;}
.top-bar-social a{color:rgba(255,255,255,.6);}
.top-bar-social a:hover{color:var(--gold-300);}
.top-bar-social svg{width:15px; height:15px;}

/* ---------- Header ---------- */
.site-header{position:sticky; top:0; left:0; right:0; z-index:1000; background:var(--white); box-shadow:0 2px 20px rgba(10,26,51,.06); transition:.3s ease;}
.site-header .container{display:flex; align-items:center; justify-content:space-between; padding:16px 24px;}
.brand{display:flex; align-items:center; gap:12px;}
.brand img{height:44px; width:auto;}
.brand-text{display:flex; flex-direction:column; line-height:1.1;}
.brand-text strong{color:var(--navy-900); font-family:var(--ff-display); font-size:1.05rem; letter-spacing:.3px; font-weight:800;}
.brand-text span{color:var(--gold-600); font-size:.62rem; letter-spacing:1.6px; text-transform:uppercase; font-weight:600;}

.nav-links{display:flex; align-items:center; gap:32px;}
.nav-links a{color:var(--navy-800); font-size:.85rem; font-weight:700; letter-spacing:.3px; position:relative; padding:6px 0;}
.nav-links a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--gold-500); transition:.3s ease;}
.nav-links a:hover::after, .nav-links a.active::after{width:100%;}
.nav-links a.active{color:var(--gold-600);}
.nav-cta{margin-left:6px;}

.nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:6px; z-index:1100;}
.nav-toggle span{display:block; width:24px; height:2px; margin:5px 0; background:var(--navy-900); transition:.3s;}

/* ---------- Hero ---------- */
.hero{position:relative; min-height:92vh; display:flex; align-items:center; overflow:hidden; background:var(--navy-950);}
.hero-media{position:absolute; inset:0; width:100%; height:100%; z-index:0;}
.hero-media video, .hero-media .hero-fallback{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.hero-fallback{
  background:
    radial-gradient(circle at 25% 25%, rgba(201,162,39,.20), transparent 45%),
    radial-gradient(circle at 80% 75%, rgba(28,58,107,.55), transparent 55%),
    linear-gradient(150deg,var(--navy-950) 0%, var(--navy-800) 55%, var(--navy-700) 100%);
  animation: heroDrift 20s ease-in-out infinite alternate;
}
@keyframes heroDrift{0%{background-position:0% 0%, 100% 100%, 0 0;} 100%{background-position:8% 10%, 92% 88%, 0 0;}}
.hero-overlay{position:absolute; inset:0; z-index:1; background:linear-gradient(115deg, rgba(6,15,31,.92) 15%, rgba(6,15,31,.55) 55%, rgba(6,15,31,.35) 100%);}
.hero-particles{position:absolute; inset:0; z-index:1; overflow:hidden; pointer-events:none;}
.hero-particles span{position:absolute; bottom:-10px; width:3px; height:3px; border-radius:50%; background:var(--gold-300); opacity:.55; animation:rise linear infinite;}
@keyframes rise{0%{transform:translateY(0) scale(1); opacity:0;} 10%{opacity:.75;} 100%{transform:translateY(-110vh) scale(.4); opacity:0;}}

.hero-content{position:relative; z-index:2; max-width:640px; padding:80px 0 130px;}
.hero-content h1{color:var(--white); font-size:clamp(2.3rem, 4.6vw, 3.6rem); margin-bottom:22px;}
.hero-content h1 em{font-style:normal; color:var(--gold-300);}
.hero-content p{color:rgba(255,255,255,.75); font-size:1.1rem; max-width:520px;}
.hero-actions{display:flex; gap:16px; margin-top:32px; flex-wrap:wrap;}

/* Feature strip overlapping hero bottom edge */
.feature-strip{position:relative; z-index:3; margin-top:-64px;}
.feature-strip .grid-3{gap:0;}
.feature-card{
  background:var(--white); padding:34px 30px; box-shadow:var(--shadow-md);
  display:flex; gap:18px; align-items:flex-start;
}
.feature-card:first-child{border-radius:var(--radius-md) 0 0 var(--radius-md);}
.feature-card:last-child{border-radius:0 var(--radius-md) var(--radius-md) 0;}
.feature-card .icon{
  width:52px; height:52px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg,var(--gold-300),var(--gold-500)); color:var(--navy-950);
  display:flex; align-items:center; justify-content:center;
}
.feature-card .icon svg{width:24px; height:24px;}
.feature-card h3{font-size:1.02rem; margin-bottom:6px;}
.feature-card p{font-size:.86rem; margin-bottom:0;}

/* ---------- Sections ---------- */
.section{padding:120px 0 100px;}
.section-tight{padding-top:100px;}
.section-sm{padding:80px 0;}
.section-dark{background:var(--navy-900); color:var(--white);}
.section-dark p{color:rgba(255,255,255,.65);}
.section-dark h2,.section-dark h3{color:var(--white);}
.section-shade{background:var(--paper-2);}

/* Parallax fixo (efeito verdadeiro de parallax) */
.parallax-fixed{
  background-attachment:fixed; background-position:center; background-size:cover;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(201,162,39,.14), transparent 40%),
    radial-gradient(circle at 85% 80%, rgba(28,58,107,.6), transparent 45%),
    linear-gradient(160deg,var(--navy-950), var(--navy-800));
}

.section-head{max-width:640px; margin:0 auto 60px; text-align:center;}
.section-head.left{margin:0 0 60px; text-align:left;}
.section-head h2{font-size:clamp(1.9rem,3.4vw,2.7rem);}

/* ---------- Grids ---------- */
.grid{display:grid; gap:28px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}

/* ---------- Service icon-box cards ---------- */
.card{
  background:var(--white); border-radius:var(--radius-md); padding:38px 32px;
  box-shadow:var(--shadow-sm); border:1px solid var(--line);
  transition:.35s ease; text-align:left;
}
.card:hover{transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent;}
.card .icon{
  width:64px; height:64px; border-radius:50%; margin-bottom:22px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--navy-800),var(--navy-600)); color:var(--gold-300);
}
.card .icon svg{width:28px; height:28px;}
.card h3{font-size:1.1rem;}
.card p{font-size:.92rem; margin-bottom:14px;}

/* ---------- About split ---------- */
.split{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;}
.about-visual{position:relative; aspect-ratio:4/5; border-radius:var(--radius-lg); overflow:hidden; background:linear-gradient(160deg,var(--navy-800),var(--navy-600)); box-shadow:var(--shadow-lg);}
.about-visual img.pattern{width:100%; height:100%; object-fit:cover; position:absolute; inset:0; opacity:.5;}
.about-visual .badge{position:absolute; bottom:22px; left:22px; right:22px; padding:22px; display:flex; align-items:center; gap:16px;}
.about-visual .badge strong{display:block; font-family:var(--ff-display); font-size:1.7rem; color:var(--white); font-weight:800;}
.about-visual .badge span{font-size:.78rem; color:rgba(255,255,255,.7);}
.check-list{list-style:none; padding:0; margin:20px 0 26px; display:flex; flex-direction:column; gap:12px;}
.check-list li{display:flex; gap:12px; align-items:flex-start; font-size:.95rem; color:var(--ink);}
.check-list svg{width:20px; height:20px; flex-shrink:0; color:var(--gold-600); margin-top:1px;}

/* ---------- Stats counter (dark, parallax) ---------- */
.stats-row{display:grid; grid-template-columns:repeat(4,1fr); gap:0; text-align:center;}
.stats-row .stat{padding:0 20px; border-right:1px solid var(--line-dark);}
.stats-row .stat:last-child{border-right:none;}
.stats-row .icon{
  width:56px; height:56px; border-radius:50%; margin:0 auto 18px;
  background:rgba(201,162,39,.15); border:1px solid rgba(201,162,39,.4);
  display:flex; align-items:center; justify-content:center; color:var(--gold-300);
}
.stats-row .icon svg{width:26px; height:26px;}
.stats-row strong{display:block; font-family:var(--ff-display); font-size:2.4rem; font-weight:800; color:var(--white); line-height:1;}
.stats-row span{font-size:.8rem; color:rgba(255,255,255,.6); letter-spacing:.5px; text-transform:uppercase;}

/* ---------- Units / project cards ---------- */
.unit-card{
  background:var(--white); border-radius:var(--radius-md); overflow:hidden;
  box-shadow:var(--shadow-sm); border:1px solid var(--line); transition:.3s ease;
}
.unit-card:hover{box-shadow:var(--shadow-lg); transform:translateY(-5px);}
.unit-card .thumb{position:relative; height:150px; overflow:hidden; background:linear-gradient(150deg,var(--navy-800),var(--navy-600));}
.unit-card .thumb img{width:100%; height:100%; object-fit:cover; opacity:.55; position:absolute; inset:0;}
.unit-card .thumb .tag{
  position:absolute; top:14px; left:14px; z-index:2;
  font-size:.66rem; letter-spacing:1.6px; text-transform:uppercase; font-weight:800;
  color:var(--navy-950); background:var(--gold-300); padding:6px 12px; border-radius:20px;
}
.unit-card .body{padding:26px 24px;}
.unit-card h3{font-size:1.1rem; margin-bottom:8px;}
.unit-card .addr{font-size:.86rem; color:var(--muted); margin-bottom:14px;}
.unit-card .meta{font-size:.74rem; color:var(--gold-700); font-weight:700; letter-spacing:.3px; display:block; margin-bottom:16px;}

/* ---------- CTA band ---------- */
.cta-band{border-radius:var(--radius-lg); padding:70px 60px; position:relative; overflow:hidden; background:linear-gradient(135deg,var(--navy-900),var(--navy-700)); color:var(--white); text-align:center;}
.cta-band::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 80% 20%, rgba(201,162,39,.25), transparent 55%);}
.cta-band h2{color:var(--white); position:relative;}
.cta-band p{color:rgba(255,255,255,.72); max-width:560px; margin:0 auto 30px; position:relative;}
.cta-band .btn{position:relative;}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy-950); color:rgba(255,255,255,.68); padding-top:90px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:50px; padding-bottom:60px; border-bottom:1px solid var(--line-dark);}
.footer-grid h4{color:var(--white); font-family:var(--ff-display); font-size:.85rem; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:22px; font-weight:800;}
.footer-grid ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px;}
.footer-grid a{font-size:.92rem; color:rgba(255,255,255,.65); transition:.25s;}
.footer-grid a:hover{color:var(--gold-300);}
.footer-brand p{max-width:280px; font-size:.92rem;}
.footer-brand .brand{margin-bottom:18px;}
.social-row{display:flex; gap:12px; margin-top:20px;}
.social-row a{width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:1px solid var(--line-dark);}
.social-row a:hover{background:var(--gold-500); border-color:var(--gold-500); color:var(--navy-950);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding:26px 0; font-size:.8rem; flex-wrap:wrap; gap:10px;}

/* ---------- Forms ---------- */
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.field{margin-bottom:20px; display:flex; flex-direction:column; gap:8px;}
.field label{font-size:.8rem; font-weight:700; color:var(--navy-800); letter-spacing:.2px;}
.field input, .field select, .field textarea{
  padding:14px 16px; border-radius:var(--radius-sm); border:1px solid var(--line);
  font-family:var(--ff-body); font-size:.95rem; background:var(--white); color:var(--ink); transition:.25s ease;
}
.field input:focus, .field select:focus, .field textarea:focus{outline:none; border-color:var(--gold-500); box-shadow:0 0 0 4px rgba(201,162,39,.15);}
.field textarea{resize:vertical; min-height:140px;}
.honeypot{position:absolute; left:-9999px; opacity:0; height:0; width:0;}
.form-msg{padding:14px 18px; border-radius:var(--radius-sm); font-size:.9rem; margin-bottom:20px; display:none;}
.form-msg.success{background:rgba(46,163,102,.12); color:#1c7a44; display:block;}
.form-msg.error{background:rgba(200,50,50,.1); color:#a52a2a; display:block;}

.contact-card{padding:30px 28px;}
.contact-info-item{display:flex; gap:16px; align-items:flex-start; margin-bottom:26px;}
.contact-info-item .icon{width:44px; height:44px; border-radius:50%; flex-shrink:0; background:linear-gradient(135deg,var(--navy-800),var(--navy-600)); color:var(--gold-300); display:flex; align-items:center; justify-content:center;}
.contact-info-item .icon svg{width:20px; height:20px;}
.contact-info-item strong{display:block; color:var(--navy-900); margin-bottom:4px; font-size:.95rem;}
.contact-info-item span, .contact-info-item a{font-size:.88rem; color:var(--muted);}

/* ---------- Page hero ---------- */
.page-hero{padding:150px 0 90px; background:linear-gradient(160deg,var(--navy-950),var(--navy-800)); position:relative; overflow:hidden; color:var(--white); text-align:center;}
.page-hero .container{position:relative; z-index:2;}
.page-hero .kicker{justify-content:center;}
.page-hero h1{color:var(--white); font-size:clamp(2rem,4vw,2.9rem);}
.page-hero p{color:rgba(255,255,255,.7); max-width:600px; margin:0 auto;}
.breadcrumb{font-size:.82rem; color:rgba(255,255,255,.55); margin-bottom:16px;}
.breadcrumb a{color:var(--gold-300);}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease;}
.reveal.is-visible{opacity:1; transform:translateY(0);}

/* ---------- Timeline ---------- */
.timeline{border-left:3px solid var(--gold-500); padding-left:34px; display:flex; flex-direction:column; gap:40px;}
.timeline-item{position:relative;}
.timeline-item::before{content:""; position:absolute; left:-43px; top:2px; width:16px; height:16px; border-radius:50%; background:var(--navy-900); border:3px solid var(--gold-500);}
.timeline-item strong{display:block; color:var(--gold-500); font-size:.85rem; letter-spacing:1px; margin-bottom:6px; text-transform:uppercase;}

/* ---------- Map ---------- */
.map-frame{border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-sm);}
.map-frame iframe{width:100%; height:100%; min-height:280px; border:0; display:block;}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .grid-3{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr; gap:40px;}
  .stats-row{grid-template-columns:repeat(2,1fr); gap:34px 0;}
  .stats-row .stat{border-right:none; margin-bottom:10px;}
  .feature-strip{margin-top:0;}
  .feature-card, .feature-card:first-child, .feature-card:last-child{border-radius:var(--radius-md);}
}
@media (max-width:900px){
  .split{grid-template-columns:1fr; gap:40px;}
  .nav-links{
    position:fixed; inset:0 0 0 auto; width:78%; max-width:340px; height:100vh;
    background:var(--navy-950); flex-direction:column; justify-content:center; gap:30px;
    transform:translateX(100%); transition:.4s ease; padding:40px;
  }
  .nav-links a{color:rgba(255,255,255,.85);}
  .nav-links a.active{color:var(--white);}
  .nav-links.is-open{transform:translateX(0); box-shadow:-20px 0 60px rgba(0,0,0,.4);}
  .nav-toggle{display:block;}
  .nav-cta{margin-left:0;}
  .top-bar-info a:nth-child(2){display:none;}
}
@media (max-width:680px){
  .grid-2, .grid-3, .grid-4{grid-template-columns:1fr;}
  .form-grid{grid-template-columns:1fr;}
  .section{padding:80px 0;}
  .cta-band{padding:50px 26px;}
  .footer-grid{grid-template-columns:1fr;}
  .footer-bottom{flex-direction:column; text-align:center;}
  .top-bar-info{gap:14px;}
  .top-bar-info span, .top-bar-info a span{display:none;}
}
