/* NFC Ninja app page: brand accents from the NFC Ninja PNG palette, scoped to .nn-page.
   Layout, type scale, header and footer are the shared Tower Aim / Systemic Studios system. */
.nn-page {
  --ta-ink:#070b12; --ta-ink-2:#0a101a; --ta-panel:#101722; --ta-panel-lift:#151f2d;
  --ta-border:rgba(135,151,173,.2); --ta-muted:#8797ad; --ta-soft:#c3cede; --ta-white:#f2f7ff;
  --ta-cyan:#58d6ff; --ta-cyan-deep:#10233a;
  --nn-blue:#2689ff; --nn-kicker:#62baff; --nn-grad:linear-gradient(90deg,#1677f4,#1a9cff);
  background:var(--ta-ink); color:var(--ta-white);
}
.nn-page .tt-hero { background:radial-gradient(ellipse at 78% 38%,rgba(38,137,255,.2),transparent 40%),linear-gradient(116deg,#070b12 0%,#0b1322 55%,#070b12 100%); }
.nn-page .tt-kicker { color:var(--nn-kicker); }
.nn-page .tt-kicker > span:first-child { background:var(--ta-cyan); box-shadow:0 0 10px rgba(88,214,255,.7); }
.nn-hero-kicker { margin-bottom:16px; }
.nn-page .nn-app-name { color:var(--ta-white); font-family:var(--font-display); font-size:clamp(35px,4vw,51px); font-weight:800; line-height:1.08; letter-spacing:-.065em; }
.nn-page .tt-hero-app-icon { border-radius:12px; box-shadow:0 0 0 1px rgba(88,185,255,.25),0 6px 22px rgba(38,137,255,.28); }
.nn-page .tt-brandline { margin-bottom:14px; }
.nn-page h1.nn-h1 { margin:0; max-width:500px; color:var(--ta-cyan); font-size:21px; line-height:1.4; font-weight:700; letter-spacing:-.01em; }
.nn-page .tt-hero-blurb { color:#aab6c8; }
.nn-page .tt-button-bright, .nn-page a.tt-button-bright { color:#fff; background:var(--nn-grad); border-radius:3px; box-shadow:0 8px 22px rgba(22,119,244,.3); }
.nn-page .tt-button-bright:hover { background:linear-gradient(90deg,#2a86ff,#3aaeff); }
.nn-page .tt-text-link { color:#d6e0ee; }
.nn-page .tt-text-link:hover { color:var(--ta-cyan); }
.nn-store-soon { align-items:center; }
.nn-page .tt-orbit { border-color:rgba(88,185,255,.2); box-shadow:0 0 0 42px rgba(38,137,255,.035),0 0 0 84px rgba(38,137,255,.022); }
.nn-page .tt-phone, .nn-page .tt-map-screenshot, .nn-page .tt-shot-frame { border-color:#1a2638; background:#070b12; }
.nn-preview-label { position:absolute; bottom:6px; right:0; color:#6f7f96; font:9px "DM Mono",monospace; letter-spacing:.06em; z-index:2; }
.nn-page .tt-features { border-bottom-color:var(--ta-border); }
.nn-page .tt-features-heading h2 { color:var(--ta-white); }
.nn-page .tt-features-heading > p, .nn-page .tt-feature p { color:#9eabbf; }
.nn-page .tt-map-showcase { border-color:var(--ta-border); background:radial-gradient(ellipse at 50% 45%,rgba(38,137,255,.16),transparent 61%),linear-gradient(145deg,#0d1522,#080d16); }
.nn-page .tt-map-showcase::before { border-color:rgba(88,185,255,.14); }
.nn-page .tt-map-showcase figcaption { color:#8797ad; }
.nn-page .tt-map-screenshot { height:auto; }
.nn-page .tt-map-screenshot img { height:auto; aspect-ratio:480/1041; }
.nn-page .tt-map-showcase { min-height:380px; }
.nn-page .tt-feature { border-top-color:var(--ta-border); }
.nn-page .tt-feature:last-child { border-bottom-color:var(--ta-border); }
.nn-page .tt-feature-list .tt-feature:nth-last-child(2) { border-bottom:1px solid var(--ta-border); }
.nn-page .tt-feature > svg { color:var(--ta-cyan); }
.nn-page .tt-feature h3 { color:var(--ta-white); }
.nn-page .tt-screen-card { border-color:var(--ta-border); background:linear-gradient(145deg,#111a27,#0b111c); }
.nn-page .tt-screen-card figcaption span { color:var(--nn-kicker); }
.nn-page .tt-screen-card figcaption b { color:var(--ta-white); }
/* Business uses (replaces Installer + Regions slot) */
.nn-uses { position:relative; z-index:1; padding:60px 38px; background:#0a101a; border-bottom:1px solid var(--ta-border); }
.nn-uses-inner { max-width:1164px; margin:0 auto; display:grid; grid-template-columns:minmax(260px,.8fr) minmax(0,1.6fr); gap:26px 40px; }
.nn-uses-heading h2 { margin:14px 0 12px; color:var(--ta-white); font-size:clamp(28px,2.65vw,36px); line-height:1.15; letter-spacing:-.045em; }
.nn-uses-heading p { max-width:360px; margin:0; color:#9eabbf; font-size:15px; line-height:1.65; }
.nn-uses-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.nn-use { padding:18px 16px; border:1px solid var(--ta-border); border-radius:12px; background:var(--ta-panel); }
.nn-use > svg { width:22px; height:22px; color:var(--ta-cyan); }
.nn-use-cat { display:block; margin-top:12px; color:var(--nn-kicker); font:500 9.5px "DM Mono",monospace; letter-spacing:.07em; }
.nn-use h3 { margin:5px 0 4px; color:var(--ta-white); font-size:15px; font-weight:800; }
.nn-use p { margin:0; color:#9eabbf; font-size:13.5px; line-height:1.5; }
.nn-bridge { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 22px; border:1px solid rgba(88,185,255,.25); border-radius:14px; background:linear-gradient(120deg,rgba(38,137,255,.1),rgba(16,23,34,.6)); }
.nn-bridge .ta-gx-tag { font:700 11px "DM Mono",monospace; letter-spacing:.09em; color:var(--ta-cyan); }
.nn-bridge p { margin:6px 0 0; max-width:640px; color:#c3cede; font-size:15px; line-height:1.55; }
.nn-bridge-link { flex:0 0 auto; white-space:nowrap; padding:12px 18px; border-radius:999px; background:var(--ta-cyan); color:#06111d !important; font-weight:800; font-size:14px; text-decoration:none; }
/* Contact + guides */
.nn-page .ta-help-section { background:var(--ta-ink); border-top-color:var(--ta-border); }
.nn-page .ta-eyebrow { color:var(--nn-kicker); }
.nn-page .ta-help-form { background:var(--ta-panel); border-color:var(--ta-border); }
.nn-page .ta-help-form input, .nn-page .ta-help-form select, .nn-page .ta-help-form textarea { background:var(--ta-ink); border-color:rgba(135,151,173,.28); }
.nn-page .ta-button-primary { color:#fff; background:var(--nn-grad); border-color:transparent; }
.nn-page #guides .nn-gx-soon { cursor:default; }
.nn-page #guides .nn-gx-soon:hover { border-color:var(--ta-border); }
.nn-page #guides .ta-gx-flag { color:var(--nn-kicker); }
.nn-page #guides .nn-soon-go { color:#8797ad; font:500 11px "DM Mono",monospace; letter-spacing:.06em; text-transform:uppercase; }
.nn-page #guides .nn-gx-more span { color:#c3cede; font-weight:700; }
.nn-guides-wrap { min-width:0; }
.nn-page #guides .ta-gx-row { margin-top:0; }
@media (max-width:1050px) { .nn-uses-inner { grid-template-columns:1fr; } }
@media (max-width:760px) {
  .nn-page .tt-hero { padding-bottom:10px; }
  .nn-page .nn-app-name { font-size:clamp(31px,8vw,42px); }
  .nn-page h1.nn-h1 { font-size:18px; }
  .nn-page .tt-map-showcase { min-height:300px; }
  .nn-uses { padding:40px 20px; }
  .nn-uses-grid { grid-template-columns:1fr 1fr; }
  .nn-bridge { flex-direction:column; align-items:flex-start; }
  .nn-preview-label { right:12px; bottom:0; }
}
@media (max-width:420px) { .nn-uses-grid { grid-template-columns:1fr; } }
/* Unlinked store badges while the app is not live */
.nn-page .nn-store-soon img { pointer-events:none; user-select:none; }
.nn-page .tt-coming-soon-pill { border-color:rgba(88,185,255,.3); color:#cfe6ff; background:rgba(38,137,255,.1); }
/* Per-platform differences note (SEO plan A.2) */
.nn-platform-note { grid-column:1/-1; display:flex; align-items:flex-start; gap:18px 28px; flex-wrap:wrap; padding:14px 18px; border:1px solid var(--ta-border); border-radius:10px; background:var(--ta-panel); }
.nn-platform-note .tt-kicker { white-space:nowrap; padding-top:2px; }
.nn-platform-note ul { flex:1 1 600px; display:grid; grid-template-columns:1.3fr 1.2fr .8fr; gap:6px 24px; margin:0; padding:0; list-style:none; color:#9eabbf; font-size:13.5px; line-height:1.5; }
.nn-platform-note li { position:relative; padding-left:12px; }
.nn-platform-note li::before { content:""; position:absolute; left:0; top:.6em; width:4px; height:4px; border-radius:50%; background:var(--ta-cyan); }
@media (max-width:1050px) { .nn-platform-note ul { grid-template-columns:1fr; } }
