/* ─── mymalali · site.css ───────────────────────────────────────────────────
   Shared layer for product, support and legal pages. Loaded AFTER homepage.css
   (which provides tokens, fonts, nav, footer and buttons) and after each page's
   own inline <style>, so it can re-theme older pages without touching content.

   Product accents (body[data-product]):
     chatrio  → blue / violet        voxnotiq → violet / magenta / electric blue
     mihrabi  → gold / warm amber    sila     → coral / warm peach
     studio   → MYM ALALI blue (general support / legal pages)
   ─────────────────────────────────────────────────────────────────────────── */

body.ms-page { --acc: #4f8cff; --acc-2: #8b5cf6; --acc-soft: #dbe7ff; --acc-rgb: 79,140,255; --acc2-rgb: 139,92,246; --on-acc: #fff;
  margin: 0; background: #08101c !important; color: var(--text); min-height: 100vh; }
body.ms-page[data-product="chatrio"]  { --acc: #5b9dff; --acc-2: #8b5cf6; --acc-soft: #d6e4ff; --acc-rgb: 91,157,255;  --acc2-rgb: 139,92,246; --on-acc: #fff; }
body.ms-page[data-product="voxnotiq"] { --acc: #b77cff; --acc-2: #e24bd8; --acc-soft: #efdcff; --acc-rgb: 183,124,255; --acc2-rgb: 226,75,216; --on-acc: #fff; }
body.ms-page[data-product="mihrabi"]  { --acc: #d9a24c; --acc-2: #f59e0b; --acc-soft: #f6dcae; --acc-rgb: 217,162,76;  --acc2-rgb: 245,158,11; --on-acc: #1a1206; }
body.ms-page[data-product="sila"]     { --acc: #fb8f6c; --acc-2: #fdba74; --acc-soft: #ffdccb; --acc-rgb: 251,143,108; --acc2-rgb: 253,186,116; --on-acc: #22110a; }

/* Page canvas: navy base with the product's glow instead of the old gold grain. */
body.ms-page::before { content: ''; position: fixed; inset: 0; top: 0; right: 0; width: auto; height: auto; z-index: -1; pointer-events: none;
  background: radial-gradient(48% 36% at 12% 12%, rgba(var(--acc-rgb),.13), transparent 72%),
              radial-gradient(42% 34% at 90% 40%, rgba(var(--acc2-rgb),.10), transparent 72%),
              linear-gradient(180deg, #08101c 0%, #0a1322 50%, #08101c 100%); }
body.ms-page::after, body.ms-page #noise { display: none !important; }
body.ms-page .mh-nav { z-index: 60; }

/* Shared nav extras */
.ms-crumb { display: none; align-items: center; gap: 8px; font-size: .82rem; font-weight: 600; color: var(--text); text-decoration: none; padding: 5px 12px 5px 6px; border: 1px solid rgba(var(--acc-rgb),.35); border-radius: 999px; background: rgba(var(--acc-rgb),.08); }
[dir="rtl"] .ms-crumb { padding: 5px 6px 5px 12px; }
.ms-crumb img { width: 22px; height: 22px; border-radius: 7px; object-fit: cover; }
.ms-crumb:hover { border-color: rgba(var(--acc-rgb),.7); }
@media (min-width: 720px) { .ms-crumb { display: inline-flex; } }
.mh-nav-link.is-current { color: var(--text); }
.ms-mobile-crumb { color: var(--text) !important; font-weight: 700; }
.ms-page .mh-logo-mark { display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: .9rem; color: var(--gold); background: rgba(211,154,69,.08); }
.ms-page .mh-nav-cta { display: none; }
@media (min-width: 600px) { .ms-page .mh-nav-cta { display: inline-flex; } }

/* Footer product row */
.ms-footer-product { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--border-soft); font-size: .83rem; }
.ms-footer-product strong { color: var(--text); font-weight: 700; display: inline-flex; align-items: center; gap: 8px; }
.ms-footer-product strong img { width: 20px; height: 20px; border-radius: 6px; }
.ms-footer-product a { color: var(--text-dim); text-decoration: none; }
.ms-footer-product a:hover { color: var(--acc); }

/* Focus */
.ms-page a:focus-visible, .ms-page button:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 8px; }

/* ═════════════ Product pages ═════════════ */
.pp-hero { padding-top: clamp(104px, 12vw, 150px); padding-bottom: clamp(48px, 7vw, 90px); position: relative; }
.pp-hero-grid { display: grid; grid-template-columns: 1fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
@media (min-width: 960px) { .pp-hero-grid { grid-template-columns: 1.05fr .95fr; } }
.pp-id { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; }
.pp-id img { width: 52px; height: 52px; border-radius: 14px; border: 1px solid rgba(var(--acc-rgb),.4); box-shadow: 0 10px 30px -12px rgba(var(--acc-rgb),.8); }
.pp-id-name { font-size: 1.05rem; font-weight: 800; color: var(--text); display: block; }
.pp-id-cat { font-size: .78rem; color: var(--text-dim); }
.pp-status { display: inline-flex; align-items: center; gap: 7px; font-size: .74rem; font-weight: 600; color: #86efac; border: 1px solid rgba(134,239,172,.3); background: rgba(34,197,94,.08); border-radius: 999px; padding: 4px 11px; margin-bottom: 18px; }
.pp-status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #4ade80; }
.pp-h1 { font-size: clamp(2.1rem, 4.6vw, 3.5rem); font-weight: 800; line-height: 1.12; letter-spacing: -.02em; margin: 0 0 18px; color: var(--text); text-wrap: balance; }
[dir="rtl"] .pp-h1 { line-height: 1.3; letter-spacing: 0; }
.pp-h1 em { font-style: normal; background: linear-gradient(120deg, var(--acc), var(--acc-2)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.pp-lede { font-size: 1.02rem; line-height: 1.8; color: var(--text-dim); margin: 0 0 26px; max-width: 56ch; }
.pp-ctas { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.pp-btn-store { background: linear-gradient(135deg, var(--acc), var(--acc-2)); color: var(--on-acc); box-shadow: 0 12px 34px -12px rgba(var(--acc-rgb),.85), inset 0 1px 0 rgba(255,255,255,.2); }
.pp-btn-store:hover { transform: translateY(-1px); }
.pp-note { font-size: .78rem; color: var(--text-faint); margin: 14px 0 0; }

.pp-visual { position: relative; min-height: 360px; display: flex; align-items: center; justify-content: center; }
.pp-visual::before { content: ''; position: absolute; inset: 8% 6%; border-radius: 40px; background: radial-gradient(circle at 40% 40%, rgba(var(--acc-rgb),.35), transparent 60%), radial-gradient(circle at 70% 70%, rgba(var(--acc2-rgb),.28), transparent 60%); filter: blur(30px); z-index: 0; }
.pp-phone { position: relative; z-index: 1; width: min(250px, 52vw); border-radius: 34px; padding: 8px; background: linear-gradient(160deg, #1b2537, #0c1320); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 40px 90px -40px rgba(0,0,0,.9), 0 0 0 1px rgba(var(--acc-rgb),.15); }
.pp-phone img { display: block; width: 100%; height: auto; border-radius: 27px; }
.pp-phone-back { position: absolute; z-index: 0; width: min(210px, 42vw); opacity: .8; transform: translateX(-58%) rotate(-7deg) scale(.92); }
[dir="rtl"] .pp-phone-back { transform: translateX(58%) rotate(7deg) scale(.92); }
.pp-art { position: relative; z-index: 1; width: min(460px, 100%); border-radius: 28px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); box-shadow: 0 40px 90px -40px rgba(0,0,0,.9), 0 0 0 1px rgba(var(--acc-rgb),.18); }
.pp-art img { display: block; width: 100%; height: auto; }

.pp-section { padding-block: clamp(56px, 7vw, 100px); position: relative; }
.pp-band { background: rgba(255,255,255,.015); box-shadow: 0 0 0 100vmax rgba(255,255,255,.015); clip-path: inset(0 -100vmax); border-block: 1px solid var(--border-soft); }
.pp-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--acc); margin-bottom: 12px; }
.pp-eyebrow::before { content: ''; width: 16px; height: 1px; background: var(--acc); }
.pp-h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 800; line-height: 1.22; letter-spacing: -.012em; margin: 0 0 14px; color: var(--text); }
.pp-h2 em { font-style: normal; color: var(--acc); }
.pp-head { max-width: 680px; margin-bottom: 36px; }
.pp-body { font-size: 1rem; line-height: 1.85; color: var(--text-dim); margin: 0; }
.pp-statement { max-width: 860px; }
.pp-statement .pp-body { font-size: clamp(1rem, 1.6vw, 1.14rem); }

.pp-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 640px) { .pp-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .pp-grid-3 { grid-template-columns: repeat(3, 1fr); } }
.pp-card { position: relative; padding: 22px 22px 20px; border-radius: 20px; border: 1px solid rgba(148,163,184,.13); background: linear-gradient(180deg, rgba(21,31,49,.9), rgba(14,23,39,.9)); overflow: hidden; }
.pp-card::before { content: ''; position: absolute; top: 0; inset-inline: 0; height: 2px; background: linear-gradient(90deg, var(--acc), transparent); opacity: .8; }
[dir="rtl"] .pp-card::before { background: linear-gradient(270deg, var(--acc), transparent); }
.pp-card-icon { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; color: var(--acc-soft); background: rgba(var(--acc-rgb),.14); border: 1px solid rgba(var(--acc-rgb),.3); }
.pp-card h3 { font-size: 1.04rem; font-weight: 800; margin: 0 0 6px; color: var(--text); }
.pp-card p { font-size: .88rem; line-height: 1.7; color: var(--text-dim); margin: 0; }

.pp-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.pp-tags span { font-size: .78rem; color: var(--acc-soft); border: 1px solid rgba(var(--acc-rgb),.3); background: rgba(var(--acc-rgb),.08); border-radius: 999px; padding: 5px 12px; }

.pp-split { display: grid; grid-template-columns: 1fr; gap: clamp(28px, 5vw, 56px); align-items: center; }
@media (min-width: 900px) { .pp-split { grid-template-columns: 1fr 1fr; } }

.pp-tree { display: flex; flex-direction: column; gap: 10px; padding: 22px; border-radius: 20px; border: 1px solid var(--border); background: rgba(255,255,255,.02); }
.pp-tree-node { padding: 12px 14px; border-radius: 14px; border: 1px solid rgba(var(--acc-rgb),.35); background: rgba(var(--acc-rgb),.1); font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 10px; }
.pp-tree-kids { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-inline-start: 18px; border-inline-start: 1px dashed rgba(var(--acc-rgb),.4); }
.pp-tree-kid { padding: 12px 14px; border-radius: 14px; border: 1px solid var(--border); background: rgba(255,255,255,.03); font-size: .88rem; color: var(--text); }
.pp-tree-kid small { display: block; color: var(--text-faint); font-size: .74rem; margin-top: 4px; }

/* Screens gallery: scroll-snap strip that never widens the page */
.pp-shots { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(170px, 210px); gap: 16px; overflow-x: auto; padding: 6px 2px 18px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.pp-shot { scroll-snap-align: start; margin: 0; }
.pp-shot img { display: block; width: 100%; height: auto; border-radius: 24px; border: 1px solid rgba(255,255,255,.1); box-shadow: 0 24px 60px -30px rgba(0,0,0,.9); }
.pp-shot figcaption { font-size: .8rem; color: var(--text-dim); margin-top: 10px; text-align: center; }

.pp-steps { display: grid; grid-template-columns: 1fr; gap: 14px; counter-reset: pp; }
@media (min-width: 820px) { .pp-steps { grid-template-columns: repeat(3, 1fr); } }
.pp-step { padding: 22px; border-radius: 20px; border: 1px solid var(--border); background: rgba(255,255,255,.02); }
.pp-step-num { display: inline-flex; width: 30px; height: 30px; border-radius: 50%; align-items: center; justify-content: center; font-size: .8rem; font-weight: 800; color: var(--on-acc); background: linear-gradient(135deg, var(--acc), var(--acc-2)); margin-bottom: 14px; }
.pp-step h3 { font-size: 1rem; font-weight: 800; margin: 0 0 6px; color: var(--text); }
.pp-step p { font-size: .88rem; line-height: 1.7; color: var(--text-dim); margin: 0; }

.pp-honest { margin-top: 18px; display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; border-radius: 16px; border: 1px solid rgba(var(--acc-rgb),.3); background: rgba(var(--acc-rgb),.06); font-size: .88rem; line-height: 1.7; color: var(--text-dim); }
.pp-honest i { color: var(--acc); margin-top: 4px; }
.pp-honest a { color: var(--acc); font-weight: 600; }

.pp-wave { display: flex; align-items: center; gap: 4px; height: 56px; margin: 18px 0 4px; }
.pp-wave span { flex: 1; max-width: 6px; border-radius: 4px; background: linear-gradient(180deg, var(--acc), var(--acc-2)); opacity: .85; }

.pp-cta { text-align: center; padding: clamp(32px, 5vw, 56px); border-radius: 28px; border: 1px solid rgba(var(--acc-rgb),.28); background: radial-gradient(60% 80% at 50% 0%, rgba(var(--acc-rgb),.18), transparent 70%), rgba(255,255,255,.02); }
.pp-cta img { width: 64px; height: 64px; border-radius: 18px; margin-bottom: 16px; }
.pp-cta .pp-ctas { justify-content: center; }
.pp-cta .pp-lede { margin-inline: auto; }

.pp-legal { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 22px; }
.pp-legal a { display: inline-flex; align-items: center; gap: 8px; font-size: .84rem; color: var(--text-dim); text-decoration: none; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--border-strong); }
.pp-legal a:hover { color: var(--text); border-color: rgba(var(--acc-rgb),.6); }

.pp-related { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 720px) { .pp-related { grid-template-columns: repeat(3, 1fr); } }
.pp-rel { display: flex; gap: 14px; align-items: center; padding: 16px; border-radius: 18px; border: 1px solid var(--border); background: rgba(255,255,255,.02); text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.pp-rel:hover { border-color: rgba(var(--r),.6); transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .pp-rel:hover { transform: none; } }
.pp-rel img { width: 46px; height: 46px; border-radius: 12px; flex-shrink: 0; }
.pp-rel strong { display: block; color: var(--text); font-size: .95rem; }
.pp-rel span { display: block; color: var(--text-dim); font-size: .78rem; margin-top: 2px; }
.pp-rel i { margin-inline-start: auto; color: var(--text-faint); }
[dir="ltr"] .pp-rel .fa-arrow-left, [dir="ltr"] .pp-ctas .fa-arrow-left, [dir="ltr"] .pp-honest .fa-arrow-left { transform: scaleX(-1); }

[dir="ltr"] .pp-h1, [dir="ltr"] .pp-h2, [dir="ltr"] .pp-card h3, [dir="ltr"] .pp-step h3, [dir="ltr"] .pp-id-name { font-family: 'Space Grotesk','Inter',sans-serif; font-weight: 600; letter-spacing: -.02em; }

/* ═════════════ Legal / support pages (existing markup, re-themed) ═════════════ */
.ms-legal .grad-text { background: linear-gradient(120deg, var(--acc), var(--acc-2)) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; }
.ms-legal .grid-bg { background-image: none !important; }
.ms-legal .deco-circle, .ms-legal .float { animation: none !important; }
.ms-legal .deco-circle { display: none; }
.ms-legal .pulse-glow { animation: none !important; box-shadow: 0 12px 34px -14px rgba(var(--acc-rgb),.8) !important; }
.ms-legal .glass { background: rgba(21,31,49,.72) !important; border-color: rgba(148,163,184,.14) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.ms-legal .badge { background: rgba(var(--acc-rgb),.1) !important; border-color: rgba(var(--acc-rgb),.3) !important; color: var(--acc-soft) !important; }
.ms-legal .btn-gold { background: linear-gradient(135deg, var(--acc), var(--acc-2)) !important; color: var(--on-acc) !important; box-shadow: 0 10px 30px -12px rgba(var(--acc-rgb),.8) !important; }
.ms-legal .btn-outline { color: var(--acc-soft) !important; border-color: rgba(var(--acc-rgb),.45) !important; }
.ms-legal .btn-outline:hover { background: rgba(var(--acc-rgb),.1) !important; }
.ms-legal .card:hover { transform: none !important; }
.ms-legal .policy-card, .ms-legal .faq-item { background: rgba(21,31,49,.6) !important; border-color: rgba(148,163,184,.13) !important; }
.ms-legal .policy-card h3, .ms-legal .policy-card strong { color: var(--text) !important; }
.ms-legal .policy-card p, .ms-legal .policy-card ul, .ms-legal .policy-card li { color: #c3cddb !important; line-height: 1.9; }
.ms-legal .section-num { color: rgba(var(--acc-rgb),.35) !important; }
.ms-legal .toc-num, .ms-legal .faq-icon { color: var(--acc) !important; }
.ms-legal .toc-item:hover { background: rgba(var(--acc-rgb),.08) !important; color: var(--text) !important; }
.ms-legal .tech-tag { background: rgba(var(--acc-rgb),.08) !important; border-color: rgba(var(--acc-rgb),.2) !important; color: var(--acc-soft) !important; }
.ms-legal h1 { font-weight: 800 !important; letter-spacing: -.01em; }
[dir="ltr"] .ms-legal h1, [dir="ltr"] .ms-legal h2 { font-family: 'Space Grotesk','Inter',sans-serif !important; font-weight: 600 !important; letter-spacing: -.02em; }
.ms-legal main, .ms-legal section { position: relative; z-index: 1; }
.ms-legal a[href^="mailto"]:not(.btn-gold):not(.btn-outline) { color: var(--acc); }

/* ═════════════ Legal / support pages: same identity as the product page ═════════════ */
/* Hero: start-aligned like the product hero, product identity first */
.ms-legal .lg-hero { min-height: 0 !important; display: block !important; padding: clamp(104px, 12vw, 148px) 0 clamp(36px, 5vw, 56px) !important; background: none !important; border-bottom: 1px solid var(--border-soft); }
.ms-legal .lg-hero > div { max-width: var(--maxw) !important; margin-inline: auto !important; padding-inline: 24px !important; text-align: start !important; }
.ms-legal .lg-hero .flex.justify-center { justify-content: flex-start !important; }
.ms-legal .lg-hero .lg-id { text-decoration: none; margin-bottom: 20px; }
.ms-legal .lg-hero .lg-id:hover .pp-id-name { color: var(--acc); }
.ms-legal .lg-hero .badge { font-size: .74rem; font-weight: 600; padding: 5px 12px; border-radius: 999px; margin: 0 0 16px !important; }
.ms-legal .lg-hero h1 { font-size: clamp(2.1rem, 4.6vw, 3.4rem) !important; line-height: 1.14 !important; margin-bottom: 16px !important; max-width: 20ch; }
[dir="rtl"] .ms-legal .lg-hero h1 { line-height: 1.3 !important; }
.ms-legal .lg-hero p { margin-inline: 0 !important; max-width: 62ch !important; font-size: 1rem !important; line-height: 1.8 !important; color: var(--text-dim) !important; }
.ms-legal .lg-hero .glass, .ms-legal .lg-hero .rounded-full { display: inline-flex; margin-top: 8px; }
.ms-legal .lg-wave { height: 40px; max-width: 320px; margin-top: 22px; opacity: .8; }

/* Content: same container width as the product page, readable text */
.ms-legal .max-w-6xl { max-width: var(--maxw) !important; padding-inline: 24px !important; }
.ms-legal .max-w-3xl:not(.lg-hero > div) { max-width: 820px !important; }
.ms-legal .policy-card, .ms-legal .faq-item, .ms-legal .contact-card, .ms-legal .price-card, .ms-legal aside .glass {
  position: relative; border-radius: 20px !important; border: 1px solid rgba(148,163,184,.13) !important;
  background: linear-gradient(180deg, rgba(21,31,49,.9), rgba(14,23,39,.9)) !important; box-shadow: none !important; overflow: hidden; }
.ms-legal .policy-card::before { content: ''; position: absolute; top: 0; inset-inline: 0; height: 2px; background: linear-gradient(90deg, var(--acc), transparent); opacity: .75; }
[dir="rtl"] .ms-legal .policy-card::before { background: linear-gradient(270deg, var(--acc), transparent); }
.ms-legal .policy-card { padding: clamp(20px, 3vw, 28px) !important; }
.ms-legal .policy-card h3 { font-size: 1.12rem !important; }
.ms-legal .policy-card p, .ms-legal .policy-card li { font-size: .96rem !important; }
.ms-legal .policy-card a:not(.btn-gold):not(.btn-outline), .ms-legal .faq-answer a { color: var(--acc) !important; overflow-wrap: anywhere; }
.ms-legal .policy-card, .ms-legal .faq-answer, .ms-legal .contact-card { overflow-wrap: anywhere; }
.ms-legal .section-num { font-family: 'Space Grotesk', 'Inter', sans-serif; font-weight: 600 !important; }
.ms-legal .toc-item { border-radius: 12px !important; }
.ms-legal .toc-num { font-family: 'Space Grotesk', 'Inter', sans-serif; }
.ms-legal .icon-wrap { background: rgba(var(--acc-rgb),.14) !important; border: 1px solid rgba(var(--acc-rgb),.3) !important; color: var(--acc-soft) !important; }
.ms-legal .faq-item { margin-bottom: 10px; }
.ms-legal .faq-item.open { border-color: rgba(var(--acc-rgb),.45) !important; box-shadow: 0 0 0 3px rgba(var(--acc-rgb),.08) !important; }
.ms-legal .faq-question { min-height: 56px; }
.ms-legal .contact-card { text-decoration: none; transition: border-color .2s ease; }
.ms-legal .contact-card:hover { border-color: rgba(var(--acc-rgb),.55) !important; transform: none !important; }
@media (max-width: 1023px) { .ms-legal aside .glass { position: static !important; } }

/* Product link row at the end of every product legal/support page */
.lg-end { padding: clamp(36px, 5vw, 56px) 0; }
.lg-end-inner { max-width: var(--maxw); margin: 0 auto; padding: 22px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; border-radius: 22px; border: 1px solid rgba(var(--acc-rgb),.25); background: radial-gradient(60% 120% at 0% 0%, rgba(var(--acc-rgb),.14), transparent 70%), rgba(255,255,255,.02); }
@media (min-width: 1368px) { .lg-end-inner { max-width: calc(var(--maxw) - 48px); } }
.lg-end { padding-inline: 24px; }
.lg-end-id { display: inline-flex; align-items: center; gap: 12px; font-weight: 800; font-size: 1.05rem; color: var(--text); text-decoration: none; }
.lg-end-id img { width: 40px; height: 40px; border-radius: 12px; }
.lg-end .pp-legal { margin: 0; justify-content: flex-start; }
.lg-end .pp-legal a { min-height: 40px; }
.lg-end .pp-legal a[aria-current="page"] { color: var(--on-acc); background: linear-gradient(135deg, var(--acc), var(--acc-2)); border-color: transparent; }
[dir="ltr"] .lg-end .fa-arrow-left { transform: scaleX(-1); }
[dir="ltr"] .lg-end-id { font-family: 'Space Grotesk', 'Inter', sans-serif; font-weight: 600; }

/* ── Approved showcase artwork on Explore pages ── */
.pp-art.pp-showcase { width: min(480px, 100%); border-radius: 24px; }
.pp-art.pp-showcase img { width: 100%; height: auto; object-fit: contain; }

/* ═════ Vertical rhythm: tighter gaps between Explore-page sections ═════ */
.pp-section { padding-block: clamp(42px, 4.4vw, 62px); }
.pp-hero { padding-bottom: clamp(28px, 3.4vw, 46px); }

/* ═════ Vertical rhythm, pass 2: Explore pages ═════ */
.pp-section { padding-block: clamp(34px, 3.4vw, 48px); }
.pp-hero { padding-bottom: clamp(16px, 1.8vw, 24px); }
/* App Store block → "More products": one connected ending instead of two separate sections */
.pp-section:has(> .pp-cta) { padding-bottom: clamp(18px, 2vw, 28px); }
.pp-section[aria-labelledby="rel-h"] { padding-top: clamp(14px, 1.6vw, 22px); }

/* ═════ Vertical rhythm: legal & support pages ═════ */
.ms-legal .lg-hero { padding-bottom: clamp(24px, 3vw, 36px) !important; }
.ms-legal .lg-hero ~ section:not(.lg-end) { padding-block: clamp(24px, 3.2vw, 40px) !important; }
.lg-end { padding-top: clamp(12px, 1.4vw, 18px); padding-bottom: clamp(28px, 3.4vw, 44px); }