
/* Sea Of Glass And Mirrors — Visual Hierarchy & Hero Governance 0.5.23 */

/* GOLDEN RULE — LEVEL 1: background/section containers have square corners.
   Rounded corners are reserved for level 2+ cards/panels/media. */
body[data-sog-design] main > section,
body[data-sog-design] main > .section,
body[data-sog-design] main > div.section {
  border-radius:0!important;
}

/* Explicitly strip old rounding from public top-level presentation regions. */
body[data-sog-design] :is(
  .featured-series,.categories,.testimonials,.areas-served,.youtube-section,
  .services,.contact-page,.about-section,.blog-section,.gallery-section,
  .partition-official-page,.article-reading-section,.page-hero,.hero-carousel
){
  border-radius:0!important;
}

/* LEVEL 2+: retain soft contours. */
body[data-sog-design] :is(
  .series-item,.category-card,.service-card,.feature-card,.testimonial-card,
  .contact-card,.contact-info,.contact-map-card,.contact-location-card,
  .about-content,.content-card,.article-card,.official-article-card,.blog-card,
  .gallery-item,.mirror-runway,.map-container,.sog-location-map
){
  border-radius:clamp(16px,1.45vw,24px)!important;
}

/* HERO: one centered, full-width geometry on every internal page. */
body[data-sog-design] .page-hero{
  position:relative!important;
  width:100vw!important;
  max-width:100vw!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  margin:0!important;
  min-height:clamp(420px,58vh,680px)!important;
  overflow:hidden!important;
  background:var(--sog-theme-bg,#021526)!important;
  border-radius:0!important;
}

/* The actual photograph occupies the complete hero symmetrically. */
body[data-sog-design] .page-hero > .ghost-bg{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
  background-size:cover!important;
  background-position:50% 50%!important;
  background-repeat:no-repeat!important;
  filter:none!important;
  opacity:1!important;
  transform:none!important;
  image-rendering:auto!important;
}

/* Overlay never changes the photograph geometry. */
body[data-sog-design] .page-hero > .hero-overlay{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  border-radius:0!important;
}

/* HOME hero follows the same full-bleed, centered geometry. */
body[data-sog-design] .hero-carousel{
  width:100vw!important;
  max-width:100vw!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  margin-inline:0!important;
  border-radius:0!important;
}
body[data-sog-design] .hero-carousel .carousel-container,
body[data-sog-design] .hero-carousel .carousel-slide{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  border-radius:0!important;
  background-size:cover!important;
  background-position:50% 50%!important;
  background-repeat:no-repeat!important;
  filter:none!important;
}

/* Editable hero backgrounds receive a subtle editor-only outline, not public decoration. */
body.sog-edit-mode [data-editable-role="hero-background"]:hover,
body[data-sog-editing="true"] [data-editable-role="hero-background"]:hover{
  outline:2px solid var(--sog-accent,#00e5ff)!important;
  outline-offset:-3px!important;
  cursor:context-menu!important;
}

/* Keep logo and CTA symmetrically inset from viewport edges. */
body[data-sog-design] .page-hero .hero-logo{
  left:clamp(28px,4vw,72px)!important;
}
body[data-sog-design] .page-hero .hero-free-estimate{
  right:clamp(28px,4vw,72px)!important;
}

/* Prevent header/hero text collision. */
body[data-sog-design] .page-hero > .container{
  width:min(1180px,calc(100vw - 2 * clamp(28px,5vw,86px)))!important;
  margin-inline:auto!important;
  padding-inline:0!important;
}

/* Mobile: preserve symmetry and crisp framing. */
@media(max-width:760px){
  body[data-sog-design] .page-hero{
    min-height:clamp(380px,64svh,620px)!important;
  }
  body[data-sog-design] .page-hero > .ghost-bg{
    background-position:50% 50%!important;
  }
}


/* Article main images: centered, sharp and editable using the same media editor. */
body[data-sog-design] .article-hero-image{
  width:min(1480px,calc(100vw - 2 * clamp(24px,4vw,72px)))!important;
  min-height:clamp(360px,56vh,700px)!important;
  margin-inline:auto!important;
  border-radius:0!important; /* level 1 image region */
  background-size:cover!important;
  background-position:50% 50%!important;
  background-repeat:no-repeat!important;
  filter:none!important;
}
