/* interior.css — shared overrides for interior pages
   (about, download, games, games-details, contact, privacy, terms) */

/* APK spec cards used on the download page */
.spec-card { text-align: center; padding: var(--space-5) var(--space-3); border-radius: var(--radius-md); background: var(--glass-bg); border: 1px solid var(--glass-border); }
.spec-card .spec-ico { color: var(--color-accent-bright); margin-bottom: 0.6rem; display: inline-grid; place-items: center; }
.spec-card b { display: block; font-family: var(--font-display); font-size: 1.05rem; color: var(--color-text-primary); }
.spec-card span { font-size: var(--fs-xs); color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.08em; }

/* Two-column hero for interior pages that need a mockup */
.interior-hero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(1.6rem, 5vw, 3.5rem); align-items: center; }
@media (max-width: 900px) { .interior-hero-grid { grid-template-columns: 1fr; text-align: center; } .interior-hero-grid .mockup-wrap { margin-top: 1rem; } }

/* Small info card (contact channels / APK info) */
.info-card { display: flex; gap: 1rem; align-items: flex-start; padding: var(--space-5); border-radius: var(--radius-lg); background: var(--glass-bg); border: 1px solid var(--glass-border); }
.info-card .ic-ico { flex-shrink: 0; display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--radius-md); background: rgba(0,179,104,0.12); border: 1px solid var(--glass-border-hover); color: var(--color-accent-bright); }
.info-card h3 { font-size: var(--fs-h4); margin-bottom: 0.25rem; }
.info-card p { color: var(--color-text-secondary); font-size: var(--fs-sm); }
.info-card a.ic-link { color: var(--color-accent-bright); font-weight: 600; font-size: var(--fs-sm); }

/* Definition/spec list */
.deflist { display: grid; gap: 0; border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; }
.deflist div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.85rem 1.1rem; border-bottom: 1px solid var(--color-border); }
.deflist div:last-child { border-bottom: none; }
.deflist dt { color: var(--color-text-muted); font-size: var(--fs-sm); }
.deflist dd { color: var(--color-text-primary); font-weight: 600; font-size: var(--fs-sm); text-align: right; }

/* Legal "last updated" meta line */
.doc-meta { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 0.8rem; font-size: var(--fs-sm); color: var(--color-text-muted); }
.doc-meta .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--color-accent-emerald); }

/* Table of contents (optional legal) */
.toc { position: sticky; top: calc(var(--header-h) + 1rem); }
.toc ul { display: grid; gap: 0.5rem; }
.toc a { color: var(--color-text-secondary); font-size: var(--fs-sm); }
.toc a:hover { color: var(--color-accent-bright); }

/* Anchor offset for in-page links under sticky header */
:target { scroll-margin-top: calc(var(--header-h) + 1.5rem); }