:root {
  --bg: #ffffff;
  --bg-soft: #f8f9fb;
  --bg-card: #ffffff;
  --border: #e8eaef;
  --border-light: #f0f1f5;
  --text: #1a1d27;
  --text-secondary: #6b7084;
  --text-tertiary: #9ca0b0;
  --accent: #3b82c4;
  --accent-light: #e8f2fb;
  --accent-2: #5a9fd6;
  --accent-gradient: linear-gradient(135deg, #3b82c4, #5a9fd6);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 20px rgba(0,0,0,0.06);
  --shadow-lg: 0 8px 40px rgba(0,0,0,0.08);
  --radius: 12px;
}

* { margin:0; padding:0; box-sizing:border-box; }

/* Global video background */
.global-video-bg {
  position: fixed;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}
.global-overlay {
  position: fixed;
  inset: 0;
  background: rgba(6, 10, 20, 0.55);
  z-index: 1;
}

html, body {
  width:100%; height:100%;
  overflow:hidden;
  background: #0a0e17;
  font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

/* Default slides: white opaque background (covers video) */
.slide {
  background: #ffffff;
}
/* Cover + transitions: transparent (video visible) */
.cover-immersive,
.transition-slide,
.contact-slide {
  background: transparent !important;
}

/* ========== NAVIGATION ========== */
.nav-dots {
  position:fixed; right:24px; top:50%; transform:translateY(-50%);
  z-index:100; display:flex; flex-direction:column; gap:8px;
}
.nav-dot {
  width:7px; height:7px; border-radius:50%;
  background: var(--border);
  cursor:pointer; transition: all 0.4s cubic-bezier(0.16,1,0.3,1);
  border:none; outline:none;
}
.nav-dot:hover { background: var(--text-secondary); }
.nav-dot.active {
  background: var(--accent);
  height:20px; border-radius:4px;
}

.progress-bar {
  position:fixed; top:0; left:0; height:3px; z-index:100;
  background: var(--accent-gradient);
  transition: width 0.6s cubic-bezier(0.16,1,0.3,1);
}

.slide-counter {
  position:fixed; bottom:24px; right:28px; z-index:100;
  font-size:12px; font-weight:500; color: var(--text-tertiary);
  letter-spacing:0.5px;
}
.slide-counter .current { color: var(--text); font-weight:700; }

.nav-arrow {
  position:fixed; z-index:100; background:none; border:none;
  color: var(--text-tertiary); cursor:pointer; font-size:18px;
  transition: color 0.3s; padding:10px;
}
.nav-arrow:hover { color: var(--text); }
.nav-arrow.prev { bottom:20px; left:28px; }
.nav-arrow.next { bottom:20px; left:64px; }

/* ========== SLIDES ========== */
.slide {
  position:fixed; inset:0;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition: opacity 0.6s cubic-bezier(0.16,1,0.3,1);
  padding: 40px 60px;
  overflow:hidden;
  z-index: 2;
}
.slide.active { opacity:1; pointer-events:all; }

.slide-inner {
  width:100%; max-width:1280px; height:100%;
  display:flex; align-items:center; justify-content:center;
  position:relative;
}

/* Reveal animations */
.reveal {
  opacity:0; transform:translateY(24px);
  transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1),
              transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.slide.active .reveal { opacity:1; transform:translateY(0); }
.slide.active .reveal.d1 { transition-delay:0.08s; }
.slide.active .reveal.d2 { transition-delay:0.16s; }
.slide.active .reveal.d3 { transition-delay:0.24s; }
.slide.active .reveal.d4 { transition-delay:0.32s; }
.slide.active .reveal.d5 { transition-delay:0.40s; }
.slide.active .reveal.d6 { transition-delay:0.48s; }
.slide.active .reveal.d7 { transition-delay:0.56s; }
.slide.active .reveal.d8 { transition-delay:0.64s; }
.slide.active .reveal.d9 { transition-delay:0.72s; }

/* ========== SLIDE HEADER BAR (ETIC-inspired) ========== */
.slide-header {
  display:none;
}
.slide-header .header-title {
  font-size:20px; font-weight:700; color:#fff;
  letter-spacing:-0.3px;
}
.slide-header .header-sub {
  font-size:13px; font-weight:400; color:rgba(255,255,255,0.7);
}
.slide-header .header-num {
  width:36px; height:36px; border-radius:8px;
  background:rgba(255,255,255,0.15);
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:700; color:#fff;
}

/* ========== COVER ========== */
.cover-content { text-align:center; max-width:800px; }
.cover-badge {
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 20px; border-radius:100px;
  background: var(--accent-light);
  color: var(--accent); font-size:13px; font-weight:600;
  letter-spacing:0.5px; text-transform:uppercase;
  margin-bottom:32px;
}
.cover-content h1 {
  font-size:clamp(36px,5vw,72px); font-weight:800;
  line-height:1.08; letter-spacing:-2px;
  margin-bottom:20px;
  color: var(--text);
}
.cover-content h1 span {
  background: var(--accent-gradient);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}
.cover-content .subtitle {
  font-size:clamp(15px,1.3vw,20px); font-weight:400;
  color: var(--text-secondary); line-height:1.7;
}
.cover-content .subtitle strong {
  color: var(--text); font-weight:600;
}
.cover-line {
  width:48px; height:3px; background: var(--accent-gradient);
  margin:24px auto;
  border-radius:2px;
}
.cover-insa {
  margin-top:36px;
  display:flex; align-items:center; justify-content:center; gap:12px;
}
.cover-insa img {
  height:40px; object-fit:contain;
}
.cover-insa span {
  font-size:13px; color: var(--text-tertiary); font-weight:400;
}

/* ========== TRUST / LOGOS ========== */
.trust-slide .slide-inner {
  flex-direction:column; gap:24px; justify-content:center;
  align-items:center;
}
.trust-title {
  font-size:clamp(24px,2.5vw,40px); font-weight:700;
  color: var(--text); letter-spacing:-0.5px;
  text-align:center;
}
.trust-subtitle {
  font-size:15px; color: var(--text-secondary); font-weight:400;
  text-align:center; margin-top:4px;
}

/* Marquee band */
.marquee-wrapper {
  width:100%; max-width:1280px;
  overflow:hidden;
  padding:22px 0;
  position:relative;
  mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
}
.marquee-track {
  display:flex; align-items:center; gap:56px;
  width:max-content;
  animation: marquee-scroll 28s linear infinite;
}
.marquee-track:hover { animation-play-state:paused; }
.marquee-track img {
  height:30px; max-width:130px; object-fit:contain;
  opacity:1;
  flex-shrink:0;
}
@keyframes marquee-scroll {
  0% { transform:translateX(0); }
  100% { transform:translateX(-50%); }
}

/* Thin separator */
.trust-sep {
  width:100%; max-width:1000px; height:1px;
  background: var(--border-light);
}

/* Logo grid */
.logos-grid-wrap {
  display:flex; flex-direction:column; align-items:center; gap:10px;
  width:100%; max-width:1000px;
}
.logos-grid {
  display:grid; grid-template-columns:repeat(5,1fr);
  gap:10px; width:100%;
}
.logos-grid.row-3 {
  grid-template-columns:repeat(3,1fr);
  max-width:600px;
}
.logo-card {
  background: var(--bg-soft);
  border:1px solid var(--border-light);
  border-radius:10px;
  padding:16px 20px;
  display:flex; align-items:center; justify-content:center;
  transition: all 0.3s ease;
  min-height:58px;
}
.logo-card:hover {
  border-color: var(--border);
  box-shadow: var(--shadow-md);
  transform:translateY(-2px);
}
.logo-card img {
  max-height:26px; max-width:110px;
  object-fit:contain;
  opacity:1;
  transition: transform 0.3s;
}
.logo-card:hover img { transform:scale(1.05); }

/* ========== TEAM ========== */
.team-slide .slide-inner { flex-direction:column; gap:40px; }
.section-title {
  font-size:clamp(28px,2.8vw,44px); font-weight:700;
  letter-spacing:-0.5px; color: var(--text);
  text-align:center;
}
.section-subtitle {
  font-size:15px; color: var(--text-secondary);
  text-align:center; margin-top:4px;
}
.team-grid {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:28px; width:100%; max-width:1000px;
}
.team-member { text-align:center; }
.team-photo {
  width:140px; height:140px; border-radius:50%;
  object-fit:cover; margin:0 auto 16px;
  border:3px solid var(--border-light);
  transition: all 0.4s cubic-bezier(0.16,1,0.3,1);
  display:block;
}
.team-photo:hover {
  border-color: var(--accent);
  transform:scale(1.05);
}
.team-photo-placeholder {
  width:140px; height:140px; border-radius:50%;
  background: var(--accent-light);
  border:3px solid var(--border-light);
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 16px;
  font-size:32px; font-weight:700; color: var(--accent);
}
.team-member h3 {
  font-size:16px; font-weight:600; margin-bottom:4px;
  color: var(--text);
}
.team-member p {
  font-size:12px; color: var(--text-secondary); font-weight:500;
}
.team-linkedin {
  display:inline-flex; align-items:center; justify-content:center;
  margin-top:8px; opacity:0.7; transition:opacity .2s, transform .2s;
}
.team-linkedin:hover { opacity:1; transform:scale(1.15); }

/* ========== PERSONAL SLIDES (Djalil, Sami, Mehdi, Rayan) ========== */
.personal-slide { font-family: 'Plus Jakarta Sans', -apple-system, sans-serif; }
.personal-slide .slide-inner {
  display:grid; grid-template-columns:1fr 1.5fr;
  gap:60px; align-items:center;
}
.personal-photo-wrap {
  display:flex; justify-content:center; align-items:center;
}
.personal-photo {
  width:280px; height:350px; border-radius:16px;
  object-fit:cover;
  border:1px solid var(--border);
  box-shadow: var(--shadow-lg);
}
.personal-photo-placeholder-big {
  width:280px; height:350px; border-radius:16px;
  background: var(--accent-light);
  border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  font-size:56px; font-weight:700; color: var(--accent);
}
.personal-info h2 {
  font-size:clamp(26px,2.5vw,40px); font-weight:700;
  letter-spacing:-0.5px; margin-bottom:4px;
  color: var(--text);
}
.personal-info .role {
  font-size:clamp(14px,1.1vw,17px); font-weight:500;
  color: var(--accent); margin-bottom:24px;
}
.personal-info .experiences {
  list-style:none; margin-bottom:24px;
}
.personal-info .experiences li {
  font-size:clamp(13px,0.9vw,15px); font-weight:400;
  color: var(--text-secondary); padding:10px 0;
  border-bottom:1px solid var(--border-light);
  line-height:1.5;
}
.personal-info .experiences li strong {
  color: var(--text); font-weight:600;
}
.tech-stack {
  display:flex; flex-wrap:wrap; gap:6px;
}
.tech-pill {
  padding:5px 12px; border-radius:6px;
  font-size:11px; font-weight:500;
  background: var(--bg-soft);
  border:1px solid var(--border-light);
  color: var(--text-secondary);
  transition: all 0.3s;
}
.tech-pill:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-light);
}

/* ========== PROFILE SLIDE (Riad-style full layout) ========== */
.profile-slide { font-family: 'Plus Jakarta Sans', -apple-system, sans-serif; }
.profile-slide .slide-inner {
  flex-direction:column;
  align-items:stretch;
  justify-content:center;
  gap:0;
  padding-top:0;
}

/* Top: identity row */
.profile-header {
  display:flex; align-items:center; gap:24px;
  margin-bottom:20px;
}
.profile-photo {
  width:90px; height:90px; border-radius:50%;
  object-fit:cover;
  border:3px solid var(--accent-light);
  flex-shrink:0;
}
.profile-identity { flex:1; }
.profile-identity h2 {
  font-size:clamp(32px,3.5vw,48px); font-weight:800;
  letter-spacing:-1px; color: var(--text);
  line-height:1.1;
}
.profile-identity .profile-role {
  font-size:clamp(16px,1.4vw,20px); font-weight:500;
  color: var(--accent); margin-top:4px;
}
.profile-identity .profile-school {
  font-size:14px; font-weight:400;
  color: var(--text-tertiary); margin-top:3px;
}

/* Experience blocks - two columns */
.profile-xp-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:20px;
  margin-bottom:20px;
  align-items:start;
}
.profile-xp-block {
  background: var(--bg-soft);
  border:1px solid var(--border-light);
  border-radius: var(--radius);
  padding:18px 22px;
  transition: all 0.3s ease;
}
.profile-xp-block:hover {
  border-color: var(--border);
  box-shadow: var(--shadow-md);
}
.profile-xp-label {
  display:inline-flex; align-items:center; gap:6px;
  font-size:13px; font-weight:700;
  letter-spacing:1px; text-transform:uppercase;
  color: var(--accent);
  margin-bottom:10px;
}
.profile-xp-label::before {
  content:'';
  width:8px; height:8px; border-radius:2px;
  background: var(--accent);
}
.profile-xp-item {
  margin-bottom:6px;
  padding:8px 10px;
  border-radius:8px;
  cursor:default;
  transition: background 0.3s ease;
}
.profile-xp-item:last-child { margin-bottom:0; }
.profile-xp-item:hover {
  background: rgba(59,130,196,0.04);
}
.profile-xp-item .xp-company {
  font-size:clamp(17px,1.3vw,21px); font-weight:700;
  color: var(--text);
  margin-bottom:2px;
  display:flex; align-items:center; gap:8px;
}
.profile-xp-item .xp-hint {
  display:inline-flex; align-items:center; gap:4px;
  font-size:10px; font-weight:600;
  color: var(--accent);
  opacity:0.6;
  margin-left:auto;
  padding:2px 8px;
  border-radius:4px;
  background: var(--accent-light);
  transition: opacity 0.3s, background 0.3s;
  flex-shrink:0;
  white-space:nowrap;
}
.profile-xp-item .xp-hint svg {
  transition: transform 0.3s;
}
.profile-xp-item:hover .xp-hint {
  opacity:1;
  background: var(--accent);
  color:#fff;
}
.profile-xp-item:hover .xp-hint svg {
  transform:rotate(180deg);
}
.profile-xp-item:hover .xp-hint svg path {
  stroke:#fff;
}
.profile-xp-item .xp-tagline {
  font-size:12px; font-weight:600;
  color: var(--accent); letter-spacing:0.3px;
  margin-bottom:0;
  text-transform:uppercase;
}
.profile-xp-item .xp-desc {
  font-size:clamp(13px,0.95vw,15px); font-weight:400;
  color: var(--text-secondary); line-height:1.55;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transition: max-height 0.4s cubic-bezier(0.16,1,0.3,1),
              opacity 0.3s ease,
              margin 0.3s ease;
  margin-top:0;
}
.profile-xp-item:hover .xp-desc {
  max-height:200px;
  opacity:1;
  margin-top:6px;
}

/* Skills section */
.profile-skills {
  display:flex; flex-direction:column; gap:5px;
}
.profile-skills-title {
  font-size:13px; font-weight:700;
  letter-spacing:1px; text-transform:uppercase;
  color: var(--accent);
  display:inline-flex; align-items:center; gap:6px;
  margin-bottom:6px;
}
.profile-skills-title::before {
  content:'';
  width:8px; height:8px; border-radius:2px;
  background: var(--accent);
}
.profile-skills-row {
  display:flex; align-items:center; gap:10px;
}
.profile-skills-row .sk-label {
  font-size:13px; font-weight:700;
  color: var(--text);
  min-width:90px; flex-shrink:0;
}
.profile-skills-row .sk-pills {
  display:flex; flex-wrap:wrap; gap:5px;
}
.profile-skills-row .tech-pill {
  padding:5px 12px; font-size:13px;
}

/* ========== TRANSITION SLIDES ========== */
.transition-slide {
  background: transparent;
}
.transition-slide .slide-inner {
  justify-content:center; align-items:center;
}
.transition-slide h2 {
  font-size:clamp(40px,5vw,72px); font-weight:800;
  color:#fff; letter-spacing:-1.5px;
  text-align:center;
}

/* ========== REFERENCE SLIDES ========== */
.ref-slide .slide-inner {
  display:grid; grid-template-columns:1fr 1.2fr;
  gap:50px; align-items:center;
}
.ref-slide.text-only .slide-inner {
  grid-template-columns:1fr;
  text-align:center;
  max-width:860px;
  margin:0 auto;
}
.ref-header {
  display:none;
}
.ref-header .rh-left {
  display:flex; align-items:center; gap:16px;
}
.ref-header .rh-title {
  font-size:16px; font-weight:600; color:#fff;
}
.ref-header .rh-sub {
  font-size:12px; font-weight:400; color:rgba(255,255,255,0.65);
}
.ref-header .rh-num {
  width:32px; height:32px; border-radius:8px;
  background:rgba(255,255,255,0.15);
  display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; color:#fff;
}

.ref-info .ref-label {
  display:inline-block;
  font-size:11px; font-weight:600;
  letter-spacing:2px; text-transform:uppercase;
  color: var(--accent); margin-bottom:12px;
  padding:4px 12px; border-radius:4px;
  background: var(--accent-light);
}
.ref-info .ref-logo {
  height:36px; max-width:160px; object-fit:contain;
  margin-bottom:20px;
  display:block;
}
.ref-slide.text-only .ref-info .ref-logo {
  margin:0 auto 20px;
}
.ref-info h2 {
  font-size:clamp(22px,2.2vw,36px); font-weight:700;
  letter-spacing:-0.5px; margin-bottom:14px;
  line-height:1.2; color: var(--text);
}
.ref-info .ref-desc {
  font-size:clamp(13px,0.95vw,15px); font-weight:400;
  color: var(--text-secondary); line-height:1.7;
  margin-bottom:20px;
}
.ref-info .ref-metrics {
  display:flex; gap:28px; margin-bottom:20px;
}
.ref-slide.text-only .ref-info .ref-metrics {
  justify-content:center;
}
.ref-metric { text-align:left; }
.ref-slide.text-only .ref-metric { text-align:center; }
.ref-metric .value {
  font-size:24px; font-weight:800;
  color: var(--accent);
}
.ref-metric .label {
  font-size:11px; color: var(--text-tertiary); font-weight:500;
  margin-top:2px;
}

/* Screenshot layouts */
.screenshot-stack {
  position:relative; height:400px;
}
.screenshot-stack img {
  position:absolute; border-radius:10px;
  border:1px solid var(--border);
  box-shadow: var(--shadow-lg);
  transition: all 0.5s cubic-bezier(0.16,1,0.3,1);
}
.screenshot-stack img:nth-child(1) {
  width:75%; top:0; left:0; z-index:3;
}
.screenshot-stack img:nth-child(2) {
  width:65%; top:40px; right:0; z-index:2;
}
.screenshot-stack img:nth-child(3) {
  width:55%; bottom:0; left:10%; z-index:1;
}
.screenshot-stack img {
  cursor:pointer;
}
.screenshot-stack img:hover {
  z-index:10 !important;
  transform:scale(1.05) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.18);
}

.screenshot-duo {
  position:relative; height:400px;
}
.screenshot-duo img {
  position:absolute; border-radius:10px;
  border:1px solid var(--border);
  box-shadow: var(--shadow-lg);
  transition: all 0.5s cubic-bezier(0.16,1,0.3,1);
  cursor:pointer;
}
.screenshot-duo img:nth-child(1) {
  width:80%; top:0; left:0; z-index:2;
}
.screenshot-duo img:nth-child(2) {
  width:75%; bottom:0; right:0; z-index:1;
}
.screenshot-duo img:hover {
  z-index:10 !important;
  transform:scale(1.05) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.18);
}

/* ========== REF SLIDE — TECH & TEAM ========== */
.ref-tech {
  display:flex; flex-wrap:wrap; gap:5px;
  margin-bottom:14px;
}
.ref-tech .tech-pill {
  font-size:11px; padding:4px 10px;
}
.ref-team {
  display:flex; align-items:center; gap:10px;
  font-size:13px; color: var(--text-secondary);
  margin-bottom:14px;
}
.ref-team-label {
  font-weight:700; color: var(--text);
  font-size:12px; letter-spacing:0.5px;
  text-transform:uppercase;
  flex-shrink:0;
}
.ref-team-members {
  display:flex; gap:8px; flex-wrap:wrap;
}
.ref-team-member {
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 12px; border-radius:6px;
  background: var(--accent-light);
  font-size:12px; font-weight:600;
  color: var(--accent);
}
.ref-team-member img {
  width:20px; height:20px; border-radius:50%;
  object-fit:cover;
}
.ref-duration {
  font-size:12px; font-weight:500;
  color: var(--text-tertiary);
  margin-bottom:10px;
}
.ref-link {
  color: var(--accent);
  font-weight:700;
  font-size:14px;
  text-decoration:none;
  border-bottom:2px solid var(--accent-light);
  transition: border-color 0.3s, opacity 0.3s;
}
.ref-link:hover {
  border-color: var(--accent);
  opacity:0.8;
}

/* ========== WHY US ========== */
.why-slide .slide-inner {
  flex-direction:column; gap:32px; text-align:center;
}
.why-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:14px; width:100%; max-width:1100px;
}
.why-grid-6 {
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:auto auto;
}
.why-card {
  background: var(--bg-soft);
  border:1px solid var(--border-light);
  border-radius: var(--radius);
  padding:24px 22px;
  text-align:left;
  transition: all 0.35s cubic-bezier(0.16,1,0.3,1);
  position:relative;
  overflow:hidden;
}
.why-card::before {
  content:'';
  position:absolute; top:0; left:0;
  width:3px; height:100%;
  background: var(--accent);
  opacity:0;
  transition: opacity 0.3s;
}
.why-card:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow-md);
  transform:translateY(-4px);
}
.why-card:hover::before {
  opacity:1;
}
.why-card-accent {
  background: var(--accent);
  border-color: var(--accent);
}
.why-card-accent::before { display:none; }
.why-card-accent h3 { color:#fff !important; }
.why-card-accent p { color:#fff !important; }
.why-card-accent .why-number { color:rgba(255,255,255,0.3); }
.why-card-accent:hover {
  background: var(--accent-2);
  border-color: var(--accent-2);
  box-shadow: 0 8px 32px rgba(59,130,196,0.3);
}
.why-number {
  font-size:32px; font-weight:900;
  color: var(--accent);
  line-height:1;
  margin-bottom:10px;
  display:block;
  letter-spacing:-1px;
}
.why-card h3 {
  font-size:15px; font-weight:700; margin-bottom:8px;
  color: var(--text);
}
.why-card p {
  font-size:12.5px; font-weight:400; color: var(--text-secondary);
  line-height:1.55;
}

/* ========== CONTACT ========== */
.contact-slide .slide-inner {
  flex-direction:column; gap:28px; text-align:center;
}
.contact-slide h2 {
  font-size:clamp(32px,3.5vw,52px); font-weight:800;
  letter-spacing:-1px; color: #fff;
}
.contact-slide .contact-sub {
  font-size:clamp(14px,1.2vw,18px); font-weight:400;
  color: rgba(255,255,255,0.8); max-width:500px;
}
.contact-email {
  font-size:clamp(18px,2vw,28px); font-weight:700;
  color: #7bb8e8;
  text-decoration:none;
  transition: opacity 0.3s;
}
.contact-email:hover { opacity:0.7; }
.contact-badges {
  display:flex; gap:12px; margin-top:4px;
}
.contact-badge {
  padding:10px 20px; border-radius:10px;
  background: rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.12);
  font-size:13px; font-weight:500;
  color: rgba(255,255,255,0.8);
  display:flex; align-items:center; gap:8px;
  transition: all 0.3s;
  text-decoration:none;
}
.contact-badge:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-light);
}

/* ========== KEY HINTS ========== */
.key-hint {
  position:fixed; bottom:24px; left:50%; transform:translateX(-50%);
  z-index:100; font-size:11px; color: rgba(255,255,255,0.5);
  letter-spacing:1px;
  transition: opacity 1s;
}
.key-hint.hidden { opacity:0; }

/* ========== HEADER BAR for ref slides ========== */
.ref-topbar {
  display:none;
}
.has-topbar .slide-inner {
  padding-top:0;
}
.has-topbar.slide {
  padding-top:0;
}

/* ========== GLOBAL FOOTER WATERMARK ========== */
.watermark {
  position:fixed; bottom:24px; left:50%; transform:translateX(-50%);
  z-index:50; display:flex; align-items:center; gap:8px;
  font-size:10px; color: var(--text-tertiary); letter-spacing:0.5px;
  opacity:0.5;
}

/* ========== IMMERSIVE COVER ========== */
.cover-immersive {
  padding: 0 !important;
}
.cover-immersive .slide-inner {
  z-index: 3;
  max-width: 900px;
}

/* Snow canvas */
.snow-canvas {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  z-index: 2;
  pointer-events: none;
}

/* Cover-specific text enhancements */
.cover-immersive .cover-badge {
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.9);
  font-size: 12px;
  letter-spacing: 2.5px;
  padding: 10px 24px;
}
.cover-immersive .cover-content h1 {
  color: #fff;
  font-size: clamp(38px, 5.5vw, 76px);
  text-shadow: 0 2px 40px rgba(0, 0, 0, 0.3);
}
.cover-immersive .cover-content h1 span {
  background: linear-gradient(135deg, #b4e0f7, #e0f0ff, #ffffff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.cover-immersive .cover-line {
  background: linear-gradient(90deg, transparent, rgba(180, 224, 247, 0.6), transparent);
  width: 80px;
  height: 2px;
}
.cover-immersive .cover-content .subtitle {
  color: rgba(255, 255, 255, 0.8);
}
.cover-immersive .cover-content .subtitle strong {
  color: #fff;
}
.cover-immersive .cover-content .subtitle span {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.cover-immersive .cover-insa img {
  filter: brightness(0) invert(1);
  opacity: 0.7;
}