/* EFT RESOURCE HUB — V40 FINAL OVERRIDES
   Shared by the homepage and map archive. Keep this file last. */

/* One cursor glow implementation for every page. */
.cursor-glow{
  position:fixed !important;
  left:0;
  top:0;
  width:420px !important;
  height:420px !important;
  z-index:9998 !important;
  display:block !important;
  visibility:visible !important;
  pointer-events:none !important;
  border-radius:50% !important;
  opacity:1 !important;
  transform:translate3d(-50%,-50%,0) !important;
  background:radial-gradient(circle,
    rgba(143,211,232,.22) 0%,
    rgba(143,211,232,.105) 22%,
    rgba(143,211,232,.045) 42%,
    rgba(139,122,199,.018) 56%,
    transparent 74%) !important;
  mix-blend-mode:screen !important;
  will-change:left,top,transform !important;
  contain:layout paint !important;
}

/* Do not let a reduced-motion rule accidentally remove the visual HUD layer. */
@media (prefers-reduced-motion:reduce){
  .cursor-glow{display:block !important;opacity:1 !important}
}

/* Scroll cue: no sideways movement and no jumping arrow. */
.scroll-cue{
  transform:translateX(-50%) !important;
  transition:transform .25s cubic-bezier(.2,.8,.2,1),
             opacity .25s ease,
             border-color .25s ease,
             background .25s ease,
             box-shadow .25s ease !important;
}
.scroll-cue:hover{
  transform:translateX(-50%) scale(1.08) !important;
  border-color:rgba(143,211,232,.70) !important;
  background:rgba(143,211,232,.07) !important;
  box-shadow:0 0 0 1px rgba(143,211,232,.08),0 0 26px rgba(143,211,232,.16) !important;
}
.scroll-cue i{
  transition:opacity .25s ease !important;
}
.scroll-cue:hover i:first-child,
.scroll-cue:hover i:last-child{
  transform:rotate(45deg) !important;
}

/* V40 — MAIN CTA / RESOURCE ENTRY HOVER
   Match the resource-card interaction: no sweeping stripe, no sideways motion.
   The pill remains in place and only gains a soft cyan highlight + tiny scale. */
.hero-actions > a.btn.primary[href="#resources"]{
  transform:none !important;
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    background .28s ease,
    border-color .28s ease,
    box-shadow .28s ease,
    filter .28s ease !important;
}

.hero-actions > a.btn.primary[href="#resources"]::before,
.hero-actions > a.btn.primary[href="#resources"]::after{
  content:none !important;
  display:none !important;
}

.hero-actions > a.btn.primary[href="#resources"]:hover{
  transform:scale(1.035) !important;
  background:linear-gradient(135deg,#b7ebf7,#8fd3e8) !important;
  border-color:#a9e6f5 !important;
  box-shadow:
    0 16px 42px rgba(120,191,213,.24),
    0 0 0 1px rgba(143,211,232,.10),
    0 0 34px rgba(143,211,232,.16) !important;
  filter:saturate(1.04) brightness(1.025) !important;
}

.hero-actions > a.btn.primary[href="#resources"]:active{
  transform:scale(.99) !important;
}

/* ================================================================
   V42 — MAP ARCHIVE / SHARED RESOURCE CARD LANGUAGE
   Match the homepage resource cards without restoring icon shells.
   ================================================================ */
.maps-page .map-card{
  border-radius:22px !important;
  border-color:rgba(143,211,232,.16) !important;
  background:
    radial-gradient(circle at 82% 12%,rgba(139,122,199,.045),transparent 30%),
    linear-gradient(145deg,rgba(20,29,35,.92),rgba(7,11,15,.98)) !important;
  transition:
    transform .45s cubic-bezier(.16,.8,.2,1),
    border-color .35s ease,
    background .35s ease,
    box-shadow .45s ease !important;
}

.maps-page .map-card:hover{
  transform:translateY(-10px) scale(1.012) !important;
  border-color:rgba(143,211,232,.48) !important;
  background:
    radial-gradient(circle at 82% 12%,rgba(139,122,199,.09),transparent 30%),
    linear-gradient(145deg,#1a2b34,#080d12) !important;
  box-shadow:
    0 26px 65px rgba(0,0,0,.45),
    0 0 38px rgba(143,211,232,.08),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

/* Keep the map artwork, but make its hover response match the homepage art. */
.maps-page .map-card .map-grid{
  transition:opacity .45s cubic-bezier(.16,.8,.2,1),transform .45s cubic-bezier(.16,.8,.2,1) !important;
}
.maps-page .map-card:hover .map-grid{
  opacity:.20 !important;
  transform:rotate(12deg) scale(1.06) !important;
}

/* The map glyph remains a clean glyph — no box/shell. */
.maps-page .map-icon{
  color:#8fd3e8 !important;
  transition:transform .45s cubic-bezier(.16,.8,.2,1),color .35s ease,filter .35s ease !important;
}
.maps-page .map-card:hover .map-icon{
  transform:translateY(-4px) rotate(-4deg) !important;
  color:#a9e6f5 !important;
  filter:drop-shadow(0 0 8px rgba(143,211,232,.18)) !important;
}

/* Typography aligned with the homepage resource cards. */
.maps-page .map-index{color:#6f8993 !important}
.maps-page .map-status{color:#7193a0 !important}
.maps-page .map-status b{color:#8fd3e8 !important}
.maps-page .map-card h2{color:#dce7ea !important}
.maps-page .map-card p{color:#80959e !important}
.maps-page .map-card:hover h2{color:#eef7fa !important}
.maps-page .map-card:hover p{color:#9eb2ba !important}

@media(max-width:760px){
  .maps-page .map-card:hover{transform:translateY(-6px) scale(1.008) !important}
}

/* V43 — HERO TITLE MUST REMAIN COMPLETELY STATIC */
.hero-title,
.hero-title span,
.hero:hover .hero-title,
.hero:hover .hero-title span,
.hero-title span:first-child,
.hero-title span:last-child{
  animation:none !important;
  transform:none !important;
  transition:none !important;
  will-change:auto !important;
}

/* ================================================================
   V46 — USER-REPLACEABLE MAP CARD BACKGROUNDS
   Drop the named image into assets/maps/. No HTML changes required.
   ================================================================ */
.maps-page .map-card{
  background-color:#0a1014 !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:cover !important;
  isolation:isolate !important;
}
.maps-page .map-card::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  pointer-events:none !important;
  background:
    linear-gradient(180deg,rgba(5,10,14,.38) 0%,rgba(5,10,14,.56) 48%,rgba(5,10,14,.92) 100%) !important;
}
.maps-page .map-card > *{
  position:relative;
  z-index:2;
}
.maps-page .map-card .map-grid,
.maps-page .map-card .map-sweep{
  z-index:3 !important;
}

/* 01–12 */
.maps-page .maps-grid .map-card:nth-child(1){background-image:url("../assets/maps/customs.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(2){background-image:url("../assets/maps/factory.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(3){background-image:url("../assets/maps/ground-zero.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(4){background-image:url("../assets/maps/interchange.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(5){background-image:url("../assets/maps/lighthouse.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(6){background-image:url("../assets/maps/reserve.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(7){background-image:url("../assets/maps/shoreline.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(8){background-image:url("../assets/maps/streets.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(9){background-image:url("../assets/maps/the-lab.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(10){background-image:url("../assets/maps/woods.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(11){background-image:url("../assets/maps/labyrinth.jpg") !important}
.maps-page .maps-grid .map-card:nth-child(12){background-image:url("../assets/maps/terminal.jpg") !important}

/* Let the image become slightly clearer on hover, while keeping text readable. */
.maps-page .map-card:hover::after{
  background:
    linear-gradient(180deg,rgba(5,10,14,.28) 0%,rgba(5,10,14,.48) 48%,rgba(5,10,14,.88) 100%) !important;
}

/* V48 — MAP CARDS: no enlargement on hover */
.maps-page .map-card,
.maps-page .map-card:hover{
  transform:translateY(-6px) !important;
}
.maps-page .map-card:hover{
  overflow:hidden !important;
  clip-path:inset(0 round 22px) !important;
}

/* V49 — MAP CARDS: SAME HOVER LANGUAGE AS HOMEPAGE, NO ZOOM
   The card lifts/highlights like the homepage resource cards.
   Neither the card nor the map artwork scales on hover. */
.maps-page .map-card {
  transform: translateY(0) !important;
  overflow: hidden !important;
  clip-path: inset(0 round 22px) !important;
  transition:
    transform .42s cubic-bezier(.16,.8,.2,1),
    border-color .35s ease,
    box-shadow .42s ease,
    background .35s ease,
    filter .35s ease !important;
}

.maps-page .map-card:hover {
  transform: translateY(-8px) !important;
  overflow: hidden !important;
  clip-path: inset(0 round 22px) !important;
  border-color: rgba(143,211,232,.48) !important;
  box-shadow:
    0 22px 52px rgba(0,0,0,.40),
    0 0 30px rgba(143,211,232,.10),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
  filter: brightness(1.025) !important;
}

/* The map artwork itself NEVER zooms. */
.maps-page .map-card,
.maps-page .map-card:hover,
.maps-page .map-card > img,
.maps-page .map-card:hover > img,
.maps-page .map-card picture,
.maps-page .map-card:hover picture,
.maps-page .map-card picture img,
.maps-page .map-card:hover picture img,
.maps-page .map-card::before,
.maps-page .map-card::after {
  scale: 1 !important;
}

.maps-page .map-card > img,
.maps-page .map-card:hover > img,
.maps-page .map-card picture img,
.maps-page .map-card:hover picture img {
  transform: none !important;
  object-fit: cover !important;
  object-position: center !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
}

/* ================================================================
   V50 — MAP ARTWORK IS 100% STATIC
   Only the CARD animates. The map image/background never zooms,
   rotates, moves, fades or gets replaced on hover.
   ================================================================ */

/* Make the cards visually stronger while preserving the same language
   as the homepage resource cards. */
.maps-page .map-card {
  position: relative !important;
  overflow: hidden !important;
  clip-path: inset(0 round 22px) !important;
  border: 1px solid rgba(143,211,232,.24) !important;
  box-shadow:
    0 10px 28px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
  transform: translateY(0) !important;
  transition:
    transform .42s cubic-bezier(.16,.8,.2,1),
    border-color .35s ease,
    box-shadow .42s ease,
    filter .35s ease !important;
}

.maps-page .map-card:hover {
  transform: translateY(-8px) !important;
  border-color: rgba(143,211,232,.62) !important;
  box-shadow:
    0 24px 54px rgba(0,0,0,.42),
    0 0 34px rgba(143,211,232,.14),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
  filter: brightness(1.025) !important;
  overflow: hidden !important;
  clip-path: inset(0 round 22px) !important;

  /* IMPORTANT: never use the old hover background shorthand here.
     It used to replace the user's map background image. */
  background-color: #0a1014 !important;
}

/* Kill every legacy artwork animation. */
.maps-page .map-card .map-grid,
.maps-page .map-card:hover .map-grid,
.maps-page .map-card .map-sweep,
.maps-page .map-card:hover .map-sweep {
  transform: none !important;
  scale: 1 !important;
  rotate: none !important;
  translate: none !important;
}

.maps-page .map-card .map-grid {
  opacity: 1 !important;
  transition: none !important;
}

.maps-page .map-card:hover .map-grid {
  opacity: 1 !important;
}

/* The actual background is clipped by the card itself and never animated. */
.maps-page .map-card,
.maps-page .map-card:hover {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-clip: padding-box !important;
}

/* ================================================================
   V51 — HERO: COMPLETELY STATIC BACKGROUND + SMALLER TITLE
   The hero artwork must not react to the cursor in any way.
   ================================================================ */

/* Kill the legacy hover zoom on the background. */
.hero .hero-image,
.hero:hover .hero-image {
  transform: none !important;
  scale: 1 !important;
  rotate: none !important;
  translate: none !important;
  transition: none !important;
  animation: none !important;
  will-change: auto !important;
  background-position: center center !important;
}

/* Keep the background fixed visually while the cursor moves. */
.hero .hero-image {
  inset: 0 !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  pointer-events: none !important;
}

/* The title is also completely static and has enough width control
   to stay on the left side instead of running into the character. */
.hero-title,
.hero-title span,
.hero:hover .hero-title,
.hero:hover .hero-title span,
.hero-title span:first-child,
.hero-title span:last-child {
  animation: none !important;
  transform: none !important;
  transition: none !important;
  will-change: auto !important;
}

.hero-title {
  font-size: clamp(68px, 8.2vw, 118px) !important;
  line-height: .82 !important;
  max-width: 800px !important;
  width: min(800px, 48vw) !important;
  margin: 25px 0 28px !important;
  overflow: visible !important;
}

.hero-title span {
  white-space: nowrap !important;
  display: block !important;
}

.hero-title span:first-child,
.hero-title span:last-child {
  margin-left: 0 !important;
}

/* On narrower displays, give the title a little more room without
   allowing it to collide with the artwork. */
@media (max-width: 1100px) {
  .hero-title {
    width: min(720px, 58vw) !important;
    max-width: 720px !important;
    font-size: clamp(62px, 8.8vw, 96px) !important;
  }
}

@media (max-width: 700px) {
  .hero-title {
    width: 92vw !important;
    max-width: 92vw !important;
    font-size: clamp(48px, 13vw, 78px) !important;
  }
}

/* ================================================================
   V52 — FINAL TEXT / UI CONTRAST PASS
   Homepage: brighten the structural labels and divider lines.
   Maps page: normalize the legacy-colored header text to the same
   white used by the main map title/body copy.
   ================================================================ */

/* HOME — structural labels and lines */
body.home-page .eyebrow,
body.home-page .hero-eyebrow,
body.home-page .hero-meta,
body.home-page .hero-kicker,
body.home-page .hero-label,
body.home-page .section-eyebrow {
  color: rgba(218, 235, 240, .82) !important;
}

body.home-page .hero .section-line,
body.home-page .hero .eyebrow-line,
body.home-page .hero .divider-line,
body.home-page .hero .decor-line,
body.home-page .hero .hero-divider,
body.home-page .hero .hero-accent {
  background: rgba(143, 211, 232, .78) !important;
  border-color: rgba(143, 211, 232, .78) !important;
}

/* Preserve the blue accent but lift low-contrast utility text. */
body.home-page .hero,
body.home-page .hero p {
  --hero-muted: rgba(218, 235, 240, .82);
}

/* MAPS — the header/status texts marked in the screenshot should use
   the same clean white family as the rest of the page. */
.maps-page .map-header,
.maps-page .map-header *,
.maps-page .map-statusbar,
.maps-page .map-statusbar *,
.maps-page .map-meta,
.maps-page .map-meta *,
.maps-page .maps-intro,
.maps-page .maps-intro *,
.maps-page .map-intro,
.maps-page .map-intro *,
.maps-page .map-description,
.maps-page .map-description *,
.maps-page .map-count,
.maps-page .map-count *,
.maps-page .map-database,
.maps-page .map-database * {
  color: #dce7ea !important;
}

/* Exact white used by the main map heading/body copy. */
.maps-page .map-header h1,
.maps-page .maps-header h1,
.maps-page .map-page-title,
.maps-page .maps-page-title {
  color: #eef7fa !important;
}

.maps-page .map-header p,
.maps-page .maps-header p,
.maps-page .maps-intro p,
.maps-page .map-intro p {
  color: #dce7ea !important;
}

/* The top-left return button is also normalized so its label doesn't
   fall back to the old yellow/olive theme. */
.maps-page .back-button,
.maps-page .back-link,
.maps-page a.back-button,
.maps-page a.back-link {
  color: #dce7ea !important;
}

.maps-page .back-button:hover,
.maps-page .back-link:hover {
  color: #eef7fa !important;
}

/* Do not alter the blue accent used for the small status light and
   other intentional interface accents. */


/* ================================================================
   V53 — TARGETED CONTRAST FIX
   IMPORTANT: previous selectors expected a body class that does not
   exist on index.html, and several map selectors targeted classes
   that do not exist in maps.html. This pass targets the REAL DOM.
   ================================================================ */

/* ---------------- HOME: HUD / SMALL TEXT / LINES ----------------
   The screenshot points at the hero's structural lines and the small
   technical labels. Lift them without changing the main title or CTA. */
.hero .micro,
.hero .coordinates,
.hero .coordinates b,
.hero .node {
  color: #a9c0c8 !important;
}

.hero .micro {
  opacity: 1 !important;
}

.hero .coordinates b {
  color: #c2d5db !important;
}

.hero .hud-corner {
  opacity: 1 !important;
  border-color: rgba(169, 211, 224, .62) !important;
}

.hero .eyebrow {
  color: #b7d3dc !important;
}

.hero .eyebrow span {
  background: #8fd3e8 !important;
  box-shadow: 0 0 10px rgba(143,211,232,.45) !important;
}

.hero .title-line i {
  background: #8fd3e8 !important;
}

.hero .title-line b {
  border-color: #8fd3e8 !important;
}

/* Bottom / side technical marks should no longer disappear into the
   background. */
.hero .node b {
  color: #c2d5db !important;
  border-color: rgba(143,211,232,.42) !important;
}

.hero .scroll-cue {
  border-color: rgba(143,211,232,.48) !important;
}

.hero .scroll-cue i {
  border-color: #8fd3e8 !important;
}

/* ---------------- MAPS: REAL ELEMENTS ----------------
   maps.html uses .maps-top / .back-btn / .maps-node / .maps-kicker /
   .maps-copy. The previous V52 selectors were aimed at non-existent
   classes, so the old olive text remained. */
.maps-page .back-btn,
.maps-page .maps-node,
.maps-page .maps-kicker,
.maps-page .maps-copy {
  color: #dce7ea !important;
}

/* Return button — same white family as the map title. */
.maps-page .back-btn {
  color: #eef7fa !important;
}

/* Database status at top-right. */
.maps-page .maps-node {
  color: #dce7ea !important;
}

.maps-page .maps-node i {
  background: #8fd3e8 !important;
  box-shadow: 0 0 10px rgba(143,211,232,.55) !important;
}

/* Tactical archive label + its line. */
.maps-page .maps-kicker {
  color: #b9d7df !important;
}

.maps-page .maps-kicker::before {
  background: #8fd3e8 !important;
}

/* Intro copy under MAPY TARKOVA. */
.maps-page .maps-copy {
  color: #dce7ea !important;
}

/* Keep the main map title on the same white used by the homepage. */
.maps-page .maps-title {
  color: #eef7fa !important;
}


/* V58 — final hero title scale */
.hero .title {
  font-size: clamp(66px, 6.45vw, 130px) !important;
}


/* V58 — subtly softer white typography */
.hero .title,
.maps-page .maps-title {
  color: #e4ecef !important;
}

.hero .micro,
.hero .coordinates,
.hero .coordinates b,
.hero .node,
.hero .eyebrow,
.maps-page .maps-kicker,
.maps-page .maps-copy,
.maps-page .maps-node,
.maps-page .back-btn,
.maps-page .maps-foot,
.maps-page .maps-foot * {
  color: #cbd7db !important;
}

.hero .node b {
  color: #d3dfe3 !important;
}


/* ================================================================
   V59 — FINAL CONSISTENCY / POLISH PASS
   ================================================================ */

:root{
  --eft-white:#dce5e8;
  --eft-white-strong:#e3eaed;
  --eft-white-soft:#c6d2d6;
  --eft-cyan:#8fd3e8;
  --eft-cyan-bright:#a9e6f5;
}

/* One cursor glow on both pages. */
.cursor-glow{
  width:420px !important;
  height:420px !important;
  background:radial-gradient(circle,
    rgba(143,211,232,.18) 0%,
    rgba(143,211,232,.075) 24%,
    rgba(143,211,232,.025) 46%,
    rgba(139,122,199,.012) 58%,
    transparent 74%) !important;
  mix-blend-mode:screen !important;
  pointer-events:none !important;
}

/* Hero artwork and title never react to the cursor. */
.hero .hero-image,
.hero:hover .hero-image,
.hero-title,
.hero:hover .hero-title,
.hero-title span,
.hero:hover .hero-title span{
  transform:none !important;
  scale:1 !important;
  rotate:none !important;
  translate:none !important;
  animation:none !important;
  transition:none !important;
  will-change:auto !important;
}

.hero .hero-image{
  background-position:center center !important;
}

.hero-title{
  font-size:clamp(58px,6vw,104px) !important;
  line-height:.82 !important;
  width:min(720px,44vw) !important;
  max-width:720px !important;
  margin:24px 0 26px !important;
  color:var(--eft-white-strong) !important;
}

.hero-title span{color:var(--eft-white-strong) !important}
.hero-title span:last-child{color:#9ed9e8 !important}

/* Subtly softer white typography. */
.hero .hero-copy,
.resources .section-head h2,
.card h3,
.maps-page .maps-title,
.maps-page .map-card h2{
  color:var(--eft-white) !important;
}

.hero .hero-copy{opacity:.96 !important}

.hero .micro,
.hero .coordinates,
.hero .coordinates b,
.hero .node,
.maps-page .maps-copy,
.maps-page .maps-node,
.maps-page .maps-foot,
.maps-page .maps-foot *,
.maps-page .back-btn{
  color:var(--eft-white-soft) !important;
}

.hero .eyebrow,
.maps-page .maps-kicker{
  color:#b8d2da !important;
}

/* CTA: highlight/scale only — no sideways travel. */
.hero-actions > a.btn.primary[href="#resources"]{
  transform:none !important;
  transition:transform .24s cubic-bezier(.2,.8,.2,1),
             box-shadow .24s ease,
             background .24s ease,
             border-color .24s ease !important;
}
.hero-actions > a.btn.primary[href="#resources"]:hover{
  transform:scale(1.025) !important;
  box-shadow:0 16px 40px rgba(120,191,213,.22),
             0 0 28px rgba(143,211,232,.12) !important;
}
.hero-actions > a.btn.primary[href="#resources"]:active{
  transform:scale(.995) !important;
}

/* Scroll cue: only a subtle glow/scale. The arrows stay fixed. */
.hero .scroll-cue,
.hero .scroll-cue:hover{
  transform:translateX(-50%) scale(1) !important;
  transition:transform .24s ease,opacity .24s ease,
             border-color .24s ease,background .24s ease,
             box-shadow .24s ease !important;
}
.hero .scroll-cue:hover{
  transform:translateX(-50%) scale(1.08) !important;
  opacity:1 !important;
  border-color:rgba(143,211,232,.68) !important;
  background:rgba(143,211,232,.055) !important;
  box-shadow:0 0 0 1px rgba(143,211,232,.07),
             0 0 26px rgba(143,211,232,.16) !important;
}
.hero .scroll-cue i,
.hero .scroll-cue:hover i,
.hero .scroll-cue:hover i:first-child,
.hero .scroll-cue:hover i:last-child{
  transform:rotate(45deg) !important;
  transition:opacity .24s ease !important;
}

/* Homepage resource cards: restrained lift/highlight. */
.resource-grid > .card:hover{
  transform:translate3d(0,-8px,0) scale(1.01) !important;
  border-color:rgba(143,211,232,.44) !important;
  box-shadow:0 22px 55px rgba(0,0,0,.40),
             0 0 30px rgba(143,211,232,.055),
             inset 0 1px 0 rgba(255,255,255,.04) !important;
}
.resource-grid > .card:hover .art{
  transform:scale(1.045) !important;
}
.resource-grid > .card p{color:#9aaeb5 !important}

/* Icons are clean glyphs, never boxed. */
.resource-grid > .card > .card-icon{
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  display:block !important;
  color:var(--eft-cyan) !important;
  font-size:20px !important;
}
.resource-grid > .card:hover > .card-icon{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  transform:translateY(-3px) rotate(-4deg) !important;
  color:var(--eft-cyan-bright) !important;
  filter:drop-shadow(0 0 7px rgba(143,211,232,.18)) !important;
}

/* Map archive: same visual language as homepage. */
.maps-page .maps-title{color:var(--eft-white-strong) !important}
.maps-page .back-btn{color:var(--eft-white) !important}
.maps-page .maps-kicker{color:#b8d2da !important}
.maps-page .map-card{
  overflow:hidden !important;
  clip-path:inset(0 round 22px) !important;
  background-position:center center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}
.maps-page .map-card:hover{
  transform:translateY(-8px) scale(1.01) !important;
  border-color:rgba(143,211,232,.44) !important;
  box-shadow:0 22px 55px rgba(0,0,0,.40),
             0 0 30px rgba(143,211,232,.055),
             inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* Map artwork is strictly static and clipped to its card. */
.maps-page .map-card,
.maps-page .map-card:hover{
  background-position:center center !important;
}
.maps-page .map-card > img,
.maps-page .map-card picture,
.maps-page .map-card picture img,
.maps-page .map-card .map-background,
.maps-page .map-card .map-image{
  transform:none !important;
  scale:1 !important;
  rotate:none !important;
  translate:none !important;
  transition:none !important;
  animation:none !important;
  transform-origin:center center !important;
}
.maps-page .map-card .map-grid,
.maps-page .map-card:hover .map-grid{
  transform:none !important;
  scale:1 !important;
  rotate:none !important;
  translate:none !important;
}
.maps-page .map-card h2{color:var(--eft-white) !important}
.maps-page .map-card p{color:#9aaeb5 !important}
.maps-page .map-card:hover h2{color:var(--eft-white-strong) !important}
.maps-page .map-card:hover p{color:#a9bac0 !important}
.maps-page .map-status{color:#8fa8b1 !important}
.maps-page .map-index{color:#78939e !important}

/* Keyboard focus remains visible and consistent. */
a:focus-visible{
  outline:1px solid rgba(143,211,232,.85) !important;
  outline-offset:4px !important;
}

/* Responsive hero title. */
@media (max-width:1100px){
  .hero-title{
    width:min(640px,58vw) !important;
    max-width:640px !important;
    font-size:clamp(54px,7.2vw,88px) !important;
  }
}
@media (max-width:700px){
  .hero-title{
    width:92vw !important;
    max-width:92vw !important;
    font-size:clamp(48px,12.5vw,72px) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .cursor-glow{display:none !important}
  .hero .scroll-cue,
  .hero .scroll-cue:hover,
  .resource-grid > .card,
  .resource-grid > .card:hover,
  .maps-page .map-card,
  .maps-page .map-card:hover,
  .hero-actions > a.btn.primary[href="#resources"],
  .hero-actions > a.btn.primary[href="#resources"]:hover{
    transform:none !important;
    transition:none !important;
  }
}


/* ================================================================
   V60 — RESTORE MAGNETIC CARD MOTION
   The V59 polish accidentally neutralised the translate values that
   main.js calculates on pointer movement. Restore that motion for
   every interactive card while keeping map artwork itself static.
   ================================================================ */

/* Homepage resource cards */
.resource-grid > .card{
  transform:translate3d(var(--mx,0px),var(--my,0px),0) !important;
  transition:
    transform .38s cubic-bezier(.16,.8,.2,1),
    border-color .35s ease,
    box-shadow .38s ease !important;
}

.resource-grid > .card:hover{
  transform:translate3d(
    var(--mx,0px),
    calc(var(--my,0px) - 8px),
    0
  ) scale(1.01) !important;
}

/* Map cards use exactly the same shell motion. */
.maps-page .map-card{
  transform:translate3d(var(--mx,0px),var(--my,0px),0) !important;
  transition:
    transform .38s cubic-bezier(.16,.8,.2,1),
    border-color .35s ease,
    box-shadow .38s ease !important;
  will-change:transform !important;
}

.maps-page .map-card:hover{
  transform:translate3d(
    var(--mx,0px),
    calc(var(--my,0px) - 8px),
    0
  ) scale(1.01) !important;
}

/* When the pointer leaves, main.js removes --mx/--my and the card
   smoothly returns to its neutral position. */
.resource-grid > .card:not(:hover),
.maps-page .map-card:not(:hover){
  transition:
    transform .45s cubic-bezier(.16,.8,.2,1),
    border-color .35s ease,
    box-shadow .38s ease !important;
}

/* Absolutely no movement is applied to the actual map artwork. */
.maps-page .map-card > img,
.maps-page .map-card picture,
.maps-page .map-card picture img,
.maps-page .map-card .map-background,
.maps-page .map-card .map-image,
.maps-page .map-card .map-grid{
  transform:none !important;
  animation:none !important;
  transform-origin:center center !important;
}

/* Keep the map's sweep/scan animation — it is a decorative overlay,
   not a zoom/pan of the map image. */
.maps-page .map-card:hover .map-sweep{
  transform:translateX(120%) !important;
}

/* The icon may animate, but never the map image behind it. */
.maps-page .map-card:hover .map-icon{
  transform:rotate(90deg) scale(1.15) !important;
}

@media (max-width:760px){
  .maps-page .map-card:hover{
    transform:translate3d(
      var(--mx,0px),
      calc(var(--my,0px) - 4px),
      0
    ) scale(1.005) !important;
  }
}