:root{
  --ink:#17130f;
  --ink-soft:#3a342c;
  --gray:#665f56;
  --cream:#faf7f1;
  --cream-deep:#f1ebe0;
  --line:#e5ddcf;
  --orange:#f2600c;
  --orange-dark:#c14907;
  --orange-tint:#fde4d2;
  --white:#ffffff;
  --radius:2px;
}

*{margin:0;padding:0;box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
  font-family:'Libre Franklin', sans-serif;
  background:var(--cream);
  color:var(--ink);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block;}

a{color:inherit;text-decoration:none;}

.container{
  max-width:1180px;
  margin:0 auto;
  padding:0 32px;
}

.eyebrow{
  font-size:13px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--orange-dark);
}

/* ===== signature diagonal rule — echoes the bar cutting through the logo ===== */
.diag-rule{
  position:relative;
  height:14px;
  background:var(--orange);
  transform:skewY(-1.4deg);
  margin:0 -40px;
}
.diag-rule::after{
  content:"";
  position:absolute;
  right:0; top:0; bottom:0;
  width:46%;
  background:var(--ink);
}

/* ===== HEADER ===== */
.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:var(--cream);
  border-bottom:1px solid var(--line);
}
.site-header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  padding-top:14px;
  padding-bottom:14px;
}
.site-header .logo-link{
  display:block;
  flex-shrink:0;
}
.site-header .logo-link img{
  height:56px;
  width:auto;
  display:block;
}
.site-nav{
  display:flex;
  align-items:center;
  gap:34px;
}
.site-nav a{
  font-size:14px;
  font-weight:600;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:var(--ink-soft);
  padding:6px 0;
  transition:color .15s ease;
}
.site-nav a:hover{color:var(--orange-dark);}
.site-nav .btn{padding:12px 22px;}
.nav-toggle{
  display:none;
  background:none;
  border:none;
  cursor:pointer;
  padding:8px;
}
.nav-toggle span{
  display:block;
  width:24px;height:2px;
  background:var(--ink);
  margin:5px 0;
}

/* ===== HERO ===== */
.hero{
  position:relative;
  background:#000 url('../img/hero-bg.jpg?v=2') center 42%/cover no-repeat;
  color:var(--white);
  overflow:hidden;
  padding:120px 0 132px;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to right, rgba(10,8,6,.88) 0%, rgba(10,8,6,0) 33%);
  pointer-events:none;
}
.hero-bar{
  position:absolute;
  left:0; right:0; top:0;
  height:8px;
  background:var(--orange);
}
.hero .container{
  max-width:none;
  margin:0;
  padding-left:56px;
  padding-right:32px;
}
.hero-inner{
  position:relative;
  z-index:2;
  max-width:640px;
  text-align:left;
}
.hero .eyebrow{color:var(--orange);}
.hero h1{
  font-family:'Libre Franklin', sans-serif;
  font-weight:900;
  font-style:italic;
  font-size:clamp(34px, 5vw, 56px);
  line-height:1.08;
  letter-spacing:-.01em;
  margin:18px 0 22px;
  text-transform:uppercase;
  color:var(--white);
  text-shadow:0 2px 18px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.6);
}
.hero p{
  font-size:21px;
  font-weight:500;
  color:#ffffff;
  text-shadow:0 2px 14px rgba(0,0,0,.65), 0 1px 3px rgba(0,0,0,.7);
  max-width:560px;
  margin-bottom:38px;
  line-height:1.45;
}
.hero-actions{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}

/* ===== PAGE HERO (industry catalog pages) ===== */
.page-hero{
  position:relative;
  background:var(--ink);
  color:var(--white);
  padding:64px 0 56px;
  overflow:hidden;
}
.page-hero::before{
  content:"";
  position:absolute;
  top:-30%;
  right:-10%;
  width:55%;
  height:160%;
  background:linear-gradient(135deg, rgba(242,96,12,0.18), rgba(242,96,12,0) 60%);
  transform:skewX(-12deg);
  pointer-events:none;
}
.page-hero-inner{position:relative;z-index:2;}
.breadcrumb{
  font-size:13px;
  font-weight:600;
  letter-spacing:.03em;
  color:#c9c2b6;
  margin-bottom:18px;
}
.breadcrumb a{color:var(--orange);}
.breadcrumb a:hover{text-decoration:underline;}
.page-hero h1{
  font-family:'Libre Franklin', sans-serif;
  font-weight:900;
  font-style:italic;
  font-size:clamp(30px, 4.2vw, 46px);
  text-transform:uppercase;
  letter-spacing:-.01em;
  margin-bottom:14px;
}
.page-hero p{
  font-size:16px;
  color:#d9d4cb;
  max-width:620px;
}

/* ===== BUTTONS ===== */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:16px 30px;
  font-family:'Libre Franklin', sans-serif;
  font-weight:700;
  font-size:14px;
  letter-spacing:.05em;
  text-transform:uppercase;
  border-radius:var(--radius);
  border:2px solid transparent;
  cursor:pointer;
  transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{
  background:var(--orange);
  color:var(--white);
}
.btn-primary:hover{background:var(--orange-dark);}
.btn-outline{
  background:transparent;
  color:var(--white);
  border-color:rgba(255,255,255,.4);
}
.btn-outline:hover{border-color:var(--white);}
.btn-dark{
  background:var(--ink);
  color:var(--white);
}
.btn-dark:hover{background:#000;}
.btn-arrow{font-size:16px;line-height:1;transition:transform .18s ease;}
.btn:hover .btn-arrow{transform:translateX(3px);}

/* ===== SECTION SPACING ===== */
section{padding:96px 0;}
.section-head{
  max-width:640px;
  margin-bottom:56px;
}
.section-head h2{
  font-size:clamp(28px, 3.4vw, 40px);
  font-weight:800;
  font-style:italic;
  letter-spacing:-.01em;
  text-transform:uppercase;
  margin-top:10px;
}
.section-head p{
  color:var(--gray);
  font-size:17px;
  margin-top:16px;
}

/* ===== QUIENES SOMOS ===== */
.about{background:var(--cream);}
.about-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:64px;
  align-items:start;
}
.about-copy p{
  color:var(--ink-soft);
  font-size:17px;
  margin-bottom:18px;
}
.about-copy p:last-child{margin-bottom:0;}
.stat-card{
  background:var(--white);
  border:1px solid var(--line);
  padding:32px;
}
.stat-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  padding:20px 0;
  border-bottom:1px solid var(--line);
}
.stat-row:last-child{border-bottom:none;padding-bottom:0;}
.stat-row:first-child{padding-top:0;}
.stat-num{
  font-size:30px;
  font-weight:900;
  font-style:italic;
  color:var(--orange);
}
.stat-label{
  font-size:13px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--gray);
  text-align:right;
}

/* ===== INDUSTRIAS (grid en Inicio) ===== */
.industries{background:var(--cream-deep);}
.industries-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:2px;
  background:var(--line);
  border:1px solid var(--line);
}
.industry-card{
  background:var(--cream-deep);
  padding:38px 34px 32px;
  display:flex;
  flex-direction:column;
  gap:18px;
  transition:background .2s ease;
}
.industry-card:hover{background:var(--white);}
.industry-icon{
  width:52px;height:52px;
  display:flex;align-items:center;justify-content:center;
  background:var(--orange-tint);
  color:var(--orange-dark);
}
.industry-icon svg{width:26px;height:26px;}
.industry-card h3{
  font-size:19px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.01em;
  line-height:1.25;
}
.industry-card p{
  color:var(--gray);
  font-size:15px;
  flex-grow:1;
}
.industry-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--ink);
  padding-top:4px;
  border-top:2px solid var(--orange);
  width:fit-content;
}
.industry-card:hover .industry-link .btn-arrow{transform:translateX(3px);}

/* ===== CATALOGO (paginas de industria) ===== */
.catalog-notice{
  background:var(--white);
  border:1px solid var(--line);
  border-left:4px solid var(--orange);
  padding:22px 26px;
  margin-bottom:48px;
  color:var(--ink-soft);
  font-size:15px;
}
.catalog-notice strong{color:var(--ink);}
.product-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:2px;
  background:var(--line);
  border:1px solid var(--line);
}
.product-card{
  background:var(--white);
  padding:30px 28px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.product-card .tag{
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--orange-dark);
}
.product-card h3{
  font-size:17px;
  font-weight:800;
  text-transform:uppercase;
}
.product-card p{
  color:var(--gray);
  font-size:14px;
}

/* ===== CTA BAND ===== */
.cta-band{
  background:var(--ink);
  color:var(--white);
  padding:70px 0;
  text-align:center;
}
.cta-band .eyebrow{color:var(--orange);}
.cta-band h2{
  font-size:clamp(24px,3vw,34px);
  font-weight:800;
  font-style:italic;
  text-transform:uppercase;
  margin:14px 0 30px;
}

/* ===== UBICACION ===== */
.location{background:var(--cream);}
.location-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:0;
  border:1px solid var(--line);
}
.location-info{
  background:var(--white);
  padding:48px 44px;
  display:flex;
  flex-direction:column;
  gap:28px;
}
.location-info h2{
  font-size:26px;
  font-weight:800;
  font-style:italic;
  text-transform:uppercase;
}
.loc-block{display:flex;gap:16px;}
.loc-icon{
  flex:0 0 40px;
  width:40px;height:40px;
  background:var(--orange-tint);
  color:var(--orange-dark);
  display:flex;align-items:center;justify-content:center;
}
.loc-icon svg{width:20px;height:20px;}
.loc-text-label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gray);
  margin-bottom:4px;
}
.loc-text p{font-size:15px;color:var(--ink-soft);}
.location-map iframe{
  width:100%;
  height:100%;
  min-height:420px;
  border:0;
  filter:grayscale(15%) contrast(1.02);
}

/* ===== FOOTER ===== */
.site-footer{
  background:var(--ink);
  color:#c9c2b6;
}
.footer-top{
  padding:64px 0 48px;
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr 1.1fr;
  gap:40px;
}
.footer-logo-bg{
  display:inline-block;
  background:var(--cream);
  padding:10px 18px;
  margin-bottom:16px;
}
.footer-brand .footer-logo-raw{
  height:56px;
  width:auto;
  max-width:none;
  display:block;
  margin-bottom:16px;
}
.footer-brand img{
  height:34px;
  display:block;
  margin-bottom:0;
}
.footer-brand p{font-size:14px;line-height:1.7;color:#a79f92;max-width:280px;}
.footer-col h4{
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--orange);
  margin-bottom:18px;
}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:11px;}
.footer-col a{font-size:14px;color:#c9c2b6;transition:color .15s ease;}
.footer-col a:hover{color:var(--white);}
.footer-col p{font-size:14px;color:#c9c2b6;line-height:1.6;}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  padding:22px 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  font-size:13px;
  color:#93897a;
}
.footer-bottom span{color:var(--orange);font-weight:700;}

/* ===== RESPONSIVE ===== */
@media (max-width:900px){
  .about-grid{grid-template-columns:1fr;gap:40px;}
  .industries-grid{grid-template-columns:repeat(2,1fr);}
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .location-grid{grid-template-columns:1fr;}
  .location-map iframe{min-height:320px;}
  .footer-top{grid-template-columns:1fr 1fr;}
  .site-nav{
    position:fixed;
    top:85px; left:0; right:0;
    background:var(--cream);
    flex-direction:column;
    align-items:flex-start;
    padding:24px 32px 32px;
    border-bottom:1px solid var(--line);
    gap:18px;
    transform:translateY(-130%);
    transition:transform .25s ease;
  }
  .site-nav.open{transform:translateY(0);}
  .nav-toggle{display:block;}
}
@media (max-width:600px){
  .container{padding:0 20px;}
  section{padding:64px 0;}
  .hero{padding:72px 0 80px;}
  .hero .container{padding-left:20px;padding-right:20px;}
  .industries-grid{grid-template-columns:1fr;}
  .product-grid{grid-template-columns:1fr;}
  .hero-actions{flex-direction:column;align-items:stretch;}
  .location-info{padding:36px 26px;}
  .footer-top{grid-template-columns:1fr;padding:48px 0 32px;}
  .site-header .logo-link img{height:42px;}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important;}
}

/* ====================================================================
   DINAMISMO — animaciones, patrones decorativos e interacción
   ==================================================================== */

/* ---- Reveal on scroll ---- */
.reveal{
  transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1);
}
/* Oculto SOLO cuando JS confirma que puede animar (se aplica vía site.js).
   Si JS no carga o falla, el contenido se queda visible por defecto — nunca se rompe el diseño. */
.reveal.reveal-armed{opacity:0;transform:translateY(28px);}
.reveal.visible{opacity:1;transform:translateY(0);}
.reveal-stagger .reveal:nth-child(1){transition-delay:.02s;}
.reveal-stagger .reveal:nth-child(2){transition-delay:.09s;}
.reveal-stagger .reveal:nth-child(3){transition-delay:.16s;}
.reveal-stagger .reveal:nth-child(4){transition-delay:.23s;}
.reveal-stagger .reveal:nth-child(5){transition-delay:.30s;}
.reveal-stagger .reveal:nth-child(6){transition-delay:.37s;}
.reveal-stagger .reveal:nth-child(7){transition-delay:.44s;}
.reveal-stagger .reveal:nth-child(8){transition-delay:.51s;}
.reveal-stagger .reveal:nth-child(9){transition-delay:.58s;}
.reveal-stagger .reveal:nth-child(10){transition-delay:.65s;}
.reveal-stagger .reveal:nth-child(11){transition-delay:.72s;}
.reveal-stagger .reveal:nth-child(12){transition-delay:.79s;}

/* ---- Dot-grid texture ---- */
.dot-grid{
  position:relative;
}
.dot-grid::before{
  content:"";
  position:absolute;inset:0;
  background-image:radial-gradient(rgba(23,19,15,0.10) 1.4px, transparent 1.4px);
  background-size:22px 22px;
  opacity:.5;
  pointer-events:none;
}
.dot-grid > .container{position:relative;z-index:1;}

/* ---- Hover polish on cards ---- */
.industry-card{
  transition:background .2s ease, transform .28s cubic-bezier(.2,.7,.3,1), box-shadow .28s ease;
}
.industry-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 32px rgba(23,19,15,.12);
  z-index:2;
}
.industry-icon{transition:transform .3s cubic-bezier(.34,1.56,.64,1), background .2s ease;}
.industry-card:hover .industry-icon{transform:scale(1.12) rotate(-4deg);}

.stat-card{transition:box-shadow .25s ease;}
.stat-row{transition:background .2s ease;}
.stat-row:hover{background:var(--orange-tint);}
.stat-num{display:inline-block;}

.category-card{transition:transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s ease !important;}
.category-card:hover{transform:translateY(-5px);box-shadow:0 14px 28px rgba(0,0,0,.12) !important;}

.btn{position:relative;overflow:hidden;}

/* (marca de agua de catálogos removida a solicitud del cliente) */
/* (puntos decorativos del hero removidos a solicitud del cliente) */

/* ---- Badge / ribbon ---- */
.badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--orange-tint);
  color:var(--orange-dark);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:8px 14px;
  margin-bottom:16px;
}
.badge svg{width:14px;height:14px;}

/* ---- Marquee de industrias (franja continua) ---- */
.marquee{
  background:var(--ink);
  overflow:hidden;
  padding:16px 0;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.marquee-track{
  display:flex;
  width:max-content;
  animation:marquee-scroll 32s linear infinite;
}
.marquee-track span{
  display:inline-flex;
  align-items:center;
  gap:14px;
  color:#c9c2b6;
  font-size:13px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:0 28px;
  white-space:nowrap;
}
.marquee-track span::after{
  content:"◆";
  color:var(--orange);
  font-size:9px;
  margin-left:28px;
}
@keyframes marquee-scroll{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
@media (prefers-reduced-motion: reduce){
  .marquee-track{animation:none;}
}

/* ---- Counter number pop ---- */
@keyframes pop-in{
  0%{transform:scale(.85);opacity:0;}
  100%{transform:scale(1);opacity:1;}
}
.stat-num.counted{animation:pop-in .35s ease;}

/* ====================================================================
   MÁS ALMA — micro-interacciones adicionales
   ==================================================================== */

/* Puntos decorativos flotando con vida propia */
@keyframes float-a{
  0%,100%{transform:translateY(0) scale(1);}
  50%{transform:translateY(-14px) scale(1.08);}
}
@keyframes float-b{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(10px);}
}

/* Luz que sigue al cursor dentro del hero */
.hero-spotlight{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(242,96,12,.16), transparent 60%);
  opacity:0;
  transition:opacity .4s ease;
}
.hero:hover .hero-spotlight{opacity:1;}

/* Botón primario con pulso invitante */
@keyframes btn-pulse{
  0%{box-shadow:0 0 0 0 rgba(242,96,12,.45);}
  70%{box-shadow:0 0 0 12px rgba(242,96,12,0);}
  100%{box-shadow:0 0 0 0 rgba(242,96,12,0);}
}
.btn-primary.btn-pulse{animation:btn-pulse 2.6s ease-out infinite;}
.btn-primary.btn-pulse:hover{animation:none;}

/* Badge con leve respiración */
@keyframes badge-breathe{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.04);}
}
.badge{animation:badge-breathe 3.4s ease-in-out infinite;}

/* Logo con pequeño gesto al pasar el mouse */
.logo-link img{transition:transform .3s cubic-bezier(.34,1.56,.64,1);}
.logo-link:hover img{transform:scale(1.05) rotate(-1deg);}

/* Subrayado animado en enlaces del nav */
.site-nav a:not(.btn){position:relative;}
.site-nav a:not(.btn)::before{
  content:"";
  position:absolute;
  left:0;bottom:-2px;
  width:0;height:2px;
  background:var(--orange);
  transition:width .25s ease;
}
.site-nav a:not(.btn):hover::before{width:100%;}

@media (prefers-reduced-motion: reduce){
  .btn-pulse{animation:none !important;}
  .badge{animation:none !important;}
}

/* ====================================================================
   FORMULARIO DE CONTACTO
   ==================================================================== */
.contact-layout{
  display:grid;
  grid-template-columns:1fr .8fr;
  gap:0;
  border:1px solid var(--line);
}
.contact-form-wrap{
  background:var(--white);
  padding:48px 44px;
}
.contact-form-wrap h2{
  font-size:24px;
  font-weight:800;
  font-style:italic;
  text-transform:uppercase;
  margin-bottom:8px;
}
.contact-form-wrap > p{color:var(--gray);font-size:15px;margin-bottom:28px;}
.contact-form{display:grid;gap:18px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-group{display:flex;flex-direction:column;gap:6px;}
.form-group label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--ink-soft);
}
.form-group input,
.form-group select,
.form-group textarea{
  font-family:'Libre Franklin', sans-serif;
  font-size:15px;
  color:var(--ink);
  background:var(--cream);
  border:1.5px solid var(--line);
  border-radius:var(--radius);
  padding:12px 14px;
  transition:border-color .18s ease, background .18s ease;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  outline:none;
  border-color:var(--orange);
  background:var(--white);
}
.form-group textarea{resize:vertical;min-height:120px;}
.form-note{font-size:12px;color:var(--gray);margin-top:-4px;}
.contact-form button[type="submit"]{
  justify-self:start;
  border:none;
}
.contact-side{
  background:var(--ink);
  color:var(--white);
  padding:48px 40px;
  display:flex;
  flex-direction:column;
  gap:26px;
}
.contact-side h3{
  font-size:20px;
  font-weight:800;
  font-style:italic;
  text-transform:uppercase;
  margin-bottom:4px;
}
.contact-side .loc-icon{background:rgba(242,96,12,.16);}
.contact-side .loc-text-label{color:#a79f92;}
.contact-side .loc-text p{color:#e7e1d8;}
.contact-side .location-map{margin-top:auto;}
.contact-side .location-map iframe{min-height:220px;filter:grayscale(30%) invert(92%) contrast(90%);border-radius:2px;}

/* Placeholder de página en preparación */
.page-placeholder{
  background:var(--white);
  border:1px solid var(--line);
  border-left:4px solid var(--orange);
  padding:40px 36px;
  text-align:left;
  max-width:720px;
}
.page-placeholder strong{color:var(--ink);}
.page-placeholder p{color:var(--ink-soft);font-size:16px;margin-top:8px;}

@media (max-width:900px){
  .contact-layout{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .contact-form-wrap{padding:34px 24px;}
  .contact-side{padding:34px 24px;}
}

/* ====================================================================
   NOSOTROS — Misión, Visión, Valores, Promesa de Servicio, Fotos
   ==================================================================== */
.mv-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2px;
  background:var(--line);
  border:1px solid var(--line);
}
.mv-card{
  background:var(--white);
  padding:40px 38px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.mv-card .icon-badge{
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  background:var(--orange-tint);
  color:var(--orange-dark);
}
.mv-card .icon-badge svg{width:24px;height:24px;}
.mv-card h3{
  font-size:20px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.01em;
}
.mv-card p{color:var(--ink-soft);font-size:16px;line-height:1.6;}

.values-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:2px;
  background:var(--line);
  border:1px solid var(--line);
}
.value-card{
  background:var(--white);
  padding:34px 30px;
  display:flex;
  flex-direction:column;
  gap:14px;
  transition:transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s ease;
}
.value-card:hover{transform:translateY(-5px);box-shadow:0 14px 28px rgba(23,19,15,.1);}
.value-card .icon-badge{
  width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  background:var(--orange-tint);
  color:var(--orange-dark);
}
.value-card .icon-badge svg{width:22px;height:22px;}
.value-card h3{
  font-size:18px;
  font-weight:800;
  text-transform:uppercase;
}
.value-card p{color:var(--gray);font-size:14.5px;line-height:1.6;}

.promise-band{
  background:var(--ink);
  color:var(--white);
  padding:72px 0;
  position:relative;
  overflow:hidden;
}
.promise-band::before{
  content:"";
  position:absolute;
  top:-30%;right:-8%;
  width:50%;height:160%;
  background:linear-gradient(135deg, rgba(242,96,12,.16), rgba(242,96,12,0) 60%);
  transform:skewX(-12deg);
  pointer-events:none;
}
.promise-band .container{position:relative;z-index:1;max-width:820px;}
.promise-band .eyebrow{color:var(--orange);}
.promise-band p{
  font-size:20px;
  font-weight:500;
  font-style:italic;
  line-height:1.6;
  color:#f0ece4;
  margin-top:18px;
}
.promise-band p + p{margin-top:16px;}

.photo-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:6px;
  max-width:820px;
  height:320px;
}
.photo-grid .photo-main{grid-row:1 / 3;}
.photo-grid img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
.photo-note{
  font-size:13px;
  color:var(--gray);
  margin-top:14px;
}

@media (max-width:900px){
  .mv-grid{grid-template-columns:1fr;}
  .values-grid{grid-template-columns:1fr;}
  .photo-grid{grid-template-columns:1fr;grid-template-rows:180px 130px 130px;height:auto;max-width:100%;}
  .photo-grid .photo-main{grid-row:auto;}
}

/* ====================================================================
   MARCAS — Distribuidores / Representantes
   ==================================================================== */
.brands-section{
  background:var(--cream);
  padding:72px 0;
  border-top:1px solid var(--line);
}
.brands-label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gray);
  text-align:center;
  margin-bottom:36px;
}
.brands-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:48px;
}
.brands-row img{
  height:46px;
  width:auto;
  max-width:150px;
  object-fit:contain;
  filter:grayscale(100%);
  opacity:.65;
  transition:filter .25s ease, opacity .25s ease, transform .25s ease;
}
.brands-row img:hover{
  filter:grayscale(0%);
  opacity:1;
  transform:translateY(-2px);
}
.brands-divider{
  height:1px;
  background:var(--line);
  max-width:120px;
  margin:56px auto;
}
@media (max-width:600px){
  .brands-section{padding:48px 0;}
  .brands-row{gap:30px;}
  .brands-row img{height:36px;max-width:110px;}
  .brands-divider{margin:40px auto;}
}

/* ====================================================================
   BOTÓN FLOTANTE DE WHATSAPP
   ==================================================================== */
.whatsapp-float{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:100;
  width:58px;
  height:58px;
  border-radius:50%;
  background:#25D366;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  transition:transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease;
}
.whatsapp-float:hover{
  transform:scale(1.08);
  box-shadow:0 8px 22px rgba(0,0,0,.32);
  animation:none;
}
.whatsapp-float svg{width:30px;height:30px;display:block;}
@keyframes whatsapp-pulse{
  0%{box-shadow:0 0 0 0 rgba(37,211,102,.55), 0 6px 18px rgba(0,0,0,.25);}
  70%{box-shadow:0 0 0 14px rgba(37,211,102,0), 0 6px 18px rgba(0,0,0,.25);}
  100%{box-shadow:0 0 0 0 rgba(37,211,102,0), 0 6px 18px rgba(0,0,0,.25);}
}
.whatsapp-float{animation:whatsapp-pulse 2.8s ease-out infinite;}
@media (max-width:600px){
  .whatsapp-float{right:16px;bottom:16px;width:52px;height:52px;}
  .whatsapp-float svg{width:27px;height:27px;}
}
@media (prefers-reduced-motion: reduce){
  .whatsapp-float{animation:none !important;}
}

/* ====================================================================
   BOTÓN DE LLAMADA (junto a "Solicitar Asesoría")
   ==================================================================== */
.cta-group{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.call-btn{
  width:48px;
  height:48px;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--white);
  color:var(--ink);
  border-radius:var(--radius);
  box-shadow:0 2px 8px rgba(0,0,0,.15);
  transition:transform .18s ease, background .18s ease, color .18s ease;
}
.call-btn:hover{
  background:var(--orange);
  color:var(--white);
  transform:translateY(-2px);
}
.call-btn svg{width:20px;height:20px;display:block;}
@media (max-width:600px){
  .call-btn{width:44px;height:44px;}
  .call-btn svg{width:18px;height:18px;}
}

/* ===== FAQ (preguntas frecuentes) ===== */
.faq-section{background:var(--cream-deep);}
.faq-list{max-width:820px;}
.faq-item{
  background:var(--white);
  border:1px solid var(--line);
  margin-bottom:12px;
  overflow:hidden;
}
.faq-item summary{
  list-style:none;
  cursor:pointer;
  padding:20px 52px 20px 22px;
  font-weight:700;
  font-size:16px;
  color:var(--ink);
  position:relative;
  user-select:none;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:"+";
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  width:26px;
  height:26px;
  border-radius:50%;
  background:var(--orange-tint);
  color:var(--orange-dark);
  font-size:18px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform .2s ease, background .2s ease;
}
.faq-item[open] summary::after{content:"–";background:var(--orange);color:var(--white);}
.faq-item .faq-answer{
  padding:0 22px 20px;
  color:var(--ink-soft);
  font-size:15px;
  line-height:1.65;
}
.faq-item + .faq-item{margin-top:0;}
.faq-note{color:var(--gray);font-size:14px;margin-top:20px;}

/* ===== Enlaces a industrias (página de catálogo) ===== */
.industry-links{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
  margin:28px 0 8px;
}
.industry-links a{
  background:var(--white);
  border:1px solid var(--line);
  padding:14px 16px;
  font-weight:700;
  font-size:14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  transition:border-color .2s ease, color .2s ease;
}
.industry-links a:hover{border-color:var(--orange);color:var(--orange-dark);}
@media (max-width:900px){.industry-links{grid-template-columns:repeat(2, 1fr);}}
@media (max-width:560px){.industry-links{grid-template-columns:1fr;}}
