/* NFC Ninja guides: article template on the shared Tower Aim guide system (.ta-page/.tt-*),
   NFC Ninja accents via .nn-page tokens in nfc-ninja-page.css. Scoped to .nn-guide. */
.nn-guide .nn-g-hero .tt-hero-inner { min-height:0; padding:28px 0 44px; align-items:start; }
.nn-guide .nn-g-hero .tt-hero-copy { padding:0; }
.nn-guide .nn-g-crumbs ol { display:flex; flex-wrap:wrap; gap:6px 0; margin:0 0 20px; padding:0; list-style:none; font:500 11px/1.4 "DM Mono",monospace; letter-spacing:.06em; text-transform:uppercase; color:#8797ad; }
.nn-guide .nn-g-crumbs li + li::before { content:"/"; margin:0 9px; color:#3c4a5e; }
.nn-guide .nn-g-crumbs a { color:var(--nn-kicker); }
.nn-guide .nn-g-crumbs a:hover { color:var(--ta-cyan); }
.nn-guide .nn-g-crumbs [aria-current] { color:#c3cede; }
.nn-guide .tt-brandline { display:flex; align-items:flex-start; gap:16px; }
.nn-guide .tt-brandline .tt-hero-app-icon { margin-top:6px; }
.nn-guide .nn-g-hero h1 { font-size:clamp(32px,3.5vw,46px); line-height:1.1; letter-spacing:-.055em; color:var(--ta-white); max-width:640px; }
.nn-g-answer { margin-top:26px; max-width:620px; padding:20px 22px 6px; border:1px solid rgba(88,185,255,.28); border-left:3px solid var(--ta-cyan); border-radius:12px; background:linear-gradient(120deg,rgba(38,137,255,.11),rgba(16,23,34,.75)); }
.nn-g-answer .tt-kicker { display:inline-flex; margin-bottom:10px; }
.nn-g-answer p { margin:0 0 14px; color:#d6e0ee; font-size:16px; line-height:1.65; }
.nn-g-answer strong { color:#fff; font-weight:700; }
.nn-guide .nn-g-hero-art { min-height:420px; }
.nn-guide .nn-g-hero-art .tt-phone-primary { width:220px; }
.nn-guide .nn-g-hero-art .tt-phone img { width:100%; height:auto; display:block; }
.nn-guide .nn-g-hero-photo { align-items:center; }
/* Body: heading column + prose column, same grid rhythm as .tt-features */
.nn-g-body { position:relative; z-index:1; }
.nn-g-sec { max-width:1164px; margin:0 auto; padding:44px 0 46px; display:grid; grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr); gap:22px 48px; border-top:1px solid var(--ta-border); }
.nn-g-sec-head h2 { margin:0; color:var(--ta-white); font-size:clamp(24px,2.3vw,31px); line-height:1.18; letter-spacing:-.04em; scroll-margin-top:96px; }
.nn-g-aside { display:flex; flex-wrap:wrap; gap:14px; margin-top:24px; }
.nn-g-prose { min-width:0; max-width:680px; color:#aab6c8; font-size:16px; line-height:1.72; }
.nn-g-prose p { margin:0 0 16px; }
.nn-g-prose h3 { margin:26px 0 8px; color:var(--ta-white); font-size:18px; font-weight:800; letter-spacing:-.02em; }
.nn-g-prose h3:first-child { margin-top:0; }
.nn-g-prose ul, .nn-g-prose ol { margin:0 0 18px; padding-left:22px; }
.nn-g-prose li { margin:7px 0; padding-left:4px; }
.nn-g-prose li::marker { color:var(--ta-cyan); font-weight:700; }
.nn-g-prose strong { color:#e7eef8; font-weight:700; }
.nn-g-prose a, .nn-guide .tt-feature p a { color:var(--ta-cyan); text-decoration:underline; text-decoration-color:rgba(88,214,255,.4); text-underline-offset:3px; }
.nn-g-prose a:hover { text-decoration-color:var(--ta-cyan); }
/* Screenshots */
.nn-g-shot { margin:0; width:180px; }
.nn-g-shot .tt-shot-frame { padding:6px; border:1px solid #1a2638; border-radius:22px; background:#070b12; box-shadow:0 14px 34px rgba(0,0,0,.4),0 0 0 1px rgba(88,185,255,.08); }
.nn-g-shot img { display:block; width:100%; height:auto; border-radius:16px; }
.nn-g-shot figcaption { margin-top:8px; color:#6f7f96; font:9.5px "DM Mono",monospace; letter-spacing:.06em; text-transform:uppercase; }
/* Photo placeholders (mock only) */
.nn-g-placeholder { margin:6px 0 22px; aspect-ratio:16/10; max-width:560px; border:1.5px dashed rgba(98,186,255,.45); border-radius:14px; background:repeating-linear-gradient(135deg,rgba(38,137,255,.06) 0 12px,rgba(38,137,255,.02) 12px 24px),#0b1220; display:flex; align-items:center; justify-content:center; text-align:center; }
.nn-g-photo-hero { width:100%; max-width:470px; aspect-ratio:4/3; margin:20px 0 0; }
.nn-g-ph-inner { display:grid; gap:8px; padding:20px 26px; max-width:400px; }
.nn-g-ph-tag { color:#ffc57c; font:600 10.5px "DM Mono",monospace; letter-spacing:.09em; }
.nn-g-ph-desc { color:#e7eef8; font-size:15px; font-weight:700; line-height:1.4; }
.nn-g-ph-alt { color:#8797ad; font-size:12.5px; line-height:1.45; }
/* CTA block */
.nn-g-cta { position:relative; z-index:1; padding:56px 38px; background:radial-gradient(ellipse at 85% 30%,rgba(38,137,255,.22),transparent 45%),linear-gradient(120deg,#0b1424,#0a101a); border-block:1px solid rgba(88,185,255,.22); }
.nn-g-cta-inner { max-width:1164px; margin:0 auto; display:grid; grid-template-columns:72px minmax(0,1fr); gap:26px; align-items:start; }
.nn-g-cta-icon { display:block; width:72px; height:72px; border-radius:17px; box-shadow:0 0 0 1px rgba(88,185,255,.25),0 8px 26px rgba(38,137,255,.32); }
.nn-g-cta-copy h2 { margin:12px 0 10px; color:var(--ta-white); font-size:clamp(28px,3vw,40px); line-height:1.1; letter-spacing:-.05em; }
.nn-g-cta-copy > p { max-width:560px; margin:0; color:#c3cede; font-size:16px; line-height:1.6; }
.nn-g-cta-actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px 24px; margin-top:24px; }
.nn-g-cta-actions .tt-store-badges { margin-top:0; }
.nn-guide .nn-g-faq { border-bottom:0; }
.nn-guide .nn-g-faq .tt-features-heading { align-self:start; }
.nn-guide .nn-g-faq .tt-feature p { margin:6px 0 0; }
@media (max-width:1050px) {
  .nn-g-sec { margin-inline:30px; grid-template-columns:1fr; gap:16px; padding:36px 0 38px; }
  .nn-g-aside { margin-top:16px; }
}
@media (max-width:760px) {
  .nn-guide .nn-g-hero .tt-hero-inner { padding:14px 0 26px; grid-template-columns:1fr; }
  .nn-guide .nn-g-hero h1 { font-size:30px; }
  .nn-guide .tt-brandline { gap:12px; }
  .nn-guide .tt-brandline .tt-hero-app-icon { width:42px; height:42px; flex-basis:42px; margin-top:3px; }
  .nn-g-answer { padding:16px 16px 4px; }
  .nn-g-answer p { font-size:15.5px; }
  .nn-guide .nn-g-hero-art { min-height:0; padding:8px 0 0; }
  .nn-guide .nn-g-hero-art:not(.nn-g-hero-photo) .tt-orbit { display:none; }
  .nn-guide .nn-g-hero-art { display:flex; flex-direction:column; align-items:center; width:100%; justify-self:stretch; margin:0; }
  .nn-guide .nn-g-hero-art .tt-phone-primary { width:190px; position:relative; inset:auto; transform:none; margin:0 auto; }
  .nn-guide .nn-g-hero-art .nn-preview-label { position:static; margin-top:10px; }
  .nn-g-sec { margin-inline:20px; padding:30px 0 32px; }
  .nn-g-prose { font-size:15.5px; }
  .nn-g-shot { width:150px; }
  .nn-g-cta { padding:40px 20px; }
  .nn-g-cta-inner { grid-template-columns:1fr; gap:16px; }
  .nn-g-cta-icon { width:56px; height:56px; border-radius:13px; }
}
