/* ==========================================================================
   EPERM — passe de finition UIZZE

   Cette couche est chargée après les styles propres à chaque page. Elle
   resserre la hiérarchie, les surfaces et les états interactifs sans changer
   les composants, les contenus ou le lecteur persistant.
   ========================================================================== */

:root {
  --eperm-content: 1180px;
  --eperm-radius-sm: 12px;
  --eperm-radius-md: 18px;
  --eperm-radius-lg: 26px;
  --eperm-shadow-soft: 0 18px 48px rgba(31, 42, 46, .08);
  --eperm-shadow-lift: 0 24px 60px rgba(13, 111, 120, .14);
  --eperm-ease: cubic-bezier(.22, 1, .36, 1);
}

body #pjax-main .container,
body .site-header > .container {
  max-width: var(--eperm-content);
}

body #pjax-main > main > section:not(#hero):not(.inner-page-banner) {
  padding-block: clamp(76px, 8vw, 112px);
}

/* --- Navigation : plus calme, plus nette -------------------------------- */

body .site-header {
  background: rgba(250, 248, 244, .86);
  border-bottom-color: rgba(31, 42, 46, .08);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .68);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body .site-header.is-compact {
  box-shadow: 0 14px 36px rgba(31, 42, 46, .08);
}

body .site-header .desktop-nav {
  gap: clamp(22px, 2.5vw, 34px) !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  letter-spacing: -.01em;
}

body .desktop-nav a::after {
  bottom: 0;
  height: 2px;
  border-radius: 999px;
  transform-origin: center;
  transition-duration: .3s;
  transition-timing-function: var(--eperm-ease);
}

/* --- Hero : impact sans hauteur perdue ---------------------------------- */

body #pjax-main #hero {
  isolation: isolate;
  min-height: min(900px, 92svh) !important;
  background:
    radial-gradient(circle at 82% 15%, rgba(250, 248, 244, .18), transparent 31%),
    radial-gradient(circle at 12% 90%, rgba(13, 111, 120, .22), transparent 34%),
    linear-gradient(148deg, #0D6F78 0%, #1599A7 32%, #89AAA7 64%, #F2C8B6 112%) !important;
}

body #pjax-main #hero::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('/assets/texture-grain.png') repeat;
  background-size: 260px 260px;
  content: '';
  opacity: .11;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

body #pjax-main #hero .container {
  padding-top: 132px !important;
  padding-bottom: 92px !important;
}

body #pjax-main #hero .hero-title {
  max-width: 940px;
  font-size: clamp(58px, 8vw, 112px) !important;
  line-height: .95;
  letter-spacing: -.045em;
  text-wrap: balance;
}

body #pjax-main #hero .hero-title + p {
  max-width: 610px !important;
  margin-top: 28px !important;
  color: rgba(250, 248, 244, .92) !important;
  font-size: clamp(16px, 1.45vw, 19px) !important;
  font-weight: 450 !important;
}

body #pjax-main #hero .hero-corner-mark {
  opacity: .22;
}

/* --- Typographie et repères de section ---------------------------------- */

body #pjax-main .serif {
  text-wrap: balance;
}

body #pjax-main .kicker {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .17em;
  line-height: 1.3;
  text-transform: uppercase;
}

/* --- Boutons et liens : états francs, sans effet décoratif gratuit ------- */

body #pjax-main .btn,
body #mobile-menu .btn,
body #cookie-notice .btn {
  position: relative;
  min-height: 48px;
  overflow: hidden;
  box-shadow: 0 7px 20px rgba(31, 42, 46, .09);
  transition:
    transform .28s var(--eperm-ease),
    box-shadow .28s ease,
    background .2s ease,
    border-color .2s ease,
    color .2s ease;
}

body #pjax-main .btn-ghost {
  box-shadow: none;
}

body #pjax-main .link-arrow,
body #pjax-main .hero-secondary-link {
  transition: gap .28s var(--eperm-ease), color .2s ease, opacity .2s ease;
}

body #pjax-main .btn:focus-visible,
body #pjax-main .link-arrow:focus-visible,
body #pjax-main .hero-secondary-link:focus-visible {
  outline: 3px solid rgba(21, 153, 167, .3);
  outline-offset: 4px;
}

@media (hover: hover) and (pointer: fine) {
  body #pjax-main .btn:hover,
  body #mobile-menu .btn:hover,
  body #cookie-notice .btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 13px 30px rgba(13, 111, 120, .18);
  }

  body #pjax-main .link-arrow:hover {
    gap: 14px;
  }
}

/* --- Cartes et médias : une famille visuelle cohérente ------------------ */

body #pjax-main .card {
  border-color: rgba(31, 42, 46, .1);
  border-radius: var(--eperm-radius-md);
  box-shadow: var(--eperm-shadow-soft);
}

body #pjax-main article.card,
body #pjax-main a.card,
body #pjax-main .schedule-card,
body #pjax-main .home-sermon-row,
body #pjax-main .partner-home-link {
  transition:
    transform .34s var(--eperm-ease),
    box-shadow .34s ease,
    border-color .25s ease,
    background .25s ease;
}

body #pjax-main .schedule-card {
  border-radius: var(--eperm-radius-md) !important;
  box-shadow: 0 12px 34px rgba(31, 42, 46, .07);
}

body #pjax-main .schedule-card.is-featured {
  box-shadow: 0 22px 50px rgba(31, 42, 46, .18);
}

body #pjax-main .discover-photo {
  border-radius: var(--eperm-radius-lg);
  box-shadow: 0 28px 68px rgba(13, 111, 120, .16);
}

body #pjax-main .since-card {
  border-color: rgba(31, 42, 46, .1) !important;
  border-radius: var(--eperm-radius-md) !important;
  box-shadow: 0 20px 44px rgba(31, 42, 46, .13);
}

body #pjax-main .event-media img {
  transition: transform .7s var(--eperm-ease), filter .4s ease;
}

body #pjax-main .ev-date {
  border: 1px solid rgba(31, 42, 46, .08);
  box-shadow: 0 8px 24px rgba(31, 42, 46, .1);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

body #pjax-main .partner-logo-tile {
  border-radius: var(--eperm-radius-md);
  transition: border-color .25s ease, box-shadow .3s ease, transform .3s var(--eperm-ease);
}

@media (hover: hover) and (pointer: fine) {
  body #pjax-main article.card:hover,
  body #pjax-main a.card:hover,
  body #pjax-main .schedule-card:hover,
  body #pjax-main .partner-home-link:hover {
    transform: translateY(-5px);
  }

  body #pjax-main article.card:hover,
  body #pjax-main a.card:hover,
  body #pjax-main .schedule-card:hover {
    border-color: rgba(13, 111, 120, .28);
    box-shadow: var(--eperm-shadow-lift);
  }

  body #pjax-main article.card:hover .event-media img {
    filter: saturate(1.04);
    transform: scale(1.045);
  }

  body #pjax-main .partner-home-link:hover .partner-logo-tile {
    border-color: rgba(13, 111, 120, .32);
    box-shadow: 0 18px 42px rgba(13, 111, 120, .1);
  }
}

/* --- Sections éditoriales ------------------------------------------------ */

body #pjax-main #decouvrir {
  background:
    radial-gradient(circle at 8% 12%, rgba(242, 200, 182, .2), transparent 28%),
    #F4F1EC !important;
}

body #pjax-main #messages.home-sermons {
  background:
    radial-gradient(circle at 88% 16%, rgba(21, 153, 167, .15), transparent 28%),
    radial-gradient(circle at 10% 94%, rgba(242, 200, 182, .08), transparent 26%),
    #1F2A2E !important;
}

body #pjax-main .home-sermons-heading {
  margin-bottom: 34px;
}

body #pjax-main .home-sermon-feature {
  border-radius: var(--eperm-radius-lg);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .16);
}

body #pjax-main .home-sermon-cover {
  border-radius: var(--eperm-radius-sm);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
}

body #pjax-main .home-sermon-row {
  border-radius: var(--eperm-radius-md);
}

body #pjax-main [data-cms-block="verse"] {
  background:
    linear-gradient(150deg, rgba(13, 111, 120, .96), rgba(21, 153, 167, .91) 58%, rgba(232, 185, 165, .94)),
    url('/assets/texture-grain.png') repeat !important;
  background-size: auto, 260px 260px !important;
}

body #pjax-main .home-fund-card {
  min-height: 100%;
}

body #pjax-main .home-fund-card.is-priority > .kicker {
  color: #FAF8F4 !important;
}

/* --- Pages intérieures et formulaires ----------------------------------- */

body #pjax-main .inner-page-banner {
  position: relative;
  isolation: isolate;
  min-height: 270px;
  overflow: hidden;
  padding: 138px 0 54px;
  border-bottom-color: rgba(31, 42, 46, .08);
  background:
    radial-gradient(circle at 82% 0%, rgba(21, 153, 167, .13), transparent 34%),
    linear-gradient(135deg, #F7F3EE, #EEF4F1) !important;
}

body #pjax-main .inner-page-banner::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url('/assets/texture-grain.png') repeat;
  background-size: 260px 260px;
  content: '';
  opacity: .055;
  pointer-events: none;
}

body #pjax-main .inner-page-banner h1 {
  max-width: 850px;
  font-size: clamp(42px, 5.2vw, 68px);
  letter-spacing: -.04em;
}

body #pjax-main :is(input, textarea, select) {
  border-radius: var(--eperm-radius-sm);
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

body #pjax-main :is(input, textarea, select):focus {
  border-color: #1599A7 !important;
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(21, 153, 167, .13);
}

/* --- Thème sombre -------------------------------------------------------- */

html[data-theme="dark"] body .site-header {
  background: rgba(18, 28, 28, .84) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .04);
}

html[data-theme="dark"] body #pjax-main .card,
html[data-theme="dark"] body #pjax-main .schedule-card {
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

html[data-theme="dark"] body #pjax-main .inner-page-banner {
  background:
    radial-gradient(circle at 82% 0%, rgba(72, 197, 208, .12), transparent 34%),
    linear-gradient(135deg, #16201F, #121C1C) !important;
  border-bottom-color: rgba(255, 255, 255, .08);
}

html[data-theme="dark"] body #pjax-main #decouvrir {
  background:
    radial-gradient(circle at 8% 12%, rgba(242, 200, 182, .06), transparent 28%),
    #16201F !important;
}

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

@media (max-width: 900px) {
  body #pjax-main > main > section:not(#hero):not(.inner-page-banner) {
    padding-block: 64px;
  }

  body #pjax-main #hero {
    min-height: min(760px, calc(100svh - 58px)) !important;
  }

  body #pjax-main #hero .container {
    padding-top: 104px !important;
    padding-bottom: 56px !important;
  }

  body #pjax-main #hero .hero-title {
    max-width: 720px;
    font-size: clamp(46px, 10vw, 72px) !important;
    letter-spacing: -.04em;
  }

  body #pjax-main .inner-page-banner {
    min-height: 230px;
    padding: 112px 0 42px;
  }

  body #pjax-main .card,
  body #pjax-main .schedule-card,
  body #pjax-main .home-sermon-feature,
  body #pjax-main .home-sermon-row,
  body #pjax-main .partner-logo-tile {
    border-radius: 16px !important;
  }
}

@media (max-width: 600px) {
  body #pjax-main > main > section:not(#hero):not(.inner-page-banner) {
    padding-block: 52px;
  }

  body #pjax-main #hero {
    min-height: min(700px, calc(100svh - 58px)) !important;
  }

  body #pjax-main #hero .container {
    padding-top: 96px !important;
    padding-bottom: 42px !important;
  }

  body #pjax-main #hero .hero-title {
    max-width: 12ch;
    font-size: clamp(42px, 13vw, 58px) !important;
    line-height: .97;
  }

  body #pjax-main #hero .hero-title + p {
    max-width: 34ch !important;
    margin-top: 22px !important;
    line-height: 1.6 !important;
  }

  body #pjax-main #hero .hero-title + p + div {
    margin-top: 30px !important;
  }

  body #pjax-main .btn {
    min-height: 46px;
  }

  body #pjax-main .home-sermon-actions .btn {
    box-sizing: border-box;
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 0;
    border-radius: 12px;
  }

  body #pjax-main .kicker {
    font-size: 9px;
  }

  body #pjax-main .inner-page-banner {
    min-height: 210px;
    padding: 100px 0 36px;
  }

  body #pjax-main .inner-page-banner h1 {
    font-size: clamp(36px, 11vw, 48px);
  }

  body #pjax-main .since-card {
    box-shadow: 0 14px 34px rgba(31, 42, 46, .12);
  }
}

@media (prefers-reduced-motion: reduce) {
  body #pjax-main *,
  body #mobile-menu *,
  body #cookie-notice * {
    scroll-behavior: auto !important;
  }

  body #pjax-main .btn,
  body #pjax-main article.card,
  body #pjax-main a.card,
  body #pjax-main .schedule-card,
  body #pjax-main .partner-home-link,
  body #pjax-main .event-media img {
    transition-duration: .01ms !important;
  }

  body #pjax-main .btn:hover,
  body #pjax-main article.card:hover,
  body #pjax-main a.card:hover,
  body #pjax-main .schedule-card:hover,
  body #pjax-main .partner-home-link:hover,
  body #pjax-main article.card:hover .event-media img {
    transform: none !important;
  }
}