/* HILO Beauty Studio - legal / prose pages (aviso de privacidad).
   No Figma frame exists for this page, so it reuses the servicios page header
   and adds a single readable prose column on the same token system. */

.legal {
  padding: 0 var(--gutter) 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* the container matches the rest of the site so the prose lines up with the
   page title above it, rather than floating in the middle of the viewport */
.legal__inner {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
}

.legal__prose {
  max-width: 760px;      /* comfortable measure for long-form reading */
}

.legal__note {
  margin-bottom: 32px;
  padding: 20px 24px;
  border-radius: var(--r-22);
  background: var(--rose-47-10);
  color: var(--rose-25);
  font-size: var(--fs-body-sm);
  line-height: 1.6;
}
.legal__note b { color: var(--rose-24); }

.legal__prose h2 {
  margin-top: 40px;
  font-family: var(--font-display);
  font-size: var(--fs-h3-detail);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: var(--ls-h3-detail);
  color: var(--rose-7);
}
.legal__prose h2:first-of-type { margin-top: 0; }

.legal__prose h3 {
  margin-top: 26px;
  font-family: var(--font-ui);
  font-size: var(--fs-body);
  font-weight: 600;
  line-height: 1.4;
  color: var(--rose-7);
}

.legal__prose p,
.legal__prose li {
  color: var(--magenta-24);
  font-size: var(--fs-body);
  line-height: 1.75;
}
.legal__prose p { margin-top: 14px; }

.legal__prose ul {
  margin-top: 14px;
  padding-left: 22px;
  list-style: disc;
}
.legal__prose li { margin-top: 8px; }

.legal__prose a {
  color: var(--rose-47);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.legal__prose a:hover { color: var(--rose-25); }

.legal__updated {
  margin-top: 40px;
  padding-top: 22px;
  border-top: 1px solid var(--rose-7-10);
  color: var(--grey-45);
  font-size: var(--fs-micro);
}

@media (max-width: 560px) {
  .legal { padding-bottom: 56px; }
  .legal__note { padding: 16px 18px; }
}