/* ============================================
   CentroSul Transportadora — design tokens
   Cores e composição extraídas do site original (Elementor)
============================================ */
:root{
  --brand: #A63A37;
  --brand-dark: #7E2C29;
  --accent: #FFF64C;
  --accent-soft: #FFBC7D;
  --bg-cream: #FFFEE6;
  --bg-soft: #F9F4F2;
  --text: #2B2B2B;
  --text-soft: #5c5c5c;
  --white: #FFFFFF;
  --black: #000000;

  --font-head: 'Poppins', sans-serif;
  --font-body: 'DM Sans', sans-serif;

  --radius: 10px;
  --radius-lg: 24px;
  --container: 1180px;
  --shadow: 0 10px 30px rgba(56,56,56,.1);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
section[id]{scroll-margin-top:84px;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--white);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto;}
a{color:inherit;text-decoration:none;}
h1,h2,h3{font-family:var(--font-head);line-height:1.2;margin:0 0 .5em;color:var(--text);}
p{margin:0 0 1em;color:var(--text-soft);}
ul{list-style:none;margin:0;padding:0;}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 24px;position:relative;}

.skip-link{
  position:absolute;left:-999px;top:0;background:var(--brand);color:var(--white);
  padding:10px 16px;z-index:1000;border-radius:0 0 8px 0;
}
.skip-link:focus{left:0;}

.eyebrow{
  display:flex;align-items:center;gap:8px;
  font-family:var(--font-head);
  color:var(--brand);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.85rem;
  margin-bottom:.6em;
}
.eyebrow-icon{filter:brightness(0) saturate(100%) invert(23%) sepia(37%) saturate(1690%) hue-rotate(324deg) brightness(90%) contrast(89%);}
.eyebrow-onhero{color:var(--accent);}
.eyebrow-onhero .eyebrow-icon{filter:brightness(0) saturate(100%) invert(90%) sepia(50%) saturate(900%) hue-rotate(1deg) brightness(105%);}
.eyebrow-center{justify-content:center;}
.section-title{text-align:center;max-width:760px;margin:0 auto 3rem;font-size:clamp(1.6rem,3vw,2.2rem);}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:.85em 1.6em;border-radius:50px;font-weight:700;font-family:var(--font-head);
  font-size:.95rem;transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  white-space:nowrap;
}
.btn-primary{background:var(--brand);color:var(--white);}
.btn-primary:hover{background:var(--brand-dark);transform:translateY(-2px);}
.btn-accent{background:var(--accent);color:var(--text);}
.btn-accent:hover{transform:translateY(-2px);box-shadow:var(--shadow);}
.btn-outline{background:transparent;color:var(--brand);border:2px solid var(--brand);}
.btn-outline:hover{background:var(--brand);color:var(--white);}
.btn-outline-light{background:transparent;color:var(--white);border:2px solid rgba(255,255,255,.7);}
.btn-outline-light:hover{background:var(--white);color:var(--brand);border-color:var(--white);}
.btn-light{background:var(--white);color:var(--brand);}
.btn-light:hover{background:var(--bg-cream);transform:translateY(-2px);}
.btn-lg{padding:1em 2em;font-size:1.05rem;}

/* ===== HEADER ===== */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:transparent;
  transition:background .3s ease, box-shadow .3s ease, padding .3s ease;
  padding:10px 0;
}
.site-header.scrolled{
  background:var(--white);
  box-shadow:0 2px 16px rgba(0,0,0,.08);
  padding:4px 0;
}
.header-inner{display:flex;align-items:center;gap:24px;padding:8px 24px;}
.logo img{height:44px;width:auto;transition:height .3s ease;}
.site-header.scrolled .logo img{height:38px;}
.main-nav{margin-left:auto;}
.main-nav ul{display:flex;gap:28px;}
.main-nav a{font-weight:600;font-size:.95rem;color:var(--white);transition:color .2s ease;}
.site-header.scrolled .main-nav a{color:var(--text);}
.main-nav a:hover{color:var(--accent);}
.site-header.scrolled .main-nav a:hover{color:var(--brand);}
.header-cta{display:flex;align-items:center;gap:16px;}
.phone-link{font-weight:700;font-size:.9rem;color:var(--white);}
.site-header.scrolled .phone-link{color:var(--brand);}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.nav-toggle span{width:24px;height:2px;background:var(--white);transition:background .3s ease;}
.site-header.scrolled .nav-toggle span{background:var(--text);}

/* ===== HERO ===== */
.hero{position:relative;overflow:hidden;min-height:92vh;display:flex;align-items:center;padding-top:80px;}
.hero-bg{
  position:absolute;inset:0;background-size:cover;background-position:center;
}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(100deg, rgba(20,14,13,.88) 0%, rgba(20,14,13,.72) 38%, rgba(20,14,13,.35) 70%, rgba(20,14,13,.15) 100%);
}
.hero-inner{position:relative;z-index:2;padding:60px 24px 100px;}
.hero-copy{max-width:640px;}
.hero h1{font-size:clamp(2.1rem,4.2vw,3rem);margin-bottom:.5em;color:var(--white);}
.hero h1 .highlight{color:var(--accent);}
.lead-onhero{color:rgba(255,255,255,.88);font-size:1.05rem;max-width:54ch;}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin:1.6em 0 0;}

.coverage-strip{
  position:relative;z-index:3;background:var(--brand);
  display:inline-block;padding:20px 40px;border-radius:0 var(--radius-lg) var(--radius-lg) 0;
  margin-top:-56px;box-shadow:0 14px 30px rgba(0,0,0,.25);
}
.coverage-strip h2{color:var(--white);font-size:1.15rem;margin:0;font-weight:600;}
.coverage-strip h2 span{color:var(--accent);font-weight:800;}

/* ===== SOBRE ===== */
.about{padding:100px 0 0;position:relative;}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center;padding-bottom:80px;}
.about-media{position:relative;}
.about-media-main{border-radius:var(--radius-lg);}
.about-media-badge{
  position:absolute;bottom:-32px;right:-28px;width:140px;height:auto;
  border-radius:50%;border:6px solid var(--white);box-shadow:var(--shadow);object-fit:cover;
}
.about-copy h2{font-size:clamp(1.6rem,3vw,2.1rem);}
.about-highlights{display:flex;gap:20px;margin:1.6em 0;flex-wrap:wrap;}
.highlight-card{
  display:flex;align-items:center;gap:12px;background:var(--bg-cream);padding:1em 1.3em;border-radius:var(--radius);
  flex:1;min-width:200px;
}
.highlight-icon{
  display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;
  background:var(--white);color:var(--brand);border-radius:50%;font-weight:800;font-size:1.1rem;
  box-shadow:0 4px 10px rgba(0,0,0,.06);
}
.highlight-card h3{font-size:.98rem;margin:0;}

.stats-section{
  position:relative;background-size:cover;background-position:center;padding:64px 0;margin-top:20px;
}
.stats-overlay{
  position:absolute;inset:0;
  background:linear-gradient(120deg, rgba(166,58,55,.55), rgba(255,246,76,.35));
}
.stats{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;}
.stats li{padding:26px 14px;background:rgba(255,255,255,.94);border-radius:var(--radius-lg);backdrop-filter:blur(2px);}
.stat-number{
  display:block;font-family:var(--font-head);font-weight:800;color:var(--brand);
  font-size:clamp(1.8rem,3vw,2.4rem);
}
.stat-label{display:block;font-size:.85rem;color:var(--text-soft);margin-top:.3em;}

/* ===== PILARES ===== */
.pillars{padding:90px 0 0;background:var(--bg-cream);}
.pillars .container{padding-bottom:70px;}
.pillar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.pillar-card{
  position:relative;background:var(--white);border-radius:var(--radius-lg);padding:36px 24px 28px;text-align:left;
  box-shadow:var(--shadow);transition:transform .2s ease;overflow:visible;
}
.pillar-card:hover{transform:translateY(-6px);}
.pillar-divider{display:block;width:36px;height:3px;background:var(--brand);margin-bottom:18px;border-radius:2px;}
.pillar-icon{margin-bottom:1em;}
.pillar-badge{
  position:absolute;top:-18px;right:18px;width:56px;height:56px;border-radius:50%;
  border:4px solid var(--white);box-shadow:var(--shadow);object-fit:cover;
}
.pillar-card h3{font-size:1.05rem;}
.pillar-card p{font-size:.92rem;margin-bottom:.8em;}
.pillar-link{
  display:inline-flex;font-family:var(--font-head);font-weight:700;font-size:.85rem;color:var(--brand);
  position:relative;
}
.pillar-link::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:2px;background:var(--brand);transition:width .25s ease;}
.pillar-card:hover .pillar-link::after{width:100%;}

/* Faixa de 4 painéis foto/cor */
.panels-strip{display:grid;grid-template-columns:repeat(4,1fr);min-height:340px;}
.panel{min-height:340px;}
.panel-photo{background-size:cover;background-position:center;}
.panel-color{
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:32px 24px;
}
.panel-icon{font-size:2rem;margin-bottom:.4em;}
.panel-red{background:var(--brand);color:var(--white);}
.panel-red h3{color:var(--white);font-size:1.3rem;}
.panel-red p{color:rgba(255,255,255,.85);font-size:.92rem;}
.panel-red a{font-weight:700;color:var(--accent);}
.panel-yellow{background:var(--accent);color:var(--text);}
.panel-yellow h3{font-size:1.3rem;}
.panel-yellow p{color:var(--text-soft);font-size:.92rem;}
.panel-yellow a{font-weight:700;color:var(--brand);}

/* ===== CTA BANNER ===== */
.cta-banner{position:relative;padding:90px 0;overflow:visible;}
.cta-bg{position:absolute;inset:0;background-size:cover;background-position:center;}
.cta-overlay{position:absolute;inset:0;background:linear-gradient(115deg, rgba(166,58,55,.92) 0%, rgba(230,168,50,.55) 60%, rgba(255,246,76,.35) 100%);}
.cta-banner-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:flex-end;}
.cta-copy{padding-bottom:24px;}
.cta-copy h2{color:var(--white);font-size:clamp(1.5rem,3vw,2.1rem);}
.cta-copy p{color:rgba(255,255,255,.9);max-width:48ch;}
.cta-media{position:relative;align-self:flex-end;}
.cta-media img{margin:0 auto;transform:translateY(24px);max-width:280px;filter:drop-shadow(0 20px 20px rgba(0,0,0,.25));}

/* ===== FAQ ===== */
.faq{padding:90px 0;}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start;}
.faq-media img{margin-top:1.5em;border-radius:var(--radius-lg);}
.faq-list details{
  border-radius:var(--radius);margin-bottom:14px;padding:20px 24px;background:var(--bg-cream);
  transition:background .2s ease;
}
.faq-list details[open]{background:var(--brand);}
.faq-list summary{
  cursor:pointer;font-family:var(--font-head);font-weight:700;font-size:1rem;
  list-style:none;position:relative;padding-right:34px;color:var(--text);
}
.faq-list details[open] summary{color:var(--white);}
.faq-list summary::-webkit-details-marker{display:none;}
.faq-list summary::after{
  content:"⌄";position:absolute;right:0;top:-4px;color:var(--brand);font-size:1.4rem;font-weight:700;
}
.faq-list details[open] summary::after{content:"↑";color:var(--white);}
.faq-list details[open] p{color:rgba(255,255,255,.9);}
.faq-list p{margin-top:.8em;font-size:.95rem;}

/* ===== CONTATO (pré-footer) ===== */
.contact-cta{
  position:relative;background-size:cover;background-position:center;padding:70px 0;text-align:center;
}
.contact-cta-overlay{position:absolute;inset:0;background:linear-gradient(120deg, rgba(255,246,76,.55), rgba(166,58,55,.75));}
.contact-cta-inner{position:relative;z-index:2;}
.contact-cta img{margin:0 auto 1.2em;}
.contact-cta h2{max-width:640px;margin:0 auto;font-size:clamp(1.4rem,3vw,1.9rem);color:var(--white);}

/* ===== FOOTER ===== */
.site-footer{background-color:#fafafa;background-size:cover;background-position:center;color:var(--text);padding:64px 0 0;}
.footer-title{font-family:var(--font-head);color:var(--text);font-weight:700;margin-bottom:1em;font-size:1rem;}
.footer-social-title{margin-bottom:.6em;font-size:.85rem;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:32px;padding-bottom:40px;}
.footer-col ul li{margin-bottom:.6em;font-size:.9rem;color:var(--text-soft);}
.footer-col a:hover{color:var(--brand);}
.footer-about p{color:var(--text-soft);font-size:.9rem;}
.footer-social{display:flex;gap:16px;}
.footer-social a{
  font-size:.85rem;font-weight:600;padding:.5em 1em;border:1px solid #ddd;border-radius:50px;background:var(--white);
}
.footer-social a:hover{background:var(--brand);border-color:var(--brand);color:var(--white);}
.footer-bottom{
  border-top:1px solid #e5e5e5;padding:20px 24px;display:flex;justify-content:space-between;
  flex-wrap:wrap;gap:8px;font-size:.8rem;color:#8a8a8a;
}
.footer-credit a{color:var(--brand);font-weight:700;}

/* ===== RESPONSIVE ===== */
@media (max-width:900px){
  .about-grid,.cta-banner-inner,.faq-grid{grid-template-columns:1fr;}
  .about-media{order:-1;margin-bottom:24px;}
  .cta-media{order:-1;}
  .pillar-grid{grid-template-columns:repeat(2,1fr);}
  .panels-strip{grid-template-columns:repeat(2,1fr);}
  .stats{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .hero{min-height:auto;}
}

@media (max-width:720px){
  .main-nav{
    position:fixed;top:64px;left:0;right:0;background:var(--white);
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    transform:translateY(-140%);opacity:0;transition:all .25s ease;pointer-events:none;
  }
  .main-nav.open{transform:translateY(0);opacity:1;pointer-events:auto;}
  .main-nav ul{flex-direction:column;padding:20px 24px;gap:16px;}
  .main-nav a{color:var(--text) !important;}
  .header-cta .phone-link{display:none;}
  .nav-toggle{display:flex;}
  .nav-toggle span{background:var(--white);}
  .site-header.scrolled .nav-toggle span{background:var(--text);}
  .pillar-grid{grid-template-columns:1fr;}
  .panels-strip{grid-template-columns:1fr;}
  .stats{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .coverage-strip{border-radius:0 var(--radius-lg) var(--radius-lg) 0;padding:16px 24px;margin-top:-30px;}
  .about-media-badge{width:100px;right:-12px;bottom:-20px;}
}

/* ============================================
   ANIMAÇÃO — scroll reveal, parallax, microinterações
   Respeita prefers-reduced-motion
============================================ */
[data-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
  will-change:opacity, transform;
}
[data-reveal].is-visible{opacity:1;transform:translateY(0);}
[data-reveal="left"]{transform:translateX(-32px);}
[data-reveal="left"].is-visible{transform:translateX(0);}
[data-reveal="right"]{transform:translateX(32px);}
[data-reveal="right"].is-visible{transform:translateX(0);}
[data-reveal="scale"]{transform:scale(.94);}
[data-reveal="scale"].is-visible{transform:scale(1);}

/* Stagger automático dentro de grids revelados */
.pillar-grid [data-reveal], .benefit-grid [data-reveal], .step-grid [data-reveal], .related-grid [data-reveal]{transition-delay:calc(var(--reveal-index, 0) * 90ms);}

@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important;}
  .hero-bg[data-parallax], .stats-section, .cta-bg{transform:none !important;}
  html{scroll-behavior:auto;}
}

/* Parallax leve em fundos (aplicado via JS com transform translateY) */
.hero-bg, .page-hero .hero-bg{will-change:transform;}

/* Botão — brilho ao passar o mouse */
.btn{position:relative;overflow:hidden;}
.btn::before{
  content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.35), transparent);
  transform:skewX(-20deg);transition:left .55s ease;
}
.btn:hover::before{left:120%;}

/* Nav — sublinhado animado */
.main-nav a{position:relative;}
.main-nav a::after{
  content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:currentColor;
  transition:width .25s ease;
}
.main-nav a:hover::after, .main-nav a.active::after{width:100%;}
.main-nav a.active{color:var(--accent);}
.site-header.scrolled .main-nav a.active{color:var(--brand);}

/* Cards de pilar/benefício — zoom sutil no ícone ao passar o mouse */
.pillar-card:hover .pillar-icon, .benefit-card:hover .benefit-icon{transform:scale(1.12) rotate(-4deg);}
.pillar-icon, .benefit-icon{transition:transform .3s ease;display:inline-block;}

/* Contador de scroll no topo da página */
.scroll-progress{
  position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg, var(--brand), var(--accent));
  z-index:200;width:0%;transition:width .1s linear;
}

/* Hero da home — entrada em cascata no load */
.hero-copy .eyebrow, .hero-copy h1, .hero-copy .lead-onhero, .hero-copy .hero-actions{
  opacity:0;transform:translateY(18px);animation:heroIn .7s cubic-bezier(.22,.61,.36,1) forwards;
}
.hero-copy .eyebrow{animation-delay:.05s;}
.hero-copy h1{animation-delay:.15s;}
.hero-copy .lead-onhero{animation-delay:.28s;}
.hero-copy .hero-actions{animation-delay:.4s;}
@keyframes heroIn{to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion: reduce){
  .hero-copy .eyebrow, .hero-copy h1, .hero-copy .lead-onhero, .hero-copy .hero-actions{animation:none;opacity:1;transform:none;}
}

/* ============================================
   PÁGINAS DE SERVIÇO (transporte / coleta / armazenagem / distribuição)
============================================ */
.breadcrumb{
  display:flex;gap:8px;align-items:center;font-size:.82rem;color:rgba(255,255,255,.75);
  margin-bottom:1.2em;font-weight:600;
}
.breadcrumb a{color:rgba(255,255,255,.75);}
.breadcrumb a:hover{color:var(--accent);}
.breadcrumb span:last-child{color:var(--accent);}

.page-hero{position:relative;overflow:hidden;min-height:56vh;display:flex;align-items:center;padding-top:80px;}
.page-hero .hero-bg{position:absolute;inset:-10% 0 0 0;background-size:cover;background-position:center;height:120%;}
.page-hero .hero-overlay{position:absolute;inset:0;background:linear-gradient(100deg, rgba(20,14,13,.90) 0%, rgba(20,14,13,.78) 45%, rgba(20,14,13,.45) 100%);}
.page-hero-inner{position:relative;z-index:2;padding:60px 24px;max-width:760px;}
.page-hero h1{color:var(--white);font-size:clamp(1.8rem,3.6vw,2.6rem);}
.page-hero .lead-onhero{margin-bottom:1.4em;}

.service-intro{padding:80px 0 20px;}
.service-intro-inner{max-width:760px;margin:0 auto;text-align:center;}
.service-intro-inner p{font-size:1.05rem;color:var(--text-soft);}

.service-benefits{padding:70px 0;}
.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.benefit-card{
  background:var(--bg-cream);border-radius:var(--radius-lg);padding:32px 24px;text-align:left;
  transition:transform .2s ease;
}
.benefit-card:hover{transform:translateY(-6px);}
.benefit-icon{font-size:1.8rem;margin-bottom:.6em;}
.benefit-card h3{font-size:1rem;}
.benefit-card p{font-size:.9rem;margin:0;}

.service-steps{padding:70px 0;background:var(--bg-soft);}
.step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;position:relative;}
.step-card{background:var(--white);border-radius:var(--radius-lg);padding:32px 24px;box-shadow:var(--shadow);position:relative;}
.step-number{
  display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;
  background:var(--brand);color:var(--white);font-family:var(--font-head);font-weight:800;margin-bottom:.8em;
}
.step-card h3{font-size:1rem;}
.step-card p{font-size:.9rem;margin:0;}

.service-faq{padding:80px 0;}
.faq-list-narrow{max-width:760px;margin:0 auto;}

.related-services{padding:70px 0;background:var(--bg-cream);}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.related-card{
  display:block;background:var(--white);border-radius:var(--radius-lg);padding:28px 24px;box-shadow:var(--shadow);
  transition:transform .2s ease;
}
.related-card:hover{transform:translateY(-6px);}
.related-eyebrow{font-family:var(--font-head);font-weight:700;color:var(--brand);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;}
.related-card h3{margin:.3em 0;font-size:1.1rem;}
.related-link{font-weight:700;color:var(--brand);font-size:.9rem;}

@media (max-width:900px){
  .benefit-grid, .step-grid, .related-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:720px){
  .benefit-grid, .step-grid, .related-grid{grid-template-columns:1fr;}
  .page-hero{min-height:auto;padding-bottom:40px;}
}