/* Homepage Élèves — rythme visuel.
   Chargée en dernier : varie alignements, fonds et compositions section par section
   sans toucher au contenu. Palette : ivoire / graphite / cuivre. Accent : Newsreader Italic. */

/* ---------- Repères de section (numéro + libellé, façon folios du brand book) ---------- */

main > section[data-section-index] {
  position: relative;
}

.home-section-mark {
  position: absolute;
  z-index: 3;
  top: clamp(1.4rem, 2.6vw, 2.4rem);
  right: max(1.25rem, calc((100vw - 1180px) / 2));
  display: inline-flex;
  align-items: baseline;
  gap: .5rem;
  margin: 0;
  padding: .4rem .6rem;
  border: 1px solid rgba(194, 90, 44, .4);
  color: var(--clay);
  font: 700 .6rem/1 var(--font-label);
  letter-spacing: .14em;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
}

.home-kawtar .home-section-mark,
.home-cohort .home-section-mark,
.home-final .home-section-mark {
  border-color: rgba(230, 138, 94, .45);
  color: var(--brass);
}

/* ---------- Bandeau défilant des cinq gestes ---------- */

.home-gestures-band {
  overflow: hidden;
  border-top: 1px solid rgba(244, 239, 230, .14);
  border-bottom: 1px solid rgba(20, 17, 14, .14);
  background: var(--clay);
  color: var(--paper);
}

.home-gestures-band__track {
  display: flex;
  width: max-content;
  animation: gestures-marquee 38s linear infinite;
}

.home-gestures-band:hover .home-gestures-band__track {
  animation-play-state: paused;
}

.home-gestures-band__list {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.home-gestures-band__list li {
  display: inline-flex;
  align-items: baseline;
  gap: .6rem;
  padding: .85rem 2.2rem;
  border-right: 1px solid rgba(244, 239, 230, .35);
  font: 500 1.02rem/1 var(--sans);
  letter-spacing: -.02em;
  white-space: nowrap;
}

.home-gestures-band__list li span {
  font: 700 .62rem/1 var(--font-label);
  letter-spacing: .12em;
  opacity: .8;
}

.home-gestures-band__sign {
  font: italic 400 1.02rem/1 var(--font-accent) !important;
}

@keyframes gestures-marquee {
  to { transform: translateX(-50%); }
}

/* ---------- 01 · Méthode : déjà centrée ; on ajoute les arcs du brand book ---------- */

.home-video-section--centered {
  background:
    radial-gradient(circle at 50% 0%, rgba(194, 90, 44, .07), transparent 32%),
    var(--ivory);
}

.home-video-section--centered .home-video-section__inner::before,
.home-video-section--centered .home-video-section__inner::after {
  position: absolute;
  z-index: -1;
  border: 1px solid rgba(194, 90, 44, .22);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.home-video-section--centered .home-video-section__inner::before {
  top: -8rem;
  left: -22%;
  width: 54vw;
  height: 54vw;
  max-width: 760px;
  max-height: 760px;
}

.home-video-section--centered .home-video-section__inner::after {
  right: -18%;
  bottom: -14rem;
  width: 42vw;
  height: 42vw;
  max-width: 600px;
  max-height: 600px;
  border-color: rgba(194, 90, 44, .14);
}

/* ---------- 03 · Témoignages : en-tête à droite, collage épinglé à gauche ---------- */

.home-voices {
  background:
    radial-gradient(circle at 10% 15%, rgba(194, 90, 44, .09), transparent 24%),
    var(--aqluma-ivory-deep);
}

.home-voices__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  grid-template-areas:
    "grid header"
    "grid figures";
  grid-template-rows: auto 1fr;
  gap: clamp(2rem, 4vw, 4rem) clamp(2.5rem, 5vw, 5.5rem);
  align-items: start;
}

.home-voices__header {
  grid-area: header;
  max-width: none;
  margin: 0;
  text-align: left;
}

.home-voices__header h2 {
  font-size: clamp(2.4rem, 3.9vw, 3.9rem);
}

.home-voices__grid {
  grid-area: grid;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.4rem 1.2rem;
  margin-top: 0;
}

.home-voices__grid .home-voice--parent {
  grid-column: 1 / -1;
  width: min(100%, 560px);
  transform: rotate(-1deg);
}

.home-voices__grid .home-voice--student {
  margin-top: -.6rem;
  transform: rotate(1.3deg);
}

.home-voices__grid .home-voice--teacher {
  margin-top: 2.4rem;
  transform: rotate(-.8deg);
}

/* Punaise en haut de chaque billet */
.home-voice::after {
  position: absolute;
  top: -.55rem;
  left: 50%;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #f1d2c0, var(--clay) 60%);
  box-shadow: 0 3px 6px rgba(20, 17, 14, .3);
  content: "";
  transform: translateX(-50%);
}

.home-voices__figures {
  grid-area: figures;
  grid-template-columns: 1fr;
  align-self: start;
  margin-top: 0;
  border: 0;
  background: transparent;
  gap: 0;
}

.home-voices__figures li {
  grid-template-columns: auto 1fr;
  align-items: baseline;
  gap: 1rem;
  padding: 1rem 0;
  border-top: 1px solid rgba(20, 17, 14, .2);
  background: transparent;
}

.home-voices__figures li:last-child {
  border-bottom: 1px solid rgba(20, 17, 14, .2);
}

.home-voices__figures strong {
  min-width: 4.2ch;
  font-size: clamp(2.2rem, 3.4vw, 3rem);
}

/* ---------- 04 · Kawtar : fond graphite, portrait à droite, texte à gauche ---------- */

.home-kawtar {
  background:
    radial-gradient(circle at 86% 20%, rgba(194, 90, 44, .2), transparent 26%),
    linear-gradient(rgba(244, 239, 230, .03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244, 239, 230, .03) 1px, transparent 1px),
    var(--void);
  background-size: auto, 72px 72px, 72px 72px, auto;
  color: var(--paper);
  border-bottom: 1px solid rgba(244, 239, 230, .14);
}

.home-kawtar::before { display: none; }

.home-kawtar__header h2 { color: var(--paper); }
.home-kawtar__header h2 em { color: var(--brass); }

.home-kawtar__layout {
  grid-template-columns: minmax(0, 1.22fr) minmax(300px, .78fr);
}

.home-kawtar__portrait {
  order: 2;
  justify-self: end;
  width: min(100%, 440px);
  position: sticky;
  top: 140px;
}

.home-kawtar__content {
  order: 1;
}

.home-kawtar__portrait::before {
  border-color: rgba(230, 138, 94, .45);
}

.home-kawtar__image-frame {
  border-color: rgba(244, 239, 230, .22);
  box-shadow: 18px 22px 0 rgba(194, 90, 44, .22), 0 28px 60px rgba(0, 0, 0, .35);
  transform: rotate(1.2deg);
}

.home-kawtar__image-frame img {
  filter: saturate(.9) contrast(1.05);
}

.home-kawtar__portrait figcaption a,
.home-kawtar__linkedin,
.home-kawtar__contact a {
  color: var(--paper);
  text-decoration-color: var(--brass);
}

.home-kawtar__portrait figcaption a:hover,
.home-kawtar__linkedin:hover,
.home-kawtar__contact a:hover { color: var(--brass); }

.home-kawtar__identity { border-bottom-color: rgba(244, 239, 230, .2); }
.home-kawtar__identity h3 { color: var(--paper); }
.home-kawtar__role { color: var(--brass); }
.home-kawtar__qualifications { color: #d2c8bd; }
.home-kawtar__introduction { color: #e6ded4; }
.home-kawtar__section-label { color: var(--brass); }
.home-kawtar__approach ol { border-top-color: rgba(244, 239, 230, .2); }
.home-kawtar__approach li { border-bottom-color: rgba(244, 239, 230, .14); }
.home-kawtar__approach h4 { color: var(--paper); }
.home-kawtar__approach li p { color: #bcb1a7; }

.home-kawtar__note {
  margin-left: 0;
  border-color: rgba(230, 138, 94, .5);
  background: var(--paper);
  color: var(--void);
  box-shadow: 10px 10px 0 rgba(194, 90, 44, .3);
  transform: rotate(-1.2deg);
}

.home-kawtar__note blockquote { color: var(--void); }

.home-kawtar__ecosystem {
  color: #cfc5ba;
  border-left-color: var(--brass);
}

.home-kawtar__catalogue {
  margin-top: 2.2rem;
}

.home-kawtar__catalogue ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: .9rem 0 0;
  padding: 0;
  border: 1px solid rgba(244, 239, 230, .2);
  background: rgba(244, 239, 230, .14);
  list-style: none;
}

.home-kawtar__catalogue a {
  display: grid;
  gap: .25rem;
  min-height: 100%;
  padding: 1.1rem 1.1rem 1.2rem;
  background: var(--void);
  color: var(--paper);
  text-decoration: none;
  transition: background-color .2s ease;
}

.home-kawtar__catalogue a:hover,
.home-kawtar__catalogue a:focus-visible {
  background: rgba(194, 90, 44, .22);
}

.home-kawtar__catalogue a:focus-visible {
  outline: 2px solid var(--brass);
  outline-offset: -4px;
}

.home-kawtar__catalogue strong {
  color: var(--brass);
  font: 600 2rem/1 var(--sans);
  letter-spacing: -.05em;
}

.home-kawtar__catalogue span {
  font: italic 400 1.08rem/1.15 var(--font-accent);
}

.home-kawtar__catalogue small {
  color: #bcb1a7;
  font: 500 .74rem/1.35 var(--sans);
  letter-spacing: 0;
}

.home-kawtar__contact {
  border-top-color: rgba(244, 239, 230, .2);
  border-bottom-color: rgba(244, 239, 230, .2);
}

.home-kawtar__contact p { color: var(--paper); }

.home-kawtar__all-cohorts {
  border-color: var(--brass);
  background: var(--brass);
  color: var(--void) !important;
}

.home-kawtar__all-cohorts:hover,
.home-kawtar__all-cohorts:focus-visible {
  background: transparent;
  color: var(--paper) !important;
}

.home-kawtar__next-cohort {
  background: var(--brass);
  color: var(--void);
}

.home-kawtar__next-cohort span { background: var(--void); box-shadow: none; }

/* ---------- 05 · Leçon gratuite : en-tête centré, billets détachables, formulaire incliné ---------- */

.home-lesson {
  background:
    radial-gradient(circle at 50% 100%, rgba(194, 90, 44, .09), transparent 30%),
    var(--ivory);
}

.home-lesson::before { display: none; }

.home-lesson__header {
  max-width: 820px;
  margin-inline: auto;
  text-align: center;
}

.home-lesson__eyebrow { justify-content: center; }
.home-lesson__eyebrow::before { display: none; }

.home-lesson__header h2 { margin-inline: auto; }

.home-lesson__intro {
  margin-inline: auto;
  padding: 1rem 0 0;
  border-left: 0;
  border-top: 2px solid var(--clay);
}

.home-lesson__points {
  max-width: 900px;
  margin-inline: auto;
  text-align: left;
}

.home-lesson__layout {
  grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr);
  align-items: center;
}

.home-lesson__dates h3 {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
}

.home-lesson__dates h3::before {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--clay);
  box-shadow: 0 0 0 5px rgba(194, 90, 44, .18);
  content: "";
}

.home-lesson__list {
  display: grid;
  gap: .8rem;
  border-top: 0;
}

.home-lesson__item {
  position: relative;
  padding: 1rem 1.2rem 1rem 1.6rem;
  border: 1px solid rgba(20, 17, 14, .22);
  border-left: 0;
  background:
    repeating-linear-gradient(0deg, transparent 0 29px, rgba(20, 17, 14, .05) 29px 30px),
    var(--paper);
  box-shadow: 8px 9px 0 rgba(194, 90, 44, .09);
  transition: transform .2s ease, box-shadow .2s ease;
}

.home-lesson__item::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 10px;
  background:
    radial-gradient(circle, var(--ivory) 0 3px, transparent 3.5px) 0 50% / 10px 16px repeat-y,
    var(--clay);
  content: "";
}

.home-lesson__item:nth-child(2) { transform: rotate(.5deg); }
.home-lesson__item:nth-child(3) { transform: rotate(-.6deg); }

.home-lesson__item:hover {
  transform: translateY(-3px) rotate(0);
  box-shadow: 10px 12px 0 rgba(194, 90, 44, .14);
}

.home-lead-form {
  transform: rotate(-1deg);
}

.home-lead-form:focus-within {
  transform: none;
}

/* ---------- 06 · Cohorte : titre graphite pleine largeur, fiche collée à droite ---------- */

.home-cohort__header {
  max-width: none;
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, .6fr);
  gap: 2rem 4rem;
  align-items: end;
}

.home-cohort__eyebrow { grid-column: 1 / -1; }

.home-cohort__header h2 {
  grid-column: 1;
}

.home-cohort__intro {
  grid-column: 2;
  margin-top: 0;
}

.home-cohort__official-name {
  grid-column: 1;
  margin-left: 0;
}

/* ---------- 07 · Questions : index éditorial, en-tête sticky à gauche ---------- */

.home-parents {
  background:
    radial-gradient(circle at 92% 92%, rgba(194, 90, 44, .07), transparent 24%),
    var(--aqluma-ivory-deep);
}

.home-parents::before { display: none; }

.home-parents__inner {
  grid-template-columns: minmax(300px, .8fr) minmax(0, 1.2fr);
  align-items: start;
}

.home-parents__aside {
  position: sticky;
  top: 140px;
  display: grid;
  gap: 2rem;
}

.home-parents__header {
  grid-column: auto;
  margin-bottom: 0;
}

.home-parents__header h2 {
  font-size: clamp(2.4rem, 3.9vw, 3.9rem);
}

.home-parents__not {
  box-shadow: 12px 14px 0 rgba(194, 90, 44, .14);
  transform: rotate(-.8deg);
}

.home-parents__faq {
  counter-reset: faq;
  border-top: 0;
}

.home-parents__item {
  counter-increment: faq;
  border-bottom: 0;
}

.home-parents__item summary {
  display: grid;
  grid-template-columns: 3.4rem 1fr;
  gap: .5rem;
  padding: 1.5rem 3.2rem 1.5rem 0;
  border-top: 1px solid rgba(20, 17, 14, .24);
  font-size: clamp(1.1rem, 1.5vw, 1.3rem);
  letter-spacing: -.02em;
}

.home-parents__item summary::before {
  color: var(--clay);
  font: italic 400 1.6rem/1 var(--font-accent);
  content: "0" counter(faq);
}

.home-parents__item:last-child {
  border-bottom: 1px solid rgba(20, 17, 14, .24);
}

.home-parents__item summary::after {
  top: 1.45rem;
  transform: none;
}

.home-parents__answer {
  padding-left: 3.9rem;
}

.home-parents__item[open] summary {
  background: linear-gradient(90deg, rgba(194, 90, 44, .06), transparent 70%);
}

/* ---------- 08 · Pour décider : signature typographique géante, graphite ---------- */

.home-final {
  background:
    radial-gradient(circle at 15% 85%, rgba(194, 90, 44, .12), transparent 28%),
    linear-gradient(rgba(20, 17, 14, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(20, 17, 14, .018) 1px, transparent 1px),
    var(--ivory);
  background-size: auto, 68px 68px, 68px 68px, auto;
}

.home-final__inner {
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  align-items: end;
}

.home-final h2 {
  font-size: clamp(3.4rem, 8vw, 8.4rem);
  line-height: .86;
  letter-spacing: -.065em;
}

.home-final__voice {
  transform: rotate(-1.4deg);
}

/* ---------- Apparitions au défilement ---------- */

.home-motion [data-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s cubic-bezier(.2, .7, .2, 1), transform .8s cubic-bezier(.2, .7, .2, 1);
}

.home-motion [data-reveal][data-reveal-delay="1"] { transition-delay: .12s; }
.home-motion [data-reveal][data-reveal-delay="2"] { transition-delay: .24s; }

.home-motion [data-reveal].is-revealed {
  opacity: 1;
  transform: none;
}

/* Les éléments déjà inclinés conservent leur rotation une fois révélés. */
.home-motion .home-voice--parent.is-revealed { transform: rotate(-1deg); }
.home-motion .home-voice--student.is-revealed { transform: rotate(1.3deg); }
.home-motion .home-voice--teacher.is-revealed { transform: rotate(-.8deg); }
.home-motion .home-lead-form.is-revealed { transform: rotate(-1deg); }
.home-motion .home-lead-form.is-revealed:focus-within { transform: none; }
.home-motion .home-parents__not.is-revealed { transform: rotate(-.8deg); }
.home-motion .home-final__voice.is-revealed { transform: rotate(-1.4deg); }
.home-motion .cohort-enrolment-card.is-revealed { transform: rotate(.6deg); }

/* ---------- Responsive ---------- */

@media (max-width: 980px) {
  .home-voices__inner {
    grid-template-columns: 1fr;
    grid-template-areas:
      "header"
      "grid"
      "figures";
  }

  .home-voices__header,
  .home-kawtar__portrait,
  .home-parents__aside {
    position: static;
  }

  .home-voices__grid { grid-template-columns: 1fr; }
  .home-voices__grid .home-voice--parent { width: 100%; }
  .home-voices__grid .home-voice--student,
  .home-voices__grid .home-voice--teacher { margin-top: 0; }

  .home-kawtar__layout { grid-template-columns: 1fr; }
  .home-kawtar__portrait { order: 1; justify-self: start; width: min(100%, 420px); }
  .home-kawtar__content { order: 2; }

  .home-cohort__header { grid-template-columns: 1fr; }
  .home-cohort__header h2,
  .home-cohort__intro,
  .home-cohort__official-name { grid-column: 1; }
  .home-cohort__intro { margin-top: 1.4rem; }

  .home-parents__inner { grid-template-columns: 1fr; }
  .home-final__inner { grid-template-columns: 1fr; align-items: start; }
}

@media (max-width: 640px) {
  main > section[data-section-index]::before {
    top: 1rem;
    right: 1rem;
    font-size: .56rem;
  }

  .home-gestures-band__list li {
    padding: .7rem 1.3rem;
    font-size: .9rem;
  }

  .home-voices__grid .home-voice--parent,
  .home-voices__grid .home-voice--student,
  .home-voices__grid .home-voice--teacher,
  .home-motion .home-voice--parent.is-revealed,
  .home-motion .home-voice--student.is-revealed,
  .home-motion .home-voice--teacher.is-revealed,
  .home-lead-form,
  .home-motion .home-lead-form.is-revealed,
  .home-kawtar__image-frame,
  .home-parents__not,
  .home-motion .home-parents__not.is-revealed,
  .home-final__voice,
  .home-motion .home-final__voice.is-revealed,
  .home-lesson__item:nth-child(2),
  .home-lesson__item:nth-child(3) {
    transform: none;
  }

  .home-kawtar__catalogue ul {
    grid-template-columns: 1fr;
  }

  .home-parents__item summary {
    grid-template-columns: 2.6rem 1fr;
    padding-right: 2.8rem;
    font-size: 1rem;
  }

  .home-parents__item summary::before { font-size: 1.3rem; }
  .home-parents__answer { padding-left: 3.1rem; }

  .home-final h2 { font-size: clamp(2.8rem, 14vw, 4.4rem); }
}

@media (prefers-reduced-motion: reduce) {
  .home-gestures-band__track { animation: none; }

  .home-motion [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .home-lesson__item { transition: none; }
}
