/* LifeBloomReads — thème fidèle au builder Hostinger (Zyro) */

:root {
  --lb-bg: #001233;
  --lb-bg-footer: #112a4e;
  --lb-gold: #ffca2e;
  --lb-text: #ffffff;
  --lb-max: 1224px;
  --lb-font-serif: "Merriweather", Georgia, serif;
  --lb-font-sans: "Poppins", system-ui, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body.lb-site {
  margin: 0;
  background: var(--lb-bg);
  color: var(--lb-text);
  font-family: var(--lb-font-sans);
  font-size: 16px;
  line-height: 1.72;
  font-weight: 500;
}

a { color: inherit; }

.lb-wrap {
  max-width: var(--lb-max);
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}

.lb-main { min-height: 0; }

/* ——— Header ——— */
.lb-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: transparent;
}

.lb-header__inner {
  position: relative;
  max-width: var(--lb-max);
  margin: 0 auto;
  padding: 24px 16px;
  min-height: 230px;
  display: grid;
  grid-template-columns: 182px 1fr auto;
  grid-template-rows: 1fr;
  align-items: center;
  gap: 16px;
}

.lb-logo {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  align-self: center;
  line-height: 0;
}

.lb-logo img {
  width: 182px;
  height: auto;
  display: block;
}

.lb-nav {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  align-self: center;
}

.lb-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 47px;
}

.lb-nav__link {
  font-family: var(--lb-font-sans);
  font-weight: 800;
  font-size: 18px;
  text-decoration: none;
  color: var(--lb-text);
  transition: color 0.2s;
}

.lb-nav__link:hover,
.lb-nav__link.is-active { color: var(--lb-gold); text-decoration: underline; }

.lb-social {
  position: static;
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  display: flex;
  gap: 20px;
}

.lb-social__link {
  font-size: 0;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0.95;
  color: var(--lb-text);
}

.lb-social__link::before {
  content: "";
  width: 24px;
  height: 24px;
  background: currentColor;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

.lb-social__link--facebook::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M24 12.073C24 5.405 18.627 0 12 0S0 5.405 0 12.073C0 18.1 4.388 23.094 10.125 24v-8.437H7.078v-6.636h3.047V9.41c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.296h-2.796V24C19.612 23.094 24 18.1 24 12.073z'/%3E%3C/svg%3E");
}

.lb-social__link--instagram::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2.163c3.204 0 3.584.012 4.85.07 1.17.054 1.97.24 2.427.403a4.92 4.92 0 0 1 1.77 1.153 4.92 4.92 0 0 1 1.153 1.77c.163.457.349 1.257.403 2.427.058 1.266.07 1.646.07 4.85s-.012 3.584-.07 4.85c-.054 1.17-.24 1.97-.403 2.427a4.92 4.92 0 0 1-1.153 1.77 4.92 4.92 0 0 1-1.77 1.153c-.457.163-1.257.349-2.427.403-1.266.058-1.646.07-4.85.07s-3.584-.012-4.85-.07c-1.17-.054-1.97-.24-2.427-.403a4.92 4.92 0 0 1-1.77-1.153 4.92 4.92 0 0 1-1.153-1.77c-.163-.457-.349-1.257-.403-2.427C2.175 15.747 2.163 15.367 2.163 12s.012-3.584.07-4.85c.054-1.17.24-1.97.403-2.427a4.92 4.92 0 0 1 1.153-1.77 4.92 4.92 0 0 1 1.77-1.153c.457-.163 1.257-.349 2.427-.403C8.416 2.175 8.796 2.163 12 2.163zm0 1.622c-3.15 0-3.521.012-4.752.069-1.02.047-1.574.218-1.942.363a3.3 3.3 0 0 0-1.193.778 3.3 3.3 0 0 0-.778 1.193c-.145.368-.316.922-.363 1.942-.057 1.23-.069 1.601-.069 4.752s.012 3.521.069 4.752c.047 1.02.218 1.574.363 1.942a3.3 3.3 0 0 0 .778 1.193 3.3 3.3 0 0 0 1.193.778c.368.145.922.316 1.942.363 1.23.057 1.601.069 4.752.069s3.521-.012 4.752-.069c1.02-.047 1.574-.218 1.942-.363a3.3 3.3 0 0 0 1.193-.778 3.3 3.3 0 0 0 .778-1.193c.145-.368.316-.922.363-1.942.057-1.23.069-1.601.069-4.752s-.012-3.521-.069-4.752c-.047-1.02-.218-1.574-.363-1.942a3.3 3.3 0 0 0-.778-1.193 3.3 3.3 0 0 0-1.193-.778c-.368-.145-.922-.316-1.942-.363-1.23-.057-1.601-.069-4.752-.069zM12 7.378a4.622 4.622 0 1 0 0 9.244 4.622 4.622 0 0 0 0-9.244zm0 7.622a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm5.804-8.885a1.08 1.08 0 1 0 0 2.16 1.08 1.08 0 0 0 0-2.16z'/%3E%3C/svg%3E");
}

.lb-social__link--deviantart::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M20 4.369 15.09 12.764l.37.445H20v5.986h-8.045l-.675.431-2.185 3.938c-.015 0-.43.403-.46.431H4v-4.369l4.66-8.409-.37-.432H4V4.805h7.8l.675-.431L14.66.437C14.675.437 15.09.033 15.12.005H20v4.364z'/%3E%3C/svg%3E");
}

.lb-nav-toggle {
  display: none;
  grid-column: 3;
  justify-self: end;
  background: transparent;
  border: 0;
  color: var(--lb-text);
  cursor: pointer;
}

/* ——— Accueil : Kenai Wolfe + tagline (même bande que le live) ——— */
.lb-hero-strip {
  background-color: var(--lb-bg);
  padding: 16px 0 32px;
  min-height: 101px;
}

.lb-hero-strip__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 715px);
  align-items: end;
  gap: 24px;
  min-height: 69px;
}

.lb-hero__name {
  margin: 0;
  font-family: var(--lb-font-serif);
  font-weight: 700;
  font-size: 48px;
  color: var(--lb-gold);
  line-height: 1.3;
}

.lb-hero__right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
}

.lb-hero__tagline {
  margin: 0 0 8px;
  font-family: var(--lb-font-serif);
  font-size: 32px;
  font-weight: 400;
  line-height: 1.3;
}

.lb-hero__title {
  margin: 0;
  font-family: var(--lb-font-serif);
  font-size: 32px;
  font-weight: 400;
  line-height: 1.3;
}

/* ——— Accueil bloc 3 : tuiles ——— */
.lb-tiles-strip {
  background: var(--lb-bg);
  padding: 16px 0;
  min-height: 444px;
}

.lb-tiles {
  display: grid;
  grid-template-columns: 426px 426px;
  justify-content: space-between;
  gap: 24px;
  padding-top: 8px;
}

.lb-tile__media {
  position: relative;
  display: block;
  overflow: hidden;
  line-height: 0;
}

.lb-tile__media img {
  width: 426px;
  max-width: 100%;
  height: 281px;
  display: block;
  object-fit: cover;
}

.lb-tile__label {
  position: absolute;
  font-family: var(--lb-font-serif);
  font-weight: 700;
  font-size: 32px;
  line-height: 1.3;
  text-decoration: underline;
  text-underline-offset: 4px;
  color: var(--lb-text);
}

.lb-tile__label--center {
  left: 40%;
  top: 78%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}

.lb-tile__labels {
  position: absolute;
  left: 5%;
  top: 4%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.lb-tile__label--world,
.lb-tile__label--visual {
  position: static;
  transform: none;
}

.lb-tile__caption {
  margin: 16px 0 0;
  text-align: center;
  font-size: 16px;
  line-height: 1.3;
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
}

/* ——— Pages intérieures ——— */
.lb-page-shell {
  position: relative;
  background-color: var(--lb-bg);
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
}

.lb-page-banner {
  max-width: var(--lb-max);
  margin: 0 auto;
  padding: 0 16px;
}

.lb-page-banner--hub {
  position: relative;
  max-width: var(--lb-max);
  margin: 0 auto 24px;
  padding: 0 16px;
}

.lb-page-banner--hub img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 165px;
  max-height: 341px;
  object-fit: cover;
  object-position: center;
}

.lb-page-banner__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  padding: 24px 48px;
  text-align: right;
  pointer-events: none;
}

.lb-page-banner__overlay .lb-page-intro {
  margin: 0;
  padding: 0;
  max-width: 420px;
}

.lb-page-banner__overlay .lb-page-heading {
  display: block;
  margin: 0 0 12px;
  font-family: var(--lb-font-serif);
  font-weight: 700;
  font-size: 48px;
  line-height: 1.3;
  color: #9af20d;
  text-align: right;
}

.lb-page-banner__overlay .lb-page-kicker {
  display: none;
}

.lb-page-banner__overlay .lb-page-tagline {
  margin: 0;
  font-size: 24px;
  line-height: 1.3;
  text-align: right;
  color: var(--lb-text);
  font-style: normal;
}

.lb-page-banner--story img {
  display: block;
  width: 100%;
  max-height: 320px;
  object-fit: cover;
  object-position: center 40%;
  margin-bottom: 16px;
}

.lb-page {
  max-width: var(--lb-max);
  margin: 0 auto;
  padding: 0 16px 48px;
}

.lb-page-intro {
  max-width: var(--lb-max);
  margin: 0 auto 24px;
  padding: 0 16px;
}

.lb-page-kicker {
  margin: 0 0 8px;
  font-family: var(--lb-font-serif);
  font-weight: 300;
  font-size: 56px;
  line-height: 1.3;
  text-transform: uppercase;
  text-align: left;
}

.lb-page-tagline {
  margin: 0 0 16px;
  font-family: var(--lb-font-serif);
  font-size: 16px;
  line-height: 1.3;
  text-align: center;
}

.lb-page-heading {
  margin: 0 0 32px;
  font-family: var(--lb-font-serif);
  font-weight: 700;
  font-size: 32px;
  line-height: 1.3;
  text-align: center;
}

.lb-page__content {
  max-width: 715px;
  margin-left: auto;
}

.lb-prose h2,
.lb-prose h2 a {
  font-family: var(--lb-font-serif);
  font-weight: 400;
  font-size: 40px;
  line-height: 1.3;
  color: var(--lb-gold);
  text-decoration: underline;
  text-underline-offset: 4px;
  margin: 2rem 0 0.75rem;
}

.lb-prose h2 a:hover {
  opacity: 0.9;
}

.lb-prose h3 {
  font-family: var(--lb-font-serif);
  font-size: 32px;
  font-weight: 400;
  line-height: 1.3;
  margin: 1.5rem 0 0.75rem;
}

.lb-prose p {
  margin: 0 0 1rem;
  font-size: 16px;
  line-height: 1.72;
}

.lb-prose .lb-callout {
  margin: 2rem 0;
  text-align: center;
  font-family: var(--lb-font-serif);
  font-size: 24px;
  line-height: 1.3;
  color: #9af20d;
}

.lb-prose .lb-callout strong {
  font-weight: 700;
}

.lb-prose a:not(.wp-block-button__link) {
  color: var(--lb-gold);
  text-underline-offset: 3px;
}

.lb-prose img {
  max-width: 100%;
  height: auto;
}

.lb-fr-covers {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  justify-content: center;
  margin: 48px auto 0;
  max-width: 715px;
}

.lb-fr-cover {
  margin: 0;
  max-width: 280px;
  text-align: center;
}

.lb-fr-cover img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 12px;
}

.lb-fr-cover figcaption {
  font-size: 14px;
  line-height: 1.4;
}

.lb-fr-cover a {
  color: var(--lb-gold);
  text-decoration: underline;
}

/* Legacy page title (non utilisé sur hubs) */
.lb-page__title {
  font-family: var(--lb-font-serif);
  font-weight: 300;
  font-size: 56px;
  text-transform: uppercase;
  line-height: 1.3;
  margin: 0 0 1.5rem;
}

/* ——— Footer ——— */
.lb-footer__bar {
  background: var(--lb-bg-footer);
  padding: 16px 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.lb-footer__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
}

.lb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 53px;
  padding: 14px 40px;
  border-radius: 22px;
  font-weight: 700;
  font-size: 18px;
  text-decoration: none;
}

.lb-btn--whatsapp {
  background: #9af20d;
  color: #001233;
  border: 5px solid #ffca2e;
}

.lb-btn--email {
  background: #fff;
  color: #255fc9;
  border: 4px solid #ff2e2e;
}

.lb-footer__kofi {
  margin: 0;
  font-size: 18px;
  max-width: 421px;
  text-align: left;
  flex: 1 1 280px;
}

.lb-footer__kofi a {
  color: var(--lb-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ——— Mobile ——— */
@media (max-width: 960px) {
  .lb-tiles {
    grid-template-columns: 1fr;
    justify-content: center;
  }

  .lb-tile__media img {
    width: 100%;
    height: auto;
    aspect-ratio: 426 / 281;
  }
}

@media (max-width: 768px) {
  .lb-header__inner {
    grid-template-columns: 1fr auto;
    padding: 16px;
    min-height: auto;
  }

  .lb-logo { grid-column: 1; justify-self: start; }

  .lb-logo img { width: 79px; }

  .lb-social {
    position: static;
    grid-column: 1 / -1;
    justify-content: center;
    order: 4;
  }

  .lb-nav-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }

  .lb-nav-toggle__bar {
    width: 22px;
    height: 2px;
    background: var(--lb-text);
    box-shadow: 0 6px 0 var(--lb-text), 0 -6px 0 var(--lb-text);
  }

  .lb-nav-toggle__label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
  }

  .lb-nav {
    display: none;
    grid-column: 1 / -1;
  }

  .lb-nav.is-open { display: block; }

  .lb-nav__list {
    flex-direction: column;
    align-items: flex-end;
    gap: 11px;
    padding: 8px 0 16px;
  }

  .lb-nav__link { font-size: 16px; }

  .lb-hero-strip {
    background-attachment: scroll;
    min-height: 49px;
  }

  .lb-hero-strip__inner {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .lb-hero__name { font-size: 24px; }

  .lb-hero__right {
    align-items: flex-end;
    text-align: right;
  }

  .lb-hero__tagline,
  .lb-hero__title { font-size: 18px; }

  .lb-tiles-strip { min-height: 665px; }

  .lb-tile__label { font-size: 24px; }

  .lb-tile__caption { font-size: 14px; }

  .lb-footer__bar {
    flex-direction: column;
    align-items: stretch;
    padding: 40px 16px;
  }

  .lb-footer__kofi {
    text-align: center;
    font-size: 14px;
  }

  .lb-page-kicker { font-size: 24px; }

  .lb-prose h2,
  .lb-prose h2 a { font-size: 24px; }

  .lb-btn { font-size: 14px; min-height: 42px; padding: 14px 36px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .lb-hero-strip { background-attachment: scroll; }
}