/* KASBOKAR V104 — Cinematic Interaction Layer */
:root{--page-x:50%;--page-y:25%;--scroll-ratio:0;--v104-glow:#7a7cff}
body{background:#070817}
.global-pointer-ambient{position:fixed;inset:0;z-index:-3;pointer-events:none;background:radial-gradient(560px circle at var(--page-x) var(--page-y),rgba(83,141,255,.07),transparent 56%);opacity:.9}

/* header cinematic polish */
.site-header{transition:transform .35s ease,opacity .3s ease}
.header-inner{position:relative;overflow:hidden}
.header-inner::after{content:"";position:absolute;left:-25%;bottom:0;width:25%;height:1px;background:linear-gradient(90deg,transparent,#45e7ff,#7a7cff,transparent);animation:headerScan 5.5s linear infinite;opacity:.65}
@keyframes headerScan{to{left:110%}}
.header-cta,.button{position:relative;overflow:hidden}
.header-cta::after,.button::after{content:"";position:absolute;inset:-2px auto -2px -42%;width:34%;transform:skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent);transition:left .5s ease;pointer-events:none}
.header-cta:hover::after,.button:hover::after{left:112%}

/* hero parallax variables controlled by JS */
.hero.hero-v102{--hero-shift:0px}
.hero-v102-grid{translate:0 calc(var(--hero-shift) * .18)}
.hero-v102-copy{transform:translateY(calc(var(--hero-shift) * -.08));transition:transform .08s linear}
.gateway-experience{transform:translateY(calc(var(--hero-shift) * -.045));transition:transform .08s linear}
.hero-scroll-hint{position:absolute;z-index:6;bottom:14px;left:50%;translate:-50% 0;display:grid;justify-items:center;gap:8px;color:#71829d;font:700 7px/1 ui-monospace,monospace;letter-spacing:.2em;direction:ltr;pointer-events:none}
.hero-scroll-hint i{display:block;width:1px;height:32px;background:linear-gradient(#7a7cff,#45e7ff,transparent);animation:scrollHint 1.7s ease-in-out infinite;transform-origin:top}
@keyframes scrollHint{50%{transform:scaleY(.45);opacity:.45}}

/* holding console */
.holding-console{overflow:hidden}
.holding-console::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 34%,rgba(69,231,255,.035) 48%,transparent 62%);translate:-100% 0;animation:holdingSweep 8s ease-in-out infinite}
@keyframes holdingSweep{50%,100%{translate:100% 0}}
.holding-preview{transition:background .45s ease,border-color .35s ease,box-shadow .35s ease}
.holding-chip::after{content:"";position:absolute;right:12px;left:12px;bottom:7px;height:2px;border-radius:99px;background:linear-gradient(90deg,#7a7cff,#45e7ff);transform:scaleX(0);opacity:0;transition:.24s}
.holding-chip.is-active::after{transform:scaleX(1);opacity:.85}

/* radar is now a live cockpit */
.radar-cockpit-v104{transform-style:preserve-3d;transition:transform .18s ease,box-shadow .3s ease}
.radar-cockpit-v104::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(260px circle at var(--radar-px,50%) var(--radar-py,50%),color-mix(in srgb,var(--active-c1,#45e7ff) 10%,transparent),transparent 60%);opacity:.75}
.radar-active-link-v104{position:absolute;z-index:3;height:1px;left:50%;top:var(--radar-cy,50%);width:0;transform-origin:0 50%;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.04),var(--active-c1,#45e7ff),var(--active-c2,#7a7cff),transparent);box-shadow:0 0 18px color-mix(in srgb,var(--active-c1,#45e7ff) 45%,transparent);transition:width .28s ease,transform .28s ease,opacity .2s ease;opacity:.9}
.radar-active-link-v104::before{content:"";position:absolute;right:0;top:50%;width:7px;height:7px;border-radius:50%;translate:50% -50%;background:var(--active-c1,#45e7ff);box-shadow:0 0 0 6px color-mix(in srgb,var(--active-c1,#45e7ff) 10%,transparent),0 0 22px var(--active-c1,#45e7ff)}
.radar-blip{transition:transform .2s ease,filter .2s ease,opacity .2s ease}
.radar-blip.is-active{z-index:10;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--c1) 62%,transparent))}
.radar-blip.is-active .radar-blip-dot{transform:scale(1.18);box-shadow:0 0 0 7px color-mix(in srgb,var(--c1) 10%,transparent),0 0 28px color-mix(in srgb,var(--c1) 60%,transparent)}
.radar-v104-status{position:absolute;z-index:18;top:17px;left:18px;display:flex;gap:7px;align-items:center;direction:ltr;font:700 6.5px/1 ui-monospace,monospace;color:#8ca0bd;letter-spacing:.08em}
.radar-v104-status span{display:flex;align-items:center;gap:5px;padding:6px 8px;border-radius:999px;background:rgba(4,10,22,.62);border:1px solid rgba(136,175,235,.12);backdrop-filter:blur(10px)}
.radar-v104-status i{width:6px;height:6px;border-radius:50%;background:#56f2c5;box-shadow:0 0 12px #56f2c5;animation:v104RadarPulse 1.5s ease-in-out infinite}
@keyframes v104RadarPulse{50%{opacity:.35;box-shadow:0 0 3px #56f2c5}}
.radar-stage-v101.is-user-active .radar-v104-status span:first-child{color:#fff}
.radar-stage-v101.is-user-active .radar-v104-status span:first-child::after{content:"MANUAL";margin-left:4px;color:#45e7ff}

/* design section: premium bento */
.design-outcomes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0 24px}
.design-outcomes article{position:relative;min-height:140px;padding:18px;border-radius:21px;border:1px solid rgba(161,198,255,.1);background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.018));overflow:hidden;transition:.25s ease}
.design-outcomes article::before{content:"";position:absolute;inset:0;background:radial-gradient(150px circle at 100% 0,rgba(122,124,255,.12),transparent 55%);opacity:.75}
.design-outcomes article:hover{translate:0 -4px;border-color:rgba(116,190,255,.22);box-shadow:0 24px 60px rgba(0,0,0,.2)}
.design-outcomes span{position:relative;display:block;color:#7688a5;font:800 9px/1 ui-monospace,monospace;direction:ltr;margin-bottom:28px}
.design-outcomes b{position:relative;display:block;font-size:17px;color:#fff;margin-bottom:7px}
.design-outcomes small{position:relative;color:#aebdd5;font-size:10.5px;line-height:1.8}
.bento-service-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:dense}
.bento-service-grid .service-card:nth-child(1),.bento-service-grid .service-card:nth-child(4){grid-column:span 2;min-height:250px}
.bento-service-grid .service-card:nth-child(1) h3,.bento-service-grid .service-card:nth-child(4) h3{font-size:22px}
.bento-service-grid .service-card:nth-child(1) p,.bento-service-grid .service-card:nth-child(4) p{max-width:45ch}
.modern-service-card{min-height:220px;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.modern-service-card:hover{border-color:rgba(109,190,255,.18)}

/* more tactile domain cards */
.domain-card-v101{transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .25s,box-shadow .25s}
.domain-card-v101:hover{transform:translateY(-8px) scale(1.015)}
.domain-card-v101:active,.holding-chip:active,.button:active{transform:scale(.98)}

/* inertia cursor */
.cursor-orb-v104,.cursor-dot-v104{position:fixed;z-index:129;pointer-events:none;border-radius:50%;left:0;top:0;translate:-50% -50%;opacity:0;transition:width .2s,height .2s,opacity .2s,border-color .2s,background .2s}
.cursor-orb-v104{width:34px;height:34px;border:1px solid rgba(124,193,255,.33);box-shadow:0 0 35px rgba(69,231,255,.07);backdrop-filter:blur(1px)}
.cursor-dot-v104{width:4px;height:4px;background:#dff7ff;box-shadow:0 0 12px #45e7ff}
.cursor-orb-v104.is-on,.cursor-dot-v104.is-on{opacity:1}
.cursor-orb-v104.is-hover{width:50px;height:50px;border-color:rgba(122,124,255,.42);background:rgba(122,124,255,.04)}

/* mobile quick dock */
.mobile-experience-dock{display:none}

@media(max-width:1100px){
  .design-outcomes{grid-template-columns:1fr 1fr}
  .bento-service-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  body{padding-bottom:72px}
  .hero-scroll-hint,.cursor-orb-v104,.cursor-dot-v104{display:none!important}
  .design-outcomes{grid-template-columns:1fr 1fr;gap:7px;margin:13px 0 17px}
  .design-outcomes article{min-height:118px;padding:13px;border-radius:16px}
  .design-outcomes span{margin-bottom:18px;font-size:7px}.design-outcomes b{font-size:14px}.design-outcomes small{font-size:8.5px}
  .bento-service-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .bento-service-grid .service-card:nth-child(1),.bento-service-grid .service-card:nth-child(4){grid-column:span 2;min-height:190px}
  .radar-cockpit-v104{transform:none!important}
  .radar-v104-status{top:13px;left:12px;font-size:5.5px}.radar-v104-status span{padding:5px 6px}
  .radar-active-link-v104{opacity:.56}
  .mobile-experience-dock{position:fixed;z-index:125;right:8px;left:8px;bottom:max(8px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:7px;border-radius:20px;background:rgba(7,11,25,.88);border:1px solid rgba(160,195,255,.13);box-shadow:0 18px 60px rgba(0,0,0,.38);backdrop-filter:blur(18px) saturate(1.25)}
  .mobile-experience-dock a{display:grid;justify-items:center;align-content:center;gap:4px;min-height:47px;border-radius:14px;color:#aebbd1;font-size:7px;border:1px solid transparent;transition:.18s}
  .mobile-experience-dock svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
  .mobile-experience-dock a.is-active{color:#fff;background:rgba(100,156,255,.08);border-color:rgba(126,187,255,.11)}
  .mobile-experience-dock .dock-primary{background:linear-gradient(135deg,rgba(122,124,255,.22),rgba(69,231,255,.12));color:#fff;border-color:rgba(132,188,255,.16)}
  .site-footer{padding-bottom:26px}
}
@media(max-width:430px){
  .design-outcomes{grid-template-columns:1fr}
  .bento-service-grid{grid-template-columns:1fr!important}
  .bento-service-grid .service-card:nth-child(1),.bento-service-grid .service-card:nth-child(4){grid-column:auto;min-height:180px}
  .mobile-experience-dock{right:5px;left:5px;bottom:max(5px,env(safe-area-inset-bottom));padding:5px;border-radius:17px}
  .mobile-experience-dock a{min-height:45px;border-radius:12px}
}
@media(prefers-reduced-motion:reduce){.header-inner::after,.holding-console::after,.hero-scroll-hint i,.radar-v104-status i{animation:none!important}.hero-v102-copy,.gateway-experience{transform:none!important}}