/* =========================================================
   TOKENS — paleta tomada del logo de Álvarez Maquinarias
   negro #000000 · grafito #444C55 · celeste #58B2D1 · blanco
   ========================================================= */
:root{
  color-scheme: light;
  --black:#000000;
  --graphite:#444C55;
  --sky:#58B2D1;
  --sky-hover:#76C3DE;
  --white:#FFFFFF;
  --bg:#F3F5F6;
  --surface:#FFFFFF;
  --surface-2:#E5E9EC;
  --text:#14181C;
  --muted:#444C55;
  --line:rgba(20,24,28,.13);
  --sky-ink:#1B6B89;
  --error:#B3261E;
  --logo-light:none;
  --logo-dark:block;
  --radius-m:14px;
  --radius-l:24px;
  --ease:cubic-bezier(.22,.8,.2,1);
  --font:"Archivo","Arial Narrow","Helvetica Neue",Arial,system-ui,sans-serif;
  --wrap:min(1260px, 100% - 2 * clamp(20px, 4vw, 48px));
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --bg:#000000; --surface:#111418; --surface-2:#1A1F24; --text:#EEF1F3; --muted:#A7B0B8;
    --line:rgba(238,241,243,.14); --sky-ink:#7CC7E2; --error:#FF8A80;
    --logo-light:block; --logo-dark:none;
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --bg:#000000; --surface:#111418; --surface-2:#1A1F24; --text:#EEF1F3; --muted:#A7B0B8;
  --line:rgba(238,241,243,.14); --sky-ink:#7CC7E2; --error:#FF8A80;
  --logo-light:block; --logo-dark:none;
}

/* =========================================================
   BASE
   ========================================================= */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:1.0625rem;line-height:1.6}
body.menu-open{overflow:hidden}
img,svg,video{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--sky);outline-offset:3px;border-radius:6px}
.wrap{width:var(--wrap);margin-inline:auto}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
section[id]{scroll-margin-top:72px}
.section{padding-block:clamp(88px,12vw,150px)}
.section__head{display:grid;grid-template-columns:1.2fr 1fr;gap:28px 64px;align-items:end;margin-bottom:clamp(40px,6vw,68px)}
.section__title{margin:0;font-size:clamp(2.4rem,5.2vw,4.6rem);font-stretch:78%;font-variation-settings:"wdth" 78;font-weight:880;line-height:.96;letter-spacing:-.01em;text-wrap:balance}
.section__lead{margin:0;color:var(--muted);max-width:46ch}

/* Chevrones de marca (>>>) */
.chevrons{display:inline-flex;gap:4px;color:var(--sky)}
.chevrons svg{width:16px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linejoin:round}
.chevrons--run svg{animation:chev 1.8s var(--ease) infinite}
.chevrons--run svg:nth-child(2){animation-delay:.18s}
.chevrons--run svg:nth-child(3){animation-delay:.36s}
@keyframes chev{0%,100%{opacity:.25;transform:translateX(0)}40%{opacity:1;transform:translateX(3px)}}

/* =========================================================
   BOTONES
   ========================================================= */
.btn{background:transparent;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 1.5em;border-radius:6px;border:1px solid transparent;font:inherit;font-size:1rem;font-weight:650;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background-color .3s,color .3s,border-color .3s,transform .45s var(--ease)}
.btn svg{width:20px;height:20px;flex:none}
.btn--primary{background:var(--sky);color:var(--black)}
.btn--primary:hover{background:var(--sky-hover)}
.btn--ghost{border-color:rgba(255,255,255,.5);color:var(--white)}
.btn--ghost:hover{background:rgba(255,255,255,.1);border-color:var(--white)}
.btn--dark{background:var(--black);color:var(--white)}
.btn--dark:hover{background:var(--graphite)}
.btn--small{min-height:44px;padding:0 1.15em;font-size:.95rem}
.btn__chev{display:inline-flex;gap:2px}
.btn__chev svg{width:9px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;transition:transform .45s var(--ease),opacity .3s}
.btn__chev svg:nth-child(2){opacity:.55}.btn__chev svg:nth-child(3){opacity:.25}
.btn:hover .btn__chev svg{transform:translateX(4px);opacity:1}
.btn:hover .btn__chev svg:nth-child(2){transition-delay:.05s}
.btn:hover .btn__chev svg:nth-child(3){transition-delay:.1s}
.btn.is-loading{pointer-events:none;opacity:.85}
.btn.is-loading .btn__label::after{content:"";display:inline-block;width:14px;height:14px;margin-left:.6em;vertical-align:-2px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;padding-top:env(safe-area-inset-top,0px);color:var(--white);transition:transform .5s var(--ease),background-color .35s,color .35s,box-shadow .35s}
.site-header.is-solid{background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:saturate(1.3) blur(14px);backdrop-filter:saturate(1.3) blur(14px);color:var(--text);box-shadow:0 1px 0 var(--line)}
.site-header.is-hidden{transform:translateY(-100%)}
.site-header__inner{width:var(--wrap);margin-inline:auto;height:78px;display:flex;align-items:center;gap:32px}
.site-header__progress{position:absolute;left:0;bottom:0;width:100%;height:3px;background:var(--sky);transform-origin:left;transform:scaleX(var(--p,0));opacity:0;transition:opacity .3s}
.site-header.is-solid .site-header__progress{opacity:1}
.brand{display:block;flex:none}
.brand img{height:48px;width:auto}
.brand__on-dark{display:block}.brand__on-light{display:none}
.site-header.is-solid .brand__on-dark{display:var(--logo-light)}
.site-header.is-solid .brand__on-light{display:var(--logo-dark)}
.nav{margin-left:auto}
.nav__list{display:flex;gap:30px;list-style:none;margin:0;padding:0}
.nav__link{position:relative;text-decoration:none;font-weight:550;font-size:.98rem;padding:10px 0}
.nav__link::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:2px;background:var(--sky);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.nav__link:hover::after,.nav__link[aria-current="true"]::after{transform:scaleX(1);transform-origin:left}
.menu-toggle{display:none;margin-left:auto;width:48px;height:48px;border:0;background:none;color:inherit;cursor:pointer;position:relative;z-index:61}
.menu-toggle span{position:absolute;left:12px;right:12px;height:2px;background:currentColor;transition:transform .45s var(--ease),top .45s var(--ease)}
.menu-toggle span:first-child{top:19px}
.menu-toggle span:last-child{top:27px}
.menu-toggle[aria-expanded="true"] span:first-child{top:23px;transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:last-child{top:23px;transform:rotate(-45deg)}
.mobile-nav{position:fixed;inset:0;z-index:60;background:var(--black);color:var(--white);padding:calc(118px + env(safe-area-inset-top,0px)) clamp(20px,6vw,48px) calc(40px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;justify-content:space-between;clip-path:circle(0% at calc(100% - 44px) 40px);transition:clip-path .7s var(--ease);visibility:hidden}
.mobile-nav.is-open{clip-path:circle(150% at calc(100% - 44px) 40px);visibility:visible}
.mobile-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.mobile-nav a{display:block;text-decoration:none;font-size:clamp(2.4rem,11vw,3.4rem);font-weight:900;font-stretch:75%;font-variation-settings:"wdth" 75;text-transform:uppercase;line-height:1.1;opacity:0;transform:translateY(24px);transition:opacity .5s,transform .6s var(--ease)}
.mobile-nav.is-open a{opacity:1;transform:none}
.mobile-nav.is-open li:nth-child(2) a{transition-delay:.06s}
.mobile-nav.is-open li:nth-child(3) a{transition-delay:.12s}
.mobile-nav.is-open li:nth-child(4) a{transition-delay:.18s}
.mobile-nav.is-open li:nth-child(5) a{transition-delay:.24s}

/* =========================================================
   HERO — video hiperrealista en loop
   ========================================================= */
.hero{position:relative;height:260vh;color:var(--white);background:#000}
.hero__sticky{position:sticky;top:0;height:100svh;min-height:600px;overflow:hidden;isolation:isolate}
/* Intro: el campo se ve a través del wordmark ALVAREZ y se abre al hacer scroll */
.hero__mask{position:absolute;inset:0;z-index:0;background:#000;mix-blend-mode:multiply;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:scale(var(--ms,1));opacity:var(--mo,1);will-change:transform,opacity;pointer-events:none}
.hero__word{display:block;color:#fff;font-weight:900;font-stretch:72%;font-variation-settings:"wdth" 72;text-transform:uppercase;line-height:.8;letter-spacing:-.01em;font-size:min(24vw,50vh);white-space:nowrap}
.hero__spacer{display:block;height:calc(min(24vw,50vh) * .3);margin-top:calc(min(24vw,50vh) * .1)}
.hero__brandline{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;opacity:var(--bo,1);transform:translateX(var(--bx,0))}
.hero__brandline .hero__word{visibility:hidden}
.hero__band{display:flex;align-items:center;gap:calc(min(24vw,50vh) * .04);margin-top:calc(min(24vw,50vh) * .1);height:calc(min(24vw,50vh) * .3)}
.hero__band-text{height:100%;display:flex;align-items:center;padding:0 calc(min(24vw,50vh) * .16) 0 calc(min(24vw,50vh) * .1);background:var(--sky);color:#fff;font-weight:800;font-stretch:88%;font-variation-settings:"wdth" 88;font-size:calc(min(24vw,50vh) * .19);letter-spacing:.01em;clip-path:polygon(0 0,calc(100% - .55em) 0,100% 50%,calc(100% - .55em) 100%,0 100%,.35em 50%)}
.hero__band .chevrons svg{width:calc(min(24vw,50vh) * .12);height:calc(min(24vw,50vh) * .26);stroke-width:1.6}
.hero__hint{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:6px;margin:0;font-size:.9rem;color:rgba(255,255,255,.8);opacity:var(--bo,1);pointer-events:none}
.hero--static{height:auto}
.hero--static .hero__sticky{position:relative}
.hero--static .hero__mask,.hero--static .hero__brandline,.hero--static .hero__hint{display:none}
.hero__media{position:absolute;inset:-3%;z-index:-3;transform:translate3d(var(--mx,0),var(--my,0),0) scale(var(--zoom,1.04));will-change:transform}
.hero__media img,.hero__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.hero__media video{opacity:0;transition:opacity 1.2s}
.hero__media video.is-playing{opacity:1}
.hero__shade{position:absolute;inset:0;z-index:-2;pointer-events:none;background:
  linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.45) 38%,rgba(0,0,0,0) 68%),
  linear-gradient(0deg,rgba(0,0,0,.85) 0%,rgba(0,0,0,0) 45%);
  opacity:var(--shade,1)}
.hero__dust{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.hero__content{position:absolute;left:0;right:0;bottom:0;width:var(--wrap);margin-inline:auto;padding-bottom:clamp(44px,9vh,92px)}
.ribbon{display:inline-flex;align-items:center;gap:10px;margin:0 0 26px}
.ribbon__band{position:relative;padding:8px 26px 8px 16px;background:var(--sky);color:var(--black);font-weight:700;font-size:.95rem;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%,8px 50%)}
.hero__title{margin:0;font-size:clamp(2.9rem,7.6vw,7.6rem);font-stretch:72%;font-variation-settings:"wdth" 72;font-weight:900;line-height:.9;letter-spacing:-.005em;text-transform:uppercase}
.hero__title .line{display:block;white-space:nowrap;overflow:hidden;padding:.14em 0 .04em;margin:-.14em 0 -.04em}
.hero__title .line>span{display:block;transform:translateY(120%);opacity:0;transition:transform 1.15s var(--ease),opacity .4s}
.hero.is-revealed .hero__title .line>span{transform:none;opacity:1}
.hero.is-revealed .hero__title .line:nth-child(2)>span{transition-delay:.1s}
.hero.is-revealed .hero__title .line:nth-child(3)>span{transition-delay:.2s}
.hero__foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px 48px;margin-top:30px}
.hero__lead{margin:0;max-width:44ch;font-size:clamp(1.02rem,1.4vw,1.18rem);color:rgba(255,255,255,.88)}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px}
.ribbon,.hero__lead,.hero__actions{opacity:0;transform:translateY(14px);transition:opacity .7s .35s,transform .9s .35s var(--ease)}
.hero.is-revealed .ribbon,.hero.is-revealed .hero__lead,.hero.is-revealed .hero__actions{opacity:1;transform:none}
.hero:not(.is-revealed) .hero__content{pointer-events:none}
.hero__scroll{position:absolute;left:50%;bottom:22px;z-index:3;opacity:var(--co,0);transition:opacity .4s;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;color:var(--sky);text-decoration:none}
.hero__scroll svg{width:22px;height:13px;fill:none;stroke:currentColor;stroke-width:2.4;margin-top:-3px;animation:chevdown 1.8s var(--ease) infinite}
.hero__scroll svg:nth-child(2){animation-delay:.18s}.hero__scroll svg:nth-child(3){animation-delay:.36s}
@keyframes chevdown{0%,100%{opacity:.2}40%{opacity:1}}

/* =========================================================
   MARCAS — paneles expandibles
   ========================================================= */
.brands{display:flex;gap:16px;min-height:640px}
.brand-panel{flex:1 1 0;position:relative;overflow:hidden;isolation:isolate;border-radius:var(--radius-l);padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;justify-content:space-between;gap:28px;color:#fff;transition:flex-grow .8s var(--ease)}
.brand-panel>*{position:relative;z-index:2}
/* New Holland: azul oficial del logo (#00205B) + foto de campo */
.brand-panel--nh{--accent:#F5B82E;background:#00205B}
.brand-panel__bg{position:absolute!important;inset:0;z-index:0!important;width:100%;height:100%;object-fit:cover;object-position:55% 65%;transform:scale(1.02);transition:transform 1.6s var(--ease)}
.brand-panel--nh::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,32,91,.96) 0%,rgba(0,32,91,.62) 40%,rgba(0,32,91,.08) 66%,rgba(0,32,91,.82) 100%);transition:opacity .8s}
/* Crucianelli: rojo de sus máquinas + equipo recortado */
.brand-panel--cr{--accent:#fff;background:radial-gradient(120% 90% at 78% 95%,#D9352E 0%,#B81A1A 55%,#931212 100%)}
.brand-panel--cr::before{content:"";position:absolute;inset:0;z-index:0;opacity:.12;background:repeating-linear-gradient(100deg,transparent 0 26px,#fff 26px 27px);mask-image:linear-gradient(0deg,#000 0%,transparent 55%);-webkit-mask-image:linear-gradient(0deg,#000 0%,transparent 55%)}
.brand-panel__machine{position:absolute!important;z-index:1!important;right:-4%;top:34%;width:min(72%,500px);height:auto;transform:translateX(18%);filter:drop-shadow(0 26px 18px rgba(0,0,0,.38));transition:transform 1.2s var(--ease)}
.brand-panel__logo{height:64px;width:auto;margin-left:-6px}
.brand-panel__logo--cr{height:44px;margin-left:0}
.brand-panel__text{margin:20px 0 0;max-width:34ch;font-size:1.06rem;line-height:1.5;opacity:.92}
.brand-panel__lines{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;max-width:460px}
.brand-panel__lines li{padding:7px 14px;border-radius:4px;border:1px solid rgba(255,255,255,.55);background:rgba(0,0,0,.18);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:.92rem;font-weight:550;opacity:.7;transform:translateY(6px);transition:opacity .5s,transform .6s var(--ease),border-color .4s}
.brand-panel__link{display:inline-flex;align-items:center;gap:10px;margin-top:18px;min-height:44px;color:var(--accent);font-weight:750;font-size:1.02rem;text-decoration:none}
.brand-panel__link .btn__chev svg{width:10px;height:16px}
.brand-panel__link:hover .btn__chev svg{transform:translateX(4px);opacity:1}
@media (hover:hover){
  .brand-panel:hover,.brand-panel:focus-within{flex-grow:1.6}
  .brand-panel:hover .brand-panel__bg{transform:scale(1.09)}
  .brand-panel:hover .brand-panel__machine,.brand-panel:focus-within .brand-panel__machine{transform:translateX(0)}
  .brand-panel:hover .brand-panel__lines li,.brand-panel:focus-within .brand-panel__lines li{opacity:1;transform:none}
  .brand-panel:hover .brand-panel__lines li:nth-child(2){transition-delay:.05s}
  .brand-panel:hover .brand-panel__lines li:nth-child(3){transition-delay:.1s}
  .brand-panel:hover .brand-panel__lines li:nth-child(4){transition-delay:.15s}
  .brand-panel--nh:hover .brand-panel__lines li{border-color:var(--accent)}
}
@media (hover:none){.brand-panel__lines li{opacity:1;transform:none}.brand-panel__machine{transform:none}}

/* =========================================================
   CERTIFICACIONES ISO — banda negra
   ========================================================= */
.iso{background:var(--black);color:var(--white);padding-block:clamp(72px,9vw,120px)}
.iso__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 48px;margin-bottom:48px}
.iso__title{margin:0;font-size:clamp(2.2rem,4.6vw,4rem);font-stretch:75%;font-variation-settings:"wdth" 75;font-weight:900;line-height:.95;text-transform:uppercase}
.iso__lead{margin:0;max-width:44ch;color:#B9C1C8}
.iso__grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.16)}
.iso__item{padding:32px 28px 8px 0;display:grid;gap:10px}
.iso__item+.iso__item{padding-left:28px;border-left:1px solid rgba(255,255,255,.16)}
.iso__norm{display:flex;align-items:center;gap:12px;font-size:clamp(1.8rem,3vw,2.6rem);font-stretch:80%;font-variation-settings:"wdth" 80;font-weight:850;line-height:1}
.iso__norm small{font-size:.5em;font-weight:600;color:var(--sky)}
.iso__check{width:34px;height:34px;flex:none;fill:none;stroke:var(--sky);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.iso__check path{stroke-dasharray:30;stroke-dashoffset:30;transition:stroke-dashoffset .8s var(--ease)}
.iso.is-visible .iso__check path{stroke-dashoffset:0}
.iso.is-visible .iso__item:nth-child(2) .iso__check path{transition-delay:.2s}
.iso.is-visible .iso__item:nth-child(3) .iso__check path{transition-delay:.4s}
.iso__area{margin:0;font-weight:600}
.iso__desc{margin:0;color:#B9C1C8;font-size:.98rem;max-width:34ch}

/* =========================================================
   EQUIPOS — filtros + catálogo
   ========================================================= */
.filters{position:relative;display:inline-flex;gap:4px;padding:6px;border-radius:8px;background:var(--surface-2);margin-bottom:40px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.filters::-webkit-scrollbar{display:none}
.filters__btn{position:relative;z-index:1;min-height:44px;padding:0 22px;border:0;border-radius:5px;background:none;color:var(--muted);font:inherit;font-weight:650;font-size:.98rem;cursor:pointer;white-space:nowrap;transition:color .3s}
.filters__btn[aria-pressed="true"]{color:var(--black)}
.filters__ind{position:absolute;z-index:0;top:6px;bottom:6px;left:0;width:0;border-radius:5px;background:var(--sky);transition:transform .55s var(--ease),width .55s var(--ease)}
.catalog{display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:20px}
.machine{display:flex;flex-direction:column;overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);transition:opacity .28s,transform .45s var(--ease),box-shadow .45s,border-color .45s}
.machine[hidden]{display:none}
.machine.is-out{opacity:0;transform:scale(.97)}
.machine__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--surface-2)}
.machine__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease),filter .7s}
.machine__media--cutout{background:radial-gradient(70% 34% at 50% 82%,rgba(0,0,0,.16),transparent 70%),linear-gradient(170deg,var(--surface-2),var(--bg))}
.machine__media--cutout img{object-fit:contain;padding:16% 7% 14%}
.machine--used .machine__media img{filter:grayscale(.9) contrast(1.05)}
.machine__tag{position:absolute;top:14px;left:14px;padding:5px 14px 5px 10px;background:var(--sky);color:var(--black);font-size:.8rem;font-weight:700;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%)}
.machine__tag--used{background:var(--black);color:var(--white)}
.machine__ph{position:absolute;right:12px;bottom:10px;padding:3px 8px;border-radius:4px;background:rgba(0,0,0,.55);color:#fff;font-size:.72rem}
.machine__body{flex:1;display:flex;flex-direction:column;gap:12px;padding:20px 22px 22px}
.machine__brand{margin:0;display:flex;align-items:center;gap:8px;font-size:.88rem;color:var(--muted)}
.machine__brand::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--brand-dot,var(--sky))}
.machine[data-brand="nh"]{--brand-dot:#F5B82E}
.machine[data-brand="cr"]{--brand-dot:#C8201E}
.machine__name{margin:-6px 0 0;font-size:1.5rem;font-stretch:82%;font-variation-settings:"wdth" 82;font-weight:800;line-height:1.1}
.machine__specs{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.machine__specs li{padding:3px 10px;border-radius:4px;background:var(--surface-2);font-size:.84rem;color:var(--muted)}
.machine__cta{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0;border:0;background:none;color:var(--sky-ink);font:inherit;font-weight:700;font-size:.95rem;cursor:pointer}
.machine__cta svg{width:18px;height:18px;transition:transform .45s var(--ease)}
.machine__cta:hover svg{transform:rotate(-12deg) scale(1.12)}
@media (hover:hover){
  .machine:hover{transform:translateY(-4px);border-color:var(--sky);box-shadow:0 22px 44px -26px rgba(0,0,0,.5)}
  .machine:hover .machine__media img{transform:scale(1.06);filter:none}
  .machine:hover .machine__media--cutout img{transform:translateX(10px) scale(1.02)}
}
.catalog__note{margin:28px 0 0;font-size:.86rem;color:var(--muted)}

/* =========================================================
   VENTA · REPUESTOS · POSTVENTA — tarjetas destacadas
   ========================================================= */
.pillars__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pillar{position:relative;overflow:hidden;isolation:isolate;border-radius:var(--radius-l);height:clamp(520px,74vh,660px);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(24px,2.6vw,36px);background:#000}
.pillar__img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transform:scale(1.01);transition:transform 1.6s var(--ease)}
.pillar::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.6) 36%,rgba(0,0,0,.05) 68%,rgba(0,0,0,.35) 100%)}
.pillar::after{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:var(--sky);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.pillar__kicker{position:absolute;top:clamp(24px,2.6vw,36px);left:clamp(24px,2.6vw,36px);display:flex;align-items:center;gap:10px;margin:0;font-size:.92rem;font-weight:600}
.pillar__kicker .chevrons svg{width:9px;height:14px}
.pillar__title{margin:0;font-size:clamp(2.6rem,4.3vw,4.3rem);font-weight:900;font-stretch:72%;font-variation-settings:"wdth" 72;line-height:.88;text-transform:uppercase;letter-spacing:-.005em}
.pillar__lead{margin:12px 0 0;max-width:30ch;color:rgba(255,255,255,.86)}
.pillar__more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .75s var(--ease)}
.pillar__more>div{overflow:hidden}
.pillar__list{list-style:none;margin:20px 0 0;padding:16px 0 0;border-top:1px solid rgba(255,255,255,.2);display:grid;gap:9px}
.pillar__list li{display:flex;align-items:flex-start;gap:10px;font-size:.98rem}
.pillar__list svg{flex:none;width:9px;height:14px;margin-top:5px;fill:none;stroke:var(--sky);stroke-width:2.4}
.pillar__cta{margin-top:22px}
@media (hover:hover){
  .pillar:hover .pillar__img,.pillar:focus-within .pillar__img{transform:scale(1.08)}
  .pillar:hover::after,.pillar:focus-within::after{transform:scaleX(1)}
  .pillar:hover .pillar__more,.pillar:focus-within .pillar__more{grid-template-rows:1fr}
}
@media (hover:none){.pillar__more{grid-template-rows:1fr}.pillar{height:auto;min-height:560px}}
.pillars__extra{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:28px;color:var(--muted)}
.pillars__chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--text);font:inherit;font-weight:600;font-size:.95rem;text-decoration:none;cursor:pointer;transition:border-color .3s}
.pillars__chip:hover{border-color:var(--sky)}
.pillars__chip svg{width:9px;height:14px;fill:none;stroke:var(--sky);stroke-width:2.4;transition:transform .4s var(--ease)}
.pillars__chip:hover svg{transform:translateX(4px)}

/* =========================================================
   EMPRESA — cobertura
   ========================================================= */
.company{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,96px);align-items:center}
.company__text p{margin:0 0 18px;max-width:52ch;color:var(--muted)}
.company__quote{margin:34px 0 0;padding:0 0 0 0;font-size:clamp(1.5rem,2.6vw,2.1rem);font-stretch:82%;font-variation-settings:"wdth" 82;font-weight:750;line-height:1.15;max-width:24ch}
.company__quote footer{margin-top:12px;font-size:.92rem;font-weight:400;font-stretch:100%;font-variation-settings:"wdth" 100;color:var(--muted)}
.company__events{margin-top:30px;display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0}
.company__events li{padding:6px 14px;border:1px solid var(--line);border-radius:4px;font-size:.9rem}
.radar{width:100%;max-width:520px;margin-inline:auto;overflow:visible}
.radar__ring{fill:none;stroke:var(--line);stroke-width:1}
.radar__axis{stroke:var(--line);stroke-width:1;stroke-dasharray:3 6}
.radar__stop{stop-color:var(--sky)}
.radar__sweep{transform-box:view-box;transform-origin:210px 210px;animation:sweep 7s linear infinite;animation-play-state:paused}
.radar.is-visible .radar__sweep{animation-play-state:running}
@keyframes sweep{to{transform:rotate(-360deg)}}
.radar__label{font-family:var(--font);font-size:17px;font-weight:800;font-stretch:80%;font-variation-settings:"wdth" 80;fill:var(--text);text-transform:uppercase}
.radar__city{font-family:var(--font);font-size:13px;font-weight:600;fill:var(--muted)}
.radar__pin{fill:var(--sky)}
.radar__pulse{fill:none;stroke:var(--sky);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:pulse 2.6s var(--ease) infinite}
.radar__pulse--late{animation-delay:1.3s}
@keyframes pulse{0%{transform:scale(.4);opacity:1}100%{transform:scale(3.2);opacity:0}}

/* =========================================================
   CONTACTO
   ========================================================= */
.contact{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(32px,5vw,72px);align-items:start}
.branches{display:grid;gap:16px}
.branch{padding:26px 28px;border-radius:var(--radius-m);background:var(--surface);border:1px solid var(--line)}
.branch--dark{background:var(--black);color:var(--white);border-color:var(--black)}
.branch h3{margin:0 0 12px;font-size:1.7rem;font-stretch:78%;font-variation-settings:"wdth" 78;font-weight:880;line-height:1;text-transform:uppercase}
.branch p{margin:0 0 6px;color:var(--muted)}
.branch--dark p{color:#B9C1C8}
.branch a{text-decoration-color:var(--line);text-underline-offset:4px;transition:text-decoration-color .3s}
.branch a:hover{text-decoration-color:var(--sky)}
.branch__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.form{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:clamp(24px,3vw,36px);border-radius:var(--radius-l);background:var(--surface);border:1px solid var(--line)}
.field{position:relative}
.field--full{grid-column:1/-1}
.field__control{width:100%;min-height:58px;padding:24px 16px 8px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);font:inherit;font-size:1rem;transition:border-color .25s,box-shadow .25s;appearance:none;-webkit-appearance:none}
textarea.field__control{min-height:132px;resize:vertical}
select.field__control{background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 22px) 27px,calc(100% - 16px) 27px;background-size:6px 6px;background-repeat:no-repeat}
.field__label{position:absolute;left:17px;top:18px;color:var(--muted);pointer-events:none;transform-origin:left top;transition:transform .3s var(--ease),color .3s}
.field__control:focus{outline:none;border-color:var(--sky);box-shadow:0 0 0 4px color-mix(in srgb,var(--sky) 28%,transparent)}
.field__control:focus+.field__label,.field__control:not(:placeholder-shown)+.field__label,.field__label--static{transform:translateY(-10px) scale(.78);color:var(--sky-ink)}
.field__control[aria-invalid="true"]{border-color:var(--error)}
.field__error{display:block;margin-top:6px;font-size:.84rem;color:var(--error)}
.field__error:empty{display:none}
.field.is-shaking{animation:shake .45s var(--ease)}
@keyframes shake{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.form__footer{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:6px}
.form__legal{margin:0;font-size:.85rem;color:var(--muted);max-width:36ch}
.form__done{grid-column:1/-1;margin:0;padding:14px 18px;border-radius:8px;background:var(--surface-2);font-weight:550}
.form__done[hidden]{display:none}

/* =========================================================
   FOOTER
   ========================================================= */
.footer{background:var(--black);color:var(--white);padding:clamp(64px,9vw,110px) 0 calc(36px + env(safe-area-inset-bottom,0px))}
.footer__top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:56px}
.footer__logo{width:min(420px,80vw);height:auto}
.footer__row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 40px;padding-top:28px;border-top:1px solid rgba(255,255,255,.16);font-size:.92rem;color:#B9C1C8}
.footer__row p{margin:0}

/* =========================================================
   RESPONSIVE + MOVIMIENTO REDUCIDO
   ========================================================= */
@media (max-width:980px){
  .nav,.site-header__cta{display:none}
  .menu-toggle{display:block}
  .section__head,.company,.contact{grid-template-columns:1fr}
  .brands{flex-direction:column;min-height:0}
  .brand-panel{min-height:540px}
  .brand-panel__machine{top:40%;width:84%}
  .iso__grid{grid-template-columns:1fr}
  .pillars__grid{grid-template-columns:1fr}
  .iso__item+.iso__item{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.16)}
}
@media (max-width:640px){
  .hero__title .line{white-space:normal}
  .ribbon__band{font-size:.8rem;white-space:nowrap}
  .ribbon .chevrons{display:none}
  .brand img{height:38px}
  .form{grid-template-columns:1fr}
  .hero__actions .btn{flex:1 1 auto}
  .hero__media img,.hero__media video{object-position:82% 50%}
  .hero__shade{background:linear-gradient(0deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.1) 100%)}
  .hero__scroll{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}