/* ═══════════════════════════════════════════════════════
   INNECTIA — innectia.css
   Portales únicos. Sin plantillas. En 14 días.
═══════════════════════════════════════════════════════ */

:root{
  --bg:#06060B;--bg2:#0A0A12;--bg3:#0F0F1A;--bg4:#14141F;--bg5:#121216;
  --text:#F0EEE7;--text2:#B8B6AF;--text3:#7A7A78;
  --lime:#C8FF3C;--lime1:rgba(200,255,60,.06);--lime2:rgba(200,255,60,.12);--lime3:rgba(200,255,60,.25);
  --red:#FF5E5B;
  --blue:#214EFA;--blue1:rgba(33,78,250,.06);--blue2:rgba(33,78,250,.12);
  --gold:#D6C28C;--gold1:rgba(214,194,140,.06);--gold2:rgba(214,194,140,.12);
  --b0:rgba(255,255,255,.04);--b1:rgba(255,255,255,.08);--b2:rgba(255,255,255,.14);
  --e1:cubic-bezier(0.77,0,0.18,1);--e2:cubic-bezier(0.34,1.56,0.64,1);--e3:cubic-bezier(0.25,0.46,0.45,0.94);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:"Inter",sans-serif;-webkit-font-smoothing:antialiased;cursor:none}
::selection{background:rgba(203,255,77,.2)}

/* ── CURSOR ─────────────────────────────────────────────── */
#cd{position:fixed;width:8px;height:8px;background:var(--lime);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width .15s var(--e2),height .15s var(--e2);mix-blend-mode:difference}
#cr{position:fixed;width:40px;height:40px;border:1px solid rgba(203,255,77,.35);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .25s var(--e2),height .25s var(--e2),border-color .25s}
body.hov #cd{width:14px;height:14px}
body.hov #cr{width:56px;height:56px;border-color:rgba(203,255,77,.7)}
body.clk #cd{width:4px;height:4px}

/* ── TRAIL LETTERS ───────────────────────────────────────── */
.trail-letter{position:fixed;pointer-events:none;z-index:9997;font-family:"Syne",sans-serif;font-size:11px;font-weight:800;color:var(--lime);transform:translate(-50%,-50%);mix-blend-mode:difference;user-select:none}

/* ── SPARKS ──────────────────────────────────────────────── */
.spark{position:fixed;pointer-events:none;z-index:9996;width:4px;height:4px;border-radius:50%;background:var(--lime);animation:sparkA .5s ease-out forwards}
@keyframes sparkA{0%{opacity:1;transform:translate(-50%,-50%) scale(1.5)}100%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(0)}}
.key-float{position:fixed;pointer-events:none;z-index:9996;font-family:"JetBrains Mono",monospace;font-size:14px;color:var(--lime);animation:keyA .8s ease-out forwards;text-transform:uppercase}
@keyframes keyA{0%{opacity:1;transform:translate(-50%,-50%) translateY(0) scale(1.3)}100%{opacity:0;transform:translate(-50%,-50%) translateY(-55px) scale(.6)}}

/* ── TYPEWRITER CURSOR ───────────────────────────────────── */
.tw-cursor{display:inline-block;color:var(--lime);animation:twBlink .7s step-end infinite;font-weight:300;margin-left:1px}
@keyframes twBlink{0%,100%{opacity:1}50%{opacity:0}}

/* ── PROGRESS ────────────────────────────────────────────── */
#sp{position:fixed;top:0;left:0;height:2px;background:linear-gradient(90deg,var(--lime),rgba(203,255,77,.3));z-index:9999;transition:width .12s linear;pointer-events:none}
#transition-flash{position:fixed;inset:0;z-index:9995;pointer-events:none;background:var(--lime);opacity:0}
#transition-scan{position:fixed;left:0;right:0;height:2px;background:var(--lime);z-index:9994;pointer-events:none;transform:scaleX(0);transform-origin:left;box-shadow:0 0 20px var(--lime),0 0 40px rgba(203,255,77,.5)}

/* ── PANELS ──────────────────────────────────────────────── */
#wrap{position:relative;width:100%;height:100%;overflow:hidden}
.pnl{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem clamp(1.25rem,5vw,5rem) 2rem;transition:transform 1s var(--e1);will-change:transform;overflow:hidden}
.pnl:not(#p0){overflow-y:scroll;overflow-x:hidden;justify-content:safe center;scrollbar-width:thin}
.pnl:not(#p0)::-webkit-scrollbar{width:4px}
.pnl:not(#p0)::-webkit-scrollbar-track{background:transparent}
.pnl:not(#p0)::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:2px}
#p0{padding-top:4rem;padding-bottom:1.75rem}
.pnl--up{transform:translateY(-100%)}
.pnl--on{transform:translateY(0)}
.pnl--dn{transform:translateY(100%)}
.pnl::before{content:"";position:absolute;inset:0;z-index:1;opacity:.018;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px;animation:grain .4s steps(2) infinite}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-3px,2px)}50%{transform:translate(2px,-3px)}75%{transform:translate(-1px,3px)}100%{transform:translate(3px,-1px)}}
.pnl>*:not(.pnl-video):not(#hcv):not(.hfloat){position:relative;z-index:2}

/* ── IMPROVED SIDE NAV ───────────────────────────────────── */
#sidenav{position:fixed;right:1.25rem;top:50%;transform:translateY(-50%);z-index:500;display:flex;flex-direction:column;gap:.375rem}
.snav-item{display:flex;align-items:center;gap:.625rem;cursor:pointer;padding:.25rem 0;justify-content:flex-end;group:true}
.snav-label{font-family:"JetBrains Mono",monospace;font-size:9px;color:transparent;letter-spacing:1px;text-transform:uppercase;white-space:nowrap;transition:color .25s,transform .25s var(--e2);transform:translateX(8px);background:var(--bg3);border:1px solid transparent;padding:3px 8px;border-radius:4px}
.snav-item:hover .snav-label{color:var(--text2);transform:translateX(0);border-color:var(--b1)}
.snav-item.on .snav-label{color:var(--lime);border-color:rgba(203,255,77,.2)}
.snav-dot{width:5px;height:5px;border-radius:50%;background:var(--text3);flex-shrink:0;transition:background .3s,transform .3s var(--e2),height .3s,border-radius .3s}
.snav-item.on .snav-dot{background:var(--lime);height:18px;border-radius:3px}
.snav-item:hover .snav-dot{background:var(--text2);transform:scale(1.3)}

/* ── NAV ─────────────────────────────────────────────────── */
#nav{position:fixed;top:0;left:0;right:0;z-index:600;display:flex;align-items:center;justify-content:space-between;padding:1.5rem clamp(1.25rem,4vw,3rem);transition:all .4s}
#nav.dark{background:rgba(6,6,11,.92);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--b0)}
.logo{font-family:"Syne",sans-serif;font-size:19px;font-weight:800;letter-spacing:-.5px;cursor:pointer;transition:opacity .2s}
.logo:hover{opacity:.75}
.lc{display:inline-block;transition:transform .4s var(--e2),color .3s;transition-delay:calc(var(--i)*.04s)}
.logo:hover .lc{transform:translateY(-4px) scale(1.15);color:var(--lime)}
.logo .lc{animation:logoIn .6s var(--e2) both;animation-delay:calc(var(--i)*.07s + .2s)}
@keyframes logoIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.nav-r{display:flex;align-items:center;gap:.75rem}
.lsw{display:flex;gap:2px;background:var(--b0);border:1px solid var(--b1);border-radius:8px;padding:4px;align-items:center}
.lb{background:transparent;border:none;padding:3px 5px;border-radius:5px;font-size:18px;line-height:1;cursor:pointer;transition:all .2s;opacity:.4;filter:grayscale(50%);display:flex;align-items:center;justify-content:center}
.lb-svg{padding:4px 5px}
.lb-svg svg{display:block;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.lb.on{background:rgba(203,255,77,.1);opacity:1;filter:none}
.lb:hover{opacity:.75;filter:grayscale(20%)}
.ncta{background:var(--lime);color:#06060B;border:none;padding:.55rem 1.35rem;border-radius:7px;font-size:13px;font-weight:700;font-family:"Syne",sans-serif;cursor:pointer;transition:opacity .2s,transform .2s var(--e2),box-shadow .2s;position:relative;overflow:hidden}
.ncta:hover{opacity:.9;transform:translateY(-2px);box-shadow:0 8px 24px rgba(203,255,77,.25)}
.ncta::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.15);transform:translateX(-100%) skewX(-15deg);transition:transform .4s}
.ncta:hover::after{transform:translateX(150%) skewX(-15deg)}

/* ── CANVAS ──────────────────────────────────────────────── */
#hcv{position:absolute;inset:0;pointer-events:none;opacity:.65}

/* ── ANIMATIONS ──────────────────────────────────────────── */
.fu{opacity:0;transform:translateY(22px);transition:opacity .65s var(--e3),transform .65s var(--e3)}
.pnl--on .fu{opacity:1;transform:none}
.fl{opacity:0;transform:translateX(-22px);transition:opacity .65s var(--e3),transform .65s var(--e3)}
.pnl--on .fl{opacity:1;transform:none}
.fr{opacity:0;transform:translateX(22px);transition:opacity .65s var(--e3),transform .65s var(--e3)}
.pnl--on .fr{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}
.d4{transition-delay:.32s}.d5{transition-delay:.4s}.d6{transition-delay:.48s}
.d7{transition-delay:.56s}.d8{transition-delay:.64s}.d9{transition-delay:.72s}

/* ── EYEBROW ─────────────────────────────────────────────── */
.ey{font-family:"JetBrains Mono",monospace;font-size:10px;font-weight:500;color:var(--lime);letter-spacing:2.5px;text-transform:uppercase;margin-bottom:.75rem;display:flex;align-items:center;gap:.625rem}
.ey::before{content:"";display:block;width:20px;height:1px;background:var(--lime);flex-shrink:0}

/* ── TYPE ────────────────────────────────────────────────── */
.h1{font-family:"Syne",sans-serif;font-size:clamp(24px,3.6vw,46px);font-weight:800;line-height:1.12;letter-spacing:-1.2px;max-width:800px;text-shadow:0 2px 20px rgba(0,0,0,.5)}
.h1 b,.h2 b{color:var(--lime)}
.h2{font-family:"Syne",sans-serif;font-size:clamp(24px,3.4vw,44px);font-weight:800;line-height:1.1;letter-spacing:-1.2px;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.sub{font-size:clamp(13.5px,1.2vw,16px);font-weight:300;color:var(--text2);line-height:1.55;max-width:580px;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.sub b{color:var(--text);font-weight:500}

/* ── HERO TYPEWRITER BLOCK ───────────────────────────────── */
.hero-tw-wrap{margin-top:1rem;min-height:30px;display:flex;align-items:center}
.hero-tw{font-size:clamp(15px,1.6vw,20px);font-weight:500;color:var(--text);text-shadow:0 2px 12px rgba(0,0,0,.7);line-height:1.5}

/* ── BUTTONS ─────────────────────────────────────────────── */
.btns{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.25rem}
.bp{background:var(--lime);color:#06060B;border:none;padding:.875rem 2rem;border-radius:8px;font-size:14px;font-weight:700;font-family:"Syne",sans-serif;cursor:pointer;transition:opacity .2s,transform .2s var(--e2),box-shadow .2s;position:relative;overflow:hidden;white-space:nowrap}
.bp::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.2);transform:translateX(-100%) skewX(-15deg);transition:transform .4s}
.bp:hover{opacity:.9;transform:translateY(-2px);box-shadow:0 8px 28px rgba(203,255,77,.3)}
.bp:hover::after{transform:translateX(150%) skewX(-15deg)}
.bs{background:transparent;color:var(--text);border:1px solid var(--b2);padding:.875rem 2rem;border-radius:8px;font-size:14px;font-weight:400;font-family:"Inter",sans-serif;cursor:pointer;transition:border-color .2s,transform .2s var(--e2),background .2s;white-space:nowrap}
.bs:hover{border-color:rgba(255,255,255,.3);background:var(--b0);transform:translateY(-2px)}
.ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.22);transform:scale(0);animation:rippleA .5s linear;pointer-events:none}
@keyframes rippleA{to{transform:scale(4);opacity:0}}

/* ── VIDEO BG ────────────────────────────────────────────── */
.pnl-video{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.pnl-video video{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s ease}
.pnl-video video.vloaded{opacity:1}
.pnl-video::after{content:"";position:absolute;inset:0;background:rgba(6,6,11,.70);z-index:1}
#p0 .pnl-video::after{background:rgba(6,6,11,.55)}

/* ── MARQUEE ─────────────────────────────────────────────── */
#mq{position:fixed;bottom:0;left:0;right:0;z-index:400;padding:.5rem 0;border-top:1px solid var(--b0);background:rgba(6,6,11,.75);backdrop-filter:blur(8px)}
.mqi{display:flex;gap:2.5rem;animation:mqA 32s linear infinite;width:max-content;white-space:nowrap}
.mqi:hover{animation-play-state:paused}
@keyframes mqA{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mq-i{font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--text3);letter-spacing:2px;text-transform:uppercase;display:flex;align-items:center;gap:1rem}
.mq-s{color:var(--lime)}

/* ── HERO NUMS ───────────────────────────────────────────── */
.hero-nums{display:flex;gap:2.25rem;margin-top:1.5rem;flex-wrap:wrap}
.hero-proof{margin-top:1.125rem;font-family:"JetBrains Mono",monospace;font-size:10.5px;color:var(--text3);letter-spacing:.5px;display:flex;align-items:center;gap:.5rem}
.hero-proof::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--lime);flex-shrink:0}
.hn{text-align:center}
.hn-n{font-family:"Syne",sans-serif;font-size:30px;font-weight:800;color:var(--lime);line-height:1;text-shadow:0 0 20px rgba(203,255,77,.22)}
.hn-l{font-size:11px;color:var(--text2);font-weight:300;line-height:1.4;margin-top:.25rem}

/* ── P1 PAIN ─────────────────────────────────────────────── */
.pain-w{max-width:760px;width:100%;overflow:hidden}
.pain-tl{display:flex;flex-direction:column;gap:0;margin-top:1rem;position:relative}
.pain-tl::before{content:"";position:absolute;left:15px;top:12px;bottom:12px;width:1px;background:linear-gradient(to bottom,var(--lime) 0%,rgba(203,255,77,.08) 100%)}
.pt{display:flex;gap:1rem;padding:.45rem 0;opacity:0;transform:translateX(-14px) translateY(4px);transition:opacity .5s var(--e3),transform .5s var(--e3)}
.pnl--on .pt:nth-child(1){opacity:1;transform:none;transition-delay:.12s}
.pnl--on .pt:nth-child(2){opacity:1;transform:none;transition-delay:.24s}
.pnl--on .pt:nth-child(3){opacity:1;transform:none;transition-delay:.36s}
.pnl--on .pt:nth-child(4){opacity:1;transform:none;transition-delay:.48s}
.pnl--on .pt:nth-child(5){opacity:1;transform:none;transition-delay:.60s}
.pt-ico{width:30px;height:30px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;position:relative;z-index:1;transition:transform .3s var(--e2)}
.pt:hover .pt-ico{transform:scale(1.15)}
.pt-ico.bad{background:rgba(255,94,91,.1);border:1px solid rgba(255,94,91,.2)}
.pt-ico.ok{background:var(--lime1);border:1px solid rgba(203,255,77,.2)}
.pt-release{padding:.75rem .875rem;margin-left:-.875rem;border-radius:12px;background:var(--lime1);border:1px solid rgba(203,255,77,.18)}
.pt-release .pt-t{font-size:16px;font-weight:700;color:var(--lime)}
.pt-time-ok{color:var(--lime)!important;font-weight:700!important;letter-spacing:1px!important}
.pt-t{font-size:13px;font-weight:500;color:var(--text);margin-bottom:1px}
.pt-d{font-size:11px;color:var(--text2);font-weight:300;line-height:1.4}
.pt-time{font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--text3);margin-top:3px;letter-spacing:.5px}

/* ── P2 METHODOLOGY ──────────────────────────────────────── */
.meth-w{max-width:1100px;width:100%}
.meth-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.75rem;margin-top:1.5rem}
.meth-card{background:var(--bg2);border:1px solid var(--b1);border-radius:12px;padding:1.5rem 1.375rem;position:relative;overflow:hidden;cursor:default;opacity:0;transform:translateY(18px) scale(.97);transition:opacity .5s var(--e3),transform .5s var(--e2),border-color .3s,background .3s}
.pnl--on .meth-card:nth-child(1){opacity:1;transform:none;transition-delay:.1s}
.pnl--on .meth-card:nth-child(2){opacity:1;transform:none;transition-delay:.18s}
.pnl--on .meth-card:nth-child(3){opacity:1;transform:none;transition-delay:.26s}
.pnl--on .meth-card:nth-child(4){opacity:1;transform:none;transition-delay:.34s}
.pnl--on .meth-card:nth-child(5){opacity:1;transform:none;transition-delay:.42s}
.meth-card::before{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--e3)}
.meth-card:hover{border-color:rgba(203,255,77,.28);transform:translateY(-5px) perspective(800px) !important;background:var(--bg3);box-shadow:0 12px 40px rgba(0,0,0,.3)}
.meth-card:hover::before{transform:scaleX(1)}
.mc-num{font-family:"Syne",sans-serif;font-size:42px;font-weight:800;color:rgba(203,255,77,.06);line-height:1;margin-bottom:.75rem;transition:color .3s}
.meth-card:hover .mc-num{color:rgba(203,255,77,.14)}
.mc-ico{font-size:22px;margin-bottom:.75rem}
.mc-title{font-family:"Syne",sans-serif;font-size:15.5px;font-weight:700;margin-bottom:.5rem;letter-spacing:-.2px;line-height:1.25}
.mc-desc{font-size:11px;color:var(--text2);font-weight:300;line-height:1.55}
.mc-tag{font-family:"JetBrains Mono",monospace;font-size:9px;color:var(--lime);letter-spacing:1px;text-transform:uppercase;margin-top:.75rem;opacity:.7}

/* ── P3 PRICING — IMPROVED ───────────────────────────────── */
.price-w{max-width:1000px;width:100%}
.price-anchor-box{display:flex;align-items:center;justify-content:center;gap:1.5rem;margin:1rem 0 1.125rem;padding:.75rem 1.25rem;background:var(--bg2);border:1px solid var(--b1);border-radius:14px;flex-wrap:wrap}
.pab-side{text-align:center;min-width:180px}
.pab-label{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text3);margin-bottom:.375rem}
.pab-val{font-family:"Syne",sans-serif;font-size:22px;font-weight:800;line-height:1}
.pab-agency .pab-val{color:var(--text2);text-decoration:line-through;text-decoration-color:rgba(255,90,90,.5);text-decoration-thickness:2px}
.pab-innectia .pab-val{color:var(--lime)}
.pab-sub{font-size:10.5px;color:var(--text3);margin-top:.375rem;font-weight:300}
.pab-arrow{font-size:18px;color:var(--lime);opacity:.5;flex-shrink:0}
@media(max-width:700px){.price-anchor-box{flex-direction:column;gap:.75rem}.pab-arrow{transform:rotate(0)}}
.price-grid{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:1rem;margin-top:1rem;align-items:start}
.pc{background:var(--bg2);border:1px solid var(--b1);border-radius:16px;padding:1.375rem 1.25rem;display:flex;flex-direction:column;position:relative;overflow:hidden;opacity:0;transform:translateY(16px);transition:opacity .5s var(--e3),transform .5s var(--e2),border-color .25s,background .25s}
.pnl--on .pc:nth-child(1){opacity:1;transform:none;transition-delay:.1s}
.pnl--on .pc:nth-child(2){opacity:1;transform:translateY(-6px);transition-delay:.2s}
.pnl--on .pc:nth-child(3){opacity:1;transform:none;transition-delay:.3s}
.pc.feat{border-color:rgba(203,255,77,.4);background:var(--bg3);box-shadow:0 0 55px rgba(203,255,77,.13),0 20px 50px rgba(0,0,0,.35);z-index:2}
.pc:not(.feat):hover{border-color:rgba(203,255,77,.2);transform:translateY(-4px)}
.pc.feat:hover{border-color:rgba(203,255,77,.55);transform:translateY(-12px)}
.pc-badge{display:inline-flex;align-items:center;gap:.375rem;background:var(--lime);color:#06060B;font-size:10.5px;font-weight:700;padding:5px 12px;border-radius:100px;font-family:"JetBrains Mono",monospace;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:1rem}
.pc-badge-gold{background:var(--gold);color:#06060B}
.pc-anchor{font-size:10px;color:var(--text3);font-family:"JetBrains Mono",monospace;letter-spacing:.3px;text-align:center;margin-top:.625rem;line-height:1.4}
.pc-anchor-top{font-size:12px;color:var(--lime);font-weight:600;font-family:"Inter",sans-serif;letter-spacing:0;margin:.625rem 0 0;line-height:1.4;text-align:left}
.pc-name{font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--lime);letter-spacing:2px;text-transform:uppercase;margin-bottom:.625rem}
/* Who it's for */
.pc-for{font-size:11px;color:var(--text2);font-weight:300;font-style:italic;margin-bottom:.75rem;line-height:1.35;padding:.4rem .625rem;background:var(--b0);border-radius:6px;border-left:2px solid rgba(203,255,77,.2)}
.pc-price{display:flex;align-items:baseline;gap:.25rem;margin-bottom:.2rem}
.pc-price-num{font-family:"Syne",sans-serif;font-size:clamp(32px,4vw,46px);font-weight:800;line-height:1;transition:transform .3s var(--e2)}
.pc:hover .pc-price-num{transform:scale(1.05)}
.pc-price-sym{font-size:18px;font-weight:400;color:var(--text2);align-self:flex-start;margin-top:.4rem}
.pc-note{font-size:10px;color:var(--text3);margin-bottom:.625rem;font-family:"JetBrains Mono",monospace;letter-spacing:.5px}
.pc-divider{height:1px;background:var(--b1);margin-bottom:.75rem}
.pc-items{display:flex;flex-direction:column;gap:.4rem;flex:1;margin-bottom:1.125rem}
.pc-item{font-size:11.5px;color:var(--text2);font-weight:300;display:flex;align-items:flex-start;gap:.5rem;line-height:1.35}
.pc-item::before{content:"→";color:var(--lime);flex-shrink:0;font-size:10px;margin-top:2px}
.pc-item.hi{color:var(--text);font-weight:500}
.pc-item.hi::before{content:"✓";color:var(--lime)}
/* "Not included" items */
.pc-item.no{color:var(--text3)}
.pc-item.no::before{content:"✕";color:var(--text3)}
.pc-cta{width:100%;padding:.8rem;border-radius:8px;font-size:13px;font-weight:700;font-family:"Syne",sans-serif;cursor:pointer;transition:opacity .2s,transform .2s var(--e2);border:none;position:relative;overflow:hidden;letter-spacing:.2px}
.pc-cta::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.15);transform:translateX(-100%) skewX(-15deg);transition:transform .4s}
.pc-cta:hover::after{transform:translateX(150%) skewX(-15deg)}
.pc-cta.lime{background:var(--lime);color:#06060B}
.pc-cta.out{background:var(--b0);color:var(--text);border:1px solid var(--b2)}
.pc-cta:hover{opacity:.92;transform:translateY(-1px)}
.price-foot{max-width:1000px;width:100%;margin-top:.875rem;display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-wrap:wrap;opacity:0;transition:opacity .5s .55s}
.pnl--on .price-foot{opacity:1}
.pf-item{font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--text3);letter-spacing:.5px;display:flex;align-items:center;gap:.375rem}
.pf-guarantee{display:flex;align-items:center;justify-content:center;gap:.625rem;margin-top:.875rem;padding:.7rem 1.25rem;background:var(--lime1);border:1px solid rgba(203,255,77,.22);border-radius:12px;font-size:12px;color:var(--text);font-weight:400;max-width:640px;margin-left:auto;margin-right:auto;text-align:center}
.pf-guarantee-ico{font-size:16px;flex-shrink:0}
.pf-item::before{content:"✓";color:var(--lime)}

/* ── P4 PROCESS ──────────────────────────────────────────── */
.proc-phases{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;width:100%;max-width:1000px;margin-top:1.75rem;position:relative}
.proc-phases::before{content:"";position:absolute;top:2.25rem;left:calc(12.5% + 1rem);right:calc(12.5% + 1rem);height:1px;background:linear-gradient(90deg,var(--lime) 0%,rgba(203,255,77,.1) 100%);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--e3) .4s}
.pnl--on .proc-phases::before{transform:scaleX(1)}
.pp{text-align:center;opacity:0;transform:translateY(14px);transition:opacity .5s var(--e3),transform .5s var(--e2)}
.pnl--on .pp:nth-child(1){opacity:1;transform:none;transition-delay:.15s}
.pnl--on .pp:nth-child(2){opacity:1;transform:none;transition-delay:.3s}
.pnl--on .pp:nth-child(3){opacity:1;transform:none;transition-delay:.45s}
.pnl--on .pp:nth-child(4){opacity:1;transform:none;transition-delay:.6s}
.pp-circle{width:48px;height:48px;border-radius:50%;background:var(--lime1);border:1px solid rgba(203,255,77,.25);display:flex;align-items:center;justify-content:center;font-family:"JetBrains Mono",monospace;font-size:13px;font-weight:500;color:var(--lime);margin:0 auto 1.25rem;position:relative;z-index:1;transition:background .2s,transform .3s var(--e2),box-shadow .3s}
.pp:hover .pp-circle{background:rgba(203,255,77,.18);transform:scale(1.12);box-shadow:0 0 20px rgba(203,255,77,.2)}
.pp h5{font-family:"Syne",sans-serif;font-size:13px;font-weight:700;margin-bottom:.375rem;letter-spacing:-.2px}
.pp p{font-size:11px;color:var(--text2);font-weight:300;line-height:1.5}
.pp-days{font-family:"JetBrains Mono",monospace;font-size:9px;color:var(--lime);letter-spacing:1px;margin-top:.5rem}
.proc-detail{display:grid;grid-template-columns:repeat(2,1fr);gap:.625rem;margin-top:1.5rem;width:100%;max-width:1000px}
.pd{background:var(--bg2);border:1px solid var(--b0);border-radius:10px;padding:1rem 1.25rem;display:flex;gap:.875rem;align-items:flex-start;opacity:0;transform:translateY(10px);transition:opacity .5s var(--e3),transform .5s var(--e3),border-color .2s}
.pd-highlight{background:var(--lime1);border-color:rgba(203,255,77,.22)}
.pd-highlight h6{font-weight:700;font-size:13px;color:var(--lime)}
.pnl--on .pd:nth-child(1){opacity:1;transform:none;transition-delay:.7s}
.pnl--on .pd:nth-child(2){opacity:1;transform:none;transition-delay:.8s}
.pnl--on .pd:nth-child(3){opacity:1;transform:none;transition-delay:.9s}
.pnl--on .pd:nth-child(4){opacity:1;transform:none;transition-delay:1s}
.pd:hover{border-color:rgba(203,255,77,.15)}
.pd-ico{font-size:16px;flex-shrink:0;margin-top:1px}
.pd h6{font-size:12px;font-weight:500;color:var(--text);margin-bottom:2px}
.pd p{font-size:11px;color:var(--text2);font-weight:300;line-height:1.5}

/* ── P5 PORTFOLIO ────────────────────────────────────────── */
.port-w{max-width:1440px;width:100%}
.port-carousel-wrap{position:relative;margin-top:1.5rem;width:100%}
.port-carousel{display:flex;gap:1.375rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.5rem .25rem 1.75rem;scrollbar-width:thin;scrollbar-color:var(--lime) var(--bg2);scroll-behavior:smooth}
.port-carousel::-webkit-scrollbar{height:6px}
.port-carousel::-webkit-scrollbar-track{background:var(--bg2);border-radius:3px}
.port-carousel::-webkit-scrollbar-thumb{background:rgba(203,255,77,.45);border-radius:3px;transition:background .2s}
.port-carousel::-webkit-scrollbar-thumb:hover{background:var(--lime)}
.portc{flex:0 0 380px;scroll-snap-align:start;background:var(--bg2);border:1px solid var(--b1);border-radius:16px;overflow:hidden;cursor:pointer;position:relative;opacity:0;transform:translateY(8px);transition:opacity .5s var(--e3),transform .5s var(--e3),border-color .25s,transform .25s}
.pnl--on .portc:nth-child(1){opacity:1;transform:none;transition-delay:.06s}
.pnl--on .portc:nth-child(2){opacity:1;transform:none;transition-delay:.11s}
.pnl--on .portc:nth-child(3){opacity:1;transform:none;transition-delay:.16s}
.pnl--on .portc:nth-child(4){opacity:1;transform:none;transition-delay:.21s}
.pnl--on .portc:nth-child(5){opacity:1;transform:none;transition-delay:.26s}
.pnl--on .portc:nth-child(6){opacity:1;transform:none;transition-delay:.31s}
.pnl--on .portc:nth-child(7){opacity:1;transform:none;transition-delay:.36s}
.pnl--on .portc:nth-child(8){opacity:1;transform:none;transition-delay:.41s}
.pnl--on .portc:nth-child(9){opacity:1;transform:none;transition-delay:.46s}
.pnl--on .portc:nth-child(10){opacity:1;transform:none;transition-delay:.51s}
.pnl--on .portc:nth-child(11){opacity:1;transform:none;transition-delay:.56s}
.pnl--on .portc:nth-child(n+12){opacity:1;transform:none;transition-delay:.6s}
.portc:hover{border-color:rgba(203,255,77,.3);transform:translateY(-4px)}
.portc-imgwrap{width:100%;height:230px;overflow:hidden;position:relative;background:var(--bg4)}
.portc-img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;filter:saturate(.94);transition:transform .5s var(--e2),filter .3s}
.portc:hover .portc-img{transform:scale(1.06);filter:saturate(1.08)}
.portc-live{position:absolute;top:.65rem;right:.65rem;background:rgba(6,6,11,.9);backdrop-filter:blur(4px);border:1px solid rgba(203,255,77,.55);color:var(--lime);font-family:"JetBrains Mono",monospace;font-size:9.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:5px 9px 5px 7px;border-radius:100px;display:flex;align-items:center;gap:5px;box-shadow:0 2px 12px rgba(0,0,0,.4)}
.portc-live::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--lime);flex-shrink:0;animation:bl 1.5s infinite}
.portc-body{padding:1.375rem 1.5rem 1.6rem}
.portc-n{display:none}
.portc-ind{font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--text3);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:.5rem;line-height:1.4}
.portc-title{font-family:"Syne",sans-serif;font-size:19px;font-weight:700;margin-bottom:.5rem;letter-spacing:-.3px}
.portc-url{font-size:10.5px;color:var(--lime);opacity:.65;margin-bottom:.5rem;font-family:"JetBrains Mono",monospace;letter-spacing:.2px;text-decoration:none;display:block;transition:opacity .2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.portc:hover .portc-url{opacity:1}
.portc-metric{font-size:12.5px;color:var(--text2);font-weight:300;display:flex;align-items:flex-start;gap:.375rem;line-height:1.5}
.portc-metric::before{content:"→";color:var(--lime);font-size:10px;flex-shrink:0;margin-top:2px}
.portc.next{display:flex;align-items:stretch;justify-content:center;border-style:dashed;border-color:rgba(203,255,77,.18);background:var(--b0)}
.portc.next:hover{border-color:rgba(203,255,77,.4)}
.portc-yours{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.75rem;padding:1.5rem;width:100%}
.portc-yours-ico{font-size:26px;opacity:.5;transition:opacity .2s,transform .3s var(--e2)}
.portc.next:hover .portc-yours-ico{opacity:.9;transform:scale(1.2)}
.portc-yours-t{font-family:"Syne",sans-serif;font-size:14px;font-weight:700;color:var(--text2)}
.portc-yours-btn{background:var(--lime);color:#06060B;border:none;padding:.45rem 1.125rem;border-radius:6px;font-size:12px;font-weight:700;font-family:"Syne",sans-serif;cursor:pointer;transition:opacity .2s,transform .2s var(--e2)}
.portc-yours-btn:hover{opacity:.85;transform:translateY(-1px)}
.port-arrow{position:absolute;top:38%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:rgba(6,6,11,.85);border:1px solid var(--b2);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:5;transition:all .2s;backdrop-filter:blur(4px)}
.port-arrow:hover{border-color:rgba(203,255,77,.4);color:var(--lime);background:var(--bg2)}
.port-arrow.prev{left:-10px}
.port-arrow.next{right:-10px}
.port-hint{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--lime);letter-spacing:1.5px;text-transform:uppercase;text-align:center;margin-top:.625rem;opacity:.85;display:flex;align-items:center;justify-content:center;gap:.5rem;font-weight:600}
.port-hint::before,.port-hint::after{content:"↔";animation:hintPulse 1.6s ease-in-out infinite}
@keyframes hintPulse{0%,100%{opacity:.4;transform:translateX(0)}50%{opacity:1;transform:translateX(2px)}}

/* ── P6 HOST ─────────────────────────────────────────────── */
.host-w{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;max-width:1100px;width:100%;align-items:center}
.hbens{display:flex;flex-direction:column;gap:.5rem;margin-top:.875rem}
.hb{display:flex;align-items:flex-start;gap:.75rem;padding:.625rem 1rem;background:var(--bg2);border:1px solid var(--b1);border-radius:10px;transition:border-color .25s,transform .25s var(--e2),box-shadow .25s;opacity:0;transform:translateX(-14px);transition:opacity .5s var(--e3),transform .5s var(--e2),border-color .25s}
.pnl--on .hb:nth-child(1){opacity:1;transform:none;transition-delay:.2s}
.pnl--on .hb:nth-child(2){opacity:1;transform:none;transition-delay:.32s}
.pnl--on .hb:nth-child(3){opacity:1;transform:none;transition-delay:.44s}
.pnl--on .hb:nth-child(4){opacity:1;transform:none;transition-delay:.56s}
.hb:hover{border-color:rgba(203,255,77,.2);transform:translateX(4px);box-shadow:0 4px 20px rgba(0,0,0,.2)}
.hb-ico{font-size:18px;flex-shrink:0}
.hb-t{font-size:12px;font-weight:600;margin-bottom:1px}
.hb-d{font-size:11px;color:var(--text2);font-weight:300;line-height:1.4}
.chat-demo{background:var(--bg3);border:1px solid var(--b1);border-radius:14px;overflow:hidden;opacity:0;transform:translateX(14px) scale(.98);transition:opacity .7s var(--e3) .3s,transform .7s var(--e2) .3s}
.pnl--on .chat-demo{opacity:1;transform:none}
.ch-hdr{display:flex;align-items:center;gap:.75rem;padding:.875rem 1.125rem;border-bottom:1px solid var(--b0);background:var(--bg4)}
.ch-av{width:32px;height:32px;border-radius:50%;background:var(--bg4);border:2px solid var(--lime);display:flex;align-items:center;justify-content:center;font-family:"Syne",sans-serif;font-size:12px;font-weight:800;color:var(--lime);flex-shrink:0}
.ch-nm{font-size:13px;font-weight:600;font-family:"Syne",sans-serif}
.ch-st{font-size:11px;color:var(--lime);display:flex;align-items:center;gap:.3rem}
.ch-std{width:5px;height:5px;border-radius:50%;background:var(--lime);animation:bl 1.5s infinite}
@keyframes bl{0%,100%{opacity:1}50%{opacity:.2}}
.ch-msgs{padding:1.125rem;display:flex;flex-direction:column;gap:.625rem}
.cm{font-size:12px;font-weight:300;line-height:1.5;padding:.6rem .875rem;border-radius:9px;max-width:88%}
.cm.h{background:rgba(203,255,77,.06);border:1px solid rgba(203,255,77,.1);color:var(--text);align-self:flex-start;border-radius:9px 9px 9px 2px}
.cm.u{background:var(--bg2);border:1px solid var(--b1);color:var(--text2);align-self:flex-end;border-radius:9px 9px 2px 9px}

/* ── P7 AUDIT ────────────────────────────────────────────── */
.audit-w{max-width:900px;width:100%}
.audit-box{background:var(--bg2);border:1px solid var(--b1);border-radius:16px;padding:2.5rem;margin-top:1.5rem;opacity:0;transform:translateY(16px);transition:opacity .6s var(--e3) .2s,transform .6s var(--e2) .2s}
.pnl--on .audit-box{opacity:1;transform:none}
.audit-form{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.25rem}
.audit-note{font-size:11.5px;color:var(--text2);margin-top:.75rem;font-weight:300;display:flex;align-items:center;gap:.5rem}
.audit-status{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--lime);letter-spacing:.5px;margin-top:.875rem;min-height:16px;display:flex;align-items:center;gap:.5rem}
.audit-status.show::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime);flex-shrink:0;animation:bl 1s infinite}
.audit-input{flex:1;min-width:240px;background:var(--bg3);border:1px solid var(--b1);border-radius:8px;padding:.85rem 1rem;font-size:14px;color:var(--text);font-family:"Inter",sans-serif;font-weight:300;outline:none;transition:border-color .2s}
.audit-input:focus{border-color:rgba(203,255,77,.4)}
.audit-input::placeholder{color:var(--text3)}
.audit-btn{background:var(--lime);color:#06060B;border:none;padding:.85rem 1.75rem;border-radius:8px;font-size:14px;font-weight:700;font-family:"Syne",sans-serif;cursor:pointer;transition:opacity .2s,transform .2s var(--e2);white-space:nowrap;position:relative;overflow:hidden}
.audit-btn:hover{opacity:.88;transform:translateY(-1px)}
.audit-checks{display:grid;grid-template-columns:repeat(3,1fr);gap:.625rem;margin-top:1.25rem}
.audit-check{background:var(--bg3);border:1px solid var(--b0);border-radius:8px;padding:.75rem;text-align:center;opacity:0;transform:scale(.95);transition:all .35s var(--e2)}
.audit-check.visible{opacity:1;transform:none}
.audit-check-ico{font-size:18px;margin-bottom:.25rem}
.audit-check-label{font-size:10px;color:var(--text3);font-family:"JetBrains Mono",monospace;letter-spacing:1px;text-transform:uppercase}
.audit-check-val{font-family:"Syne",sans-serif;font-size:16px;font-weight:700;color:var(--lime)}
.audit-result{margin-top:1.25rem;padding:1rem 1.25rem;background:var(--lime1);border:1px solid rgba(203,255,77,.15);border-radius:10px;display:none}
.audit-result p{font-size:13px;color:var(--text2);line-height:1.6;font-weight:300}
.audit-result b{color:var(--lime);font-weight:500}

/* ── P8 CONTACT ──────────────────────────────────────────── */
.cont-w{display:grid;grid-template-columns:1fr 1.35fr;gap:4rem;max-width:1100px;width:100%;align-items:start}
/* OFFICES with flags */
.cont-offices{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:1.5rem}
.office{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--bg2);border:1px solid var(--b0);border-radius:10px;transition:border-color .2s,transform .2s var(--e2);opacity:0;transform:translateX(-12px);transition:opacity .5s var(--e3),transform .5s var(--e2),border-color .2s}
.pnl--on .office:nth-child(1){opacity:1;transform:none;transition-delay:.25s}
.pnl--on .office:nth-child(2){opacity:1;transform:none;transition-delay:.35s}
.pnl--on .office:nth-child(3){opacity:1;transform:none;transition-delay:.45s}
.pnl--on .office:nth-child(4){opacity:1;transform:none;transition-delay:.55s}
.office:hover{border-color:rgba(203,255,77,.2);transform:translateX(4px)}
.office-flag{font-size:24px;flex-shrink:0}
.office-city{font-size:14px;font-weight:600;color:var(--text);line-height:1.2;font-family:"Syne",sans-serif}
.office-country{font-size:10px;color:var(--text3);font-family:"JetBrains Mono",monospace;letter-spacing:.5px}
/* Trust */
.cont-trust{display:flex;flex-direction:column;gap:.375rem;margin-top:1.5rem}
.ctrust{display:flex;align-items:center;gap:.5rem;font-size:12px;color:var(--text2);font-weight:300;opacity:0;transform:translateY(6px);transition:opacity .4s var(--e3),transform .4s var(--e3)}
.pnl--on .ctrust:nth-child(1){opacity:1;transform:none;transition-delay:.65s}
.pnl--on .ctrust:nth-child(2){opacity:1;transform:none;transition-delay:.73s}
.pnl--on .ctrust:nth-child(3){opacity:1;transform:none;transition-delay:.81s}
.pnl--on .ctrust:nth-child(4){opacity:1;transform:none;transition-delay:.89s}
.pnl--on .ctrust:nth-child(5){opacity:1;transform:none;transition-delay:.97s}
.ctrust::before{content:"✓";color:var(--lime);font-weight:700;font-size:11px;flex-shrink:0}
/* Form */
.form-wrap{opacity:0;transform:translateX(18px);transition:opacity .7s var(--e3) .3s,transform .7s var(--e2) .3s}
.pnl--on .form-wrap{opacity:1;transform:none}
.wa-close{background:var(--bg2);border:1px solid var(--b1);border-radius:16px;padding:2.25rem 2rem;text-align:center}
.wa-close-icon{width:52px;height:52px;border-radius:50%;background:var(--lime1);border:1px solid rgba(203,255,77,.25);color:var(--lime);display:flex;align-items:center;justify-content:center;margin:0 auto 1.25rem}
.wa-close h3{font-family:"Syne",sans-serif;font-size:19px;font-weight:800;color:var(--text);margin-bottom:.625rem;letter-spacing:-.3px}
.wac-p{font-size:12.5px;color:var(--text2);font-weight:300;line-height:1.6;margin-bottom:1.5rem;max-width:340px;margin-left:auto;margin-right:auto}
.wac-btn{width:100%;background:var(--lime);color:#06060B;border:none;padding:.9rem;border-radius:8px;font-size:15px;font-weight:700;font-family:"Syne",sans-serif;cursor:pointer;transition:opacity .2s,transform .2s var(--e2),box-shadow .2s;margin-bottom:.625rem}
.wac-btn:hover{opacity:.9;transform:translateY(-2px);box-shadow:0 8px 28px rgba(203,255,77,.3)}
.wac-btn-alt{width:100%;background:transparent;color:var(--text2);border:1px solid var(--b2);padding:.75rem;border-radius:8px;font-size:13px;font-weight:400;font-family:"Inter",sans-serif;cursor:pointer;transition:border-color .2s,color .2s;margin-bottom:1.25rem}
.wac-btn-alt:hover{border-color:rgba(203,255,77,.3);color:var(--lime)}
.sbox{display:none;text-align:center;padding:2rem;background:var(--lime1);border:1px solid rgba(203,255,77,.15);border-radius:12px}
.sbox h3{font-family:"Syne",sans-serif;font-size:18px;font-weight:800;color:var(--lime);margin-bottom:.5rem;letter-spacing:-.3px}
.sbox p{font-size:13px;color:var(--text2)}
.fg{margin-bottom:.75rem}
.fr2{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.fg label{display:block;font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--text3);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:.35rem}
.fg input,.fg textarea,.fg select{width:100%;background:var(--bg3);border:1px solid var(--b1);border-radius:8px;padding:.7rem .9rem;font-size:13px;color:var(--text);font-family:"Inter",sans-serif;font-weight:300;transition:border-color .2s,background .2s;outline:none}
.fg input::placeholder,.fg textarea::placeholder{color:var(--text3)}
.fg select option{background:var(--bg2)}
.fg input:focus,.fg textarea:focus,.fg select:focus{border-color:rgba(203,255,77,.4);background:var(--bg2)}
.fg textarea{resize:vertical;min-height:85px}
.gdpr-r{display:flex;align-items:flex-start;gap:.625rem;margin-bottom:.75rem}
.gdpr-r input[type=checkbox]{width:15px;height:15px;accent-color:var(--lime);flex-shrink:0;margin-top:2px;cursor:pointer}
.gdpr-r label{font-size:12px;color:var(--text2);line-height:1.5;cursor:pointer}
.gdpr-r label a{color:var(--lime);text-decoration:underline}
.fsb{width:100%;background:var(--lime);color:#06060B;border:none;padding:.9rem;border-radius:8px;font-size:15px;font-weight:700;font-family:"Syne",sans-serif;cursor:pointer;transition:opacity .2s,transform .2s var(--e2),box-shadow .2s;position:relative;overflow:hidden}
.fsb:hover{opacity:.9;transform:translateY(-2px);box-shadow:0 8px 28px rgba(203,255,77,.3)}
.fsb:disabled{opacity:.5;cursor:not-allowed}
.fnote{font-size:11px;color:var(--text3);margin-top:.625rem;text-align:center;font-family:"JetBrains Mono",monospace}
.ferr{font-size:12px;color:var(--red);margin-top:.35rem;display:none}
.sbox{display:none;text-align:center;padding:2rem;background:var(--lime1);border:1px solid rgba(203,255,77,.15);border-radius:12px}
.sbox h3{font-family:"Syne",sans-serif;font-size:18px;font-weight:800;color:var(--lime);margin-bottom:.5rem;letter-spacing:-.3px}
.sbox p{font-size:13px;color:var(--text2)}

/* ── CHATBOT ─────────────────────────────────────────────── */
#hst{position:fixed;bottom:4.5rem;right:1.75rem;z-index:800;display:flex;flex-direction:column;align-items:flex-end;gap:.625rem}
#hbtn{width:52px;height:52px;border-radius:50%;background:var(--bg3);border:2px solid var(--lime);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 0 rgba(203,255,77,.4);transition:transform .25s var(--e2),box-shadow .25s;flex-shrink:0;animation:hbtnPulse 3s ease-in-out infinite}
@keyframes hbtnPulse{0%,100%{box-shadow:0 0 0 0 rgba(203,255,77,.4)}50%{box-shadow:0 0 0 10px rgba(203,255,77,0)}}
#hbtn:hover{transform:scale(1.1)}
#hbtn.open{transform:rotate(45deg)}
#hbtn-logo{font-family:"Syne",sans-serif;font-size:20px;font-weight:800;color:var(--lime);transition:transform .3s var(--e2)}
#hbtn.open #hbtn-logo{transform:rotate(-45deg) scale(.9)}
#hnotify{background:var(--bg3);border:1px solid rgba(203,255,77,.25);border-radius:14px;border-bottom-right-radius:4px;padding:.875rem 1.125rem;max-width:272px;font-size:13px;color:var(--text);line-height:1.5;font-weight:300;box-shadow:0 6px 28px rgba(0,0,0,.5);opacity:0;transform:translateX(10px) scale(.96);transition:opacity .35s var(--e3),transform .35s var(--e2);display:none;cursor:pointer}
#hnotify.show{opacity:1;transform:none;display:block;animation:notifyIn .4s var(--e2)}
@keyframes notifyIn{from{opacity:0;transform:translateX(16px) scale(.9)}to{opacity:1;transform:none}}
#hnotify strong{color:var(--lime);font-weight:600}
#hnotify-time{font-family:"JetBrains Mono",monospace;font-size:9px;color:var(--text3);letter-spacing:1px;text-transform:uppercase;margin-bottom:.5rem;display:flex;align-items:center;gap:.375rem}
#hnotify-time::before{content:"";display:block;width:5px;height:5px;border-radius:50%;background:var(--lime);animation:bl 1.5s infinite}
#cpanel{position:fixed;bottom:4.5rem;right:5.5rem;z-index:800;width:372px;max-height:min(80vh,640px);display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--b2);border-radius:18px;border-bottom-right-radius:4px;overflow:hidden;box-shadow:0 8px 48px rgba(0,0,0,.7);transform:scale(.94) translateY(12px);opacity:0;transition:transform .35s var(--e2),opacity .35s var(--e3);pointer-events:none}
#cpanel.open{transform:scale(1) translateY(0);opacity:1;pointer-events:all}
.cph{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;border-bottom:1px solid var(--b0);background:var(--bg3);flex-shrink:0}
.cp-av{width:34px;height:34px;border-radius:50%;background:var(--bg4);border:2px solid var(--lime);display:flex;align-items:center;justify-content:center;font-family:"Syne",sans-serif;font-size:13px;font-weight:800;color:var(--lime);flex-shrink:0}
.cp-nm{font-size:13px;font-weight:700;font-family:"Syne",sans-serif}
.cp-st{font-size:11px;color:var(--lime);display:flex;align-items:center;gap:.3rem}
.cp-std{width:5px;height:5px;border-radius:50%;background:var(--lime);animation:bl 1.5s infinite}
.cp-x{background:transparent;border:none;color:var(--text2);cursor:pointer;font-size:18px;margin-left:auto;padding:.2rem;line-height:1;transition:color .2s}
.cp-x:hover{color:var(--text)}
.cp-greeting{padding:.5rem 1rem;background:var(--lime1);border-bottom:1px solid rgba(203,255,77,.08);font-family:"JetBrains Mono",monospace;font-size:9px;color:var(--lime);letter-spacing:1.5px;text-transform:uppercase;display:flex;align-items:center;gap:.375rem}
.cp-greeting::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--lime);flex-shrink:0;animation:bl 2s infinite}
.cp-msgs{height:250px;overflow-y:auto;padding:.875rem;display:flex;flex-direction:column;gap:.5rem;scroll-behavior:smooth;flex-shrink:0}
.cp-msgs::-webkit-scrollbar{width:2px}
.cp-msgs::-webkit-scrollbar-thumb{background:var(--b2);border-radius:2px}
.cpm{font-size:12px;font-weight:300;line-height:1.5;padding:.55rem .75rem;border-radius:9px;max-width:90%;animation:msgIn .3s var(--e2)}
@keyframes msgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.cpm.h{background:rgba(203,255,77,.07);border:1px solid rgba(203,255,77,.12);color:var(--text);align-self:flex-start;border-radius:9px 9px 9px 2px}
.cpm.u{background:var(--bg3);border:1px solid var(--b1);color:var(--text2);align-self:flex-end;border-radius:9px 9px 2px 9px}
#cpt{align-self:flex-start;display:none;padding:.45rem .75rem;background:rgba(203,255,77,.05);border:1px solid rgba(203,255,77,.1);border-radius:9px 9px 9px 2px;flex-shrink:0}
#cpt.show{display:flex;gap:.3rem;align-items:center}
.td{width:5px;height:5px;border-radius:50%;background:var(--lime);animation:typD .9s infinite}
.td:nth-child(2){animation-delay:.15s}.td:nth-child(3){animation-delay:.3s}
@keyframes typD{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}
.cp-sugs{display:flex;flex-direction:column;gap:.5rem;padding:.75rem .875rem;border-top:1px solid var(--b0);max-height:40vh;overflow-y:auto;flex-shrink:1}
.cp-sugs::-webkit-scrollbar{width:2px}
.cp-sugs::-webkit-scrollbar-thumb{background:var(--b2);border-radius:2px}
.cp-sug{background:var(--bg3);border:1px solid var(--b1);color:var(--text);padding:.75rem 1rem;border-radius:11px;font-size:13.5px;font-weight:500;line-height:1.35;cursor:pointer;font-family:"Inter",sans-serif;transition:all .2s;white-space:normal;text-align:left;width:100%}
.cp-sug:hover{border-color:rgba(203,255,77,.35);color:var(--lime);background:var(--lime1);transform:translateX(2px)}
.cp-wa-link{display:inline-flex;align-items:center;gap:.4rem;background:var(--lime);color:#06060B;padding:.55rem .9rem;border-radius:8px;font-size:12px;font-weight:700;font-family:"Syne",sans-serif;text-decoration:none;margin-top:.375rem;transition:transform .2s var(--e2),box-shadow .2s;box-shadow:0 4px 18px rgba(203,255,77,.18)}
.cp-wa-link:hover{transform:translateY(-1px);box-shadow:0 6px 24px rgba(203,255,77,.3)}
.cp-wa-link svg{flex-shrink:0}
.cp-iw{display:flex;gap:.5rem;padding:.625rem .875rem;border-top:1px solid var(--b0);flex-shrink:0}
.cp-in{flex:1;background:var(--bg3);border:1px solid var(--b1);border-radius:7px;padding:.45rem .7rem;font-size:12px;color:var(--text);font-family:"Inter",sans-serif;outline:none;transition:border-color .2s}
.cp-in:focus{border-color:rgba(203,255,77,.3)}
.cp-in::placeholder{color:var(--text3)}
.cp-snd{background:var(--lime);border:none;border-radius:6px;width:30px;height:30px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .2s}
.cp-snd:hover{opacity:.85}
.cp-snd svg{width:12px;height:12px;color:#06060B}

/* ── MODALS & COOKIE ─────────────────────────────────────── */
.mov{position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:9000;display:none;align-items:center;justify-content:center;padding:1rem;backdrop-filter:blur(6px)}
.mov.op{display:flex}
.mod{background:var(--bg2);border:1px solid var(--b2);border-radius:16px;padding:2.5rem;max-width:540px;width:100%;max-height:80vh;overflow-y:auto;animation:modIn .3s var(--e2)}
@keyframes modIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.mod h2{font-family:"Syne",sans-serif;font-size:20px;font-weight:800;margin-bottom:1.25rem;letter-spacing:-.3px}
.mod h3{font-size:13px;font-weight:500;margin:1rem 0 .35rem}
.mod p{font-size:13px;color:var(--text2);line-height:1.7;font-weight:300}
.mclose{display:block;margin:1.5rem auto 0;background:var(--bg3);color:var(--text);border:1px solid var(--b1);padding:.5rem 1.5rem;border-radius:7px;font-size:13px;font-family:"Inter",sans-serif;cursor:pointer}
#ck{position:fixed;bottom:4.5rem;left:1.5rem;z-index:900;background:var(--bg3);border:1px solid var(--b2);border-radius:12px;padding:1rem 1.25rem;max-width:330px;display:none;flex-direction:column;gap:.75rem;box-shadow:0 8px 32px rgba(0,0,0,.5);animation:ckIn .4s var(--e2)}
@keyframes ckIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#ck p{font-size:12px;color:var(--text2);line-height:1.5}
#ck p a{color:var(--lime)}
.ckb{display:flex;gap:.5rem}
.cka{background:var(--lime);color:#06060B;border:none;padding:.4rem 1rem;border-radius:6px;font-size:12px;font-weight:700;font-family:"Syne",sans-serif;cursor:pointer}
.ckr{background:transparent;color:var(--text2);border:1px solid var(--b1);padding:.4rem 1rem;border-radius:6px;font-size:12px;font-family:"Inter",sans-serif;cursor:pointer}
/* floating particles */
.hfloat{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--lime);animation:hfloatE 6s ease-in-out infinite;pointer-events:none;opacity:.4}
@keyframes hfloatE{0%{transform:translate(0,0) scale(1);opacity:.35}25%{transform:translate(12px,-18px) scale(1.5);opacity:.6}50%{transform:translate(-8px,10px) scale(.8);opacity:.25}75%{transform:translate(16px,4px) scale(1.2);opacity:.5}100%{transform:translate(0,0) scale(1);opacity:.35}}
.hero-line{display:block;height:1px;background:linear-gradient(90deg,var(--lime),transparent);margin-top:1rem;transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--e3) .5s}
.pnl--on .hero-line{transform:scaleX(1)}
/* Video bg */
.pnl-video{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.pnl-video video{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s ease}
.pnl-video video.vloaded{opacity:1}
.pnl-video::after{content:"";position:absolute;inset:0;background:rgba(6,6,11,.70);z-index:1}
#p0 .pnl-video::after{background:rgba(6,6,11,.55)}

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media(max-width:1000px){
  .meth-grid{grid-template-columns:repeat(3,1fr)}
  .price-grid{grid-template-columns:1fr;max-width:480px;margin:1.5rem auto 0}
  .pnl--on .pc.feat,.pc.feat{transform:none!important}
  .proc-phases{grid-template-columns:1fr 1fr}
  .proc-phases::before{display:none}
  .proc-detail{grid-template-columns:1fr}
  .portc{flex-basis:260px}
  .host-w,.cont-w{grid-template-columns:1fr;gap:2.5rem}
}

/* ── DYNAMIC CONCIERGE SHOWCASE ──────────────────────── */
.showcase-wrap{position:relative;width:100%;max-width:420px}
.showcase-header{display:flex;align-items:center;justify-content:space-between;padding:.625rem 1rem;background:var(--bg4);border:1px solid var(--b2);border-bottom:none;border-radius:14px 14px 0 0}
.showcase-title{display:flex;align-items:center;gap:.5rem;font-family:"Syne",sans-serif;font-size:12px;font-weight:700}
.showcase-flag{font-size:16px}
.showcase-industry{font-size:10px;font-family:"JetBrains Mono",monospace;color:var(--text3);letter-spacing:1px;text-transform:uppercase}
.showcase-progress{width:100%;height:2px;background:var(--b1);margin-top:0;overflow:hidden}
.showcase-bar{height:100%;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform 6s linear}
.showcase-bar.running{transform:scaleX(1)}
.showcase-msgs{background:var(--bg3);border:1px solid var(--b1);border-radius:0 0 14px 14px;padding:1rem;height:180px;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem;scrollbar-width:thin}
.showcase-msgs::-webkit-scrollbar{width:3px}
.showcase-msgs::-webkit-scrollbar-thumb{background:var(--b2);border-radius:2px}
.showcase-msg{font-size:12px;font-weight:300;line-height:1.5;padding:.5rem .75rem;border-radius:9px;max-width:88%;animation:msgIn .35s var(--e2) both}
.showcase-msg.h{background:rgba(200,255,60,.07);border:1px solid rgba(200,255,60,.12);color:var(--text);align-self:flex-start;border-radius:9px 9px 9px 2px}
.showcase-msg.u{background:var(--bg4);border:1px solid var(--b1);color:var(--text2);align-self:flex-end;border-radius:9px 9px 2px 9px}
.showcase-nav{display:flex;gap:.375rem;justify-content:center;margin-top:.75rem}
.showcase-dot{width:5px;height:5px;border-radius:50%;background:var(--text3);cursor:pointer;transition:all .25s}
.showcase-dot.on{background:var(--lime);width:16px;border-radius:3px}
/* Gold accent for "A medida" plan */
.pc.medida{border-color:rgba(214,194,140,.2) !important;background:linear-gradient(135deg,var(--bg2),var(--bg5)) !important}
.pc.medida:hover{border-color:rgba(214,194,140,.4) !important}
.pc.medida .pc-name{color:var(--gold)}
/* Blue accent for audit section */
.audit-box{border-color:rgba(33,78,250,.15) !important}
.audit-btn{background:var(--blue) !important;color:#fff !important}
.audit-btn:hover{opacity:.88}
.audit-check-val[style*="red"]{color:var(--red) !important}

/* ── PRICING URGENCY ──────────────────────────────────── */
.pc-urgency{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:1px;text-transform:uppercase;padding:5px 10px;background:rgba(255,94,91,.06);color:var(--red);border-radius:5px;margin-bottom:.875rem;display:inline-block}
.pc-price-orig{font-size:13px;color:var(--text3);text-decoration:line-through;text-decoration-color:rgba(255,94,91,.6);margin-bottom:-.2rem;font-family:"Inter",sans-serif}

/* Flags */
.lb-f{font-size:20px;font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif}
.lb-c{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;letter-spacing:1px;color:var(--text3)}
.lb{display:inline-flex!important;align-items:center;gap:4px}
.lb.on .lb-c{color:var(--lime)}

/* ── PRICING URGENCY ─── */
.pc-urgency{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:1px;text-transform:uppercase;padding:4px 8px;background:rgba(255,94,91,.06);color:var(--red);border-radius:5px;margin-bottom:.875rem;display:inline-block}
.pc-price-orig{font-size:13px;color:var(--text3);text-decoration:line-through;margin-bottom:-.2rem;font-family:"Inter",sans-serif;opacity:.6}

/* ── TYPOGRAPHY CONTRAST FIXES ───────────────────────── */
/* Small mono labels - must be visible */
.ey,.portc-ind,.pc-note,.pp-days,.mq-i,.mc-tag,.pt-time{
  color:var(--text2) !important;
}
/* Very small labels that need extra contrast */
.pc-name,.portc-ind{
  color:var(--text2) !important;
  letter-spacing:2px;
}
/* Badge on dark bg */
.pc-badge{
  letter-spacing:1px;
  font-size:10px;
}
/* Methodology tags - lime is fine */
.mc-tag{color:var(--lime) !important;opacity:.85}
/* Hero numbers labels */
.hn-l{color:var(--text2) !important;font-size:12px !important}
/* Chat timestamps and small text */
.cp-greeting,.hnotify-time{color:var(--text2) !important}
/* Process steps days */
.pp-days{color:var(--lime) !important;font-size:10px !important;opacity:.9}
/* Pain timeline meta */
.pt-time{color:var(--text2) !important}
/* Price foot items */
.pf-item{color:var(--text2) !important}
/* Trust items */
.ctrust{color:var(--text2) !important;font-size:13px !important}
/* Sub text - ensure readable */
.sub{color:var(--text2) !important;font-size:clamp(15px,1.4vw,18px) !important}
/* Eyebrow labels */
.ey{letter-spacing:3px !important;font-size:11px !important}
/* Desc text in cards - ensure visible */
.mc-desc,.hb-d,.pd p{
  color:#C8C6BF !important;
  font-size:12px !important;
  line-height:1.6 !important;
}
/* Port card metric */
.portc-metric{color:var(--text2) !important;font-size:12px !important}
/* Remove pc-urgency if no content */
.pc-urgency:empty{display:none}

/* ── CARD HOVER — CSS ONLY (replaces JS tilt) ────────── */
.meth-card:hover,.portc:hover,.hb:hover{
  transform:translateY(-4px);
  transition:transform .3s var(--e2),border-color .25s,background .25s;
}
.pc:hover{
  transform:translateY(-5px);
  transition:transform .3s var(--e2),border-color .25s;
}
.pc.feat:hover{transform:translateY(-8px)}


/* ── FLAG SVG ────────────────────────────────────────── */
.flag-svg{width:22px;height:16px;border-radius:2px;display:block;flex-shrink:0;box-shadow:0 0 0 1px rgba(255,255,255,.1)}
.lb{background:transparent;border:none;padding:5px 8px;border-radius:7px;cursor:pointer;transition:all .25s;display:inline-flex!important;align-items:center;gap:5px;opacity:.45;line-height:1;vertical-align:middle}
.lb-c{font-family:"JetBrains Mono",monospace;font-size:9px;font-weight:700;letter-spacing:1px;color:var(--text3);line-height:1;display:block}
.lb.on{background:rgba(200,255,60,.1);opacity:1}
.lb.on .lb-c{color:var(--lime)}
.lb:hover:not(.on){opacity:.8;background:rgba(255,255,255,.05)}
.lsw{display:flex;gap:2px;background:var(--b0);border:1px solid var(--b1);border-radius:10px;padding:4px;align-items:center}

/* ── LOGO ANIMATION ──────────────────────────────────── */
.lime-letter{
  color:var(--lime) !important;
  animation:limePulse 3s ease-in-out infinite;
  display:inline-block;
}
.lime-letter:last-child{animation-delay:.4s}
@keyframes limePulse{
  0%,100%{text-shadow:none;opacity:1}
  50%{text-shadow:0 0 14px rgba(200,255,60,.7),0 0 28px rgba(200,255,60,.3);opacity:.85}
}
/* Logo hover: letters wave */
#logo:hover .lc{
  animation:logoWave .5s var(--e2) both;
  animation-delay:calc(var(--i)*.04s);
}
@keyframes logoWave{
  0%{transform:translateY(0)}
  40%{transform:translateY(-6px) scale(1.1);color:var(--lime)}
  100%{transform:translateY(0)}
}

/* ── SECTION TRANSITIONS — improved ─────────────────── */
#transition-scan{
  position:fixed;left:0;right:0;height:3px;
  background:linear-gradient(90deg,transparent,var(--lime),var(--lime),transparent);
  z-index:9994;pointer-events:none;
  transform:scaleX(0);transform-origin:left;
  box-shadow:0 0 30px var(--lime),0 0 60px rgba(200,255,60,.4),0 -4px 20px rgba(200,255,60,.2);
}
#transition-flash{
  position:fixed;inset:0;z-index:9995;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(200,255,60,.06) 0%,transparent 70%);
  opacity:0;
}

/* ── MOBILE FIXES ────────────────────────────────────── */


/* ── PRICING CLEANUP ─────────────────────────────────── */
.pc-price-orig{display:none!important}
.pc-urgency:empty,.pc-urgency{display:none!important}

/* ── CARD HOVER CSS (no JS tilt) ─────────────────────── */
.meth-card,.portc,.hb,.pp{
  transition:transform .3s var(--e2),border-color .25s,background .25s,box-shadow .25s!important;
}
.meth-card:hover,.portc:hover,.hb:hover{
  transform:translateY(-4px)!important;
  box-shadow:0 12px 32px rgba(0,0,0,.3)!important;
}
.pc:not(.feat):hover{transform:translateY(-5px)!important}
.pc.feat:hover{transform:translateY(-8px)!important}

/* ── SCROLL BEHAVIOR ─────────────────────────────────── */


/* ═══════════════════════════════════════════════════
   RESPONSIVE — MOBILE FIRST CLEAN REBUILD
   Desktop (>700px): full-screen sections, position absolute
   Mobile (≤700px): normal block flow, scroll
═══════════════════════════════════════════════════ */

/* ── DESKTOP: full-screen panel navigation ─────────── */
@media(min-width:701px){
  html,body{overflow:hidden;height:100%}
  #wrap{position:relative;width:100%;height:100%;overflow:hidden}
  .pnl{position:absolute;top:0;left:0;width:100%;height:100%}
  .pnl--up{display:flex!important}
  .pnl--dn{display:flex!important}
  #sidenav{display:flex}
}

/* ── MEDIUM: tablet adjustments ───────────────────── */
@media(max-width:1100px) and (min-width:701px){
  .meth-grid{grid-template-columns:repeat(3,1fr)}
  .price-grid{grid-template-columns:1fr;max-width:480px;margin:1.5rem auto 0}
  .pc.feat{transform:none!important}
  .proc-phases{grid-template-columns:1fr 1fr}
  .proc-phases::before{display:none!important}
  .proc-detail{grid-template-columns:1fr}
  .portc{flex-basis:250px}
  .host-w,.cont-w{grid-template-columns:1fr;gap:2rem}
  .showcase-wrap{max-width:100%}
  .chat-demo{display:none}
}

@media(max-width:1300px) and (min-width:1101px){
  .meth-grid{grid-template-columns:repeat(3,1fr);gap:1rem}
}

/* ── MOBILE: complete redesign ─────────────────────── */
@media(max-width:700px){
  /* === FOUNDATION === */
  *{-webkit-tap-highlight-color:transparent}
  html,body{
    overflow:auto!important;
    overflow-x:hidden!important;
    height:auto!important;
    cursor:auto!important;
  }
  #wrap{
    position:relative!important;
    height:auto!important;
    overflow:visible!important;
  }
  /* Hide cursor effects on mobile */
  #cd,#cr,.trail-letter,.spark,.key-float{display:none!important}
  
  /* === SECTIONS: block flow === */
  .pnl{
    position:relative!important;
    transform:none!important;
    height:auto!important;
    min-height:100svh;
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    padding:5.5rem 1.25rem 3rem!important;
    box-sizing:border-box!important;
  }
  /* Show all panels */
  .pnl--up,.pnl--dn,.pnl--on{
    display:flex!important;
    opacity:1!important;
    transform:none!important;
  }
  /* Canvas hidden on mobile (performance) */
  #hcv{display:none!important}
  
  /* === NAVIGATION === */
  #nav{
    position:fixed!important;
    padding:.875rem 1rem!important;
    background:rgba(6,6,11,.95)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
    border-bottom:1px solid rgba(255,255,255,.06)!important;
  }
  .logo{font-size:17px!important}
  .ncta{
    padding:.45rem .875rem!important;
    font-size:12px!important;
    white-space:nowrap!important;
  }
  .lsw{padding:2px!important;gap:1px!important}
  .lb{padding:3px 5px!important;gap:3px!important}
  .lb-c{font-size:8px!important;letter-spacing:.5px!important}
  .flag-svg{width:16px!important;height:12px!important}
  
  /* Hide side elements */
  #sidenav{display:none!important}
  #social-bar{display:none!important}
  #sp{display:none!important}
  
  /* === TYPOGRAPHY === */
  .h1{
    font-size:clamp(24px,7.5vw,36px)!important;
    letter-spacing:-1px!important;
    line-height:1.15!important;
  }
  .h2{
    font-size:clamp(24px,8vw,36px)!important;
    letter-spacing:-1px!important;
    line-height:1.1!important;
  }
  .sub{
    font-size:15px!important;
    line-height:1.65!important;
    margin-top:.875rem!important;
  }
  .ey{font-size:10px!important;margin-bottom:.75rem!important}
  
  /* === HERO (P0) === */
  .hero-nums{
    gap:1.5rem!important;
    margin-top:1.5rem!important;
    flex-wrap:wrap!important;
  }
  .hn-n{font-size:28px!important}
  .hn-l{font-size:10px!important}
  .hero-tw-wrap{min-height:28px!important}
  .hero-tw{font-size:14px!important}
  .badge{font-size:9px!important;padding:.25rem .75rem!important}
  .btns{gap:.5rem!important;margin-top:1.25rem!important}
  .bp,.bs{
    padding:.7rem 1.25rem!important;
    font-size:13px!important;
  }
  .hfloat{display:none!important}
  
  /* === PAIN TIMELINE (P1) === */
  .pain-w{max-width:100%!important;width:100%!important}
  .pain-tl{margin-top:.875rem!important}
  .pain-tl::before{left:11px!important}
  .pt{gap:.875rem!important;padding:.4rem 0!important}
  .pt-ico{width:22px!important;height:22px!important;font-size:10px!important;flex-shrink:0!important}
  .pt-t{font-size:13px!important}
  .pt-d{font-size:11px!important}
  .pt-time{font-size:9px!important}
  
  /* === METHODOLOGY (P2) === */
  .meth-w{max-width:100%!important}
  .meth-grid{
    grid-template-columns:1fr!important;
    gap:.625rem!important;
    margin-top:1rem!important;
  }
  .meth-card{padding:1rem!important}
  .mc-num{font-size:28px!important;margin-bottom:.5rem!important}
  .mc-title{font-size:14px!important}
  .mc-desc{font-size:12px!important}
  
  /* === PRICING (P3) === */
  .price-w{max-width:100%!important}
  .price-grid{
    grid-template-columns:1fr!important;
    gap:.75rem!important;
    margin-top:1rem!important;
  }
  .pc{padding:1.25rem!important}
  .pc.feat{transform:none!important;margin:0!important}
  .pnl--on .pc.feat{transform:none!important}
  .pc-price-num{font-size:44px!important}
  .pc-for{font-size:11px!important}
  .pc-item{font-size:12px!important}
  .price-foot{
    gap:.75rem!important;
    margin-top:.75rem!important;
    justify-content:flex-start!important;
  }
  .pf-item{font-size:9px!important}
  
  /* === PROCESS (P4) === */
  .proc-phases{
    grid-template-columns:1fr 1fr!important;
    gap:.625rem!important;
    margin-top:1.25rem!important;
  }
  .proc-phases::before{display:none!important}
  .proc-detail{
    grid-template-columns:1fr!important;
    gap:.5rem!important;
    margin-top:1rem!important;
  }
  .pp-circle{width:38px!important;height:38px!important;font-size:12px!important;margin-bottom:.875rem!important}
  .pp h5{font-size:12px!important}
  .pp p{font-size:11px!important}
  .pd{padding:.75rem!important}
  .pd h6{font-size:12px!important}
  .pd p{font-size:11px!important}
  
  /* === PORTFOLIO (P5) === */
  .port-w{max-width:100%!important}
  .port-carousel{gap:.75rem!important;padding:.5rem .25rem 1.25rem!important}
  .portc{flex:0 0 78vw!important;max-width:320px!important}
  .portc-imgwrap{height:150px!important}
  .portc-title{font-size:14px!important}
  .portc-yours{padding:1rem!important}
  .port-arrow{display:none!important}
  
  /* === HOST/CONCIERGE (P6) === */
  .host-w{
    grid-template-columns:1fr!important;
    gap:1.5rem!important;
  }
  .hb{padding:.75rem!important;gap:.625rem!important}
  .hb-t{font-size:12px!important}
  .hb-d{font-size:11px!important}
  .showcase-wrap{width:100%!important;max-width:100%!important}
  .showcase-msgs{height:150px!important}
  .showcase-msg{font-size:12px!important;max-width:95%!important}
  
  /* === AUDIT (P7) === */
  .audit-w{max-width:100%!important}
  .audit-box{padding:1.25rem!important}
  .audit-form{flex-direction:column!important;gap:.625rem!important}
  .audit-input{min-width:unset!important;width:100%!important}
  .audit-btn{width:100%!important}
  .audit-checks{
    grid-template-columns:repeat(3,1fr)!important;
    gap:.375rem!important;
  }
  .audit-check{padding:.5rem!important}
  .audit-check-ico{font-size:16px!important}
  .audit-check-label{font-size:8px!important}
  .audit-check-val{font-size:14px!important}
  
  /* === CONTACT (P8) === */
  .cont-w{
    grid-template-columns:1fr!important;
    gap:1.5rem!important;
    align-items:start!important;
  }
  .cont-offices{grid-template-columns:1fr 1fr!important;gap:.375rem!important}
  .office{padding:.5rem .75rem!important}
  .office-flag{font-size:20px!important}
  .office-city{font-size:13px!important}
  .fr2{grid-template-columns:1fr!important}
  .fg{margin-bottom:.625rem!important}
  .fg label{font-size:9px!important}
  .fg input,.fg textarea,.fg select{font-size:14px!important}/* Prevent iOS zoom */
  .fsb{font-size:14px!important}
  .social-row{gap:.375rem!important}
  .soc-btn{font-size:11px!important;padding:.4rem .625rem!important}
  
  /* === CHATBOT PANEL === */
  #hst{bottom:1rem!important;right:.875rem!important}
  #hbtn{width:48px!important;height:48px!important}
  #cpanel{
    position:fixed!important;
    width:calc(100% - 1.5rem)!important;
    left:.75rem!important;
    right:.75rem!important;
    bottom:4.5rem!important;
    max-height:70svh!important;
    z-index:800!important;
  }
  .cp-msgs{height:180px!important}
  
  /* === COOKIE === */
  #ck{
    left:.75rem!important;
    right:.75rem!important;
    max-width:none!important;
    bottom:5rem!important;
  }
  
  /* === MARQUEE === */
  #mq{display:none!important}
  
  /* === MODAL === */
  .mod{padding:1.5rem!important;margin:.75rem!important}
  
  /* === PROGRESS BAR === */
  #sp{display:none!important}
  
  /* === TRANSITIONS — simplified on mobile === */
  .pnl--on .fu,.pnl--on .fl,.pnl--on .fr{
    opacity:1!important;
    transform:none!important;
    transition-delay:0s!important;
  }
  .pnl--on .su{opacity:1!important;transform:none!important}
  
  /* Pain section items always visible */
  .pnl--on .pt,.pt{
    opacity:1!important;
    transform:none!important;
  }
  .pnl--on .meth-card,.meth-card{opacity:1!important;transform:none!important}
  .pnl--on .pc,.pc{opacity:1!important;transform:none!important}
  .pnl--on .pp,.pp{opacity:1!important;transform:none!important}
  .pnl--on .pd,.pd{opacity:1!important;transform:none!important}
  .pnl--on .portc,.portc{opacity:1!important;transform:none!important}
  .pnl--on .hb,.hb{opacity:1!important;transform:none!important}
  .pnl--on .office,.office{opacity:1!important;transform:none!important}
  .pnl--on .ctrust,.ctrust{opacity:1!important;transform:none!important}
  .pnl--on .form-wrap,.form-wrap{opacity:1!important;transform:none!important}
  .pnl--on .chat-demo,.chat-demo{opacity:1!important;transform:none!important}
  .pnl--on .audit-box,.audit-box{opacity:1!important;transform:none!important}
  .price-foot{opacity:1!important}
  .hero-line{transform:scaleX(1)!important}
  .pnl--on .proc-phases::before{transform:scaleX(1)!important}
}

/* ── TINY MOBILE (<400px) ─────────────────────────────── */
@media(max-width:400px){
  .h1{font-size:22px!important;line-height:1.15!important}
  .h2{font-size:22px!important}
  .hero-nums{gap:1rem!important}
  .hn-n{font-size:24px!important}
  .audit-checks{grid-template-columns:1fr 1fr!important}
  .pnl{padding:5rem .875rem 2.5rem!important}
}

/* ── MOBILE BOTTOM NAV ────────────────────────────────── */
#mobile-nav{
  display:none;
  position:fixed;
  bottom:0;left:0;right:0;
  z-index:600;
  background:rgba(6,6,11,.95);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-top:1px solid rgba(255,255,255,.06);
  padding:.5rem 0 calc(.5rem + env(safe-area-inset-bottom));
  overflow-x:auto;
  scrollbar-width:none;
}
#mobile-nav::-webkit-scrollbar{display:none}
.mnav-inner{
  display:flex;
  gap:0;
  min-width:max-content;
  padding:0 .75rem;
}
.mnav-btn{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  background:none;
  border:none;
  padding:.375rem .875rem;
  cursor:pointer;
  color:var(--text3);
  font-family:"JetBrains Mono",monospace;
  font-size:8px;
  letter-spacing:.5px;
  text-transform:uppercase;
  transition:color .2s;
  white-space:nowrap;
}
.mnav-btn.on{color:var(--lime)}
.mnav-btn-dot{
  width:4px;height:4px;
  border-radius:50%;
  background:currentColor;
  opacity:.6;
}
.mnav-btn.on .mnav-btn-dot{
  width:12px;
  border-radius:3px;
  opacity:1;
}
@media(max-width:700px){
  #mobile-nav{display:block!important}
  #hst{bottom:4.5rem!important}
  #ck{bottom:4.5rem!important}
  body{padding-bottom:0!important}
}

@media(max-width:700px){
  /* Videos: even darker overlay for text readability */
  .pnl-video::after{background:rgba(6,6,11,.82)!important}
  #p0 .pnl-video::after{background:rgba(6,6,11,.72)!important}
  /* Ensure video itself is behind content */
  .pnl-video{z-index:0!important}
  /* Pain section always scrollable */
  #p1{overflow-y:visible!important;min-height:auto!important;height:auto!important}
  /* Make all sections at least viewport height but allow growth */
  .pnl{min-height:100svh!important;height:auto!important}
  /* Chatbot full width when open */
  #cpanel.open{
    transform:scale(1) translateY(0)!important;
    opacity:1!important;
  }
}
