/* Wildly Wandering — shared editorial article presentation, October 2026 */
:root{--ww-ink:#173d2c;--ww-sage:#eaf1e8;--ww-cream:#f8faf6}
body:has(.article-layout),body:has(.article-body){background:var(--ww-cream)}
/* Dynamic place articles */
main:has(.article-layout){max-width:none!important;width:100%!important;margin:0!important;padding:0 0 78px!important;background:var(--ww-cream)}
main:has(.article-layout)>.page-hero{box-sizing:border-box;position:relative;isolation:isolate;max-width:none!important;width:100%;min-height:clamp(340px,42vw,560px);padding:clamp(55px,9vw,125px) max(5vw,calc((100vw - 1280px)/2))!important;margin:0 0 36px!important;border-radius:0!important;display:flex;flex-direction:column;justify-content:end;background-color:#214d38!important;background-image:linear-gradient(90deg,rgba(8,30,19,.79),rgba(10,28,18,.12)),var(--ww-hero-image)!important;background-position:center!important;background-size:cover!important;color:white!important}
main:has(.article-layout)>.page-hero:not([style*="--ww-hero-image"]){background-image:linear-gradient(135deg,#143c2c,#57805c)!important}
main:has(.article-layout)>.page-hero h1{color:white!important;font-size:clamp(42px,6vw,83px)!important;line-height:1.06!important;margin:10px 0!important;max-width:850px}
main:has(.article-layout)>.page-hero p,main:has(.article-layout)>.page-hero .section-label{color:#fff!important;max-width:780px}
main:has(.article-layout)>.page-hero .ww-magazine-handwriting{color:#f1f7e9!important;font-size:clamp(21px,2.8vw,35px)!important}
main:has(.article-layout)>.page-hero .content-location,main:has(.article-layout)>.page-hero .content-published-date{font-size:13px;opacity:.9;margin:4px 0}
body:has(.article-layout) .article-layout{box-sizing:border-box;width:min(100% - 40px,1280px)!important;max-width:1280px!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(260px,320px)!important;gap:clamp(26px,4vw,64px)!important;align-items:start;margin:0 auto!important}
body:has(.article-layout) .article-content{min-width:0!important;background:transparent!important}
body:has(.article-layout) .structured-featured{width:100%;height:clamp(260px,36vw,510px);object-fit:cover;border-radius:14px;margin-bottom:30px}
body:has(.article-layout) .structured-stats{background:#eaf1e8!important;border:0!important;border-radius:16px!important;box-shadow:none!important;padding:clamp(20px,3vw,30px)!important}
body:has(.article-layout) .stats-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
body:has(.article-layout) .stat-card{min-width:0!important;padding:15px!important;border-radius:9px!important;background:white!important;border:0!important}
body:has(.article-layout) .rich-content{font-size:clamp(16px,1.45vw,18px)!important;line-height:1.85!important}
body:has(.article-layout) .rich-content h2,body:has(.article-layout) .rich-content h3{font-family:Georgia,serif;color:var(--ww-ink);line-height:1.18}
body:has(.article-layout) .rich-content img,body:has(.article-body) .article-body img{display:block;max-width:100%;height:auto;margin-inline:auto;border-radius:12px}
body:has(.article-layout) .rich-content img.ww-portrait,body:has(.article-body) .article-body img.ww-portrait{width:auto!important;max-width:min(100%,440px)!important;max-height:660px!important;object-fit:contain!important}
body:has(.article-layout) .rich-content figure:has(img.ww-portrait),body:has(.article-body) figure:has(img.ww-portrait){max-width:480px;margin-inline:auto;text-align:center}
body:has(.article-layout) .rich-content figcaption,body:has(.article-body) figcaption{color:#627166;font-size:13px;text-align:center;margin-top:9px}
body:has(.article-layout) .article-sidebar .panel{border-radius:13px!important;padding:22px!important;border:1px solid #e1e9df!important;background:#fff!important}
body:has(.article-layout) .article-sidebar{position:sticky;top:24px}
/* Published blog and story articles, including future generated pages */
body:has(.article-body) .article-body{font-size:clamp(16px,1.35vw,18px);line-height:1.85;max-width:100%;overflow-wrap:break-word}
body:has(.article-body) .article-body h2,body:has(.article-body) .article-body h3{font-family:Georgia,serif;color:var(--ww-ink);line-height:1.2}
body:has(.article-body) .article-featured-image img,body:has(.article-body) .featured-image img{object-fit:cover;max-width:100%}
@media(max-width:850px){body:has(.article-layout) .article-layout{grid-template-columns:minmax(0,1fr)!important;width:min(100% - 30px,700px)!important}body:has(.article-layout) .article-sidebar{position:static}main:has(.article-layout)>.page-hero{min-height:370px;padding:55px 22px 38px!important;margin-bottom:25px!important}}
@media(max-width:520px){main:has(.article-layout)>.page-hero{min-height:400px;background-position:center!important}body:has(.article-layout) .stats-grid{grid-template-columns:1fr!important}body:has(.article-layout) .structured-featured{height:auto;max-height:340px;object-fit:contain}body:has(.article-layout) .rich-content img.ww-portrait,body:has(.article-body) .article-body img.ww-portrait{max-width:min(100%,310px)!important;max-height:500px!important}}

/* V2: structural corrections after Craigower desktop capture */
body:has(.article-layout) main:has(.article-layout)>.page-hero{min-height:clamp(380px,43vw,580px);padding-top:95px!important;padding-bottom:60px!important;align-items:flex-start;justify-content:flex-end}
body:has(.article-layout) main:has(.article-layout)>.page-hero::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,29,18,.72),rgba(6,29,18,.18) 85%);pointer-events:none}
body:has(.article-layout) main:has(.article-layout)>.page-hero>*{position:relative;z-index:1}
body:has(.article-layout) .article-layout{padding:0!important;background:transparent!important;grid-template-columns:minmax(0,1fr) 280px!important;align-items:start!important}
body:has(.article-layout) .article-layout>.article-content{width:100%!important;max-width:none!important;min-width:0!important;grid-column:1!important;margin:0!important;padding:0!important}
body:has(.article-layout) .article-layout>.article-sidebar{grid-column:2!important;grid-row:1!important;display:flex!important;flex-direction:column!important;align-self:start!important;width:100%!important;position:sticky!important;top:96px!important}
body:has(.article-layout) .article-content>.structured-stats{max-width:none!important;margin:0 0 42px!important}
body:has(.article-layout) .rich-content{max-width:none!important}
body:has(.article-layout) .rich-content .content-block-image{width:100%!important;max-width:none!important;margin:26px 0 40px!important;min-height:0!important;height:auto!important;aspect-ratio:auto!important;display:flow-root!important}
body:has(.article-layout) .rich-content .content-block-image img{display:block!important;width:auto!important;max-width:100%!important;height:auto!important;max-height:570px!important;min-height:0!important;margin:0 auto!important;object-fit:contain!important;aspect-ratio:auto!important}
body:has(.article-layout) .rich-content .content-block-image img.ww-portrait{max-width:min(100%,390px)!important;max-height:530px!important}
body:has(.article-layout) .rich-content .content-block-image figcaption{position:static!important;margin:9px auto 0!important;padding:0 8px!important;font-size:13px!important;text-align:center!important}
body:has(.article-layout) .rich-content .content-block-text{margin:0 0 22px!important}
body:has(.article-layout) .rich-content .content-block-text h2{margin:28px 0 12px!important}
body:has(.article-layout) .rich-content .content-block-text p{margin:0 0 16px!important}
body:has(.article-layout) .rich-content .content-block-image img[data-ww-missing]{display:none!important}
body:has(.article-layout) .rich-content .content-block-image:has(img[data-ww-missing]){display:none!important}
@media(max-width:900px){body:has(.article-layout) .article-layout{grid-template-columns:minmax(0,1fr)!important}body:has(.article-layout) .article-layout>.article-content{grid-column:1!important;grid-row:1!important}body:has(.article-layout) .article-layout>.article-sidebar{grid-column:1!important;grid-row:2!important;position:static!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))!important}}
@media(max-width:600px){body:has(.article-layout) main:has(.article-layout)>.page-hero{min-height:390px;padding:54px 20px 30px!important}body:has(.article-layout) .article-layout{width:calc(100% - 32px)!important}body:has(.article-layout) .rich-content .content-block-image img{max-height:440px!important}body:has(.article-layout) .rich-content .content-block-image img.ww-portrait{max-width:min(100%,290px)!important;max-height:420px!important}body:has(.article-layout) .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* Consolidated update: responsive editorial refinements for blog and story pages. */
body:has(.article-body) .article-body figure{max-width:100%;margin:26px auto 36px;text-align:center}
body:has(.article-body) .article-body figure img{max-height:590px;width:auto;max-width:100%;object-fit:contain}
body:has(.article-body) .article-body :is(h2,h3){margin-block:1.7em .65em}
body:has(.article-body) .article-body p{margin-block:0 1.25em}
body:has(.article-body) .article-body img.ww-portrait{max-width:min(100%,390px)!important;max-height:540px!important}
@media(max-width:600px){body:has(.article-body) .article-body{padding-inline:0!important}body:has(.article-body) .article-body img.ww-portrait{max-width:min(100%,290px)!important;max-height:420px!important}}

/* Final shared article update — explicit photo choices and related adventures */
body:has(.article-layout) .rich-content figure.ww-display-portrait{max-width:min(100%,420px)!important;margin-inline:auto!important;text-align:center!important}
body:has(.article-layout) .rich-content figure.ww-display-portrait img{width:auto!important;max-width:100%!important;max-height:570px!important;object-fit:contain!important}
body:has(.article-layout) .rich-content figure.ww-display-standard{max-width:700px!important;margin-inline:auto!important}
body:has(.article-layout) .rich-content figure.ww-display-wide{width:100%!important;max-width:none!important}
body:has(.article-layout) .rich-content figure.ww-display-wide img{max-height:650px!important;width:100%!important;object-fit:contain!important}
.ww-related{margin:54px 0 24px}.ww-related h2{font-family:Georgia,serif;color:#173d2c;margin-bottom:20px}
.ww-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.ww-related-card{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:14px;background:#fff;color:#173d2c;text-decoration:none;border:1px solid #e5ebe1}.ww-related-card img{width:100%;height:145px;object-fit:cover;border-radius:8px}.ww-related-card span{font-size:12px;color:#57725c}.ww-related-card strong{font-family:Georgia,serif;font-size:17px;line-height:1.28}
@media(max-width:640px){.ww-related-grid{grid-template-columns:1fr}.ww-related-card img{height:180px}body:has(.article-layout) .rich-content figure.ww-display-portrait{max-width:min(100%,290px)!important}}

/* October 21 full unified update */
.ww-linked-card{display:grid;grid-template-columns:minmax(110px,32%) 1fr;gap:22px;align-items:center;text-decoration:none!important;color:#173d2c!important;background:#f0f5ec;border:1px solid #dce9d9;border-radius:15px;overflow:hidden;margin:30px 0;box-shadow:0 5px 18px rgba(16,54,28,.06)}
.ww-linked-card img{width:100%!important;height:190px!important;object-fit:cover!important;border-radius:0!important;margin:0!important;max-width:none!important}
.ww-linked-card-copy{padding:20px 20px 20px 0;display:flex;flex-direction:column;gap:8px}.ww-linked-card-copy small{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#477254}.ww-linked-card-copy strong{font:700 clamp(20px,2.4vw,29px)/1.2 Georgia,serif}.ww-linked-card-copy>span{font-size:14px;font-weight:600}
.ww-reverse-links{margin:38px 0;padding:26px;border-radius:14px;background:#eaf1e8}.ww-reverse-links h2{color:#173d2c;font-family:Georgia,serif}.ww-reverse-links>div{display:grid;gap:10px}.ww-reverse-card{display:block;padding:13px 17px;background:#fff;border-radius:8px;color:#173d2c;font-weight:600;text-decoration:none}.ww-reverse-card:hover,.ww-linked-card:hover{box-shadow:0 9px 24px rgba(12,50,24,.15)}
body:has(.article-layout) .article-content>.structured-featured{width:100%;height:auto;max-height:540px;object-fit:contain;display:block;margin:0 auto 35px}
body:has(.article-body) .article-featured-image img{height:auto;max-height:650px;object-fit:contain;display:block;margin:auto}
@media(max-width:600px){.ww-linked-card{grid-template-columns:1fr;gap:0}.ww-linked-card img{height:210px!important}.ww-linked-card-copy{padding:20px}}


/* Wildly Wandering: compact blog/story article banner spacing — 25 Oct 2026 */
/* Scoped to published article templates; structured place hero banners remain unchanged. */
body:has(.article-page) .article-page .article-header {
  padding: clamp(32px, 5vw, 64px) 25px clamp(24px, 3vw, 38px) !important;
}
body:has(.article-page) .article-page .article-header h1 {
  margin-top: 8px;
  margin-bottom: 16px;
}
body:has(.article-page) .article-page .article-introduction { margin-bottom: 16px; }
body:has(.article-page) .article-page .article-featured-image {
  height: auto !important;
  max-height: 540px;
  min-height: 0 !important;
  background: transparent;
}
body:has(.article-page) .article-page .article-featured-image img {
  display: block;
  width: 100%;
  height: auto !important;
  max-height: 540px;
  object-fit: contain;
}
body:has(.article-page) .article-page .article-body {
  padding-top: clamp(28px, 4vw, 48px) !important;
}
@media (max-width:700px) {
  body:has(.article-page) .article-page .article-header {
    padding: 30px 20px 24px !important;
  }
  body:has(.article-page) .article-page .article-featured-image {
    margin: 0 20px;
    max-height: 360px;
  }
  body:has(.article-page) .article-page .article-featured-image img { max-height: 360px; }
  body:has(.article-page) .article-page .article-body { padding-top: 28px !important; }
}


/* 2026-10-25: Universal blog and Stories hero. Content sets hero height. */
html body:has(article.article-page) main article.article-page {
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;
  grid-auto-rows:auto!important;align-items:start!important;
}
html body:has(article.article-page) main article.article-page > .article-header {
  grid-column:1!important;grid-row:1!important;position:relative!important;
  inset:auto!important;transform:none!important;z-index:5!important;
  display:flex!important;flex-direction:column!important;align-items:flex-start!important;
  justify-content:center!important;box-sizing:border-box!important;
  width:100%!important;max-width:100%!important;
  height:auto!important;min-height:clamp(430px,42vw,590px)!important;
  max-height:none!important;overflow:visible!important;
  padding:clamp(32px,5vw,65px)!important;margin:0!important;
  background:transparent!important;pointer-events:none!important;text-align:left!important;
}
html body:has(article.article-page) main article.article-page > .article-featured-image {
  grid-column:1!important;grid-row:1!important;position:relative!important;
  isolation:isolate!important;z-index:1!important;align-self:stretch!important;
  box-sizing:border-box!important;width:100%!important;max-width:100%!important;
  height:100%!important;min-height:100%!important;max-height:none!important;
  aspect-ratio:auto!important;margin:0!important;overflow:hidden!important;
  background:#244b3b!important;border-radius:12px!important;
}
html body:has(article.article-page) main article.article-page > .article-featured-image > img {
  position:absolute!important;inset:0!important;width:100%!important;
  height:100%!important;min-height:100%!important;max-height:none!important;
  display:block!important;object-fit:cover!important;object-position:center!important;
}
html body:has(article.article-page) main article.article-page > .article-featured-image::after {
  content:""!important;position:absolute!important;inset:0!important;z-index:2!important;
  background:linear-gradient(90deg,rgba(2,20,13,.86),rgba(2,20,13,.48) 72%,rgba(2,20,13,.24))!important;
  pointer-events:none!important;
}
html body:has(article.article-page) main article.article-page > .article-header .article-category {
  color:#fff!important;flex:0 0 auto!important;margin:0 0 18px!important;
}
html body:has(article.article-page) main article.article-page > .article-header h1 {
  position:static!important;display:block!important;color:#fff!important;
  font-size:clamp(30px,4vw,58px)!important;line-height:1.13!important;
  max-width:min(100%,850px)!important;height:auto!important;max-height:none!important;
  white-space:normal!important;overflow:visible!important;overflow-wrap:break-word!important;
  margin:0 0 16px!important;padding:0!important;
  text-shadow:0 2px 14px rgba(0,0,0,.7)!important;
}
html body:has(article.article-page) main article.article-page > .article-header .article-introduction {
  position:static!important;display:block!important;color:#fff!important;
  font-size:clamp(15px,1.38vw,18px)!important;line-height:1.52!important;
  width:auto!important;max-width:min(100%,800px)!important;height:auto!important;
  max-height:none!important;overflow:visible!important;white-space:normal!important;
  -webkit-line-clamp:unset!important;line-clamp:unset!important;
  margin:0!important;padding:0!important;text-shadow:0 2px 10px rgba(0,0,0,.8)!important;
}
html body:has(article.article-page) main article.article-page > .article-header .article-meta {
  color:#fff!important;position:static!important;margin:20px 0 0!important;
}
html body:has(article.article-page) main article.article-page > .article-header .article-meta span {color:#fff!important;}
@media(max-width:700px){
 html body:has(article.article-page) main article.article-page > .article-header {
   padding:32px 22px!important;min-height:440px!important;
 }
 html body:has(article.article-page) main article.article-page > .article-header h1 {
   font-size:clamp(28px,7.3vw,43px)!important;line-height:1.13!important;
 }
 html body:has(article.article-page) main article.article-page > .article-header .article-introduction {
   font-size:14px!important;line-height:1.5!important;
 }
}