/* ZipCam guides reuse the site theme, native scrolling, and app-download controls. */
.zipcam-page {
  --guide-width: 720px;
  --guide-image-width: 240px;
  --guide-card-width: 360px;
  --guide-thumbnail-height: 240px;
}
.guide-section-intro { margin-bottom: var(--space-3); max-width: var(--guide-width); }
.guide-track { display: flex; gap: var(--space-3); overflow-x: auto; scroll-snap-type: x proximity; overscroll-behavior-x: contain; padding: var(--space-1) var(--space-1) var(--space-3); scrollbar-color: var(--blue) var(--blue-art); }
.guide-card { flex: 0 0 var(--guide-card-width); max-width: 88%; scroll-snap-align: start; border: 1px solid var(--line); border-radius: var(--card-radius); background: var(--surface); text-decoration: none; transition: border-color var(--motion); }
.guide-card:hover { border-color: var(--blue); }
.guide-card:focus-visible { outline-offset: 3px; }
.guide-card-art { display: flex; justify-content: center; padding: var(--space-3); background: var(--blue-soft); border-radius: var(--card-radius) var(--card-radius) 0 0; }
.guide-card-art img { height: var(--guide-thumbnail-height); width: auto; object-fit: contain; border-radius: var(--space-1); }
.guide-card-copy { padding: var(--space-3); }
.guide-card h3 { margin-block: var(--space-1) var(--space-2); }
.guide-card-copy > p:not(.eyebrow) { font-size: var(--text-body); }
.guide-card .text-link { margin-top: var(--space-3); }
.guide-brand-icon { width: var(--space-5); height: var(--space-5); border-radius: var(--space-1); }
.guide-breadcrumb { flex-wrap: wrap; gap: var(--space-1); padding-block: var(--space-3); color: var(--muted); }
.guide-hero { display: grid; grid-template-columns: minmax(0, 1fr) var(--guide-image-width); align-items: start; gap: var(--space-6); padding-block: var(--space-3) var(--space-5); }
.guide-hero h1 { font-size: var(--text-heading); margin-block: var(--space-2) var(--space-3); }
.guide-intro { font-size: var(--text-lead); margin-bottom: var(--space-3); }
.guide-byline { font-size: var(--text-small); margin-top: var(--space-3); }
.guide-figure img { border-radius: var(--card-radius); }
.guide-figure figcaption { color: var(--muted); font-weight: 400; }
.guide-body { max-width: var(--guide-width); overflow-wrap: break-word; }
.guide-body > section, .guide-related { margin-block: var(--space-5); }
.guide-body h2 { font-size: var(--text-card); line-height: 1.3; margin-bottom: var(--space-3); }
.guide-body p + p { margin-top: var(--space-2); }
.guide-body ul, .guide-body ol { padding-left: var(--space-3); margin-block: var(--space-2); color: var(--muted); }
.guide-body li { padding-left: var(--space-1); margin-bottom: var(--space-2); }
.guide-body strong { color: var(--ink); font-weight: 650; }
.guide-contents { display: block; padding: var(--space-3); background: var(--surface); border: 1px solid var(--line); border-radius: var(--card-radius); }
.guide-contents ol { margin-bottom: 0; }
.guide-tip { padding: var(--space-3); border-left: var(--space-1) solid var(--blue); background: var(--blue-soft); border-radius: 0 var(--card-radius) var(--card-radius) 0; }
.guide-related { display: block; font-size: var(--text-body); }
.guide-support { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-3); padding-block: var(--space-4); font-size: var(--text-small); }
.zipcam-page .download-panel .app-download { margin-top: var(--space-3); }
.zipcam-page .download-panel .app-download .store-badge { margin-top: 0; }
@media (max-width: 700px) {
  .guide-hero { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .guide-figure { width: min(var(--guide-image-width), 100%); justify-self: center; }
  .guide-intro { font-size: var(--text-body); }
  .guide-breadcrumb { font-size: var(--text-small); }
}
@media (prefers-color-scheme: dark) {
  .zipcam-page { color-scheme: dark; --background: #141c2a; --surface: #1c2839; --ink: #edf3ff; --muted: #b4c2d9; --line: #34465e; --blue: #91baff; --blue-soft: #202f49; --blue-art: #2a405f; --phone-shadow: #00000055; }
  .zipcam-page .monogram { color: var(--background); }
}