/* Final readability and navigation pass shared by the guide and legal pages. */
:root { --coral-strong: #cf3f24; }

.button.primary,
.alert-strip,
.local-note,
.graduate-card,
.budget-balance.negative,
.tag.danger,
.transit-steps li::before,
.day-route li::before {
  background: var(--coral-strong);
}

.alert-strip .eyebrow,
.local-note .eyebrow,
.graduate-card .eyebrow {
  color: #fff;
}

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 10px;
  left: 10px;
  padding: 10px 14px;
  border-radius: 8px;
  color: #fff;
  background: var(--navy);
  font-weight: 800;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform .18s ease;
}

.skip-link:focus { transform: translateY(0); }

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible {
  outline: 3px solid var(--coral);
  outline-offset: 3px;
}

section[id],
article[id] { scroll-margin-top: 105px; }

.section-heading > p:last-child,
.gallery-heading > p:last-child { max-width: 62ch; }

.guide-card > p,
.guide-card details > p,
.guide-card details > ul,
.guide-card details > ol { max-width: 76ch; }

.guide-card li + li,
.compare-card li + li { margin-top: .55rem; }

.guide-card details {
  border-radius: 10px;
  transition: background .18s ease;
}

.guide-card details[open] { background: rgba(220, 239, 244, .35); }
.guide-card.featured details[open] { background: rgba(255, 255, 255, .035); }

.guide-card summary {
  min-height: 44px;
  padding: 10px 8px;
  line-height: 1.35;
}

.guide-card summary::marker { color: var(--coral); }
.guide-card.featured summary::marker { color: var(--lime); }

.guide-card details[open] > :not(summary) {
  margin-left: 8px;
  margin-right: 8px;
}

.app-links a,
.housing-links a,
.map-links a,
.study-links a {
  min-height: 44px;
  display: flex;
  align-items: center;
}

.guide-card a,
.galway-intro a,
.study-value a,
.legal-card a,
footer a {
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

.source-note {
  max-width: 92ch;
  padding-top: 14px;
  border-top: 1px solid rgba(16, 45, 59, .1);
}

.food-card { grid-column: span 2; }

@media (max-width: 900px) {
  html { scroll-padding-top: 132px; }

  .topbar {
    height: auto;
    min-height: 82px;
    flex-wrap: wrap;
    gap: 2px 12px;
    padding-top: 7px;
    padding-bottom: 8px;
  }

  .topbar nav {
    display: flex;
    order: 3;
    flex: 0 0 100%;
    gap: 5px;
    overflow-x: auto;
    padding: 4px;
    border-radius: 12px;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }

  .topbar nav::-webkit-scrollbar { display: none; }

  .topbar nav a {
    flex: 0 0 auto;
    padding: 7px 11px;
    scroll-snap-align: start;
  }

  section[id],
  article[id] { scroll-margin-top: 140px; }
}

@media (max-width: 620px) {
  .topbar { height: auto; min-height: 68px; }
  .save-link.back-link { font-size: .78rem; }
  .food-card { grid-column: auto; }
  .guide-card { padding: 26px 22px; }
  .guide-card.photo-card { padding: 0; }
  .guide-card h3 { margin-top: 34px; }
  .guide-card details[open] > :not(summary) { margin-left: 4px; margin-right: 4px; }
  .legal-page { padding-top: 72px; }
}

@media (prefers-reduced-motion: reduce) {
  .skip-link,
  .guide-card details { transition: none; }
}

/* Make the mobile menu's horizontal overflow discoverable. */
.nav-scroll-shell{display:contents}.nav-scroll-arrow,.nav-scroll-hint{display:none}
@media(max-width:900px){
  html{scroll-padding-top:156px}
  .nav-scroll-shell{display:flex;position:relative;order:3;flex:0 0 100%;min-width:0;align-items:center;gap:5px;flex-wrap:wrap}
  .nav-scroll-shell .nav-scroll-arrow{display:block;flex:0 0 32px;width:32px;height:36px;border:1px solid var(--line);border-radius:9px;background:var(--navy);color:#fff;font-size:27px;line-height:1;cursor:pointer}
  .nav-scroll-shell .nav-scroll-arrow:disabled{background:transparent;color:var(--muted);opacity:.35;cursor:default}
  .nav-scroll-shell .nav-scroll-arrow:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
  .nav-scroll-shell nav{order:0;flex:1 1 0;min-width:0}
  .nav-scroll-shell .nav-scroll-hint{display:block;flex:0 0 100%;margin:0;text-align:center;font-size:.7rem;font-weight:700;line-height:1.5;color:var(--muted)}
  .nav-scroll-shell [hidden]{display:none}
  section[id],article[id]{scroll-margin-top:160px}
}