/* ─── gogee gogee — section components ────────────────────────────────────────
   Bento, feature rows, booking, maps, Beacon, Your World, stamps gallery, trade,
   social, memory map, CTA, footer. Enriched depth + interaction states. */

/* ─── Everything / bento ──────────────────────────────────────────────────── */
.everything{ position:relative; z-index:1; max-width:var(--maxw); margin:0 auto; padding:clamp(3.5rem,7vw,6rem) clamp(1.1rem,4vw,2.6rem); }
.everything__head{ text-align:center; max-width:700px; margin:0 auto clamp(2.2rem,4vw,3.2rem); }
.everything__head .kicker{ display:block; margin-bottom:.9rem; }
.everything__head h2{ font-weight:900; letter-spacing:-.03em; font-size:clamp(1.9rem,4.4vw,3.2rem); }
.everything__head h2 em{ color:var(--saffron); }
.bento{ display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; max-width:1080px; margin:0 auto; }
.bento__card{ position:relative; display:flex; gap:1.15rem; align-items:flex-start; background:var(--paper); border:1.5px solid rgba(11,58,111,.12); border-radius:20px; padding:1.5rem 1.6rem; transition:transform .4s var(--ease), box-shadow .4s, border-color .4s; transform-style:preserve-3d; overflow:hidden; }
.bento__card::after{ content:''; position:absolute; inset:0; border-radius:20px; opacity:0; transition:opacity .4s;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,0%), rgba(242,169,59,.12), transparent 45%); pointer-events:none; }
.bento__card:hover{ box-shadow:var(--sh-lg); border-color:rgba(242,169,59,.4); }
.bento__card:hover::after{ opacity:1; }
.bento__i{ flex:none; width:54px; height:54px; border-radius:15px; background:linear-gradient(145deg, rgba(91,160,208,.22), rgba(91,160,208,.08)); display:grid; place-items:center; box-shadow:inset 0 0 0 1px rgba(11,58,111,.06); transition:transform .4s var(--ease); }
.bento__card:hover .bento__i{ transform:translateZ(28px) rotate(-6deg) scale(1.06); }
.bento__body{ min-width:0; transform:translateZ(14px); }
.bento__card h4{ font-weight:700; font-size:1.1rem; letter-spacing:-.01em; color:var(--ink); }
.bento__card p{ color:var(--cobalt); font-size:.88rem; line-height:1.5; margin-top:.4rem; opacity:.92; }
.bento__card p strong{ color:var(--ink); }
.bento__tags{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.8rem; }
.bento__tags span{ font-family:var(--mono); font-size:.6rem; font-weight:700; letter-spacing:.03em; color:var(--cobalt); background:rgba(11,58,111,.07); border:1px solid rgba(11,58,111,.13); padding:.4em .75em; border-radius:999px; transition:background .25s, color .25s; }
.bento__card:hover .bento__tags span{ background:rgba(242,169,59,.14); border-color:rgba(242,169,59,.3); }

/* line icons (Lucide) */
.e{ width:1em; height:1em; display:inline-block; vertical-align:-.16em; stroke-width:2; flex:none; }
.bento__i .e{ width:27px; height:27px; color:var(--cobalt); stroke-width:1.7; }
.tool-tile__i{ font-size:0; }
.tool-tile__i .e{ width:2.1rem; height:2.1rem; vertical-align:top; color:var(--saffron); stroke-width:1.6; }
.pref .e, .chip .e{ width:1.05em; height:1.05em; margin-right:.32em; vertical-align:-.2em; stroke-width:2; }

/* ─── Feature rows ────────────────────────────────────────────────────────── */
.feature{ position:relative; z-index:1; max-width:var(--maxw); margin:0 auto; padding:clamp(3.5rem,7vw,6rem) clamp(1.1rem,4vw,2.6rem);
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,6vw,5.5rem); align-items:center; }
.feature--reverse .feature__media{ order:2; }
.feature__media{ display:flex; justify-content:center; }
.feature__copy h2{ font-weight:900; letter-spacing:-.03em; line-height:1.02; font-size:clamp(2rem,4.4vw,3.4rem); margin:1rem 0 1.1rem; }
.feature__copy h2 em{ color:var(--saffron); }
.feature__copy p{ font-size:clamp(1rem,1.4vw,1.12rem); color:var(--cobalt); line-height:1.6; max-width:44ch; }
.ticks{ list-style:none; margin-top:1.5rem; display:grid; gap:.7rem; }
.ticks li{ position:relative; padding-left:1.7rem; font-size:.98rem; color:var(--ink); }
.ticks li::before{ content:'✦'; position:absolute; left:0; top:0; color:var(--saffron); }

.feature--dark{ background:linear-gradient(160deg, var(--cobalt), var(--cobalt-2)); color:var(--cream); max-width:1180px; margin-inline:auto; margin-top:clamp(2rem,5vw,4rem); margin-bottom:clamp(2rem,5vw,4rem); border-radius:30px; padding-inline:clamp(1.6rem,4vw,3.6rem); position:relative; overflow:hidden; box-shadow:var(--sh-lg); }
.feature--dark::before{ content:''; position:absolute; width:60%; height:120%; right:-10%; top:-30%; background:radial-gradient(circle, rgba(242,169,59,.18), transparent 60%); pointer-events:none; }
.feature--dark .feature__copy h2{ color:var(--cream); }
.feature--dark .feature__copy h2 em{ color:var(--saffron); }
.feature--dark .feature__copy p{ color:rgba(244,239,221,.82); }
.feature--dark .ticks li{ color:var(--cream); }

/* plan mock */
.mock{ width:min(100%,382px); background:var(--paper); border:1.5px solid rgba(11,58,111,.16); border-radius:26px; padding:1.4rem; box-shadow:var(--sh-lg); display:grid; gap:.7rem; transform-style:preserve-3d; transition:transform .3s var(--ease); }
.mock__k{ font-family:var(--mono); font-weight:800; font-size:.62rem; letter-spacing:.15em; color:var(--cobalt); opacity:.7; }
.prefs{ display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:.2rem; }
.pref{ font-family:var(--mono); font-size:.66rem; padding:.42em .75em; border-radius:999px; border:1.5px solid rgba(11,58,111,.2); color:var(--cobalt); transition:transform .3s var(--ease); }
.pref.is-on{ background:var(--cobalt); color:var(--cream); border-color:var(--cobalt); }
.plan-card{ background:var(--cream); border:1.5px solid rgba(11,58,111,.14); border-radius:14px; padding:.85rem 1rem; display:grid; gap:.25rem; transition:transform .35s var(--ease), box-shadow .35s; }
.mock:hover .plan-card{ box-shadow:var(--sh-sm); }
.plan-card__k{ font-family:var(--mono); font-size:.6rem; font-weight:800; letter-spacing:.16em; color:var(--cobalt); opacity:.7; }
.plan-card strong{ font-weight:700; font-size:.98rem; }
.plan-card em{ font-size:.82rem; color:var(--cobalt); opacity:.8; }
.plan-card--2{ background:linear-gradient(135deg,#FBF3DE,#FAF6E8); }

/* ─── Booking ─────────────────────────────────────────────────────────────── */
.book-stack{ width:min(100%,400px); display:grid; gap:1rem; perspective:1000px; }
.hotel-card{ background:var(--paper); border-radius:20px; overflow:hidden; box-shadow:var(--sh-lg); transition:opacity .4s var(--ease), transform .3s var(--ease); transform-style:preserve-3d; }
.hotel-card__img{ height:160px; background:#0B3A6F center/cover no-repeat; position:relative; transition:transform .6s var(--ease); }
.hotel-card:hover .hotel-card__img{ transform:scale(1.05); }
.hotel-card__b{ padding:1rem 1.15rem; display:grid; gap:.4rem; color:var(--ink); }
.hotel-card__k{ font-family:var(--mono); font-size:.6rem; font-weight:800; letter-spacing:.14em; color:var(--cobalt); opacity:.7; }
.hotel-card__b strong{ font-size:1.08rem; font-weight:700; }
.hotel-card__row{ display:flex; justify-content:space-between; align-items:center; }
.stars{ color:var(--saffron); font-size:.85rem; letter-spacing:1px; }
.price{ font-family:var(--mono); font-weight:700; color:var(--cobalt); }
.price small{ font-weight:400; opacity:.6; }
.book-btn{ justify-self:start; margin-top:.3rem; font-family:var(--mono); font-size:.7rem; font-weight:700; letter-spacing:.05em; color:var(--cream); background:var(--cobalt); padding:.6em 1.1em; border-radius:999px; transition:background .25s, transform .25s var(--ease); }
.hotel-card:hover .book-btn{ background:var(--saffron); color:var(--cobalt-deep); }
.pass-card{ background:linear-gradient(135deg, var(--saffron), var(--gold)); color:var(--cobalt-deep); border-radius:16px; padding:.95rem 1.2rem; display:grid; gap:.5rem; box-shadow:var(--sh-md); transition:opacity .4s var(--ease); position:relative; overflow:hidden; }
.pass-card::before{ content:''; position:absolute; left:-7px; top:50%; width:14px; height:14px; border-radius:50%; background:var(--cobalt); transform:translateY(-50%); }
.pass-card::after{ content:''; position:absolute; right:-7px; top:50%; width:14px; height:14px; border-radius:50%; background:var(--cobalt); transform:translateY(-50%); }
.pass-card__seg{ display:flex; align-items:center; justify-content:center; gap:1.1rem; font-family:var(--serif); font-weight:900; font-size:1.7rem; }
.pass-card__seg .plane{ font-size:1rem; }
.pass-card__meta{ display:flex; justify-content:space-between; font-family:var(--mono); font-size:.72rem; font-weight:700; }
.chips{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.6rem; }
.chip{ display:inline-flex; align-items:center; font-family:var(--mono); font-size:.66rem; font-weight:700; letter-spacing:.03em; padding:.55em .95em; border-radius:999px; background:rgba(244,239,221,.1); border:1px solid rgba(244,239,221,.22); color:var(--cream); transition:background .25s, transform .25s var(--ease); }
.chip:hover{ background:rgba(244,239,221,.18); transform:translateY(-2px); }

/* ─── Explore-nearby map ──────────────────────────────────────────────────── */
.map-mock{ width:min(100%,420px); aspect-ratio:1; position:relative; border-radius:24px; overflow:hidden; box-shadow:var(--sh-lg); background:#071d39; }
.map-leaflet{ position:absolute; inset:0; z-index:1; }
.map-leaflet .leaflet-container{ background:#0a1f3a; }
.map-leaflet .leaflet-control-attribution{ background:rgba(7,29,57,.55); color:rgba(244,239,221,.4); font-family:var(--mono); font-size:9px; }
.map-leaflet .leaflet-control-attribution a{ color:rgba(244,239,221,.55); }
.map-scrim{ position:absolute; inset:0; z-index:2; pointer-events:none; box-shadow:inset 0 0 60px rgba(5,18,33,.65); background:linear-gradient(180deg, rgba(5,18,33,.18), transparent 28%, transparent 58%, rgba(5,18,33,.5)); }
.lf-wrap{ background:none !important; border:0 !important; }
.lf-me{ width:16px; height:16px; border-radius:50%; background:var(--sky); box-shadow:0 0 0 4px rgba(91,160,208,.3), 0 0 14px rgba(91,160,208,.7); position:relative; }
.lf-me::after{ content:''; position:absolute; inset:-4px; border-radius:50%; border:1.5px solid rgba(91,160,208,.6); animation:radar 2.4s ease-out infinite; }
.lf-spot{ width:14px; height:14px; border-radius:50%; background:var(--saffron); box-shadow:0 0 10px rgba(242,169,59,.8); animation:ping 2s ease-out infinite; }
.lf-spot--2{ animation-delay:1s; }
.pin{ position:absolute; width:14px; height:14px; border-radius:50%; transform:translate(-50%,-50%); }
.pin--me{ background:var(--sky); box-shadow:0 0 0 6px rgba(91,160,208,.25); }
.pin--me::after{ content:''; position:absolute; inset:-6px; border-radius:50%; border:1.5px solid rgba(91,160,208,.5); animation:radar 2.4s ease-out infinite; }
@keyframes radar{ 0%{transform:scale(.6);opacity:.8} 100%{transform:scale(2.6);opacity:0} }
.pin--spot{ background:var(--saffron); animation:ping 2s ease-out infinite; }
.pin--spot2{ animation-delay:1s; }
@keyframes ping{ 0%{box-shadow:0 0 0 0 rgba(242,169,59,.55)} 100%{box-shadow:0 0 0 18px rgba(242,169,59,0)} }
.push-card{ position:absolute; left:7%; right:7%; bottom:7%; z-index:3; background:var(--paper); border-radius:14px; padding:.85rem .95rem; display:grid; gap:.2rem; box-shadow:0 16px 30px rgba(0,0,0,.4); }
.push-card__k{ font-family:var(--mono); font-size:.58rem; font-weight:800; letter-spacing:.12em; color:var(--saffron); }
.push-card strong{ font-size:.92rem; color:var(--ink); }
.push-card em{ font-size:.74rem; color:var(--cobalt); opacity:.8; }

/* ─── Beacon band + tools ─────────────────────────────────────────────────── */
.beacon-band{ position:relative; z-index:1; background:linear-gradient(165deg, var(--cobalt), var(--cobalt-deep)); color:var(--cream); padding:clamp(4rem,8vw,7rem) clamp(1.1rem,4vw,2.6rem); overflow:hidden; min-height:clamp(640px,94vh,1000px); display:flex; align-items:center; }
.beacon-band__bg{ position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(40vw 40vw at 80% 10%, rgba(242,169,59,.16), transparent 60%), radial-gradient(40vw 40vw at 10% 90%, rgba(91,160,208,.18), transparent 60%); }
.beacon-band__inner{ position:relative; z-index:1; max-width:600px; margin:0; transition:transform .85s var(--ease); will-change:transform; }
.beacon-deco{ position:absolute; left:clamp(1.5rem,6vw,6rem); top:50%; z-index:1; pointer-events:none; opacity:0; transform:translateY(-50%) translateX(-36px); transition:opacity .85s ease, transform .9s var(--ease); }
.beacon-band.is-active .beacon-deco{ opacity:1; transform:translateY(-50%) translateX(0); }
.beacon-seal{ position:relative; width:clamp(230px,18vw,312px); aspect-ratio:1; border-radius:50%; border:2px solid rgba(242,169,59,.5); display:grid; place-content:center; text-align:center; gap:.35rem; transform:rotate(-11deg); font-family:var(--mono); }
.beacon-seal::before{ content:''; position:absolute; inset:14px; border-radius:50%; border:1px solid rgba(242,169,59,.28); }
.beacon-seal__top{ font-size:.74rem; font-weight:800; letter-spacing:.16em; color:rgba(242,169,59,.72); }
.beacon-seal__mid{ font-family:var(--serif); font-weight:900; font-size:clamp(1.95rem,2.6vw,2.6rem); letter-spacing:.01em; color:rgba(244,239,221,.86); }
.beacon-seal__bot{ font-size:.62rem; font-weight:700; letter-spacing:.2em; color:rgba(242,169,59,.6); }
.beacon-deco__stamp{ position:absolute; width:clamp(86px,9.2vw,136px); filter:drop-shadow(0 14px 24px rgba(0,0,0,.45)); }
.beacon-deco__stamp--1{ top:-16%; right:-26%; animation:floatA 5.2s ease-in-out infinite; }
.beacon-deco__stamp--2{ bottom:-18%; left:-14%; animation:floatB 6.4s ease-in-out infinite; }
.beacon-deco__coord{ position:absolute; bottom:-2.6rem; left:.2rem; font-family:var(--mono); font-size:.62rem; letter-spacing:.18em; color:rgba(244,239,221,.5); white-space:nowrap; }
/* On wide screens there's room to push the deco cluster well to the right (the
   text block slides toward Billie on the far right); narrower screens keep it
   left so it never crowds the copy. */
@media (min-width:1500px){ .beacon-deco{ left:clamp(8rem,16vw,22rem); } }
@keyframes floatA{ 0%,100%{ transform:translateY(0) rotate(7deg); } 50%{ transform:translateY(-12px) rotate(7deg); } }
@keyframes floatB{ 0%,100%{ transform:translateY(0) rotate(-9deg); } 50%{ transform:translateY(11px) rotate(-9deg); } }
.beacon-band__head{ position:relative; max-width:none; margin:0 0 2.2rem; text-align:left; }
.beacon-mobile{ display:none; }
@keyframes halo{ 0%,100%{ opacity:.6; transform:scale(.96); } 50%{ opacity:1; transform:scale(1.04); } }
.beacon-band__head .kicker{ display:block; margin-bottom:.9rem; }
.beacon-band__head h2{ font-weight:900; letter-spacing:-.03em; font-size:clamp(2rem,4.6vw,3.3rem); color:var(--cream); }
.beacon-band__head h2 em{ color:var(--saffron); }
.beacon-band__head p{ margin-top:1rem; color:rgba(244,239,221,.8); font-size:1.05rem; line-height:1.55; max-width:48ch; }
.tool-grid{ position:relative; max-width:none; margin:0; display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.tool-tile{ background:rgba(244,239,221,.06); border:1px solid rgba(244,239,221,.14); border-radius:18px; padding:1.5rem 1.3rem; transition:transform .4s var(--ease), background .3s, box-shadow .3s; transform-style:preserve-3d; }
.tool-tile:hover{ background:rgba(244,239,221,.1); box-shadow:0 24px 50px -28px rgba(0,0,0,.6); }
.tool-tile__i{ display:block; margin-bottom:.7rem; transition:transform .4s var(--ease); }
.tool-tile:hover .tool-tile__i{ transform:translateZ(24px) scale(1.08) rotate(-4deg); }
.tool-tile h4{ font-weight:700; font-size:1.06rem; color:var(--cream); }
.tool-tile p{ margin-top:.4rem; font-size:.87rem; color:rgba(244,239,221,.75); line-height:1.5; }

/* ─── Your World map (real geography) ─────────────────────────────────────── */
.world-map{ width:min(100%,490px); aspect-ratio:1.18; position:relative; background:radial-gradient(circle at 50% 42%,#0c3766,#05182f); border-radius:26px; overflow:hidden; box-shadow:var(--sh-lg); }
.world-map__glow{ position:absolute; inset:0; background:radial-gradient(circle at 64% 50%, rgba(242,169,59,.26), transparent 46%); opacity:.25; transition:opacity 1.2s ease; z-index:2; pointer-events:none; mix-blend-mode:screen; }
.world-map.is-lit .world-map__glow{ opacity:1; }
.world-map__geo{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.world-svg{ width:100%; height:100%; opacity:.28; filter:saturate(.45) brightness(.72); transition:opacity 1.1s ease, filter 1.3s ease; }
.world-map.is-lit .world-svg{ opacity:1; filter:none; }
.world-svg path{ transition:fill .7s var(--ease), filter .7s ease; }
.world-svg .beacon{ opacity:0; transition:opacity .6s ease; transform-box:fill-box; transform-origin:center; }
.world-svg .beacon--gold{ }
.world-map.is-lit .world-svg .beacon{ opacity:1; animation:beaconPulse 2.4s ease-in-out infinite; }
.world-svg .ring{ opacity:0; transform-box:fill-box; transform-origin:center; }
.world-map.is-lit .world-svg .ring{ animation:beaconRing 2.6s ease-out infinite; }
@keyframes beaconPulse{ 0%,100%{ transform:scale(.85); } 50%{ transform:scale(1.25); } }
@keyframes beaconRing{ 0%{ transform:scale(.6); opacity:.7; } 100%{ transform:scale(3.4); opacity:0; } }
.world-map__cap{ position:absolute; left:0; right:0; bottom:1rem; text-align:center; font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; color:rgba(244,239,221,.7); z-index:3; }

/* ─── Stamps showcase ─────────────────────────────────────────────────────── */
.stamps{ position:relative; z-index:1; background:var(--ink); color:var(--cream); padding:clamp(4rem,9vw,7rem) 0; overflow:hidden; }
.stamps::before{ content:''; position:absolute; inset:0; background:radial-gradient(circle at 50% 0%, rgba(242,169,59,.16), transparent 55%); pointer-events:none; }
.stamps__intro{ max-width:760px; margin:0 auto clamp(2.5rem,5vw,4rem); padding:0 clamp(1.1rem,4vw,2.6rem); text-align:center; position:relative; }
.stamps__intro .kicker{ display:block; margin-bottom:1rem; }
.stamps__title{ font-weight:900; letter-spacing:-.03em; font-size:clamp(2.2rem,5.4vw,4rem); }
.stamps__title em{ color:var(--saffron); }
.stamps__sub{ margin-top:1.1rem; font-size:clamp(1rem,1.5vw,1.15rem); color:rgba(244,239,221,.78); line-height:1.6; }
.stamps__sub strong{ color:var(--cream); font-weight:700; }
.gold-word{ color:var(--saffron); font-weight:700; font-style:italic; }
.gallery{ position:relative; overflow:hidden; }
.gallery__track{ display:flex; gap:clamp(1.4rem,3vw,2.6rem); padding:1.8rem clamp(1.1rem,4vw,2.6rem); width:max-content; will-change:transform; perspective:1200px; }
.stamp{ width:clamp(150px,17vw,230px); aspect-ratio:1; flex:0 0 auto; position:relative; transition:transform .4s var(--ease); transform-style:preserve-3d; }
.stamp img{ width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 20px 30px rgba(0,0,0,.45)); }
.stamp::before{ content:''; position:absolute; inset:0; z-index:2; pointer-events:none; border-radius:6px;
  background:linear-gradient(125deg, transparent 40%, rgba(255,255,255,.5) 48%, transparent 56%); transform:translateX(-130%); opacity:0; }
.stamp.is-gold::before{ opacity:.9; animation:shimmer 3.6s ease-in-out infinite; }
@keyframes shimmer{ 0%,72%{ transform:translateX(-130%); } 88%,100%{ transform:translateX(130%); } }
.stamp.is-gold::after{ content:''; position:absolute; inset:-12%; background:radial-gradient(circle, rgba(242,169,59,.5), transparent 62%); z-index:-1; animation:glow 2.4s ease-in-out infinite; }
@keyframes glow{ 0%,100%{opacity:.45; transform:scale(.94)} 50%{opacity:.9; transform:scale(1.04)} }
.stamps__foot{ text-align:center; font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; color:rgba(244,239,221,.55); margin-top:1.5rem; padding:0 1.1rem; }

/* ─── Trade stage ─────────────────────────────────────────────────────────── */
.trade-stage{ position:relative; width:min(100%,440px); aspect-ratio:1.3; display:flex; align-items:center; justify-content:center; }
.trade-stamp{ width:46%; filter:drop-shadow(0 18px 30px rgba(11,58,111,.3)); }
.trade-stamp--l{ transform:rotate(-8deg); }
.trade-stamp--r{ transform:rotate(8deg); }
.trade-swap{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:2rem; color:var(--saffron);
  background:var(--paper); width:3.2rem; height:3.2rem; border-radius:50%; display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px rgba(11,58,111,.25); z-index:3; animation:swapspin 2.6s var(--ease) infinite; }
@keyframes swapspin{ 0%,40%{transform:translate(-50%,-50%) rotate(0)} 60%,100%{transform:translate(-50%,-50%) rotate(180deg)} }

/* ─── Social + city guide ─────────────────────────────────────────────────── */
.social{ position:relative; z-index:1; background:var(--ink); color:var(--cream); padding:clamp(4rem,8vw,7rem) clamp(1.1rem,4vw,2.6rem); }
.social__head{ max-width:720px; margin:0 auto clamp(2.5rem,4vw,3.5rem); text-align:center; }
.social__head .kicker{ display:block; margin-bottom:.9rem; color:var(--saffron); }
.social__head h2{ font-weight:900; letter-spacing:-.03em; font-size:clamp(2rem,4.6vw,3.3rem); color:var(--cream); }
.social__head h2 em{ color:var(--saffron); }
.social__head p{ margin-top:1rem; color:rgba(244,239,221,.78); font-size:1.05rem; line-height:1.55; }
.social__head strong{ color:var(--cream); }
.social__grid{ max-width:1080px; margin:0 auto; display:grid; grid-template-columns:1.1fr .9fr; gap:1.6rem; align-items:start; }
.feed{ columns:2; column-gap:1rem; }
.post{ break-inside:avoid; margin-bottom:1rem; background:rgba(244,239,221,.06); border:1px solid rgba(244,239,221,.12); border-radius:16px; overflow:hidden; transition:transform .4s var(--ease), box-shadow .4s; }
.post:hover{ transform:translateY(-5px); box-shadow:0 24px 44px -26px rgba(0,0,0,.7); }
.post__img{ height:128px; background:#0e2a4a center/cover no-repeat; transition:transform .6s var(--ease); }
.post:hover .post__img{ transform:scale(1.07); }
.post--tall .post__img{ height:200px; }
.post__b{ padding:.7rem .85rem; }
.post__b span{ display:block; font-weight:700; font-size:.92rem; color:var(--cream); }
.post__b em{ font-size:.72rem; color:rgba(244,239,221,.65); }
.guide{ background:var(--paper); border-radius:20px; overflow:hidden; color:var(--ink); box-shadow:var(--sh-lg); transform-style:preserve-3d; }
.guide__img{ height:190px; background:#0F4A8A center/cover no-repeat; position:relative; transition:transform .6s var(--ease); }
.guide:hover .guide__img{ transform:scale(1.04); }
.guide__b{ padding:1.2rem; display:grid; gap:.55rem; }
.guide__k{ font-family:var(--mono); font-size:.6rem; font-weight:800; letter-spacing:.14em; color:var(--cobalt); opacity:.7; }
.guide__b strong{ font-size:1.3rem; font-weight:900; letter-spacing:-.01em; }
.guide__row{ display:flex; gap:.7rem; align-items:center; }
.rec{ font-family:var(--mono); font-size:.7rem; font-weight:700; color:#0a8a3a; background:rgba(10,138,58,.12); padding:.32em .7em; border-radius:999px; }
.votes{ font-family:var(--mono); font-size:.72rem; color:var(--cobalt); }
.guide__b p{ font-size:.9rem; color:var(--cobalt); line-height:1.5; }
.guide__cta{ display:flex; justify-content:space-between; align-items:center; margin-top:.2rem; }
.save{ font-family:var(--mono); font-size:.74rem; color:var(--red); }
.open{ font-family:var(--mono); font-size:.74rem; font-weight:700; color:var(--cobalt); }

/* ─── Memory map ──────────────────────────────────────────────────────────── */
.memory-card{ width:min(100%,440px); background:var(--paper); border:1.5px solid rgba(11,58,111,.14); border-radius:24px; padding:1.5rem; box-shadow:var(--sh-lg); transform-style:preserve-3d; }
.memory-card__k{ font-family:var(--mono); font-size:.62rem; font-weight:800; letter-spacing:.16em; color:var(--cobalt); opacity:.7; }
.memory-card__route{ width:100%; height:auto; margin:.5rem 0 .3rem; }
.memory-card__path{ stroke-dasharray:6 7; }
.memory-card__stats{ display:flex; justify-content:space-between; gap:.5rem; border-top:1px solid rgba(11,58,111,.12); padding-top:1rem; }
.memory-card__stats div{ text-align:center; flex:1; }
.memory-card__stats strong{ display:block; font-family:var(--serif); font-weight:900; font-size:1.3rem; color:var(--ink); }
.memory-card__stats em{ font-family:var(--mono); font-size:.6rem; letter-spacing:.08em; color:var(--cobalt); opacity:.7; text-transform:uppercase; }
.memory-card__ate{ margin-top:1rem; background:var(--cream); border-radius:12px; padding:.7rem .9rem; font-size:.85rem; color:var(--cobalt); }

/* ─── CTA ─────────────────────────────────────────────────────────────────── */
.cta{ position:relative; z-index:1; background:linear-gradient(160deg, var(--cobalt), var(--cobalt-deep)); color:var(--cream); padding:clamp(5rem,10vw,9rem) clamp(1.1rem,4vw,2.6rem); overflow:hidden; }
.cta__bg{ position:absolute; inset:0; pointer-events:none; }
.cta__bg::before{ content:''; position:absolute; width:60vw; height:60vw; right:-20vw; top:-20vw; border-radius:50%; background:radial-gradient(circle, rgba(242,169,59,.22), transparent 65%); }
.cta__stamp{ position:absolute; width:clamp(90px,12vw,150px); filter:drop-shadow(0 18px 30px rgba(0,0,0,.4)); opacity:.9; }
.cta__stamp--1{ left:6%; top:18%; transform:rotate(-10deg); }
.cta__stamp--2{ right:8%; bottom:14%; transform:rotate(8deg); }
.cta-beacon{ position:absolute; left:4%; bottom:-9%; width:clamp(250px,28vw,440px); aspect-ratio:1; z-index:1; pointer-events:none; filter:drop-shadow(0 22px 40px rgba(0,0,0,.5)); }
@media (max-width:760px){ .cta-beacon{ left:-4%; bottom:-12%; width:260px; opacity:.85; } }
@media (max-width:520px){ .cta-beacon{ display:none; } }
.cta__inner{ max-width:680px; margin:0 auto; text-align:center; position:relative; z-index:2; }
.cta__inner .kicker{ display:block; margin-bottom:1rem; }
.cta__title{ font-weight:900; letter-spacing:-.03em; font-size:clamp(2.6rem,7vw,5rem); line-height:1; }
.cta__title em{ color:var(--saffron); }
.cta__sub{ margin:1.2rem auto 2rem; max-width:46ch; color:rgba(244,239,221,.82); font-size:1.05rem; line-height:1.55; }
.waitlist{ display:flex; gap:.6rem; max-width:440px; margin:0 auto; flex-wrap:wrap; justify-content:center; }
.waitlist input{ flex:1 1 220px; min-width:0; font-family:var(--serif); font-size:1rem; padding:.95em 1.2em; border-radius:999px; border:1.5px solid rgba(244,239,221,.3); background:rgba(244,239,221,.08); color:var(--cream); transition:border-color .25s, background .25s; }
.waitlist input::placeholder{ color:rgba(244,239,221,.5); }
.waitlist input:focus{ outline:none; border-color:var(--saffron); background:rgba(244,239,221,.14); }
.waitlist .btn--primary{ background:var(--saffron); color:var(--cobalt); }
.waitlist .btn--primary:hover{ background:var(--cream); }
.waitlist__done{ max-width:440px; margin:1rem auto 0; font-family:var(--mono); font-size:.85rem; letter-spacing:.05em; color:var(--saffron);
  opacity:0; transform:translateY(6px); transition:opacity .4s, transform .4s; pointer-events:none; }
.waitlist__done.is-shown{ opacity:1; transform:none; }

/* ─── Footer ──────────────────────────────────────────────────────────────── */
.footer{ position:relative; z-index:1; background:var(--ink); color:var(--cream); text-align:center; padding:clamp(3rem,6vw,4.5rem) 1.1rem 3rem; }
.footer__brand{ font-family:var(--serif); font-weight:900; font-size:1.6rem; }
.footer__brand span{ color:var(--saffron); }
.footer__tag{ font-style:italic; color:rgba(244,239,221,.7); margin:.4rem 0 1.4rem; }
.footer__links{ display:flex; gap:1.6rem; justify-content:center; flex-wrap:wrap; margin-bottom:1.4rem; }
.footer__links a{ font-family:var(--mono); font-size:.74rem; letter-spacing:.08em; opacity:.7; transition:opacity .2s, color .2s; }
.footer__links a:hover{ opacity:1; color:var(--saffron); }
.footer__fine{ font-family:var(--mono); font-size:.66rem; letter-spacing:.06em; color:rgba(244,239,221,.4); }

/* ─── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width:980px){
  .beacon-band{ display:block; min-height:auto; }
  .beacon-deco{ display:none; }
  .beacon-band__inner{ max-width:560px; margin:0 auto; transform:none !important; }
  .beacon-band__head{ text-align:center; max-width:none; margin:0 0 2rem; }
  .beacon-band__head p{ margin-left:auto; margin-right:auto; }
  .tool-grid{ max-width:none; margin:0; }
  .beacon-mobile{ display:block; width:clamp(200px,62vw,300px); aspect-ratio:1; margin:0 auto 1.2rem; filter:drop-shadow(0 18px 30px rgba(0,0,0,.42)); }
}
@media (max-width:880px){
  .bento{ grid-template-columns:1fr; }
  .tool-grid{ grid-template-columns:repeat(2,1fr); }
  .social__grid{ grid-template-columns:1fr; }
  .feature{ grid-template-columns:1fr; gap:2rem; }
  .feature--reverse .feature__media{ order:0; }
}
@media (max-width:520px){
  .tool-grid{ grid-template-columns:1fr; }
  .bento__card{ padding:1.3rem; }
  .cta__stamp{ display:none; }
}