/* phx-seo.css v1 — shared framing / texture / centering for Park Hill SEO content pages.
   Applied via the `phx-seo` class on a page's <article> wrapper. Reuses the estate site's own
   textures (blackmenu-fill.png dark panels, parkhill-inverse.png parchment cards) so the new
   pages read like the rest of the site instead of bare text floating on the background.
   Authoritative (!important) so it wins over each page's inline per-page <style> block. */

.phx-seo{
  max-width:1080px !important;
  margin:0 auto !important;
  padding:clamp(26px,5vw,60px) 20px 86px !important;
}

/* ---------------------------------------------------------------- HERO
   Open and centered (no filled box), framed top + bottom with gold hairlines
   like the estate's plaque headers. */
.phx-seo [class*="-hero"]{
  text-align:center !important;
  background:none !important;
  border:0 !important;
  border-top:1px solid rgba(201,162,103,.34) !important;
  border-bottom:1px solid rgba(201,162,103,.34) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  max-width:940px !important;
  margin:0 auto clamp(26px,4vw,44px) !important;
  padding:clamp(30px,5vw,54px) 18px clamp(26px,4vw,42px) !important;
}
/* Center the hero's constrained paragraphs (e.g. the lede max-width block).
   A base `p` rule in the cloned chrome zeroes the per-page `margin:0 auto`, so force it. */
.phx-seo [class*="-hero"] p{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ---------------------------------------------------------------- CONTENT PANELS
   Every content section becomes a centered, gold-bordered, warm-dark textured panel. */
.phx-seo > section{
  max-width:1000px !important;
  margin:clamp(20px,3vw,34px) auto !important;
  padding:clamp(28px,4vw,50px) clamp(22px,4vw,52px) !important;
  border:1px solid rgba(201,162,103,.42) !important;
  border-radius:6px !important;
  box-shadow:0 14px 34px rgba(0,0,0,.5) !important;
  text-align:center !important;
}
.phx-seo > section:not(:has(dl)):not(:has(article)){
  background:linear-gradient(rgba(24,18,12,.85),rgba(10,7,5,.93)),
             url('/wp-content/uploads/blackmenu-fill.png') center/cover no-repeat !important;
}

/* News list: leave the cards as-is, no wrapping panel. */
.phx-seo > section:has(article){
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  text-align:left !important;
}

/* ---------------------------------------------------------------- PARCHMENT CARD (Quick Facts)
   Matches the site's #e9dcbf + parkhill-inverse.png feature cards: light card, dark ink. */
.phx-seo > section:has(dl){
  background:#e9dcbf url('/wp-content/uploads/parkhill-inverse.png') center/cover no-repeat !important;
  border:2px solid #0c0a08 !important;
  border-radius:5px !important;
  box-shadow:0 12px 30px rgba(0,0,0,.5) !important;
  color:#2b2015 !important;
}
.phx-seo > section:has(dl) h2{ color:#5a3d18 !important; }
.phx-seo > section:has(dl) h2::after{
  background:linear-gradient(90deg,transparent,#9c7430,transparent) !important;
}
.phx-seo > section:has(dl) dl > div{ border-top:1px solid rgba(12,10,8,.18) !important; }
.phx-seo > section:has(dl) dt{ color:#8a6322 !important; }
.phx-seo > section:has(dl) dd{ color:#2b2015 !important; }

/* ---------------------------------------------------------------- HEADINGS
   Centered deco underline like the estate's gold plaque rules. */
.phx-seo h2{
  display:inline-block !important;
  position:relative !important;
  padding-bottom:16px !important;
  margin-bottom:22px !important;
}
.phx-seo h2::after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  bottom:0 !important;
  transform:translateX(-50%) !important;
  width:72px !important;
  height:2px !important;
  background:linear-gradient(90deg,transparent,#c9a96b,transparent) !important;
}

/* ---------------------------------------------------------------- READABILITY + CENTERING
   Keep prose in a centered measure; center figures and the explore nav. */
.phx-seo > section p{
  max-width:760px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.phx-seo figure{
  max-width:860px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.phx-seo > nav{
  justify-content:center !important;
  text-align:center !important;
  max-width:1000px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}