/* ==========================================================================
   PDF READER: SCAN, EDIT & SIGN — app landing page + legal pages (scoped .pr-page)
   "Paper & ink" identity taken from the app: deep ink backgrounds, the app's
   signal-red buttons and the yellow accent from its icon, ruled-paper lines and
   the scanner's red corner frame, with clean white sections that match the app's
   own UI. Same layout system as the Live Earth Map page. Note: the theme's root
   font-size is 20px.
   ========================================================================== */
.pr-page {
    --pr-night: #110709;
    --pr-night-2: #260c11;
    --pr-red: #e30613;
    --pr-red-2: #c0000f;
    --pr-rose: #ff5a64;
    --pr-sun: #ffd43b;
    --pr-ink: #1d1214;
    --pr-muted: #64575a;
    --pr-line: rgba(29, 18, 20, .08);
    --pr-soft: #f8f4f4;
    --pr-grad: linear-gradient(100deg, #c4000f 0%, #e30613 55%, #ff3b47 100%);
    --pr-grad-text-dark: linear-gradient(100deg, #ff6b73 0%, #ffd43b 100%);
    --pr-grad-text-light: linear-gradient(100deg, #c4000f 0%, #ff4d2e 100%);
    color: var(--pr-muted);
    overflow-x: clip;
}
.pr-page section { position: relative; }

/* --- header on the dark hero (same approach as the Live Earth Map page) --- */
.pr-header-bg { background: transparent !important; position: relative; z-index: 4; }
.pr-header-bg .navbar .nav-link { color: rgba(255, 255, 255, .84) !important; }
.pr-header-bg .navbar .nav-link:hover { color: #fff !important; }
.pr-header-bg .navbar .social-muted a, .pr-header-bg .navbar .tk-social a { color: rgba(255, 255, 255, .72) !important; }
.pr-header-bg .navbar .hamburger span,
.pr-header-bg .navbar .hamburger span:before,
.pr-header-bg .navbar .hamburger span:after { background: #fff !important; }
.tk-logo-dark { display: none; }
.tk-logo-light { display: inline-block; }
.navbar-clone .tk-logo-dark { display: none; }
.navbar-clone .tk-logo-light { display: inline-block; }
.navbar-clone.navbar-stick {
    background: rgba(17, 7, 9, .9) !important;
    -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .4) !important;
}
.navbar-clone .nav-link { color: rgba(255, 255, 255, .84) !important; }
.navbar-clone .nav-link:hover { color: #fff !important; }
.navbar-clone .social-muted a, .navbar-clone .tk-social a { color: rgba(255, 255, 255, .72) !important; }
.navbar-clone .hamburger span,
.navbar-clone .hamburger span:before,
.navbar-clone .hamburger span:after { background: #fff !important; }

/* --- ruled-paper lines with a red margin (pure CSS) --- */
.pr-paper {
    position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background-image:
        linear-gradient(90deg, transparent 0 2.2rem, rgba(255, 90, 100, .16) 2.2rem calc(2.2rem + 1px), transparent calc(2.2rem + 1px)),
        repeating-linear-gradient(180deg, transparent 0 33px, rgba(255, 150, 156, .07) 33px 34px);
    -webkit-mask-image: radial-gradient(120% 90% at 60% 40%, #000 30%, transparent 85%);
    mask-image: radial-gradient(120% 90% at 60% 40%, #000 30%, transparent 85%);
}

/* --- shared type & chips --- */
.pr-kicker {
    display: inline-flex; align-items: center; gap: .45rem;
    font-size: .66rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
    color: var(--pr-red-2); background: rgba(227, 6, 19, .08); border: 1px solid rgba(227, 6, 19, .24);
    padding: .42rem .9rem; border-radius: 2rem;
}
.pr-kicker i { font-size: .9rem; }
.pr-kicker.on-dark { color: #ffd6d9; background: rgba(255, 255, 255, .06); border-color: rgba(255, 150, 156, .28); }
.pr-page .pr-h2 {
    margin: 1rem 0 0; color: var(--pr-ink);
    font-weight: 800; letter-spacing: -.03em; line-height: 1.12;
    font-size: clamp(1.6rem, 3vw, 2.4rem); text-wrap: balance;
}
.pr-grad, .pr-grad-dark { -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.pr-grad { background-image: var(--pr-grad-text-dark); }
.pr-grad-dark { background-image: var(--pr-grad-text-light); }
.pr-lead { margin: .9rem 0 0; font-size: .86rem; line-height: 1.75; color: var(--pr-muted); text-wrap: pretty; }
.pr-lead.on-dark { color: #c9b1b4; }
.pr-lead a { color: var(--pr-red-2); font-weight: 600; }
.pr-head { max-width: 40rem; margin: 0 auto 2.4rem; text-align: center; }
.pr-section { padding: 4.5rem 0; }

/* --- phone mockups --- */
.pr-phone { display: block; height: auto; filter: drop-shadow(0 1.6rem 2.2rem rgba(20, 6, 8, .35)); }

/* --- store badges --- */
.pr-stores { display: flex; flex-wrap: wrap; gap: .6rem; }
.pr-store {
    display: inline-flex; align-items: center; gap: .6rem;
    padding: .55rem 1.05rem .55rem .85rem; border-radius: .8rem;
    color: #fff; background: #000; border: 1px solid rgba(255, 255, 255, .22); text-decoration: none;
    transition: transform .25s ease, box-shadow .25s ease;
}
.pr-store svg { width: 1.3rem; height: 1.3rem; flex: none; }
.pr-store span { display: flex; flex-direction: column; line-height: 1.1; }
.pr-store small { font-size: .5rem; letter-spacing: .04em; opacity: .8; }
.pr-store b { font-size: .86rem; font-weight: 700; letter-spacing: -.01em; }
a.pr-store:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 .8rem 1.6rem -.6rem rgba(227, 6, 19, .65); }
.pr-store.is-soon { cursor: default; background: rgba(0, 0, 0, .55); }

/* ==========================================================================
   HERO
   ========================================================================== */
.pr-hero {
    margin-top: -120px; padding: calc(120px + 2.5rem) 0 0;
    color: #ecdcdd; overflow: hidden; isolation: isolate;
    background:
        radial-gradient(60% 70% at 78% 45%, rgba(227, 6, 19, .34) 0%, transparent 65%),
        radial-gradient(40% 50% at 10% 90%, rgba(255, 212, 59, .1) 0%, transparent 65%),
        linear-gradient(180deg, #0d0507 0%, #1a0a0d 70%, #260c11 100%);
}
.pr-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 2rem; }
.pr-hero-app { display: flex; align-items: center; gap: .9rem; }
.pr-hero-app img { width: 3.2rem; height: 3.2rem; border-radius: .85rem; box-shadow: 0 .8rem 1.8rem -.4rem rgba(227, 6, 19, .6), 0 0 0 1px rgba(255, 255, 255, .12); }
.pr-pill {
    display: inline-flex; align-items: center; gap: .45rem; padding: .38rem .8rem; border-radius: 2rem;
    font-size: .64rem; font-weight: 700; letter-spacing: .03em; color: #fbe9ea;
    background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 150, 156, .3);
}
.pr-pill .dot { width: .45rem; height: .45rem; border-radius: 50%; background: var(--pr-sun); box-shadow: 0 0 .6rem var(--pr-sun); }
.pr-page .pr-hero-title {
    margin: 1.2rem 0 0; color: #fff;
    font-weight: 800; letter-spacing: -.035em; line-height: 1.02;
    font-size: clamp(2.2rem, 5vw, 3.9rem);
}
.pr-hero-title .pr-grad { display: inline-block; }
.pr-hero-lead { margin: 1.1rem 0 1.6rem; max-width: 30rem; font-size: .92rem; line-height: 1.75; color: #cdb5b8; }
.pr-hero-more { display: inline-flex; align-items: center; gap: .35rem; margin-top: 1.2rem; font-size: .74rem; font-weight: 600; color: #ff9aa0; text-decoration: none; }
.pr-hero-more:hover { color: #fff; }
.pr-hero-more i { transition: transform .25s ease; }
.pr-hero-more:hover i { transform: translateY(3px); }

.pr-hero-visual { position: relative; aspect-ratio: 1 / 1; max-width: 34rem; width: 100%; justify-self: center; }
/* the scanner's corner frame and sweeping red line around the phones */
.pr-scan { position: absolute; inset: 1% 3% 4%; }
.pr-scan .c { position: absolute; width: 15%; aspect-ratio: 1; border: 3px solid var(--pr-red); filter: drop-shadow(0 0 .5rem rgba(227, 6, 19, .6)); }
.pr-scan .tl { left: 0; top: 0; border-right: 0; border-bottom: 0; border-top-left-radius: 1.4rem; }
.pr-scan .tr { right: 0; top: 0; border-left: 0; border-bottom: 0; border-top-right-radius: 1.4rem; }
.pr-scan .bl { left: 0; bottom: 0; border-right: 0; border-top: 0; border-bottom-left-radius: 1.4rem; }
.pr-scan .br { right: 0; bottom: 0; border-left: 0; border-top: 0; border-bottom-right-radius: 1.4rem; }
.pr-scan .line {
    position: absolute; z-index: 5; left: 2%; right: 2%; top: 8%; height: 2px; border-radius: 2px;
    background: linear-gradient(90deg, transparent, #ff3b47 20%, #ff3b47 80%, transparent);
    box-shadow: 0 0 1.1rem .25rem rgba(227, 6, 19, .55); opacity: .85;
    animation: prScan 5s ease-in-out infinite alternate;
}
@keyframes prScan { to { top: 90%; } }
.pr-glow { position: absolute; left: 50%; top: 50%; width: 70%; height: 70%; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, rgba(227, 6, 19, .45) 0%, transparent 65%); filter: blur(20px); }
.pr-hero-visual .pr-phone { position: absolute; }
.pr-hero-visual .p-center { width: 41%; left: 29.5%; top: 2%; z-index: 3; animation: prFloat 7s ease-in-out infinite; filter: drop-shadow(0 2rem 2.6rem rgba(0, 0, 0, .55)); }
.pr-hero-visual .p-left { width: 33%; left: 4%; top: 14%; z-index: 2; transform: rotate(-9deg); opacity: .95; animation: prFloat 8s ease-in-out -2s infinite; }
.pr-hero-visual .p-right { width: 33%; right: 4%; top: 14%; z-index: 2; transform: rotate(9deg); opacity: .95; animation: prFloat 9s ease-in-out -4s infinite; }
@keyframes prFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -.6rem; } }
.pr-float {
    position: absolute; z-index: 4; display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap;
    padding: .45rem .75rem; border-radius: .75rem;
    font-size: .6rem; font-weight: 700; color: #fdf0f1;
    background: rgba(36, 14, 17, .74); border: 1px solid rgba(255, 150, 156, .28);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    box-shadow: 0 1rem 2rem -1rem rgba(0, 0, 0, .7);
}
.pr-float i { font-size: .8rem; color: var(--pr-rose); }
.pr-float .tag { padding: .12rem .35rem; border-radius: .3rem; font-size: .5rem; letter-spacing: .04em; color: #fff; background: var(--pr-red); }
.pr-float.f1 { left: -2%; top: 58%; animation: prFloat 6s ease-in-out -1s infinite; }
.pr-float.f2 { right: -3%; top: 8%; animation: prFloat 7s ease-in-out -3s infinite; }
.pr-float.f3 { right: 2%; bottom: 10%; animation: prFloat 8s ease-in-out -5s infinite; }

.pr-ticker {
    position: relative; z-index: 1; margin-top: 3rem; padding: .9rem 0; overflow: hidden;
    border-top: 1px solid rgba(255, 150, 156, .14); background: rgba(14, 5, 7, .5);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.pr-ticker-track { display: flex; gap: 2rem; width: max-content; animation: prTicker 60s linear infinite; }
.pr-ticker span { display: inline-flex; align-items: center; gap: .4rem; font-size: .7rem; font-weight: 600; color: #c7a9ad; white-space: nowrap; }
.pr-ticker i { font-size: .9rem; color: var(--pr-rose); }
@keyframes prTicker { to { transform: translateX(-50%); } }

/* ==========================================================================
   QUICK ANSWER (shared partials/answer_block.html, restyled as a page of paper)
   ========================================================================== */
.pr-page .tk-answer-wrap { background: linear-gradient(180deg, #fff 0%, var(--pr-soft) 100%); }
.pr-page .tk-answer-wrap > .container { padding-bottom: 1.5rem !important; }
.pr-page .tk-answer {
    --qa-accent: var(--pr-red-2); --qa-accent-soft: rgba(227, 6, 19, .07); --qa-accent-line: rgba(227, 6, 19, .22);
    --qa-grad: var(--pr-grad); --qa-ink: var(--pr-ink); --qa-muted: var(--pr-muted);
    padding: 0; border-radius: 1.4rem 0 1.4rem 1.4rem; background: #fff; border-color: var(--pr-line);
    box-shadow: 0 2.2rem 3.6rem -2.4rem rgba(29, 18, 20, .45), 0 .3rem .8rem -.4rem rgba(29, 18, 20, .08);
}
.pr-page .tk-answer.tk-answer--split { grid-template-columns: minmax(0, 1fr) minmax(0, 18rem); gap: 0; align-items: stretch; }
.pr-page .tk-answer::before { z-index: 2; height: 4px; }
/* folded top-right corner, like a sheet of paper */
.pr-page .tk-answer::after {
    content: ""; position: absolute; z-index: 3; top: -1px; right: -1px; width: 2.4rem; height: 2.4rem;
    background: linear-gradient(225deg, #fff 0 50%, #f3e6e7 50% 100%);
    border-bottom-left-radius: .55rem; box-shadow: -.35rem .35rem .7rem -.3rem rgba(29, 18, 20, .25);
}
/* side by side, the fold lifts the dark "Best for" panel, so its underside is dark too */
.pr-page .tk-answer--split::after { background: linear-gradient(225deg, #fff 0 50%, #4a161c 50% 100%); box-shadow: -.35rem .35rem .8rem -.3rem rgba(0, 0, 0, .6); }
.pr-page .tk-answer__main { position: relative; padding: 2.3rem 2.6rem 2.2rem; }
.pr-page .tk-answer__kicker { color: var(--pr-red-2); }
.pr-page .tk-answer__q,
.pr-page .tk-answer__a { position: relative; padding-left: 3rem; }
.pr-page .tk-answer__q { margin: 1.25rem 0 .85rem; min-height: 2.1rem; display: flex; align-items: center; font-size: clamp(1.35rem, 2.2vw, 1.75rem); }
.pr-page .tk-answer__a { font-size: .88rem; line-height: 1.85; }
.pr-page .tk-answer__q::before,
.pr-page .tk-answer__a::before {
    position: absolute; left: 0; display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: .65rem;
    font-size: .8rem; font-weight: 800; letter-spacing: 0;
}
.pr-page .tk-answer__q::before { content: "Q"; top: 0; color: #fff; background: var(--pr-grad); box-shadow: 0 .6rem 1.1rem -.5rem rgba(227, 6, 19, .75); }
.pr-page .tk-answer__a::before { content: "A"; top: .15rem; color: var(--pr-red-2); background: rgba(227, 6, 19, .07); border: 1px solid rgba(227, 6, 19, .22); }
/* the thread from the A marker down the answer */
.pr-page .tk-answer__a::after {
    content: ""; position: absolute; left: 1.05rem; top: 2.6rem; bottom: .35rem; width: 2px; border-radius: 2px;
    background: linear-gradient(rgba(227, 6, 19, .35), transparent);
}
.pr-page .tk-answer__for {
    position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center;
    padding: 2rem 1.7rem; border: 0; border-radius: 0 0 1.4rem 0; color: #fff;
    background:
        radial-gradient(80% 60% at 100% 100%, rgba(227, 6, 19, .4) 0%, transparent 70%),
        linear-gradient(180deg, #1a0a0d 0%, var(--pr-night-2) 100%);
}
.pr-page .tk-answer__for::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: repeating-linear-gradient(180deg, transparent 0 27px, rgba(255, 150, 156, .08) 27px 28px);
}
.pr-page .tk-answer__for > * { position: relative; }
.pr-page .tk-answer__for-lbl { display: flex; align-items: center; gap: .5rem; margin-bottom: 1rem; color: var(--pr-rose); }
.pr-page .tk-answer__for-lbl::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, rgba(255, 150, 156, .45), transparent); }
.pr-page .tk-answer__for ul { gap: .75rem; }
.pr-page .tk-answer__for li { font-size: .78rem; color: #fbeeef; }
.pr-page .tk-answer__for li i { background: var(--pr-grad); box-shadow: 0 0 0 3px rgba(227, 6, 19, .18); }

/* ==========================================================================
   HIGHLIGHTS
   ========================================================================== */
.pr-highlights { background: #fff; }
.pr-stats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.pr-stats li {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: .5rem;
    padding: 1.3rem 1rem; border-radius: 1.2rem;
    background: var(--pr-soft); border: 1px solid var(--pr-line);
}
.pr-stats .n {
    display: grid; place-items: center; min-height: 2.6rem;
    font-size: 2.2rem; font-weight: 800; line-height: 1; letter-spacing: -.03em;
    background: var(--pr-grad-text-light); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
.pr-stats .n i { font-size: 2rem; }
.pr-stats .l { font-size: .72rem; font-weight: 600; line-height: 1.4; color: var(--pr-ink); }

/* ==========================================================================
   SPOTLIGHTS
   ========================================================================== */
.pr-spot { background: #fff; }
.pr-spot--tint { background: linear-gradient(180deg, var(--pr-soft) 0%, #fff 100%); }
.pr-spot--dark {
    overflow: hidden; isolation: isolate; color: #c9b1b4;
    background:
        radial-gradient(55% 70% at 25% 50%, rgba(255, 212, 59, .1) 0%, transparent 60%),
        radial-gradient(50% 60% at 80% 30%, rgba(227, 6, 19, .26) 0%, transparent 65%),
        linear-gradient(180deg, #1a080b 0%, #260c11 100%);
}
.pr-spot--dark .pr-h2 { color: #fff; }
.pr-spot--dark .pr-lead { color: #c9b1b4; }
.pr-spot-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 3.5rem; }
.pr-spot-grid--rev .pr-spot-media { order: 2; }
.pr-spot-media { position: relative; aspect-ratio: 1 / 1; max-width: 30rem; width: 100%; justify-self: center; }
.pr-spot-media::before {
    content: ""; position: absolute; left: 50%; top: 50%; width: 88%; height: 88%; transform: translate(-50%, -50%);
    border-radius: 50%; background: radial-gradient(circle, rgba(227, 6, 19, .16) 0%, transparent 68%);
}
.pr-spot--dark .pr-spot-media::before { background: radial-gradient(circle, rgba(255, 212, 59, .16) 0%, transparent 68%); }
.pr-spot-media .pr-phone { position: absolute; }
.pr-spot-media .s-back { width: 42%; left: 12%; top: 8%; transform: rotate(-6deg); }
.pr-spot-media .s-front { width: 44%; right: 12%; top: 2%; z-index: 2; }
.pr-checks { list-style: none; margin: 1.3rem 0 0; padding: 0; display: grid; gap: .6rem; }
.pr-checks li { position: relative; padding-left: 1.7rem; font-size: .8rem; line-height: 1.55; }
/* one circle with the tick drawn as a centred SVG, vertically centred on the first line */
.pr-checks li::before {
    content: ""; position: absolute; left: 0; top: calc((1.55em - 1.1rem) / 2); width: 1.1rem; height: 1.1rem; border-radius: 50%;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.2 8.3l2.4 2.4 5.2-5.2' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat,
        var(--pr-grad);
}
.pr-checks b { color: var(--pr-ink); font-weight: 700; }
.pr-spot--dark .pr-checks b { color: #fff; }

/* ==========================================================================
   TOOLKIT (tabs)
   ========================================================================== */
.pr-tools { background: var(--pr-soft); }
.pr-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-bottom: 1.6rem; }
.pr-tab {
    display: inline-flex; align-items: center; gap: .45rem; padding: .6rem 1rem; border-radius: 2rem; cursor: pointer;
    font-size: .74rem; font-weight: 700; color: var(--pr-ink); background: #fff; border: 1px solid var(--pr-line);
    transition: color .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.pr-tab i { font-size: .95rem; color: var(--pr-red); }
.pr-tab .c { min-width: 1.3rem; padding: .08rem .35rem; border-radius: 1rem; font-size: .6rem; color: var(--pr-red-2); background: rgba(227, 6, 19, .1); }
.pr-tab:hover { border-color: rgba(227, 6, 19, .4); }
.pr-tab.is-active { color: #fff; background: var(--pr-grad); border-color: transparent; box-shadow: 0 .8rem 1.6rem -.8rem rgba(227, 6, 19, .75); }
.pr-tab.is-active i { color: #fff; }
.pr-tab.is-active .c { color: #fff; background: rgba(255, 255, 255, .22); }
.pr-tab:focus-visible { outline: 2px solid var(--pr-red); outline-offset: 3px; }
.pr-page .pr-panel-title { margin: 0 0 .8rem; font-size: .9rem; font-weight: 700; color: var(--pr-ink); }
.pr-js .pr-page .pr-panel-title { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* without JS every panel is visible; with JS only the active one */
.pr-js .pr-panel:not(.is-active) { display: none; }
.pr-panel + .pr-panel { margin-top: 1.2rem; }
.pr-js .pr-panel + .pr-panel { margin-top: 0; }
.pr-tool-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr)); gap: .8rem; }
.pr-tool {
    display: flex; gap: .8rem; padding: 1rem 1.05rem; border-radius: 1.05rem;
    background: #fff; border: 1px solid var(--pr-line);
    box-shadow: 0 .8rem 1.6rem -1.5rem rgba(29, 18, 20, .45);
    transition: transform .3s cubic-bezier(.2, .8, .2, 1), border-color .3s ease;
}
.pr-tool:hover { transform: translateY(-3px); border-color: rgba(227, 6, 19, .3); }
.pr-tool .ic { flex: none; display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: .7rem; font-size: 1.1rem; color: var(--pr-red-2); background: linear-gradient(135deg, rgba(227, 6, 19, .12), rgba(255, 212, 59, .2)); }
.pr-page .pr-tool h4 { margin: .1rem 0 0; font-size: .8rem; font-weight: 700; color: var(--pr-ink); }
.pr-tool p { margin: .25rem 0 0; font-size: .68rem; line-height: 1.55; color: var(--pr-muted); }

/* ==========================================================================
   SCREEN GALLERY
   ========================================================================== */
.pr-gallery {
    overflow: hidden; isolation: isolate; padding-bottom: 3.5rem;
    background:
        radial-gradient(50% 60% at 50% 0%, rgba(227, 6, 19, .28) 0%, transparent 65%),
        linear-gradient(180deg, #1a080b 0%, #110709 100%);
}
.pr-gallery .pr-head { margin-bottom: 2rem; }
.pr-reel {
    position: relative; z-index: 1; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity;
    scrollbar-width: none; padding: .5rem 0 1rem;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.pr-reel::-webkit-scrollbar { display: none; }
.pr-reel:focus-visible { outline: 2px solid var(--pr-rose); outline-offset: -2px; }
.pr-reel-track { list-style: none; margin: 0; padding: 0 max(1.5rem, calc((100vw - 1140px) / 2)); display: flex; gap: 1.1rem; width: max-content; }
.pr-reel-track li { flex: none; width: 12rem; scroll-snap-align: center; transition: transform .35s cubic-bezier(.2, .8, .2, 1); }
.pr-reel-track li:nth-child(even) { margin-top: 2rem; }
.pr-reel-track li:hover { transform: translateY(-.5rem); }
.pr-reel-track img { display: block; width: 100%; height: auto; filter: drop-shadow(0 1.4rem 1.6rem rgba(0, 0, 0, .5)); }

/* ==========================================================================
   SCAN MODES & FILTERS
   ========================================================================== */
.pr-modes { background: #fff; }
.pr-modes-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 3.5rem; }
.pr-chips { margin-top: 1.6rem; display: grid; gap: .7rem; }
.pr-chips-title { display: inline-flex; align-items: center; gap: .4rem; font-size: .74rem; font-weight: 700; color: var(--pr-ink); }
.pr-chips-title i { font-size: 1rem; color: var(--pr-red); }
.pr-chips ul { list-style: none; margin: 0 0 .3rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.pr-chips li { padding: .3rem .65rem; border-radius: 2rem; font-size: .66rem; font-weight: 600; color: var(--pr-ink); background: var(--pr-soft); border: 1px solid var(--pr-line); }
.pr-mode-table {
    border-radius: 1.4rem; overflow: hidden; background: #fff; border: 1px solid var(--pr-line);
    box-shadow: 0 1.8rem 3rem -2.2rem rgba(29, 18, 20, .5);
}
.pr-mode-row { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); align-items: center; gap: 1rem; padding: .75rem 1.3rem; }
.pr-mode-row + .pr-mode-row { border-top: 1px solid var(--pr-line); }
.pr-mode-row > span { font-size: .72rem; line-height: 1.55; }
.pr-mode-row > span:first-child { display: flex; align-items: center; gap: .65rem; font-size: .78rem; font-weight: 700; color: var(--pr-ink); }
.pr-mode-row .ic {
    flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .6rem;
    font-size: 1rem; color: var(--pr-red-2);
    background: linear-gradient(135deg, rgba(227, 6, 19, .12), rgba(255, 212, 59, .2));
}
.pr-mode-row--head { background: var(--pr-soft); padding-block: .85rem; }
.pr-mode-row--head > span, .pr-mode-row--head > span:first-child { font-size: .62rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--pr-muted); }

/* ==========================================================================
   SIGN (signature card over a phone)
   ========================================================================== */
.pr-sign {
    position: absolute; z-index: 2; right: 2%; top: 30%; width: 62%;
    padding: 1rem 1.1rem 1.05rem; border-radius: 1.2rem; background: #fff; border: 1px solid var(--pr-line);
    box-shadow: 0 2rem 3rem -1.6rem rgba(29, 18, 20, .55); transform: rotate(-3deg);
}
.pr-sign-top { display: flex; align-items: center; justify-content: space-between; font-size: .58rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--pr-muted); }
.pr-sign-top b { color: var(--pr-red); }
.pr-sign svg { display: block; width: 100%; height: auto; margin: .3rem 0 .2rem; overflow: visible; }
.pr-sign path { fill: none; stroke: #1b2a6b; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 900; stroke-dashoffset: 0; }
.pr-sign .rule { height: 1px; margin-bottom: .7rem; background: repeating-linear-gradient(90deg, #c9bbbe 0 6px, transparent 6px 11px); }
.pr-sign ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.pr-sign li { display: inline-flex; align-items: center; gap: .3rem; padding: .22rem .55rem; border-radius: 2rem; font-size: .58rem; font-weight: 700; color: var(--pr-ink); background: var(--pr-soft); border: 1px solid var(--pr-line); }
.pr-sign li i { font-size: .75rem; color: var(--pr-red); }
.pr-sign .ink { display: flex; gap: .3rem; margin-left: auto; align-items: center; }
.pr-sign .ink span { width: .8rem; height: .8rem; border-radius: 50%; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--pr-line); }
.pr-sign .ink span:first-child { box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--pr-red); }
/* the signature writes itself once the section scrolls into view */
.pr-reveal-on .pr-spot-grid:not(.is-in) .pr-sign path { stroke-dashoffset: 900; }
.pr-reveal-on .pr-spot-grid .pr-sign path { transition: stroke-dashoffset 2.2s cubic-bezier(.45, .05, .35, 1) .5s; }
.pr-reveal-on .pr-spot-grid:not(.is-in) .pr-sign { opacity: 0; translate: 0 2rem; }
.pr-reveal-on .pr-spot-grid .pr-sign { transition: opacity .8s ease .12s, translate .9s cubic-bezier(.2, .8, .2, 1) .12s; }

/* ==========================================================================
   PERMISSIONS
   ========================================================================== */
.pr-perms { background: var(--pr-soft); }
.pr-perm-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.pr-perm-grid li { padding: 1.3rem 1.2rem; border-radius: 1.2rem; background: #fff; border: 1px solid var(--pr-line); }
.pr-perm-grid .ic { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: .75rem; font-size: 1.2rem; color: #fff; background: var(--pr-grad); box-shadow: 0 .6rem 1.2rem -.5rem rgba(227, 6, 19, .7); }
.pr-page .pr-perm-grid h3 { margin: .9rem 0 0; font-size: .86rem; font-weight: 700; color: var(--pr-ink); }
.pr-perm-grid p { margin: .35rem 0 0; font-size: .7rem; line-height: 1.6; }
.pr-perm-links { margin: 1.6rem 0 0; text-align: center; font-size: .78rem; }
.pr-perm-links a { font-weight: 700; color: var(--pr-red-2); }

/* ==========================================================================
   FAQ
   ========================================================================== */
.pr-faq { background: #fff; }
.pr-faq-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 3rem; align-items: start; }
.pr-faq-head { position: sticky; top: 6rem; }
.pr-faq-list { display: grid; gap: .6rem; }
.pr-qa { border-radius: 1rem; background: var(--pr-soft); border: 1px solid var(--pr-line); transition: background .25s ease, border-color .25s ease; }
.pr-qa[open] { background: #fff; border-color: rgba(227, 6, 19, .3); box-shadow: 0 1rem 2rem -1.6rem rgba(227, 6, 19, .55); }
.pr-qa summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .95rem 1.1rem; cursor: pointer; list-style: none; }
.pr-qa summary::-webkit-details-marker { display: none; }
.pr-page .pr-qa h3 { margin: 0; font-size: .84rem; font-weight: 700; line-height: 1.4; color: var(--pr-ink); }
.pr-qa summary i { flex: none; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; font-size: .95rem; color: var(--pr-red); background: rgba(227, 6, 19, .1); transition: transform .3s ease; }
.pr-qa[open] summary i { transform: rotate(45deg); }
.pr-qa summary:focus-visible { outline: 2px solid var(--pr-red); outline-offset: 2px; border-radius: 1rem; }
.pr-qa p { margin: 0; padding: 0 1.1rem 1.05rem; font-size: .76rem; line-height: 1.7; }

/* ==========================================================================
   FINAL CTA
   ========================================================================== */
.pr-cta {
    padding: 4.5rem 0; overflow: hidden; isolation: isolate;
    background:
        radial-gradient(45% 70% at 50% 110%, rgba(227, 6, 19, .45) 0%, transparent 70%),
        linear-gradient(180deg, #110709 0%, #1a0a0d 100%);
}
.pr-cta-card { position: relative; z-index: 1; max-width: 42rem; margin: 0 auto; text-align: center; }
.pr-cta-card > img { width: 4rem; height: 4rem; border-radius: 1.05rem; box-shadow: 0 1rem 2.4rem -.6rem rgba(227, 6, 19, .7), 0 0 0 1px rgba(255, 255, 255, .12); }
.pr-cta .pr-stores { margin-top: 1.6rem; }
.pr-cta-links { margin: 1.8rem 0 0; font-size: .74rem; color: #8f7377; }
.pr-cta-links a { margin: 0 .35rem; font-weight: 600; color: #f0d2d5; }
.pr-cta-links a:hover { color: #fff; }
.pr-built { margin: .8rem 0 0; font-size: .66rem; color: #8f7377; }
.pr-built a { color: #ff9aa0; }

/* ==========================================================================
   REVEAL (armed by JS only)
   ========================================================================== */
.pr-reveal-on .pr-spot-grid:not(.is-in) .pr-phone { opacity: 0; translate: 0 2rem; }
.pr-reveal-on .pr-spot-grid .pr-phone { transition: opacity .8s ease, translate .9s cubic-bezier(.2, .8, .2, 1); }
.pr-reveal-on .pr-spot-grid .s-front { transition-delay: .12s; }
.pr-reveal-on .pr-stats li:not(.is-in), .pr-reveal-on .pr-perm-grid li:not(.is-in) { opacity: 0; translate: 0 1rem; }
.pr-reveal-on .pr-stats li, .pr-reveal-on .pr-perm-grid li { transition: opacity .6s ease var(--d, 0s), translate .7s cubic-bezier(.2, .8, .2, 1) var(--d, 0s); }

/* ==========================================================================
   LEGAL PAGES
   ========================================================================== */
.pr-legal-hero {
    margin-top: -120px; padding: calc(120px + 2.2rem) 0 2.6rem;
    overflow: hidden; isolation: isolate; color: #ecdcdd;
    background:
        radial-gradient(50% 90% at 85% 0%, rgba(227, 6, 19, .34) 0%, transparent 65%),
        linear-gradient(180deg, #0d0507 0%, #260c11 100%);
}
.pr-crumbs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; font-size: .66rem; }
.pr-crumbs li + li::before { content: "/"; margin-right: .35rem; color: #7f6267; }
.pr-crumbs a { color: #ff9aa0; }
.pr-crumbs a:hover { color: #fff; }
.pr-crumbs [aria-current] { color: #ecdcdd; }
.pr-legal-title { display: flex; align-items: center; gap: 1rem; margin-top: 1.4rem; }
.pr-legal-title img { width: 3.2rem; height: 3.2rem; border-radius: .85rem; box-shadow: 0 .8rem 1.8rem -.4rem rgba(227, 6, 19, .6); }
.pr-legal-title .app { margin: 0; font-size: .72rem; font-weight: 600; color: #ff9aa0; }
.pr-page .pr-legal-title h1 { margin: .1rem 0 0; color: #fff; font-weight: 800; letter-spacing: -.03em; line-height: 1.05; font-size: clamp(1.8rem, 4vw, 2.8rem); }
.pr-legal-dates { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; margin: 1.1rem 0 0; font-size: .68rem; color: #c9b1b4; }
.pr-legal-dates i { color: var(--pr-rose); margin-right: .2rem; }

.pr-legal-body { padding: 3rem 0 4rem; background: var(--pr-soft); }
.pr-legal-grid { display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.pr-toc { position: sticky; top: 6rem; }
.pr-toc details { padding: 1rem 1rem .8rem; border-radius: 1rem; background: #fff; border: 1px solid var(--pr-line); }
.pr-toc summary { font-size: .64rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--pr-muted); cursor: pointer; list-style: none; }
.pr-toc summary::-webkit-details-marker { display: none; }
.pr-toc ol { margin: .7rem 0 0; padding: 0; list-style: none; counter-reset: toc; display: grid; gap: .1rem; max-height: calc(100vh - 14rem); overflow-y: auto; }
.pr-toc li { counter-increment: toc; }
.pr-toc ol a { display: flex; gap: .45rem; padding: .32rem .5rem; border-radius: .5rem; font-size: .68rem; font-weight: 600; line-height: 1.35; color: var(--pr-muted); text-decoration: none; }
.pr-toc ol a::before { content: counter(toc); flex: none; min-width: 1rem; font-variant-numeric: tabular-nums; color: #bdaeb1; }
.pr-toc ol a:hover { color: var(--pr-ink); background: var(--pr-soft); }
.pr-toc ol a.is-active { color: var(--pr-red-2); background: rgba(227, 6, 19, .08); }
.pr-toc ol a.is-active::before { color: var(--pr-red); }
.pr-toc-back { display: inline-flex; align-items: center; gap: .3rem; margin-top: .9rem; font-size: .68rem; font-weight: 700; color: var(--pr-red-2); }

.pr-doc {
    min-width: 0; padding: 2.2rem 2.4rem; border-radius: 1.4rem; background: #fff; border: 1px solid var(--pr-line);
    box-shadow: 0 1.6rem 3rem -2.6rem rgba(29, 18, 20, .5);
    font-size: .8rem; line-height: 1.8; color: #4a3c3f;
}
.pr-doc section { scroll-margin-top: 6rem; }
.pr-doc section + section { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--pr-line); }
.pr-page .pr-doc h2 { margin: 0 0 .7rem; font-size: 1.05rem; font-weight: 800; letter-spacing: -.02em; color: var(--pr-ink); }
.pr-page .pr-doc h3 { margin: 1.2rem 0 .4rem; font-size: .82rem; font-weight: 700; color: var(--pr-ink); }
.pr-doc p { margin: 0 0 .7rem; }
.pr-doc ul { margin: 0 0 .7rem; padding-left: 1.1rem; }
.pr-doc li { margin-bottom: .45rem; }
.pr-doc li::marker { color: var(--pr-red); }
.pr-doc strong { color: var(--pr-ink); }
.pr-doc a { color: var(--pr-red-2); font-weight: 600; }
.pr-glance { list-style: none; padding: 0 !important; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.pr-glance li { display: flex; gap: .7rem; margin: 0; padding: .85rem .9rem; border-radius: .9rem; background: var(--pr-soft); border: 1px solid var(--pr-line); }
.pr-glance i { flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .6rem; font-size: 1rem; color: #fff; background: var(--pr-grad); }
.pr-glance b { display: block; font-size: .76rem; line-height: 1.35; color: var(--pr-ink); }
.pr-glance span { display: block; margin-top: .15rem; font-size: .68rem; line-height: 1.5; color: var(--pr-muted); }
.pr-table-wrap { overflow-x: auto; margin: .4rem 0 .6rem; border-radius: .9rem; border: 1px solid var(--pr-line); }
.pr-table { width: 100%; border-collapse: collapse; font-size: .74rem; line-height: 1.55; }
.pr-table th { padding: .65rem .9rem; text-align: left; font-size: .6rem; letter-spacing: .06em; text-transform: uppercase; color: var(--pr-muted); background: var(--pr-soft); }
.pr-table td { padding: .7rem .9rem; vertical-align: top; border-top: 1px solid var(--pr-line); }
.pr-table td:first-child { width: 32%; font-weight: 700; color: var(--pr-ink); }
.pr-address { margin: 0; padding: 1rem 1.1rem; border-radius: .9rem; font-style: normal; background: var(--pr-soft); border: 1px solid var(--pr-line); }
.pr-doc-foot { margin-top: 2.2rem; padding-top: 1.2rem; border-top: 1px dashed rgba(29, 18, 20, .15); font-size: .74rem; }
.pr-doc-foot p { margin: 0 0 .3rem; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1199.98px) {
    .pr-tool-grid { grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); }
    .pr-perm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
    .pr-section { padding: 3.5rem 0; }
    .pr-hero-grid { grid-template-columns: minmax(0, 1fr); text-align: center; }
    .pr-hero-app, .pr-stores { justify-content: center; }
    .pr-hero-lead { margin-inline: auto; }
    .pr-hero-visual { max-width: 28rem; margin-top: 1rem; }
    .pr-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pr-page .tk-answer.tk-answer--split { grid-template-columns: minmax(0, 1fr); }
    .pr-page .tk-answer--split::after { background: linear-gradient(225deg, #fff 0 50%, #f3e6e7 50% 100%); box-shadow: -.35rem .35rem .7rem -.3rem rgba(29, 18, 20, .25); }
    .pr-page .tk-answer__for { border-radius: 0 0 1.4rem 1.4rem; padding: 1.6rem 2.6rem; }
    .pr-spot-grid, .pr-modes-grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
    .pr-spot-grid .pr-spot-media, .pr-spot-grid--rev .pr-spot-media { order: -1; max-width: 24rem; }
    .pr-faq-grid { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
    .pr-faq-head { position: static; text-align: center; }
    .pr-legal-grid { grid-template-columns: minmax(0, 1fr); gap: 1.2rem; }
    .pr-toc { position: static; }
    .pr-toc details:not([open]) { padding-bottom: 1rem; }
    .pr-toc ol { max-height: none; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
    .pr-hero { padding-top: calc(120px + 1.4rem); }
    .pr-float.f1 { left: 0; top: 64%; }
    .pr-float.f2 { right: 0; top: 4%; }
    .pr-float.f3 { display: none; }
    .pr-stores { flex-direction: column; align-items: stretch; }
    .pr-store { justify-content: center; }
    .pr-page .tk-answer { padding: 0; }
    .pr-page .tk-answer__main { padding: 1.7rem 1.25rem 1.6rem; }
    .pr-page .tk-answer__q, .pr-page .tk-answer__a { padding-left: 2.4rem; }
    .pr-page .tk-answer__q::before, .pr-page .tk-answer__a::before { width: 1.75rem; height: 1.75rem; border-radius: .55rem; font-size: .7rem; }
    .pr-page .tk-answer__a::after { left: .85rem; top: 2.2rem; }
    .pr-page .tk-answer__a { font-size: .82rem; }
    .pr-page .tk-answer__for { padding: 1.4rem 1.25rem; }
    .pr-stats li { padding: 1rem .6rem; }
    .pr-stats .n { font-size: 1.8rem; }
    /* tabs become one swipeable row that bleeds to the screen edges */
    .pr-tabs {
        flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none;
        margin-inline: calc(var(--bs-gutter-x, 1.5rem) * -.5); margin-bottom: .6rem; padding: .2rem calc(var(--bs-gutter-x, 1.5rem) * .5) 1.3rem;
    }
    .pr-tabs::-webkit-scrollbar { display: none; }
    .pr-tab { flex: none; font-size: .68rem; padding: .5rem .8rem; }
    .pr-tool-grid { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
    .pr-tool { padding: .75rem .85rem; }
    .pr-tool:hover { transform: none; }
    .pr-perm-grid { grid-template-columns: minmax(0, 1fr); gap: .6rem; }
    .pr-perm-grid li { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .85rem; padding: .95rem 1rem; }
    .pr-perm-grid .ic { grid-row: span 2; width: 2.1rem; height: 2.1rem; font-size: 1.05rem; }
    .pr-page .pr-perm-grid h3 { margin: 0; }
    .pr-perm-grid p { margin-top: .2rem; }
    .pr-section { padding: 3rem 0; }
    .pr-head { margin-bottom: 1.8rem; }
    .pr-spot-grid .pr-spot-media, .pr-spot-grid--rev .pr-spot-media { max-width: 21rem; }
    .pr-mode-row { grid-template-columns: minmax(0, 1fr); gap: .35rem; padding: .8rem .95rem; }
    .pr-mode-row--head > span:last-child { display: none; }
    .pr-sign { width: 70%; right: 0; padding: .75rem .8rem .8rem; }
    .pr-reel-track li { width: 9.5rem; }
    .pr-doc { padding: 1.4rem 1.15rem; }
    .pr-glance { grid-template-columns: minmax(0, 1fr); }
    .pr-toc ol { grid-template-columns: minmax(0, 1fr); }
    .pr-table td:first-child { width: 38%; }
}
@media (prefers-reduced-motion: reduce) {
    .pr-hero-visual .pr-phone, .pr-float, .pr-scan .line, .pr-ticker-track { animation: none !important; }
    .pr-scan .line { top: 46%; }
    .pr-tool, .pr-reel-track li, .pr-store, .pr-qa summary i { transition: none; }
    .pr-tool:hover, .pr-reel-track li:hover { transform: none; }
}
