/* ============================================================
   TRN ENGENHARIA — Landing Page
   Fiel ao design Figma aprovado · responsivo
   ============================================================ */

:root{
  --navy:#010124;
  --navy-2:#03034f;
  --ink:#0a0b12;
  --ink-2:#141619;
  --gold:#ffbb0f;
  --paper:#f5f6f7;
  --line:#e5e5e5;
  --muted:rgba(61,61,61,.85);
  --form-line:#67678f;
  --red:#9d0909;
  --green:#086c1c;
  --blue:#024fa3;
  --maxw:1320px;
  --ls:-0.722px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--navy);
  color:#fff;
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}

/* ---------- shared ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px;width:100%}
.section{position:relative;width:100%}

.display{
  font-family:"Inter Tight",sans-serif;
  font-weight:400;
  font-size:65px;
  line-height:75px;
  letter-spacing:var(--ls);
  margin:0;
  text-wrap:balance;
}
.lead{
  font-size:20px;
  line-height:26.79px;
  letter-spacing:var(--ls);
  opacity:.85;
  margin:0;
  text-wrap:pretty;
}
.pill{
  display:inline-flex;align-items:center;justify-content:center;
  height:37px;border-radius:100px;padding:0 17px;
  font-size:20px;line-height:26.79px;letter-spacing:var(--ls);opacity:.85;
  white-space:nowrap;
}
.pill--light{box-shadow:inset 0 0 0 1px var(--paper);color:var(--paper)}
.pill--dark{box-shadow:inset 0 0 0 1px var(--navy);color:var(--navy)}
.pill--ink{box-shadow:inset 0 0 0 1px var(--ink);color:var(--ink)}

/* ---------- CTA button ---------- */
.cta{display:inline-flex;align-items:stretch;gap:14px}
.cta__main{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--gold);color:var(--ink);
  border-radius:4px;border:none;
  padding:2px 24px;height:61px;
  font-size:18.6px;line-height:26.79px;letter-spacing:var(--ls);
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease;
}
.cta__arrow{
  width:61px;height:61px;flex:0 0 61px;
  background:var(--gold);border-radius:10px;border:none;
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s ease,box-shadow .25s ease;
}
.cta__arrow svg{width:22px;height:22px;transition:transform .3s ease}
.cta:hover .cta__main{transform:translateY(-2px);box-shadow:0 12px 26px -10px rgba(255,187,15,.6)}
.cta:hover .cta__arrow{transform:translateY(-2px);box-shadow:0 12px 26px -10px rgba(255,187,15,.6)}
.cta:hover .cta__arrow svg{transform:translate(2px,-2px)}

/* avatar stack */
.avatars{display:flex;align-items:center;gap:12px}
.avatars__imgs{display:flex}
.avatars__imgs img{
  width:36px;height:36px;border-radius:50%;object-fit:cover;
  border:2px solid var(--navy);margin-left:-12px;
}
.avatars__imgs img:first-child{margin-left:0}
.avatars__txt{font-weight:500;font-size:14.8px;line-height:18.6px;letter-spacing:-.15px;max-width:140px}

/* ============================================================
   STICKY NAV (aparece ao rolar)
   ============================================================ */
.topbar{
  position:fixed;top:0;left:0;right:0;z-index:90;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 40px;
  background:rgba(1,1,36,.82);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.08);
  transform:translateY(-110%);
  transition:transform .4s cubic-bezier(.22,1,.36,1);
}
.topbar.show{transform:translateY(0)}
.topbar__logo{height:34px;filter:brightness(0) invert(1)}
.topbar .cta__main{height:46px;font-size:16px;padding:2px 18px}
.topbar nav{display:flex;gap:28px;align-items:center}
.topbar nav a{font-size:15.5px;opacity:.82;letter-spacing:-.3px;transition:opacity .2s}
.topbar nav a:hover{opacity:1}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  background:var(--navy);
  padding:40px 0 0;
  position:relative;
  overflow:hidden;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
.hero__bg-video{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
  pointer-events:none;
}
.hero .wrap{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  flex:1;
  width:100%;
  justify-content:space-between;
}
.hero__logo{display:flex;justify-content:center;margin-bottom:40px;flex-shrink:0}
.hero__logo img{height:78px;filter:brightness(0) invert(1);opacity:.92}
.hero__logo--desktop{display:flex}
.hero__logo--mobile{display:none}
.hero__panel{
  background:var(--navy);
  width:100%;
  max-width:440px;
  padding:32px;
  margin-top:auto;
  margin-left:-40px;
  margin-right:auto;
}
.hero__grid{
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:start;
}
.hero__panel .display{
  color:#fff;
  max-width:100%;
  font-size:26px;
  line-height:32px;
}
.hero__panel .lead{
  color:rgba(255,255,255,.88);
  max-width:100%;
  font-size:14px;
  line-height:19px;
}
.hero__actions{display:flex;align-items:center;gap:16px;margin-top:20px;flex-wrap:wrap}

/* ============================================================
   STATS BAR
   ============================================================ */
.stats{background:#fff;color:var(--ink);min-height:170px;display:flex;align-items:center}
.stats__row{
  display:flex;justify-content:center;align-items:center;gap:120px;flex-wrap:wrap;
  padding:24px 0;
}
.stat{display:flex;align-items:center;gap:19px}
.stat__num{font-size:86px;line-height:86px;letter-spacing:-7.31px;color:var(--ink);white-space:nowrap}
.stat__lbl{font-weight:500;font-size:17.7px;line-height:25.2px;letter-spacing:-.35px;color:var(--muted);max-width:110px}

/* ============================================================
   SERVIÇOS ("O que fazemos")
   ============================================================ */
.services{background:var(--paper);color:var(--navy);padding:140px 0}
.services .display,.services .lead{color:var(--navy)}
.head-block{max-width:702px}
.head-block .display{margin-top:18px}
.head-block .lead{margin-top:12px}
.services__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:45px}
.svc-card{
  background:#fff;padding:24px;display:flex;flex-direction:column;gap:31px;
  clip-path:polygon(0 0, 87% 0, 100% 13%, 100% 100%, 0 100%);
  transition:transform .35s ease,box-shadow .35s ease;
}
.svc-card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -28px rgba(1,1,36,.4)}
.svc-ico{
  width:48px;height:48px;border-radius:1px;background:var(--navy);
  display:flex;align-items:center;justify-content:center;flex:0 0 48px;
}
.svc-ico svg{width:30px;height:30px;stroke:#fff;fill:none}
.svc-card__txt{display:flex;flex-direction:column;gap:9px}
.svc-card h3{margin:0;font-weight:500;font-size:22.6px;line-height:27.6px;letter-spacing:-.989px;color:var(--ink)}
.svc-card p{margin:0;font-weight:500;font-size:17.7px;line-height:25.2px;letter-spacing:-.35px;color:var(--navy)}
.svc-card__img{width:100%;height:245px;margin-top:auto;background:linear-gradient(135deg,#eef0f2,#e2e5e8);object-fit:cover}

.svc-wide{
  margin-top:36px;background:var(--navy);overflow:hidden;
  display:grid;grid-template-columns:497px 1fr;gap:60px;align-items:center;
  padding:36px 61px;
  clip-path:polygon(0 0, 94% 0, 100% 14%, 100% 100%, 0 100%);
}
.svc-wide__img{width:100%;height:436px;background:linear-gradient(135deg,#15173a,#0c0e2c);object-fit:cover}
.svc-wide__body{display:flex;flex-direction:column;gap:22px;max-width:531px}
.svc-wide__ico{width:78px;height:78px;border-radius:2px;background:var(--gold);display:flex;align-items:center;justify-content:center}
.svc-wide__ico svg{width:39px;height:39px;stroke:var(--ink);fill:none}
.svc-wide h3{margin:0;font-weight:500;font-size:36.4px;line-height:44.4px;letter-spacing:-1.591px;color:#fff}
.svc-wide p{margin:0;font-weight:500;font-size:28.5px;line-height:40.5px;letter-spacing:-.563px;color:#fff}

/* ============================================================
   GALERIA ("Cada obra é uma promessa")
   ============================================================ */
.gallery{background:var(--navy);padding:151px 0;position:relative;overflow:hidden}
.gallery .head-block .display,.gallery .head-block .lead{color:var(--paper)}
.gallery__grid{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin-top:60px}
.obra-card{cursor:pointer}
.obra-card__thumb{
  height:545px;overflow:hidden;border-radius:1px;position:relative;
  clip-path:polygon(0 0, 91% 0, 100% 13%, 100% 100%, 0 100%);
}
.obra-card__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.obra-card:hover .obra-card__thumb img{transform:scale(1.06)}
.obra-card__title{margin:22px 0 0;font-weight:500;font-size:24.4px;line-height:30px;letter-spacing:-1.05px;color:var(--paper)}
.obra-card__loc{margin:5px 0 0;font-weight:500;font-size:16px;line-height:21.6px;letter-spacing:-.32px;color:#b9babb}
.gallery__cta{display:flex;justify-content:center;margin-top:70px}

/* ============================================================
   PORTFÓLIO
   ============================================================ */
.portfolio {
  background: var(--navy);
  padding: 120px 0;
}
.portfolio__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 36px;
  margin-top: 50px;
}
.project-card {
  background: var(--navy-2);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.project-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.4);
}
.project-carousel {
  position: relative;
  width: 100%;
  aspect-ratio: 4/3;
  overflow: hidden;
}
.project-carousel__track {
  width: 100%;
  height: 100%;
  position: relative;
}
.project-carousel__slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.6s ease;
  z-index: 1;
}
.project-carousel__slide.active {
  opacity: 1;
  z-index: 2;
}
.project-carousel__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.project-carousel__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(1, 1, 36, 0.7);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(255,255,255,0.1);
  color: #fff;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: background 0.2s, color 0.2s;
  padding: 0;
}
.project-carousel__btn:hover {
  background: var(--gold);
  color: var(--ink);
}
.project-carousel__btn--prev {
  left: 12px;
}
.project-carousel__btn--next {
  right: 12px;
}
.project-carousel__dots {
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 10;
}
.project-carousel__dots .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,0.4);
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
}
.project-carousel__dots .dot.active {
  background: var(--gold);
  transform: scale(1.2);
}
.project-info {
  padding: 24px;
}
.project-info h3 {
  margin: 0 0 6px;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
}
.project-loc {
  margin: 0;
  font-size: 14px;
  color: #b9babb;
  opacity: 0.85;
}

@media (max-width: 1024px) {
  .portfolio__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .portfolio__grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   PROCESSO ("Da primeira conversa...")
   ============================================================ */
.process{background:#fff;color:var(--ink);padding:120px 0}
.process__inner{display:grid;grid-template-columns:1fr 680px;gap:80px;align-items:center}
.process .head-block .display{color:var(--ink);font-size:48px;line-height:56px}
.process .head-block .lead{color:var(--ink)}
.steps{display:flex;flex-direction:column;margin-top:48px;max-width:495px}
.step{display:flex;gap:15px;position:relative}
.step__num{
  width:48px;height:48px;flex:0 0 48px;border-radius:50%;background:var(--ink-2);
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:500;font-size:20.7px;letter-spacing:-.989px;z-index:1;
}
.step__line{position:absolute;left:23px;top:48px;bottom:-10px;width:2px;background:rgba(102,102,102,.7)}
.step:last-child .step__line{display:none}
.step__body{padding-bottom:37px}
.step__body h3{margin:0 0 10px;font-weight:500;font-size:29.6px;line-height:32.7px;letter-spacing:-1.2px;color:var(--ink)}
.step__body p{margin:0;font-weight:500;font-size:18px;line-height:25.2px;letter-spacing:-.35px;color:var(--muted);max-width:431px}
.process__img{
  height:710px;
  clip-path:polygon(0 0, calc(100% - 110px) 0, 100% 110px, 100% 100%, 110px 100%, 0 calc(100% - 110px));
  overflow:hidden;
}
.process__img img{width:100%;height:100%;object-fit:cover}

/* ============================================================
   COMPARATIVO ("A diferença...")
   ============================================================ */
.compare{background:var(--navy);padding:150px 0;position:relative;overflow:hidden}
.compare .head-block{max-width:833px}
.compare .head-block .display,.compare .head-block .lead{color:var(--paper)}
.compare__cols{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:60px;align-items:stretch}
.cmp-card{border-radius:20px;padding:90px 58px;display:flex;flex-direction:column}
.cmp-card--bad{background:radial-gradient(120% 90% at 50% 26%,#030349 0%,#010124 100%);box-shadow:inset 0 0 0 1px #09097e}
.cmp-card--good{background:#fff;box-shadow:inset 0 0 0 1px #030341}
.cmp-card h3{font-family:"Inter Tight",sans-serif;font-weight:400;letter-spacing:var(--ls);margin:0 0 45px;opacity:.92}
.cmp-card--bad h3{font-size:65px;line-height:75px;color:rgba(245,246,247,.85)}
.cmp-card--good h3{font-size:56.6px;line-height:65.3px;color:var(--navy)}
.cmp-list{display:flex;flex-direction:column;gap:9px}
.cmp-row{display:flex;align-items:center;gap:8px;padding-bottom:9px;border-bottom:.5px solid}
.cmp-card--bad .cmp-row{border-color:#03034f}
.cmp-card--good .cmp-row{border-color:#f1f1f1}
.cmp-row span{font-size:20px;line-height:26.79px;letter-spacing:var(--ls);opacity:.92;padding:7px 0}
.cmp-card--bad .cmp-row span{color:rgba(245,246,247,.8)}
.cmp-card--good .cmp-row span{color:var(--navy)}
.cmp-ico{width:26px;height:26px;flex:0 0 26px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.cmp-ico--x{background:linear-gradient(180deg,#b70909,#ed1111)}
.cmp-ico--check{background:linear-gradient(180deg,#1ff51b,#08691c)}
.cmp-ico svg{width:13px;height:13px;stroke:#fff;stroke-width:2.4;fill:none}

/* ============================================================
   PREÇOS
   ============================================================ */
.pricing{background:#fff;padding:150px 0 0;display:flex;flex-direction:column;gap:96px}
.price-row{display:flex;justify-content:center;gap:0;flex-wrap:wrap}
.price-card{
  border:1px solid var(--line);padding:20px;min-width:397px;flex:1;max-width:430px;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;
}
.price-card .num{font-family:"Inter Tight",sans-serif;font-size:65px;line-height:75px;letter-spacing:var(--ls);opacity:.9}
.price-card .cap{font-size:20px;line-height:26.79px;letter-spacing:var(--ls);color:#363737;white-space:pre-line}
.price-card--red .num{color:var(--red)}
.price-card--green{background:var(--green);border-color:var(--green)}
.price-card--green .num{color:#fff}
.price-card--green .cap{color:rgba(255,255,255,.92);font-size:14px;line-height:19px}
.price-card--mid .num{color:var(--green)}
.pricing__img{width:100%;height:auto}
.pricing__img img{width:100%;display:block}

/* ============================================================
   DEPOIMENTOS
   ============================================================ */
.testi{background:#f5f5f5;color:var(--navy);padding:100px 0}
.testi__head{display:flex;justify-content:space-between;align-items:center;gap:40px;flex-wrap:wrap}
.testi__head h2{font-family:"Inter Tight",sans-serif;font-weight:400;font-size:46.4px;line-height:53.6px;letter-spacing:-.516px;color:var(--navy);margin:0;max-width:491px;opacity:.92}
.testi__avatars .avatars__imgs img{border-color:#f5f5f5}
.testi__avatars .avatars__txt{color:var(--navy)}
.testi__track-wrap{overflow:hidden;margin-top:56px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.testi__track{display:flex;gap:25px;width:max-content;animation:marquee 40s linear infinite}
.testi__track-wrap:hover .testi__track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
.tcard{
  width:395px;flex:0 0 395px;background:#fff;border-radius:2px;
  padding:48px 26px 26px;position:relative;margin-top:24px;
}
.tcard__avatar{position:absolute;top:-24px;left:24px;width:58px;height:58px;border-radius:50%;overflow:hidden;border:1px solid #fff}
.tcard__avatar img{width:100%;height:100%;object-fit:cover}
.tcard__quote{position:absolute;top:20px;right:26px;font-family:"Inter Tight",serif;font-size:70px;line-height:1;color:#eef0f1}
.tcard h4{margin:0 0 14px;font-weight:500;font-size:25px;line-height:30px;letter-spacing:-1.05px;color:#0a0a0a;white-space:pre-line}
.tcard p{margin:0 0 28px;font-size:19px;line-height:26.79px;letter-spacing:var(--ls);color:#2b2b2b;opacity:.9;white-space:pre-line}
.tcard__foot{display:flex;justify-content:space-between;align-items:flex-end}
.tcard__name b{display:block;font-weight:400;font-size:17px;line-height:23px;letter-spacing:-.3px;color:var(--ink)}
.tcard__name span{font-weight:500;font-size:16px;line-height:21.6px;letter-spacing:-.32px;color:var(--muted)}
.tcard__stars{display:flex;gap:3px;color:var(--gold)}
.tcard__stars svg{width:16px;height:16px;fill:currentColor}

/* ============================================================
   MARCA ("10 anos...")
   ============================================================ */
.brand{background:var(--navy);padding:130px 0;position:relative;overflow:hidden}
.brand__watermark{
  position:absolute;left:50%;bottom:-4%;transform:translateX(-50%);
  font-family:"Inter Tight",sans-serif;font-weight:700;font-style:italic;
  font-size:520px;line-height:.8;color:#0c2f7a;opacity:.16;letter-spacing:-20px;
  pointer-events:none;white-space:nowrap;z-index:0;
}
.brand__inner{display:grid;grid-template-columns:649px 1fr;gap:80px;position:relative;z-index:1;align-items:center}
.brand__media{position:relative;width:649px;height:834px}
.brand__shape{
  position:absolute;inset:0;background:var(--blue);
  clip-path:polygon(0 0, 81.4% 0, 100% 14.5%, 100% 100%, 24.3% 100%, 0 81.1%);
  overflow:hidden;
}
.brand__shape img{position:absolute;left:-6%;top:-3%;width:118%;height:114%;object-fit:contain;object-position:bottom}
.brand__badge{
  position:absolute;left:-58px;bottom:130px;width:300px;height:247px;
  border-radius:13px;background:rgba(1,1,36,.5);backdrop-filter:blur(25px);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.2),0 0 38px 8px rgba(255,255,255,.06);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;z-index:2;
}
.brand__badge svg{width:90px;height:90px}
.brand__badge b{font-weight:700;font-size:25px;color:#f3edfa;text-align:center}
.brand__body{display:flex;flex-direction:column;gap:34px;max-width:640px;position:relative;z-index:1}
.brand__body .display{color:#fff}
.brand__body .bio{font-size:20px;line-height:26.79px;letter-spacing:var(--ls);color:var(--paper);opacity:.85;white-space:pre-line;margin:0}
.brand__check{display:flex;flex-direction:column;gap:18px;margin-top:6px}
.brand__check li{display:flex;align-items:center;gap:14px;list-style:none;font-weight:700;font-size:20px;letter-spacing:var(--ls);color:var(--paper);opacity:.9}
.brand__check svg{width:24px;height:24px;flex:0 0 24px}
.brand__check ul{margin:0;padding:0}

/* ============================================================
   CONTATO (form)
   ============================================================ */
.contact{background:var(--navy);padding:100px 0 120px;position:relative;overflow:hidden}
.contact__watermark{
  position:absolute;right:-120px;top:50%;transform:translateY(-50%) rotate(90deg);
  font-family:"Inter Tight",sans-serif;font-weight:700;font-style:italic;
  font-size:300px;color:#0c2f7a;opacity:.14;letter-spacing:-10px;pointer-events:none;
}
.contact__card{
  background:#fff;color:var(--navy);max-width:1355px;margin:0 auto;
  padding:47px 128px 60px;position:relative;z-index:1;
  clip-path:polygon(0 0, 81.8% 0, 100% 19.6%, 100% 100%, 0 100%);
}
.contact__card h2{font-family:"Inter Tight",sans-serif;font-weight:700;font-size:65px;line-height:75px;letter-spacing:var(--ls);color:var(--navy);margin:0 0 18px;max-width:683px;opacity:.92}
.contact__card .lead{color:var(--navy);max-width:683px}
.form{margin-top:39px}
.form__grid{display:grid;grid-template-columns:1fr 1fr;gap:43px}
.field{border:1px solid var(--form-line);height:70px;padding:0 14px;display:flex;align-items:center;position:relative}
.field--full{grid-column:1 / -1}
.field input,.field select{
  border:none;background:none;outline:none;width:100%;height:100%;
  font-family:inherit;font-size:25.19px;letter-spacing:-.756px;color:var(--navy);
}
.field select{appearance:none;color:var(--form-line)}
.field input::placeholder{color:var(--form-line)}
.field--select::after{
  content:"";position:absolute;right:18px;top:50%;width:11px;height:11px;
  border-right:2px solid var(--form-line);border-bottom:2px solid var(--form-line);
  transform:translateY(-70%) rotate(45deg);pointer-events:none;
}
.form__submit{grid-column:1 / -1;margin-top:-4px}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--navy);padding:60px 0 40px}
.footer__top{display:flex;justify-content:space-between;align-items:center;gap:40px;margin-bottom:30px;flex-wrap:wrap}
.footer__logo{height:54px;filter:brightness(0) invert(1);opacity:.95;flex-shrink:0}
.footer__quote{font-size:19px;line-height:1.4;letter-spacing:-.4px;color:#fff;max-width:480px;text-align:right;opacity:.7;margin:0}
.footer__divider{height:1px;background:rgba(255,255,255,.08);margin-bottom:30px}
.footer__bottom{display:flex;flex-direction:column;align-items:center;gap:12px}
.footer__address{font-size:14px;line-height:1.5;color:#fff;opacity:.6;text-align:center;margin:0;white-space:nowrap}
.footer__links{display:flex;gap:16px;font-size:14px;opacity:.6;color:#fff;justify-content:center}
.footer__link{color:#fff;text-decoration:none;transition:opacity .2s}
.footer__link:hover{opacity:.8;text-decoration:underline}
.footer__sep{opacity:.5}

/* ============================================================
   ANIMAÇÕES (estado inicial — GSAP revela)
   ============================================================ */
.reveal{opacity:0;transform:translateY(40px)}
.is-ready .reveal{will-change:transform,opacity}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none}
  .testi__track{animation:none}
}

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media (max-width:1200px){
  :root{--ls:-0.4px}
  .display,.cmp-card--bad h3{font-size:52px;line-height:60px}
  .cmp-card--good h3{font-size:46px;line-height:54px}
  .process__inner{grid-template-columns:1fr;gap:60px}
  .process__img{height:600px}
  .process .head-block .display{font-size:42px;line-height:48px}
  .brand__inner{grid-template-columns:1fr;gap:60px}
  .brand__media{margin:0 auto}
  .contact__card{padding:47px 60px 60px}
  .svc-wide{grid-template-columns:1fr;gap:30px}
  .svc-wide__img{height:300px}
}
@media (max-width:900px){
  .wrap{padding:0 24px}
  .services{padding:90px 0}
  .gallery{padding:90px 0}
  .process{padding:90px 0}
  .compare{padding:90px 0}
  .brand{padding:90px 0}
  .services__grid{grid-template-columns:1fr 1fr}
  .gallery__grid{grid-template-columns:1fr}
  .compare__cols{grid-template-columns:1fr}
  .stats__row{gap:48px}
  .stat__num{font-size:64px;line-height:64px;letter-spacing:-4px}
  .topbar nav{display:none}
  .hero{min-height:auto;height:auto;padding:0}
  .hero__bg-video{position:relative;height:42vh;z-index:1}
  .hero .wrap{padding:0;z-index:2}
  .hero__logo--desktop{display:none}
  .hero__logo--mobile{display:flex;justify-content:flex-start;margin-bottom:24px}
  .hero__logo--mobile img{height:46px}
  .hero__panel{
    max-width:100%;
    padding:32px 24px 48px;
    background:transparent;
    margin:0;
    clip-path:none;
  }
  .hero__grid{display:block}
  .hero__panel .display{font-size:36px;line-height:42px;margin-bottom:16px}
  .hero__panel .lead{font-size:16px;line-height:22px;margin-bottom:24px}
  .hero__actions{margin-top:24px;gap:16px;justify-content:space-between}
  .price-card{min-width:0;flex:1 1 240px}
  .brand__media{width:100%;max-width:520px;height:auto;aspect-ratio:649/834}
  .brand__badge{left:0}
}
@media (max-width:600px){
  :root{--ls:-0.3px}
  .display,.contact__card h2,.cmp-card--bad h3{font-size:38px;line-height:44px}
  .cmp-card--good h3{font-size:34px;line-height:40px}
  .process .head-block .display{font-size:32px;line-height:38px}
  .lead,.pill,.cmp-row span,.price-card .cap{font-size:17px;line-height:23px}
  .hero__logo img{height:58px}
  .hero__logo--mobile img{height:38px}
  .hero__panel{clip-path:none}
  .hero__panel .display{font-size:30px;line-height:36px}
  .hero__panel .lead{font-size:15px;line-height:21px}
  .services__grid{grid-template-columns:1fr}
  .svc-wide{padding:28px}
  .svc-wide h3{font-size:28px;line-height:34px}
  .svc-wide p{font-size:21px;line-height:30px}
  .cta{flex-wrap:nowrap}
  .cta__main{font-size:16px;height:54px;padding:2px 18px}
  .cta__arrow{width:54px;height:54px;flex-basis:54px}
  .stat__num{font-size:54px;line-height:54px}
  .stats__row{flex-direction:column;gap:28px;align-items:flex-start}
  .stat{width:100%}
  .process__img{
    height:420px;
    clip-path:polygon(0 0, calc(100% - 60px) 0, 100% 60px, 100% 100%, 60px 100%, 0 calc(100% - 60px));
  }
  .step__body h3{font-size:25px}
  .cmp-card{padding:48px 28px}
  .testi__head h2{font-size:34px;line-height:40px}
  .tcard{width:300px;flex-basis:300px}
  .price-card .num,.brand__body .display{font-size:44px;line-height:52px}
  .price-row{flex-direction:column;align-items:stretch}
  .price-card{max-width:none}
  .contact__card{padding:40px 24px 48px;clip-path:none}
  .contact__card h2{font-size:34px;line-height:40px}
  .form__grid{grid-template-columns:1fr;gap:0}
  .field{margin-bottom:18px}
  .field input,.field select{font-size:19px}
  .footer__top{flex-direction:column;align-items:center;text-align:center;gap:20px;margin-bottom:24px}
  .footer__quote{text-align:center;font-size:16px;max-width:100%}
  .footer__divider{margin-bottom:24px}
  .footer__bottom{gap:16px}
  .footer__address{white-space:normal}
  .brand__watermark{font-size:280px}
  .brand__media{
    display:flex;
    flex-direction:column;
    height:auto;
    aspect-ratio:auto;
  }
  .brand__shape{
    position:relative;
    width:100%;
    aspect-ratio:649/834;
  }
  .brand__badge{
    position:relative;
    left:auto;
    bottom:auto;
    margin:24px auto 0;
    width:100%;
    max-width:300px;
    height:auto;
    padding:30px 20px;
  }
}

@media (min-width: 901px) {
  .hero__panel .cta__main {
    height: 48px;
    font-size: 14px;
    padding: 2px 18px;
  }
  .hero__panel .cta__arrow {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
  }
}
