@font-face {
    font-family: "Zawid Arabic";
    src: url("../NotoNaskhArabic-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Zawid Arabic";
    src: url("../NotoNaskhArabic-Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

:root {
    --color-ink: #0b1b3a;
    --color-text: #172b43;
    --color-text-soft: #334d67;
    --color-muted: #566b80;
    --color-brand: #075fbf;
    --color-brand-strong: #064b97;
    --color-brand-soft: #eaf5ff;
    --color-accent: #2aa8b6;
    --color-success: #087a50;
    --color-success-strong: #06633f;
    --color-danger: #b83b35;
    --color-warning: #b87812;
    --color-bg: #f4f8fc;
    --color-surface: #fff;
    --color-surface-soft: #eef6fb;
    --color-border: #d7e5f0;
    --color-border-strong: #b9cfe0;

    --font-site: "Zawid Arabic", Tahoma, Arial, sans-serif;
    --container-width: 74rem;
    --reading-width: 48rem;
    --page-gutter: clamp(1rem, 4vw, 2rem);
    --header-height: 4.75rem;
    --section-space: clamp(3rem, 7vw, 5.75rem);
    --radius-sm: .55rem;
    --radius-md: .9rem;
    --radius-lg: 1.15rem;
    --radius-xl: 1.5rem;
    --radius-pill: 999px;
    --shadow-sm: 0 10px 28px rgba(9, 42, 82, .07);
    --shadow-md: 0 18px 48px rgba(9, 42, 82, .1);
    --shadow-lg: 0 28px 70px rgba(9, 42, 82, .16);
    --transition-fast: 180ms ease;

    /* Compatibility aliases used by existing page and blog styles. */
    --ink: var(--color-ink);
    --navy: var(--color-ink);
    --ink-soft: var(--color-text-soft);
    --blue: var(--color-brand);
    --blue-2: #1686d5;
    --teal: var(--color-accent);
    --green: var(--color-success);
    --success: var(--color-success);
    --amber: var(--color-warning);
    --red: var(--color-danger);
    --danger: var(--color-danger);
    --bg: var(--color-bg);
    --surface: var(--color-surface);
    --surface-2: var(--color-surface-soft);
    --border: var(--color-border);
    --muted: var(--color-muted);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-width: 20rem;
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-height) + 1rem);
    -webkit-text-size-adjust: 100%;
}

body {
    min-width: 20rem;
    min-height: 100vh;
    margin: 0;
    color: var(--color-text);
    background: var(--color-bg);
    font-family: var(--font-site);
    font-size: 1rem;
    font-synthesis: weight;
    line-height: 1.7;
    text-rendering: optimizeLegibility;
}

main {
    display: block;
    min-height: 40vh;
}

img,
svg,
video {
    display: block;
    max-width: 100%;
}

img {
    height: auto;
}

a {
    color: inherit;
    text-decoration-thickness: .08em;
    text-underline-offset: .18em;
}

button,
input,
textarea,
select {
    color: inherit;
    font: inherit;
}

button,
summary {
    -webkit-tap-highlight-color: transparent;
}

:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
    border-radius: var(--radius-sm);
    outline: 3px solid rgba(42, 168, 182, .52);
    outline-offset: 3px;
}

::selection {
    color: #fff;
    background: var(--color-brand);
}

h1,
h2,
h3,
p {
    overflow-wrap: break-word;
}

h1,
h2,
h3 {
    color: var(--color-ink);
    font-weight: 700;
    letter-spacing: -.018em;
    text-wrap: balance;
}

h1 {
    margin: 0;
    font-size: clamp(2.2rem, 6vw, 4.6rem);
    line-height: 1.12;
}

h2 {
    margin: 0;
    font-size: clamp(1.65rem, 3.7vw, 2.6rem);
    line-height: 1.3;
}

h3 {
    margin: 0;
    font-size: clamp(1.08rem, 2vw, 1.28rem);
    line-height: 1.45;
}

.container {
    width: min(100% - (2 * var(--page-gutter)), var(--container-width));
    margin-inline: auto;
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.skip-link {
    position: fixed;
    z-index: 9999;
    inset-inline-start: 1rem;
    top: .7rem;
    padding: .7rem 1rem;
    border-radius: var(--radius-md);
    color: #fff;
    background: var(--color-ink);
    box-shadow: var(--shadow-md);
    font-weight: 700;
    text-decoration: none;
    transform: translateY(-160%);
    transition: transform var(--transition-fast);
}

.skip-link:focus {
    transform: translateY(0);
}

/* Header and navigation */
.site-header {
    position: sticky;
    z-index: 1000;
    top: 0;
    border-bottom: 1px solid rgba(185, 207, 224, .72);
    background: rgba(255, 255, 255, .93);
    box-shadow: 0 4px 20px rgba(9, 42, 82, .035);
    backdrop-filter: blur(18px) saturate(1.15);
    transition: box-shadow var(--transition-fast), background-color var(--transition-fast);
}

.site-header[data-scrolled] {
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 12px 34px rgba(9, 42, 82, .1);
}

.header-inner {
    display: grid;
    min-height: var(--header-height);
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: clamp(.85rem, 2vw, 1.6rem);
    align-items: center;
}

.brand {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: .7rem;
    color: var(--color-ink);
    text-decoration: none;
}

.brand-mark {
    display: grid;
    width: 2.9rem;
    height: 2.9rem;
    flex: 0 0 auto;
    place-items: center;
    overflow: hidden;
    border: 1px solid #cfe0ec;
    border-radius: .9rem;
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.brand-mark img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.brand-copy {
    display: grid;
    min-width: 0;
    line-height: 1.18;
}

.brand-copy strong {
    color: var(--color-ink);
    font-size: 1.05rem;
    white-space: nowrap;
}

.brand-copy small {
    color: var(--color-muted);
    font-family: Arial, sans-serif;
    font-size: .7rem;
    letter-spacing: .02em;
}

.nav-links {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: .2rem;
}

.nav-links a {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    padding: .45rem .75rem;
    border-radius: .7rem;
    color: #3a526a;
    font-size: .92rem;
    font-weight: 700;
    text-decoration: none;
    transition: color var(--transition-fast), background-color var(--transition-fast);
}

.nav-links a:hover,
.nav-links a[aria-current="page"] {
    color: var(--color-brand-strong);
    background: var(--color-brand-soft);
}

.header-actions {
    display: flex;
    align-items: center;
    gap: .55rem;
}

.header-contact {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    gap: .45rem;
    padding: .45rem .7rem;
    border-radius: .75rem;
    color: #365068;
    font-size: .82rem;
    font-weight: 700;
    text-decoration: none;
}

.header-contact:hover {
    color: var(--color-success-strong);
    background: #eaf8f2;
}

.contact-dot {
    width: .55rem;
    height: .55rem;
    flex: 0 0 auto;
    border: 2px solid #d4f2e6;
    border-radius: 50%;
    background: var(--color-success);
    box-shadow: 0 0 0 2px rgba(8, 122, 80, .12);
}

.header-download {
    min-height: 2.75rem;
    padding-inline: .95rem;
    font-size: .88rem;
}

.mobile-nav {
    display: none;
    position: relative;
}

.mobile-nav summary {
    display: inline-flex;
    min-width: 2.9rem;
    min-height: 2.9rem;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: .45rem .7rem;
    border: 1px solid var(--color-border);
    border-radius: .8rem;
    color: var(--color-ink);
    background: #fff;
    cursor: pointer;
    font-size: .86rem;
    font-weight: 700;
    list-style: none;
}

.mobile-nav summary::-webkit-details-marker {
    display: none;
}

.hamburger-icon {
    display: grid;
    width: 1.15rem;
    gap: .22rem;
}

.hamburger-icon span {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: var(--radius-pill);
    background: currentColor;
    transition: transform var(--transition-fast), opacity var(--transition-fast);
}

.mobile-nav[open] .hamburger-icon span:nth-child(1) {
    transform: translateY(.36rem) rotate(45deg);
}

.mobile-nav[open] .hamburger-icon span:nth-child(2) {
    opacity: 0;
}

.mobile-nav[open] .hamburger-icon span:nth-child(3) {
    transform: translateY(-.36rem) rotate(-45deg);
}

.mobile-nav-panel {
    position: absolute;
    z-index: 1010;
    width: min(22rem, calc(100vw - (2 * var(--page-gutter))));
    max-height: calc(100dvh - var(--header-height) - 1.5rem);
    inset-inline-end: 0;
    top: calc(100% + .7rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: .75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .99);
    box-shadow: var(--shadow-lg);
}

.mobile-nav-links {
    display: grid;
    gap: .2rem;
}

.mobile-nav-links a {
    display: flex;
    min-height: 2.9rem;
    align-items: center;
    padding: .55rem .75rem;
    border-radius: .7rem;
    color: var(--color-text-soft);
    font-weight: 700;
    text-decoration: none;
}

.mobile-nav-links a:hover,
.mobile-nav-links a[aria-current="page"] {
    color: var(--color-brand-strong);
    background: var(--color-brand-soft);
}

.mobile-nav-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
    padding-top: .65rem;
    margin-top: .65rem;
    border-top: 1px solid var(--color-border);
}

.mobile-nav-actions .btn {
    width: 100%;
    padding-inline: .65rem;
}

/* Shared controls */
.btn {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .65rem 1.1rem;
    border: 1px solid transparent;
    border-radius: .85rem;
    cursor: pointer;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    text-decoration: none;
    transition: color var(--transition-fast), background-color var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.btn-primary {
    color: #fff;
    background: linear-gradient(135deg, var(--color-brand), var(--color-brand-strong));
    box-shadow: 0 10px 24px rgba(7, 95, 191, .2);
}

.btn-secondary {
    border-color: var(--color-border-strong);
    color: var(--color-brand-strong);
    background: #fff;
}

.btn-success {
    color: #fff;
    background: linear-gradient(135deg, #0b8b5b, var(--color-success-strong));
    box-shadow: 0 10px 24px rgba(8, 122, 80, .18);
}

.btn-muted {
    border-color: #d7e0e8;
    color: #3e5368;
    background: #eef3f7;
}

.btn-disabled,
.btn[aria-disabled="true"] {
    border-color: #dfe7ed;
    color: #687b8c;
    background: #eef2f5;
    box-shadow: none;
    cursor: not-allowed;
}

/* Sections and typography */
.section {
    padding-block: var(--section-space);
}

.section.compact {
    padding-block: clamp(2.25rem, 5vw, 4rem);
}

.band {
    border-block: 1px solid rgba(215, 229, 240, .82);
    background:
        radial-gradient(circle at 8% 10%, rgba(42, 168, 182, .075), transparent 20rem),
        var(--color-surface-soft);
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .7rem;
    color: var(--color-brand-strong);
    font-size: .88rem;
    font-weight: 700;
}

.eyebrow::before {
    width: 1.7rem;
    height: .2rem;
    border-radius: var(--radius-pill);
    background: linear-gradient(90deg, var(--color-brand), var(--color-accent));
    content: "";
}

.lead {
    max-width: 44rem;
    margin: .9rem 0 0;
    color: var(--color-muted);
    font-size: clamp(1rem, 1.7vw, 1.16rem);
    line-height: 1.9;
}

.section-head {
    max-width: 52rem;
    margin-bottom: clamp(1.7rem, 4vw, 2.7rem);
}

.section-head .lead {
    max-width: 47rem;
}

.actions,
.hero-actions,
.download-actions,
.contact-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
    align-items: center;
    margin-top: 1.35rem;
}

.grid-2,
.grid-3,
.grid-4,
.comparison,
.split,
.page-grid,
.support-grid,
.download-panel {
    display: grid;
    min-width: 0;
    gap: clamp(1rem, 2.5vw, 1.7rem);
}

.grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.split {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    align-items: center;
}

.page-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(17rem, .72fr);
    align-items: center;
}

.comparison,
.support-grid,
.download-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
}

.grid-2 > *,
.grid-3 > *,
.grid-4 > *,
.comparison > *,
.split > *,
.page-grid > *,
.support-grid > *,
.download-panel > * {
    min-width: 0;
}

/* Home hero */
.hero {
    position: relative;
    isolation: isolate;
    overflow: clip;
    padding-block: clamp(3.5rem, 7vw, 7rem);
    border-bottom: 1px solid var(--color-border);
    background:
        radial-gradient(circle at 5% 8%, rgba(42, 168, 182, .17), transparent 25rem),
        radial-gradient(circle at 95% 72%, rgba(7, 95, 191, .13), transparent 28rem),
        linear-gradient(145deg, #fff, #eaf5fd 72%, #f7fbfe);
}

.hero::before {
    position: absolute;
    z-index: -1;
    width: min(36rem, 85vw);
    aspect-ratio: 1;
    inset-inline-end: -18rem;
    bottom: -28rem;
    border: 1px solid rgba(7, 95, 191, .1);
    border-radius: 50%;
    box-shadow: 0 0 0 5rem rgba(7, 95, 191, .025), 0 0 0 10rem rgba(7, 95, 191, .018);
    content: "";
}

.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(25rem, .98fr);
    gap: clamp(2rem, 6vw, 5rem);
    align-items: center;
}

.hero .lead {
    max-width: 43rem;
    color: var(--color-text-soft);
    font-size: clamp(1.08rem, 2vw, 1.28rem);
}

.stat-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    max-width: 47rem;
    padding-top: 1.2rem;
    margin-top: 1.5rem;
    border-top: 1px solid rgba(185, 207, 224, .8);
}

.stat-item {
    min-width: 0;
    color: var(--color-ink);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.45;
}

.stat-item small {
    display: block;
    margin-bottom: .18rem;
    color: var(--color-muted);
    font-size: .73rem;
    font-weight: 400;
}

.visual-stack {
    position: relative;
    min-height: clamp(30rem, 52vw, 39rem);
    direction: ltr;
}

.phone-shot {
    position: absolute;
    z-index: 2;
    width: clamp(13.5rem, 25vw, 18rem);
    aspect-ratio: 520 / 1077;
    inset-inline-start: 9%;
    top: 0;
    overflow: hidden;
    border: .42rem solid #10243e;
    border-radius: 2.2rem;
    background: #fff;
    box-shadow: var(--shadow-lg);
    transform: rotate(-2deg);
}

.phone-shot::before {
    position: absolute;
    z-index: 2;
    width: 34%;
    height: .85rem;
    inset-inline-start: 33%;
    top: 0;
    border-radius: 0 0 .7rem .7rem;
    background: #10243e;
    content: "";
}

.phone-shot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.phone-shot.is-secondary {
    z-index: 1;
    width: clamp(11rem, 21vw, 15rem);
    inset-inline-start: auto;
    inset-inline-end: 4%;
    top: 13%;
    opacity: .92;
    transform: rotate(4deg);
}

.ledger-panel {
    position: absolute;
    z-index: 3;
    width: min(18rem, 76%);
    inset-inline-end: 0;
    bottom: 4%;
    padding: 1rem;
    border: 1px solid rgba(185, 207, 224, .84);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .94);
    box-shadow: var(--shadow-md);
    direction: rtl;
    backdrop-filter: blur(12px);
}

.ledger-panel > strong {
    display: block;
    margin-bottom: .45rem;
    color: var(--color-ink);
}

.ledger-row,
.table-row {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.ledger-row {
    padding-block: .4rem;
    color: var(--color-muted);
    font-size: .84rem;
}

.ledger-row + .ledger-row {
    border-top: 1px solid #e5edf3;
}

.ledger-row b {
    color: var(--color-brand-strong);
}

/* Internal page hero */
.page-hero {
    position: relative;
    isolation: isolate;
    overflow: clip;
    padding-block: clamp(3.25rem, 7vw, 6.5rem);
    border-bottom: 1px solid var(--color-border);
    background:
        radial-gradient(circle at 10% 10%, rgba(42, 168, 182, .12), transparent 22rem),
        radial-gradient(circle at 90% 92%, rgba(7, 95, 191, .1), transparent 26rem),
        linear-gradient(145deg, #fff, #edf7fe);
}

.page-hero h1 {
    max-width: 48rem;
    font-size: clamp(2.1rem, 5vw, 3.7rem);
}

.page-hero .media-frame {
    width: min(100%, 23rem);
    justify-self: end;
}

/* Cards and media */
.info-card,
.feature-card,
.plan-card,
.legal-card,
.mini-card,
.version-box,
.media-frame,
.table-like,
.cta-band {
    min-width: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.info-card,
.feature-card,
.plan-card,
.legal-card {
    padding: clamp(1.2rem, 3vw, 1.8rem);
}

.info-card,
.feature-card,
.plan-card {
    height: 100%;
}

.info-card h2,
.legal-card h2 {
    margin-bottom: .65rem;
    font-size: clamp(1.25rem, 2.3vw, 1.55rem);
}

.info-card h3,
.feature-card h3,
.plan-card h3 {
    margin-bottom: .45rem;
}

.info-card p,
.feature-card p,
.plan-card p,
.legal-card p {
    margin: 0;
    color: var(--color-muted);
    line-height: 1.82;
}

.info-card .lead,
.plan-card .lead {
    font-size: 1rem;
}

.feature-card {
    position: relative;
    overflow: hidden;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.feature-card::after {
    position: absolute;
    width: 7rem;
    height: 7rem;
    inset-inline-end: -4rem;
    bottom: -4rem;
    border-radius: 50%;
    background: rgba(42, 168, 182, .07);
    content: "";
}

.icon,
.number-badge {
    display: inline-grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    margin-bottom: .8rem;
    border-radius: .8rem;
    color: #fff;
    background: linear-gradient(135deg, var(--color-brand), var(--color-accent));
    box-shadow: 0 9px 20px rgba(7, 95, 191, .16);
    font-size: .88rem;
    font-weight: 700;
}

.number-badge {
    border-radius: var(--radius-pill);
}

.mini-card {
    display: flex;
    min-height: 4.3rem;
    align-items: center;
    padding: .85rem 1rem;
    border-radius: var(--radius-md);
    background: var(--color-surface-soft);
    box-shadow: none;
}

.mini-card strong {
    color: var(--color-text-soft);
}

.media-frame {
    display: grid;
    width: 100%;
    aspect-ratio: 4 / 5;
    place-items: center;
    overflow: hidden;
    padding: clamp(.8rem, 2.2vw, 1.35rem);
    background:
        radial-gradient(circle at 50% 20%, rgba(42, 168, 182, .14), transparent 14rem),
        linear-gradient(145deg, #e9f5fd, #f9fcfe);
}

.media-frame img {
    width: auto;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    border-radius: 1rem;
    object-fit: contain;
    filter: drop-shadow(0 18px 25px rgba(9, 42, 82, .13));
}

figure.media-frame {
    margin: 0;
}

.plan-card {
    position: relative;
}

.plan-card.featured {
    border-color: rgba(7, 95, 191, .55);
    background:
        radial-gradient(circle at 100% 0, rgba(42, 168, 182, .1), transparent 13rem),
        #fff;
    box-shadow: var(--shadow-md);
}

.pill {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    padding: .25rem .7rem;
    margin-bottom: .75rem;
    border: 1px solid #c9e0ef;
    border-radius: var(--radius-pill);
    color: var(--color-brand-strong);
    background: var(--color-brand-soft);
    font-size: .8rem;
    font-weight: 700;
}

.pill--danger {
    border-color: #f0cbc8;
    color: var(--color-danger);
    background: #fff3f2;
}

.pill--neutral {
    color: var(--color-ink);
    background: #f3f6f8;
}

.price {
    margin: .7rem 0;
    color: var(--color-brand-strong) !important;
    font-size: clamp(1.35rem, 3vw, 2rem);
    font-weight: 700;
}

.check-list,
.feature-list,
.install-steps {
    display: grid;
    gap: .7rem;
    padding: 0;
    margin: 1rem 0 0;
    list-style: none;
}

.check-list li,
.feature-list li,
.install-steps li {
    position: relative;
    min-width: 0;
    padding-inline-start: 1.7rem;
    color: var(--color-text-soft);
    line-height: 1.75;
}

.check-list li::before,
.feature-list li::before {
    position: absolute;
    display: grid;
    width: 1.15rem;
    height: 1.15rem;
    place-items: center;
    inset-inline-start: 0;
    top: .42rem;
    border-radius: 50%;
    color: #fff;
    background: var(--color-success);
    content: "✓";
    font-family: Arial, sans-serif;
    font-size: .68rem;
    font-weight: 700;
}

.install-steps {
    counter-reset: install-step;
}

.install-steps li {
    counter-increment: install-step;
    padding-inline-start: 2.25rem;
}

.install-steps li::before {
    position: absolute;
    display: grid;
    width: 1.6rem;
    height: 1.6rem;
    place-items: center;
    inset-inline-start: 0;
    top: .2rem;
    border-radius: .5rem;
    color: var(--color-brand-strong);
    background: var(--color-brand-soft);
    content: counter(install-step);
    font-size: .78rem;
    font-weight: 700;
}

.table-like {
    overflow: hidden;
    padding: .45rem 1.15rem;
}

.table-row {
    min-height: 4rem;
    padding-block: .8rem;
}

.table-row + .table-row {
    border-top: 1px solid #e3edf4;
}

.table-row strong {
    color: var(--color-ink);
}

.table-row span {
    color: var(--color-muted);
    text-align: end;
}

.cta-band {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(1.6rem, 4vw, 2.8rem);
    border-color: transparent;
    color: #fff;
    background:
        radial-gradient(circle at 5% 5%, rgba(42, 168, 182, .34), transparent 16rem),
        linear-gradient(135deg, #075fbf, #092a52);
    box-shadow: var(--shadow-lg);
}

.cta-band::after {
    position: absolute;
    z-index: -1;
    width: 16rem;
    aspect-ratio: 1;
    inset-inline-end: -7rem;
    bottom: -11rem;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 50%;
    box-shadow: 0 0 0 3rem rgba(255, 255, 255, .025), 0 0 0 6rem rgba(255, 255, 255, .02);
    content: "";
}

.cta-band h2,
.cta-band .lead {
    color: #fff;
}

.cta-band .lead {
    color: rgba(255, 255, 255, .84);
}

.cta-band .btn-secondary {
    border-color: rgba(255, 255, 255, .5);
    color: #fff;
    background: rgba(255, 255, 255, .1);
}

/* FAQ */
#faq {
    scroll-margin-top: calc(var(--header-height) + 1rem);
}

.faq-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.faq-item {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.faq-item summary {
    display: flex;
    min-height: 4rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    color: var(--color-ink);
    cursor: pointer;
    font-weight: 700;
    list-style: none;
}

.faq-item summary::-webkit-details-marker {
    display: none;
}

.faq-item summary:focus-visible {
    outline-offset: -3px;
}

.faq-item summary::after {
    display: grid;
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: .65rem;
    color: var(--color-brand-strong);
    background: var(--color-brand-soft);
    content: "+";
    font-family: Arial, sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
}

.faq-item[open] summary::after {
    content: "−";
}

.faq-item p {
    padding: 0 1.15rem 1.15rem;
    margin: 0;
    color: var(--color-muted);
    line-height: 1.85;
}

.faq-item p a {
    color: var(--color-brand-strong);
    font-weight: 700;
}

/* Shared accessibility safeguards for the existing blog presentation layer. */
.blog-hero {
    background: linear-gradient(135deg, #064b97, #0b2b58) !important;
}

.blog-hero :where(.blog-breadcrumb, .blog-breadcrumb a, .blog-eyebrow, .lead) {
    color: #fff !important;
    opacity: 1 !important;
}

.article-heading-anchor:focus-visible {
    border-radius: .25rem;
    outline: 3px solid var(--color-brand) !important;
    outline-offset: .3rem !important;
}

.blog-card__media:focus-visible,
.related-card__media:focus-visible {
    outline-offset: -3px !important;
}

/* Official Google Play presentation */
.store-hero-visual {
    position: relative;
    min-height: clamp(33rem, 50vw, 39rem);
    direction: ltr;
}

.store-hero-shot {
    position: absolute;
    z-index: 2;
    width: clamp(16rem, 27vw, 20rem);
    left: 4%;
    top: 0;
    overflow: hidden;
    margin: 0;
    border: 1px solid rgba(129, 170, 202, .76);
    border-radius: 1.8rem;
    background: #eef7ff;
    box-shadow: 0 28px 65px rgba(9, 42, 82, .2);
    transform: rotate(-1.4deg);
}

.store-hero-shot img {
    display: block;
    width: 100%;
    height: auto;
}

.store-hero-shot--secondary {
    z-index: 1;
    width: clamp(11rem, 19vw, 14rem);
    right: 0;
    left: auto;
    top: 12%;
    opacity: .92;
    transform: rotate(3.2deg);
}

.store-hero-identity {
    position: absolute;
    z-index: 3;
    right: 0;
    bottom: 3%;
    display: flex;
    max-width: min(19rem, 84%);
    align-items: center;
    gap: .75rem;
    padding: .75rem .9rem;
    border: 1px solid rgba(185, 207, 224, .9);
    border-radius: 1.15rem;
    background: rgba(255, 255, 255, .96);
    box-shadow: var(--shadow-md);
    direction: rtl;
    backdrop-filter: blur(12px);
}

.store-hero-identity img {
    width: 3.4rem;
    height: 3.4rem;
    flex: 0 0 auto;
    border-radius: .85rem;
    box-shadow: var(--shadow-sm);
}

.store-hero-identity span,
.app-identity span {
    display: grid;
    min-width: 0;
}

.store-hero-identity small,
.app-identity small {
    color: var(--color-muted);
    font-size: .73rem;
}

.store-hero-identity strong,
.app-identity strong {
    color: var(--color-ink);
    line-height: 1.45;
}

.gallery-help {
    margin: 0 0 .8rem;
    color: var(--color-muted);
    font-size: .88rem;
}

.store-gallery {
    display: grid;
    max-width: 100%;
    grid-auto-columns: clamp(16.5rem, 25vw, 19rem);
    grid-auto-flow: column;
    gap: 1rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding: .35rem .15rem 1.15rem;
    margin: 0;
    list-style: none;
    scroll-padding-inline: .15rem;
    scroll-snap-type: inline mandatory;
    scrollbar-color: #7caed2 #e4eef6;
    scrollbar-width: thin;
}

.store-gallery:focus-visible {
    border-radius: var(--radius-md);
    outline: 3px solid var(--color-brand);
    outline-offset: .3rem;
}

.store-gallery-item {
    min-width: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
}

.store-gallery-item figure {
    height: 100%;
    overflow: hidden;
    margin: 0;
    border: 1px solid var(--color-border);
    border-radius: 1.35rem;
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.store-gallery-item img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 941 / 1672;
    background: #eef6ff;
    object-fit: cover;
}

.store-gallery-item figcaption {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: .7rem;
    align-items: center;
    min-height: 4.8rem;
    padding: .85rem 1rem;
    border-top: 1px solid var(--color-border);
}

.store-gallery-item figcaption span {
    display: grid;
    width: 2.15rem;
    height: 2.15rem;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--color-brand);
    font-family: Arial, sans-serif;
    font-size: .72rem;
    font-weight: 700;
}

.store-gallery-item figcaption strong {
    color: var(--color-ink);
    font-size: .94rem;
    line-height: 1.55;
}

.app-identity {
    display: flex;
    align-items: center;
    gap: .85rem;
}

.app-identity--hero {
    width: fit-content;
    max-width: 100%;
    padding: .65rem .8rem;
    margin-bottom: 1.1rem;
    border: 1px solid rgba(185, 207, 224, .85);
    border-radius: 1rem;
    background: rgba(255, 255, 255, .72);
}

.app-identity img {
    width: 3.7rem;
    height: 3.7rem;
    flex: 0 0 auto;
    border-radius: .9rem;
    box-shadow: var(--shadow-sm);
}

.store-poster-frame {
    aspect-ratio: 941 / 1672;
    padding: .45rem;
}

.store-poster-frame img {
    width: 100%;
    height: auto;
    max-height: none;
    border-radius: 1.2rem;
}

.store-details-grid,
.store-trust-grid,
.apk-alternative {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(18rem, .85fr);
    gap: clamp(1rem, 2.5vw, 1.7rem);
    align-items: stretch;
}

.app-profile-card,
.store-facts-card,
.store-safety-card,
.store-release-card,
.apk-intro {
    min-width: 0;
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.app-profile-head {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.app-profile-head img {
    width: clamp(4.4rem, 9vw, 6rem);
    height: clamp(4.4rem, 9vw, 6rem);
    flex: 0 0 auto;
    border-radius: 1.25rem;
    box-shadow: var(--shadow-sm);
}

.app-profile-head .eyebrow {
    margin-bottom: .25rem;
}

.app-profile-head h2,
.store-facts-card h2,
.store-safety-card h2,
.store-release-card h2,
.apk-intro h2 {
    margin-bottom: .5rem;
}

.app-profile-head p:not(.eyebrow) {
    margin: 0;
    color: var(--color-muted);
}

.store-facts {
    display: grid;
    margin: .9rem 0 0;
}

.store-facts > div {
    display: grid;
    grid-template-columns: minmax(7rem, .7fr) minmax(0, 1fr);
    gap: .8rem;
    padding-block: .72rem;
    border-top: 1px solid var(--color-border);
}

.store-facts dt {
    color: var(--color-muted);
}

.store-facts dd {
    margin: 0;
    color: var(--color-ink);
    font-weight: 700;
}

.store-safety-card {
    background:
        radial-gradient(circle at 100% 0, rgba(42, 168, 182, .11), transparent 15rem),
        var(--color-surface);
}

.store-disclaimer,
.store-updated {
    margin: 1rem 0 0;
    color: var(--color-muted);
    font-size: .9rem;
    line-height: 1.8;
}

.store-release-card {
    background: linear-gradient(145deg, #075fbf, #092a52);
}

.store-release-card :where(h2, .feature-list li, .store-updated) {
    color: #fff;
}

.store-release-card .eyebrow {
    color: #d9f6fa;
}

.store-release-card .eyebrow::before {
    background: #67d4de;
}

.store-release-card .feature-list li::before {
    background: #67d4de;
}

.apk-intro {
    background:
        radial-gradient(circle at 100% 0, rgba(7, 95, 191, .08), transparent 15rem),
        var(--color-surface);
}

.apk-checksum {
    display: grid;
    gap: .45rem;
    padding-top: 1rem;
    margin-top: 1.3rem;
    border-top: 1px solid var(--color-border);
}

.apk-checksum strong {
    color: var(--color-ink);
    font-size: .84rem;
}

.apk-checksum code {
    max-width: 100%;
    overflow-wrap: anywhere;
    color: var(--color-muted);
    font-size: .74rem;
    line-height: 1.65;
}

/* Download and support */
.download-summary {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: 1.5rem;
}

.download-summary > span {
    display: grid;
    min-width: 7.25rem;
    min-height: 3.6rem;
    align-content: center;
    padding: .55rem .75rem;
    border: 1px solid var(--color-border);
    border-radius: .8rem;
    color: var(--color-ink);
    background: rgba(255, 255, 255, .78);
    font-size: .86rem;
    font-weight: 700;
}

.download-summary small {
    color: var(--color-muted);
    font-size: .7rem;
    font-weight: 400;
}

.version-box {
    display: grid;
    min-height: 100%;
    align-content: center;
    justify-items: start;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    color: #fff;
    background:
        radial-gradient(circle at 15% 10%, rgba(42, 168, 182, .32), transparent 13rem),
        linear-gradient(145deg, #075fbf, #092a52);
}

.version-box > span:first-child {
    color: rgba(255, 255, 255, .76);
    font-size: .85rem;
}

.version-box > strong {
    margin-block: .3rem;
    color: #fff;
    font-size: clamp(2.4rem, 6vw, 4rem);
    line-height: 1;
}

.version-box > p {
    margin: .2rem 0;
    color: rgba(255, 255, 255, .82);
}

.version-box .pill {
    margin-top: .8rem;
}

.release-checksum {
    width: 100%;
    max-width: 100%;
    padding-top: .8rem;
    margin-top: 1rem !important;
    border-top: 1px solid rgba(255, 255, 255, .18);
    direction: ltr;
    text-align: left;
}

.release-checksum small {
    display: block;
    font-size: .72rem;
}

.release-checksum code {
    display: block;
    max-width: 100%;
    color: #fff;
    font-family: Consolas, monospace;
    font-size: .72rem;
    overflow-wrap: anywhere;
    word-break: break-all;
}

.contact-list {
    display: grid;
    gap: .55rem;
    margin-top: 1.2rem;
}

.contact-row {
    display: grid;
    min-width: 0;
    min-height: 3.8rem;
    align-content: center;
    gap: .12rem;
    padding: .65rem .8rem;
    border: 1px solid var(--color-border);
    border-radius: .75rem;
    color: var(--color-text-soft);
    background: #f7fafc;
    text-decoration: none;
}

a.contact-row:hover {
    border-color: #a9cce4;
    color: var(--color-brand-strong);
    background: #eef7fd;
}

.contact-row small {
    color: var(--color-muted);
    font-size: .72rem;
}

.contact-value {
    min-width: 0;
    max-width: 100%;
    font-weight: 700;
    overflow-wrap: anywhere;
    unicode-bidi: plaintext;
    white-space: normal;
    word-break: break-word;
}

/* Legacy legal pages */
.legal-page {
    background: linear-gradient(180deg, #eef7fd 0, #fff 28rem);
}

.legal-hero {
    padding-block: clamp(3rem, 7vw, 5.5rem);
    border-bottom: 1px solid var(--color-border);
    background:
        radial-gradient(circle at 8% 12%, rgba(42, 168, 182, .11), transparent 20rem),
        linear-gradient(145deg, #fff, #edf7fe);
}

.legal-hero .lead {
    margin-top: .75rem;
}

.legal-grid {
    display: grid;
    gap: 1rem;
}

.legal-card {
    position: relative;
    overflow: hidden;
    scroll-margin-top: calc(var(--header-height) + 1rem);
}

.legal-card::before {
    position: absolute;
    width: .25rem;
    inset-block: 1.15rem;
    inset-inline-start: 0;
    border-radius: var(--radius-pill);
    background: linear-gradient(180deg, var(--color-brand), var(--color-accent));
    content: "";
}

.legal-contact a {
    color: var(--color-brand-strong);
    font-weight: 700;
    overflow-wrap: anywhere;
}

/* Trust pages */
.trust-page {
    --trust-ink: var(--color-text);
    --trust-muted: var(--color-muted);
    --trust-line: var(--color-border);
    --trust-blue: var(--color-brand);
    --trust-blue-dark: var(--color-brand-strong);
    --trust-soft: var(--color-surface-soft);
    color: var(--trust-ink);
    background: linear-gradient(180deg, #f0f7fc 0, #fff 34rem);
}

.trust-hero {
    position: relative;
    overflow: clip;
    padding-block: clamp(3rem, 7vw, 6rem);
    color: #fff;
    background:
        radial-gradient(circle at 12% 15%, rgba(70, 215, 214, .24), transparent 24rem),
        radial-gradient(circle at 90% 85%, rgba(87, 157, 255, .18), transparent 28rem),
        linear-gradient(135deg, #071a38, #07539d 64%, #0d6fa8);
}

.trust-hero::after {
    position: absolute;
    width: min(32rem, 75vw);
    aspect-ratio: 1;
    inset-inline-end: -16rem;
    bottom: -24rem;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 50%;
    box-shadow: 0 0 0 5rem rgba(255, 255, 255, .025), 0 0 0 10rem rgba(255, 255, 255, .02);
    content: "";
}

.trust-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 58rem;
}

.trust-breadcrumb {
    margin-bottom: 1.5rem;
    color: rgba(255, 255, 255, .86);
    font-size: .9rem;
    font-weight: 700;
}

.trust-breadcrumb ol {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .65rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

.trust-breadcrumb li {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: .65rem;
}

.trust-breadcrumb li:not(:last-child)::after {
    content: "‹";
    opacity: .72;
}

.trust-breadcrumb a {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: .28em;
}

.trust-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    margin: 0 0 .8rem;
    color: #c4efff;
    font-size: .9rem;
    font-weight: 700;
}

.trust-eyebrow::before {
    width: 1.8rem;
    height: .2rem;
    border-radius: var(--radius-pill);
    background: #55d1d2;
    content: "";
}

.trust-hero h1 {
    max-width: 48rem;
    color: #fff;
    font-size: clamp(2.15rem, 5.5vw, 4rem);
}

.trust-hero__intro {
    max-width: 47rem;
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, .9);
    font-size: clamp(1rem, 2vw, 1.18rem);
    line-height: 1.9;
}

.trust-updated {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    gap: .45rem;
    padding: .35rem .8rem;
    margin: 1.35rem 0 0;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: var(--radius-pill);
    color: #fff;
    background: rgba(4, 27, 58, .28);
    font-size: .86rem;
    font-weight: 700;
}

.trust-section {
    padding-block: var(--section-space);
}

.trust-layout {
    display: grid;
    grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr);
    gap: clamp(1.4rem, 3vw, 3rem);
    align-items: start;
}

.trust-sidebar {
    display: grid;
    position: sticky;
    top: calc(var(--header-height) + 1.25rem);
    gap: 1rem;
}

.trust-nav,
.trust-context,
.trust-contact,
.trust-card {
    min-width: 0;
    border: 1px solid var(--trust-line);
    border-radius: var(--radius-lg);
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.trust-nav,
.trust-context {
    padding: 1.1rem;
}

.trust-nav h2,
.trust-context h2 {
    margin: 0 0 .75rem;
    font-size: 1rem;
}

.trust-nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.trust-nav li + li {
    border-top: 1px solid #e8f0f5;
}

.trust-nav a {
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .55rem .65rem;
    border-radius: .7rem;
    color: #38536d;
    font-size: .9rem;
    font-weight: 700;
    text-decoration: none;
}

.trust-nav a::after {
    color: #8ba1b5;
    content: "←";
}

.trust-nav a:hover,
.trust-nav a[aria-current="page"] {
    color: var(--trust-blue-dark);
    background: #edf7fe;
}

.trust-context {
    background: linear-gradient(145deg, #fff, #edf7fd);
}

.trust-context p {
    margin: 0;
    color: var(--trust-muted);
    font-size: .88rem;
    line-height: 1.75;
}

.trust-content {
    display: grid;
    min-width: 0;
    gap: 1rem;
}

.trust-card {
    position: relative;
    overflow: hidden;
    padding: clamp(1.25rem, 3.5vw, 2.25rem);
    scroll-margin-top: calc(var(--header-height) + 1rem);
}

.trust-card::before {
    position: absolute;
    width: .25rem;
    inset-block: 1.25rem;
    inset-inline-start: 0;
    border-radius: var(--radius-pill);
    background: linear-gradient(180deg, var(--trust-blue), var(--color-accent));
    content: "";
}

.trust-card h2 {
    margin: 0 0 .85rem;
    font-size: clamp(1.25rem, 2.5vw, 1.65rem);
}

.trust-card p {
    margin: 0;
    color: var(--color-text-soft);
    line-height: 1.95;
}

.trust-card p + p {
    margin-top: .9rem;
}

.trust-card ul {
    display: grid;
    gap: .65rem;
    padding: 0;
    margin: .25rem 0 0;
    list-style: none;
}

.trust-card li {
    position: relative;
    padding-inline-start: 1.45rem;
    color: var(--color-text-soft);
    line-height: 1.85;
}

.trust-card li::before {
    position: absolute;
    width: .55rem;
    height: .55rem;
    inset-inline-start: .1rem;
    top: .78rem;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--trust-blue);
    box-shadow: 0 0 0 2px #cde5f5;
    content: "";
}

.trust-links {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    padding-top: 1rem;
    margin-top: 1.1rem;
    border-top: 1px solid #e2ecf3;
}

.trust-links a {
    display: inline-flex;
    min-height: 2.65rem;
    align-items: center;
    gap: .4rem;
    padding: .45rem .8rem;
    border: 1px solid #cee2f0;
    border-radius: var(--radius-pill);
    color: var(--trust-blue-dark);
    background: #f1f8fd;
    font-size: .86rem;
    font-weight: 700;
    line-height: 1.45;
    text-decoration: none;
}

.trust-links a:hover {
    border-color: #9dc8e4;
    background: #e5f3fc;
}

.trust-contact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.25rem;
    align-items: center;
    padding: clamp(1.3rem, 3vw, 2rem);
    margin-top: .4rem;
    color: #fff;
    background:
        radial-gradient(circle at 5% 5%, rgba(42, 168, 182, .3), transparent 12rem),
        linear-gradient(135deg, #075fbf, #092a52);
}

.trust-contact h2 {
    margin: 0 0 .35rem;
    color: #fff;
    font-size: 1.3rem;
}

.trust-contact p {
    margin: 0;
    color: rgba(255, 255, 255, .86);
    line-height: 1.7;
}

.trust-contact a {
    display: inline-flex;
    min-width: 0;
    min-height: 2.85rem;
    align-items: center;
    justify-content: center;
    padding: .55rem 1rem;
    border-radius: .75rem;
    color: #092a52;
    background: #fff;
    font-weight: 700;
    text-decoration: none;
    overflow-wrap: anywhere;
}

/* Footer */
.site-footer {
    color: #d7e4ee;
    background:
        radial-gradient(circle at 8% 5%, rgba(42, 168, 182, .13), transparent 20rem),
        linear-gradient(145deg, #071a38, #092a52);
}

.footer-grid {
    display: grid;
    grid-template-columns: minmax(18rem, 1.6fr) repeat(3, minmax(9rem, .7fr));
    gap: clamp(1.5rem, 4vw, 3.5rem);
    padding-block: clamp(3.25rem, 7vw, 5rem);
}

.brand--footer,
.brand--footer .brand-copy strong {
    color: #fff;
}

.brand--footer .brand-copy small {
    color: #a9bed0;
}

.footer-brand > p {
    max-width: 28rem;
    margin: 1rem 0 0;
    color: #b8c9d8;
    line-height: 1.8;
}

.footer-contact {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .8rem;
    margin-top: 1rem;
}

.footer-contact a {
    min-width: 0;
    color: #fff;
    font-size: .85rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.footer-column {
    display: grid;
    align-content: start;
    gap: .45rem;
}

.footer-column h2 {
    margin: 0 0 .55rem;
    color: #fff;
    font-size: 1rem;
}

.footer-column a {
    display: inline-flex;
    min-height: 2.25rem;
    align-items: center;
    width: fit-content;
    color: #b8c9d8;
    font-size: .88rem;
    text-decoration: none;
}

.footer-column a:hover {
    color: #fff;
    text-decoration: underline;
}

.footer-bottom {
    display: flex;
    min-height: 4.5rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-block: 1rem;
    border-top: 1px solid rgba(255, 255, 255, .12);
    color: #9db2c4;
    font-size: .8rem;
}

.footer-bottom p {
    margin: 0;
}

/* Hover effects only where a real hover pointer exists. */
@media (hover: hover) and (pointer: fine) {
    .btn:not([aria-disabled="true"]):hover {
        transform: translateY(-2px);
    }

    .btn-primary:hover {
        box-shadow: 0 14px 28px rgba(7, 95, 191, .26);
    }

    .btn-secondary:hover {
        border-color: #9bbfd9;
        background: #f4f9fd;
    }

    .btn-success:hover {
        box-shadow: 0 14px 28px rgba(8, 122, 80, .24);
    }

    .feature-card:hover {
        border-color: rgba(7, 95, 191, .3);
        box-shadow: var(--shadow-md);
        transform: translateY(-3px);
    }
}

@media (max-width: 1120px) {
    .header-contact {
        display: none;
    }

    .hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(22rem, .82fr);
    }

    .grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .footer-grid {
        grid-template-columns: minmax(18rem, 1.4fr) repeat(2, minmax(10rem, .7fr));
    }

    .footer-column:last-child {
        grid-column: 2 / -1;
    }
}

@media (max-width: 920px) {
    .header-inner {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .nav-links,
    .header-actions {
        display: none;
    }

    .mobile-nav {
        display: block;
    }

    .hero-grid,
    .page-grid,
    .split,
    .trust-layout {
        grid-template-columns: 1fr;
    }

    .hero-grid {
        gap: 2.5rem;
    }

    .visual-stack {
        width: min(100%, 37rem);
        min-height: 35rem;
        margin-inline: auto;
    }

    .store-hero-visual {
        width: min(100%, 37rem);
        min-height: 38rem;
        margin-inline: auto;
    }

    .store-details-grid,
    .store-trust-grid,
    .apk-alternative {
        grid-template-columns: 1fr;
    }

    .page-hero .media-frame {
        width: min(100%, 26rem);
        justify-self: center;
    }

    .split > .media-frame {
        width: min(100%, 30rem);
        justify-self: center;
    }

    .trust-sidebar {
        position: static;
    }

    .trust-nav ul {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .3rem;
    }

    .trust-nav li + li {
        border-top: 0;
    }

    .footer-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .footer-brand {
        grid-column: 1 / -1;
    }

    .footer-column:last-child {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    :root {
        --header-height: 4.35rem;
    }

    .brand-mark {
        width: 2.65rem;
        height: 2.65rem;
        border-radius: .8rem;
    }

    .grid-3,
    .comparison,
    .support-grid,
    .download-panel,
    .faq-grid {
        grid-template-columns: 1fr;
    }

    .grid-3 > .media-frame {
        width: min(100%, 27rem);
        justify-self: center;
    }

    .stat-strip {
        grid-template-columns: 1fr;
    }

    .stat-item {
        display: grid;
        grid-template-columns: minmax(6.5rem, .45fr) minmax(0, 1fr);
        gap: .75rem;
        align-items: baseline;
    }

    .stat-item + .stat-item {
        padding-top: .55rem;
        border-top: 1px solid #dfeaf2;
    }

    .visual-stack {
        min-height: 31rem;
    }

    .phone-shot {
        width: 14rem;
    }

    .phone-shot.is-secondary {
        width: 11.8rem;
    }

    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .footer-brand {
        grid-column: 1 / -1;
    }

    .trust-contact {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 580px) {
    :root {
        --page-gutter: 1rem;
    }

    h1 {
        font-size: clamp(2rem, 12vw, 3rem);
    }

    .brand-copy small {
        display: none;
    }

    .menu-label {
        display: none;
    }

    .mobile-nav summary {
        padding-inline: .78rem;
    }

    .mobile-nav-panel {
        position: fixed;
        width: auto;
        inset-inline: var(--page-gutter);
        top: calc(var(--header-height) + .55rem);
    }

    .mobile-nav-actions,
    .grid-2,
    .grid-4,
    .trust-nav ul {
        grid-template-columns: 1fr;
    }

    .hero,
    .page-hero,
    .trust-hero {
        padding-block: 2.7rem 3.2rem;
    }

    .hero-actions,
    .actions,
    .download-actions,
    .contact-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    :where(.hero-actions, .actions, .download-actions, .contact-actions) .btn {
        width: 100%;
    }

    .visual-stack {
        width: 100%;
        min-height: 28rem;
    }

    .store-hero-visual {
        width: 100%;
        min-height: 32rem;
    }

    .store-hero-shot {
        width: min(18rem, 70vw);
        left: 0;
        border-radius: 1.4rem;
    }

    .store-hero-shot--secondary {
        width: min(11rem, 43vw);
        right: 0;
        left: auto;
    }

    .store-hero-identity {
        right: 0;
        bottom: 0;
    }

    .store-gallery {
        grid-auto-columns: min(78vw, 18rem);
        gap: .75rem;
    }

    .app-profile-head {
        align-items: flex-start;
    }

    .phone-shot {
        width: 12.7rem;
        inset-inline-start: 2%;
        border-width: .32rem;
        border-radius: 1.75rem;
    }

    .phone-shot.is-secondary {
        width: 10.4rem;
        inset-inline-end: 0;
    }

    .ledger-panel {
        width: min(17rem, 86%);
        bottom: 1%;
    }

    .media-frame {
        aspect-ratio: 4 / 5;
        border-radius: var(--radius-lg);
    }

    .table-row {
        align-items: flex-start;
        flex-direction: column;
        gap: .2rem;
    }

    .table-row span {
        text-align: start;
    }

    .download-summary {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .download-summary > span {
        min-width: 0;
    }

    .trust-card,
    .trust-nav,
    .trust-context,
    .trust-contact,
    .info-card,
    .feature-card,
    .plan-card,
    .legal-card {
        border-radius: var(--radius-lg);
    }

    .trust-links {
        display: grid;
        grid-template-columns: 1fr;
    }

    .trust-links a {
        border-radius: .75rem;
    }

    .footer-grid {
        grid-template-columns: 1fr;
    }

    .footer-brand {
        grid-column: auto;
    }

    .footer-bottom {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
    }
}

@media (max-width: 380px) {
    :root {
        --page-gutter: .75rem;
    }

    .brand-copy strong {
        max-width: 9.5rem;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .visual-stack {
        min-height: 25rem;
    }

    .store-hero-visual {
        min-height: 28.5rem;
    }

    .store-hero-shot {
        width: min(15.8rem, 72vw);
    }

    .store-hero-shot--secondary {
        width: min(9.2rem, 42vw);
    }

    .store-hero-identity {
        max-width: 92%;
        padding: .6rem .7rem;
    }

    .store-hero-identity img {
        width: 3rem;
        height: 3rem;
    }

    .store-facts > div {
        grid-template-columns: 1fr;
        gap: .2rem;
    }

    .phone-shot {
        width: 11.1rem;
    }

    .phone-shot.is-secondary {
        width: 9rem;
    }

    .ledger-panel {
        width: 92%;
        padding: .8rem;
    }

    .download-summary {
        grid-template-columns: 1fr;
    }

    .trust-updated {
        align-items: flex-start;
        border-radius: var(--radius-md);
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }

    .btn,
    .feature-card,
    .phone-shot,
    .phone-shot.is-secondary,
    .store-hero-shot,
    .store-hero-shot--secondary {
        transform: none !important;
    }
}

@media (forced-colors: active) {
    .site-header,
    .mobile-nav summary,
    .mobile-nav-panel,
    .btn,
    .info-card,
    .feature-card,
    .plan-card,
    .legal-card,
    .mini-card,
    .version-box,
    .media-frame,
    .table-like,
    .cta-band,
    .faq-item,
    .trust-nav,
    .trust-context,
    .trust-contact,
    .trust-card,
    .store-gallery-item figure,
    .app-profile-card,
    .store-facts-card,
    .store-safety-card,
    .store-release-card,
    .apk-intro {
        border: 1px solid CanvasText;
        box-shadow: none;
    }

    .btn,
    .pill,
    .icon,
    .number-badge,
    .faq-item summary::after {
        forced-color-adjust: none;
    }

    :where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
        outline: 3px solid Highlight;
    }
}

@media print {
    html,
    body {
        color: #000;
        background: #fff;
    }

    .site-header,
    .site-footer,
    .skip-link,
    .hero-actions,
    .actions,
    .download-actions,
    .contact-actions,
    .trust-sidebar,
    .trust-contact {
        display: none !important;
    }

    .section,
    .hero,
    .page-hero,
    .trust-hero,
    .trust-section {
        padding-block: 1.5rem;
        color: #000;
        background: #fff;
    }

    .trust-hero :where(h1, p, a),
    .cta-band :where(h2, p) {
        color: #000;
    }

    .info-card,
    .feature-card,
    .plan-card,
    .legal-card,
    .trust-card,
    .media-frame {
        break-inside: avoid;
        box-shadow: none;
    }
}