/* ==========================================================================
   SKINNOVATION v4 — Responsive global
   Breakpoints : 1199.98 | 991.98 | 767.98 | 575.98 (alignés Bootstrap)
   ========================================================================== */

:root {
  --sn-safe-top: env(safe-area-inset-top, 0px);
  --sn-safe-bottom: env(safe-area-inset-bottom, 0px);
  --sn-safe-left: env(safe-area-inset-left, 0px);
  --sn-safe-right: env(safe-area-inset-right, 0px);
  --sn-sticky-offset: calc(var(--sn-header) + 52px);
}

/* ── Variables & base ── */
@media (max-width: 1199.98px) {
  :root {
    --sn-sticky-offset: calc(var(--sn-header) + 56px);
  }
}

@media (max-width: 991.98px) {
  :root {
    --sn-header: 68px;
    --sn-section: clamp(3.5rem, 10vw, 6rem);
    --sn-sticky-offset: calc(var(--sn-header) + 60px);
  }

  body.skinnov-v4 .sn-header.is-scrolled {
    height: 60px;
  }
}

@media (max-width: 575.98px) {
  :root {
    --sn-wrap: min(100% - 2rem, 1320px);
    --sn-section: clamp(3rem, 11vw, 4.5rem);
    --sn-radius: 18px;
    --sn-radius-md: 14px;
  }
}

/* Espace pour CTA flottant (accueil) */
@media (max-width: 991.98px) {
  body.skinnov-v4.is-home .sn-main {
    padding-bottom: calc(5rem + var(--sn-safe-bottom));
  }
}

body.skinnov-v4 .sn-float-cta {
  bottom: calc(1.25rem + var(--sn-safe-bottom));
  max-width: calc(100vw - 2rem - var(--sn-safe-left) - var(--sn-safe-right));
}

/* ── Header ── */
@media (max-width: 991.98px) {
  body.skinnov-v4 .sn-header__inner {
    gap: 1rem;
  }
}

@media (max-width: 575.98px) {
  body.skinnov-v4 .sn-header__logo img {
    height: 32px;
  }

  body.skinnov-v4 .sn-header.is-scrolled .sn-header__logo img {
    height: 28px;
  }

  body.skinnov-v4 .sn-header__phone {
    width: 100%;
    justify-content: center;
  }
}

/* ── Hero (global) ── */
@media (max-width: 991.98px) {
  body.skinnov-v4 .sn-hero {
    min-height: auto;
    padding-bottom: 3.5rem;
  }

  body.skinnov-v4 .sn-hero__copy {
    text-align: center;
  }

  body.skinnov-v4 .sn-hero__meta {
    justify-content: center;
  }

  body.skinnov-v4 .sn-hero__text {
    max-width: none;
    margin-inline: auto;
  }

  body.skinnov-v4 .sn-hero__actions {
    justify-content: center;
  }
}

@media (max-width: 767.98px) {
  body.skinnov-v4 .sn-hero__title {
    font-size: clamp(2.35rem, 11vw, 3.5rem);
  }

  body.skinnov-v4 .sn-hero__title-row--sub {
    letter-spacing: 0.2em;
    font-size: 0.5em;
  }

  body.skinnov-v4 .sn-hero__actions {
    flex-direction: column;
    width: 100%;
    max-width: 22rem;
    margin-inline: auto;
  }

  body.skinnov-v4 .sn-hero__actions .sn-btn {
    width: 100%;
    justify-content: center;
  }

  body.skinnov-v4 .sn-hero__visual {
    max-width: min(100%, 340px);
  }

  body.skinnov-v4 .sn-hero__card {
    position: relative;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: -2rem auto 0;
    width: min(100%, 16rem);
  }

  body.skinnov-v4 .sn-hero__frame-inner {
    aspect-ratio: 5 / 6;
  }
}

/* ── Accueil éditorial ── */
@media (max-width: 991.98px) {
  body.is-home .sn-home--editorial {
    --sn-home-pad: clamp(3.5rem, 9vw, 5.5rem);
  }

  body.is-home .sn-hero--editorial .sn-hero__layout {
    grid-template-columns: 1fr;
  }

  body.is-home .sn-hero--editorial .sn-hero__visual {
    order: -1;
    max-width: min(100%, 380px);
    margin-inline: auto;
  }

  body.is-home .sn-hero--editorial .sn-hero__copy {
    text-align: left;
  }

  body.is-home .sn-hero--editorial .sn-hero__meta {
    justify-content: flex-start;
  }

  body.is-home .sn-hero--editorial .sn-hero__actions {
    justify-content: flex-start;
    max-width: none;
  }

  body.is-home .sn-strip--editorial {
    margin-top: 0;
  }

  body.is-home .sn-about--editorial .sn-about__layout {
    grid-template-columns: 1fr;
  }

  body.is-home .sn-about--editorial .sn-about__stack {
    max-width: 100%;
  }

  body.is-home .sn-about--editorial .sn-about__photo--a {
    min-height: 280px;
  }

  body.is-home .sn-brands--editorial {
    margin-top: 0;
  }
}

@media (max-width: 767.98px) {
  body.is-home .sn-hero--editorial {
    padding-top: calc(var(--sn-header) + 1.5rem);
  }

  body.is-home .sn-hero--editorial .sn-hero__title {
    font-size: clamp(2.25rem, 10vw, 3.25rem);
  }

  body.is-home .sn-hero--editorial .sn-hero__title-row--sub {
    letter-spacing: 0.18em;
    font-size: 0.45em;
  }

  body.is-home .sn-hero--editorial .sn-hero__text {
    font-size: 1rem;
  }

  body.is-home .sn-hero--editorial .sn-hero__actions {
    flex-direction: column;
  }

  body.is-home .sn-hero--editorial .sn-hero__actions .sn-btn {
    width: 100%;
  }

  body.is-home .sn-hero--editorial .sn-hero__card {
    position: relative;
    left: auto;
    margin: 1rem 0 0;
    width: 100%;
    max-width: none;
  }

  body.is-home .sn-about--editorial .sn-about__stack {
    grid-template-columns: 1fr;
  }

  body.is-home .sn-about--editorial .sn-about__photo--a,
  body.is-home .sn-about--editorial .sn-about__photo--b {
    grid-row: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
  }

  body.is-home .sn-home-showcase__head .sn-title {
    font-size: clamp(1.75rem, 6vw, 2.25rem);
  }

  body.is-home .sn-home-showcase__card {
    min-height: 260px;
  }

  body.is-home .sn-cta--editorial .sn-wrap {
    padding: 2.25rem 1.5rem;
    border-radius: 18px;
  }

  body.is-home .sn-cta--editorial .sn-cta__title {
    font-size: clamp(1.75rem, 7vw, 2.5rem);
  }
}

@media (max-width: 575.98px) {
  body.is-home .sn-strip--editorial .sn-strip__cell {
    padding: 1.15rem 1.25rem;
  }

  body.is-home .sn-brands--editorial .sn-brands__row {
    gap: 1.25rem 1.75rem;
    padding: 1rem;
  }

  body.is-home .sn-brands--editorial .sn-brands__row img {
    height: 32px;
  }
}

/* ── Pages prestations ── */
@media (max-width: 991.98px) {
  body.skinnov-v4 .sn-service-hero {
    min-height: 58vh;
    padding-bottom: 3rem;
  }

  body.skinnov-v4 .sn-service-hero--catalog {
    min-height: 48vh;
  }

  body.skinnov-v4 .sn-service-hero__inner {
    max-width: none;
  }
}

@media (max-width: 767.98px) {
  body.skinnov-v4 .sn-service-hero {
    min-height: auto;
    padding: calc(var(--sn-header) + 1.5rem) 0 2.5rem;
    align-items: flex-end;
  }

  body.skinnov-v4 .sn-service-hero__title {
    font-size: clamp(2rem, 8vw, 2.75rem);
  }

  body.skinnov-v4 .sn-service-hero__subtitle {
    font-size: 1.125rem;
  }

  body.skinnov-v4 .sn-service-hero__excerpt {
    font-size: 0.9375rem;
    line-height: 1.65;
  }

  body.skinnov-v4 .sn-service-hero__actions {
    flex-direction: column;
    width: 100%;
  }

  body.skinnov-v4 .sn-service-hero__actions .sn-btn {
    width: 100%;
    justify-content: center;
  }

  body.skinnov-v4 .sn-breadcrumb__list {
    font-size: 0.6875rem;
  }

  body.skinnov-v4 .sn-service-bar__inner {
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.65rem 0;
    min-height: 48px;
  }

  body.skinnov-v4 .sn-service-bar .sn-btn {
    margin-left: auto;
    padding: 0.55rem 1rem;
    font-size: 0.75rem;
  }

  body.skinnov-v4 .sn-prestation .wp-block-columns {
    flex-direction: column !important;
  }

  body.skinnov-v4 .sn-prestation .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
  }

  body.skinnov-v4 .sn-prestation .wp-block-group {
    padding: 1.5rem 1.25rem !important;
  }

  body.skinnov-v4 .sn-prestation h2.wp-block-heading {
    font-size: clamp(1.5rem, 5vw, 2rem);
  }

  body.skinnov-v4 .sn-related__grid {
    grid-template-columns: 1fr;
  }

  body.skinnov-v4 .sn-service-endcta {
    padding: 3.5rem 0;
  }

  body.skinnov-v4 .sn-service-endcta__actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 20rem;
    margin-inline: auto;
  }

  body.skinnov-v4 .sn-service-endcta__actions .sn-btn {
    width: 100%;
    justify-content: center;
  }

  body.skinnov-v4 .sn-service-hero--contact {
    min-height: auto;
  }

  body.skinnov-v4 .sn-service-hero--contact .sn-service-hero__actions .sn-btn {
    min-width: 0;
  }
}

@media (min-width: 576px) and (max-width: 991.98px) {
  body.skinnov-v4 .sn-related__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  body.skinnov-v4 .sn-service-aside {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575.98px) {
  body.skinnov-v4 .sn-service-aside {
    grid-template-columns: 1fr;
  }

  body.skinnov-v4 .sn-service-layout {
    padding: var(--sn-section) 0 2.5rem;
  }

  body.skinnov-v4 .sn-contact-main {
    padding: 1.25rem;
  }
}

@media (max-width: 1100px) {
  body.skinnov-v4 .sn-contact-layout__grid {
    grid-template-columns: 1fr;
  }

  body.skinnov-v4 .sn-contact-aside {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  body.skinnov-v4 .sn-contact-aside {
    grid-template-columns: 1fr;
  }
}

/* ── Catalogue soins ── */
body.skinnov-v4 .sn-cat-section--chapter,
body.skinnov-v4 .sn-cat-section--card {
  scroll-margin-top: var(--sn-sticky-offset);
}

@media (max-width: 991.98px) {
  body.skinnov-v4 .sn-catalog-layout {
    padding-top: 2rem;
  }

  body.skinnov-v4 .sn-cat-section__grid {
    grid-template-columns: 1fr;
  }

  body.skinnov-v4 .sn-cat-section__media {
    order: -1;
  }

  body.skinnov-v4 .sn-cat-section__media img {
    width: 100%;
    max-height: 280px;
    object-fit: cover;
  }
}

@media (max-width: 767.98px) {
  body.skinnov-v4 .sn-catalog-bar__inner {
    min-height: auto;
  }

  body.skinnov-v4 .sn-cat-intro {
    padding: 1.35rem 1.25rem;
  }

  body.skinnov-v4 .sn-cat-intro p {
    font-size: 1rem;
  }

  body.skinnov-v4 .sn-cat-section--card {
    padding: 1.25rem 1.15rem;
  }

  body.skinnov-v4 .sn-cat-section--chapter .sn-cat-section__title {
    font-size: clamp(1.5rem, 5vw, 2rem);
  }
}

@media (max-width: 575.98px) {
  body.skinnov-v4 .sn-catalog-bar__cta .sn-btn__text {
    display: inline;
  }

  body.skinnov-v4 .sn-catalog-bar__cta {
    padding: 0.55rem 0.9rem;
    font-size: 0.75rem;
  }
}

/* ── Footer ── */
@media (min-width: 576px) and (max-width: 991.98px) {
  body.skinnov-v4 .sn-footer__top {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem 1.5rem;
  }

  body.skinnov-v4 .sn-footer__top > div:first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 575.98px) {
  body.skinnov-v4 .sn-footer {
    padding: 3rem 0 1.5rem;
  }

  body.skinnov-v4 .sn-footer__top .sn-btn {
    width: 100%;
    justify-content: center;
  }

  body.skinnov-v4 .sn-footer__bottom {
    font-size: 0.75rem;
    padding-top: 1.5rem;
  }
}

/* ── Pages intérieures & contenu WP ── */
@media (max-width: 767.98px) {
  body.skinnov-v4 .sn-page-hero {
    min-height: auto;
    padding: calc(var(--sn-header) + 2rem) 0 2.5rem;
  }

  body.skinnov-v4 .sn-page-hero h1 {
    font-size: clamp(2rem, 8vw, 2.75rem);
  }

  body.skinnov-v4 .sn-content {
    padding: var(--sn-section) 0;
  }

  body.skinnov-v4 .sn-content .wp-block-columns {
    flex-direction: column;
  }

  body.skinnov-v4 .sn-content img,
  body.skinnov-v4 .sn-content .wp-block-image {
    max-width: 100%;
    height: auto;
  }

  body.skinnov-v4 .wrapper .is-layout-constrained:nth-child(2n) {
    padding: 2.5rem 1.25rem;
    margin: 1.5rem 0;
  }
}

/* ── Utilitaires ── */
@media (max-width: 767.98px) {
  body.skinnov-v4 .sn-btn--lg {
    padding: 0.9rem 1.35rem;
    font-size: 0.8125rem;
  }

  body.skinnov-v4 table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* ── Hard fix: menu toujours au-dessus des heroes ── */
body.skinnov-v4 .sn-header {
  z-index: 2147483000 !important;
}

body.skinnov-v4 .sn-nav__submenu {
  z-index: 2147483001 !important;
}

body.skinnov-v4 .sn-hero,
body.skinnov-v4 .sn-service-hero,
body.skinnov-v4 .sn-page-hero {
  z-index: 1 !important;
}

@media (max-width: 991.98px) {
  body.skinnov-v4 .sn-header__panel {
    z-index: 2147483001 !important;
  }

  body.skinnov-v4 .sn-header__burger {
    z-index: 2147483002 !important;
  }
}
