/* Spotterlist: focused product introduction; complete native iPhone originals. */
.landing-page { --section-space:clamp(48px,6vw,88px); }
.landing-page .shell { width:min(1200px,calc(100% - 2 * clamp(20px,5vw,72px))); }
.landing-page [id] { scroll-margin-top:calc(var(--header-height) + 24px); }
.landing-page h1,.landing-page h2,.landing-page h3 { margin:0;color:var(--ink);font-weight:650;text-wrap:balance;overflow-wrap:break-word; }
.landing-page p { color:var(--ink-soft); }
.landing-eyebrow { margin:0 0 18px;color:var(--accent-text)!important;font-size:.75rem;font-weight:650;line-height:1.5; }
.landing-hero { padding:clamp(32px,4.8vw,68px) 0 var(--section-space); }
.landing-hero-layout { display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(40px,7vw,100px);align-items:center; }
.landing-hero h1 { font-size:clamp(3.3rem,5.9vw,5.5rem);line-height:1.02;letter-spacing:-.055em; }
.landing-hero h1>span { display:block; }
.landing-title-accent { color:var(--accent-text); }
.landing-lead { margin:26px 0 0;max-width:44ch;font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.7; }
.landing-actions { display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:28px; }
.landing-page .button.primary { display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:50px;padding:12px 22px;border-radius:99px;background:var(--primary);color:#fff;box-shadow:none; }
.landing-page .button.primary:hover { background:var(--primary-hover); }
:root[data-theme="dark"] .landing-page .button.primary { color:#0e241a; }
.landing-text-link { display:inline-flex;align-items:center;gap:12px;min-height:44px;color:var(--ink);font-size:.875rem;font-weight:600;text-decoration:none; }
.landing-text-link>span:first-child { text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:5px;text-decoration-thickness:1px; }
.landing-text-link:hover>span:first-child { text-decoration-color:var(--accent-text); }
.landing-launch-note { margin-top:16px; }
.landing-launch-note .launch-note { margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none; }
.landing-launch-note .launch-note p { font-size:.75rem;line-height:1.6; }
.landing-launch-note .launch-note-dot { width:5px;height:5px;box-shadow:none; }
.landing-hero-photo { width:min(100%,440px);margin:30px 0 0; }
.landing-hero-photo img { display:block;width:100%;height:auto;border-radius:14px; }
.landing-hero-product { min-width:0; }
.landing-product-heading { display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;font-size:.8rem;font-weight:600;color:var(--ink); }
.landing-product-stage { display:grid;place-items:center;padding:0;background:none; }
.landing-hero-product:has(.landing-product-stage>.native-figure[hidden]) { display:none; }
.landing-hero-layout:has(.landing-product-stage>.native-figure[hidden]) { grid-template-columns:minmax(0,1fr); }
.landing-map-extra:has(>.native-figure[hidden]) { display:none; }
.landing-map-extra { width:min(100%,300px);margin:12px auto 0; }
.landing-map-extra summary { min-height:44px;padding-block:12px;color:var(--accent-text);font-weight:600;cursor:pointer; }
.landing-map-extra .native-figure { margin-top:24px; }
.native-figure { width:min(100%,300px);margin:0 auto;min-width:0; }
/* The in-page view and its enlargement share a window onto the original PNG.
   Coordinates use source pixels from the 1170 × 2532 iPhone captures. */
.native-shot,.preview-shot {
  display:block;
  position:relative;
  overflow:hidden;
  border-radius:16px;
  box-shadow:0 8px 28px #0a382214;
  --crop-top:150;
  --crop-bottom:2250;
  --visible-height:calc(var(--crop-bottom) - var(--crop-top));
  aspect-ratio:1170 / var(--visible-height);
}
.native-shot { width:100%; }
:is(.native-shot,.preview-shot):has(>img:is([src*="/statistics-"],[src*="/countries-map-"])) { --crop-bottom:2125; }
:is(.native-shot,.preview-shot):has(>img[src*="/discoveries-"]) { --crop-bottom:2204; }
:is(.native-shot,.preview-shot):has(>img[src*="/collection-"]) { --crop-bottom:2220; }
:is(.native-shot,.preview-shot)>img {
  display:block;
  position:absolute;
  inset:0 0 auto;
  width:100%;
  height:auto;
  max-height:none;
  transform:translateY(calc(-100% * var(--crop-top) / 2532));
}
.product-shot-button { display:block;width:100%;padding:0;border:0;border-radius:16px;background:none;color:inherit;text-align:inherit;cursor:zoom-in; }
.product-shot-button:disabled { cursor:default; }
.product-shot-button:focus-visible { outline:3px solid var(--focus-ring);outline-offset:5px; }
.landing-tour { padding-block:var(--section-space);border-top:1px solid var(--line); }
.landing-section-heading { display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:34px; }
.landing-section-heading h2,.landing-end h2 { max-width:23ch;font-size:clamp(2rem,3.3vw,3rem);letter-spacing:-.04em;line-height:1.12; }
.landing-section-heading>p { max-width:33ch;margin:0;font-size:.95rem;line-height:1.7; }
.landing-tour-nav { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:24px;border-bottom:1px solid var(--line); }
.landing-tour-nav a { display:flex;align-items:center;justify-content:center;min-height:52px;padding:10px 8px;border-bottom:2px solid transparent;color:var(--ink-soft);font-size:.95rem;font-weight:600;line-height:1.4;text-decoration:none; }
.landing-tour-nav a[aria-selected="true"] { border-color:var(--accent-text);color:var(--accent-text);background:none; }
.landing-tour-nav a:hover { color:var(--accent-text); }
.landing-tour-panel { display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,6vw,80px);align-items:center;min-width:0;padding:clamp(24px,4vw,52px);border-radius:24px;background:var(--surface-soft); }
.landing-tour-copy { max-width:480px;padding-block:20px; }
.landing-tour-panel:not(:has(>.landing-tour-media)) { grid-template-columns:minmax(0,1fr); }
.landing-tour-copy h3 { max-width:20ch;font-size:clamp(2rem,3vw,2.75rem);line-height:1.13;letter-spacing:-.04em; }
.landing-tour-copy>p:not(.landing-eyebrow) { margin:24px 0 0;max-width:42ch;font-size:1.05rem;line-height:1.75; }
.landing-tour-copy .landing-text-link { margin-top:24px; }
.landing-tour-media { min-width:0;padding:0;background:none; }
.landing-tour-media:has(>.native-figure[hidden]):not(.landing-collection-media) { display:none; }
.landing-tour-panel:has(>.landing-tour-media>.native-figure[hidden]):not(.landing-collection-panel) { grid-template-columns:minmax(0,1fr); }
.landing-collection-media { background:none;padding:0; }
.album-artwork { width:min(100%, 400px); margin:0 auto; }
.album-artwork picture, .album-artwork img { display:block; width:100%; }
.album-artwork img { height:auto; border-radius:16px; }
.artwork-preview .preview-shot { width:fit-content; max-width:100%; aspect-ratio:auto; }
.artwork-preview .preview-shot > img { position:static; width:auto; max-width:100%; height:auto; max-height:calc(100svh - 124px); object-fit:contain; transform:none; }
.landing-collection-photo { margin:0; }
.landing-collection-photo img { width:100%;height:auto;border-radius:16px; }
.landing-collection-media:has(.native-figure:not([hidden])) .landing-collection-photo { display:none; }
.landing-more { padding-block:var(--section-space);background:var(--surface-soft); }
.landing-more-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px); }
.landing-more-item { min-width:0; }
.landing-more-item>svg { width:32px;height:32px;margin-bottom:24px;fill:none;stroke:var(--accent-text);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round; }
.landing-more-item h3 { max-width:24ch;font-size:1.35rem;letter-spacing:-.025em;line-height:1.25; }
.landing-more-item>p { margin:16px 0 12px;font-size:.9rem;line-height:1.75; }
.landing-more-item .native-figure { margin-top:24px; }
.landing-faq { padding-block:var(--section-space); }
.landing-faq-grid { display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,84px);align-items:start; }
.landing-faq .landing-section-heading { margin-bottom:0; }
.landing-faq .landing-text-link { margin-top:22px; }
.landing-detail-list { border-top:1px solid var(--line-strong);min-width:0; }
.landing-detail-list>details { margin:0;padding:0;border:0;border-radius:0;border-bottom:1px solid var(--line-strong);background:none;box-shadow:none; }
.landing-detail-list summary { display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px;padding:20px 0;cursor:pointer;list-style:none;color:var(--ink);font-size:1rem;font-weight:600;line-height:1.5; }
.landing-detail-list summary::-webkit-details-marker { display:none; }
.landing-detail-list summary>span:last-child { flex:0 0 auto;color:var(--accent-text);font-size:1.4rem; }
.landing-detail-list details[open] summary>span:last-child { transform:rotate(45deg); }
.landing-detail-list details>p { margin:0 0 24px;font-size:.9rem;line-height:1.75; }
.landing-end { padding-block:56px;background:var(--primary-soft); }
.landing-end-inner { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center; }
.landing-end-inner>div>p:last-child { max-width:56ch;margin:20px 0 0;line-height:1.7; }
.landing-end-actions { display:grid;gap:12px;justify-items:start; }
.story-preview { width:min(760px,calc(100% - 24px));max-height:calc(100svh - 24px);overflow:auto;padding:16px 20px 20px;border:0;border-radius:18px;background:var(--surface);color:var(--ink); }
.story-preview::backdrop { background:#03120bd9; }
.story-preview-header { position:sticky;top:0;z-index:1;display:flex;align-items:start;justify-content:space-between;gap:20px;padding-bottom:8px;background:var(--surface); }
.story-preview-header p { margin:0;font-weight:600;line-height:1.4; }
.story-preview-close { flex:0 0 44px;display:grid;place-items:center;width:44px;height:44px;padding:12px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink);cursor:pointer; }
.story-preview-close svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7; }
.story-preview-hint { color:var(--muted);font-size:.8rem; }
.preview-shot { width:min(100%,calc((100svh - 124px) * 1170 / var(--visible-height)));margin:16px auto 0; }
.preview-shot:not(:has(>img[src]:not([hidden]))) { display:none; }
body.is-preview-open { overflow:hidden; }
@media (max-width:1000px) {
 .landing-hero-layout { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:32px; }
 .landing-hero h1 { font-size:clamp(3rem,6.1vw,4.6rem); }

 .landing-section-heading { align-items:start; }

}
@media (max-width:700px) {
 .landing-hero-layout,.landing-tour-panel,.landing-faq-grid,.landing-end-inner { grid-template-columns:minmax(0,1fr);gap:32px; }
 .landing-hero h1 { font-size:clamp(2.75rem,10.5vw,4.25rem); }
 .landing-lead { margin-top:20px; }
 .landing-hero-photo { display:none; }
 .landing-hero-product { width:min(100%,390px);margin-inline:auto; }

 .landing-tour-panel { padding:24px 20px;gap:28px; }
 .landing-tour-copy { padding-block:0; }

 .landing-section-heading { display:block;margin-bottom:26px; }
 .landing-section-heading>p { margin-top:18px;max-width:44ch; }
 .landing-tour-nav a { padding:10px 4px;font-size:.8rem;overflow-wrap:anywhere; }
 .landing-tour-copy h3 { max-width:24ch; }
 .landing-tour-copy>p:not(.landing-eyebrow) { font-size:1rem; }
 .landing-tour-copy>p:not(.landing-eyebrow) { margin-top:18px; }
 .landing-collection-media { padding:0; }
 .landing-more-grid { grid-template-columns:minmax(0,1fr);gap:32px; }
 .landing-more-item { padding-bottom:28px;border-bottom:1px solid var(--line-strong); }
 .landing-more-item:last-child { border:0;padding:0; }
 .landing-more-item>svg { margin-bottom:16px; }
 .landing-end { padding-block:40px; }
}
@media (prefers-reduced-motion:reduce) {
 .landing-page *,.story-preview * { animation:none!important;transition:none!important;scroll-behavior:auto!important; }
}
@media (forced-colors:active) {
 .landing-tour-nav a[aria-selected="true"] { border-color:Highlight;outline:1px solid Highlight; }
}