
/* Sea Of Glass And Mirrors — Corrective Visual Audit 0.5.23
   This layer explicitly neutralizes legacy transforms/sizing that can survive browser cache. */

:root{
  --sog-safe-x:clamp(24px,4vw,72px);
  --sog-content-max:1480px;
  --sog-reading-max:1240px;
}

/* ---------- GLOBAL CACHE-RESISTANT GEOMETRY ---------- */
html body[data-sog-design] main#main-content :is(
 .series-grid-main,.categories-grid,.gallery-grid,.official-article-grid,
 .applications-grid,.services-grid,.partition-application-grid,
 .contact-grid,.contact-layout,.contact-map-grid,.contact-location-layout,
 .about-content,.content-text,.editorial-copy-card,.partition-intro-card,
 .partition-gallery-block,.partition-reading-panel,.mirror-runway,
 .map-container,.sog-location-map
){
  transform:none!important;
  left:auto!important;
  right:auto!important;
  margin-left:auto!important;
  margin-right:auto!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}

/* The principal content grids always fill their centered parent, never the viewport. */
html body[data-sog-design] main#main-content :is(
 .series-grid-main,.categories-grid,.gallery-grid,.official-article-grid,
 .applications-grid,.services-grid,.partition-application-grid,
 .contact-grid,.contact-layout,.contact-map-grid,.contact-location-layout
){
  width:100%!important;
}

/* ---------- FIX 1: BLOG + FEATURED ARTICLE CARDS ---------- */
html body[data-sog-design] .official-article-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:clamp(22px,2.2vw,36px)!important;
  width:100%!important;
  max-width:1400px!important;
  margin-inline:auto!important;
  transform:none!important;
  align-items:stretch!important;
  overflow:visible!important;
}
html body[data-sog-design] .official-article-grid > .official-article-card{
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  height:100%!important;
  align-self:stretch!important;
  overflow:hidden!important;
}
html body[data-sog-design] .official-article-card .category-info{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
  height:auto!important;
  padding:clamp(24px,2vw,34px)!important;
}
html body[data-sog-design] .official-article-card h3{
  font-size:clamp(1.2rem,1.45vw,1.65rem)!important;
  line-height:1.22!important;
  margin:0 0 18px!important;
}
html body[data-sog-design] .official-article-card p{
  font-size:clamp(.98rem,1vw,1.08rem)!important;
  line-height:1.58!important;
  margin:0!important;
}
html body[data-sog-design] .official-article-card .official-article-cta{
  margin-top:clamp(24px,2.5vw,38px)!important;
  position:static!important;
}
@media(max-width:1100px){
  html body[data-sog-design] .official-article-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:680px){
  html body[data-sog-design] .official-article-grid{grid-template-columns:1fr!important}
}

/* ---------- FIX 2: TESTIMONIALS — NEVER CLIP QUOTES OR TEXT ---------- */
html body[data-sog-design] .testimonial-card{
  position:relative!important;
  overflow:visible!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  padding:clamp(28px,3vw,44px)!important;
}
html body[data-sog-design] .testimonial-card::before,
html body[data-sog-design] .testimonial-card::after{
  max-width:calc(100% - 24px)!important;
}
html body[data-sog-design] .testimonial-card :is(p,blockquote,h3,h4,strong,span){
  max-width:100%!important;
  overflow:visible!important;
  overflow-wrap:anywhere!important;
}

/* ---------- FIX 3: LOCATION / MAP CONTENT — NO BOTTOM CROP ---------- */
html body[data-sog-design] :is(.contact-layout,.contact-map-grid,.contact-location-layout){
  align-items:stretch!important;
  overflow:visible!important;
}
html body[data-sog-design] :is(.contact-layout,.contact-map-grid,.contact-location-layout) > *{
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  overflow:visible!important;
}
html body[data-sog-design] :is(.sog-location-map,.map-container,.contact-map-card,.contact-location-card){
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
}
html body[data-sog-design] .sog-location-card{
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
}
html body[data-sog-design] .sog-location-card:last-child{
  margin-bottom:0!important;
}
html body[data-sog-design] :is(.sog-location-map,.contact-map-card,.contact-location-card) p:last-child{
  margin-bottom:0!important;
}

/* ---------- FIX 4: ABOUT — PROFESSIONAL READING WIDTH ---------- */
html body[data-page-id="about-us"] .about-content,
html body[data-page-id="about"] .about-content{
  width:min(100%,var(--sog-reading-max))!important;
  max-width:var(--sog-reading-max)!important;
  margin-inline:auto!important;
  padding:clamp(30px,3vw,52px)!important;
}
html body[data-page-id="about-us"] .about-content :is(p,li),
html body[data-page-id="about"] .about-content :is(p,li){
  max-width:1080px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  line-height:1.72!important;
}
html body[data-page-id="about-us"] .about-content h2,
html body[data-page-id="about"] .about-content h2{
  text-align:center!important;
  margin-inline:auto!important;
}

/* ---------- FIX 5: FIXED NAVIGATION MUST NOT COVER PAGE CONTENT ---------- */
html body[data-sog-design] main#main-content > .page-hero,
html body[data-sog-design] main#main-content > .hero-carousel{
  z-index:1!important;
}
html body[data-sog-design] .header{
  z-index:1000!important;
}
html body[data-sog-design] main#main-content > :is(.page-hero,.hero-carousel) .container{
  padding-top:clamp(118px,8vw,150px)!important;
}
/* Interior sections following the hero must never rise underneath the fixed header. */
html body[data-sog-design] main#main-content > section:not(:first-child){
  scroll-margin-top:130px!important;
}

/* ---------- FIX 6: FIRST LEVEL IS SQUARE; ONLY INNER CARDS ROUND ---------- */
html body[data-sog-design] main#main-content > section{
  border-radius:0!important;
}
html body[data-sog-design] main#main-content > section > .container{
  overflow:visible!important;
}

/* ---------- SAFE VIEWPORT ---------- */
@media(max-width:900px){
  :root{--sog-safe-x:clamp(14px,4vw,28px)}
  html body[data-sog-design] main#main-content > :is(.page-hero,.hero-carousel) .container{
    padding-top:110px!important;
  }
}


/* ---------- 0.5.23 STRUCTURAL + VISUAL SYMMETRY ---------- */

/* Featured paired blocks: equal geometry + balanced visual mass. */
@media(min-width:901px){
  html body[data-sog-design] .featured-series .series-item{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    align-items:stretch!important;
    column-gap:clamp(28px,4vw,68px)!important;
  }
  html body[data-sog-design] .featured-series .series-image,
  html body[data-sog-design] .featured-series .series-info{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    box-sizing:border-box!important;
  }
  html body[data-sog-design] .featured-series .series-info{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:stretch!important;
    padding-block:clamp(34px,4vw,70px)!important;
  }
  html body[data-sog-design] .featured-series .series-info > :first-child{
    margin-top:0!important;
  }
  html body[data-sog-design] .featured-series .series-info > :last-child{
    margin-bottom:0!important;
  }
}

/* About block: it now lives inside main and follows the same centered geometry. */
html body[data-sog-design] main#main-content > section.services > .container{
  width:min(var(--sog-content-max),calc(100% - (2 * var(--sog-safe-x))))!important;
  max-width:var(--sog-content-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}
html body[data-sog-design] main#main-content > section.services .editorial-copy-card{
  width:min(100%,1240px)!important;
  max-width:1240px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding:clamp(34px,3vw,54px)!important;
  box-sizing:border-box!important;
}
html body[data-sog-design] main#main-content > section.services .editorial-copy-card > *{
  max-width:1080px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html body[data-sog-design] main#main-content > section.services .editorial-copy-card h2{
  text-align:center!important;
}

/* Sections formerly outside main must obey level-one rules too. */
html body[data-sog-design] main#main-content > :is(.testimonials,.youtube-spotlight,.areas-served){
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  border-radius:0!important;
}
html body[data-sog-design] main#main-content > :is(.testimonials,.youtube-spotlight,.areas-served) > .container{
  width:min(var(--sog-content-max),calc(100% - (2 * var(--sog-safe-x))))!important;
  max-width:var(--sog-content-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* 0.5.23 — Hero CTA vertical balance */
@media(min-width:901px){
  html body .page-hero .hero-free-estimate,
  html body .hero-carousel .hero-free-estimate{
    top:clamp(158px,17vh,182px)!important;
  }
}
