/* Locked-reference desktop scaling.
   The approved composition is 1536x1024. These overrides preserve those exact
   section proportions on laptop/desktop widths instead of cropping the right
   hero panel or letting fixed pixel heights distort the page. Loaded last. */

@media (min-width:981px){
  html,body{margin:0!important;padding:0!important;background:#07070b!important}
  .lux-home{width:100%!important;max-width:none!important;min-height:0!important;overflow-x:hidden!important}

  /* 82 / 530 / 183 / 229 = 1024px at the 1536px reference width. */
  .lux-nav{height:5.3385417vw!important;min-height:5.3385417vw!important;padding:0 5vw 0 2.2786458vw!important;grid-template-columns:20.8333333vw minmax(0,1fr) 13.4114583vw!important}
  .lux-brand{width:20.8333333vw!important;height:5.3385417vw!important}
  .brand-image{width:19.53125vw!important;height:4.296875vw!important;max-width:none!important}
  .lux-nav nav{gap:2.9947917vw!important}
  .lux-nav nav a{font-size:.5859375vw!important;letter-spacing:.18em!important}
  .lux-nav nav a.nav-active:after{bottom:-1.953125vw!important;width:1.8229167vw!important;height:.1302083vw!important}
  .lux-build{height:2.734375vw!important;border-radius:1.5625vw!important;gap:.8463542vw!important;font-size:.5859375vw!important;letter-spacing:.18em!important}
  .lux-build span{font-size:.9765625vw!important}

  .lux-hero,.lux-hero-copy,.lux-hero-art{height:34.5052083vw!important;min-height:34.5052083vw!important}
  .lux-hero{grid-template-columns:53.7% 46.3%!important}
  .office-reference-image,.hero-reference-image{width:100%!important;height:100%!important;min-height:0!important;object-fit:cover!important;object-position:center center!important}
  .hero-copy-content{padding:5.2083333vw 8% 2.6041667vw!important}
  .lux-kicker{font-size:.6510417vw!important;letter-spacing:.38em!important}
  .lux-hero h1{margin:.9765625vw 0 1.3020833vw!important;width:78.125%!important;font-size:7.03125vw!important;line-height:.84!important;transform:scaleX(1.28)!important;transform-origin:left center!important}
  .lux-lede{max-width:30.5989583vw!important;font-size:1.0416667vw!important;line-height:1.6!important}
  .lux-actions{gap:1.1067708vw!important;margin-top:1.3020833vw!important}
  .lux-primary,.lux-secondary{height:2.9947917vw!important;font-size:.5859375vw!important;border-radius:.3255208vw!important}
  .lux-primary{min-width:17.0572917vw!important;padding:0 1.2369792vw!important}
  .lux-primary span{margin-left:1.0416667vw!important;font-size:1.0416667vw!important}
  .lux-secondary{min-width:12.109375vw!important;gap:.6510417vw!important}
  .mission-icon{width:1.8229167vw!important;height:1.8229167vw!important;margin-left:.390625vw!important;font-size:.4557292vw!important}

  .lux-companies{height:11.9140625vw!important;min-height:11.9140625vw!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.9114583vw!important;padding:0 2.2786458vw 1.6927083vw!important}
  .company-card{height:10.2213542vw!important;min-height:10.2213542vw!important;border-radius:.6510417vw!important}
  .company-logo{left:1.5625vw!important;top:1.0416667vw!important}
  .safeway-logo,.adngen-logo{width:4.8177083vw!important;height:5.7291667vw!important}
  .synthetic-logo{width:5.3385417vw!important;height:6.1197917vw!important;top:.78125vw!important}
  .company-copy{top:1.8229167vw!important}
  .safeway .company-copy{left:6.1848958vw!important}.adngen .company-copy{left:6.9010417vw!important}.synthetic .company-copy{left:7.3567708vw!important;top:1.6276042vw!important}
  .safeway h2{font-size:1.2369792vw!important}.adngen h2{font-size:1.8880208vw!important}.synthetic h2{font-size:1.6276042vw!important}
  .company-subbrand{margin-bottom:.5208333vw!important;font-size:.5208333vw!important}.company-tagline{font-size:.4557292vw!important}
  .company-description{left:1.8880208vw!important;bottom:1.3020833vw!important;max-width:15.9505208vw!important;font-size:.78125vw!important;line-height:1.45!important}
  .company-card .card-scene{top:0!important;left:auto!important;right:0!important;width:47%!important;height:100%!important;object-fit:cover!important;opacity:1!important}
  .company-arrow{right:1.3020833vw!important;width:2.34375vw!important;height:2.34375vw!important;font-size:.9765625vw!important}

  .lux-about{height:14.9088542vw!important;min-height:14.9088542vw!important;grid-template-columns:430fr 609fr 356fr!important;gap:1.7578125vw!important;padding:0 2.734375vw 1.3020833vw 2.8645833vw!important}
  .about-head,.about-body{padding-top:.3255208vw!important}
  .about-head>p{margin:0 0 .4557292vw!important;font-size:.5208333vw!important;letter-spacing:.4em!important}
  .about-head h2{font-size:3.6458333vw!important;line-height:.91!important}
  .about-body>p{margin:.78125vw 0 0!important;max-width:30.5989583vw!important;font-size:.78125vw!important;line-height:1.65!important}
  .capability-row{gap:.5208333vw!important;margin-top:2.6041667vw!important}
  .capability-row>div{gap:.3255208vw!important}
  .capability-icon{width:2.9296875vw!important;height:2.9296875vw!important;flex-basis:2.9296875vw!important}
  .capability-row strong{font-size:.390625vw!important;max-width:5.859375vw!important}
  .vision-card{height:12.3697917vw!important;min-height:12.3697917vw!important;border-radius:.5859375vw!important}
  .vision-globe{top:0!important;right:0!important;width:64%!important;height:100%!important;object-fit:cover!important;transform:none!important}
  .vision-copy{left:2.2135417vw!important;top:2.6041667vw!important;bottom:2.2786458vw!important}
  .vision-copy p{font-size:.8463542vw!important;line-height:1.45!important;letter-spacing:.20em!important}
  .vision-copy>span{width:10.4166667vw!important;height:2.34375vw!important;border-radius:1.3020833vw!important;font-size:.5208333vw!important}

  /* Do not let the previous laptop-specific rules shrink/crop the reference layout. */
  .hero-reference-image{background:#0a080d!important}
}

/* Compact desktop keeps the exact visual hierarchy, just with slightly safer nav spacing. */
@media (min-width:981px) and (max-width:1180px){
  .lux-nav nav{gap:1.15vw!important}
  .lux-nav nav a{font-size:.56vw!important;letter-spacing:.12em!important}
  .lux-build{font-size:.54vw!important}
  .lux-hero h1{transform:scaleX(1.20)!important;width:83%!important}
  .hero-copy-content{padding-left:6.4%!important;padding-right:5.5%!important}
}

/* Final visual QA corrections — keep these last. */

/* The recovered hero-right artwork already contains the full industry rail and neon line.
   Hide the duplicate rail that was temporarily added as live HTML. */
.hero-rail{display:none!important}

/* The business scenes were correct files but inherited left:0 from an older stylesheet,
   which placed them underneath the copy/gradient. Keep the imagery on the RIGHT like the reference. */
.company-card .card-scene{
  left:auto!important;
  right:0!important;
  z-index:0!important;
  opacity:1!important;
  filter:brightness(1.10) saturate(1.09) contrast(1.02)!important;
}
.company-card::after{z-index:1!important}
.company-logo,.company-copy,.company-description,.company-arrow{z-index:2!important}

/* Let more of the premium office scene read through the copy while preserving contrast. */
.office-reference-image{
  filter:brightness(1.08) saturate(1.07) contrast(1.01)!important;
}
.hero-reference-image{
  filter:brightness(1.035) saturate(1.06) contrast(1.015)!important;
}
.hero-copy-shade{
  background:
    linear-gradient(90deg,rgba(4,4,9,.69) 0%,rgba(5,4,10,.53) 39%,rgba(8,5,13,.24) 72%,rgba(11,6,17,.07) 100%),
    radial-gradient(circle at 18% 74%,rgba(164,68,217,.16),transparent 30%)!important;
}

/* Visible but restrained ambient movement. Entrance motion alone was too quick to notice. */
@keyframes ngenAmbientSweep{
  0%{transform:translate3d(-32%,0,0);opacity:.18}
  45%{opacity:.60}
  100%{transform:translate3d(32%,0,0);opacity:.30}
}
@keyframes ngenSceneBreath{
  0%,100%{transform:scale(1.00);filter:brightness(1.08) saturate(1.07) contrast(1.02)}
  50%{transform:scale(1.035);filter:brightness(1.18) saturate(1.14) contrast(1.025)}
}
@keyframes ngenBorderPulse{
  0%,100%{box-shadow:0 0 0 rgba(185,83,240,0),inset 0 0 0 rgba(192,96,244,0)}
  50%{box-shadow:0 0 18px rgba(185,83,240,.11),inset 0 0 16px rgba(192,96,244,.04)}
}
@keyframes ngenShadeBreathe{
  0%,100%{opacity:.92}
  50%{opacity:1}
}

.lux-hero-art{position:relative!important;overflow:hidden!important}
.lux-hero-art::after{
  content:""!important;
  position:absolute!important;
  inset:-8% -30%!important;
  z-index:1!important;
  pointer-events:none!important;
  background:linear-gradient(108deg,transparent 28%,rgba(178,74,234,.03) 43%,rgba(222,157,255,.14) 50%,rgba(172,67,230,.04) 58%,transparent 72%)!important;
}

@media (prefers-reduced-motion:no-preference){
  .lux-hero-art::after{animation:ngenAmbientSweep 7.5s ease-in-out infinite alternate!important}
  .hero-copy-shade{animation:ngenShadeBreathe 5.5s ease-in-out infinite!important}
  .company-card{animation:ngenBorderPulse 6.8s ease-in-out infinite!important}
  .company-card:nth-child(2){animation-delay:1.1s!important}
  .company-card:nth-child(3){animation-delay:2.2s!important}
  .company-card .card-scene{animation:ngenSceneBreath 9s ease-in-out infinite!important;transform-origin:center center!important}
  .company-card:nth-child(2) .card-scene{animation-delay:1.6s!important}
  .company-card:nth-child(3) .card-scene{animation-delay:3.2s!important}
}

@media(max-width:980px){
  .company-card .card-scene{left:auto!important;right:0!important}
  .hero-copy-shade{
    background:linear-gradient(90deg,rgba(4,4,9,.68),rgba(6,4,11,.45) 58%,rgba(10,6,16,.16))!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .lux-hero-art::after,.hero-copy-shade,.company-card,.company-card .card-scene{animation:none!important}
}

/* READABILITY + MOBILE FIT PASS — user QA 2026-10-06. */
@media(min-width:981px){
  /* Keep the approved composition but stop making supporting copy microscopic. */
  .lux-nav nav a{font-size:clamp(10px,.68vw,11px)!important}
  .lux-build{font-size:clamp(9px,.64vw,10px)!important}
  .lux-kicker{font-size:clamp(10px,.72vw,11px)!important}
  .lux-primary,.lux-secondary{font-size:clamp(9px,.64vw,10px)!important}
  .company-subbrand{font-size:clamp(8px,.56vw,9px)!important}
  .company-tagline{font-size:clamp(7.5px,.52vw,8.5px)!important;letter-spacing:.16em!important}
  .company-description{font-size:clamp(12px,.84vw,13.5px)!important;line-height:1.45!important;max-width:16.9vw!important}
  .about-head>p{font-size:clamp(8.5px,.60vw,9.5px)!important}
  .about-body>p{font-size:clamp(12.5px,.88vw,14px)!important;line-height:1.58!important}
  .capability-row strong{font-size:clamp(7.5px,.52vw,8.5px)!important;line-height:1.22!important;max-width:6.6vw!important}
  .vision-copy p{font-size:clamp(12px,.88vw,14px)!important;letter-spacing:.16em!important}
  .vision-copy>span{font-size:clamp(8px,.56vw,9px)!important}
}

@media(max-width:620px){
  /* On phones, the right hero artwork is a compact branded panel instead of a giant full-screen wall. */
  .lux-hero-copy{height:auto!important;min-height:470px!important}
  .hero-copy-content{padding:42px 22px 32px!important}
  .lux-kicker{font-size:9px!important;line-height:1.45!important}
  .lux-hero h1{font-size:clamp(43px,13.5vw,54px)!important;line-height:.90!important;margin:16px 0 18px!important;letter-spacing:-.035em!important}
  .lux-lede{font-size:14px!important;line-height:1.55!important}
  .lux-actions{margin-top:18px!important}

  .lux-hero-art{height:285px!important;min-height:285px!important;border-top:1px solid rgba(110,75,126,.46)!important}
  .hero-reference-image{width:100%!important;height:100%!important;object-fit:cover!important;object-position:50% 46%!important}
  .lux-hero-art::after{inset:-12% -45%!important;opacity:.68!important}

  .lux-companies{padding-top:12px!important}
  .company-card{height:176px!important;min-height:176px!important}
  .company-copy{top:24px!important}
  .company-description{font-size:11.5px!important;line-height:1.45!important;max-width:230px!important}
  .company-tagline{font-size:7.5px!important;line-height:1.35!important}
  .company-subbrand{font-size:8px!important}
  .company-card .card-scene{width:49%!important;opacity:.92!important}

  .about-body>p{font-size:13px!important;line-height:1.58!important}
  .capability-row strong{font-size:8px!important;line-height:1.25!important;max-width:120px!important}
  .vision-copy p{font-size:12px!important;line-height:1.45!important}
}
