/* Coastal editorial palette and shared guide layouts. */
:root {
  --ocean: #17594e;
  --ocean-dark: #123a35;
  --turq: #398774;
  --turq-light: #e9f3ed;
  --sand: #f5efe3;
  --ink: #17322e;
  --muted: #475e56;
}
body { background: #fcfaf5; }
.container, .topbar { width: min(100%, 1220px); max-width: none; padding-inline: clamp(18px, 4vw, 48px); }
header.site { position: relative; background: #fcfaf5; color: var(--ink); border-bottom: 1px solid #dce3da; }
.topbar { gap: 18px 30px; flex-wrap: wrap; padding-block: 14px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); font-weight: 750; letter-spacing: -.025em; white-space: nowrap; }
.brand img { flex: none; }
.brand span { color: var(--muted); font-size: .67rem; letter-spacing: .09em; }
nav.main { gap: 2px; }
nav.main a { color: var(--ink); font-weight: 600; padding: 8px 9px; font-size: .86rem; }
nav.main a:hover, nav.main a.active { background: #e5f0e9; color: var(--ocean-dark); }
:focus-visible { outline: 3px solid #ae5b25; outline-offset: 4px; }
.hero { background: var(--ocean-dark); padding-block: clamp(38px, 7vw, 88px); }
.hero h1, h2 { font-family: Georgia, 'Times New Roman', serif; letter-spacing: -.035em; }
.hero h1 { max-width: 19ch; font-weight: 600; }
.hero .lede { max-width: 56ch; color: #f0f4eb; }
.hero-home { position: relative; isolation: isolate; overflow: hidden; padding-block: 0; }
.home-hero-copy { width: min(100%, 610px); padding-block: clamp(55px, 8vw, 115px); }
.home-hero-copy h1 { font-size: clamp(2.6rem, 6vw, 4.65rem); max-width: 17ch; text-wrap: balance; }
.home-hero-copy .lede { max-width: 44ch; }
.home-hero-copy .btn:first-child { background: #ffc775; }
.home-hero-image { position: absolute; z-index: -1; inset: 0 0 0 25%; margin: 0; }
.home-hero-image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 66% 56%; }
.home-hero-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #123a35 0%, #123a35f2 13%, #123a35a6 38%, #123a3514 83%); }
.eyebrow { font-size: .76rem; font-weight: 750; letter-spacing: .15em; text-transform: uppercase; }
.hero .eyebrow { color: #ffc775; }
section { padding-block: clamp(32px, 5vw, 68px); }
h2 { font-size: clamp(1.8rem, 3vw, 2.75rem); }
.btn { border: 1px solid transparent; cursor: pointer; }
.grid { gap: clamp(14px, 2vw, 24px); grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }
.card { border-color: #dce3da; box-shadow: 0 10px 30px #123a3509; }
.guide-card { overflow: hidden; padding: 0; }
.guide-card img, .guide-photo img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
.guide-card-copy { padding: 22px; }
.guide-card-copy h3 { font-size: 1.35rem; }
.guide-photo { margin: 0; }
.guide-photo img { border-radius: 16px; }
.city-feature, .guide-hero-layout { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(22px, 5vw, 65px); }
.city-feature p { max-width: 56ch; }
.home-priority { background: #fff8e9; }
.home-priority .eyebrow { color: #86531b; }
.home-priority .countdown { background: #fffdf7; border-color: #e8d1a7; color: var(--ink); }
.searchbar input { min-width: min(100%, 220px); }
@media (max-width: 720px) {
  .city-feature, .guide-hero-layout { grid-template-columns: 1fr; }
  .home-hero-image { left: 0; }
  .home-hero-image::after { background: linear-gradient(90deg, #123a35f5 0%, #123a35c9 52%, #123a356b 100%); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media print { .guide-photo { display: none; } }

/* Editorial details for the two resource hubs and their submission forms. */
.brand { font-family: Georgia, 'Times New Roman', serif; font-size: 1.24rem; gap: 12px; }
.brand span { font-family: system-ui, sans-serif; font-size: .64rem; }
.residency-hero { background: radial-gradient(ellipse at 85% 20%, #225b4e 0, #123a35 65%); }
.residency-date { background: #f6efe0; color: var(--ink); padding: clamp(22px, 4vw, 45px); border-radius: 14px; border-top: 5px solid #ffc775; }
.residency-date .eyebrow { color: #704813; margin-top: 0; }
.residency-date strong { display: block; font: 700 clamp(1.8rem, 4vw, 3.2rem)/1.1 Georgia, serif; }
.residency-date p:last-child { margin-bottom: 0; }
.amendment-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 14px; margin-bottom: 24px; }
.amendment-summary article { background: #fff; border: 1px solid #dce3da; border-radius: 12px; padding: 22px; }
.amendment-summary strong { display: block; font: 700 clamp(1.6rem, 4vw, 2.55rem)/1.15 Georgia, serif; margin-bottom: 5px; }
.amendment-summary span { color: var(--muted); }
#amendment-details { padding: clamp(18px, 4vw, 36px); }
#amendment-details li + li { margin-top: .6em; }
.directory-filters { display: grid; grid-template-columns: 2fr repeat(3, minmax(0, 1fr)); gap: 14px; padding: clamp(18px, 4vw, 34px); }
.directory-filters h2, .directory-filters #dir-count { grid-column: 1 / -1; margin: 0; }
.directory-field { min-width: 0; }
.directory-field label { display: block; font-weight: 650; margin-bottom: 4px; }
.directory-field input, .directory-field select { width: 100%; min-height: 44px; border: 1px solid #9db5aa; border-radius: 8px; padding: 8px; font: inherit; color: var(--ink); background: white; }
.submission-panel { margin-top: 32px; background: #f0f5ee; padding: clamp(18px, 4vw, 40px); border-radius: 14px; }
.submission-form { max-width: 700px; }
.submission-form .form-message { border-left: 4px solid var(--turq); background: #fff; padding: 12px 16px; }
.submission-form button:disabled { opacity: .65; cursor: wait; }
@media (max-width: 840px) { .directory-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 450px) { .directory-filters { grid-template-columns: 1fr; } }

.site-credit { font-size: .88rem; margin: 18px 0 0; }

.ad-slot:not([hidden]) { padding-block: 20px; }
.sponsor-card { display: flex; flex-wrap: wrap; overflow: hidden; color: #fff; background: linear-gradient(115deg,#123a35,#255848); border: 1px solid #537763; border-radius: 16px; }
.sponsor-card img { width: min(38%, 420px); min-width: 230px; object-fit: cover; align-self: stretch; }
.sponsor-copy { flex: 1 1 270px; padding: clamp(22px,4vw,48px); }
.sponsor-copy .eyebrow { color: #ffc775; margin-top: 0; }
.sponsor-copy h2,.sponsor-copy h3 { color: #fff; margin: 0; font: 700 clamp(1.9rem,4vw,3.5rem)/1.08 Georgia,serif; }
.sponsor-copy .btn { background: #ffc775; }
.sponsor-preview { margin-block: 16px; }
@media (max-width: 540px) { .sponsor-card img { width: 100%; aspect-ratio: 16 / 9; } }
.city-hero { background: radial-gradient(ellipse at 90% 0%, #356d56, #123a35 68%); }
.city-crumb { color: #d8e9dc; margin-bottom: 24px; font-size: .9rem; }
.city-crumb a { color: #fff; }
.city-crumb span { margin-left: .35em; }
.city-resources { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit,minmax(min(100%,270px),1fr)); }
.city-resource { padding: clamp(20px,3vw,32px); }
.city-resource h2 { font-size: clamp(1.55rem,3vw,2rem); }
.city-resource .eyebrow { margin-top: 0; }