/* =========================================================
   SALVAGNO VOLQUETES — Landing
   Estética: claro y confiable · grafito + rojo · limpio
   ========================================================= */

:root{
  --white:  #FFFFFF;
  --bg-2:   #F5F6F8;   /* secciones alternas */
  --bg-3:   #EEF0F3;
  --ink:    #1C2530;   /* grafito titulares */
  --body:   #55606C;   /* texto */
  --muted:  #8A93A0;
  --red:    #E4002B;
  --red-600:#C10024;
  --line:   #E6E8EC;
  --line-2: #EFF1F4;
  --footer: #141A22;

  --f: "Plus Jakarta Sans", system-ui, sans-serif;

  --wrap: 1200px;
  --gutter: clamp(20px,5vw,60px);
  --radius: 14px;
  --radius-sm: 9px;
  --header-h: 74px;
  --sh-sm: 0 1px 2px rgba(20,26,34,.05), 0 6px 16px rgba(20,26,34,.05);
  --sh-md: 0 8px 24px rgba(20,26,34,.09), 0 2px 6px rgba(20,26,34,.05);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scroll-padding-top:calc(var(--header-h) + 16px); }
body{ font-family:var(--f); background:var(--white); color:var(--body); font-size:clamp(15px,1vw,16.5px); line-height:1.65; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden; }
img{ max-width:100%; display:block; height:auto; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
h1,h2,h3{ font-family:var(--f); font-weight:800; line-height:1.08; letter-spacing:-.02em; color:var(--ink); }
::selection{ background:var(--red); color:#fff; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); }
.wa{ width:1.15em; height:1.15em; flex:none; fill:currentColor; }
.accent{ color:var(--red); }

.skip-link{ position:fixed; top:-60px; left:16px; z-index:200; background:var(--red); color:#fff; padding:10px 16px; border-radius:8px; font-weight:600; transition:top .2s; }
.skip-link:focus{ top:16px; }

.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

:where(a,button,.btn,.nav a,.carousel__btn,.footer__col a,.contact__row a,.menu-toggle):focus-visible{ outline:3px solid var(--red); outline-offset:3px; border-radius:6px; }
:where([tabindex="-1"]):focus{ outline:none; }

/* =========================================================
   Botones
   ========================================================= */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.55em; font-weight:700; font-size:.98rem; padding:.82em 1.5em; border-radius:999px; border:1.5px solid transparent; cursor:pointer; transition:background .22s, color .22s, border-color .22s, transform .22s var(--ease), box-shadow .22s; }
.btn:active{ transform:translateY(1px); }
.btn--sm{ padding:.62em 1.15em; font-size:.9rem; }
.btn--lg{ padding:.98em 1.75em; font-size:1.04rem; }
.btn--block{ display:flex; width:100%; }
.btn__ar{ transition:transform .22s var(--ease); }
.btn:hover .btn__ar{ transform:translateX(4px); }

.btn--red{ background:var(--red); color:#fff; }
.btn--red:hover{ background:var(--red-600); transform:translateY(-2px); box-shadow:0 10px 22px rgba(228,0,43,.24); }
.btn--white{ background:#fff; color:var(--ink); }
.btn--white:hover{ transform:translateY(-2px); box-shadow:var(--sh-md); }
.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--ink); background:var(--bg-2); }
.btn--ghost-light{ color:#fff; border-color:rgba(255,255,255,.45); }
.btn--ghost-light:hover{ color:#fff; border-color:#fff; background:rgba(255,255,255,.12); }

/* =========================================================
   Kicker / títulos
   ========================================================= */
.kicker{ display:inline-block; font-weight:700; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; color:var(--red); margin-bottom:1.1rem; }
.kicker--light{ color:#fff; }

.section{ padding:clamp(60px,8vw,116px) 0; position:relative; }
.section--alt{ background:var(--bg-2); }
.section__head{ max-width:680px; margin-bottom:clamp(38px,5vw,60px); }
.section__title{ font-size:clamp(2rem,4.6vw,3.4rem); }
.section__title--sm{ font-size:clamp(1.7rem,3.4vw,2.5rem); }
.section__intro{ margin-top:1.1rem; color:var(--body); font-size:clamp(1rem,1.3vw,1.12rem); max-width:56ch; }
.section__intro--left{ margin-inline:0; }
.section__intro strong{ color:var(--ink); font-weight:700; }

/* =========================================================
   Topbar
   ========================================================= */
.topbar{ background:var(--footer); color:rgba(255,255,255,.68); font-size:.82rem; }
.topbar__inner{ display:flex; align-items:center; gap:1.3rem; height:38px; }
.topbar__sp{ flex:1; }
.topbar__tel{ color:#fff; font-weight:600; white-space:nowrap; }
.topbar__tel:hover{ color:var(--red); }
.topbar__wa{ color:rgba(255,255,255,.8); }
.topbar__tag{ color:rgba(255,255,255,.5); }
@media (max-width:820px){ .topbar__tag{ display:none; } }
/* En móvil se muestran SIEMPRE los dos números: se achica la tipografía
   en vez de esconder uno */
@media (max-width:700px){ .topbar{ font-size:.72rem; } .topbar__inner{ gap:.9rem; } }
@media (max-width:520px){ .topbar__loc{ display:none; } .topbar__inner{ justify-content:center; } .topbar__sp{ display:none; } }
@media (max-width:380px){ .topbar{ font-size:.66rem; } .topbar__inner{ gap:.55rem; } }

/* =========================================================
   Header
   ========================================================= */
.site-header{ position:sticky; top:0; z-index:100; height:var(--header-h); background:rgba(255,255,255,0); transition:background .35s var(--ease), box-shadow .35s; }
.site-header__inner{ display:flex; align-items:center; justify-content:space-between; height:100%; gap:1rem; }
.site-header.is-stuck{ background:rgba(255,255,255,.9); backdrop-filter:blur(14px) saturate(1.3); box-shadow:0 1px 0 var(--line), var(--sh-sm); }

.brand{ display:inline-flex; align-items:center; gap:.7rem; }
.brand__mark{ width:40px; height:40px; flex:none; display:grid; place-items:center; }
.brand__mark svg{ width:100%; height:100%; }
.brand__mark .m-red{ fill:var(--red); }
.brand__mark .m-ink{ fill:var(--ink); transition:fill .35s; }
.brand__text{ display:flex; flex-direction:column; line-height:1; }
.brand__name{ font-family:var(--f); font-weight:800; font-size:1.34rem; letter-spacing:-.02em; color:var(--ink); transition:color .35s; }
.brand__sub{ font-size:.64rem; letter-spacing:.06em; color:var(--muted); margin-top:.35em; text-transform:uppercase; font-weight:600; }
.brand__sub-short{ display:none; }

/* Header sobre hero (oscuro): marca clara */
.site-header:not(.is-stuck) .brand__name{ color:#fff; }
.site-header:not(.is-stuck) .brand__sub{ color:rgba(255,255,255,.72); }
.site-header:not(.is-stuck) .brand__mark .m-ink{ fill:#fff; }
.site-header:not(.is-stuck) .nav a{ color:rgba(255,255,255,.92); }
.site-header:not(.is-stuck) .menu-toggle span{ background:#fff; }

.nav{ display:none; align-items:center; gap:2rem; }
.nav a{ position:relative; white-space:nowrap; font-weight:600; font-size:.96rem; color:var(--ink); transition:color .2s; }
.nav a::after{ content:""; position:absolute; left:0; bottom:-4px; width:100%; height:2px; background:var(--red); transform:scaleX(0); transform-origin:left; transition:transform .28s var(--ease); }
.nav a:hover, .nav a.is-active{ color:var(--red); }
.site-header:not(.is-stuck) .nav a:hover, .site-header:not(.is-stuck) .nav a.is-active{ color:#fff; }
.nav a:hover::after, .nav a.is-active::after{ transform:scaleX(1); }
@media (min-width:1080px){ .nav{ display:flex; } }

.site-header__cta{ display:flex; align-items:center; gap:.8rem; }
.site-header__cta .btn--red{ display:none; }
@media (min-width:600px){ .site-header__cta .btn--red{ display:inline-flex; } }
.menu-toggle{ width:44px; height:44px; display:inline-grid; place-content:center; gap:6px; }
.menu-toggle span{ display:block; width:26px; height:2.5px; border-radius:2px; background:var(--ink); transition:transform .3s var(--ease); }
.menu-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(4px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2){ transform:translateY(-4px) rotate(-45deg); }
/* Menú abierto: fondo claro → la X siempre visible */
.site-header:not(.is-stuck) .menu-toggle[aria-expanded="true"] span{ background:var(--ink); }
.menu-toggle[aria-expanded="true"]{ position:relative; z-index:101; }
@media (min-width:1080px){ .menu-toggle{ display:none; } }

.mobile-menu{ position:fixed; inset:0; z-index:99; background:var(--white); padding:calc(var(--header-h) + 40px) var(--gutter) 40px; display:flex; flex-direction:column; gap:1.2rem; transform:translateY(-100%); opacity:0; visibility:hidden; transition:transform .45s var(--ease), opacity .35s, visibility .35s; }
.mobile-menu.is-open{ transform:none; opacity:1; visibility:visible; }
.mobile-menu__nav{ display:flex; flex-direction:column; border-top:1px solid var(--line); }
.mobile-menu__nav a{ font-weight:700; font-size:1.5rem; color:var(--ink); padding:.6rem 0; border-bottom:1px solid var(--line); transition:color .2s, padding-left .2s; }
.mobile-menu__nav a:hover{ color:var(--red); padding-left:.4rem; }
.mobile-menu__phone{ text-align:center; font-weight:600; color:var(--muted); margin-top:.3rem; }

/* =========================================================
   HERO (video)
   ========================================================= */
.hero{ position:relative; min-height:100vh; min-height:100dvh; display:flex; align-items:center; color:#fff; overflow:hidden; margin-top:calc(var(--header-h) * -1); padding-top:var(--header-h); padding-bottom:var(--header-h); }
@media (max-height:620px){ .hero{ min-height:auto; padding-block:120px 60px; } }
.hero__media{ position:absolute; inset:0; z-index:-2; background:#0d1218; }
.hero__img{ width:100%; height:100%; object-fit:cover; object-position:center 42%; }
/* Contenido centrado a la izquierda: degradado lateral fuerte para
   garantizar la lectura, dejando el camión visible a la derecha */
.hero__scrim{ position:absolute; inset:0; z-index:-1; background:
  linear-gradient(180deg, rgba(12,17,24,.34) 0%, rgba(12,17,24,.14) 28%, rgba(12,17,24,.24) 68%, rgba(12,17,24,.7) 100%),
  linear-gradient(90deg, rgba(12,17,24,.78) 0%, rgba(12,17,24,.62) 34%, rgba(12,17,24,.28) 62%, rgba(12,17,24,.04) 100%); }
.hero__inner{ position:relative; z-index:1; padding-block:clamp(16px,3vw,36px); }
.hero__title{ font-size:clamp(2.6rem,6.6vw,5.2rem); max-width:22ch; color:#fff; letter-spacing:-.025em; }
.hero__title .accent{ color:#fff; }
.hero__lead{ margin-top:1.4rem; max-width:62ch; font-size:clamp(1.05rem,1.5vw,1.25rem); color:rgba(255,255,255,.92); }
.hero__actions{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2rem; }
.hero__chips{ display:flex; flex-wrap:wrap; gap:.6rem .8rem; margin-top:2.2rem; }
.hero__chips li{ font-size:.86rem; font-weight:600; color:#fff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22); padding:.42rem .9rem; border-radius:999px; backdrop-filter:blur(4px); }

/* =========================================================
   SERVICIOS — tarjetas limpias
   ========================================================= */
.services{ background:var(--white); }
.cards{ display:grid; grid-template-columns:1fr; gap:1.1rem; }
@media (min-width:640px){ .cards{ grid-template-columns:1fr 1fr; } }
@media (min-width:980px){ .cards{ grid-template-columns:1fr 1fr 1fr; } }
.card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:1.9rem 1.7rem; position:relative; overflow:hidden; transition:transform .3s var(--ease), box-shadow .3s, border-color .3s; }
.card::before{ content:""; position:absolute; top:0; left:0; width:100%; height:3px; background:var(--red); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
.card:hover{ transform:translateY(-5px); box-shadow:var(--sh-md); border-color:transparent; }
.card:hover::before{ transform:scaleX(1); }
.card__title{ font-size:1.28rem; margin-bottom:.55rem; }
.card__desc{ color:var(--body); font-size:.98rem; }

/* =========================================================
   Banda de foto full-bleed (intercalada entre secciones)
   ========================================================= */
.photo-band{ position:relative; overflow:hidden; background:#0d1218; }
.photo-band img{ width:100%; aspect-ratio:3/1; object-fit:cover; object-position:center 58%; }
@media (max-width:760px){ .photo-band img{ aspect-ratio:3/2; } }
.photo-band__cap{ position:absolute; left:0; right:0; bottom:0; padding:1.6rem clamp(20px,5vw,60px) 1.1rem;
  color:#fff; font-weight:600; font-size:clamp(.95rem,1.6vw,1.15rem);
  background:linear-gradient(180deg, rgba(12,17,24,0), rgba(12,17,24,.75)); }

/* =========================================================
   FEATURE (el volquete)
   ========================================================= */
.feature{ background:var(--bg-2); }
.feature__grid{ display:grid; grid-template-columns:1fr; gap:clamp(30px,5vw,60px); align-items:center; }
@media (min-width:900px){ .feature__grid{ grid-template-columns:1fr 1fr; } }
.feature__media{ border-radius:var(--radius); overflow:hidden; box-shadow:var(--sh-md); }
/* Foto vertical: se recorta el cielo desde arriba y queda el camión */
.feature__media img{ width:100%; aspect-ratio:4/3.6; object-fit:cover; object-position:center 88%; transition:transform .8s var(--ease); }
.feature__media:hover img{ transform:scale(1.04); }
.loads{ margin:1.9rem 0; max-width:30rem; }
.loads__h{ font-weight:700; font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:.5rem; }
.loads__list{ display:flex; flex-direction:column; gap:.1rem; }
.loads__list li{ position:relative; padding:.55rem 0 .55rem 1.9rem; border-bottom:1px solid var(--line); color:var(--ink); font-weight:500; }
.loads__list li::before{ content:""; position:absolute; left:0; top:.72em; width:1.15rem; height:1.15rem; border-radius:50%; background:rgba(228,0,43,.1); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E4002B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-11'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center; background-size:.72rem; }

/* =========================================================
   MOVIMIENTO / ÁRIDOS
   ========================================================= */
.soil{ background:var(--bg-2); }
.soil__grid{ display:grid; grid-template-columns:1fr; gap:clamp(28px,4vw,52px); align-items:center; }
@media (min-width:900px){ .soil__grid{ grid-template-columns:1fr .92fr; } }
.aridos{ margin:1.9rem 0; }
.aridos__h{ font-weight:700; font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-bottom:.4rem; }
.aridos__list{ display:grid; grid-template-columns:1fr 1fr; column-gap:2rem; border-top:1px solid var(--line); }
.aridos__list li{ padding:.72rem 0; border-bottom:1px solid var(--line); font-weight:600; color:var(--ink); }
@media (max-width:440px){ .aridos__list{ grid-template-columns:1fr; } }
.soil__tall{ border-radius:var(--radius); overflow:hidden; box-shadow:var(--sh-md); }
.soil__tall img{ width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 40%; transition:transform .8s var(--ease); }
.soil__tall:hover img{ transform:scale(1.04); }
.soil__banner{ border-radius:var(--radius); overflow:hidden; margin-top:clamp(28px,4vw,48px); box-shadow:var(--sh-md); }
.soil__banner img{ width:100%; aspect-ratio:2.4/1; object-fit:cover; object-position:center 54%; transition:transform .9s var(--ease); }
.soil__banner:hover img{ transform:scale(1.03); }
@media (max-width:680px){ .soil__banner img{ aspect-ratio:3/2; } }

/* =========================================================
   COBERTURA
   ========================================================= */
.note{ margin-top:1.6rem; color:var(--body); font-size:.98rem; padding:1.1rem 1.3rem; background:var(--white); border:1px solid var(--line); border-left:3px solid var(--red); border-radius:0 var(--radius-sm) var(--radius-sm) 0; }

/* =========================================================
   Bloques a foto completa (Cobertura / Nosotros)
   ========================================================= */
.section-full{ position:relative; overflow:hidden; color:#fff; padding:clamp(72px,11vw,150px) 0; }
.section-full__media{ position:absolute; inset:0; z-index:-2; background:#0d1218; }
.section-full__media img{ width:100%; height:100%; object-fit:cover; object-position:center 50%; }
.section-full__scrim{ position:absolute; inset:0; z-index:-1;
  background:linear-gradient(90deg, rgba(16,22,30,.8) 0%, rgba(16,22,30,.56) 46%, rgba(16,22,30,.18) 100%),
             linear-gradient(180deg, rgba(16,22,30,.22), rgba(16,22,30,.34)); }
.section-full__inner{ position:relative; z-index:1; }
.section__title--light{ color:#fff; }
.section-full__text{ margin-top:1.2rem; color:rgba(255,255,255,.86); font-size:clamp(1rem,1.3vw,1.12rem); max-width:56ch; }
.about__card, .coverage__card{ max-width:660px; }
.note--light{ background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.18); border-left:3px solid var(--red); color:rgba(255,255,255,.9); backdrop-filter:blur(4px); }

.edges{ display:grid; grid-template-columns:1fr; gap:0; border-top:1px solid var(--line); margin-top:2rem; }
@media (min-width:560px){ .edges{ grid-template-columns:1fr 1fr; column-gap:2rem; } }
.edge{ padding:1.15rem 0; border-bottom:1px solid var(--line); }
.edge strong{ display:block; font-weight:700; font-size:1.04rem; color:var(--ink); margin-bottom:.15rem; }
.edge span{ color:var(--body); font-size:.9rem; }
.edges--light{ border-top-color:rgba(255,255,255,.22); }
.edges--light .edge{ border-bottom-color:rgba(255,255,255,.22); }
.edges--light .edge strong{ color:#fff; }
.edges--light .edge span{ color:rgba(255,255,255,.72); }

/* =========================================================
   GALERÍA — carrusel
   ========================================================= */
.gallery{ background:var(--bg-2); overflow:hidden; }
.gallery__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; margin-bottom:clamp(28px,3.5vw,44px); }
.gallery__head .section__title{ margin:0; }
.carousel__nav{ display:flex; gap:.6rem; flex:none; }
.carousel__btn{ width:52px; height:52px; display:grid; place-items:center; border:1.5px solid var(--line); border-radius:50%; color:var(--ink); background:var(--white); transition:background .25s, color .25s, border-color .25s, opacity .25s; }
.carousel__btn svg{ width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.carousel__btn:hover{ background:var(--red); color:#fff; border-color:var(--red); }
.carousel__btn:disabled{ opacity:.4; cursor:not-allowed; }
.carousel__btn:disabled:hover{ background:var(--white); color:var(--ink); border-color:var(--line); }
.carousel__viewport{ overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; -ms-overflow-style:none; scrollbar-width:none; scroll-behavior:smooth; }
.carousel__viewport::-webkit-scrollbar{ display:none; }
.carousel__track{ display:flex; gap:14px; }
.slide{ flex:0 0 clamp(260px,78vw,480px); scroll-snap-align:start; position:relative; overflow:hidden; border-radius:var(--radius); background:var(--bg-3); box-shadow:var(--sh-sm); }
@media (min-width:760px){ .slide{ flex-basis:clamp(400px,40vw,500px); } }
.slide img{ width:100%; aspect-ratio:3/2; object-fit:cover; transition:transform .8s var(--ease); }
.slide:hover img{ transform:scale(1.04); }
.slide__cap{ position:absolute; left:12px; bottom:12px; font-size:.8rem; font-weight:600; color:var(--ink); background:rgba(255,255,255,.94); padding:.36rem .8rem; border-radius:999px; box-shadow:var(--sh-sm); }
@media (max-width:620px){ .gallery__head{ flex-direction:column; align-items:flex-start; gap:1.3rem; } }

/* =========================================================
   CONTACTO
   ========================================================= */
.contact{ background:var(--white); }
.contact__panel{ background:var(--footer); color:#fff; border-radius:calc(var(--radius) + 6px); padding:clamp(32px,5vw,60px); display:grid; grid-template-columns:1fr; gap:clamp(32px,4vw,56px); position:relative; overflow:hidden; }
.contact__panel::before{ content:""; position:absolute; right:-140px; top:-140px; width:340px; height:340px; border-radius:50%; background:radial-gradient(circle, rgba(228,0,43,.28), transparent 70%); }
@media (min-width:920px){ .contact__panel{ grid-template-columns:1.1fr .9fr; align-items:center; } }
.contact__panel .section__title{ color:#fff; }
.contact__intro{ margin-top:1.1rem; color:rgba(255,255,255,.75); max-width:44ch; }
.contact__actions{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:1.8rem; position:relative; z-index:1; }
.contact__list{ position:relative; z-index:1; border-top:1px solid rgba(255,255,255,.16); }
.contact__row{ display:flex; justify-content:space-between; align-items:baseline; gap:1.2rem; padding:1.05rem 0; border-bottom:1px solid rgba(255,255,255,.16); }
.contact__row dt{ color:rgba(255,255,255,.6); font-size:.9rem; }
.contact__row dd{ font-weight:700; color:#fff; text-align:right; }
.contact__row a:hover{ color:var(--red); }

/* =========================================================
   FOOTER
   ========================================================= */
.footer{ background:var(--footer); color:rgba(255,255,255,.62); padding-top:clamp(44px,5vw,68px); }
.footer__inner{ display:grid; grid-template-columns:1fr; gap:2.4rem; padding-bottom:2.6rem; }
@media (min-width:760px){ .footer__inner{ grid-template-columns:2fr 1fr 1fr; } }
.brand--footer .brand__name{ color:#fff; }
.brand--footer .brand__mark .m-white{ fill:#fff; }
.footer__tagline{ margin-top:1.1rem; max-width:42ch; font-size:.92rem; color:rgba(255,255,255,.5); }
.footer__col h3{ font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color:#fff; margin-bottom:1rem; }
.footer__col a, .footer__col span{ display:block; padding:.34rem 0; font-size:.94rem; transition:color .2s; }
.footer__col a:hover{ color:var(--red); }
.footer__muted{ color:rgba(255,255,255,.4); }
.footer__bottom{ border-top:1px solid rgba(255,255,255,.12); }
.footer__bottom-inner{ display:flex; flex-direction:column; gap:.4rem; padding-block:1.5rem; font-size:.82rem; color:rgba(255,255,255,.45); }
@media (min-width:700px){ .footer__bottom-inner{ flex-direction:row; justify-content:space-between; align-items:center; } }

/* =========================================================
   FAB
   ========================================================= */
.fab-wa{ position:fixed; right:clamp(16px,3vw,26px); bottom:clamp(16px,3vw,26px); z-index:90; width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; box-shadow:0 8px 24px rgba(37,211,102,.4); transition:transform .3s var(--ease); }
.fab-wa:hover{ transform:scale(1.08); }
.fab-wa svg{ width:30px; height:30px; fill:currentColor; }

/* =========================================================
   Textos sobre foto: sombra sutil que mantiene la lectura
   con overlays bajos (así se ve mejor la imagen)
   ========================================================= */
.hero__title,
.hero__lead,
.hero .kicker--light,
.section-full .kicker--light,
.section__title--light,
.section-full__text,
.edges--light .edge strong,
.edges--light .edge span{
  text-shadow:0 1px 2px rgba(8,12,18,.6), 0 3px 18px rgba(8,12,18,.45);
}

/* =========================================================
   Ajustes móviles
   ========================================================= */
@media (max-width:760px){
  /* Marca: subtítulo corto y en una línea, sin chocar con la hamburguesa */
  .site-header .brand__sub{ font-size:.58rem; white-space:nowrap; }
  .site-header .brand__name{ font-size:1.2rem; }
  .site-header .brand__sub-full{ display:none; }
  .site-header .brand__sub-short{ display:inline; }
  /* Kicker más compacto */
  .kicker{ font-size:.72rem; margin-bottom:.9rem; }
  /* Hero: en vertical el degradado lateral no sirve, va parejo */
  .hero__scrim{ background:linear-gradient(180deg, rgba(12,17,24,.58) 0%, rgba(12,17,24,.42) 38%, rgba(12,17,24,.52) 70%, rgba(12,17,24,.8) 100%); }
  /* Full-bg: en vertical el degradado lateral no sirve */
  .section-full__scrim{ background:linear-gradient(180deg, rgba(16,22,30,.56) 0%, rgba(16,22,30,.64) 55%, rgba(16,22,30,.8) 100%); }
  .hero__img{ object-position:center 42%; }
  .section-full__media img{ object-position:center 45%; }
  /* Hero: respirar mejor y evitar líneas huérfanas */
  .hero__title{ font-size:clamp(2.15rem,8.6vw,3rem); letter-spacing:-.02em; }
  .hero__lead{ font-size:1rem; }
  .hero__actions .btn{ flex:1 1 100%; }
  .hero__chips li{ font-size:.8rem; padding:.36rem .8rem; }
  /* Imágenes: más altura útil en pantallas angostas */
  .feature__media img{ aspect-ratio:4/3.4; }
  .soil__tall img{ aspect-ratio:4/3.4; }
  /* Contacto: fila apilada para que no se corte el dato */
  .contact__row{ flex-direction:column; align-items:flex-start; gap:.15rem; }
  .contact__row dd{ text-align:left; }
  /* CTA a ancho completo */
  .contact__actions .btn{ flex:1 1 100%; }
  /* El botón flotante de WhatsApp no debe tapar la última línea del footer */
  .footer__bottom-inner{ padding-bottom:calc(1.5rem + 68px); }
}
@media (max-width:420px){
  .card{ padding:1.5rem 1.3rem; }
  .contact__panel{ padding:26px 20px; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  *{ transition-duration:.01ms !important; }
}