/* styles.css — Charte turquoise / bleu nuit, responsive + impression */
:root{
  --navy: #071028;
  --turquoise: #14d1c4;
  --muted: #9fb4c3;
  --text: #e6f7f5;
  --card-bg: rgba(255,255,255,0.03);
  --max-width: 1000px;
  --radius: 12px;
  --danger: #e53935; /* rouge bouton PDF */
  --font-sans: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--font-sans);
  background: var(--navy);
  color: var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* -------- Accueil -------- */
.page-home .home-wrap{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:16px;
  text-align:center;
}
.logo-link{display:inline-block; border-radius:20px; padding:10px;}
.logo{width:240px; height:auto; display:block; filter: drop-shadow(0 8px 20px rgba(0,0,0,0.6));}
.hint{margin:0; color:var(--muted); font-size:0.95rem;}

/* -------- CV -------- */
#bg-canvas{
  position: fixed;
  inset: 0;
  z-index: 0; /* derrière le contenu */
}

#btn-pdf{
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 5;
  background: var(--danger);
  color: #fff;
  border: none;
  padding: 10px 14px;
  border-radius: 10px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(0,0,0,0.35);
}
#btn-pdf:hover{ filter: brightness(1.1); }

.cv-header{
  max-width:var(--max-width);
  margin:28px auto 8px;
  padding:12px 20px;
  position: relative;
  z-index: 1;
}
.logo-and-contact{
  display:flex;
  gap:18px;
  align-items:center;
}
.avatar{
  width:120px;
  height:120px;
  border-radius:50%;
  object-fit:cover;
  object-position:center;
  border: 3px solid var(--turquoise);
  background: rgba(255,255,255,0.06);
}
.name{margin:0; font-size:1.6rem; letter-spacing:0.6px;}
.role{margin:4px 0 0; color:var(--muted); font-weight:600;}
.contact .info a{ color: var(--turquoise); text-decoration:none }

.cv-container{
  max-width:var(--max-width);
  margin:16px auto 48px;
  padding:20px;
  display:grid;
  grid-template-columns: 1fr;
  gap:18px;
  position: relative;
  z-index: 1;
}

.card{
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border-radius:var(--radius);
  padding:18px;
  box-shadow: 0 6px 30px rgba(2,6,23,0.6);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,0.04);
}

.section h2{
  margin:0 0 8px;
  color:var(--turquoise);
  font-size:1.05rem;
}

.job + .job{ margin-top:12px; }
.job h3{ margin:0; font-size:1rem; }
.period{ color:var(--muted); font-size:0.9rem; margin:4px 0; }
.card ul{ margin:8px 0 0 18px; line-height:1.45; color:var(--text); }

.cv-footer{
  max-width:var(--max-width);
  margin: 0 auto 40px;
  padding: 0 20px;
  color:var(--muted);
  font-size:0.9rem;
  position: relative;
  z-index: 1;
}

/* Desktop : meilleure largeur */
@media (min-width: 900px){
  .avatar{ width:140px; height:140px; }
}

/* Impression PDF propre */
@media print{
  @page { size: A4; margin: 12mm; }
  body{ background: #fff; color:#000; }
  #bg-canvas, #btn-pdf{ display:none !important; }
  .card{ box-shadow: none; border: none; background: transparent; }
  .section h2{ color:#000; }
  .avatar{ border: 2px solid #000; }
}