/* Supporting pages share the approved Selam homepage typography and palette. */
:root {
  --cream:#fff8f0; --ink:#2d2016; --secondary:#675c50; --gold:#e8a817;
  --gold-depth:#c98e0e; --gold-tint:#fff3d4; --border:#e5e0d8;
  --bg-warm:var(--cream); --text-dark:var(--ink); --muted-text:var(--secondary);
  --accent-gold:var(--gold); --border-color:var(--border);
}
*,*::before,*::after { box-sizing:border-box; }
html { scroll-padding-top:24px; -webkit-font-smoothing:antialiased; }
body { margin:0; font-family:'DM Sans',sans-serif; color:var(--ink); background:var(--cream); line-height:1.7; }
h1,h2,h3,h4,p,figure { margin:0; }
img { display:block; max-width:100%; height:auto; }
a { color:#8a5a00; text-underline-offset:4px; overflow-wrap:anywhere; }
:focus-visible { outline:3px solid var(--ink); outline-offset:5px; }
main:focus { outline:none; }
[hidden] { display:none !important; }
.skip-link { position:fixed; z-index:20; top:16px; left:16px; padding:12px 18px; border:2px solid var(--ink); border-radius:12px; background:#fff; color:var(--ink); transform:translateY(-200%); }
.skip-link:focus { transform:none; }
.support-brand { display:inline-flex; flex-direction:column; align-items:center; flex-shrink:0; line-height:1.15; text-decoration:none; color:var(--ink); }
.support-brand>span:first-child { font-family:'Playfair Display',Georgia,serif; font-size:34px; font-weight:700; letter-spacing:-1px; }
.support-brand .brand-script { font-family:'Noto Sans Ethiopic',sans-serif; font-size:16px; color:var(--gold-depth); margin-top:4px; line-height:1.3; }

/* Preserve the simple reading layout used by the published policy pages. */
.legal-page .container { max-width:768px; padding:40px 24px 72px; }
.legal-page h1 { font-size:clamp(28px,5vw,36px); line-height:1.2; font-weight:700; }
.legal-page h2 { font:700 21px/1.4 'Outfit',sans-serif; }
.legal-page .updated { color:var(--secondary); }
.legal-page a.back { display:inline-flex; align-items:center; min-height:44px; color:#8a5a00; }
.legal-page .contact { border:1px solid var(--border); }
.legal-page .contact p:last-child { margin-bottom:0; }
.legal-page #delete-account { border-color:var(--gold); }

/* Article navigation stays visible at every width and requires no JavaScript. */
.navbar { padding:24px; border-bottom:1px solid var(--border); }
.navbar-inner { max-width:1120px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.nav-links { display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.nav-links a { display:inline-flex; align-items:center; min-height:44px; font:600 15px/1.4 'Outfit',sans-serif; text-decoration:none; }
.nav-link { color:var(--secondary); }
.btn-nav,.cta-button { color:var(--ink); background:var(--gold); border-radius:12px; border:0; border-bottom:4px solid var(--gold-depth); padding:12px 20px; }
.article-page .article-container { max-width:860px; min-width:0; }
.article-meta { flex-wrap:wrap; }
.article-page .article-title { font-weight:700; letter-spacing:-.025em; }
.article-page .article-subtitle { font-weight:400; }
.article-page .article-body h2,.article-page .article-body h3,.article-page .app-title { font-family:'Outfit',sans-serif; font-weight:700; }
.article-page .article-body p,.article-page .article-body li { color:var(--ink); }
.article-page .short-answer-box { background:var(--gold-tint); }
.article-page .short-answer-box p { margin:0; }
.article-page .pick-badge { color:var(--ink); }
.table-wrapper { max-width:100%; overscroll-behavior-x:contain; }
.comparison-table { min-width:600px; }
.article-page .cta-banner { background:var(--gold-tint); color:var(--ink); border:1px solid var(--border); box-shadow:none; }
.article-page .cta-banner h3 { color:var(--ink); margin-top:0; }
.article-page .cta-banner p { color:var(--secondary); }
.article-page .cta-button { border-radius:12px; font:700 17px/1.5 'Outfit',sans-serif; color:var(--ink); }
.article-page .faq-item .faq-q { margin-top:0; }
.article-page .faq-item .faq-a { margin-bottom:0; }

.footer { background:#fff; border-top:1px solid var(--border); padding:40px 24px 0; }
.footer-inner { display:grid; grid-template-columns:1.65fr 1fr 1fr; gap:40px; width:min(100%,1120px); margin:auto; padding-bottom:32px; }
.footer-brand .support-brand { margin-bottom:20px; }
.footer-desc { color:var(--secondary); font-size:15px; }
.footer h2 { font:700 18px/1.4 'Outfit',sans-serif; margin:8px 0 14px; }
.footer-links ul { list-style:none; margin:0; padding:0; }
.footer-links a { display:inline-flex; align-items:center; gap:6px; min-height:44px; text-decoration:none; color:var(--secondary); font-size:14px; }
.footer-links a:hover,.nav-link:hover { color:var(--ink); text-decoration:underline; }
.arrow { font-size:12px; }
.social-icons { display:flex; flex-wrap:wrap; gap:12px; }
.social-icon { display:flex; align-items:center; justify-content:center; width:44px; height:44px; color:var(--ink); border:1px solid var(--border); border-radius:12px; }
.social-icon svg { width:24px; height:24px; }
.footer-bottom { max-width:1120px; margin:auto; border-top:1px solid var(--border); padding:24px 0; color:var(--secondary); font-size:12px; text-align:center; }

.download-page { min-height:100vh; min-height:100svh; display:grid; place-items:center; padding:32px 24px; text-align:center; }
.download-main { width:100%; max-width:600px; }
.download-main .support-brand { margin-bottom:32px; }
.download-main h1 { font-size:clamp(32px,6vw,44px); line-height:1.15; letter-spacing:-.035em; font-weight:700; }
.download-main .subtitle { margin:20px auto; color:var(--secondary); font-size:18px; }
.download-stores { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; column-gap:20px; row-gap:8px; margin:24px 0; }
.download-store { display:flex; align-items:center; justify-content:center; min-height:64px; border-radius:8px; }
.download-store.apple img { height:48px; width:auto; }
.download-store.google { margin-inline:calc(48px * -41 / 168); }
.download-store.google img { height:calc(48px * 250 / 168); width:auto; }
.redirecting { color:var(--secondary); margin-top:24px; }
.safari-hint { color:var(--secondary); background:#fff; border:1px solid var(--border); border-radius:12px; padding:20px; margin:24px auto; max-width:420px; text-align:left; }
.safari-hint strong { color:var(--ink); }
.download-back { display:inline-flex; align-items:center; min-height:44px; }

@media(max-width:760px) {
  .footer-inner { grid-template-columns:1fr 1fr; gap:24px 20px; }
  .footer-brand { grid-column:1/-1; }
  .footer-bottom { text-align:left; }
}
@media(max-width:480px) {
  .navbar { padding:20px 16px; }
  .navbar-inner { gap:16px; }
  .nav-links { gap:12px; }
  .nav-links a { font-size:14px; }
  .btn-nav { padding:10px 14px; }
  .legal-page .container { padding:24px 20px 56px; }
  .legal-page #delete-account,.legal-page .contact { padding:18px; }
  .article-page .article-body h2 { font-size:24px; }
  .article-page .article-body h3 { font-size:21px; }
  .article-page .article-body p,.article-page .article-body li { font-size:16px; }
  .article-page .article-subtitle { font-size:18px; }
  .article-page .faq-item,.article-page .short-answer-box { padding:20px; }
  .footer { padding:32px 20px 0; }
  .download-page { padding:28px 16px; }
  .download-stores { column-gap:16px; }
  .download-store.apple img { height:40px; }
  .download-store.google { margin-inline:calc(40px * -41 / 168); }
  .download-store.google img { height:calc(40px * 250 / 168); }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }