/* ---------- Fonts (latin subsets, self-hosted) ---------- */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("/assets/fonts/bricolage-grotesque-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/assets/fonts/geist-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url("/assets/fonts/geist-mono-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Base ---------- */
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:#FAFBFC}
.mana{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
.mana *{box-sizing:border-box}
.mana ::selection{background:var(--mana);color:#0D1117}
a{color:#0D1117;text-decoration:none}
a:hover{color:#0D1117}
.mana a:focus-visible,.mana button:focus-visible{outline:2px solid #0D1117;outline-offset:4px;border-radius:6px}
.d{font-family:"Bricolage Grotesque",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-optical-sizing:auto}
.mono{font-family:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.wrap{width:100%;max-width:1360px;margin-inline:auto;padding-inline:clamp(20px,4vw,56px)}
.mask{display:inline-block;overflow:hidden;vertical-align:top;padding:.12em .04em .22em;margin:-.12em -.04em -.22em}
.acc-a{position:relative;display:inline-block}
.acc{position:absolute;left:.2em;top:.07em;width:.11em;height:.24em;border-radius:.05em;background:var(--mana);transform:rotate(38deg);transform-origin:50% 100%}
.nav-links{display:flex;align-items:center;gap:36px}
.ulink{background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:3px;transition:background-size .6s cubic-bezier(.16,1,.3,1)}
.ulink:hover{background-size:100% 1px}
.btn .bi{transition:transform .6s cubic-bezier(.16,1,.3,1)}
.btn:hover .bi{transform:rotate(-45deg)}
.work{display:grid;grid-template-columns:minmax(0,1fr);gap:64px 32px;align-items:start}
.ar-wide{aspect-ratio:4/3}
.ar-43{aspect-ratio:4/3}
.ar-45{aspect-ratio:4/5}
.card .arrow{transition:background-color .35s ease,border-color .35s ease}
.card:hover .arrow{background:var(--mana);border-color:var(--mana)}
.svc{transition:background-color .45s ease}
.svc:hover{background:color-mix(in oklch,var(--mana) 12%,#FFFFFF)}
.cursor{position:fixed;left:0;top:0;width:0;height:0;z-index:60;pointer-events:none;opacity:0}
.blob{position:absolute;left:-44px;top:-44px;width:88px;height:88px;border-radius:50%;background:var(--mana);display:grid;place-items:center;transform:scale(.16)}
.cursor-label{opacity:0}
.progress{transform:scaleX(0);transform-origin:0 50%}
.tilt-wrap{perspective:1100px}

/* ---------- Projects carousel ---------- */
.reel{--h:clamp(220px,26vw,380px);--gap:clamp(16px,2vw,28px);--edge:clamp(20px,4vw,56px);position:relative;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.reel::-webkit-scrollbar{display:none}
.reel-track{display:flex;gap:var(--gap);width:max-content;padding-inline:var(--edge)}
.reel-item{flex:none;display:block;width:calc(var(--h) * 4 / 3);color:#0D1117;scroll-snap-align:start;scroll-margin-inline:var(--edge);-webkit-user-drag:none;user-select:none}
.reel-item[data-tall]{width:calc(var(--h) * 4 / 5)}
.reel-media{position:relative;overflow:hidden;height:var(--h);width:100%;border-radius:18px;container-type:inline-size}
.reel.is-live{overflow:hidden;scroll-snap-type:none;cursor:grab;touch-action:pan-y;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--edge),#000 calc(100% - var(--edge)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--edge),#000 calc(100% - var(--edge)),transparent 100%)}
.reel.is-live .reel-track{padding-inline:0;will-change:transform}
.reel.is-dragging{cursor:grabbing}
.reel.is-dragging .reel-item{pointer-events:none}
.reel-btn{flex:none;width:48px;height:48px;padding:0;border-radius:50%;border:1px solid #D5DBE2;background:transparent;color:#0D1117;display:grid;place-items:center;cursor:pointer;transition:background-color .35s ease,border-color .35s ease}
.reel-btn:hover{background:var(--mana);border-color:var(--mana)}

/* ---------- Rubros: shared ---------- */
.lbl{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#5A6472}
.pill-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:44px;padding:0 20px;border-radius:999px;border:1px solid #D5DBE2;background:transparent;color:#0D1117;font:500 15px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background-color .35s ease,border-color .35s ease}
.pill-btn:hover{background:var(--mana);border-color:var(--mana)}
.sk{display:inline-block;height:.78em;border-radius:.14em;vertical-align:middle;background:linear-gradient(90deg,#EDF0F4 0,#F7F8FA 50%,#EDF0F4 100%);background-size:200% 100%;animation:shimmer 1.4s linear infinite}
@keyframes shimmer{to{background-position:-200% 0}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes blink{50%{opacity:.35}}

/* Mini mockup of a template, drawn in its colors */
.mk{position:relative;container-type:inline-size;aspect-ratio:4/3;overflow:hidden;border-radius:14px;background:color-mix(in oklch,var(--mk-c) 18%,#FFFFFF)}
.mk s,.mk em,.mk u,.mk i,.mk b{display:block;text-decoration:none;font-style:normal}
.mk-win{position:absolute;left:7%;right:7%;top:9%;bottom:0;display:flex;flex-direction:column;overflow:hidden;background:#FFFFFF;border-radius:2.4cqw 2.4cqw 0 0;box-shadow:0 3cqw 8cqw -3cqw rgba(13,17,23,.28)}
.mk-bar{flex:none;display:flex;align-items:center;gap:1.1cqw;height:5cqw;padding:0 2.6cqw;border-bottom:1px solid #EEF1F4}
.mk-bar i{width:1.2cqw;height:1.2cqw;border-radius:50%;background:#E3E7EC}
.mk-nav{flex:none;display:flex;align-items:center;gap:2.2cqw;padding:2.4cqw 4cqw}
.mk-nav b{width:3cqw;height:3cqw;border-radius:.8cqw;background:var(--mk-c)}
.mk-nav s{width:6cqw;height:.9cqw;border-radius:1cqw;background:#E3E7EC}
.mk-nav b+s{margin-left:auto}
.mk-nav em{width:10cqw;height:3.4cqw;border-radius:3cqw;background:var(--mk-k)}
.mk-hero{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:1.6cqw;margin:0 4cqw;padding:4cqw;border-radius:2cqw;overflow:hidden}
.mk-hero strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:88%;font-size:6.2cqw;line-height:1;font-weight:500;letter-spacing:-.045em}
.mk-hero u{width:9cqw;height:.9cqw;border-radius:1cqw;background:var(--mk-c)}
.mk-hero s{width:70%;height:.9cqw;border-radius:1cqw;background:#E6EAEF}
.mk-hero s.w6{width:52%}
.mk-hero em{width:16cqw;height:3.8cqw;margin-top:1cqw;border-radius:3cqw;background:var(--mk-c)}
.mk-split{flex-direction:row;align-items:stretch;gap:3cqw;padding:0 0 3cqw}
.mk-split .mk-copy{flex:1.1;display:flex;flex-direction:column;justify-content:center;gap:1.6cqw;min-width:0}
.mk-split strong{color:#0D1117;max-width:100%}
.mk-pic{position:relative;flex:1;overflow:hidden;border-radius:1.6cqw;background:linear-gradient(160deg,color-mix(in oklch,var(--mk-c) 50%,#FFFFFF),var(--mk-c))}
.mk-pic i{position:absolute;bottom:0;border-radius:.6cqw .6cqw 0 0;background:rgba(255,255,255,.38)}
.mk-pic i:nth-child(1){left:12%;width:26%;height:55%}
.mk-pic i:nth-child(2){left:44%;width:30%;height:78%;background:rgba(255,255,255,.55)}
.mk-pic i:nth-child(3){left:auto;right:12%;top:14%;bottom:auto;width:5cqw;height:5cqw;border-radius:50%;background:#FFFFFF}
.mk-bold{align-items:center;text-align:center;background:var(--mk-c);color:var(--mk-on)}
.mk-bold u{background:var(--mk-on);opacity:.45}
.mk-pills{display:flex;gap:1.4cqw}
.mk-bold .mk-pills em{background:var(--mk-on)}
.mk-bold .mk-pills em.ghost{background:transparent;box-shadow:inset 0 0 0 .3cqw var(--mk-on);opacity:.6}
.mk-dark{background:var(--mk-k);color:#FFFFFF}
.mk-dark s{background:rgba(255,255,255,.2)}
.mk-dark .mk-orb{position:absolute;right:-8%;top:-34%;width:46%;aspect-ratio:1/1;border-radius:50%;border:1.6cqw solid var(--mk-c);opacity:.75;background:transparent}
.mk-row{flex:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2cqw;height:13cqw;padding:2.6cqw 4cqw 0}
.mk-row span{border-radius:1.4cqw 1.4cqw 0 0;background:#F1F3F6}
.mk-cards span{background:color-mix(in oklch,var(--mk-c) 14%,#FFFFFF)}

/* Rubro rows (home, /rubros/ and "otros rubros") */
.rb-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px 48px;margin-bottom:clamp(40px,5vw,72px)}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips[hidden]{display:none}
.chip{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 7px 0 16px;border-radius:999px;border:1px solid #D5DBE2;background:transparent;color:#0D1117;font:500 14px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background-color .35s ease,border-color .35s ease,color .35s ease}
.chip span{display:grid;place-items:center;min-width:26px;height:26px;padding:0 7px;border-radius:999px;background:#EDF0F4;font-size:11px;transition:background-color .35s ease}
.chip:hover{border-color:#0D1117}
.chip[aria-pressed="true"]{background:#0D1117;border-color:#0D1117;color:#FFFFFF}
.chip[aria-pressed="true"] span{background:var(--mana);color:#0D1117}
.rb-list{list-style:none;margin:0;padding:0;border-bottom:1px solid #E3E7EC}
.rb-item{border-top:1px solid #E3E7EC}
.rb-row{position:relative;isolation:isolate;display:grid;grid-template-columns:56px minmax(0,1fr) auto auto 48px;align-items:center;gap:8px 28px;padding:clamp(22px,2.6vw,34px) 16px;color:#0D1117}
.rb-row::before{content:"";position:absolute;inset:0;z-index:-1;background:color-mix(in oklch,var(--rb-c,var(--mana)) 13%,#FFFFFF);transform:scaleY(0);transform-origin:50% 100%;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.rb-row:hover::before,.rb-row:focus-visible::before{transform:scaleY(1)}
.rb-num{align-self:start;padding-top:.7em;font-size:13px;color:#5A6472}
.rb-main{display:flex;flex-direction:column;gap:10px;min-width:0}
.rb-name{display:block;font-size:clamp(28px,4.2vw,60px);line-height:1;font-weight:500;letter-spacing:-.045em;text-wrap:balance}
.rb-cat{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#5A6472}
.rb-dots{display:flex;padding-left:6px}
.rb-dots i{width:20px;height:20px;margin-left:-6px;border-radius:50%;border:2px solid #FAFBFC}
.rb-count{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#5A6472;white-space:nowrap}
.rb-arrow,.pl-card .arrow{flex:none;width:48px;height:48px;border-radius:50%;border:1px solid #D5DBE2;display:grid;place-items:center;color:#0D1117;transition:background-color .35s ease,border-color .35s ease}
.rb-row:hover .rb-arrow,.pl-card:hover .arrow{background:var(--mana);border-color:var(--mana)}
.rb-strip{display:none}
.rb-skel{position:relative;height:clamp(96px,9vw,128px);border-top:1px solid #E3E7EC}
.rb-skel::after{content:"";position:absolute;left:72px;top:50%;width:min(52%,520px);height:clamp(24px,3vw,44px);transform:translateY(-50%);border-radius:10px;background:linear-gradient(90deg,#EDF0F4 0,#F7F8FA 50%,#EDF0F4 100%);background-size:200% 100%;animation:shimmer 1.4s linear infinite}
.rb-error{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:32px 16px;border-top:1px solid #E3E7EC;font-size:17px;color:#3D4550}
.rb-error p,.rb-empty{margin:0}
.rb-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 32px;margin-top:28px;font-size:16px;color:#3D4550}
.rb-foot[hidden],.rb-more[hidden]{display:none}
.rb-group+.rb-group{margin-top:clamp(56px,6vw,96px)}
.rb-group .rb-cat{display:none}
.rb-group-head{display:flex;justify-content:space-between;gap:16px;padding-bottom:16px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#5A6472}
.rb-float{position:fixed;left:0;top:0;z-index:55;width:360px;height:270px;pointer-events:none;will-change:transform}
.rb-fan{position:relative;width:100%;height:100%}
.rb-card{position:absolute;inset:0;overflow:hidden;border-radius:14px;background:#FFFFFF;box-shadow:0 0 0 1px rgba(13,17,23,.06),0 30px 60px -24px rgba(13,17,23,.42)}
.rb-card>.mk{position:absolute;inset:0;aspect-ratio:auto;border-radius:0;transition:opacity .6s ease}

/* Live preview (vitrina.js): the real site, scaled into its box, over the drawing until it has loaded */
.pv-frame{position:absolute;left:0;top:0;border:0;background:#FFFFFF;transform-origin:0 0;pointer-events:none;opacity:0;transition:opacity .8s cubic-bezier(.16,1,.3,1)}
.is-ready>.pv-frame{opacity:1}
.is-ready>.mk{opacity:0}

/* Rubro page: hero */
.rh{padding-top:clamp(36px,6vw,96px);padding-bottom:clamp(56px,7vw,104px)}
.rh-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#5A6472}
.crumbs{display:flex;align-items:center;gap:10px;margin:0}
.crumbs a{color:#5A6472;transition:color .3s ease}
.crumbs a:hover{color:#0D1117}
.rh-for{display:inline-flex;align-items:center;gap:10px;height:34px;margin:clamp(24px,3vw,40px) 0 0;padding:0 14px;border-radius:999px;background:#0D1117;color:#FFFFFF;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.rh-for[hidden]{display:none}
.rh-for i{width:7px;height:7px;border-radius:50%;background:var(--mana)}
.rh-title{margin:clamp(24px,3.4vw,48px) 0 0;font-size:clamp(44px,10.4vw,156px);line-height:.92;letter-spacing:-.05em;font-weight:500;color:#0D1117}
.rh-title.is-long{font-size:clamp(40px,7.4vw,116px)}
.rh-line{display:block}
.rh-title .w{display:inline-block}
.rh-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px 48px;margin-top:clamp(32px,4.4vw,64px)}
.rh-lead{margin:0;max-width:520px;font-size:clamp(17px,1.35vw,19px);line-height:1.55;color:#3D4550;text-wrap:pretty}
.rh-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px}
.rh-ctas [hidden]{display:none!important}
.share-btn{display:inline-flex;align-items:center;gap:8px;padding:0;border:0;background:none;color:#0D1117;font:500 16px/1.2 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer}

/* Rubro page: live designs */
.pl-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(56px,6vw,96px) clamp(24px,3vw,40px)}
.pl-card{display:block;color:#0D1117}
.pl-shot{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:16/10;border-radius:20px;background:color-mix(in oklch,var(--mk-c) 16%,#FFFFFF)}
.pl-wide .pl-shot{aspect-ratio:16/9}
.pl-media{position:absolute;inset:0}
.pl-skel{position:absolute;inset:0;aspect-ratio:auto;border-radius:0;transition:opacity .6s ease}
.pl-skel .mk-win{left:12%;right:12%;top:12%}
.pl-info{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-top:22px}
.pl-text{display:flex;flex-direction:column;gap:8px;min-width:0}
.pl-num{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;font-size:12px;letter-spacing:.06em;color:#5A6472}
.pl-badge{display:inline-flex;align-items:center;gap:7px;text-transform:uppercase;font-size:11px;letter-spacing:.08em;opacity:0;transition:opacity .5s ease}
.pl-badge i{width:6px;height:6px;border-radius:50%;background:#16A34A;animation:blink 1.6s ease-in-out infinite}
.pl-card:has(.is-ready) .pl-badge{opacity:1}
.pl-title{margin:0;font-size:clamp(28px,2.8vw,40px);line-height:1.04;font-weight:500;letter-spacing:-.035em}
.pl-detail{margin:0;max-width:540px;font-size:16px;line-height:1.55;color:#3D4550;text-wrap:pretty}
.pl-for{margin:2px 0 0;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#5A6472}
.pl-side{flex:none;display:flex;align-items:center;gap:16px}
.pl-sw{display:flex;padding-left:5px}
.pl-sw i{width:18px;height:18px;margin-left:-5px;border-radius:50%;border:2px solid #FAFBFC}
.pl-skeleton{aspect-ratio:16/10;border-radius:20px;background:linear-gradient(90deg,#EDF0F4 0,#F7F8FA 50%,#EDF0F4 100%);background-size:200% 100%;animation:shimmer 1.4s linear infinite}

/* Rubro page: what every design brings */
.bn{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));gap:0 clamp(24px,3vw,40px);border-top:1px solid #E3E7EC}
.bn-item{display:flex;flex-direction:column;gap:12px;padding:32px 0;border-bottom:1px solid #E3E7EC}
.bn-item h3{margin:0;font-size:clamp(22px,1.9vw,28px);line-height:1.1;font-weight:500;letter-spacing:-.03em}
.bn-item p{margin:0;font-size:16px;line-height:1.55;color:#3D4550;text-wrap:pretty}

/* Viewer */
html.vw-lock{overflow:hidden}
html.vw-covered header,html.vw-covered main,html.vw-covered footer,html.vw-covered .rb-float{visibility:hidden}
.vw{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;background:#FAFBFC}
.vw[hidden]{display:none}
.vw-bar{flex:none;display:flex;align-items:center;gap:12px 16px;height:68px;padding:0 clamp(12px,2vw,24px);border-bottom:1px solid #E3E7EC;background:#FAFBFC}
.vw-btn{flex:none;width:44px;height:44px;padding:0;border-radius:50%;border:1px solid #D5DBE2;background:transparent;color:#0D1117;display:grid;place-items:center;cursor:pointer;transition:background-color .35s ease,border-color .35s ease}
.vw-btn:hover{background:var(--mana);border-color:var(--mana)}
.vw-btn[hidden]{display:none}
.vw-title{display:flex;flex-direction:column;gap:3px;min-width:0;margin-right:auto}
.vw-title .mono{font-size:11px;letter-spacing:.08em;color:#5A6472}
.vw-title strong{overflow:hidden;font-size:20px;font-weight:500;letter-spacing:-.03em;white-space:nowrap;text-overflow:ellipsis}
.vw-devices{flex:none;display:flex;padding:4px;border-radius:999px;background:#EDF0F4}
.vw-devices button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:#5A6472;font:500 14px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background-color .3s ease,color .3s ease,box-shadow .3s ease}
.vw-devices button[aria-pressed="true"]{background:#FFFFFF;color:#0D1117;box-shadow:0 1px 3px rgba(13,17,23,.14)}
.vw-nav{flex:none;display:flex;gap:8px}
.vw-cta{flex:none;display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 6px 0 18px;border-radius:999px;background:var(--mana);color:#0D1117;font-size:15px;font-weight:500;white-space:nowrap}
.vw-cta .bi{width:32px;height:32px;border-radius:50%;background:#0D1117;color:#FFFFFF;display:grid;place-items:center}
.vw-stage{position:relative;flex:1;min-height:0;display:grid;place-items:center;overflow:hidden;background:#EDF0F4}
.vw-device{position:relative;width:100%;height:100%;overflow:hidden;background:#FFFFFF;transition:width .7s cubic-bezier(.16,1,.3,1),height .7s cubic-bezier(.16,1,.3,1),border-radius .7s cubic-bezier(.16,1,.3,1),box-shadow .7s ease}
.vw[data-device="mobile"] .vw-device{width:390px;height:min(844px,calc(100% - 56px));border-radius:42px;box-shadow:0 0 0 10px #0D1117,0 40px 80px -30px rgba(13,17,23,.5)}
.vw-device iframe{display:block;width:100%;height:100%;border:0;opacity:0;transition:opacity .5s ease}
.vw.is-ready .vw-device iframe{opacity:1}
.vw-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#5A6472;pointer-events:none}
.vw-loading[hidden]{display:none}
.vw-spin{width:18px;height:18px;border-radius:50%;border:2px solid #D5DBE2;border-top-color:#0D1117;animation:spin .8s linear infinite}
.vw-toast{position:absolute;left:50%;bottom:24px;z-index:2;display:flex;align-items:flex-start;gap:12px;width:min(560px,calc(100% - 32px));padding:16px 18px;border-radius:18px;background:#0D1117;color:#FFFFFF;font-size:15px;line-height:1.45;box-shadow:0 24px 50px -20px rgba(13,17,23,.6);opacity:0;transform:translate(-50%,20px);pointer-events:none;transition:opacity .4s ease,transform .55s cubic-bezier(.16,1,.3,1)}
.vw-toast.is-on{opacity:1;transform:translate(-50%,0)}
.vw-toast strong{display:block;font-weight:500}
.vw-toast q{display:block;margin-top:6px;color:#C9D1DA}
.vw-toast-dot{flex:none;width:8px;height:8px;margin-top:7px;border-radius:50%;background:#25D366}

@media (max-width:760px){.nav-links{display:none}.reel-hint{display:none}}
@media (max-width:760px),(hover:none){
.rb-row{grid-template-columns:32px minmax(0,1fr) 44px;gap:8px 14px;padding-inline:4px}
.rb-dots,.rb-count{display:none}
.rb-arrow{width:44px;height:44px}
.rb-strip{grid-column:2/-1;display:flex;gap:10px;margin-top:10px;overflow-x:auto;scrollbar-width:none}
.rb-strip::-webkit-scrollbar{display:none}
.rb-mini{flex:none;width:136px;border-radius:10px}
}
@media (max-width:760px){
.chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * clamp(20px,4vw,56px));padding-inline:clamp(20px,4vw,56px)}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none}
.vw-devices{display:none}
.vw[data-device] .vw-device{width:100%;height:100%;border-radius:0;box-shadow:none}
.vw-title strong{font-size:17px}
}
@media (max-width:480px){.vw-cta{display:none}}
@media (max-width:600px){.pl-shot,.pl-wide .pl-shot{aspect-ratio:4/5}.pl-side .pl-sw{display:none}}
@media (min-width:900px){.pl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pl-wide{grid-column:1/-1}}
@media (min-width:900px){
.work{grid-template-columns:repeat(12,minmax(0,1fr));gap:112px 40px}
.c12{grid-column:span 12}
.c7{grid-column:span 7}
.c5{grid-column:span 5}
.lower{margin-top:180px}
.ar-wide{aspect-ratio:2/1}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ulink,.btn .bi,.svc,.card .arrow,.reel-btn,.rb-row::before,.rb-arrow,.pl-card .arrow,.chip,.vw-device,.vw-toast{transition:none}.sk,.rb-skel::after,.pl-skeleton,.pl-badge i{animation:none}}

/* ---------- Hablemos: the contact popup (hablemos.js) ---------- */
html.hb-lock{overflow:hidden}
html.hb-lock body{padding-right:var(--hb-sb,0)}
.hb{--e:cubic-bezier(.16,1,.3,1);--pop:cubic-bezier(.34,1.56,.64,1);--ink:#0D1117;--muted:#5A6472;--glass:rgba(255,255,255,.62);--edge:rgba(13,17,23,.09);position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:clamp(12px,3vw,32px);color:var(--ink)}
.hb[hidden]{display:none}
.hb-scrim{position:absolute;inset:0;background:rgba(13,17,23,.38);-webkit-backdrop-filter:blur(10px) saturate(1.3);backdrop-filter:blur(10px) saturate(1.3)}
.hb-orbs{position:absolute;inset:-10%;pointer-events:none;transform:translate3d(calc(var(--px,0) * -40px),calc(var(--py,0) * -40px),0);transition:transform 1.4s var(--e)}
.hb-orbs i{position:absolute;border-radius:50%;will-change:transform}
.hb-orbs i:nth-child(1){left:6%;top:4%;width:48vmax;height:48vmax;background:radial-gradient(closest-side,color-mix(in oklch,var(--mana) 90%,#FFFFFF),transparent);animation:hb-drift-a 19s ease-in-out infinite alternate}
.hb-orbs i:nth-child(2){right:2%;bottom:0;width:54vmax;height:54vmax;background:radial-gradient(closest-side,rgba(108,124,255,.62),transparent);animation:hb-drift-b 23s ease-in-out infinite alternate}
.hb-orbs i:nth-child(3){left:38%;top:44%;width:34vmax;height:34vmax;background:radial-gradient(closest-side,rgba(126,227,203,.7),transparent);animation:hb-drift-c 16s ease-in-out infinite alternate}
@keyframes hb-drift-a{to{transform:translate(14vmax,10vmax) scale(1.15)}}
@keyframes hb-drift-b{to{transform:translate(-16vmax,-8vmax) scale(.9)}}
@keyframes hb-drift-c{to{transform:translate(-10vmax,-14vmax) scale(1.2)}}

.hb-panel{position:relative;display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);width:min(1120px,100%);height:min(780px,100%);overflow:hidden;border-radius:34px;background:linear-gradient(140deg,rgba(255,255,255,.8),rgba(255,255,255,.55));-webkit-backdrop-filter:blur(30px) saturate(1.8);backdrop-filter:blur(30px) saturate(1.8);border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 1px rgba(13,17,23,.05),0 60px 140px -40px rgba(13,17,23,.6)}
.hb-panel::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(600px circle at 100% 0%,rgba(255,255,255,.55),transparent 55%)}

/* Side: a dark glass card with the steps, each one filling with its answer */
.hb-side{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;gap:28px;margin:10px;padding:26px 22px 22px;border-radius:26px;color:#FFFFFF;background:linear-gradient(165deg,rgba(13,17,23,.9),rgba(22,30,42,.78));-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 24px 50px -24px rgba(13,17,23,.7)}
.hb-side::before{content:"";position:absolute;z-index:-1;right:-40%;top:-20%;width:90%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,color-mix(in oklch,var(--mana) 55%,transparent),transparent);opacity:.6;animation:hb-drift-c 14s ease-in-out infinite alternate}
.hb-side-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.hb-logo{font-size:28px;font-weight:600;letter-spacing:-.055em;line-height:1}
.hb-logo .acc{transition:transform .6s var(--pop)}
.hb-side-top:hover .hb-logo .acc{transform:rotate(-20deg) translateY(-.06em)}
.hb-tag{padding:6px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.hb-side-body{flex:1;min-height:0;overflow:auto;scrollbar-width:none}
.hb-side-lbl{margin:0 0 14px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.hb-rail{position:relative;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.hb-rail::before,.hb-rail-line{content:"";position:absolute;left:19px;top:28px;width:2px;border-radius:2px}
.hb-rail::before{bottom:28px;background:rgba(255,255,255,.1)}
.hb-rail-line{z-index:0;height:calc((100% - 56px) * var(--rail,0));background:linear-gradient(var(--mana),color-mix(in oklch,var(--mana) 50%,#FFFFFF));box-shadow:0 0 12px color-mix(in oklch,var(--mana) 60%,transparent);transition:height .9s var(--e)}
.hb-rail-i{position:relative;z-index:1;display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:1px 12px;width:100%;padding:8px 10px 8px 0;border:0;border-radius:16px;background:transparent;color:rgba(255,255,255,.5);font:inherit;text-align:left;cursor:pointer;transition:background-color .3s ease,color .3s ease}
.hb-rail-i:disabled{cursor:default}
.hb-rail-i:not(:disabled):hover{background:rgba(255,255,255,.06);color:#FFFFFF}
.hb-rail-n{grid-row:1/3;position:relative;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:12px;background:#151C27;border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.7);transition:background-color .5s var(--e),border-color .5s,color .5s,box-shadow .5s,transform .6s var(--pop)}
.hb-rail-n>span{grid-area:1/1;transition:opacity .3s,transform .5s var(--pop)}
.hb-rail-n .c{opacity:0;transform:scale(.4) rotate(-90deg);display:grid}
.hb-rail-t{font-size:15px;font-weight:500;letter-spacing:-.01em}
.hb-rail-v{min-height:16px;overflow:hidden;font-size:12.5px;color:rgba(255,255,255,.5);white-space:nowrap;text-overflow:ellipsis}
.hb-rail-i.is-current{color:#FFFFFF}
.hb-rail-i.is-current .hb-rail-n{background:#FFFFFF;border-color:#FFFFFF;color:var(--ink);box-shadow:0 0 0 6px color-mix(in oklch,var(--mana) 30%,transparent);transform:scale(1.04)}
.hb-rail-i.is-done{color:rgba(255,255,255,.85)}
.hb-rail-i.is-done .hb-rail-n{background:var(--mana);border-color:var(--mana);color:var(--ink)}
.hb-rail-i.is-done .hb-rail-n .n{opacity:0;transform:scale(.4)}
.hb-rail-i.is-done .hb-rail-n .c{opacity:1;transform:none}
.hb-rail-i.is-done .hb-rail-v{color:color-mix(in oklch,var(--mana) 70%,#FFFFFF)}
.hb-side-foot{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);font-size:13px;line-height:1.4;color:rgba(255,255,255,.72)}
.hb-side-foot p{margin:0}
.hb-avatars{flex:none;display:flex}
.hb-avatars i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:2px solid #18202C;background:var(--mana);color:var(--ink);font-size:14px;font-weight:600;font-style:normal;transition:transform .5s var(--pop)}
.hb-avatars i+i{margin-left:-10px;background:#FFFFFF}
.hb-side-foot:hover .hb-avatars i:first-child{transform:translateX(-4px) rotate(-8deg)}
.hb-side-foot:hover .hb-avatars i+i{transform:translateX(4px) rotate(8deg)}

/* Main column */
.hb-main{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-width:0;min-height:0}
.hb-top{display:flex;align-items:center;gap:16px;padding:22px 26px 0 30px}
.hb-counter{flex:none;min-width:58px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hb-bar{position:relative;flex:1;height:5px;overflow:hidden;border-radius:99px;background:rgba(13,17,23,.07)}
.hb-bar i{position:absolute;inset:0 auto 0 0;width:calc(var(--prog,0) * 100%);border-radius:inherit;background:linear-gradient(90deg,color-mix(in oklch,var(--mana) 60%,#FFFFFF),var(--mana));transition:width .9s var(--e)}
.hb-bar i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);transform:translateX(-100%)}
.hb-bar.is-advancing i::after{animation:hb-sweep 1s .15s var(--e)}
@keyframes hb-sweep{to{transform:translateX(100%)}}
.hb-x{flex:none;width:44px;height:44px;padding:0;border-radius:50%;border:1px solid var(--edge);background:var(--glass);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.9);transition:transform .5s var(--pop),background-color .3s}
.hb-x:hover{transform:rotate(90deg);background:#FFFFFF}
.hb-x:active{transform:rotate(90deg) scale(.9)}
.hb-stage{position:relative;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding:26px 30px 30px;scrollbar-width:thin;scrollbar-color:rgba(13,17,23,.2) transparent}
.hb-view{min-height:100%}
.hb-foot{display:flex;align-items:center;gap:16px;padding:16px 26px 22px 30px;border-top:1px solid rgba(13,17,23,.06)}
.hb-foot[hidden]{display:none}
.hb-back{flex:none;width:52px;height:52px;padding:0;border-radius:50%;border:1px solid var(--edge);background:var(--glass);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:opacity .3s,transform .5s var(--e),background-color .3s}
.hb-back:hover{background:#FFFFFF}
.hb-back:hover svg{animation:hb-nudge-l .7s var(--e)}
.hb-back.is-hidden{opacity:0;pointer-events:none;transform:translateX(-10px)}
@keyframes hb-nudge-l{40%{transform:translateX(-4px)}}
.hb-enter{margin-left:auto;font-size:12px;color:var(--muted)}
.hb-enter kbd{padding:3px 7px;margin-right:4px;border-radius:7px;border:1px solid var(--edge);background:var(--glass);font:inherit;color:var(--ink);box-shadow:0 1px 0 rgba(13,17,23,.08)}
.mana .hb-next{display:inline-flex;align-items:center;gap:12px;height:56px;padding:0 8px 0 26px;border:0;border-radius:999px;background:var(--mana);color:var(--ink);font:500 16px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;white-space:nowrap;box-shadow:0 10px 30px -12px color-mix(in oklch,var(--mana) 80%,transparent);transition:transform .45s var(--pop),box-shadow .45s var(--e),filter .3s}
.hb-next .bi{width:40px;height:40px;border-radius:50%;background:var(--ink);color:#FFFFFF;display:grid;place-items:center;overflow:hidden}
.hb-next:hover{box-shadow:0 16px 36px -12px color-mix(in oklch,var(--mana) 90%,transparent)}
.hb-next:hover .bi svg{animation:hb-nudge-r .7s var(--e)}
.hb-next:active{transform:scale(.96)}
.hb-foot .hb-next:not(.is-ready){filter:saturate(.55) brightness(1.06)}
@keyframes hb-nudge-r{40%{transform:translateX(5px)}}
.hb-next.is-sending{pointer-events:none}
.hb-next.is-sending .bi svg{display:none}
.hb-next.is-sending .bi::after{content:"";width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.3);border-top-color:#FFFFFF;animation:spin .7s linear infinite}

/* Step content */
.hb-head{margin-bottom:26px}
.hb-eyebrow{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hb-title{margin:12px 0 0;font-size:clamp(30px,3.7vw,50px);line-height:1;letter-spacing:-.045em;font-weight:500;text-wrap:balance}
.hb-w{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em .02em .12em;margin:-.04em -.02em -.12em}
.hb-w>span{display:inline-block}
.hb-sub{margin:12px 0 0;max-width:540px;font-size:16px;line-height:1.5;color:#3D4550;text-wrap:pretty}
.hb-q{margin:0 0 12px;font-size:15px;font-weight:500}
.hb-q-in{margin-bottom:8px}
.hb-q-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-bottom:12px}
.hb-q-row .hb-q{margin:0}
.hb-opt{margin-left:4px;font-size:12px;font-weight:400;letter-spacing:.02em;color:var(--muted)}
.hb-block{margin-top:28px}
.hb-grid{display:grid;gap:14px}
.hb-grid.two{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.hb-gap{margin-top:14px}
.hb-none{font-size:14px;color:var(--muted)}

/* Tiles */
.hb-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border-radius:24px}
.hb-tiles.is-five{grid-template-columns:repeat(5,minmax(0,1fr))}
.hb-tile{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-height:140px;padding:18px 18px 20px;border-radius:22px;border:1px solid var(--edge);background:var(--glass);color:var(--ink);font:inherit;text-align:left;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(13,17,23,.04);transition:transform .55s var(--e),border-color .3s,background-color .35s,box-shadow .55s var(--e)}
.hb-tile.is-small{min-height:0;padding:16px}
.hb-tile::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),color-mix(in oklch,var(--mana) 32%,transparent),transparent 70%);opacity:0;transition:opacity .35s}
.hb-tile:hover{transform:translateY(-4px);background:rgba(255,255,255,.85);box-shadow:inset 0 1px 0 #FFFFFF,0 20px 40px -22px rgba(13,17,23,.35)}
.hb-tile:hover::before{opacity:1}
.hb-tile:active{transform:translateY(-1px) scale(.98)}
.hb-tile[aria-checked="true"]{border-color:var(--mana);background:color-mix(in oklch,var(--mana) 18%,rgba(255,255,255,.8));box-shadow:0 0 0 3px color-mix(in oklch,var(--mana) 35%,transparent),0 20px 40px -24px color-mix(in oklch,var(--mana) 80%,transparent)}
.hb-tile-ico{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:rgba(13,17,23,.05);transition:transform .7s var(--pop),background-color .35s,color .35s}
.hb-tile.is-small .hb-tile-ico{width:40px;height:40px;border-radius:13px}
.hb-tile:hover .hb-tile-ico{transform:rotate(-10deg) scale(1.08)}
.hb-tile[aria-checked="true"] .hb-tile-ico{background:var(--ink);color:#FFFFFF}
.hb-tile-t{margin-top:auto;font-size:17px;font-weight:500;letter-spacing:-.02em;line-height:1.15}
.hb-tile.is-small .hb-tile-t{font-size:15px}
.hb-tile-d{font-size:13.5px;line-height:1.4;color:var(--muted)}
.hb-key{position:absolute;top:14px;right:14px;min-width:24px;height:24px;padding:0 6px;border-radius:8px;border:1px solid var(--edge);display:grid;place-items:center;font-size:11px;color:var(--muted);background:rgba(255,255,255,.6);transition:opacity .3s,transform .4s var(--pop)}
.hb-check{position:absolute;top:13px;right:13px;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#FFFFFF;display:grid;place-items:center;transform:scale(0);transition:transform .5s var(--pop)}
.hb-tile[aria-checked="true"] .hb-check{transform:scale(1)}
.hb-tile[aria-checked="true"] .hb-key{opacity:0;transform:scale(.5)}

/* Chips: the + turns into a check */
.hb-chips{display:flex;flex-wrap:wrap;gap:8px}
.hb-chip{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;gap:9px;min-height:42px;padding:8px 16px 8px 11px;border-radius:999px;border:1px solid var(--edge);background:var(--glass);color:var(--ink);font:500 14px/1.2 'Geist',ui-sans-serif,system-ui,sans-serif;text-align:left;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.9);transition:background-color .35s,border-color .35s,color .35s,transform .45s var(--pop)}
.hb-chip::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(120px circle at var(--mx,50%) var(--my,50%),color-mix(in oklch,var(--mana) 30%,transparent),transparent 70%);opacity:0;transition:opacity .3s}
.hb-chip:hover{background:rgba(255,255,255,.9);border-color:rgba(13,17,23,.18)}
.hb-chip:hover::before{opacity:1}
.hb-chip:active{transform:scale(.95)}
.hb-pm{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:rgba(13,17,23,.07);transition:background-color .35s,color .35s}
.hb-pm svg path{transition:opacity .25s,transform .45s var(--pop);transform-origin:50% 50%}
.hb-pm .c{opacity:0;transform:scale(.3)}
.hb-chip[aria-pressed="true"],.hb-chip[aria-checked="true"]{background:var(--ink);border-color:var(--ink);color:#FFFFFF}
.hb-chip[aria-pressed="true"]::before,.hb-chip[aria-checked="true"]::before{opacity:0}
.hb-chip[aria-pressed="true"] .hb-pm,.hb-chip[aria-checked="true"] .hb-pm{background:var(--mana);color:var(--ink)}
.hb-chip[aria-pressed="true"] .hb-pm .p,.hb-chip[aria-checked="true"] .hb-pm .p{opacity:0;transform:scale(.3) rotate(90deg)}
.hb-chip[aria-pressed="true"] .hb-pm .c,.hb-chip[aria-checked="true"] .hb-pm .c{opacity:1;transform:none}
.hb-chip.is-free{border-style:dashed}
.hb-ripple{position:absolute;z-index:-1;border-radius:50%;background:currentColor;pointer-events:none}

/* Segmented: a white pill slides to the chosen option */
.hb-seg{position:relative;display:inline-flex;flex-wrap:wrap;max-width:100%;padding:5px;border-radius:24px;background:rgba(13,17,23,.06);box-shadow:inset 0 1px 3px rgba(13,17,23,.08)}
.hb-seg button{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:500 14px/1.2 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:color .35s}
.hb-seg button:hover{color:var(--ink)}
.hb-seg button[aria-checked="true"]{color:var(--ink)}
.hb-seg button svg{transition:transform .5s var(--pop)}
.hb-seg button[aria-checked="true"] svg{transform:scale(1.12) rotate(-6deg)}
.hb-seg-ind{position:absolute;z-index:0;left:0;top:0;border-radius:999px;background:#FFFFFF;box-shadow:0 1px 2px rgba(13,17,23,.1),0 8px 18px -8px rgba(13,17,23,.3);opacity:0;transition:transform .6s var(--e),width .6s var(--e),height .6s var(--e),opacity .3s}
.hb-seg.has-value .hb-seg-ind{opacity:1}
.hb-seg.has-icons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}

/* Fields with floating labels */
.hb-field{position:relative;display:block;min-width:0}
.hb-field[hidden]{display:none}
.hb-input{display:block;width:100%;height:62px;padding:25px 16px 9px;border-radius:18px;border:1px solid rgba(13,17,23,.12);background:var(--glass);color:var(--ink);font:500 16px/1.25 'Geist',ui-sans-serif,system-ui,sans-serif;outline:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.9);transition:border-color .3s,box-shadow .35s var(--e),background-color .3s}
.hb-input:hover{border-color:rgba(13,17,23,.22)}
.hb-input:focus{border-color:var(--mana);background:#FFFFFF;box-shadow:0 0 0 4px color-mix(in oklch,var(--mana) 28%,transparent)}
.hb-label{position:absolute;left:17px;top:21px;max-width:calc(100% - 34px);overflow:hidden;font-size:16px;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;pointer-events:none;transform-origin:0 0;transition:transform .4s var(--e),color .3s}
.hb-input:focus~.hb-label,.hb-input:not(:placeholder-shown)~.hb-label{transform:translateY(-11px) scale(.76);color:#3D4550}
.hb-field.is-req .hb-label::after,[data-req="nombre"] .hb-label::after{content:" *";color:var(--mana)}
.hb-hint{display:block;margin:7px 0 0 4px;font-size:12.5px;color:var(--muted)}
.hb-err{display:block;margin:7px 0 0 4px;font-size:13px;font-weight:500;color:#C42B1C}
.hb-err:empty{display:none}
.is-error .hb-input,.is-error .hb-search .hb-input{border-color:#E5484D;box-shadow:0 0 0 4px rgba(229,72,77,.15)}
.hb-tiles.is-error{box-shadow:0 0 0 2px rgba(229,72,77,.5)}
.hb-ok{position:absolute;right:14px;top:19px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--mana);color:var(--ink);transform:scale(0);transition:transform .5s var(--pop)}
.hb-ok.on{transform:scale(1)}
.hb-phone .hb-input{padding-left:58px}
.hb-phone .hb-label{transform:translateY(-11px) scale(.76)}
.hb-prefix{position:absolute;left:17px;top:29px;font-size:16px;line-height:20px;color:var(--ink)}
.hb-area textarea.hb-input{height:auto;min-height:110px;padding-top:30px;resize:none;line-height:1.5}
.hb-count{position:absolute;right:14px;bottom:10px;font-size:11px;color:var(--muted);transition:color .3s}
.hb-count.is-near{color:#C42B1C}
.hb-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Rubro search */
.hb-search{position:relative}
.hb-search .hb-input{padding-left:46px}
.hb-search .hb-label{left:47px}
.hb-search-ico{position:absolute;left:16px;top:22px;color:var(--muted);transition:color .3s,transform .5s var(--pop)}
.hb-search:focus-within .hb-search-ico{color:var(--ink);transform:scale(1.1) rotate(-8deg)}
.hb-sugs{margin-top:10px}
.hb-sugs .hb-chip{min-height:36px;padding:6px 13px 6px 9px;font-size:13.5px}
.hb-picked{display:flex;align-items:center;gap:12px;height:62px;padding:0 10px 0 18px;border-radius:18px;border:1px solid var(--mana);background:color-mix(in oklch,var(--mana) 16%,rgba(255,255,255,.8));font-size:16px;font-weight:500}
.hb-picked>span:nth-child(2){flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.hb-picked-dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--mana);box-shadow:0 0 0 4px color-mix(in oklch,var(--mana) 30%,transparent)}
.hb-picked-x{flex:none;width:38px;height:38px;padding:0;border-radius:50%;border:0;background:rgba(255,255,255,.7);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform .45s var(--pop),background-color .3s}
.hb-picked-x:hover{background:#FFFFFF;transform:rotate(90deg)}

/* Budget slider */
.hb-range{position:relative;height:48px;margin-top:52px;--f:.5}
.hb-range-track{position:absolute;left:14px;right:14px;top:50%;height:8px;margin-top:-4px;border-radius:99px;background:rgba(13,17,23,.08);box-shadow:inset 0 1px 2px rgba(13,17,23,.1)}
.hb-range-fill{position:absolute;left:0;top:0;bottom:0;width:calc(var(--f) * 100%);border-radius:inherit;background:linear-gradient(90deg,color-mix(in oklch,var(--mana) 45%,#FFFFFF),var(--mana));transition:width .5s var(--e)}
.hb-range-stop{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;border:2px solid rgba(13,17,23,.16);background:#FFFFFF;transition:background-color .4s,border-color .4s,transform .5s var(--pop)}
.hb-range-stop.on{border-color:var(--mana);background:var(--mana)}
.hb-range-knob{position:absolute;top:50%;left:calc(14px + (100% - 28px) * var(--f));width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:#FFFFFF;box-shadow:0 0 0 5px var(--mana),0 10px 24px -6px rgba(13,17,23,.45);pointer-events:none;transition:left .5s var(--e),transform .4s var(--pop),box-shadow .3s}
.hb-range:hover .hb-range-knob{transform:scale(1.08)}
.hb-range:active .hb-range-knob{transform:scale(1.18)}
.hb-range input:focus-visible~.hb-range-knob{box-shadow:0 0 0 5px var(--mana),0 0 0 10px color-mix(in oklch,var(--mana) 30%,transparent)}
.hb-range input{position:absolute;inset:0;z-index:2;width:100%;height:100%;margin:0;opacity:0;cursor:grab}
.hb-range input:active{cursor:grabbing}
.hb-range-bubble{position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);padding:8px 12px;border-radius:12px;background:var(--ink);color:#FFFFFF;font-size:13px;white-space:nowrap;pointer-events:none;transition:left .5s var(--e),background-color .3s}
.hb-range-bubble::after{content:"";position:absolute;left:50%;top:100%;margin-left:-5px;border:5px solid transparent;border-top-color:var(--ink)}
.hb-range.is-untouched .hb-range-bubble{background:rgba(13,17,23,.45)}
.hb-range.is-untouched .hb-range-bubble::after{border-top-color:rgba(13,17,23,.45)}
.hb-range.is-untouched .hb-range-knob{box-shadow:0 0 0 5px rgba(13,17,23,.15),0 10px 24px -6px rgba(13,17,23,.35);animation:hb-breathe 2.2s ease-in-out infinite}
@keyframes hb-breathe{50%{transform:scale(1.12)}}
.hb-range.is-off{opacity:.4;filter:grayscale(1);transition:opacity .4s,filter .4s}
.hb-range-scale{position:relative;height:16px;margin:8px 14px 0;font-size:11px;color:var(--muted)}
.hb-range-scale span{position:absolute;left:calc(var(--k) * 100%);transform:translateX(calc(var(--k) * -100%));white-space:nowrap;transition:color .3s,transform .4s var(--pop)}
.hb-range-scale span.on{color:var(--ink);font-weight:500}
.hb-range.is-untouched .hb-range-fill{opacity:.35}
.hb-range-desc{min-height:1.5em;margin:14px 0 0;font-size:14.5px;color:#3D4550}

/* Review */
.hb-review{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.hb-card{position:relative;isolation:isolate;overflow:hidden;padding:18px 18px 16px;border-radius:22px;border:1px solid var(--edge);background:var(--glass);box-shadow:inset 0 1px 0 rgba(255,255,255,.95);transition:transform .5s var(--e),box-shadow .5s var(--e),background-color .3s}
.hb-card::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),color-mix(in oklch,var(--mana) 22%,transparent),transparent 70%);opacity:0;transition:opacity .35s}
.hb-card:hover{transform:translateY(-2px);background:rgba(255,255,255,.85);box-shadow:inset 0 1px 0 #FFFFFF,0 18px 36px -24px rgba(13,17,23,.4)}
.hb-card:hover::before{opacity:1}
.hb-card:last-child:nth-child(odd){grid-column:1/-1}
.hb-card h3{margin:0;padding-right:84px;font-size:11px;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hb-card dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px 14px;margin:12px 0 0;font-size:14.5px;line-height:1.4}
.hb-card dt{color:var(--muted)}
.hb-card dd{margin:0;overflow-wrap:anywhere;white-space:pre-line}
.hb-edit{position:absolute;top:12px;right:12px;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--edge);background:rgba(255,255,255,.75);color:var(--ink);font:500 12.5px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background-color .3s,border-color .3s,transform .4s var(--pop)}
.hb-card:hover .hb-edit{background:var(--mana);border-color:var(--mana)}
.hb-edit:active{transform:scale(.94)}
.hb-fine{margin:18px 0 0;font-size:13.5px;color:var(--muted)}
.hb-send-error{margin-top:14px;padding:12px 16px;border-radius:16px;border:1px solid rgba(229,72,77,.35);background:rgba(254,242,242,.85);color:#9B1C12;font-size:14px}
.hb-send-error[hidden]{display:none}

/* Consent: the box before sending, what we tell about the data, and the line on the contact step */
.hb-consent{position:relative;display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;align-items:start;margin-top:18px;padding:16px 18px;border-radius:20px;border:1px solid var(--edge);background:var(--glass);font-size:14.5px;line-height:1.5;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.95);transition:border-color .3s,background-color .3s,box-shadow .3s}
.hb-consent:hover{background:rgba(255,255,255,.85)}
.hb-consent input{position:absolute;left:18px;top:18px;width:26px;height:26px;margin:0;opacity:0;cursor:pointer}
.hb-box{width:26px;height:26px;border-radius:8px;border:1.5px solid rgba(13,17,23,.28);background:#FFFFFF;display:grid;place-items:center;color:var(--ink);transition:background-color .3s,border-color .3s,transform .45s var(--pop)}
.hb-box svg{transform:scale(0) rotate(-45deg);transition:transform .45s var(--pop)}
.hb-consent input:checked+.hb-box{background:var(--mana);border-color:var(--mana)}
.hb-consent input:checked+.hb-box svg{transform:none}
.hb-consent input:active+.hb-box{transform:scale(.9)}
.hb-consent input:focus-visible+.hb-box{outline:2px solid var(--ink);outline-offset:3px}
.hb-consent a,.hb-note a,.hb-legal a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.hb-consent .hb-err{grid-column:2;margin:2px 0 0}
.hb-consent.is-error{border-color:#E5484D;box-shadow:0 0 0 4px rgba(229,72,77,.15)}
.hb-legal{margin:12px 2px 0;font-size:12.5px;line-height:1.55;color:var(--muted);text-wrap:pretty}
.hb-legal+.hb-legal{margin-top:8px}
.hb-note{margin:16px 2px 0;font-size:13.5px;color:var(--muted)}

/* Done */
.hb-done{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:100%;padding:24px 8px;text-align:center}
.hb-done .hb-sub{margin-inline:auto}
.hb-done-mark{position:relative;isolation:isolate;width:120px;height:120px;margin-bottom:18px;color:var(--ink)}
.hb-done-mark svg{display:block;overflow:visible}
.hb-done-mark circle{stroke:var(--mana);stroke-dasharray:330;stroke-dashoffset:330;animation:hb-draw 1s .1s var(--e) forwards}
.hb-done-mark path{stroke-dasharray:90;stroke-dashoffset:90;animation:hb-draw .7s .55s var(--e) forwards}
.hb-done-mark::before{content:"";position:absolute;inset:10px;z-index:-1;border-radius:50%;background:color-mix(in oklch,var(--mana) 25%,rgba(255,255,255,.7));transform:scale(0);animation:hb-pop .8s .2s var(--pop) forwards}
@keyframes hb-draw{to{stroke-dashoffset:0}}
@keyframes hb-pop{to{transform:scale(1)}}
.hb-spark{position:absolute;left:50%;top:50%;pointer-events:none}
.hb-done-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 20px;margin-top:26px}
.hb-ghost{height:56px;padding:0 24px;border-radius:999px;border:1px solid var(--edge);background:var(--glass);color:var(--ink);font:500 16px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background-color .3s,transform .4s var(--pop)}
.hb-ghost:hover{background:#FFFFFF}
.hb-ghost:active{transform:scale(.96)}

/* Resume toast */
.hb-toast{position:absolute;left:50%;bottom:96px;z-index:5;display:flex;align-items:center;gap:14px;max-width:calc(100% - 32px);padding:10px 10px 10px 18px;border-radius:999px;background:var(--ink);color:#FFFFFF;font-size:14px;box-shadow:0 20px 40px -16px rgba(13,17,23,.6);transform:translate(-50%,0)}
.hb-toast button{height:34px;padding:0 14px;border-radius:999px;border:0;background:rgba(255,255,255,.12);color:#FFFFFF;font:500 13px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;white-space:nowrap;transition:background-color .3s}
.hb-toast button:hover{background:var(--mana);color:var(--ink)}

.hb button:focus-visible,.hb a:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.hb .hb-input:focus-visible{outline:0}

@media (max-width:980px){
.hb-panel{grid-template-columns:minmax(0,1fr)}
.hb-side{display:none}
.hb-tiles.is-five{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:760px){
.hb{padding:0;place-items:stretch}
.hb-panel{width:100%;height:100%;border-radius:0;border:0}
.hb-top{padding:16px 16px 0 20px}
.hb-stage{padding:22px 20px 24px}
.hb-foot{padding:12px 16px calc(14px + env(safe-area-inset-bottom)) 16px}
.hb-enter{display:none}
.hb-next{margin-left:auto}
.mana .hb-next{height:52px;padding-left:22px}
.hb-tiles,.hb-tiles.is-five{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.hb-tile{min-height:132px;padding:14px;border-radius:18px}
.hb-tile-d{font-size:12.5px}
.hb-key{display:none}
.hb-grid.two,.hb-review{grid-template-columns:minmax(0,1fr)}
.hb-card:last-child:nth-child(odd){grid-column:auto}
.hb-title{font-size:clamp(30px,8.6vw,40px)}
.hb-seg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
.hb-toast{bottom:84px}
.hb-range-scale span:not(:first-child):not(:last-child){display:none}
}
@media (prefers-reduced-motion:reduce){
.hb-orbs,.hb-orbs i,.hb-side::before{animation:none;transition:none}
.hb *,.hb *::before,.hb *::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* ---------- Micro-interactions (micro.js) ---------- */
.mana{--e:cubic-bezier(.16,1,.3,1);--pop:cubic-bezier(.34,1.56,.64,1)}

/* Header: tighter with a shadow once the page scrolls */
.mana header{transition:box-shadow .5s ease,background-color .5s ease}
.mana header>.wrap{transition:height .5s var(--e)}
.mana header.is-scrolled{box-shadow:0 10px 30px -22px rgba(13,17,23,.35)}
.mana header.is-scrolled>.wrap{height:64px!important}

/* Logo: the accent hops */
.mana header a[aria-label^="Maná"]:hover .acc{animation:acc-hop .9s var(--pop)}
@keyframes acc-hop{0%,100%{transform:rotate(38deg)}35%{transform:translateY(-.14em) rotate(-24deg)}65%{transform:translateY(.02em) rotate(58deg)}}

/* Nav: letters roll up one by one */
.roll{display:inline-flex;vertical-align:top}
.roll-c{display:inline-flex;flex-direction:column;height:1.25em;overflow:hidden;line-height:1.25}
.roll-c>span{display:block;transition:transform .55s var(--e);transition-delay:calc(var(--i) * 18ms)}
.nav-links a:hover .roll-c>span,.nav-links a:focus-visible .roll-c>span{transform:translateY(-100%)}

/* Buttons: a shine crosses on hover, they give a little when pressed, the arrow nudges */
.mana .btn{position:relative;isolation:isolate;overflow:hidden}
.mana .btn::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 28%,rgba(255,255,255,.5) 50%,transparent 72%);transform:translateX(-130%)}
.mana .btn:hover::after{transform:translateX(130%);transition:transform .95s var(--e)}
.mana .btn:not(.hb-next){transition:scale .45s var(--pop)}
.mana .btn:not(.hb-next):active{scale:.96}
.mana .reel-btn,.mana .pill-btn,.mana .vw-btn,.mana .chip{transition:background-color .35s ease,border-color .35s ease,color .35s ease,scale .45s var(--pop)}
.mana .reel-btn:active,.mana .pill-btn:active,.mana .vw-btn:active,.mana .chip:active{scale:.92}
.reel-btn[data-reel-prev]:hover svg{animation:nudge-l .7s var(--e)}
.reel-btn[data-reel-next]:hover svg,.vw-btn[data-vw="next"]:hover svg{animation:nudge-r .7s var(--e)}
.vw-btn[data-vw="prev"]:hover svg{animation:nudge-l .7s var(--e)}
.chip span{transition:background-color .35s ease,scale .45s var(--pop)}
.chip:hover span{scale:1.12}
@keyframes nudge-r{40%{transform:translateX(4px)}}
@keyframes nudge-l{40%{transform:translateX(-4px)}}

/* Sparks from a press */
.burst{position:fixed;z-index:95;width:0;height:0;pointer-events:none}
.burst i{position:absolute;left:0;top:0;width:6px;height:6px;border-radius:50%}

/* "Taking new projects": a tooltip */
.tip{position:relative;cursor:default;outline:0}
.tip::after{content:attr(data-tip);position:absolute;right:0;top:calc(100% + 10px);z-index:5;padding:8px 12px;border-radius:10px;background:#0D1117;color:#FFFFFF;font-size:11px;letter-spacing:.06em;white-space:nowrap;opacity:0;transform:translateY(-6px) scale(.96);transform-origin:100% 0;pointer-events:none;transition:opacity .3s ease,transform .45s var(--pop)}
.tip:hover::after,.tip:focus-visible::after{opacity:1;transform:none}

/* Hero: words lift a little and the highlight grows under "mejores." */
.mana h1 [data-g="word"]{transition:translate .6s var(--e)}
.mana h1 [data-g="word"]:hover{translate:0 -5%}
.mana h1 [data-g="mark"]{transition:height .7s var(--e),bottom .7s var(--e)}
.mana h1:hover [data-g="mark"]{height:.46em!important;bottom:.04em!important}

/* Marquee: the phrase under the pointer turns into an outline and its dot grows */
[data-g="marquee"] .d{transition:color .45s ease,-webkit-text-stroke-color .45s ease;-webkit-text-stroke:1.5px transparent}
[data-g="marquee"] .d:hover{color:transparent;-webkit-text-stroke-color:#0D1117}
[data-g="marquee"] .d+span{transition:scale .6s var(--pop),background-color .4s ease}
[data-g="marquee"] .d:hover+span{scale:1.9}

/* Project cards: lean toward the pointer, with a glare */
.lean{transform:perspective(1400px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .7s var(--e)}
.glare{position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;background:radial-gradient(520px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.42),transparent 46%);opacity:0;transition:opacity .45s ease}
.card:hover .glare{opacity:1}
.card .arrow svg{transition:transform .6s var(--pop)}
.card:hover .arrow svg{transform:scale(1.15)}

/* Services: the number turns into the accent, the row's call to action slides in */
.svc>.mono{transition:color .4s ease,translate .6s var(--e)}
.svc:hover>.mono{color:#0D1117;translate:4px 0}
.svc h3{transition:translate .6s var(--e)}
.svc:hover h3{translate:6px 0}
.svc-cta{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin-top:4px;padding:8px 14px;border-radius:999px;border:1px solid #D5DBE2;font-size:14px;font-weight:500;color:#0D1117;transition:background-color .35s ease,border-color .35s ease,scale .45s var(--pop)}
.svc-cta span{transition:transform .5s var(--e)}
.svc-cta:hover{background:#0D1117;border-color:#0D1117;color:#FFFFFF}
.svc-cta:hover span{transform:translateX(4px)}
.svc-cta:active{scale:.95}
@media (hover:hover) and (pointer:fine){
.svc .svc-cta{opacity:0;translate:0 6px;transition:opacity .4s ease,translate .5s var(--e),background-color .35s ease,border-color .35s ease,scale .45s var(--pop)}
.svc:hover .svc-cta,.svc .svc-cta:focus-visible{opacity:1;translate:0 0}
}

/* Rubros: the swatches fan out, the name slides */
.rb-dots i{transition:margin-left .5s var(--e),scale .5s var(--pop)}
.rb-row:hover .rb-dots i{margin-left:3px}
.rb-row:hover .rb-dots i:nth-child(2){scale:1.1}
.rb-name{transition:translate .6s var(--e)}
.rb-row:hover .rb-name{translate:8px 0}
.rb-num{transition:color .4s ease}
.rb-row:hover .rb-num{color:#0D1117}
.rb-arrow svg{transition:transform .6s var(--pop)}
.rb-row:hover .rb-arrow svg{transform:rotate(-45deg)}

/* Portraits: depth against the tilt */
[data-m="tilt"]>span:first-child{translate:var(--tx,0px) var(--ty,0px);transition:translate .7s var(--e)}
[data-m="tilt"]>span:nth-child(2){translate:calc(var(--tx,0px) * -1.4) calc(var(--ty,0px) * -1.4);transition:translate .7s var(--e),scale .6s var(--pop)}
[data-m="tilt"]:hover>span:nth-child(2){scale:1.4}

/* Contact: "Hablemos." swells like a dock under the pointer, the rings drift */
.lt{display:inline-block;transform-origin:50% 90%;translate:0 calc(var(--l,0) * -0.1em);scale:calc(1 + var(--l,0) * .07);transition:translate .4s var(--e),scale .4s var(--e)}
[data-x="ring"]{translate:calc(var(--cx,0) * 40px) calc(var(--cy,0) * 40px);transition:translate 1.2s var(--e)}
[data-x="ring"]+[data-x="ring"]{translate:calc(var(--cx,0) * -26px) calc(var(--cy,0) * -26px)}
[data-x="contact"]{--cx:0;--cy:0}
.contact-hint{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#0D1117;opacity:.7}

/* Footer: the wordmark wobbles under the pointer, "back to top" points up */
.mana footer [data-g="fl"]{transform-origin:50% 100%}
.mana footer [data-g="fl"]:hover{animation:jelly .9s var(--e)}
.mana footer [data-g="fl"]:hover [data-g="facc"]{animation:acc-hop 1s var(--pop)}
@keyframes jelly{0%,100%{transform:none}25%{transform:scale(1.07,.9)}50%{transform:scale(.95,1.07)}75%{transform:scale(1.02,.98)}}
.mana footer a[href="#top"]:hover svg{animation:hop-up .9s var(--e) infinite}
@keyframes hop-up{40%{transform:translateY(-4px)}}

/* Links with a trailing arrow: the arrow leads */
.rb-foot .ulink,.mana a.ulink[href="/rubros/"]{transition:letter-spacing .5s var(--e),background-size .6s var(--e)}

@media (prefers-reduced-motion:reduce){
.roll-c>span,.lean,.glare,.lt,[data-x="ring"],.svc-cta,.rb-name,.rb-dots i,[data-m="tilt"]>span,.mana .reel-btn,.mana .pill-btn,.mana .vw-btn,.mana .chip,.mana .btn{transition:none!important}
.mana header a:hover .acc,.mana footer [data-g="fl"]:hover,.mana footer a:hover svg,.reel-btn:hover svg,.vw-btn:hover svg{animation:none!important}
.mana .btn:hover::after{transition:none}
}

/* ---------- Legal: footer links, the legal pages (/legal/…) and the cookie notice (legal.js) ---------- */
.legal-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;padding:24px 0;border-top:1px solid #E3E7EC;font-size:14px;color:#5A6472}
.legal-links{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px}
.legal-links a,.legal-links button{color:#3D4550}
.legal-links button{padding:0 0 3px;border:0;background-color:transparent;font:inherit;cursor:pointer}
.legal-links a:hover,.legal-links button:hover{color:#0D1117}
.legal-btns{display:flex;flex-wrap:wrap;gap:10px}
.legal-pill{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:999px;border:1px solid #0D1117;font-size:14px;font-weight:500;color:#0D1117;transition:background-color .35s ease,color .35s ease,scale .45s cubic-bezier(.34,1.56,.64,1)}
.legal-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mana)}
.legal-pill:hover{background:#0D1117;color:#FFFFFF}
.legal-pill:active{scale:.95}
.legal-aaip{margin:0;padding:0 0 32px;max-width:980px;font-size:12px;line-height:1.6;color:#5A6472;text-wrap:pretty}
.legal-aaip a{color:#3D4550;text-decoration:underline;text-underline-offset:2px}

.lg{padding-top:clamp(36px,6vw,96px);padding-bottom:clamp(80px,9vw,144px)}
.lg-title{margin:clamp(24px,3.4vw,48px) 0 0;font-size:clamp(44px,8.6vw,132px);line-height:.92;letter-spacing:-.05em;font-weight:500;color:#0D1117;text-wrap:balance}
.lg-lead{margin:clamp(24px,3vw,40px) 0 0;max-width:640px;font-size:clamp(17px,1.35vw,19px);line-height:1.55;color:#3D4550;text-wrap:pretty}
.lg-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;margin-top:clamp(44px,6vw,96px);padding-top:clamp(28px,4vw,56px);border-top:1px solid #E3E7EC}
.lg-toc ol{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:0 24px;font-size:13px}
.lg-toc a{display:flex;align-items:baseline;gap:10px;padding:7px 0;color:#5A6472;transition:color .3s ease}
.lg-toc a span{flex:none;color:#9AA3AF;transition:color .3s ease}
.lg-toc a:hover,.lg-toc a.is-on{color:#0D1117}
.lg-toc a.is-on span{color:#0D1117}
.lg-toc a.is-on::after{content:"";flex:none;align-self:center;width:6px;height:6px;margin-left:auto;border-radius:50%;background:var(--mana)}
@media (min-width:1000px){
.lg-grid{grid-template-columns:230px minmax(0,1fr);gap:clamp(48px,6vw,112px)}
.lg-toc{position:sticky;top:96px;align-self:start}
.lg-toc ol{grid-template-columns:minmax(0,1fr)}
}
.lg-body{max-width:780px;min-width:0;font-size:17px;line-height:1.7;color:#3D4550;overflow-wrap:break-word}
.lg-body>section{margin-top:clamp(48px,5vw,72px);scroll-margin-top:96px}
.lg-body h2{display:flex;align-items:baseline;gap:14px;margin:0 0 18px;font-size:clamp(26px,2.6vw,36px);line-height:1.1;letter-spacing:-.035em;font-weight:500;color:#0D1117;text-wrap:balance}
.lg-body h2 .mono{flex:none;font-size:13px;letter-spacing:0;font-weight:400;color:#5A6472}
.lg-body h3{margin:28px 0 8px;font-size:18px;line-height:1.3;font-weight:600;letter-spacing:-.01em;color:#0D1117}
.lg-body p{margin:0 0 16px;text-wrap:pretty}
.lg-body ul,.lg-body ol{margin:0 0 16px;padding-left:22px}
.lg-body li{margin:6px 0;padding-left:4px}
.lg-body li::marker{color:#5A6472}
.lg-body a{color:#0D1117;text-decoration:underline;text-decoration-color:color-mix(in oklch,var(--mana) 80%,#0D1117);text-decoration-thickness:1.5px;text-underline-offset:3px;transition:text-decoration-color .3s ease}
.lg-body a:hover{text-decoration-color:#0D1117}
.lg-body strong{font-weight:600;color:#0D1117}
.lg-sum{margin:0;padding:clamp(22px,3vw,32px);border-radius:24px;background:color-mix(in oklch,var(--mana) 13%,#FFFFFF);color:#0D1117}
.lg-sum ul{list-style:none;display:grid;gap:12px;margin:16px 0 0;padding:0;font-size:16px;line-height:1.55}
.lg-sum li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;margin:0;padding:0}
.lg-sum li::before{content:"";width:9px;height:9px;margin-top:.55em;border-radius:50%;background:var(--mana);box-shadow:0 0 0 4px color-mix(in oklch,var(--mana) 25%,transparent)}
.lg-id{display:grid;grid-template-columns:minmax(0,1fr);margin:0 0 16px;border-radius:20px;border:1px solid #E3E7EC;background:#FFFFFF;overflow:hidden}
.lg-id div{display:grid;grid-template-columns:minmax(120px,180px) minmax(0,1fr);gap:4px 16px;padding:14px 18px;border-top:1px solid #EEF1F4}
.lg-id div:first-child{border-top:0}
.lg-id dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#5A6472;padding-top:.35em}
.lg-id dd{margin:0;color:#0D1117;overflow-wrap:anywhere}
@media (max-width:560px){.lg-id div{grid-template-columns:minmax(0,1fr)}}
.lg-table{overflow-x:auto;margin:0 0 16px;border-radius:20px;border:1px solid #E3E7EC;background:#FFFFFF}
.lg-table table{width:100%;min-width:560px;border-collapse:collapse;font-size:15px;line-height:1.5}
.lg-table th,.lg-table td{padding:13px 16px;text-align:left;vertical-align:top;border-top:1px solid #EEF1F4}
.lg-table thead th{border-top:0;font:500 11px/1.3 'Geist Mono',ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:#5A6472;background:#F6F8FA}
.lg-table td:first-child{color:#0D1117;font-family:'Geist Mono',ui-monospace,monospace;font-size:13.5px;white-space:nowrap}
.lg-legend{margin:20px 0 16px;padding:18px 20px;border-left:3px solid var(--mana);border-radius:0 16px 16px 0;background:#F1F4F7;font-size:15px;line-height:1.6;color:#0D1117}
.lg-legend p{margin:0}
.lg-legend p+p{margin-top:10px}
.lg-note{padding:16px 18px;border-radius:16px;border:1px dashed #C9D1DA;font-size:15px;color:#3D4550}
.lg-more{margin-top:clamp(64px,7vw,104px);padding-top:28px;border-top:1px solid #E3E7EC}
.lg-more ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:12px;margin:16px 0 0;padding:0}
.lg-more li{margin:0;padding:0}
.lg-more a{display:flex;align-items:center;justify-content:space-between;gap:12px;height:100%;padding:18px 20px;border-radius:18px;border:1px solid #E3E7EC;background:#FFFFFF;text-decoration:none;font-size:16px;font-weight:500;color:#0D1117;transition:border-color .35s ease,background-color .35s ease}
.lg-more a::after{content:"→";transition:transform .5s cubic-bezier(.16,1,.3,1)}
.lg-more a:hover{border-color:#0D1117}
.lg-more a:hover::after{transform:translateX(4px)}

/* Cookie preferences, inline on /legal/cookies/ */
.ck-panel{margin:0 0 16px;border-radius:20px;border:1px solid #E3E7EC;background:#FFFFFF;overflow:hidden}
.ck-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px;border-top:1px solid #EEF1F4}
.ck-row:first-child{border-top:0}
.ck-row strong{display:block;font-size:16px}
.ck-row p{margin:2px 0 0;font-size:14.5px;line-height:1.5}
.ck-always{flex:none;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#5A6472}
.ck-switch{position:relative;flex:none;width:54px;height:32px;padding:0;border:0;border-radius:999px;background:#D5DBE2;cursor:pointer;transition:background-color .35s ease}
.ck-switch i{position:absolute;left:4px;top:4px;width:24px;height:24px;border-radius:50%;background:#FFFFFF;box-shadow:0 2px 6px rgba(13,17,23,.25);transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.ck-switch[aria-checked="true"]{background:#0D1117}
.ck-switch[aria-checked="true"] i{transform:translateX(22px);background:var(--mana)}
.ck-status{margin:0;padding:12px 20px;border-top:1px solid #EEF1F4;background:#F6F8FA;font-size:12px;letter-spacing:.04em;color:#5A6472}

/* The notice */
.ck{position:fixed;left:clamp(12px,2vw,24px);bottom:clamp(12px,2vw,24px);z-index:45;width:min(440px,calc(100% - 24px));padding:20px 20px 18px;border-radius:24px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(24px) saturate(1.6);backdrop-filter:blur(24px) saturate(1.6);border:1px solid rgba(13,17,23,.08);box-shadow:inset 0 1px 0 #FFFFFF,0 30px 80px -30px rgba(13,17,23,.5);color:#0D1117}
.ck[hidden]{display:none}
.ck-t{display:flex;align-items:center;gap:10px;margin:0;font-size:21px;line-height:1.15;font-weight:500;letter-spacing:-.03em}
.ck-t i{flex:none;width:9px;height:9px;border-radius:50%;background:var(--mana);box-shadow:0 0 0 4px color-mix(in oklch,var(--mana) 28%,transparent)}
.ck-p{margin:8px 0 0;font-size:14px;line-height:1.5;color:#3D4550;text-wrap:pretty}
.ck-p a{color:#0D1117;text-decoration:underline;text-underline-offset:2px}
.ck-now{margin:10px 0 0;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#5A6472}
.ck-now[hidden]{display:none}
.ck-a{display:flex;gap:10px;margin-top:16px}
.ck-a button{flex:1;height:46px;padding:0 14px;border-radius:999px;font:500 15px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background-color .35s ease,border-color .35s ease,color .35s ease,scale .45s cubic-bezier(.34,1.56,.64,1)}
.ck-a button:active{scale:.96}
.ck-no{border:1px solid #C9D1DA;background:transparent;color:#0D1117}
.ck-no:hover{border-color:#0D1117;background:#FFFFFF}
.ck-yes{border:1px solid #0D1117;background:#0D1117;color:#FFFFFF}
.ck-yes:hover{border-color:var(--mana);background:var(--mana);color:#0D1117}
@media (max-width:480px){.ck{padding:18px 16px 16px;border-radius:22px}.ck-a button{font-size:14px}}

/* Botón de arrepentimiento / de baja */
.arr{display:grid;gap:16px;margin:0 0 16px;padding:clamp(20px,3vw,28px);border-radius:24px;border:1px solid #E3E7EC;background:#FFFFFF}
.arr fieldset{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;border:0}
.arr legend{margin-bottom:10px;padding:0;font-size:15px;font-weight:500;color:#0D1117}
.arr-opt{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 18px 8px 14px;border-radius:999px;border:1px solid #D5DBE2;font-size:15px;color:#0D1117;cursor:pointer;transition:background-color .3s ease,border-color .3s ease,color .3s ease}
.arr-opt input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.arr-opt::before{content:"";width:14px;height:14px;border-radius:50%;border:1.5px solid #9AA3AF;transition:border-color .3s ease,box-shadow .3s ease,background-color .3s ease}
.arr-opt:has(input:checked){background:#0D1117;border-color:#0D1117;color:#FFFFFF}
.arr-opt:has(input:checked)::before{border-color:var(--mana);background:var(--mana);box-shadow:inset 0 0 0 3px #0D1117}
.arr-opt:has(input:focus-visible){outline:2px solid #0D1117;outline-offset:3px}
.arr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px}
.arr-field{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500;color:#0D1117}
.arr-field .opt{font-weight:400;color:#5A6472}
.arr-field input,.arr-field textarea{width:100%;min-height:50px;padding:12px 16px;border-radius:14px;border:1px solid #D5DBE2;background:#FAFBFC;font:400 16px/1.4 'Geist',ui-sans-serif,system-ui,sans-serif;color:#0D1117;transition:border-color .3s ease,box-shadow .3s ease,background-color .3s ease}
.arr-field textarea{min-height:96px;resize:vertical}
.arr-field input:focus,.arr-field textarea:focus{outline:0;border-color:#0D1117;background:#FFFFFF;box-shadow:0 0 0 4px color-mix(in oklch,var(--mana) 30%,transparent)}
.arr-field.is-error input{border-color:#E5484D;box-shadow:0 0 0 4px rgba(229,72,77,.15)}
.arr-field [data-arr-err]{font-size:13px;font-weight:500;color:#C42B1C}
.arr-field [data-arr-err]:empty{display:none}
.arr-send{justify-self:start;display:inline-flex;align-items:center;gap:12px;height:54px;padding:0 8px 0 24px;border:0;border-radius:999px;background:#0D1117;color:#FFFFFF;font:500 16px/1 'Geist',ui-sans-serif,system-ui,sans-serif;cursor:pointer}
.arr-send .bi{width:38px;height:38px;border-radius:50%;background:var(--mana);color:#0D1117;display:grid;place-items:center}
.arr-fine{margin:0;font-size:13px;line-height:1.55;color:#5A6472}
.lg-body .arr-fine a{color:#0D1117}
.arr-out{margin:0 0 16px;padding:clamp(20px,3vw,28px);border-radius:24px;background:#0D1117;color:#FFFFFF;scroll-margin-top:96px;outline:0}
.arr-out[hidden]{display:none}
.arr-out .lbl{color:rgba(255,255,255,.6)}
.lg-body .arr-code{display:block;margin:8px 0 6px;font-size:clamp(24px,3vw,34px);letter-spacing:.02em;color:var(--mana)}
.lg-body .arr-out p{color:rgba(255,255,255,.8)}
.arr-out pre{max-height:220px;overflow:auto;margin:0 0 16px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.06);font:400 13px/1.55 'Geist Mono',ui-monospace,monospace;color:rgba(255,255,255,.85);white-space:pre-wrap}
.arr-actions{display:flex;flex-wrap:wrap;gap:10px}
.lg-body .arr-actions a,.arr-actions button{display:inline-flex;align-items:center;height:46px;padding:0 20px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:transparent;color:#FFFFFF;font:500 15px/1 'Geist',ui-sans-serif,system-ui,sans-serif;text-decoration:none;cursor:pointer;transition:background-color .3s ease,color .3s ease,border-color .3s ease}
.lg-body .arr-actions a:first-child{background:var(--mana);border-color:var(--mana);color:#0D1117}
.lg-body .arr-actions a:hover,.arr-actions button:hover{background:#FFFFFF;border-color:#FFFFFF;color:#0D1117}
.arr-actions [hidden]{display:none!important}

@media (prefers-reduced-motion:reduce){.legal-pill,.ck-a button,.ck-switch,.ck-switch i,.lg-more a::after,.arr-opt{transition:none}}