:root{--video-gold:#d8b66a;--video-gold-hi:#ead18f;--video-line:rgba(216,182,106,.28);--video-paper:#f0ece4;--video-muted:#9b968d}
body{background:#050505 url("../../images/wallpaper.png") center top/cover fixed no-repeat;color:var(--video-paper)}
body:before{content:"";position:fixed;inset:0;z-index:-1;background:rgba(0,0,0,.12);pointer-events:none}
.video-hero{position:relative;min-height:calc(100svh - 68px);margin-top:68px;max-width:1240px;margin-left:auto;margin-right:auto;padding:70px 0 60px;display:flex;align-items:center;overflow:hidden}
.video-meta{position:absolute;left:0;right:0;top:22px;display:flex;justify-content:space-between;font:500 8px/1 Inter,Arial;letter-spacing:.24em;color:#817b72}
.video-hero-copy{width:56%;min-width:0;position:relative;z-index:2;padding-left:2px}
.eyebrow{margin:0 0 16px;font:600 10px/1 Inter,Arial;letter-spacing:.26em;color:var(--video-gold)}
.video-hero h1{margin:0;font:500 clamp(92px,10vw,148px)/.72 'Cormorant Garamond',serif;letter-spacing:-.03em;color:var(--video-paper)}
.video-hero h1 em{font-style:normal;color:var(--video-gold-hi)}
.hero-rule{width:82px;height:1px;background:var(--video-gold);margin:34px 0 22px}
.video-hero-copy>p:not(.eyebrow){max-width:470px;margin:0;color:#bdb6aa;font:400 21px/1.42 'Cormorant Garamond',serif}
.signature{display:block;margin-top:28px;color:var(--video-gold-hi);font:italic 28px/1 'Cormorant Garamond',serif}
.hero-scroll{position:absolute;left:0;bottom:28px;font:500 8px/1 Inter;letter-spacing:.20em;color:#aaa49a}.hero-scroll span{font-size:18px;color:var(--video-gold);margin-left:10px}
.section{max-width:1240px;margin:0 auto;padding:100px 0}
.section-heading{display:grid;grid-template-columns:max-content max-content 1fr;gap:16px;align-items:center;padding-top:11px}
.section-number{font:500 11px/1 'Cormorant Garamond',serif;color:var(--video-gold)}.section-label{font:500 9px/1 Inter;letter-spacing:.25em;color:#aaa49a}.section-heading:after{content:"";height:1px;background:linear-gradient(90deg,var(--video-line),rgba(216,182,106,.03))}
.channels-intro,.videos-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:80px;margin:75px 0 55px;align-items:end}.channels-intro h2,.videos-intro h2{margin:0;min-width:0;font:500 clamp(65px,7vw,100px)/.78 'Cormorant Garamond',serif;color:var(--video-paper)}.channels-intro h2 em,.videos-intro h2 em{font-style:normal;color:var(--video-gold-hi)}.channels-intro p,.videos-intro p{max-width:500px;min-width:0;margin:0 0 5px;color:#b8b1a6;font:400 20px/1.48 'Cormorant Garamond',serif}.videos-intro strong{color:var(--video-gold-hi);font-weight:500}
.channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.channel-card{display:block;color:inherit;text-decoration:none}.channel-image{border:1px solid rgba(216,182,106,.55);background:#050505;overflow:hidden}.channel-image img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:transform .5s ease,filter .5s ease}.channel-card:hover .channel-image img{transform:scale(1.025);filter:saturate(1.08)}.channel-info{display:grid;grid-template-columns:40px 1fr 30px;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid rgba(216,182,106,.22)}.channel-number{font:500 12px/1 'Cormorant Garamond',serif;color:var(--video-gold)}.channel-info h3{margin:0;font:500 27px/1 'Cormorant Garamond',serif;color:var(--video-paper);letter-spacing:.02em}.channel-info p{margin:5px 0 0;font:500 8px/1 Inter;letter-spacing:.17em;color:#8f897f;text-transform:uppercase}.channel-arrow{font:20px/1 'Cormorant Garamond',serif;color:var(--video-gold-hi);text-align:right}
.videos{padding-top:45px}.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px 32px}.video-card{min-width:0}.video-frame{position:relative;border:1px solid rgba(216,182,106,.55);background:#000;aspect-ratio:16/9;overflow:hidden}.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.video-label{display:grid;grid-template-columns:40px 1fr;gap:15px;align-items:center;padding:15px 0 0}.video-label span{font:500 12px/1 'Cormorant Garamond',serif;color:var(--video-gold)}.video-label h3{margin:0;font:500 20px/1 'Cormorant Garamond',serif;color:var(--video-paper);letter-spacing:.04em}
.video-closing{max-width:1240px;margin:20px auto 0;padding:90px 0 130px;text-align:center;border-top:1px solid rgba(216,182,106,.16)}.video-closing p{margin:0 0 20px;font:500 8px/1 Inter;letter-spacing:.25em;color:var(--video-gold)}.video-closing h2{margin:0;font:500 clamp(65px,7vw,100px)/.78 'Cormorant Garamond',serif;color:var(--video-paper)}.video-closing h2 em{font-style:normal;color:var(--video-gold-hi)}.line-link{display:inline-block;margin-top:35px;padding-bottom:8px;border-bottom:1px solid rgba(216,182,106,.45);color:var(--video-gold);text-decoration:none;font:500 9px/1 Inter;letter-spacing:.18em}.line-link span{font-size:16px;margin-left:10px}
footer{max-width:1240px;margin:0 auto;padding:22px 0 28px;border-top:1px solid rgba(216,182,106,.18);display:flex;justify-content:space-between;align-items:center}footer span,footer a{font:500 8px/1 Inter;letter-spacing:.16em;color:#777168;text-decoration:none}footer a:hover{color:var(--video-gold)}
@media (min-width:801px) and (max-width:1439px){.video-hero,.section,.video-closing,footer{width:calc(100% - 120px)}.video-hero{min-height:calc(100svh - 68px)}.video-hero h1{font-size:clamp(82px,9vw,125px)}.channels-intro,.videos-intro{gap:40px;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.channel-info h3{font-size:25px}}
@media(max-width:800px){body{background-attachment:scroll}.video-hero{min-height:calc(100svh - 68px);margin-top:68px;width:calc(100% - 36px);padding:80px 0 70px;display:block}.video-meta{top:20px;font-size:7px;letter-spacing:.17em}.video-hero-copy{width:100%;padding:0;position:absolute;left:0;bottom:80px}.video-hero h1{font-size:clamp(72px,19vw,104px);line-height:.72}.video-hero-copy>p:not(.eyebrow){max-width:330px;font-size:17px}.signature{font-size:25px}.hero-scroll{left:0;bottom:24px;font-size:7px}.section{width:calc(100% - 36px);padding:75px 0}.channels-intro,.videos-intro{display:block;margin:48px 0 38px}.channels-intro h2,.videos-intro h2{font-size:clamp(60px,16vw,86px);margin-bottom:28px}.channels-intro p,.videos-intro p{font-size:17px;line-height:1.48}.channel-grid,.video-grid{grid-template-columns:1fr;gap:38px}.channel-info h3{font-size:25px}.videos{padding-top:20px}.video-grid{gap:45px}.video-closing{width:calc(100% - 36px);padding:70px 0 95px}.video-closing h2{font-size:clamp(60px,16vw,86px)}footer{width:calc(100% - 36px);padding:20px 0 26px;flex-direction:column;align-items:flex-start;gap:13px}}

/* ==========================================================
   RESPONSIVE DÉDIÉ — PAGE VIDÉOS
   Cohérent avec les autres pages du site
   ========================================================== */

@media (min-width: 1440px) {
  .video-hero,
  .section,
  .video-closing,
  footer {
    width: min(1240px, calc(100% - 84px));
  }
}

@media (min-width: 801px) and (max-width: 1439px) {
  .video-hero,
  .section,
  .video-closing,
  footer {
    width: calc(100% - 84px);
  }

  .video-hero {
    min-height: calc(100svh - 82px);
    padding: 76px 0 64px;
  }

  .video-meta {
    top: 24px;
  }

  .video-hero-copy {
    width: 62%;
  }

  .video-hero h1 {
    font-size: clamp(76px, 8.5vw, 116px);
    line-height: .76;
  }

  .video-hero-copy > p:not(.eyebrow) {
    max-width: 390px;
    font-size: 19px;
  }

  .channels-intro,
  .videos-intro {
    gap: 42px;
    margin: 58px 0 42px;
  }

  .channels-intro h2,
  .videos-intro h2 {
    font-size: clamp(58px, 6.2vw, 84px);
  }

  .channels-intro p,
  .videos-intro p {
    font-size: 18px;
  }

  .channel-grid,
  .video-grid {
    gap: 34px 24px;
  }

  .channel-info {
    grid-template-columns: 30px minmax(0, 1fr) 24px;
    gap: 12px;
  }

  .channel-info h3 {
    font-size: 23px;
  }

  .video-label h3 {
    font-size: 18px;
  }
}

@media (max-width: 800px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  body {
    background-attachment: scroll;
    background-position: center top;
  }

  .site-header {
    height: 68px;
    padding: 0 18px;
  }

  .brand {
    min-width: 0;
    gap: 4px;
  }

  .brand strong {
    font-size: 20px;
  }

  .brand span {
    font-size: 8px;
  }

  .main-nav {
    display: none;
    position: absolute;
    top: 68px;
    left: 0;
    right: 0;
    z-index: 110;
    padding: 10px 18px 14px;
    flex-direction: column;
    gap: 0;
    background: rgba(5, 5, 5, .98);
    border-top: 1px solid rgba(216, 182, 106, .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(216, 182, 106, .12);
    font-size: 11px;
  }

  .portal-link {
    display: none;
  }

  .menu-toggle {
    display: block;
    margin-left: auto;
  }

  .video-hero {
    width: calc(100% - 36px);
    min-height: 690px;
    height: auto;
    margin-top: 68px;
    padding: 82px 0 90px;
    display: flex;
    align-items: flex-end;
  }

  .video-meta {
    top: 22px;
    gap: 18px;
    font-size: 7px;
    letter-spacing: .13em;
  }

  .video-hero-copy {
    width: 100%;
    padding: 0;
  }

  .eyebrow {
    margin-bottom: 18px;
    font-size: 9px;
    letter-spacing: .18em;
  }

  .video-hero h1 {
    font-size: clamp(64px, 18vw, 100px);
    line-height: .78;
    letter-spacing: -.035em;
  }

  .hero-rule {
    width: 58px;
    margin: 28px 0 20px;
  }

  .video-hero-copy > p:not(.eyebrow) {
    max-width: 340px;
    font-size: 18px;
    line-height: 1.4;
  }

  .signature {
    margin-top: 24px;
    font-size: 25px;
  }

  .hero-scroll {
    left: 0;
    bottom: 28px;
    font-size: 7px;
    letter-spacing: .14em;
  }

  .section {
    width: calc(100% - 36px);
    padding: 72px 0;
  }

  .section-heading {
    grid-template-columns: max-content max-content minmax(18px, 1fr);
    gap: 12px;
  }

  .section-number {
    font-size: 12px;
  }

  .section-label {
    font-size: 8px;
    letter-spacing: .15em;
  }

  .channels-intro,
  .videos-intro {
    display: block;
    margin: 46px 0 36px;
  }

  .channels-intro h2,
  .videos-intro h2 {
    margin-bottom: 26px;
    font-size: clamp(52px, 15.5vw, 82px);
    line-height: .82;
  }

  .channels-intro p,
  .videos-intro p {
    max-width: 100%;
    font-size: 18px;
    line-height: 1.48;
  }

  .channel-grid,
  .video-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .channel-image img {
    aspect-ratio: 16 / 9;
  }

  .channel-info {
    grid-template-columns: 28px minmax(0, 1fr) 24px;
    gap: 12px;
    padding: 15px 0;
  }

  .channel-info h3 {
    font-size: clamp(23px, 6.5vw, 29px);
    line-height: 1;
  }

  .channel-info p {
    font-size: 7px;
    letter-spacing: .13em;
  }

  .videos {
    padding-top: 18px;
  }

  .video-grid {
    gap: 42px;
  }

  .video-frame {
    width: 100%;
    aspect-ratio: 16 / 9;
  }

  .video-label {
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 12px;
    padding-top: 13px;
  }

  .video-label h3 {
    font-size: clamp(18px, 5.2vw, 23px);
    line-height: 1.08;
  }

  .video-closing {
    width: calc(100% - 36px);
    margin-top: 0;
    padding: 68px 0 90px;
  }

  .video-closing p {
    font-size: 7px;
    letter-spacing: .16em;
    line-height: 1.7;
  }

  .video-closing h2 {
    font-size: clamp(52px, 15.5vw, 82px);
    line-height: .82;
  }

  .line-link {
    font-size: 8px;
    letter-spacing: .12em;
  }

  footer {
    width: calc(100% - 36px);
    padding: 20px 0 26px;
    flex-direction: column;
    align-items: flex-start;
    gap: 13px;
  }

  footer span,
  footer a {
    font-size: 7px;
    line-height: 1.5;
  }
}

@media (max-width: 420px) {
  .video-hero {
    width: calc(100% - 28px);
    min-height: 640px;
  }

  .video-meta {
    font-size: 6px;
    letter-spacing: .08em;
  }

  .video-hero h1 {
    font-size: clamp(58px, 17.5vw, 78px);
  }

  .video-hero-copy > p:not(.eyebrow) {
    max-width: 290px;
    font-size: 16px;
  }

  .section,
  .video-closing,
  footer {
    width: calc(100% - 28px);
  }

  .section {
    padding: 62px 0;
  }

  .section-heading {
    gap: 9px;
  }

  .section-label {
    font-size: 7px;
    letter-spacing: .1em;
  }

  .channels-intro h2,
  .videos-intro h2,
  .video-closing h2 {
    font-size: clamp(48px, 15vw, 68px);
  }

  .channels-intro p,
  .videos-intro p {
    font-size: 16px;
  }

  .channel-info h3 {
    font-size: 22px;
  }
}

/* Réduction homothétique des espacements sur portable 1080p réglé à 125 %. */
@media (min-width:801px) and (max-width:1439px) and (max-height:820px) and (orientation:landscape){
  .video-hero{min-height:calc(100svh - 68px);padding:48px 0 38px}.video-meta{top:16px}.video-hero h1{font-size:clamp(68px,8vw,98px)}.hero-rule{margin:22px 0 15px}.video-hero-copy>p:not(.eyebrow){font-size:17px}.signature{margin-top:17px;font-size:24px}.hero-scroll{bottom:16px}
  .section{padding:72px 0}.channels-intro,.videos-intro{margin:45px 0 35px}.video-closing{padding:65px 0 80px}
}