/* ==========================================================
   BOOK SPORTIF — RESPONSIVE PORTRAIT
   Même logique que la page Sport : menu mobile, une colonne,
   respiration verticale et ratios photo strictement conservés.
   ========================================================== */
@media (max-width:800px){
  html{scroll-behavior:smooth}
  body{
    background-attachment:scroll;
    background-position:center top;
    overflow-x:hidden;
  }

  /* Header : reprendre exactement la logique mobile Sport */
  .site-header{height:68px;padding:0 18px}
  .brand strong{font-size:20px}
  .brand span{font-size:8px}
  .main-nav{
    display:none;
    position:absolute;
    top:68px;left:0;right:0;
    background:rgba(5,5,5,.98);
    padding:12px 18px;
    flex-direction:column;
    gap:0;
    border-top:1px solid rgba(201,164,90,.2);
    box-shadow:0 15px 30px rgba(0,0,0,.8);
  }
  .site-header.open .main-nav{display:flex}
  .main-nav a{padding:14px 4px;border-bottom:1px solid rgba(201,164,90,.12);font-size:11px}
  .portal-link{display:none}
  .menu-toggle{display:block;margin-left:auto}

  /* Couverture : image en arrière-plan visuel, texte lisible sans filtre sur l'image */
  .book-cover{
    min-height:calc(100svh - 68px);
    height:auto;
    margin-top:68px;
    padding:0 20px;
    display:block;
    overflow:hidden;
  }
  .cover-image{
    position:absolute;
    width:100%;
    height:auto;
    right:0;
    top:7%;
    bottom:auto;
    opacity:1;
    justify-content:center;
    align-items:flex-start;
  }
  .cover-image img{
    width:auto;
    max-width:94%;
    max-height:61svh;
    height:auto;
    object-fit:contain;
    filter:none;
  }
  .cover-copy{
    position:absolute;
    left:20px;
    right:20px;
    bottom:76px;
    max-width:390px;
    padding-top:0;
    transform:none;
    z-index:4;
  }
  .eyebrow{font-size:9px;letter-spacing:.2em}
  .cover-copy h1{
    font-size:clamp(70px,20vw,108px);
    line-height:.70;
    letter-spacing:-.03em;
    white-space:nowrap;
  }
  .cover-rule{width:70px;margin:28px 0 18px}
  .cover-intro{font-size:17px;line-height:1.38;max-width:310px}
  .cover-signature{font-size:26px;margin-top:24px}
  .cover-meta{left:20px;right:20px;top:20px;font-size:7px;letter-spacing:.17em}
  .cover-side{display:none}
  .cover-scroll{left:20px;right:auto;bottom:24px;font-size:8px}
  .cover-scroll span{font-size:16px}

  /* Index */
  .section{width:calc(100% - 36px)}
  .book-index{padding:70px 0 42px}
  .section-heading{
    grid-template-columns:max-content max-content minmax(20px,1fr);
    column-gap:12px;
    margin-bottom:34px;
  }
  .section-number{font-size:14px}
  .section-label{font-size:8px;letter-spacing:.15em}
  .index-head{display:block;margin-bottom:35px}
  .index-head h2{
    font-size:clamp(56px,15vw,80px);
    line-height:.76;
    margin-bottom:24px;
  }
  .index-head>p{font-size:17px;line-height:1.55}
  .filter-list{grid-template-columns:1fr 1fr}
  .filter{min-height:68px;padding:15px 13px;font-size:8px}
  .filter span{font-size:8px;margin-bottom:6px}

  /* Thèmes */
  .theme{
    width:calc(100% - 22px);
    padding:62px 0 95px;
    scroll-margin-top:80px;
  }
  .theme-head{
    display:block;
    width:calc(100% - 28px);
    margin-bottom:18px;
  }
  .theme-number{font-size:48px;margin-bottom:10px}
  .theme-title h2{font-size:clamp(44px,12.5vw,66px);line-height:.78}
  .theme-copy{
    border-left:0;
    border-top:1px solid var(--book-line);
    padding:17px 0 0;
    margin-top:20px;
  }
  .theme-copy p{font-size:17px;line-height:1.45}
  .theme-copy span{font-size:7px}
  .theme-rule{width:calc(100% - 28px);margin-bottom:34px}

  /* Une colonne, aucun crop : chaque photo conserve son ratio natif */
  .theme-gallery{width:calc(100% - 28px)}
  .photo-feature{
    width:100%;
    margin:0 0 44px;
  }
  .photo-feature img,
  .photo-card img{
    width:100%;
    height:auto;
    max-height:none;
    object-fit:contain;
    filter:saturate(.86) contrast(1.03);
  }
  .masonry{columns:1;column-gap:0}
  .photo-card{margin:0 0 28px}
  .feature-meta,.photo-meta{font-size:7px;letter-spacing:.09em;padding-top:10px}

  /* Le clic reste évident sur tactile */
  .photo-feature:after{
    opacity:1;
    transform:none;
    right:8px;
    bottom:40px;
    padding:8px 9px;
    font-size:7px;
  }
  .photo-card:before{opacity:1;right:7px;top:7px;width:25px;height:25px;font-size:14px}

  /* Lightbox adaptée au téléphone */
  .lightbox{padding:16px 6px}
  .lightbox figure{max-width:98vw;max-height:94vh}
  .lightbox img{max-width:97vw;max-height:82vh;width:auto;height:auto}
  .lightbox figcaption{font-size:8px;letter-spacing:.1em}
  .lightbox-prev,.lightbox-next{font-size:52px;padding:10px}
  .lightbox-prev{left:0}.lightbox-next{right:0}
  .lightbox-close{top:8px;right:9px;font-size:38px}

  .final-nav{padding:70px 20px}
  .final-nav h2{font-size:clamp(44px,12vw,64px);line-height:.82}
  .final-links{grid-template-columns:1fr}
  .final-links a{margin-right:0;padding:16px 0;font-size:9px}
  footer{padding:20px 18px;flex-direction:column;align-items:flex-start;gap:12px}
  footer span,footer a{font-size:8px}
}

@media (max-width:359px){
  .site-header{padding:0 12px}
  .section{width:calc(100% - 24px)}
  .cover-copy{left:15px;right:15px;bottom:70px}
  .cover-copy h1{font-size:clamp(58px,18vw,78px)}
  .cover-intro{font-size:15px;max-width:280px}
  .cover-image img{max-width:96%;max-height:56svh}
}

@media (max-width:800px) and (max-height:680px){
  .book-cover{min-height:560px}
  .cover-image{top:4%}
  .cover-image img{max-height:52svh}
  .cover-copy{bottom:52px}
  .cover-copy h1{font-size:clamp(54px,15vw,76px)}
  .cover-intro{display:none}
  .cover-signature{margin-top:18px}
}

@media (prefers-reduced-motion:reduce){
  .photo-card img{transition:none}
}