/* Visual Phase 8 — responsive crop, focal-point and image presentation polish. */

/* Universal protections for curated visual-system media. */
.sam-visual-phase8 img[src*="/assets/images/phase2-homepage/"],
.sam-visual-phase8 img[src*="/assets/images/phase3-services/"],
.sam-visual-phase8 img[src*="/assets/images/phase4-trust/"],
.sam-visual-phase8 img[src*="/assets/images/phase5-pages/"],
.sam-visual-phase8 img[src*="/assets/images/phase6-products/"],
.sam-visual-phase8 img[src*="/assets/images/approved/"]{
  max-width:100%;
  image-rendering:auto;
  backface-visibility:hidden;
  transform-origin:center center;
}

/* Approved client service banners: preserve the whole composition and embedded copy. */
.sam-visual-phase8 .sam-service-card-visual.is-primary-service .sam-service-media,
.sam-visual-phase8 .sam-services-page .sam-p12-card-media{
  aspect-ratio:1672/941;
  background:#070b16;
}
.sam-visual-phase8 .sam-service-card-visual.is-primary-service .sam-service-media img,
.sam-visual-phase8 .sam-services-page .sam-p12-card-media img{
  object-fit:contain!important;
  object-position:center!important;
  background:#070b16;
}
.sam-visual-phase8 .sam-service-card-visual.is-primary-service:hover .sam-service-media img,
.sam-visual-phase8 .sam-services-page .sam-p12-card:hover .sam-p12-card-media img{
  transform:none!important;
}

/* Homepage focal points — tuned for the actual Phase 2 artwork. */
.sam-visual-phase8 img[src*="hero-ideas-systems-real-impact.webp"]{object-position:68% 50%!important}
.sam-visual-phase8 img[src*="about-consulting-premium.webp"]{object-position:57% 50%!important}
.sam-visual-phase8 img[src*="about-systems-planning.webp"]{object-position:56% 50%!important}
.sam-visual-phase8 img[src*="experience-digital-studio.webp"]{object-position:55% 50%!important}
.sam-visual-phase8 img[src*="stats-growth-analytics.webp"]{object-position:61% 50%!important}
.sam-visual-phase8 img[src*="launchpad-web3-command.webp"]{object-position:52% 50%!important}
.sam-visual-phase8 img[src*="final-cta-creative-execution.webp"]{object-position:60% 50%!important}
.sam-visual-phase8 img[src*="solutions-service-growth.webp"]{object-position:54% 50%!important}
.sam-visual-phase8 img[src*="packages-growth-system.webp"]{object-position:50% 50%!important}

/* Homepage composition sizing. */
.sam-visual-phase8 .sam-about-main img,
.sam-visual-phase8 .sam-about-small img,
.sam-visual-phase8 .sam-inline-photo,
.sam-visual-phase8 .sam-launch-media>img,
.sam-visual-phase8 .sam-final-cta>img,
.sam-visual-phase8 .sam-stats>img{
  width:100%;height:100%;object-fit:cover;
}
.sam-visual-phase8 .sam-about-main,
.sam-visual-phase8 .sam-about-small,
.sam-visual-phase8 .sam-launch-media,
.sam-visual-phase8 .sam-final-cta{
  overflow:hidden;
}

/* Phase 3 service storytelling — keep faces/screens inside crop on all devices. */
.sam-visual-phase8 .sam-service-visual-story-media{aspect-ratio:16/9;min-height:0}
.sam-visual-phase8 .sam-service-visual-story-media img{object-fit:cover}
.sam-visual-phase8 img[src*="business-launch-consulting.webp"]{object-position:50% 48%!important}
.sam-visual-phase8 img[src*="digital-product-optimization.webp"]{object-position:63% 50%!important}
.sam-visual-phase8 img[src*="social-media-operations.webp"]{object-position:55% 50%!important}
.sam-visual-phase8 img[src*="web3-product-ecosystem.webp"]{object-position:54% 50%!important}

/* Team capability portraits. */
.sam-visual-phase8 .sam-team-card>img{object-fit:cover!important}
.sam-visual-phase8 img[src*="team-design.webp"]{object-position:50% 36%!important}
.sam-visual-phase8 img[src*="team-development.webp"]{object-position:51% 37%!important}
.sam-visual-phase8 img[src*="team-growth.webp"]{object-position:50% 35%!important}
.sam-visual-phase8 img[src*="team-strategy.webp"]{object-position:50% 36%!important}

/* Inner-page heroes — explicit focal points per page artwork. */
.sam-visual-phase8 .sam-p12-hero-media[src*="about-page.webp"]{object-position:52% 48%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="services-page.webp"]{object-position:68% 50%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="showcase-page.webp"]{object-position:67% 48%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="wordpress-systems-page.webp"]{object-position:72% 50%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="launchpad-page.webp"]{object-position:55% 50%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="solutions-page.webp"]{object-position:64% 50%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="packages-page.webp"]{object-position:50% 50%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="contact-page.webp"]{object-position:68% 50%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="faq-page.webp"]{object-position:62% 50%!important}
.sam-visual-phase8 .sam-p12-hero-media[src*="support-page.webp"]{object-position:44% 50%!important}

/* Hero treatment: less destructive than legacy grayscale, consistent readability. */
.sam-visual-phase8 .sam-p12-hero-media{
  width:100%;height:100%;object-fit:cover!important;
  filter:saturate(.76) contrast(1.06) brightness(.78)!important;
  opacity:.62!important;
}
.sam-visual-phase8 .sam-p12-hero:before{
  background:linear-gradient(100deg,rgba(7,8,12,.97) 0%,rgba(7,8,12,.86) 43%,rgba(7,8,12,.49) 72%,rgba(7,8,12,.38) 100%),radial-gradient(circle at 78% 28%,rgba(255,177,22,.15),transparent 31%)!important;
}

/* Split media: keep both images stable and avoid extreme portrait crop. */
.sam-visual-phase8 .sam-p12-split-media>img{
  object-fit:cover!important;
  object-position:center!important;
  filter:saturate(.88) contrast(1.04)!important;
}

/* Phase 6 commerce: uniform product ratios with no stretch. */
.sam-visual-phase8 .sam-phase6-commerce-cover,
.sam-visual-phase8 .woocommerce ul.products li.product img[src*="/phase6-products/"],
.sam-visual-phase8 .sam-p30-related img[src*="/phase6-products/"]{
  width:100%!important;
  height:auto!important;
  aspect-ratio:16/9!important;
  object-fit:cover!important;
  object-position:center!important;
}
.sam-visual-phase8 .single-product .sam-phase6-commerce-cover{
  aspect-ratio:16/9!important;
  object-fit:contain!important;
  background:#0a0d13;
}

/* Prevent hover zoom from clipping embedded artwork/copy in curated commerce covers. */
.sam-visual-phase8 li.product:hover img[src*="/phase6-products/"],
.sam-visual-phase8 .sam-p30-related li.product:hover img[src*="/phase6-products/"]{
  transform:scale(1.012)!important;
}

/* Tablet. */
@media(max-width:1024px){
  .sam-visual-phase8 .sam-p12-hero-media{opacity:.54!important}
  .sam-visual-phase8 img[src*="hero-ideas-systems-real-impact.webp"]{object-position:64% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="services-page.webp"],
  .sam-visual-phase8 .sam-p12-hero-media[src*="showcase-page.webp"],
  .sam-visual-phase8 .sam-p12-hero-media[src*="wordpress-systems-page.webp"],
  .sam-visual-phase8 .sam-p12-hero-media[src*="contact-page.webp"]{object-position:62% 50%!important}
  .sam-visual-phase8 .sam-service-visual-story-media{max-width:820px;width:100%;margin-inline:auto}
}

/* Mobile: preserve focal subjects rather than blindly centering every image. */
@media(max-width:700px){
  .sam-visual-phase8 .sam-p12-hero{min-height:620px}
  .sam-visual-phase8 .sam-p12-hero-media{opacity:.38!important;filter:saturate(.72) contrast(1.08) brightness(.67)!important}
  .sam-visual-phase8 .sam-p12-hero:before{background:linear-gradient(180deg,rgba(7,8,12,.77) 0%,rgba(7,8,12,.91) 52%,rgba(7,8,12,.98) 100%)!important}

  .sam-visual-phase8 img[src*="hero-ideas-systems-real-impact.webp"]{object-position:70% 50%!important}
  .sam-visual-phase8 img[src*="about-consulting-premium.webp"]{object-position:58% 50%!important}
  .sam-visual-phase8 img[src*="about-systems-planning.webp"]{object-position:60% 50%!important}
  .sam-visual-phase8 img[src*="experience-digital-studio.webp"]{object-position:58% 50%!important}
  .sam-visual-phase8 img[src*="stats-growth-analytics.webp"]{object-position:68% 50%!important}
  .sam-visual-phase8 img[src*="launchpad-web3-command.webp"]{object-position:55% 50%!important}
  .sam-visual-phase8 img[src*="final-cta-creative-execution.webp"]{object-position:62% 50%!important}

  .sam-visual-phase8 .sam-p12-hero-media[src*="about-page.webp"]{object-position:58% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="services-page.webp"]{object-position:70% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="showcase-page.webp"]{object-position:72% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="wordpress-systems-page.webp"]{object-position:74% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="launchpad-page.webp"]{object-position:52% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="solutions-page.webp"]{object-position:66% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="packages-page.webp"]{object-position:50% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="contact-page.webp"]{object-position:70% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="faq-page.webp"]{object-position:64% 50%!important}
  .sam-visual-phase8 .sam-p12-hero-media[src*="support-page.webp"]{object-position:40% 50%!important}

  .sam-visual-phase8 .sam-service-visual-story-media{aspect-ratio:4/3;border-radius:16px}
  .sam-visual-phase8 img[src*="business-launch-consulting.webp"]{object-position:54% 50%!important}
  .sam-visual-phase8 img[src*="digital-product-optimization.webp"]{object-position:67% 50%!important}
  .sam-visual-phase8 img[src*="social-media-operations.webp"]{object-position:58% 50%!important}
  .sam-visual-phase8 img[src*="web3-product-ecosystem.webp"]{object-position:58% 50%!important}

  .sam-visual-phase8 .sam-team-card>img{aspect-ratio:4/3!important}
  .sam-visual-phase8 .sam-about-main,.sam-visual-phase8 .sam-about-small{border-radius:16px}
  .sam-visual-phase8 .sam-p12-split-media>img{width:86%;height:74%}
}

@media(max-width:480px){
  .sam-visual-phase8 .sam-p12-hero{min-height:590px}
  .sam-visual-phase8 .sam-service-card-visual.is-primary-service .sam-service-media,
  .sam-visual-phase8 .sam-services-page .sam-p12-card-media{aspect-ratio:16/9}
  .sam-visual-phase8 .sam-p12-split-media{min-height:390px}
}

@media(prefers-reduced-motion:reduce){
  .sam-visual-phase8 .sam-service-media img,
  .sam-visual-phase8 .sam-team-card>img,
  .sam-visual-phase8 .sam-service-visual-story-media img,
  .sam-visual-phase8 li.product img{transition:none!important;transform:none!important}
}