/* =========================================================
   STA CITY LANDING - STARTER INTEGRATION
   Minimal global layer for reusable city landing sections
   Reuses existing schools / lightbox architecture
========================================================= */
:root{
  --sta-green:#3D7031;
  --sta-gold:#C3A890;
  --sta-ink:#1F2A20;
  --sta-muted:#4a4a4a;
  --sta-border:#E9E5E1;
  --sta-card-bg:#FFFFFF;
  --sta-soft-bg:#FAF9F7;
  --sta-shadow:0 10px 28px rgba(0,0,0,.06);
  --sta-radius:14px;
  --sta-radius-sm:12px;
  --sta-font-sans:"Poppins","Noto Sans TC","Microsoft JhengHei","Heiti TC",sans-serif;
  --sta-city-max:1200px;
  --sta-city-scroll-offset:110px;
}

/* ===== Scope ===== */
.sta-city-page,
.sta-city-page *,
.sta-city-section,
.sta-city-section *{
  box-sizing:border-box;
}

.sta-city-page,
.sta-city-section{
  font-family:var(--sta-font-sans);
  color:var(--sta-ink);
  width:100%;
}

.sta-city-page img,
.sta-city-section img{
  display:block;
  max-width:100%;
  height:auto;
}

.sta-city-page a,
.sta-city-section a{
  color:var(--sta-green);
  text-decoration:underline;
  text-underline-offset:2px;
}

.sta-city-page a:hover,
.sta-city-section a:hover{
  color:#1f4d17;
}

.sta-city-page strong,
.sta-city-section strong{
  font-weight:700;
}

.sta-city-page p,
.sta-city-page li,
.sta-city-section p,
.sta-city-section li{
  color:#333;
  line-height:1.7;
}

.sta-city-page ul,
.sta-city-page ol,
.sta-city-section ul,
.sta-city-section ol{
  margin:.45rem 0 .25rem 1.1rem;
  padding:0;
}

.sta-city-page section[id],
.sta-city-section[id]{
  scroll-margin-top:var(--sta-city-scroll-offset);
}

.sta-city-wrap{
  width:100%;
  max-width:var(--sta-city-max);
  margin-inline:auto;
  padding-inline:12px;
}

.sta-city-section{
  width:100%;
}

/* ===== Cards ===== */
.sta-city-card{
  background:var(--sta-card-bg);
  border:1px solid var(--sta-border);
  border-radius:var(--sta-radius);
  padding:16px 18px;
  margin:16px 0;
  box-shadow:var(--sta-shadow);
}

.sta-city-card h2{
  margin:.25rem 0 10px;
  font-family:var(--sta-font-sans);
  font-size:clamp(22px, 3.2vw, 32px);
  font-weight:700;
  line-height:1.18;
  letter-spacing:-0.015em;
  color:var(--sta-ink);
}

.sta-city-card h3{
  margin:.2rem 0 .45rem;
  font-family:var(--sta-font-sans);
  font-size:19px;
  font-weight:700;
  line-height:1.28;
  letter-spacing:-0.01em;
  color:var(--sta-ink);
}

.sta-city-card .intro,
.sta-city-card .lead{
  margin:0 0 12px;
  color:var(--sta-muted);
  line-height:1.7;
}

.sta-transport,
.sta-zones,
.sta-fiestas-wrap,
.sta-food,
.sta-faq{
  background:var(--sta-card-bg);
  border:1px solid var(--sta-border);
  border-radius:var(--sta-radius);
  padding:16px 18px;
  margin:16px 0;
  box-shadow:var(--sta-shadow);
}

.sta-transport h2,
.sta-zones h2,
.sta-fiestas-wrap h2,
.sta-food h2,
.sta-monuments h2,
.sta-faq h2{
  margin:.25rem 0 10px;
  font-family:var(--sta-font-sans);
  font-size:clamp(22px, 3.2vw, 32px);
  font-weight:700;
  line-height:1.18;
  letter-spacing:-0.015em;
  color:var(--sta-ink);
}

.sta-transport .lead,
.sta-zones .lead,
.sta-fiestas-wrap .intro,
.sta-food .intro,
.sta-monuments .lead{
  margin:0 0 12px;
  color:var(--sta-muted);
  line-height:1.7;
}

.sta-zones__grid{
  gap:14px;
}

.sta-zones__card{
  border:1px solid var(--sta-border);
  border-radius:12px;
  padding:14px;
  background:#fff;
  box-shadow:0 10px 28px rgba(0,0,0,.06);
}

.sta-zones__card h3{
  margin:.2rem 0 .35rem;
  font-family:var(--sta-font-sans);
  color:var(--sta-ink);
  font-size:20px;
  font-weight:700;
  line-height:1.28;
  letter-spacing:-0.01em;
}

.sta-zones__card p{
  margin:.35rem 0 .65rem;
  color:#333;
  line-height:1.68;
}

.sta-zones__card ul{
  margin:.25rem 0 0 1rem;
  color:#333;
}

.sta-zones__card li{
  margin:.28rem 0;
}

.sta-fiestas-wrap::after{
  content:"";
  display:block;
  clear:both;
}

.sta-fiestas-wrap__figure{
  float:left;
  width:min(36%, 380px);
  margin:1rem 1.6rem 1.4rem 0;
  padding-right:1.6rem;
}

@supports (shape-outside: inset(0 round 8px)){
  .sta-fiestas-wrap__figure{
    shape-outside:inset(0 round 8px);
  }
}

.sta-fiestas-wrap__figure img{
  width:100%;
  height:auto;
  display:block;
  border-radius:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.12);
}

.sta-fiestas-wrap__figure figcaption{
  position:absolute !important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.sta-transport__grid{
  gap:16px;
}

.sta-transport__card,
.fiesta{
  border:1px solid var(--sta-border);
  border-radius:12px;
  padding:12px 14px;
  background:var(--sta-soft-bg);
}

.sta-transport__card h3,
.fiesta .title{
  margin:.25rem 0 .35rem;
  font-family:var(--sta-font-sans);
  font-size:20px;
  font-weight:700;
  line-height:1.28;
  letter-spacing:-0.01em;
  color:var(--sta-ink);
}

.sta-transport__card > *:last-child,
.fiesta > *:last-child,
.sta-block > *:last-child{
  margin-bottom:0;
}

.sta-fiestas-grid{
  display:grid;
  gap:14px;
  grid-template-columns:1fr;
  clear:both;
}

@media (min-width:860px){
  .sta-fiestas-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

.fiesta-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:6px;
}

.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--sta-green);
  color:#fff;
  font-weight:700;
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  letter-spacing:.02em;
  white-space:nowrap;
}

.fiesta .desc{
  margin:.25rem 0;
  color:#333;
}

.fiesta .meta{
  margin:0;
  color:#666;
  font-size:13.5px;
}

.sta-transport .note,
.sta-fiestas-wrap .note,
.sta-food .note{
  margin:12px 0 0;
  font-size:14px;
  color:#444;
  background:#F9F8F6;
  border:1px dashed var(--sta-gold);
  border-radius:10px;
  padding:10px;
  line-height:1.55;
}

.fiestas-more-wrap{
  text-align:center;
  margin-top:10px;
  clear:both;
}

.sta-city-subcard{
  border:1px solid var(--sta-border);
  border-radius:var(--sta-radius-sm);
  padding:12px 14px;
  background:var(--sta-soft-bg);
}

.sta-reasons-grid .sta-city-subcard.reason h3{
  margin:0 0 .55rem;
  font-size:19px;
  font-weight:600;
  line-height:1.25;
  letter-spacing:-0.01em;
  color:var(--sta-ink);
}

.sta-city-subcard > *:last-child{
  margin-bottom:0;
}

/* ===== Generic grids ===== */
.sta-city-grid-2{
  display:grid;
  gap:16px;
  grid-template-columns:1fr;
}

.sta-city-grid-3{
  display:grid;
  gap:16px;
  grid-template-columns:1fr;
}

.sta-city-grid-4{
  display:grid;
  gap:16px;
  grid-template-columns:1fr;
}

@media (min-width:860px){
  .sta-city-grid-2{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sta-city-grid-3{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .sta-city-grid-4{ grid-template-columns:repeat(4, minmax(0, 1fr)); }
}

@media (max-width:768px){
  .sta-fiestas-wrap__figure{
    float:none;
    width:100%;
    margin:0 0 1rem;
    padding-right:0;
  }
}

/* ===== Buttons ===== */
.sta-btn,
.sta-btn-more,
.btn-more{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:var(--sta-green);
  color:#fff;
  border:0;
  border-radius:10px;
  padding:10px 14px;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
  transition:background .25s ease,color .25s ease,transform .2s ease;
}

.sta-btn:hover,
.sta-btn-more:hover,
.btn-more:hover{
  background:var(--sta-gold);
  color:var(--sta-ink);
  text-decoration:none;
}

.sta-btn:active,
.sta-btn-more:active,
.btn-more:active{
  transform:translateY(1px);
}

.sta-btn:focus-visible,
.sta-btn-more:focus-visible,
.btn-more:focus-visible,
.sta-city-page a:focus-visible,
.sta-faq summary:focus-visible{
  outline:2px solid var(--sta-green);
  outline-offset:2px;
}

/* ===== Notes ===== */
.sta-note{
  margin-top:12px;
  padding:10px;
  border:1px dashed var(--sta-gold);
  border-radius:10px;
  background:#F9F8F6;
  font-size:14px;
  line-height:1.55;
  color:#444;
}

/* ===== FAQ ===== */
.sta-faq .faq-list{
  display:grid;
  gap:10px;
}

.sta-faq details{
  border:1px solid var(--sta-border);
  border-radius:12px;
  background:#FAFAFA;
  transition:border-color .2s ease, background .2s ease;
}

.sta-faq details[open]{
  background:#F9F8F6;
  border-color:#E3DFDB;
}

.sta-faq summary{
  list-style:none;
  cursor:pointer;
  padding:12px 14px;
  font-family:var(--sta-font-sans);
  font-size:19px;
  font-weight:700;
  line-height:1.35;
  letter-spacing:-0.01em;
  display:flex;
  align-items:center;
  gap:8px;
}

.sta-faq summary::-webkit-details-marker{
  display:none;
}

.sta-faq summary::after{
  content:"\25BC";
  margin-left:auto;
  font-size:14px;
  color:#6B7280;
  transition:transform .2s ease;
}

.sta-faq details[open] summary::after{
  transform:rotate(180deg);
}

.sta-faq .answer{
  padding:0 14px 12px;
  line-height:1.65;
  color:#333;
}

.sta-faq .answer > *:last-child{
  margin-bottom:0;
}

/* ===== Gallery ===== */
.sta-gallery-grid{
  display:grid;
  gap:14px;
  grid-template-columns:repeat(5, minmax(0, 1fr));
}

@media (max-width:1024px){
  .sta-gallery-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
}

@media (max-width:680px){
  .sta-gallery-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

.sta-gallery-item{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:14px;
  text-decoration:none;
}

.sta-gallery-item img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  transition:transform .25s ease;
  box-shadow:0 10px 28px rgba(0,0,0,.12);
}

.sta-gallery-item:hover img{
  transform:scale(1.02);
}

.sta-gallery-more{
  text-align:center;
  margin:18px 0 6px;
}

.sta-food .food-grid{
  display:grid;
  gap:16px;
  grid-template-columns:repeat(4, minmax(0, 1fr));
}

@media (min-width:1025px){
  .sta-food .food-grid.food-grid--five{
    grid-template-columns:repeat(5, minmax(0, 1fr));
  }
}

@media (max-width:1024px){
  .sta-food .food-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:640px){
  .sta-food .food-grid{
    grid-template-columns:1fr;
  }
}

.food-card{
  background:var(--sta-soft-bg);
  border:1px solid var(--sta-border);
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 6px 16px rgba(0,0,0,.05);
}

.food-link{
  color:inherit;
  text-decoration:none !important;
  display:block;
}

.food-figure{
  margin:0;
  position:relative;
}

.food-img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  aspect-ratio:4/3;
  transition:transform .25s ease, filter .25s ease;
}

.food-figure:hover .food-img{
  transform:scale(1.02);
  filter:brightness(.98);
}

.food-caption{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:22px 12px 10px;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(to top, rgba(0,0,0,.45), rgba(0,0,0,0));
}

.food-title{
  font-weight:700;
  font-size:16.5px;
  text-shadow:0 1px 8px rgba(0,0,0,.35);
}

.food-desc{
  font-size:13.5px;
  opacity:.95;
}

.food-list{
  margin:14px 0 0;
  padding:12px 14px;
  background:#fff;
  border:1px solid var(--sta-border);
  border-radius:12px;
}

.food-list h3{
  margin:.1rem 0 .6rem;
  font-size:18px;
}

.food-list ul{
  margin:0;
  padding-left:1.15rem;
}

.food-list li{
  margin:.35rem 0;
  line-height:1.55;
  color:#333;
}

.credits{
  margin:10px 0 0;
  font-size:12.5px;
  color:#555;
}

.sta-monuments{
  margin:16px 0;
}

.sta-block{
  margin:.75rem 0 1rem;
  line-height:1.7;
}

.sta-block h3{
  margin:.6rem 0 .25rem;
  font-weight:900;
}

.sevmon-slider{
  position:relative;
  margin:1.1rem 0 0;
  padding:14px 50px;
  overflow:visible;
  isolation:isolate;
}

.sevmon-track{
  display:flex;
  align-items:center;
  gap:14px;
  overflow:hidden;
  min-height:min(58vh, 540px);
  position:relative;
  z-index:1;
}

.sevmon-slide{
  position:relative;
  flex:0 0 20%;
  border-radius:16px;
  overflow:hidden;
  transform:scale(.9);
  opacity:.65;
  transition:transform .35s ease, opacity .35s ease, flex-basis .35s ease;
  box-shadow:0 16px 38px rgba(0,0,0,.16);
  cursor:zoom-in;
  text-decoration:none !important;
}

.sevmon-slide img{
  width:100%;
  height:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  display:block;
}

.sevmon-cap{
  position:absolute;
  left:10px;
  bottom:10px;
  background:rgba(0,0,0,.55);
  color:#fff;
  padding:6px 10px;
  border-radius:10px;
  font-size:.85rem;
  font-weight:900;
}

.sevmon-slide.is-active{
  flex:0 0 60%;
  transform:scale(1);
  opacity:1;
}

.sevmon-slide.is-prev,
.sevmon-slide.is-next{
  flex:0 0 20%;
  transform:scale(.94);
  opacity:.9;
}

.sevmon-slide.is-hidden{
  flex:0 0 0;
  width:0;
  margin:0;
  padding:0;
  opacity:0;
  pointer-events:none;
}

.sevmon-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%) !important;
  z-index:30;
  width:50px;
  height:50px;
  min-width:50px;
  min-height:50px;
  padding:0;
  margin:0;
  border-radius:999px;
  border:1px solid var(--sta-gold);
  outline:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  color:var(--sta-gold);
  font-size:22px;
  line-height:1;
  pointer-events:auto;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  box-shadow:0 10px 26px rgba(31,42,32,.12);
  transition:transform .2s ease, box-shadow .2s ease, color .2s ease, background-color .2s ease;
  touch-action:manipulation;
}

.sevmon-nav span{
  display:block;
  font-size:30px;
  line-height:1;
  font-weight:400;
  color:inherit;
  transform:translateY(-1px);
}

.sevmon-nav:hover,
.sevmon-nav:focus{
  transform:translateY(-50%) !important;
  background:#fff;
  color:#b89578;
  box-shadow:0 14px 30px rgba(31,42,32,.16);
}

.sevmon-prev{ left:-23px; }
.sevmon-next{ right:-23px; }

@media (max-width:980px){
  .sevmon-slider{ padding:10px 42px; }
  .sevmon-nav{
    width:46px;
    height:46px;
    min-width:46px;
    min-height:46px;
  }
  .sevmon-prev{ left:-18px; }
  .sevmon-next{ right:-18px; }
  .sevmon-slide.is-active{ flex:0 0 66%; }
  .sevmon-slide.is-prev,
  .sevmon-slide.is-next{ flex:0 0 17%; }
}

@media (max-width:640px){
  .sevmon-slider{ padding:10px 32px; }

  .sevmon-nav{
    width:42px;
    height:42px;
    min-width:42px;
    min-height:42px;
  }

  .sevmon-nav span{
    font-size:24px;
    transform:translateY(-1px);
  }

  .sevmon-prev{ left:-12px; }
  .sevmon-next{ right:-12px; }

  .sevmon-slide.is-active{ flex:0 0 80%; }
  .sevmon-slide.is-prev,
  .sevmon-slide.is-next{ flex:0 0 10%; }
  .sevmon-cap{ font-size:.8rem; }
}

/* ===== Marquee ===== */
.sta-city-marquee-block{
  margin:16px 0;
  background:transparent;
  border:0;
  box-shadow:none;
  border-radius:0;
  padding:0;
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}

.elementor-element .sta-city-marquee-block,
.e-con .sta-city-marquee-block,
.elementor-widget-container .sta-city-marquee-block,
.elementor-widget-html .sta-city-marquee-block{
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding:0 !important;
  border:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

.sta-city-marquee,
.sta-city-marquee__viewport{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.sta-city-marquee{
  --sta-city-marquee-gap:16px;
  --sta-city-marquee-height:280px;
  --sta-city-marquee-speed:40;
  --sta-city-marquee-slide-width:clamp(260px, 24vw, 360px);
  position:relative;
  width:100vw;
  max-width:100vw;
  overflow:hidden;
}

.sta-city-marquee__viewport{
  overflow:hidden;
  width:100vw;
  padding-inline:12px;
}

.sta-city-marquee__track{
  display:flex;
  align-items:center;
  gap:var(--sta-city-marquee-gap);
  width:max-content;
  will-change:transform;
  transform:translate3d(0,0,0);
}

.sta-city-marquee__slide,
.sta-city-page .sta-city-marquee__slide,
.sta-city-page a.sta-city-marquee__slide{
  display:block;
  flex:0 0 var(--sta-city-marquee-slide-width);
  width:var(--sta-city-marquee-slide-width);
  min-width:var(--sta-city-marquee-slide-width);
  max-width:var(--sta-city-marquee-slide-width);
  height:var(--sta-city-marquee-height);
  border-radius:14px;
  overflow:hidden;
  text-decoration:none !important;
  color:inherit;
  position:relative;
  cursor:pointer;
  background:transparent;
}

.sta-city-page .sta-city-marquee__slide img,
.sta-city-marquee__slide img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover !important;
  max-width:none;
  border-radius:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.15);
  transition:transform .25s ease;
}

.sta-city-marquee__slide:hover img{
  transform:translateY(-2px) scale(1.02);
}

/* Z-INDEX: Theme lightbox > Elementor */
.sta-lightbox{
  z-index:1000000 !important;
}

.sta-lightbox.is-open{
  display:flex !important;
}

/* Disable Elementor lightbox inside marquee */
.sta-city-marquee-block * .elementor-lightbox,
.sta-city-marquee-block * .dialog-lightbox-widget,
.sta-city-marquee-block .dialog-widget{
  display:none !important;
  pointer-events:none !important;
  visibility:hidden !important;
}

.sta-city-marquee__slide,
.sta-city-marquee__slide img,
.sta-city-marquee__slide a{
  pointer-events:auto !important;
}

/* Force lightbox controls visible */
.sta-lightbox .sta-lightbox__btn,
.sta-lightbox .sta-lightbox__close{
  z-index:1000001 !important;
  opacity:1 !important;
  visibility:visible !important;
}

.sr-only,
.sta-city-marquee__sr{
  position:absolute !important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

@media (max-width:1024px){
  .sta-city-marquee{
    --sta-city-marquee-gap:14px;
    --sta-city-marquee-height:220px;
    --sta-city-marquee-slide-width:clamp(230px, 42vw, 320px);
  }
}

@media (max-width:767px){
  .sta-city-marquee{
    --sta-city-marquee-gap:12px;
    --sta-city-marquee-height:200px;
    --sta-city-marquee-slide-width:84vw;
  }

  .sta-city-marquee__viewport{
    padding-inline:10px;
  }
}

/* ===== Status / helpers ===== */
.sta-status{ opacity:.8; }
.sta-hidden{ display:none !important; }
.sta-no-scroll{ overflow:hidden !important; }

/* ===== Optional CTA card ===== */
.sta-city-cta{
  border:1px solid var(--sta-border);
  border-radius:14px;
  padding:18px;
  background:#F9F8F6;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  margin:6px 0 12px;
  box-shadow:var(--sta-shadow);
}

.sta-city-cta h2,
.sta-city-cta h3,
.sta-city-cta p{
  margin:0;
}

.sta-city-cta p{
  color:var(--sta-muted);
}

/* ===== Compatibility with schools city blocks ===== */
.sta-city-page .sta-city-wrap,
.sta-city-page .st-scope-grid{
  width:100%;
  max-width:var(--sta-city-max);
  margin-inline:auto;
  padding-inline:12px;
}

.sta-city-page .st-scope-grid .cta-card{
  border:1px solid var(--sta-border);
  border-radius:14px;
  padding:18px;
  background:#F9F8F6;
  box-shadow:var(--sta-shadow);
}

.sta-city-page .st-scope-grid .cta-card .btn,
.sta-city-page .st-scope-grid .btn-loadmore{
  background:var(--sta-green);
  color:#fff;
}

.sta-city-page .st-scope-grid .cta-card .btn:hover,
.sta-city-page .st-scope-grid .btn-loadmore:hover{
  background:var(--sta-gold);
  color:var(--sta-ink);
}

/* Keep school CTA buttons aligned with the home card styling. */
.sta-city-page .sta-school-card__button,
.sta-city-section .sta-school-card__button{
  color:#fff;
  text-decoration:none;
}

.sta-city-page .sta-school-card__button:hover,
.sta-city-page .sta-school-card__button:focus,
.sta-city-section .sta-school-card__button:hover,
.sta-city-section .sta-school-card__button:focus{
  color:#fff;
  text-decoration:none;
}

.sta-city-schools{
  margin:16px 0;
}

.sta-city-schools__cta{
  border:1px solid var(--sta-border);
  border-radius:14px;
  padding:18px;
  background:#F9F8F6;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  margin:0 0 12px;
  box-shadow:var(--sta-shadow);
}

.sta-city-schools__copy h2{
  margin:0 0 6px;
}

.sta-city-schools__copy p{
  margin:0;
  color:var(--sta-muted);
}

.sta-city-schools__button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--sta-green);
  color:#fff !important;
  border-radius:10px;
  padding:10px 16px;
  font-weight:900;
  text-decoration:none !important;
}

.sta-city-schools__button:hover{
  background:var(--sta-gold);
  color:var(--sta-ink) !important;
}

/* ===== Reduced motion ===== */
@media (prefers-reduced-motion:reduce){
  .sta-city-page *,
  .sta-city-page *::before,
  .sta-city-page *::after{
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
  }
}

/* =========================================================
   STA CITY LANDING — TOC + MAP
========================================================= */

.sta-toc{
  border:1px solid var(--sta-border);
  border-radius:12px;
  padding:10px 12px;
  background:#F9F8F6;
  margin:8px 0 16px;
  box-shadow:none;
}

.sta-toc strong{
  display:block;
  margin-bottom:6px;
  color:var(--sta-ink);
}

.sta-toc a{
  display:inline-block;
  margin:4px 10px 4px 0;
  color:var(--sta-ink);
  text-decoration:none;
  border-bottom:1px dashed var(--sta-gold);
  line-height:1.6;
  transition:color .2s ease, border-color .2s ease;
}

.sta-toc a:hover,
.sta-toc a[aria-current="true"]{
  color:var(--sta-green);
  border-bottom-color:var(--sta-green);
}

.sta-toc a[aria-current="true"]{
  font-weight:700;
}

.sta-city-map{
  position:relative;
  width:100%;
}

.sta-city-map__canvas{
  display:block;
  width:100%;
  height:430px;
  min-height:430px;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(0,0,0,.08);
  background:#EDEAE5;
}

.sta-city-map__canvas .leaflet-pane,
.sta-city-map__canvas .leaflet-control,
.sta-city-map__canvas .leaflet-top,
.sta-city-map__canvas .leaflet-bottom{
  z-index:auto;
}

.sta-city-map__canvas .leaflet-control-layers{
  border:1px solid var(--sta-border);
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  font-family:var(--sta-font-sans);
}

.sta-city-map__canvas .leaflet-control-layers-expanded{
  padding:10px 12px;
}

.sta-city-map__canvas .leaflet-control-layers label{
  font-size:.92rem;
  color:var(--sta-ink);
}

.sta-city-map__canvas .leaflet-popup-content-wrapper{
  border-radius:12px;
  box-shadow:0 12px 28px rgba(0,0,0,.16);
}

.sta-city-map__canvas .leaflet-popup-content{
  margin:12px 14px;
  font-family:var(--sta-font-sans);
  line-height:1.55;
}

.sta-city-map__canvas .leaflet-popup-content strong{
  display:block;
  margin-bottom:4px;
  color:var(--sta-ink);
}

.sta-city-map__popup{
  min-width:200px;
}

.sta-city-map__popup-title{
  display:block;
  margin-bottom:4px;
  color:var(--sta-ink);
}

.sta-city-map__popup-desc{
  font-size:.9rem;
  color:#333;
}

.leaflet-control.sta-select{
  background:#fff;
  border:1px solid var(--sta-border);
  border-radius:10px;
  padding:8px;
  font-family:var(--sta-font-sans);
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}

.leaflet-control.sta-select label{
  display:block;
  font-size:.8rem;
  margin-bottom:4px;
  color:var(--sta-ink);
  font-weight:600;
}

.leaflet-control.sta-select select{
  width:220px;
  max-width:60vw;
  border:1px solid #E3DFDB;
  border-radius:8px;
  padding:6px 8px;
  font-size:.9rem;
  font-family:var(--sta-font-sans);
  background:#fff;
  color:var(--sta-ink);
}

@media (max-width: 640px){
  .sta-city-map__canvas{
    height:360px;
    min-height:360px;
  }

  .leaflet-control.sta-select select{
    width:170px;
  }
}