/* =====================================================
   FemaPlast — Injeção de termoplásticos
   Design system
   ===================================================== */
:root{
  --brand:      #3C6CD8;   /* azul da marca */
  --brand-600:  #2F58BE;
  --brand-700:  #234699;
  --brand-050:  #eef2fc;

  --ink:        #0A1730;   /* navy profundo */
  --ink-800:    #0e2247;
  --ink-700:    #16305c;

  --heat:       #FF7A2F;   /* âmbar — o material fundido / o calor do processo */
  --heat-soft:  #ffb27a;

  --paper:      #F5F7FC;   /* off-white frio */
  --white:      #ffffff;
  --steel:      #6b7a95;   /* legendas */
  --steel-2:    #93a0b8;

  --line:       #e3e8f2;
  --line-dark:  rgba(255,255,255,.12);

  --maxw: 1180px;
  --pad: clamp(20px, 5vw, 64px);
  --radius: 16px;

  --ff-display: 'Space Grotesk', system-ui, sans-serif;
  --ff-body:    'IBM Plex Sans', system-ui, sans-serif;
  --ff-mono:    'IBM Plex Mono', ui-monospace, monospace;

  --shadow-sm: 0 2px 8px rgba(10,23,48,.06);
  --shadow-md: 0 18px 44px rgba(10,23,48,.12);
  --shadow-lg: 0 30px 70px rgba(10,23,48,.22);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family: var(--ff-body);
  color: var(--ink);
  background: var(--paper);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3{ font-family: var(--ff-display); font-weight:700; line-height:1.05; letter-spacing:-.02em; }

.wrap{ width:100%; max-width: var(--maxw); margin:0 auto; padding-inline: var(--pad); }

/* ---------- botões ---------- */
.btn{
  --bg: var(--brand);
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5rem;
  font-family: var(--ff-body); font-weight:600; font-size:.98rem;
  padding: .95rem 1.6rem; border-radius: 999px;
  border:1.5px solid transparent;
  cursor:pointer; transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  white-space:nowrap;
}
.btn:focus-visible{ outline:3px solid var(--heat); outline-offset:3px; }
.btn-primary{ background:var(--brand); color:#fff; box-shadow: 0 10px 24px rgba(60,108,216,.35); }
.btn-primary:hover{ background:var(--brand-600); transform: translateY(-2px); box-shadow: 0 16px 32px rgba(60,108,216,.42); }
.btn-ghost{ background: rgba(255,255,255,.06); color:#fff; border-color: rgba(255,255,255,.28); }
.btn-ghost:hover{ background: rgba(255,255,255,.14); transform: translateY(-2px); }
.btn-outline{ background:transparent; color:var(--ink); border-color: var(--ink); }
.btn-outline:hover{ background:var(--ink); color:#fff; transform:translateY(-2px); }

/* =====================================================
   HEADER
   ===================================================== */
.site-header{
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  transition: background .3s ease, box-shadow .3s ease, backdrop-filter .3s ease;
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; height: 74px; }
.brand{ display:flex; align-items:center; gap:.6rem; }
.brand-mark{ width:34px; height:34px; }
.brand-name{ font-family:var(--ff-display); font-weight:500; font-size:1.3rem; color:#fff; letter-spacing:-.01em; }
.brand-name b{ font-weight:700; }

.nav{ display:flex; align-items:center; gap: clamp(.6rem, 2vw, 2rem); }
.nav a{ color: rgba(255,255,255,.86); font-weight:500; font-size:.96rem; transition:color .18s ease; }
.nav a:hover{ color:#fff; }
.nav .nav-cta{
  background:#fff; color:var(--ink); padding:.55rem 1.15rem; border-radius:999px;
  font-weight:600; transition: transform .18s ease, background .18s ease;
}
.nav .nav-cta:hover{ background: var(--heat); color:#fff; transform: translateY(-1px); }

/* header sólido ao rolar */
.site-header.scrolled{
  background: rgba(10,23,48,.9);
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgba(255,255,255,.08);
}

.menu-btn{ display:none; background:none; border:0; width:42px; height:42px; cursor:pointer; }
.menu-btn span{ display:block; height:2px; width:24px; margin:5px auto; background:#fff; border-radius:2px; transition: .3s; }

/* =====================================================
   HERO
   ===================================================== */
.hero{
  position:relative; color:#fff; isolation:isolate;
  padding: calc(74px + clamp(48px,10vh,96px)) 0 clamp(60px,9vh,90px);
  background: var(--ink);
  overflow:hidden;
}
.hero-bg{
  position:absolute; inset:0; z-index:-2;
  background:
    linear-gradient(180deg, rgba(10,23,48,.72) 0%, rgba(10,23,48,.86) 55%, rgba(10,23,48,.96) 100%),
    url('../img/hero-injetora.jpg') center 35% / cover no-repeat;
}
/* malha técnica sutil */
.hero-grid{
  position:absolute; inset:0; z-index:-1; opacity:.5;
  background-image:
    linear-gradient(rgba(60,108,216,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(60,108,216,.10) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(120% 90% at 20% 0%, #000 0%, transparent 70%);
}
.hero-inner{ position:relative; }
.eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-family:var(--ff-mono); font-size:.8rem; letter-spacing:.14em; text-transform:uppercase;
  color: var(--heat-soft);
  border:1px solid rgba(255,178,122,.35); border-radius:999px;
  padding:.4rem .85rem; margin-bottom: 1.6rem;
}
.eyebrow .dot{ width:7px; height:7px; border-radius:50%; background:var(--heat); box-shadow:0 0 0 0 rgba(255,122,47,.6); animation: pulse 2s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(255,122,47,.5);} 70%{ box-shadow:0 0 0 8px rgba(255,122,47,0);} 100%{ box-shadow:0 0 0 0 rgba(255,122,47,0);} }

.hero-title{
  font-size: clamp(2.3rem, 6vw, 4.4rem);
  max-width: 15ch;
  margin-bottom: 1.4rem;
}
.hero-title .flow{
  background: linear-gradient(100deg, var(--heat) 0%, #ffd0a3 45%, var(--brand) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  background-size: 220% auto; animation: flow 7s linear infinite;
}
@keyframes flow{ to{ background-position: 220% center; } }

.hero-sub{
  font-size: clamp(1.02rem, 1.7vw, 1.25rem);
  color: rgba(255,255,255,.82);
  max-width: 56ch; margin-bottom: 2.2rem;
}
.hero-sub strong{ color:#fff; font-weight:600; }
.hero-actions{ display:flex; gap:.9rem; flex-wrap:wrap; margin-bottom: clamp(2.5rem,5vh,3.5rem); }

/* SIGNATURE — painel de leitura */
.readout{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  padding: 1rem 1.1rem 1.15rem;
  max-width: 720px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.readout-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:.85rem; }
.rd-label{ font-family:var(--ff-mono); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color: var(--steel-2); }
.rd-live{ display:inline-flex; align-items:center; gap:.4rem; font-family:var(--ff-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:#8fe3a0; }
.rd-live i{ width:7px; height:7px; border-radius:50%; background:#38d16a; box-shadow:0 0 8px #38d16a; animation: pulse-g 1.6s infinite; }
@keyframes pulse-g{ 50%{ opacity:.35; } }

.readout-zones{ display:grid; grid-template-columns: repeat(5, 1fr); gap:.55rem; }
.zone{
  background: rgba(4,10,24,.55);
  border:1px solid rgba(255,255,255,.08);
  border-radius:9px; padding:.6rem .5rem .55rem; text-align:left;
}
.zone .z-name{ font-family:var(--ff-mono); font-size:.66rem; letter-spacing:.08em; color: var(--steel-2); text-transform:uppercase; }
.zone .z-pv{ font-family:var(--ff-mono); font-weight:600; font-size:1.32rem; color:#ff5b52; line-height:1.1; text-shadow:0 0 12px rgba(255,91,82,.35); }
.zone .z-pv sup{ font-size:.6rem; color:var(--steel-2); margin-left:2px; }
.zone .z-sv{ font-family:var(--ff-mono); font-size:.74rem; color:#4ee06e; }

/* =====================================================
   PILARES
   ===================================================== */
.pillars{ background: var(--white); position:relative; margin-top:-1px; }
.pillars-grid{
  display:grid; grid-template-columns: repeat(4,1fr);
  gap: clamp(1rem, 2vw, 1.4rem);
  padding-block: clamp(2.6rem, 5vw, 3.6rem);
}
.pillar{ padding: 1.4rem 1.3rem; border:1px solid var(--line); border-radius: var(--radius); transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; background:#fff; }
.pillar:hover{ transform: translateY(-4px); border-color: var(--brand); box-shadow: var(--shadow-md); }
.pillar-ico{ width:46px; height:46px; border-radius:12px; display:grid; place-items:center; background: var(--brand-050); color:var(--brand); margin-bottom:1rem; }
.pillar-ico svg{ width:24px; height:24px; }
.pillar h3{ font-size:1.12rem; margin-bottom:.45rem; }
.pillar p{ font-size:.92rem; color: var(--steel); }

/* =====================================================
   SECTIONS base
   ===================================================== */
.section{ padding-block: clamp(3.6rem, 8vw, 6.5rem); }
.kicker{
  font-family:var(--ff-mono); font-size:.78rem; letter-spacing:.2em; text-transform:uppercase;
  color: var(--brand); font-weight:600; margin-bottom:.9rem;
  display:flex; align-items:center; gap:.6rem;
}
.kicker::before{ content:""; width:26px; height:2px; background: var(--brand); display:inline-block; }
.kicker.light{ color: var(--heat-soft); }
.kicker.light::before{ background: var(--heat); }

.section-head{ max-width: 46ch; margin-bottom: clamp(2rem,4vw,3rem); }
.section-head h2{ font-size: clamp(1.8rem, 3.6vw, 2.9rem); margin-bottom:.7rem; }
.section-lead{ color: var(--steel); font-size:1.06rem; }
.section-lead.light{ color: rgba(255,255,255,.7); }

/* =====================================================
   EMPRESA
   ===================================================== */
.about-grid{ display:grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4.5rem); align-items:center; }
.about-copy h2{ font-size: clamp(1.7rem,3.2vw,2.6rem); margin-bottom:1.1rem; }
.about-copy p{ color: var(--steel); margin-bottom:1rem; max-width:52ch; }
.about-list{ list-style:none; margin-top:1.4rem; display:grid; gap:.7rem; }
.about-list li{ position:relative; padding-left:1.9rem; color:var(--ink); font-weight:500; }
.about-list li::before{
  content:""; position:absolute; left:0; top:.5em; width:11px; height:11px;
  border:2px solid var(--brand); border-radius:3px; transform: rotate(45deg);
}
.about-media{ position:relative; }
.about-media img{ border-radius: var(--radius); box-shadow: var(--shadow-md); width:100%; object-fit:cover; }
.media-tag{
  position:absolute; left:-14px; bottom:-14px; background:var(--ink); color:#fff;
  font-family:var(--ff-mono); font-size:.78rem; letter-spacing:.1em;
  padding:.7rem 1.1rem; border-radius:12px; box-shadow: var(--shadow-md);
}
.media-tag span::before{ content:"◆ "; color:var(--heat); }

/* =====================================================
   SOLUÇÕES
   ===================================================== */
.solucoes{ background: var(--white); }
.cards{ display:grid; grid-template-columns: repeat(4,1fr); gap: clamp(1rem,1.8vw,1.4rem); }
.card{
  position:relative; border-radius: var(--radius); padding: 1.7rem 1.4rem 1.5rem;
  background: linear-gradient(180deg, #fff, var(--paper));
  border:1px solid var(--line);
  overflow:hidden; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card::after{ content:""; position:absolute; left:0; top:0; height:4px; width:0; background: var(--brand); transition: width .3s ease; }
.card:hover{ transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: transparent; }
.card:hover::after{ width:100%; }
.card-num{
  font-family:var(--ff-mono); font-weight:600; font-size:.82rem; letter-spacing:.08em;
  color:var(--brand); background: var(--brand-050);
  width:fit-content; padding:.28rem .6rem; border-radius:6px; margin-bottom:1.1rem;
}
.card h3{ font-size:1.18rem; margin-bottom:.55rem; }
.card p{ font-size:.93rem; color: var(--steel); }

/* =====================================================
   MATERIAIS
   ===================================================== */
.materiais-grid{ display:grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem,5vw,4rem); align-items:center; }
.materiais-copy h2{ font-size: clamp(1.7rem,3.2vw,2.5rem); margin-bottom:1rem; }
.materiais-copy p{ color:var(--steel); max-width:44ch; margin-bottom:1.4rem; }
.link-arrow{ color:var(--brand); font-weight:600; display:inline-flex; align-items:center; gap:.4rem; }
.link-arrow span{ transition: transform .2s ease; }
.link-arrow:hover span{ transform: translateX(5px); }

.materiais-tags{ display:grid; grid-template-columns: repeat(2,1fr); gap:.7rem; }
.mat{
  display:flex; flex-direction:column; gap:.1rem;
  background:#fff; border:1px solid var(--line); border-left:3px solid var(--brand);
  border-radius:10px; padding:.85rem 1rem;
  font-family:var(--ff-display); font-weight:600; font-size:1.05rem; color:var(--ink);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.mat em{ font-family:var(--ff-body); font-style:normal; font-weight:400; font-size:.78rem; color:var(--steel); }
.mat:hover{ transform: translateX(4px); border-left-color: var(--heat); box-shadow: var(--shadow-sm); }

/* =====================================================
   PROCESSO (dark)
   ===================================================== */
.processo{ background: var(--ink); color:#fff; position:relative; overflow:hidden; }
.processo::before{
  content:""; position:absolute; inset:0; opacity:.4;
  background-image: linear-gradient(rgba(60,108,216,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(60,108,216,.08) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(100% 80% at 80% 0%, #000, transparent 70%);
}
.processo .wrap{ position:relative; }
.steps{ list-style:none; display:grid; grid-template-columns: repeat(4,1fr); gap: clamp(1rem,2vw,1.6rem); counter-reset:none; }
.step{ position:relative; padding-top:1.4rem; border-top:2px solid rgba(255,255,255,.14); }
.step-n{ font-family:var(--ff-mono); font-size:.9rem; color: var(--heat); letter-spacing:.1em; }
.step h3{ font-size:1.2rem; margin:.7rem 0 .5rem; }
.step p{ color: rgba(255,255,255,.68); font-size:.93rem; }
.step::before{
  content:""; position:absolute; top:-2px; left:0; height:2px; width:0; background: var(--heat);
  transition: width .6s ease;
}
.step.in::before{ width:44px; }

/* =====================================================
   SEGMENTOS
   ===================================================== */
.segmentos{ background: var(--white); }
.seg-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:.8rem; }
.seg{
  padding:1.3rem 1.2rem; border-radius:12px; background: var(--paper);
  border:1px solid var(--line); font-family:var(--ff-display); font-weight:600; font-size:1.02rem;
  display:flex; align-items:center; min-height:76px;
  transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}
.seg::before{ content:""; width:9px; height:9px; border-radius:50%; background:var(--brand); margin-right:.7rem; flex:none; transition: background .18s ease; }
.seg:hover{ background: var(--brand); color:#fff; transform: translateY(-3px); border-color:var(--brand); }
.seg:hover::before{ background: var(--heat); }

/* =====================================================
   ESTRUTURA / GALERIA
   ===================================================== */
.gallery{ display:grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 200px; gap: clamp(.7rem,1.4vw,1rem); }
.g-item{ position:relative; border-radius:14px; overflow:hidden; box-shadow: var(--shadow-sm); }
.g-item img{ width:100%; height:100%; object-fit:cover; transition: transform .5s ease; }
.g-item:hover img{ transform: scale(1.06); }
.g-item figcaption{
  position:absolute; left:0; bottom:0; right:0;
  padding: 1.4rem .9rem .8rem; color:#fff; font-family:var(--ff-mono); font-size:.82rem; letter-spacing:.03em;
  background: linear-gradient(transparent, rgba(6,14,30,.85));
}
.g-tall{ grid-row: span 2; }
.g-wide{ grid-column: span 2; }

/* =====================================================
   CTA BAND
   ===================================================== */
.cta-band{
  background: linear-gradient(120deg, var(--brand-700) 0%, var(--brand) 55%, var(--brand-600) 100%);
  color:#fff; position:relative; overflow:hidden;
}
.cta-band::before{
  content:""; position:absolute; right:-60px; top:-60px; width:320px; height:320px;
  border:2px solid rgba(255,255,255,.14); border-radius:40px; transform: rotate(30deg);
}
.cta-band::after{
  content:""; position:absolute; right:40px; bottom:-90px; width:220px; height:220px;
  border:2px solid rgba(255,255,255,.12); border-radius:30px; transform: rotate(30deg);
}
.cta-inner{ position:relative; display:flex; justify-content:space-between; align-items:center; gap:2rem; padding-block: clamp(2.8rem,5vw,4rem); flex-wrap:wrap; }
.cta-copy h2{ font-size: clamp(1.7rem,3.4vw,2.6rem); margin-bottom:.5rem; }
.cta-copy p{ color: rgba(255,255,255,.85); max-width:40ch; }
.cta-actions{ display:flex; gap:.8rem; flex-wrap:wrap; }
.cta-band .btn-primary{ background:#fff; color:var(--brand-700); box-shadow: var(--shadow-md); }
.cta-band .btn-primary:hover{ background: var(--heat); color:#fff; }
.cta-band .btn-outline{ color:#fff; border-color: rgba(255,255,255,.6); }
.cta-band .btn-outline:hover{ background:#fff; color:var(--brand-700); }

/* =====================================================
   CONTATO
   ===================================================== */
.contato-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem,4vw,3.5rem); align-items:stretch; }
.contato-info h2{ font-size: clamp(1.6rem,3vw,2.3rem); margin-bottom:1.6rem; max-width:18ch; }
.contact-person{ display:flex; flex-direction:column; margin-bottom:1.8rem; padding-left:1rem; border-left:3px solid var(--brand); }
.cp-role{ font-family:var(--ff-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--steel); }
.contact-person strong{ font-family:var(--ff-display); font-size:1.3rem; }

.contact-list{ list-style:none; display:grid; gap:1.2rem; }
.contact-list li{ display:flex; gap:1rem; align-items:flex-start; }
.ci-ico{ width:42px; height:42px; border-radius:11px; background:var(--brand-050); color:var(--brand); display:grid; place-items:center; flex:none; }
.ci-ico svg{ width:21px; height:21px; }
.ci-label{ font-family:var(--ff-mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--steel); display:block; margin-bottom:.15rem; }
.contact-list a{ display:block; font-weight:600; color:var(--ink); transition:color .18s ease; }
.contact-list a:hover{ color:var(--brand); }
.ci-text{ color:var(--ink); font-weight:500; }

.contato-map{ border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow-md); min-height:340px; border:1px solid var(--line); }
.contato-map iframe{ width:100%; height:100%; min-height:340px; border:0; display:block; filter: grayscale(.15); }

/* =====================================================
   FOOTER
   ===================================================== */
.site-footer{ background: var(--ink); color:#fff; }
.footer-inner{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding-block: 2.4rem; flex-wrap:wrap; border-bottom:1px solid var(--line-dark); }
.footer-brand{ display:flex; align-items:center; gap:.8rem; }
.footer-mark{ width:40px; height:40px; }
.footer-name{ font-family:var(--ff-display); font-weight:500; font-size:1.25rem; display:block; }
.footer-name b{ font-weight:700; }
.footer-tag{ font-size:.82rem; color:var(--steel-2); }
.footer-nav{ display:flex; gap:1.4rem; flex-wrap:wrap; }
.footer-nav a{ color: rgba(255,255,255,.75); font-size:.94rem; transition:color .18s ease; }
.footer-nav a:hover{ color:#fff; }
.footer-wa{ background:var(--brand); color:#fff; padding:.7rem 1.3rem; border-radius:999px; font-weight:600; transition: background .18s ease, transform .18s ease; }
.footer-wa:hover{ background:var(--heat); transform: translateY(-2px); }
.footer-base{ display:flex; justify-content:space-between; gap:1rem; padding-block:1.3rem; flex-wrap:wrap; color:var(--steel-2); font-size:.84rem; }

/* =====================================================
   WhatsApp float
   ===================================================== */
.wa-float{
  position:fixed; right:20px; bottom:20px; z-index:90;
  width:56px; height:56px; border-radius:50%;
  background:#25D366; color:#fff; display:grid; place-items:center;
  box-shadow: 0 12px 26px rgba(37,211,102,.45);
  transition: transform .2s ease;
}
.wa-float svg{ width:30px; height:30px; }
.wa-float:hover{ transform: scale(1.08); }

/* =====================================================
   REVEAL animation
   ===================================================== */
.reveal{ opacity:0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }

/* =====================================================
   RESPONSIVO
   ===================================================== */
@media (max-width: 1000px){
  .pillars-grid{ grid-template-columns: repeat(2,1fr); }
  .cards{ grid-template-columns: repeat(2,1fr); }
  .steps{ grid-template-columns: repeat(2,1fr); }
  .seg-grid{ grid-template-columns: repeat(2,1fr); }
  .about-grid, .materiais-grid, .contato-grid{ grid-template-columns: 1fr; }
  .about-media{ order:-1; }
  .materiais-tags{ grid-template-columns: repeat(2,1fr); }
  .gallery{ grid-template-columns: repeat(2,1fr); grid-auto-rows: 190px; }
  .g-tall{ grid-row: span 1; }
  .g-wide{ grid-column: span 2; }
}

@media (max-width: 760px){
  .nav{
    position: fixed; inset: 74px 0 auto 0;
    flex-direction: column; align-items:stretch; gap:0;
    background: rgba(10,23,48,.98); backdrop-filter: blur(12px);
    padding: .5rem var(--pad) 1.4rem;
    transform: translateY(-140%); transition: transform .35s ease;
    box-shadow: var(--shadow-lg);
  }
  .nav.open{ transform: translateY(0); }
  .nav a{ padding:.95rem 0; border-bottom:1px solid rgba(255,255,255,.08); }
  .nav .nav-cta{ margin-top:.9rem; text-align:center; }
  .menu-btn{ display:block; }
  .menu-btn.open span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .menu-btn.open span:nth-child(2){ opacity:0; }
  .menu-btn.open span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

  .readout-zones{ grid-template-columns: repeat(3,1fr); }
  .zone:nth-child(4), .zone:nth-child(5){ display:none; }
  .footer-inner{ flex-direction:column; align-items:flex-start; }
  .cta-inner{ flex-direction:column; align-items:flex-start; }
}

@media (max-width: 460px){
  .pillars-grid, .cards, .steps, .seg-grid{ grid-template-columns: 1fr; }
  .materiais-tags{ grid-template-columns: 1fr; }
  .gallery{ grid-template-columns: 1fr; }
  .g-wide{ grid-column: span 1; }
  .readout-zones{ grid-template-columns: repeat(3,1fr); }
}

/* Acessibilidade — reduzir movimento */
@media (prefers-reduced-motion: reduce){
  *{ animation: none !important; transition: none !important; scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; }
}