/* New Jersey Port — paper, harbor navy, sea glass, one terracotta accent */
:root{
  --paper:#FBF7F0; --paper-2:#F4EDE1; --sand:#EADFCC; --ink:#2B2622; --ink-2:#5B524A; --line:#E2D7C5;
  --navy:#1F3A4D; --navy-2:#2E5269; --glass:#8FB9A8; --glass-2:#D7E7DF; --terra:#C8643B; --terra-ink:#9E4521;
  --shadow:0 1px 2px rgba(43,38,34,.06),0 8px 24px -12px rgba(43,38,34,.18);
  --r:14px; --measure:66ch;
  --f-display:"Fraunces",Georgia,serif; --f-body:"Source Serif 4",Georgia,serif; --f-ui:"Inter",system-ui,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#1A1714; --paper-2:#221E1A; --sand:#2C2621; --ink:#F3EDE4; --ink-2:#C4B9AC; --line:#3A332C;
  --navy:#A9C8DA; --navy-2:#C6DCE8; --glass:#7FAE9B; --glass-2:#24332D; --terra:#E08A60; --terra-ink:#F0A27B;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 28px -14px rgba(0,0,0,.6); color-scheme:dark;}}
*{box-sizing:border-box} html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.1875rem/1.7 var(--f-body);font-optical-sizing:auto;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block} picture{display:block}
a{color:var(--navy);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--terra-ink)}
:focus-visible{outline:3px solid var(--glass);outline-offset:2px;border-radius:4px}
h1,h2,h3{font-family:var(--f-display);font-weight:560;line-height:1.12;letter-spacing:-.01em;color:var(--ink);font-variation-settings:"SOFT" 60}
h1{font-size:clamp(2.1rem,5.4vw,3.6rem);margin:.2em 0 .3em}
h2{font-size:clamp(1.55rem,3.4vw,2.15rem);margin:2.2em 0 .5em}
h3{font-size:1.35rem;margin:1.6em 0 .4em}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px} .wrap-narrow{max-width:760px;margin:0 auto;padding:0 20px}
.eyebrow{font:600 .78rem/1.3 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--terra-ink);margin:0 0 .5em;display:block}
.deck{font-size:1.25rem;color:var(--ink-2);line-height:1.55;margin:.2em 0 1em}
.small{font-size:.95rem;color:var(--ink-2)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:#fff;padding:8px 14px;border-radius:8px;z-index:99}.skip:focus{left:12px}

/* header */
.site-head{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.head-row{display:flex;align-items:center;gap:24px;min-height:64px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy)}
.mark{width:34px;height:34px;color:var(--navy)}
.brand-name{font:600 1.3rem/1 var(--f-display);letter-spacing:-.01em;color:var(--ink);white-space:nowrap}
.brand-name em{font-style:italic;color:var(--terra-ink);font-weight:500}
.nav{margin-left:auto;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent)}
.nav::-webkit-scrollbar{display:none}
.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0 18px 0 0}
.nav a{display:block;font:500 .92rem/1 var(--f-ui);color:var(--ink);text-decoration:none;padding:10px 12px;border-radius:999px;white-space:nowrap}
.nav a:hover{background:var(--sand);color:var(--ink)}
@media (max-width:820px){.head-row{flex-wrap:wrap;gap:0;padding-top:10px}.nav{margin:0 -20px;padding:0 0 0 12px;width:calc(100% + 40px);-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent)}.nav a{padding:10px 10px 12px;font-size:.9rem}}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--terra);color:#fff;font:600 1rem/1 var(--f-ui);padding:15px 22px;border-radius:999px;text-decoration:none;border:0;cursor:pointer;min-height:48px}
.btn:hover{background:var(--terra-ink);color:#fff}
.btn-ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)} .btn-ghost:hover{background:var(--ink);color:var(--paper)}

/* images */
.ph{background:repeating-linear-gradient(135deg,var(--sand) 0 14px,var(--paper-2) 14px 28px);aspect-ratio:16/9;border-radius:var(--r)}
.ph[data-aspect="3:2"]{aspect-ratio:3/2}.ph[data-aspect="4:5"]{aspect-ratio:4/5}.ph[data-aspect="1:1"]{aspect-ratio:1}
.scene{margin:2rem 0}.scene img{border-radius:var(--r);width:100%;aspect-ratio:3/2;object-fit:cover}

/* hero (home) */
.hero{position:relative;min-height:min(86vh,760px);display:grid;align-items:end;overflow:hidden;background:var(--navy)}
.hero-img,.hero-img img,.hero>.ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,24,28,.05) 30%,rgba(20,24,28,.62) 100%),linear-gradient(90deg,rgba(20,24,28,.45),transparent 60%)}
.hero-copy{position:relative;z-index:2;padding-top:120px;padding-bottom:64px;color:#fff}
.hero-copy h1{color:#fff;max-width:13ch;font-weight:520}.hero-copy h1 em{font-style:italic;color:#F6D9C6}
.hero-copy .eyebrow{color:#F6D9C6}.hero-copy .deck{color:rgba(255,255,255,.9);max-width:46ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.hero .btn-ghost{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.85)}.hero .btn-ghost:hover{background:#fff;color:var(--ink)}
@media (max-width:640px){.hero{min-height:78vh}.hero-img img{object-position:70% center}.hero-copy{padding-bottom:40px}}

/* sections */
.section{padding:56px 20px}.band{background:var(--paper-2);border-block:1px solid var(--line)}
.sec-row{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:22px}
.sec-h{margin:0;font-size:clamp(1.6rem,3.6vw,2.3rem)} .sec-h .eyebrow{margin-bottom:.4em}
.more{font:600 .95rem/1.2 var(--f-ui);white-space:nowrap;text-decoration:none}

/* cards */
.cards{display:grid;gap:22px}
.cards-3{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.cards-feature{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr))}
@media (min-width:980px){.cards-feature{grid-template-columns:2fr 1fr 1fr}.cards-feature .card-lg{grid-row:span 2}.cards-feature .card-lg .card-img img,.cards-feature .card-lg .ph{aspect-ratio:auto;height:100%;min-height:420px}}
.cards-rail{grid-auto-flow:column;grid-auto-columns:minmax(260px,300px);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin}
.cards-rail>.card{scroll-snap-align:start}
.card{display:flex;flex-direction:column;background:var(--paper);border-radius:var(--r);box-shadow:var(--shadow);text-decoration:none;color:var(--ink);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.card:hover{transform:translateY(-3px);color:var(--ink);box-shadow:0 2px 4px rgba(43,38,34,.08),0 18px 34px -16px rgba(43,38,34,.3)}
.card-img img,.card .ph{aspect-ratio:4/3;width:100%;object-fit:cover;border-radius:0}
.card-body{display:flex;flex-direction:column;gap:6px;padding:16px 18px 20px}
.card-kicker{font:600 .72rem/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--terra-ink)}
.card-title{font:560 1.22rem/1.25 var(--f-display)}
.card-meta{font:500 .82rem/1 var(--f-ui);color:var(--ink-2);margin-top:auto;padding-top:6px}
@media (prefers-reduced-motion:reduce){.card{transition:none}.card:hover{transform:none}}

/* map */
.mapsec{display:grid;gap:30px;align-items:center}@media (min-width:860px){.mapsec{grid-template-columns:1fr 1fr}}
.map-wrap{background:var(--glass-2);border-radius:22px;padding:18px;box-shadow:var(--shadow)}
.njmap{width:100%;height:auto;max-height:640px;display:block;font:600 9.5px var(--f-ui)}
.nj-water{fill:var(--glass-2)} .nj-land{fill:var(--paper);stroke:var(--navy);stroke-width:1.1;stroke-linejoin:round}
.pin text{fill:var(--ink);paint-order:stroke;stroke:var(--paper);stroke-width:3px} .pin-dot{fill:var(--terra);stroke:var(--paper);stroke-width:1.5}
.pin-hit{fill:transparent} .pin:hover .pin-dot,.pin:focus .pin-dot{fill:var(--navy);r:5.5} .pin:hover text{fill:var(--terra-ink)}
.town-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:18px 0 0}
.town-list a{display:block;padding:9px 14px;border-radius:999px;background:var(--paper-2);box-shadow:inset 0 0 0 1px var(--line);font:500 .92rem/1 var(--f-ui);text-decoration:none;color:var(--ink)}
.town-list a:hover{background:var(--sand)}

/* meet */
.meet{display:grid;gap:34px;align-items:center}@media (min-width:800px){.meet{grid-template-columns:420px 1fr}}
.meet-img img,.meet-img .ph{border-radius:22px;aspect-ratio:3/4;object-fit:cover}

/* newsletter */
.letter{background:var(--navy);color:#F3EDE4;padding:64px 20px;margin-top:40px}
:root .letter{background:#1F3A4D}
.letter-in{max-width:640px;margin:0 auto;text-align:center}.letter h2{color:#fff;margin:.1em 0 .4em}.letter .eyebrow{color:#F6D9C6}
.letter p{color:rgba(243,237,228,.88)}
.nl-form{display:flex;gap:10px;margin:22px auto 0;max-width:480px}
.nl-form input{flex:1;min-width:0;font:400 1rem var(--f-ui);padding:14px 18px;border-radius:999px;border:0;min-height:50px;background:#FBF7F0;color:#2B2622}
.nl-form button{font:600 1rem var(--f-ui);padding:0 22px;border-radius:999px;border:0;background:var(--terra);color:#fff;cursor:pointer;min-height:50px}
.nl-form button:hover{background:#9E4521}
@media (max-width:480px){.nl-form{flex-direction:column}}
.letter-sm{margin-top:0}

/* guide */
.tide{position:fixed;top:0;left:0;right:0;height:3px;z-index:50;pointer-events:none}.tide span{display:block;height:100%;width:0;background:var(--glass);transition:width .1s linear}
.guide-head{padding-top:34px}
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0 0 18px;font:500 .85rem/1.4 var(--f-ui);color:var(--ink-2)}
.crumbs li+li::before{content:"/";margin-right:6px;color:var(--line)} .crumbs a{color:var(--ink-2)}
.byline{display:flex;align-items:center;gap:12px;font:500 .95rem/1.4 var(--f-ui);margin:16px 0 26px}.byline p{margin:0}.byline span{color:var(--ink-2);font-size:.85rem}.byline .by-team{color:var(--ink);font-size:.88rem}
.avatar img,.avatar.ph{width:44px;height:44px;border-radius:50%;object-fit:cover}
.guide-hero{max-width:1200px;margin:0 auto;padding:0 20px}.guide-hero img,.guide-hero .ph{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:20px}
@media (max-width:640px){.guide-hero{padding:0}.guide-hero img,.guide-hero .ph{border-radius:0;aspect-ratio:4/3}}
.guide-grid{display:grid;gap:10px;padding-top:28px}
@media (min-width:1040px){.guide-grid{grid-template-columns:240px minmax(0,720px);justify-content:center;gap:56px}}
.toc{font:500 .92rem/1.4 var(--f-ui)}
.toc details{background:var(--paper-2);border-radius:var(--r);padding:14px 16px;box-shadow:inset 0 0 0 1px var(--line)}
.toc summary{cursor:pointer;font-weight:600;list-style-position:outside}
.toc ol{margin:10px 0 0;padding-left:20px}.toc li{margin:7px 0}.toc a{color:var(--ink);text-decoration:none}.toc a:hover,.toc a.on{color:var(--terra-ink)}
@media (min-width:1040px){.toc{position:sticky;top:90px;align-self:start;max-height:calc(100vh - 110px);overflow:auto}.toc details{background:none;box-shadow:none;padding:0}}
.prose{max-width:var(--measure);min-width:0}
.prose>p:first-of-type::first-letter{font-family:var(--f-display);float:left;font-size:3.6em;line-height:.86;padding:.06em .1em 0 0;color:var(--navy)}
.prose ul,.prose ol{padding-left:1.25em}.prose li{margin:.35em 0}
.prose blockquote{margin:1.6em 0;padding:.2em 0 .2em 1.1em;border-left:3px solid var(--glass);font-style:italic;color:var(--ink-2)}
.prose h2{scroll-margin-top:90px;position:relative}.prose h2::before{content:"";display:block;width:38px;height:3px;background:var(--glass);border-radius:2px;margin-bottom:.6em}
.prose strong{font-weight:600}

/* quick picks */
.picks{background:var(--sand);border-radius:18px;padding:22px 22px 10px;margin:4px 0 30px}
.picks-h{margin:0 0 12px;font-size:1.25rem}.picks-h::before{display:none!important}
.picks ul{list-style:none;padding:0;margin:0;display:grid;gap:2px}
.picks li{margin:0}.picks a{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;padding:12px 0;border-top:1px solid rgba(43,38,34,.12);text-decoration:none;color:var(--ink)}
.picks li:first-child a{border-top:0}
.pick-label{grid-row:span 2;font:600 .72rem/1.2 var(--f-ui);letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--terra-ink);padding:6px 9px;border-radius:6px;align-self:start;margin-top:3px;min-width:96px;text-align:center}
.pick-name{font:600 1.08rem/1.3 var(--f-display)}.pick-why{font-size:.94rem;color:var(--ink-2);line-height:1.45}
.picks a:hover .pick-name{color:var(--terra-ink)}

/* place card */
.place{margin:1.8em 0 1em;padding:18px 20px;border-radius:var(--r);background:var(--paper-2);box-shadow:inset 0 0 0 1px var(--line);scroll-margin-top:90px}
.place h3{margin:0;font-size:1.45rem}.place-meta{margin:.15em 0 0;font:500 .85rem/1.3 var(--f-ui);color:var(--ink-2);text-transform:capitalize}
.place-known{margin:.7em 0 .2em;font-size:1rem;line-height:1.5}.place-known span{font:600 .72rem/1 var(--f-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--terra-ink);margin-right:6px}
.place-addr{margin:.2em 0;font:400 .9rem/1.4 var(--f-ui);color:var(--ink-2)}
.chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:.7em 0 .2em}.chips li{margin:0;font:500 .78rem/1 var(--f-ui);padding:6px 10px;border-radius:999px;background:var(--glass-2);color:var(--ink)}
.place-links{display:flex;flex-wrap:wrap;gap:8px 18px;margin:.8em 0 0;font:600 .9rem/1 var(--f-ui)}
.place-links a{text-decoration:none;padding:6px 0}.place-links a::after{content:" ↗";font-weight:400}

/* end matter */
.maplist{margin-top:3em}.maplist ol{padding-left:1.4em;columns:2 260px;column-gap:30px;font:400 .98rem/1.4 var(--f-ui)}.maplist li{break-inside:avoid;margin:0 0 .8em}.maplist span{display:block;color:var(--ink-2);font-size:.84rem}
.faq details{border-top:1px solid var(--line);padding:4px 0}.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;padding:14px 30px 14px 0;font:600 1.1rem/1.35 var(--f-display);list-style:none;position:relative}.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:10px;font:400 1.5rem var(--f-ui);color:var(--terra-ink)}.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 16px;color:var(--ink-2)}
.onehour{margin:2.6em 0;padding:26px 26px 20px;border-radius:18px;background:var(--glass-2);position:relative}
.onehour p:last-child{font:italic 400 1.3rem/1.5 var(--f-display);margin:0}
.authorbox{display:flex;gap:18px;align-items:flex-start;margin:2.4em 0 1em;padding:22px;border-radius:18px;box-shadow:inset 0 0 0 1px var(--line);font-size:.98rem;line-height:1.55}
.avatar-lg img,.avatar-lg.ph{width:88px;height:88px;border-radius:50%;object-fit:cover;flex:none}
.ab-name{font:600 1.15rem var(--f-display);margin:0 0 4px}.authorbox p{margin:0}
.dayof{padding-top:30px}.dayof h2{margin-top:1em}
.nextport{display:grid;margin-top:46px;margin-bottom:0;text-decoration:none;color:#fff;position:relative;border-radius:22px;overflow:hidden;min-height:300px;max-width:1140px;padding:0}
.nextport .np-img,.nextport .np-img img,.nextport .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0}
.nextport::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,24,28,.75),rgba(20,24,28,.15))}
.np-body{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:40px;max-width:560px}
.np-body .eyebrow{color:#F6D9C6}.np-title{font:560 clamp(1.5rem,3.4vw,2.2rem)/1.15 var(--f-display)}.np-go{font:600 1rem var(--f-ui)}
.nextport:hover{color:#fff}.nextport:hover .np-go{text-decoration:underline}
@media (max-width:640px){.nextport{margin-left:20px;margin-right:20px}.np-body{padding:28px}}

/* town + archive + simple */
.town-head{position:relative;min-height:420px;display:grid;align-items:end;overflow:hidden;background:var(--navy)}
.town-head .town-img,.town-head .town-img img,.town-head>.ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0}
.town-head::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 20%,rgba(20,24,28,.7))}
.town-copy{position:relative;z-index:2;padding-top:100px;padding-bottom:40px;color:#fff}.town-copy h1{color:#fff}.town-copy .deck{color:rgba(255,255,255,.9)}.town-copy .eyebrow{color:#F6D9C6}
.page-head{padding-top:46px;padding-bottom:8px}
.filters{display:grid;gap:10px;padding-top:10px}
.chip-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.chip-label{font:600 .78rem/1 var(--f-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);min-width:64px}
.chip{font:500 .92rem/1 var(--f-ui);padding:10px 15px;border-radius:999px;border:0;background:var(--paper-2);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink);cursor:pointer;min-height:40px}
.chip[aria-pressed="true"]{background:var(--navy);color:var(--paper);box-shadow:none}
.filter-count{font:500 .9rem var(--f-ui);color:var(--ink-2);margin:6px 0 0}
.arch-item[hidden]{display:none}.arch-item>.card{height:100%}
.simple .prose{margin:0 auto;padding-bottom:30px}.simple .prose>p:first-of-type::first-letter{all:unset}

/* footer */
.site-foot{background:var(--paper-2);border-top:1px solid var(--line);padding:48px 0 24px;font:400 .95rem/1.5 var(--f-ui)}
.foot-grid{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.foot-h{font:600 .78rem/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;margin:6px 0 12px;color:var(--ink-2)}
.site-foot ul{list-style:none;padding:0;margin:0}.site-foot li{margin:7px 0}.site-foot a{color:var(--ink);text-decoration:none}.site-foot a:hover{color:var(--terra-ink)}
.foot-line{font:italic 400 1.05rem/1.4 var(--f-display);color:var(--ink-2);max-width:24ch}
.foot-small{border-top:1px solid var(--line);margin-top:30px;padding-top:18px;font-size:.82rem;color:var(--ink-2)}
@media print{.site-head,.site-foot,.letter,.tide,.nextport,.dayof{display:none}}
.toc-places{margin:4px 0 6px!important;padding-left:14px!important;list-style:none;font-size:.84rem}
.toc-places li{margin:4px 0!important}.toc-places a{color:var(--ink-2)!important}
@media (min-width:1040px){.toc-places{display:none}.toc li:has(a.on) .toc-places,.toc li:focus-within .toc-places{display:block}}
/* phone hero: photo on top, words below (no text over the face) */
@media (max-width:640px){
  .hero{display:block;min-height:0;background:var(--navy)}
  :root .hero{background:#1F3A4D}
  .hero::after{display:none}
  .hero-img,.hero>.ph{position:relative;inset:auto;height:52vh;min-height:320px}
  .hero-img img{position:absolute;inset:0;height:100%;object-position:60% 40%}
  .hero-copy{padding-top:26px;padding-bottom:34px}
  .hero-copy h1{font-size:2.15rem}
  .hero-cta .btn{flex:1 1 100%;justify-content:center}
}
/* goldfish panel fixes */
.place-meta{text-transform:none}
.place-verified{margin:.6em 0 0;font:500 .74rem/1.3 var(--f-ui);color:var(--ink-2)}
.toc ol{padding-left:28px}
.picks.wrap-narrow{max-width:760px;margin:22px auto 6px}
.picks li{display:grid;grid-template-columns:auto 1fr auto;gap:2px 12px;align-items:start;padding:12px 0;border-top:1px solid rgba(43,38,34,.12)}
.picks li:first-child{border-top:0}.picks li .pick-label{grid-row:span 2}
.pick-name{font:600 1.08rem/1.3 var(--f-display);color:var(--ink);text-decoration:underline;text-decoration-color:rgba(43,38,34,.3);text-underline-offset:.2em}
.pick-why{grid-column:2}
.pick-go{grid-row:1/span 2;grid-column:3;align-self:center;font:600 .82rem/1 var(--f-ui);padding:10px 12px;border-radius:999px;background:var(--paper);color:var(--navy);text-decoration:none;box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap}
.place-links a{display:inline-block;padding:10px 14px;border-radius:999px;background:var(--paper);box-shadow:inset 0 0 0 1px var(--line);font-size:.86rem}
.place-links{gap:8px}
@media (max-width:640px){
  .hero-img,.hero>.ph{height:40vh;min-height:250px}
  .hero-copy{padding-top:20px}.hero-copy .deck{font-size:1.05rem}
  .nav{overflow:visible;-webkit-mask-image:none;margin:0 -8px;width:calc(100% + 16px)}
  .nav ul{flex-wrap:wrap;padding:0 0 8px}
  .nav a{padding:7px 9px;font-size:.84rem;background:var(--paper-2);margin:2px}
  .guide-head h1{font-size:1.9rem}.guide-head .deck{font-size:1.05rem}
  .guide-hero img,.guide-hero .ph{aspect-ratio:16/9}
  .picks li{grid-template-columns:1fr auto}.picks li .pick-label{grid-row:auto;justify-self:start}.pick-why{grid-column:1}.pick-go{grid-row:1/span 3;grid-column:2}
}
@media (max-width:640px){
  .site-head{position:static}
  .guide{display:flex;flex-direction:column}
  .guide>.guide-head{order:1}.guide>.picks{order:2;margin-top:0}.guide>.guide-hero{order:3;margin-top:14px}.guide>*{order:4}
  .guide>.tide{order:0}
}
.hub-towns{margin:0 0 22px}
.town-copy .btn{margin-top:8px}
@media (min-width:821px){.nav{-webkit-mask-image:none;overflow:visible}.nav ul{padding-right:0;gap:0}.nav a{padding:10px 10px}}

.suggest { margin: 1.25rem 0 0; font: 500 .95rem/1.5 var(--f-ui); color: var(--muted); }
.suggest a { color: var(--terra-ink); text-decoration: underline; text-underline-offset: 3px; }
.place-more { margin: .6rem 0 0; font: 500 .9rem/1.5 var(--f-ui); color: var(--muted); }
.place-more a { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.foot-all { padding-top: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--line); }
.foot-all dl { margin: 0; display: grid; gap: .55rem; }
.foot-all dl > div { display: grid; grid-template-columns: 9rem 1fr; gap: .75rem; align-items: baseline; }
.foot-all dt { font: 600 .78rem/1.4 var(--f-ui); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.foot-all dd { margin: 0; display: flex; flex-wrap: wrap; gap: .15rem 1rem; font: 500 .92rem/1.6 var(--f-ui); }
@media (max-width: 640px) { .foot-all dl > div { grid-template-columns: 1fr; gap: .2rem; } }

/* "All guides" menu */
.mega{flex:none}
.mega>summary{list-style:none;cursor:pointer;font:600 .92rem/1 var(--f-ui);color:var(--paper);background:var(--navy);padding:10px 14px;border-radius:999px;white-space:nowrap;user-select:none}
.mega>summary::-webkit-details-marker{display:none}
.mega>summary::after{content:"";display:inline-block;width:.42em;height:.42em;margin-left:.5em;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-.15em) rotate(45deg);transition:transform .15s}
.mega[open]>summary::after{transform:translateY(.05em) rotate(-135deg)}
.mega>summary:focus-visible{outline:2px solid var(--terra);outline-offset:2px}
.mega-panel{position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 18px 40px -18px rgba(0,0,0,.35);max-height:calc(100vh - 80px);overflow:auto;overscroll-behavior:contain;padding:22px 0 18px}
.mega-places,.mega-topics{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px 24px}
.mega-topics{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.mega-h{font:600 .74rem/1.2 var(--f-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
.mega-h a{color:inherit;text-decoration:none}.mega-h a:hover{color:var(--terra-ink)}
.mega-col ul{list-style:none;margin:0;padding:0}
.mega-col li a{display:block;font:400 .9rem/1.35 var(--f-ui);color:var(--ink);text-decoration:none;padding:4px 0}
.mega-col li a:hover{color:var(--terra-ink);text-decoration:underline}
.mega-all{margin:18px 0 0;font:600 .9rem/1 var(--f-ui)}
.mega-all a{color:var(--terra-ink)}
@media (max-width:820px){.brand{order:0}.mega{order:1;margin-left:auto}.nav{order:2}.mega>summary{padding:9px 12px;font-size:.86rem}}
@media (max-width:640px){.site-head{position:relative}.mega-places,.mega-topics{grid-template-columns:1fr 1fr;gap:14px 16px}.mega-col li a{padding:7px 0}.mega-panel{max-height:75vh}}
/* newsletter: hidden bot trap and error line */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.nl-err{color:#F6C2A8;margin:10px 0 0;font:500 .92rem/1.4 var(--f-ui)}