/**
 * Shared legal-page shell — hero + document layout used by Terms, Cookie
 * Policy, and any future long-form legal pages.
 *
 * Matches React WebsiteLegalPageTemplate.
 */

/* ------------------------------------------------------------------ hero */

/*
 * React: WebsiteSection spacing="standard" + pt-[168px] md:pt-[188px]
 * (clears the fixed header from the viewport top).
 *
 * On WordPress the chrome spacer already reserves header height in flow
 * (7.5rem/124px, or 5rem/84px when the announce strip is gone). Only the
 * remainder belongs on the hero so breadcrumbs sit at the same viewport
 * offset as React (168 / 188px from the top of the screen).
 */
.rq-page .rq-legal-hero.e-con,
.rq-page .rq-legal-hero {
  --padding-block-start: calc(168px - 7.5rem);
  --padding-block-end: 3.5rem; /* pb-14 */
  --padding-inline-start: 0px;
  --padding-inline-end: 0px;
  --gap: 0px;
  padding-block-start: calc(168px - 7.5rem);
  padding-block-end: 3.5rem;
  padding-inline: 0;
}

.rq-page .rq-legal-hero__crumbs {
  /* Breadcrumb slot — styling from rq-breadcrumbs.css */
}

@media (min-width: 768px) {
  .rq-page .rq-legal-hero.e-con,
  .rq-page .rq-legal-hero {
    --padding-block-start: calc(188px - 124px);
    --padding-block-end: 5rem; /* pb-20 */
    padding-block-start: calc(188px - 124px);
    padding-block-end: 5rem;
  }
}

/* Announce dismissed — spacer is shorter; keep the same viewport offset. */
body:has(.rq-announce[hidden]) .rq-page .rq-legal-hero.e-con,
body:has(.rq-announce[hidden]) .rq-page .rq-legal-hero,
body:has(.rq-announce.is-dismissed) .rq-page .rq-legal-hero.e-con,
body:has(.rq-announce.is-dismissed) .rq-page .rq-legal-hero {
  --padding-block-start: calc(168px - 5rem);
  padding-block-start: calc(168px - 5rem);
}

@media (min-width: 768px) {
  body:has(.rq-announce[hidden]) .rq-page .rq-legal-hero.e-con,
  body:has(.rq-announce[hidden]) .rq-page .rq-legal-hero,
  body:has(.rq-announce.is-dismissed) .rq-page .rq-legal-hero.e-con,
  body:has(.rq-announce.is-dismissed) .rq-page .rq-legal-hero {
    --padding-block-start: calc(188px - 84px);
    padding-block-start: calc(188px - 84px);
  }
}

/* Crumbs + copy stack — React mt-12 between breadcrumbs and copy block. */
.rq-page .rq-legal-hero > .rq-container.e-con,
.rq-page .rq-legal-hero > .rq-container {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  row-gap: 3rem; /* mt-12 */
  --gap: 3rem;
  gap: 3rem;
}

.rq-page .rq-legal-hero__copy.e-con,
.rq-page .rq-legal-hero__copy {
  --margin-block-start: 0px;
  --width: 100%;
  --gap: 0px;
  margin-block-start: 0; /* gap on parent owns the crumbs→copy space */
  max-width: 56rem; /* max-w-4xl */
  width: 100%;
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  row-gap: 0;
  gap: 0;
}

/* Eyebrow → h1: React mt-5. Put margin on the widget wrapper, not the inner title. */
.rq-page .rq-legal-hero .rq-legal-hero__title.rq-h1,
.rq-page .rq-legal-hero .rq-h1.rq-legal-hero__title {
  margin-block-start: 1.25rem;
}

.rq-page .rq-legal-hero__title.rq-h1 .elementor-heading-title,
.rq-page .rq-legal-hero .rq-h1 .elementor-heading-title {
  margin: 0;
  font-size: 26px;
  font-weight: 600;
  line-height: 1.02;
  color: var(--rq-foreground);
}

@media (min-width: 640px) {
  .rq-page .rq-legal-hero .rq-h1 .elementor-heading-title {
    font-size: 3rem; /* sm:text-5xl */
  }
}

@media (min-width: 768px) {
  .rq-page .rq-legal-hero .rq-h1 .elementor-heading-title {
    font-size: 3.75rem; /* md:text-6xl */
  }
}

@media (min-width: 1024px) {
  .rq-page .rq-legal-hero .rq-h1 .elementor-heading-title {
    font-size: 4.5rem; /* lg:text-7xl */
  }
}

/* h1 → intro: React mt-6 */
.rq-page .rq-legal-hero .rq-legal-hero__intro {
  margin-block-start: 1.5rem;
}

.rq-page .rq-legal-hero__intro,
.rq-page .rq-legal-hero__intro p {
  max-width: 42rem; /* max-w-2xl */
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.625;
  color: color-mix(in oklab, var(--rq-foreground) 70%, transparent);
}

@media (min-width: 768px) {
  .rq-page .rq-legal-hero__intro,
  .rq-page .rq-legal-hero__intro p {
    font-size: 1.125rem;
  }
}

/* --------------------------------------------------------------- document */

.rq-page .rq-legal-doc .rq-contents > .elementor-widget-container {
  display: contents;
}

.rq-page .rq-legal-doc__layout {
  display: grid;
  gap: 3rem;
}

@media (min-width: 1024px) {
  .rq-page .rq-legal-doc__layout {
    grid-template-columns: 260px minmax(0, 760px);
    gap: 5rem; /* lg:gap-20 */
  }
}

@media (min-width: 1280px) {
  .rq-page .rq-legal-doc__layout {
    gap: 7rem; /* xl:gap-28 */
  }
}

/* Sticky contents rail */

.rq-page .rq-legal-doc__nav-label {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rq-foreground);
}

.rq-page .rq-legal-doc__nav-list {
  list-style: none;
  margin: 1.25rem 0 0;
  padding: 0;
  border-top: 1px solid var(--rq-border);
}

.rq-page .rq-legal-doc__nav-item {
  border-bottom: 1px solid var(--rq-border);
}

.rq-page .rq-legal-doc__nav-link {
  display: flex;
  align-items: center;
  min-height: 2.75rem; /* min-h-11 */
  padding-block: 0.75rem;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  color: color-mix(in oklab, var(--rq-foreground) 70%, transparent);
  text-decoration: none;
  transition: color 150ms ease;
}

.rq-page .rq-legal-doc__nav-link:hover,
.rq-page .rq-legal-doc__nav-link:focus-visible {
  color: var(--rq-foreground);
}

@media (min-width: 1024px) {
  .rq-page .rq-legal-doc__nav {
    position: sticky;
    top: 9rem; /* lg:top-36 */
    align-self: start;
  }
}

/* Article sections */

.rq-page .rq-legal-doc__article {
  min-width: 0;
}

.rq-page .rq-legal-doc__section {
  scroll-margin-top: 9rem; /* scroll-mt-36 */
  border-top: 1px solid var(--rq-border);
  padding-block: 2rem; /* py-8 */
}

.rq-page .rq-legal-doc__section:first-child {
  border-top: none;
  padding-block-start: 0;
}

@media (min-width: 768px) {
  .rq-page .rq-legal-doc__section {
    padding-block: 2.5rem; /* md:py-10 */
  }

  .rq-page .rq-legal-doc__section:first-child {
    padding-block-start: 0;
  }
}

.rq-page .rq-legal-doc__heading {
  margin: 0;
  font-size: 1.5rem; /* text-2xl */
  font-weight: 600;
  line-height: 1.25;
  color: var(--rq-foreground);
}

@media (min-width: 768px) {
  .rq-page .rq-legal-doc__heading {
    font-size: 1.875rem; /* md:text-3xl */
  }
}

.rq-page .rq-legal-doc__p,
.rq-page .rq-legal-doc__lead {
  margin: 1.25rem 0 0; /* mt-5 */
  font-size: 1rem;
  font-weight: 400;
  line-height: 2; /* leading-8 */
  color: color-mix(in oklab, var(--rq-foreground) 70%, transparent);
}

.rq-page .rq-legal-doc__item > .rq-legal-doc__lead {
  margin-block-start: 0;
}

/* Inline links — React WebsiteLegalInlineText */
.rq-page .rq-legal-doc__link {
  color: var(--rq-foreground);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.rq-page .rq-legal-doc__link:hover,
.rq-page .rq-legal-doc__link:focus-visible {
  text-decoration-thickness: 2px;
}

/* Bullet list */

.rq-page .rq-legal-doc__bullets {
  list-style: disc;
  margin: 1.25rem 0 0;
  padding-inline-start: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  font-size: 1rem;
  line-height: 2;
  color: color-mix(in oklab, var(--rq-foreground) 70%, transparent);
}

.rq-page .rq-legal-doc__bullet {
  /* list item — inherits type from parent ul */
}

/* Numbered items with absolute counters */

.rq-page .rq-legal-doc__list {
  list-style: none;
  margin: 1.25rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1.5rem; /* space-y-6 */
  font-size: 1rem;
  line-height: 2;
  color: color-mix(in oklab, var(--rq-foreground) 70%, transparent);
}

.rq-page .rq-legal-doc__item {
  position: relative;
  padding-inline-start: 1.75rem; /* pl-7 */
}

.rq-page .rq-legal-doc__counter {
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 500;
  color: var(--rq-foreground);
}

.rq-page .rq-legal-doc__sublist {
  list-style: none;
  margin: 0.75rem 0 0; /* mt-3 */
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem; /* space-y-2 */
}

.rq-page .rq-legal-doc__subitem {
  position: relative;
  padding-inline-start: 1.75rem;
}