/* Declia · sitio. Bandas a todo lo ancho (grafito / hueso / lima), tipografía grande y tarjetas apiladas al hacer scroll. */
:root{
 --grafito:#141613; --grafito-2:#1F221E; --grafito-3:#2A2E28; --linea-osc:#33362F;
 --hueso:#EDEAE3; --hueso-2:#E4E0D7; --blanco:#FFFFFF; --linea:#D9D5CB;
 --lima:#C6F36B; --acero:#5E626A; --niebla:#B9BCC2; --texto:#3A3D43; --alerta:#F2B84B; --marca:#FFE58A;
 --display:"Unbounded","Arial Black",Arial,sans-serif;
 --sans:"Inter",Arial,Helvetica,sans-serif;
 --r-md:14px; --r-lg:24px; --r-xl:36px;
 --ease:cubic-bezier(.2,.7,.2,1);
 color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--hueso);color:var(--grafito);font-family:var(--sans);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:clip}
.wrap{max-width:1200px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:var(--display);text-wrap:balance}
a{color:inherit}
:focus-visible{outline:3px solid var(--lima);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:60;background:var(--lima);color:var(--grafito);padding:8px 12px}
mark.ph{background:var(--marca);color:var(--grafito);padding:0 .25em;border-radius:3px}

/* Escala tipográfica */
.h-hero{font-weight:900;font-size:clamp(44px,7.4vw,104px);line-height:.98;letter-spacing:-.02em}
.h-hero.sm{font-size:clamp(38px,5.6vw,76px)}
.h-xl{font-weight:900;font-size:clamp(30px,4.4vw,56px);line-height:1.04;letter-spacing:-.015em}
.h-lg{font-weight:900;font-size:clamp(28px,3.4vw,44px);line-height:1.05}
.h-md{font-weight:500;font-size:clamp(19px,1.7vw,22px);line-height:1.25}
.eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--acero)}
.dark .eyebrow{color:var(--lima)}
.lead{font-size:clamp(17px,1.5vw,20px);line-height:1.55;max-width:56ch}
.dark .lead{color:var(--niebla)}
.ia{color:var(--lima);font-style:normal}
.rombo{width:.6em;height:.6em;flex:none;fill:var(--lima)}

/* Botones y enlaces */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none;border:0;cursor:pointer;transition:transform .2s var(--ease),background .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px)}
.btn .wa{width:20px;height:20px;fill:currentColor}
.btn-lima{background:var(--lima);color:var(--grafito)}
.btn-lima:hover{box-shadow:0 10px 30px rgba(198,243,107,.25)}
.btn-ghost{border:1.5px solid var(--linea-osc);color:var(--hueso)}
.btn-ghost:hover{border-color:var(--niebla)}
.btn-sm{min-height:44px;padding:0 20px;font-size:15px}
.btn-block{width:100%}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:700;text-decoration:none}
.link .arr,.other .arr{width:18px;height:18px;transition:transform .2s var(--ease)}
.link:hover .arr,.other:hover .arr{transform:translateX(4px)}

/* Encabezado */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--grafito)}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:rgba(20,22,19,.9);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);color:var(--hueso);border-bottom:1px solid transparent;transition:border-color .3s}
.top.scrolled{border-bottom-color:var(--linea-osc)}
.top-in{display:flex;align-items:center;gap:28px;height:74px}
.brand{display:flex}
.logo{height:26px;width:auto}
.nav{display:flex;align-items:center;gap:6px;margin-left:auto}
.nav>a,.dd-btn{color:var(--niebla);text-decoration:none;font:500 15px var(--sans);padding:10px 12px;border-radius:10px;background:none;border:0;cursor:pointer}
.nav>a:hover,.dd-btn:hover,.dd-btn[aria-expanded=true]{color:var(--hueso);background:var(--grafito-2)}
.dd{position:relative}
.dd-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:240px;background:var(--grafito-2);border:1px solid var(--linea-osc);border-radius:var(--r-md);padding:8px;display:grid;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.2s var(--ease)}
.dd:hover .dd-menu,.dd.open .dd-menu{opacity:1;visibility:visible;transform:none}
.dd-menu a{padding:10px 12px;border-radius:10px;text-decoration:none;font-size:15px;color:var(--hueso)}
.dd-menu a:hover,.dd-menu a[aria-current]{background:var(--grafito-3)}
.burger{display:none;margin-left:auto;width:44px;height:44px;border-radius:12px;background:var(--grafito-2);border:0;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:6px}
.burger span{width:18px;height:2px;background:var(--hueso);transition:.25s var(--ease)}
.burger[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}
.mnav{border-top:1px solid var(--linea-osc);max-height:calc(100vh - 74px);overflow:auto}
.mnav-in{display:grid;padding-block:16px 28px}
.mnav-in .eyebrow{margin-top:14px;margin-bottom:4px;color:var(--lima)}
.mnav-in a{padding:10px 0;text-decoration:none;font-size:18px;border-bottom:1px solid var(--linea-osc)}

/* Bandas */
.band{padding-block:clamp(72px,10vw,140px)}
.dark{background:var(--grafito);color:var(--hueso)}
.light{background:var(--hueso)}
.light.alt{background:var(--hueso-2)}
.sec-head{display:grid;gap:16px;max-width:820px;margin-bottom:clamp(40px,6vw,72px)}

/* Hero */
.hero{padding-block:clamp(48px,7vw,96px) clamp(72px,9vw,128px);overflow:hidden}
.hero-in,.svc-hero-in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:center}
.hero-copy{display:grid;gap:26px;min-width:0}
.h-hero .ln{display:block;overflow:hidden;padding-bottom:.06em}
.h-hero .ln>span{display:inline-block;animation:rise 1s var(--ease) both}
.h-hero .ln:nth-child(2)>span{animation-delay:.12s}
@keyframes rise{from{transform:translateY(60%);opacity:.15}to{transform:none;opacity:1}}
.hero-copy .lead,.hero-copy .ctas,.crumbs{animation:fade .9s .3s var(--ease) both}
@keyframes fade{from{transform:translateY(16px);opacity:.3}to{transform:none;opacity:1}}

/* Teléfono */
.phone-wrap{position:relative;display:grid;justify-items:center;min-width:0}
.phone{width:min(360px,100%);background:var(--hueso);color:var(--grafito);border-radius:42px;padding:12px;border:8px solid #2b2f29;box-shadow:0 40px 90px rgba(0,0,0,.5),0 0 0 1px #3c4038;animation:float-in 1.1s .2s var(--ease) both;will-change:transform}
@keyframes float-in{from{transform:translateY(40px) rotate(-3deg);opacity:.3}to{transform:none;opacity:1}}
.phone-top{display:flex;align-items:center;gap:10px;padding:10px 10px 14px;border-bottom:1px solid var(--linea)}
.phone-top .av{width:36px;height:36px;border-radius:50%;background:var(--grafito);color:var(--hueso);display:grid;place-items:center;font:900 14px var(--display)}
.phone-top b{display:block;font-size:14px}.phone-top small{color:#2E8B57;font-size:12px}
.phone-top .tag{margin-left:auto}
.tag{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border:1px solid currentColor;border-radius:999px;padding:3px 8px;opacity:.6}
.chat{display:grid;gap:8px;padding:14px 4px 6px;font-size:14px;line-height:1.4}
.msg{max-width:84%;padding:10px 13px;border-radius:18px;animation:pop .5s var(--ease) both}
.msg:nth-child(1){animation-delay:.6s}.msg:nth-child(2){animation-delay:1s}.msg:nth-child(3){animation-delay:1.4s}.msg:nth-child(4){animation-delay:1.8s}.msg:nth-child(5){animation-delay:2.2s}
@keyframes pop{from{transform:translateY(10px) scale(.96);opacity:.25}to{transform:none;opacity:1}}
.msg.me{justify-self:end;background:var(--grafito);color:var(--hueso);border-bottom-right-radius:6px}
.msg.them{justify-self:start;background:var(--blanco);border-bottom-left-radius:6px}
.msg.card{display:grid;gap:6px;min-width:76%}
.msg.card .lbl{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--acero)}
.msg.card .row{display:flex;justify-content:space-between;font-variant-numeric:tabular-nums}
.msg.card .row.ok{color:#2E7A3A;font-weight:700;font-size:13px}
.msg .lima{background:var(--lima);padding:0 7px;border-radius:6px}
.float-card{position:absolute;left:-8%;top:26%;display:flex;align-items:center;gap:10px;background:var(--grafito-2);border:1px solid var(--linea-osc);color:var(--hueso);padding:12px 16px;border-radius:999px;font-size:14px;font-weight:500;box-shadow:0 20px 40px rgba(0,0,0,.35);animation:float-in 1s 1s var(--ease) both}
.float-card .rombo{width:12px;height:12px}

/* Banda lima con marquesina */
.lima-band{background:var(--lima);color:var(--grafito);padding-block:44px;overflow:hidden}
.marq-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;margin-bottom:24px}
.marq-head .h-md{font-weight:900}
.marquee{display:flex;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marq-track{list-style:none;margin:0;padding:0 14px 0 0;display:flex;gap:14px;flex:none;animation:marq 40s linear infinite}
.marq-track li{display:flex;align-items:center;gap:10px;white-space:nowrap;font:500 clamp(18px,2vw,24px) var(--display);background:rgba(20,22,19,.07);padding:12px 22px;border-radius:999px}
.marq-track .rombo{fill:var(--grafito)}
.marquee:hover .marq-track{animation-play-state:paused}
@keyframes marq{to{transform:translateX(-100%)}}

/* Tarjetas apiladas */
.stack{display:grid;gap:28px}
.stack-card{position:sticky;top:calc(100px + var(--i) * 16px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;min-height:440px;padding:clamp(28px,4vw,56px);border-radius:var(--r-xl);transform-origin:50% 0;will-change:transform;box-shadow:0 -10px 40px rgba(20,22,19,.08)}
.stack-card.c0{background:var(--grafito);color:var(--hueso)}
.stack-card.c1{background:var(--blanco);color:var(--grafito)}
.stack-card.c0 .eyebrow{color:var(--lima)}
.stack-copy{display:grid;gap:18px;justify-items:start;min-width:0}
.stack-copy p:not(.eyebrow){font-size:18px;max-width:42ch}
.stack-card.c0 .stack-copy p:not(.eyebrow){color:var(--niebla)}
.stack-card.c0 .link{color:var(--lima)}
.stack-vis{display:grid;justify-items:center;min-width:0}

/* Mini interfaces */
.ui{width:min(420px,100%);border-radius:var(--r-lg);padding:22px;display:grid;gap:14px;font-size:14.5px}
.ui-dark{background:var(--grafito-2);color:var(--hueso);border:1px solid var(--linea-osc)}
.ui-light{background:var(--hueso);color:var(--grafito);border:1px solid var(--linea)}
.stack-card.c1 .ui-dark,.svc-vis .ui-dark{box-shadow:0 30px 60px rgba(20,22,19,.25)}
.stack-card.c0 .ui-light{box-shadow:0 30px 60px rgba(0,0,0,.4)}
.ui-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.ui-top{font-size:13px;opacity:.85}
.pill{font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--grafito-3);color:var(--hueso)}
.ui-light .pill{background:var(--hueso-2);color:var(--grafito)}
.pill.ok{background:var(--lima);color:var(--grafito)}
.ui-big{font:900 clamp(30px,3vw,40px)/1.05 var(--display)}
.ui-sub{color:var(--niebla);font-size:13.5px;margin-top:-8px}
.ui-bars{display:grid;gap:10px}
.ui-bars div{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:12px;font-variant-numeric:tabular-nums}
.ui-bars i{height:10px;border-radius:99px;background:var(--grafito-3);position:relative;overflow:hidden}
.ui-bars i::after{content:"";position:absolute;inset:0;width:var(--w);background:var(--lima);border-radius:99px;transform-origin:left;animation:grow 1.2s var(--ease) both}
@keyframes grow{from{transform:scaleX(.15)}to{transform:none}}
.ui-chart{display:flex;align-items:flex-end;gap:10px;height:150px;padding-top:10px}
.ui-chart i{flex:1;height:var(--h);background:var(--grafito);border-radius:8px 8px 4px 4px;transform-origin:bottom;animation:growy 1.1s var(--ease) both}
.ui-chart i:last-child{background:var(--lima)}
@keyframes growy{from{transform:scaleY(.2)}to{transform:none}}
.ui-foot{border-top:1px solid var(--linea);padding-top:12px;font-size:13.5px}
.ui-list,.ui-check{list-style:none;margin:0;padding:0;display:grid}
.ui-list li{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--linea-osc);font-variant-numeric:tabular-nums}
.ui-list li:last-child{border:0}
.ui-list b{font-weight:500}
.ui-dl{margin:0;display:grid}
.ui-dl div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--linea)}
.ui-dl div:last-child{border:0;font-weight:700}
.ui-dl dt{color:var(--acero)}.ui-dl dd{margin:0;text-align:right}
.ui-check li{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--linea-osc)}
.ui-check li:last-child{border:0}
.ui-check li::before{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--grafito)}
.ui-check .g::before{content:"✓";background:var(--lima)}
.ui-check .w::before{content:"!";background:var(--alerta)}

/* Cómo trabajamos */
.how{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.how-head{position:sticky;top:120px;display:grid;gap:20px}
.steps{list-style:none;margin:0;padding:0 0 0 0;display:grid;gap:22px;position:relative}
.steps::before{content:"";position:absolute;left:27px;top:28px;bottom:28px;width:2px;background:var(--linea-osc)}
.steps::after{content:"";position:absolute;left:27px;top:28px;width:2px;height:var(--prog,0px);max-height:calc(100% - 56px);background:var(--lima);transition:height .15s linear}
.step{display:grid;grid-template-columns:56px minmax(0,1fr);gap:24px;align-items:start;background:var(--grafito-2);border:1px solid var(--linea-osc);border-radius:var(--r-lg);padding:28px 28px 28px 0;margin-left:0;position:relative;z-index:1;background-clip:padding-box;transition:border-color .4s,background .4s}
.step{padding-left:0;background:transparent;border:0}
.step>div{background:var(--grafito-2);border:1px solid var(--linea-osc);border-radius:var(--r-lg);padding:28px;display:grid;gap:12px;transition:border-color .4s var(--ease),transform .4s var(--ease)}
.step.on>div{border-color:var(--lima)}
.step p{color:var(--niebla)}
.step .when{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lima)}
.n{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font:900 18px var(--display);background:var(--grafito-3);color:var(--hueso);transition:background .4s,color .4s}
.step.on .n,.layer .n{background:var(--lima);color:var(--grafito)}

/* Persona */
.person{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:end}
.person>div:first-child{display:grid;gap:22px}
.person-copy{display:grid;gap:18px}
.person-copy p{color:var(--texto);font-size:18px;max-width:52ch}
.vs{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.vs li{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;font-size:15px;font-weight:500}
.vs .no{border:1px solid var(--linea);color:var(--acero);text-decoration:line-through;text-decoration-color:rgba(94,98,106,.6)}
.vs .yes{background:var(--grafito);color:var(--hueso);font-weight:700}
.vs .yes span{color:var(--lima)}

/* Calendario */
.cal{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.cal>div:first-child{display:grid;gap:20px}
.cal-ui{display:grid;gap:14px}
.seg{display:inline-flex;justify-self:start;background:var(--blanco);border-radius:999px;padding:5px;gap:4px}
.seg button{font:700 14px var(--sans);border:0;background:none;padding:10px 18px;border-radius:999px;cursor:pointer;color:var(--acero)}
.seg button[aria-checked=true]{background:var(--grafito);color:var(--hueso)}
.cal-card{display:grid;gap:6px;background:var(--blanco);border-radius:var(--r-lg);padding:24px 28px}
.cal-card.main{background:var(--grafito);color:var(--hueso)}
.cal-card .lbl{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--acero)}
.cal-card.main .lbl{color:var(--lima)}
.cal-card .big{font:900 clamp(40px,5vw,64px)/1 var(--display);font-variant-numeric:tabular-nums}
.cal-card .mid{font:900 clamp(24px,2.6vw,32px)/1.1 var(--display)}
.cal-card .sub{font-size:15px;color:var(--acero)}
.cal-card.main .sub{color:var(--niebla)}
.cal-note{font-size:13.5px;color:var(--acero)}

/* Preguntas */
.faq-wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:start}
.faq-wrap>div:first-child{display:grid;gap:16px;position:sticky;top:120px}
.faq{display:grid;gap:10px}
.faq details{background:var(--blanco);border-radius:var(--r-md);transition:background .2s}
.faq summary{cursor:pointer;list-style:none;padding:22px 64px 22px 24px;font-weight:700;font-size:17px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:22px;top:50%;width:28px;height:28px;margin-top:-14px;border-radius:50%;background:var(--hueso-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 5v10M5 10h10' stroke='%23141613' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg);background-color:var(--lima)}
.faq details p{padding:0 24px 24px;color:var(--texto);max-width:64ch}

/* Contacto */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.contact-copy{display:grid;gap:22px}
.contact-alt{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px;color:var(--niebla)}
.contact-alt b{color:var(--hueso);font-weight:500;margin-left:6px}
.c-form{background:var(--grafito-2);border:1px solid var(--linea-osc);border-radius:var(--r-xl);padding:clamp(22px,3vw,36px);display:grid;gap:16px}
.field{display:grid;gap:6px}
.field label{font-size:13px;font-weight:700;color:var(--niebla)}
.field input,.field select,.field textarea{font:16px var(--sans);color:var(--hueso);background:var(--grafito);border:1px solid var(--linea-osc);border-radius:12px;padding:13px 14px;width:100%;resize:vertical}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 8l5 5 5-5' fill='none' stroke='%23B9BCC2' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:40px}
.field input::placeholder,.field textarea::placeholder{color:#7d8188}
.field :focus{outline:2px solid var(--lima);outline-offset:1px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--niebla);cursor:pointer}
.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--lima);flex:none}
.check a{color:var(--hueso)}
.btn .arr{width:18px;height:18px}
button.btn[disabled]{opacity:.6;cursor:progress;transform:none}
.form-status{font-size:14.5px;min-height:1.4em;text-align:center;color:var(--niebla)}
.form-status.ok{color:var(--lima);font-weight:700}
.form-status.err{color:#FF9C8A}
.field input:user-invalid{border-color:#FF9C8A}
.c-form.sent .field,.c-form.sent .f2,.c-form.sent .check,.c-form.sent #f-send{display:none}
.c-form.sent .form-status{font-size:18px;padding-block:40px}

/* Páginas de servicio */
.svc-hero{padding-block:clamp(40px,6vw,80px) clamp(72px,9vw,120px)}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--niebla)}
.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--hueso)}
.svc-vis{display:grid;justify-items:center;animation:float-in 1.1s .2s var(--ease) both;min-width:0}
.svc-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.svc-grid>div:first-child{display:grid;gap:16px}
.incl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.incl li{display:flex;gap:14px;align-items:flex-start;background:var(--blanco);border-radius:var(--r-md);padding:20px;font-weight:500;min-width:0}
.incl .rombo{fill:var(--grafito);margin-top:.45em}
.layers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.layer{background:var(--grafito-2);border:1px solid var(--linea-osc);border-radius:var(--r-lg);padding:28px;display:grid;gap:14px;align-content:start;min-width:0}
.layer p{color:var(--niebla)}
.others{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px}
.other{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--blanco);border-radius:var(--r-md);padding:22px;text-decoration:none;font:500 17px var(--display);transition:transform .2s var(--ease)}
.other:hover{transform:translateY(-3px)}

/* Pie */
.foot{background:var(--grafito);color:var(--niebla);border-top:1px solid var(--linea-osc);padding-block:64px calc(40px + env(safe-area-inset-bottom,0px))}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
.foot-brand{display:grid;gap:14px;align-content:start}
.logo-sm{height:20px;width:auto}
.foot-h{color:var(--hueso);font-weight:700;margin-bottom:12px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:15px}
.foot a{text-decoration:none}.foot a:hover{color:var(--hueso)}
.foot-small{margin-top:48px;padding-top:24px;border-top:1px solid var(--linea-osc);font-size:14px}

/* Botón flotante */
.float{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:25;width:60px;height:60px;border-radius:50%;background:var(--lima);display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.3);transform:scale(.6);opacity:0;pointer-events:none;transition:.3s var(--ease)}
.float.show{transform:none;opacity:1;pointer-events:auto}
.float .wa{width:28px;height:28px;fill:var(--grafito)}

/* Aparición al hacer scroll: el contenido siempre es visible; solo se desplaza un poco */
.js .rv{transform:translateY(36px);transition:transform .9s var(--ease)}
.js .rv.in{transform:none}

@media (max-width:980px){
 .nav,.hide-m{display:none}
 .burger{display:flex}
 .hero-in,.svc-hero-in,.how,.person,.cal,.faq-wrap,.contact,.svc-grid{grid-template-columns:minmax(0,1fr);gap:48px}
 .how-head,.faq-wrap>div:first-child{position:static}
 .stack-card{grid-template-columns:minmax(0,1fr);min-height:0;gap:28px;top:calc(88px + var(--i) * 10px)}
 .float-card{left:0}
 .layers{grid-template-columns:minmax(0,1fr)}
 .others{grid-template-columns:repeat(2,minmax(0,1fr))}
 .foot-grid{grid-template-columns:1fr 1fr}
 .foot-brand{grid-column:1/-1}
}
@media (max-width:600px){
 body{font-size:16px}
 .incl,.others,.f2{grid-template-columns:minmax(0,1fr)}
 .ctas .btn{width:100%}
 .steps::before,.steps::after{left:21px}
 .step{grid-template-columns:44px minmax(0,1fr);gap:14px}
 .n{width:44px;height:44px;border-radius:13px;font-size:15px}
 .step>div{padding:22px}
 .stack-vis .ui{padding:18px}
 .foot-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .js .rv{transform:none}
 .marq-track{animation:none}
}