/*
STONEBRIDGE EDITORIAL EXPERIENCE 2026-08-24
Additive sitewide presentation layer for normal Stonebridge pages.
The approved paid landing pages are intentionally excluded by the installer.
This file defines no Stonebridge brand gold. It inherits the live site's existing palette.
*/

body.sb-editorial-site{
  --sb-editorial-max:1220px;
  --sb-editorial-copy:760px;
  --sb-editorial-section:clamp(68px,6.4vw,100px);
  overflow-x:hidden;
  overflow-x:clip;
}

/* Keep the global canvas cinematic while the readable content stays contained. */
body.sb-editorial-site main{position:relative;isolation:isolate;overflow:clip}
body.sb-editorial-site main>.section,
body.sb-editorial-site main>section.section{padding-block:var(--sb-editorial-section)}
body.sb-editorial-site .container,
body.sb-editorial-site main .wrap{
  width:min(var(--sb-editorial-max),calc(100% - 64px));
  max-width:var(--sb-editorial-max);
  margin-inline:auto;
}
body.sb-editorial-site main .section>.container>p,
body.sb-editorial-site main .section>.container>.section-intro,
body.sb-editorial-site main .section>.container>.section-copy,
body.sb-editorial-site .page-hero-inner>p{
  max-width:var(--sb-editorial-copy);
}
body.sb-editorial-site main .section>.container>h2,
body.sb-editorial-site main .section>.container>.section-head h2{
  max-width:940px;
}

/* Editorial type scale. Impact comes from hierarchy, not oversized type. */
body.sb-editorial-site .hero h1,
body.sb-editorial-site .page-hero h1{
  font-size:clamp(44px,5vw,64px)!important;
  line-height:1.02!important;
  letter-spacing:-.035em;
  max-width:900px;
}
body.sb-editorial-site main h2{
  font-size:clamp(32px,3.25vw,44px)!important;
  line-height:1.08!important;
  letter-spacing:-.024em;
}
body.sb-editorial-site main h3{
  font-size:clamp(21px,2vw,27px)!important;
  line-height:1.2!important;
}
body.sb-editorial-site main p,
body.sb-editorial-site main li{
  line-height:1.68;
}

/* The bridge becomes the beginning of the page, not a separate image block. */
body.sb-editorial-site .page-hero{
  min-height:clamp(480px,62vh,620px)!important;
  height:auto!important;
  position:relative;
  overflow:visible!important;
  isolation:isolate;
}
body.sb-editorial-site .page-hero-bg{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 58%,rgba(0,0,0,.94) 70%,rgba(0,0,0,.58) 86%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 58%,rgba(0,0,0,.94) 70%,rgba(0,0,0,.58) 86%,transparent 100%);
}
body.sb-editorial-site .page-hero:after,
body.sb-editorial-site .sb-home-hero:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:190px;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.32) 42%,rgba(0,0,0,.82) 82%,rgba(0,0,0,.98));
}
body.sb-editorial-site .page-hero-inner{
  position:relative;
  z-index:2;
  min-height:inherit;
  padding-top:clamp(108px,12vh,150px);
  padding-bottom:clamp(96px,11vh,132px);
}
body.sb-editorial-site .page-hero-inner>p{
  font-size:clamp(17px,1.35vw,19px);
  line-height:1.7;
}
body.sb-editorial-site .v18-hero-sidecard{max-width:390px}

/* Pull proof into the bridge transition so the page starts immediately. */
body.sb-editorial-site .page-hero+.v18-metric-band,
body.sb-editorial-site .sb-home-hero+.sb-home-metrics,
body.sb-editorial-site .sb-home-metrics{
  position:relative;
  z-index:4;
}
body.sb-editorial-site .page-hero+.v18-metric-band{margin-top:-58px}
body.sb-editorial-site .v18-metric-band .container,
body.sb-editorial-site .unified-credibility-band .container{
  width:min(1120px,calc(100% - 64px));
}
body.sb-editorial-site .v18-metric-grid{gap:0}
body.sb-editorial-site .v18-metric{padding:24px 22px}
body.sb-editorial-site .v18-metric span{font-size:clamp(28px,3vw,39px)!important}
body.sb-editorial-site .v18-metric p{font-size:12px;line-height:1.4}

/* Tighter, calmer content rhythm. */
body.sb-editorial-site .premium-two-col,
body.sb-editorial-site .contact-layout,
body.sb-editorial-site .v18-two-col,
body.sb-editorial-site .two-col,
body.sb-editorial-site .split-layout{gap:clamp(34px,4.5vw,64px)}
body.sb-editorial-site .service-grid,
body.sb-editorial-site .card-grid,
body.sb-editorial-site .case-grid,
body.sb-editorial-site .portfolio-grid{gap:clamp(14px,1.5vw,22px)}
body.sb-editorial-site .service-card,
body.sb-editorial-site .premium-card,
body.sb-editorial-site .case-card,
body.sb-editorial-site .portfolio-card,
body.sb-editorial-site .contact-panel,
body.sb-editorial-site .faq-item,
body.sb-editorial-site .premium-faq-item{
  border-radius:16px;
}
@media (hover:hover){
  body.sb-editorial-site .service-card,
  body.sb-editorial-site .premium-card,
  body.sb-editorial-site .case-card,
  body.sb-editorial-site .portfolio-card,
  body.sb-editorial-site .contact-panel{
    transition:transform .24s ease,border-color .24s ease,background-color .24s ease;
  }
  body.sb-editorial-site .service-card:hover,
  body.sb-editorial-site .premium-card:hover,
  body.sb-editorial-site .case-card:hover,
  body.sb-editorial-site .portfolio-card:hover,
  body.sb-editorial-site .contact-panel:hover{transform:translateY(-4px)}
}

/* Homepage: shorter cinematic opening, followed by evidence and clear chapters. */
body.sb-editorial-home .sb-home-hero{
  min-height:clamp(570px,72vh,710px)!important;
  height:auto!important;
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
body.sb-editorial-home .sb-home-hero>.container,
body.sb-editorial-home .sb-home-hero [class*="hero-inner"]{
  width:min(1220px,calc(100% - 64px));
  max-width:1220px;
  margin-inline:auto;
}
body.sb-editorial-home .sb-home-hero h1{max-width:820px}
body.sb-editorial-home .sb-home-hero p{max-width:720px;font-size:clamp(17px,1.35vw,19px);line-height:1.68}
body.sb-editorial-home .sb-home-hero-engine-teaser{display:none!important}
body.sb-editorial-home .sb-home-metrics{margin-top:-54px}
body.sb-editorial-home .sb-home-everything,
body.sb-editorial-home .sb-home-portfolio,
body.sb-editorial-home .sb-home-cases,
body.sb-editorial-home .sb-home-framework,
body.sb-editorial-home .sb-home-services,
body.sb-editorial-home .sb-home-media,
body.sb-editorial-home .sb-home-about,
body.sb-editorial-home .sb-home-consultation{padding-block:clamp(72px,6.5vw,102px)}
body.sb-editorial-home .sb-home-marquee{padding-block:20px!important;overflow:hidden}
body.sb-editorial-home .sb-home-marquee p,body.sb-editorial-home .sb-home-marquee span{font-size:12px!important;letter-spacing:.08em;opacity:.74}
body.sb-editorial-home .sb-home-integrated{
  padding-block:36px!important;
  border-block:1px solid rgba(255,255,255,.08);
}
body.sb-editorial-home .sb-home-integrated .container,
body.sb-editorial-home .sb-home-integrated>div{max-width:980px}
body.sb-editorial-home .sb-home-integrated h2,
body.sb-editorial-home .sb-home-integrated [class*="title"]{font-size:clamp(27px,2.7vw,36px)!important}
body.sb-editorial-home .sb-home-portfolio,
body.sb-editorial-home .sb-home-cases{position:relative}
body.sb-editorial-home .sb-home-portfolio h2,
body.sb-editorial-home .sb-home-cases h2{max-width:820px}
body.sb-editorial-home .sb-home-about p{max-width:760px}

/* About page: make the history scannable before the longer narrative. */
body.sb-editorial-about .sb-about-timeline{padding-block:clamp(60px,5.5vw,84px)}
body.sb-editorial-about .sb-about-timeline .sb-about-timeline-head{max-width:760px;margin-bottom:34px}
body.sb-editorial-about .sb-about-timeline-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  overflow:hidden;
  background:rgba(255,255,255,.08);
}
body.sb-editorial-about .sb-about-milestone{
  background:rgba(0,0,0,.78);
  padding:26px 24px 28px;
  min-height:190px;
}
body.sb-editorial-about .sb-about-milestone .eyebrow{margin-bottom:18px}
body.sb-editorial-about .sb-about-milestone h3{font-size:22px!important;margin:0 0 12px}
body.sb-editorial-about .sb-about-milestone p{font-size:14px;line-height:1.62;margin:0;opacity:.82}

/* Long-form pages should read like editorial pages, not wide presentation slides. */
body.sb-editorial-site main article,
body.sb-editorial-site main .article-body,
body.sb-editorial-site main .insight-body,
body.sb-editorial-site main .editorial-content,
body.sb-editorial-site main .prose,
body.sb-editorial-site main .resource-copy{max-width:820px}
body.sb-editorial-site main article p,
body.sb-editorial-site main .article-body p,
body.sb-editorial-site main .insight-body p,
body.sb-editorial-site main .editorial-content p{max-width:760px}

/* Footer remains the same system, with a calmer headline scale. */
body.sb-editorial-site .site-footer .footer-cta h2,
body.sb-editorial-site .site-footer .closing-panel h2{font-size:clamp(30px,3.4vw,44px)!important;line-height:1.08!important}

@media(max-width:980px){
  body.sb-editorial-site{--sb-editorial-section:clamp(62px,8vw,82px)}
  body.sb-editorial-site .container,
  body.sb-editorial-site main .wrap,
  body.sb-editorial-home .sb-home-hero>.container,
  body.sb-editorial-home .sb-home-hero [class*="hero-inner"]{width:min(calc(100% - 44px),1220px)}
  body.sb-editorial-site .page-hero{min-height:520px!important}
  body.sb-editorial-site .page-hero-inner{padding-top:104px;padding-bottom:105px}
  body.sb-editorial-about .sb-about-timeline-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:640px){
  body.sb-editorial-site{--sb-editorial-section:60px}
  body.sb-editorial-site .container,
  body.sb-editorial-site main .wrap,
  body.sb-editorial-home .sb-home-hero>.container,
  body.sb-editorial-home .sb-home-hero [class*="hero-inner"]{width:min(calc(100% - 40px),1220px)}
  body.sb-editorial-site .hero h1,
  body.sb-editorial-site .page-hero h1{font-size:clamp(38px,11vw,48px)!important;line-height:1.04!important}
  body.sb-editorial-site main h2{font-size:clamp(29px,8.8vw,36px)!important}
  body.sb-editorial-site main h3{font-size:21px!important}
  body.sb-editorial-site .page-hero{min-height:470px!important}
  body.sb-editorial-site .page-hero-inner{padding-top:92px;padding-bottom:88px}
  body.sb-editorial-site .page-hero:after,
  body.sb-editorial-site .sb-home-hero:after{height:140px}
  body.sb-editorial-site .page-hero+.v18-metric-band{margin-top:-34px}
  body.sb-editorial-site .v18-metric-band .container,
  body.sb-editorial-site .unified-credibility-band .container{width:min(calc(100% - 32px),1120px)}
  body.sb-editorial-site .v18-metric{padding:19px 14px}
  body.sb-editorial-home .sb-home-hero{min-height:560px!important}
  body.sb-editorial-home .sb-home-metrics{margin-top:-32px}
  body.sb-editorial-about .sb-about-timeline-grid{grid-template-columns:1fr}
  body.sb-editorial-about .sb-about-milestone{min-height:0;padding:22px 20px}
}

@media(prefers-reduced-motion:reduce){
  body.sb-editorial-site .service-card,
  body.sb-editorial-site .premium-card,
  body.sb-editorial-site .case-card,
  body.sb-editorial-site .portfolio-card,
  body.sb-editorial-site .contact-panel{transition:none!important;transform:none!important}
}