/*
 * WeWorkWeb content typography system.
 * Reference scale approved by Ayoub on 2026-07-12.
 * Loaded last so page-specific and component rules cannot fragment the hierarchy.
 */

:root {
  --ww-type-h1: clamp(2.5rem, 4vw, 3.75rem);
  --ww-type-h2: clamp(2rem, 3.1vw, 3rem);
  --ww-type-h3: clamp(1.5rem, 2.25vw, 2.25rem);
  --ww-type-h4: clamp(1.125rem, 1.6vw, 1.5rem);
  --ww-type-body: clamp(1rem, 1.1vw, 1.125rem);
  --ww-type-button: clamp(0.875rem, 1vw, 1.125rem);
  --ww-type-small: clamp(0.75rem, 0.9vw, 0.875rem);
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page h1 {
  font-size: var(--ww-type-h1) !important;
  font-variation-settings: "wght" 500 !important;
  font-weight: 500 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.05 !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page h2 {
  font-size: var(--ww-type-h2) !important;
  font-variation-settings: "wght" 500 !important;
  font-weight: 500 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.1 !important;
}

/* Le bandeau cookies est un composant compact, pas un titre de section. */
html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page .cookie-banner__copy h2 {
  font-size: clamp(1rem, 2vw, 1.25rem) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page h3 {
  font-size: var(--ww-type-h3) !important;
  font-variation-settings: "wght" 500 !important;
  font-weight: 500 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.18 !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page :is(h4, h5, h6) {
  font-size: var(--ww-type-h4) !important;
  font-variation-settings: "wght" 500 !important;
  font-weight: 500 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.25 !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page p {
  font-size: var(--ww-type-body) !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page :is(
  button,
  [role="button"],
  .btn,
  .button,
  [class*="-btn"],
  [class*="__btn"],
  a[class*="button"],
  a[class*="cta"],
  a[data-cta-location],
  input[type="button"],
  input[type="submit"]
) {
  font-size: var(--ww-type-button) !important;
  line-height: 1.2 !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page :is(
  small,
  figcaption,
  .eyebrow,
  [class*="kicker"],
  [class*="caption"],
  [class*="microcopy"],
  .form-help,
  .legal-note
) {
  font-size: var(--ww-type-small) !important;
  line-height: 1.5 !important;
}

/* Le chatbot est un composant compact, pas une section éditoriale. */
html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page .www-chatbot__header h2 {
  font-size: 0.94rem !important;
  font-variation-settings: "wght" 500 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.08 !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page .www-chatbot__header .www-chatbot__status {
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.25 !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page .mini-experience__contact h3 {
  font-size: clamp(1.35rem, 2vw, 1.8rem) !important;
  font-variation-settings: "wght" 500 !important;
  font-weight: 500 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.08 !important;
}

html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page .mini-experience__contact header p {
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
}

/* Two complete desktop paragraphs become one authored summary on mobile. */
html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page .mobile-copy-pair__summary {
  display: none !important;
}

@media (max-width: 760px) {
  :root {
    --ww-type-h1: clamp(2rem, 9vw, 2.5rem);
    --ww-type-h2: clamp(1.625rem, 7.5vw, 2.125rem);
    --ww-type-h3: clamp(1.375rem, 6vw, 1.75rem);
    --ww-type-h4: clamp(1rem, 5vw, 1.25rem);
    --ww-type-body: clamp(0.94rem, 4vw, 1rem);
    --ww-type-button: clamp(0.875rem, 4vw, 1.125rem);
    --ww-type-small: clamp(0.75rem, 3.2vw, 0.875rem);
  }

  html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page p {
    line-height: 1.58 !important;
  }

  html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page .mobile-copy-pair__original {
    display: none !important;
  }

  html body.site-page.site-page.site-page.site-page.site-page.site-page.site-page.site-page .mobile-copy-pair__summary {
    display: block !important;
    font-size: var(--ww-type-body) !important;
    line-height: 1.58 !important;
    margin-inline: auto !important;
    max-width: 34ch !important;
    text-wrap: pretty !important;
  }
}

/* Homepage desktop polish: balanced proof block and two-line titles. */
@media (min-width: 761px) {
  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__inner {
    max-width: min(1320px, calc(100vw - clamp(48px, 6vw, 112px))) !important;
    width: 100% !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger {
    align-items: center !important;
    background:
      radial-gradient(circle at 0% 0%, rgba(81, 221, 255, 0.12), transparent 25rem),
      radial-gradient(circle at 100% 100%, rgba(25, 245, 186, 0.1), transparent 28rem),
      linear-gradient(145deg, #0a1d2d 0%, #05111f 58%, #061725 100%) !important;
    border: 1px solid rgba(112, 190, 229, 0.28) !important;
    border-radius: 24px !important;
    box-shadow:
      0 28px 80px rgba(1, 12, 24, 0.2),
      inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
    display: grid !important;
    gap: clamp(30px, 3.2vw, 58px) !important;
    grid-template-columns: minmax(0, 1.22fr) minmax(310px, 0.94fr) minmax(250px, 0.78fr) !important;
    inset: auto !important;
    margin-inline: auto !important;
    max-width: none !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: clamp(46px, 4.2vw, 72px) !important;
    position: relative !important;
    transform: none !important;
    width: 100% !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger > div {
    align-items: flex-start !important;
    display: grid !important;
    gap: 14px !important;
    justify-items: start !important;
    min-width: 0 !important;
    text-align: left !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger .magic-proof-layer__eyebrow {
    color: #52dcff !important;
    letter-spacing: 0.04em !important;
    margin: 0 !important;
    max-width: none !important;
    text-align: left !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger h3 {
    color: #f7fbff !important;
    font-size: clamp(2.25rem, 2.7vw, 3.15rem) !important;
    letter-spacing: -0.045em !important;
    line-height: 1.03 !important;
    margin: 0 !important;
    max-width: 20ch !important;
    text-align: left !important;
    text-wrap: balance !important;
    white-space: normal !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger p:not(.magic-proof-layer__eyebrow) {
    color: rgba(219, 232, 247, 0.72) !important;
    line-height: 1.55 !important;
    margin: 0 !important;
    max-width: 36rem !important;
    text-align: left !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger ul {
    align-content: center !important;
    display: grid !important;
    gap: 0 !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger li {
    border-top: 1px solid rgba(134, 194, 226, 0.16) !important;
    color: #f1f7ff !important;
    font-size: clamp(1rem, 1.05vw, 1.12rem) !important;
    line-height: 1.38 !important;
    margin: 0 !important;
    padding: 15px 0 !important;
    text-align: left !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger li:last-child {
    border-bottom: 1px solid rgba(134, 194, 226, 0.16) !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger li::before,
  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger li::after {
    content: none !important;
    display: none !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger > a {
    align-items: center !important;
    align-self: center !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    justify-content: center !important;
    justify-self: stretch !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    min-height: 56px !important;
    padding: 0.9rem 1.25rem !important;
    text-align: center !important;
    width: 100% !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-faq__heading {
    margin-inline: auto !important;
    max-width: min(1320px, calc(100vw - clamp(48px, 6vw, 112px))) !important;
    padding-inline: 0 !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-faq__heading h2 {
    font-size: clamp(2.75rem, 4.6vw, 4.8rem) !important;
    line-height: 0.98 !important;
    margin-inline: auto !important;
    max-width: 21ch !important;
    text-wrap: balance !important;
    white-space: normal !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-faq__heading p {
    margin-inline: auto !important;
    max-width: 68rem !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-offer-carousel__dots,
  html body.site-page.page-home.magic-scroll-active .magic-home-v3 .magic-offer-carousel__dots {
    display: none !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger {
    gap: 26px 38px !important;
    grid-template-areas:
      "copy proof"
      "copy action" !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr) !important;
    padding: clamp(38px, 5vw, 56px) !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger > div {
    grid-area: copy !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger > ul {
    grid-area: proof !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger > a {
    grid-area: action !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger h3 {
    font-size: clamp(2.15rem, 4.2vw, 2.8rem) !important;
    max-width: 18ch !important;
  }
}

@media (max-width: 760px) {
  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger ul {
    gap: 0 !important;
    list-style: none !important;
    padding: 0 !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger li {
    border-top: 1px solid rgba(134, 194, 226, 0.16) !important;
    margin: 0 !important;
    padding: 14px 0 !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger li:last-child {
    border-bottom: 1px solid rgba(134, 194, 226, 0.16) !important;
  }

  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger li::before,
  html body.site-page.page-home .magic-home-v3 .magic-proof-layer__ledger li::after {
    content: none !important;
    display: none !important;
  }
}
