:root{--border-color:rgba(255,255,255,.55);}
/* Plixail México — shared design system for all service pages.
   Same DNA everywhere (type scale, spacing, galaxy, nav, footer, section
   lines); pages vary by composing different layout modules below. */
@font-face{font-family:"Kallisto";src:url("/fonts/Kallisto-Light.otf") format("opentype");font-weight:300;font-display:swap;}
@font-face{font-family:"Kallisto";src:url("/fonts/Kallisto-Medium.otf") format("opentype");font-weight:500;font-display:swap;}
@font-face{font-family:"Kallisto";src:url("/fonts/Kallisto-Bold.otf") format("opentype");font-weight:700;font-display:swap;}
@font-face{font-family:"Kallisto";src:url("/fonts/Kallisto-Heavy.otf") format("opentype");font-weight:900;font-display:swap;}
@font-face{font-family:"Kallisto Heading";src:url("/fonts/Kallisto-Bold.otf") format("opentype");font-weight:700;font-display:swap;}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{font-size:clamp(1rem,1vw,100rem);overflow-x:clip;touch-action:pan-y;background:#000;scroll-behavior:smooth;}
body{background:#000;color:#fff;font-family:"Kallisto",sans-serif;overflow-x:clip;min-height:100vh;position:relative;-webkit-font-smoothing:antialiased;}
a{color:inherit;}
.galaxy{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.glow{position:absolute;border-radius:50%;mix-blend-mode:screen;}
.glow-a{width:58rem;height:58rem; background:radial-gradient(circle, rgba(255,255,255,.92) 0%, rgba(255,230,230,.78) 3%, rgba(255,60,60,.58) 8%, rgba(210,15,15,.38) 22%, rgba(150,5,5,.15) 44%, transparent 66% ); top:-20rem;right:-16rem;left:auto; filter:blur(5.5rem);animation:sgDriftA 19s ease-in-out infinite,sgBreathe 8s ease-in-out infinite;}
.glow-b{width:44rem;height:44rem; background:radial-gradient(circle, rgba(255,255,255,.85) 0%, rgba(255,210,210,.68) 4%, rgba(230,25,25,.50) 10%, rgba(185,10,10,.28) 26%, rgba(120,4,4,.10) 50%, transparent 68% ); bottom:-10rem;left:-14rem;right:auto; filter:blur(7rem);animation:sgDriftB 16s ease-in-out infinite,sgBreathe 11s ease-in-out infinite 2s;}
.glow-c{width:28rem;height:28rem; background:radial-gradient(circle, rgba(255,255,255,.88) 0%, rgba(255,190,190,.72) 5%, rgba(220,20,20,.48) 13%, rgba(160,8,8,.22) 32%, rgba(100,3,3,.07) 55%, transparent 70% ); top:38%;left:18%; filter:blur(4rem);animation:sgDriftC 14s ease-in-out infinite,sgBreathe 9s ease-in-out infinite 5s;}
/* NAV */
.nav.scrolled{background:rgba(0,0,0,.92);backdrop-filter:blur(1.25rem);}
.nav{position:fixed;top:0;left:0;right:0;z-index:200;height:4.25rem;padding:0 2.6rem;clip-path:polygon(0 0,100% 0,100% calc(100% - 1.95rem),calc(100% - 1.95rem) 100%,0 100%);}
.nav-row{height:100%;display:flex;align-items:center;justify-content:space-between;}
.nav-logo{display:flex;align-items:center;height:1.875rem;text-decoration:none;}
.nav-logo svg{height:100%;width:auto;display:block;}
.nav-logo svg path{fill:#fff;}
.menu-btn{background:none;border:none;font-family:"Kallisto",sans-serif;font-size:.9rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:#fff;cursor:pointer;display:flex;align-items:center;gap:.95rem;padding:0;line-height:1;transition:color .35s ease;}
.hamburger{width:1rem;height:.4375rem;display:block;flex-shrink:0;}
.hamburger svg{width:100%;height:100%;display:block;fill:currentColor;transform-origin:center;transition:transform .35s ease;}
.menu-btn:hover .hamburger svg{transform:scale(.6745,1);}
.menu-overlay{position:fixed;inset:0;z-index:400;background:#000;display:flex;align-items:center;justify-content:center;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s ease;cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 34 34'><line x1='9' y1='9' x2='25' y2='25' stroke='white' stroke-width='2' stroke-linecap='round'/><line x1='25' y1='9' x2='9' y2='25' stroke='white' stroke-width='2' stroke-linecap='round'/></svg>") 17 17,pointer;}
.menu-overlay.open{opacity:1;visibility:visible;}
.menu-nav{display:flex;flex-direction:column;align-items:center;gap:1rem;cursor:default;padding:2rem 1rem;}
.menu-link{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:1.9rem;line-height:1.3;letter-spacing:.02em;text-transform:uppercase;color:#fff;text-decoration:none;cursor:pointer;transition:color .3s ease,opacity .3s ease;opacity:.55;}
.menu-link:hover,.menu-link.is-active{color:rgb(220,30,30);opacity:1;}
.menu-sub{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.32);margin-top:1.4rem;margin-bottom:.2rem;}
@media(max-width:60rem){.menu-link{font-size:1.4rem;}}
.nav-bottom{position:absolute;left:0;bottom:0;width:100%;height:2rem;--cut-size:1.5rem;--border-width:.0625rem;--border-color:rgba(255,255,255,.55);-webkit-mask-image:linear-gradient(135deg,black calc(100% - var(--cut-size)),transparent calc(100% - var(--cut-size)));mask-image:linear-gradient(135deg,black calc(100% - var(--cut-size)),transparent calc(100% - var(--cut-size)));border-bottom:var(--border-width) solid var(--border-color);background-image:linear-gradient(135deg,transparent calc(100% - var(--cut-size)),var(--border-color) calc(100% - var(--cut-size)),var(--border-color) calc(100% - var(--cut-size) + var(--border-width)),transparent calc(100% - var(--cut-size) + var(--border-width)));background-position:bottom right;background-repeat:no-repeat;background-size:100% 100%;pointer-events:none;}
/* BUTTONS */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.7rem;height:3.25rem;padding:0 2rem;background:transparent;border:.0625rem solid #fff;color:#fff;font-family:"Kallisto Heading","Kallisto",sans-serif;font-size:.9rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;cursor:pointer;overflow:hidden;transition:border-color .4s ease;}
.btn-inner{display:inline-flex;align-items:center;gap:.6rem;will-change:transform,opacity;}
.btn .arrow{width:1.05rem;height:1.05rem;display:inline-flex;align-items:center;justify-content:center;}
.btn .arrow svg{width:100%;height:100%;display:block;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.btn-blur{filter:blur(.25rem);transition:filter .8s ease,border-color .4s ease;}
.btn-blur:hover{filter:blur(0);}
/* SECTION LABEL (angular lines) */
.heading-border-wrapper{position:relative;height:3.75rem;overflow:visible;z-index:10;margin-bottom:.5rem;}
.heading-content{display:flex;align-items:flex-start;gap:1.5rem;position:absolute;top:1.5rem;left:0;z-index:2;}
.heading-dot{width:.625rem;height:.625rem;flex-shrink:0;border-radius:50%;background:#fff;margin-top:.3125rem;}
.heading-text{font-size:.875rem;font-family:"Kallisto",sans-serif;text-transform:uppercase;line-height:1.5em;color:#fff;font-weight:400;max-width:14rem;letter-spacing:.02em;}
.border-lines{position:absolute;left:0;right:0;top:0;height:3.75rem;pointer-events:none;}
.line-left{position:absolute;top:0;left:0;width:12rem;border-top:.0625rem solid #ffffff;}
.line-diagonal{position:absolute;top:0;left:12rem;width:5.75rem;border-top:.0625rem solid #ffffff;transform-origin:top left;transform:rotate(40deg);}
.line-right{position:absolute;bottom:0;left:16.375rem;right:0;border-bottom:.0625rem solid #ffffff;}
/* type scale + wrappers */
.stage{min-height:100vh;padding-top:4.25rem;position:relative;z-index:1;}
.stage::after{content:'';position:absolute;left:0;right:0;bottom:0;height:18rem;background:linear-gradient(to bottom,transparent 0%,#000 100%);pointer-events:none;z-index:10;}
.wrap{padding-left:2.6rem;padding-right:2.6rem;}
.eyebrow{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.8rem;letter-spacing:.3em;text-transform:uppercase;color:rgb(220,30,30);}
.h-xl{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:clamp(2.6rem,6vw,4.7rem);line-height:1.02;letter-spacing:.01em;text-transform:uppercase;}
.h-lg{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:clamp(2rem,4vw,3rem);line-height:1.08;text-transform:uppercase;}
.h-md{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:1.35rem;line-height:1.15;text-transform:uppercase;}
.lead{font-family:"Kallisto",sans-serif;font-weight:500;font-size:1.2rem;line-height:1.55;color:rgba(255,255,255,.72);}
.muted{color:rgba(255,255,255,.6);font-weight:500;line-height:1.5;}
.accent-red{color:rgb(220,30,30);}
/* HERO (centered variant + left variant) */
.svc-hero{position:relative;z-index:1;min-height:calc(92vh - 4.25rem);display:flex;flex-direction:column;justify-content:center;padding-top:5rem;padding-bottom:4rem;}
.svc-hero .eyebrow{margin-bottom:1.7rem;}
.svc-hero h1{margin-bottom:1.9rem;}
.svc-hero .lead{max-width:42rem;margin-bottom:2.7rem;font-size:1.3rem;color:rgba(255,255,255,.92);}
.svc-hero-ctas{display:flex;gap:1.1rem;flex-wrap:wrap;}
.svc-hero.center{text-align:center;align-items:center;}
.svc-hero.center .lead{margin-left:auto;margin-right:auto;}
.svc-hero.center .svc-hero-ctas{justify-content:center;}
/* generic section */
.section{position:relative;z-index:2;background:#000;padding-top:5.5rem;padding-bottom:5.5rem;}
.section-head{max-width:46rem;margin-bottom:3.4rem;}
.section-head .h-lg{margin-bottom:1.2rem;}
/* MODULE: feature cards */
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:1.25rem;}
.card{position:relative;border:.0625rem solid rgba(255,255,255,.16);background:rgba(255,255,255,.02);padding:2.2rem 2rem;overflow:hidden;transition:border-color .4s ease,background .4s ease,transform .4s ease;}
.card:hover{border-color:rgba(255,60,60,.55);background:rgba(255,60,60,.04);transform:translateY(-.25rem);}
.card-num{font-family:"Kallisto",sans-serif;font-weight:700;font-size:.8rem;letter-spacing:.2em;color:rgb(220,30,30);margin-bottom:1.1rem;}
.card .h-md{margin-bottom:.8rem;}
.card p{font-family:"Kallisto",sans-serif;font-weight:500;font-size:1rem;line-height:1.5;color:rgba(255,255,255,.66);}
/* MODULE: split (text + panel) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center;}
.split.rev .split-text{order:2;}
/* (old .split-panel removed — superseded by the slanted panel below) */
.split-text p{margin-top:1.2rem;}
@media(max-width:60rem){.split{grid-template-columns:1fr;gap:2rem;}.split.rev .split-text{order:0;}}
/* MODULE: numbered steps (timeline) */
.steps{display:flex;flex-direction:column;gap:0;}
.step{display:grid;grid-template-columns:5rem 1fr;gap:1.5rem;padding:2rem 0;border-top:.0625rem solid rgba(255,255,255,.14);}
.step:last-child{border-bottom:.0625rem solid rgba(255,255,255,.14);}
.step-num{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:2.4rem;line-height:1;color:rgb(220,30,30);}
.step h3{margin-bottom:.6rem;}
/* MODULE: alternating rows */
.rows{display:flex;flex-direction:column;gap:3rem;}
.frow{display:grid;grid-template-columns:auto 1fr;gap:2rem;align-items:start;}
.frow-mark{width:3.5rem;height:3.5rem;border:.0625rem solid rgba(255,60,60,.5);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.frow-mark svg{width:1.6rem;height:1.6rem;stroke:rgb(220,30,30);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.frow h3{margin-bottom:.7rem;}
/* MODULE: stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:2.5rem;}
.stat-n{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:clamp(2.6rem,5vw,3.8rem);line-height:1;background:linear-gradient(90deg,#fff,rgb(220,30,30));-webkit-background-clip:text;background-clip:text;color:transparent;}
.stat-l{margin-top:.8rem;color:rgba(255,255,255,.6);font-weight:500;letter-spacing:.02em;}
/* MODULE: checklist */
.checklist{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1rem 2.5rem;}
.check{display:flex;gap:1rem;align-items:flex-start;padding:.55rem 0;}
.check svg{width:1.4rem;height:1.4rem;flex-shrink:0;margin-top:.15rem;stroke:rgb(220,30,30);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.check span{font-family:"Kallisto",sans-serif;font-weight:500;font-size:1.05rem;line-height:1.45;color:rgba(255,255,255,.82);}
/* MODULE: big quote / statement */
.statement{max-width:56rem;font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:clamp(1.6rem,3.2vw,2.5rem);line-height:1.25;text-transform:uppercase;letter-spacing:.01em;}
.statement .accent-red{display:inline;}
/* CTA band */
.cta{position:relative;z-index:2;background:#000;text-align:center;padding:7rem 2.6rem;border-top:.0625rem solid rgba(255,255,255,.14);}
.cta .h-lg{max-width:56rem;margin:0 auto 1.4rem;}
.cta .lead{max-width:34rem;margin:0 auto 2.4rem;}
.cta-ctas{display:flex;gap:1.1rem;justify-content:center;flex-wrap:wrap;}
@media(max-width:760px){.nav{padding:0 1.4rem;}.wrap{padding-left:1.5rem;padding-right:1.5rem;}.step{grid-template-columns:3rem 1fr;gap:1rem;}}
/* FOOTER + CONTACT FORM (matches homepage) */
.sec-footer{position:relative;z-index:2;background:#000;padding:3rem 2.6rem 3rem;}
.footer-box{position:relative;border:.0625rem solid rgba(255,255,255,.20);padding:3.25rem 3.5rem 1.75rem;overflow:hidden;}
.footer-glow{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.footer-glow::before{content:'';position:absolute;left:18%;top:120%;width:60vmin;height:60vmin;margin-left:-30vmin;margin-top:-30vmin;background:radial-gradient(circle,rgba(255,220,210,.22) 0%,rgba(220,30,30,.20) 18%,rgba(90,6,4,.12) 46%,transparent 72%);filter:blur(4rem);mix-blend-mode:screen;}
.footer-inner{position:relative;z-index:1;}
.footer-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.5rem;min-height:4.5rem;}
.footer-logo{display:flex;align-items:center;justify-content:flex-start;height:2.6rem;text-decoration:none;}
.footer-logo svg{height:100%;width:auto;display:block;}
.footer-logo svg path{fill:#fff;}
.footer-title{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:2.9rem;line-height:1;letter-spacing:.03em;text-transform:uppercase;color:#fff;text-align:center;margin:0;}
.footer-toptools{display:flex;align-items:center;justify-content:flex-end;}
.footer-top-btn{width:3.25rem;height:3.25rem;background:transparent;border:.0625rem solid rgba(255,255,255,.28);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .3s ease,background .3s ease;}
.footer-top-btn:hover{border-color:rgba(255,255,255,.75);background:rgba(255,255,255,.05);}
.footer-top-btn svg{width:1.1rem;height:1.1rem;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.footer-rule{height:.0625rem;background:rgba(255,255,255,.18);margin:2.5rem 0;}
.footer-rule--tight{margin:2.25rem 0 1.75rem;}
.footer-rule--bottom{margin:1.5rem 0 1.15rem;}
.footer-cols{display:grid;grid-template-columns:repeat(2,1fr);}
.footer-col{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:.5rem 2rem;text-align:center;border-right:.0625rem solid rgba(255,255,255,.18);}
.footer-col:last-child{border-right:none;}
.footer-col-label{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.82rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.42);}
.footer-col-value{font-family:"Kallisto",sans-serif;font-weight:500;font-size:1.5rem;letter-spacing:.01em;color:#fff;text-decoration:none;transition:color .35s ease;}
.footer-col-value:hover{color:rgb(220,30,30);}
.footer-form{display:flex;flex-direction:column;gap:1rem;max-width:52rem;margin:0 auto;}
.footer-form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;}
.footer-form input,.footer-form textarea{font-family:"Kallisto",sans-serif;font-weight:500;font-size:1rem;color:#fff;background:rgba(255,255,255,.04);border:.0625rem solid rgba(255,255,255,.20);border-radius:0;padding:.95rem 1.1rem;width:100%;transition:border-color .3s ease,background .3s ease;}
.footer-form textarea{resize:vertical;min-height:3.5rem;}
.footer-form input::placeholder,.footer-form textarea::placeholder{color:rgba(255,255,255,.38);}
.footer-form input:focus,.footer-form textarea:focus{outline:none;border-color:rgba(255,60,60,.7);background:rgba(255,255,255,.06);}
.footer-hp{position:absolute;left:-62.5rem;top:auto;width:.0625rem;height:.0625rem;overflow:hidden;opacity:0;pointer-events:none;}
.footer-form-row{display:flex;flex-direction:column;align-items:center;gap:.9rem;}
.footer-form-status{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.85rem;letter-spacing:.02em;color:rgba(255,255,255,.6);}
.footer-form-status.ok{color:#5fd08a;}
.footer-form-status.err{color:#ff6b6b;}
.footer-form-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;height:3.25rem;padding:0 2rem;font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:.9rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;background:transparent;border:.0625rem solid #fff;cursor:pointer;overflow:hidden;transition:border-color .4s ease;}
.footer-form-btn:hover{border-color:#fff;}
.footer-form-btn .btn-inner{display:inline-flex;align-items:center;gap:.6rem;}
.footer-form-btn .arrow svg{width:1.05rem;height:1.05rem;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block;}
.footer-legal{display:flex;align-items:center;justify-content:center;gap:.9rem;flex-wrap:wrap;font-family:"Kallisto",sans-serif;font-weight:500;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;}
.footer-legal a{color:#fff;text-decoration:none;transition:opacity .35s ease;}
.footer-legal a:hover{opacity:.6;}
.footer-legal .dot{width:.28rem;height:.28rem;border-radius:50%;background:rgba(220,30,30,.75);flex-shrink:0;}
@media(max-width:60rem){.footer-top{grid-template-columns:auto 1fr auto;}.footer-title{font-size:1.9rem;}.footer-cols{grid-template-columns:1fr;}.footer-col{border-right:none;border-bottom:.0625rem solid rgba(255,255,255,.14);padding:1.75rem 1rem;}.footer-col:last-child{border-bottom:none;}.sec-footer{padding:2rem 1.2rem;}.footer-box{padding:2.25rem 1.5rem;}.footer-form-grid{grid-template-columns:1fr;}}
/* clickable service cards (servicios overview) */
.card-link{text-decoration:none;display:flex;flex-direction:column;}
.card-more{margin-top:1.3rem;font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:rgb(220,30,30);display:inline-flex;align-items:center;gap:.5rem;}
.card-more svg{width:1rem;height:1rem;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s ease;}
.card-link:hover .card-more svg{transform:translateX(.25rem);}

/* MODULE: minimalist service list — hairline rows, no boxes, no icons */
.svc-list{border-top:.0625rem solid rgba(255,255,255,.18);}
.svc-item{display:grid;grid-template-columns:4.5rem 1fr 2rem;gap:2rem;align-items:center;padding:2.4rem 0;border-bottom:.0625rem solid rgba(255,255,255,.18);text-decoration:none;transition:padding-left .4s ease,background .4s ease;}
.svc-item:hover{padding-left:.85rem;background:linear-gradient(90deg,rgba(220,30,30,.06),transparent 55%);}
.svc-item-num{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.85rem;letter-spacing:.2em;color:rgba(255,255,255,.35);transition:color .35s ease;}
.svc-item:hover .svc-item-num{color:rgb(220,30,30);}
.svc-item h3{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:clamp(1.35rem,2.4vw,2rem);line-height:1.15;text-transform:uppercase;color:#fff;transition:color .35s ease;margin-bottom:.5rem;}
.svc-item:hover h3{color:rgb(220,30,30);}
.svc-item p{font-family:"Kallisto",sans-serif;font-weight:500;font-size:1rem;line-height:1.5;color:rgba(255,255,255,.55);max-width:52rem;}
.svc-item-arrow{justify-self:end;width:1.5rem;height:1.5rem;stroke:rgba(255,255,255,.4);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s ease,stroke .35s ease;}
.svc-item:hover .svc-item-arrow{transform:translateX(.4rem);stroke:rgb(220,30,30);}
@media(max-width:60rem){.svc-item{grid-template-columns:3rem 1fr 1.25rem;gap:1rem;padding:1.8rem 0;}}

/* MODULE: per-section galaxy — same intensity/technique as homepage casos+metodo.
   Four placements (gp-tl / gp-r / gp-bl / gp-c) so each section reads different. */
.sec-glow{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 20%,black 80%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,black 20%,black 80%,transparent 100%);}
.sg{position:absolute;border-radius:50%;mix-blend-mode:screen;
  background:radial-gradient(circle,rgba(255,255,255,.9) 0%,rgba(255,80,80,.75) 5%,rgba(215,15,15,.55) 18%,rgba(140,4,4,.22) 44%,transparent 64%);
  animation:sgDriftA 17s ease-in-out infinite,sgBreatheSoft 7s ease-in-out infinite;}
.sg2{background:radial-gradient(circle,rgba(255,255,255,.8) 0%,rgba(255,70,70,.62) 6%,rgba(190,12,12,.45) 20%,rgba(110,4,4,.18) 46%,transparent 66%);
  animation:sgDriftB 13s ease-in-out infinite,sgBreatheSoft 5s ease-in-out infinite 3s;}
@keyframes sgPulse{0%,100%{opacity:.85;transform:scale(1);}50%{opacity:.5;transform:scale(1.14);}}
.gp-tl .sg{width:40rem;height:40rem;top:-14%;left:-10%;filter:blur(4.5rem);}
.gp-tl .sg2{width:34rem;height:34rem;bottom:-16%;right:4%;filter:blur(6rem);}
.gp-r .sg{width:38rem;height:38rem;top:-8%;right:-12%;filter:blur(4.5rem);}
.gp-r .sg2{width:32rem;height:32rem;bottom:-14%;left:2%;filter:blur(6rem);}
.gp-bl .sg{width:40rem;height:40rem;bottom:-18%;left:-12%;filter:blur(4.5rem);}
.gp-bl .sg2{width:30rem;height:30rem;top:-10%;right:8%;filter:blur(6rem);}
.gp-c .sg{width:48rem;height:48rem;top:50%;left:50%;margin-left:-24rem;margin-top:-24rem;filter:blur(5rem);}
.gp-c .sg2{width:28rem;height:28rem;top:6%;right:6%;filter:blur(5rem);}
/* CRITICAL: keep content above the glow layer */
.section > *:not(.sec-glow),.cta > *:not(.sec-glow){position:relative;z-index:2;}
/* group label under the angular heading lines */
.grp-kicker{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:1.1rem;}

/* MODULE: service tiles — angular clipped corner, same shape language as the
   homepage vid-clips. Border is drawn as an SVG polyline (injected by site.js)
   so the diagonal edge reads cleanly, exactly like the homepage does it. */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1.25rem;}
.svc-tile{position:relative;display:flex;flex-direction:column;gap:1rem;
  padding:2.3rem 1.9rem 2.1rem;text-decoration:none;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.012) 60%);
  clip-path:polygon(0 0, calc(100% - 1.7rem) 0, 100% 1.7rem, 100% 100%, 0 100%);
  transition:background .45s ease,transform .45s ease;}
.svc-tile:hover{background:linear-gradient(160deg,rgba(220,30,30,.20),rgba(255,60,60,.04) 62%);transform:translateY(-.35rem);}
.svc-tile > svg.tile-border{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none;}
/* border colour is locked to the homepage token in every state */
.svc-tile > svg.tile-border polyline,
.metric > svg.tile-border polyline{stroke:var(--border-color);}
.tile-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.tile-ico{width:2.3rem;height:2.3rem;stroke:rgb(220,30,30);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;
  transition:stroke .45s ease,transform .45s ease;}
.svc-tile:hover .tile-ico{stroke:#fff;transform:translateY(-.15rem);}
.tile-num{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.72rem;letter-spacing:.24em;color:rgba(255,255,255,.3);}
.svc-tile h3{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:1.25rem;line-height:1.18;text-transform:uppercase;color:#fff;}
.svc-tile p{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.92rem;line-height:1.5;color:rgba(255,255,255,.6);flex:1;}
.tile-more{display:inline-flex;align-items:center;gap:.5rem;font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgb(220,30,30);transition:color .45s ease;}
.svc-tile:hover .tile-more{color:#fff;}
.tile-more svg{width:.95rem;height:.95rem;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s ease;}
.svc-tile:hover .tile-more svg{transform:translateX(.3rem);}
@media(max-width:60rem){.svc-grid{grid-template-columns:1fr;}}

/* centered section head */
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
/* uniform 12-up grid — 4 x 3 on desktop */
.svc-grid{grid-template-columns:repeat(4,1fr);gap:1.1rem;}
@media(max-width:76rem){.svc-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:60rem){.svc-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:40rem){.svc-grid{grid-template-columns:1fr;}}
/* SURPRISE: red spotlight that tracks the cursor inside each tile */
.svc-tile::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(16rem circle at var(--mx,50%) var(--my,0%),rgba(255,60,60,.28),transparent 62%);
  opacity:0;transition:opacity .45s ease;}
.svc-tile:hover::before{opacity:1;}
.svc-tile > .tile-top,.svc-tile > h3,.svc-tile > p,.svc-tile > .tile-more{position:relative;z-index:2;}

.section.tight{padding-top:1.5rem;}

/* MOBILE FOOTER: stack logo on top, then ESCRIBENOS, then back-to-top.
   Works down to 320px (the 3-column row overflowed and clipped the word). */
@media(max-width:40rem){
  .footer-top{grid-template-columns:1fr;justify-items:center;text-align:center;gap:1.15rem;}
  .footer-logo{justify-content:center;height:2.3rem;}
  .footer-toptools{justify-content:center;}
  .footer-title{font-size:1.7rem;}
}
@media(max-width:24rem){
  .sec-footer{padding:1.5rem .85rem;}
  .footer-box{padding:1.9rem 1rem 1.4rem;}
  .footer-title{font-size:1.35rem;letter-spacing:.02em;}
  .footer-logo{height:2rem;}
  .footer-col-value{font-size:1.2rem;}
}

/* MOBILE: pull the fold and the first section together (was ~92vh apart) */
@media(max-width:60rem){
  .stage{min-height:auto;}
  .svc-hero{min-height:auto;padding-top:4rem;padding-bottom:2rem;}
  .stage::after{height:7rem;}
  .section.tight{padding-top:0;}
  .section{padding-top:2.5rem;padding-bottom:3.5rem;}
}

/* anchor the scale-in to the top edge (homepage .sec-validamos does the same),
   otherwise scaling from the centre pushes a tall section far down the page */
[data-scale-in]{transform-origin:center top;}

/* MOBILE: drop the red dot separators in the legal row (they read as noise
   once the items stack vertically) */
@media(max-width:40rem){
  .footer-legal .dot{display:none;}
  .footer-legal{flex-direction:column;gap:.6rem;line-height:1.6;}
}

/* scramble glyphs (matches homepage .sc-char) */
[data-scramble]{min-height:1em;}
[data-scramble] .sc-char{display:inline-block;opacity:.55;color:rgb(220,30,30);}

/* rich-scramble segments must not break the heading layout */
.sc-seg{display:inline;}
.sc-seg .sc-char{display:inline-block;opacity:.55;color:rgb(220,30,30);}

/* Scramble targets must never be readable before they scramble (homepage
   behaviour: .scramble is hidden, .scramble.active reveals it). */
[data-scramble],[data-scramble-hero]{visibility:hidden;}
[data-scramble].active,[data-scramble-hero].active{visibility:visible;}

/* FAQ — copied verbatim from the homepage so the two can never drift.
   Do not hand-edit: the homepage is the source of truth. */
.faq-list{border-top:.0625rem solid rgba(255,255,255,.16);}
.faq-item{border-bottom:.0625rem solid rgba(255,255,255,.16);}
.faq-q{width:100%;
  display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;
  padding:1.9rem 0;
  background:transparent;border:none;cursor:pointer;
  text-align:left;}
.faq-q-text{font-family:"Kallisto Heading","Kallisto",sans-serif;
  font-weight:700;
  font-size:1.5rem;
  line-height:1.25;
  color:#fff;
  transition:color .35s ease;}
.faq-item:hover .faq-q-text{color:rgb(220,30,30);}
.faq-icon{position:relative;
  flex-shrink:0;
  width:1.5rem;height:1.5rem;
  margin-top:.35rem;}
.faq-icon::before,
.faq-icon::after{content:'';position:absolute;
  top:50%;left:50%;
  background:rgb(220,30,30);
  transform:translate(-50%,-50%);
  transition:transform .4s cubic-bezier(.4,0,.2,1),opacity .4s ease;}
.faq-icon::before{width:1.5rem;height:.0625rem;}
.faq-icon::after{width:.0625rem;height:1.5rem;}
.faq-item.open .faq-icon::after{transform:translate(-50%,-50%) scaleY(0);opacity:0;}
.faq-item.open .faq-icon::before{background:rgba(255,255,255,.9);}
.faq-a{overflow:hidden;
  max-height:0;
  transition:max-height .5s cubic-bezier(.4,0,.2,1),opacity .4s ease,padding .5s ease;
  opacity:0;}
.faq-item.open .faq-a{opacity:1;
  padding-bottom:2rem;}
.faq-a a{color:rgb(220,30,30);text-decoration:none;font-weight:600;}
.faq-a a:hover{text-decoration:underline;}
.faq-a p{font-family:"Kallisto",sans-serif;
  font-weight:500;
  font-size:1.1rem;
  line-height:1.6;
  color:rgba(255,255,255,.72);
  max-width:52rem;
  text-wrap:pretty;
  margin:0;}
/* FAQ head + CTA band — sizes copied from the homepage (one website, one scale) */
.faq-head{margin-bottom:4rem;}
.faq-title{
  font-family:"Kallisto Heading","Kallisto",sans-serif;
  font-weight:700;font-size:3.5rem;line-height:1.05;
  text-transform:uppercase;letter-spacing:.01em;
  color:#fff;margin-top:2rem;
}
.cta-heading{
  font-family:"Kallisto Heading","Kallisto",sans-serif;
  font-weight:700;font-size:2.8rem;line-height:1.08;
  text-transform:uppercase;letter-spacing:.02em;
  color:#fff;max-width:38rem;text-wrap:pretty;margin:0;
}
.cta-line{
  width:100%;max-width:34rem;height:.0625rem;
  background:linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,80,80,.85) 8%, #ff2828 50%, rgba(255,80,80,.85) 92%, rgba(255,255,255,0) 100%);
  box-shadow:0 0 .3rem rgba(255,40,40,.9),0 0 1.2rem rgba(255,30,30,.7),0 0 2.5rem rgba(220,10,10,.5);
}
.cta-lead{
  font-family:"Kallisto",sans-serif;font-weight:500;
  font-size:.95rem;line-height:1.6;color:#ffffff;
  max-width:34rem;margin:0;
}

@media (max-width: 64rem){
  .sec-faq{padding:7rem 1.5rem;}
  .faq-title{font-size:2.6rem;}
  .faq-q-text{font-size:1.2rem;}
  .faq-a p{font-size:1rem;}
}

/* ============================================================
   RICH SECTION DEVICES — ported from the homepage's own machinery
   (framed CTA w/ bg image, metric boxes w/ slanted border, drawn
   timeline w/ ticks, animated flares) so service pages have the
   same visual weight instead of plain text on a glow.
   ============================================================ */

/* ---- animated flares (homepage .metodo-flare) ---- */
.flare{position:absolute;width:14rem;height:14rem;pointer-events:none;
  background:radial-gradient(circle, rgba(255,245,240,.55) 0%, rgba(255,180,160,.32) 10%, rgba(220,80,60,.18) 28%, transparent 60%);
  filter:blur(3.5rem);mix-blend-mode:screen;}
.f1{left:18%;top:22%;animation:flr 6s ease-in-out infinite;}
.f2{left:66%;top:14%;animation:flr 7.5s ease-in-out infinite 1.5s;}
.f3{left:78%;top:70%;animation:flr 9s ease-in-out infinite 3s;}
.f4{left:30%;top:74%;animation:flr 7s ease-in-out infinite 2s;}
@keyframes flr{0%,100%{opacity:.25;transform:scale(1);}50%{opacity:.7;transform:scale(1.25);}}

/* ---- METRIC BAND: slanted-corner boxes (homepage .metric-box) ---- */
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:1rem;}
.metric{position:relative;padding:1.8rem 1.4rem;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.012) 60%);
  clip-path:polygon(0 0, calc(100% - 1.3rem) 0, 100% 1.3rem, 100% 100%, 0 100%);}
.metric > svg.tile-border{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none;}
.metric-n{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:clamp(2rem,3.4vw,2.8rem);line-height:1;
  background:linear-gradient(90deg,#fff,rgb(220,30,30));-webkit-background-clip:text;background-clip:text;color:transparent;}
.metric-l{margin-top:.7rem;font-family:"Kallisto",sans-serif;font-weight:500;font-size:.9rem;line-height:1.4;color:rgba(255,255,255,.6);}

/* ---- FRAMED PANEL with background image (homepage .cta-frame) ---- */
.frame{position:relative;min-height:26rem;display:flex;align-items:center;justify-content:center;overflow:hidden;
  border:.0625rem solid rgba(255,255,255,.18);}
.frame-bg{position:absolute;inset:0;z-index:0;}
.frame-bg img{width:100%;height:100%;object-fit:cover;display:block;}
.frame-overlay{position:absolute;inset:0;background:rgba(0,0,0,.74);}
.frame-inner{position:relative;z-index:4;text-align:center;padding:5.5rem 3rem;display:flex;flex-direction:column;align-items:center;gap:1.75rem;max-width:52rem;}
@media(max-width:60rem){.frame-inner{padding:3.5rem 1.5rem;}.frame{min-height:20rem;}}

/* ---- SPLIT with image panel ---- */
.split-img{position:relative;overflow:hidden;min-height:24rem;border:.0625rem solid rgba(255,255,255,.16);
  clip-path:polygon(0 0, calc(100% - 2rem) 0, 100% 2rem, 100% 100%, 0 100%);}
.split-img img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(.35) contrast(1.05);
  transition:transform 1.2s ease,filter 1.2s ease;}
.split-img:hover img{transform:scale(1.05);filter:grayscale(0) contrast(1.1);}
.split-img::after{content:'';position:absolute;inset:0;
  background:linear-gradient(120deg,rgba(0,0,0,.55) 0%,transparent 45%),linear-gradient(0deg,rgba(220,30,30,.22),transparent 55%);}

/* ---- DRAWN TIMELINE (homepage metodo line + ticks) ---- */
.tl{position:relative;padding-left:2.4rem;}
.tl::before{content:'';position:absolute;left:.45rem;top:.6rem;bottom:.6rem;width:.0625rem;
  background:linear-gradient(to bottom, transparent 0%, rgba(255,80,80,.85) 8%, #ff2828 50%, rgba(255,80,80,.85) 92%, transparent 100%);
  box-shadow:0 0 .35rem rgba(255,40,40,.55);}
.tl-item{position:relative;padding:1.6rem 0;}
.tl-item::before{content:'';position:absolute;left:-2.24rem;top:2.05rem;width:.7rem;height:.7rem;border-radius:50%;
  background:#0a0a0a;border:.0625rem solid #ff2828;box-shadow:0 0 .5rem rgba(255,40,40,.8);transition:background .35s ease,transform .35s ease;}
.tl-item:hover::before{background:#ff2828;transform:scale(1.25);}
.tl-n{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.72rem;letter-spacing:.28em;color:rgb(220,30,30);margin-bottom:.5rem;}
.tl-item h3{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:1.35rem;line-height:1.15;text-transform:uppercase;color:#fff;margin-bottom:.6rem;}
.tl-item p{font-family:"Kallisto",sans-serif;font-weight:500;font-size:1rem;line-height:1.55;color:rgba(255,255,255,.62);max-width:44rem;}


/* ---------- SERVICE MARQUEE (hero ticker) ---------- */
.svc-marquee{
  position:relative;z-index:2;
  width:100%;max-width:60rem;
  overflow:hidden;
  padding:1.15rem 0;
  border-top:.0625rem solid rgba(255,255,255,.16);
  border-bottom:.0625rem solid rgba(255,255,255,.16);
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%);
}
.svc-hero .svc-marquee{align-self:center;margin:0 auto;}
.svc-mq-track{
  display:flex;align-items:center;
  width:max-content;
  animation:svcMqX 52s linear infinite;
  will-change:transform;
}
.svc-marquee:hover .svc-mq-track{animation-play-state:paused;}
.svc-mq-item{
  display:inline-flex;align-items:center;gap:.8rem;
  padding:0 2rem;
  font-family:"Kallisto",sans-serif;font-weight:700;
  font-size:.95rem;letter-spacing:.16em;text-transform:uppercase;
  color:#ffffff;
  white-space:nowrap;
}
.svc-mq-item svg{
  width:1.25rem;height:1.25rem;flex-shrink:0;
  fill:none;stroke:rgb(220,30,30);
  stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
}
@keyframes svcMqX{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media(max-width:760px){
  .svc-hero .svc-marquee{margin:0;}
  .svc-mq-item{font-size:.8rem;padding:0 1.4rem;gap:.6rem;}
  .svc-mq-item svg{width:1.05rem;height:1.05rem;}
}


/* ---------- CLOSING SECTION — lifted verbatim from the homepage #cierre ---------- */
.sec-final{
  position:relative;z-index:2;background:#000;
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  padding:8rem 2.6rem;
}
.final-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#000;}
.final-glow{
  position:absolute;
  left:50%;top:50%;
  width:120vmin;height:120vmin;
  margin-left:-60vmin;margin-top:-60vmin;
  background:radial-gradient(circle,
    rgba(255,235,225,.4) 0%,
    rgba(255,120,90,.32) 6%,
    rgba(220,30,30,.4) 16%,
    rgba(120,8,5,.3) 36%,
    rgba(40,2,2,.16) 60%,
    transparent 80%);
  filter:blur(4rem);
  mix-blend-mode:screen;
  animation:finGlowA 9s ease-in-out infinite;
}
.final-glow-2{
  position:absolute;
  left:38%;top:42%;
  width:80vmin;height:80vmin;
  margin-left:-40vmin;margin-top:-40vmin;
  background:radial-gradient(circle,
    rgba(255,210,200,.4) 0%,
    rgba(220,30,30,.3) 12%,
    rgba(110,8,5,.24) 34%,
    transparent 72%);
  filter:blur(5rem);
  mix-blend-mode:screen;
  animation:finGlowB 12s ease-in-out infinite;
}
.final-glow-3{
  position:absolute;
  left:64%;top:58%;
  width:70vmin;height:70vmin;
  margin-left:-35vmin;margin-top:-35vmin;
  background:radial-gradient(circle,
    rgba(255,220,210,.35) 0%,
    rgba(220,30,30,.28) 14%,
    rgba(60,3,2,.15) 52%,
    transparent 76%);
  filter:blur(4.5rem);
  mix-blend-mode:screen;
  animation:finGlowC 15s ease-in-out infinite;
}
.final-vignette{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 80% 75% at 50% 50%,transparent 30%,rgba(0,0,0,.5) 70%,#000 100%);
}
.final-inner{
  position:relative;z-index:3;
  text-align:center;
  display:flex;flex-direction:column;align-items:center;
  gap:2.5rem;
  max-width:60rem;
}
.final-eyebrow{
  font-family:"Kallisto",sans-serif;
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:rgb(220,30,30);
}
.final-heading{
  font-family:"Kallisto Heading","Kallisto",sans-serif;
  font-weight:700;
  font-size:4.8rem;
  line-height:1.02;
  text-transform:uppercase;
  letter-spacing:.005em;
  color:#fff;
  text-wrap:balance;
  text-shadow:0 0 3rem rgba(0,0,0,.5);
}
.final-heading .accent{
  color:#fff;
}
.final-rule{
  width:0;height:.0625rem;
  background:linear-gradient(to right,transparent,rgb(220,30,30),transparent);
  box-shadow:0 0 .8rem rgba(220,30,30,.8),0 0 2rem rgba(220,30,30,.5);
  margin:.5rem 0 .25rem;
}
.final-sub{
  font-family:"Kallisto",sans-serif;
  font-weight:500;
  font-size:1.15rem;
  line-height:1.55;
  letter-spacing:.04em;
  color:#fff;
  text-wrap:pretty;
}
.final-cta-btn{margin-top:1rem;}
@keyframes finGlowA{
  0%,100%{transform:translate(0,0) scale(1);opacity:.95;}
  25%{transform:translate(9vw,-7vh) scale(1.3);opacity:1;}
  50%{transform:translate(-7vw,7vh) scale(.78);opacity:.4;}
  75%{transform:translate(5vw,9vh) scale(1.16);opacity:.85;}
}
@keyframes finGlowB{
  0%,100%{transform:translate(0,0) scale(1);opacity:.7;}
  33%{transform:translate(-10vw,8vh) scale(1.38);opacity:1;}
  66%{transform:translate(11vw,-8vh) scale(.72);opacity:.35;}
}
@keyframes finGlowC{
  0%,100%{transform:translate(0,0) scale(1);opacity:.75;}
  40%{transform:translate(9vw,8vh) scale(.76);opacity:1;}
  80%{transform:translate(-8vw,-7vh) scale(1.34);opacity:.3;}
}
@media (max-width: 64rem){
  .sec-final{padding:6rem 1.5rem;min-height:90vh;}
  .final-heading{font-size:2.9rem;}
  .final-sub{font-size:1rem;}
}

@media(prefers-reduced-motion:reduce){.svc-mq-track{animation:none;}}

/* ---------- LIQUID GALAXY MOTION ----------
   Drift (transform) and breathe (opacity) run as TWO animations with coprime
   durations, so they beat against each other and never resync — the loop reads
   as random instead of a metronome. Only transform/opacity animate, so the
   expensive blur rasterises once and is just composited. */
@keyframes sgDriftA{
  0%,100%{transform:translate3d(0,0,0) scale(1);}
  25%    {transform:translate3d(13rem,-9rem,0) scale(1.28);}
  50%    {transform:translate3d(-9rem,10rem,0) scale(.78);}
  75%    {transform:translate3d(-14rem,-6rem,0) scale(1.18);}
}
@keyframes sgDriftB{
  0%,100%{transform:translate3d(0,0,0) scale(1);}
  33%    {transform:translate3d(-8rem,6rem,0) scale(1.14);}
  66%    {transform:translate3d(11rem,-10rem,0) scale(.76);}
}
@keyframes sgDriftC{
  0%,100%{transform:translate3d(0,0,0) scale(1);}
  40%    {transform:translate3d(7rem,8rem,0) scale(1.2);}
  70%    {transform:translate3d(-8rem,-5rem,0) scale(.85);}
}
@keyframes sgBreathe{0%,100%{opacity:1;}50%{opacity:.3;}}
@keyframes sgBreatheSoft{0%,100%{opacity:1;}50%{opacity:.35;}}

/* ---------- SMALL-SCREEN HEADING SCALE ----------
   The homepage stops at 64rem, which is fine for its shorter copy but clips
   longer words (FRECUENTES / NEGOCIO) below ~357px. Same ladder, two more rungs. */
@media (max-width:40rem){
  /* every button full width on mobile */
  .btn{width:100%;max-width:20rem;}
  .svc-hero-ctas,.cta-ctas{width:100%;flex-direction:column;align-items:center;}
  /* let the content set the height instead of reserving 90vh for it */
  .sec-final{min-height:auto;padding:3.5rem 1.5rem;}
  .final-inner{gap:1.6rem;}
  .final-cta-btn{margin-top:.3rem;}
  .h-xl{font-size:2.35rem;}
  .h-lg{font-size:1.9rem;}
  .faq-title{font-size:2.3rem;}
  .final-heading{font-size:2.4rem;}
  .final-sub{font-size:.95rem;}
  .cta-heading{font-size:2.1rem;}
}
@media (max-width:24rem){
  .h-xl{font-size:2rem;}
  .h-lg{font-size:1.7rem;}
  .faq-title{font-size:2rem;}
  .final-heading{font-size:2rem;}
  .final-sub{font-size:.9rem;}
  .cta-heading{font-size:1.85rem;}
}

/* ══════════ SPLIT PANEL — text left, image right, slanted ══════════ */
/* image bigger, text smaller — mirrors the reference layout */
.split-panel{position:relative;border:0;display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:2.5rem;padding:2.5rem;
  --corner:2.25rem;
  clip-path:polygon(0 0, calc(100% - var(--corner)) 0, 100% var(--corner), 100% 100%, 0 100%);
  background:linear-gradient(150deg,rgba(255,255,255,.04),rgba(255,255,255,0) 60%);}
.split-panel > svg.tile-border{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none;}
.split-panel > svg.tile-border polyline{stroke:var(--border-color);}
.panel-title{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;
  font-size:clamp(1.5rem,2.2vw,2.1rem);line-height:1.1;color:#fff;margin:0 0 1.1rem;
  letter-spacing:.01em;}
.panel-meta{display:flex;gap:3rem;margin-top:2.2rem;}
.panel-meta div{display:flex;flex-direction:column;gap:.35rem;}
.panel-meta-k{font-family:"Kallisto",sans-serif;font-weight:700;font-size:.68rem;
  letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.42);}
.panel-meta-v{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;
  font-size:1rem;letter-spacing:.04em;text-transform:uppercase;color:#fff;}
.split-panel-text .statement{margin:0;font-size:clamp(.95rem,1.15vw,1.15rem);line-height:1.55;max-width:none;
  font-family:"Kallisto",sans-serif;font-weight:500;letter-spacing:.02em;text-transform:none;color:rgba(255,255,255,.86);}
.split-panel-media{position:relative;overflow:hidden;align-self:stretch;min-height:20rem;}
.split-panel-media img{width:100%;height:100%;object-fit:cover;display:block;}

/* ══════════ STATS BAND — full-bleed image, stats over it ══════════ */
.stats-band{position:relative;z-index:2;overflow:hidden;padding:0;min-height:42rem;display:flex;align-items:center;}
.stats-band-bg{position:absolute;inset:0;z-index:0;}
.stats-band-bg img{width:100%;height:100%;object-fit:cover;object-position:center bottom;display:block;}
.stats-band-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.92) 7%,rgba(0,0,0,.55) 20%,rgba(0,0,0,.12) 32%,rgba(0,0,0,0) 44%,rgba(0,0,0,0) 66%,rgba(0,0,0,.35) 86%,rgba(0,0,0,.85) 94%,#000 100%);}
.stats-band-inner{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;
  padding:0 2.6rem;max-width:78rem;margin:0 auto;width:100%;}
.stat{display:flex;flex-direction:column;gap:.5rem;}
.stat-n{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:2.2rem;line-height:1.05;color:#000;}
.stat-l{font-family:"Kallisto",sans-serif;font-weight:500;font-size:.92rem;line-height:1.5;color:rgba(0,0,0,.78);}

/* ══════════ ACCORDION ══════════ */
.acc{position:relative;isolation:isolate;--acc-col:23rem;}
.acc-item{position:relative;z-index:2;}
.acc-q{position:relative;width:100%;background:transparent;border:0;cursor:pointer;display:flex;align-items:center;gap:1.4rem;padding:1.9rem 0;text-align:left;}
.acc-ico{width:2rem;height:2rem;flex-shrink:0;fill:none;stroke:rgb(220,30,30);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;position:relative;z-index:2;}
.acc-title{font-family:"Kallisto Heading","Kallisto",sans-serif;font-weight:700;font-size:1.25rem;line-height:1.2;color:#fff;text-transform:uppercase;flex:0 0 auto;position:relative;z-index:2;}
.acc-rule{position:absolute;inset:0;pointer-events:none;}
.acc-chev{flex-shrink:0;width:1.4rem;height:1.4rem;display:block;position:relative;z-index:2;margin-left:0;}
.acc-chev svg{width:100%;height:100%;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s cubic-bezier(.4,0,.2,1);}
.acc-item.open .acc-chev svg{transform:rotate(180deg);}
.acc-a{overflow:hidden;max-height:0;opacity:0;transition:max-height .5s cubic-bezier(.4,0,.2,1),opacity .4s ease,padding .4s ease;}
.acc-item.open .acc-a{opacity:1;padding-bottom:1.8rem;}
.acc-a p{font-family:"Kallisto",sans-serif;font-weight:500;font-size:1rem;line-height:1.6;color:rgba(255,255,255,.72);margin:0;max-width:calc(var(--acc-col) + 2.8rem);padding-left:3.4rem;text-wrap:pretty;}

/* live galaxy behind the accordion — implodes then explodes */
.acc-galaxy{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  -webkit-mask-image:radial-gradient(ellipse 72% 62% at 50% 50%,#000 28%,transparent 82%);
  mask-image:radial-gradient(ellipse 72% 62% at 50% 50%,#000 28%,transparent 82%);}
.acc-galaxy span{position:absolute;border-radius:50%;mix-blend-mode:screen;display:block;}
.acc-g1{width:34rem;height:34rem;left:12%;top:50%;margin:-17rem 0 0 -17rem;filter:blur(4.5rem);
  background:radial-gradient(circle,rgba(255,255,255,.5) 0%,rgba(255,60,60,.4) 10%,rgba(200,14,14,.22) 30%,transparent 66%);
  animation:accPulseA 16s ease-in-out infinite;}
.acc-g2{width:24rem;height:24rem;left:62%;top:38%;margin:-12rem 0 0 -12rem;filter:blur(4rem);
  background:radial-gradient(circle,rgba(255,255,255,.42) 0%,rgba(255,60,60,.34) 12%,rgba(170,10,10,.18) 34%,transparent 68%);
  animation:accPulseB 21s ease-in-out infinite;}
.acc-g3{width:18rem;height:18rem;left:86%;top:70%;margin:-9rem 0 0 -9rem;filter:blur(3.5rem);
  background:radial-gradient(circle,rgba(255,255,255,.38) 0%,rgba(255,70,70,.3) 14%,rgba(150,8,8,.14) 38%,transparent 70%);
  animation:accPulseC 13s ease-in-out infinite;}
@keyframes accPulseA{0%,100%{transform:scale(.72);opacity:.35;}50%{transform:scale(1.25);opacity:.95;}}
@keyframes accPulseB{0%,100%{transform:scale(1.2);opacity:.9;}50%{transform:scale(.68);opacity:.3;}}
@keyframes accPulseC{0%,100%{transform:scale(.85);opacity:.5;}45%{transform:scale(1.3);opacity:1;}}

/* ══════════ CHECKLIST — bordered box per item, no slant ══════════ */
.checklist{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;}
.check{display:flex;gap:.9rem;align-items:flex-start;padding:1.2rem 1.1rem;border:.0625rem solid var(--border-color);}
.check span{font-size:.95rem;line-height:1.5;}

/* centred section head */
.center-head .section-head{text-align:center;max-width:60rem;margin-left:auto;margin-right:auto;}
.center-head .section-head .h-lg{margin-left:auto;margin-right:auto;}
.center-head .section-head .muted{margin-left:auto;margin-right:auto;max-width:44rem;}

/* ── responsive for the new modules ── */
@media(max-width:60rem){
  .split-panel{grid-template-columns:1fr;gap:2rem;padding:2rem;}
  .stats-band-inner{grid-template-columns:repeat(2,1fr);padding:0 1.5rem;gap:1.8rem;}
  .checklist{grid-template-columns:repeat(2,1fr);}
  .acc-title{font-size:1.05rem;flex:0 0 auto;}
  .acc-q{gap:1rem;}
}
@media(max-width:40rem){
  .split-panel{padding:1.5rem;--cut:1.5rem;}
  .stats-band-inner{grid-template-columns:1fr;padding:0 1.5rem;gap:1.2rem;}
  .stat-n{font-size:1.8rem;}
  .checklist{grid-template-columns:1fr;}
  .acc-title{font-size:.9rem;flex:none;}
  .acc-ico{width:1.5rem;height:1.5rem;}
  .acc-q{gap:.8rem;padding:1.2rem 0;}
  .acc-rule{min-width:1rem;}
  .acc-a p{padding-left:2.3rem;font-size:.95rem;max-width:none;}
}
@media(prefers-reduced-motion:reduce){.acc-g1,.acc-g2,.acc-g3{animation:none;}}




/* ══════════ STEPS — homepage #metodo, BASE rules only, renamed .metodo -> .mth ══════════ */
/* ─────────────── MÉTODO (Así lo hacemos) ─────────────── */
.sec-mth{position:relative; background:#000; z-index:2; /* tall enough to scroll through the pinned animation */ height:300vh;}
.mth-pin{position:sticky;top:0; height:100vh; width:100%; overflow:hidden; background:#000;}
/* push content below the fixed header */
.mth-inner{padding-top:6.5rem !important;}
/* Animated red galaxy background */
.mth-bg{position:absolute;inset:0;z-index:0; pointer-events:none; overflow:hidden; background:#000;}
/* fade-out edges so the glow doesn't cut sharply */
.mth-bg::before,
.mth-bg::after{content:''; position:absolute;left:0;right:0; height:8rem; z-index:5;pointer-events:none;}
.mth-bg::before{top:0;background:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.7) 50%,transparent 100%);}
.mth-bg::after{bottom:0;background:linear-gradient(to top,#000 0%,rgba(0,0,0,.7) 50%,transparent 100%);}
/* Dark organic red — like a living organism breathing, with white-hot cores inside the red */
.mth-glow{position:absolute; left:50%;top:55%; width:120vmin;height:120vmin; margin-left:-60vmin;margin-top:-60vmin; background:radial-gradient(circle, rgba(255,235,225,.55) 0%, rgba(255,140,120,.4) 6%, rgba(200,30,20,.4) 18%, rgba(120,8,5,.3) 38%, rgba(50,2,2,.18) 60%, transparent 80%); filter:blur(4.5rem); mix-blend-mode:screen; animation:mthGlowA 11s ease-in-out infinite;}
.mth-glow-2{position:absolute; left:25%;top:35%; width:80vmin;height:80vmin; margin-left:-40vmin;margin-top:-40vmin; background:radial-gradient(circle, rgba(255,210,200,.55) 0%, rgba(220,60,40,.35) 10%, rgba(110,8,5,.28) 32%, rgba(40,2,2,.14) 58%, transparent 78%); filter:blur(5rem); mix-blend-mode:screen; animation:mthGlowB 13s ease-in-out infinite;}
.mth-glow-3{position:absolute; left:78%;top:65%; width:75vmin;height:75vmin; margin-left:-37.5vmin;margin-top:-37.5vmin; background:radial-gradient(circle, rgba(255,220,210,.5) 0%, rgba(220,80,60,.32) 8%, rgba(140,15,10,.26) 28%, rgba(60,3,2,.15) 55%, transparent 78%); filter:blur(4.5rem); mix-blend-mode:screen; animation:mthGlowC 16s ease-in-out infinite;}
/* small bright white-hot embers nested inside the red, no visible disk */
.mth-flare{position:absolute; width:14rem;height:14rem; background:radial-gradient(circle, rgba(255,245,240,.55) 0%, rgba(255,180,160,.32) 10%, rgba(220,80,60,.18) 28%, transparent 60%); filter:blur(3.5rem); mix-blend-mode:screen; pointer-events:none; border-radius:50%;}
.mth-flare.f1{left:22%;top:38%;animation:metFlare 6s ease-in-out infinite;}
.mth-flare.f2{left:58%;top:30%;animation:metFlare 7.5s ease-in-out infinite 1.5s;}
.mth-flare.f3{left:72%;top:68%;animation:metFlare 9s ease-in-out infinite 3s;}
.mth-flare.f4{left:38%;top:72%;animation:metFlare 7s ease-in-out infinite 2s;}
.mth-flare.f5{left:50%;top:48%;animation:metFlare 10s ease-in-out infinite 4s;}
.mth-flare.f6{display:none;}
/* Content wrapper */
.mth-inner{position:relative;z-index:2; width:100%;height:100%; padding:2.5rem 2.6rem 3rem 2.6rem; display:flex;flex-direction:column;}
/* Top slanted label (reuse heading-border-wrapper exists). Sub-headline below. */
.mth-sublabel{margin-top:1rem; font-family:"Kallisto",sans-serif; font-size:.78rem;font-weight:500; letter-spacing:.16em;text-transform:uppercase; color:rgba(255,255,255,.55);}
/* Main title */
.mth-title{font-family:"Kallisto Heading","Kallisto",sans-serif; font-weight:700; font-size:3.5rem; line-height:1.05; text-transform:uppercase; letter-spacing:.01em; color:#fff; margin-top:2rem; text-align:center; text-shadow:0 0 2rem rgba(0,0,0,.6);}
/* Timeline stage — bottom half */
.mth-stage{flex:1; position:relative; margin-top:2.5rem; display:grid; grid-template-columns:repeat(4,1fr); align-items:stretch; gap:2rem;}
/* Horizontal middle line — drawn with a wrapper so we can clip-path the reveal */
.mth-line-wrap{position:absolute; left:2.6rem;right:2.6rem; top:50%; height:.0625rem; z-index:1; pointer-events:none; /* will be clipped via inline width by JS scroll */}
.mth-line{position:absolute;inset:0; background:linear-gradient(to right, rgba(255,255,255,.0) 0%, rgba(255,80,80,.85) 8%, #ff2828 50%, rgba(255,80,80,.85) 92%, rgba(255,255,255,0) 100%); box-shadow: 0 0 .3rem rgba(255,40,40,.9), 0 0 1.2rem rgba(255,30,30,.7), 0 0 2.5rem rgba(220,10,10,.5);}
.mth-line-flare{position:absolute; top:50%; width:4rem;height:1rem; margin-top:-.5rem; background:radial-gradient(ellipse at center, rgba(255,255,255,.95) 0%, rgba(255,180,180,.6) 30%, transparent 70%); filter:blur(.2rem); z-index:2; pointer-events:none;}
/* Items */
.mth-item{position:relative; display:flex;flex-direction:column; align-items:center; text-align:center; height:100%; z-index:2;}
.mth-num{font-family:"Kallisto",sans-serif; font-weight:300; font-size:5rem; line-height:1; color:#fff; text-shadow:0 0 1.2rem rgba(0,0,0,.6); /* Above the line — bottom edge sits 1.6rem above line */ position:absolute; bottom:calc(50% + 1.6rem); left:0;width:100%; text-align:center;}
.mth-text{/* Below the line */ position:absolute; top:calc(50% + 2rem); left:0;width:100%; display:flex;flex-direction:column;align-items:center;}
.mth-text h3, .mth-text p{max-width:14rem;}
/* Tick — alternates above / below the horizontal line via :nth-child */
.mth-tick{position:absolute; left:50%; width:.0625rem; height:1.4rem; background:rgba(255,80,80,.85); box-shadow:0 0 .5rem rgba(255,30,30,.7); margin-left:-.03125rem;}
.mth-item:nth-child(odd)  .mth-tick{top:50%;}
.mth-item:nth-child(even) .mth-tick{top:calc(50% - 1.4rem);}
.mth-text h3{font-family:"Kallisto Heading","Kallisto",sans-serif; font-weight:700; font-size:1.55rem; line-height:1.1; text-transform:none; color:#fff; margin:0 0 .9rem 0; text-shadow:0 0 1rem rgba(0,0,0,.5);}
.mth-text p{font-family:"Kallisto",sans-serif; font-size:.85rem;font-weight:500; line-height:1.55; color:rgba(255,255,255,.78); margin:0; text-wrap:pretty;}
@keyframes mthGlowA{
  0%,100%{transform:translate(0,0) scale(1);opacity:.95;}
  20%{transform:translate(5vw,-4vh) scale(1.18);opacity:1;}
  45%{transform:translate(-4vw,3vh) scale(.88);opacity:.65;}
  70%{transform:translate(3vw,5vh) scale(1.1);opacity:.95;}
  85%{transform:translate(-2vw,-2vh) scale(.95);opacity:.8;}
}
@keyframes mthGlowB{
  0%,100%{transform:translate(0,0) scale(1);opacity:.65;}
  25%{transform:translate(-6vw,4vh) scale(1.22);opacity:.95;}
  55%{transform:translate(7vw,-5vh) scale(.82);opacity:.7;}
  80%{transform:translate(-3vw,6vh) scale(1.05);opacity:.85;}
}
@keyframes mthGlowC{
  0%,100%{transform:translate(0,0) scale(1);opacity:.75;}
  30%{transform:translate(4vw,5vh) scale(.88);opacity:1;}
  60%{transform:translate(-5vw,-4vh) scale(1.2);opacity:.55;}
  85%{transform:translate(3vw,2vh) scale(1.05);opacity:.85;}
}
@keyframes metFlare{
  0%,100%{transform:scale(.7) translate(0,0);opacity:.25;}
  30%{transform:scale(1.25) translate(2vw,-1vh);opacity:.95;}
  50%{transform:scale(.95) translate(-1vw,1vh);opacity:.6;}
  75%{transform:scale(1.4) translate(1vw,2vh);opacity:.85;}
}
/* <=1100px: un-pin and go static — mirrors the homepage's own mobile block */
@media(max-width:1100px){
  .sec-mth{height:auto;padding:0;}
  .mth-pin{position:relative;top:auto;height:auto;overflow:visible;}
  .mth-inner{padding-top:1.5rem !important;padding-bottom:2.5rem;height:auto;}
  .mth-stage{grid-template-columns:1fr;gap:2.5rem;margin-top:1.5rem;}
  .mth-item{height:auto;}
  .mth-num{position:static;bottom:auto;font-size:3rem;}
  .mth-tick{position:static;margin:.4rem auto 1rem;}
  .mth-text{position:static;top:auto;}
  .mth-line-wrap{display:none;}
  .mth-title{font-size:2.2rem;margin-bottom:3rem;}
  .mth-stage{margin-top:2rem;}
}

/* ══════════ IA PAGE — MOBILE/TABLET CORRECTIONS ══════════ */
@media(max-width:60rem){
  /* stats: on mobile the stacked column spans dark->bloom->dark, so black type is
     invisible top and bottom. Flatten the image and go white, like the other pages. */
  .stats-band-overlay{background:rgba(0,0,0,.66) !important;}
  .stat-n{color:#fff;}
  .stat-l{color:rgba(255,255,255,.75);}
  /* CHEVRON HUGS THE TITLE ON MOBILE.
     As a flex row a wrapped 2-line title still occupies the FULL row width (box 207px
     while the text ends at 134px), shoving the chevron to the far right and onto the
     diagonal. Flex cannot shrink a wrapped box to its longest line — so drop out of
     flex here: float the icon, run the title inline, and let the chevron flow inline
     straight after the last word. The slanted rule has no room in a narrow column,
     so it gives way to a straight separator. */
  .acc{--acc-col:auto;}
  .acc-rule{display:none;}
  .acc{border-top:.0625rem solid var(--border-color);}
  .acc-item{border-bottom:.0625rem solid var(--border-color);}
  .acc-q{display:block;gap:0;padding:1.15rem 0;}
  .acc-lastword{white-space:nowrap;}
  .acc-ico{float:left;margin:.05rem .7rem 0 0;}
  .acc-title{display:inline;flex:none;}
  .acc-chev{display:inline-block;vertical-align:-.18em;margin-left:.55rem;}
  .acc-a p{width:auto !important;max-width:none !important;}
}
@media(max-width:40rem){
  /* .mth-title was the only heading with no ladder entry: 2.2rem = 35.2px, clipping
     by 109px at 320. Everything else already steps to 2rem here. */
  .mth-sublabel{display:none;}
  /* método heading was too airy on mobile: compress the label device (height 3.75->2.75rem)
     and recompute the 40deg diagonal so it still meets the lower rule (drop 2.75rem ->
     width 2.75/sin40=4.28rem, run 4.28*cos40=3.28rem -> line-right left 12+3.28=15.28rem).
     Scoped to .sec-mth so the FAQ label keeps its size. Then pull the title up close. */
  .mth-inner{padding-top:.5rem !important;}
  .sec-mth .heading-border-wrapper{height:2.75rem;margin-bottom:.1rem;}
  .sec-mth .border-lines{height:2.75rem;}
  .sec-mth .heading-content{top:.85rem;}
  .sec-mth .line-diagonal{width:4.28rem;}
  .sec-mth .line-right{left:15.28rem;}
  .mth-title{font-size:2rem;margin-top:.1rem;margin-bottom:2.4rem;}
  .mth-stage{margin-top:1rem;}
  /* the lifted homepage padding is 2.6rem a side — 83px of a 320px screen */
  .mth-inner{padding-left:1.5rem !important;padding-right:1.5rem !important;}
  .mth-num{font-size:2.6rem;}
  /* panel meta sat in a row: two label+value pairs will not fit 272px */
  .panel-meta{flex-direction:column;gap:1.1rem;margin-top:1.6rem;}
  .split-panel{padding:1.25rem;gap:1.5rem;}
  .split-panel-media{min-height:12rem;}
  .stats-band{min-height:auto;}
  .stats-band-inner{padding:3.5rem 1.5rem;}
}
@media(max-width:24rem){
  .mth-title{font-size:1.55rem;}
  .mth-num{font-size:2.3rem;}
}

/* extra air after the pinned steps, desktop only — the section that follows the
   scroll-jack needs more separation than the standard 5.5rem rhythm gives it */
@media(min-width:1100.02px){
  .sec-mth + .section{padding-top:11rem;}
}
