:root {
        --psyvan-ink: #000000;
        --psyvan-sand: #f8debc;
        --psyvan-cream: #fdf6ed;
        --psyvan-gold: #d8bf82;
        --psyvan-clay: #44bba9;
        --psyvan-pine: #023b4f;
        --psyvan-line: #e9d3ad;
        --psyvan-shadow: rgba(2, 59, 79, 0.16);
      }

      html,
      body {
        overflow-x: hidden;
      }

            .psyvan-wp-page {
        max-width: none;
        width: 100%;
        margin: 0;
      }

      body {
        font-family: "Cormorant Garamond", serif;
        color: var(--psyvan-ink);
        background:
          radial-gradient(circle at top right, rgba(68, 187, 169, 0.08), transparent 24%),
          linear-gradient(180deg, #fdf6ed 0%, #f8debc 54%, #fdf6ed 100%);
      }

      .reveal {
        opacity: 1;
        transform: none;
      }

      .js-motion .reveal {
        opacity: 0;
        transform: translateY(24px);
        transition: opacity 720ms ease, transform 720ms ease;
      }

      .js-motion .reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
      }

      .delay-1 {
        transition-delay: 90ms;
      }

      .delay-2 {
        transition-delay: 180ms;
      }

      .font-display {
        font-family: "Cormorant Garamond", serif;
      }

      .font-accent {
        font-family: "Oswald", sans-serif;
      }

      .section-label {
        font-family: "Oswald", sans-serif;
        letter-spacing: 0.28em;
        text-transform: uppercase;
      }

      .hero-stage {
        position: relative;
        background-color: #070707;
        min-height: 42rem;
      }

      .hero-stage::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background: linear-gradient(90deg, rgba(0, 0, 0, 0.74) 0%, rgba(0, 0, 0, 0.46) 30%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0) 100%);
      }

      .hero-image {
        position: absolute;
        inset: 0;
        z-index: 0;
        width: 100%;
        height: 100%;
        min-width: 100%;
        min-height: 100%;
        object-fit: cover;
        object-position: var(--hero-focus, center);
      }

      .hero-bleed-grid {
        position: relative;
        z-index: 2;
      }

      .gold-line {
        height: 1px;
        background: linear-gradient(90deg, transparent, rgba(216, 191, 130, 0.92), rgba(68, 187, 169, 0.78), transparent);
      }

      .veil-dark {
        background:
          linear-gradient(180deg, rgba(0, 0, 0, 0.76), rgba(2, 59, 79, 0.62)),
          url("https://psyvan.com/wp-content/uploads/2026/04/jeunes-reflexion.webp?v=20260423b") center/cover no-repeat;
      }

      .bullet-dot::before {
        content: "";
        width: 0.48rem;
        height: 0.48rem;
        border-radius: 999px;
        background: var(--psyvan-gold);
        position: absolute;
        top: 0.78rem;
        left: 0;
      }

      .section-rule {
        border-top: 1px solid rgba(2, 59, 79, 0.16);
      }

      .light-rule {
        border-top: 1px solid rgba(248, 222, 188, 0.26);
      }

      .quote-line {
        border-left: 1px solid rgba(68, 187, 169, 0.48);
      }

      .mist-panel {
        background:
          linear-gradient(180deg, rgba(253, 246, 237, 0.84), rgba(248, 222, 188, 0.56)),
          radial-gradient(circle at top right, rgba(68, 187, 169, 0.12), transparent 32%);
      }

      .support-kicker {
        position: relative;
        padding-left: 4.25rem;
        max-width: 18rem;
        line-height: 1.65;
      }

      .support-kicker::before {
        content: "";
        position: absolute;
        top: 1.1rem;
        left: 0;
        width: 3.1rem;
        height: 1px;
        background: rgba(2, 59, 79, 0.34);
      }

      .approach-step {
        position: relative;
        padding-left: 2.5rem;
      }

      .approach-step::before {
        content: "";
        position: absolute;
        left: 0.32rem;
        top: 0;
        bottom: -2rem;
        width: 1px;
        background: linear-gradient(180deg, rgba(248, 222, 188, 0.56), rgba(68, 187, 169, 0.14));
      }

      .approach-step:last-child::before {
        bottom: 1.25rem;
      }

      .approach-step-index {
        position: absolute;
        left: -0.25rem;
        top: 0.1rem;
        width: 1.2rem;
        height: 1.2rem;
        border-radius: 999px;
        background: var(--psyvan-gold);
        box-shadow: 0 0 0 8px rgba(2, 59, 79, 0.94);
      }

      .why-grid article img,
      .portrait-image {
        transition: transform 900ms ease, filter 900ms ease;
      }

      .why-grid article:hover img,
      .portrait-image:hover {
        transform: scale(1.02);
        filter: contrast(1.04);
      }

      .why-grid article:nth-child(2) {
        margin-top: 2.25rem;
      }

      .movement-card {
        position: relative;
      }

      .movement-card::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 3rem;
        height: 1px;
        background: rgba(68, 187, 169, 0.36);
      }

      .movement-card img {
        margin-top: 1.35rem;
      }

      .offer-shell {
        border-top: 1px solid rgba(216, 191, 130, 0.4);
        border-bottom: 1px solid rgba(216, 191, 130, 0.4);
        background: transparent;
      }

      .offer-copy {
        background: transparent;
      }

      .offer-aside {
        background: transparent;
        border-left: 1px solid rgba(216, 191, 130, 0.4);
      }

      .offer-rail {
        --offer-rail-axis: 0.38rem;
        --offer-rail-dot: 0.5rem;
        --offer-rail-text-offset: 1.85rem;
        position: relative;
        padding-left: var(--offer-rail-text-offset);
      }

      .offer-rail::before {
        content: "";
        position: absolute;
        top: 0.8rem;
        bottom: 0.8rem;
        left: var(--offer-rail-axis);
        width: 1px;
        background: linear-gradient(180deg, rgba(68, 187, 169, 0.62), rgba(216, 191, 130, 0.12));
      }

      .offer-rail li {
        position: relative;
      }

      .offer-rail li::before {
        content: "";
        position: absolute;
        top: 0.95rem;
        left: calc(var(--offer-rail-axis) - var(--offer-rail-text-offset));
        width: var(--offer-rail-dot);
        height: var(--offer-rail-dot);
        border-radius: 999px;
        background: var(--psyvan-gold);
        box-shadow: 0 0 0 6px rgba(253, 246, 237, 0.92);
        transform: translateX(-50%);
      }

      .offer-intro {
        position: relative;
        padding-top: 1.2rem;
      }

      .offer-intro::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 3.75rem;
        height: 1px;
        background: rgba(2, 59, 79, 0.24);
      }

      .media-stage {
        --offset: clamp(0.75rem, 3vw, 1.5rem);
        position: relative;
        z-index: 1;
        padding: var(--offset) var(--offset) 0 0;
        margin-bottom: 2rem;
      }

      .media-stage::before {
        content: "";
        position: absolute;
        top: var(--offset);
        left: var(--offset);
        right: calc(var(--offset) * -1);
        bottom: calc(var(--offset) * -1);
        background-color: var(--psyvan-pine);
        z-index: -1;
      }

      .media-stage img {
        position: relative;
        z-index: 1;
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border: 1px solid var(--psyvan-gold);
        box-shadow: none;
      }

      .media-stage--wide {
        padding: var(--offset) 0 0 var(--offset);
      }

      .media-stage--wide::before {
        top: var(--offset);
        left: calc(var(--offset) * -1);
        right: var(--offset);
        bottom: calc(var(--offset) * -1);
        background-color: var(--psyvan-sand);
        opacity: 0.42;
      }

      .media-stage--wide img {
        border-color: var(--psyvan-pine);
      }

      .portrait-stage {
        position: relative;
      }

      .objection-item {
        position: relative;
        padding-top: 1.35rem;
      }

      .objection-item::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 3rem;
        height: 1px;
        background: rgba(68, 187, 169, 0.42);
      }

      .objection-item h3 {
        max-width: 20rem;
      }

      .closing-shell {
        position: relative;
      }

      .closing-shell::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 1px;
        background: linear-gradient(180deg, rgba(248, 222, 188, 0.08), rgba(248, 222, 188, 0.42), rgba(68, 187, 169, 0.1));
      }

      .transformation-band {
        background:
          linear-gradient(180deg, rgba(253, 246, 237, 0.85), rgba(248, 222, 188, 0.92)),
          radial-gradient(circle at center top, rgba(68, 187, 169, 0.1), transparent 34%);
      }

      .transformation-quote {
        position: relative;
      }

      .transformation-quote::before {
        content: "“";
        position: absolute;
        top: -1.6rem;
        left: -0.6rem;
        font-family: "Cormorant Garamond", serif;
        font-size: 5rem;
        color: rgba(68, 187, 169, 0.2);
        line-height: 1;
      }

      .video-proof-shell {
        border-top: 1px solid rgba(216, 191, 130, 0.42);
        border-bottom: 1px solid rgba(216, 191, 130, 0.42);
      }

      .video-frame {
        position: relative;
        isolation: isolate;
        padding: clamp(0.65rem, 2vw, 1rem);
      }

      .video-frame::before {
        content: "";
        position: absolute;
        inset: clamp(1.1rem, 3vw, 1.65rem) 0 0 clamp(1rem, 3vw, 1.65rem);
        background: var(--psyvan-pine);
        z-index: -1;
      }

      .video-frame iframe {
        display: block;
        width: 100%;
        aspect-ratio: 16 / 9;
        border: 1px solid rgba(216, 191, 130, 0.72);
        background: #000;
      }

      .video-proof-card {
        position: relative;
        min-height: 22rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding: clamp(2rem, 4vw, 3.5rem);
        background:
          linear-gradient(145deg, rgba(2, 59, 79, 0.98), rgba(2, 59, 79, 0.9)),
          radial-gradient(circle at top right, rgba(68, 187, 169, 0.2), transparent 34%);
        color: white;
      }

      .video-proof-card::after {
        content: "";
        position: absolute;
        right: 1.2rem;
        bottom: -1.2rem;
        left: 1.2rem;
        height: 1.2rem;
        background: rgba(68, 187, 169, 0.28);
      }

      .video-list article:nth-child(even) {
        margin-top: 2.25rem;
      }

      @media (min-width: 1024px) {
        .hero-stage {
          min-height: 100svh;
        }

        .hero-bleed-grid {
          grid-template-columns: minmax(0, 1fr);
        }

        .hero-copy {
          max-width: 31rem;
        }

        .hero-copy h1 {
          font-size: 4.1rem;
          line-height: 1.02;
        }

        body.home .hero-copy h1 {
          font-size: 4.2rem;
        }

        body.page-id-76 .hero-copy h1 {
          font-size: 4.35rem;
        }

        .approach-shell {
          grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
        }

        .approach-intro {
          position: sticky;
          top: 7rem;
          align-self: start;
          padding-right: 3rem;
        }

        .objection-grid {
          grid-template-columns: minmax(0, 1fr);
        }

        .why-shell {
          grid-template-columns: minmax(0, 0.76fr) minmax(0, 1.24fr);
        }

        .why-copy {
          max-width: 31rem;
          padding-top: 2rem;
        }

        .why-grid {
          grid-template-columns: minmax(0, 1fr);
          max-width: 30rem;
          align-items: start;
        }

        .offer-shell {
          grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
        }

        .transformation-shell {
          grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
          align-items: start;
        }

        .transformation-copy {
          max-width: 29rem;
          padding-right: 2rem;
        }

        .closing-grid {
          grid-template-columns: minmax(0, 0.62fr) minmax(0, 1.38fr);
        }
      }

      @media (min-width: 1280px) {
        .hero-copy h1 {
          font-size: 4.75rem;
        }

        body.home .hero-copy h1 {
          font-size: 4.85rem;
        }
      }

      @media (max-width: 1023px) {
        .hero-stage::before {
          background:
            linear-gradient(180deg, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0.26) 36%, rgba(0, 0, 0, 0.78) 100%),
            linear-gradient(90deg, rgba(0, 0, 0, 0.84) 0%, rgba(0, 0, 0, 0.64) 42%, rgba(0, 0, 0, 0.28) 70%, rgba(0, 0, 0, 0.08) 100%);
        }

        .hero-image {
          object-position: var(--hero-focus-mobile, 58% center);
        }

        .hero-copy {
          position: relative;
          z-index: 2;
          max-width: 17rem;
        }

        .approach-step {
          padding-left: 2rem;
        }

        .why-grid article:nth-child(2) {
          margin-top: 0;
        }

        .support-kicker {
          padding-left: 0;
        }

        .support-kicker::before {
          display: none;
        }

        .video-list article:nth-child(even) {
          margin-top: 0;
        }

        /* Les surcharges .portrait-stage et .media-stage ont été supprimées pour le design éditorial */
      }

      @media (max-width: 768px) {
        .hero-copy {
          max-width: 18.75rem;
        }

        .hero-copy h1 {
          font-size: clamp(2.85rem, 11vw, 3.65rem);
          line-height: 0.98;
          text-shadow: 0 6px 24px rgba(0, 0, 0, 0.28);
        }

        .hero-copy h1 + p {
          font-size: 1.12rem;
          line-height: 1.65;
          max-width: 16.5rem;
          text-shadow: 0 4px 18px rgba(0, 0, 0, 0.34);
        }

        .media-stage {
          margin-bottom: 1.5rem;
        }
      }

      @media (prefers-reduced-motion: reduce) {
        .js-motion .reveal,
        .js-motion .reveal.is-visible,
        .why-grid article img,
        .portrait-image {
          opacity: 1;
          transform: none;
          transition: none;
        }
      }

/* Theme-owned runtime normalization. Hero media is rendered with <img>, never duplicated as a CSS background. */
.hero-stage::before {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.78) 0%, rgba(0, 0, 0, 0.48) 34%, rgba(0, 0, 0, 0.16) 62%, rgba(0, 0, 0, 0) 100%);
}

@media (max-width: 1023px) {
  .hero-stage::before {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.3) 36%, rgba(0, 0, 0, 0.84) 100%),
      linear-gradient(90deg, rgba(0, 0, 0, 0.88) 0%, rgba(0, 0, 0, 0.66) 42%, rgba(0, 0, 0, 0.28) 70%, rgba(0, 0, 0, 0.08) 100%);
  }
}

.hero-focus-home .hero-image,
.hero-focus-parents .hero-image,
.hero-focus-contact .hero-image,
.hero-focus-qui .hero-image {
  object-position: center;
  transform: none;
  transform-origin: center;
}

.hero-focus-ados .hero-image,
.hero-focus-pros .hero-image {
  object-position: 62% center;
  transform: none;
  transform-origin: center;
}

.object-pos-pros-terrain {
  object-position: 82% center;
}

@media (max-width: 1023px) {
  .hero-focus-home .hero-image,
  .hero-focus-parents .hero-image {
    object-position: 58% center;
  }

  .hero-focus-ados .hero-image,
  .hero-focus-pros .hero-image,
  .hero-focus-qui .hero-image {
    object-position: 62% center;
  }

  .hero-focus-contact .hero-image {
    object-position: center;
  }
}
