/* Ultra elevated visuals — orbs, grain, scrollbars */

/* ═══════════════════════════════════════════════════
   ULTRA ELEVATED VISUALS — iOS 26 Glass Maximalism
═══════════════════════════════════════════════════ */

/* ── Aurora mesh background animation ── */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 80% 60% at 15% 10%, rgba(212,129,58,0.09) 0%, transparent 60%),
    radial-gradient(ellipse 70% 70% at 90% 5%,  rgba(232,168,78,0.07) 0%, transparent 55%),
    radial-gradient(ellipse 60% 80% at 85% 92%, rgba(212,129,58,0.08) 0%, transparent 60%),
    radial-gradient(ellipse 80% 50% at 5% 90%,  rgba(242,204,138,0.10) 0%, transparent 55%),
    radial-gradient(ellipse 50% 50% at 50% 50%, rgba(232,168,78,0.03) 0%, transparent 60%);
  animation: auroraShift 20s ease-in-out infinite alternate;
}
@keyframes auroraShift {
  0%   { opacity:1; }
  50%  { opacity:0.85; }
  100% { opacity:1; }
}

/* ── Floating gradient orbs ── */
.orb-bg {
  position: fixed; pointer-events: none; z-index: 0; border-radius: 50%;
  animation: orbDrift ease-in-out infinite alternate;
}
.orb-1 {
  width: 700px; height: 700px;
  background: radial-gradient(circle, rgba(212,129,58,0.10) 0%, transparent 70%);
  top: -250px; right: -180px; animation-duration: 20s;
}
.orb-2 {
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(232,168,78,0.08) 0%, transparent 70%);
  bottom: 8%; left: -120px; animation-duration: 26s; animation-delay: -10s;
}
.orb-3 {
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(245,158,11,0.05) 0%, transparent 70%);
  top: 40%; left: 35%; animation-duration: 30s; animation-delay: -16s;
}
.orb-4 {
  width: 350px; height: 350px;
  background: radial-gradient(circle, rgba(212,129,58,0.07) 0%, transparent 70%);
  top: 65%; right: 20%; animation-duration: 22s; animation-delay: -7s;
}
@keyframes orbDrift {
  from { transform: translate(0,0) scale(1); }
  to   { transform: translate(50px,40px) scale(1.1); }
}

/* ── Glass card super-elevated hover ── */
.glass-card {
  transition: transform .4s cubic-bezier(.34,1.4,.64,1), box-shadow .4s ease;
}
.glass-card:hover {
  transform: translateY(-10px) scale(1.005);
  box-shadow:
    0 48px 120px rgba(212,129,58,0.22),
    0 16px 48px rgba(0,0,0,0.09),
    inset 0 1.5px 0 rgba(255,255,255,0.98),
    0 0 0 1px rgba(212,129,58,0.10);
}

/* ── Glowing section dividers ── */
.ani-divider {
  height: 1px;
  background: linear-gradient(90deg,transparent,rgba(212,129,58,0.5),rgba(232,168,78,0.85),rgba(212,129,58,0.5),transparent);
  margin: 0; opacity: 0.55; position: relative;
}
.ani-divider::before {
  content: '';
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%,-50%);
  width: 10px; height: 10px;
  background: var(--grad); border-radius: 50%;
  box-shadow: 0 0 18px rgba(212,129,58,0.9), 0 0 36px rgba(232,168,78,0.4);
  animation: divDot 3s ease-in-out infinite;
}
@keyframes divDot {
  0%,100%{box-shadow:0 0 14px rgba(212,129,58,0.9),0 0 30px rgba(232,168,78,0.3)}
  50%{box-shadow:0 0 28px rgba(212,129,58,1),0 0 60px rgba(232,168,78,0.5),0 0 90px rgba(242,204,138,0.2)}
}

/* ── Hero twinkling stars ── */
.hero-stars { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.hero-star {
  position: absolute; border-radius: 50%;
  animation: starTwinkle ease-in-out infinite;
}
@keyframes starTwinkle {
  0%,100%{opacity:0;transform:scale(0.5) rotate(0deg)}
  50%{opacity:1;transform:scale(1.8) rotate(15deg)}
}

/* ── Section title shimmer sweep ── */
.sec-title {
  position: relative;
  background: var(--grad);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.sec-title::after {
  content: '';
  position: absolute; top: 0; left: -120%; width: 80%; height: 100%;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,0.4) 50%, transparent 70%);
  animation: titleShimmer 5s ease-in-out infinite;
  pointer-events: none;
}
@keyframes titleShimmer { 0%{left:-120%} 40%,100%{left:150%} }

/* ── Neon dot on sec-tag ── */
.sec-tag {
  position: relative;
}
.sec-tag::before {
  content: '';
  width: 6px; height: 6px; background: var(--green); border-radius: 50%;
  display: inline-block; margin-right: 0.2rem;
  box-shadow: 0 0 8px rgba(212,129,58,1), 0 0 16px rgba(212,129,58,0.5);
  animation: pulse 2s infinite;
}

/* ── Improved reveal animation ── */
.reveal {
  opacity: 0; transform: translateY(32px);
  transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.reveal.visible { opacity:1; transform:translateY(0); }
.skills-grid .reveal:nth-child(1),.cert-grid .reveal:nth-child(1),.awards-grid .reveal:nth-child(1){ transition-delay:0.05s }
.skills-grid .reveal:nth-child(2),.cert-grid .reveal:nth-child(2),.awards-grid .reveal:nth-child(2){ transition-delay:0.12s }
.skills-grid .reveal:nth-child(3),.cert-grid .reveal:nth-child(3),.awards-grid .reveal:nth-child(3){ transition-delay:0.19s }
.skills-grid .reveal:nth-child(4),.cert-grid .reveal:nth-child(4),.awards-grid .reveal:nth-child(4){ transition-delay:0.26s }

/* ── Award card shimmer sweep ── */
.award-card { position:relative; overflow:hidden; }
.award-card::after {
  content:''; position:absolute; top:0; left:-100%; width:60%; height:100%;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,0.14) 50%,transparent 70%);
  transition:left 0.65s ease; pointer-events:none;
}
.award-card:hover::after { left:140%; }

/* ── Download button shimmer ── */
.doc-dl-btn { position:relative; overflow:hidden; }
.doc-dl-btn::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,0.22) 50%,transparent 60%);
  transform:translateX(-100%); transition:transform 0.5s ease;
}
.doc-dl-btn:hover::before { transform:translateX(220%); }

/* ── Hero badge ripple ── */
.hero-badge-dot {
  animation: heroRipple 2s ease-in-out infinite;
}
@keyframes heroRipple {
  0%{box-shadow:0 0 0 0 rgba(212,129,58,0.65)}
  70%{box-shadow:0 0 0 10px rgba(212,129,58,0)}
  100%{box-shadow:0 0 0 0 rgba(212,129,58,0)}
}

/* ── Progress dots glass refinement ── */
.sp-dot .sp-lbl {
  background:rgba(255,255,255,0.96);
  backdrop-filter:blur(32px) saturate(220%);
  -webkit-backdrop-filter:blur(32px) saturate(220%);
  box-shadow:0 4px 20px rgba(212,129,58,0.14),inset 0 1.5px 0 rgba(255,255,255,1);
}

/* ── Cert card sparkle border ── */
.cert-card {
  position:relative; overflow:hidden;
}
.cert-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:var(--grad); opacity:0;
  transition:opacity .3s ease;
}
.cert-card:hover::before { opacity:1; box-shadow:0 0 8px rgba(212,129,58,0.5); }

/* ── Skill pill highlight glow ── */
.skill-pill:hover {
  box-shadow:0 0 0 2px rgba(212,129,58,0.3), 0 8px 24px rgba(212,129,58,0.2) !important;
}

/* ── Glass morphism noise grain overlay ── */
.hero::after {
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0; opacity:0.018;
  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='0.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:200px;
}

/* ── Scrollbar ultra refined ── */
::-webkit-scrollbar { width:6px; }
::-webkit-scrollbar-track { background:rgba(212,129,58,0.03); }
::-webkit-scrollbar-thumb { background:linear-gradient(180deg,#D4813A,#E8A84E); border-radius:10px; }

/* ── Reading progress glow ── */
.reading-progress {
  box-shadow:0 0 12px rgba(212,129,58,0.6), 0 0 24px rgba(212,129,58,0.2) !important;
  height:3px !important;
}