/* ═══════════════════════════════════════════════════════════
   METALLIUM  ·  Industrial Premium v3
   Sora (headings) · Inter (body)
   Off-white · Grafite · Cobre-bronze
═══════════════════════════════════════════════════════════ */

/* ── 1. Variables ─────────────────────────────────────── */
:root {
  /* Copper brand */
  --copper:        #A85828;
  --copper-light:  #C06A38;
  --copper-dark:   #7A3E18;
  --copper-pale:   #CE8858;

  /* Light backgrounds */
  --off-white:     #ECEBE4;  /* hero + primary */
  --paper:         #F5F2EB;  /* lighter, Sobre / Sust */
  --concrete:      #E3DDD5;  /* Materiais */

  /* Dark sections */
  --graphite:      #1A1510;  /* primary dark */
  --graphite-2:    #252018;
  --graphite-3:    #312A22;

  /* Text */
  --text:          #1A1510;
  --text-mid:      #4A4038;
  --text-muted:    #8A7C72;
  --text-inv:      #F0EDE6;
  --text-inv-mid:  rgba(240,237,230,0.55);

  /* Borders */
  --bdr:           rgba(168,88,40,0.11);
  --bdr-dark:      rgba(26,21,16,0.07);

  /* Type */
  --sans:   'Sora', sans-serif;
  --body:   'Inter', sans-serif;

  /* Layout */
  --max:    1200px;
  --pad:    48px;
  --sec-y:  140px;

  /* Easing */
  --ease:  cubic-bezier(.25,.46,.45,.94);
  --eout:  cubic-bezier(.0,.0,.2,1);
}

/* ── 2. Reset ─────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--body);background:var(--off-white);color:var(--text);line-height:1.65;overflow-x:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul,ol{list-style:none}

/* ── 3. Layout helpers ────────────────────────────────── */
.container{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.sec{padding:var(--sec-y) 0;position:relative}
.sec--paper    {background:var(--paper)}
.sec--concrete {background:var(--concrete)}
.sec--dark     {background:var(--graphite)}

/* ── 4. Typography atoms ──────────────────────────────── */
.kicker{
  display:inline-block;
  font-family:var(--sans);font-size:11px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--copper);margin-bottom:18px;
}
.kicker--light{color:var(--copper-pale)}

.sec-title{
  font-family:var(--sans);
  font-size:clamp(34px,4vw,56px);
  font-weight:800;line-height:1.1;letter-spacing:-.02em;
  color:var(--text);margin-bottom:20px;
}
.sec-title em{color:var(--copper);font-style:italic}
.sec-title--light{color:var(--text-inv)}
.sec-title--light em{color:var(--copper-pale)}

.sec-lead{
  font-size:17px;font-weight:300;
  line-height:1.75;color:var(--text-muted);
  max-width:540px;
}
.sec-lead--light{color:var(--text-inv-mid)}

.sec-header{text-align:center;max-width:620px;margin:0 auto 80px}
.sec-header .sec-lead{margin:0 auto}

/* ── 5. Buttons ───────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--sans);font-weight:600;font-size:14px;
  letter-spacing:.03em;border:none;cursor:pointer;
  border-radius:4px;white-space:nowrap;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .2s;
}
.btn:hover{transform:translateY(-2px)}

.btn--copper{
  background:linear-gradient(135deg,var(--copper-light) 0%,var(--copper-dark) 100%);
  color:var(--paper);
  box-shadow:0 4px 18px rgba(168,88,40,.3);
}
.btn--copper:hover{box-shadow:0 8px 28px rgba(168,88,40,.45)}

/* Ghost = outline for use on cream bg */
.btn--ghost{
  background:transparent;color:var(--text);
  border:1.5px solid rgba(26,21,16,.22);
  transition:border-color .2s,color .2s,transform .25s var(--ease);
}
.btn--ghost:hover{border-color:var(--copper);color:var(--copper)}

/* Outline for dark bg */
.btn--outline-inv{
  background:transparent;color:var(--text-inv);
  border:1.5px solid rgba(240,237,230,.25);
  font-family:var(--sans);font-weight:600;
  transition:border-color .2s,color .2s,transform .25s var(--ease);
  cursor:pointer;white-space:nowrap;
}
.btn--outline-inv:hover{border-color:var(--copper-pale);color:var(--copper-pale)}

.btn--sm {padding:10px 20px;font-size:13px}
.btn--lg {padding:15px 30px;font-size:15px}
.btn--xl {padding:18px 36px;font-size:16px}

/* ── 6. Nav ───────────────────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  padding:0 var(--pad);height:68px;
  display:flex;align-items:center;
  transition:background .35s var(--ease),box-shadow .35s var(--ease);
}

/* Default: over cream hero — transparent, dark text */
.nav .nav__logo-svg       {color:var(--copper)}
.nav .nav__logo-name      {color:var(--text)}
.nav .nav__logo-sub       {color:var(--text-muted)}
.nav .nav__item           {color:rgba(26,21,16,.5)}
.nav .nav__burger span    {background:var(--text)}

/* Scrolled over light sections */
.nav.scrolled{
  background:rgba(236,235,228,.96);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:0 1px 0 var(--bdr);
}
.nav.scrolled .nav__item{color:var(--text-mid)}
.nav.scrolled .nav__item:hover{color:var(--copper)}
.nav.scrolled .nav__item.active{color:var(--copper)}

/* Over dark sections */
.nav.on-dark .nav__logo-name {color:var(--text-inv)}
.nav.on-dark .nav__logo-sub  {color:var(--text-inv-mid)}
.nav.on-dark .nav__logo-svg  {color:var(--copper-pale)}
.nav.on-dark .nav__item      {color:rgba(240,237,230,.5)}
.nav.on-dark .nav__burger span{background:var(--text-inv)}

.nav.on-dark.scrolled{
  background:rgba(26,21,16,.97);
  box-shadow:0 1px 0 rgba(168,88,40,.15);
}
.nav.on-dark.scrolled .nav__item{color:rgba(240,237,230,.55)}
.nav.on-dark.scrolled .nav__item:hover{color:var(--text-inv)}

.nav__inner{
  width:100%;max-width:var(--max);margin:0 auto;
  display:flex;align-items:center;gap:28px;
}

.nav__logo{display:flex;align-items:center;flex-shrink:0}
.nav__logo-img{height:44px;width:auto;display:block}

.nav__menu{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav__item{
  font-family:var(--sans);font-size:13px;font-weight:500;
  letter-spacing:.04em;padding:6px 13px;border-radius:4px;
  transition:color .2s,background .2s;
}
.nav__item:hover{background:rgba(168,88,40,.07)}

.nav__cta{margin-left:12px}

.nav__burger{
  display:none;flex-direction:column;gap:5px;
  background:none;border:none;cursor:pointer;padding:8px;margin-left:auto;
}
.nav__burger span{
  display:block;width:22px;height:1.5px;border-radius:2px;
  transition:all .3s var(--ease);
}
.nav__burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav__burger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav__burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* ── 7. Copper plate decoration ───────────────────────── */
.copper-plate{
  position:absolute;top:0;right:0;
  width:172px;height:162px;
  border-radius:0 0 0 18px;
  overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  padding:20px 18px;
  z-index:2;pointer-events:none;
  background:
    repeating-linear-gradient(90deg,
      rgba(255,255,255,.035) 0px,rgba(255,255,255,.035) 1px,
      transparent 1px,transparent 5px),
    linear-gradient(150deg,#D49060 0%,#A86030 30%,#C07840 55%,#7A4018 80%,#C08050 100%);
  box-shadow:inset 0 0 0 .5px rgba(255,255,255,.1);
}
.copper-plate__logo{
  width:100%;height:auto;
  filter:brightness(0) invert(1);
  opacity:0.88;
}
/* Variant for dark sections — slightly different tone */
.copper-plate--br{
  background:
    repeating-linear-gradient(90deg,
      rgba(255,255,255,.03) 0px,rgba(255,255,255,.03) 1px,
      transparent 1px,transparent 5px),
    linear-gradient(150deg,#C07040 0%,#904820 35%,#B06838 60%,#6A3010 85%,#B07848 100%);
}

/* ── 8. Hero ──────────────────────────────────────────── */
.hero{
  min-height:100vh;
  background:var(--off-white);
  display:flex;align-items:stretch;
  padding:68px 0 0;
  position:relative;overflow:hidden;
}

/* Very faint industrial grid */
.hero::before{
  content:'';position:absolute;inset:0;z-index:0;
  background-image:
    linear-gradient(rgba(168,88,40,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(168,88,40,.04) 1px,transparent 1px);
  background-size:72px 72px;
  pointer-events:none;
}

.hero__wrap{
  position:relative;z-index:1;
  width:100%;max-width:var(--max);margin:0 auto;
  padding:80px var(--pad) 80px;
  display:grid;grid-template-columns:1fr 1fr;
  gap:64px;align-items:center;
}

/* ── hero content ── */
.hero__content{padding-right:24px}

.hero__title{
  font-family:var(--sans);
  font-size:clamp(48px,6.5vw,88px);
  font-weight:800;line-height:1.06;letter-spacing:-.025em;
  color:var(--text);margin-bottom:32px;
}
.hero__title em{color:var(--copper);font-style:italic;display:block}

.hero__rule{
  width:48px;height:2px;
  background:var(--copper);opacity:.7;
  margin-bottom:28px;
}

.hero__sub{
  font-family:var(--body);
  font-size:17px;font-weight:300;line-height:1.8;
  color:var(--text-mid);margin-bottom:44px;
  max-width:420px;
}

.hero__actions{display:flex;gap:14px;flex-wrap:wrap}

/* ── hero image ── */
.hero__img{height:100%;display:flex;align-items:flex-end;overflow:visible}

.hero__photo{
  width:100%;min-height:480px;height:100%;
  background:none;overflow:visible;position:relative;
  display:flex;align-items:flex-end;justify-content:flex-end;
}
.hero__photo::before,.hero__photo::after{display:none}

/* sucata PNG — efeito de resíduo derramado, emergindo da direita */
.hero__photo-img{
  position:relative;
  width:132%;height:auto;
  object-fit:contain;
  z-index:1;
  /* sombra em camadas: difusa embaixo + profundidade lateral */
  filter:
    drop-shadow(-10px 32px 56px rgba(70,25,5,.38))
    drop-shadow(0 8px 18px rgba(50,15,4,.22));
  transform: rotate(-6deg) translate(10%, 12%);
  transform-origin: bottom right;
}

/* ── hero scroll indicator ── */
.hero__scroll{
  position:absolute;bottom:32px;left:50%;
  transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:8px;
  z-index:1;opacity:.3;pointer-events:none;
}
.hero__scroll span{
  font-family:var(--sans);font-size:9px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--text);
}
.hero__scroll-bar{
  width:1px;height:40px;
  background:linear-gradient(var(--text),transparent);
  animation:scrollPulse 2.2s ease-in-out infinite;
}

/* ── 9. Sobre ─────────────────────────────────────────── */
.sobre__grid{
  display:grid;grid-template-columns:1fr 1.08fr;
  gap:88px;align-items:center;
}

/* image column */
.sobre__img-col{position:relative}

.sobre__img-wrap{position:relative}

.sobre__img{
  width:100%;aspect-ratio:4/5;
  object-fit:cover;object-position:center;
  border-radius:6px;display:block;
  border:1px solid var(--bdr);
}
.sobre__img-ph{
  width:100%;aspect-ratio:4/5;
  background:linear-gradient(150deg,var(--concrete) 0%,var(--graphite-3) 70%,var(--graphite) 100%);
  border-radius:6px;overflow:hidden;
  border:1px solid var(--bdr);
}
.sobre__img-ph-inner{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
}
.sobre__img-ph-inner span{
  font-family:var(--sans);font-weight:800;font-size:44px;
  letter-spacing:.18em;color:rgba(26,21,16,.07);
  user-select:none;
}

.sobre__tag{
  position:absolute;bottom:24px;right:-20px;
  background:linear-gradient(135deg,var(--copper-light),var(--copper-dark));
  color:var(--paper);border-radius:4px;padding:12px 18px;
  box-shadow:0 8px 24px rgba(168,88,40,.28);
}
.sobre__tag-loc{
  font-family:var(--sans);font-size:12px;font-weight:700;
  letter-spacing:.1em;
}

.sobre__img-stripe{
  position:absolute;bottom:-8px;left:20px;right:20px;
  height:2.5px;
  background:linear-gradient(90deg,var(--copper),var(--copper-dark),transparent);
  border-radius:2px;
}

/* text column */
.sobre__text-col .kicker{padding:0}

.sobre__body p{
  font-size:16px;font-weight:300;line-height:1.88;
  color:var(--text-mid);margin-bottom:22px;
}
.sobre__body p:last-child{margin-bottom:0}
.sobre__body strong{color:var(--text);font-weight:600}

.sobre__stats{
  display:flex;align-items:center;gap:32px;
  margin-top:48px;padding-top:36px;
  border-top:1px solid var(--bdr-dark);
}
.sobre__stat{display:flex;flex-direction:column;gap:4px}
.sobre__stat dt{
  font-family:var(--sans);font-size:20px;font-weight:800;
  color:var(--copper);line-height:1;
}
.sobre__stat dd{
  font-family:var(--sans);font-size:10px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);
}
.sobre__stat-div{width:1px;height:36px;background:var(--bdr-dark)}

/* ── 10. Materiais ────────────────────────────────────── */
.mats__grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.mat-card{
  position:relative;
  background:var(--paper);
  border:1px solid var(--bdr);
  border-radius:6px;padding:40px 30px;
  transition:
    transform .3s var(--ease),
    box-shadow .3s var(--ease),
    border-color .3s;
  overflow:hidden;
}
.mat-card::after{
  content:'';position:absolute;
  top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--copper),transparent);
  opacity:0;transition:opacity .3s;
}
.mat-card:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 48px rgba(168,88,40,.1),0 4px 12px rgba(26,21,16,.05);
  border-color:rgba(168,88,40,.22);
}
.mat-card:hover::after{opacity:1}

/* Featured card — dark */
.mat-card--featured{
  background:var(--graphite);
  border-color:rgba(168,88,40,.2);
}
.mat-card--featured .mat-card__title {color:var(--text-inv)}
.mat-card--featured .mat-card__tag   {color:var(--copper-pale)}
.mat-card--featured .mat-card__body  {color:rgba(240,237,230,.45)}
.mat-card--featured .mat-card__icon  {color:var(--copper-light)}
.mat-card--featured .mat-card__chips li{
  color:rgba(240,237,230,.4);
  background:rgba(240,237,230,.05);
  border-color:rgba(240,237,230,.1);
}
.mat-card--featured::after{opacity:.5}

.mat-card__badge{
  position:absolute;top:20px;right:20px;
  font-family:var(--sans);font-size:9px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--copper-pale);
  background:rgba(168,88,40,.14);
  border:1px solid rgba(168,88,40,.28);
  padding:4px 10px;border-radius:3px;
}

.mat-card__icon{
  width:52px;height:52px;color:var(--copper);
  margin-bottom:26px;
}
.mat-card__tag{
  font-family:var(--sans);font-size:10px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--copper);margin-bottom:11px;opacity:.8;
}
.mat-card__title{
  font-family:var(--sans);font-size:22px;font-weight:700;
  color:var(--text);margin-bottom:14px;line-height:1.25;
}
.mat-card__body{
  font-size:14px;font-weight:300;line-height:1.8;
  color:var(--text-muted);margin-bottom:26px;
}
.mat-card__chips{display:flex;flex-wrap:wrap;gap:7px}
.mat-card__chips li{
  font-family:var(--sans);font-size:10px;font-weight:600;
  letter-spacing:.06em;
  color:var(--text-muted);
  background:rgba(168,88,40,.06);
  border:1px solid var(--bdr);
  padding:4px 10px;border-radius:3px;
}

/* ── 11. Como Funciona ────────────────────────────────── */
.steps{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:0;position:relative;
}
.steps::before{
  content:'';position:absolute;
  top:52px;
  left:calc(12.5% + 24px);
  right:calc(12.5% + 24px);
  height:1px;
  background:linear-gradient(90deg,
    transparent,var(--copper),var(--copper),transparent);
  opacity:.2;
}

.step{
  display:flex;flex-direction:column;
  align-items:center;text-align:center;
  padding:0 18px;
}
.step__n{
  font-family:var(--sans);font-size:10px;font-weight:700;
  letter-spacing:.16em;color:var(--copper);
  margin-bottom:10px;opacity:.65;
}
.step__icon{
  width:52px;height:52px;
  background:var(--concrete);
  border:1px solid var(--bdr);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--copper);margin-bottom:26px;
  position:relative;z-index:1;
  transition:background .3s,border-color .3s,box-shadow .3s,color .3s;
  box-shadow:0 2px 8px rgba(26,21,16,.05);
}
.step__icon svg{width:22px;height:22px}
.step:hover .step__icon{
  background:var(--copper);
  border-color:var(--copper);
  color:var(--paper);
  box-shadow:0 6px 20px rgba(168,88,40,.28);
}
.step__title{
  font-family:var(--sans);font-size:15px;font-weight:700;
  color:var(--text);margin-bottom:11px;line-height:1.35;
}
.step__body{font-size:13px;font-weight:300;color:var(--text-muted);line-height:1.72}

/* ── 12. Diferenciais ─────────────────────────────────── */
.difs__layout{
  display:grid;grid-template-columns:1fr 2fr;
  gap:80px;align-items:start;
}
.difs__head{position:sticky;top:90px}
.difs__head .kicker{padding:0}
.difs__head .sec-title{text-align:left}
.difs__head .sec-lead{text-align:left}

.difs__grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1.5px;
  background:rgba(255,255,255,.04);
  border-radius:8px;overflow:hidden;
  border:1px solid rgba(240,237,230,.06);
}
.dif{
  background:var(--graphite-2);
  padding:34px 30px;
  transition:background .25s;
}
.dif:hover{background:var(--graphite-3)}

/* Last item spans full width */
.dif:last-child{
  grid-column:1/-1;
  display:grid;grid-template-columns:auto 1fr;
  column-gap:22px;align-items:start;
}
.dif:last-child .dif__title,
.dif:last-child .dif__body{grid-column:2}
.dif:last-child .dif__icon{grid-row:1/3;margin-bottom:0}

.dif__icon{
  width:44px;height:44px;color:var(--copper);
  margin-bottom:18px;transition:color .25s;
}
.dif:hover .dif__icon{color:var(--copper-pale)}

.dif__title{
  font-family:var(--sans);font-size:15px;font-weight:700;
  color:var(--text-inv);margin-bottom:9px;
}
.dif__body{font-size:13.5px;font-weight:300;color:rgba(240,237,230,.42);line-height:1.7}

/* ── 13. Sustentabilidade ─────────────────────────────── */
.sust__layout{
  display:grid;grid-template-columns:1.1fr 0.9fr;
  gap:80px;align-items:center;
}
.sust__content .kicker{padding:0}

.sust__rule{
  width:44px;height:2px;
  background:var(--copper);opacity:.6;
  margin:26px 0;
}
.sust__body{
  font-size:16px;font-weight:300;line-height:1.88;
  color:var(--text-mid);margin-bottom:22px;
}
.sust__body:last-child{margin-bottom:0}
.sust__body strong{color:var(--text);font-weight:600}

.sust__pillars{
  display:flex;flex-direction:column;gap:1.5px;
  background:rgba(168,88,40,.07);
  border-radius:8px;overflow:hidden;
  border:1px solid var(--bdr);
}
.sust__pillar{
  display:grid;grid-template-columns:auto 1fr;
  column-gap:18px;align-items:center;
  padding:22px 24px;background:var(--paper);
  transition:background .25s;
}
.sust__pillar:hover{background:var(--off-white)}
.sust__pillar-icon{
  width:44px;height:44px;color:var(--copper);
  grid-row:1;transition:color .25s;
}
.sust__pillar:hover .sust__pillar-icon{color:var(--copper-light)}
.sust__pillar h4{
  font-family:var(--sans);font-size:14px;font-weight:700;
  color:var(--text);margin-bottom:3px;
}
.sust__pillar p{font-size:13px;font-weight:300;color:var(--text-muted);line-height:1.5}

/* ── 14. Contato ──────────────────────────────────────── */
.ctt__layout{
  display:grid;grid-template-columns:1.2fr .8fr;
  gap:80px;align-items:center;
}
.ctt__cta .kicker{padding:0}

.ctt__rule{
  width:44px;height:2px;
  background:var(--copper-pale);opacity:.5;
  margin:26px 0;
}
.ctt__lead{
  font-size:17px;font-weight:300;line-height:1.78;
  color:var(--text-inv-mid);margin-bottom:40px;
}

.ctt__card{
  background:var(--graphite-2);
  border:1px solid rgba(240,237,230,.07);
  border-radius:8px;padding:38px 32px;
}
.ctt__card-label{
  font-family:var(--sans);font-size:10px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--copper-pale);
  margin-bottom:28px;padding-bottom:18px;
  border-bottom:1px solid rgba(240,237,230,.07);
}

.ctt__item{
  display:flex;align-items:flex-start;
  gap:14px;margin-bottom:24px;
}
.ctt__item:last-child{margin-bottom:0}
.ctt__item-icon{
  width:38px;height:38px;flex-shrink:0;
  background:rgba(168,88,40,.1);
  border:1px solid rgba(168,88,40,.18);
  border-radius:7px;
  display:flex;align-items:center;justify-content:center;
  color:var(--copper-light);
}
.ctt__item-icon svg{width:16px;height:16px}
.ctt__item-key{
  display:block;
  font-family:var(--sans);font-size:10px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:rgba(240,237,230,.3);margin-bottom:3px;
}
.ctt__item-val{
  display:block;
  font-family:var(--body);font-size:15px;font-weight:400;
  color:var(--text-inv);
}
.ctt__item-val a{
  color:var(--text-inv);
  text-decoration:none;
  transition:color .2s;
}
.ctt__item-val a:hover{color:var(--copper-pale)}

/* ── 15. Footer ───────────────────────────────────────── */
.footer{
  background:#110E09;
  border-top:1px solid rgba(240,237,230,.05);
  padding:56px 0 32px;
}

.footer__top{
  display:flex;align-items:center;gap:48px;
  margin-bottom:48px;
}

.footer__brand{display:flex;flex-direction:column;gap:16px}

.footer__logo{display:inline-flex}
.footer__logo-img{height:88px;width:auto;display:block}

.footer__city{
  font-size:13px;font-weight:300;line-height:1.65;
  color:rgba(240,237,230,.28);
}

.footer__nav{
  display:flex;gap:2px;flex-wrap:wrap;margin-left:auto;
}
.footer__nav a{
  font-family:var(--sans);font-size:13px;font-weight:500;
  color:rgba(240,237,230,.35);
  padding:6px 12px;border-radius:4px;
  transition:color .2s,background .2s;
}
.footer__nav a:hover{color:var(--text-inv);background:rgba(240,237,230,.05)}

.footer__bottom{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:24px;
  border-top:1px solid rgba(240,237,230,.05);
}
.footer__bottom p{
  font-size:12px;font-weight:300;
  color:rgba(240,237,230,.18);
}

/* ── 16. Floating WhatsApp ────────────────────────────── */
.wa-float{
  position:fixed;bottom:28px;right:28px;z-index:998;
  width:54px;height:54px;border-radius:50%;
  background:#25D366;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 18px rgba(37,211,102,.4);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.wa-float svg{width:24px;height:24px;position:relative;z-index:1}
.wa-float__ring{
  position:absolute;inset:0;border-radius:50%;
  background:#25D366;
  animation:waPulse 2.8s ease-out infinite;
}
.wa-float:hover{transform:scale(1.1);box-shadow:0 6px 26px rgba(37,211,102,.55)}

/* ── 17. Reveal animations ────────────────────────────── */
.reveal{
  opacity:0;transform:translateY(24px);
  transition:opacity .65s var(--eout),transform .65s var(--eout);
}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal--d1{transition-delay:.1s}
.reveal--d2{transition-delay:.2s}
.reveal--d3{transition-delay:.32s}
.reveal--d4{transition-delay:.44s}
.reveal--d5{transition-delay:.56s}

/* ── 18. Keyframes ────────────────────────────────────── */
@keyframes scrollPulse{0%,100%{opacity:.9}50%{opacity:.25}}
@keyframes waPulse{0%{transform:scale(1);opacity:.6}70%,100%{transform:scale(1.65);opacity:0}}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════════════════ */

/* Tablet ≤ 1024 */
@media(max-width:1024px){
  :root{--sec-y:96px;--pad:32px}

  .hero__wrap{grid-template-columns:1fr;gap:32px;padding:56px var(--pad) 64px;text-align:center}
  .hero__content{padding-right:0}
  .hero__content .hero__sub{max-width:100%}
  .hero__actions{justify-content:center}
  .hero__img{order:-1;overflow:hidden;border-radius:10px}
  .hero__photo{min-height:320px;aspect-ratio:16/9;overflow:hidden}
  .hero__photo-img{width:110%;transform:rotate(-3deg) translate(4%, 6%)}
  .hero__title{font-size:clamp(40px,6vw,64px)}

  .sobre__grid{grid-template-columns:1fr;gap:48px}
  .sobre__img{aspect-ratio:16/9}
  .sobre__img-ph{aspect-ratio:16/9}
  .sobre__tag{right:20px}

  .mats__grid{grid-template-columns:repeat(2,1fr)}
  .mats__grid .mat-card:last-child{grid-column:1/-1}

  .steps{grid-template-columns:repeat(2,1fr);gap:48px}
  .steps::before{display:none}

  .difs__layout{grid-template-columns:1fr;gap:48px}
  .difs__head{position:static;text-align:center}
  .difs__head .sec-title,.difs__head .sec-lead{text-align:center}

  .sust__layout{grid-template-columns:1fr;gap:56px}
  .ctt__layout{grid-template-columns:1fr;gap:40px}

  .footer__top{flex-direction:column;align-items:flex-start;gap:28px}
  .footer__nav{margin-left:0}
  .footer__bottom{flex-direction:column;gap:8px;text-align:center}
}

/* Mobile ≤ 768 */
@media(max-width:768px){
  :root{--sec-y:64px;--pad:20px}

  /* nav — logo centralizada e grande no mobile */
  .nav{padding:0 20px;height:124px}
  .nav__inner{justify-content:center;position:relative}
  .nav__logo{position:absolute;left:50%;transform:translateX(-50%)}
  .nav__logo-img{height:110px}
  .nav__burger{
    display:flex;
    position:absolute;right:0;top:50%;
    transform:translateY(-50%);
    margin-left:0;
  }
  .nav__menu{
    position:fixed;top:124px;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    padding:12px 0 20px;
    opacity:0;pointer-events:none;transform:translateY(-12px);
    transition:all .3s var(--ease);
    border-bottom:1px solid rgba(168,88,40,.12);
    background:rgba(236,235,228,.97);backdrop-filter:blur(20px);
  }
  .nav.on-dark .nav__menu{background:rgba(26,21,16,.97)}
  .nav__menu.open{opacity:1;pointer-events:auto;transform:translateY(0)}
  .nav__item{padding:14px 24px;border-radius:0;font-size:15px;color:var(--text-mid) !important}
  .nav.on-dark .nav__menu .nav__item{color:rgba(240,237,230,.6) !important}
  .nav__cta{display:none}

  /* copper plate — oculto em mobile */
  .copper-plate{display:none}

  /* hero — padding-top acompanha nav de 96px */
  .hero{padding-top:124px}
  .hero__wrap{padding:40px var(--pad) 48px;gap:28px}

  .hero__title{font-size:clamp(32px,9vw,48px)}
  .hero__sub{font-size:15px}
  .hero__actions{flex-direction:column;align-items:stretch}
  .hero__actions .btn{justify-content:center}
  .hero__img{overflow:hidden;border-radius:8px}
  .hero__photo{min-height:220px;aspect-ratio:4/3;overflow:hidden}
  .hero__photo-img{width:108%;transform:rotate(-2deg) translate(2%, 5%)}

  /* sobre */
  .sobre__img{aspect-ratio:4/3}
  .sobre__img-ph{aspect-ratio:4/3}
  .sobre__stats{flex-wrap:wrap;gap:20px}
  .sobre__stat-div{display:none}
  .sobre__tag{position:static;display:inline-block;margin-top:16px}

  /* materiais */
  .mats__grid{grid-template-columns:1fr}
  .mats__grid .mat-card:last-child{grid-column:auto}
  .mat-card{padding:28px 22px}

  /* steps */
  .steps{grid-template-columns:1fr;gap:32px}

  /* difs */
  .difs__grid{grid-template-columns:1fr}
  .dif:last-child{grid-column:auto;display:flex;flex-direction:column}
  .dif:last-child .dif__icon{margin-bottom:18px}
  .dif:last-child .dif__title,.dif:last-child .dif__body{grid-column:auto}

  /* contato */
  .ctt__cta .btn{display:flex;width:100%;justify-content:center;white-space:normal;text-align:center}
  .ctt__item-val{word-break:break-word}
  .ctt__card{padding:28px 20px}

  /* footer */
  .footer__logo-img{height:60px}
  .footer__nav{gap:0}
  .footer__bottom{text-align:center;padding-bottom:72px}

  /* whatsapp float */
  .wa-float{bottom:20px;right:20px;width:50px;height:50px}
  .wa-float svg{width:22px;height:22px}
}

/* Small mobile ≤ 480 */
@media(max-width:480px){
  :root{--pad:16px}

  /* nav */
  .nav{padding:0 16px;height:110px}
  .nav__logo-img{height:96px}

  /* hero */
  .hero__wrap{padding:32px var(--pad) 40px;gap:24px}
  .hero__title{font-size:clamp(28px,10vw,40px)}
  .hero__sub{font-size:14px}
  .hero__photo{min-height:190px;aspect-ratio:4/3}
  .hero__photo-img{width:106%;transform:rotate(-2deg) translate(2%, 4%)}
  .hero__scroll{display:none}

  /* tipografia */
  .sec-title{font-size:clamp(26px,8vw,36px)}
  .sec-header{margin-bottom:40px}
  .kicker{font-size:10px}

  /* sobre */
  .sobre__img{aspect-ratio:3/2}
  .sobre__body p{font-size:15px}

  /* materiais */
  .mat-card{padding:24px 18px}
  .mat-card__title{font-size:19px}

  /* steps */
  .step{padding:0 8px}
  .step__title{font-size:14px}

  /* difs */
  .dif{padding:24px 20px}

  /* contato */
  .ctt__card{padding:22px 16px}
  .ctt__lead{font-size:15px}

  /* footer */
  .footer__logo-img{height:52px}
  .footer__bottom{font-size:11px}
}