/* ═══════════════════════════════════════════
   RESPONSIVE – Olivier Husser
   Breakpoints: 1100 / 900 / 768 / 480 / 380
   ═══════════════════════════════════════════ */

/* ── 1100px : large tablet / small laptop ── */
@media (max-width: 1100px) {
  nav { padding: 1.2rem 2.5rem; }
  .hero-left { padding: 5rem 3rem 4rem; }
  .hero-name { font-size: 3rem; }
  .hero-title { font-size: 1.2rem; }
  .section-expertise { padding: 5rem 2.5rem; }
  .section-tags { padding: 4rem 2.5rem; }
  footer { padding: 2.5rem 2.5rem; }
}

/* ── 900px : tablet ── */
@media (max-width: 900px) {
  nav { padding: 1.1rem 2rem; }
  .nav-links { display: none; }

  /* Hero : une colonne, image en haut */
  .hero {
    display: flex;
    flex-direction: column;
    min-height: auto;
    padding-top: 0;
  }
  .hero-right {
    order: 0;
    width: 100%;
    height: 260px;
    min-height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .hero-right img {
    width: auto;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
  }
  .hero-left {
    order: 1;
    width: 100%;
    padding: 2.5rem 2rem 3rem;
  }
  .hero-left::after { display: none; }

  .hero-name { font-size: 2.8rem; }
  .hero-title { font-size: 1.15rem; }
  .hero-intro { font-size: 0.98rem; max-width: 100%; }

  .cta-group { max-width: 100%; }

  /* Expertise */
  .section-expertise { padding: 4rem 1.5rem; }
  .cards-grid { grid-template-columns: 1fr; gap: 1px; }
  .card { padding: 2.5rem 2rem; }
  .section-title { font-size: 1.9rem; }

  /* Tags */
  .section-tags { padding: 3.5rem 1.5rem; }

  /* Contact */
  .section-contact { padding: 4rem 2rem; }
  .contact-actions { flex-direction: column; max-width: 420px; margin: 0 auto; }
  .contact-link { width: 100%; border: 1px solid rgba(168,145,90,0.25) !important; }
  .contact-link:first-child { border-bottom: none !important; }
  .contact-sep { display: none; }

  /* Footer */
  footer {
    flex-direction: column;
    gap: 1.2rem;
    text-align: center;
    padding: 2.5rem 1.5rem;
  }
  .footer-contact { flex-direction: column; gap: 0.7rem; align-items: center; }
  .footer-sep { display: none; }
}

/* ── 600px : smartphone ── */
@media (max-width: 600px) {

  /* NAV */
  nav {
    padding: 0 1.25rem;
    height: 54px;
  }
  .nav-brand { font-size: 1rem; }

  /* HERO */
  .hero { padding-top: 54px; }

  .hero-right {
    height: 200px;
  }
  .hero-right img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    object-position: center;
    max-width: 100%;
  }

  .hero-left { padding: 2rem 1.25rem 2.5rem; }

  .hero-eyebrow {
    font-size: 0.7rem;
    letter-spacing: 0.15em;
    margin-bottom: 1rem;
  }

  .hero-name-row {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    flex-wrap: nowrap;
    margin-bottom: 0.8rem;
  }
  .hero-photo {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
  }
  .hero-name {
    font-size: 1.9rem;
    line-height: 1.1;
  }
  .hero-title {
    font-size: 0.95rem;
    line-height: 1.5;
    margin-bottom: 1.5rem;
  }
  .linkedin-hero {
    font-size: 0.7rem;
    margin-top: 0.8rem;
    margin-bottom: 0.5rem;
  }
  .hero-divider { margin: 1.2rem 0; }
  .hero-tagline { font-size: 1rem; margin-bottom: 0.8rem; }
  .hero-intro {
    font-size: 0.88rem;
    line-height: 1.7;
    margin-bottom: 1.8rem;
  }

  /* CTA BUTTONS */
  .cta-group {
    flex-direction: column;
    max-width: 100%;
    gap: 0.6rem;
  }
  .cta-btn {
    width: 100%;
    padding: 1rem 1.2rem;
    justify-content: space-between;
  }
  .btn-label { font-size: 0.8rem; }
  .btn-sub { font-size: 0.68rem; }

  /* EXPERTISE */
  .section-expertise { padding: 2.5rem 1.25rem; }
  .section-eyebrow { font-size: 0.7rem; }
  .section-title { font-size: 1.45rem; }
  .section-header { margin-bottom: 2rem; }

  .card { padding: 1.75rem 1.25rem; }
  .card-number { font-size: 2.8rem; margin-bottom: 0.5rem; }
  .card-label { font-size: 0.7rem; }
  .card-title { font-size: 1.35rem; }
  .card-target { font-size: 0.75rem; margin-bottom: 1rem; }
  .card-visual { height: 140px; margin-bottom: 1.25rem; border-radius: 4px; }
  .card-desc { font-size: 0.88rem; line-height: 1.7; }
  .card-link { font-size: 0.75rem; margin-top: 1.2rem; }

  /* TAGS */
  .section-tags { padding: 2.5rem 1.25rem; }
  .tags-label { font-size: 0.7rem; margin-bottom: 1.2rem; }
  .tags-cloud { gap: 0.5rem; }
  .tag { font-size: 0.72rem; padding: 0.35rem 0.75rem; }

  /* CONTACT */
  .section-contact { padding: 2.5rem 1.25rem; }
  .contact-question {
    font-size: 1.2rem;
    margin-bottom: 1.8rem;
  }
  .contact-link { padding: 1rem 1.2rem; }
  .contact-icon svg { width: 18px; height: 18px; }
  .contact-link-label { font-size: 0.65rem; }
  .contact-link-value { font-size: 0.88rem; }

  /* FOOTER */
  footer { padding: 2rem 1.25rem; gap: 1rem; }
  .footer-name { font-size: 1rem; }
  .footer-copy { font-size: 0.68rem; }
}

/* ── 380px : très petits écrans ── */
@media (max-width: 380px) {
  .hero-name { font-size: 1.65rem; }
  .hero-photo { width: 48px; height: 48px; }
  .hero-title { font-size: 0.88rem; }
  .hero-intro { font-size: 0.84rem; }
  .btn-label { font-size: 0.74rem; }
  .section-title { font-size: 1.3rem; }
  .card-title { font-size: 1.2rem; }
  .contact-question { font-size: 1.05rem; }
}