/* Page d'accueil — styles propres à front-page.php, en complément de main.css */

.hero-screen{
  background:var(--ink); color:#fff;
  min-height:100vh; display:flex; flex-direction:column; position:relative;
}
.hero-screen .topbar{padding:32px 48px 0; position:static;}
.hero-screen-content{
  flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center;
  padding-bottom:140px; /* réserve la place de .scroll-cue, en position absolue, pour que le centrage remonte le texte au-dessus */
}
.banner{max-width:1100px; margin:0 auto; text-align:center; padding:64px 48px 30px;}
.banner h1{
  font-family:'Anton'; text-transform:uppercase; color:#fff;
  font-size:clamp(32px, 5.4vw, 76px); line-height:1.08;
}
.banner .accent{ -webkit-text-stroke: 1px #fff; color: transparent; }
.scroll-cue{
  position:absolute; bottom:96px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px;
  font-family:'Space Mono'; font-size:11px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--mute-dark);
}
.scroll-cue .chevron{font-size:14px; animation:scrollBounce 2s ease-in-out infinite;}
@keyframes scrollBounce{0%,100%{transform:translateY(0);} 50%{transform:translateY(6px);}}
@media (prefers-reduced-motion: reduce){.scroll-cue .chevron{animation:none;}}

.featured-section{background:var(--ink); color:#fff;}
.banner-divider{max-width:1180px; margin:0 auto; padding:0 48px;}
.banner-divider hr{border:none; border-top:1px solid rgba(255,255,255,0.16); margin:0;}
.hero-inner{
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:1.1fr 1fr; gap:64px;
  padding:64px 48px 110px;
  align-items:center;
}
.hero-photo{position:relative; overflow:hidden; max-height:420px; align-self:center;}
.hero-photo img{width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(1) contrast(1.12); transition:transform 0.6s ease;}
.hero-photo:hover img{transform:scale(1.045);}
.hero-photo .overlay{
  position:absolute; inset:0; display:flex; align-items:flex-end; padding:18px;
  background:linear-gradient(to top, rgba(0,0,0,0.68), rgba(0,0,0,0) 58%);
  opacity:0; transition:opacity 0.35s ease;
}
.hero-photo:hover .overlay{opacity:1;}
.hero-content{display:flex; flex-direction:column; align-items:flex-start;}
.hero-content .eyebrow{margin-bottom:20px;}
.hero-content h2{
  font-family:'Anton'; text-transform:uppercase; color:#fff;
  font-size:clamp(24px, 3vw, 36px); line-height:1.08; margin-bottom:22px;
}
.hero-content p.excerpt{font-size:16px; line-height:1.65; color:#D8D8D8; max-width:42ch; margin-bottom:30px;}

.section-head{
  display:flex; justify-content:space-between; align-items:baseline;
  padding:88px 48px 40px; max-width:1180px; margin:0 auto;
}
.section-head h3{font-family:'Anton'; text-transform:uppercase; font-size:28px;}

.grid-tight-top{padding-top:0;}
.grid-cta{display:flex; justify-content:center; padding:0 48px 100px;}

.wordplay-dark{background:var(--ink); padding:100px 48px 120px; text-align:center;}
.wp-carousel{display:flex; align-items:center; justify-content:center; gap:18px; max-width:1180px; margin:0 auto;}
.wp-carousel-viewport{overflow:hidden; max-width:920px;}
.wp-carousel-track{display:flex; gap:20px; transition:transform 0.4s ease;}
.wp-dots{display:flex; justify-content:center; gap:8px; margin-top:32px;}
.wp-dot{width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,0.25); border:none; padding:0; cursor:pointer; transition:background 0.2s ease;}
.wp-dot.active{background:#fff;}
.wp-tile-img{width:280px; flex-shrink:0; aspect-ratio:4/5; overflow:hidden; background:#fff;}
.wp-tile-img img{width:100%; height:100%; object-fit:cover; display:block;}
.wp-arrow{
  background:none; border:1px solid rgba(255,255,255,0.35); color:#fff;
  width:44px; height:44px; min-width:44px; border-radius:50%;
  font-family:'Space Mono'; font-size:16px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:border-color 0.2s ease, opacity 0.2s ease;
}
.wp-arrow:hover{border-color:#fff;}

.marchandise{padding:20px 48px 110px; max-width:1180px; margin:20px auto 0; border-top:1px solid #ECECE8;}
.marchandise-grid{display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:center;}
.marchandise-photos{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.marchandise-photos .visual{aspect-ratio:4/5; background:#EFEFEF; overflow:hidden;}
.marchandise-photos .visual img{width:100%; height:100%; object-fit:cover; display:block;}
.marchandise h3{font-family:'Anton'; text-transform:uppercase; font-size:clamp(26px,3.4vw,36px); margin-bottom:16px;}
.marchandise p{font-size:15px; color:var(--mute); max-width:34ch; margin-bottom:22px;}

@media (max-width:860px){
  .hero-inner{grid-template-columns:1fr; padding-bottom:64px;}
}
@media (max-width:640px){
  .wp-carousel{gap:10px;}
  .wp-tile-img{width:140px;}
  .wp-arrow{width:36px; height:36px; min-width:36px; font-size:13px;}
}
@media (max-width:560px){
  .section-head, .marchandise{padding-left:24px; padding-right:24px;}
  .hero-inner, .contact-cta{padding-left:24px; padding-right:24px;}
  .marchandise-grid{grid-template-columns:1fr;}
}