/* Update-87: romantic getaway guides and the callouts that link to them (src/getaways.py).
   A file of its own so styles.css, and with it the pages in a running test, stay as they are. */
.gw-facts { color: var(--muted); font-size: var(--fs-sm); margin: 4px 0 12px; }
.gw-facts a { color: var(--muted); }
.gw-table { max-width: none; overflow-x: auto; }
.gw-table td:first-child a { font-weight: 600; color: var(--text); }
.gw-dest { scroll-margin-top: calc(var(--hdr-h, 72px) + 12px); border-top: 1px solid var(--border); }
.gw-dest > h2 { margin-bottom: 10px; }
.gw-dest .prose h3, .gw-stay-h { font-size: var(--fs-md); margin: 18px 0 8px; }
.gw-do { margin: 0 0 12px; padding-left: 20px; }
.gw-do li { margin: 0 0 6px; }
.gw-meta p { margin: 0 0 6px; }
.gw-cards { margin-top: 8px; }
.gw-more { margin: 14px 0 0; font-weight: 600; }
.gw-more a { color: var(--text); text-underline-offset: 3px; }
.gw-links { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; }
.gw-links a { display: block; padding: 10px 0; border-bottom: 1px solid var(--border); color: var(--text);
  text-decoration: none; font-weight: 500; font-size: var(--fs-sm); }
.gw-links a:hover { color: var(--gold-text); }
.gw-sources summary { cursor: pointer; font-weight: 600; font-size: var(--fs-sm); }
.gw-sources ul { font-size: var(--fs-xs); color: var(--muted); padding-left: 18px; line-height: 1.7; }
.gw-sources a { color: var(--muted); }
.gw-callout { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 22px 0;
  padding: 18px 22px; border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--bg-alt); }
.gw-callout h2 { font-size: var(--fs-md); margin: 2px 0 4px; }
.gw-callout h2 a { color: var(--text); text-decoration: none; }
.gw-callout p { margin: 0; color: var(--muted); font-size: var(--fs-sm); }
.gw-kicker { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--gold-text); }
.gw-callout .btn { white-space: nowrap; flex: none; }
@media (max-width: 700px) {
  .gw-callout { flex-direction: column; align-items: flex-start; }
  .gw-links { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .gw-table th:nth-child(4), .gw-table td:nth-child(4) { display: none; }
}