/* Preview refinements, 22 Oct: photo-first locations and scene invitations. */
.scroll-cue { position:absolute; z-index:8; left:max(24px,env(safe-area-inset-left)); bottom:calc(40px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; align-items:center; gap:5px; color:#fff; opacity:.78; pointer-events:none; filter:drop-shadow(0 2px 4px #0008); }
.scroll-cue[hidden] { display:none; }
.scroll-cue svg { width:20px; height:42px; animation:swipe-up 2.4s ease-in-out infinite; }
.scroll-cue span { font:600 7px/1.4 Arial,sans-serif; letter-spacing:.16em; }
@keyframes swipe-up { 0%,100% { transform:translateY(5px); opacity:.35; } 55% { transform:translateY(-7px); opacity:1; } }
.metrics-copy { position:absolute; z-index:3; top:clamp(88px,23vw,132px); left:max(22px,env(safe-area-inset-left)); width:calc(100% - 100px); max-width:650px; opacity:0; isolation:isolate; }
.metrics-copy::before { content:''; position:absolute; z-index:-1; inset:-35px -20px -18px; background:linear-gradient(90deg,#000b,#0007 72%,transparent); filter:blur(10px); pointer-events:none; }
.metrics-copy .campaign-type { display:grid; grid-template-rows:repeat(3,auto); font-size:clamp(28px,8vw,70px); line-height:.94; gap:.025em; }
.metrics-copy .campaign-row { display:contents; }
.metrics-copy .campaign-unit { width:auto; justify-content:flex-start; }
.metrics-support { max-width:320px; margin:11px 0 10px; font:400 clamp(10px,2.6vw,13px)/1.45 Arial,sans-serif; color:#fff; text-shadow:0 1px 6px #000; }
.metrics-copy .editorial-link { min-height:44px; font-size:9px; padding:10px 14px; gap:10px; }
.scene-invitation { position:absolute; z-index:3; left:max(24px,env(safe-area-inset-left)); top:calc(55% - 110px); margin:0; font:900 clamp(26px,7vw,54px)/.96 'ATL Outfit','Arial Black',Arial,sans-serif; letter-spacing:-.045em; text-shadow:0 2px 15px #0009; }
.scene-invitation::before { content:''; position:absolute; z-index:-1; inset:-22px -28px; background:radial-gradient(ellipse at left,#0008,transparent 75%); }
.scene-invitation span { color:#ffe500; }
.editorial-gallery { margin:30px 0 32px; display:grid; grid-template-columns:minmax(0,1fr); gap:34px; }
.space-story,.space-story:nth-child(even),.space-story:nth-child(odd) { min-width:0; margin:0; padding:0; border:0; }
.space-photo { display:block; overflow:hidden; border-radius:18px; background:#0c0e12; border:1px solid #ffffff26; }
.space-photo img { display:block; width:100%; aspect-ratio:4/3; height:auto; object-fit:contain; transition:transform .5s ease; }
.space-photo:focus-visible { outline:2px solid #ffe500; outline-offset:4px; }
.space-story figcaption { padding-top:13px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:9px; }
.location-caption { margin:0; font:500 12px/1.4 Arial,sans-serif; color:#e4e5eb; }
.site-panel .location-cta { margin:0; font-size:8px; letter-spacing:.06em; padding:10px 13px; min-height:44px; }
@media(min-width:760px) { .editorial-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:38px 24px; } .metrics-copy { left:5vw; width:min(560px,65vw); } .scene-invitation { left:5vw; } }
@media(min-aspect-ratio:11/10) { .metrics-copy { top:110px; } .metrics-copy .campaign-type { font-size:clamp(35px,5.6vw,70px); } .scene-invitation { top:calc(55% - 132px); } }
@media(max-height:650px) and (max-aspect-ratio:4/5) { .metrics-copy { top:76px; } .metrics-copy .campaign-type { font-size:clamp(25px,7.2vw,38px); } .metrics-support { margin:7px 0; } }
@media(max-height:500px) and (min-aspect-ratio:4/5) { .metrics-copy { top:70px; width:46%; } .metrics-copy .campaign-type { font-size:25px; } .metrics-support { font-size:10px; margin:7px 0; } .metrics-copy .editorial-link { font-size:8px; } .scene-invitation { top:calc(55% - 75px); font-size:26px; } }
@media(hover:hover) { .space-photo:hover img { transform:scale(1.025); } }
@media(prefers-reduced-motion:reduce) { .scroll-cue svg { animation:none; } .space-photo img { transition:none; } }
/* Keep desktop technical details clear of the new metrics invitation. */
@media(min-width:900px) and (min-aspect-ratio:11/10) {
  .metrics-copy { width:44vw; max-width:520px; }
  .site-specs { left:auto; right:5vw; width:43vw; max-width:530px; }
}
@media(max-height:700px) and (max-aspect-ratio:4/5) {
  .site-specs { top:max(270px,70vw); padding-top:8px; }
  .spec-heading { padding-top:8px; font-size:8px; }
  .site-specs h2 { font-size:21px; margin:8px 0 10px; }
  .spec-grid { gap:10px; }
  .spec-note { font-size:7px; margin-top:8px; }
}

/* Keep the swipe invitation above browser/preview bottom overlays on phones. */
.scroll-cue { bottom:calc(110px + env(safe-area-inset-bottom)); gap:7px; opacity:1; padding:9px 7px; border-radius:18px; background:#10111466; }
.scroll-cue svg { width:24px; height:44px; }
.scroll-cue span { font-size:8px; letter-spacing:.1em; }

/* Keep the Bitso photo and CTA layout; remove only its overlaid headline/support. */
.metrics-copy .campaign-type, .metrics-copy .metrics-support { visibility:hidden; }
