:root {
  --cream: #f1eadf;
  --paper: #fbf8f2;
  --ink: #151515;
  --muted: #6f6b65;
  --line: #d6cfc4;
  --orange: #ca5b2a;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; font-family: "DM Sans", Arial, sans-serif; background: var(--paper); color: var(--ink); }
a { color: inherit; }
button { font: inherit; }
a:focus-visible, button:focus-visible { outline: 3px solid #ff9a66; outline-offset: 5px; }
.skip-link { position: fixed; top: -80px; left: 16px; z-index: 100; padding: 12px; background: var(--paper); color: var(--ink); }
.skip-link:focus { top: 12px; }

.site-header { position: absolute; z-index: 20; top: 0; left: 0; width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 24px 5vw; color: white; }
.brand { font-size: 1.35rem; font-weight: 700; text-decoration: none; letter-spacing: -.04em; white-space: nowrap; }
.brand > span:not(.brand-caption) { color: #ff9a66; }
.brand-caption { display: block; margin-top: 6px; font-size: .48rem; font-weight: 500; letter-spacing: .14em; }
nav { display: flex; align-items: center; gap: 28px; }
nav a { text-decoration: none; font-size: .92rem; }
nav a:hover, .text-link:hover { text-decoration: underline; text-underline-offset: 5px; }
.menu-toggle { display: none; }

.hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: end; overflow: hidden; background: linear-gradient(90deg, rgba(0,0,0,.60), rgba(0,0,0,.12) 85%), url("https://images.unsplash.com/photo-1531968455001-5c5272a41129?auto=format&fit=crop&w=2200&q=85") center/cover no-repeat; color: white; }
.hero-content { position: relative; z-index: 2; width: 100%; padding: 180px 5vw 15vh; }
.eyebrow { margin: 0 0 14px; font-size: .74rem; font-weight: 700; letter-spacing: .14em; line-height: 1.7; }
.accent { color: var(--orange); }
.small-line { display: none; }
h1, h2 { font-family: "Playfair Display", Georgia, serif; font-weight: 600; }
h1 { margin: 0; font-size: clamp(4.3rem, 9vw, 9rem); line-height: .92; letter-spacing: -.06em; }
h1 em, h2 em { font-weight: 600; }
h2 { margin: 0; font-size: clamp(2.8rem, 6vw, 5.3rem); line-height: .95; letter-spacing: -.045em; }
h3 { margin: 0; font-size: 1.65rem; line-height: 1.15; }
.hero-copy { max-width: 640px; margin: 28px 0 0; font-size: 1.16rem; line-height: 1.6; color: rgba(255,255,255,.88); }
.hero-actions { display: flex; align-items: center; gap: 24px; margin-top: 32px; }
.button { display: inline-flex; align-items: center; gap: 24px; padding: 14px 20px; border-radius: 999px; background: white; color: black; text-decoration: none; font-weight: 600; }
.button:hover { background: var(--cream); }
.text-link { text-decoration: none; font-weight: 600; }
.hero-bottom { position: absolute; left: 5vw; right: 5vw; bottom: 4vh; display: flex; justify-content: space-between; gap: 20px; font-size: .65rem; letter-spacing: .13em; }
.hero-bottom span:last-child { letter-spacing: .03em; }

.trip-strip { padding: 34px 5vw; background: var(--orange); color: white; display: flex; align-items: center; justify-content: space-between; gap: 24px; font-size: .95rem; }
.trip-strip > div { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.status-dot { width: 7px; height: 7px; background: white; border-radius: 50%; }
.trip-date { font-size: .75rem; }
.trip-strip a { text-decoration: none; }
.trip-strip a span { padding: 0 8px; }

.section { padding: 100px 5vw; }
.section-head { display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; align-items: end; margin-bottom: 48px; }
.section-copy { max-width: 560px; color: var(--muted); line-height: 1.7; margin-bottom: 0; }
.route-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.route-card { display: flex; flex-direction: column; overflow: hidden; border-radius: 3px; background: var(--cream); }
.route-top { display: flex; justify-content: space-between; gap: 12px; padding: 24px; font-size: .72rem; font-weight: 700; letter-spacing: .1em; }
.route-art { position: relative; height: 180px; overflow: hidden; }
.route-art > span { position: absolute; left: 24px; top: -20px; font-family: "Playfair Display", Georgia, serif; font-size: 9rem; line-height: 1; opacity: .13; letter-spacing: -.08em; }
.route-art svg { position: absolute; width: 100%; height: 140px; bottom: 0; fill: none; stroke: currentColor; stroke-width: 1.2; }
.argentina { background: #e6ddc7; color: #67552d; }
.chile { background: #dce1dd; color: #42636a; }
.bolivia { background: #ead9cf; color: #8a4c3c; }
.route-content { display: flex; flex-direction: column; flex: 1; padding: 28px; background: var(--cream); color: var(--ink); }
.route-content .eyebrow { font-size: .65rem; color: var(--orange); }
.route-content h3 { font-family: "Playfair Display", Georgia, serif; font-size: 1.8rem; }
.route-content p:not(.eyebrow) { color: var(--muted); font-size: .92rem; line-height: 1.7; }
.route-label { border-top: 1px solid var(--line); padding-top: 18px; margin-top: auto; font-size: .8rem; }
.route-footnote { display: flex; justify-content: space-between; gap: 20px; margin: 24px 0 0; color: var(--muted); font-size: .8rem; line-height: 1.7; }
.route-footnote span { font-style: italic; }

.about-section { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: center; gap: clamp(40px, 6vw, 100px); padding: 120px 5vw; background: var(--cream); }
.about-mark { display: none; }
.about-copy { max-width: 700px; min-width: 0; }
.about-copy > p:not(.eyebrow) { max-width: 700px; margin: 28px 0 0; font-size: 1.12rem; line-height: 1.8; color: var(--muted); }
.about-copy .about-promise { color: var(--ink); font-weight: 600; }
.hosts { min-width: 0; width: 100%; max-width: 520px; justify-self: center; }
.hosts-sign { width: fit-content; margin: 0 auto 30px; padding: 12px 24px; border: 1px solid var(--orange); border-radius: 3px; background: var(--paper); color: var(--orange); font-family: "Playfair Display", Georgia, serif; font-size: 1.5rem; font-style: italic; transform: rotate(-3deg); box-shadow: 4px 4px 0 #ca5b2a18; }
.host-card { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 20px; margin: 0; padding: 10px 20px 10px 10px; background: var(--paper); border: 1px solid var(--line); border-radius: 4px; box-shadow: 0 10px 24px #1515150a; }
.host-card + .host-card { margin-top: 32px; }
.host-flags { position: absolute; top: -16px; right: -12px; display: flex; gap: 7px; transform: rotate(7deg); }
.host-flag { display: grid; place-items: center; width: 46px; height: 38px; border: 1px solid var(--line); border-radius: 6px; background: var(--paper); box-shadow: 0 4px 10px #15151518; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 28px; line-height: 1; }
.host-flag + .host-flag { transform: rotate(-12deg) translateY(3px); }
.host-card img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 2px; }
.host-card figcaption { min-width: 0; padding: 8px 0; }
.host-name { font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.2rem, 2vw, 1.7rem); font-style: italic; }
.host-origin, .host-details { font-size: .8rem; line-height: 1.6; color: var(--muted); }
.host-origin { margin: 12px 0; }
.host-details { margin: 0; }
.host-details dt { margin-top: 10px; color: var(--ink); font-weight: 700; }
.host-details dd { margin: 3px 0 0; }
@media (max-width: 480px) {
  .host-card { gap: 14px; padding-right: 14px; }
  .host-origin, .host-details { font-size: .75rem; }
}
.host-card figcaption::before { content: ""; display: block; width: 28px; height: 2px; margin-bottom: 12px; background: var(--orange); }
@media (max-width: 1000px) {
  .about-section { grid-template-columns: 1fr; }
  .about-copy { max-width: 700px; margin: 0 auto; }
}

.watch-section {
  position: relative;
  background:
    radial-gradient(circle at 10% 15%, rgba(255,255,255,.95) 0 1.2px, transparent 2.1px),
    radial-gradient(circle at 22% 35%, rgba(255,255,255,.9) 0 1.1px, transparent 2.1px),
    radial-gradient(circle at 34% 18%, rgba(255,255,255,.8) 0 1.3px, transparent 2.3px),
    radial-gradient(circle at 45% 64%, rgba(255,255,255,.9) 0 1.6px, transparent 2.7px),
    radial-gradient(circle at 60% 12%, rgba(255,255,255,.9) 0 1.4px, transparent 2.5px),
    radial-gradient(circle at 72% 45%, rgba(255,255,255,.75) 0 1.2px, transparent 2.4px),
    radial-gradient(circle at 84% 24%, rgba(255,255,255,.85) 0 1.3px, transparent 2.5px),
    radial-gradient(circle at 90% 70%, rgba(255,255,255,.75) 0 1.4px, transparent 2.8px),
    radial-gradient(circle at 18% 80%, rgba(255,255,255,.78) 0 1.5px, transparent 2.8px),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.4) 0 1.5px, transparent 3px),
    #050505;
  background-size: 220px 220px, 260px 260px, 300px 300px, 240px 240px, 280px 280px, 320px 320px, 340px 340px, 300px 300px, 220px 220px, 100% 100%, 100% 100%;
  color: white;
  padding-top: 100px;
  padding-bottom: 100px;
  overflow: hidden;
}
.watch-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.12), transparent 40%),
    linear-gradient(180deg, rgba(10,10,12,.18), rgba(0,0,0,.12));
  pointer-events: none;
}
.watch-section::after {
  content: "";
  position: absolute;
  inset: -12% -8%;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.95) 0 1.2px, transparent 2px),
    radial-gradient(circle, rgba(255,255,255,.8) 0 1.1px, transparent 2.2px),
    radial-gradient(circle, rgba(255,255,255,.9) 0 1.3px, transparent 2.5px),
    radial-gradient(circle, rgba(255,255,255,.7) 0 1.2px, transparent 2.4px),
    radial-gradient(circle, rgba(255,255,255,.85) 0 1.4px, transparent 2.6px),
    radial-gradient(circle, rgba(255,255,255,.75) 0 1.1px, transparent 2.2px),
    radial-gradient(circle, rgba(255,255,255,.9) 0 1.3px, transparent 2.6px);
  background-position: 10% 18%, 28% 24%, 52% 18%, 68% 36%, 84% 14%, 16% 72%, 62% 64%;
  background-size: 220px 220px;
  opacity: .9;
  animation: sparkle 5s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes sparkle {
  0%, 100% { opacity: .3; transform: scale(1); }
  25% { opacity: 1; }
  50% { opacity: .75; transform: scale(1.03); }
  75% { opacity: .95; }
}
.watch-section > * { position: relative; z-index: 1; }
.watch-section .section-copy { color: rgba(255,255,255,.65); }
.watch-intro { margin-bottom: 18px; }
.watch-section .eyebrow { color: rgba(255,255,255,.72); }
.socials-title {
  margin: 0;
  font-family: "DM Sans", Arial, sans-serif;
  font-size: clamp(4.5rem, 12vw, 14rem);
  line-height: .8;
  letter-spacing: -.045em;
  font-weight: 700;
  text-transform: uppercase;
  color: #ff27b8;
  transform: none;
  -webkit-text-stroke: 0;
  text-shadow:
    0 0 2px #ff82d5,
    0 0 10px #ff209f,
    0 0 20px #ff38c9,
    0 0 42px #ff00b7,
    0 0 78px #ff00b799,
    0 0 120px #ff00b755,
    0 3px 0 #c42091,
    0 6px 0 #86165f,
    3px 10px 0 #490e38,
    8px 18px 18px #000,
    0 28px 38px #000b;
}
.socials-showcase {
  position: relative;
  width: min(76vw, 760px);
  height: clamp(420px, 54vw, 700px);
  margin-top: 26px;
  perspective: 1400px;
  transform-style: preserve-3d;
}
.social-card {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  width: min(28vw, 260px);
  height: clamp(380px, 52vw, 700px);
  transform-origin: center center;
  will-change: transform;
}
.phone-wrap {
  position: relative;
  width: 100%;
  height: 82%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
/* A metal rim, glass screen, camera island and physical side buttons. */
.phone, .social-card.is-featured .phone {
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 9 / 19.5;
  border-radius: 36px;
  border: 2px solid #8c9099;
  background: linear-gradient(115deg, #e1e3e8, #444853 12%, #101116 48%, #777b85 88%, #d8dce3);
  box-shadow: 5px 3px 0 #282b34, 7px 4px 0 #777984, 16px 26px 35px #0009, inset 0 0 0 2px #111;
  transform: perspective(1000px) rotateY(var(--phone-tilt, 0deg)) rotateZ(var(--phone-roll, 0deg));
}
.phone::before {
  content: "";
  position: absolute;
  z-index: 3;
  top: 13px;
  left: 50%;
  width: 29%;
  height: 16px;
  transform: translateX(-50%);
  border-radius: 20px;
  background: radial-gradient(circle at 80% 50%, #15355a 0 2px, #08090c 3px 5px, transparent 6px), #020203;
  box-shadow: 0 1px 1px #ffffff18;
}
.phone::after {
  content: "";
  position: absolute;
  z-index: 3;
  left: 35%;
  bottom: 13px;
  width: 30%;
  height: 3px;
  border-radius: 10px;
  background: #ffffffb0;
}
.phone-buttons {
  position: absolute;
  left: -5px;
  top: 23%;
  width: 3px;
  height: 28px;
  border-radius: 2px;
  background: linear-gradient(90deg, #444853, #a5a9b2);
  box-shadow: 0 38px 0 #7e828d;
}
.phone-buttons::after {
  content: "";
  position: absolute;
  left: clamp(142px, 22vw, 264px);
  top: 15px;
  width: 3px;
  height: 43px;
  border-radius: 2px;
  background: #8c9099;
}
.phone-screen, .social-card.is-featured .phone-screen {
  position: absolute;
  inset: 6px;
  border-radius: 28px;
  overflow: hidden;
  border: 1px solid #000;
  background: #101114;
}
.phone-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, #ffffff13, transparent 38%, transparent 70%, #ffffff06);
}
.app-ui {
  position: absolute;
  inset: 14px 10px 14px;
  border-radius: 18px;
  background: linear-gradient(180deg, #0d0d0d 0%, #191919 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
  overflow: hidden;
}
.app-topbar {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 26px;
  padding: 8px 10px 0;
  color: rgba(255,255,255,.7);
  font-size: .58rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.camera {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
}
.app-brand {
  flex: 1;
  text-align: center;
  font-weight: 700;
  letter-spacing: .06em;
}
.screen-handle {
  display: block;
  padding: 4px 10px 0;
  color: rgba(255,255,255,.8);
  font-size: .52rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: lowercase;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.top-actions {
  display: flex;
  gap: 4px;
  justify-content: flex-end;
}
.top-actions i {
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(255,255,255,.7);
}
.story-strip {
  display: flex;
  gap: 8px;
  padding: 10px 12px 12px;
}
.story {
  display: block;
  flex: 1;
  height: 32px;
  border-radius: 16px;
  background: linear-gradient(135deg, #ffd9b1, #ff69d2 35%, #6d7dfb 100%);
  opacity: .9;
}
.post-card {
  padding: 0 10px 12px;
}
.post-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 0 8px;
  color: rgba(255,255,255,.8);
  font-size: .56rem;
}
.avatar {
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: linear-gradient(145deg, #ffb677, #ff4fd8 58%, #5f79ff);
  box-shadow: 0 0 0 1px rgba(255,255,255,.1);
}
.media-preview {
  position: relative;
  height: 170px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.18));
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}
.travel-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(1.08) contrast(1.05);
}
.post-meta {
  display: flex;
  gap: 10px;
  padding-top: 10px;
}
.heart, .comment, .share {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  background: rgba(255,255,255,.72);
  position: relative;
}
.heart::before, .comment::before, .share::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,.72);
  border-radius: inherit;
}
.heart { transform: rotate(45deg); }
.heart::before { transform: rotate(-45deg); }
.comment { border-radius: 3px 3px 8px 3px; }
.share { transform: rotate(45deg); }
.video-window {
  padding: 10px 10px 0;
}
.video-surface {
  position: relative;
  height: 170px;
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(255,255,255,.05), rgba(30,30,30,.94) 40%, rgba(8,8,8,.96));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
.video-surface::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.22));
  z-index: 1;
  pointer-events: none;
}
.video-badge {
  position: absolute;
  left: 14px;
  top: 14px;
  z-index: 2;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255,32,32,.88);
  color: white;
  font-size: .48rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.video-play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  z-index: 2;
}
.video-play::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 12px;
  width: 0;
  height: 0;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  border-left: 18px solid #0a0a0a;
}
.video-info {
  padding: 10px 10px 8px;
}
.channel-line {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,.8);
}
.channel-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.channel-meta strong {
  font-size: .56rem;
  font-weight: 700;
}
.channel-meta small {
  font-size: .46rem;
  color: rgba(255,255,255,.56);
}
.channel-line button {
  border: 0;
  background: #fff;
  color: #0c0c0c;
  border-radius: 999px;
  font-size: .5rem;
  font-weight: 700;
  padding: 6px 8px;
}
.title-line {
  margin-top: 10px;
  font-size: .58rem;
  line-height: 1.5;
  color: rgba(255,255,255,.8);
}
.progress-row {
  height: 4px;
  margin: 8px 10px 0;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  overflow: hidden;
}
.progress-row span {
  display: block;
  width: 52%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ff6ee7, #ff3d3d 40%, #ffb86b 100%);
}
.tiktok-video {
  position: relative;
  padding: 12px 10px 0;
}
.tiktok-surface {
  height: 200px;
}
.tiktok-surface::before {
  background: linear-gradient(135deg, rgba(255,76,151,.8), rgba(255,144,97,.7) 35%, rgba(30,30,30,.9));
}
.tiktok-overlay {
  position: absolute;
  left: 16px;
  bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  z-index: 2;
}
.mini-avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ffd9a8, #ff5bcf, #6c88ff);
}
.mini-text {
  width: 72px;
  height: 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.24);
}
.interaction-row {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 12px 0;
}
.interaction-row .heart,
.interaction-row .comment,
.interaction-row .share {
  width: 10px;
  height: 10px;
  background: rgba(255,255,255,.75);
}
.social-label {
  display: inline-block;
  margin-top: 20px;
  font-size: clamp(.8rem, 1.9vw, 1.15rem);
  font-weight: 600;
  letter-spacing: -.02em;
  color: rgba(255,255,255,.92);
}
/* Equal device proportions; apparent size follows depth in the orbit. */
.socials-showcase { width: min(90vw, 1000px); height: clamp(410px, 55vw, 650px); margin-inline: auto; }
.social-card, .social-card.is-featured { width: clamp(140px, 22vw, 260px); height: auto; justify-content: center; }
.phone-wrap { height: auto; }
.watch-section > .space-plane {
  position: absolute;
  top: 0;
  left: 0;
  width: clamp(140px, 14vw, 185px);
  height: auto;
  z-index: 0;
  pointer-events: none;
  filter: drop-shadow(0 0 10px #ffb52b60);
  will-change: transform;
}
.space-plane-body { fill: #ffd34d; stroke: #ffad32; stroke-width: 2; stroke-linejoin: round; }
.space-plane-brand { fill: #8c201c; font-family: "DM Sans", Arial, sans-serif; font-size: 34px; font-weight: 800; letter-spacing: 1px; }
.space-plane-fire { transform-origin: 17px 80px; animation: space-plane-thrust .22s ease-in-out infinite alternate; }
@keyframes space-plane-thrust {
  from { transform: scale(1, .9); opacity: .85; }
  to { transform: scale(.78, 1.08); opacity: 1; }
}
@media (max-width: 700px) {
  .watch-section { padding-top: 72px; padding-bottom: 60px; }
  .social-label { margin-top: 16px; }
  .phone, .social-card.is-featured .phone { border-radius: 25px; }
  .phone-screen, .social-card.is-featured .phone-screen { border-radius: 19px; }
  .phone::before { top: 10px; height: 12px; }
  .phone .app-ui { inset: 22px 2px 12px; padding: 8px 5px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .watch-section::after, .space-plane-fire { animation: none; }
}

.notebook { border-top: 1px solid var(--line); }
.notebook article { display: grid; grid-template-columns: 70px 1fr auto; gap: 20px; align-items: center; padding: 28px 0; border-bottom: 1px solid var(--line); }
.notebook article > span:first-child { color: var(--muted); font-size: .9rem; }
.notebook h3 { font-family: "Playfair Display", Georgia, serif; }
.note-status { color: var(--muted); font-size: .8rem; }

.contact-section { padding: 100px 5vw; background: var(--cream); display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: 60px; }
.contact-section .eyebrow { color: var(--orange); }
.contact-copy > p { color: var(--muted); font-size: 1.05rem; line-height: 1.8; }
.services { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 10px; margin: 24px 0 32px; }
.services button { display: flex; align-items: center; justify-content: center; min-height: 64px; padding: 14px 12px; border: 1px solid var(--line); border-radius: 8px; background: #ffffff38; font-size: .75rem; line-height: 1.5; text-align: center; text-wrap: balance; }
.contact-section .button { background: var(--ink); color: white; }
.contact-section .button:hover { background: #393939; }
.email-link { display: block; margin-top: 24px; font-size: clamp(1rem, 2vw, 1.7rem); font-family: "Playfair Display", Georgia, serif; text-underline-offset: 7px; overflow-wrap: anywhere; }
.closing { text-align: center; padding: 100px 5vw; }
.closing > p { color: var(--muted); line-height: 1.7; }
.closing h2 { font-size: clamp(2.8rem, 5vw, 4.6rem); }
.closing a { display: inline-block; margin-top: 28px; text-decoration: none; font-size: .85rem; }
.closing a span { font-style: italic; }
footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 28px 5vw; background: #151515; color: rgba(255,255,255,.7); font-size: .85rem; }
footer p { margin: 0; }
footer .brand { color: white; }

@media (max-width: 1000px) {
  .trip-strip { flex-wrap: wrap; }
  .route-top { padding: 20px 18px; font-size: .6rem; }
  .route-content { padding: 24px 18px; }
  .section-head, .contact-section { gap: 35px; }
}

@media (max-width: 850px) {
  .site-header { align-items: flex-start; }
  .site-header nav { gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
  .site-header nav a { font-size: .78rem; }
  .section-head, .route-grid, .format-grid, .contact-section { grid-template-columns: 1fr; }
  .route-art { height: 200px; }
  .route-content { padding: 28px; }
  .route-top { padding: 24px 28px; font-size: .72rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .notebook article { grid-template-columns: 50px 1fr; }
  .note-status { grid-column: 2; }
  .route-footnote { flex-direction: column; gap: 8px; }
  footer { flex-wrap: wrap; }
}

@media (max-width: 700px) {
  .site-header { flex-wrap: wrap; align-items: center; padding: 18px 6vw; }
  .menu-toggle:not([hidden]) { display: flex; align-items: center; gap: 12px; border: 1px solid #ffffff80; border-radius: 999px; padding: 9px 13px; background: #15151570; color: white; font-size: .75rem; }
  .site-header nav { width: 100%; justify-content: flex-start; gap: 20px; padding: 18px; background: #151515; border-radius: 3px; }
  body.js-ready .site-header nav { display: none; }
  body.js-ready .site-header nav.is-open { display: flex; }
  .hero-content { padding: 170px 6vw 130px; }
  h1 { font-size: clamp(3.5rem, 11vw, 5.5rem); }
  .hero .eyebrow { max-width: 300px; font-size: .65rem; }
  .hero-copy { font-size: 1.05rem; }
  .hero-bottom { left: 6vw; right: 6vw; flex-direction: column; gap: 10px; }
  .section, .contact-section { padding: 72px 6vw; }
  .about-section { padding: 86px 6vw; }
  .section-head { gap: 24px; margin-bottom: 32px; }
  .trip-strip { padding: 28px 6vw; font-size: .83rem; }
  .trip-date { width: 100%; padding-left: 19px; }
  .trip-strip a span { padding: 0 4px; }
  .notebook article { grid-template-columns: 25px 1fr; gap: 14px; }
  .notebook h3 { font-size: 1.4rem; }
  .closing { padding: 72px 6vw; }
  footer { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Destination photography and arrival countdowns. */
.route-photo { margin: 0; background: var(--paper); color: var(--muted); }
.route-photo img { display: block; width: 100%; height: 260px; object-fit: cover; }
.argentina .route-photo img { object-position: center 70%; }
.route-photo figcaption { padding: 9px 14px; font-size: .58rem; line-height: 1.6; }
.route-photo a { text-underline-offset: 3px; }
.arrival { margin: auto 0 24px; padding-top: 16px; }
.arrival-date { margin: 0 0 14px; font-size: .8rem !important; color: var(--ink) !important; }
.arrival-date time { font-weight: 700; }
.countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; color: var(--ink); font-size: .9rem; }
.countdown > span:only-child { grid-column: 1 / -1; }
.countdown-unit { text-align: center; padding: 12px 2px; border: 1px solid var(--line); border-radius: 3px; }
.countdown-unit strong { display: block; font-size: clamp(1.2rem, 2.2vw, 2rem); font-weight: 500; font-variant-numeric: tabular-nums; }
.countdown-unit small { display: block; margin-top: 5px; font-size: .55rem; text-transform: uppercase; letter-spacing: .04em; }
.route-label { margin-top: 0; }
@media (max-width: 850px) {
  .route-photo img { height: clamp(230px, 50vw, 400px); }
  .countdown-unit strong { font-size: 2rem; }
}


/* Keep the cathedral in frame when the destination card narrows. */
.chile .route-photo img { object-position: 30% center; }

/* Three-line hero headline, with the final word aligned to the right. */
.between-headline { width: 100%; font-size: clamp(2rem, 8.2vw, 9rem); }
.between-headline > span, .between-headline > em { display: block; }
.between-headline > em { text-align: right; }

/* A readable word-plane: the a leads, the n carries the wings, d trails. */
.between-headline { position: relative; }
.between-headline .floating-and {
  position: absolute;
  display: inline-block;
  left: 76%;
  top: 72%;
  font-size: .38em;
  font-style: italic;
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: 1;
  white-space: nowrap;
  isolation: isolate;
  animation: plane-to-here 7s ease-in-out infinite;
  transform-origin: center;
  will-change: transform;
}
.plane-word { position: relative; z-index: 1; color: #fff; text-shadow: 0 1px 3px #000; }
/* Solid aircraft body behind the readable white word. */
.plane-outline {
  position: absolute;
  width: 155%;
  height: 260%;
  left: -28%;
  top: -80%;
  overflow: visible;
  pointer-events: none;
  z-index: 0;
}
.plane-outline path {
  fill: #080808;
  stroke: #080808;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@keyframes plane-to-here {
  0%, 8% { left: 76%; top: 72%; transform: rotate(8deg); opacity: 1; }
  40% { left: 53%; top: 58%; transform: rotate(12deg); opacity: 1; }
  76%, 85% { left: 25%; top: 43%; transform: rotate(0deg); opacity: 1; }
  91% { left: 25%; top: 43%; transform: rotate(0deg); opacity: 0; }
  92% { left: 76%; top: 72%; transform: rotate(8deg); opacity: 0; }
  100% { left: 76%; top: 72%; transform: rotate(8deg); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .between-headline .floating-and {
    animation: none;
    left: 52%;
    top: 58%;
    transform: rotate(0deg);
  }
}

.plane-flame {
  position: absolute;
  left: 119%;
  top: .23em;
  width: .95em;
  height: .55em;
  background: #f02e23;
  clip-path: polygon(0 15%, 55% 0, 44% 27%, 100% 50%, 44% 73%, 55% 100%, 0 85%);
  transform-origin: left center;
  animation: plane-flame .18s ease-in-out infinite alternate;
  z-index: 0;
}
.plane-flame::after {
  content: "";
  position: absolute;
  inset: 25% 35% 25% 0;
  background: #ff9a32;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
@keyframes plane-flame {
  from { transform: scaleX(.8); }
  to { transform: scaleX(1.2); }
}
@media (prefers-reduced-motion: reduce) {
  .plane-flame { animation: none; }
}


/* English / Spanish language toggle */
.language-switcher {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-left: 4px;
  padding: 5px 8px;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 999px;
  font-size: .72rem;
  line-height: 1;
}
.lang-button {
  border: 0;
  padding: 3px 4px;
  background: transparent;
  color: rgba(255,255,255,.62);
  cursor: pointer;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
}
.lang-button:hover,
.lang-button.is-active {
  color: #fff;
}
.lang-button.is-active {
  text-decoration: underline;
  text-underline-offset: 4px;
}
@media (max-width: 700px) {
  .language-switcher {
    width: fit-content;
    margin-left: 0;
  }
}

/* Illustrated route and future photo journal. */
.travel-map-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 36px; align-items: center; }
.travel-map { position: relative; background: #dcedea; border: 1px solid #b5cfca; border-radius: 45% 45% 12px 12px / 8% 8% 12px 12px; }
.travel-map svg { display: block; width: 100%; height: auto; }
.map-pin { position: absolute; left: var(--pin-x); top: var(--pin-y); transform: translate(-50%, -50%); display: grid; justify-items: center; padding: 0; border: 0; background: transparent; cursor: pointer; color: var(--ink); }
.pin-label { margin-top: 5px; padding: 3px 7px; background: var(--paper); border-radius: 4px; font-size: clamp(.6rem, 1.1vw, .8rem); font-weight: 700; white-space: nowrap; box-shadow: 0 2px 4px #15151515; }
.map-pin:hover, .map-pin[aria-pressed="true"] { z-index: 2; }
.map-pin[aria-pressed="true"] .pin-label { background: var(--ink); color: white; }
.map-caption { position: absolute; bottom: 16px; left: 0; width: 100%; text-align: center; font-family: "Playfair Display", Georgia, serif; font-style: italic; font-size: .95rem; color: #59766a; }
.map-journal { padding: 30px; border: 1px solid var(--line); background: var(--cream); box-shadow: 6px 6px 0 #d6cfc440; }
.map-journal h3 { font-family: "Playfair Display", Georgia, serif; font-size: 2rem; }
.map-journal p:not(.eyebrow) { color: var(--muted); font-size: .95rem; line-height: 1.7; }
.postcard-placeholder { margin-top: 24px; padding: 24px; border: 1px dashed #b4a38d; text-align: center; background: var(--paper); }
.postcard-placeholder > span { font-size: 2.5rem; color: var(--orange); }
.postcard-placeholder p { margin: 8px 0 0; }
.map-journal .map-note { margin: 24px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-size: .75rem; font-style: italic; }
@media (max-width: 850px) { .travel-map-layout { grid-template-columns: 1fr; gap: 24px; } }
@media (max-width: 480px) { .map-journal { padding: 22px; } .map-caption { font-size: .75rem; bottom: 8px; } }

/* Geographic world map with anchored flag callouts. */
.travel-map-layout { grid-template-columns: minmax(0, 2.2fr) minmax(250px, 1fr); align-items: start; }
.world-map-wrap { min-width: 0; }
.map-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.map-toolbar .eyebrow { margin: 0; font-size: .65rem; }
.map-reset { border: 1px solid var(--line); border-radius: 999px; padding: 9px 14px; background: var(--paper); color: var(--ink); cursor: pointer; font-size: .75rem; }
.world-map { aspect-ratio: 2 / 1; border-radius: 12px; overflow: hidden; isolation: isolate; }
.world-map-art { display: block; width: 100%; height: 100%; transform-origin: 0 0; }
.map-connectors { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.world-pin { width: 12px; height: 12px; display: block; transform: translate(-50%, -50%); }
.world-pin-badge { position: absolute; left: 50%; top: 50%; display: flex; align-items: center; gap: 5px; width: max-content; padding: 5px 8px; border: 1px solid #b1b99b; border-radius: 6px; background: var(--paper); box-shadow: 2px 3px 0 #59766a20; transform: translate(calc(-50% + var(--label-x)), calc(-50% + var(--label-y))); font-size: .7rem; font-weight: 700; }
.world-pin-badge > span:first-child { font-family: "Apple Color Emoji", "Segoe UI Emoji", sans-serif; font-size: 21px; }
.world-pin[aria-pressed="true"] .world-pin-badge, .world-pin:hover .world-pin-badge { background: var(--ink); color: white; border-color: var(--ink); }
.world-pin:focus-visible { outline: none; }
.world-pin:focus-visible .world-pin-badge { outline: 3px solid var(--orange); outline-offset: 3px; }
.world-map-note { font-size: .8rem; line-height: 1.6; color: var(--muted); }
@media (max-width: 1000px) { .travel-map-layout { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .world-pin-badge { padding: 4px; gap: 3px; font-size: .6rem; } .world-pin-badge > span:first-child { font-size: 18px; } }

/* The globe and GPS share one star-filled frame. */
.globe-panel {
  overflow: hidden;
  border: 1px solid #27313b;
  border-radius: 20px;
  background-color: #05070c;
  background-image:
    radial-gradient(circle, #ffffffba 0 1px, transparent 1.6px),
    radial-gradient(circle, #c7deff80 0 .8px, transparent 1.5px),
    radial-gradient(circle, #ffffff60 0 1.2px, transparent 2px),
    radial-gradient(circle, #ffffff35 0 .7px, transparent 1.3px);
  background-size: 113px 137px, 179px 157px, 251px 223px, 67px 89px;
  background-position: 17px 29px, 83px 11px, 41px 107px, 5px 53px;
}
.world-map {
  width: 86%;
  margin: 10px auto 0;
  aspect-ratio: 1;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.world-map-art { object-fit: contain; }
.world-map .map-connectors { height: 100%; }
.world-pin { min-width: 24px; min-height: 24px; width: 24px; height: 24px; }
.world-pin > .world-pin-dot {
  position: absolute;
  left: 50%; top: 50%;
  display: block;
  width: 28px; height: 32px;
  padding: 0;
  border: 0;
  border-radius: 0;
  transform: translate(-50%, -100%);
  background: none;
  box-shadow: none;
  font-family: "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
  font-size: 26px;
  line-height: 32px;
  text-align: center;
}
.world-pin:hover > .world-pin-dot, .world-pin[aria-pressed="true"] > .world-pin-dot { background: none; }

.world-pin-badge {
  padding: 5px 7px;
  border: 0;
  border-radius: 3px;
  background: #0b1826db;
  color: #fff4db;
  box-shadow: none;
  font-size: clamp(.65rem, 1.1vw, .8rem);
  font-weight: 500;
  letter-spacing: .02em;
}
.world-pin[hidden] { display: none; }
.world-pin:hover .world-pin-badge, .world-pin[aria-pressed="true"] .world-pin-badge { color: #101b25; background: #ffe6a1; }
.map-legend { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 18px; color: var(--muted); font-size: .73rem; }
.map-legend span { display: flex; align-items: center; gap: 8px; }
.map-legend i { width: 12px; height: 12px; border-radius: 50%; }
.legend-visited { background: #e9bc66; border: 2px solid #9d7431; }
.legend-other { background: #526f64; }
@media (max-width: 480px) {
  .map-toolbar { align-items: flex-start; }
  .map-toolbar .eyebrow { max-width: 150px; line-height: 1.6; }
  .map-reset { flex-shrink: 0; }
}


/* The GPS sits inside the frame without covering country or city pins. */
.globe-gps-footer { display: flex; justify-content: flex-end; padding: 18px 24px 24px; }
.location-gps, .legend-gps-device {
  position: relative;
  width: 242px;
  max-width: 100%;
  padding: 12px 13px 9px;
  border: 1px solid #4c5558;
  border-radius: 22px 22px 30px 30px;
  background: linear-gradient(135deg, #343d41, #1a2226);
  box-shadow: inset 0 1px 0 #ffffff24, 0 4px 0 #11191d, 0 8px 16px #12202b1a;
  color: white;
  font-family: "Courier New", monospace;
}
.location-gps::before, .legend-gps-device::before { content: ""; position: absolute; width: 14px; height: 17px; top: -17px; left: 25px; border-radius: 5px 5px 0 0; background: linear-gradient(90deg, #1a2226, #434d51); }
.gps-topline { display: flex; justify-content: space-between; align-items: center; padding: 0 5px 7px; font-size: .55rem; letter-spacing: .15em; color: #d9dfe1; }
.gps-signal { display: flex; align-items: flex-end; gap: 2px; }
.gps-signal i { width: 2px; height: 3px; background: #d9dfe1; }
.gps-signal i:nth-child(2) { height: 5px; }
.gps-signal i:nth-child(3) { height: 7px; }
.gps-screen { overflow: hidden; border: 2px solid #10191d; border-radius: 8px; background: #243d43; box-shadow: inset 0 1px 5px #0005; }
.gps-map { display: block; width: 100%; height: 65px; color: #d4e4e5; }
.gps-readout { margin: 0; padding: 9px 5px; border-top: 1px solid #ffffff18; color: #fff; font-size: .65rem; line-height: 1.4; text-align: center; letter-spacing: 0; }
.gps-readout strong { font-size: inherit; }
.gps-controls { display: flex; justify-content: center; align-items: center; gap: 22px; padding-top: 8px; }
.gps-controls span { width: 15px; height: 4px; border-radius: 4px; background: #10191d; box-shadow: 0 1px 0 #ffffff15; }
.gps-controls i { width: 14px; height: 14px; border: 1px solid #536065; border-radius: 50%; background: #192227; }
@media (max-width: 700px) { .globe-gps-footer { justify-content: center; } }

/* Compact city postcards open above the map. */
.city-popup { width: min(380px, calc(100vw - 32px)); max-height: min(620px, 85dvh); padding: 28px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); color: var(--ink); box-shadow: 0 18px 70px #0005; overflow-y: auto; overscroll-behavior: contain; }
.city-popup::backdrop { background: #07111b70; backdrop-filter: blur(3px); }
.city-popup-close { position: absolute; top: 8px; right: 8px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: transparent; color: var(--muted); font-size: 1.6rem; cursor: pointer; }
.city-popup-close:hover { background: #1515150a; color: var(--ink); }
.city-popup-close:focus-visible, .city-gallery:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }
.city-popup .eyebrow { margin: 0 30px 10px 0; }
.city-popup h3 { padding-right: 15px; font-family: "Playfair Display", Georgia, serif; font-size: 1.8rem; }
.city-facts { padding-left: 18px; margin: 18px 0 10px; font-size: .88rem; line-height: 1.65; color: var(--muted); }
.city-facts li + li { margin-top: 7px; }
.city-fact-source { font-size: .7rem; color: var(--muted); text-underline-offset: 3px; }
.city-gallery-title { margin: 22px 0 10px; font-size: .72rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; }
.city-gallery-empty { padding: 20px 12px; text-align: center; border: 1px dashed #aaa496; border-radius: 5px; background: var(--cream); }
.city-gallery-empty > span { display: block; font-size: 1.8rem; color: var(--orange); }
.city-gallery-empty p { margin: 8px 0; font-size: .9rem; font-family: "Playfair Display", Georgia, serif; }
.city-gallery-empty small { display: block; color: var(--muted); font-size: .73rem; line-height: 1.5; }
.city-gallery { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; }
.city-gallery[hidden], .city-gallery-empty[hidden] { display: none; }
.city-gallery figure { flex: 0 0 90%; margin: 0; scroll-snap-align: start; }
.city-gallery img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 5px; }
.city-gallery figcaption { padding: 7px 0; color: var(--muted); font-size: .75rem; line-height: 1.5; }
@media (max-width: 480px) { .city-popup { padding: 24px 20px; } }


/* TikTok's full-screen For You feed, contained inside its phone. */
.phone .app-ui.tiktok-ui { inset: 0; padding: 0; border-radius: inherit; background: #000; color: white; container-type: inline-size; }
.tiktok-feed-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 52% center; }
.tiktok-ui::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(#0009, transparent 30%, transparent 45%, #000b 86%); pointer-events: none; }
.tiktok-feed-tabs { position: absolute; z-index: 2; top: 34px; left: 8%; right: 8%; display: flex; align-items: center; justify-content: center; gap: 12px; font-size: clamp(9px, 5cqw, 13px); text-shadow: 0 1px 3px #0008; }
.tiktok-feed-tabs > span { color: #ffffffb3; }
.tiktok-feed-tabs strong { position: relative; white-space: nowrap; }
.tiktok-feed-tabs strong::after { content: ""; position: absolute; left: 25%; right: 25%; bottom: -7px; height: 2px; border-radius: 2px; background: white; }
.tiktok-feed-tabs svg { position: absolute; right: 0; width: 13px; height: 13px; fill: none; stroke: white; stroke-width: 2; }
.tiktok-feed-actions { position: absolute; z-index: 2; right: 5%; bottom: 63px; display: flex; flex-direction: column; align-items: center; gap: clamp(5px, 3cqw, 9px); }
.tiktok-profile { position: relative; margin-bottom: 5px; }
.tiktok-profile img { display: block; width: clamp(23px, 13cqw, 32px); aspect-ratio: 1; object-fit: cover; border: 1px solid white; border-radius: 50%; }
.tiktok-profile > span { position: absolute; left: 50%; bottom: -6px; transform: translateX(-50%); display: grid; place-items: center; width: 13px; height: 13px; border-radius: 50%; background: #fe2c55; font-size: 13px; line-height: 1; }
.tiktok-feed-action { display: grid; justify-items: center; gap: 2px; filter: drop-shadow(0 1px 2px #0005); }
.tiktok-feed-action svg { width: clamp(20px, 11cqw, 28px); height: clamp(20px, 11cqw, 28px); fill: white; }
.tiktok-feed-action small { font-size: clamp(7px, 3.6cqw, 9px); font-weight: 600; }
.tiktok-record { display: grid; place-items: center; width: 26px; height: 26px; border: 5px solid #242424; border-radius: 50%; background: #737d73; font-size: 12px; }
.tiktok-feed-caption { position: absolute; z-index: 2; bottom: 66px; left: 7%; right: 25%; text-shadow: 0 1px 3px #0008; font-size: clamp(8px, 4.3cqw, 11px); line-height: 1.5; }
.tiktok-feed-caption > strong { font-size: clamp(9px, 4.8cqw, 12px); }
.tiktok-feed-caption p { margin: 6px 0; }
.tiktok-feed-caption > span { display: block; overflow: hidden; white-space: nowrap; font-size: .9em; }
.tiktok-feed-progress { position: absolute; z-index: 2; bottom: 51px; left: 0; right: 0; height: 2px; background: #ffffff40; }
.tiktok-feed-progress > span { display: block; width: 38%; height: 100%; background: white; }
.tiktok-feed-nav { position: absolute; z-index: 2; bottom: 0; left: 0; right: 0; height: 51px; padding: 7px 6px 15px; display: flex; align-items: center; justify-content: space-around; background: #050505; }
.tiktok-feed-nav > span { display: grid; justify-items: center; gap: 3px; color: #ccc; }
.tiktok-feed-nav > span:first-child { color: white; }
.tiktok-feed-nav svg { width: 15px; height: 15px; fill: currentColor; }
.tiktok-feed-nav small { font-size: clamp(6px, 3cqw, 8px); }
.tiktok-feed-nav .tiktok-create { display: grid; place-items: center; width: 25px; height: 19px; border-radius: 4px; background: white; color: black; box-shadow: -3px 0 #25f4ee, 3px 0 #fe2c55; font-size: 20px; line-height: 1; }
@media (max-width: 700px) { .tiktok-feed-tabs { gap: 9px; top: 29px; left: 6%; right: 6%; } .tiktok-feed-tabs svg { right: -3px; width: 11px; } }

@media (max-width: 700px) {
  .tiktok-feed-actions { gap: 4px; }
  .tiktok-feed-action svg { width: 18px; height: 18px; }
  .tiktok-record { width: 20px; height: 20px; border-width: 4px; font-size: 9px; }
}

/* Full-screen Instagram and YouTube feeds share the same device detail. */
.phone .app-ui.feed-app { inset: 0; padding: 30px 0 48px; border-radius: inherit; background: #fff; color: #101010; container-type: inline-size; font-size: clamp(7px, 4cqw, 10px); }
.feed-app svg { display: block; width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.feed-topbar { height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 0 7px; }
.feed-top-icons { display: flex; align-items: center; gap: 9px; }
.ig-wordmark { font-family: "Brush Script MT", "Segoe Script", cursive; font-weight: 700; font-size: clamp(16px, 9cqw, 24px); letter-spacing: -.05em; }
.ig-stories { display: flex; justify-content: space-around; padding: 6px 5px 8px; border-bottom: 1px solid #e7e7e7; }
.ig-stories > div { width: 23%; text-align: center; }
.ig-stories > div > span { position: relative; display: block; width: 100%; aspect-ratio: 1; padding: 3px; border-radius: 50%; background: linear-gradient(35deg, #ffc600, #ff2755, #bf20c8); }
.ig-stories > div:first-child > span { background: #eee; }
.ig-stories img { width: 100%; height: 100%; object-fit: cover; border: 2px solid white; border-radius: 50%; }
.ig-stories b { position: absolute; right: 0; bottom: 1px; width: 13px; height: 13px; border: 1px solid white; border-radius: 50%; background: #0095f6; color: white; font-size: 12px; line-height: 11px; }
.ig-stories small { display: block; margin-top: 3px; font-size: 3.3cqw; }
.feed-app .feed-avatar { width: 23px; height: 23px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.ig-post-byline { display: flex; align-items: center; gap: 5px; padding: 7px; }
.ig-post-byline > div { flex: 1; }
.ig-post-byline strong, .ig-post-byline small { display: block; font-size: 3.7cqw; line-height: 1.4; }
.ig-post-byline small { font-size: 3.1cqw; }
.ig-post-image { position: relative; aspect-ratio: 1.05; }
.ig-post-image > img { width: 100%; height: 100%; object-fit: cover; }
.ig-post-image > span { position: absolute; right: 7px; top: 7px; padding: 3px 5px; border-radius: 12px; background: #0009; color: white; font-size: 3.4cqw; }
.ig-post-actions { display: flex; align-items: center; gap: 7px; padding: 8px 7px 4px; }
.ig-post-actions > svg:last-child { margin-left: auto; }
.ig-carousel-dots { margin: 0 auto; color: #0095f6; font-size: 5px; white-space: nowrap; }
.ig-carousel-dots i { font-style: normal; color: #ccc; }
.ig-post-copy { padding: 3px 8px; font-size: 3.7cqw; line-height: 1.45; }
.ig-post-copy p { margin: 3px 0; }
.ig-post-copy small { color: #777; font-size: 3.3cqw; }
.feed-bottom-nav { position: absolute; bottom: 0; left: 0; right: 0; height: 45px; padding: 7px 8px 15px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #ececec; background: white; }
.feed-bottom-nav .feed-avatar { width: 18px; height: 18px; }
.youtube-wordmark { display: flex; align-items: center; gap: 3px; font-size: clamp(10px, 6cqw, 16px); font-weight: 700; letter-spacing: -.06em; }
.youtube-wordmark svg { width: 22px; height: 17px; stroke: none; }
.youtube-ui .feed-top-icons { gap: 7px; }
.youtube-ui .feed-top-icons svg { width: 13px; height: 13px; }
.yt-categories { display: flex; gap: 5px; padding: 6px 7px 10px; overflow: hidden; white-space: nowrap; }
.yt-categories > * { padding: 4px 8px; border-radius: 5px; background: #eee; font-size: 3.7cqw; font-weight: 500; }
.yt-categories strong { color: white; background: #171717; }
.yt-feed-thumbnail { position: relative; aspect-ratio: 16 / 9; }
.yt-feed-thumbnail img { width: 100%; height: 100%; object-fit: cover; }
.yt-feed-thumbnail > span { position: absolute; bottom: 5px; right: 5px; padding: 2px 4px; border-radius: 3px; background: #000c; color: white; font-size: 3.5cqw; }
.yt-feed-details { display: flex; gap: 6px; padding: 9px 7px; align-items: flex-start; }
.yt-feed-details > div { flex: 1; }
.yt-feed-details strong { display: block; font-size: 4.5cqw; line-height: 1.35; }
.yt-feed-details small { display: block; margin-top: 4px; font-size: 3.5cqw; line-height: 1.4; color: #666; }
.yt-shorts-heading { display: flex; align-items: center; gap: 5px; padding: 7px; font-size: 5cqw; }
.yt-shorts-heading svg { color: #f03; width: 16px; }
.yt-shorts-heading > span { margin-left: auto; }
.yt-shorts-grid { display: flex; gap: 6px; padding: 0 7px; }
.yt-shorts-grid > div { position: relative; flex: 1; min-width: 0; aspect-ratio: 9 / 13; overflow: hidden; border-radius: 7px; background: #333; }
.yt-shorts-grid img { width: 100%; height: 100%; object-fit: cover; }
.yt-shorts-grid strong { position: absolute; bottom: 0; left: 0; right: 0; padding: 18px 5px 7px; background: linear-gradient(transparent, #000c); color: white; font-size: 3.8cqw; line-height: 1.3; }
.yt-bottom { height: 49px; padding-inline: 5px; gap: 4px; }
.yt-bottom > span { display: grid; justify-items: center; gap: 3px; }
.yt-bottom svg { width: 16px; height: 16px; }
.yt-bottom small { font-size: 2.8cqw; }
.yt-bottom .yt-create { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; background: #eee; font-size: 20px; }
@media (max-width: 700px) {
  .phone .app-ui.feed-app { padding-top: 25px; }
  .feed-topbar { height: 26px; }
  .feed-app svg { width: 14px; height: 14px; }
  .feed-top-icons { gap: 6px; }
  .ig-post-byline { padding-block: 5px; }
  .feed-app .feed-avatar { width: 19px; height: 19px; }
  .ig-post-actions { padding-top: 5px; }
  .yt-feed-details { padding-block: 6px; }
  .yt-shorts-heading { padding-block: 4px; }
}
@media (min-width: 701px) and (max-width: 1100px) {
  .site-header nav { gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
  .site-header nav a { font-size: .78rem; }
}

.social-instagram .phone::after, .social-youtube .phone::after { background: #151515b0; }


/* A quiet coming-soon invitation to learn together. */
.learn-section { display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: 60px; padding: 100px 5vw; border-top: 1px solid var(--line); background: #fff; }
.learn-copy { max-width: 540px; }
.learn-status { display: inline-block; padding: 7px 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--orange); font-size: .68rem; letter-spacing: .06em; }
.learn-copy p { margin: 20px 0 0; color: var(--muted); font-size: 1rem; line-height: 1.8; }
.learn-copy .learn-promise { color: var(--ink); font-family: "Playfair Display", Georgia, serif; font-size: 1.25rem; line-height: 1.6; }
.learn-copy .learn-progress { font-size: .85rem; }
@media (max-width: 850px) { .learn-section { grid-template-columns: 1fr; gap: 30px; } }
@media (max-width: 700px) { .learn-section { padding: 72px 6vw; } }

.learn-intro { min-width: 0; }
.learn-motto { margin: 0 0 28px; font-size: clamp(2rem, 4vw, 4rem); font-weight: 700; line-height: 1.08; letter-spacing: -.04em; text-align: left; }
.learn-motto span { display: block; }
.learn-motto-from { color: #cf2929; }
.learn-motto-to { color: #23763d; }

/* A restrained cross-shaped t in the header wordmark. */
.site-header .brand > .brand-cross { position: relative; display: inline-block; width: .43em; margin-left: .07em; color: transparent; }
.site-header .brand-cross::before, .site-header .brand-cross::after { content: ""; position: absolute; background: #fff; border-radius: .025em; }
.site-header .brand-cross::before { width: .145em; height: .83em; left: 50%; bottom: .31em; transform: translateX(-50%); }
.site-header .brand-cross::after { width: .55em; height: .145em; left: 50%; bottom: .81em; transform: translateX(-50%); }

/* A luminous white cross with a softly breathing gold-blue halo. */
.site-header .brand > .brand-cross { animation: cross-shimmer 3.6s ease-in-out infinite; }
.site-header .brand-cross::before, .site-header .brand-cross::after { box-shadow: 0 0 2px #fff, 0 0 5px #fff7d9b0; }
@keyframes cross-shimmer {
  0%, 100% { filter: drop-shadow(0 2px 2px #0008) drop-shadow(0 0 3px #ffffffc0) drop-shadow(-1px 0 6px #ffe9a68c) drop-shadow(1px 0 10px #b8dcff70); }
  50% { filter: drop-shadow(0 2px 2px #0008) drop-shadow(0 0 4px #fff) drop-shadow(-1px 0 9px #ffe9a6c0) drop-shadow(1px 0 16px #b8dcff9c); }
}
@media (prefers-reduced-motion: reduce) {
  .site-header .brand > .brand-cross { animation: none; filter: drop-shadow(0 2px 2px #0008) drop-shadow(0 0 3px #ffffffc0) drop-shadow(-1px 0 6px #ffe9a68c) drop-shadow(1px 0 10px #b8dcff70); }
}

/* A tiny drifting satellite, with a close-up of its instrument bay. */
.globe-gps-footer { align-items: center; gap: clamp(28px, 6vw, 88px); }
.satellite { flex: 0 0 61px; width: 61px; height: 54px; padding: 0; border: 0; background: transparent; cursor: zoom-in; animation: satellite-drift 6.4s ease-in-out infinite; filter: drop-shadow(0 0 9px #81bcdb44); }
.satellite svg { display: block; width: 100%; }
.satellite:hover { filter: drop-shadow(0 0 9px #ffcc87aa); }
.satellite:focus-visible { outline: 2px solid #ffcc87; outline-offset: 6px; border-radius: 4px; }

.satellite-stats { width: min(690px, calc(100vw - 28px)); max-height: calc(100dvh - 32px); padding: 10px; border: 1px solid #c4b58f; border-radius: 24px; color: #f1e9d7; background: linear-gradient(125deg, #c1b18a, #524d43 25%, #9c9179 50%, #393d3d); box-shadow: 0 30px 120px #000b, inset 0 0 0 4px #222a2c; overscroll-behavior: contain; }
.satellite-stats::backdrop { background: #020710dc; backdrop-filter: blur(9px); }
.satellite-interior { position: relative; padding: clamp(20px, 4vw, 38px); border: 1px solid #ffffff20; border-radius: 16px; background: radial-gradient(circle at 12px 12px, #b1a48a 0 2px, #151b1d 3px 5px, transparent 6px) 0 0 / calc(100% - 24px) calc(100% - 24px), linear-gradient(135deg, #283235, #101719); }
.satellite-close { position: absolute; right: 10px; top: 10px; width: 36px; height: 36px; border: 1px solid #9c917966; border-radius: 50%; background: #151d20; color: #eee3ce; font-size: 25px; cursor: pointer; }
.satellite-kicker { margin: 0 32px 17px 0; color: #c6b48c; font: 10px monospace; letter-spacing: .18em; }
.satellite-stats h2 { font-size: clamp(26px, 5vw, 40px); line-height: 1.1; letter-spacing: -.04em; }
.satellite-subtitle { margin: 12px 0 26px; color: #a6b1ae; font-size: 12px; line-height: 1.5; }
.satellite-readouts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; }
.satellite-readouts > div { display: flex; flex-direction: column; padding: 15px 18px; border: 1px solid #7a8b8033; border-radius: 7px; background: repeating-linear-gradient(0deg, #0000 0 3px, #ffffff02 3px 4px), #080e10; box-shadow: inset 0 2px 8px #0009, 0 1px 0 #ffffff0c; }
.satellite-readouts dt { order: 2; margin-top: 10px; color: #b0b9b3; text-transform: uppercase; font-size: 10px; letter-spacing: .1em; }
.satellite-readouts dd { margin: 0; color: #ffb65e; }
.shot-clock { display: inline-flex; gap: 4px; height: 42px; filter: drop-shadow(0 0 5px #ff9d3640); }
.shot-clock svg { width: 25px; height: 100%; }
.satellite-status { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-top: 24px; color: #8b9b95; font: 8px monospace; letter-spacing: .08em; }
.satellite-status i, .lost-meter-light { display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; background: #b9d99b; box-shadow: 0 0 7px #b9d99b77; }
body:has(.satellite-stats[open]) { overflow: hidden; }
.lost-meter { position: absolute; z-index: 3; right: 5vw; bottom: 8vh; width: min(164px, 2in); padding: 13px 15px; border: 1px solid #e2d5b63d; border-radius: 10px; background: #101c22bf; backdrop-filter: blur(12px); color: #f6dfb9; box-shadow: 0 6px 24px #0002; }
.lost-meter-top { display: flex; align-items: center; justify-content: space-between; font: 9px monospace; letter-spacing: .12em; }
.lost-meter-value { display: flex; align-items: baseline; gap: 5px; margin: 10px 0 5px; color: #ffbd73; }
.lost-meter-value .shot-clock { height: 28px; }
.lost-meter-value .shot-clock svg { width: 17px; }
.lost-meter-value small { font: 14px monospace; }
.lost-meter meter { display: block; width: 100%; height: 5px; margin: 8px 0; border: 0; background: #ffffff20; border-radius: 3px; }
.lost-meter meter::-webkit-meter-bar { background: #ffffff20; border: 0; }
.lost-meter meter::-webkit-meter-optimum-value { background: #ffbd73; }
.lost-meter meter::-moz-meter-bar { background: #ffbd73; }
.lost-meter > small { color: #c4c9c5; font-size: 9px; }
@media (max-width: 700px) { .hero-content { padding-bottom: 240px; } .lost-meter { right: 6vw; bottom: 95px; } .globe-gps-footer { gap: 24px; padding-inline: 16px; } .location-gps { flex-shrink: 1; min-width: 0; } }
@media (prefers-reduced-motion: reduce) { .satellite { animation: none; } }

/* Daily reading: a shallow, two-line instrument strip. */
.lost-meter { height: 42px; padding: 5px 9px; border-radius: 6px; display: grid; grid-template-columns: 1fr auto; grid-template-rows: 13px 12px 2px; gap: 2px 5px; }
.lost-meter-top { font-size: 8px; letter-spacing: .06em; }
.lost-meter-light { display: none; }
.lost-meter-value { grid-column: 2; grid-row: 1 / 3; align-items: center; gap: 2px; margin: 0; }
.lost-meter-value .shot-clock { height: 18px; gap: 1px; }
.lost-meter-value .shot-clock svg { width: 10px; }
.lost-meter-value small { font-size: 9px; }
.lost-meter > small { grid-column: 1; grid-row: 2; font-size: 8px; line-height: 12px; white-space: nowrap; letter-spacing: -.2px; }
.lost-meter meter { grid-column: 1 / -1; grid-row: 3; margin: 0; height: 2px; }
.globe-gps-footer { justify-content: space-between; }
.satellite { flex-basis: 91.5px; width: 91.5px; height: 68.625px; margin-left: clamp(12px, 8vw, 110px); }
/* The camera fills the viewport with the satellite's actual hull and screen. */
.satellite-stats { position: fixed; inset: 0; width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: #05070c; box-shadow: none; overflow: hidden; }
.satellite-stats[open] { display: grid; place-items: center; }
.satellite-stats::backdrop { background: #05070c; backdrop-filter: none; }
.satellite-closeup { position: absolute; pointer-events: none; max-width: none; }
.satellite-interior { width: min(690px, calc(100vw - 40px)); max-height: calc(100dvh - 48px); overflow-y: auto; border: 0; border-radius: 3px; background: #172327; box-shadow: inset 0 0 35px #0005; }
@media (max-width: 700px) { .satellite { margin-left: 0; } .globe-gps-footer { gap: 26px; } .hero-content { padding-bottom: 180px; } }
@media (max-width: 420px), (max-height: 650px) {
  .satellite-interior { padding: 18px; }
  .satellite-readouts { gap: 7px; }
  .satellite-readouts > div { padding: 9px 12px; }
  .satellite-readouts .shot-clock { height: 28px; }
  .satellite-readouts dt { font-size: 8px; margin-top: 6px; }
  .satellite-subtitle { margin-bottom: 14px; }
  .satellite-status { margin-top: 14px; }
}

.learn-platform { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.learn-skool { display: inline-flex; align-items: center; border-radius: 4px; }
.learn-skool img { display: block; width: 88px; height: auto; }
.learn-skool:focus-visible { outline: 2px solid var(--orange); outline-offset: 6px; }
.closing { min-height: 75svh; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 120px 6vw; color: #fff; background: linear-gradient(180deg, #07172040, #07172080 50%, #071720a6), url("assets/patagonia-closing.jpg") center / cover no-repeat; text-shadow: 0 2px 20px #0005; }
.closing > p { color: #fffffff0; }
.closing h2 { max-width: 850px; }
.closing a { color: #fff; }
@media (max-width: 700px) { .closing { min-height: 65svh; padding: 90px 6vw; } }

.social-profile-link { color: inherit; text-decoration: none; cursor: pointer; border-radius: 30px; }
.social-profile-link:focus-visible { outline: 3px solid #ffe3a9; outline-offset: 8px; }
.social-profile-link:hover .phone { box-shadow: 0 0 24px #ffffff24; }
.socials-click-hint { position: absolute; z-index: 20; bottom: 20%; left: 0; right: 0; width: fit-content; max-width: 90%; margin: 0 auto; padding: 7px 12px; border: 1px solid #ffffff40; border-radius: 999px; color: #fff; background: #18232bd9; backdrop-filter: blur(8px); box-shadow: 0 3px 12px #0002; font-size: clamp(9px, 1vw, 12px); letter-spacing: .04em; pointer-events: none; opacity: 0; animation: socials-soft-prompt 7s ease-in-out 7s infinite; }
.socials-click-hint > span { margin-left: 3px; }
@keyframes socials-soft-prompt { 0%, 55%, 100% { opacity: 0; transform: translateY(3px) scale(.98); } 12%, 40% { opacity: .8; transform: translateY(0) scale(1); } 26% { opacity: .55; transform: translateY(0) scale(1.025); } }
.contact-section { position: relative; padding-top: 145px; }
.contact-followers { position: absolute; top: 30px; right: 5vw; display: flex; gap: 12px; }
.contact-followers a { display: flex; align-items: center; gap: 10px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); text-decoration: none; background: #ffffff40; }
.contact-followers a:hover { background: #ffffff90; }
.contact-followers a:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }
.contact-followers svg { width: 23px; height: 23px; flex-shrink: 0; }
.contact-followers strong { display: block; font-size: 17px; line-height: 1.2; }
.contact-followers small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
.follower-arrow { color: var(--muted); font-size: 12px; }
@media (max-width: 700px) { .contact-section { padding-top: 135px; } .contact-followers { right: 6vw; left: 6vw; justify-content: flex-end; gap: 8px; } .contact-followers a { padding: 9px 10px; gap: 7px; } }
@media (prefers-reduced-motion: reduce) { .socials-click-hint { animation: none; opacity: .7; } }

@media (min-width: 701px) and (max-width: 1250px) { .site-header { flex-wrap: wrap; gap: 14px; } .site-header nav { flex-wrap: wrap; gap: 14px; } }

.country-questions { position: absolute; inset: 0; width: 100%; height: 100%; transform-origin: 0 0; pointer-events: none; }
.country-questions text { display: none; }
.js-ready .country-questions text { display: inline; }

.how-we-met-link { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: 100%; margin-top: 20px; padding: 15px 4px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--orange); font-family: "Playfair Display", Georgia, serif; font-size: 1.2rem; cursor: pointer; text-align: left; }
.how-we-met-link:hover { color: var(--ink); }
.how-we-met-link:focus-visible { outline: 2px solid var(--orange); outline-offset: 5px; }
.meeting-story { width: min(720px, calc(100vw - 28px)); max-height: calc(100dvh - 40px); padding: 0; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); color: var(--ink); box-shadow: 0 24px 90px #0006; overflow-y: auto; overscroll-behavior: contain; }
.meeting-story::backdrop { background: #101b20b8; backdrop-filter: blur(6px); }
.meeting-close-form { position: sticky; top: 12px; height: 0; z-index: 2; display: flex; justify-content: flex-end; padding-right: 12px; }
.meeting-close { width: 38px; height: 38px; border: 1px solid #ffffff60; border-radius: 50%; background: #17242cdb; color: white; font-size: 25px; cursor: pointer; }
.meeting-photo { margin: 0; }
.meeting-photo img { display: block; width: 100%; height: auto; max-height: 290px; object-fit: cover; object-position: center top; }
.meeting-photo figcaption { padding: 9px 20px; color: var(--muted); font-size: 9px; line-height: 1.5; border-bottom: 1px solid var(--line); }
.meeting-copy { padding: clamp(24px, 5vw, 44px); }
.meeting-copy h2 { font-size: clamp(2.4rem, 6vw, 3.5rem); }
.meeting-copy > p:not(.eyebrow) { margin: 22px 0 0; color: var(--muted); font-size: 1rem; line-height: 1.8; }
.meeting-copy > p:last-of-type { color: var(--ink); }
.meeting-learn { display: inline-block; margin-top: 24px; color: var(--orange); }
body:has(.meeting-story[open]) { overflow: hidden; }

/* Read the invitation before exploring the globe, at every screen size. */
.discover-section .travel-map-layout { grid-template-columns: minmax(0, 1fr); max-width: 900px; margin-inline: auto; align-items: start; }
.discover-section .map-journal { width: 100%; }

/* A small album of Polaroids; replace placeholder panels with real photos. */
.meeting-album { padding: 42px 28px 20px; background: #e9e4d9; }
.polaroid-stack { position: relative; max-width: 480px; margin: 0 auto; isolation: isolate; }
.polaroid-stack::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #faf8f3; transform: rotate(3deg); box-shadow: 0 3px 12px #30281820; }
.memory-slide { margin: 0; padding: 12px 12px 0; background: #fffefa; box-shadow: 0 5px 22px #30281825; transform: rotate(-2deg); }
.memory-slide[hidden] { display: none; }
.memory-slide > img, .memory-placeholder { display: block; width: 100%; height: auto; max-height: none; aspect-ratio: 4 / 3; object-fit: cover; object-position: center top; }
.memory-placeholder { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 12px; padding: 20px; background: linear-gradient(140deg, #e5e9df, #d5ded8); color: #607269; text-align: center; }
.memory-placeholder > span { font-size: 36px; font-weight: 400; opacity: .6; }
.memory-placeholder strong { font-family: "Playfair Display", Georgia, serif; font-size: clamp(18px, 4vw, 26px); font-weight: 600; }
.memory-placeholder small { font-size: 11px; }
.memory-slide figcaption { display: grid; place-content: center; min-height: 65px; padding: 14px 10px; border: 0; text-align: center; color: #655d51; font-family: "Playfair Display", Georgia, serif; font-size: 15px; line-height: 1.5; }
.memory-slide figcaption a { font-family: "DM Sans", Arial, sans-serif; font-size: 9px; }
.memory-controls { display: flex; justify-content: center; align-items: center; gap: 22px; margin-top: 26px; }
.memory-controls button { width: 40px; height: 40px; border: 1px solid #bfb7a7; border-radius: 50%; background: #fffefa; color: var(--ink); cursor: pointer; }
.memory-controls button:hover { background: #f4eddc; }
.memory-controls button:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; }
.memory-counter { font-size: 11px; color: #655d51; font-variant-numeric: tabular-nums; }

.paper-album { overflow: hidden; padding: 26px 16px 18px; }
.paper-stage { position: relative; display: grid; place-items: center; height: clamp(310px, 64vw, 480px); isolation: isolate; perspective: 900px; }
.paper-card-wrap { position: relative; width: min(340px, 83%); transform: rotate(-2deg); transform-origin: center; }
.paper-card { margin: 0; padding: 11px 11px 0; background: #fffdf6; box-shadow: 0 8px 22px #29231530; }
.memory-launch { position: relative; display: block; width: 100%; padding: 0; border: 0; background: #e0e5da; cursor: pointer; aspect-ratio: 1; }
.memory-image { display: block; width: 100%; height: 100%; object-fit: contain; background: #edf0e9; }
.memory-image[hidden] { display: none; }
.memory-click { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); border: 1px solid #ffffff90; border-radius: 99px; padding: 9px 16px; background: #fffdf4ed; color: #394838; font-size: 13px; white-space: nowrap; box-shadow: 0 2px 10px #0002; }
.memory-click[hidden] { display: none; }
.memory-caption { display: grid; place-items: center; min-height: 60px; padding: 12px 8px; font: 16px/1.5 "Playfair Display", Georgia, serif; color: #655d51; text-align: center; }
.memory-launch.is-placeholder::before { content: attr(data-placeholder); color: #607269; font: italic 22px Georgia, serif; }
.memory-plane { position: absolute; width: 184px; height: 101px; visibility: hidden; filter: drop-shadow(0 4px 2px #25302740); transform-origin: 50% 50%; }
.paper-album .memory-controls { margin-top: 10px; gap: 14px; }
.paper-album .memory-play { width: auto; min-width: 64px; padding-inline: 12px; border-radius: 99px; font-size: 11px; }
.memory-upload { display: block; width: fit-content; margin: 16px auto 0; font-size: 11px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.memory-files { display: block; max-width: 220px; margin-top: 8px; font-size: 10px; }
.memory-upload-note, .memory-credit { display: block; margin: 9px 0 0; text-align: center; font-size: 9px; line-height: 1.5; color: #655d51; }
.memory-launch:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }

/* A scrapbook stage with one continuously folding paper surface. */
.paper-album { background: #f7f1e5; border-bottom: 1px solid #ded5c3; }
.paper-stage { overflow: hidden; }
.album-doodles { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: -1; }
.paper-card { border: 0; border-radius: 1px; box-shadow: 0 2px 3px #50442e12, 0 12px 22px -12px #50442e50; }
.folding-paper { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; filter: drop-shadow(0 6px 4px #50442e20); }
.memory-click { background: #f7d88d; color: #57462e; border: 1px solid #d4b36d; box-shadow: 2px 3px 0 #57462e18; transform: translateX(-50%) rotate(3deg); font-family: Georgia, serif; font-style: italic; }
.paper-album .memory-controls button { border-color: #d4c8b2; background: #fffaf0; box-shadow: 0 2px 0 #d4c8b260; }
.paper-album .memory-controls button:hover { background: #f6dfb3; transform: translateY(-1px); }

/* Four small shakes reveal the existing motto without moving its layout. */
.learn-motto { position: relative; }
.adobo-shaker { position: absolute; left: min(52%, 245px); right: auto; top: -145px; width: 114px; height: 216px; pointer-events: none; opacity: 0; transform: rotate(-135deg); transform-origin: 50% 55%; filter: drop-shadow(0 3px 2px #0002); z-index: 2; }
.seasoning-ready .learn-motto-from, .seasoning-ready .learn-motto-to { opacity: 0; }
.is-seasoning .adobo-shaker { animation: season-shaker 3.15s both; }


.adobo-sprinkle { position: absolute; right: 43px; top: 0; width: 3px; height: 3px; border-radius: 50%; background: #cfb371; box-shadow: -7px 9px #baa16e, -14px 4px #e2c58d, -18px 19px #b5a16f, -4px 22px #dfc792; opacity: 0; pointer-events: none; }
.is-seasoning .adobo-sprinkle { animation: season-grains 4.2s both; }
@keyframes season-shaker {
  0% { opacity: 0; transform: translate(14px,-18px) rotate(-122deg); }
  8% { opacity: 1; transform: translate(0,0) rotate(-135deg); }
  12%, 31%, 50%, 69% { opacity: 1; transform: translate(9px,-10px) rotate(-120deg); animation-timing-function: cubic-bezier(.55,.02,.75,.5); }
  18%, 37%, 57%, 76% { opacity: 1; transform: translate(-19px,22px) rotate(-155deg); animation-timing-function: cubic-bezier(.12,.6,.3,1); }
  23%, 42%, 62%, 81% { opacity: 1; transform: translate(8px,-8px) rotate(-123deg); animation-timing-function: cubic-bezier(.25,.1,.25,1); }
  27%, 46%, 66%, 85% { opacity: 1; transform: translate(-3px,4px) rotate(-140deg); }
  90% { opacity: 1; transform: translate(0,0) rotate(-135deg); }
  100% { opacity: 0; transform: translate(14px,-20px) rotate(-122deg); }
}
@keyframes season-words { from { opacity: 0; transform: translate(12px,-14px); } to { opacity: 1; transform: translate(0,0); } }
@keyframes season-grains { 0%, 55%, 74% { opacity: 0; transform: translate(0,0); } 58%, 77% { opacity: .8; } 69%, 88%, 100% { opacity: 0; transform: translate(-20px,35px); } }
@media (prefers-reduced-motion: reduce) { .adobo-shaker, .adobo-sprinkle { display: none; } .seasoning-ready .learn-motto-from, .seasoning-ready .learn-motto-to { opacity: 1; animation: none; } }

.seasoning-dust { position: absolute; pointer-events: none; z-index: 3; }
.adobo-sprinkle { display: none; }
@media (max-width: 480px) { .adobo-shaker { left: 50%; width: 96px; height: 182px; top: -125px; } }

.meeting-soundtrack { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line); }
.meeting-soundtrack .soundtrack-title { margin: 0 0 12px; font-size: .9rem; }
#meeting-music { width: min(100%, 360px); }
#meeting-music iframe { display: block; width: 100%; height: 203px; border: 0; border-radius: 8px; }
.soundtrack-fallback { display: inline-block; margin-top: 9px; font-size: .75rem; color: var(--muted); }

.meeting-music-start { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 10px 20px; background: #f7f1e5; }
.meeting-music-action { border: 1px solid var(--line); border-radius: 99px; padding: 7px 12px; background: var(--paper); color: var(--ink); font-size: 12px; cursor: pointer; }
.meeting-music-action[hidden] { display: none; }
.meeting-music-notice { font-size: 11px; color: var(--muted); }
.meeting-music-start:has(.meeting-music-action[hidden]):has(.meeting-music-notice:empty) { display: none; }

/* The GPS opens by magnifying its own screen into a world tracker. */
.gps-lost { padding: 3px 2px; border: 0; background: transparent; color: #ff7770; font: inherit; font-weight: 800; cursor: zoom-in; text-decoration: underline; text-underline-offset: 3px; }
.gps-lost:hover { color: #ffaaa5; }
.gps-lost:focus-visible { outline: 2px solid #ffaaa5; outline-offset: 3px; border-radius: 2px; }
.gps-tracker { position: fixed; inset: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 20px; border: 0; background: #0b1419; overflow: auto; color: #243d43; }
.gps-tracker[open] { display: grid; place-items: center; }
.gps-tracker::backdrop { background: #0b1419; }
body:has(.gps-tracker[open]) { overflow: hidden; }
.gps-expanded-device { width: min(1100px, 100%); padding: clamp(14px, 3vw, 32px); border: 1px solid #536065; border-radius: 36px; background: linear-gradient(135deg, #343d41, #1a2226); box-shadow: inset 0 2px 0 #ffffff24, 0 18px 70px #0006; }
.gps-expanded-top { display: flex; justify-content: space-between; gap: 15px; padding: 0 8px 14px; color: #c4d3d4; font: 10px monospace; letter-spacing: .12em; }
.gps-expanded-screen { position: relative; overflow: hidden; border: 3px solid #10191d; border-radius: 16px; background: #dcedea; box-shadow: inset 0 0 30px #243d4312; }
.gps-map-heading { padding: clamp(20px, 3vw, 34px); }
.gps-map-heading p { margin: 0 45px 10px 0; font: 10px monospace; letter-spacing: .15em; }
.gps-map-heading h2 { margin: 0; font-size: clamp(23px, 4vw, 42px); letter-spacing: -.04em; }
.gps-map-close { position: absolute; z-index: 2; top: 14px; right: 14px; width: 36px; height: 36px; border: 1px solid #243d4333; border-radius: 50%; background: #ffffff80; color: #243d43; font-size: 25px; cursor: pointer; }
.gps-world { position: relative; margin: 20px 12px 0; }
.gps-world > img { display: block; width: 100%; height: auto; }
.gps-travelers { position: absolute; left: 29.442%; top: 27.382%; width: clamp(60px, 9vw, 100px); transform: translate(-50%, -95%); }
.gps-travelers svg { display: block; width: 100%; overflow: visible; }
.gps-speech { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); white-space: nowrap; border: 1.5px solid #243d43; border-radius: 14px; padding: 8px 12px; background: #fffdf5; color: #ba3834; font: 700 clamp(11px, 1.4vw, 15px)/1.2 monospace; box-shadow: 2px 3px 0 #243d4314; }
.gps-speech::after { content: ''; position: absolute; width: 8px; height: 8px; left: calc(50% - 4px); bottom: -5px; transform: rotate(45deg); border-right: 1.5px solid #243d43; border-bottom: 1.5px solid #243d43; background: #fffdf5; }
.gps-map-status { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 16px 22px; border-top: 1px solid #243d431a; font: 10px monospace; letter-spacing: .07em; }
.gps-map-status i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: #cf433d; }
.gps-expanded-controls { display: flex; align-items: center; justify-content: center; gap: 38px; padding-top: 16px; }
.gps-expanded-controls span { width: 30px; height: 6px; border-radius: 4px; background: #10191d; }
.gps-expanded-controls i { width: 24px; height: 24px; border: 1px solid #536065; border-radius: 50%; background: #192227; }
@media(max-width: 600px) { .gps-tracker { padding: 10px; } .gps-expanded-device { border-radius: 24px; padding: 12px; } .gps-expanded-top { font-size: 8px; letter-spacing: 0; } .gps-world { margin-top: 55px; } .gps-map-status { font-size: 9px; padding: 14px; } }

/* Our old Windstar, parked beside the soundtrack. */
.soundtrack-media { display: flex; align-items: center; gap: 16px; }
.soundtrack-media #meeting-music { flex: 1 1 360px; min-width: 0; }
.memory-van { position: relative; flex: 0 1 220px; min-width: 135px; padding: 22px 0 8px; border: 0; background: none; color: var(--ink); cursor: zoom-in; }
.memory-van img { display: block; width: 100%; height: auto; transition: transform .25s ease; }
.memory-van:hover img { transform: rotate(-3deg) translateY(-3px); }
.memory-van:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; border-radius: 14px; }
.van-click { display: inline-block; padding: 5px 12px; border: 1px solid #263b56; border-radius: 13px 13px 13px 2px; background: #fffdf5; color: #263b56; font: 700 13px Georgia, serif; transform: rotate(-7deg); }
.van-caption { display: block; margin-top: 3px; font: italic 12px Georgia, serif; color: var(--muted); }
.van-cinema { position: fixed; inset: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: #0b101a; color: #fff8e7; overflow: auto; }
.van-cinema::backdrop { background: #0b101af2; }
body:has(.van-cinema[open]) { overflow: hidden; }
.van-cabin { position: relative; isolation: isolate; width: 100%; min-height: max(650px, 100dvh); overflow: hidden; background: radial-gradient(ellipse at 50% 38%, #67767a, #222c36 65%, #0d131d); }
.van-cabin::after { content: ''; pointer-events: none; position: absolute; z-index: 5; inset: 0; box-shadow: inset 0 0 110px 25px #05080da6; }
.van-cinema-heading { position: relative; z-index: 6; padding: 32px 70px 0 5vw; text-shadow: 0 2px 12px #000; }
.van-cinema-heading p { margin: 0 0 8px; font: 10px monospace; letter-spacing: .24em; color: #c7c8be; }
.van-cinema-heading h2 { margin: 0; font: 400 clamp(25px, 4vw, 44px)/1.15 Georgia, serif; }
.van-close { position: absolute; top: 24px; right: 24px; z-index: 8; width: 42px; height: 42px; border: 1px solid #ffffff50; border-radius: 50%; background: #121a24b3; color: #fff8e7; font-size: 27px; cursor: pointer; }
.van-windshield { position: absolute; top: 17%; left: 16%; width: 68%; height: 40%; overflow: hidden; border: 20px solid #202a35; border-radius: 45% 45% 15% 15% / 30% 30% 15% 15%; background: linear-gradient(#9eafb3, #d9d4ba 62%, #698171 63%, #344e44); }
.van-road { position: absolute; inset: 62% 0 0; background: #737873; clip-path: polygon(47% 0, 53% 0, 82% 100%, 18% 100%); }
.van-road::after { content: ''; position: absolute; inset: 10% 49% 0; background: #eadb9f; transform: perspective(100px) rotateX(40deg); }
.van-roof { position: absolute; inset: 0 0 auto; height: 22%; border-radius: 0 0 40% 40%; background: linear-gradient(#1b222b, #5f6265); box-shadow: 0 14px 35px #0007; }
.van-roof span { position: absolute; left: 47%; bottom: 25%; width: 6%; height: 14px; border-radius: 5px; border: 4px solid #353c43; background: #d0cbb7; }
.van-dashboard { position: absolute; top: 49%; left: 18%; width: 64%; height: 20%; border-radius: 40% 40% 0 0; background: linear-gradient(#39454c, #141e28); }
.van-steering { position: absolute; top: -20%; left: 10%; width: 130px; height: 130px; border: 14px solid #17202a; border-radius: 50%; }
.van-radio { position: absolute; left: 43%; top: 20%; padding: 8px; border: 8px solid #121a20; border-radius: 6px; background: #264641; color: #a0c5a2; font: 10px monospace; }
.van-front-seats { position: relative; z-index: 3; display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(20px, 5vw, 85px); width: min(1150px, 92%); margin: clamp(50px, 9vh, 110px) auto 0; align-items: start; }
.van-seat { min-width: 0; position: relative; }
.van-headrest { position: relative; width: 94%; margin: auto; padding: 22px; border: 2px solid #858a88; border-radius: 45px; background: repeating-linear-gradient(92deg, #ffffff03 0 1px, transparent 1px 4px), linear-gradient(115deg, #777c7a, #424d52 50%, #29353e); box-shadow: inset 0 0 0 8px #ffffff05, 8px 15px 30px #0006; }
.van-headrest::after { content: ''; position: absolute; bottom: -33px; left: 22%; width: 56%; height: 32px; border-left: 9px solid #acb1ad; border-right: 9px solid #acb1ad; z-index: -1; }
.van-driver-seat { padding-top: 20px; }
.van-driver-seat .van-headrest { height: clamp(145px, 20vw, 235px); }
.van-seat-back { position: relative; margin-top: 30px; height: 340px; border: 2px solid #6a7272; border-radius: 65px 65px 15px 15px; background: repeating-linear-gradient(88deg, #ffffff03 0 1px, transparent 1px 4px), linear-gradient(105deg, #657070, #3e4c53 65%, #293742); box-shadow: inset 12px 0 25px #ffffff09, 10px 12px 35px #0008; }
.van-seat-back::before { content: ''; position: absolute; inset: 25px 10% 0; border: 1px solid #afbab32b; border-bottom: 0; border-radius: 40px 40px 0 0; }
.van-seat-pocket { position: absolute; top: 100px; left: 17%; width: 66%; height: 120px; border: 2px solid #273943; border-top: 5px solid #22323b; border-radius: 0 0 30px 30px; background: #394b5470; box-shadow: 0 -4px 8px #0003; }
.van-seat-pocket span { display: block; margin: 25px 8px; text-align: center; color: #b7c2be; font: italic 15px/1.6 Georgia, serif; transform: rotate(-5deg); }
.van-tv { padding: 10px 10px 0; border: 2px solid #707675; border-radius: 14px; background: linear-gradient(135deg, #1c252d, #080f16); box-shadow: 0 4px 10px #0008; }
.van-tv-display { aspect-ratio: 16/9; position: relative; overflow: hidden; border: 2px solid #000; border-radius: 5px; background: #09151d; }
.van-video-placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; background: repeating-linear-gradient(0deg, #ffffff03 0 1px, transparent 1px 4px), radial-gradient(ellipse, #254854, #0c1b26); text-align: center; }
.van-tv-play { font-size: clamp(24px, 4vw, 50px); line-height: 1; color: #d7dbbb; }
.van-video-placeholder p { margin: 10px 5px 6px; font: 400 clamp(15px, 2vw, 26px) Georgia, serif; }
.van-video-placeholder > span:last-child { color: #a0b6ba; font: 10px monospace; }
.van-tv-bezel { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 24px; color: #879296; font: 6px monospace; letter-spacing: .12em; }
.van-tv-bezel i { width: 4px; height: 4px; border-radius: 50%; background: #b6d0a1; box-shadow: 0 0 5px #b6d0a1; }
.van-video { width: 100%; height: 100%; object-fit: contain; }
.van-video[hidden], .van-video-placeholder[hidden], .van-video-controls[hidden] { display: none; }
.van-video-controls { position: relative; z-index: 7; display: flex; justify-content: center; align-items: center; gap: 20px; margin: 0 auto; padding: 15px; }
.van-video-controls button { width: 40px; height: 36px; border: 1px solid #80918f; border-radius: 8px; background: #1b2a34; color: white; cursor: pointer; }
.van-video-title { font: 12px monospace; }
.van-backseat-note { position: relative; z-index: 6; margin: 20px; padding-bottom: 22px; text-align: center; color: #c0c6bf; font: italic 14px Georgia, serif; }
.van-zoom-shell { position: fixed; z-index: 10; pointer-events: none; transform-origin: 64% 48%; }
@media(max-width: 650px) {
 .soundtrack-media { gap: 8px; } .memory-van { min-width: 110px; flex-basis: 150px; } .van-caption { font-size: 10px; }
 .van-front-seats { grid-template-columns: .8fr 1.2fr; gap: 12px; width: 94%; margin: 80px auto 0; }
 .van-passenger-seat .van-headrest { padding: 13px; border-radius: 25px; } .van-driver-seat .van-headrest { width: 94%; height: 130px; }
 .van-seat-back { height: 280px; } .van-tv-play { font-size: 32px; } .van-cinema-heading { padding-top: 28px; }
 .van-cabin { min-height: 100dvh; } .van-tv-bezel { font-size: 5px; }
}
@media(prefers-reduced-motion: reduce) { .memory-van img { transition: none; } }

.van-static { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; background: #888; image-rendering: pixelated; pointer-events: none; }
.van-static[hidden] { display: none; }

/* On-air signature inside the headrest TV screen. */
.van-tv-display { container-type: inline-size; }
.van-tv-brand { position: absolute; z-index: 4; right: 3%; bottom: 5%; color: #fff; font-family: Arial, Helvetica, sans-serif; font-size: clamp(10px, 4.3cqw, 22px); font-weight: 900; line-height: 1; letter-spacing: -.045em; white-space: nowrap; text-shadow: 0 1px 4px #000c; pointer-events: none; }
.van-tv-brand > span { color: #ed403c; }

.services button { color: inherit; font-family: inherit; cursor: pointer; transition: background .2s, border-color .2s; }
.services button:hover { background: #fff; border-color: var(--orange); }
.services button:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; }
.service-dialog { width: min(850px, calc(100vw - 28px)); max-height: calc(100dvh - 40px); padding: clamp(24px, 5vw, 48px); border: 1px solid var(--line); border-radius: 18px; background: var(--paper); color: var(--ink); }
.service-dialog::backdrop { background: #101b20b8; backdrop-filter: blur(6px); }
.service-close { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: inherit; font-size: 24px; cursor: pointer; }
.service-dialog h2 { margin: 14px 20px 20px 0; font-size: clamp(26px, 4vw, 42px); }
.service-body { font-size: 15px; line-height: 1.75; }
.service-body p { margin: 0 0 18px; }
.service-body ul { padding-left: 20px; margin-bottom: 22px; }
.service-body a { color: var(--orange); }
.service-intro { font-size: 18px; }
.service-tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 24px 0; }
.service-tiers article { border: 1px solid var(--line); border-radius: 12px; padding: 20px 14px; background: #fff8; }
.service-tiers h3 { font: 24px Georgia, serif; margin: 0 0 18px; }
.service-tiers article:nth-child(2) { background: #e8c78020; }
.service-tiers article:nth-child(3) { background: #a9c8cb25; }
.service-tiers li { font-size: 13px; }
body:has(.service-dialog[open]) { overflow: hidden; }
@media(max-width: 600px) { .service-tiers { grid-template-columns: 1fr; } }

.perspective-heading { position: relative; isolation: isolate; }
.perspective-lens { position: absolute; z-index: 3; width: 100px; height: 100px; border: 5px solid #080808; border-radius: 50%; background: #fff8; box-shadow: inset 0 0 0 2px #242424, 3px 5px 12px #243d4326; pointer-events: none; transform-origin: center; }
.perspective-lens::after { content: ''; position: absolute; top: 88%; left: 11%; width: 12px; height: 56px; border-radius: 6px; background: #080808; transform: rotate(15deg); transform-origin: top; }
.perspective-glass { position: absolute; inset: 0; overflow: hidden; border-radius: 50%; background: #faf7ef; }
.perspective-glass::after { content: ''; position: absolute; inset: 0; border-radius: 50%; background: linear-gradient(125deg, #fff7, transparent 38%, #a8cfdd18); box-shadow: inset 0 0 12px #83a6b040; }
.perspective-copy { position: absolute; margin: 0 !important; max-width: none !important; pointer-events: none; }

.gps-live { display: inline-flex; align-items: center; gap: 5px; padding: 3px 7px; border: 1px solid #ffffff35; border-radius: 5px; color: white; font: 700 9px monospace; letter-spacing: .08em; }
.gps-live i { width: 6px; height: 6px; border-radius: 50%; background: #ff4747; animation: gps-record 1.4s ease-in-out infinite; }
@keyframes gps-record { 50% { opacity: .25; } }
.gps-lost { animation: gps-invitation 2s ease-in-out infinite; }
@keyframes gps-invitation { 50% { color: #ffb0a5; text-shadow: 0 0 9px #ff413f; } }
@keyframes satellite-drift {
  0%,100% { transform: translate(-10px, 5px) rotate(-12deg); }
  9% { transform: translate(4px, -20px) rotate(7deg); }
  23% { transform: translate(29px, -6px) rotate(22deg); }
  31% { transform: translate(17px, 12px) rotate(-3deg); }
  49% { transform: translate(-18px, -28px) rotate(-24deg); }
  58% { transform: translate(-25px, -9px) rotate(-7deg); }
  73% { transform: translate(20px, -23px) rotate(16deg); }
  84% { transform: translate(9px, 9px) rotate(-9deg); }
  93% { transform: translate(-5px, -8px) rotate(5deg); }
}
.globe-gps-footer { position: relative; }
.satellite-cue { position: absolute; left: calc(clamp(12px, 8vw, 110px) + 108px); bottom: 30px; color: #fff; font-size: 21px; pointer-events: none; opacity: 0; animation: satellite-point 5s infinite; }
@keyframes satellite-point { 0%,78%,100% { opacity: 0; transform: translate(5px,5px); } 82%,96% { opacity: 1; transform: translate(0,0); } }
.gps-poll { width: min(310px, calc(100% - 32px)); margin: 12px 16px 18px; padding: 16px; border: 2px solid #fff7; border-radius: 17px; background: linear-gradient(125deg,#ffe29c,#ffc8aa 60%,#e5c7ee); box-shadow: 3px 5px 0 #243d4315; }
.gps-poll > p:first-child { margin: 0 0 12px; font: 700 18px Georgia,serif; color: #303c50; }
.gps-poll-options { display: flex; gap: 9px; }
.gps-poll-options button { flex: 1; display: flex; justify-content: space-between; padding: 11px; border: 2px solid transparent; border-radius: 10px; background: #c84854; color: white; font: 700 12px sans-serif; cursor: pointer; }
.gps-poll-options button:last-child { background: #416ab3; }
.gps-poll-options button[aria-pressed="true"] { border-color: #fff; box-shadow: 0 0 0 2px #343c56; }
.gps-poll-status { margin: 10px 0 0; font: 10px/1.4 monospace; color: #38425b; }
.closing { position: relative; }
.mountain-friend { position: absolute; width: 1.15cm; height: 1.5cm; filter: drop-shadow(0 2px 2px #0008); }
.mountain-friend svg { width: 100%; height: 100%; }
.mountain-paraglider { left: 18%; top: 23%; }
.mountain-friend .paraglider-canopy { position: absolute; width: 90px; height: 70px; max-width: none; left: 50%; bottom: calc(100% - 12px); transform: translateX(-50%); }
.mountain-paraglider > span { bottom: calc(100% + 66px); }
.mountain-sitter { right: 15%; top: 76%; }
.mountain-friend > span { position: absolute; bottom: calc(100% + 2px); left: calc(50% + 23px); transform: translateX(-50%); display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 78px; height: 50px; padding: 5px 10px 17px; border: 0; border-radius: 0; background: url("assets/cartoon-speech-bubble.svg") center / 100% 100% no-repeat; color: #111; text-shadow: none; font: 9px/1.15 "Comic Sans MS", "Chalkboard SE", sans-serif; }
@media(max-width:700px) { .satellite-cue { left: 91px; } .mountain-paraglider { left: 17%; top: 27%; } .mountain-sitter { right: 12%; top: 76%; } }
@media(prefers-reduced-motion:reduce) { .gps-live i,.gps-lost,.satellite,.satellite-cue { animation: none; } }

.mountain-friend.mountain-paraglider > span { bottom: calc(100% + 66px); }

/* Tiny smiling travelers; the paraglider stays in the upper-left sky. */
.mountain-friend { width: .65cm; height: .85cm; }
.mountain-paraglider { left: 7%; top: 20%; }
.mountain-friend .paraglider-canopy { width: 54px; height: 42px; bottom: calc(100% - 7px); }
.mountain-friend.mountain-paraglider > span { left: calc(100% - 4px); bottom: 35%; transform: none; width: 78px; }
@media(max-width:700px) { .mountain-paraglider { left: 8%; top: 18%; } }

.city-synopsis { margin: 12px 0 18px; font: italic 18px/1.5 Georgia, serif; color: var(--muted); }
.city-quick-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.city-quick-facts > div { padding: 14px; background: #e9eee8; border-radius: 10px; }
.city-quick-facts dt { font-size: 10px; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 7px; color: var(--muted); }
.city-quick-facts dd { margin: 0; font-size: 16px; font-weight: 600; }
.city-quick-facts a { color: inherit; text-decoration-color: #9aac9f; text-underline-offset: 3px; }
.city-quick-facts small { display: block; margin-top: 5px; font-size: 10px; line-height: 1.5; font-weight: 400; color: var(--muted); }
.city-highlights { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; margin: 16px 0; }
.city-highlights li { padding: 6px 10px; border-radius: 20px; background: #f1d6b5; color: #694728; font-size: 12px; }
.city-overview { font-size: 14px; line-height: 1.75; margin-bottom: 16px; }
@media(max-width: 420px) { .city-quick-facts { grid-template-columns: 1fr; } }

.city-quick-facts .city-weather { background: linear-gradient(135deg, #e2edf5, #f4e6c8); }
.city-weather-value { display: block; font-size: 20px; }
.city-weather-condition { min-height: 1.5em; }
.city-overview { max-width: 60ch; line-height: 1.85; }
@media(max-width: 540px) { .city-quick-facts { grid-template-columns: 1fr 1fr; } .city-weather { grid-column: 1 / -1; } }

/* Editorial creator studio with the same Instagram device as the socials page. */
.service-dialog-ugc { width: min(1040px, calc(100vw - 28px)); background: #f4f2ec; padding: clamp(24px, 4vw, 42px); }
.service-dialog-ugc > h2 { font-size: clamp(23px, 3vw, 34px); margin-bottom: 24px; }
.ugc-showcase { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 52px); align-items: center; }
.ugc-device-stage { position: relative; display: flex; flex-direction: column; align-items: center; padding: 24px 20px; border-radius: 22px; overflow: hidden; background: radial-gradient(ellipse at 60% 35%, #b9cbd0, #678690 60%, #314d5a); }
.ugc-stage-label { color: #e6edeb; font: 9px monospace; letter-spacing: .18em; margin-bottom: 25px; }
.ugc-phone-wrap { width: min(235px, 83%); container-type: inline-size; }
.ugc-phone { --phone-roll: -5deg; --phone-tilt: -8deg; }
.ugc-phone .ig-post-image { flex: 1; min-height: 0; aspect-ratio: auto; }
.ugc-phone .ig-post-image > img { height: 100%; object-fit: cover; }
.ugc-phone .ig-post-byline { padding-top: 16px; }
.ugc-phone .ig-post-copy p { font-size: 10px; line-height: 1.5; margin: 5px 0; }
.ugc-phone .ig-post-copy { padding-bottom: 10px; }
.ugc-brand-avatar { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #183e58; color: white; font: 19px Georgia, serif; flex-shrink: 0; }
.ugc-concept-note { margin-top: 25px; font: 9px/1.5 sans-serif; color: #f2f4f1; text-align: center; }
.ugc-kicker { font: 9px monospace; letter-spacing: .16em; color: #886c49; }
.ugc-editorial h3 { font: 400 clamp(32px, 4vw, 49px)/1.06 Georgia, serif; letter-spacing: -.045em; margin: 15px 0 20px; }
.ugc-editorial > p { color: #596267; font-size: 14px; line-height: 1.8; }
.ugc-deliverables { margin: 25px 0; border-top: 1px solid #cbd0ca; }
.ugc-deliverables > div { display: flex; gap: 16px; padding: 18px 0; border-bottom: 1px solid #cbd0ca; }
.ugc-deliverables b { color: #956e42; font: 12px monospace; padding-top: 4px; }
.ugc-deliverables strong { display: block; font-size: 16px; }
.ugc-deliverables small { display: block; margin-top: 3px; color: #667076; font-size: 12px; line-height: 1.5; }
.ugc-editorial .ugc-footnote { font-size: 12px; }
.service-dialog-ugc .service-inquiry { margin-top: 26px; }
.services button { position: relative; min-height: 85px; justify-content: flex-start; padding: 20px 30px 20px 18px; text-align: left; background: #ffffff70; border-radius: 12px; box-shadow: 0 3px 12px #16283305; }
.services button::after { content: ''; position: absolute; right: 12px; top: 12px; width: 16px; height: 16px; background: var(--orange); -webkit-mask: url('assets/directory-plane.svg') center/contain no-repeat; mask: url('assets/directory-plane.svg') center/contain no-repeat; pointer-events: none; }
.services button:hover { transform: translateY(-2px); box-shadow: 0 8px 20px #16283310; }
@media(max-width: 650px) { .ugc-showcase { grid-template-columns: 1fr; } .ugc-device-stage { padding: 22px; } .ugc-phone-wrap { width: 210px; } }
.ugc-phone .app-ui.feed-app { display: flex; flex-direction: column; }
.ugc-phone .feed-topbar, .ugc-phone .ig-post-byline, .ugc-phone .ig-post-actions, .ugc-phone .ig-post-copy { flex-shrink: 0; }

/* Five distinct campaign presentations, sharing the creator studio system. */
.studio-visual { position: relative; min-width: 0; min-height: 490px; border-radius: 22px; overflow: hidden; }
.studio-overline { position: relative; z-index: 2; display: block; font: 9px/1.5 monospace; letter-spacing: .16em; }
.destination-visual { display: flex; flex-direction: column; justify-content: space-between; padding: 28px; color: white; background: #1b424b; }
.destination-visual > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.destination-visual::after { content: ''; position: absolute; inset: 0; background: linear-gradient(#061c3866, transparent 40%, #061c38aa); }
.destination-ticket { position: relative; z-index: 2; margin-top: 160px; padding: 22px; border-radius: 12px; background: #fff8e8f2; color: #213f45; box-shadow: 0 10px 30px #0003; transform: rotate(-3deg); }
.destination-ticket > span { font: 9px monospace; letter-spacing: .13em; }
.destination-ticket h4 { margin: 17px 0 22px; font: 30px/1.1 Georgia, serif; letter-spacing: -.04em; }
.destination-route { display: flex; align-items: center; gap: 8px; font: 9px monospace; }
.destination-route i { flex: 1; border-top: 1px dashed #8a9d90; }
.destination-ticket > p { margin: 18px 0 0; padding-top: 14px; border-top: 1px dashed #a2aba3; font: 8px monospace; letter-spacing: .07em; }
.partnership-visual { padding: 30px; background: radial-gradient(ellipse at 85% 5%, #566b60, #1a3538 50%, #10262d); color: #f9f5e6; }
.partnership-visual .studio-overline { color: #c8d6bb; }
.partner-orbit { display: flex; align-items: center; justify-content: center; margin: 34px 0; }
.partner-orbit > span { display: grid; place-items: center; width: 105px; height: 105px; border: 1px solid #b7c7a8; border-radius: 50%; text-align: center; font: 12px/1.4 monospace; background: #d6dfc70a; }
.partner-orbit b { margin: 0 -3px; z-index: 1; font-size: 22px; color: #ebbf80; }
.partnership-visual h4 { margin: 0 0 28px; font: 32px/1.15 Georgia, serif; letter-spacing: -.035em; }
.partnership-timeline { border-left: 1px solid #9cad9870; margin-left: 8px; padding-left: 20px; }
.partnership-timeline > div { display: flex; align-items: baseline; gap: 15px; margin: 0 0 20px; font: 11px monospace; }
.partnership-timeline b { color: #ebbf80; }
.partnership-timeline small { display: block; margin-top: 5px; color: #a7bfba; font: 11px sans-serif; }
.partner-signature { display: block; margin-top: 26px; color: #a7bfba; font: 8px monospace; letter-spacing: .15em; }
.social-feature-stage { background: radial-gradient(ellipse at 30% 25%, #dca087, #a96a7f 55%, #513959); }
.social-format-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 25px; }
.social-format-pills span { padding: 5px 8px; border: 1px solid #fff6; border-radius: 20px; color: white; font: 8px monospace; letter-spacing: .04em; }
.social-feature-stage .ugc-concept-note { margin-top: 12px; }
.photography-visual { padding: 25px; background: #e8e1d3; color: #383f3b; }
.photo-contact-sheet { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 25px 0; }
.photo-contact-sheet figure { margin: 0; padding: 7px; background: #fffdf5; box-shadow: 0 6px 14px #28353220; }
.photo-contact-sheet figure:first-child { grid-column: 1 / -1; transform: rotate(-3deg); }
.photo-contact-sheet figure:nth-child(2) { transform: rotate(3deg); }
.photo-contact-sheet figure:nth-child(3) { transform: rotate(-2deg); }
.photo-contact-sheet img { width: 100%; height: 130px; object-fit: cover; display: block; }
.photo-contact-sheet figure:first-child img { height: 175px; }
.photo-contact-sheet figcaption { padding: 10px 2px 3px; font: 8px monospace; letter-spacing: .08em; }
.photo-delivery { display: flex; align-items: center; gap: 18px; }
.photo-delivery > b { font: 64px/.9 Georgia, serif; letter-spacing: -.06em; }
.photo-delivery > span { font: 9px monospace; letter-spacing: .08em; }
.photo-delivery small { display: block; margin-top: 8px; font: 12px Georgia, serif; letter-spacing: 0; }
.photo-reference-note { display: block; margin-top: 18px; color: #6a736a; font-size: 9px; }
.package-studio > h3 { margin: 16px 0; font: 48px/1.05 Georgia, serif; letter-spacing: -.05em; }
.package-intro { max-width: 600px; color: #626c6c; font-size: 14px; }
.package-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 28px 0 20px; }
.package-card { padding: 24px 20px; border-radius: 16px; background: linear-gradient(140deg, #e3e9eb, #bbc8cc); color: #263c45; }
.package-gold { background: linear-gradient(140deg, #f3ddb0, #d1aa67); color: #4d3820; }
.package-platinum { background: radial-gradient(ellipse at 90% 0%, #627c86, #203c48 70%); color: #f1f5f3; }
.package-mark { display: block; margin-bottom: 22px; font-size: 28px; }
.package-card h4 { margin: 0 0 8px; font: 32px Georgia, serif; letter-spacing: -.04em; }
.package-card > p { font-size: 12px; opacity: .8; }
.package-card ul { list-style: none; margin: 24px 0; padding: 0; }
.package-card li { display: flex; align-items: baseline; gap: 12px; padding: 12px 0; border-top: 1px solid currentColor; border-color: #56717a33; font-size: 12px; }
.package-platinum li { border-color: #c5dce033; }
.package-card li b { font: 18px monospace; }
.package-footer { font: 7px monospace; letter-spacing: .06em; opacity: .75; }
.package-terms { max-width: 720px; color: #697273; font-size: 12px; line-height: 1.7; }
@media(max-width: 650px) { .studio-visual { min-height: 420px; } .package-grid { grid-template-columns: 1fr; } .package-card { padding: 24px; } .package-card ul { display: grid; grid-template-columns: 1fr 1fr; column-gap: 15px; } .package-studio > h3 { font-size: 38px; } }
.insta360-post { background: #dae6ef; overflow: hidden; }
.ugc-phone .insta360-post > img { position: absolute; width: 210%; max-width: none; height: auto; left: -55%; bottom: 0; }
.skool-partner-stage { background: radial-gradient(ellipse at 30% 15%, #e3d6a9, #9daa89 60%, #557365); }
.ugc-phone .skool-promo { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 13px; background: #fff5d9; padding: 14px 8px; text-align: center; }
.ugc-phone .skool-promo > .skool-promo-logo { width: 90px; height: auto; object-fit: contain; }
.skool-promo > strong { color: #263d38; font: 700 22px/1.06 Georgia, serif; letter-spacing: -.035em; }
.skool-promo-faces { display: flex; justify-content: center; }
.skool-promo-faces img { width: 54px; height: 54px; object-fit: cover; border: 3px solid #fff; border-radius: 50%; }
.skool-promo-faces img + img { margin-left: -10px; }
.ugc-phone .skool-promo > span { position: static; padding: 0; border-radius: 0; background: transparent; color: #40544b; font: 7px monospace; }
.service-dialog[data-service="3"] .social-feature-stage { background: radial-gradient(ellipse at 25% 15%, #dca56c, #a0583d 55%, #502f2a); }
.ugc-phone .restaurant-post > img { object-position: center; }
.media-gear { margin: 28px 0; padding: 24px; border-radius: 18px; background: #e6ebe9; border: 1px solid #d0d9d5; }
.media-gear-heading h4 { margin: 10px 0 15px; font: 27px Georgia, serif; letter-spacing: -.035em; }
.media-gear-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.media-gear-grid figure { margin: 0; padding: 12px 8px; border-radius: 12px; background: #ffffff80; text-align: center; }
.media-gear-grid img { display: block; width: 100%; height: auto; }
.media-gear-grid strong { display: block; font: 600 11px/1.4 sans-serif; }
.media-gear-grid figcaption span { display: block; margin-top: 4px; font: 9px/1.4 sans-serif; color: #64716e; }
@media(max-width: 600px) { .media-gear-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .media-gear { padding: 18px; } }

/* Click the canopy or speech bubble to bring the travelers together. */
button.mountain-paraglider { padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; z-index: 2; overflow: visible; }
button.mountain-paraglider:focus-visible { outline: 2px dashed white; outline-offset: 8px; border-radius: 50%; }
.mountain-paraglider.is-flying > span { opacity: 0; transition: opacity 180ms; }
.mountain-paraglider.has-landed { left: auto; right: calc(15% + 38px); top: 76%; cursor: default; }
.mountain-paraglider.has-landed > span { left: auto; right: 2px; bottom: calc(100% + 2px); opacity: 1; }
.mountain-paraglider.is-landing .paraglider-canopy { opacity: 0; transform: translateX(-50%) translateY(14px) scaleY(.1); transition: transform 450ms ease-in, opacity 450ms ease-in; }
@media(max-width:700px) { .mountain-paraglider.has-landed { right: calc(12% + 38px); } }
@media(prefers-reduced-motion:reduce) { .mountain-paraglider.is-landing .paraglider-canopy { transition: none; } }

/* A clothbound storybook opens onto the existing memories. */
.how-we-met-link { width: 150px; height: 184px; margin: 24px auto 8px; padding: 0; border: 0; perspective: 800px; background: transparent; }
.storybook-cover { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: space-around; width: 138px; height: 174px; padding: 15px 12px; box-sizing: border-box; color: #f4ddb0; background: linear-gradient(90deg,#17392e 0 9%,#35644c 10%,#244e3c 18%,#315d46); border: 1px solid #163427; border-radius: 4px 10px 10px 4px; box-shadow: 5px 2px 0 #eee4cc,8px 3px 0 #c6bda7,11px 5px 0 #1d3e30,14px 12px 20px #0003; transform: rotate(-5deg); transition: transform .3s; text-align: center; }
.storybook-cover:after { content:''; position:absolute; inset:9px 8px 9px 20px; border:1px solid #ccb67d80; border-radius:2px; pointer-events:none; }
.storybook-cover strong { font: 700 25px/1.05 Georgia,serif; }
.storybook-cover small { font: 7px/1.3 sans-serif; letter-spacing: .15em; }
.how-we-met-link:hover .storybook-cover { transform: rotate(0) translateY(-4px); }
.meeting-story { border: 9px solid #294b3c; border-radius: 8px 18px 18px 8px; background: linear-gradient(90deg,#f6f0e0 0%,#fffaf0 48%,#d8ccb2 50%,#fffaf0 52%,#f6f0e0 100%); box-shadow: 6px 5px 0 #d5cbb8,11px 9px 0 #294b3c; }
.meeting-story[open] { animation: storybook-open .7s cubic-bezier(.2,.7,.2,1) both; transform-origin: left center; }
@keyframes storybook-open { from { opacity:0; transform:perspective(1400px) rotateY(-65deg) scale(.8); } to { opacity:1; transform:perspective(1400px) rotateY(0) scale(1); } }
.mountain-sitter[role="button"] { cursor:pointer; }
.mountain-sitter:focus-visible { outline:2px dashed white; outline-offset:6px; }
.mountain-friend .tiny-bible { position:absolute; width:15px; height:13px; left:9px; top:16px; animation:bible-open .5s ease-out; }
@keyframes bible-open { from { transform:translateY(9px) scale(.2); opacity:0; } to { transform:none; opacity:1; } }
.ugc-phone .campaign-slide { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; background:#e4ece4; text-align:center; }
.ugc-phone .campaign-slide > img { width:100%; height:100%; object-fit:cover; }
.ugc-phone .campaign-slide.gear-slide > img { width:85%; height:65%; object-fit:contain; }
.campaign-slide .campaign-label { position:absolute; bottom:10px; left:8px; right:8px; background:#183b34dc; color:white; padding:9px; border-radius:6px; font:700 12px/1.3 Georgia,serif; }
.campaign-slide .brand-art { font:700 26px/1.2 Georgia,serif; color:#264e48; padding:15px; }
.campaign-slide .brand-art em { display:block; margin:15px 0; font-style:normal; font-size:65px; }
.campaign-slide.slide-enter { animation:campaign-in .6s ease both; }
@keyframes campaign-in { from { opacity:.2; transform:translateX(12px); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) { .meeting-story[open],.campaign-slide.slide-enter,.mountain-friend .tiny-bible { animation:none; } }

/* Quiet invitations, with reduced-motion alternatives. */
.storybook-cover { transform-origin: 6% center; animation: book-invitation 6s ease-in-out infinite; }
@keyframes book-invitation { 0%,55%,100% { transform:rotate(-5deg) rotateY(0); } 67%,77% { transform:rotate(-5deg) rotateY(-24deg); } 88% { transform:rotate(-5deg) rotateY(-4deg); } }
.how-we-met-link:hover .storybook-cover { animation-play-state:paused; }
.mountain-paraglider.has-landed > span { background:none; isolation:isolate; }
.mountain-paraglider.has-landed > span:before { content:''; position:absolute; inset:0; background:url('assets/cartoon-speech-bubble.svg') center/100% 100% no-repeat; transform:scaleX(-1); z-index:-1; }
.gps-lost { animation:gps-click-blink 2s steps(1,end) infinite; }
@keyframes gps-click-blink { 0%,65%,100% { opacity:1; } 66%,99% { opacity:.05; } }
.satellite { position:relative; }
.satellite-broadcast { position:absolute; left:50%; bottom:100%; width:48px; transform:translateX(-50%); color:white; pointer-events:none; }
.satellite-broadcast svg { width:48px; fill:none; stroke:#d8f8ff; stroke-width:2; stroke-linecap:round; }
.satellite-broadcast path { opacity:0; animation:broadcast-wave 5s infinite; }
.satellite-broadcast path:nth-child(2) { animation-delay:.3s; }
.satellite-broadcast path:nth-child(3) { animation-delay:.6s; }
.satellite-broadcast circle { fill:white; stroke:none; }
.satellite-broadcast > span { position:absolute; bottom:40px; left:50%; transform:translateX(-50%); white-space:nowrap; font:10px monospace; opacity:0; animation:broadcast-caption 5s infinite; }
@keyframes broadcast-wave { 0%,8%,60%,100% { opacity:0; } 18%,40% { opacity:1; } }
@keyframes broadcast-caption { 0%,65%,100% { opacity:0; } 73%,92% { opacity:1; } }
.watch-section > .space-plane { width:clamp(105px,10.5vw,139px); }
.socials-click-hint { width:34px; height:44px; left:auto; right:7%; bottom:32%; padding:0; background:none; border:0; border-radius:0; backdrop-filter:none; box-shadow:none; animation:social-hand-tap 10s ease-in-out infinite; }
.socials-click-hint svg { width:100%; height:100%; filter:drop-shadow(0 2px 3px #0005); }
@keyframes social-hand-tap { 0%,78%,100% { opacity:0; transform:translate(14px,18px) rotate(-15deg); } 83%,95% { opacity:1; transform:translate(0,0) rotate(-15deg); } 87%,92% { opacity:1; transform:translate(-4px,-7px) rotate(-15deg) scale(.9); } }
.campaign-photo-crop { position:absolute; inset:0; overflow:hidden; }
.campaign-photo-crop img { position:absolute; width:200%; height:200%; max-width:none; object-fit:fill; }
.ugc-phone .campaign-slide .campaign-label { background:linear-gradient(transparent,#081a23db); inset:auto 0 0; padding:35px 12px 15px; border-radius:0; text-align:left; font:600 17px/1.2 Georgia,serif; letter-spacing:-.02em; }
.service-dialog[data-service="2"] .skool-partner-stage { background:linear-gradient(145deg,#bcc8c6,#4b6467); }
.service-dialog[data-service="3"] .social-feature-stage { background:linear-gradient(145deg,#d9b998,#78654e); }
/* Numbered location beacons replace remote labels and connector lines. */
.city-pin > .world-pin-dot { width:23px; height:23px; border:1px solid #b3e9ee; border-radius:50%; background:#123741ed; color:#e7ffff; font:600 10px/21px monospace; transform:translate(-50%,-50%); box-shadow:0 0 0 4px #83d9de20,0 0 15px #7ee8f233; }
.city-pin:hover > .world-pin-dot,.city-pin:focus-visible > .world-pin-dot { background:#e4ffff; color:#15313a; box-shadow:0 0 0 6px #83d9de40; }
.city-pin .world-pin-badge { display:none; }
.city-pin:hover .world-pin-badge,.city-pin:focus-visible .world-pin-badge { display:block; transform:translate(-50%,18px); background:#10252ff2; color:white; padding:6px 9px; }
.city-pin:hover,.city-pin:focus-visible { z-index:5; }
.city-navigation { margin:0 7% 18px; padding:16px; border:1px solid #7bb7c132; border-radius:12px; background:linear-gradient(125deg,#142b34f2,#08151cf2); color:#e7f8f6; }
.city-navigation[hidden] { display:none; }
.city-navigation > p { margin:0 0 12px; font:10px monospace; letter-spacing:.14em; text-transform:uppercase; color:#95cbd1; }
.city-navigation > div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.city-navigation button { text-align:left; padding:9px 7px; border:0; border-bottom:1px solid #ffffff13; background:transparent; color:#e7f8f6; font:12px/1.4 sans-serif; cursor:pointer; }
.city-navigation button b { color:#88cfd4; font:11px monospace; margin-right:9px; }
.city-navigation button:hover,.city-navigation button:focus-visible { background:#91dce71c; outline:1px solid #91dce755; border-radius:4px; }
@media(prefers-reduced-motion:reduce) { .storybook-cover,.gps-lost,.satellite-broadcast path,.satellite-broadcast > span,.socials-click-hint { animation:none; opacity:1; } .socials-click-hint { opacity:0; } }

.campaign-photo-crop { inset:auto; left:50%; top:50%; transform:translate(-50%,-50%); }

/* Open the cover halfway, then riffle a few real page layers. */
.how-we-met-link { position:relative; transform-style:preserve-3d; }
.storybook-pages { position:absolute; left:5px; top:5px; width:132px; height:171px; border-radius:3px 8px 8px 3px; background:repeating-linear-gradient(#f4ecd7 0 3px,#c7bfae 3px 4px); box-shadow:6px 5px 0 #234d39; transform:rotate(-5deg); }
.storybook-pages i { position:absolute; inset:3px; border:1px solid #d8cdb3; border-radius:2px 7px 7px 2px; background:linear-gradient(90deg,#d2c6a9,#fff9e9 15%,#eee5ce); transform-origin:left center; animation:storybook-riffle 6s ease-in-out infinite; }
.storybook-pages i:nth-child(2) { animation-delay:.18s; }
.storybook-pages i:nth-child(3) { animation-delay:.36s; }
.storybook-pages i:nth-child(4) { animation-delay:.54s; }
.storybook-cover { z-index:5; backface-visibility:hidden; box-shadow:3px 1px 0 #153829,6px 8px 18px #0003; }
@keyframes book-invitation { 0%,15%,100% { transform:rotate(-5deg) rotateY(0); } 30%,76% { transform:rotate(-5deg) rotateY(-78deg); } 90% { transform:rotate(-5deg) rotateY(-8deg); } }
@keyframes storybook-riffle { 0%,32%,80%,100% { transform:rotateY(0); } 46%,58% { transform:rotateY(-65deg); } 70% { transform:rotateY(-12deg); } }
.how-we-met-link:hover .storybook-cover { animation-play-state:running; }
.socials-click-hint { animation:social-hand-tap 2.5s ease-in-out infinite; }
@keyframes social-hand-tap { 0%,75%,100% { opacity:0; transform:translate(14px,18px) rotate(-15deg); } 12%,58% { opacity:1; transform:translate(0,0) rotate(-15deg); } 27%,44% { opacity:1; transform:translate(-4px,-7px) rotate(-15deg) scale(.9); } }
/* The final wave ends at 72% (including its .6s delay). */
@keyframes broadcast-caption { 0%,71% { opacity:0; } 72%,94% { opacity:1; } 100% { opacity:0; } }
.city-pin > .world-pin-dot { display:none; }
.city-pin .world-pin-badge,.city-pin:hover .world-pin-badge,.city-pin:focus-visible .world-pin-badge { display:flex; align-items:center; gap:7px; transform:translate(-50%,-50%); padding:6px 9px; border:1px solid #8bdae838; border-radius:20px; background:linear-gradient(135deg,#102c35e8,#081d26e8); backdrop-filter:blur(8px); color:#e7ffff; font:500 10px/1.4 sans-serif; letter-spacing:.035em; box-shadow:0 3px 14px #0003,inset 0 1px 0 #ffffff13; white-space:nowrap; }
.city-pin .world-pin-badge:before { content:''; width:5px; height:5px; border-radius:50%; background:#9ef1e4; box-shadow:0 0 8px #84e3dc; flex-shrink:0; }
.city-pin:hover .world-pin-badge,.city-pin:focus-visible .world-pin-badge { background:#194754; border-color:#b3ffff; box-shadow:0 0 16px #75dae53a; }
@media(prefers-reduced-motion:reduce) { .storybook-cover,.storybook-pages i,.socials-click-hint { animation:none; } .socials-click-hint { opacity:0; } }

/* Stable layers keep the cover and pages from intersecting during the tease. */
.how-we-met-link { transform-style:flat; isolation:isolate; }
.storybook-pages { transform-style:flat; }
.storybook-pages i { animation:book-page-sweep 7s cubic-bezier(.45,0,.25,1) infinite; backface-visibility:hidden; will-change:transform; }
.storybook-pages i:nth-child(1) { z-index:4; --page-fold:.4; }
.storybook-pages i:nth-child(2) { z-index:3; --page-fold:.52; animation-name:book-page-sweep-two; animation-delay:0s; }
.storybook-pages i:nth-child(3) { z-index:2; --page-fold:.65; animation-name:book-page-sweep-three; animation-delay:0s; }
.storybook-pages i:nth-child(4) { z-index:1; animation:none; }
.storybook-cover { transform-origin:6% center; transition:none; animation:book-cover-smooth 7s cubic-bezier(.45,0,.25,1) infinite; will-change:transform; }
@keyframes book-cover-smooth { 0%,12%,100% { transform:rotate(-5deg) scaleX(1) skewY(0); } 30%,76% { transform:rotate(-5deg) scaleX(.32) skewY(-8deg); } }
@keyframes book-page-sweep { 0%,31%,78%,100% { transform:scaleX(1) skewY(0); } 43%,52% { transform:scaleX(.4) skewY(-6deg); } 67% { transform:scaleX(1) skewY(0); } }
@keyframes book-page-sweep-two { 0%,39%,78%,100% { transform:scaleX(1) skewY(0); } 51%,59% { transform:scaleX(.52) skewY(-4deg); } 72% { transform:scaleX(1) skewY(0); } }
@keyframes book-page-sweep-three { 0%,47%,80%,100% { transform:scaleX(1) skewY(0); } 59%,65% { transform:scaleX(.65) skewY(-3deg); } }
/* Pins are anchored to geographic coordinates; names remain in the destination list. */
.city-pin > .world-pin-dot,.city-pin:hover > .world-pin-dot,.city-pin:focus-visible > .world-pin-dot { display:block; width:12px; height:12px; left:50%; top:50%; transform:translate(-50%,-100%) rotate(-45deg); border:1.5px solid #e1ffff; border-radius:50% 50% 50% 0; background:#387f88; box-shadow:0 2px 7px #0006; }
.city-pin > .world-pin-dot:after { content:''; position:absolute; width:3px; height:3px; border-radius:50%; background:#ecffff; top:3px; left:3px; }
.city-pin .world-pin-badge { display:none; pointer-events:none; }
.city-pin:hover .world-pin-badge,.city-pin:focus-visible .world-pin-badge { display:flex; transform:translate(-50%,12px); }
.city-pin .world-pin-badge:before { display:none; }
@media(prefers-reduced-motion:reduce) { .storybook-cover,.storybook-pages i { animation:none; will-change:auto; } }

.country-focused .country-questions { visibility:hidden; }
.city-pin > .world-pin-dot,.city-pin:hover > .world-pin-dot,.city-pin:focus-visible > .world-pin-dot { background:#e44749; border-color:#ffe5e2; box-shadow:0 2px 8px #0008; }
.city-pin .world-pin-badge,.city-pin:hover .world-pin-badge,.city-pin:focus-visible .world-pin-badge { display:flex; left:var(--city-label-x,30px); top:var(--city-label-y,0px); transform:none; padding:3px 5px; border:0; border-radius:4px; background:#0a1c25bd; box-shadow:none; font-size:11px; pointer-events:auto; }
.satellite-broadcast path { animation-duration:3s; }
.satellite-broadcast path:nth-child(2) { animation-delay:.15s; }
.satellite-broadcast path:nth-child(3) { animation-delay:.3s; }
.satellite-broadcast > span { animation:satellite-early-caption 3s infinite; }
@keyframes satellite-early-caption { 0%,69% { opacity:0; } 70%,94% { opacity:1; } 100% { opacity:0; } }
@media(prefers-reduced-motion:reduce) { .satellite-broadcast > span { animation:none; opacity:1; } }

/* Personal travel footprints are the default; the itinerary remains intact. */
.globe-mode-switch { display:flex; gap:4px; padding:5px; margin-bottom:18px; border:1px solid #b8c4ba; border-radius:28px; background:#e5e9df; width:fit-content; max-width:100%; }
.globe-mode-switch button { padding:11px 17px; border:0; border-radius:24px; color:#3d5349; background:transparent; font:600 12px/1.4 sans-serif; cursor:pointer; }
.globe-mode-switch button[aria-pressed="true"] { color:#fff9e9; background:#294a40; box-shadow:0 2px 6px #16342b22; }
.footprint-active .map-journal,.footprint-active .map-toolbar,.footprint-active .world-map,.footprint-active .city-navigation,.footprint-active .map-legend,.footprint-active .world-map-note { display:none!important; }
.discover-section:not(.footprint-active) .footprint-journal,.discover-section:not(.footprint-active) .footprint-explorer { display:none; }
.footprint-journal h3 { margin:15px 0; font:clamp(27px,3vw,38px)/1.15 Georgia,serif; letter-spacing:-.04em; }
.footprint-journal > p:not(.eyebrow) { font-size:14px; line-height:1.75; color:var(--muted); }
.traveler-filters { display:flex; gap:7px; margin:20px 0; }
.traveler-filters button { border:1px solid #bfcac0; border-radius:20px; padding:8px 16px; background:transparent; color:#365146; cursor:pointer; }
.traveler-filters button[aria-pressed="true"] { background:#2c4d42; color:white; border-color:#2c4d42; }
.footprint-selection { padding:13px 15px; border-left:3px solid #527d68; background:#e5eadd; color:#294337; font:13px/1.6 sans-serif; min-height:46px; }
.traveler-destinations section { margin:23px 0; }
.traveler-destinations h4 { display:flex; align-items:center; gap:9px; margin:0 0 12px; font:600 19px Georgia,serif; }
.traveler-destinations h4 svg { width:22px; height:34px; background:#203a3b; border-radius:5px; padding:2px; box-sizing:content-box; }
.traveler-destinations h4 small { margin-left:auto; font:8px monospace; letter-spacing:.12em; color:#687b6e; }
.traveler-destinations section > div { display:flex; flex-wrap:wrap; gap:6px; }
.footprint-country { padding:6px 10px; border:1px solid #ccd2c5; border-radius:6px; background:#ffffff60; color:#385148; font:12px/1.5 sans-serif; cursor:pointer; }
.footprint-country:hover,.footprint-country[aria-pressed="true"] { background:#294c42; color:white; border-color:#294c42; }
.footprint-explorer { padding:12px 12px 8px; }
.footprint-globe { position:relative; width:100%; aspect-ratio:1; cursor:grab; touch-action:none; user-select:none; }
.footprint-globe.dragging { cursor:grabbing; }
.footprint-globe:focus-visible { outline:2px solid #9dcfca; outline-offset:-8px; border-radius:50%; }
.footprint-earth { display:block; width:100%; height:100%; filter:drop-shadow(0 8px 35px #478db52b); }
.footprint-markers { position:absolute; inset:0; pointer-events:none; }
.footprint-marker { position:absolute; display:flex; gap:0; align-items:flex-end; padding:3px; border:0; background:#112931d9; border-radius:14px; cursor:pointer; pointer-events:auto; transform:translate(-50%,-80%); box-shadow:0 2px 8px #0006; }
.footprint-marker[hidden] { display:none; }
.footprint-marker svg { width:15px; height:24px; }
.footprint-marker > span { display:none; position:absolute; bottom:calc(100% + 5px); left:50%; transform:translateX(-50%); color:#fff8e6; background:#10272ef2; padding:5px 8px; white-space:nowrap; border-radius:5px; font:11px sans-serif; }
.footprint-marker:hover,.footprint-marker:focus-visible,.footprint-marker.selected { z-index:5; outline:1px solid #eaf4d5; }
.footprint-marker:hover > span,.footprint-marker:focus-visible > span,.footprint-marker.selected > span { display:block; }
.footprint-globe-controls { display:flex; justify-content:space-between; gap:8px; align-items:center; padding:0 15px; color:#abc3c8; font:8px/1.7 monospace; letter-spacing:.08em; }
.footprint-reset { color:#e1efeb; background:#ffffff0d; border:1px solid #b5d6d33b; padding:8px 12px; border-radius:20px; font:10px sans-serif; cursor:pointer; white-space:nowrap; }
.footprint-key { display:flex; justify-content:center; gap:25px; padding:20px 0 8px; font:11px sans-serif; }
.john-key { color:#f1b45f; }.mateo-key { color:#75d5ca; }
@media(max-width:600px) { .globe-mode-switch { width:100%; }.globe-mode-switch button { flex:1; padding:10px; }.footprint-explorer { padding:3px; }.footprint-marker svg { width:12px; height:20px; }.footprint-globe-controls { padding:0 9px; } }

/* Country portfolios: editorial cover, quiet photo grid, full-size viewing. */
body:has(.country-portfolio[open]) { overflow:hidden; }
.country-portfolio { width:min(1100px,calc(100vw - 32px)); max-height:92dvh; padding:0; border:0; border-radius:14px; background:#f5f2ea; color:#243f35; box-shadow:0 30px 100px #0007; }
.country-portfolio::backdrop,.portfolio-lightbox::backdrop { background:#061315d9; backdrop-filter:blur(9px); }
.portfolio-bar { position:sticky; top:0; z-index:3; display:flex; align-items:center; justify-content:space-between; padding:15px 24px; background:#f5f2eaf5; backdrop-filter:blur(12px); font:9px monospace; letter-spacing:.13em; }
.portfolio-close,.lightbox-close { width:36px; height:36px; border:1px solid #84938955; border-radius:50%; background:transparent; color:inherit; font:25px sans-serif; cursor:pointer; }
.portfolio-hero { position:relative; height:clamp(310px,50vw,530px); overflow:hidden; background:#29473e; }
.portfolio-hero > img { width:100%; height:100%; object-fit:cover; object-position:center 40%; }
.portfolio-hero:after { content:''; position:absolute; inset:0; background:linear-gradient(transparent 10%,#0a1c199c 80%,#0a1c19d9); }
.portfolio-heading { position:absolute; inset:auto 6% 9%; z-index:1; color:#fffaf0; }
.portfolio-heading h2 { margin:14px 0; font:clamp(42px,7vw,86px)/1.04 Georgia,serif; letter-spacing:-.045em; }
.portfolio-heading p { margin:0; font:10px/1.8 monospace; letter-spacing:.12em; }
.portfolio-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:34px 5%; }
.portfolio-intro h3 { margin:0; font:28px Georgia,serif; }
.portfolio-intro p { max-width:320px; margin:0; font:12px/1.7 sans-serif; color:#66756b; }
.portfolio-grid { columns:3; column-gap:16px; padding:0 5% 45px; }
.portfolio-tile { position:relative; display:block; width:100%; padding:0; margin:0 0 16px; border:0; background:#e5e6db; border-radius:4px; overflow:hidden; cursor:zoom-in; break-inside:avoid; }
.portfolio-tile img { width:100%; height:auto; display:block; transition:transform .4s; }
.portfolio-tile:hover img { transform:scale(1.025); }
.portfolio-tile-caption { position:absolute; bottom:0; left:0; right:0; text-align:left; padding:24px 12px 12px; background:linear-gradient(transparent,#071d23b3); color:white; font:8px monospace; letter-spacing:.12em; opacity:0; transition:opacity .2s; }
.portfolio-tile:hover .portfolio-tile-caption,.portfolio-tile:focus-visible .portfolio-tile-caption { opacity:1; }
.portfolio-film { min-height:230px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; background:linear-gradient(135deg,#2a5757,#102827); color:#efe6ce; }
.portfolio-film > span { font-size:45px; }.portfolio-film strong { font:20px Georgia,serif; }.portfolio-film small { font:8px monospace; letter-spacing:.2em; }
.portfolio-empty { padding:35px 6%; font:16px/1.8 Georgia,serif; }
.portfolio-lightbox { width:96vw; max-width:1400px; height:94dvh; max-height:94dvh; padding:50px 20px 65px; border:0; background:#071414; color:#fff; border-radius:12px; }
.lightbox-close { position:absolute; top:10px; right:15px; z-index:2; }
.lightbox-media { height:100%; display:flex; align-items:center; justify-content:center; }
.lightbox-media img,.lightbox-media video { width:100%; height:100%; object-fit:contain; }
.lightbox-controls { position:absolute; bottom:12px; left:15px; right:15px; display:flex; justify-content:center; align-items:center; gap:20px; }
.lightbox-controls button { width:40px; height:36px; border:1px solid #ffffff40; border-radius:20px; background:none; color:white; cursor:pointer; }.lightbox-count { font:11px sans-serif; }
@media(max-width:650px) { .portfolio-grid { columns:2; column-gap:10px; }.portfolio-tile { margin-bottom:10px; }.portfolio-intro { flex-direction:column; align-items:flex-start; }.portfolio-bar { padding:10px 15px; font-size:7px; }.portfolio-heading p { font-size:8px; }.portfolio-film { min-height:160px; } }
@media(prefers-reduced-motion:reduce) { .portfolio-tile img { transition:none; } }

/* Photo cutouts replace the footprint stick figures. */
.traveler-head { display:block; width:44px; height:44px; object-fit:contain; user-select:none; pointer-events:none; }
.footprint-marker { padding:0; gap:0; background:transparent; box-shadow:none; border-radius:8px; }
.footprint-marker .traveler-head { width:36px; height:40px; filter:drop-shadow(0 1px 1px #07151c) drop-shadow(0 0 2px #f1b45f99); transition:transform .18s ease; }
.footprint-marker .traveler-head-mateo { filter:drop-shadow(0 1px 1px #07151c) drop-shadow(0 0 2px #75d5ca99); }
.footprint-marker .traveler-head + .traveler-head { margin-left:-7px; }
.footprint-marker:hover .traveler-head,.footprint-marker:focus-visible .traveler-head { transform:translateY(-3px) scale(1.08); }
.traveler-destinations h4 .traveler-head { width:45px; height:48px; }
@media(max-width:600px) { .footprint-marker .traveler-head { width:29px; height:34px; } }
@media(prefers-reduced-motion:reduce) { .footprint-marker .traveler-head { transition:none; } }

/* Keep traveler selection and destination browsing directly below the globe. */
.footprint-browser { margin-top:24px; }
.discover-section:not(.footprint-active) .footprint-browser { display:none; }
.footprint-browser .traveler-filters { justify-content:center; margin-top:0; }
.footprint-browser .traveler-destinations { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.footprint-browser .traveler-destinations section[hidden] { display:none; }
.footprint-browser .traveler-destinations section:only-child { grid-column:1/-1; }
@media(max-width:600px) { .footprint-browser .traveler-destinations { grid-template-columns:1fr; gap:0; } }

.footprint-key { flex-wrap:wrap; gap:12px 25px; }
.both-key { color:#b5c894; }

/* Compact the introduction above the personal globe. */
.discover-section.footprint-active > .section-head { margin-bottom:14px; }
.footprint-journal > .eyebrow { margin-top:0; margin-bottom:8px; }
.footprint-journal h3 { margin:8px 0 10px; }
.footprint-journal > p:last-child { margin-bottom:0; }
.discover-section.footprint-active .travel-map-layout { row-gap:20px; }

/* Fixed artwork avoids OS-dependent flag and landmark emoji rendering. */
.host-flags .host-flag img { display:block; width:32px; height:28px; object-fit:contain; max-width:none; border:0; border-radius:0; transform:none; }
.traveler-destinations h4 .traveler-flag { display:inline-block; width:25px; height:18px; object-fit:contain; flex-shrink:0; }
.book-attention { filter:drop-shadow(0 0 12px #e8b65c99); transition:filter .3s; }
.tiny-cross { position:absolute; width:12px!important; height:20px!important; right:-5px; top:-4px; animation:cross-lift .7s ease-out both; }
@keyframes cross-lift { from { transform:translate(-6px,19px) rotate(-30deg); opacity:0; } to { transform:none; opacity:1; } }
.raising-cross > svg:not(.tiny-cross) { transform:rotate(-4deg); transform-origin:center bottom; transition:transform .5s; }
.figure-click-hint { position:absolute; right:-16px; bottom:-6px; display:block; width:19px; height:25px; pointer-events:none; opacity:0; animation:figure-tap 10s ease-in-out infinite; }
.figure-click-hint svg { width:19px; height:25px; }
@keyframes figure-tap { 0%,80%,100% { opacity:0; transform:translate(5px,8px); } 84%,95% { opacity:1; transform:translate(0,0); } 89% { opacity:1; transform:translate(-3px,-4px) scale(.9); } }
.socials-click-hint > svg { animation:alternate-click-hand 5s steps(1,end) infinite; }
.socials-click-hint > .follow-us-prompt { position:absolute; top:5px; right:-5px; white-space:nowrap; border:1px solid #ffffff65; border-radius:15px; padding:7px 11px; color:white; background:#173b42ed; font:600 11px sans-serif; transform:rotate(15deg); animation:alternate-follow-text 5s steps(1,end) infinite; }
@keyframes alternate-click-hand { 0% { visibility:visible; } 50% { visibility:hidden; } }
@keyframes alternate-follow-text { 0% { visibility:hidden; } 50% { visibility:visible; } }
.socials-showcase.reveal-armed .social-card { opacity:0; pointer-events:none; }
.socials-showcase.reveal-exploding .social-card { animation:phones-emerge 1.35s ease-out both; pointer-events:auto; }
@keyframes phones-emerge { 0%,14% { opacity:0; filter:blur(12px); } 48% { opacity:1; filter:blur(0); } 100% { opacity:1; filter:none; } }
.social-burst { position:absolute; inset:0; z-index:300; pointer-events:none; }
.social-burst:before,.social-burst:after { content:''; position:absolute; left:50%; top:50%; width:160px; height:160px; margin:-80px; border-radius:50%; opacity:0; }
.social-burst:before { background:radial-gradient(circle,#fff8df,#f9bc62 30%,#df674700 70%); }
.social-burst:after { border:3px solid #f3cf98; box-shadow:0 0 24px #f5b36d88,inset 0 0 24px #f5b36d55; }
.reveal-exploding .social-burst:before { animation:burst-core 1.1s ease-out both; }
.reveal-exploding .social-burst:after { animation:burst-ring 1.2s ease-out both; }
.social-burst i { position:absolute; top:50%; left:50%; width:5px; height:20px; border-radius:50%; background:linear-gradient(#fff3c1,#e5944900); opacity:0; }
.reveal-exploding .social-burst i { animation:burst-spark 1.3s cubic-bezier(.1,.5,.3,1) both; }
@keyframes burst-core { 0% { opacity:0; transform:scale(.1); } 15% { opacity:.95; } 100% { opacity:0; transform:scale(4); } }
@keyframes burst-ring { 0% { opacity:0; transform:scale(.1); } 12% { opacity:.9; } 100% { opacity:0; transform:scale(4.5); } }
@keyframes burst-spark { 0% { opacity:0; transform:translate(0,0) rotate(var(--spark-angle)) scale(.2); } 16% { opacity:1; } 100% { opacity:0; transform:translate(var(--spark-x),var(--spark-y)) rotate(var(--spark-angle)) scale(.3); } }
@media(prefers-reduced-motion:reduce) { .socials-showcase.reveal-armed .social-card { opacity:1; pointer-events:auto; }.social-burst { display:none; }.figure-click-hint,.tiny-cross { animation:none; }.figure-click-hint { display:none; } }

/* The planned route now uses a fully draggable globe, with quiet hover labels. */
.planned-explorer { padding:12px 12px 20px; }
.footprint-active .planned-explorer { display:none; }
.discover-section .world-map,.discover-section .map-toolbar,.discover-section .map-legend,.discover-section .world-map-note,.discover-section .city-navigation { display:none!important; }
.planned-surface { overflow:hidden; }
.planned-surface > svg { display:block; width:100%; height:100%; }
.planned-pin { position:absolute; pointer-events:auto; width:28px; height:32px; padding:0; background:none; border:0; cursor:pointer; transform:translate(-50%,-90%); }
.planned-pin[hidden] { display:none; }
.planned-pin i { display:block; position:absolute; left:7px; top:8px; width:15px; height:15px; background:#df4f43; border:2px solid #ffe7d4; border-radius:50% 50% 50% 0; transform:rotate(-45deg); box-shadow:0 2px 8px #0007; }
.planned-pin i:after { content:''; position:absolute; width:4px; height:4px; border-radius:50%; top:3px; left:3px; background:white; }
.planned-pin span { display:none; position:absolute; left:50%; bottom:100%; transform:translateX(-50%); padding:6px 9px; border-radius:5px; background:#102c35ed; color:white; font:11px sans-serif; white-space:nowrap; }
.planned-pin:hover,.planned-pin:focus-visible { z-index:5; }
.planned-pin:hover span,.planned-pin:focus-visible span { display:block; }
.planned-options { margin:20px 14px 0; display:flex; gap:8px; flex-wrap:wrap; }
.planned-options p { width:100%; color:#b2d1cd; font:10px monospace; letter-spacing:.12em; }
.planned-options button { padding:8px 12px; border:1px solid #a8d1c833; border-radius:18px; background:#173c40; color:#edf6e8; font:12px sans-serif; cursor:pointer; }
.planned-options button:hover { background:#326168; }
/* Four-second arena-style entrance; the orbit itself is unchanged. */
.socials-showcase.reveal-exploding .social-card { animation:epic-phones-visible 4.2s linear both; }
.socials-showcase.reveal-exploding .phone-wrap { animation:epic-phone-arrival 4.2s cubic-bezier(.2,.75,.25,1) both; }
.socials-showcase.reveal-exploding .social-card:nth-child(2) .phone-wrap { --entrance-roll:-330deg; }
.socials-showcase.reveal-exploding .social-card:nth-child(3) .phone-wrap { --entrance-roll:330deg; }
@keyframes epic-phones-visible { 0%,39% { opacity:0; } 51%,100% { opacity:1; } }
@keyframes epic-phone-arrival { 0%,39% { transform:scale(.06) rotate(var(--entrance-roll,240deg)); filter:blur(8px); } 75% { transform:scale(1.08) rotate(-5deg); filter:blur(0); } 100% { transform:scale(1) rotate(0); filter:none; } }
.reveal-exploding .social-burst:before { animation:epic-core 3.6s ease-out both; background:radial-gradient(circle,#fffdf0 0%,#ffcf75 20%,#f87735 40%,#da302622 65%,transparent 72%); }
.reveal-exploding .social-burst:after { animation:epic-shockwave 3.4s ease-out both; border:5px solid #ffd8a0; }
.reveal-exploding .social-burst i { width:5px; height:45px; background:linear-gradient(var(--spark-color),transparent); box-shadow:0 -5px 8px var(--spark-color); animation:epic-firework 2.7s cubic-bezier(.12,.5,.2,1) var(--spark-delay) both; }
@keyframes epic-core { 0% { opacity:0; transform:scale(.03); } 10% { opacity:1; transform:scale(2.3); } 35% { opacity:.85; transform:scale(4); } 70% { opacity:.25; transform:scale(5.5); } 100% { opacity:0; transform:scale(6); } }
@keyframes epic-shockwave { 0% { opacity:0; transform:scale(.05); } 8% { opacity:1; } 60% { opacity:.5; } 100% { opacity:0; transform:scale(6); } }
@keyframes epic-firework { 0% { opacity:0; transform:translate(0,0) rotate(var(--spark-angle)) scale(.2); } 10% { opacity:1; } 60% { opacity:.9; } 100% { opacity:0; transform:translate(var(--spark-x),var(--spark-y)) rotate(var(--spark-angle)) scale(.3); } }
.explosion-shout,.explosion-title { position:absolute; top:50%; left:50%; font-family:Impact,'Arial Black',sans-serif; font-style:italic; font-weight:900; letter-spacing:-.05em; line-height:1; white-space:nowrap; opacity:0; }
.explosion-shout { font-size:clamp(80px,17vw,190px); color:#fff2b9; -webkit-text-stroke:2px #932e25; text-shadow:5px 5px 0 #b73122,10px 10px 0 #071827,0 0 40px #ff6c27; }
.explosion-title { font-size:clamp(65px,14vw,145px); color:#fff; -webkit-text-stroke:2px #253b59; text-shadow:-5px 4px 0 #e44742,5px -4px 0 #287fe3,0 0 28px #fff6; }
.reveal-exploding .explosion-shout { animation:epic-boom-word 1.7s ease-out both; }
.reveal-exploding .explosion-title { animation:epic-title 2.5s .9s ease-out both; }
@keyframes epic-boom-word { 0% { opacity:0; transform:translate(-50%,-50%) scale(.1) rotate(-15deg); } 18%,65% { opacity:1; transform:translate(-50%,-50%) scale(1) rotate(-8deg); } 100% { opacity:0; transform:translate(-50%,-50%) scale(1.6) rotate(5deg); } }
@keyframes epic-title { 0% { opacity:0; transform:translate(-50%,-50%) scale(.4) rotate(8deg); } 15%,40% { opacity:1; transform:translate(-50%,-50%) scale(1) rotate(-4deg); } 100% { opacity:0; transform:translate(-50%,-85%) scale(1.4); } }
@media(prefers-reduced-motion:reduce) { .socials-showcase.reveal-exploding .social-card,.socials-showcase.reveal-exploding .phone-wrap { animation:none; opacity:1; } }

.planned-explorer > .planned-reset { position:relative; z-index:6; display:block; min-height:46px; padding:12px 18px; margin:8px 10px 0; color:#173e49; background:#eff8ed; border:1px solid #b6d2cb; font:600 13px sans-serif; box-shadow:0 3px 12px #0002; }
.planned-explorer > .planned-reset:hover { background:white; }
.planned-explorer > .planned-reset:focus-visible { outline:3px solid #ffbc63; outline-offset:3px; }
.planned-pin > img { display:block; width:28px; height:32px; object-fit:contain; filter:drop-shadow(0 2px 3px #0005); }
.explosion-cloud { position:absolute; left:50%; top:50%; width:min(110vw,1000px); max-width:none; height:auto; opacity:0; pointer-events:none; }
.reveal-exploding .explosion-cloud { animation:mushroom-cloud-eruption 4.2s cubic-bezier(.16,.6,.3,1) both; }
@keyframes mushroom-cloud-eruption { 0% { opacity:0; transform:translate(-50%,-30%) scale(.08); } 16% { opacity:1; transform:translate(-50%,-46%) scale(.65); } 38% { opacity:1; transform:translate(-50%,-53%) scale(1); } 65% { opacity:.85; transform:translate(-50%,-58%) scale(1.12); } 100% { opacity:0; transform:translate(-50%,-65%) scale(1.3); } }
@media(prefers-reduced-motion:reduce) { .explosion-cloud { display:none; } }

.explosion-trigger-plane { position:absolute; width:145px; height:auto; z-index:400; left:50%; top:50%; pointer-events:none; animation:plane-strike .75s cubic-bezier(.6,0,1,1) both; }
@keyframes plane-strike { from { transform:translate(-650px,-240px) rotate(155deg) scale(1.4); } to { transform:translate(-50%,-50%) rotate(155deg) scale(.65); } }
@keyframes epic-title { 0% { opacity:0; transform:translate(-50%,-50%) scale(.1) rotate(-360deg); } 24% { opacity:1; transform:translate(-50%,-50%) scale(1.12) rotate(12deg); } 36% { opacity:1; transform:translate(-50%,-50%) scale(.96) rotate(-9deg); } 48% { opacity:1; transform:translate(-50%,-50%) scale(1) rotate(3deg); } 100% { opacity:0; transform:translate(-50%,-85%) scale(1.4) rotate(30deg); } }
.social-hype-screen { position:absolute; inset:0; z-index:20; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:2px; pointer-events:none; color:white; background:linear-gradient(150deg,#291142ee,#102d4aed); animation:hype-screen 6s ease-in-out infinite; overflow:hidden; }
.social-hype-screen > b { font:900 clamp(15px,2.1vw,25px)/1.02 Impact,'Arial Black',sans-serif; letter-spacing:-.025em; color:#fff; text-shadow:2px 1px #ed4a89; transform:rotate(-5deg); }
.social-hype-screen > b:nth-child(even) { color:#9cece5; transform:rotate(4deg); }
.social-hype-metrics { position:relative; z-index:2; margin-top:12px; padding:8px; border:1px solid #fff4; border-radius:8px; background:#091a32c9; display:flex; flex-wrap:wrap; justify-content:center; gap:5px 10px; font:9px/1.3 sans-serif; }
.social-hype-metrics small { width:100%; text-align:center; font:6px monospace; letter-spacing:.07em; color:#bad0e0; }
.social-hype-hearts { position:absolute; inset:0; pointer-events:none; }
.social-hype-hearts i { position:absolute; left:calc(8% + var(--heart)*15%); bottom:-20px; font-style:normal; font-size:19px; color:#ff70a1; animation:hype-heart 2.8s calc(var(--heart)*.4s) linear infinite; }
@keyframes hype-heart { from { transform:translateY(0) rotate(-15deg); opacity:0; } 20% { opacity:1; } to { transform:translateY(-360px) rotate(25deg); opacity:0; } }
@keyframes hype-screen { 0%,12%,90%,100% { opacity:0; } 22%,75% { opacity:1; } }
.mountain-blessing-light { position:absolute; z-index:1; pointer-events:none; right:calc(15% - 55px); top:0; width:185px; height:calc(76% + 55px); transform-origin:50% 0; background:linear-gradient(180deg,#fff7c500,#fff3af28 30%,#fff9cf9c 96%,#fff5ab00); clip-path:polygon(47% 0,53% 0,100% 100%,0 100%); filter:blur(3px); mix-blend-mode:screen; animation:blessing-light 2.5s ease-out both; }
@keyframes blessing-light { from { opacity:0; transform:scaleX(.15); } to { opacity:1; transform:scaleX(1); } }
.mountain-friend { z-index:2; }
.figure-click-hint { display:none; }
@media(max-width:700px) { .mountain-blessing-light { right:calc(12% - 55px); } }
@media(prefers-reduced-motion:reduce) { .social-hype-screen { animation:none; opacity:.95; }.social-hype-hearts { display:none; }.mountain-blessing-light { animation:none; } }

/* Seven quiet, white lines sit on the content, never a full-screen takeover. */
.animated-social-post { position:relative; }
.social-hype-screen { inset:auto; left:50%; top:50%; transform:translate(-50%,-50%); width:max-content; height:auto; padding:0; gap:0; background:none; overflow:visible; }
.social-hype-screen > b,.social-hype-screen > b:nth-child(even) { color:white; font:900 clamp(10px,1.35vw,17px)/1.05 Impact,'Arial Black',sans-serif; transform:none; text-shadow:0 1px 3px #0009; letter-spacing:0; }
.animated-social-post > .social-hype-hearts { overflow:hidden; pointer-events:none; z-index:21; }
.animated-social-post > .post-view-count { position:absolute; bottom:7px; left:8px; z-index:22; color:white; font:8px sans-serif; text-shadow:0 1px 3px #000; }
.explosion-trigger-plane { animation-duration:.9s; }
@keyframes epic-title { 0% { opacity:0; transform:translate(-50%,-50%) scale(.1) rotate(-360deg); } 24% { opacity:1; transform:translate(-50%,-50%) scale(1.12) rotate(12deg); } 40% { opacity:1; transform:translate(-50%,-50%) scale(1) rotate(-4deg); } 65% { opacity:1; transform:perspective(700px) translate(-50%,-50%) scale(1.15) rotateY(-12deg); color:#fff6e1; text-shadow:1px 1px #e7c7ff,2px 2px #dcb8f4,3px 3px #c395df,4px 4px #ac78c9,6px 6px #8e58ac,8px 8px #653e87,12px 15px 12px #0008,0 -3px 5px white; -webkit-text-stroke:3px #ead6ff; } 100% { opacity:0; transform:perspective(700px) translate(-50%,-85%) scale(1.5) rotateY(15deg); text-shadow:4px 4px #dcb8f4,8px 8px #8e58ac,12px 15px 12px #0008; } }
.host-portrait-button { position:relative; display:block; width:100%; padding:0; border:0; background:none; cursor:pointer; color:#203c32; }
.host-portrait-button:focus-visible { outline:3px solid #cb743e; outline-offset:4px; }
.host-click-cue { position:absolute; left:50%; bottom:12px; transform:translateX(-50%); padding:6px 12px; border-radius:20px; background:#fff8eae8; font:11px sans-serif; white-space:nowrap; }
.host-intro-bubble { position:absolute; left:8%; right:8%; bottom:12%; border:2px solid #294538; padding:12px 8px; border-radius:50%; background:white; font:700 15px/1.3 Georgia,serif; box-shadow:0 3px 8px #0003; }
.host-intro-bubble:after { content:''; position:absolute; top:100%; left:25%; width:12px; height:12px; background:white; border-right:2px solid #294538; transform:skewY(-35deg); }
.host-click-cue[hidden],.host-intro-bubble[hidden] { display:none; }
.first-figure-hand { position:absolute; display:block; right:-19px; bottom:0; width:20px; height:27px; pointer-events:none; animation:figure-tap 5s ease-in-out infinite; }
.first-figure-hand svg { width:20px; height:27px; }
@media(prefers-reduced-motion:reduce) { .first-figure-hand { animation:none; } .social-hype-screen { opacity:1; } }
.animated-social-post > .social-hype-screen { left:50%; right:auto; top:50%; bottom:auto; padding:0; border-radius:0; background:none; width:max-content; transform:translate(-50%,-50%); }

/* Restore TikTok's full-height post after adding the engagement overlays. */
.phone .app-ui.tiktok-ui.animated-social-post { position:absolute; inset:0; width:100%; height:100%; }
.host-intro-bubble { top:34%; bottom:auto; left:6%; right:6%; border-radius:45%; }
.host-intro-bubble:after { top:-10px; left:auto; right:20%; height:15px; width:13px; border-right:2px solid #294538; border-bottom:0; transform:skewY(35deg); }
.host-card:nth-of-type(2) .host-intro-bubble { top:65%; }
.host-card:nth-of-type(2) .host-intro-bubble:after { right:40%; }
.social-hype-screen > b,.social-hype-screen > b:nth-child(even) { font:400 clamp(10px,1.2vw,15px)/2 Arial,sans-serif; letter-spacing:.07em; }
.social-hype-screen { animation:quick-follow-flash 5s linear infinite; }
@keyframes quick-follow-flash { 0%,3%,38%,100% { opacity:0; } 5%,34% { opacity:1; } }
.post-click-hand { position:absolute; right:12%; top:55%; z-index:22; width:25px; height:32px; pointer-events:none; animation:post-hand-invite 5s ease-in-out infinite; }
.post-click-hand svg { width:100%; height:100%; }
@keyframes post-hand-invite { 0%,48%,73%,100% { opacity:0; transform:translate(7px,8px); } 53%,68% { opacity:1; transform:none; } 61% { opacity:1; transform:translate(-3px,-4px); } }
.post-repost { display:inline-flex; align-items:center; justify-content:center; color:inherit; }
.post-repost svg { width:18px; height:18px; }
.location-gps { position:relative; }
.gps-dainty-cue { position:absolute; right:-16px; top:55%; color:white; font:16px Georgia,serif; pointer-events:none; animation:gps-dainty-invite 5s infinite; }
@keyframes gps-dainty-invite { 0%,78%,100% { opacity:0; } 80%,98% { opacity:1; } }
.sky-blessing-heart { position:absolute; z-index:4; color:#ffa8ad; font-size:33px; line-height:1; pointer-events:none; filter:drop-shadow(0 0 12px #fff2b8); }
.contact-section { align-items:start; }
.contact-followers .youtube-series-badge strong { font-size:14px; }
.youtube-series-badge { background:linear-gradient(120deg,#ffffff40,#fff8ed,#ffffff40)!important; }
.youtube-series-badge small:last-child { font-size:7px; max-width:170px; }
.reveal-exploding .explosion-title { animation:epic-title-forward 2.8s 1.2s cubic-bezier(.2,.6,.3,1) both; }
@keyframes epic-title-forward { 0% { opacity:0; transform:perspective(600px) translate(-50%,-50%) translateZ(-400px) rotate(-180deg); } 30% { opacity:1; transform:perspective(600px) translate(-50%,-50%) translateZ(0) rotate(-5deg); } 63% { opacity:1; transform:perspective(600px) translate(-50%,-50%) translateZ(150px) rotateY(-12deg); text-shadow:2px 2px #e7ccff,4px 4px #c49de8,6px 6px #9872bf,10px 10px #624581,15px 20px 15px #0008; } 100% { opacity:0; transform:perspective(600px) translate(-50%,-50%) translateZ(480px) rotateY(10deg); text-shadow:3px 3px #d5b6fa,6px 6px #9970be,10px 10px #624581; } }
@media(max-width:700px) { .contact-followers { position:static; flex-wrap:wrap; grid-column:1/-1; justify-content:flex-start; }.contact-section { padding-top:50px; }.youtube-series-badge { flex-basis:100%; } }
@media(prefers-reduced-motion:reduce) { .social-hype-screen { animation:none; opacity:0; }.post-click-hand,.gps-dainty-cue { animation:none; opacity:1; } }

/* Comic bubbles sit safely below the portraits, with a tail pointing to the speaker. */
.host-portrait-button { padding-bottom:64px; }
.host-intro-bubble,.host-card:nth-of-type(2) .host-intro-bubble {
 top:auto;bottom:0;left:50%;right:auto;transform:translateX(-50%);width:130px;height:65px;
 padding:24px 8px 8px;border:0;border-radius:0;background:none;box-shadow:none;
 display:grid;place-items:center;font:700 13px/1.1 Arial,sans-serif;isolation:isolate;
}
.host-intro-bubble:before {content:'';position:absolute;inset:0;z-index:-1;background:url('assets/cartoon-speech-bubble.svg') center/100% 100% no-repeat;transform:scaleY(-1);}
.host-intro-bubble:after {display:none;}
.host-click-cue { bottom:18px; }
.host-card .host-university {display:flex;align-items:center;gap:8px;font-size:11px;line-height:1.35;}
.host-card .host-university img {width:35px;height:35px;aspect-ratio:auto;object-fit:contain;flex-shrink:0;}
.host-card .host-university .upb-logo {width:65px;height:27px;background:#091747;padding:5px;border-radius:3px;}
.explosion-trigger-plane {animation:plane-tumble-crash 1.5s cubic-bezier(.35,.05,.7,1) both;transform-origin:center;}
@keyframes plane-tumble-crash {
 0% {transform:translate(-650px,-240px) rotate(155deg) scale(1.4);}
 35% {transform:translate(-330px,-170px) rotate(365deg) scale(1.25);}
 68% {transform:translate(20px,-150px) rotate(635deg) scale(1.1);}
 100% {transform:translate(-50%,-50%) rotate(875deg) scale(.65);}
}
.reveal-exploding .explosion-title {animation:epic-title-forward 2.8s 1.2s ease-in-out both;will-change:transform,opacity;}
@keyframes epic-title-forward {
 0% {opacity:0;transform:perspective(600px) translate(-50%,-50%) translateZ(-450px) rotate(-360deg) scale(.4);}
 26% {opacity:1;transform:perspective(600px) translate(-50%,-50%) translateZ(20px) rotate(12deg) scale(1.15,.85);}
 40% {opacity:1;transform:perspective(600px) translate(-50%,-50%) translateZ(40px) rotate(-12deg) scale(.9,1.15);}
 56% {opacity:1;transform:perspective(600px) translate(-50%,-50%) translateZ(100px) rotate(7deg) scale(1.08,.96);text-shadow:2px 2px #e7ccff,4px 4px #c49de8,8px 8px #9872bf,14px 14px #624581,20px 25px 18px #0008;}
 72% {opacity:1;transform:perspective(600px) translate(-50%,-50%) translateZ(180px) rotate(-5deg) scale(.95,1.06);text-shadow:3px 3px #e7ccff,6px 6px #c49de8,12px 12px #9872bf,20px 20px #624581,25px 30px 20px #0008;}
 91% {opacity:1;transform:perspective(600px) translate(-50%,-50%) translateZ(450px) rotate(10deg);}
 100% {opacity:0;transform:perspective(600px) translate(-50%,-50%) translateZ(570px) rotate(18deg);}
}
@media(prefers-reduced-motion:reduce) {.explosion-trigger-plane {animation:none;} }
/* Mouth-level introductions without covering the faces. */
.host-portrait-button {padding-bottom:0;overflow:visible;}
.host-intro-bubble,.host-card:nth-of-type(2) .host-intro-bubble {width:100px;height:57px;padding:8px 9px 18px;left:2%;right:auto;bottom:auto;top:30%;transform:none;font-size:12px;}
.host-card:nth-of-type(2) .host-intro-bubble {top:66%;left:44%;}
.host-intro-bubble:before {transform:scaleX(-1);}
.host-card:nth-of-type(2) .host-intro-bubble:before {transform:scaleY(-1);}
.host-card:nth-of-type(2) .host-intro-bubble {padding:20px 8px 6px;}
.host-click-cue {top:45%;bottom:auto;left:50%;transform:translateX(-50%);}
.host-university a {display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;}
.host-university a:hover {text-decoration:underline;}
.yt-feed-thumbnail .social-hype-screen>b:first-child,.yt-feed-thumbnail .social-hype-screen>b:last-child {display:none;}
.yt-feed-thumbnail .social-hype-screen>b {font-size:10px;line-height:1.5;}
.social-hype-hearts i {width:20px;height:20px;color:#ff3040;animation:social-heart-rise 2.8s calc(var(--heart)*.4s) ease-out infinite;}
.social-hype-hearts svg {width:100%;height:100%;filter:drop-shadow(0 1px 2px #0003);}
@keyframes social-heart-rise {0%{opacity:0;transform:translateY(0) scale(.5)}15%{opacity:1;transform:translateY(-15px) scale(1.15)}55%{opacity:.85;transform:translate(8px,-65px) scale(.95)}100%{opacity:0;transform:translate(-5px,-140px) scale(.7)}}
.gps-lost {position:relative;overflow:visible;}
.gps-lost .gps-dainty-cue {top:50%;left:calc(100% + 4px);right:auto;transform:translateY(-50%);font-size:13px;}
.planned-reset[hidden] {display:none!important;}
.planned-pin {min-width:40px;min-height:44px;}
.contact-followers>a {box-sizing:border-box;width:180px;min-height:66px;}
.contact-followers .youtube-series-badge {flex-basis:auto;}
.contact-followers .youtube-series-badge strong {font-size:12px;}
.contact-followers .youtube-series-badge small:last-child {font-size:8px;}
.camp-pointer {position:absolute;top:46%;left:50%;width:30px;height:40px;pointer-events:none;filter:drop-shadow(0 2px 3px #0005);animation:camp-tap 2s ease-in-out infinite;}
.camp-pointer svg {width:100%;height:100%;}
.memory-launch.has-started .camp-pointer {display:none;}
@keyframes camp-tap {0%,100%{transform:translate(5px,5px)}50%{transform:translate(0,0) scale(.88)}}
.portfolio-description {max-width:560px;font-size:14px;line-height:1.6;}
@media(prefers-reduced-motion:reduce) {.camp-pointer {animation:none}.social-hype-hearts {display:none}}
/* A single invitation, then an uninterrupted photo story. */
.memory-launch .memory-click {position:absolute;top:47%;left:calc(50% + 36px);right:auto;bottom:auto;transform:none;background:none;border:0;box-shadow:none;padding:0;color:#fff;font:500 14px/1.2 Arial,sans-serif;text-shadow:0 1px 5px #000;white-space:nowrap;animation:camp-invitation 1s ease-in-out infinite;}
.memory-click[hidden] {display:none!important;}
.camp-pointer {animation:camp-tap 1s ease-in-out infinite;}
@keyframes camp-invitation {0%,100%{opacity:.55}50%{opacity:1}}
/* Hidden must win over the bubble's grid layout; each portrait owns its toggle. */
.host-portrait-button .host-intro-bubble[hidden],.host-portrait-button .host-click-cue[hidden] {display:none!important;}
.host-portrait-button .host-intro-bubble,.host-portrait-button .host-click-cue {pointer-events:none;}
.route-photo-frame {position:relative;isolation:isolate;}
.route-photo-frame:after {content:'';position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#071a22cc);pointer-events:none;z-index:1;}
.route-photo-frame .arrival {position:absolute;bottom:15px;left:18px;right:18px;margin:0;padding:0;color:white;z-index:2;}
.route-photo-frame .arrival-date {font-size:10px!important;margin:0 0 8px;color:#fff!important;letter-spacing:.05em;}
.route-photo-frame .countdown {color:#fff;gap:6px;}
.route-photo-frame .countdown-unit {padding:0;border:0;background:none;}
.route-photo-frame .countdown-unit strong {font-size:clamp(1.25rem,2.2vw,1.8rem);}
.route-photo-frame .countdown-unit small {margin-top:3px;color:#fff;}
.route-content {padding:18px 22px;gap:8px;}
.route-content h3 {font-size:1.55rem;margin:0;}
.route-content p {margin:0;}
.route-content .route-label {margin-top:6px;}
.discover-section > .section-head {margin-bottom:12px;}
.discover-section .travel-map-layout {row-gap:14px;}
.discover-section .map-journal {padding:14px 20px;box-shadow:none;}
.discover-section .map-journal h3 {font-size:1.5rem;line-height:1.2;margin:0 0 6px;}
.discover-section .map-journal p {margin:0;font-size:.85rem;line-height:1.5;}
.discover-section .map-journal .eyebrow {margin-bottom:6px;}
.discover-section .footprint-journal {padding-block:4px;}
.discover-section .footprint-journal h3 {font-size:1.7rem;margin:4px 0 8px;}
.discover-section .footprint-journal p {margin-block:5px;}
@media(prefers-reduced-motion:reduce) {.memory-launch .memory-click,.camp-pointer {animation:none;}}
.meadow-tree {position:absolute;z-index:0;right:calc(15% - 82px);bottom:calc(24% - 37px);width:210px;padding:0;border:0;background:none;cursor:zoom-in;line-height:0;}
.meadow-tree img {display:block;width:100%;height:auto;filter:drop-shadow(5px 8px 5px #061e2440);}
.meadow-tree>span {position:absolute;top:57%;left:50%;transform:translateX(-50%);white-space:nowrap;color:white;text-shadow:0 1px 4px #000;font:10px/1.3 Arial,sans-serif;background:#10221e88;padding:4px 7px;border-radius:20px;}
.meadow-tree:focus-visible {outline:2px solid white;outline-offset:5px;}
.tree-poster-dialog {width:min(480px,88vw);max-height:92dvh;padding:12px;border:1px solid #c5b48b;border-radius:10px;background:#231b12;color:#fff9e9;overflow:auto;box-shadow:0 25px 100px #0009;}
.tree-poster-dialog::backdrop {background:#04110de0;backdrop-filter:blur(5px);}
.tree-poster-crop {position:relative;aspect-ratio: .65;overflow:hidden;border-radius:5px;}
.tree-poster-crop img {position:absolute;width:260%;max-width:none;height:auto;left:50%;top:50%;transform:translate(-50%,-60%);}
.tree-poster-close {position:absolute;top:17px;right:17px;z-index:2;width:38px;height:38px;border:1px solid #fff8;border-radius:50%;background:#17251eee;color:white;font-size:25px;cursor:pointer;}
.tree-poster-dialog p {text-align:center;font:12px/1.5 Georgia,serif;margin:12px 0 2px;}
@media(max-width:700px){.meadow-tree {right:calc(12% - 64px);width:175px;}}
/* Keep the meadow detail at landscape scale, with subdued natural color. */
.meadow-tree {width:92px;right:calc(15% - 22px);bottom:calc(24% - 30px);}
.meadow-tree img {filter:saturate(.38) brightness(.83) contrast(.8);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 90%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 90%,transparent 100%);}
.meadow-tree>span {display:block;top:18%;left:50%;padding:3px 6px;background:#15272055;border:1px solid #ffffff20;border-radius:12px;color:#fff9e9;font:9px/1.4 Arial,sans-serif;letter-spacing:.02em;text-shadow:0 1px 3px #0008;opacity:.85;transition:opacity .2s,background .2s;}
.meadow-tree:hover>span,.meadow-tree:focus-visible>span {opacity:1;background:#152720a0;}
.meadow-tree:focus-visible {outline:1px dashed #fff9;}
/* Never enlarge a tiny crop of the poster: show the complete source image. */
.tree-poster-dialog {width:min(480px,88vw);background:#18231d;border-color:#ffffff30;}
.tree-poster-crop {aspect-ratio:auto;overflow:visible;}
.tree-poster-crop img {position:static;display:block;width:100%;max-width:100%;height:auto;transform:none;border-radius:4px;}
@media(max-width:700px){.meadow-tree {width:80px;right:calc(12% - 19px);}}

/* Leave the trunk clear while keeping the landing and light aligned. */
.closing {--seated-right:max(8px, calc(15% - 60px));}
.mountain-sitter {right:var(--seated-right);}
.mountain-paraglider.has-landed {right:calc(var(--seated-right) + 38px);}
.mountain-blessing-light {right:calc(var(--seated-right) - 55px);}
@media(max-width:700px){.closing {--seated-right:max(8px, calc(12% - 50px));}.meadow-tree {right:calc(12% + 6px);}}

/* Explicit dimensions keep the inline SVG hearts visible above the scene. */
.sky-blessing-heart {display:block;width:32px;height:32px;}
.sky-blessing-heart svg {display:block;width:100%;height:100%;overflow:visible;}

/* Host details and touch-friendly controls. */
.host-click-cue {top:50%;left:50%;bottom:auto;transform:translate(-50%,-50%);padding:0;background:none;border:0;border-radius:0;color:#fff;font:600 16px/1.2 "DM Sans",sans-serif;text-shadow:0 1px 5px #0008;animation:host-cue-pulse 1s ease-in-out infinite;}
@keyframes host-cue-pulse {0%,100%{opacity:1;transform:translate(-50%,-50%) scale(1)}50%{opacity:.45;transform:translate(-50%,-50%) scale(1.06)}}
.host-card .host-university .fordham-logo {width:44px;height:44px;}
.host-university:has(.fordham-logo) a {flex-wrap:nowrap;justify-content:flex-start;gap:6px;margin:0;padding:0;}
.host-university:has(.fordham-logo) a span {min-width:0;}
.host-university a {flex-wrap:wrap;}
.host-card .host-hometown {margin:3px 0 10px;font-size:10.5px;line-height:1.5;}
.host-hometown-prefix {display:block;}
.host-hometown-place {display:inline-flex;align-items:center;gap:4px;white-space:nowrap;}
.host-card .host-hometown .hometown-decoration {display:inline-block;width:20px;height:30px;aspect-ratio:auto;object-fit:contain;flex:none;border-radius:0;transform-origin:50% 90%;animation:hometown-sway 4s ease-in-out infinite;}
@keyframes hometown-sway {0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@media(prefers-reduced-motion:reduce) {.host-card .host-hometown .hometown-decoration {animation:none;}}
.ig-post-image .social-hype-hearts i,.yt-feed-thumbnail .social-hype-hearts i {left:calc(18% + var(--heart)*28%);animation-delay:calc(var(--heart)*.9s);}
.post-view-count {font-variant-numeric:tabular-nums;white-space:nowrap;}
.gps-poll-options button {position:relative;min-height:44px;background-image:linear-gradient(90deg,#ffffff30 var(--poll-share,0%),transparent var(--poll-share,0%));transition:background-position .2s;}
.gps-poll-options button:disabled {cursor:default;opacity:1;}
.gps-poll-options button:focus-visible {outline:3px solid #273d59;outline-offset:4px;}
/* Center the trunk between the seated friends without moving their animation. */
.meadow-tree {right:calc(var(--seated-right) - 5px);}
/* Only the poster sits above speech bubbles; the rest of the tree stays behind. */
.meadow-tree {z-index:auto;}
.meadow-tree::after {content:"";position:absolute;inset:0;z-index:3;background:url('assets/meadow-poster-tree.webp') center/100% 100% no-repeat;clip-path:polygon(40% 46%,60% 46%,65% 72%,39% 72%);filter:saturate(.38) brightness(.83) contrast(.8);pointer-events:none;}
@media(max-width:700px) {
  .meadow-tree {right:calc(var(--seated-right) + 1px);}
  .host-flags {right:0;}
  .host-card figcaption {overflow-wrap:anywhere;}
  .host-university a {gap:4px;}
  .host-card .host-university img[src$="fordham-ram.svg"] {max-width:100%;}
  dialog {max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overscroll-behavior:contain;}
  .meeting-story {width:calc(100vw - 24px);}
  .memory-launch {touch-action:manipulation;}
  .memory-controls button,.meeting-close,.tree-poster-close,.city-popup-close {min-width:44px;min-height:44px;}
  .gps-poll {width:calc(100% - 24px);margin-inline:12px;}
  .gps-poll-status {font-size:12px;}
  .site-header nav.is-open {flex-wrap:wrap;}
  .traveler-tabs button,.globe-mode-switch button,.footprint-reset,.planned-reset {min-height:44px;}
}
@media(prefers-reduced-motion:reduce) {.host-click-cue {animation:none;}}

/* Match the visible flag artwork, including the source PNG's transparent margins. */
.host-flags .host-flag .host-us-flag {width:24px;height:21px;}
/* Feed icon defaults must not turn the floating TikTok-style hearts into outlines. */
.social-hype-hearts svg {fill:currentColor;stroke:none;stroke-width:0;}
.social-instagram .phone .instagram-ui {display:flex;flex-direction:column;}
.social-instagram .instagram-ui > * {flex-shrink:0;}
.social-instagram .instagram-ui .ig-post-image {flex:1 1 auto;min-height:0;aspect-ratio:auto;overflow:hidden;}
.social-instagram .ig-post-copy {color:#101010;background:#fff;}
.social-instagram .ig-like-count {display:block;font-weight:700;line-height:1.5;font-variant-numeric:tabular-nums;}
.mountain-paraglider.has-landed {right:calc(var(--seated-right) + 38px + .5cm);}

/* A final invitation after the blessing; the poster remains visitor-controlled. */
.poster-discovered .mountain-friend > span[hidden] {display:none!important;}
.poster-discovered .poster-traveler {overflow:visible;transform-origin:50% 85%;}
.poster-discovered .mountain-friend > span {display:none;}

/* Muted alpine greens and a quiet breeze, anchored at the existing roots. */
.meadow-tree {--tree-landscape-tone:saturate(.48) hue-rotate(12deg) brightness(.76) contrast(.88);}
.meadow-tree img,.meadow-tree::before,.meadow-tree::after {
  filter:var(--tree-landscape-tone);
  transform-origin:50% 100%;
  animation:meadow-tree-breeze 9s ease-in-out infinite;
}
/* Tone the grass separately so the canopy and poster keep their existing color. */
.meadow-tree img {
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 76%,transparent 84%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 76%,transparent 84%);
}
.meadow-tree::before {
  content:"";position:absolute;inset:0;pointer-events:none;
  background:url('assets/meadow-poster-tree.webp') center/100% 100% no-repeat;
  filter:saturate(.18) hue-rotate(15deg) brightness(.62) contrast(.85);
  -webkit-mask-image:linear-gradient(to bottom,transparent 76%,#000 84%,#000 88%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 76%,#000 84%,#000 88%,transparent 100%);
}
.meadow-tree > .poster-arrow {
  display:none;
  top:57%;left:69%;z-index:4;padding:0;border:0;border-radius:0;
  background:none;color:#fff;font:17px/1 Arial,sans-serif;
  text-shadow:0 1px 3px #0009;pointer-events:none;
  transform:translateY(-50%);animation:poster-arrow-pulse 1s ease-in-out infinite;
}
.poster-ending-complete .meadow-tree > .poster-arrow {display:block;}
.meadow-tree:hover > .poster-arrow,.meadow-tree:focus-visible > .poster-arrow {background:none;}
@keyframes poster-arrow-pulse {
  0%,100% {opacity:.55;transform:translateY(-50%);}
  50% {opacity:1;transform:translate(-2px,-50%) scale(1.08);}
}
@media(prefers-reduced-motion:reduce) {.meadow-tree > .poster-arrow {animation:none;opacity:1;}}
@keyframes meadow-tree-breeze {
  0%,100% {transform:skewX(0deg);}
  30% {transform:skewX(.35deg);}
  70% {transform:skewX(-.25deg);}
}
.meadow-tree:hover img,.meadow-tree:hover::before,.meadow-tree:hover::after,
.meadow-tree:focus-visible img,.meadow-tree:focus-visible::before,.meadow-tree:focus-visible::after {animation-play-state:paused;}
@media(prefers-reduced-motion:reduce) {
  .meadow-tree img,.meadow-tree::before,.meadow-tree::after {animation:none;}
}

/* A tighter, shared editorial edge for the introduction and itinerary. */
.about-section {padding:72px 5vw;gap:clamp(24px,3vw,48px);align-items:start;}
.about-copy {margin:0;max-width:none;}
.about-copy > p:not(.eyebrow) {max-width:52ch;font-size:1.02rem;line-height:1.7;margin-top:22px;}
.hosts {max-width:560px;}
@media(min-width:900px) {
  .about-section {grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .host-card {grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:14px;}
}
.host-card .host-hometown {font-weight:600;white-space:nowrap;font-size:clamp(8px,.88vw,11px);}
.host-hometown-prefix {display:inline;}
.host-hometown-place {display:inline;}
.host-card .host-hometown .hometown-decoration {vertical-align:middle;margin-left:3px;}
@media(max-width:899px) {
  .about-section {grid-template-columns:1fr;}
  .host-card {grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);}
  .host-card .host-hometown {font-size:clamp(8px,2.3vw,11px);}
}
.host-click-cue {animation:host-cue-gentle 3s ease-in-out infinite;}
@keyframes host-cue-gentle {
  0%,33.333%,100% {opacity:0;transform:translate(-50%,-50%) scale(.98);}
  8%,25% {opacity:.95;transform:translate(-50%,-50%) scale(1.02);}
}
.journey-section {padding-bottom:42px;}
.journey-section .section-copy {color:var(--orange);font-family:inherit;font-style:normal;font-size:1rem;}
.discover-section {padding-top:42px;}
.footprint-journal {padding:14px 20px;border:1px solid var(--line);background:var(--cream);}
.camp-magnifier {width:30px;height:40px;}
.camp-magnifier > .perspective-lens {left:4px;top:0;transform:scale(.24);transform-origin:0 0;}
.lost-meter {border-color:#c6a57888;background:linear-gradient(165deg,#273239,#101c22 72%);box-shadow:inset 0 1px 0 #f6dfb930,inset 0 -2px 0 #0007,0 5px 15px #0003;}
.lost-meter-top {position:relative;padding-right:26px;}
.lost-meter-power {position:absolute;right:-1px;top:-1px;display:flex;align-items:center;gap:2px;padding:1px;border:0;background:none;color:#e7caa1;font:5px/1 monospace;cursor:pointer;}
.lost-meter-power::before {content:"";position:absolute;inset:-9px -3px;}
.lost-meter-power i {position:relative;display:block;width:13px;height:7px;background:#0b1418;border:1px solid #b29a7166;border-radius:3px;box-shadow:inset 0 1px 2px #000;}
.lost-meter-power i::after {content:"";position:absolute;top:0;left:6px;width:5px;height:5px;border-radius:1px;background:linear-gradient(#f7ddb1,#a78a60);transition:left .15s;}
.lost-meter-power[aria-checked="false"] i::after {left:0;}
.lost-meter-power:focus-visible {outline:2px solid #f6dfb9;outline-offset:3px;}
.lost-meter meter {outline:1px solid #d7bf8b33;outline-offset:2px;}
.lost-meter::after {content:"";position:absolute;left:9px;right:9px;bottom:6px;height:3px;background:repeating-linear-gradient(90deg,#dfc49a77 0 1px,transparent 1px 8px);pointer-events:none;}
.lost-meter.is-off .lost-meter-value,.lost-meter.is-off meter {opacity:.12;filter:grayscale(1);}
.lost-meter.is-off > small {opacity:.55;}
.meadow-tree {--tree-landscape-tone:saturate(.24) hue-rotate(10deg) brightness(.65) contrast(.85);}
@media(prefers-reduced-motion:reduce) {
  .host-click-cue {animation:none;opacity:1;}
  .lost-meter-power i::after {transition:none;}
}

/* Names and Polaroid frames share a column without changing the profile details. */
.host-photo {min-width:0;align-self:center;}
.host-photo > .host-name {display:block;margin:0 0 10px;text-align:center;}
.host-portrait-button {padding:8px 8px 23px;background:#fffdf7;box-shadow:0 2px 4px #443b2420,2px 7px 13px #443b2425;border:1px solid #e3ded1;}
.host-portrait-button > img {border-radius:0;}
.host-portrait-button .host-click-cue {top:calc(50% - 7px);}
.about-section {padding-bottom:12px;}
.about-copy .how-we-met-link {display:block;margin:18px 0 8px;}
.journey-section {padding-top:24px;padding-bottom:16px;}
.journey-section .route-footnote {margin-bottom:0;}
.route-divider {display:flex;align-items:center;justify-content:center;gap:clamp(14px,5vw,64px);padding:12px 5vw;background:var(--orange);color:#fff8e9;font:600 12px/1.3 "DM Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;}
.route-divider i {font-style:normal;}
.discover-section {padding-top:24px;padding-bottom:0;}
.discover-section .footprint-browser {margin-bottom:0;}
.discover-section .traveler-destinations > section {padding-bottom:12px;}
.watch-section {margin-top:0;padding-top:4px;padding-bottom:4px;}
.watch-intro {margin:0 0 8px;padding-top:8px;margin-left:-2vw;}
.watch-intro > .eyebrow {margin:0;}
.watch-intro > .socials-title {margin-top:8px;}
@media(max-width:700px) {
  .route-divider {font-size:10px;gap:14px;padding-block:10px;}
  .host-portrait-button {padding:5px 5px 17px;}
  .watch-section {padding-top:4px;padding-bottom:4px;}
}

/* Production polish: preserve labels and give decorative interactions room. */
.services .service-icon {position:absolute;left:50%;top:50%;width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;color:var(--orange);opacity:0;transform:translate(-50%,-40%) scale(.8);transition:opacity .2s,transform .2s;pointer-events:none;}
.service-label {transition:opacity .2s;}
@media (hover:hover) {.services button:hover .service-label {opacity:0;} .services button:hover .service-icon {opacity:1;transform:translate(-50%,-50%) scale(1);}}
.services button:focus-visible .service-label {opacity:0;}
.services button:focus-visible .service-icon {opacity:1;transform:translate(-50%,-50%) scale(1);}
.watch-section {padding-bottom:40px;}
#journey .section-copy {font-family:"DM Sans",sans-serif;font-size:.9rem;line-height:1.7;}
@media(max-width:650px) {dialog.van-cinema {width:100vw;max-width:100vw;margin:0;max-height:100dvh;} .van-steering {width:75px;height:75px;border-width:9px;} .van-headrest {padding:10px;border-radius:25px;} .van-passenger-seat .van-headrest {padding:8px;} .van-cabin::after {box-shadow:inset 0 0 45px 12px #05080d80;} .van-seat-pocket span {font-size:11px;} .van-windshield {left:8%;width:84%;border-width:12px;}}
@media(prefers-reduced-motion:reduce) {.services .service-icon,.service-label {transition:none;}}

@media(max-width:700px) {.hero {background-image:linear-gradient(90deg,rgba(0,0,0,.60),rgba(0,0,0,.12) 85%),url("https://images.unsplash.com/photo-1531968455001-5c5272a41129?auto=format&fit=crop&w=1000&q=85");} .van-video-controls button {min-width:44px;min-height:44px;} }
@media(prefers-reduced-motion:reduce) {html {scroll-behavior:auto;}}

/* Keep the closing scene speech bubble within narrow viewports. */
@media(max-width:700px){.mountain-sitter > span{left:auto;right:0;transform:none;}}
/* The story leads; its small Polaroid is a natural pause in the text. */
.meeting-copy .meeting-album {width:min(100%,350px);margin:16px auto 8px;padding:8px 8px 4px;background:transparent;border:0;}
.meeting-copy .paper-stage {height:265px;overflow:hidden;}
.meeting-copy .paper-card-wrap {width:180px;}
.meeting-copy .paper-card {padding:7px 7px 0;}
.meeting-copy .memory-caption {height:42px;min-height:42px;padding:6px 4px;font-size:11px;line-height:1.3;overflow:hidden;}
.meeting-copy .memory-image {aspect-ratio:1;object-fit:contain;}
.meeting-copy .memory-credit {font-size:8px;margin-top:0;}
.meeting-copy .memory-launch .memory-click {font-size:11px;left:calc(50% + 25px);}
.meeting-copy .camp-pointer {width:23px;height:30px;}
.meeting-copy>p:not(.eyebrow) {font-size:.95rem;line-height:1.7;margin-top:16px;}
.watch-section .socials-title {font-size:clamp(3.5rem,8vw,8rem);}
.route-card {border-radius:9px;overflow:hidden;border:1px solid #c56c3b28;}
.route-content {border-top:2px solid #ca693744;}
.route-content .eyebrow {color:#bc552b;letter-spacing:.09em;}
.route-content p:not(.eyebrow) {font-size:.88rem;line-height:1.65;}
.route-label {color:#ae512d;border-color:#ca693744;}

/* Keep the social reveal close to its earlier, more readable footprint. */
.socials-showcase{width:min(68vw,640px);height:clamp(380px,48vw,600px)}
.social-card{width:min(23vw,220px);height:clamp(340px,46vw,600px)}
.paper-card-wrap{width:min(255px,72%)}
.memory-plane{width:138px;height:auto}
@media(max-width:700px){.socials-showcase{width:min(88vw,470px);height:clamp(350px,94vw,510px)}.social-card{width:min(27vw,175px);height:clamp(315px,87vw,470px)}.paper-card-wrap{width:min(220px,76%)}}

/* Keep the hometown with its portrait and trim the countdown cards by ~1 inch. */
.host-portrait{min-width:0;align-self:center;}
.host-card .host-portrait .host-hometown{margin:14px 0 0;text-align:center;white-space:normal;font-size:10.5px;line-height:1.5;}
.host-portrait .host-hometown-prefix{display:block;}
.host-portrait .host-hometown-place{display:inline-flex;align-items:center;}
.route-photo-frame>img{height:164px;}
@media(max-width:700px){.route-photo-frame>img{height:clamp(164px,calc(50vw - 96px),304px);}}

.location-gps[role="button"]{cursor:pointer;}
.location-gps[role="button"]:focus-visible{outline:3px solid #ff9a66;outline-offset:6px;}

/* Destination filters and real film stills in the personal collection. */
.portfolio-stop-filters{display:flex;flex-wrap:wrap;gap:8px;padding:0 28px 12px;}
.portfolio-stop-filters button{min-height:44px;padding:9px 14px;border:1px solid #b8b1a1;border-radius:24px;background:transparent;color:#233f40;cursor:pointer;font-size:12px;}
.portfolio-stop-filters button[aria-pressed="true"]{background:#233f40;color:#fff6e5;border-color:#233f40;}
.portfolio-filter-status{margin:0;padding:0 28px 12px;font:11px/1.5 monospace;color:#5a6661;}
.portfolio-filter-status:empty{display:none;}
.portfolio-tile[hidden]{display:none;}
.portfolio-tile.has-film-poster{position:relative;}
.has-film-poster .portfolio-film{position:absolute;inset:0 0 30px;min-height:0;background:linear-gradient(transparent,#081f2a80);gap:8px;}
.has-film-poster .portfolio-film strong{display:none;}
.has-film-poster .portfolio-film>span{filter:drop-shadow(0 2px 5px #0009);}
.portfolio-tile-caption{overflow-wrap:anywhere;}
@media(max-width:650px){.portfolio-stop-filters{padding-inline:15px;}.portfolio-filter-status{padding-inline:15px;}}

/* Give each half of the storybook its own text column and a clear binding. */
.meeting-story{width:min(1040px,calc(100vw - 28px));}
.meeting-copy{padding:30px clamp(22px,4vw,44px);}
.meeting-book-spread{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(42px,6vw,72px);}
.meeting-page{min-width:0;}
.meeting-page h2{font-size:clamp(32px,4vw,48px);}
.meeting-page>p:not(.eyebrow){margin:18px 0 0;color:var(--muted);font-size:.95rem;line-height:1.8;}
.meeting-page-right{padding-top:16px;}
.meeting-page-right>p:first-child{margin-top:0;}
.meeting-page-right>p:last-child{color:var(--ink);}
.meeting-copy .meeting-soundtrack{margin-top:30px;padding:24px 18px;background:#f7f1e3;border-top:1px solid #d6c6a6;border-bottom:1px solid #d6c6a6;}
@media(max-width:700px){.meeting-story{background:#fff9ec;}.meeting-book-spread{grid-template-columns:minmax(0,1fr);gap:26px;}.meeting-page-right{padding-top:26px;border-top:1px solid #d6c6a6;}.meeting-copy{padding:26px 22px;}}

/* The account invitation is visible only while hovering over its social link. */
.contact-followers a[data-follow-label]{position:relative;}
.contact-followers a[data-follow-label]::after{content:attr(data-follow-label);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);z-index:5;width:max-content;max-width:220px;padding:9px 12px;border-radius:5px;background:#233f40;color:#fff8e8;box-shadow:0 3px 12px #0002;font:11px/1.5 "DM Sans",sans-serif;text-align:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s;}
@media(hover:hover){.contact-followers a[data-follow-label]:hover::after{opacity:1;visibility:visible;}}

/* Zoomable maps keep markers readable and anchored with quiet leader lines. */
.footprint-globe{overflow:hidden;isolation:isolate;}
.globe-leaders{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;}
.globe-leaders line{stroke:#e0efe0a6;stroke-width:1;stroke-dasharray:2 3;}
.footprint-globe .footprint-marker,.footprint-globe .planned-pin{transform:translate(-50%,-50%);}
.footprint-globe .footprint-marker{min-width:44px;min-height:44px;justify-content:center;align-items:center;}
.footprint-globe-controls{flex-wrap:wrap;justify-content:space-between;gap:10px;}
.footprint-globe-controls>span{flex:1 1 150px;}
.globe-zoom-controls{display:flex;align-items:center;gap:4px;}
.globe-zoom-controls button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #b5d6d360;border-radius:50%;background:#173c40;color:#edf6e8;font:24px/1 sans-serif;cursor:pointer;}
.globe-zoom-controls button:disabled{opacity:.35;cursor:default;}
.globe-zoom-controls output{min-width:40px;text-align:center;color:#d7e9e6;font:11px monospace;font-variant-numeric:tabular-nums;}

/* On phones, each social preview gets a full readable screen and its own swipe stop. */
@media(max-width:700px){
 .watch-section .socials-showcase{display:flex;align-items:flex-start;gap:26px;width:100%;max-width:100%;height:auto;min-height:0;padding:24px max(24px,calc((100% - 280px)/2)) 38px;margin:20px auto 0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:max(24px,calc((100% - 280px)/2));overscroll-behavior-x:contain;perspective:1100px;transform-style:preserve-3d;scrollbar-color:#9eb4b4 #ffffff12;}
 .watch-section .social-card,.watch-section .social-card.is-featured{position:relative;inset:auto;flex:0 0 min(280px,76vw);width:min(280px,76vw);height:auto;transform:none;scroll-snap-align:center;will-change:auto;}
 .watch-section .phone-wrap{width:100%;}
 .watch-section .phone{transform:none;aspect-ratio:9/19.5;border-radius:34px;}
 .watch-section .phone-screen{border-radius:27px;}
 .watch-section .phone-buttons{display:none;}
 .watch-section .phone .app-ui.feed-app{inset:0;padding:30px 0 48px;}
 .watch-section .phone .app-ui.tiktok-ui{inset:0;padding:0;}
 .watch-section .youtube-ui{display:flex;flex-direction:column;}
 .watch-section .youtube-ui>*{flex-shrink:0;}
 .watch-section .yt-shorts-grid{flex:1;min-height:0;overflow:hidden;}
 .watch-section .yt-shorts-grid>div{aspect-ratio:auto;}
 .watch-section .tiktok-feed-actions{bottom:72px;right:5%;gap:8px;}
 .watch-section .tiktok-feed-action svg{width:24px;height:24px;}
 .watch-section .tiktok-feed-caption{bottom:64px;right:25%;}
 .watch-section .tiktok-feed-tabs{top:35px;gap:14px;}
 .watch-section .social-hype-screen>b{font-size:12px;line-height:1.65;}

}

/* Lift through depth after the boom, then settle into a floating fan. */
.watch-section .phone-wrap{transform-style:preserve-3d;}
.watch-section .phone{transform:perspective(1100px) translateY(var(--phone-bob,0px)) rotateY(var(--phone-tilt,0deg)) rotateZ(var(--phone-roll,0deg));}
.socials-showcase.reveal-exploding .phone-wrap{animation:phones-depth-arrival 4.2s cubic-bezier(.2,.75,.25,1) both;}
@keyframes phones-depth-arrival{0%,39%{transform:perspective(1000px) translate3d(0,90px,-550px) rotateY(-100deg) rotateX(30deg) scale(.25);filter:blur(7px);}72%{transform:perspective(1000px) translate3d(0,-16px,60px) rotateY(12deg) rotateX(-6deg) scale(1.03);filter:blur(0);}100%{transform:perspective(1000px) translate3d(0,0,0) rotateY(0) rotateX(0) scale(1);filter:none;}}
@media(max-width:700px){
 .watch-section .socials-showcase.reveal-armed{overflow:hidden;}
 .watch-section .socials-showcase .social-burst{width:100%;height:100%;}
 .watch-section .socials-showcase.reveal-armed .social-card{opacity:0;pointer-events:none;}
 .watch-section .socials-showcase.reveal-exploding .social-card{animation:epic-phones-visible 4.2s linear both;pointer-events:auto;}
 .watch-section .socials-showcase.reveal-exploding .phone-wrap{animation:phones-depth-arrival 4.2s cubic-bezier(.2,.75,.25,1) both;}
 .watch-section .explosion-cloud{width:160%;}
 .watch-section .explosion-trigger-plane{width:110px;}
}
@media(prefers-reduced-motion:reduce){.watch-section .phone,.watch-section .phone-wrap{transform:none;animation:none!important;}.watch-section .socials-showcase .social-card{opacity:1;animation:none!important;}}

/* A fixed map frame contains the drawing; pins remain attached to geography. */
.planned-surface{border:1px solid #b7d6cc70;border-radius:20px;box-shadow:inset 0 0 0 5px #102d3a;}
.footprint-globe .planned-pin{transform:translate(-50%,-100%);}
.planned-pin[data-cluster-count]::after{content:attr(data-cluster-count);position:absolute;top:-5px;right:-8px;display:grid;place-items:center;min-width:20px;height:20px;border:1px solid #fff0bd;border-radius:50%;background:#173c40;color:#fff0bd;font:bold 11px sans-serif;}

/* Vertical gestures continue down the page; globe gestures never scale the surrounding scene. */
.footprint-globe{touch-action:pan-y;}

/* A pocket-sized doorway into John and Mateo's personal rotation. */
.hero-instruments{position:absolute;z-index:3;right:5vw;bottom:8vh;display:flex;align-items:center;gap:10px;}
.hero-instruments .lost-meter{position:relative;inset:auto;flex-shrink:0;}
.top-picks-launch{position:relative;display:grid;place-items:center;width:44px;height:44px;border:0;padding:0;background:none;cursor:pointer;transition:transform .2s;}
.top-picks-launch img{display:block;width:32px;height:42px;object-fit:contain;filter:drop-shadow(0 3px 4px #0005);}
.top-picks-launch span{position:absolute;top:calc(100% + 7px);right:0;width:max-content;font:8px monospace;letter-spacing:.06em;color:#fff3d7;}
.top-picks-launch:hover{transform:rotate(7deg) translateY(-3px);}
.top-picks-launch:focus-visible{outline:2px solid #b7fd60;outline-offset:5px;border-radius:8px;}
body:has(.top-picks-dialog[open]){overflow:hidden;}
.top-picks-dialog{width:min(940px,calc(100vw - 28px));max-height:90dvh;padding:0;border:1px solid #ffffff30;border-radius:25px;background:#12131b;color:#fff9ef;box-shadow:0 30px 100px #0008;font-family:"DM Sans",sans-serif;overflow:auto;overscroll-behavior:contain;}
.top-picks-dialog::backdrop{background:#080816b8;backdrop-filter:blur(8px);}
.picks-topbar{position:sticky;top:0;z-index:4;display:flex;justify-content:space-between;align-items:center;padding:12px 22px;background:#12131bef;backdrop-filter:blur(12px);font:9px monospace;letter-spacing:.1em;}
.picks-close{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;border:1px solid #ffffff40;border-radius:50%;background:#ffffff0c;color:white;font-size:28px;cursor:pointer;}
.picks-hero{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:30px;padding:28px 35px 38px;background:radial-gradient(ellipse at top right,#c25b2588,transparent 65%),linear-gradient(140deg,#714cbd,#3c356c 55%,#151820);}
.picks-cover{position:relative;display:grid;grid-template-columns:1fr 1fr;aspect-ratio:1;max-width:300px;box-shadow:0 20px 35px #0005;transform:rotate(-5deg);border:7px solid #f7e059;}
.picks-cover img{width:100%;height:100%;aspect-ratio:1;object-fit:cover;filter:saturate(.85);}
.picks-cover:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent,#18112bab);}
.picks-cover>span{position:absolute;z-index:1;bottom:8px;left:12px;color:#e6ff65;font:900 clamp(28px,5vw,56px)/.92 "DM Sans",sans-serif;letter-spacing:-.07em;text-shadow:2px 3px #27212e;}
.picks-eyebrow{font:9px/1.5 monospace;letter-spacing:.12em;color:#e1fd88;}
.picks-hero h2{margin:14px 0;font:800 clamp(42px,7vw,78px)/.94 "DM Sans",sans-serif;letter-spacing:-.06em;}
.picks-hero h2 em{font-style:normal;color:#dfff72;}
.picks-hero p:not(.picks-eyebrow){max-width:320px;font-size:14px;line-height:1.6;color:#efe6ff;}
.picks-count{display:inline-block;margin-top:12px;padding:7px 11px;border:1px solid #ffffff30;border-radius:20px;font-size:10px;background:#0002;}
.picks-filters{display:flex;gap:8px;padding:22px 30px 8px;overflow:auto;}
.picks-filters button{min-height:44px;padding:10px 17px;white-space:nowrap;border:1px solid #ffffff30;border-radius:30px;background:#272834;color:#fff;font:600 12px "DM Sans",sans-serif;cursor:pointer;}
.picks-filters button[aria-pressed="true"]{background:#dfff72;color:#16251a;border-color:#dfff72;}
.picks-content{padding:0 30px 30px;}
.picks-section{margin-top:30px;}.picks-section header>span{font:9px monospace;letter-spacing:.15em;color:#ffb2dc;}.picks-section h3{margin:8px 0 20px;font:700 clamp(20px,3vw,28px)/1.2 "DM Sans",sans-serif;letter-spacing:-.03em;}
.picks-track-list{display:grid;gap:8px;}.picks-track{display:grid;grid-template-columns:24px 62px minmax(0,1fr) 40px;gap:14px;align-items:center;padding:12px;border-radius:12px;background:linear-gradient(100deg,#353148,#21232d);color:white;text-decoration:none;transition:background .2s;}.picks-track:hover{background:#453e5f;}
.picks-track img{width:62px;height:62px;border-radius:7px;object-fit:cover;}.picks-track-number{font:11px monospace;color:#ac9ebf;}.picks-track strong,.picks-track small{display:block;}.picks-track strong{font-size:15px;}.picks-track small{margin-top:5px;font-size:12px;color:#cfbfdc;}.picks-play{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:#dfff72;color:#15221b;font-size:19px;}
.picks-artist-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}.picks-artist{min-width:0;padding:14px 10px 12px;border-radius:16px;background:linear-gradient(160deg,hsl(var(--pick-hue) 55% 34%),#20222d);text-align:center;text-decoration:none;color:white;transition:transform .2s;}.picks-artist:hover{transform:translateY(-4px);}.picks-artist img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border:3px solid hsl(var(--pick-hue) 85% 75%);border-radius:50%;margin-bottom:12px;}.picks-artist strong{display:block;font-size:14px;}.picks-artist small{display:block;margin-top:6px;font-size:10px;color:#e4dbea;}
.picks-show-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}.picks-show{position:relative;overflow:hidden;border-radius:15px;background:#cfa924;color:#fff;text-decoration:none;}.picks-show img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;transition:transform .3s;}.picks-show:hover img{transform:scale(1.04);}.picks-show>span{position:absolute;bottom:0;left:0;right:0;padding:50px 14px 16px;background:linear-gradient(transparent,#100d20f0);}.picks-show small{display:block;color:#dcff74;font:8px monospace;}.picks-show strong{display:block;margin-top:6px;font-size:17px;line-height:1.1;}
.picks-small{display:block;color:#b6b4c7;font:10px/1.5 "DM Sans",sans-serif;margin-top:12px;}.picks-footer{padding:22px 30px;border-top:1px solid #ffffff16;color:#dfff72;font:10px/1.5 monospace;}
.top-picks-dialog a:focus-visible,.top-picks-dialog button:focus-visible{outline:3px solid #fb97d8;outline-offset:3px;}
@media(max-width:700px){.hero-instruments{right:6vw;bottom:95px;}.top-picks-dialog{width:calc(100vw - 14px);max-width:none;max-height:94dvh;border-radius:20px;}.picks-hero{padding:22px 20px 28px;gap:18px;}.picks-hero h2{font-size:44px;}.picks-hero p:not(.picks-eyebrow){font-size:12px;}.picks-eyebrow{font-size:8px;}.picks-count{font-size:9px;}.picks-filters{padding-inline:16px;}.picks-content{padding-inline:16px;}.picks-artist-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}.picks-artist{padding:10px 7px;}.picks-artist strong{font-size:12px;}.picks-show-grid{gap:9px;}.picks-show>span{padding:35px 8px 12px;}.picks-show strong{font-size:12px;}.picks-track{grid-template-columns:16px 48px minmax(0,1fr) 30px;gap:9px;padding:10px;}.picks-track img{width:48px;height:48px;}.picks-track strong{font-size:13px;}.picks-play{width:29px;height:29px;}.picks-topbar{padding-inline:16px;font-size:8px;}}
@media(prefers-reduced-motion:reduce){.top-picks-launch,.picks-artist,.picks-show img{transition:none;}}

/* Keep the small instrument, but give Top Picks a larger phone silhouette. */
.top-picks-launch{width:110px;height:110px;flex-shrink:0;}
.top-picks-launch img{width:80px;height:105px;}
.picks-full-brand{display:inline-block;font-size:.48em;line-height:1.15;letter-spacing:-.04em;}
.picks-cover>span{font-size:clamp(17px,3.2vw,36px);line-height:1.04;letter-spacing:-.045em;}
/* One continuous book binding, including the soundtrack spread. */
.meeting-book-spread,.meeting-copy .meeting-soundtrack{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,60px);}
.meeting-book-spread::after,.meeting-soundtrack::after{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:#b4a38480;box-shadow:2px 0 6px #79684d20;pointer-events:none;}
.meeting-copy .meeting-soundtrack{padding:24px 0;background:transparent;}
.soundtrack-page{min-width:0;}.soundtrack-page-right{display:flex;align-items:center;justify-content:center;}
.soundtrack-page .memory-van{width:100%;max-width:270px;min-width:0;flex:auto;}
.soundtrack-page #meeting-music{width:100%;}.soundtrack-page #meeting-music iframe{width:100%;height:auto;aspect-ratio:16/9;}
@media(max-width:700px){.meeting-copy{padding:24px 14px;}.meeting-story{background:linear-gradient(90deg,#fff9ec 48%,#dfd3bd 50%,#fff9ec 52%);}.meeting-page-right{border-top:0;padding-top:16px;}.meeting-page h2{font-size:clamp(23px,5.4vw,36px);}.meeting-page>p:not(.eyebrow){font-size:12px;line-height:1.65;}.meeting-page .eyebrow{font-size:8px;}.meeting-copy .meeting-soundtrack{gap:24px;}.soundtrack-title{overflow-wrap:anywhere;}.soundtrack-page .van-click{font-size:10px;}.meeting-book-spread .paper-card-wrap{width:90%;}.meeting-book-spread .paper-stage{min-height:200px;height:240px;}}
/* The three readable screens continuously orbit inside a bounded stage. */
.watch-section .socials-showcase{display:block;width:min(90vw,760px);max-width:100%;height:540px;min-height:0;padding:0;overflow:visible;perspective:1400px;scroll-snap-type:none;}
.watch-section .social-card,.watch-section .social-card.is-featured{position:absolute;inset:50% auto auto 50%;width:190px;height:auto;flex:none;will-change:transform;}
.watch-section .phone-wrap{height:auto;width:100%;}
@media(max-width:700px){.watch-section .socials-showcase{width:100%;height:390px;max-width:100%;overflow:visible;}.watch-section .social-card,.watch-section .social-card.is-featured{width:clamp(108px,32vw,155px);position:absolute;inset:50% auto auto 50%;height:auto;}.watch-section .phone{border-radius:23px;}.watch-section .phone-screen{border-radius:18px;}.watch-section .phone .app-ui.feed-app{padding-top:22px;padding-bottom:27px;}.watch-section .tiktok-feed-tabs{top:24px;gap:6px;font-size:8px;}.watch-section .tiktok-feed-actions{bottom:42px;gap:4px;}.watch-section .tiktok-feed-action svg{width:17px;height:17px;}.watch-section .tiktok-feed-caption{bottom:36px;}.watch-section .social-hype-screen>b{font-size:10px;line-height:1.2;}.hero-instruments{gap:5px;}}
.meadow-tree::after{filter:saturate(.85) brightness(1.55) contrast(1.05);}

.book-typing-title{position:relative;}
.book-title-source{display:inline;}
.book-title-visual{position:absolute;inset:0;display:block;pointer-events:none;font:inherit;letter-spacing:inherit;line-height:inherit;color:inherit;}
.book-type-cursor{display:inline-block;width:2px;height:.9em;margin-left:.08em;background:currentColor;vertical-align:-.04em;animation:book-cursor-blink 1s steps(1,end) infinite;}
@keyframes book-cursor-blink{0%,49%{opacity:1;}50%,100%{opacity:0;}}
.watch-section .phone-size-frame{position:absolute;top:0;left:50%;width:280px;height:606.67px;transform:translateX(-50%) scale(var(--phone-fit,.68));transform-origin:50% 0;}
.watch-section .phone-size-frame .phone{width:280px;height:606.67px;aspect-ratio:9/19.5;border-radius:34px;}
.watch-section .phone-size-frame .phone-screen{border-radius:27px;}
.watch-section .phone-size-frame .phone .app-ui.feed-app{padding:30px 0 48px;}
.watch-section .phone-size-frame .tiktok-feed-tabs{top:35px;gap:14px;font-size:12px;}
.watch-section .phone-size-frame .tiktok-feed-actions{bottom:72px;right:5%;gap:8px;}
.watch-section .phone-size-frame .tiktok-feed-action svg{width:24px;height:24px;}
.watch-section .phone-size-frame .tiktok-feed-caption{bottom:64px;right:25%;}
.watch-section .phone-size-frame .social-hype-screen>b{font-size:17px;line-height:1.4;}
@media(prefers-reduced-motion:reduce){.book-type-cursor{animation:none;}}

.hall-restaurant{display:block;margin-top:24px;overflow:hidden;border:1px solid #c6ac72;border-radius:10px;text-align:left;color:inherit;text-decoration:none;background:#fffaf0}.hall-restaurant>img{display:block;width:100%;height:240px;object-fit:cover}.hall-restaurant>span{display:grid;gap:12px;padding:22px}.hall-restaurant small{font-size:10px;letter-spacing:.12em}.hall-restaurant strong{font:28px Georgia,serif}.hall-restaurant p{margin:0;line-height:1.6}.hall-restaurant b{font-size:12px;text-decoration:underline;text-underline-offset:4px}.hall-restaurant:hover{box-shadow:0 8px 24px #142e3220}.hall-restaurant:focus-visible{outline:3px solid #b47b30;outline-offset:4px}
.hall-restaurant,.hall-restaurant strong,.hall-restaurant p,.hall-restaurant b{color:#243d3c}.hall-restaurant small{color:#78603b}.hall-restaurant>span>strong{display:block;font-size:26px;line-height:1.2}.hall-restaurant>span>p{color:#425653}.hall-restaurant>span>b{display:block;color:#243d3c}
.trip-stat-note{display:block;color:#c9bea8;font:11px/1.7 'DM Sans',sans-serif;margin-top:8px;letter-spacing:0}
.gps-traveler-faces{display:flex;align-items:flex-end;justify-content:center;filter:drop-shadow(0 4px 4px #0004)}.gps-traveler-faces img{width:65%;height:auto;object-fit:contain}.gps-traveler-faces img+img{margin-left:-20%}
.gps-readout .gps-lost{font-size:clamp(8px,1.1vw,12px)}
.satellite-readouts .distance-board{display:flex;height:30px;gap:2px;max-width:100%;margin-bottom:10px}.satellite-readouts .distance-board svg{width:17px;min-width:0}.distance-board .board-space{width:7px;flex-shrink:0}
.gps-travelers>svg{scale:1;transform-origin:50% 100%}
@media(max-width:700px){.satellite-readouts .distance-board{height:24px;gap:1px}.satellite-readouts .distance-board svg{width:13px}.distance-board .board-space{width:4px}}
/* Shared baselines and fully spelled units in the same segmented lettering. */
.satellite-readouts>div:first-child{grid-column:1/-1}
.satellite-readouts dd{min-height:42px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}
.satellite-readouts .distance-board{display:grid;grid-template-columns:145px minmax(0,1fr);align-items:center;width:100%;height:42px;margin:0 0 12px;gap:20px}
.distance-board .board-number,.distance-board .board-unit{display:flex;align-items:center;height:100%;gap:4px}
.satellite-readouts .distance-board .board-number svg{width:25px;height:42px;flex:0 0 25px}
.satellite-readouts .distance-board .board-unit{gap:3px;height:20px}
.satellite-readouts .distance-board .board-unit svg{width:11px;height:20px;flex:0 0 11px}
@media(max-width:700px){.satellite-readouts dd{min-height:28px}.satellite-readouts .distance-board{grid-template-columns:98px minmax(0,1fr);height:28px;gap:12px}.distance-board .board-number{gap:2px}.satellite-readouts .distance-board .board-number svg{width:17px;height:28px;flex-basis:17px}.satellite-readouts .distance-board .board-unit{gap:2px;height:15px}.satellite-readouts .distance-board .board-unit svg{width:8px;height:15px;flex-basis:8px}}
/* Right-align the figures; unit labels share a fixed left edge. */
.satellite-readouts .distance-board .board-number{justify-content:flex-end;width:100%;gap:4px}
.satellite-readouts .distance-board .board-unit{justify-content:flex-start;align-self:center}
@media(max-width:700px){.satellite-readouts .distance-board .board-number{gap:2px}}