/* ══════════════════════════════════════════════════════
   VARIABLES & RESET
══════════════════════════════════════════════════════ */
*, *::before, *::after { 
  margin:0; padding:0; box-sizing:border-box; 
  -webkit-tap-highlight-color:transparent; 
}

:root {
  /* Palette Gengar */
  --purple-950: #1a0030;
  --purple-900: #2d0060;
  --purple-800: #4a0080;
  --purple-700: #6600aa;
  --purple-600: #8800cc;
  --purple-500: #aa44ee;
  --purple-400: #cc88ff;
  --purple-300: #ddaaff;
  --purple-200: #eeccff;
  --pink-600: #cc0066;
  --pink-500: #ee2299;
  --pink-400: #ff55bb;
  
  /* Theme */
  --bg-primary: #0f0a1a;
  --bg-secondary: #1a1327;
  --bg-muted: #2d2438;
  --text-primary: #ffffff;
  --text-muted: #c7b8d9;
  --border-color: rgba(170,68,238,0.25);
  --border-soft: rgba(170,68,238,0.15);
  
  --nav-h: 60px;
  --nav-w: 0px;
  --bottom-nav-h: 70px;
  --container-pad: 1rem;
}

/* Desktop variables */
@media (min-width: 1025px) {
  :root { 
    --nav-w: 80px; 
    --container-pad: 2rem;
  }
}

html { scroll-behavior:smooth; font-size:16px; }
body {
  font-family:'Syne', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background:var(--bg-primary);
  color:var(--text-primary);
  line-height:1.6;
  overflow-x:hidden;
  min-height:100dvh;
}

/* Mobile padding for bottom nav */
@media (max-width: 1024px) {
  body { padding-bottom:var(--bottom-nav-h); }
}

a { text-decoration:none; color:inherit; }
img { max-width:100%; height:auto; display:block; }
button { font-family:inherit; cursor:pointer; border:none; background:none; }

/* Accessibility */
body.text-large { font-size:18px; }
body.text-xlarge { font-size:20px; }
body.high-contrast { 
  --bg-primary:#000; --bg-secondary:#111; --bg-muted:#222; 
  --text-primary:#fff; --text-muted:#ddd; 
  --border-color:rgba(255,144,200,.5); 
}
body.light-theme {
  --bg-primary:#f7f2fb;
  --bg-secondary:#ffffff;
  --bg-muted:#eee3f8;
  --text-primary:#241338;
  --text-muted:#675579;
  --border-color:rgba(102,0,170,.22);
  --border-soft:rgba(102,0,170,.12);
}
body.no-animations *, body.no-animations *::before, body.no-animations *::after { 
  animation:none !important; transition:none !important; 
}

/* ══ PARTICLES (Desktop only) ══ */
#particles {
  position:fixed; inset:0; pointer-events:none; z-index:0;
}
@media (max-width: 1024px), (pointer: coarse) {
  #particles { display:none; }
}

/* ══ ORBS ══ */
.orbs { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.orb {
  position:absolute; border-radius:50%; filter:blur(40px);
  opacity:.12; animation:orbFloat var(--dur,6s) ease-in-out infinite;
}
@media (max-width: 768px) {
  .orb { filter:blur(25px); opacity:.08; }
}
@keyframes orbFloat {
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(var(--tx,20px),var(--ty,-40px)) scale(1.3)}
}

/* ══════════════════════════════════════════════════════
   NAVIGATION TOP
══════════════════════════════════════════════════════ */
.navbar { 
  position:fixed; top:0; left:0; right:0; 
  background:rgba(15,10,26,.95); backdrop-filter:blur(20px); 
  border-bottom:1px solid var(--border-color); 
  z-index:1000; height:var(--nav-h); 
}
@media (min-width: 1025px) {
  .navbar { left:var(--nav-w); }
}

.nav-container { 
  max-width:1200px; margin:0 auto; 
  padding:0 var(--container-pad); 
  height:100%; display:flex; justify-content:space-between; align-items:center; 
}

.logo { display:flex; align-items:center; gap:.5rem; }
.logo-icon { 
  width:36px; height:36px; 
  background:linear-gradient(135deg,var(--purple-600),var(--pink-600)); 
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:18px; animation:spinSlow 20s linear infinite;
}
@media (min-width: 768px) {
  .logo-icon { width:40px; height:40px; font-size:20px; }
}
@keyframes spinSlow { to { transform:rotate(360deg); } }

.logo-text { 
  font-size:1rem; font-weight:700; 
  background:linear-gradient(to right,var(--purple-400),var(--pink-500)); 
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; 
}
@media (min-width: 768px) {
  .logo-text { font-size:1.1rem; }
}

/* Desktop nav links */
.nav-links { display:none; gap:2rem; }
@media (min-width: 1025px) {
  .nav-links { display:flex; }
}
.nav-link { 
  position:relative; color:rgba(255,255,255,.8); 
  font-size:.95rem; transition:color .3s; 
}
.nav-link:hover, .nav-link.active { color:var(--purple-400); }
.nav-link::after { 
  content:''; position:absolute; bottom:-4px; left:0; width:0; height:2px; 
  background:linear-gradient(to right,var(--purple-500),var(--pink-500)); 
  transition:width .3s; 
}
.nav-link:hover::after, .nav-link.active::after { width:100%; }

/* Menu hamburger */
.menu-toggle { 
  display:flex; flex-direction:column; gap:5px; 
  padding:8px; 
}
@media (min-width: 1025px) {
  .menu-toggle { display:none; }
}
.menu-toggle span { 
  width:24px; height:2.5px; background:var(--text-primary); 
  border-radius:2px; transition:all .3s; 
}
.menu-toggle.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.menu-toggle.active span:nth-child(2) { opacity:0; }
.menu-toggle.active span:nth-child(3) { transform:rotate(-45deg) translate(7px,-6px); }

/* Mobile dropdown */
.nav-links-mobile { 
  display:flex; flex-direction:column; 
  position:fixed; top:var(--nav-h); left:0; right:0; 
  background:rgba(15,10,26,.98); backdrop-filter:blur(20px); 
  padding:1rem var(--container-pad); gap:0; 
  border-bottom:1px solid var(--border-color); 
  transform:translateY(-150%); transition:transform .3s ease; 
  opacity:0; pointer-events:none; z-index:999; 
  max-height:calc(100vh - var(--nav-h)); overflow-y:auto;
}
.nav-links-mobile.open { transform:translateY(0); opacity:1; pointer-events:all; }
.nav-links-mobile .nav-link { 
  font-size:1.1rem; padding:1rem 0;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.nav-links-mobile .nav-link:last-child { border-bottom:none; }

/* ══════════════════════════════════════════════════════
   SIDEBAR (Desktop)
══════════════════════════════════════════════════════ */
.nav-sidebar { display:none; }
@media (min-width: 1025px) {
  .nav-sidebar {
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:24px;
    position:fixed; left:0; top:0; width:var(--nav-w); height:100vh;
    background:rgba(0,0,0,.92); backdrop-filter:blur(12px);
    border-right:1px solid rgba(170,68,238,.2); z-index:1001;
  }
  .nav-logo-sidebar {
    position:absolute; top:20px; width:44px; height:44px;
    background:linear-gradient(135deg,var(--purple-600),var(--pink-600));
    border-radius:50%; display:flex; align-items:center; justify-content:center;
    font-size:20px; box-shadow:0 0 20px rgba(136,0,204,.5);
    animation:spinSlow 20s linear infinite;
  }
  .nav-btn-sidebar {
    width:44px; height:44px; border-radius:12px;
    background:rgba(170,68,238,.15); color:var(--purple-300);
    display:flex; align-items:center; justify-content:center;
    font-size:18px; position:relative; transition:all .2s;
  }
  .nav-btn-sidebar:hover, .nav-btn-sidebar.active {
    background:var(--purple-600); color:white;
    transform:scale(1.08); box-shadow:0 0 16px rgba(136,0,204,.6);
  }
  .nav-btn-sidebar .tooltip {
    position:absolute; left:calc(100% + 14px);
    background:rgba(45,0,96,.95); color:white;
    font-size:12px; padding:4px 10px; border-radius:6px;
    white-space:nowrap; opacity:0; pointer-events:none;
    transition:opacity .2s;
  }
  .nav-btn-sidebar:hover .tooltip { opacity:1; }
  .nav-zap {
    position:absolute; bottom:20px; font-size:20px;
    animation:floatY 2s ease-in-out infinite; color:var(--purple-400);
  }
}
@keyframes floatY { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }

/* ══════════════════════════════════════════════════════
   BOTTOM NAV (Mobile)
══════════════════════════════════════════════════════ */
.bottom-nav {
  display:flex; position:fixed; bottom:0; left:0; right:0;
  height:var(--bottom-nav-h); padding-bottom:env(safe-area-inset-bottom,0);
  background:rgba(15,10,26,.98); backdrop-filter:blur(20px);
  border-top:1px solid var(--border-color); z-index:1000;
  align-items:center; justify-content:space-around; padding:0 4px;
}
@media (min-width: 1025px) {
  .bottom-nav { display:none; }
}
.bottom-nav-btn {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:3px; color:var(--purple-300); font-size:10px;
  padding:6px 8px; border-radius:10px; flex:1; max-width:70px;
  transition:all .2s;
}
.bottom-nav-btn.active, .bottom-nav-btn:active {
  color:var(--purple-400); background:rgba(170,68,238,.15);
}
.bottom-nav-btn span:first-child { font-size:20px; }

/* ══════════════════════════════════════════════════════
   BUTTONS
══════════════════════════════════════════════════════ */
.btn { 
  display:inline-flex; align-items:center; justify-content:center;
  padding:.75rem 1.5rem; border-radius:999px; 
  font-weight:700; font-size:.95rem; transition:all .3s;
  min-height:48px; text-align:center;
}
@media (min-width: 768px) {
  .btn { padding:.875rem 2rem; font-size:1rem; }
}
.btn-primary { 
  background:linear-gradient(90deg,var(--purple-600),var(--pink-600)); 
  color:white; box-shadow:0 10px 25px rgba(136,0,204,.4); 
}
.btn-primary:hover, .btn-primary:active { 
  transform:translateY(-2px); box-shadow:0 15px 35px rgba(136,0,204,.6); 
}
.btn-secondary { 
  background:transparent; color:var(--purple-300); 
  border:2px solid var(--purple-600); 
}
.btn-secondary:hover, .btn-secondary:active { 
  background:var(--purple-600); color:white; 
}

/* ══════════════════════════════════════════════════════
   ANIMATIONS
══════════════════════════════════════════════════════ */
.aos { opacity:0; transform:translateY(25px); transition:opacity .5s, transform .5s; }
.aos.in { opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .aos { opacity:1; transform:none; transition:none; }
}

/* ══════════════════════════════════════════════════════
   FOOTER
══════════════════════════════════════════════════════ */
.footer { 
  background:var(--bg-secondary); border-top:1px solid var(--border-color); 
  padding:1.5rem var(--container-pad); text-align:center; 
}
@media (min-width: 1025px) {
  .footer { margin-left:var(--nav-w); }
}
.footer-text { 
  color:var(--text-muted); font-size:.85rem;
  display:flex; align-items:center; justify-content:center; gap:.4rem; flex-wrap:wrap;
}
@media (min-width: 768px) {
  .footer-text { font-size:.9rem; }
}
.footer-copyright { font-size:.75rem; color:var(--text-muted); margin-top:.3rem; }
.heart-pulse { color:var(--pink-500); animation:pulse 1.2s ease-in-out infinite; }
@keyframes pulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.25)} }

/* ══════════════════════════════════════════════════════
   HERO SECTION
══════════════════════════════════════════════════════ */
.hero {
  min-height:100vh; 
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
  padding:calc(var(--nav-h) + 1.5rem) var(--container-pad) 2rem;
  background:linear-gradient(135deg,var(--purple-950) 0%,var(--purple-900) 50%,var(--bg-primary) 100%);
}
@media (min-width: 1025px) {
  .hero { margin-left:var(--nav-w); padding:calc(var(--nav-h) + 3rem) 2rem 4rem; }
}

.floating-elements { position:absolute; inset:0; pointer-events:none; }
.float-icon { position:absolute; font-size:1.4rem; opacity:.4; }
@media (min-width: 768px) {
  .float-icon { font-size:1.8rem; opacity:.55; }
}
.star-1 { top:12%; left:6%; color:var(--purple-400); animation:floatAnim 3s ease-in-out infinite; }
.heart-1 { top:22%; right:8%; color:var(--pink-400); animation:floatAnim 4s ease-in-out infinite .5s; }
.skull-1 { bottom:18%; left:8%; color:var(--purple-600); animation:floatAnim 3.5s ease-in-out infinite 1s; }
.star-2 { top:35%; right:5%; color:var(--purple-400); animation:spinAnim 5s linear infinite; display:none; }
.heart-2 { bottom:12%; right:18%; color:var(--pink-400); animation:floatAnim 2.5s ease-in-out infinite .8s; display:none; }
@media (min-width: 768px) {
  .star-2, .heart-2 { display:block; }
}
@keyframes floatAnim { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-15px) rotate(8deg)} }
@keyframes spinAnim { 0%{transform:rotate(0) scale(1)} 50%{transform:rotate(180deg) scale(1.15)} 100%{transform:rotate(360deg) scale(1)} }
@keyframes wiggle { 0%,100%{transform:rotate(0)} 25%{transform:rotate(-4deg)} 75%{transform:rotate(4deg)} }

.hero-inner { 
  max-width:1100px; width:100%; 
  display:flex; flex-direction:column; align-items:center;
  gap:2rem; position:relative; z-index:2; text-align:center;
}
@media (min-width: 900px) {
  .hero-inner { 
    display:grid; grid-template-columns:1fr auto; 
    gap:3rem; align-items:center; text-align:left;
  }
}

.hero-content { width:100%; max-width:600px; }
@media (min-width: 900px) {
  .hero-content { max-width:none; }
}

.hero-badge { 
  display:inline-flex; align-items:center; gap:6px;
  padding:.4rem 1rem; background:linear-gradient(to right,var(--purple-600),var(--pink-600));
  border-radius:50px; font-size:.75rem; margin-bottom:1rem;
  animation:wiggle .5s ease .8s; color:white;
}
@media (min-width: 768px) {
  .hero-badge { padding:.5rem 1.25rem; font-size:.85rem; margin-bottom:1.25rem; }
}

.hero-title { 
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.8rem,12vw,5.5rem); line-height:1;
  margin-bottom:.75rem;
  background:linear-gradient(to right,var(--purple-400),var(--pink-500),var(--purple-600)); 
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 15px rgba(170,68,238,.3));
}
@media (min-width: 768px) {
  .hero-title { 
    font-size:clamp(3.5rem,9vw,6rem); 
    filter:drop-shadow(0 0 25px rgba(170,68,238,.3));
  }
}

.hero-subtitle { 
  font-size:clamp(.9rem,3.5vw,1.15rem); 
  color:var(--purple-200); margin-bottom:1.5rem;
}
@media (min-width: 768px) {
  .hero-subtitle { margin-bottom:2rem; }
}

.hero-buttons { 
  display:flex; flex-direction:column; gap:.75rem;
  width:100%; max-width:280px; margin:0 auto;
}
@media (min-width: 640px) {
  .hero-buttons { 
    flex-direction:row; gap:1rem;
    max-width:none; margin:0;
  }
}

.hero-stats {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1rem; margin-top:2rem;
}
@media (min-width: 900px) {
  .hero-stats { margin-top:2.5rem; }
}
.stat { text-align:center; }
.stat-num { 
  font-family:'Bebas Neue',sans-serif; 
  font-size:clamp(1.8rem,6vw,2.5rem); 
  color:var(--purple-400); 
}
.stat-label { font-size:11px; color:var(--purple-300); }
@media (min-width: 768px) {
  .stat-label { font-size:12px; }
}

/* Gengar Widget */
.gengar-widget {
  position:relative; width:160px; min-height:180px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  z-index:10;
}
@media (min-width: 900px) {
  .gengar-widget { width:200px; min-height:240px; }
}
.gengar-orb {
  position:absolute; inset:0;
  background:radial-gradient(circle,rgba(136,0,204,.35) 0%,rgba(204,0,102,.15) 60%,transparent 80%);
  border-radius:50%; animation:gOrb 4s ease-in-out infinite;
}
@keyframes gOrb { 0%,100%{transform:scale(1);opacity:.4} 50%{transform:scale(1.15);opacity:.65} }
.gengar-ghost {
  font-size:70px; filter:drop-shadow(0 0 15px rgba(136,0,204,.7));
  animation:gengarFloat 3s ease-in-out infinite;
}
@media (min-width: 768px) {
  .gengar-ghost { font-size:100px; filter:drop-shadow(0 0 25px rgba(136,0,204,.7)); }
}
@keyframes gengarFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }
.gengar-label {
  margin-top:8px; font-size:10px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:rgba(204,136,255,.6);
}
.gengar-types { display:flex; gap:6px; margin-top:6px; }
.g-type {
  font-size:9px; padding:3px 10px; border-radius:999px;
  border:1px solid; backdrop-filter:blur(4px); font-weight:600;
}
.g-ghost { background:rgba(74,0,128,.6); border-color:rgba(136,0,204,.5); color:#ddb4ff; }
.g-poison { background:rgba(100,0,80,.6); border-color:rgba(204,0,102,.5); color:#ffb7d5; }
.gengar-dex { font-size:9px; color:rgba(204,136,255,.4); margin-top:4px; }

.hero-wave { 
  position:absolute; bottom:0; left:0; right:0; 
  height:4rem; background:linear-gradient(to top,var(--bg-secondary),transparent); 
}
@media (min-width: 768px) {
  .hero-wave { height:6rem; }
}

/* ══════════════════════════════════════════════════════
   ABOUT SECTION
══════════════════════════════════════════════════════ */
.about { background:var(--bg-secondary); position:relative; }
@media (min-width: 1025px) {
  .about { margin-left:var(--nav-w); }
}

.about-container { padding:3rem var(--container-pad); }
@media (min-width: 768px) {
  .about-container { padding:4rem var(--container-pad); }
}

.section-header { text-align:center; margin-bottom:2rem; }
@media (min-width: 768px) {
  .section-header { margin-bottom:3rem; }
}
.section-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.2rem,7vw,3.5rem);
  background:linear-gradient(to right,var(--purple-400),var(--pink-500));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  line-height:1.1; margin-bottom:6px;
}
.section-subtitle { color:var(--purple-300); font-size:.95rem; }
@media (min-width: 768px) {
  .section-subtitle { font-size:1.05rem; }
}

.about-grid { 
  display:flex; flex-direction:column; align-items:center;
  gap:2rem;
}
@media (min-width: 900px) {
  .about-grid { 
    display:grid; grid-template-columns:1fr 1.2fr;
    gap:3rem; align-items:center;
  }
}

.about-image { position:relative; width:100%; max-width:350px; }
@media (min-width: 900px) {
  .about-image { max-width:none; }
}
.image-wrapper { 
  position:relative; border-radius:1rem; overflow:hidden;
  border:2px solid rgba(170,68,238,.35);
  box-shadow:0 15px 40px rgba(136,0,204,.2);
}
@media (min-width: 768px) {
  .image-wrapper { 
    border:3px solid rgba(170,68,238,.35);
    box-shadow:0 20px 60px rgba(136,0,204,.2);
  }
}
.image-wrapper img { width:100%; height:260px; object-fit:cover; }
@media (min-width: 768px) {
  .image-wrapper img { height:380px; }
}
.image-overlay { 
  position:absolute; inset:0; 
  background:linear-gradient(to top,var(--bg-secondary),transparent); opacity:.5; 
}
.sparkle-icon { 
  position:absolute; top:-.6rem; right:-.6rem;
  width:44px; height:44px;
  background:linear-gradient(135deg,var(--purple-600),var(--pink-600));
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; box-shadow:0 8px 25px rgba(136,0,204,.5);
  animation:wiggle 2s ease-in-out infinite;
}
@media (min-width: 768px) {
  .sparkle-icon { 
    top:-1rem; right:-1rem; width:52px; height:52px;
    font-size:1.6rem; box-shadow:0 10px 30px rgba(136,0,204,.5);
  }
}

.about-content { display:flex; flex-direction:column; gap:1rem; width:100%; }
@media (min-width: 768px) {
  .about-content { gap:1.25rem; }
}
.about-text { font-size:.95rem; line-height:1.7; }
@media (min-width: 768px) {
  .about-text { font-size:1.05rem; line-height:1.8; }
}
.about-text.muted { color:var(--text-muted); }

.about-stat { font-size:2rem; font-weight:800; color:var(--purple-400); }
@media (min-width: 768px) {
  .about-stat { font-size:2.5rem; }
}

.about-cards { 
  display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; margin-top:.75rem;
}
@media (min-width: 768px) {
  .about-cards { gap:1rem; margin-top:1rem; }
}
.about-card { 
  background:rgba(45,0,96,.3); border-radius:.75rem;
  padding:1rem .5rem; text-align:center;
  border:1px solid var(--border-color); transition:transform .3s;
}
.about-card:hover { transform:translateY(-4px); }
.card-icon { font-size:1.5rem; margin-bottom:.4rem; }
.about-card h4 { font-size:.8rem; font-weight:600; }
@media (min-width: 768px) {
  .card-icon { font-size:1.75rem; }
  .about-card h4 { font-size:.9rem; }
}

.gengar-stats-row {
  display:grid; grid-template-columns:1fr 1fr;
  gap:10px; margin-top:8px;
}
.g-stat {
  background:rgba(136,0,204,.1); border:1px solid rgba(136,0,204,.25);
  border-radius:10px; padding:10px 14px;
}
.g-stat-num { font-size:1.4rem; font-weight:800; color:var(--purple-400); }
.g-stat-label { font-size:.7rem; color:var(--text-muted); }

/* Moves */
.moves-title { 
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(1.8rem,5vw,2.5rem); text-align:center;
  margin:2.5rem 0 1.25rem;
  background:linear-gradient(to right,var(--purple-400),var(--pink-500));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.moves-grid {
  display:grid; grid-template-columns:repeat(2,1fr); gap:12px;
}
@media (min-width: 768px) {
  .moves-grid { grid-template-columns:repeat(4,1fr); gap:16px; }
}
.move-card {
  background:linear-gradient(135deg,rgba(45,0,96,.5),rgba(0,0,0,.5));
  border:1px solid rgba(170,68,238,.2); border-radius:12px;
  padding:16px 12px; transition:all .25s; backdrop-filter:blur(6px);
}
.move-card:hover { transform:translateY(-5px); box-shadow:0 12px 35px rgba(136,0,204,.3); }
.move-icon {
  width:40px; height:40px;
  background:linear-gradient(135deg,var(--purple-600),var(--pink-600));
  border-radius:10px; display:flex; align-items:center; justify-content:center;
  font-size:18px; margin-bottom:12px; box-shadow:0 4px 15px rgba(136,0,204,.4);
}
@media (min-width: 768px) {
  .move-icon { width:46px; height:46px; font-size:20px; }
}
.move-name { font-size:15px; font-weight:700; color:white; margin-bottom:4px; }
.move-desc { font-size:12px; color:var(--purple-200); line-height:1.4; }

/* ══════════════════════════════════════════════════════
   PROJECTS SECTION
══════════════════════════════════════════════════════ */
.projects-section { background:var(--bg-primary); position:relative; }
@media (min-width: 1025px) {
  .projects-section { margin-left:var(--nav-w); }
}

.projects-container { padding:3rem var(--container-pad); }
@media (min-width: 768px) {
  .projects-container { padding:4rem var(--container-pad); }
}

.projects-grid-home { 
  display:grid; grid-template-columns:1fr; gap:1.25rem;
}
@media (min-width: 640px) {
  .projects-grid-home { grid-template-columns:repeat(2,1fr); }
}
@media (min-width: 1024px) {
  .projects-grid-home { grid-template-columns:repeat(3,1fr); gap:1.5rem; }
}

/* Search & Filters */
.tag-search-wrapper { 
  position:relative; margin-bottom:1.25rem; max-width:100%;
}
@media (min-width: 640px) {
  .tag-search-wrapper { max-width:400px; margin:0 auto 1.5rem; }
}
.tag-search { 
  width:100%; padding:.7rem 1rem .7rem 2.5rem;
  background:var(--bg-secondary); border:1px solid var(--border-color);
  border-radius:.75rem; color:var(--text-primary);
  font-size:.9rem; font-family:'Syne',sans-serif;
}
.tag-search:focus { outline:none; border-color:var(--purple-500); }
.tag-search::placeholder { color:var(--text-muted); }
.search-icon { position:absolute; left:12px; top:50%; transform:translateY(-50%); }

.filter-bar { 
  display:flex; flex-wrap:wrap; gap:8px;
  margin-bottom:1.5rem; justify-content:center;
}
.filter-btn { 
  padding:.45rem 1rem; border-radius:50px;
  border:1px solid var(--border-color); background:var(--bg-muted);
  color:var(--text-muted); font-size:.8rem;
  font-family:'Syne',sans-serif; transition:all .3s;
}
.filter-btn:hover { border-color:var(--purple-500); color:var(--purple-400); }
.filter-btn.active { 
  background:linear-gradient(135deg,var(--purple-600),var(--pink-600));
  color:white; border-color:transparent;
}

.projects-grid-full { 
  display:grid; grid-template-columns:1fr; gap:1.25rem;
}
@media (min-width: 640px) {
  .projects-grid-full { grid-template-columns:repeat(2,1fr); }
}
@media (min-width: 1024px) {
  .projects-grid-full { grid-template-columns:repeat(3,1fr); gap:1.5rem; }
}

/* Project Cards */
.project-card {
  background:var(--bg-secondary); border-radius:1rem; overflow:hidden;
  border:1px solid var(--border-color);
  box-shadow:0 8px 25px rgba(0,0,0,.3);
  transition:all .3s;
}
.project-card:hover { 
  transform:translateY(-6px); box-shadow:0 15px 40px rgba(136,0,204,.3);
}
.project-image { position:relative; height:170px; overflow:hidden; }
@media (min-width: 768px) {
  .project-image { height:200px; }
}
.project-image img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.project-card:hover .project-image img { transform:scale(1.06); }
.project-overlay {
  position:absolute; inset:0; background:rgba(15,10,26,.6);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .3s;
}
@media (hover:none) {
  .project-overlay { opacity:1; background:rgba(15,10,26,.25); }
}
.project-card:hover .project-overlay { opacity:1; }
.project-link-btn {
  width:42px; height:42px; border-radius:9999px;
  background:white; display:flex; align-items:center; justify-content:center;
}
.project-content { padding:1.25rem; }
.project-content h3 { font-size:1.05rem; margin-bottom:.4rem; font-weight:700; }
.project-content p { color:var(--text-muted); font-size:.85rem; margin-bottom:.75rem; line-height:1.5; }
.project-tags { display:flex; flex-wrap:wrap; gap:.4rem; }
.tag { 
  font-size:.7rem; padding:.3rem .65rem;
  background:var(--bg-muted); color:var(--purple-300);
  border-radius:50px; border:1px solid var(--border-soft);
  transition:all .3s;
}
.tag:hover { background:var(--purple-600); color:var(--bg-primary); }
.project-card.hidden { display:none !important; }
#no-results { text-align:center; padding:2rem; color:var(--text-muted); display:none; }
.view-all-wrap { text-align:center; margin-top:1.5rem; }
@media (min-width: 768px) {
  .view-all-wrap { text-align:right; }
}

/* ══════════════════════════════════════════════════════
   SKILLS SECTION
══════════════════════════════════════════════════════ */
.skills-section { background:var(--bg-secondary); position:relative; }
@media (min-width: 1025px) {
  .skills-section { margin-left:var(--nav-w); }
}

.skills-container { padding:3rem var(--container-pad); }
@media (min-width: 768px) {
  .skills-container { padding:4rem var(--container-pad); }
}

.skills-grid { 
  display:grid; grid-template-columns:1fr; gap:1rem;
}
@media (min-width: 640px) {
  .skills-grid { grid-template-columns:repeat(2,1fr); }
}
@media (min-width: 1024px) {
  .skills-grid { grid-template-columns:repeat(4,1fr); gap:1.25rem; }
}

.skill-category { 
  background:rgba(45,0,96,.3); border-radius:1rem;
  padding:1.25rem; border:1px solid var(--border-color);
  transition:all .3s;
}
.skill-category:hover { 
  border-color:rgba(170,68,238,.4); transform:translateY(-4px);
}
.category-title { 
  color:var(--purple-400); margin-bottom:1rem;
  font-size:.95rem; font-weight:700;
}
.skill-tags { display:flex; flex-wrap:wrap; gap:.4rem; }
.skill-tag { 
  padding:.5rem .8rem; background:rgba(45,36,56,.5);
  color:var(--text-primary); border-radius:.5rem;
  font-size:.8rem; transition:all .3s;
}
.skill-tag:hover { background:var(--purple-600); color:var(--bg-primary); transform:scale(1.03); }

.skills-footer { text-align:center; margin-top:2rem; color:var(--text-muted); font-style:italic; font-size:.9rem; }

/* Gengar Banner */
.gengar-moves-banner {
  margin-top:2rem;
  background:linear-gradient(135deg,rgba(136,0,204,.12),rgba(204,0,102,.08));
  border:1px solid rgba(136,0,204,.25); border-radius:1rem;
  padding:1.25rem; display:flex; flex-direction:column;
  align-items:center; gap:1rem;
}
@media (min-width: 768px) {
  .gengar-moves-banner { 
    flex-direction:row; padding:1.5rem 1.75rem; gap:1.25rem;
  }
}
.gmb-ghost { font-size:2rem; animation:gengarFloat 3s ease-in-out infinite; }
.gmb-text { text-align:center; }
@media (min-width: 768px) {
  .gmb-text { text-align:left; }
}
.gmb-text h4 { font-weight:700; color:white; margin-bottom:.3rem; font-size:.95rem; }
.gmb-text p { font-size:.8rem; color:var(--text-muted); }
.gmb-moves { 
  display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.6rem;
  justify-content:center;
}
@media (min-width: 768px) {
  .gmb-moves { justify-content:flex-start; }
}
.gmb-move {
  font-size:.7rem; padding:4px 10px; border-radius:999px;
  border:1px solid rgba(136,0,204,.4);
  background:rgba(136,0,204,.12); color:#ddb4ff; font-weight:600;
}

/* ══════════════════════════════════════════════════════
   CONTACT SECTION (Preview)
══════════════════════════════════════════════════════ */
.contact-section { background:var(--bg-primary); position:relative; }
@media (min-width: 1025px) {
  .contact-section { margin-left:var(--nav-w); }
}

.contact-container { padding:3rem var(--container-pad); }
@media (min-width: 768px) {
  .contact-container { padding:4rem var(--container-pad); }
}

.contact-grid { 
  display:flex; flex-direction:column; gap:1.5rem;
}
@media (min-width: 900px) {
  .contact-grid { 
    display:grid; grid-template-columns:1fr 1fr; gap:2.5rem;
  }
}

.contact-info { display:flex; flex-direction:column; gap:1.25rem; }
.contact-info p { color:var(--text-muted); font-size:.95rem; line-height:1.7; }

.contact-email { 
  display:inline-flex; align-items:center; gap:.875rem;
  padding:.75rem 1rem; background:var(--bg-secondary);
  border-radius:.75rem; border:1px solid var(--border-color);
  width:100%;
}
@media (min-width: 640px) {
  .contact-email { width:auto; padding:.75rem 1.25rem; }
}
.email-icon { 
  width:44px; height:44px; flex-shrink:0;
  background:rgba(136,0,204,.2); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem;
}
.email-label { font-size:.75rem; color:var(--text-muted); }
.email-address { font-weight:700; color:var(--purple-400); font-size:.9rem; word-break:break-all; }

.social-links h4 { margin-bottom:.75rem; font-weight:700; font-size:1rem; }
.social-icons { display:flex; gap:.5rem; }
.social-icon { 
  width:44px; height:44px;
  background:var(--bg-secondary); border:1px solid var(--border-color);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  transition:all .3s;
}
.social-icon:hover { 
  border-color:var(--purple-500); background:rgba(136,0,204,.1);
  transform:scale(1.08) rotate(4deg);
}

/* ══════════════════════════════════════════════════════
   CONTACT PAGE
══════════════════════════════════════════════════════ */
.contact-hero { 
  padding:calc(var(--nav-h) + 2rem) var(--container-pad) 2.5rem;
  text-align:center; background:linear-gradient(180deg,rgba(136,0,204,.08) 0%,transparent 100%);
  border-bottom:1px solid var(--border-color);
}
@media (min-width: 1025px) {
  .contact-hero { margin-left:var(--nav-w); }
}
@media (min-width: 768px) {
  .contact-hero { padding:calc(var(--nav-h) + 3rem) 2rem 3.5rem; }
}

.contact-hero-eyebrow { 
  font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.1em; color:var(--purple-400); margin-bottom:8px;
}
@media (min-width: 768px) {
  .contact-hero-eyebrow { font-size:12px; margin-bottom:10px; }
}
.contact-hero-title { 
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.2rem,9vw,4rem); font-weight:800; margin-bottom:.5rem;
  background:linear-gradient(to right,var(--purple-400),var(--pink-500));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.contact-hero-sub { color:var(--text-muted); font-size:.9rem; max-width:480px; margin:0 auto; }

.section-divider { 
  height:2px; background:linear-gradient(to right,var(--purple-500),var(--pink-500),var(--purple-400));
  opacity:.5;
}
@media (min-width: 1025px) {
  .section-divider { margin-left:var(--nav-w); }
}

.contact-main-section { padding:2.5rem var(--container-pad) 3rem; }
@media (min-width: 1025px) {
  .contact-main-section { margin-left:var(--nav-w); }
}
@media (min-width: 768px) {
  .contact-main-section { padding:3rem 2rem 4rem; }
}

.contact-main { 
  max-width:1000px; margin:0 auto;
  display:flex; flex-direction:column; gap:2rem;
}
@media (min-width: 900px) {
  .contact-main { 
    display:grid; grid-template-columns:1fr 1.4fr; gap:2.5rem;
  }
}

.info-card { 
  display:flex; align-items:center; gap:.75rem;
  padding:1rem; background:var(--bg-secondary);
  border:1px solid var(--border-color); border-radius:.75rem;
  transition:all .3s;
}
.info-card:hover { border-color:var(--purple-500); transform:translateX(4px); }
.info-icon { 
  width:40px; height:40px; flex-shrink:0;
  background:linear-gradient(135deg,var(--purple-600),var(--pink-600));
  border-radius:50%; display:flex; align-items:center; justify-content:center;
}
.info-label { font-size:.75rem; color:var(--text-muted); }
.info-value { font-weight:600; color:white; font-size:.9rem; }
.info-cards-stack { display:flex; flex-direction:column; gap:10px; }

.avail-badge { 
  display:inline-flex; align-items:center; gap:.5rem;
  margin-top:1rem; padding:.5rem 1rem;
  background:rgba(136,0,204,.15); border:1px solid rgba(136,0,204,.35);
  border-radius:50px; font-size:.8rem; color:var(--purple-300);
}
.avail-dot { width:8px; height:8px; background:#4ade80; border-radius:50%; animation:pulseDot 1.5s ease-in-out infinite; }
@keyframes pulseDot { 0%,100%{box-shadow:0 0 0 0 rgba(74,222,128,.6)} 50%{box-shadow:0 0 0 6px rgba(74,222,128,0)} }

.social-label { font-size:12px; font-weight:700; text-transform:uppercase; color:#9ca3af; margin:1.5rem 0 12px; }
.social-row { display:flex; gap:.5rem; }
.social-btn-round { 
  width:40px; height:40px;
  background:var(--bg-muted); border:1px solid var(--border-color);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  color:var(--text-muted); transition:all .3s;
}
.social-btn-round:hover { 
  background:var(--purple-600); border-color:var(--purple-600); color:white;
  transform:scale(1.08) rotate(4deg);
}

/* Form */
.form-card { 
  background:var(--bg-secondary); border:1px solid var(--border-color);
  border-radius:1rem; padding:1.5rem 1.25rem;
  box-shadow:0 15px 40px rgba(0,0,0,.3);
}
@media (min-width: 768px) {
  .form-card { border-radius:1.25rem; padding:2rem; }
}
.form-title { 
  font-size:1.15rem; font-weight:800; margin-bottom:1.25rem;
  background:linear-gradient(to right,var(--purple-400),var(--pink-500));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
@media (min-width: 768px) {
  .form-title { font-size:1.3rem; margin-bottom:1.5rem; }
}
.form-row { display:flex; flex-direction:column; gap:.75rem; }
@media (min-width: 640px) {
  .form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
}
.form-group { margin-bottom:1rem; display:flex; flex-direction:column; gap:.3rem; }
.form-label { font-size:.85rem; color:var(--text-muted); font-weight:600; }
.form-input, .form-select, .form-textarea { 
  width:100%; padding:.7rem 1rem;
  background:var(--bg-muted); border:1px solid var(--border-color);
  border-radius:.625rem; color:var(--text-primary);
  font-size:.95rem; font-family:'Syne',sans-serif;
  min-height:48px;
}
.form-input:focus, .form-select:focus, .form-textarea:focus { 
  outline:none; border-color:var(--purple-500);
  box-shadow:0 0 0 3px rgba(170,68,238,.15);
}
.form-input::placeholder, .form-textarea::placeholder { color:#7a6a8a; }
.form-select { appearance:none; cursor:pointer; }
.form-textarea { resize:vertical; min-height:120px; }
.char-count { font-size:.75rem; color:var(--text-muted); text-align:right; }
.field-error { font-size:.75rem; color:#f87171; display:none; }
.field-error.visible { display:block; }
.form-input.error, .form-textarea.error { border-color:#f87171; }

.alert { 
  display:none; align-items:flex-start; gap:.5rem;
  padding:.875rem 1rem; border-radius:.75rem;
  margin-bottom:1rem; font-size:.9rem;
}
.alert.visible { display:flex; }
.alert-success { background:rgba(74,222,128,.12); border:1px solid rgba(74,222,128,.3); color:#4ade80; }
.alert-error { background:rgba(248,113,113,.12); border:1px solid rgba(248,113,113,.3); color:#f87171; }

.submit-btn { 
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  width:100%; padding:.875rem 1rem;
  border-radius:.75rem; background:linear-gradient(135deg,var(--purple-600),var(--pink-600));
  color:white; font-size:.95rem; font-weight:700;
  box-shadow:0 10px 25px rgba(136,0,204,.3);
  transition:all .3s; min-height:50px;
}
.submit-btn:hover, .submit-btn:active { 
  transform:translateY(-2px); box-shadow:0 15px 35px rgba(136,0,204,.45);
}
.submit-btn:disabled { opacity:.7; cursor:not-allowed; transform:none; }
.spinner { 
  width:18px; height:18px; border:2px solid rgba(255,255,255,.3);
  border-top-color:white; border-radius:50%;
  display:none; animation:spin .7s linear infinite;
}
.spinner.visible { display:block; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ══════════════════════════════════════════════════════
   ACCESSIBILITY PANEL
══════════════════════════════════════════════════════ */
.a11y-btn-fixed { 
  position:fixed; bottom:calc(var(--bottom-nav-h) + 12px); right:12px; z-index:9999;
}
@media (min-width: 1025px) {
  .a11y-btn-fixed { bottom:20px; right:20px; }
}
#a11y-btn { 
  width:48px; height:48px; border-radius:9999px;
  background:linear-gradient(135deg,var(--purple-600),var(--pink-600));
  color:white; box-shadow:0 4px 20px rgba(136,0,204,.4);
  display:flex; align-items:center; justify-content:center;
}
@media (min-width: 768px) {
  #a11y-btn { width:54px; height:54px; }
}
.a11y-panel { 
  display:none; position:absolute; bottom:58px; right:0;
  width:210px; background:var(--bg-secondary);
  border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,.4);
  border:1px solid var(--border-color); padding:16px;
}
@media (min-width: 768px) {
  .a11y-panel { bottom:64px; width:240px; padding:18px; }
}
.a11y-panel.visible { display:block; }
.a11y-panel h3 { font-size:14px; font-weight:700; margin-bottom:14px; }
.a11y-row { 
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:12px; padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.a11y-row:last-of-type { border-bottom:none; margin-bottom:0; }
.a11y-row span { font-size:13px; color:var(--text-muted); }
.toggle { 
  position:relative; width:40px; height:22px; border-radius:11px;
  background:var(--bg-muted); border:1px solid var(--border-color);
  cursor:pointer; transition:background .3s;
}
.toggle[aria-checked="true"] { background:var(--purple-600); }
.toggle-circle { 
  position:absolute; top:2px; left:2px; width:16px; height:16px;
  border-radius:50%; background:white; transition:transform .3s;
}
.toggle[aria-checked="true"] .toggle-circle { transform:translateX(18px); }
.size-btns { display:flex; gap:6px; margin-top:8px; }
.size-btn { 
  padding:5px 10px; border-radius:6px;
  border:1px solid var(--border-color); background:var(--bg-muted);
  color:var(--text-muted); font-size:12px; font-family:'Syne',sans-serif;
}
.size-btn.active, .size-btn:hover { background:var(--purple-600); color:var(--bg-primary); border-color:var(--purple-600); }
#reset-btn { 
  width:100%; padding:10px; border-radius:8px;
  border:1px solid var(--border-color); background:var(--bg-muted);
  color:var(--text-muted); font-size:13px; font-family:'Syne',sans-serif;
  margin-top:12px;
}
#reset-btn:hover { background:var(--purple-600); color:var(--bg-primary); }

/* ══════════════════════════════════════════════════════
   PAGES SYSTEM
══════════════════════════════════════════════════════ */
.page { display:none; }
.page.active { display:block; }

/* ══════════════════════════════════════════════════════
   TOAST
══════════════════════════════════════════════════════ */
.toast {
  position:fixed; bottom:calc(var(--bottom-nav-h) + 16px);
  left:16px; right:16px;
  background:linear-gradient(135deg,var(--purple-800),var(--pink-600));
  color:white; padding:12px 18px; border-radius:12px;
  font-size:14px; z-index:9999; opacity:0;
  transform:translateY(20px); transition:all .3s;
  pointer-events:none; text-align:center;
}
@media (min-width: 640px) {
  .toast {
    bottom:24px; left:auto; right:24px;
    width:auto; max-width:380px;
    padding:14px 22px; text-align:left;
  }
}
.toast.show { opacity:1; transform:translateY(0); }

/* Container */
.container { max-width:1200px; margin:0 auto; }
#particles {
  pointer-events: none;
}
.a11y-btn-fixed {
  position: fixed;
  z-index: 9999;
}

/* ── CV Card ── */
.cv-card .cv-preview {
  position: relative;
  background: linear-gradient(135deg, var(--purple-950) 0%, var(--purple-900) 60%, #2a0050 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 160px;
  overflow: hidden;
}
.cv-preview-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  z-index: 1;
}
.cv-icon {
  font-size: 3rem;
  filter: drop-shadow(0 0 12px rgba(170,68,238,0.7));
  animation: cv-float 3s ease-in-out infinite;
}
@keyframes cv-float {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-6px); }
}
.cv-label {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 0.85rem;
  letter-spacing: 0.15em;
  color: var(--purple-300);
  text-transform: uppercase;
}
.cv-glow {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 100%, rgba(170,68,238,0.25) 0%, transparent 70%);
  pointer-events: none;
}
.cv-btns {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}
.cv-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 600;
  font-family: 'Syne', sans-serif;
  letter-spacing: 0.02em;
  transition: all 0.2s ease;
  cursor: pointer;
  text-decoration: none;
}
.cv-btn-view {
  background: rgba(170,68,238,0.15);
  border: 1px solid rgba(170,68,238,0.45);
  color: var(--purple-300);
}
.cv-btn-view:hover {
  background: rgba(170,68,238,0.3);
  border-color: var(--purple-400);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(170,68,238,0.3);
}
.cv-btn-dl {
  background: linear-gradient(135deg, var(--purple-700), var(--pink-600));
  border: 1px solid transparent;
  color: #fff;
}
.cv-btn-dl:hover {
  background: linear-gradient(135deg, var(--purple-600), var(--pink-500));
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(238,34,153,0.35);
}

/* ── CV Buttons (À propos) ── */
.cv-btns-about {
  display: flex;
  gap: 12px;
  margin-top: 1.5rem;
  flex-wrap: wrap;
}

/* ── CV Modal Overlay ── */
.cv-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(10, 6, 20, 0.85);
  backdrop-filter: blur(6px);
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.cv-modal.open {
  display: flex;
  animation: cv-modal-in 0.25s ease;
}
@keyframes cv-modal-in {
  from { opacity: 0; transform: scale(0.97); }
  to   { opacity: 1; transform: scale(1); }
}
.cv-modal-box {
  width: 100%;
  max-width: 760px;
  max-height: 90vh;
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 1.25rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 60px rgba(136,0,204,0.4);
}
.cv-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background: var(--bg-muted);
  border-bottom: 1px solid var(--border-soft);
  gap: 12px;
}
.cv-modal-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1rem;
  letter-spacing: 0.08em;
  color: var(--purple-300);
}
.cv-modal-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
.cv-modal-close {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(170,68,238,0.15);
  border: 1px solid rgba(170,68,238,0.35);
  color: var(--purple-300);
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s;
}
.cv-modal-close:hover {
  background: rgba(238,34,153,0.25);
  border-color: var(--pink-500);
  color: #fff;
}
.cv-modal-iframe {
  width: 100%;
  flex: 1;
  min-height: 500px;
  border: none;
  background: #fff;
}
@media (max-width: 640px) {
  .cv-modal-iframe { min-height: 70vh; }
}
