/* =========================================================
   AMOL JADHAV — PERSONAL BRAND SITE
   Design tokens per brief: dark enterprise palette,
   Space Grotesk / Inter / JetBrains Mono, glassmorphism.
   ========================================================= */

:root{
  /* New color system (dark theme) */
  --bg-primary: #02050a;    /* main page background */
  --bg-surface: #070b12;    /* card / panel background */
  --bg-surface-2: #03060b;  /* nested / inset surface */
  --line: #121826;          /* borders / dividers */
  --accent-amber: #F5A623;  /* primary accent */
  --accent-cyan: #46C2CB;   /* secondary accent */
  --success: #3DDC84;       /* status only */
  --danger: #FF6B6B;        /* error only */
  --text-primary: #E7EAF0;  /* main body text */
  --text-muted: #7C8699;    /* secondary text */
  --text-dim: #4E576A;      /* tertiary text */

  /* Backwards-compatible tokens mapped to new system */
  --bg-secondary: var(--bg-surface-2);
  --surface: var(--bg-surface);
  --glass: rgba(231,234,240,0.04);
  --glass-strong: rgba(231,234,240,0.06);
  --border: var(--line);
  --azure: var(--accent-amber);
  --azure-2: var(--accent-cyan);
  --cyan: var(--accent-cyan);
  --yellow: #FFD54F;
  --success-old: var(--success);
  --warning: #F9A825;
  --text: var(--text-primary);
  --text-secondary: var(--text-primary);
  --muted: var(--text-muted);

  --font-display:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'JetBrains Mono', monospace;

  --space-1:8px; --space-2:16px; --space-3:24px; --space-4:32px;
  --space-5:48px; --space-6:64px; --space-7:96px; --space-8:128px;

  --ease:cubic-bezier(.22,.61,.36,1);
  --rail-w:64px;
}

@media (min-width:1000px){ :root{ --rail-w:88px; } }

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:auto; }
body{
  margin:0;
  background:var(--bg-primary);
  color:var(--text-secondary);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.65;
  overflow-x:hidden;
}
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:700;
  color:var(--text);
  margin:0 0 var(--space-2);
  letter-spacing:-0.01em;
}
p{ margin:0 0 var(--space-2); }
a{ color:var(--azure-2); text-decoration:none; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; }

::selection{ background:var(--accent-cyan); color:var(--text-primary); }

:focus-visible{
  outline:2px solid var(--cyan);
  outline-offset:3px;
  border-radius:4px;
}

/* =============== LAYOUT PRIMITIVES =============== */
.scene{
  position:relative;
  min-height:100vh;
  padding:var(--space-7) var(--space-4) var(--space-7) calc(var(--rail-w) + var(--space-4));
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.scene-inner{ max-width:1200px; margin:0 auto; width:100%; }
.eyebrow{
  font-family:var(--font-mono);
  font-size:0.8rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--accent-amber);
  margin-bottom:var(--space-2);
}
.scene-title{
  font-size:clamp(1.8rem,3.4vw,2.9rem);
  max-width:820px;
  line-height:1.18;
  margin-bottom:var(--space-4);
}
.body-lg{
  font-size:1.05rem;
  max-width:700px;
  color:var(--text-secondary);
}

.glass-card{
  background:var(--bg-surface);
  border:1px solid var(--line);
  border-radius:10px;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .2s ease;
}
.glass-card:hover{
  transform:translateY(-4px);
  border-color:var(--accent-amber);
  box-shadow:0 20px 60px -20px rgba(245,166,35,0.24);
}

/* =============== BACKGROUND LAYERS =============== */
#bg-canvas{
  position:fixed; inset:0; width:100%; height:100%;
  z-index:0; pointer-events:none;
  display:none;
}
.bg-aurora,
.bg-grid{
  display:none;
}

main{ position:relative; z-index:1; }

/* =============== LOADER =============== */
#loader{
  position:fixed; inset:0; z-index:999;
  background:var(--bg-primary);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .6s var(--ease), visibility .6s var(--ease);
}
#loader.is-hidden{ opacity:0; visibility:hidden; }
.loader-inner{ text-align:center; }
.loader-mark{ width:56px; height:56px; margin:0 auto var(--space-2); }
.loader-mark-fill{ stroke-dasharray:140; stroke-dashoffset:140; animation:draw 1.6s var(--ease) forwards; }
@keyframes draw{ to{ stroke-dashoffset:0; } }
.loader-text{ font-family:var(--font-mono); font-size:0.85rem; color:var(--muted); letter-spacing:0.05em; }
.dots span{ animation:blink 1.4s infinite; opacity:0; }
.dots span:nth-child(2){ animation-delay:.2s; }
.dots span:nth-child(3){ animation-delay:.4s; }
@keyframes blink{ 0%,100%{opacity:0;} 50%{opacity:1;} }

/* =============== PIPELINE RAIL (signature element) =============== */
.pipeline-rail{
  position:fixed;
  left:0; top:0; bottom:0;
  width:var(--rail-w);
  z-index:50;
  display:none;
  align-items:center;
  padding-left:calc(var(--rail-w)/2 - 5px);
}
@media (min-width:820px){ .pipeline-rail{ display:flex; } }
.pipeline-rail ol{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:clamp(20px,4vh,42px);
  position:relative; z-index:2;
}
.pipeline-rail li{
  position:relative;
  display:flex; align-items:center;
  cursor:pointer;
}
.pipeline-rail .node{
  width:10px; height:10px; border-radius:50%;
  background:var(--surface);
  border:2px solid var(--border);
  transition:all .4s var(--ease);
  flex-shrink:0;
}
.pipeline-rail li.is-active .node{
  background:var(--cyan);
  border-color:var(--cyan);
  box-shadow:0 0 0 5px rgba(0,229,255,0.15), 0 0 14px rgba(0,229,255,0.7);
}
.pipeline-rail li.is-passed .node{
  background:var(--azure-2);
  border-color:var(--azure-2);
}
.rail-label{
  position:absolute; left:22px; white-space:nowrap;
  font-family:var(--font-mono); font-size:0.7rem; letter-spacing:0.04em;
  color:var(--muted);
  opacity:0; transform:translateX(-6px);
  transition:opacity .3s var(--ease), transform .3s var(--ease);
  background:rgba(7,17,31,0.9);
  padding:3px 8px; border-radius:6px; border:1px solid var(--border);
}
.pipeline-rail li:hover .rail-label,
.pipeline-rail li.is-active .rail-label{
  opacity:1; transform:translateX(0);
}
.pipeline-rail li.is-active .rail-label{ color:var(--cyan); border-color:rgba(0,229,255,0.4); }
.rail-line{
  position:absolute; left:calc(var(--rail-w)/2); top:0; bottom:0; width:1px;
  background:var(--border);
}
.rail-line-fill{
  position:absolute; top:0; left:0; width:100%; height:0%;
  background:linear-gradient(var(--azure-2), var(--cyan));
  transition:height .2s linear;
}

/* =============== NAV =============== */
.site-nav{
  position:fixed; top:0; left:0; right:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:var(--space-2) var(--space-4) var(--space-2) calc(var(--rail-w) + var(--space-2));
  transition:background .4s var(--ease), backdrop-filter .4s var(--ease), border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.site-nav.is-scrolled{
  background:rgba(7,17,31,0.7);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom-color:var(--border);
}
.nav-logo{
  font-family:var(--font-display); font-weight:700; letter-spacing:0.04em;
  color:var(--text); font-size:0.95rem;
}
.nav-links{ display:none; gap:var(--space-4); }
@media (min-width:760px){ .nav-links{ display:flex; } }
.nav-links a{
  position:relative; color:var(--text-secondary); font-size:0.9rem; font-weight:500;
  padding-bottom:4px;
}
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:var(--cyan); transition:width .3s var(--ease);
}
.nav-links a:hover::after, .nav-links a.is-active::after{ width:100%; }
.nav-links a:hover, .nav-links a.is-active{ color:var(--text); }

.nav-toggle{
  display:flex; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:8px;
}
@media (min-width:760px){ .nav-toggle{ display:none; } }
.nav-toggle span{ width:22px; height:2px; background:var(--text); transition:all .3s var(--ease); }
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mobile-menu{
  position:fixed; inset:0; z-index:55;
  background:rgba(7,17,31,0.97); backdrop-filter:blur(20px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-4);
  opacity:0; visibility:hidden; transform:translateY(-12px);
  transition:all .4s var(--ease);
}
.mobile-menu.is-open{ opacity:1; visibility:visible; transform:translateY(0); }
.mobile-menu a{ font-family:var(--font-display); font-size:1.6rem; color:var(--text); }

/* =============== HERO =============== */
.hero{
  align-items:center; text-align:left; padding-left:calc(var(--rail-w) + var(--space-4));
}
.hero-content{ max-width:900px; position:relative; z-index:2; }
.hero-content.glow-card{
  background:var(--bg-surface);
  border:1px solid var(--line);
  border-radius:10px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
  transition:border-color .2s ease, background-color .2s ease;
}
.hero-content.glow-card:hover{
  border-color:var(--accent-amber);
}

/* =============== INFINITY LOOP (behind hero) =============== */
.infinity-wrap{
  position:absolute; left:50%; top:calc(100% - 10rem); width:min(100vw, 1680px); height:860px;
  pointer-events:none; transform:translate(-50%, 0);
  z-index:0; opacity:0.78;
}
.hero .infinity-wrap{ z-index:0; }
.infinity-svg{ width:100%; height:100%; display:block; }
.infinity-svg #inf-path{ display:none; }
.inf-icon{
  position:absolute; width:72px; height:72px; padding:12px;
  background:rgba(255,255,255,0.16);
  border:1px solid rgba(255,255,255,0.22);
  border-radius:28px;
  box-shadow:0 26px 60px rgba(0,0,0,0.22);
  object-fit:contain;
  transform:translate(-50%, -50%);
  z-index:1;
  transition: left 2.4s linear, top 2.4s linear;
}
.icon-1{ left:54.8%; top:55.1%; }
.icon-2{ left:64.1%; top:63.6%; }
.icon-3{ left:72.3%; top:67.8%; }
.icon-4{ left:78.6%; top:66.4%; }
.icon-5{ left:82.6%; top:59.7%; }
.icon-6{ left:84.0%; top:50.0%; }
.icon-7{ left:82.6%; top:40.3%; }
.icon-8{ left:78.6%; top:33.6%; }
.icon-9{ left:72.3%; top:32.2%; }
.icon-10{ left:64.1%; top:36.4%; }
.icon-11{ left:54.8%; top:44.9%; }
.icon-12{ left:45.2%; top:55.1%; }
.icon-13{ left:35.9%; top:63.6%; }
.icon-14{ left:27.7%; top:67.8%; }
.icon-15{ left:21.4%; top:66.4%; }
.icon-16{ left:17.4%; top:59.7%; }
.icon-17{ left:16.0%; top:50.0%; }
.icon-18{ left:17.4%; top:40.3%; }
.icon-19{ left:21.4%; top:33.6%; }
.icon-20{ left:27.7%; top:32.2%; }
.icon-21{ left:35.9%; top:36.4%; }
.icon-22{ left:45.2%; top:44.9%; }
@media (max-width:960px){ .infinity-wrap{ width:96vw; height:580px; } .inf-icon{ width:62px; height:62px; } }
@media (max-width:760px){ .infinity-wrap{ display:none; } }

.inf-icon{ will-change:transform; }

.hero-title{ position:relative; z-index:4; margin-bottom:5rem; }
.hero-title{
  font-size:clamp(2.6rem,8vw,5.5rem);
  line-height:1;
  margin:var(--space-2) 0 var(--space-3);
  background:linear-gradient(100deg,#fff 10%,var(--accent-amber) 45%,var(--accent-cyan) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-rotator{
  position:relative; height:1.8em; overflow:hidden;
  font-family:var(--font-mono); font-size:clamp(1rem,2vw,1.3rem);
  color:var(--accent-cyan); margin-bottom:var(--space-4);
}
.rotator-word{
  position:absolute; left:0; top:0;
  opacity:0; transform:translateY(12px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
.rotator-word.is-active{ opacity:1; transform:translateY(0); }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:var(--space-2); }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 28px; border-radius:100px;
  font-weight:600; font-size:0.92rem;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), background .3s var(--ease);
  cursor:pointer;
}
.btn-primary{
  background:var(--accent-amber);
  color:#14100a; border:1px solid rgba(20,16,10,0.12);
  box-shadow:0 12px 30px -12px rgba(245,166,35,0.35);
}
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 20px 60px -16px rgba(245,166,35,0.32); }
.btn-primary:active{ transform:translateY(-1px) scale(0.995); }
.btn-secondary{
  background:transparent; border:1px solid var(--line); color:var(--text-primary);
}
.btn-secondary:hover{ background:var(--bg-surface-2); border-color:var(--accent-cyan); color:var(--accent-cyan); box-shadow:inset 0 0 0 1px rgba(70,194,203,0.12); }

/* Cursor-follow glow for cards and panels */
.glow-card{ position:relative; isolation:isolate; }
.glow-card::before{
  content:''; position:absolute; inset:-1px; border-radius:inherit; z-index:-1;
  background: radial-gradient(220px circle at var(--mx, 50%) var(--my, 50%), rgba(245,166,35,0.16), transparent 60%);
  opacity:0; transition:opacity 0.3s ease; pointer-events:none;
}
.glow-card:hover::before{ opacity:1; }

@media (prefers-reduced-motion: reduce){
  .glow-card::before{ transition:none; opacity:0 !important; }
  .btn, .btn-primary, .btn-secondary{ transition:none; }
}

/* Glow behind tech dock icons on hover */
.dock-icon{ position:relative; isolation:isolate; }
.dock-icon::before{
  content:''; position:absolute; left:var(--mx,50%); top:var(--my,50%);
  transform:translate(-50%,-50%);
  width:220px; height:220px; border-radius:50%; z-index:-1; pointer-events:none;
  background: radial-gradient(circle at 50% 50%, rgba(79,195,247,0.16), transparent 60%);
  opacity:0; transition:opacity 0.25s ease;
}
.dock-icon:hover::before{ opacity:1; }

@media (prefers-reduced-motion: reduce){
  .dock-icon::before{ transition:none; opacity:0 !important; }
}

.scroll-indicator{
  position:absolute; bottom:var(--space-4); left:calc(var(--rail-w) + var(--space-4));
  display:flex; flex-direction:column; align-items:center; gap:8px;
}
.scroll-mouse{
  width:22px; height:36px; border:1px solid var(--border); border-radius:14px;
  display:flex; justify-content:center; padding-top:6px;
}
.scroll-dot{ width:4px; height:8px; border-radius:2px; background:var(--cyan); animation:scroll-bounce 1.8s infinite; }
@keyframes scroll-bounce{ 0%,100%{ transform:translateY(0); opacity:1;} 60%{ transform:translateY(10px); opacity:0;} }
.scroll-text{ font-family:var(--font-mono); font-size:0.7rem; color:var(--muted); letter-spacing:0.1em; text-transform:uppercase; }

/* subtle highlight behind moving arrows / indicators */
.scroll-mouse{ position:relative; }
.scroll-mouse::before{
  content:''; position:absolute; inset:-8px; border-radius:18px;
  background:linear-gradient(90deg, rgba(255,213,79,0.12), rgba(255,213,79,0.06));
  opacity:0.06; pointer-events:none; z-index:-1; animation:scroll-highlight 1.8s infinite linear;
}
@keyframes scroll-highlight{ 0%{ opacity:0.04; } 50%{ opacity:0.18; } 100%{ opacity:0.04; } }

/* back-to-top button highlight */
.back-to-top{ position:relative; }
.back-to-top::before{
  content:''; position:absolute; inset:-8px; border-radius:12px;
  background:linear-gradient(90deg, rgba(255,213,79,0.12), rgba(255,213,79,0.04));
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease); z-index:-1;
}
.back-to-top:hover::before{ opacity:1; }

/* certification badge image */
.cert-badge{ width:140px; height:auto; border-radius:8px; display:block; margin:0 auto 10px; box-shadow:0 12px 30px rgba(0,0,0,0.45); }

/* =============== REVEAL ANIMATION HELPERS =============== */
.reveal-up{ animation:reveal-up .8s var(--ease) both; animation-delay:var(--delay,0s); }
@keyframes reveal-up{ from{ opacity:0; transform:translateY(18px);} to{ opacity:1; transform:translateY(0);} }

[data-reveal]{
  opacity:0; transform:translateY(28px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
[data-reveal].is-visible{ opacity:1; transform:translateY(0); }

/* =============== WHO AM I / ABOUT ============= */
.who-grid{
  display:grid; grid-template-columns:1fr; gap:var(--space-5); align-items:center;
}
@media (min-width:900px){
  .who-grid{ grid-template-columns:0.8fr 1.2fr; }
  .who-grid.reverse{ grid-template-columns:1.2fr 0.8fr; }
  .who-grid.reverse .about-portrait{ order:2; }
}
.portrait-frame{
  position:relative;
  width:min(340px,82%);
  margin:0 auto;
  padding:0;
  border-radius:28px;
  background:none;
  box-shadow:none;
}
.portrait-frame::before{
  content:none;
}
.portrait-frame::after{
  content:none;
}
@media (min-width:900px){
  .portrait-frame{ width:min(350px,88%); }
}
.who-portrait .portrait-frame,
.about-portrait .portrait-frame{ transition:transform .35s var(--ease); }
.who-portrait .portrait-frame:hover,
.about-portrait .portrait-frame:hover{
  transform:translateY(-2px);
}
.portrait-placeholder{
  aspect-ratio:1; border-radius:24px;
  background:linear-gradient(145deg,var(--bg-surface),var(--bg-surface-2));
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-size:4rem; font-weight:700;
  color:var(--accent-cyan);
  box-shadow:0 30px 60px -20px rgba(0,0,0,0.5);
}
.portrait-img{
  width:100%;
  aspect-ratio:4 / 5;
  height:auto;
  object-fit:cover;
  border-radius:24px;
  display:block;
  border:none;
  box-shadow:0 22px 44px -20px rgba(0,0,0,0.58);
}
.portrait-ring{
  display:none;
}
.who-copy .body-lg{ margin-bottom:var(--space-3); }

/* =============== TIMELINE =============== */
.timeline{ position:relative; padding-left:var(--space-4); }
.timeline-track{
  position:absolute; left:6px; top:6px; bottom:6px; width:2px;
  background:var(--border);
}
.timeline-track-fill{
  position:absolute; top:0; left:0; width:100%; height:0%;
  background:linear-gradient(var(--cyan),var(--azure-2));
  transition:height .3s linear;
}
.timeline-item{ position:relative; margin-bottom:var(--space-5); }
.timeline-marker{
  position:absolute; left:calc(-1 * var(--space-4) + 1px); top:10px;
  width:12px; height:12px; border-radius:50%;
  background:var(--bg-primary); border:2px solid var(--azure-2);
}
.timeline-card{ padding:var(--space-4); background:var(--bg-surface); border:1px solid var(--line); border-radius:10px; transition:border-color .2s ease; }
.timeline-card:hover{ border-color:var(--accent-amber); }
.timeline-head h3{ font-size:1.3rem; margin-bottom:4px; }
.timeline-meta{ font-family:var(--font-mono); font-size:0.78rem; color:var(--muted); margin-bottom:var(--space-2); }
.tag{
  display:inline-block; font-family:var(--font-mono); font-size:0.65rem; letter-spacing:0.08em;
  text-transform:uppercase; padding:3px 10px; border-radius:100px; margin-bottom:8px;
}
.tag-current{ background:rgba(76,175,80,0.15); color:var(--success); border:1px solid rgba(76,175,80,0.35); }

.impact-block{
  background:rgba(245,166,35,0.08); border-left:2px solid var(--accent-amber);
  padding:var(--space-2) var(--space-3); border-radius:0 10px 10px 0; margin:var(--space-2) 0;
}
.impact-label{ font-family:var(--font-mono); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--accent-amber); margin-bottom:4px; }
.impact-block p:last-child{ margin-bottom:0; color:var(--text); }

.tech-details{ margin:var(--space-2) 0; }
.tech-details summary{
  cursor:pointer; font-family:var(--font-mono); font-size:0.8rem; color:var(--azure-2);
  list-style:none; display:flex; align-items:center; gap:8px; padding:8px 0;
}
.tech-details summary::-webkit-details-marker{ display:none; }
.tech-details summary::before{ content:'+'; font-size:1.1rem; transition:transform .3s var(--ease); }
.tech-details[open] summary::before{ transform:rotate(45deg); }
.tech-details ul{ margin:8px 0 0; padding-left:1.1em; color:var(--text-secondary); }
.tech-details li{ margin-bottom:8px; font-size:0.92rem; }

.chip-row{ display:flex; flex-wrap:wrap; gap:8px; margin-top:var(--space-2); }
.chip{
  font-family:var(--font-mono); font-size:0.7rem; padding:4px 10px;
  border:1px solid var(--line); border-radius:100px; color:var(--accent-cyan);
  background:var(--bg-surface-2);
}

/* =============== BUSINESS IMPACT =============== */
.stat-grid{ display:grid; grid-template-columns:1fr; gap:var(--space-3); }
@media (min-width:640px){ .stat-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1000px){ .stat-grid{ grid-template-columns:repeat(4,1fr); } }
.stat-card{ padding:var(--space-4); text-align:left; background:var(--bg-surface); border:1px solid var(--line); border-radius:10px; transition:border-color .2s ease; }
.stat-card:hover{ border-color:var(--accent-cyan); }
.stat-number{
  font-family:var(--font-display); font-size:clamp(2.2rem,4vw,3rem); font-weight:700;
  background:linear-gradient(100deg,var(--azure-2),var(--cyan));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  display:inline-block;
  min-width:4.8ch;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  margin-bottom:4px;
}
.stat-label{ color:var(--text); font-weight:600; font-size:0.95rem; margin-bottom:6px; }
.stat-detail{ font-size:0.85rem; color:var(--muted); margin:0; }

/* =============== TECH DOCK =============== */
.tech-categories{ display:flex; flex-direction:column; gap:var(--space-5); }
.tech-category h3{ font-size:1rem; color:var(--muted); font-family:var(--font-mono); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:var(--space-2); font-weight:500; }
.dock{ display:flex; flex-wrap:wrap; gap:var(--space-2); position:relative; }
.dock-icon{
  position:relative;
  width:56px; height:56px; border-radius:16px;
  background:var(--bg-surface); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  padding:12px; cursor:pointer;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .2s ease;
}
.dock-icon img{ width:100%; height:100%; object-fit:contain; }
.dock:hover .dock-icon{ transform:scale(0.96); }
.dock-icon:hover{
  transform:scale(1.18) translateY(-6px) !important;
  border-color:var(--accent-cyan);
  box-shadow:0 16px 30px -10px rgba(70,194,203,0.28);
  z-index:2;
}
.dock-icon:has(+ .dock-icon:hover){ transform:scale(1.05) translateY(-2px); }
.dock-tooltip{
  position:absolute; bottom:calc(100% + 12px); left:50%; transform:translateX(-50%) translateY(6px);
  background:var(--bg-surface); border:1px solid var(--line); border-radius:12px;
  padding:10px 14px; width:220px; text-align:left;
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease), transform .25s var(--ease);
  z-index:10; box-shadow:0 20px 40px -12px rgba(0,0,0,0.6);
}
.dock-icon:hover .dock-tooltip, .dock-icon:focus-visible .dock-tooltip{ opacity:1; transform:translateX(-50%) translateY(0); pointer-events:auto; }
.dock-tooltip strong{ display:block; color:var(--text); font-size:0.85rem; margin-bottom:2px; }
.dock-tooltip span{ display:block; font-size:0.78rem; color:var(--muted); }
.dock-tooltip .years{ font-family:var(--font-mono); color:var(--accent-cyan); font-size:0.72rem; margin-top:4px; }
.tech-hint{ font-family:var(--font-mono); font-size:0.78rem; color:var(--muted); margin-top:var(--space-4); }

/* =============== AI SECTION =============== */
.ai-grid{ display:grid; grid-template-columns:1fr; gap:var(--space-5); align-items:start; }
@media (min-width:900px){ .ai-grid{ grid-template-columns:1fr 1fr; } }
.ai-demo{ padding:var(--space-3); background:var(--bg-surface); border:1px solid var(--line); border-radius:10px; }
.ai-demo-head{
  display:flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:0.78rem; color:var(--accent-cyan);
  padding-bottom:var(--space-2); border-bottom:1px solid var(--line); margin-bottom:var(--space-2);
}
.ai-dot{ width:8px; height:8px; border-radius:50%; background:var(--success); box-shadow:0 0 8px rgba(61,220,132,0.45); animation:pulse-dot 2s infinite; }
@keyframes pulse-dot{ 0%,100%{ opacity:1;} 50%{ opacity:0.3;} }
.ai-demo-body{ display:flex; flex-direction:column; gap:var(--space-2); min-height:220px; }
.ai-bubble{
  border-radius:12px; padding:var(--space-2) var(--space-3); font-size:0.88rem;
  opacity:0; transform:translateY(10px); transition:opacity .5s var(--ease), transform .5s var(--ease);
}
.ai-bubble.is-visible{ opacity:1; transform:translateY(0); }
.ai-bubble-in{ background:var(--surface); border:1px solid var(--border); font-family:var(--font-mono); color:var(--muted); font-size:0.78rem; }
.ai-bubble-out{ background:rgba(70,194,203,0.12); border:1px solid rgba(70,194,203,0.3); color:var(--text); }
.ai-bubble-label{ display:block; font-family:var(--font-mono); font-size:0.65rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--azure-2); margin-bottom:6px; }
.ai-bubble-text{ white-space:pre-line; }
.ai-thinking{ display:flex; gap:6px; padding:4px 0; height:16px; }
.ai-thinking span{
  width:6px; height:6px; border-radius:50%; background:var(--cyan); opacity:0.3;
  animation:think 1.2s infinite;
}
.ai-thinking span:nth-child(2){ animation-delay:.2s; }
.ai-thinking span:nth-child(3){ animation-delay:.4s; }
@keyframes think{ 0%,100%{ opacity:0.2; transform:translateY(0);} 50%{ opacity:1; transform:translateY(-4px);} }
.ai-thinking.is-hidden{ display:none; }

/* =============== CREDENTIALS =============== */
.cred-section-block{ margin-top:var(--space-4); }
.cred-section-block + .cred-section-block{ margin-top:var(--space-5); }
.cred-subtitle{
  font-family:var(--font-mono); font-size:0.78rem; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--azure-2); margin-bottom:var(--space-3);
}
.cred-grid{ display:grid; grid-template-columns:1fr; gap:var(--space-3); }
@media (min-width:700px){ .cred-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .cred-grid{ grid-template-columns:repeat(4,1fr); } }
.cred-card{ perspective:1200px; height:240px; }
.cred-card-inner{
  position:relative; width:100%; height:100%; text-align:center;
  transition:transform .7s var(--ease); transform-style:preserve-3d;
}
.cred-card:hover .cred-card-inner, .cred-card:focus-within .cred-card-inner{ transform:rotateY(180deg); }
.cred-face{
  position:absolute; inset:0; backface-visibility:hidden;
  display:flex; flex-direction:column; align-items:center; justify-content:space-between; gap:8px;
  border-radius:10px; padding:var(--space-3);
  background:var(--bg-surface); border:1px solid var(--line);
}
.cred-badge{
  width:72px; height:72px; border-radius:18px;
  display:grid; place-items:center; font-family:var(--font-display); font-weight:700; letter-spacing:0.06em;
  color:var(--accent-amber); background:linear-gradient(135deg, rgba(245,166,35,0.16), rgba(70,194,203,0.1));
  border:1px solid rgba(245,166,35,0.28); box-shadow:inset 0 1px 0 rgba(255,255,255,0.06);
}
.cert-badge{ width:140px; height:72px; object-fit:contain; border-radius:8px; display:block; margin:0 auto 10px; box-shadow:0 12px 30px rgba(0,0,0,0.45); }
.cred-face h3{ margin:8px 0 6px; }
.cred-face p{ margin:0 0 8px; }
.cred-face .status-chip{ margin:0; }
.cred-front h3{ font-size:1.02rem; margin-bottom:2px; }
.cred-front p{ font-size:0.82rem; color:var(--muted); margin:0; }
.cred-back{ transform:rotateY(180deg); background:rgba(70,194,203,0.08); }
.cred-back h3{ font-size:1rem; margin-bottom:6px; }
.cred-back p{ font-size:0.82rem; color:var(--text-secondary); }
.status-chip{
  font-family:var(--font-mono); font-size:0.62rem; text-transform:uppercase; letter-spacing:0.06em;
  padding:3px 10px; border-radius:100px; margin-top:6px;
}
.status-active{ background:rgba(61,220,132,0.12); color:var(--success); border:1px solid rgba(61,220,132,0.35); }
.status-pending{ background:rgba(245,166,35,0.12); color:var(--accent-amber); border:1px solid rgba(245,166,35,0.35); }

/* =============== ABOUT VALUE CARDS =============== */
.value-cards{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-2); margin-top:var(--space-3); }
@media (max-width:600px){ .value-cards{ grid-template-columns:1fr; } }
.value-card{ padding:var(--space-3); background:var(--bg-surface); border:1px solid var(--line); border-radius:10px; transition:border-color .2s ease; }
.value-card:hover{ border-color:var(--accent-cyan); }
.value-card h4{ font-size:0.95rem; margin-bottom:6px; color:var(--accent-cyan); }
.value-card p{ font-size:0.88rem; margin:0; color:var(--text-secondary); }

/* =============== CONTACT =============== */
.contact-grid{ display:grid; grid-template-columns:1fr; gap:var(--space-2); margin:var(--space-4) 0; }
@media (min-width:700px){ .contact-grid{ grid-template-columns:1fr 1fr; } }
.contact-card{ padding:var(--space-3); background:var(--bg-surface); border:1px solid var(--line); border-radius:10px; transition:border-color .2s ease; }
.contact-card:hover{ border-color:var(--accent-amber); }
.contact-label{ display:block; font-family:var(--font-mono); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--muted); margin-bottom:8px; }
.contact-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.contact-card a{ color:var(--text); font-weight:600; font-size:0.95rem; }
.copy-btn{
  background:transparent; border:1px solid var(--line); color:var(--muted);
  border-radius:100px; padding:6px 14px; font-size:0.78rem; cursor:pointer;
  transition:all .3s var(--ease);
}
.copy-btn:hover{ border-color:var(--accent-cyan); color:var(--accent-cyan); }
.copy-btn.is-copied{ border-color:var(--success); color:var(--success); }

/* =============== FOOTER =============== */
.site-footer{
  position:relative; z-index:1;
  padding:var(--space-4) var(--space-4) var(--space-4) calc(var(--rail-w) + var(--space-4));
  border-top:1px solid var(--border);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-2);
  font-size:0.82rem; color:var(--muted);
}
.footer-links{ display:flex; gap:var(--space-2); }
.footer-links img{ opacity:0.7; transition:opacity .3s var(--ease); }
.footer-links a:hover img{ opacity:1; }
.back-to-top{
  background:var(--bg-surface); border:1px solid var(--line); color:var(--accent-amber);
  width:36px; height:36px; border-radius:50%; cursor:pointer;
  transition:all .3s var(--ease);
}
.back-to-top:hover{ border-color:var(--accent-amber); color:var(--accent-amber); transform:translateY(-3px); }

/* =============== REDUCED MOTION =============== */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
  [data-reveal]{ opacity:1; transform:none; }
}

/* =============== RESPONSIVE TUNING =============== */
@media (max-width:820px){
  .scene{ padding-left:var(--space-3); padding-right:var(--space-3); }
  .hero{ padding-left:var(--space-3); }
  .scroll-indicator{ left:var(--space-3); }
  .site-nav{ padding-left:var(--space-3); }
  .site-footer{ padding-left:var(--space-3); flex-direction:column; align-items:flex-start; }
}