/* =====================================================================
   Modirify legal pages — design system (ADR-145 v2 / 2026-06-02)
   ---------------------------------------------------------------------
   These four static HTML pages (privacy / terms / billing-policy /
   data-deletion + EN siblings) live OUTSIDE the React bundle so they
   stay reachable when the SPA is broken. That means we cannot share
   styles.css. Instead this file mirrors the landing's `.lp-*` design
   system VERBATIM so the visual identity carries seamlessly from `/`
   to `/privacy/` and back. Same nav, same hero (with animated blobs +
   grid overlay), same section cards, same dark navy footer, same
   gradient accent.
   Source of truth: `.lp-*` block in app/styles.css (~lines 12968-13700
   and the 1024 / 768 / 480 media queries near 14285-14330). When the
   landing's tone changes, update both here and there.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800;900&display=swap');

:root {
  --lp-max: 1220px;
  --lp-gap: 24px;
  --lp-accent: #0ea5b7;
  --lp-accent-dark: #0a8a99;
  --lp-success: #22c55e;
  --bg: #f4f7fa;
  --bg-elevated: #ffffff;
  --bg-subtle: #eef3f8;
  --text-primary: #0f1f2e;
  --text-secondary: #4a5b6d;
  --text-tertiary: #8a98a8;
  --border: #e4ebf2;
  --border-subtle: #e4ebf2;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --lift-1: -1px;
  --lift-2: -2px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  color: var(--text-primary);
  font-family: 'Cairo', 'Tajawal', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 400;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { color: var(--lp-accent-dark); text-decoration: none; transition: color 160ms; }
a:hover { color: var(--lp-accent); }

img { max-width: 100%; height: auto; display: block; }

/* ===== Sticky nav (mirrors .lp-nav from styles.css) ===== */
.lp-nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, 0.78);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid transparent;
  transition: all 280ms var(--ease-out);
}
.lp-nav.is-scrolled {
  background: rgba(255, 255, 255, 0.92);
  border-bottom-color: var(--border-subtle);
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
}
.lp-nav-inner {
  max-width: var(--lp-max); margin: 0 auto;
  padding: 14px 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
}
.lp-nav-brand { display: flex; align-items: center; }
.lp-nav-brand img {
  display: block;
  height: 80px; width: auto; max-width: 220px;
  object-fit: cover;
  object-position: center 41%;
}
.lp-nav-links {
  display: flex; align-items: center; gap: 28px; flex: 1 1 auto; justify-content: center;
}
.lp-nav-links a {
  font-size: 14px; font-weight: 700; color: var(--text-secondary);
  cursor: pointer;
}
.lp-nav-links a:hover { color: var(--lp-accent); }
.lp-nav-links a.is-active {
  color: var(--lp-accent);
  position: relative;
}
.lp-nav-links a.is-active::after {
  content: ''; position: absolute;
  inset-inline-start: 0; bottom: -6px;
  width: 100%; height: 2px;
  background: linear-gradient(90deg, var(--lp-accent), var(--lp-success));
  border-radius: 2px;
}
.lp-nav-actions { display: flex; gap: 10px; align-items: center; }
.lp-nav-login {
  background: transparent; border: none; cursor: pointer;
  font-size: 14px; font-weight: 700; color: var(--text-primary);
  padding: 8px 14px; border-radius: 999px;
  transition: all 160ms;
}
.lp-nav-login:hover { background: var(--bg-subtle); color: var(--lp-accent); }
.lp-nav-cta {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, var(--lp-accent) 0%, var(--lp-accent-dark) 100%);
  color: #fff !important; border: none; cursor: pointer;
  font-size: 14px; font-weight: 800;
  padding: 10px 18px; border-radius: 999px;
  box-shadow: 0 6px 18px rgba(14, 165, 183, 0.28);
  transition: all 200ms var(--ease-out);
}
.lp-nav-cta:hover {
  transform: translateY(var(--lift-1));
  box-shadow: 0 10px 24px rgba(14, 165, 183, 0.4);
  color: #fff !important;
}

/* Language toggle pill in nav */
.lp-nav-lang {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255, 255, 255, 0.7);
  color: var(--text-primary) !important;
  border: 1.5px solid var(--border);
  cursor: pointer;
  font-size: 13px; font-weight: 800;
  padding: 8px 14px; border-radius: 999px;
  backdrop-filter: blur(8px);
  transition: all 200ms var(--ease-out);
}
.lp-nav-lang:hover {
  border-color: var(--lp-accent);
  color: var(--lp-accent) !important;
  transform: translateY(var(--lift-1));
}

/* ===== Hero (mirrors .lp-hero with animated blobs + grid overlay) ===== */
.lp-hero {
  position: relative; overflow: hidden;
  padding: 90px 24px 110px;
  background:
    radial-gradient(ellipse at 80% 20%, rgba(14, 165, 183, 0.08) 0%, transparent 55%),
    radial-gradient(ellipse at 20% 70%, rgba(34, 197, 94, 0.06) 0%, transparent 55%);
}
.lp-hero-blob {
  position: absolute; border-radius: 50%; filter: blur(80px);
  pointer-events: none; z-index: 0; opacity: 0.55;
  animation: lpFloat 18s ease-in-out infinite;
}
.lp-hero-blob--1 {
  width: 520px; height: 520px; top: -180px; right: -160px;
  background: radial-gradient(circle, var(--lp-accent) 0%, transparent 70%);
  animation-delay: -3s;
}
.lp-hero-blob--2 {
  width: 420px; height: 420px; bottom: -160px; left: -120px;
  background: radial-gradient(circle, var(--lp-success) 0%, transparent 70%);
  animation-delay: -9s;
}
.lp-hero-grid {
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    linear-gradient(rgba(14, 165, 183, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14, 165, 183, 0.05) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 70%);
}
.lp-hero-inner {
  position: relative; z-index: 1;
  max-width: var(--lp-max); margin: 0 auto;
  text-align: center;
}
.lp-hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 16px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(14, 165, 183, 0.32);
  color: var(--lp-accent);
  font-size: 12px; font-weight: 800;
  margin-bottom: 24px;
  animation: lpFadeIn 0.6s var(--ease-out) both;
}
.lp-hero-title {
  font-size: clamp(36px, 5.2vw, 58px);
  font-weight: 900; line-height: 1.12;
  margin: 0 0 22px; letter-spacing: -0.025em;
  animation: lpFadeIn 0.7s var(--ease-out) 0.1s both;
  max-width: 820px; margin-inline: auto;
}
.lp-hero-accent {
  background: linear-gradient(120deg, var(--lp-accent) 0%, var(--lp-success) 100%);
  background-clip: text; -webkit-background-clip: text;
  color: transparent; -webkit-text-fill-color: transparent;
  position: relative; display: inline;
}
.lp-hero-sub {
  font-size: clamp(15px, 1.5vw, 18px);
  color: var(--text-secondary); line-height: 1.85;
  max-width: 680px; margin: 0 auto 28px;
  animation: lpFadeIn 0.8s var(--ease-out) 0.2s both;
}
.lp-hero-meta {
  display: inline-flex; gap: 10px; flex-wrap: wrap;
  justify-content: center;
  animation: lpFadeIn 0.9s var(--ease-out) 0.3s both;
}
.lp-hero-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(8px);
  border: 1px solid var(--border-subtle);
  font-size: 12.5px; font-weight: 800;
  color: var(--text-secondary);
}
.lp-hero-chip svg { color: var(--lp-accent); }

/* ===== Section frames (mirrors .lp-section) ===== */
.lp-section {
  max-width: var(--lp-max); margin: 0 auto;
  padding: 90px 24px;
}
.lp-section--tight { padding: 60px 24px; }
.lp-section-header {
  text-align: center;
  margin-bottom: 56px;
}
.lp-section-eyebrow {
  display: inline-block;
  font-size: 13px; font-weight: 800; color: var(--lp-accent);
  letter-spacing: 0.12em; text-transform: uppercase;
  margin-bottom: 14px;
}
.lp-section-title {
  font-size: clamp(28px, 3.6vw, 42px);
  font-weight: 900; line-height: 1.2;
  margin: 0 0 16px; letter-spacing: -0.02em;
}
.lp-section-sub {
  font-size: 16px; color: var(--text-secondary);
  max-width: 680px; margin: 0 auto;
  line-height: 1.8;
}

/* ===== Legal layout: TOC sidebar + content (custom for legal) ===== */
.lp-legal-layout {
  max-width: var(--lp-max); margin: 0 auto;
  padding: 0 24px 60px;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}
.lp-legal-toc {
  position: sticky; top: 96px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 22px 20px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.04);
}
.lp-legal-toc__title {
  font-size: 12px; font-weight: 800;
  color: var(--lp-accent);
  text-transform: uppercase; letter-spacing: 0.12em;
  margin-bottom: 14px;
}
.lp-legal-toc a {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 0;
  color: var(--text-secondary);
  font-size: 13.5px; font-weight: 600;
  border-top: 1px solid var(--border-subtle);
  transition: color 160ms, padding 160ms;
}
.lp-legal-toc a:first-of-type { border-top: 0; }
.lp-legal-toc a::before {
  content: ''; display: inline-block;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--border);
  transition: background 160ms, transform 160ms;
}
.lp-legal-toc a:hover {
  color: var(--lp-accent);
  padding-inline-start: 4px;
}
.lp-legal-toc a:hover::before {
  background: var(--lp-accent);
  transform: scale(1.4);
}
.lp-legal-content { min-width: 0; }

/* Content card containing all sections (mirrors .lp-feature-card tone) */
.lp-legal-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 24px;
  padding: 40px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.05);
  position: relative; overflow: hidden;
}
.lp-legal-card::before {
  content: ''; position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--lp-accent) 0%, var(--lp-success) 100%);
}

.lp-legal-section + .lp-legal-section {
  margin-top: 36px;
  padding-top: 36px;
  border-top: 1px solid var(--border-subtle);
}
.lp-legal-section h2 {
  font-size: 24px; font-weight: 900;
  line-height: 1.35; letter-spacing: -0.01em;
  margin: 0 0 14px;
  display: flex; align-items: center; gap: 12px;
}
.lp-legal-section h2 .lp-legal-num {
  display: inline-grid; place-items: center;
  width: 34px; height: 34px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--lp-accent) 0%, var(--lp-accent-dark) 100%);
  color: #fff;
  font-size: 14px; font-weight: 900;
  flex-shrink: 0;
}
.lp-legal-section h3 {
  font-size: 16px; font-weight: 800; color: var(--lp-accent-dark);
  margin: 24px 0 8px;
}
.lp-legal-section p {
  margin: 0 0 14px;
  font-size: 15px; line-height: 1.95;
  color: var(--text-secondary);
}
.lp-legal-section ul,
.lp-legal-section ol {
  margin: 12px 0 0;
  padding-inline-start: 24px;
  color: var(--text-secondary);
  font-size: 15px; line-height: 1.95;
}
.lp-legal-section li { margin: 8px 0; }
.lp-legal-section li strong { color: var(--text-primary); font-weight: 800; }

/* Info note / warning note (mirrors landing's accent treatment) */
.lp-legal-note {
  margin: 18px 0;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid rgba(14, 165, 183, 0.25);
  background: linear-gradient(135deg, rgba(14, 165, 183, 0.08) 0%, rgba(14, 165, 183, 0.02) 100%);
  color: var(--text-primary);
  font-weight: 600;
  font-size: 14px;
  line-height: 1.85;
}
.lp-legal-note--warn {
  border-color: rgba(245, 158, 11, 0.35);
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.1) 0%, rgba(245, 158, 11, 0.02) 100%);
}

/* Inline action buttons in sections (mirrors .lp-btn-primary / outline) */
.lp-legal-actions {
  display: flex; flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}
.lp-btn-primary,
.lp-btn-outline {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 24px;
  font-size: 14.5px; font-weight: 800;
  border-radius: 999px;
  cursor: pointer;
  transition: all 220ms var(--ease-out);
}
.lp-btn-primary {
  background: linear-gradient(135deg, var(--lp-accent) 0%, var(--lp-accent-dark) 100%);
  color: #fff !important;
  border: none;
  box-shadow: 0 10px 28px rgba(14, 165, 183, 0.34);
}
.lp-btn-primary:hover {
  transform: translateY(var(--lift-2));
  box-shadow: 0 14px 36px rgba(14, 165, 183, 0.44);
  color: #fff !important;
}
.lp-btn-outline {
  background: rgba(255, 255, 255, 0.7);
  color: var(--text-primary) !important;
  border: 1.5px solid var(--border);
  backdrop-filter: blur(8px);
}
.lp-btn-outline:hover {
  transform: translateY(var(--lift-1));
  border-color: var(--lp-accent);
  color: var(--lp-accent) !important;
}

/* ===== Final CTA card (mirrors .lp-cta-card) ===== */
.lp-cta-final {
  padding: 40px 24px 90px;
  max-width: var(--lp-max); margin: 0 auto;
}
.lp-cta-card {
  position: relative; overflow: hidden;
  text-align: center;
  padding: 56px 32px;
  background: linear-gradient(135deg, var(--lp-accent) 0%, var(--lp-accent-dark) 60%, #064e58 100%);
  border-radius: 24px;
  max-width: 880px; margin: 0 auto;
  color: #fff;
  box-shadow: 0 24px 60px rgba(14, 165, 183, 0.32);
}
.lp-cta-bg {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    radial-gradient(circle at 18% 30%, rgba(255, 255, 255, 0.18) 0%, transparent 35%),
    radial-gradient(circle at 82% 70%, rgba(255, 255, 255, 0.12) 0%, transparent 38%);
  animation: lpFloat 14s ease-in-out infinite;
}
.lp-cta-inner { position: relative; z-index: 1; }
.lp-cta-eyebrow {
  font-size: 13px; font-weight: 800; color: rgba(255, 255, 255, 0.85);
  text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 12px;
}
.lp-cta-title {
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 900; line-height: 1.3;
  margin: 0 0 14px; letter-spacing: -0.02em;
}
.lp-cta-sub {
  font-size: 15px; color: rgba(255, 255, 255, 0.92); line-height: 1.85;
  margin: 0 auto 24px; max-width: 520px;
}
.lp-cta-button {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px; font-size: 15px; font-weight: 800;
  background: #fff; color: var(--lp-accent) !important; border: none;
  border-radius: 999px; cursor: pointer; text-decoration: none;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
  transition: all 220ms var(--ease-out);
}
.lp-cta-button:hover {
  transform: translateY(var(--lift-2));
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.26);
  color: var(--lp-accent-dark) !important;
}

/* ===== Footer (mirrors .lp-footer) ===== */
.lp-footer {
  background: #0f172a;
  color: rgba(255, 255, 255, 0.7);
  padding: 60px 24px 24px;
}
.lp-footer-inner {
  max-width: var(--lp-max); margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px;
}
.lp-footer-col { display: flex; flex-direction: column; gap: 10px; }
.lp-footer-col--brand { gap: 14px; }
.lp-footer-col--brand img {
  width: 180px; height: auto;
  filter: brightness(0) invert(1); opacity: 0.95;
}
.lp-footer-tagline {
  font-size: 13px; color: rgba(255, 255, 255, 0.6); line-height: 1.85;
  margin: 0; max-width: 340px;
}
.lp-footer-col-title {
  font-size: 13px; font-weight: 800; color: #fff;
  text-transform: uppercase; letter-spacing: 0.08em;
  margin-bottom: 6px;
}
.lp-footer-col a {
  font-size: 13px; color: rgba(255, 255, 255, 0.65); text-decoration: none;
  display: inline-flex; align-items: center; gap: 6px;
  transition: color 160ms; cursor: pointer;
}
.lp-footer-col a:hover { color: var(--lp-accent); }
.lp-footer-copy {
  max-width: var(--lp-max); margin: 36px auto 0;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 12px; color: rgba(255, 255, 255, 0.5); text-align: center;
}

/* ===== Animations (mirrors landing) ===== */
@keyframes lpFadeIn {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes lpFloat {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(-22px, 18px) scale(1.06); }
  66% { transform: translate(18px, -12px) scale(0.96); }
}
/* Reveal-on-scroll — defaults to VISIBLE so content is never invisible
   when JS is disabled / IntersectionObserver isn't supported / the
   inline script fails to run. The optional fade-in only triggers when
   JS proactively adds the .lp-reveal-armed class, then transitions to
   .is-revealed. This avoids the trap where an unarmed `.lp-reveal`
   permanently hides the body content (the original landing pattern
   was safe because React always rendered + ran the observer; static
   HTML pages must be JS-free safe). */
.lp-reveal { opacity: 1; transform: none; }
.lp-reveal.lp-reveal-armed {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out);
}
.lp-reveal.lp-reveal-armed.is-revealed { opacity: 1; transform: translateY(0); }

/* LTR (English) sub-pages — sectioned content should still flow naturally */
[dir="ltr"] .lp-legal-toc a:hover { padding-inline-start: 4px; }

/* ===== Responsive (mirrors landing breakpoints 1024 / 768 / 480) ===== */
@media (max-width: 1024px) {
  .lp-legal-layout { grid-template-columns: 1fr; gap: 24px; padding-bottom: 40px; }
  .lp-legal-toc { position: static; }
  .lp-nav-links { display: none; }
  .lp-footer-inner { grid-template-columns: 1fr 1fr; gap: 32px; }
  .lp-footer-col--brand { grid-column: 1 / -1; }
}

@media (max-width: 768px) {
  .lp-hero { padding: 64px 18px 80px; }
  .lp-section { padding: 64px 18px; }
  .lp-section-header { margin-bottom: 40px; }
  .lp-nav-inner { padding: 12px 16px; gap: 10px; }
  .lp-nav-brand img { height: 60px; max-width: 160px; }
  .lp-nav-login { display: none; }
  .lp-legal-card { padding: 28px 22px; border-radius: 20px; }
  .lp-legal-section h2 { font-size: 21px; }
  .lp-cta-card { padding: 48px 22px; }
  .lp-footer-inner { grid-template-columns: 1fr; gap: 24px; text-align: start; }
  .lp-footer-col--brand { grid-column: auto; }
}

@media (max-width: 480px) {
  .lp-hero { padding: 48px 16px 60px; }
  .lp-hero-title { font-size: 32px; }
  .lp-hero-chip { font-size: 11.5px; padding: 6px 12px; }
  .lp-legal-card { padding: 22px 18px; border-radius: 18px; }
  .lp-legal-section h2 .lp-legal-num { width: 30px; height: 30px; font-size: 13px; }
  .lp-legal-section h2 { font-size: 19px; gap: 10px; }
  .lp-legal-section p,
  .lp-legal-section ul,
  .lp-legal-section ol { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .lp-hero-blob,
  .lp-cta-bg { animation: none; }
  .lp-reveal { transition: none; opacity: 1; transform: none; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

/* LTR direction overrides for EN pages */
[dir="ltr"] .lp-legal-toc__title { text-align: left; }
[dir="ltr"] .lp-footer-col-title { text-align: left; }

/* The legal pages ship the SAME floating button markup as the marketing pages
   (both come from `floatingWhatsAppHtml` in scripts/build-marketing-site.mjs),
   but they load this stylesheet instead of marketing-v2.css -- so the FAB has to
   be described twice. That duplication is why the pill design survived here
   after the marketing side moved on. `seo:smoke` now asserts BOTH files describe
   the same icon-only button and that neither one styles a number, so the two
   copies cannot silently drift apart again. */
.whatsapp-float {
  position: fixed;
  z-index: 120;
  inset-inline-end: max(18px, env(safe-area-inset-right));
  bottom: max(20px, calc(env(safe-area-inset-bottom) + 14px));
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: linear-gradient(145deg, #2bd36b, #16a34a);
  box-shadow: 0 14px 34px rgba(22, 163, 74, .34), 0 3px 10px rgba(8, 31, 46, .16);
  color: #fff;
  text-decoration: none;
  transition: transform .28s var(--ease-out), box-shadow .28s var(--ease-out);
}
.whatsapp-float::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: inherit;
  opacity: .55;
  animation: wa-halo 3.4s var(--ease-out) infinite;
  pointer-events: none;
}
.whatsapp-float:hover,
.whatsapp-float:focus-visible {
  transform: translateY(-4px) scale(1.04);
  box-shadow: 0 22px 46px rgba(22, 163, 74, .42), 0 4px 12px rgba(8, 31, 46, .18);
}
.whatsapp-float::after {
  content: attr(data-tip);
  position: absolute;
  inset-inline-start: calc(100% + 12px);
  white-space: nowrap;
  padding: 8px 14px;
  border-radius: 10px;
  background: #0f172a;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  opacity: 0;
  transform: scale(.92);
  transition: opacity .2s var(--ease-out), transform .2s var(--ease-out);
  pointer-events: none;
}
.whatsapp-float:hover::after,
.whatsapp-float:focus-visible::after { opacity: 1; transform: scale(1); }
.whatsapp-float-icon { display: grid; place-items: center; position: relative; z-index: 1; }
.whatsapp-float-icon svg { width: 30px; height: 30px; }

@keyframes wa-halo {
  0%   { transform: scale(1);    opacity: .5; }
  70%  { transform: scale(1.45); opacity: 0; }
  100% { transform: scale(1.45); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .whatsapp-float::before { animation: none !important; }
}

/* 2026-07-28: align the standalone policy pages with the current marketing
   system while keeping them independent from the application bundle. */
.lp-nav {
  min-height: 96px;
  background: rgba(255, 255, 255, .92);
  border-bottom-color: rgba(14, 165, 183, .08);
}
.lp-nav-inner { min-height: 96px; padding-block: 8px; }
.lp-nav-brand img { width: 178px; height: 78px; object-fit: cover; object-position: center 41%; }
.lp-hero {
  width: min(calc(100% - 48px), var(--lp-max));
  margin: 24px auto 0;
  padding: 94px clamp(24px, 6vw, 78px);
  border-radius: 30px;
  background:
    radial-gradient(circle at 18% 24%, rgba(255,255,255,.15), transparent 28%),
    radial-gradient(circle at 82% 72%, rgba(107,231,242,.17), transparent 34%),
    linear-gradient(135deg, #0ea5b7, #087d8c 55%, #07505c);
  box-shadow: 0 28px 70px rgba(7, 86, 100, .24);
  color: #fff;
}
.lp-hero-sub { color: rgba(255,255,255,.82); }
.lp-hero-badge,
.lp-hero-chip {
  border-color: rgba(255,255,255,.2);
  background: rgba(255,255,255,.11);
  color: #fff;
  backdrop-filter: blur(12px);
}
.lp-hero-chip svg,
.lp-hero-badge svg { color: #8beaf3; }
.lp-hero-grid {
  background-image:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
}
.lp-hero-accent {
  display: inline-block;
  background: none;
  color: #fff;
  -webkit-text-fill-color: currentColor;
}
.lp-legal-layout { padding-top: 72px; padding-bottom: 74px; gap: 38px; }
.lp-legal-toc {
  top: 124px;
  padding: 24px;
  border: 1px solid rgba(14,165,183,.12);
  border-radius: 22px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 18px 48px rgba(15,31,46,.07);
  backdrop-filter: blur(12px);
}
.lp-legal-card {
  display: grid;
  gap: 22px;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.lp-legal-card::before { display: none; }
.lp-legal-section {
  padding: clamp(26px, 4vw, 42px);
  border: 1px solid rgba(14,165,183,.1);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 18px 54px rgba(15,31,46,.065);
  scroll-margin-top: 124px;
  transition: transform .3s var(--ease-out), border-color .3s var(--ease-out), box-shadow .3s var(--ease-out);
}
.lp-legal-section:hover {
  transform: translateY(-3px);
  border-color: rgba(14,165,183,.24);
  box-shadow: 0 25px 64px rgba(15,31,46,.09);
}
.lp-legal-section + .lp-legal-section { margin-top: 0; padding-top: clamp(26px, 4vw, 42px); border-top: 1px solid rgba(14,165,183,.1); }
.lp-footer-inner {
  grid-template-columns: 1.2fr .8fr;
  gap: 72px;
}
.lp-footer-col--brand { grid-column: auto; }
.lp-footer {
  background:
    radial-gradient(circle at 82% 12%, rgba(14, 165, 183, .12), transparent 28%),
    #0f172a;
}
.unified-footer-links { min-width: 0; }
.unified-footer-links > strong {
  display: block;
  margin-bottom: 12px;
  color: #fff;
  font-size: 14px;
}
.unified-footer-links > strong:not(:first-child) { margin-top: 24px; }
.unified-footer-links > div { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.unified-footer-links a {
  color: rgba(255,255,255,.66);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.unified-footer-links a:hover { color: #68d8e5; }
.unified-legal-footer .lp-footer-col--brand img {
  width: 150px;
  height: 66px;
  object-fit: cover;
  object-position: center 41%;
}
.scroll-progress {
  position: fixed;
  z-index: 100;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, var(--lp-accent), #5ad8e5, var(--lp-success));
  transform: scaleX(0);
  transform-origin: left center;
  box-shadow: 0 0 16px rgba(14,165,183,.48);
  pointer-events: none;
}
[dir="rtl"] .scroll-progress { transform-origin: right center; }
.motion-reveal {
  opacity: 0;
  transform: translateY(34px) scale(.985);
  filter: blur(7px);
  transition:
    opacity .8s var(--ease-out),
    transform .8s var(--ease-out),
    filter .8s var(--ease-out);
  transition-delay: var(--reveal-delay, 0ms);
}
.motion-reveal.is-visible { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }

@media (max-width: 1024px) {
  .lp-footer-inner { grid-template-columns: 1fr 1fr; }
  .lp-footer-col--brand { grid-column: 1 / -1; }
}
@media (max-width: 768px) {
  .lp-nav, .lp-nav-inner { min-height: 76px; }
  .lp-hero { width: min(calc(100% - 28px), var(--lp-max)); margin-top: 14px; padding: 62px 22px 72px; border-radius: 22px; }
  .lp-legal-layout { padding-top: 42px; }
  .lp-legal-section { border-radius: 19px; }
  .lp-footer-inner { grid-template-columns: 1fr; }
  .lp-footer-col--brand { grid-column: auto; }
}
@media (max-width: 480px) {
  .lp-hero { padding: 48px 17px 56px; }
  .whatsapp-float { inset-inline-end: 12px; bottom: 12px; width: 52px; height: 52px; }
  .whatsapp-float-icon svg { width: 27px; height: 27px; }
  .whatsapp-float::after { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .motion-reveal { opacity: 1 !important; transform: none !important; filter: none !important; }
}

/* BEGIN GENERATED MARKETING NAVIGATION */
.site-header{--accent:#0ea5b7;--accent-dark:#0a8a99;--accent-soft:#e6f8fa;--text-primary:#0f1f2e;--text-secondary:#4a5b6d;--text-tertiary:#8a98a8;--border:#d7e0e8;--border-soft:#e7edf2;--shadow-lg:0 22px 56px rgba(15,31,46,.11);position:sticky;inset-block-start:env(safe-area-inset-top,0px);z-index:50;border-bottom:1px solid rgba(215,224,232,.72);background:#ffffffe6;box-shadow:0 4px 18px #0f172a09;backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);font-family:inherit;line-height:1.8;color:var(--text-primary);transition:box-shadow .3s,background .3s}.site-header *{box-sizing:border-box}.site-header a{text-decoration:none;color:inherit}.site-header.is-scrolled{background:#ffffffd1;box-shadow:0 8px 30px #0f172a14}.site-header .nav{width:min(1220px,calc(100% - 48px));margin-inline:auto;min-height:86px;display:flex;align-items:center;gap:22px;position:relative;transition:min-height .3s}.site-header.is-scrolled .nav{min-height:68px}.site-header .brand{display:flex;align-items:center;flex:0 0 auto;margin-inline-end:4px}.site-header .brand img{display:block;width:178px;height:74px;object-fit:cover;object-position:center 41%;transition:width .3s,height .3s}@media(min-width:821px){.site-header.is-scrolled .brand img{width:152px;height:62px}}.site-header .nav-links{display:flex;align-items:center;justify-content:center;gap:22px;flex:1}.site-header .nav-links a,.site-header .language-link{position:relative;color:var(--text-secondary);font-size:14px;font-weight:700;white-space:nowrap;transition:color .16s}.site-header .nav-links a:after{content:"";position:absolute;inset-inline:0;inset-block-end:-9px;height:2px;border-radius:2px;background:var(--accent);transform:scaleX(0);transition:transform .22s}.site-header .nav-links a:hover,.site-header .nav-links a[aria-current=page],.site-header .language-link:hover{color:var(--accent-dark)}.site-header .nav-links a:hover:after,.site-header .nav-links a[aria-current=page]:after{transform:scaleX(1)}.site-header .nav-actions{display:flex;align-items:center;gap:12px}.site-header .button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 18px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--accent-dark));box-shadow:0 9px 24px #0ea5b747;color:#fff;font-size:14px;font-weight:800;white-space:nowrap}.site-header .button.secondary{border:1.5px solid var(--border);background:#ffffffd1;box-shadow:none;color:var(--text-primary)}.site-header .country-picker{position:relative}.site-header .country-picker summary{display:flex;align-items:center;gap:7px;min-height:40px;padding:7px 12px;border:1px solid var(--border);border-radius:12px;background:#fff;color:var(--text-primary);cursor:pointer;font-size:13px;font-weight:800;list-style:none}.site-header .country-picker summary::-webkit-details-marker{display:none}.site-header .country-picker summary:after{content:"\2304";color:var(--accent-dark)}.site-header .country-picker summary small{color:var(--text-tertiary);font-size:11px;font-weight:700}.site-header .country-menu{position:absolute;z-index:60;inset-block-start:calc(100% + 9px);inset-inline-end:0;display:grid;grid-template-columns:1fr 1fr;min-width:300px;padding:8px;border:1px solid var(--border);border-radius:14px;background:#fff;box-shadow:var(--shadow-lg)}.site-header .country-menu a{display:flex;flex-direction:column;gap:1px;min-height:44px;padding:8px 10px;border-radius:9px;font-size:13px;font-weight:700}.site-header .country-menu a small{color:var(--text-tertiary);font-size:11px;font-weight:600}.site-header .country-menu a:hover,.site-header .country-menu a[aria-current=true]{background:var(--accent-soft);color:var(--accent-dark)}.marketing-language-picker,.marketing-mobile-toggle{display:none;flex:none}.marketing-language-picker summary,.marketing-mobile-toggle,.marketing-mobile-close{display:flex;align-items:center;justify-content:center;gap:5px;min-height:44px;padding:7px 10px;border:1px solid var(--border);border-radius:12px;background:#fff;color:var(--text-primary);font-size:13px;font-weight:800;cursor:pointer;list-style:none}.marketing-language-picker summary::-webkit-details-marker{display:none}.marketing-language-picker summary:after{content:"\2304";color:var(--accent-dark)}.marketing-mobile-toggle{display:none}.marketing-mobile-toggle,.marketing-mobile-close{width:44px;padding:10px}.marketing-mobile-toggle svg,.marketing-mobile-close svg{width:22px;height:22px}.marketing-language-picker[open] summary{border-color:var(--accent);background:var(--accent-soft)}.marketing-language-options{position:absolute;z-index:60;inset-block-start:calc(100% + 9px);inset-inline-end:0;display:grid;gap:2px;width:150px;padding:12px;border:1px solid var(--border);border-radius:16px;background:#fff;box-shadow:var(--shadow-lg)}.marketing-language-options a,.marketing-mobile-links a{display:block;min-height:44px;padding:10px 12px;border-radius:9px;font-size:14px;font-weight:700}.marketing-language-options a:hover,.marketing-language-options a[aria-current=true],.marketing-mobile-links a:hover,.marketing-mobile-links a[aria-current=page]{color:var(--accent-dark);background:var(--accent-soft)}.marketing-country-name{max-width:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}html.marketing-menu-open{overflow:hidden}.marketing-mobile-drawer{position:fixed;inset-block:0;inset-inline-start:0;inset-inline-end:auto;width:min(360px,calc(100vw - 40px));height:100dvh;max-width:none;max-height:none;margin:0;padding:20px;border:0;background:#fff;color:var(--text-primary);box-shadow:var(--shadow-lg);overflow:hidden}.marketing-mobile-drawer[open]{display:flex;flex-direction:column;gap:16px}.marketing-mobile-drawer::backdrop{background:#0f1f2e61}.marketing-mobile-heading{display:flex;align-items:center;justify-content:space-between;flex:none}.marketing-mobile-heading strong{font-size:20px;font-weight:800}.marketing-mobile-links{display:flex;flex-direction:column;gap:4px;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}.marketing-mobile-account{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-block-start:16px;padding-block-end:env(safe-area-inset-bottom,0px);border-top:1px solid var(--border-soft);flex:none}.marketing-mobile-account .button{min-height:44px;padding-inline:8px;font-size:13px}@media(max-width:820px){.site-header .nav{width:100%;gap:8px;min-height:76px;padding-inline:12px;max-width:none}.site-header .brand img{width:112px;height:60px}.site-header .nav-links{display:none}.site-header .nav-actions{margin-inline-start:auto;gap:6px;min-width:0}.marketing-language-picker{display:block}.marketing-mobile-toggle{display:flex}.site-header .nav-actions>.marketing-desktop-language,.site-header .nav-actions>.marketing-desktop-login{display:none}.site-header .nav-actions .country-picker{display:block}.site-header .country-picker,.marketing-language-picker{position:static}.site-header .country-picker summary{min-height:44px;padding:7px 8px;gap:4px}.site-header .country-picker summary small{display:none}.marketing-country-name{max-width:76px}.site-header .country-menu{inset-inline:12px;inset-block-start:100%;min-width:0;max-height:calc(100dvh - 110px);overflow:auto}.marketing-language-options{inset-inline-end:12px;inset-block-start:100%}}@media(max-width:360px){.site-header .brand img{width:72px}.marketing-country-name{max-width:60px}.marketing-language-picker summary{padding-inline:7px;font-size:12px}}@media(prefers-reduced-motion:reduce){.site-header *,.site-header *:after{animation:none!important;transition:none!important}}
/* END GENERATED MARKETING NAVIGATION */