/* École Sainte-Anastasie - Proposition A "Cahier d'écolier chaleureux"
   BEM v3-[page]-[bloc]__[element]--[modifier]. Couleurs/rayons/typo via var(--...) de variables.css.
   Combiné avec utilitaires Tailwind CDN pour grid/flex/spacing. */

* {
  box-sizing: border-box;
}

body {
  font-family: var(--font-corps);
  color: var(--text);
  background: var(--surface);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: var(--font-titre);
  font-weight: 600;
  color: var(--text);
  margin: 0;
}

.v3-decoratif {
  font-family: var(--font-decoratif);
  font-weight: 400;
  line-height: 1.2;
}

a {
  color: inherit;
}

img {
  max-width: 100%;
  display: block;
}

/* ============ Bandeau arc-en-ciel décoratif ============ */
.v3-rainbow-divider {
  display: flex;
  width: 100%;
  height: 6px;
}
.v3-rainbow-divider__stripe {
  flex: 1 1 0;
}
.v3-rainbow-divider__stripe--rose { background: var(--color-rose); }
.v3-rainbow-divider__stripe--vert { background: var(--color-vert-eau); }
.v3-rainbow-divider__stripe--marine { background: var(--color-bleu-marine); }
.v3-rainbow-divider__stripe--or { background: var(--color-or); }
.v3-rainbow-divider__stripe--orange { background: var(--color-orange); }
.v3-rainbow-divider__stripe--magenta { background: var(--color-magenta); }

/* ============ Header / navigation méga-menu ============ */
.v3-home-header {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 50;
}

.v3-home-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-xs) var(--space-md);
  max-width: 1280px;
  margin: 0 auto;
}

.v3-home-header__logo {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  min-height: var(--touch-target-min);
}

.v3-home-header__logo img {
  height: 48px;
  width: auto;
}

.v3-home-header__logo-text {
  font-family: var(--font-titre);
  font-weight: 700;
  font-size: 1.05rem;
  line-height: 1.1;
  color: var(--accent-primary);
}

.v3-home-header__nav {
  display: flex;
  align-items: stretch;
  gap: var(--space-xs);
}

.v3-home-header__nav-item {
  position: relative;
}

.v3-home-header__nav-trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-height: var(--touch-target-min);
  padding: 0.5rem 0.9rem;
  font-family: var(--font-titre);
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--text);
  border-radius: var(--radius-sm);
  background: transparent;
  border: none;
  cursor: pointer;
}

.v3-home-header__nav-trigger:hover,
.v3-home-header__nav-trigger[aria-expanded="true"] {
  background: var(--surface-alt);
  color: var(--accent-primary);
}

.v3-home-header__mega {
  position: absolute;
  top: calc(100% + 0.5rem);
  left: 0;
  min-width: 560px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: 0 18px 40px -12px rgba(12, 25, 175, 0.18);
  padding: var(--space-sm);
}

.v3-home-header__mega-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-xs);
}

.v3-home-header__mega-card {
  display: flex;
  gap: 0.75rem;
  padding: 0.75rem;
  border-radius: var(--radius-sm);
  text-decoration: none;
}

.v3-home-header__mega-card:hover {
  background: var(--surface-alt);
}

.v3-home-header__mega-thumb {
  width: 56px;
  height: 56px;
  border-radius: var(--radius-sm);
  object-fit: cover;
  flex-shrink: 0;
}

.v3-home-header__mega-title {
  font-family: var(--font-titre);
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--text);
  margin-bottom: 0.15rem;
}

.v3-home-header__mega-desc {
  font-size: 0.8rem;
  color: var(--text-muted);
  line-height: 1.35;
}

.v3-home-header__cta {
  min-height: var(--touch-target-min);
}

.v3-home-header__burger {
  display: none;
  min-height: var(--touch-target-min);
  min-width: var(--touch-target-min);
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--surface);
}

@media (max-width: 1100px) {
  .v3-home-header__nav { display: none; }
  .v3-home-header__burger { display: inline-flex; }
}

/* ============ Boutons pastille (pill) ============ */
.v3-btn-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: var(--touch-target-min);
  padding: 0.75rem 1.75rem;
  border-radius: var(--radius-pill);
  font-family: var(--font-titre);
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.v3-btn-pill:hover {
  transform: translateY(-2px) scale(1.04);
}

.v3-btn-pill--primary {
  background: var(--accent-primary);
  color: var(--accent-primary-contrast);
  box-shadow: 0 10px 24px -8px rgba(12, 25, 175, 0.45);
}

.v3-btn-pill--secondary {
  background: var(--accent-secondary);
  color: var(--accent-secondary-contrast);
  box-shadow: 0 10px 24px -8px rgba(194, 45, 143, 0.4);
}

.v3-btn-pill--soft {
  background: var(--color-rose);
  color: var(--text);
  border: 2px solid transparent;
}

.v3-btn-pill--outline {
  background: transparent;
  color: var(--accent-primary);
  border: 2px solid var(--accent-primary);
}

.v3-btn-pill--sm {
  padding: 0.6rem 1.1rem;
  font-size: 0.85rem;
  min-height: var(--touch-target-min);
}

/* ============ Badges / galets ============ */
.v3-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.85rem;
  border-radius: var(--radius-pill);
  font-family: var(--font-titre);
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
}

.v3-badge--or { background: var(--color-or); color: var(--text); }
.v3-badge--vert { background: var(--color-vert-eau); color: var(--text); }
.v3-badge--rose { background: var(--color-rose); color: var(--text); }
.v3-badge--marine { background: var(--accent-primary); color: var(--accent-primary-contrast); }

/* ============ Hero accueil ============ */
.v3-home-hero {
  position: relative;
  padding: var(--space-lg) var(--space-md) var(--space-xl);
  background: linear-gradient(180deg, var(--surface-alt) 0%, var(--surface) 100%);
  overflow: hidden;
}

.v3-home-hero__inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: var(--space-lg);
  align-items: center;
}

@media (max-width: 900px) {
  .v3-home-hero__inner { grid-template-columns: 1fr; }
}

.v3-home-hero__kicker {
  font-family: var(--font-decoratif);
  font-size: 1.5rem;
  color: var(--accent-secondary);
  display: block;
  margin-bottom: var(--space-xs);
  transform: rotate(-2deg);
}

.v3-home-hero__title {
  font-size: clamp(2.1rem, 4vw, 3.2rem);
  line-height: 1.1;
  margin-bottom: var(--space-sm);
}

.v3-home-hero__lead {
  font-size: 1.1rem;
  color: var(--text-muted);
  line-height: 1.6;
  margin-bottom: var(--space-md);
  max-width: 42ch;
}

.v3-home-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.v3-home-hero__visual {
  position: relative;
}

.v3-home-hero__photo-main {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-lg);
  box-shadow: 0 24px 48px -16px rgba(12, 25, 175, 0.25);
  transform: rotate(-1.5deg);
}

.v3-home-hero__photo-tape {
  position: absolute;
  top: -18px;
  left: 20%;
  width: 90px;
  height: 28px;
  background: var(--color-or);
  opacity: 0.85;
  transform: rotate(-6deg);
  border-radius: 2px;
}

.v3-home-hero__photo-small {
  position: absolute;
  bottom: -32px;
  right: -18px;
  width: 42%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: var(--radius-md);
  border: 6px solid var(--surface);
  box-shadow: 0 16px 32px -12px rgba(0, 0, 0, 0.25);
  transform: rotate(4deg);
}

/* ============ Chiffres clés / réassurance ============ */
.v3-home-reassurance {
  padding: var(--space-lg) var(--space-md);
  max-width: 1280px;
  margin: 0 auto;
}

.v3-home-reassurance__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-sm);
}

@media (max-width: 900px) {
  .v3-home-reassurance__grid { grid-template-columns: repeat(2, 1fr); }
}

.v3-home-reassurance__item {
  background: var(--surface-alt);
  border-radius: var(--radius-md);
  padding: var(--space-sm);
  text-align: center;
}

.v3-home-reassurance__number {
  font-family: var(--font-titre);
  font-weight: 700;
  font-size: 2rem;
  color: var(--accent-primary);
}

.v3-home-reassurance__label {
  font-size: 0.85rem;
  color: var(--text-muted);
}

/* ============ Cartes scrapbook (superposées) ============ */
.v3-card-scrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: 0 12px 28px -14px rgba(34, 34, 34, 0.18);
}

.v3-card-scrap--rot-left { transform: rotate(-1.2deg); }
.v3-card-scrap--rot-right { transform: rotate(1.2deg); }

.v3-card-scrap__media {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.v3-card-scrap__body {
  padding: var(--space-sm);
}

.v3-card-scrap__title {
  font-size: 1.1rem;
  margin-bottom: 0.4rem;
}

.v3-card-scrap__text {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.5;
}

/* ============ Section générique ============ */
.v3-section {
  padding: var(--space-xl) var(--space-md);
  max-width: 1280px;
  margin: 0 auto;
}

.v3-section__kicker {
  font-family: var(--font-decoratif);
  font-size: 1.3rem;
  color: var(--accent-secondary);
  transform: rotate(-1.5deg);
  display: inline-block;
  margin-bottom: 0.5rem;
}

.v3-section__title {
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  margin-bottom: var(--space-sm);
}

/* ============ Actualités (accueil + hub) ============ */
.v3-home-actualites {
  background: var(--surface-alt);
  padding: var(--space-xl) var(--space-md);
}

.v3-home-actualites__inner {
  max-width: 1280px;
  margin: 0 auto;
}

.v3-home-actualites__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-sm);
  margin-top: var(--space-md);
}

@media (max-width: 1000px) {
  .v3-home-actualites__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .v3-home-actualites__grid { grid-template-columns: 1fr; }
}

.v3-home-actualites__card {
  background: var(--surface);
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--border);
}

.v3-home-actualites__card:nth-child(2) { transform: rotate(0.8deg); }
.v3-home-actualites__card:nth-child(3) { transform: rotate(-0.6deg); }

.v3-home-actualites__img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.v3-home-actualites__body {
  padding: var(--space-sm);
}

.v3-home-actualites__date {
  font-size: 0.75rem;
  color: var(--text-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.v3-home-actualites__title {
  font-size: 1rem;
  margin: 0.4rem 0;
}

.v3-home-actualites__excerpt {
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.5;
}

/* ============ Footer ============ */
.v3-home-footer {
  background: var(--accent-primary);
  color: var(--accent-primary-contrast);
  padding: var(--space-xl) var(--space-md) var(--space-md);
}

.v3-home-footer__inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: var(--space-md);
}

@media (max-width: 900px) {
  .v3-home-footer__inner { grid-template-columns: 1fr 1fr; }
}

.v3-home-footer__title {
  font-family: var(--font-titre);
  font-weight: 700;
  font-size: 0.95rem;
  margin-bottom: var(--space-xs);
  color: var(--accent-primary-contrast);
}

.v3-home-footer__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.v3-home-footer__link {
  color: var(--accent-primary-contrast);
  opacity: 0.9;
  text-decoration: none;
  font-size: 0.9rem;
  min-height: var(--touch-target-min);
  display: inline-flex;
  align-items: center;
}

.v3-home-footer__link:hover {
  opacity: 1;
  text-decoration: underline;
}

.v3-home-footer__bottom {
  max-width: 1280px;
  margin: var(--space-md) auto 0;
  padding-top: var(--space-sm);
  border-top: 1px solid rgba(255, 255, 255, 0.25);
  font-size: 0.8rem;
  opacity: 0.85;
}

/* ============ Fil d'Ariane ============ */
.v3-breadcrumb {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.v3-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-md);
  list-style: none;
  font-size: 0.875rem;
  line-height: 1.2;
  color: var(--text);
}
.v3-breadcrumb__list li { display: flex; align-items: center; }
.v3-breadcrumb__list li + li::before {
  content: "";
  width: 6px; height: 6px;
  margin: 0 0.6rem;
  border-top: 1.5px solid #6b6963;
  border-right: 1.5px solid #6b6963;
  transform: rotate(45deg);
}
.v3-breadcrumb a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--accent-primary);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
  transition: text-decoration-color 0.2s;
}
.v3-breadcrumb a:hover,
.v3-breadcrumb a:focus-visible { text-decoration-color: var(--color-or); }
.v3-breadcrumb a:focus-visible { outline: 2px solid var(--accent-primary); outline-offset: 2px; border-radius: 4px; }
.v3-breadcrumb [aria-current="page"] { font-weight: 600; color: var(--text); }
@media (max-width: 700px) {
  .v3-breadcrumb__list { padding: 0 var(--space-sm); }
}

/* ============ Page projet éducatif ============ */
.v3-projet-educatif-hero {
  padding: var(--space-lg) var(--space-md);
  max-width: 900px;
  margin: 0 auto;
  text-align: left;
}

.v3-projet-educatif-hero__title {
  font-size: clamp(2rem, 4vw, 2.8rem);
  margin-bottom: var(--space-sm);
}

.v3-projet-educatif-pilier {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: var(--space-sm);
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--border);
}

.v3-projet-educatif-pilier__icon {
  width: 72px;
  height: 72px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
}

.v3-projet-educatif-pilier__title {
  font-size: 1.15rem;
  margin-bottom: 0.3rem;
}

.v3-projet-educatif-pilier__text {
  font-size: 0.95rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ============ Page classe ============ */
.v3-classes-hero {
  padding: var(--space-lg) var(--space-md);
  background: var(--surface-alt);
}

.v3-classes-hero__inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-lg);
  align-items: center;
}

@media (max-width: 900px) {
  .v3-classes-hero__inner { grid-template-columns: 1fr; }
}

.v3-classes-hero__photo {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-lg);
  transform: rotate(1.2deg);
  box-shadow: 0 20px 40px -16px rgba(59, 195, 164, 0.35);
}

.v3-classes-infos {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-sm);
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-md) var(--space-lg);
}

@media (max-width: 700px) {
  .v3-classes-infos { grid-template-columns: 1fr; }
}

.v3-classes-infos__card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: var(--space-sm);
}

.v3-classes-infos__label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  font-weight: 600;
}

.v3-classes-infos__value {
  font-family: var(--font-titre);
  font-size: 1.2rem;
  margin-top: 0.3rem;
}

.v3-classes-maillage {
  background: var(--color-vert-eau);
  border-radius: var(--radius-lg);
  padding: var(--space-md);
  max-width: 1280px;
  margin: 0 auto var(--space-xl);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
}

.v3-classes-maillage__text {
  font-family: var(--font-titre);
  font-weight: 600;
  color: var(--text);
}

/* ============ Inscriptions - étapes ============ */
.v3-inscriptions-hero {
  padding: var(--space-lg) var(--space-md);
  background: linear-gradient(135deg, var(--color-rose) 0%, var(--surface) 60%);
}

.v3-inscriptions-hero__inner {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.v3-inscriptions-form {
  max-width: 760px;
  margin: 0 auto;
  padding: var(--space-lg) var(--space-md);
}

.v3-inscriptions-form__steps {
  display: flex;
  justify-content: space-between;
  margin-bottom: var(--space-md);
  gap: 0.25rem;
}

.v3-inscriptions-form__step {
  flex: 1;
  text-align: center;
  font-size: 0.75rem;
  color: var(--text-muted);
  position: relative;
}

.v3-inscriptions-form__step-num {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-pill);
  background: var(--surface-alt);
  border: 2px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 0.4rem;
  font-family: var(--font-titre);
  font-weight: 700;
  color: var(--text-muted);
}

.v3-inscriptions-form__step--active .v3-inscriptions-form__step-num {
  background: var(--accent-secondary);
  border-color: var(--accent-secondary);
  color: var(--accent-secondary-contrast);
}

.v3-inscriptions-form__step--active {
  color: var(--text);
  font-weight: 600;
}

.v3-inscriptions-form__panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: var(--space-md);
  box-shadow: 0 16px 36px -18px rgba(12, 25, 175, 0.2);
}

.v3-inscriptions-form__panel-title {
  font-size: 1.25rem;
  margin-bottom: var(--space-xs);
}

.v3-inscriptions-form__field {
  margin-bottom: var(--space-sm);
}

.v3-inscriptions-form__label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 0.35rem;
}

.v3-inscriptions-form__input,
.v3-inscriptions-form__select {
  width: 100%;
  min-height: var(--touch-target-min);
  padding: 0.6rem 0.9rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  font-family: var(--font-corps);
  font-size: 0.95rem;
  background: var(--surface-alt);
}

.v3-inscriptions-form__upload {
  border: 2px dashed var(--border);
  border-radius: var(--radius-md);
  padding: var(--space-md);
  text-align: center;
  color: var(--text-muted);
  font-size: 0.9rem;
}

.v3-inscriptions-form__signature {
  border: 2px dashed var(--accent-primary);
  border-radius: var(--radius-md);
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  font-family: var(--font-decoratif);
  font-size: 1.2rem;
  background: var(--surface-alt);
}

.v3-inscriptions-form__nav {
  display: flex;
  justify-content: space-between;
  margin-top: var(--space-md);
}

/* ============ Actualités hub ============ */
.v3-actualites-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-sm);
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-md) var(--space-xl);
}

@media (max-width: 900px) {
  .v3-actualites-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .v3-actualites-grid { grid-template-columns: 1fr; }
}

.v3-actualites-grid__card:nth-child(3n+2) { transform: rotate(0.7deg); }
.v3-actualites-grid__card:nth-child(3n+3) { transform: rotate(-0.7deg); }

.v3-actualites-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  max-width: 1280px;
  margin: 0 auto;
  padding: var(--space-sm) var(--space-md);
}

/* ============ Espace parents login ============ */
.v3-parents-login {
  min-height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-lg) var(--space-md);
  background: var(--surface-alt);
}

.v3-parents-login__card {
  width: 100%;
  max-width: 440px;
  background: var(--surface);
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  padding: var(--space-lg) var(--space-md);
  box-shadow: 0 20px 44px -20px rgba(12, 25, 175, 0.25);
  text-align: center;
}

.v3-parents-login__logo {
  height: 56px;
  margin: 0 auto var(--space-sm);
}

.v3-parents-login__title {
  font-size: 1.4rem;
  margin-bottom: 0.4rem;
}

.v3-parents-login__lead {
  font-size: 0.9rem;
  color: var(--text-muted);
  margin-bottom: var(--space-md);
}

.v3-parents-login__field {
  text-align: left;
  margin-bottom: var(--space-sm);
}

.v3-parents-login__rgpd {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  font-size: 0.78rem;
  color: var(--text-muted);
  text-align: left;
  margin: var(--space-sm) 0;
  padding: var(--space-xs);
  background: var(--surface-alt);
  border-radius: var(--radius-sm);
}

.v3-parents-login__submit {
  width: 100%;
}

.v3-parents-login__help {
  margin-top: var(--space-sm);
  font-size: 0.85rem;
}

/* ============ Espace parents interne ============ */
.v3-parents-interne {
  min-height: 70vh;
}

.v3-parents-interne__topbar {
  background: var(--surface-alt);
  border-bottom: 1px solid var(--border);
  padding: var(--space-sm) var(--space-md);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.v3-parents-interne__scope {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-titre);
  font-weight: 600;
}

.v3-parents-interne__main {
  max-width: 1280px;
  margin: 0 auto;
  padding: var(--space-md);
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: var(--space-md);
}

@media (max-width: 900px) {
  .v3-parents-interne__main { grid-template-columns: 1fr; }
}

.v3-parents-interne__sidebar {
  background: var(--surface-alt);
  border-radius: var(--radius-md);
  padding: var(--space-sm);
  height: fit-content;
}

.v3-parents-interne__sidebar-link {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: var(--touch-target-min);
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-sm);
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
  color: var(--text);
}

.v3-parents-interne__sidebar-link--active {
  background: var(--accent-primary);
  color: var(--accent-primary-contrast);
}

.v3-parents-interne__addbar {
  background: var(--color-or);
  border-radius: var(--radius-md);
  padding: var(--space-sm) var(--space-md);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}

.v3-parents-interne__addbar-text {
  font-family: var(--font-titre);
  font-weight: 600;
  color: var(--text);
}

.v3-parents-interne__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-xs);
}

@media (max-width: 700px) {
  .v3-parents-interne__grid { grid-template-columns: repeat(2, 1fr); }
}

.v3-parents-interne__photo {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: var(--radius-sm);
}

.v3-parents-interne__doc-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-xs) var(--space-sm);
  background: var(--surface-alt);
  border-radius: var(--radius-sm);
  margin-bottom: 0.5rem;
}

/* ============ FAQ accordéon ============ */
.v3-faq-item {
  border-bottom: 1px solid var(--border);
}

.v3-faq-item__trigger {
  width: 100%;
  text-align: left;
  min-height: var(--touch-target-min);
  padding: var(--space-sm) 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--font-titre);
  font-weight: 600;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  color: var(--text);
}

.v3-faq-item__panel {
  padding-bottom: var(--space-sm);
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ============ Skip link accessibilité ============ */
.v3-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--accent-primary);
  color: var(--accent-primary-contrast);
  padding: 0.75rem 1rem;
  z-index: 100;
  border-radius: 0 0 var(--radius-sm) 0;
}

.v3-skip-link:focus {
  left: 0;
}

/* ============ Animations (complément de js/animations.js) ============ */

/* Cartes : se redressent et se soulèvent au survol */
.v3-card-scrap,
.v3-home-actualites__card,
.v3-actualites-grid__card {
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.35s ease;
}

.v3-card-scrap:hover,
.v3-home-actualites__card:hover,
.v3-actualites-grid__card:hover {
  transform: rotate(0deg) translateY(-6px);
  box-shadow: 0 24px 40px -16px rgba(34, 34, 34, 0.3);
}

/* Photos : zoom lent dans le cadre au survol de la carte */
.v3-card-scrap__media,
.v3-home-actualites__img,
.v3-actualites-grid__card img {
  transition: transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.v3-card-scrap:hover .v3-card-scrap__media,
.v3-home-actualites__card:hover .v3-home-actualites__img,
.v3-actualites-grid__card:hover img {
  transform: scale(1.06);
}

/* Soulignement « feutre » sous les titres de section (--ul piloté par GSAP, 1 par défaut) */
.v3-section__title::after {
  content: '';
  display: block;
  width: min(140px, 40%);
  height: 6px;
  margin-top: 0.4rem;
  background: var(--color-or);
  border-radius: 6px;
  transform-origin: left center;
  transform: rotate(-0.8deg) scaleX(var(--ul, 1));
}

/* reduced motion : garde-fou CSS en complément de la vérification JS */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============ Animations (animations.js) : éléments décoratifs injectés ============ */
.v3-fx-word { display: inline-block; will-change: transform; }

.v3-fx-shapes { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.v3-home-hero__inner { position: relative; z-index: 1; }
.v3-fx-shape { position: absolute; display: block; opacity: 0.55; }
.v3-fx-shape svg { width: 100%; height: 100%; fill: currentColor; stroke: currentColor; display: block; }

.v3-fx-marquee {
  overflow: hidden;
  margin: var(--space-sm) 0;
  border-block: 2px dashed var(--border);
  padding-block: 0.6rem;
}
.v3-fx-marquee__track { display: flex; width: max-content; }
.v3-fx-marquee__item {
  font-family: var(--font-titre);
  font-weight: 700;
  font-size: 1.15rem;
  padding-inline: 1.25rem;
  white-space: nowrap;
}
.v3-fx-marquee__item::after { content: "\2726"; margin-left: 2.5rem; opacity: 0.6; }

.v3-fx-parentbar { display: none; }
@media (max-width: 768px) {
  .v3-fx-parentbar {
    display: flex;
    position: fixed;
    inset: auto 0 0 0;
    z-index: 60;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem calc(0.5rem + env(safe-area-inset-bottom, 0px));
    background: var(--surface);
    border-top: 1px solid var(--border);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
  }
  .v3-fx-parentbar__link {
    flex: 1;
    min-height: var(--touch-target-min);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-pill);
    background: var(--accent-primary);
    color: #fff;
    font-family: var(--font-titre);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
  }
  .v3-fx-parentbar__link--alt { background: var(--color-orange); color: #222; }
  body.v3-has-parentbar { padding-bottom: 4.5rem; }
}

/* Correctifs mobiles (sans toucher au HTML) : grille des piliers inline à 3 colonnes, CTA du header */
@media (max-width: 768px) {
  .v3-section > div[style*="repeat(3"] { grid-template-columns: 1fr !important; }
  .v3-home-header__cta { display: none; }
}

/* ============================================================
   Couche couleur — sections pleine largeur teintées, héros marine,
   cartes colorées. Aucune classe HTML modifiée.
   Contrastes : texte #222 sur teintes pastel et sur or/vert/rose ;
   blanc sur marine/magenta uniquement.
   ============================================================ */

/* Aplat pleine largeur derrière une section contenue (max-width 1280) */
.v3-section,
.v3-classes-infos {
  --bleed: transparent;
  box-shadow: 0 0 0 100vmax var(--bleed);
  clip-path: inset(0 -100vmax);
  background: var(--bleed);
}
main > .v3-section:nth-of-type(4n+1) { --bleed: var(--tint-or); }
main > .v3-section:nth-of-type(4n+2) { --bleed: var(--tint-vert); }
main > .v3-section:nth-of-type(4n+3) { --bleed: var(--tint-rose); }
main > .v3-section:nth-of-type(4n)   { --bleed: var(--tint-marine); }

/* Héros accueil : bleu marine, comme le site actuel */
.v3-home-hero {
  background:
    radial-gradient(circle at 12% 20%, rgba(255, 92, 36, 0.28) 0, transparent 38%),
    radial-gradient(circle at 92% 85%, rgba(194, 45, 143, 0.40) 0, transparent 42%),
    var(--color-bleu-marine);
  color: #fff;
}
.v3-home-hero__title { color: #fff; }
.v3-home-hero__lead { color: rgba(255, 255, 255, 0.92); }
.v3-home-hero__kicker { color: var(--color-or); }
.v3-home-hero .v3-btn-pill--primary { background: var(--color-or); color: var(--text); }
.v3-home-hero .v3-btn-pill--outline { background: transparent; color: #fff; border-color: #fff; }
.v3-home-hero__photo-small { border-color: var(--color-rose); }
.v3-home-hero__photo-main { box-shadow: 0 24px 48px -16px rgba(0, 0, 0, 0.45); }

/* Chiffres clés : quatre aplats vifs */
.v3-home-reassurance { max-width: none; background: var(--surface); }
.v3-home-reassurance__grid { max-width: 1280px; margin: 0 auto; }
.v3-home-reassurance__item { color: var(--text); }
.v3-home-reassurance__item:nth-child(1) { background: var(--color-or); }
.v3-home-reassurance__item:nth-child(2) { background: var(--color-vert-eau); }
.v3-home-reassurance__item:nth-child(3) { background: var(--color-rose); }
.v3-home-reassurance__item:nth-child(4) { background: var(--color-orange); }
.v3-home-reassurance__item:nth-child(4),
.v3-home-reassurance__item:nth-child(4) .v3-home-reassurance__number,
.v3-home-reassurance__item:nth-child(4) .v3-home-reassurance__label { color: var(--text); }
.v3-home-reassurance__number { color: var(--text); font-size: 2.2rem; }
.v3-home-reassurance__label { color: var(--text); opacity: 0.85; font-weight: 600; }

/* Actualités : fond marine clair, cartes à liseré coloré */
.v3-home-actualites { background: var(--tint-marine); }
.v3-home-actualites__card { border: 0; border-top: 6px solid var(--color-rose); }
.v3-home-actualites__card:nth-child(4n+1) { border-top-color: var(--color-or); }
.v3-home-actualites__card:nth-child(4n+2) { border-top-color: var(--color-vert-eau); }
.v3-home-actualites__card:nth-child(4n+3) { border-top-color: var(--color-orange); }
.v3-home-actualites__card:nth-child(4n)   { border-top-color: var(--color-magenta); }

/* Cartes scrapbook : liseré de couleur tournant */
.v3-card-scrap { border: 0; border-top: 8px solid var(--color-or); }
.v3-card-scrap:nth-child(3n+2) { border-top-color: var(--color-vert-eau); }
.v3-card-scrap:nth-child(3n)   { border-top-color: var(--color-magenta); }
.v3-card-scrap__title { color: var(--accent-primary); }

/* Pages internes : bandeaux de titre colorés */
.v3-projet-educatif-hero {
  max-width: none;
  background: linear-gradient(135deg, var(--tint-or) 0%, var(--tint-rose) 100%);
  padding-left: max(var(--space-md), calc((100vw - 900px) / 2));
  padding-right: max(var(--space-md), calc((100vw - 900px) / 2));
}
.v3-classes-hero { background: var(--color-vert-eau); }
.v3-classes-hero p { color: var(--text) !important; }
.v3-classes-hero .v3-section__kicker { color: var(--color-bleu-marine); }
.v3-classes-hero .v3-btn-pill--primary { background: var(--color-bleu-marine); }
.v3-classes-hero__photo { box-shadow: 0 20px 40px -16px rgba(12, 25, 175, 0.4); border: 6px solid #fff; }
.v3-inscriptions-hero { background: linear-gradient(135deg, var(--color-rose) 0%, var(--color-or) 100%); }

/* Infos pratiques : cartes colorées */
.v3-classes-infos { max-width: none; }
.v3-classes-infos__card { border: 0; }
.v3-classes-infos__card:nth-child(3n+1) { background: var(--tint-or); }
.v3-classes-infos__card:nth-child(3n+2) { background: var(--tint-rose); }
.v3-classes-infos__card:nth-child(3n)   { background: var(--tint-vert); }
.v3-classes-infos__label { color: var(--text); opacity: 0.75; }

/* Piliers : fond blanc arrondi sur les aplats, pastille plus grande */
.v3-projet-educatif-pilier { border-bottom-color: rgba(34, 34, 34, 0.12); }
.v3-projet-educatif-pilier__icon { box-shadow: 4px 4px 0 rgba(34, 34, 34, 0.12); }
.v3-projet-educatif-pilier__text { color: var(--text); }

/* Fil d'Ariane et FAQ */
.v3-faq-item { border-bottom-color: rgba(34, 34, 34, 0.15); }
.v3-faq-item__panel { color: var(--text); }

@media (max-width: 700px) {
  .v3-projet-educatif-hero { padding-left: var(--space-md); padding-right: var(--space-md); }
}

/* Ajustements couche couleur */
.v3-classes-infos { padding-top: var(--space-md); }
.v3-classes-maillage { max-width: calc(1280px - 2 * var(--space-md)); margin-left: auto; margin-right: auto; }
@media (max-width: 1344px) { .v3-classes-maillage { margin-left: var(--space-md); margin-right: var(--space-md); max-width: none; } }
main > .v3-section p { color: var(--text); }
.v3-classes-hero .v3-section__kicker { color: #07107a; }

/* ============================================================
   Identité d'origine : taches (pictos), crayons, logo
   Fichiers : assets/identite/ (repris du site actuel)
   ============================================================ */
.v3-home-hero { padding-bottom: calc(var(--space-md) + 15vw); }
.v3-home-hero__inner { position: relative; z-index: 1; }
.v3-home-hero::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  aspect-ratio: 2590 / 653;
  background: url("../assets/identite/pencils-1.png") center bottom / 100% 100% no-repeat;
  pointer-events: none;
}
.v3-home-hero::before {
  content: "";
  position: absolute;
  top: 28px; right: 3%;
  width: clamp(60px, 9vw, 130px);
  aspect-ratio: 879 / 817;
  background: url("../assets/identite/picto-1.svg") center / contain no-repeat;
  opacity: 0.22;
  transform: rotate(14deg);
  pointer-events: none;
}

/* Taches décoratives dans les sections */
.v3-section { position: relative; }
.v3-section::before,
.v3-section::after {
  content: "";
  position: absolute;
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 0;
}
.v3-section::before { top: 1.5rem; right: 2rem; width: 84px; height: 92px; background-image: url("../assets/identite/picto-5.svg"); transform: rotate(8deg); }
.v3-section::after  { bottom: 1.2rem; right: 3rem; width: 96px; height: 90px; background-image: url("../assets/identite/picto-3.svg"); transform: rotate(-6deg); opacity: 0.9; }
main > .v3-section:nth-of-type(even)::before { background-image: url("../assets/identite/picto-2.svg"); width: 80px; height: 86px; }
main > .v3-section:nth-of-type(even)::after  { background-image: url("../assets/identite/picto-6.svg"); width: 44px; height: 80px; }
.v3-section > * { position: relative; z-index: 1; }

.v3-classes-hero, .v3-inscriptions-hero, .v3-projet-educatif-hero { position: relative; overflow: hidden; }
.v3-classes-hero::after, .v3-inscriptions-hero::after, .v3-projet-educatif-hero::after {
  content: ""; position: absolute; pointer-events: none;
  right: 4%; bottom: -18px; width: 150px; height: 120px;
  background: url("../assets/identite/picto-3.svg") center / contain no-repeat;
  transform: rotate(-8deg);
}
.v3-projet-educatif-hero::after { background-image: url("../assets/identite/picto-6.svg"); width: 70px; height: 120px; bottom: auto; top: 24px; }
.v3-inscriptions-hero::after { background-image: url("../assets/identite/picto-1.svg"); opacity: 0.6; }
.v3-classes-hero__inner, .v3-inscriptions-hero__inner { position: relative; z-index: 1; }
.v3-projet-educatif-hero > * { position: relative; z-index: 1; }

/* Logo officiel (version texte blanc) dans le pied de page */
.v3-home-footer__inner > div:first-child::before {
  content: "";
  display: block;
  width: 100%; max-width: 230px; height: 100px;
  margin-bottom: var(--space-sm);
  background: url("../assets/identite/Logo-ESA.svg") left center / contain no-repeat;
}
.v3-home-footer__inner > div:first-child .v3-home-footer__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

@media (max-width: 700px) {
  .v3-home-footer__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .v3-section::before, .v3-section::after { opacity: 0.35; width: 52px; height: 56px; }
  main > .v3-section:nth-of-type(even)::after { width: 28px; height: 52px; }
  .v3-classes-hero::after, .v3-inscriptions-hero::after, .v3-projet-educatif-hero::after { opacity: 0.5; width: 90px; }
}
@media (prefers-reduced-motion: no-preference) {
  .v3-section::before { animation: v3-blob 9s ease-in-out infinite alternate; }
  .v3-section::after { animation: v3-blob 11s ease-in-out infinite alternate-reverse; }
}
@keyframes v3-blob { from { translate: 0 0; } to { translate: 0 -10px; } }

/* ============================================================
   Sobriété : moins d'aplats, palette resserrée (marine + or + rose).
   Fond blanc dominant, une seule teinte claire en alternance.
   ============================================================ */
main > .v3-section:nth-of-type(odd)  { --bleed: transparent; }
main > .v3-section:nth-of-type(even) { --bleed: var(--tint-marine); }
.v3-home-actualites { background: var(--tint-marine); }

.v3-home-hero {
  background:
    radial-gradient(circle at 90% 85%, rgba(251, 196, 0, 0.12) 0, transparent 40%),
    var(--color-bleu-marine);
}

/* Chiffres clés : tuiles blanches, filet coloré, chiffre en marine */
.v3-home-reassurance__item,
.v3-home-reassurance__item:nth-child(n) {
  background: #fff;
  border: 1px solid rgba(12, 25, 175, 0.12);
  border-top: 6px solid var(--color-or);
}
.v3-home-reassurance__item:nth-child(even) { border-top-color: var(--color-rose); }
.v3-home-reassurance__number,
.v3-home-reassurance__item:nth-child(4) .v3-home-reassurance__number { color: var(--color-bleu-marine); }

/* Cartes : filet or / rose uniquement */
.v3-home-actualites__card:nth-child(n),
.v3-card-scrap:nth-child(n) { border-top-color: var(--color-or); }
.v3-home-actualites__card:nth-child(even),
.v3-card-scrap:nth-child(even) { border-top-color: var(--color-rose); }

/* Héros internes : teinte claire unique, plus de vert / dégradé rose-or */
.v3-projet-educatif-hero,
.v3-classes-hero,
.v3-inscriptions-hero { background: var(--tint-marine); }
.v3-classes-hero .v3-section__kicker { color: var(--color-bleu-marine); }
.v3-classes-hero__photo { border-color: #fff; }

/* Infos pratiques : cartes blanches à filet */
.v3-classes-infos__card:nth-child(n) {
  background: #fff;
  border: 1px solid rgba(12, 25, 175, 0.12);
  border-left: 6px solid var(--color-or);
}
.v3-classes-infos__card:nth-child(even) { border-left-color: var(--color-rose); }

/* Taches : plus discrètes, seulement le pictogramme du coin haut */
.v3-section::after { display: none; }
.v3-section::before { opacity: 0.55; }

/* Contraste : texte du bandeau CTA marine (inline) = blanc */
.v3-section > div[style*="--accent-primary"] :is(h2, p) { color: var(--accent-primary-contrast); }

/* Cartes : bordure complète 1px + pastille de couleur (plus de liseré latéral) */
.v3-home-reassurance__item:nth-child(n),
.v3-home-actualites__card:nth-child(n),
.v3-card-scrap:nth-child(n),
.v3-classes-infos__card:nth-child(n) {
  --dot: var(--color-or);
  border: 1px solid var(--border);
  background-color: #fff;
  background-image: radial-gradient(circle at 18px 18px, var(--dot) 0 6px, transparent 6.5px);
  background-repeat: no-repeat;
}
.v3-home-reassurance__item:nth-child(even),
.v3-home-actualites__card:nth-child(even),
.v3-card-scrap:nth-child(even),
.v3-classes-infos__card:nth-child(even) { --dot: var(--color-rose); }
.v3-home-reassurance__item:nth-child(n),
.v3-classes-infos__card:nth-child(n) { padding-top: calc(var(--space-md) + 14px); }

/* Bande maillage : fond blanc, filet 1px et pastille (sobriété) */
.v3-classes-maillage{background:#fff;border:1px solid var(--border);background-image:radial-gradient(circle at 18px 18px,var(--color-or) 0 6px,transparent 6.5px);background-repeat:no-repeat;box-shadow:none;color:var(--text)}
.v3-classes-maillage__text,.v3-classes-maillage :is(h2,h3,p){color:var(--text)}
.v3-classes-maillage{padding-left:calc(var(--space-md) + 22px)}

/* ============ Sections APEL / OGEC ============ */
.v3-sous-nav{border-bottom:1px solid var(--border);background:#fff}
.v3-sous-nav__inner{max-width:1280px;margin:0 auto;padding:0 var(--space-md);display:flex;align-items:center;gap:.25rem;overflow-x:auto;scrollbar-width:thin}
.v3-sous-nav__label{font-family:var(--font-titre);font-weight:700;color:var(--accent-primary);padding:0 .75rem 0 0;margin-right:.5rem;border-right:1px solid var(--border);white-space:nowrap}
.v3-sous-nav__link{display:inline-flex;align-items:center;min-height:44px;padding:0 .75rem;font-size:.9rem;color:var(--text);white-space:nowrap;border-bottom:2px solid transparent}
.v3-sous-nav__link:hover{color:var(--accent-primary)}
.v3-sous-nav__link[aria-current="page"]{color:var(--accent-primary);font-weight:700;border-bottom-color:var(--color-or)}
.v3-sous-nav__link:focus-visible{outline:2px solid var(--accent-primary);outline-offset:-2px}

.v3-agenda{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-sm)}
.v3-agenda__item{display:grid;grid-template-columns:72px 1fr;gap:var(--space-sm);align-items:start;padding:var(--space-sm);background:#fff;border:1px solid var(--border);border-radius:var(--radius-md)}
.v3-agenda__date{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:72px;border-radius:var(--radius-sm);background:var(--tint-marine);color:var(--accent-primary)}
.v3-agenda__day{font-family:var(--font-titre);font-weight:700;font-size:1.25rem;line-height:1}
.v3-agenda__month{font-size:.8rem;text-transform:lowercase;color:var(--text)}
.v3-agenda__title{font-family:var(--font-titre);font-size:1.05rem;margin:0 0 .25rem;color:var(--text)}
.v3-agenda__text{margin:0;color:var(--text-muted);line-height:1.6;font-size:.95rem}

.v3-bureau{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-sm)}
.v3-bureau__card{display:flex;flex-direction:column;gap:.25rem;padding:var(--space-sm);background:#fff;border:1px solid var(--border);border-radius:var(--radius-md)}
.v3-bureau__role{font-family:var(--font-titre);font-weight:700;color:var(--accent-primary)}
.v3-bureau__name{color:var(--text);font-weight:600}
.v3-bureau__mission{color:var(--text-muted);font-size:.9rem;line-height:1.55}

.v3-faq{border-bottom:1px solid var(--border);padding:.25rem 0}
.v3-faq summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-family:var(--font-titre);font-weight:600;color:var(--text)}
.v3-faq summary:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}
.v3-faq p{margin:0 0 var(--space-sm);color:var(--text-muted);line-height:1.65}

.v3-social-feed{padding:var(--space-md);background:#fff;border:1px dashed var(--text-muted);border-radius:var(--radius-md);color:var(--text)}
.v3-social-feed p{margin:0 0 .25rem}
.v3-note-flux{margin-top:var(--space-sm);font-size:.9rem;color:var(--text-muted)}
.v3-note-flux a{text-decoration:underline;color:var(--accent-primary)}

@media (max-width:480px){.v3-agenda__item{grid-template-columns:60px 1fr}}


/* ============================================================
   Header v2 : menu réduit, méga-menu au survol, menu mobile accordéon,
   sous-navigation APEL / OGEC identique et sticky.
   ============================================================ */
[x-cloak] { display: none !important; }
:root { --header-h: 76px; }
.v3-home-header__bar { gap: var(--space-sm); padding-block: .5rem; min-height: 72px; }
.v3-home-header__logo { flex-shrink: 0; }
.v3-home-header__logo img { height: 52px; width: auto; }
.v3-home-header__nav { flex: 1; justify-content: center; align-self: stretch; gap: 0; }
.v3-home-header__nav-item { display: flex; align-items: center; }
.v3-home-header__nav-trigger { padding: .5rem .7rem; white-space: nowrap; text-decoration: none; }
.v3-home-header__nav-trigger.is-current { color: var(--accent-primary); box-shadow: inset 0 -3px 0 var(--color-or); border-radius: 0; }
.v3-home-header__chev { transition: transform .15s ease; flex-shrink: 0; }
.v3-home-header__nav-trigger[aria-expanded="true"] .v3-home-header__chev { transform: rotate(180deg); }
.v3-home-header__nav-trigger:focus-visible { outline: 2px solid var(--accent-primary); outline-offset: -2px; }
/* méga-menu collé à la barre : aucun trou entre le déclencheur et le panneau, le survol reste continu */
.v3-home-header__mega { top: 100%; margin-top: 0; z-index: 60; }
.v3-home-header__nav-item--end .v3-home-header__mega { left: auto; right: 0; }
.v3-home-header__actions { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.v3-home-header__espace { gap: .4rem; white-space: nowrap; }
.v3-home-header__cta { white-space: nowrap; }
@media (max-width: 1280px) and (min-width: 1101px) {
  .v3-home-header__espace { padding-inline: .8rem; }
  .v3-home-header__nav-trigger { padding-inline: .5rem; font-size: .9rem; }
}
@media (max-width: 1100px) {
  .v3-home-header__actions { display: none; }
  .v3-home-header__bar { justify-content: space-between; padding-inline: var(--space-sm); min-height: 64px; }
  :root { --header-h: 68px; }
}

/* Menu mobile : panneau plein écran sous le header, accordéons, actions en pied */
body.v3-nav-locked { overflow: hidden; }
.v3-mnav { display: none; }
@media (max-width: 1100px) {
  .v3-mnav {
    display: flex; flex-direction: column;
    position: fixed; inset: var(--header-h) 0 0 0; z-index: 70;
    background: #fff; border-top: 1px solid var(--border);
  }
  .v3-mnav[x-cloak], .v3-mnav[style*="display: none"] { display: none; }
  .v3-mnav__scroll { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: .5rem var(--space-sm) 1rem; }
  .v3-mnav__head, .v3-mnav__plain {
    display: flex; align-items: center; justify-content: space-between; width: 100%;
    min-height: 52px; padding: .5rem .25rem; background: none; border: 0;
    border-bottom: 1px solid var(--border);
    font-family: var(--font-titre); font-weight: 600; font-size: 1.05rem; color: var(--text); text-align: left; text-decoration: none;
  }
  .v3-mnav__head[aria-expanded="true"] { color: var(--accent-primary); }
  .v3-mnav__head[aria-expanded="true"] .v3-home-header__chev { transform: rotate(180deg); }
  .v3-mnav__list { list-style: none; margin: 0; padding: .25rem 0 .5rem .75rem; border-bottom: 1px solid var(--border); }
  .v3-mnav__list a { display: flex; align-items: center; min-height: 46px; padding: .25rem .5rem; color: var(--text); text-decoration: none; font-size: .98rem; border-radius: var(--radius-sm); }
  .v3-mnav__list a:hover, .v3-mnav__list a:focus-visible { background: var(--tint-marine); color: var(--accent-primary); }
  .v3-mnav__list a[aria-current="page"], .v3-mnav__plain[aria-current="page"] { color: var(--accent-primary); font-weight: 700; }
  .v3-mnav__actions { display: grid; gap: .5rem; padding: .75rem var(--space-sm) calc(.75rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--border); background: #fff; }
  .v3-mnav__actions .v3-btn-pill { width: 100%; }
}
@media (min-width: 1101px) { .v3-mnav { display: none !important; } }

/* Sous-navigation APEL / OGEC : sticky, identique pour les deux ; déroulant sur mobile */
.v3-sous-nav { position: sticky; top: var(--header-h); z-index: 40; }
.v3-sous-nav__inner { position: relative; overflow: visible; }
.v3-sous-nav__list { display: flex; align-items: center; gap: .25rem; overflow-x: auto; scrollbar-width: thin; }
.v3-sous-nav__toggle { display: none; }
@media (max-width: 860px) {
  .v3-sous-nav__inner { padding: 0 var(--space-sm); }
  .v3-sous-nav__label { border-right: 0; margin-right: 0; padding-right: .5rem; }
  .v3-sous-nav__toggle {
    display: flex; align-items: center; justify-content: space-between; gap: .5rem; flex: 1;
    min-height: 48px; padding: 0 .25rem; background: none; border: 0; cursor: pointer;
    font-family: var(--font-corps); font-size: .95rem; font-weight: 700; color: var(--accent-primary); text-align: left;
  }
  .v3-sous-nav__toggle[aria-expanded="true"] .v3-home-header__chev { transform: rotate(180deg); }
  .v3-sous-nav__list {
    display: none; position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: stretch; gap: 0; overflow: visible;
    background: #fff; border-bottom: 1px solid var(--border); box-shadow: 0 16px 28px -14px rgba(12, 25, 175, .22);
    padding: .25rem var(--space-sm) .5rem;
  }
  .v3-sous-nav__list.is-open { display: flex; }
  .v3-sous-nav__list .v3-sous-nav__link { min-height: 48px; border-bottom: 1px solid var(--border); border-left: 0; white-space: normal; }
  .v3-sous-nav__list .v3-sous-nav__link:last-child { border-bottom: 0; }
  .v3-sous-nav__list .v3-sous-nav__link[aria-current="page"] { border-bottom-color: var(--border); background: var(--tint-marine); }
}
@media (prefers-reduced-motion: reduce) { .v3-home-header__chev { transition: none; } }

/* ===== Espace v3 : enseignants et parents (maquettes « Espace parents — wireframe ») ===== */
.v3-esp { background: var(--surface-alt); font-family: var(--font-corps); color: var(--text); min-height: 100vh; display: flex; flex-direction: column; }
.v3-esp-top { background: var(--surface); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 30; }
.v3-esp-top__bar { max-width: 1100px; margin: 0 auto; padding: 0.6rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.v3-esp-top__brand { display: flex; align-items: center; gap: 0.9rem; text-decoration: none; color: var(--text); }
.v3-esp-top__role { font-family: var(--font-titre); font-weight: 600; font-size: 0.95rem; padding-left: 0.9rem; border-left: 1px solid var(--border); }
.v3-esp-top__user { display: flex; align-items: center; gap: 0.6rem; font-size: 0.9rem; }
.v3-esp-top__avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--color-bleu-marine); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: 0.8rem; }
.v3-esp-top__child { color: var(--text-muted); }
.v3-esp-top__logout, .v3-esp-link { color: var(--color-bleu-marine); text-decoration: underline; text-underline-offset: 3px; }
.v3-esp-top__logout:hover, .v3-esp-link:hover { color: var(--color-magenta); }
.v3-esp-main { width: 100%; max-width: 640px; margin: 0 auto; padding: 2rem 1.25rem 3rem; flex: 1; }
.v3-esp-main--wide { max-width: 860px; }
.v3-esp-main--center { display: flex; flex-direction: column; justify-content: center; }
.v3-esp-title { font-family: var(--font-titre); font-weight: 700; font-size: clamp(1.6rem, 4vw, 2.1rem); line-height: 1.2; color: var(--text); margin: 0.5rem 0 0.4rem; text-wrap: balance; }
.v3-esp-lead { font-size: 1.1rem; color: var(--text-muted); margin: 0 0 1.75rem; }
.v3-esp-center { display: flex; justify-content: center; align-items: center; gap: 0.5rem; text-align: center; }
.v3-esp-hint { font-size: 0.875rem; color: var(--text-muted); line-height: 1.55; margin: 0.6rem 0 0; }
.v3-esp-hint .v3-esp-link { font-weight: 600; }
.v3-esp-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.v3-esp-back { display: inline-flex; align-items: center; gap: 0.4rem; min-height: var(--touch-target-min); color: var(--color-bleu-marine); text-decoration: none; font-weight: 600; font-size: 0.95rem; }
.v3-esp-back:hover { color: var(--color-magenta); }
.v3-esp-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }

/* Connexion */
.v3-esp-login { text-align: center; max-width: 380px; margin: 0 auto; width: 100%; }
.v3-esp-login__kicker { font-family: var(--font-titre); font-weight: 600; font-size: 1.15rem; margin: 0.75rem 0 1.25rem; }
.v3-esp-login .v3-esp-form { text-align: left; }
.v3-esp-login .v3-esp-hint { text-align: center; margin-top: 1.25rem; }

/* Carte, formulaires */
.v3-esp-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 1.75rem; }
.v3-esp-form { display: flex; flex-direction: column; gap: 1.4rem; }
.v3-esp-field { display: flex; flex-direction: column; gap: 0.4rem; flex: 1; }
.v3-esp-field label, .v3-esp-step legend { font-weight: 600; font-size: 0.95rem; }
.v3-esp-opt { font-weight: 400; color: var(--text-muted); }
.v3-esp-field input, .v3-esp-more textarea { min-height: 48px; border: 1px solid #8a8782; border-radius: var(--radius-sm); padding: 0.6rem 0.9rem; font: inherit; font-size: 1rem; color: var(--text); background: #fff; width: 100%; }
.v3-esp-more textarea { min-height: 96px; margin-top: 0.75rem; resize: vertical; }
.v3-esp-field input:focus-visible, .v3-esp-more textarea:focus-visible, .v3-esp-chip:focus-visible, .v3-esp-drop:focus-within, .v3-esp-bigbtn:focus-visible, .v3-esp-more summary:focus-visible { outline: 3px solid var(--color-bleu-marine); outline-offset: 2px; }
.v3-esp-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.v3-esp-step { border: 0; padding: 0; margin: 0; min-width: 0; }
.v3-esp-step legend { padding: 0; margin-bottom: 0.7rem; }
.v3-esp-submit { width: 100%; min-height: 52px; justify-content: center; font-size: 1.05rem; }
.v3-esp-more summary { cursor: pointer; color: var(--color-bleu-marine); font-weight: 600; min-height: var(--touch-target-min); display: flex; align-items: center; }
.v3-esp-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.v3-esp-chip { min-height: var(--touch-target-min); padding: 0.5rem 1.1rem; border-radius: var(--radius-pill); border: 1.5px solid #8a8782; background: #fff; font: inherit; font-weight: 600; font-size: 0.95rem; color: var(--text); cursor: pointer; }
.v3-esp-chip:hover { border-color: var(--color-bleu-marine); }
.v3-esp-chip.is-active { background: var(--color-bleu-marine); border-color: var(--color-bleu-marine); color: #fff; }
.v3-esp-drop { display: flex; flex-direction: column; align-items: center; gap: 0.6rem; text-align: center; padding: 1.75rem 1rem; border: 2px dashed #8a8782; border-radius: var(--radius-md); background: var(--surface-alt); cursor: pointer; color: var(--color-bleu-marine); }
.v3-esp-drop:hover { border-color: var(--color-bleu-marine); background: var(--tint-marine); }
.v3-esp-drop__title { font-weight: 600; color: var(--text); }
.v3-esp-drop__btn { pointer-events: none; }
.v3-esp-success { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.4rem; color: var(--color-bleu-marine); padding: 2.5rem 1.5rem; }
.v3-esp-success .v3-btn-pill { margin-top: 1rem; }
.v3-esp-success__title { font-family: var(--font-titre); font-weight: 700; font-size: 1.3rem; color: var(--text); margin: 0.5rem 0 0; }

/* Tableau de bord */
.v3-esp-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; margin-bottom: 1.75rem; }
.v3-esp-bigbtn { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 0.5rem; padding: 2.25rem 1.25rem; background: var(--surface); border: 2px solid var(--color-bleu-marine); border-radius: var(--radius-md); color: var(--color-bleu-marine); text-decoration: none; transition: background 0.15s, transform 0.15s; min-height: 220px; }
.v3-esp-bigbtn:hover { background: var(--tint-marine); transform: translateY(-2px); }
.v3-esp-bigbtn__title { font-family: var(--font-titre); font-weight: 700; font-size: 1.25rem; color: var(--text); }
.v3-esp-bigbtn__desc { font-size: 0.95rem; color: var(--text-muted); max-width: 22ch; line-height: 1.45; }
.v3-esp-cal-link { min-height: var(--touch-target-min); font-weight: 600; }

/* Listes d'événements */
.v3-esp-month { font-family: var(--font-titre); font-weight: 600; font-size: 1.05rem; color: var(--text); margin: 1.75rem 0 0.7rem; }
.v3-esp-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.v3-esp-row { display: flex; align-items: center; gap: 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 0.8rem 1rem; }
.v3-esp-date { display: flex; flex-direction: column; align-items: center; min-width: 52px; line-height: 1.1; color: var(--color-bleu-marine); }
.v3-esp-date strong { font-family: var(--font-titre); font-size: 1.6rem; font-weight: 700; }
.v3-esp-date small { font-size: 0.8rem; color: var(--text-muted); }
.v3-esp-row__body { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.v3-esp-row__title { font-weight: 600; }
.v3-esp-row__sub { font-size: 0.9rem; color: var(--text-muted); }
.v3-esp-tag { display: inline-block; padding: 0.2rem 0.75rem; border-radius: var(--radius-pill); background: var(--tint-marine); border: 1px solid var(--border); color: var(--text); font-size: 0.85rem; font-weight: 600; white-space: nowrap; }
.v3-esp-row__tools { display: flex; gap: 0.25rem; min-width: 92px; justify-content: flex-end; }
.v3-esp-iconbtn { width: var(--touch-target-min); height: var(--touch-target-min); display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: var(--radius-sm); background: #fff; color: var(--text); cursor: pointer; }
.v3-esp-iconbtn:hover { border-color: var(--color-bleu-marine); color: var(--color-bleu-marine); }

/* Vue parent */
.v3-esp-tabs { display: flex; gap: 0.25rem; border-bottom: 1px solid var(--border); }
.v3-esp-tabs button { min-height: var(--touch-target-min); padding: 0.5rem 1.4rem; background: none; border: 0; border-bottom: 3px solid transparent; font: inherit; font-weight: 600; color: var(--text-muted); cursor: pointer; }
.v3-esp-tabs button.is-active { color: var(--color-bleu-marine); border-bottom-color: var(--color-or); }
.v3-esp-filter { display: flex; align-items: center; gap: 0.6rem; margin: 1.25rem 0 1rem; font-weight: 600; }
.v3-esp-photos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; }
.v3-esp-photos li { aspect-ratio: 1; border-radius: var(--radius-sm); overflow: hidden; background: var(--tint-marine); }
.v3-esp-photos img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Notes de maquette et pied de page */
.v3-esp-note { margin-top: 2.5rem; padding: 0.9rem 1.1rem; border: 1px dashed #8a8782; border-radius: var(--radius-sm); font-size: 0.85rem; color: var(--text-muted); line-height: 1.55; }
.v3-esp-note strong { color: var(--text); font-size: 0.8rem; }
.v3-esp-note p { margin: 0.3rem 0 0; }
.v3-esp-foot { display: flex; flex-wrap: wrap; gap: 0.4rem 1.5rem; justify-content: center; padding: 1.25rem; border-top: 1px solid var(--border); background: var(--surface); font-size: 0.85rem; }
.v3-esp-foot a { color: var(--text-muted); text-decoration: underline; text-underline-offset: 3px; }
.v3-esp-foot a:hover { color: var(--color-bleu-marine); }

@media (max-width: 640px) {
  .v3-esp-top__name { display: none; }
  .v3-esp-top__role { font-size: 0.85rem; padding-left: 0.6rem; }
  .v3-esp-actions { grid-template-columns: 1fr; }
  .v3-esp-bigbtn { min-height: 0; display: grid; grid-template-columns: 44px 1fr; column-gap: 1rem; row-gap: 0.15rem; text-align: left; align-items: center; justify-items: start; padding: 1.25rem; }
  .v3-esp-bigbtn svg { grid-row: 1 / span 2; width: 44px; height: 44px; }
  .v3-esp-bigbtn__desc { max-width: none; }
  .v3-esp-row2 { grid-template-columns: 1fr; }
  .v3-esp-row { flex-wrap: wrap; }
  .v3-esp-row__body { flex-basis: calc(100% - 80px); }
  .v3-esp-tag { order: 3; }
  .v3-esp-row__tools { order: 4; margin-left: auto; min-width: 0; }
  .v3-esp-photos { grid-template-columns: repeat(2, 1fr); }
  .v3-esp-card { padding: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) { .v3-esp-bigbtn { transition: none; } .v3-esp-bigbtn:hover { transform: none; } }

/* Espace v3 : écrans complémentaires (lot de photos, direction, associations) */
.v3-esp-thumbs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 0.6rem; }
.v3-esp-thumbs li { position: relative; aspect-ratio: 1; border-radius: var(--radius-sm); overflow: hidden; background: var(--tint-marine); }
.v3-esp-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.v3-esp-thumb__x { position: absolute; top: 4px; right: 4px; width: 32px; height: 32px; border-radius: 50%; border: 0; background: rgba(255,255,255,0.95); color: var(--color-bleu-marine); font-size: 1.25rem; line-height: 1; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,0.25); }
.v3-esp-thumb__x:focus-visible { outline: 3px solid var(--color-bleu-marine); outline-offset: 2px; }
.v3-esp-thumb__add { border: 2px dashed #8a8782; background: transparent !important; }
.v3-esp-thumb__add label { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 2rem; color: var(--color-bleu-marine); cursor: pointer; }
.v3-esp-thumb__add:focus-within { outline: 3px solid var(--color-bleu-marine); outline-offset: 2px; }
.v3-esp-textarea { min-height: 120px; border: 1px solid #8a8782; border-radius: var(--radius-sm); padding: 0.6rem 0.9rem; font: inherit; font-size: 1rem; color: var(--text); background: #fff; width: 100%; resize: vertical; }
.v3-esp-textarea:focus-visible { outline: 3px solid var(--color-bleu-marine); outline-offset: 2px; }
.v3-esp-drop--compact { padding: 1rem; min-height: 0; }
.v3-esp-actions--3 { grid-template-columns: repeat(3, 1fr); }
.v3-esp-bigbtn--small { min-height: 0; padding: 1.25rem 1rem; }
.v3-esp-bigbtn--small .v3-esp-bigbtn__title { font-size: 1.05rem; }
.v3-esp-stats { list-style: none; margin: 0 0 2rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0.9rem; }
.v3-esp-stat { display: flex; flex-direction: column; align-items: flex-start; gap: 0.35rem; padding: 1rem 1.1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.v3-esp-stat__main { font-weight: 600; color: var(--text); }
.v3-esp-stat__sub { font-size: 0.9rem; color: var(--text-muted, #55524e); }
.v3-esp-demo { margin-top: 0.5rem; font-size: 0.9rem; }
@media (max-width: 640px) {
  .v3-esp-actions--3 { grid-template-columns: 1fr; }
  .v3-esp-bigbtn--small { display: grid; grid-template-columns: 44px 1fr; column-gap: 1rem; align-items: center; justify-items: start; text-align: left; }
}