/* ═══════════════════════════════════════════
   V8 — Luxury animated premium layer
   ═══════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500&family=Outfit:wght@400;500;600;700;800;900&display=swap');

:root{
  --font-display:'Cormorant Garamond',Georgia,serif;
  --font-body:'Outfit',Inter,system-ui,sans-serif;
  --gold-shine:linear-gradient(105deg,#fff6d0 0%,#ffc72c 35%,#ffdf80 55%,#c8960a 100%);
  --glass:rgba(255,255,255,.06);
  --glass-border:rgba(255,255,255,.14);
}

body{font-family:var(--font-body)}
h1,h2,h3,.logo-text,.eyebrow{font-family:var(--font-body)}
.hero-copy h1,.page-hero h1,.laptop-explorer-head h2,.section-head h2{
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:-.03em;
}

/* Shimmer gold headline */
.hero-copy h1,.page-hero h1{
  background:var(--gold-shine);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:headlineShimmer 6s ease-in-out infinite;
}
@keyframes headlineShimmer{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.18)}
}

/* Cursor spotlight */
.cursor-glow{
  position:fixed;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,199,44,.09),transparent 68%);
  pointer-events:none;z-index:9998;transform:translate(-50%,-50%);
  transition:opacity .35s;opacity:0;mix-blend-mode:screen;
}
body.has-cursor-glow .cursor-glow{opacity:1}

/* Premium header */
.site-header{
  background:rgba(5,6,9,.72)!important;
  backdrop-filter:blur(24px) saturate(1.4)!important;
  border-bottom:1px solid rgba(255,199,44,.12)!important;
  transition:box-shadow .3s,background .3s;
}
.site-header.scrolled{
  box-shadow:0 12px 48px rgba(0,0,0,.45),0 0 0 1px rgba(255,199,44,.08);
  background:rgba(4,5,8,.88)!important;
}
.logo-mark{
  animation:logoPulse 4s ease-in-out infinite;
}
@keyframes logoPulse{
  0%,100%{box-shadow:0 0 44px rgba(255,199,44,.28)}
  50%{box-shadow:0 0 60px rgba(255,199,44,.48),0 0 20px rgba(255,199,44,.2)}
}

/* Buttons — luxury ripple */
.btn{position:relative;overflow:hidden}
.btn-primary::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);
  transform:translateX(-120%);transition:none;
}
.btn-primary:hover::after{animation:btnShine .65s ease}
@keyframes btnShine{to{transform:translateX(120%)}}

/* Hero premium */
.hero-rich{padding-bottom:40px}
.visual-pro{
  border-color:rgba(255,199,44,.22)!important;
  box-shadow:0 40px 120px rgba(0,0,0,.6),0 0 80px rgba(255,199,44,.08)!important;
}
.mini-service{
  backdrop-filter:blur(12px);
  animation:cardFloat 6s ease-in-out infinite;
}
.mini-service:nth-child(2){animation-delay:-1.5s}
.mini-service:nth-child(3){animation-delay:-3s}
.mini-service:nth-child(4){animation-delay:-4.5s}
@keyframes cardFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}

/* Product cards — photo shine */
.product-card,.shop-card,.review-card{
  backdrop-filter:blur(8px);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s!important;
}
.product-card:hover,.shop-card:hover{
  box-shadow:0 32px 90px rgba(0,0,0,.42),0 0 50px rgba(255,199,44,.1)!important;
}

/* Reveal stagger */
.reveal{transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1)}
.reveal.visible{animation:none}
.stagger-item{
  opacity:0;transform:translateY(28px) scale(.97);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);
}
.stagger-item.visible{opacity:1;transform:none}

/* ═══ Laptop explorer — photo cards ═══ */
.laptop-explorer{
  border-color:rgba(255,199,44,.18)!important;
  box-shadow:0 40px 120px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.laptop-explorer:after{
  animation:explorerGlow 8s ease-in-out infinite!important;
}
@keyframes explorerGlow{
  0%,100%{opacity:.6}
  50%{opacity:1}
}

.brand-models-panel{
  border-color:rgba(255,199,44,.15)!important;
}

/* Brand hero banner with photo */
.brand-hero-photo{
  position:relative;margin:-4px 0 20px;border-radius:22px;overflow:hidden;
  height:180px;border:1px solid rgba(255,199,44,.2);
  box-shadow:0 24px 70px rgba(0,0,0,.4);
}
.brand-hero-photo img{
  width:100%;height:100%;object-fit:cover;object-position:center;
  transform:scale(1.06);transition:transform 8s ease;
  animation:kenBurns 14s ease-in-out infinite alternate;
}
.brand-hero-photo:hover img{transform:scale(1.12)}
@keyframes kenBurns{
  0%{transform:scale(1.04) translate(0,0)}
  100%{transform:scale(1.1) translate(-1%,-1%)}
}
.brand-hero-photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(5,7,12,.88) 0%,rgba(5,7,12,.45) 45%,rgba(5,7,12,.15) 100%);
}
.brand-hero-photo::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,transparent 60%,rgba(5,7,12,.7));
  pointer-events:none;
}
.brand-hero-label{
  position:absolute;left:24px;bottom:20px;z-index:2;
  font-family:var(--font-display);font-size:clamp(28px,4vw,42px);font-weight:700;
  color:#fff;letter-spacing:-.03em;text-shadow:0 4px 24px rgba(0,0,0,.5);
}
.brand-hero-label small{
  display:block;font-family:var(--font-body);font-size:12px;font-weight:700;
  color:var(--gold);text-transform:uppercase;letter-spacing:.16em;margin-bottom:4px;
}

/* Series card with real photo */
.series-card.model-card{
  min-height:380px!important;padding:0!important;
  display:flex;flex-direction:column;
  transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,border-color .4s!important;
}
.series-card.model-card:hover{
  transform:translateY(-10px) scale(1.01)!important;
  box-shadow:0 36px 100px rgba(0,0,0,.5),0 0 60px rgba(255,199,44,.12)!important;
}
.series-card.model-card:after{display:none!important}

.series-photo-wrap{
  position:relative;height:190px;overflow:hidden;flex-shrink:0;
  border-radius:26px 26px 0 0;
}
.series-photo-wrap::before{
  content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,transparent 35%,rgba(5,7,12,.75) 100%);
  pointer-events:none;
}
.series-photo-wrap::after{
  content:"";position:absolute;inset:0;z-index:3;
  background:linear-gradient(135deg,rgba(255,199,44,.12),transparent 50%);
  opacity:0;transition:opacity .35s;
}
.series-card.model-card:hover .series-photo-wrap::after{opacity:1}

.series-photo{
  width:100%;height:100%;object-fit:cover;object-position:center;
  display:block;transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .5s;
  filter:saturate(.92) brightness(.88);
}
.series-card.model-card:hover .series-photo{
  transform:scale(1.08);
  filter:saturate(1.05) brightness(.95);
}

.series-photo-shine{
  position:absolute;top:0;left:-80%;width:50%;height:100%;z-index:4;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);
  transform:skewX(-20deg);
  animation:photoShine 5s ease-in-out infinite;
  pointer-events:none;
}
.series-card.model-card:nth-child(3n) .series-photo-shine{animation-delay:-1.6s}
.series-card.model-card:nth-child(3n+1) .series-photo-shine{animation-delay:-3.2s}
@keyframes photoShine{
  0%,40%{left:-80%;opacity:0}
  55%{opacity:1}
  100%{left:140%;opacity:0}
}

.series-card-body{
  position:relative;padding:16px 18px 20px;flex:1;
  display:flex;flex-direction:column;
}
.series-card.model-card .series-brand-logo{
  top:14px!important;right:14px!important;
  backdrop-filter:blur(12px)!important;
  background:rgba(8,10,14,.75)!important;
  border:1px solid rgba(255,199,44,.25)!important;
}
.series-card.model-card .series-tag{
  position:absolute;top:14px;left:14px;z-index:5;
  padding:6px 10px;border-radius:999px;
  background:rgba(5,7,12,.72);backdrop-filter:blur(8px);
  border:1px solid rgba(255,199,44,.3);color:var(--gold);
  font-size:11px;font-weight:900;letter-spacing:.08em;
}
.series-card.model-card h4{
  margin-top:0!important;font-size:19px!important;
  font-family:var(--font-display);font-weight:700;
}
.series-card.model-card p{margin-bottom:12px!important;flex:1}
.series-card.model-card a{
  color:var(--gold)!important;font-weight:900!important;
  display:inline-flex;align-items:center;gap:6px;
  transition:gap .25s,transform .25s;
}
.series-card.model-card a:hover{gap:10px;transform:translateX(4px)}

/* Hide old CSS device mockups when photo mode active */
.series-card.model-card .series-device{display:none!important}

/* Brand tiles — premium glow */
.brand-card.logo-tile{
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s!important;
}
.brand-card.logo-tile:hover,.brand-card.logo-tile.active{
  transform:translateY(-8px) scale(1.02)!important;
}

/* Filter bar animation */
.filter-btn{transition:all .3s cubic-bezier(.2,.8,.2,1)!important}
.filter-btn.active{
  box-shadow:0 8px 28px rgba(255,199,44,.35)!important;
  transform:translateY(-2px);
}

/* Why band — animated gradient */
.why-band{
  background-size:200% 200%!important;
  animation:bandShift 10s ease infinite!important;
}
@keyframes bandShift{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

/* Footer luxury line */
.footer{
  position:relative;
}
.footer::before{
  content:"";position:absolute;top:0;left:10%;right:10%;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  opacity:.35;
}

/* Page load fade */
body{animation:pageIn .6s ease}
@keyframes pageIn{
  from{opacity:0}
  to{opacity:1}
}

/* Parallax hero visual */
.visual-pro,.page-visual{will-change:transform}

@media(max-width:900px){
  .brand-hero-photo{height:140px}
  .series-photo-wrap{height:160px}
  .series-card.model-card{min-height:340px!important}
  .cursor-glow{display:none}
}
@media(max-width:560px){
  .brand-hero-photo{height:120px;border-radius:18px}
  .series-photo-wrap{height:150px;border-radius:22px 22px 0 0}
  .series-card.model-card{min-height:320px!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .cursor-glow{display:none!important}
}


/* v13: real/generated photo cards on the home page */
.product-preview .product-card{
  display:flex;
  flex-direction:column;
}
.home-photo-art{
  padding:0!important;
  background:#0b0f17!important;
  position:relative;
  overflow:hidden;
  min-height:205px;
}
.home-photo-art img{
  width:100%;
  height:100%;
  min-height:205px;
  object-fit:cover;
  display:block;
  transform:scale(1.035);
  filter:saturate(1.08) contrast(1.06) brightness(.84);
  transition:transform .8s cubic-bezier(.2,.7,.2,1), filter .35s ease;
}
.home-photo-art:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:
    linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.38)),
    radial-gradient(circle at 18% 10%,rgba(255,199,44,.28),transparent 36%),
    radial-gradient(circle at 84% 18%,rgba(23,166,255,.20),transparent 35%);
  pointer-events:none;
}
.home-photo-art:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.20) 48%,transparent 58%);
  background-size:30px 30px,30px 30px,220% 100%;
  mix-blend-mode:screen;
  opacity:.58;
  pointer-events:none;
  animation:homePhotoShine 5.5s ease-in-out infinite;
}
.product-card:hover .home-photo-art img{
  transform:scale(1.105);
  filter:saturate(1.18) contrast(1.1) brightness(.95);
}
@keyframes homePhotoShine{
  0%{background-position:0 0,0 0,180% 0}
  55%{background-position:0 0,0 0,-80% 0}
  100%{background-position:0 0,0 0,-80% 0}
}
@media(max-width:760px){
  .home-photo-art,.home-photo-art img{min-height:190px}
}


/* v15: realistic photo hero for catalog page */
.catalog-real-visual{
  min-height:320px;
  padding:0;
  border-radius:34px;
  overflow:hidden;
  position:relative;
  background:#090c13;
  border:1px solid rgba(255,199,44,.25);
  box-shadow:0 34px 100px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.05) inset;
}
.catalog-real-visual img{
  width:100%;
  height:100%;
  min-height:320px;
  object-fit:cover;
  display:block;
  transform:scale(1.035);
  filter:saturate(1.08) contrast(1.08) brightness(.86);
  animation:catalogRealFloat 8s ease-in-out infinite;
}
.catalog-real-visual:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:
    linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.38)),
    radial-gradient(circle at 18% 12%,rgba(255,199,44,.24),transparent 34%),
    radial-gradient(circle at 78% 18%,rgba(23,166,255,.20),transparent 36%);
  pointer-events:none;
}
.catalog-real-visual:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(112deg,transparent 0 38%,rgba(255,255,255,.20) 48%,transparent 58%);
  background-size:32px 32px,32px 32px,220% 100%;
  mix-blend-mode:screen;
  opacity:.58;
  animation:catalogHeroShine 5.8s ease-in-out infinite;
  pointer-events:none;
}
.catalog-photo-glow{
  position:absolute;
  z-index:4;
  left:8%;
  right:8%;
  bottom:22px;
  height:4px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--gold),rgba(23,166,255,.9),transparent);
  filter:blur(.2px);
  opacity:.75;
  animation:catalogLinePulse 2.8s ease-in-out infinite;
}
@keyframes catalogRealFloat{
  0%,100%{transform:scale(1.035) translate3d(0,0,0)}
  50%{transform:scale(1.075) translate3d(-8px,-4px,0)}
}
@keyframes catalogHeroShine{
  0%{background-position:0 0,0 0,180% 0}
  55%{background-position:0 0,0 0,-80% 0}
  100%{background-position:0 0,0 0,-80% 0}
}
@keyframes catalogLinePulse{
  0%,100%{opacity:.45;transform:scaleX(.86)}
  50%{opacity:.95;transform:scaleX(1)}
}
@media(max-width:760px){
  .catalog-real-visual,.catalog-real-visual img{min-height:235px}
}


/* v16: realistic photo hero block on home page */
.hero-real-photo{
  height:500px;
  border-radius:36px;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,199,44,.24);
  background:#080b12;
  box-shadow:0 34px 110px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.08);
  isolation:isolate;
}
.hero-real-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.005);
  filter:saturate(1.1) contrast(1.08) brightness(.88);
  animation:heroRealMove 8.5s ease-in-out infinite;
}
.hero-real-photo:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.30)),
    radial-gradient(circle at 18% 14%,rgba(255,199,44,.25),transparent 34%),
    radial-gradient(circle at 78% 18%,rgba(23,166,255,.20),transparent 36%);
}
.hero-real-photo:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.20) 48%,transparent 58%);
  background-size:32px 32px,32px 32px,230% 100%;
  mix-blend-mode:screen;
  opacity:.56;
  animation:heroRealShine 5.8s ease-in-out infinite;
}
.hero-real-glow{
  position:absolute;
  z-index:4;
  inset:auto 8% 28px 8%;
  height:5px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--gold),rgba(23,166,255,.95),transparent);
  opacity:.76;
  animation:heroRealLine 2.7s ease-in-out infinite;
}
.hero-real-line{
  position:absolute;
  z-index:5;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,199,44,.9),rgba(23,166,255,.7),transparent);
  opacity:0;
  animation:heroRealScan 4.6s ease-in-out infinite;
}
.hero-real-photo:hover img{
  animation-play-state:paused;
  transform:scale(1.025);
}
@keyframes heroRealMove{
  0%,100%{transform:scale(1.005) translate3d(0,0,0)}
  50%{transform:scale(1.02) translate3d(-3px,-2px,0)}
}
@keyframes heroRealShine{
  0%{background-position:0 0,0 0,180% 0}
  55%{background-position:0 0,0 0,-80% 0}
  100%{background-position:0 0,0 0,-80% 0}
}
@keyframes heroRealLine{
  0%,100%{opacity:.42;transform:scaleX(.86)}
  50%{opacity:.96;transform:scaleX(1)}
}
@keyframes heroRealScan{
  0%{opacity:0;transform:translateY(0)}
  12%,70%{opacity:.65}
  100%{opacity:0;transform:translateY(500px)}
}
@media(max-width:1050px){
  .hero-real-photo{height:430px}
}
@media(max-width:760px){
  .hero-real-photo{height:330px;border-radius:26px}
}
@media(max-width:460px){
  .hero-real-photo{height:280px}
}


/* v17: real lineup photos from official/external URLs */
.series-photo.exact-series-photo{
  background:#0b0f17;
  object-fit:contain;
  padding:10px;
}
.series-photo-wrap{
  background:radial-gradient(circle at 30% 20%,rgba(255,199,44,.18),transparent 34%),#0b0f17;
}
.series-card.model-card:hover .series-photo.exact-series-photo{
  transform:scale(1.045);
}


/* v18: hide lineup numbering badges near laptop series photos */
.series-card.model-card .series-tag{
  display:none !important;
}


/* v19: HP exact photos - better fit for transparent official product images */
.series-photo-wrap{
  background:
    radial-gradient(circle at 18% 20%, rgba(255,199,44,.20), transparent 34%),
    radial-gradient(circle at 82% 26%, rgba(23,166,255,.18), transparent 36%),
    linear-gradient(145deg,#111722,#07090e 70%);
}
.series-photo.exact-series-photo{
  object-fit:cover;
  background:#080b12;
}
.series-photo[src*="hp.widen.net"],
.series-photo[src*="content/dam"],
.series-photo[src*="kim-test"]{
  object-fit:contain;
  padding:14px;
  background:
    radial-gradient(circle at 30% 28%, rgba(255,199,44,.16), transparent 34%),
    radial-gradient(circle at 70% 35%, rgba(23,166,255,.14), transparent 36%),
    #070a10;
}


/* v20: laptop lineup photos */
.series-photo.exact-series-photo{
  object-fit:cover;
  background:#070a10;
}
.series-photo[src*="hp.widen.net"],
.series-photo[src*="probooks_new_v2"],
.series-photo[src*="static.pub"]{
  object-fit:contain;
  padding:12px;
  background:
    radial-gradient(circle at 30% 28%, rgba(255,199,44,.16), transparent 34%),
    radial-gradient(circle at 70% 35%, rgba(23,166,255,.14), transparent 36%),
    #070a10;
}


/* v21: HP official-domain lineup photos */
.series-photo[src*="hp.widen.net"],
.series-photo[src*="www.hp.com/content/dam"]{
  object-fit:contain !important;
  padding:12px;
  background:
    radial-gradient(circle at 30% 28%, rgba(255,199,44,.18), transparent 34%),
    radial-gradient(circle at 72% 35%, rgba(23,166,255,.16), transparent 38%),
    #070a10;
}
.series-photo[src*="omen-max"]{
  object-fit:cover !important;
  padding:0;
}


/* v22: official-site photo mode + uploaded ASUS Zenbook image */
.series-photo[src*="assets/img/official/asus/asus-zenbook.png"]{
  object-fit:cover !important;
  padding:0 !important;
  background:#050505;
  filter:saturate(1.08) contrast(1.08) brightness(.92);
}
.series-photo[src*="tse1.mm.bing.net"]{
  object-fit:cover;
  padding:0;
  background:#070a10;
}


/* v23: simplified approved brand structure */
.series-photo[src*="assets/img/official/asus/asus-zenbook.png"]{
  object-fit:cover !important;
  padding:0 !important;
  background:#050505;
}
.series-photo[src*="tse1.mm.bing.net"]{
  object-fit:cover;
  padding:0;
  background:#070a10;
}
.series-photo[src*="hp.widen.net"],
.series-photo[src*="www.hp.com/content/dam"]{
  object-fit:contain !important;
  padding:12px;
  background:
    radial-gradient(circle at 30% 28%, rgba(255,199,44,.18), transparent 34%),
    radial-gradient(circle at 72% 35%, rgba(23,166,255,.16), transparent 38%),
    #070a10;
}
.series-photo[src*="omen-max"]{
  object-fit:cover !important;
  padding:0 !important;
}


/* v24: selected brand hero background must follow selected brand */
.brand-hero-photo{
  position:relative;
  overflow:hidden;
}
.brand-hero-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform:scale(1.03);
  filter:saturate(1.05) contrast(1.08) brightness(.82);
  transition:opacity .28s ease, transform .7s ease, filter .3s ease;
  animation:brandHeroFloat 7s ease-in-out infinite;
}
.brand-hero-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.45)),
    radial-gradient(circle at 18% 16%,rgba(255,199,44,.22),transparent 34%),
    radial-gradient(circle at 82% 20%,rgba(23,166,255,.18),transparent 38%);
  pointer-events:none;
}
@keyframes brandHeroFloat{
  0%,100%{transform:scale(1.03) translate3d(0,0,0)}
  50%{transform:scale(1.07) translate3d(-8px,-4px,0)}
}
.brand-hero-label{
  position:absolute;
  left:28px;
  bottom:24px;
  z-index:2;
}


/* v25: locally generated corrected lineup photos */
.series-photo[src*="assets/img/generated-lineups/"]{
  object-fit:cover !important;
  padding:0 !important;
  background:#070a10;
  filter:saturate(1.08) contrast(1.08) brightness(.9);
}


/* v26: corrected real lineup photos from internet/official-domain image queries */
.series-photo[src*="tse1.mm.bing.net"]{
  object-fit:cover !important;
  padding:0 !important;
  background:#070a10;
  filter:saturate(1.08) contrast(1.08) brightness(.9);
}


/* v27: laptop lineup market price */
.lineup-price{
  display:inline-flex;
  align-items:center;
  width:max-content;
  margin:0 0 18px;
  padding:9px 13px;
  border-radius:999px;
  color:#111;
  font-weight:900;
  letter-spacing:.01em;
  background:linear-gradient(135deg,#ffd766,#ffb51f);
  box-shadow:0 12px 28px rgba(255,199,44,.20), inset 0 1px 0 rgba(255,255,255,.55);
}
.series-card.model-card p{
  margin-bottom:12px!important;
}


/* v29: build configurator expanded CPU/GPU lists */
.build-modal select optgroup{
  background:#111722;
  color:#ffc72c;
  font-weight:800;
}
.build-modal select option{
  background:#111722;
  color:#fff;
}


/* v30: network equipment only block */
.network-only-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.switch-art,
.nvr-art,
.cable-art,
.ap-art{
  position:relative;
  overflow:hidden;
}
.switch-art:before,
.nvr-art:before,
.cable-art:before,
.ap-art:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.035) 1px,transparent 1px),
    radial-gradient(circle at 24% 22%,rgba(255,199,44,.22),transparent 35%),
    radial-gradient(circle at 78% 26%,rgba(23,166,255,.18),transparent 38%);
  background-size:28px 28px,28px 28px,auto,auto;
  pointer-events:none;
}
.switch-art:after{
  content:"";
  position:absolute;
  left:18%;
  right:18%;
  top:42%;
  height:28%;
  border-radius:18px;
  background:#111827;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 45px rgba(0,0,0,.4);
}
.switch-art span,
.nvr-art span,
.cable-art span,
.ap-art span{display:none}
.switch-art .ports{display:none}
.switch-art{
  background:
    radial-gradient(circle at 25% 20%,rgba(255,199,44,.22),transparent 35%),
    linear-gradient(145deg,#111827,#06080d);
}
.switch-art .fake{display:none}
.switch-art i{display:none}
.switch-art b{display:none}
.nvr-art{
  background:
    radial-gradient(circle at 26% 24%,rgba(255,199,44,.24),transparent 36%),
    linear-gradient(145deg,#111827,#05070b);
}
.nvr-art:after{
  content:"";
  position:absolute;
  left:16%;
  right:16%;
  top:34%;
  height:38%;
  border-radius:18px;
  background:#0f1622;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 18px 45px rgba(0,0,0,.42);
}
.cable-art{
  background:
    radial-gradient(circle at 35% 25%,rgba(255,199,44,.22),transparent 34%),
    linear-gradient(145deg,#111827,#05070b);
}
.cable-art:after{
  content:"";
  position:absolute;
  left:18%;
  top:31%;
  width:66%;
  height:36%;
  border:10px solid rgba(255,199,44,.84);
  border-left-color:rgba(23,166,255,.65);
  border-radius:50%;
  transform:rotate(-14deg);
  box-shadow:0 0 30px rgba(255,199,44,.20);
}
.ap-art{
  background:
    radial-gradient(circle at 70% 25%,rgba(23,166,255,.20),transparent 36%),
    radial-gradient(circle at 28% 24%,rgba(255,199,44,.20),transparent 34%),
    linear-gradient(145deg,#111827,#05070b);
}
.ap-art:after{
  content:"";
  position:absolute;
  left:33%;
  top:25%;
  width:34%;
  height:50%;
  border-radius:24px;
  background:#f2f4f7;
  box-shadow:0 18px 45px rgba(0,0,0,.35), inset 0 0 0 1px rgba(0,0,0,.12);
}
.ap-art:before{
  z-index:2;
}
.shop-art.switch-art::before{z-index:2}
.shop-art.switch-art::after{z-index:1}
.shop-art.nvr-art::before{z-index:2}
.shop-art.nvr-art::after{z-index:1}
.shop-art.cable-art::before{z-index:2}
.shop-art.cable-art::after{z-index:1}
.shop-art.ap-art::before{z-index:2}
.shop-art.ap-art::after{z-index:1}
@media(max-width:960px){
  .network-only-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .network-only-grid{grid-template-columns:1fr}
}


/* v31: real photos for network equipment cards */
.network-photo-art{
  padding:0!important;
  background:#080b12!important;
  overflow:hidden;
  position:relative;
}
.network-photo-art img{
  width:100%;
  height:100%;
  min-height:205px;
  object-fit:cover;
  display:block;
  transform:scale(1.04);
  filter:saturate(1.08) contrast(1.08) brightness(.82);
  transition:transform .75s cubic-bezier(.2,.7,.2,1), filter .35s ease;
}
.network-photo-art:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.38)),
    radial-gradient(circle at 20% 14%,rgba(255,199,44,.22),transparent 34%),
    radial-gradient(circle at 82% 20%,rgba(23,166,255,.18),transparent 36%);
}
.network-photo-art:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(115deg,transparent 0 40%,rgba(255,255,255,.18) 50%,transparent 60%);
  background-size:30px 30px,30px 30px,220% 100%;
  mix-blend-mode:screen;
  opacity:.52;
  animation:networkPhotoShine 5.8s ease-in-out infinite;
}
.shop-card:hover .network-photo-art img{
  transform:scale(1.10);
  filter:saturate(1.16) contrast(1.12) brightness(.92);
}
@keyframes networkPhotoShine{
  0%{background-position:0 0,0 0,180% 0}
  55%{background-position:0 0,0 0,-80% 0}
  100%{background-position:0 0,0 0,-80% 0}
}


/* v32: budget-based PC selection */
.builder-custom{
  position:relative;
}
.builder-custom .tag{
  background:linear-gradient(135deg,rgba(255,199,44,.22),rgba(255,199,44,.08));
}
.budget-field input{
  font-weight:800;
  color:#ffc72c;
}


/* v33: simplified budget modal + realistic repair hero */
.budget-only-form{
  display:grid;
  gap:18px;
}
.budget-only-form .budget-field input{
  color:#ffc72c;
  font-weight:900;
  letter-spacing:.02em;
}
.repair-real-visual{
  min-height:320px;
  padding:0!important;
  border-radius:34px;
  overflow:hidden;
  position:relative;
  background:#090c13;
  border:1px solid rgba(255,199,44,.24);
  box-shadow:0 34px 100px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08);
}
.repair-real-visual img{
  width:100%;
  height:100%;
  min-height:320px;
  object-fit:cover;
  display:block;
  transform:scale(1.035);
  filter:saturate(1.08) contrast(1.08) brightness(.88);
  animation:repairRealMove 8s ease-in-out infinite;
}
.repair-real-visual:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:
    linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.34)),
    radial-gradient(circle at 18% 14%,rgba(255,199,44,.22),transparent 34%),
    radial-gradient(circle at 82% 20%,rgba(23,166,255,.18),transparent 38%);
  pointer-events:none;
}
.repair-real-visual:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.18) 48%,transparent 58%);
  background-size:32px 32px,32px 32px,220% 100%;
  mix-blend-mode:screen;
  opacity:.56;
  animation:repairHeroShine 5.6s ease-in-out infinite;
  pointer-events:none;
}
.repair-photo-glow{
  position:absolute;
  z-index:4;
  left:8%;
  right:8%;
  bottom:24px;
  height:5px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--gold),rgba(23,166,255,.9),transparent);
  opacity:.72;
  animation:repairLinePulse 2.7s ease-in-out infinite;
}
@keyframes repairRealMove{
  0%,100%{transform:scale(1.035) translate3d(0,0,0)}
  50%{transform:scale(1.075) translate3d(-8px,-4px,0)}
}
@keyframes repairHeroShine{
  0%{background-position:0 0,0 0,180% 0}
  55%{background-position:0 0,0 0,-80% 0}
  100%{background-position:0 0,0 0,-80% 0}
}
@keyframes repairLinePulse{
  0%,100%{opacity:.42;transform:scaleX(.86)}
  50%{opacity:.95;transform:scaleX(1)}
}
@media(max-width:760px){
  .repair-real-visual,.repair-real-visual img{min-height:240px}
}


/* v34: real repair photo hero instead of generated illustration */
.repair-photo-visual{
  min-height:330px;
  padding:0!important;
  border-radius:34px;
  overflow:hidden;
  position:relative;
  background:#080b12;
  border:1px solid rgba(255,199,44,.26);
  box-shadow:0 34px 110px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.08);
  isolation:isolate;
}
.repair-photo-visual img{
  width:100%;
  height:100%;
  min-height:330px;
  object-fit:cover;
  display:block;
  transform:scale(1.035);
  filter:saturate(1.12) contrast(1.10) brightness(.84);
  animation:repairPhotoMove 8.5s ease-in-out infinite;
}
.repair-photo-visual:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:
    linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.42)),
    radial-gradient(circle at 18% 14%,rgba(255,199,44,.24),transparent 34%),
    radial-gradient(circle at 82% 20%,rgba(23,166,255,.18),transparent 38%);
  pointer-events:none;
}
.repair-photo-visual:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.18) 48%,transparent 58%);
  background-size:32px 32px,32px 32px,230% 100%;
  mix-blend-mode:screen;
  opacity:.55;
  animation:repairPhotoShine 5.8s ease-in-out infinite;
  pointer-events:none;
}
.repair-photo-glow{
  position:absolute;
  z-index:4;
  left:8%;
  right:8%;
  bottom:24px;
  height:5px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--gold),rgba(23,166,255,.92),transparent);
  opacity:.74;
  animation:repairPhotoLine 2.8s ease-in-out infinite;
}
.repair-photo-scan{
  position:absolute;
  z-index:5;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,199,44,.9),rgba(23,166,255,.7),transparent);
  opacity:0;
  animation:repairPhotoScan 4.6s ease-in-out infinite;
}
.repair-photo-visual:hover img{
  transform:scale(1.08);
  filter:saturate(1.18) contrast(1.12) brightness(.92);
}
@keyframes repairPhotoMove{
  0%,100%{transform:scale(1.035) translate3d(0,0,0)}
  50%{transform:scale(1.075) translate3d(-9px,-5px,0)}
}
@keyframes repairPhotoShine{
  0%{background-position:0 0,0 0,180% 0}
  55%{background-position:0 0,0 0,-80% 0}
  100%{background-position:0 0,0 0,-80% 0}
}
@keyframes repairPhotoLine{
  0%,100%{opacity:.42;transform:scaleX(.86)}
  50%{opacity:.96;transform:scaleX(1)}
}
@keyframes repairPhotoScan{
  0%{opacity:0;transform:translateY(0)}
  12%,70%{opacity:.62}
  100%{opacity:0;transform:translateY(330px)}
}
@media(max-width:760px){
  .repair-photo-visual,.repair-photo-visual img{min-height:240px}
}


/* v35: builder cards fully clickable */
.builder-card[role="button"]{cursor:pointer}
.builder-card[role="button"]:focus-visible{
  outline:2px solid rgba(255,199,44,.85);
  outline-offset:3px;
}


/* v39: illustrated icons for About value cards */
.about-values-grid{align-items:stretch}
.about-value-card{
  position:relative;
  overflow:hidden;
  min-height:190px;
  padding-top:30px;
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.about-value-card:before{
  content:"";
  position:absolute;
  width:160px;
  height:160px;
  right:-54px;
  top:-62px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,199,44,.16),transparent 68%);
  pointer-events:none;
}
.about-value-card:hover{
  transform:translateY(-7px);
  border-color:rgba(255,199,44,.42);
  box-shadow:0 28px 70px rgba(0,0,0,.38),0 0 0 1px rgba(255,199,44,.05) inset;
}
.about-value-icon{
  width:68px;
  height:68px;
  display:grid;
  place-items:center;
  margin-bottom:20px;
  border-radius:22px;
  color:var(--gold);
  background:
    radial-gradient(circle at 30% 25%,rgba(255,255,255,.14),transparent 35%),
    linear-gradient(145deg,rgba(255,199,44,.20),rgba(23,166,255,.08));
  border:1px solid rgba(255,199,44,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.12);
  animation:aboutIconFloat 4.8s ease-in-out infinite;
}
.about-value-icon svg{width:40px;height:40px;filter:drop-shadow(0 0 12px rgba(255,199,44,.22))}
.about-value-card:nth-child(2) .about-value-icon{animation-delay:.6s;color:#ffd866}
.about-value-card:nth-child(3) .about-value-icon{animation-delay:1.2s;color:#79c9ff;background:linear-gradient(145deg,rgba(23,166,255,.18),rgba(255,199,44,.08));border-color:rgba(23,166,255,.28)}
.about-value-card h3{margin-top:0}
@keyframes aboutIconFloat{
  0%,100%{transform:translateY(0) rotate(0deg)}
  50%{transform:translateY(-6px) rotate(1.5deg)}
}
@media(max-width:760px){
  .about-value-card{min-height:auto}
  .about-value-icon{width:60px;height:60px;border-radius:19px}
  .about-value-icon svg{width:35px;height:35px}
}

/* v40-square-removal */
.about-card:after,.contact-item:after,.review-card:after,.info-card:after{display:none!important;content:none!important}


/* v41: review submission modal */
.reviews-hero-content{display:flex;flex-direction:column;align-items:center;text-align:center}
.review-open-btn{margin-top:22px;min-width:190px}
.review-modal-backdrop{z-index:300}
.review-modal{width:min(720px,100%);padding:30px}
.review-modal-head{text-align:center;margin:4px auto 24px;max-width:600px}
.review-modal-head h2{font-size:clamp(30px,5vw,48px);margin:14px 0 10px;letter-spacing:-.045em}
.review-modal-head p{color:var(--muted);line-height:1.65;margin:0}
.review-form{display:grid;gap:16px}
.review-form label>span{display:block;margin-bottom:8px;font-weight:850}
.review-form input,.review-form textarea,.review-form select{width:100%;padding:15px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.24);color:#fff;outline:none;transition:border-color .25s ease,box-shadow .25s ease}
.review-form input:focus,.review-form textarea:focus,.review-form select:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(255,199,44,.09)}
.review-form select option{background:#111722;color:#fff}
.review-submit-btn{width:100%;margin-top:4px}
@media(max-width:640px){.review-modal{padding:22px}.review-modal .form-two{grid-template-columns:1fr}}

/* v45: entire network product card acts as a link */
.clickable-network-card{cursor:pointer}
.clickable-network-card:focus-visible{outline:2px solid #f4b51f;outline-offset:4px}