.portal-escapes { padding: clamp(3rem, 6vw, 6rem) max(1.25rem, calc((100vw - 1320px) / 2)); background: #f1efe5; }
.escapes-heading { display: flex; align-items: end; justify-content: space-between; gap: 3rem; margin-bottom: 2rem; }
.escapes-heading h2 { margin: 0; font: 500 clamp(2.6rem, 4vw, 4rem)/1.05 var(--serif); letter-spacing: -.035em; }
.escapes-heading > p { max-width: 430px; margin: 0; color: #5a6655; line-height: 1.7; }
.escape-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.escape-grid > a { display: flex; flex-direction: column; padding: 1.8rem; border: 1px solid #cdd6c1; border-radius: 12px; background: #fffdf7; text-decoration: none; }
.escape-grid small { color: #526439; text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; font-weight: 700; }
.escape-grid h3 { margin: 1rem 0 0; font: 500 2.5rem/1 var(--serif); }
.escape-grid p { color: #606b59; line-height: 1.65; }
.escape-grid span { margin-top: auto; padding-top: 1rem; color: #236248; font-size: .85rem; font-weight: 700; }
.escape-grid > a:hover { border-color: #8ba43a; }
.escape-all { display: inline-flex; gap: 2rem; margin-top: 1.8rem; padding: .9rem 1.2rem; border-radius: 8px; color: #fff; background: #173c2b; text-decoration: none; font-size: .9rem; font-weight: 600; }
.detail-town-guide { margin-top: 1.5rem; padding: 1.5rem; border: 1px solid #ccd8bd; border-radius: 12px; background: #f0f2e6; }
.detail-town-guide .eyebrow { margin: 0 0 .65rem; color: #536637; font-size: .7rem; }
.detail-town-guide h3 { margin: 0; font: 500 2rem/1.1 var(--serif); }
.detail-town-guide > p { color: #58644f; font-size: .9rem; line-height: 1.65; }
.detail-town-guide .detail-town-sights { padding-top: .7rem; border-top: 1px solid #d6dfcb; font-size: .8rem; }
.detail-town-guide > a { display: inline-block; min-height: 44px; padding: .75rem 1rem; border-radius: 7px; color: white; background: #173c2b; text-decoration: none; font-size: .85rem; font-weight: 700; }
@media(max-width: 700px) { .escapes-heading { display: block; } .escapes-heading > p { margin-top: 1rem; } .escape-grid { grid-template-columns: 1fr; } }

.detail-town-guide.has-town-photo { position: relative; isolation: isolate; overflow: hidden; border-color: #173c2b; background: #173c2b; }
.detail-town-photo, .detail-town-shade { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.detail-town-photo { z-index: 0; object-fit: cover; object-position: 50% 42%; }
.detail-town-shade { z-index: 1; background: linear-gradient(0deg, #031a13f5 0%, #031a13d9 28%, #031a138c 65%, #031a1359 100%); }
.detail-town-guide.has-town-photo > p, .detail-town-guide.has-town-photo > h3, .detail-town-guide.has-town-photo > a:not(.detail-town-photo-credit) { position: relative; z-index: 2; }
.detail-town-guide.has-town-photo .eyebrow { max-width: calc(100% - 2.5rem); color: #e4efb6; text-shadow: 0 2px 8px #00150c; }
.detail-town-guide.has-town-photo h3 { color: white; text-shadow: 0 2px 12px #00150c; }
.detail-town-guide.has-town-photo > p { color: white; text-shadow: 0 2px 10px #00150c; }
.detail-town-guide.has-town-photo .detail-town-sights { border-color: #e4efb65c; }
.detail-town-guide.has-town-photo > a:not(.detail-town-photo-credit) { color: #153c2a; background: #e0edab; }
.detail-town-guide.has-town-photo > .detail-town-photo-credit { position: absolute; z-index: 3; top: .7rem; right: .7rem; display: grid; place-items: center; width: 36px; min-height: 36px; padding: 0; border: 1px solid #e4efb64d; border-radius: 50%; color: white; background: #052217bf; font-size: .9rem; line-height: 1; }