/* CodeN Consulting — shared styles across all pages */

/* Native cross-document view transitions: gives full-page navigation between
   index/booking/ai-lab an SPA-like crossfade instead of a hard cut. No-ops
   silently in browsers that don't support it yet. */
@view-transition{navigation:auto;}
::view-transition-old(root),::view-transition-new(root){animation-duration:.45s;animation-timing-function:cubic-bezier(.16,.84,.44,1);}
header{view-transition-name:site-header;}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:#070b14;font-family:'Inter Tight',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;}
a{color:#4aa3ff;}
a:hover{color:#9bd0ff;}

@keyframes cn-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes cn-pan{0%{background-position:0 0}100%{background-position:60px 60px}}
@keyframes cn-pulse{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes cn-ripple-anim{to{transform:scale(1);opacity:0;}}
@keyframes cn-pop-in{0%{opacity:0;transform:scale(.92) translateY(10px);}60%{opacity:1;transform:scale(1.015) translateY(0);}100%{transform:scale(1);}}
@keyframes cn-slot-pop{0%{transform:scale(1);}40%{transform:scale(1.08);}100%{transform:scale(1);}}
@keyframes cn-shake{0%,100%{transform:translateX(0);}20%{transform:translateX(-6px);}40%{transform:translateX(5px);}60%{transform:translateX(-4px);}80%{transform:translateX(3px);}}

.cn-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.16,.84,.44,1),transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:calc(var(--reveal-i,0) * 70ms);}
.cn-reveal.cn-in{opacity:1;transform:none;}
.cn-reveal-right{opacity:0;transform:translateX(28px);transition:opacity .7s cubic-bezier(.16,.84,.44,1),transform .7s cubic-bezier(.16,.84,.44,1);transition-delay:calc(var(--reveal-i,0) * 70ms);}
.cn-reveal-right.cn-in{opacity:1;transform:none;}

.cn-link{position:relative;color:rgba(255,255,255,.72);text-decoration:none;font-size:14px;font-weight:500;letter-spacing:.01em;transition:color .2s;}
.cn-link:hover{color:#fff;}
.cn-link::after{content:'';position:absolute;left:0;right:100%;bottom:-4px;height:1.5px;background:#4aa3ff;transition:right .25s cubic-bezier(.16,.84,.44,1);}
.cn-link:hover::after,.cn-link.cn-active::after{right:0;}
.cn-link.cn-active{color:#fff;}

.cn-pill{transition:transform .35s cubic-bezier(.16,.84,.44,1),border-color .35s,box-shadow .35s;}
.cn-pill:hover{border-color:rgba(120,180,255,.55)!important;transform:translateY(-4px);}

.lab-card{transition:transform .35s cubic-bezier(.16,.84,.44,1),border-color .35s;}
.lab-card:hover{transform:translateY(-4px);border-color:rgba(74,163,255,.55)!important;}

/* Nav: subtle intensification once the page has scrolled */
header{transition:background .3s,box-shadow .3s,border-color .3s;}
header.cn-scrolled{box-shadow:0 12px 30px -18px rgba(0,0,20,.6);}

/* Buttons: shared press/ripple/magnetic-hover behavior, driven by motion.js */
.cn-btn{position:relative;overflow:hidden;cursor:pointer;--mx:0px;--my:0px;--btn-scale:1;transform:translate(var(--mx),var(--my)) scale(var(--btn-scale));transition:transform .35s cubic-bezier(.16,.84,.44,1),box-shadow .3s,border-color .3s,background .2s;}
.cn-btn-secondary:hover{background:rgba(74,163,255,.1);border-color:rgba(150,190,255,.6);}
.cn-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.35);transform:scale(0);pointer-events:none;animation:cn-ripple-anim .6s ease-out;}
.cn-btn-secondary .cn-ripple{background:rgba(120,170,255,.3);}

/* Booking form controls */
.bk-input{width:100%;padding:13px 16px;border-radius:12px;border:1px solid rgba(140,180,255,.24);background:rgba(14,24,46,.7);color:#eaf2ff;font-size:15px;font-family:inherit;outline:none;transition:border-color .2s,box-shadow .2s;}
.bk-input::placeholder{color:rgba(170,195,235,.45);}
.bk-input:focus{border-color:#4aa3ff;box-shadow:0 0 0 3px rgba(74,163,255,.18);}
.bk-focus{padding:10px 16px;border-radius:999px;border:1px solid rgba(140,180,255,.24);background:rgba(14,24,46,.7);color:#cfe0ff;font-size:14px;font-weight:600;cursor:pointer;transition:border-color .18s,background .18s,color .18s,transform .3s cubic-bezier(.34,1.56,.64,1);font-family:inherit;}
.bk-focus:hover{border-color:rgba(74,163,255,.6);transform:translateY(-2px);}
.bk-focus.on{background:linear-gradient(150deg,#1b7fe3,#0f55c0);border-color:transparent;color:#fff;animation:cn-slot-pop .32s cubic-bezier(.34,1.56,.64,1);}
.bk-submit{width:100%;padding:15px;border-radius:13px;border:none;cursor:pointer;font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:700;letter-spacing:.01em;color:#fff;background:linear-gradient(150deg,#1b7fe3,#0f55c0);box-shadow:0 14px 34px -10px rgba(27,127,227,.8);}
.bk-submit:hover:not(:disabled){box-shadow:0 18px 40px -10px rgba(27,127,227,.95);}
.bk-submit:disabled{opacity:.6;cursor:not-allowed;}
.bk-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}

.bk-panel{display:none;}
.bk-panel.bk-active{display:block;animation:cn-pop-in .5s cubic-bezier(.16,.84,.44,1);}
.bk-panel-grid{display:none;}
.bk-panel-grid.bk-active{display:grid;animation:cn-pop-in .5s cubic-bezier(.16,.84,.44,1);}
#bk-error.cn-shake{animation:cn-shake .4s ease;}

@media (max-width: 920px){
  .cn-hero-grid{grid-template-columns:1fr !important;gap:40px !important;}
  .cn-grid3{grid-template-columns:1fr !important;}
  .cn-grid4{grid-template-columns:repeat(2,1fr) !important;}
  .cn-approach{grid-template-columns:1fr !important;gap:36px !important;}
  .bk-grid{grid-template-columns:1fr !important;gap:40px !important;}
  .lab-grid2{grid-template-columns:1fr !important;}
  .lab-grid3{grid-template-columns:1fr !important;}
}
@media (max-width: 680px){
  .cn-nav-links a.cn-link{display:none;}
  .cn-grid4{grid-template-columns:1fr !important;}
  .cn-hero-sec{padding:64px 20px 72px !important;}
  .cn-sec{padding-left:20px !important;padding-right:20px !important;}
  .cn-cta-card{padding:38px 24px !important;}
  .cn-foot-right{text-align:left !important;}
}
@media (max-width: 560px){
  .bk-wrap{padding-left:20px !important;padding-right:20px !important;}
  .bk-card{padding:26px 20px !important;}
  .bk-2col{grid-template-columns:1fr !important;}
  .lab-sec{padding-left:20px !important;padding-right:20px !important;}
  .lab-nav-back{display:none !important;}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
  .cn-reveal,.cn-reveal-right{opacity:1;transform:none;}
  .cn-btn{--mx:0px !important;--my:0px !important;}
}