/* =========================================================
   WIT Soluciones — one page
   Paleta tomada del logo: azul petróleo WIT + píxeles de color
   ========================================================= */
:root{
  --ink:#04101c;          /* fondo profundo */
  --ink-2:#0a1d2e;        /* superficies */
  --line:#18354b;         /* bordes */
  --wit:#1ba3c6;          /* azul del logo */
  --cyan:#5ff2ff;         /* brillo */
  --pix-pink:#ff5ba7;     /* píxeles del logo */
  --pix-gold:#ffd23f;
  --paper:#e8f3f8;        /* texto claro */
  --mist:#8fa9ba;         /* texto secundario */
  --light-bg:#eef5f8;
  --light-ink:#0b2233;
  --wa:#25d366;

  --f-display:"Chakra Petch", system-ui, sans-serif;
  --f-body:"Sora", system-ui, sans-serif;

  --wrap:1200px;
  --gut:clamp(16px,4vw,40px);
  --r-sm:6px; --r-md:14px;
  --cut:14px;             /* esquina recortada, firma visual */
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--ink);color:var(--paper);font:400 16px/1.65 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--f-display);line-height:1.1;margin:0;font-weight:600;letter-spacing:-.01em}
p{margin:0 0 1em}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-999px;top:8px;background:var(--cyan);color:var(--ink);padding:8px 14px;z-index:100}
.skip:focus{left:8px}

/* ---------- Botones ---------- */
.btn{--bg:transparent;display:inline-flex;align-items:center;justify-content:center;gap:10px;font:600 15px/1 var(--f-display);letter-spacing:.02em;text-decoration:none;padding:15px 26px;border:1px solid var(--cyan);color:var(--paper);background:var(--bg);cursor:pointer;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));transition:background .2s,color .2s,box-shadow .2s}
.btn--solid{--bg:var(--cyan);color:var(--ink);border-color:var(--cyan)}
.btn--solid:hover{--bg:#fff;box-shadow:0 0 30px rgba(95,242,255,.45)}
.btn--ghost:hover{--bg:rgba(95,242,255,.12)}
.btn--sm{padding:11px 18px;font-size:14px}
.btn--wide{width:100%}

/* ---------- Nav ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.is-solid{background:rgba(4,16,28,.86);backdrop-filter:blur(12px);border-color:var(--line)}
.nav__in{display:flex;align-items:center;justify-content:space-between;height:76px}
.nav__logo img{height:50px;width:auto}
.nav__links{display:flex;align-items:center;gap:30px}
.nav__links a:not(.btn){font:500 15px var(--f-display);text-decoration:none;color:var(--mist);transition:color .2s}
.nav__links a:not(.btn):hover,.nav__links a.is-current{color:var(--paper)}
.nav__toggle{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;position:relative}
.nav__toggle span{position:absolute;left:10px;right:10px;height:2px;background:var(--paper);transition:transform .25s}
.nav__toggle span:first-child{top:17px}.nav__toggle span:last-child{top:25px}
.nav__toggle[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}

/* ---------- Hero slider ---------- */
.hero{position:relative;overflow:clip;height:100vh;height:100svh;min-height:600px;overflow:hidden;background:var(--ink)}
.hero__stage{position:absolute;inset:0}
.slide{position:absolute;inset:0;overflow:clip;visibility:hidden;display:flex;align-items:center}
.slide.is-active{visibility:visible}
.slide__bg{position:absolute;inset:-2%;background-size:cover;background-position:center}
.slide.is-active .slide__bg{animation:kenburns 9s ease-out forwards}
@keyframes kenburns{from{transform:scale(1) translate(0,0)}to{transform:scale(1.08) translate(-1.5%,0)}}
.slide::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(4,16,28,.94) 0%,rgba(4,16,28,.75) 38%,rgba(4,16,28,.15) 75%),
  linear-gradient(0deg,rgba(4,16,28,.9),transparent 30%);}
/* scanlines sutiles */
.hero::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)}
.slide__body{position:relative;z-index:2;width:100%}
.slide__body > *{max-width:660px}
.slide__kicker{display:inline-flex;align-items:center;gap:10px;font:500 15px var(--f-display);color:var(--cyan);margin-bottom:22px}
.slide__kicker::before{content:"";width:10px;height:10px;background:var(--cyan);box-shadow:14px 0 0 var(--pix-pink),28px 0 0 var(--pix-gold);margin-right:32px}
.slide__title{font-size:clamp(40px,6.4vw,84px);font-weight:700;line-height:1;margin-bottom:24px;text-wrap:balance}
.slide__text{font-size:clamp(16px,1.4vw,19px);color:#c4d6e1;max-width:540px;margin-bottom:34px;font-weight:300}
.slide__cta{display:flex;flex-wrap:wrap;gap:14px}
.slide .slide__kicker,.slide .slide__text,.slide .slide__cta{opacity:0;transform:translateY(14px)}
.slide.is-shown .slide__kicker,.slide.is-shown .slide__text,.slide.is-shown .slide__cta{opacity:1;transform:none;transition:opacity .6s,transform .6s}
.slide.is-shown .slide__text{transition-delay:.35s}.slide.is-shown .slide__cta{transition-delay:.5s}

/* Rejilla de píxeles para la transición */
.pixgrid{position:absolute;inset:0;z-index:4;display:grid;pointer-events:none}
.pixgrid i{display:block;background-size:var(--bw) var(--bh);background-position:var(--bx) var(--by);opacity:0;transform:scale(.2);will-change:transform,opacity}
.pixgrid.is-run i{animation:pixIn .55s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--d)}
.pixgrid i.is-tint{box-shadow:inset 0 0 0 999px var(--t)}
.pixgrid.is-run i.is-tint{animation:pixInTint .7s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--d)}
@keyframes pixIn{0%{opacity:0;transform:scale(.2)}60%{opacity:1}100%{opacity:1;transform:scale(1)}}
@keyframes pixInTint{0%{opacity:0;transform:scale(.2)}50%{opacity:1;box-shadow:inset 0 0 0 999px var(--t)}100%{opacity:1;transform:scale(1);box-shadow:inset 0 0 0 999px transparent}}

.hero__controls{position:absolute;left:0;right:0;bottom:34px;z-index:6;display:flex;align-items:center;justify-content:space-between}
.hero__dots{display:flex;gap:10px}
.hero__dots button{position:relative;width:56px;height:24px;border:0;background:none;cursor:pointer;padding:0}
.hero__dots button::before{content:"";position:absolute;left:0;right:0;top:11px;height:2px;background:rgba(232,243,248,.25)}
.hero__dots button::after{content:"";position:absolute;left:0;top:11px;height:2px;width:0;background:var(--cyan)}
.hero__dots button[aria-selected="true"]::after{animation:progress var(--dur,7000ms) linear forwards}
.hero.is-paused .hero__dots button[aria-selected="true"]::after{animation-play-state:paused}
@keyframes progress{to{width:100%}}
.hero__arrows{display:flex;gap:8px}
.arrow{width:48px;height:48px;border:1px solid rgba(232,243,248,.3);background:rgba(4,16,28,.4);cursor:pointer;display:grid;place-items:center;transition:border-color .2s,background .2s}
.arrow:hover{border-color:var(--cyan);background:rgba(95,242,255,.1)}
.arrow svg{width:20px;height:20px;fill:none;stroke:var(--paper);stroke-width:2}

/* ---------- Franja ---------- */
.facts{border-block:1px solid var(--line);background:var(--ink-2)}
.facts__in{display:grid;grid-template-columns:repeat(3,1fr)}
.facts p{margin:0;padding:26px 24px;color:var(--mist);font-size:15px;border-left:1px solid var(--line)}
.facts p:first-child{border-left:0;padding-left:0}
.facts strong{display:block;font:600 22px var(--f-display);color:var(--paper);margin-bottom:2px}

/* ---------- Secciones ---------- */
.section{padding:clamp(72px,10vw,130px) 0;background:var(--light-bg);color:var(--light-ink)}
.section--dark{background:var(--ink);color:var(--paper)}
.section--circuit{background:linear-gradient(rgba(4,16,28,.88),rgba(4,16,28,.94)),url(../assets/img/circuito.jpg) center/cover fixed;color:var(--paper)}
.head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:40px;align-items:end;margin-bottom:56px}
.h2{font-size:clamp(34px,4.6vw,58px);font-weight:700}
.lead{margin:0;font-size:18px;max-width:52ch;color:#4a6577}
.section--dark .lead,.section--circuit .lead{color:var(--mist)}

/* ---------- Servicios ---------- */
.services{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.svc{background:#fff;border:1px solid #d5e4ec;display:flex;flex-direction:column;
  clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.svc img{width:100%;aspect-ratio:4/3;object-fit:cover}
.svc__body{padding:22px 22px 26px}
.svc h3{font-size:21px;margin-bottom:8px;color:var(--light-ink)}
.svc p{font-size:15px;color:#4a6577;margin:0}
.svc--main{grid-column:span 4;flex-direction:row;background:var(--light-ink);border-color:var(--light-ink)}
.svc--main img{width:58%;aspect-ratio:auto;min-height:300px}
.svc--main .svc__body{padding:clamp(24px,4vw,48px);display:flex;flex-direction:column;justify-content:center}
.svc--main h3{color:#fff;font-size:clamp(26px,3vw,36px);margin-bottom:14px}
.svc--main p{color:#b9cdd9;font-size:16px}
.tags{list-style:none;padding:0;margin:22px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.tags li{font:500 13px var(--f-display);padding:6px 12px;border:1px solid rgba(95,242,255,.4);color:var(--cyan)}

/* ---------- Casos ---------- */
.case{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,90px);align-items:center;padding:40px 0}
.case + .case{margin-top:60px;border-top:1px solid var(--line);padding-top:100px}
.case--flip .case__visual{order:2}
.case__visual{position:relative;overflow:clip;display:grid;place-items:center;min-height:460px}
.glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;filter:blur(80px);opacity:.35;z-index:0}
.glow--blue{background:#2563eb}.glow--teal{background:var(--wit)}
.case__brand{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.case__brand img{height:44px;width:auto}
.case__brand h3{font-size:clamp(30px,3.4vw,42px)}
.case__what{font:500 16px var(--f-display);color:var(--cyan);margin-bottom:20px}
.case__info > p:not(.case__what){color:#b9cdd9}
.checks{list-style:none;padding:0;margin:26px 0 34px;display:grid;gap:12px}
.checks li{position:relative;padding-left:30px;color:var(--paper)}
.checks li::before{content:"";position:absolute;left:0;top:.45em;width:12px;height:12px;background:var(--cyan);clip-path:polygon(0 0,70% 0,100% 30%,100% 100%,0 100%)}
.badge-uis{font:700 18px var(--f-display);padding:10px 12px;background:#fff;color:#0b5c39;letter-spacing:.04em}

/* Teléfono MiTeamX */
.phone{position:relative;z-index:1;width:270px;height:550px;border-radius:42px;background:#0d0f14;padding:12px;box-shadow:0 0 0 2px #2a3646,0 40px 80px rgba(0,0,0,.6);transform:rotate(-4deg)}
.phone__notch{position:absolute;top:18px;left:50%;transform:translateX(-50%);width:90px;height:22px;border-radius:12px;background:#0d0f14;z-index:2}
.app{height:100%;overflow:hidden;font-family:var(--f-body)}
.app--mtx{background:#f5f7fb;border-radius:32px;padding:46px 18px 18px;color:#0f172a}
.app__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.app__logo{height:28px;width:auto}
.app__logotxt{font:700 18px var(--f-display);color:#2563eb}
.app__avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#60a5fa)}
.app__hello{font:600 17px var(--f-display);margin-bottom:12px}
.app__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
.app__stats div{background:#2563eb;color:#fff;border-radius:12px;padding:10px 6px;text-align:center}
.app__stats div:nth-child(2){background:#fff;color:#0f172a;box-shadow:0 2px 8px rgba(15,23,42,.08)}
.app__stats div:nth-child(3){background:#fff;color:#0f172a;box-shadow:0 2px 8px rgba(15,23,42,.08)}
.app__stats b{display:block;font-size:19px}
.app__stats small{font-size:10px;opacity:.8}
.app__label{font-size:12px;font-weight:600;color:#64748b;margin-bottom:8px}
.app__list{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:8px}
.app__list li{display:flex;align-items:center;gap:10px;background:#fff;border-radius:12px;padding:11px 12px;font-size:13px;font-weight:500;box-shadow:0 2px 8px rgba(15,23,42,.06)}
.app__list i{width:8px;height:28px;border-radius:4px;background:var(--c)}
.app__list span{margin-left:auto;color:#64748b;font-size:12px}
.app__btn{background:#2563eb;color:#fff;text-align:center;border-radius:12px;padding:12px;font-size:13px;font-weight:600}

/* Portátil SICUPS */
.laptop{position:relative;z-index:1;width:min(560px,100%)}
.laptop__screen{background:#0d0f14;border-radius:14px 14px 0 0;padding:12px;box-shadow:0 0 0 2px #2a3646}
.laptop__base{height:16px;background:linear-gradient(#3a4656,#1c2430);border-radius:0 0 18px 18px;margin:0 -6%;box-shadow:0 30px 60px rgba(0,0,0,.6)}
.browser{background:#fff;border-radius:6px;overflow:hidden}
.browser__bar{display:flex;align-items:center;gap:6px;background:#e9eef2;padding:8px 10px}
.browser__bar i{width:9px;height:9px;border-radius:50%;background:#f87171}
.browser__bar i:nth-child(2){background:#fbbf24}.browser__bar i:nth-child(3){background:#34d399}
.browser__bar span{margin-left:10px;font-size:10px;color:#64748b;background:#fff;padding:3px 10px;border-radius:4px;flex:1}
.app--sic{display:flex;height:290px;color:#0f2b3c}
.sic__side{width:30%;background:#0f3d55;color:#bfe3ee;padding:14px 12px;display:flex;flex-direction:column;gap:6px;font-size:11px}
.sic__side b{font:700 14px var(--f-display);color:#fff;margin-bottom:8px}
.sic__side span{padding:6px 8px;border-radius:4px}
.sic__side .on{background:rgba(95,242,255,.18);color:#fff}
.sic__main{flex:1;padding:14px;background:#f4f8fa}
.sic__h{font:600 12px var(--f-display);margin-bottom:10px}
.sic__kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.sic__kpis div{background:#fff;border-radius:6px;padding:8px;border-top:3px solid var(--wit)}
.sic__kpis div:nth-child(2){border-color:#22c55e}.sic__kpis div:nth-child(3){border-color:#f59e0b}
.sic__kpis b{display:block;font-size:16px}
.sic__kpis small{font-size:8.5px;color:#64748b}
.sic__chart{display:flex;align-items:flex-end;gap:6px;height:90px;background:#fff;border-radius:6px;padding:10px;margin-bottom:10px}
.sic__chart span{flex:1;height:var(--h);background:linear-gradient(var(--wit),#0f3d55);border-radius:3px 3px 0 0}
.sic__rows{display:grid;gap:5px}
.sic__rows i{height:9px;background:#dde7ed;border-radius:3px}
.sic__rows i:nth-child(2){width:80%}.sic__rows i:nth-child(3){width:60%}

/* ---------- Proceso ---------- */
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);counter-reset:s;position:relative}
.steps::before{content:"";position:absolute;left:0;right:0;top:27px;height:2px;background:linear-gradient(90deg,var(--wit),var(--pix-pink),var(--pix-gold))}
.steps li{position:relative;padding-right:28px}
.steps__n{position:relative;display:grid;place-items:center;width:56px;height:56px;margin-bottom:24px;background:var(--light-ink);color:var(--cyan);font:700 22px var(--f-display);
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.steps h3{font-size:22px;margin-bottom:8px}
.steps p{color:#4a6577;font-size:15px;margin:0}

/* ---------- Planes ---------- */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;padding:34px 30px;background:rgba(10,29,46,.75);border:1px solid var(--line);backdrop-filter:blur(6px);
  clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}
.plan h3{font-size:26px;margin-bottom:8px}
.plan__for{color:var(--mist);font-size:15px;margin-bottom:24px}
.plan ul{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:12px;flex:1}
.plan li{padding-left:24px;position:relative;font-size:15px}
.plan li::before{content:"";position:absolute;left:0;top:.6em;width:10px;height:2px;background:var(--cyan)}
.plan .btn{width:100%}
.plan--hot{border-color:var(--cyan);background:rgba(10,40,60,.88);box-shadow:inset 0 0 60px rgba(95,242,255,.08)}
.plan__flag{position:absolute;top:0;right:30px;background:var(--pix-gold);color:var(--ink);font:600 13px var(--f-display);padding:6px 12px;margin:0}
.plans__note{text-align:center;margin:40px 0 0;color:var(--mist)}
.plans__note a{color:var(--cyan)}

/* ---------- Clientes ---------- */
.marquee{overflow:hidden;padding:10px 0 70px;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex;gap:20px;width:max-content;animation:marquee 34s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(calc(-50% - 10px))}}
.logo-tile{width:240px;height:130px;flex:none;background:#fff;border:1px solid #d5e4ec;display:grid;place-items:center;padding:14px}
.logo-tile img{max-height:100px;width:auto;object-fit:contain}
.logo-tile--text{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px}
.logo-tile--text b{font:700 30px var(--f-display);color:var(--light-ink)}
.logo-tile--text small{font-size:13px;color:#4a6577}
.quote{margin:0 auto;max-width:860px;text-align:center}
.quote blockquote{margin:0 0 20px;font:500 clamp(20px,2.4vw,28px)/1.45 var(--f-display);color:var(--light-ink)}
.quote figcaption{color:#4a6577}

/* ---------- Contacto ---------- */
.contact{display:grid;grid-template-columns:5fr 6fr;gap:clamp(32px,6vw,90px);align-items:start}
.contact__info .lead{margin:20px 0 36px}
.contact__list{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:18px}
.contact__list li{display:flex;align-items:center;gap:14px;font-size:17px}
.contact__list a{text-decoration:none}
.contact__list a:hover{color:var(--cyan)}
.contact__list svg{width:22px;height:22px;flex:none;fill:none;stroke:var(--cyan);stroke-width:1.6;stroke-linejoin:round}
.contact__who{color:var(--mist);font-size:14px}
.form{background:var(--ink-2);border:1px solid var(--line);padding:clamp(24px,4vw,40px);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field label{font:500 14px var(--f-display);color:var(--mist)}
.field input,.field select,.field textarea{font:400 16px var(--f-body);color:var(--paper);background:var(--ink);border:1px solid var(--line);padding:13px 14px;border-radius:0;width:100%;transition:border-color .2s,box-shadow .2s}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--cyan) 50%),linear-gradient(135deg,var(--cyan) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(95,242,255,.15)}
.field [aria-invalid="true"]{border-color:var(--pix-pink)}
.form__err{color:var(--pix-pink);font-size:14px;min-height:1.2em;margin:0 0 10px}
.wa-ico{width:20px;height:20px;fill:currentColor}

/* ---------- Footer ---------- */
.footer{background:#020a12;border-top:1px solid var(--line);padding:60px 0 30px;color:var(--mist);font-size:15px}
.footer__in{display:grid;grid-template-columns:2fr 1fr 1.4fr;gap:40px;margin-bottom:40px}
.footer__in img{height:56px;width:auto;margin-bottom:14px}
.footer nav,.footer__contact{display:flex;flex-direction:column;gap:10px}
.footer a{text-decoration:none}.footer a:hover{color:var(--cyan)}
.footer__legal{border-top:1px solid var(--line);padding-top:24px;font-size:13px}

/* ---------- WhatsApp flotante ---------- */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;align-items:center;gap:12px;text-decoration:none}
.wa-float__btn{position:relative;width:62px;height:62px;border-radius:50%;background:var(--wa);display:grid;place-items:center;box-shadow:0 10px 30px rgba(37,211,102,.45);transition:transform .2s}
.wa-float__btn::before,.wa-float__btn::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--wa);animation:ring 2.4s ease-out infinite}
.wa-float__btn::after{animation-delay:1.2s}
@keyframes ring{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.7);opacity:0}}
.wa-float__btn svg{width:34px;height:34px;fill:#fff}
.wa-float:hover .wa-float__btn{transform:scale(1.08)}
.wa-float__tip{background:#fff;color:#0b2233;font:600 14px var(--f-display);padding:10px 14px;box-shadow:0 8px 24px rgba(0,0,0,.25);opacity:0;transform:translateX(10px);transition:opacity .25s,transform .25s;pointer-events:none;white-space:nowrap}
.wa-float:hover .wa-float__tip,.wa-float:focus-visible .wa-float__tip,.wa-float.is-hint .wa-float__tip{opacity:1;transform:none}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .services{grid-template-columns:repeat(2,1fr)}
  .svc--main{grid-column:span 2}
  .plans{grid-template-columns:1fr;max-width:560px;margin-inline:auto}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:40px}
  .steps::before{display:none}
}
@media (max-width:860px){
  .nav__toggle{display:block}
  .nav__links{position:fixed;top:76px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:rgba(4,16,28,.98);border-bottom:1px solid var(--line);padding:10px var(--gut) 24px;transform:translateY(-120%);transition:transform .3s;visibility:hidden}
  .nav__links.is-open{transform:none;visibility:visible}
  .nav__links a:not(.btn){padding:14px 0;border-bottom:1px solid var(--line);font-size:17px}
  .nav__links .btn{margin-top:18px}
  .nav{background:rgba(4,16,28,.86);backdrop-filter:blur(12px)}
  .head{grid-template-columns:1fr;gap:16px;margin-bottom:40px}
  .case,.contact{grid-template-columns:1fr}
  .case--flip .case__visual{order:0}
  .case__visual{min-height:0;padding:20px 0}
  .laptop{width:92%}
  .facts__in{grid-template-columns:1fr}
  .facts p{border-left:0;border-top:1px solid var(--line);padding:18px 0}
  .facts p:first-child{border-top:0}
  .svc--main{flex-direction:column}
  .svc--main img{width:100%;min-height:0;aspect-ratio:16/9}
  .footer__in{grid-template-columns:1fr}
  .section--circuit{background-attachment:scroll}
  .slide::after{background:linear-gradient(0deg,rgba(4,16,28,.96) 10%,rgba(4,16,28,.7) 60%,rgba(4,16,28,.45))}
  .slide{align-items:flex-end;padding-bottom:120px}
}
@media (max-width:560px){
  .services{grid-template-columns:1fr}
  .svc--main{grid-column:auto}
  .steps{grid-template-columns:1fr}
  .field-row{grid-template-columns:1fr}
  .phone{width:240px;height:490px}
  .app--sic{height:240px}
  .sic__side{width:28%;font-size:9px}
  .hero__arrows{display:none}
  .wa-float{right:16px;bottom:16px}
  .wa-float__tip{display:none}
  .slide__kicker::before{margin-right:30px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .marquee__track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}
}
