/* Measured from the source at desktop: compact editorial rows, with images kept deliberately secondary. */
.public-site main .ng-product-story,
.public-site main .ng-product-story-dark {
  width: 88% !important;
  max-width: 1600px !important;
  grid-template-columns: minmax(0, 1fr) 490px !important;
  gap: clamp(65px, 6vw, 110px) !important;
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.public-site main .ng-product-story > div,
.public-site main .ng-product-story-dark > div {
  transform: translateX(60px);
}

.public-site main .ng-product-story figure {
  width: 348px !important;
  height: 201px !important;
  margin-left: 45px !important;
}

.public-site main .ng-product-story span,
.public-site main .ng-product-story-dark span {
  margin-bottom: 20px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  text-transform: none !important;
}

.public-site main .ng-product-story li,
.public-site main .ng-product-story-dark li {
  padding: 0 !important;
  font-size: 17px !important;
  line-height: 1.5 !important;
}

@media (max-width: 900px) {
  .public-site main .ng-product-story,
  .public-site main .ng-product-story-dark {
    width: calc(100% - 40px) !important;
    grid-template-columns: 1fr !important;
  }

  .public-site main .ng-product-story > div,
  .public-site main .ng-product-story-dark > div {
    transform: none;
  }

  .public-site main .ng-product-story figure {
    width: 100% !important;
    height: 280px !important;
    margin-left: 0 !important;
  }

  .public-site main .ng-product-story span,
  .public-site main .ng-product-story-dark span {
    font-size: 18px !important;
  }

  .public-site main .ng-product-story li,
  .public-site main .ng-product-story-dark li {
    font-size: 17px !important;
  }
}
.public-site main .product-complete-values span{font-size:24px!important;line-height:1.1!important}.public-site main .product-complete-values p{font-size:17px!important;line-height:1.35!important}@media(max-width:760px){.public-site main .product-complete-values span{font-size:22px!important}.public-site main .product-complete-values p{font-size:16px!important}}

/* Commercial product detail pages: measured against nanoxplore.com at a 1280px viewport. */
.public-site main .product-source-hero{box-sizing:border-box;display:grid;grid-template-columns:542px 536.6px;grid-template-areas:"title title" "eyebrow eyebrow" "visual copy" "visual action";column-gap:55.4px;width:min(1134px,calc(100% - 48px));margin:0 auto;padding:115px 0 92px;background:#fff;color:#343434}.public-site main .product-source-hero>div{display:contents;max-width:none}.public-site main .product-source-hero h1{grid-area:title;margin:0;color:#151428;font-size:49.6px;font-weight:700;line-height:49.6px;letter-spacing:-.055em}.public-site main .product-source-hero span{grid-area:eyebrow;justify-self:center;margin-top:10px;color:#4b4b4b;font-size:16px;font-weight:500;line-height:24px;letter-spacing:0}.public-site main .product-source-hero>img{grid-area:visual;align-self:start;width:410.9px;height:auto;margin:194px 0 0 141px;border-radius:0;background:transparent;box-shadow:none}.public-site main .product-source-hero p{grid-area:copy;align-self:start;margin:188.6px 0 0;color:#353535;font-size:18px;font-weight:400;line-height:27px}.public-site main .product-source-hero .public-button{grid-area:action;justify-self:start;align-self:start;min-height:50px;margin:21.5px 0 0;padding:12px 24px;color:#211540;border-color:#7045ca;background:#fff;font-size:16px;font-weight:500;line-height:24px}

/* The source uses three deliberately compact cards rather than large tiles. */
.public-site main .product-source-hero+.product-complete-values{grid-template-columns:repeat(3,240px);justify-content:center;max-width:960px;margin:0 auto;padding:0 0 95px;gap:20px}.public-site main .product-source-hero+.product-complete-values article{box-sizing:border-box;min-height:270.7px;height:270.7px;padding:34px 20px 28px;border:0;border-radius:0;background:rgba(0,0,0,.05)}.public-site main .product-source-hero+.product-complete-values article:before{width:28px;height:28px;margin-bottom:23px;color:#5918b9;font-size:28px}.public-site main .product-source-hero+.product-complete-values article:nth-child(2):before,.public-site main .product-source-hero+.product-complete-values article:nth-child(3):before{font-size:34px}.public-site main .product-source-hero+.product-complete-values article:after{display:none}.public-site main .product-source-hero+.product-complete-values span{color:#5918b9;font-size:24px!important;font-weight:500;line-height:49.6px!important;letter-spacing:-.03em;text-transform:capitalize}.public-site main .product-source-hero+.product-complete-values p{margin-top:28px;color:#111;font-size:16px!important;font-weight:400;line-height:24px!important;letter-spacing:0}

@media(max-width:900px){.public-site main .product-source-hero{grid-template-columns:minmax(0,1fr);grid-template-areas:"title" "eyebrow" "visual" "copy" "action";width:min(640px,calc(100% - 40px));padding:70px 0}.public-site main .product-source-hero h1{font-size:clamp(38px,10vw,49.6px);line-height:1}.public-site main .product-source-hero span{justify-self:start}.public-site main .product-source-hero>img,.public-site main .product-source-hero p{width:100%;margin:34px 0 0}.public-site main .product-source-hero .public-button{margin-top:22px}.public-site main .product-source-hero+.product-complete-values{grid-template-columns:1fr;width:min(420px,calc(100% - 40px))}.public-site main .product-source-hero+.product-complete-values article{width:100%}}

/* Keep the action in the description column: the reference places it above the gallery baseline. */
@media(min-width:901px){.public-site main .product-source-hero{grid-template-columns:542px 1fr!important;grid-template-areas:"title title" "eyebrow eyebrow" "visual copy"!important;gap:0!important;column-gap:40px!important}.public-site main .product-source-hero p{width:536.6px!important;margin-top:190.8px!important}.public-site main .product-source-hero>img{margin-top:195.9px!important}.public-site main .product-source-hero .public-button{grid-area:copy!important;margin-top:452.8px!important}.public-site main .product-source-hero+.product-complete-values{grid-template-columns:repeat(3,240px)!important;gap:20px!important;padding:0 0 95px!important}.public-site main .product-source-hero+.product-complete-values article{min-height:270.7px!important;height:270.7px!important}}

@media(min-width:901px){.public-site main .product-source-hero{padding-bottom:74px!important}.public-site main .product-source-hero+.product-complete-values{padding-bottom:48px!important}.public-site main .product-source-hero+.product-complete-values+.product-complete-specs{box-sizing:border-box;padding-left:64px!important;padding-right:64px!important}.public-site main .product-source-hero+.product-complete-values+.product-complete-specs h2{max-width:1152px!important;margin:.75rem 0 10px!important;font-size:32px!important;line-height:44.8px!important;letter-spacing:-.035em!important}.public-site main .product-source-hero+.product-complete-values+.product-complete-specs .product-spec-table{display:grid!important;grid-template-columns:1fr!important;width:1123.2px!important;max-width:calc(100% - 28.8px)!important;margin-left:14.4px!important;border-top:1px solid #cfc4e9!important}.public-site main .product-source-hero+.product-complete-values+.product-complete-specs .product-spec-table div{box-sizing:border-box;display:grid!important;grid-template-columns:1fr 1fr!important;align-items:center!important;min-height:55.3px!important;margin:0!important;padding:12px 0!important;border-bottom:1px solid #cfc4e9!important;color:#626262!important;font-size:15px!important;line-height:22.5px!important}.public-site main .product-source-hero+.product-complete-values+.product-complete-specs .product-spec-table b{font-size:15px!important;line-height:22.5px!important}}

@media(min-width:901px){.public-site main .product-source-hero+.product-complete-values+.product-complete-specs h2{width:1050px!important;max-width:1050px!important}.public-site main .product-source-hero+.product-complete-values+.product-complete-specs .product-spec-table div{min-height:52.55px!important}}

@media(min-width:901px){.public-site main .product-source-hero+.product-complete-values+.product-complete-specs{padding-bottom:31.2px!important}.public-site main .product-source-hero+.product-complete-values+.product-complete-specs h2{width:1152px!important;max-width:1152px!important}.public-site main .product-source-hero+.product-complete-values+.product-complete-specs h2:after{content:"";display:block;height:44.8px}}

/* NG-ULTRA has a shorter source introduction and a 26-row specification table. */
@media(min-width:901px){.public-site main .product-source-hero--ng-ultra{padding-bottom:76px!important}.public-site main .product-source-hero--ng-ultra>img{margin-top:179.8px!important}.public-site main .product-source-hero--ng-ultra .public-button{margin-top:371.8px!important}.public-site main .product-source-hero--ng-ultra+.product-complete-values+.product-complete-specs .product-spec-table div{min-height:51.2px!important}}

/* ULTRA300 follows the same frame but carries a different copy length. */
@media(min-width:901px){.public-site main .product-source-hero--ultra300>img{margin-top:182.8px!important}.public-site main .product-source-hero--ultra300 .public-button{margin-top:425.8px!important}}

@media(min-width:901px){.public-site main .product-source-hero--ultra300+.product-complete-values+.product-complete-specs{padding-bottom:35.5px!important}.public-site main .product-source-hero--ultra300+.product-complete-values+.product-complete-specs .product-spec-table div{min-height:52.84px!important}}

/* Radiation-hardened NG-MEDIUM uses the same WordPress product frame with a shorter introduction. */
@media(min-width:901px){.public-site main .product-source-hero--ng-medium-rh{padding-bottom:76px!important}.public-site main .product-source-hero--ng-medium-rh p{margin-top:189.8px!important}.public-site main .product-source-hero--ng-medium-rh>img{margin-top:179.8px!important}.public-site main .product-source-hero--ng-medium-rh .public-button{margin-top:344.8px!important}.public-site main .product-source-hero--ng-medium-rh+.product-complete-values+.product-complete-specs .product-spec-table div{min-height:51.5px!important}}

@media(min-width:901px){.public-site main .product-source-hero--ng-medium-rh+.product-complete-values+.product-complete-specs .product-spec-table div{min-height:50px!important}.public-site main .product-source-hero--ng-medium-rh+.product-complete-values+.product-complete-specs .product-spec-table div:first-child{min-height:61px!important}}

/* NG-ULTRA RH shares the shorter radiation-hardened hero cadence and 26-row table. */
@media(min-width:901px){.public-site main .product-source-hero--ng-ultra-rh{padding-bottom:76px!important}.public-site main .product-source-hero--ng-ultra-rh p{margin-top:189.8px!important}.public-site main .product-source-hero--ng-ultra-rh>img{margin-top:179.8px!important}.public-site main .product-source-hero--ng-ultra-rh .public-button{margin-top:344.8px!important}.public-site main .product-source-hero--ng-ultra-rh+.product-complete-values+.product-complete-specs .product-spec-table div{min-height:51.2px!important}}

@media(min-width:901px){.public-site main .product-source-hero--ultra300-rh{padding-bottom:76px!important}.public-site main .product-source-hero--ultra300-rh p{margin-top:189.8px!important}.public-site main .product-source-hero--ultra300-rh>img{margin-top:179.8px!important}.public-site main .product-source-hero--ultra300-rh .public-button{margin-top:317.8px!important}}

/* NX Design Suite: measured against /product/impulse/ at a 1280px viewport. */
@media(min-width:901px){
  .public-site main .product-source-hero--nx-design-suite h1{font-family:LiberationSans,Arial,sans-serif!important;font-weight:400!important;letter-spacing:normal!important}
  .public-site main .product-source-hero--nx-design-suite>img{width:560.9px!important;margin-top:179.8px!important;margin-left:-9px!important}
  .public-site main .product-source-hero--nx-design-suite p{width:551.1px!important;margin-top:190.8px!important;letter-spacing:normal!important}
  .public-site main .product-source-hero--nx-design-suite .public-button{width:243.6px!important;margin-top:452.8px!important;gap:12px!important}
  .public-site main .product-source-hero--nx-design-suite .public-button b{display:none!important}
  .public-site main .product-source-hero--nx-design-suite+.product-complete-specs{box-sizing:border-box;padding:88px 64px 40px!important;background:#fff!important}
  .public-site main .product-source-hero--nx-design-suite+.product-complete-specs>span{display:block!important;margin:0!important;text-align:center!important;color:#343434!important;font-size:16px!important;font-weight:400!important;line-height:18px!important;letter-spacing:0!important}
  .public-site main .product-source-hero--nx-design-suite+.product-complete-specs h2{max-width:1152px!important;margin:22.5px auto 0!important;color:#151428!important;font-family:LiberationSans,Arial,sans-serif!important;font-size:32px!important;font-weight:400!important;line-height:44.8px!important;letter-spacing:normal!important}
  .public-site main .product-source-hero--nx-design-suite~.ng-product-story{padding-top:20px!important;padding-bottom:30px!important}
  .public-site main .product-source-hero--nx-design-suite~.ng-product-story>div{font-family:-apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif!important;transform:translateX(60px)!important}
  .public-site main .product-source-hero--nx-design-suite~.ng-product-story span{margin-bottom:30px!important;letter-spacing:normal!important}
  .public-site main .product-source-hero--nx-design-suite~.ng-product-story li{letter-spacing:normal!important}
  .public-site main .product-source-hero--nx-design-suite~.ng-product-story figure{align-self:center!important;transform:translateY(7px)}
}

/* Current commercial product pages use a wide photo banner, followed by a gallery and copy.
   This intentionally keeps the source hierarchy without reproducing its WordPress mechanics. */
@media(min-width:901px){
  .public-site main .product-source-hero--ng-medium,.public-site main .product-source-hero--ng-ultra,.public-site main .product-source-hero--ultra300{position:relative!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;grid-template-areas:"title title" "visual copy" "visual action"!important;column-gap:48px!important;row-gap:0!important;width:100%!important;max-width:none!important;margin:0!important;padding:0 max(64px,calc((100vw - 1134px)/2)) 82px!important;background:#fff!important;color:#343434!important;overflow:visible}
  .public-site main .product-source-hero--ng-medium:before,.public-site main .product-source-hero--ng-ultra:before,.public-site main .product-source-hero--ultra300:before{position:absolute;z-index:0;top:0;right:0;left:0;height:325px;content:"";background-position:center;background-size:cover}
  .public-site main .product-source-hero--ng-medium:before{background-image:linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),url('/product-assets/ng-medium-commercial.png')}
  .public-site main .product-source-hero--ng-ultra:before{background-image:linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),url('/product-assets/ng-ultra-commercial.png')}
  .public-site main .product-source-hero--ultra300:before{background-image:linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),url('/product-assets/ultra300-commercial.png')}
  .public-site main .product-source-hero--ng-medium h1,.public-site main .product-source-hero--ng-ultra h1,.public-site main .product-source-hero--ultra300 h1{grid-area:title!important;z-index:1;display:flex!important;align-items:center!important;justify-content:center!important;height:325px!important;margin:0!important;color:#fff!important;font-family:LiberationSans,Arial,sans-serif!important;font-size:48px!important;font-weight:400!important;line-height:1!important;letter-spacing:normal!important;text-align:center}
  .public-site main .product-source-hero--ng-medium span,.public-site main .product-source-hero--ng-ultra span,.public-site main .product-source-hero--ultra300 span{position:absolute!important;z-index:1;top:226px;left:50%;width:max-content;max-width:calc(100% - 40px);margin:0!important;padding:4px 18px!important;border:1px solid rgba(255,255,255,.9);border-radius:999px;color:#fff!important;font-size:14px!important;font-weight:600!important;line-height:1.15!important;letter-spacing:0!important;transform:translateX(-50%);text-align:center}
  .public-site main .product-source-hero--ng-medium>img:not(.product-hero-architecture),.public-site main .product-source-hero--ng-ultra>img:not(.product-hero-architecture),.public-site main .product-source-hero--ultra300>img:not(.product-hero-architecture){grid-area:visual!important;align-self:start!important;width:100%!important;max-width:540px!important;height:auto!important;margin:60px 0 0!important;border-radius:0!important;background:#101010!important;box-shadow:none!important}
  .public-site main .product-source-hero--ng-medium p,.public-site main .product-source-hero--ng-ultra p,.public-site main .product-source-hero--ultra300 p{grid-area:copy!important;align-self:start!important;width:auto!important;margin:73px 0 0!important;color:#343434!important;font-size:18px!important;font-weight:400!important;line-height:1.52!important;letter-spacing:normal!important}
  .public-site main .product-source-hero--ng-medium .public-button,.public-site main .product-source-hero--ng-ultra .public-button,.public-site main .product-source-hero--ultra300 .public-button{grid-area:action!important;justify-self:start!important;align-self:start!important;min-height:50px!important;margin:18px 0 0!important;padding:12px 24px!important;border-color:#7045ca!important;background:#fff!important;color:#211540!important;font-size:16px!important;line-height:24px!important}
  .public-site main .product-source-hero .product-hero-architecture{position:absolute!important;z-index:2;grid-area:unset!important;align-self:auto!important;justify-self:auto!important;top:680px!important;left:max(64px,calc((100vw - 1134px)/2) + 28px);width:176px!important;height:auto!important;margin:0!important;border:0!important;border-radius:8px!important;background:#211540!important;box-shadow:0 12px 28px rgba(21,20,40,.22)!important;cursor:zoom-in!important}
  .public-site main .product-source-hero--ng-medium+.product-complete-values,.public-site main .product-source-hero--ng-ultra+.product-complete-values,.public-site main .product-source-hero--ultra300+.product-complete-values{padding-top:0!important}
}
@media(max-width:900px){
  .public-site main .product-source-hero--ng-medium,.public-site main .product-source-hero--ng-ultra,.public-site main .product-source-hero--ultra300{position:relative;padding-top:250px!important;background:#fff!important;overflow:visible}
  .public-site main .product-source-hero--ng-medium:before,.public-site main .product-source-hero--ng-ultra:before,.public-site main .product-source-hero--ultra300:before{position:absolute;top:0;right:calc((100% - 100vw)/2);left:calc((100% - 100vw)/2);height:250px;content:"";background-position:center;background-size:cover}
  .public-site main .product-source-hero--ng-medium:before{background-image:linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),url('/product-assets/ng-medium-commercial.png')}
  .public-site main .product-source-hero--ng-ultra:before{background-image:linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),url('/product-assets/ng-ultra-commercial.png')}
  .public-site main .product-source-hero--ultra300:before{background-image:linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),url('/product-assets/ultra300-commercial.png')}
  .public-site main .product-source-hero--ng-medium h1,.public-site main .product-source-hero--ng-ultra h1,.public-site main .product-source-hero--ultra300 h1{position:absolute;z-index:1;top:89px;right:0;left:0;margin:0!important;color:#fff!important;font-size:clamp(34px,10vw,48px)!important;text-align:center}
  .public-site main .product-source-hero--ng-medium span,.public-site main .product-source-hero--ng-ultra span,.public-site main .product-source-hero--ultra300 span{position:absolute;z-index:1;top:157px;left:50%;width:max-content;max-width:calc(100% - 40px);margin:0!important;padding:4px 15px!important;border:1px solid #fff;border-radius:999px;color:#fff!important;transform:translateX(-50%);text-align:center}
  .public-site main .product-source-hero .product-hero-architecture{width:132px!important;margin-top:-65px!important;margin-left:18px!important;border-radius:7px!important;box-shadow:0 10px 22px rgba(21,20,40,.22);cursor:zoom-in}
}
