/* ==========================================================================
   KrishVerse — Design System
   Signal × Orbit
   ========================================================================== */

@font-face{font-family:'Bricolage';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/Bricolage-Variable.woff2') format('woff2');}
@font-face{font-family:'Bricolage';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/Bricolage-Variable.woff2') format('woff2');}
@font-face{font-family:'InstrumentSerif';font-style:italic;font-weight:400;font-display:swap;src:url('../assets/fonts/InstrumentSerif-Italic.woff2') format('woff2');}
@font-face{font-family:'InstrumentSans';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/InstrumentSans-Variable.woff2') format('woff2');}
@font-face{font-family:'InstrumentSans';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/InstrumentSans-Variable.woff2') format('woff2');}

:root{
  --bg:#FAFAFC;
  --surface:#F3F0FA;
  --surface-2:#ECE7F7;
  --ink:#14101F;
  --ink-quiet:#5B5674;
  --ink-faint:#8A85A3;
  --indigo:#4A2FE0;
  --indigo-2:#6247E8;
  --violet:#8B4FE0;
  --pink:#E8469C;
  --pink-soft:#F8D6EC;
  --cyan:#1FB8AF;
  --line:rgba(20,16,31,0.10);
  --line-strong:rgba(20,16,31,0.20);
  --shadow: 0 20px 60px -30px rgba(20,16,31,0.35);
  --font-display:'Bricolage', ui-sans-serif, system-ui, sans-serif;
  --font-serif:'InstrumentSerif', Georgia, serif;
  --font-body:'InstrumentSans', ui-sans-serif, system-ui, sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B0912; --surface:#161027; --surface-2:#1D1733;
    --ink:#F4F2FB; --ink-quiet:#A79FC7; --ink-faint:#746C93;
    --indigo:#8879FF; --indigo-2:#7C6AFF; --violet:#B08CF5; --pink:#FA7BC0; --pink-soft:#2C1B33; --cyan:#46E9DC;
    --line:rgba(244,242,251,0.12); --line-strong:rgba(244,242,251,0.22);
    --shadow: 0 20px 60px -30px rgba(0,0,0,0.6);
  }
}
:root[data-theme="dark"]{
  --bg:#0B0912; --surface:#161027; --surface-2:#1D1733;
  --ink:#F4F2FB; --ink-quiet:#A79FC7; --ink-faint:#746C93;
  --indigo:#8879FF; --indigo-2:#7C6AFF; --violet:#B08CF5; --pink:#FA7BC0; --pink-soft:#2C1B33; --cyan:#46E9DC;
  --line:rgba(244,242,251,0.12); --line-strong:rgba(244,242,251,0.22);
  --shadow: 0 20px 60px -30px rgba(0,0,0,0.6);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ink); font-family:var(--font-body);
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
@media (max-width:640px){.wrap{padding:0 20px;}}

/* neural network background — persists on every page */
#neuralCanvas{ position:fixed; inset:-12px; width:calc(100% + 24px); height:calc(100% + 24px); z-index:0; pointer-events:none; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.page{position:relative; z-index:1;}
[hidden]{display:none !important;}

/* floating elements — larger ambient shapes layered above the canvas, behind content */
.floaters{position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none;}
.floater{
  position:absolute; border-radius:50%; filter:blur(2px);
  opacity:.5; animation:floatDrift 16s ease-in-out infinite;
  background:radial-gradient(circle at 32% 32%, var(--fc-a), var(--fc-b) 60%, transparent 75%);
}
.floater.ring{
  background:none; border:1.5px solid var(--fc-a); filter:none; opacity:.35;
}
.floater.dot{
  background:var(--fc-a); filter:none; opacity:.6; box-shadow:0 0 24px 2px var(--fc-a);
}
.floater.star{
  background:var(--fc-a); filter:none; opacity:.8; box-shadow:0 0 7px 1px var(--fc-a);
  animation-name:twinkle;
}
@keyframes floatDrift{
  0%{ transform:translate(0,0) rotate(0deg); }
  33%{ transform:translate(14px,-18px) rotate(6deg); }
  66%{ transform:translate(-10px,10px) rotate(-5deg); }
  100%{ transform:translate(0,0) rotate(0deg); }
}
@keyframes twinkle{
  0%,100%{ opacity:.12; transform:scale(.6); }
  50%{ opacity:1; transform:scale(1.2); }
}

/* preview badge */
.preview-badge{
  display:block; text-align:center; position:relative; z-index:2;
  font-family:var(--font-body); font-weight:500; font-size:11px;
  letter-spacing:.08em; text-transform:uppercase; color:var(--ink-quiet);
  background:var(--surface); border-bottom:1px solid var(--line); padding:9px 14px;
}
@media (max-width:640px){.preview-badge{font-size:9px; padding:7px 10px;}}

/* nav */
.nav{
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line);
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; height:76px;}
.brand{display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:700; font-size:18px; letter-spacing:-.01em; text-decoration:none; color:var(--ink); transition:color .2s ease;}
.brand:hover{color:var(--indigo);}
.nav-links{display:flex; gap:36px; list-style:none; margin:0; padding:0;}
.nav-links a{
  font-size:14px; font-weight:500; text-decoration:none; color:var(--ink-quiet);
  position:relative; padding-bottom:4px; transition:color .2s ease;
}
.nav-links a:hover, .nav-links a:focus-visible{color:var(--ink);}
.nav-links a::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1.5px;
  background:linear-gradient(90deg, var(--indigo), var(--pink));
  transition:right .25s ease;
}
.nav-links a:hover::after, .nav-links a:focus-visible::after{right:0;}
.nav-links a[aria-current="page"]{color:var(--ink);}
.nav-links a[aria-current="page"]::after{right:0;}
@media (max-width:820px){.nav-links{display:none;}}

/* hero */
.hero{position:relative; padding:96px 0 60px; overflow:hidden;}
.hero-inner{position:relative; z-index:2; text-align:center;}
.eyebrow{font-size:12px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-quiet); margin:0 0 28px;}
.eyebrow span{color:var(--indigo);}
.hero-lede{font-family:var(--font-serif); font-style:italic; font-weight:400; font-size:clamp(28px,4.4vw,44px); color:var(--ink-quiet); margin:0; line-height:1.1;}
.hero-title{
  font-family:var(--font-display); font-weight:700; margin:6px 0 30px;
  font-size:clamp(56px,12vw,148px); line-height:.94; letter-spacing:-.03em; text-wrap:balance;
  background:linear-gradient(100deg, var(--ink) 40%, var(--indigo-2) 65%, var(--violet) 78%, var(--pink) 96%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-sub{max-width:560px; margin:0 auto 40px; color:var(--ink-quiet); font-size:17px; line-height:1.65;}
.hero-ctas{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}

.btn{
  font-family:var(--font-body); font-weight:500; font-size:14.5px; text-decoration:none;
  padding:14px 26px; border-radius:99px; display:inline-flex; align-items:center; gap:8px;
  transition:transform .18s cubic-bezier(.2,.8,.3,1.3), box-shadow .25s ease, border-color .2s ease;
  border:none; cursor:pointer; will-change:transform;
}
.btn-solid{
  color:#fff; background:linear-gradient(120deg, var(--indigo), var(--violet) 55%, var(--pink));
  box-shadow:0 12px 30px -12px color-mix(in srgb, var(--indigo) 70%, transparent);
}
.btn-solid:hover{ box-shadow:0 16px 38px -12px color-mix(in srgb, var(--pink) 55%, var(--indigo) 45%); }
.btn-ghost{ color:var(--ink); background:transparent; border:1px solid var(--line-strong); }
.btn-ghost:hover{ border-color:var(--indigo); transform:translateY(-2px); background:var(--surface); }

/* section scaffolding */
section{padding:104px 0; position:relative;}
@media (max-width:640px){section{padding:72px 0;}}
.section-head{max-width:640px; margin:0 auto 56px; text-align:center;}
.section-head.left{margin:0 0 48px; text-align:left;}
.section-head .eyebrow{margin-bottom:14px;}
.section-title{font-family:var(--font-display); font-weight:700; font-size:clamp(30px,4.4vw,46px); letter-spacing:-.02em; margin:0 0 14px; text-wrap:balance;}
.section-title em{font-family:var(--font-serif); font-style:italic; font-weight:400; color:var(--indigo);}
.section-desc{color:var(--ink-quiet); font-size:16px; line-height:1.7; margin:0;}

/* page intro (Work / About / Capabilities / Contact headers) */
.page-hero{padding:88px 0 40px; text-align:center; position:relative; overflow:hidden;}
.page-hero .eyebrow{margin-bottom:22px;}
.page-hero h1{font-family:var(--font-display); font-weight:700; letter-spacing:-.02em; font-size:clamp(40px,7vw,84px); margin:0 0 22px; text-wrap:balance; line-height:1.02; position:relative; z-index:2;}
.page-hero h1 em{font-family:var(--font-serif); font-weight:400; font-style:italic; color:var(--indigo);}
.page-hero p{max-width:580px; margin:0 auto; color:var(--ink-quiet); font-size:17px; line-height:1.65; position:relative; z-index:2;}

/* statement */
.statement{padding:64px 0 40px;}
.statement p{font-family:var(--font-display); font-weight:700; text-align:center; font-size:clamp(26px,5vw,54px); line-height:1.18; letter-spacing:-.02em; max-width:920px; margin:0 auto; text-wrap:balance;}
.statement em{font-family:var(--font-serif); font-weight:400; font-style:italic; color:var(--indigo);}

/* capability map */
.cap-map{position:relative; aspect-ratio:1000/560; max-width:980px; margin:0 auto;}
.cap-lines{position:absolute; inset:0; width:100%; height:100%; transition:opacity .3s ease;}
.cap-lines.boost{opacity:1; filter:drop-shadow(0 0 6px color-mix(in srgb, var(--indigo) 45%, transparent));}
.cap-node{position:absolute; width:230px; transform:translate(-50%,-50%); text-align:left; cursor:default;}
.cap-node-dot{
  width:52px; height:52px; border-radius:50%; margin-bottom:14px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--indigo), var(--violet));
  box-shadow:0 10px 26px -10px color-mix(in srgb, var(--indigo) 60%, transparent);
  flex:none; transition:transform .3s cubic-bezier(.2,.8,.3,1.4), box-shadow .3s ease;
}
.cap-node:hover .cap-node-dot{ transform:scale(1.12) translateY(-2px); box-shadow:0 16px 34px -10px color-mix(in srgb, var(--pink) 50%, var(--indigo) 50%); }
.cap-node.hub .cap-node-dot{background:linear-gradient(135deg, var(--violet), var(--pink)); width:64px; height:64px;}
.cap-node-dot svg{width:22px; height:22px; stroke:#fff; fill:none; stroke-width:1.6;}
.cap-node.hub .cap-node-dot svg{width:26px; height:26px;}
.cap-node h3{font-family:var(--font-display); font-weight:700; font-size:16.5px; margin:0 0 6px;}
.cap-node p{font-size:13.5px; color:var(--ink-quiet); line-height:1.55; margin:0;}
.cap-n1{left:18%; top:31%;} .cap-n2{left:17%; top:73%;} .cap-n3{left:50%; top:15%; width:250px;}
.cap-n4{left:83%; top:37%; text-align:right;} .cap-n4 .cap-node-dot{margin-left:auto;} .cap-n5{left:63%; top:83%;}
@media (max-width:880px){
  .cap-map{aspect-ratio:auto; display:flex; flex-direction:column; gap:28px;}
  .cap-lines{display:none;}
  .cap-node{position:static; transform:none; width:100%; text-align:left !important;}
  .cap-node-dot{margin-left:0 !important;}
}
.cap-more{text-align:center; margin-top:48px;}
.cap-more a{
  font-family:var(--font-display); font-size:18px; font-weight:700; color:var(--indigo);
  text-decoration:none; display:inline-flex; align-items:center; gap:8px;
  padding-bottom:4px; border-bottom:2px solid var(--indigo);
  transition:gap .25s cubic-bezier(.2,.8,.25,1.2), color .2s ease, border-color .2s ease;
}
.cap-more a:hover{ gap:16px; color:var(--pink); border-color:var(--pink); }

/* stats */
.stats-path{position:relative; max-width:1040px; margin:0 auto;}
.stats-row{display:flex; justify-content:space-between; gap:12px; position:relative;}
.stats-row::before{content:''; position:absolute; left:26px; right:26px; top:26px; height:1px; background:linear-gradient(90deg, var(--indigo), var(--violet), var(--pink)); opacity:.4;}
.stat{position:relative; flex:1; text-align:center;}
.stat-dot{
  width:12px; height:12px; border-radius:50%; margin:0 auto 22px;
  background:linear-gradient(135deg, var(--indigo), var(--pink));
  box-shadow:0 0 0 5px var(--bg), 0 0 0 6px var(--line-strong);
  transition:transform .3s cubic-bezier(.2,.8,.3,1.4), box-shadow .3s ease;
}
.stat:hover .stat-dot{ transform:scale(1.5); box-shadow:0 0 0 5px var(--bg), 0 0 0 6px var(--indigo), 0 0 16px 2px var(--pink); }
.stat-num{font-family:var(--font-display); font-weight:700; font-size:clamp(28px,4vw,44px); letter-spacing:-.02em; transition:color .25s ease;}
.stat:hover .stat-num{color:var(--indigo);}
.stat-label{font-size:12.5px; color:var(--ink-quiet); margin-top:6px; letter-spacing:.03em;}
@media (max-width:760px){
  .stats-row{flex-direction:column; gap:34px; align-items:flex-start;}
  .stats-row::before{left:5px; top:0; bottom:0; right:auto; width:1px; height:auto; background:linear-gradient(180deg, var(--indigo), var(--violet), var(--pink));}
  .stat{display:flex; align-items:center; gap:18px; text-align:left;}
  .stat-dot{margin:0;}
}

/* generic slider component */
.slider{position:relative;}
.slider-track{
  display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x proximity;
  padding:2px 2px 10px; scrollbar-width:none; -ms-overflow-style:none; touch-action:pan-y; cursor:grab;
}
.slider-track:active{cursor:grabbing;}
.slider-track::-webkit-scrollbar{display:none;}
.slider-track > *{scroll-snap-align:start; flex:0 0 auto;}
.slider-nav{display:flex; gap:10px; justify-content:flex-end; margin-top:6px;}
.slider-btn{
  width:40px; height:40px; border-radius:50%; border:1px solid var(--line-strong);
  background:var(--bg); color:var(--ink); display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:background .2s ease, transform .15s ease, border-color .2s ease; flex:none;
}
.slider-btn:hover{background:var(--indigo); color:#fff; border-color:var(--indigo); transform:translateY(-2px);}
.slider-btn:active{transform:scale(.94);}
.slider-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;}
.slider-btn:disabled{opacity:.3; cursor:default; pointer-events:none; transform:none; background:var(--bg); color:var(--ink); border-color:var(--line-strong);}

/* work cards */
.work-card{
  position:relative; border-radius:26px; padding:26px; background:var(--surface);
  border:1px solid var(--line); overflow:hidden; text-decoration:none; color:var(--ink);
  display:flex; flex-direction:column; gap:38px; min-height:200px; width:280px;
  transition:transform .3s cubic-bezier(.2,.8,.25,1.2), border-color .25s ease, box-shadow .3s ease;
}
.work-card:hover{transform:translateY(-6px) scale(1.015); border-color:var(--line-strong); box-shadow:var(--shadow);}
.work-card::before{
  content:''; position:absolute; width:180px; height:180px; border-radius:50%; right:-70px; top:-70px; opacity:.5; filter:blur(2px);
  background:radial-gradient(circle at 30% 30%, var(--glow-a), var(--glow-b) 60%, transparent 72%);
  transition:transform .4s ease, opacity .4s ease;
}
.work-card:hover::before{ transform:scale(1.25) translate(-8px,8px); opacity:.75; }
.work-card .platform{font-size:11px; letter-spacing:.09em; text-transform:uppercase; font-weight:500; color:var(--ink-quiet); position:relative; z-index:1;}
.work-card .bottom{position:relative; z-index:1;}
.work-card h3{font-family:var(--font-display); font-weight:700; font-size:19px; margin:0 0 6px;}
.work-card p{font-size:13px; color:var(--ink-quiet); margin:0; line-height:1.5;}
.work-card .go{font-size:12px; font-weight:500; color:var(--indigo); margin-top:12px; display:inline-flex; align-items:center; gap:5px; transition:gap .2s ease;}
.work-card:hover .go{gap:9px;}
.dual-badge{
  align-self:flex-start; position:relative; z-index:2; font-size:10.5px; font-weight:500; letter-spacing:.04em; color:#fff;
  background:linear-gradient(120deg, var(--indigo), var(--pink)); padding:5px 11px; border-radius:99px; margin-bottom:-14px;
}
.work-more{text-align:center; margin-top:12px;}

/* work page categories */
.work-cat{margin-bottom:64px;}
.work-cat:last-child{margin-bottom:0;}
.work-cat-head{display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:22px; flex-wrap:wrap;}
.work-cat-head h3{font-family:var(--font-display); font-weight:700; font-size:22px; margin:0;}
.work-cat-head p{font-size:14px; color:var(--ink-quiet); margin:0;}

/* process / capabilities */
.process-list{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:24px; overflow:hidden;}
@media (max-width:760px){.process-list{grid-template-columns:1fr;}}
.process-item{background:var(--bg); padding:36px 28px; position:relative; z-index:1; transition:background .25s ease, transform .3s cubic-bezier(.2,.8,.25,1.2), box-shadow .3s ease;}
.process-item:hover{background:var(--surface); transform:translateY(-6px); box-shadow:var(--shadow); z-index:2;}
.process-item .pi-label{font-family:var(--font-serif); font-style:italic; font-size:22px; color:var(--indigo); margin:0 0 14px; transition:color .25s ease;}
.process-item:hover .pi-label{color:var(--pink);}
.process-item h3{font-family:var(--font-display); font-weight:700; font-size:19px; margin:0 0 10px;}
.process-item p{font-size:13.5px; color:var(--ink-quiet); line-height:1.6; margin:0;}
.process-item .arrow{position:absolute; right:-1px; top:50%; transform:translate(50%,-50%); z-index:2; color:var(--ink-faint); font-size:16px;}
@media (max-width:760px){.process-item .arrow{display:none;}}

.phase-slider .slider-track{gap:22px;}
.phase-panel{
  width:300px; background:var(--surface); border:1px solid var(--line); border-radius:26px; padding:32px 28px;
  display:flex; flex-direction:column; gap:16px; transition:transform .3s ease, border-color .25s ease, box-shadow .3s ease;
}
.phase-panel:hover{ transform:translateY(-5px); border-color:var(--indigo); box-shadow:var(--shadow); }
.phase-panel .pi-label{font-family:var(--font-serif); font-style:italic; font-size:26px; color:var(--indigo); margin:0;}
.phase-panel h3{font-family:var(--font-display); font-weight:700; font-size:22px; margin:0;}
.phase-panel p{font-size:14px; color:var(--ink-quiet); line-height:1.6; margin:0;}
.tool-row{display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; mask-image:linear-gradient(90deg, #000 88%, transparent 100%); -webkit-mask-image:linear-gradient(90deg, #000 88%, transparent 100%);}
.tool-row::-webkit-scrollbar{display:none;}
.tool-chip{flex:none; font-size:12px; font-weight:500; color:var(--ink-quiet); background:var(--surface-2); border:1px solid var(--line); padding:6px 12px; border-radius:99px; white-space:nowrap; transition:background .2s ease, color .2s ease, transform .2s ease;}
.tool-chip:hover{background:var(--indigo); color:#fff; transform:translateY(-2px);}

/* about page timeline */
.timeline-slider .slider-track{gap:0; padding-top:34px;}
.timeline-card{width:300px; padding:0 24px 0 0; margin-right:0; position:relative; transition:transform .3s ease;}
.timeline-card:hover{transform:translateY(-4px);}
.timeline-card::before{
  content:''; position:absolute; top:-22px; left:0; width:12px; height:12px; border-radius:50%;
  background:linear-gradient(135deg, var(--indigo), var(--pink)); box-shadow:0 0 0 5px var(--bg);
  transition:transform .3s ease, box-shadow .3s ease;
}
.timeline-card:hover::before{ transform:scale(1.4); box-shadow:0 0 0 5px var(--bg), 0 0 12px 2px var(--pink); }
.timeline-card::after{content:''; position:absolute; top:-17px; left:12px; right:0; height:1px; background:linear-gradient(90deg, var(--line-strong), transparent);}
.timeline-card:last-child::after{display:none;}
.timeline-range{font-size:12px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; color:var(--indigo); margin-bottom:10px;}
.timeline-card h3{font-family:var(--font-display); font-weight:700; font-size:19px; margin:0 0 4px;}
.timeline-org{font-size:13.5px; color:var(--ink-quiet); margin-bottom:12px;}
.timeline-card p.tl-note{font-size:13.5px; color:var(--ink-quiet); line-height:1.6; margin:0;}

.about-intro{max-width:680px; margin:0 auto 64px;}
.about-intro p{font-size:18px; line-height:1.75; color:var(--ink); margin:0 0 20px;}
.skills-row{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:24px;}
.skill-chip{font-size:12.5px; font-weight:500; color:var(--ink-quiet); background:var(--surface); border:1px solid var(--line); padding:7px 14px; border-radius:99px; transition:background .2s ease, color .2s ease, transform .2s ease;}
.skill-chip:hover{background:var(--indigo); color:#fff; transform:translateY(-2px) scale(1.04);}

/* personality */
.personality{max-width:720px; margin:0 auto; text-align:left;}
.personality p{font-size:18px; line-height:1.75; color:var(--ink); margin:0 0 20px;}
.personality p:last-child{margin-bottom:0; color:var(--ink-quiet); font-size:15.5px;}

/* contact */
.contact{position:relative; overflow:hidden; text-align:center;}
.contact-glow{position:absolute; inset:auto 0 0 0; height:420px; z-index:0; background:radial-gradient(ellipse 60% 100% at 50% 100%, color-mix(in srgb, var(--violet) 28%, transparent), transparent 70%);}
.contact-inner{position:relative; z-index:1;}
.contact h2{font-family:var(--font-display); font-weight:700; letter-spacing:-.02em; font-size:clamp(32px,6vw,64px); margin:0 0 24px; text-wrap:balance;}
.contact h2 em{font-family:var(--font-serif); font-weight:400; font-style:italic; color:var(--indigo);}
.contact-links{display:flex; gap:28px; justify-content:center; flex-wrap:wrap; margin:32px 0 8px; font-size:15px;}
.contact-links a{text-decoration:none; color:var(--ink-quiet); border-bottom:1px solid var(--line-strong); padding-bottom:2px; transition:color .2s ease, border-color .2s ease;}
.contact-links a:hover{color:var(--indigo); border-color:var(--indigo);}

footer{position:relative; z-index:1; background:var(--bg); border-top:1px solid var(--line); padding:32px 0; text-align:center; font-size:12.5px; color:var(--ink-faint);}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation:none !important; transition:none !important;}
}

.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:none;}

/* custom cursor + sparkle trail */
@media (hover:hover) and (pointer:fine){
  body.custom-cursor, body.custom-cursor a, body.custom-cursor button{ cursor:none; }
}
#cursorDot{
  position:fixed; top:0; left:0; width:14px; height:14px; border-radius:50%;
  background:radial-gradient(circle at 34% 32%, #fff, var(--pink) 42%, var(--indigo) 100%);
  pointer-events:none; z-index:9999; will-change:transform;
  box-shadow:0 0 12px 2px color-mix(in srgb, var(--pink) 55%, transparent);
  opacity:0; transition:opacity .3s ease, width .15s ease, height .15s ease;
}
#cursorDot.active{opacity:1;}
#cursorDot.pressed{width:9px; height:9px;}
.sparkle{
  position:fixed; top:0; left:0; width:5px; height:5px; border-radius:50%;
  pointer-events:none; z-index:9998; background:var(--sc, var(--cyan));
  box-shadow:0 0 7px 1px var(--sc, var(--cyan));
  animation:sparkleFade .75s ease-out forwards;
}
@keyframes sparkleFade{
  0%{ opacity:1; transform:translate(-50%,-50%) scale(1) translateY(0); }
  100%{ opacity:0; transform:translate(-50%,-50%) scale(0) translateY(-16px); }
}
@media (prefers-reduced-motion: reduce){
  #cursorDot, .sparkle{ display:none !important; }
}