/* V11 — separate photo-inspired glass-world direction; copy and other sections retained. */
.hero:is(.bn-hero-photo,.bn-hero-modern){background:#f8fcff;overflow:hidden;min-height:0}
:is(.bn-hero-photo,.bn-hero-modern)::before{background:radial-gradient(ellipse at 80% 45%,#cdeaff4a,transparent 62%);inset:0}
:is(.bn-hero-photo,.bn-hero-modern)::after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;height:90px;background:linear-gradient(transparent,#fff);pointer-events:none;z-index:1}
:is(.bn-hero-photo,.bn-hero-modern) .hero-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:20px;min-height:660px;padding-block:48px;position:static}
:is(.bn-hero-photo,.bn-hero-modern) .hero-copy{max-width:600px;z-index:3;position:relative}
:is(.bn-hero-photo,.bn-hero-modern) h1{font-size:clamp(50px,4.6vw,68px);line-height:1.02;letter-spacing:-.055em;margin:0 0 20px}
:is(.bn-hero-photo,.bn-hero-modern) h1 span{color:#087cf5}
:is(.bn-hero-photo,.bn-hero-modern) .hero-lead{font-size:clamp(21px,1.75vw,25px);line-height:1.26;letter-spacing:-.025em;margin-bottom:16px}
:is(.bn-hero-photo,.bn-hero-modern) .hero-desc{font-size:15px;line-height:1.65;max-width:545px;margin-bottom:23px}
:is(.bn-hero-photo,.bn-hero-modern) .product-identification{margin:0 0 20px}:is(.bn-hero-photo,.bn-hero-modern) .product-identification img{width:147px}
:is(.bn-hero-photo,.bn-hero-modern) .partner-box{background:transparent;border:0;box-shadow:none;border-radius:0;padding:0;margin-top:25px;gap:18px;width:min(100%,530px)}
:is(.bn-hero-photo,.bn-hero-modern) .partner-box img{width:108px;max-width:34%}:is(.bn-hero-photo,.bn-hero-modern) .partner-box p{font-size:11px;line-height:1.55}
:is(.bn-hero-photo,.bn-hero-modern) .hero-media{position:static;width:100%;max-width:none;border:0;box-shadow:none;border-radius:0;background:none;padding:0;overflow:visible}
.bn-photo-scene{position:static;width:100%;min-height:440px;--bn-animation-state:running}
.bn-photo-stage{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.bn-photo-art{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:65% 50%!important;aspect-ratio:auto!important;border-radius:0!important;mask-image:linear-gradient(to right,transparent 0%,transparent 28%,#000 51%,#000 100%);filter:none!important}
.bn-photo-glow{position:absolute;left:65%;top:58%;width:30%;height:39%;background:radial-gradient(ellipse,#1cb6ff30,transparent 67%);border-radius:50%;animation:bn-photo-light 18s ease-in-out infinite alternate;animation-play-state:var(--bn-animation-state)}
.bn-photo-spark{position:absolute;width:4px;height:4px;border-radius:50%;background:#8edbff;box-shadow:0 0 9px 3px #20b8ff66;animation:bn-photo-spark 11s ease-in-out infinite;animation-play-state:var(--bn-animation-state)}
.bn-photo-spark-one{left:66%;top:82%;animation-delay:-3s}.bn-photo-spark-two{left:84%;top:76%;animation-delay:-7s}.bn-photo-spark-three{left:94%;top:53%;animation-delay:-1s}
.bn-photo-scene .bn-scene-controls{position:absolute;right:50px;bottom:42px;z-index:4;display:flex;justify-content:flex-end}
.bn-photo-scene .bn-motion-toggle{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #cde7f7;border-radius:7px;background:#ffffffc9;color:#496e94;font-size:10px;line-height:1.3}
.bn-photo-scene .bn-motion-toggle:hover{background:#fff;color:#087cf5}
.bn-photo-scene .bn-motion-toggle svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round}
.bn-photo-scene[data-user-paused="true"],.bn-photo-scene[data-inactive="true"]{--bn-animation-state:paused}
:is(.bn-hero-photo,.bn-hero-modern) .hero-image-disclaimer{position:absolute;right:50px;bottom:17px;width:48%;margin:0;text-align:right;color:#4d6d90;font-size:9px;z-index:4}
@keyframes bn-photo-light{from{opacity:.35;transform:translate(-7px,0) scale(.96)}to{opacity:.8;transform:translate(8px,-4px) scale(1.04)}}
@keyframes bn-photo-spark{0%,100%{opacity:.25;transform:translate(0,0)}50%{opacity:.8;transform:translate(6px,-4px)}}
@media(min-width:961px) and (max-width:1180px){:is(.bn-hero-photo,.bn-hero-modern) .hero-layout{grid-template-columns:1fr 1fr;gap:12px}:is(.bn-hero-photo,.bn-hero-modern) h1{font-size:54px}:is(.bn-hero-photo,.bn-hero-modern) .hero-actions{gap:10px}:is(.bn-hero-photo,.bn-hero-modern) .hero-actions .btn{font-size:12px;padding-inline:13px}.bn-photo-art{object-position:62% 50%!important;mask-image:linear-gradient(to right,transparent 0%,transparent 30%,#000 56%,#000 100%)}}
@media(max-width:960px){:is(.bn-hero-photo,.bn-hero-modern) .hero-layout{grid-template-columns:1fr;min-height:0;gap:22px;padding-block:35px;position:relative}:is(.bn-hero-photo,.bn-hero-modern) .hero-copy{max-width:700px}:is(.bn-hero-photo,.bn-hero-modern) h1{font-size:clamp(44px,7vw,62px)}:is(.bn-hero-photo,.bn-hero-modern) .hero-lead{font-size:23px}:is(.bn-hero-photo,.bn-hero-modern) .hero-media{position:relative;justify-self:center;width:100%}.bn-photo-scene{position:relative}.bn-photo-stage{position:relative;height:410px;inset:auto}.bn-photo-art{object-position:right 53%!important;mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 80%,transparent 100%)}.bn-photo-glow{left:45%;top:57%;width:42%}.bn-photo-spark-one{left:44%}.bn-photo-spark-two{left:69%}.bn-photo-spark-three{left:89%}.bn-photo-scene .bn-scene-controls{position:relative;right:auto;bottom:auto;justify-content:flex-end;padding:0 10px}:is(.bn-hero-photo,.bn-hero-modern) .hero-image-disclaimer{position:relative;right:auto;bottom:auto;text-align:center;font-size:9px;width:100%;margin-top:5px}}
@media(max-width:600px){:is(.bn-hero-photo,.bn-hero-modern) .hero-layout{padding-block:29px 25px;gap:14px}:is(.bn-hero-photo,.bn-hero-modern) h1{font-size:clamp(39px,11vw,54px);margin-bottom:18px}:is(.bn-hero-photo,.bn-hero-modern) .hero-lead{font-size:21px}:is(.bn-hero-photo,.bn-hero-modern) .hero-desc{font-size:14px}:is(.bn-hero-photo,.bn-hero-modern) .product-identification{margin:0 0 21px}:is(.bn-hero-photo,.bn-hero-modern) .partner-box{margin-top:22px;gap:12px}:is(.bn-hero-photo,.bn-hero-modern) .partner-box img{width:93px}:is(.bn-hero-photo,.bn-hero-modern) .partner-box p{font-size:10.5px}.bn-photo-stage{height:300px}.bn-photo-art{object-position:90% 50%!important}.bn-photo-scene .bn-motion-toggle{font-size:9px}:is(.bn-hero-photo,.bn-hero-modern) .hero-image-disclaimer{font-size:8px}}
@media(max-width:350px){:is(.bn-hero-photo,.bn-hero-modern) h1{font-size:37px}.bn-photo-stage{height:255px}}
@media(min-width:1600px){.bn-photo-stage{inset:auto 0 auto auto;top:50%;width:min(100%,1450px);height:auto;aspect-ratio:1860/846;transform:translateY(-50%);mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 86%,transparent 100%)}.bn-photo-art{object-fit:cover!important;object-position:right center!important}}
@media(min-width:961px) and (max-width:1180px){.bn-photo-stage{inset:auto 0 auto 0;top:50%;width:100%;height:auto;aspect-ratio:1860/846;transform:translateY(-50%);mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 86%,transparent 100%)}.bn-photo-art{object-fit:cover!important;object-position:right center!important}}
@media(max-width:960px){.bn-photo-scene{min-height:0}}
@media(max-width:960px){.bn-photo-art{-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 80%,transparent 100%),linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 80%,transparent 100%),linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}}
@media(prefers-reduced-motion:reduce){.bn-photo-glow,.bn-photo-spark{animation:none!important}.bn-photo-scene .bn-scene-controls{display:none}}

/* Original Optima wordmark and gentle light animation aligned to the photo canvas. */
.bn-photo-overlay{position:absolute;pointer-events:none;overflow:hidden;z-index:1}
.bn-photo-overlay .bn-optima-screen-brand{position:absolute;left:63.12%;top:19.5%;width:11.4%!important;height:auto!important;max-width:none!important;aspect-ratio:auto!important;object-fit:contain!important;border-radius:0!important;transform:skewY(-7deg);transform-origin:left top;filter:none!important}
.bn-photo-flow{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.bn-network-lights path{fill:none;stroke:#6ce0ff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:18 470;opacity:.78;filter:drop-shadow(0 0 3px #1fbbff);animation:bn-network-travel 16s linear infinite;animation-play-state:var(--bn-animation-state)}
.bn-network-lights path:nth-child(2){animation-duration:20s;animation-delay:-9s;animation-direction:reverse}.bn-network-lights path:nth-child(3){animation-duration:18s;animation-delay:-4s}
.bn-optima-reflection{fill:url(#bn-optima-reflection-gradient);opacity:0;animation:bn-optima-reflection 22s ease-in-out infinite;animation-delay:-7s;animation-play-state:var(--bn-animation-state)}
@keyframes bn-network-travel{from{stroke-dashoffset:0}to{stroke-dashoffset:-1464}}
@keyframes bn-optima-reflection{0%,20%{transform:translateX(-160px) skewX(-7deg);opacity:0}30%{opacity:.12}62%{transform:translateX(600px) skewX(-7deg);opacity:.12}72%,100%{transform:translateX(650px) skewX(-7deg);opacity:0}}
@media(prefers-reduced-motion:reduce){.bn-photo-overlay *{animation:none!important}.bn-optima-reflection{opacity:0}}

/* V13 — requested spacing and a soft blue background under the whole hero. */
.hero:is(.bn-hero-photo,.bn-hero-modern){background:linear-gradient(110deg,#edf6ff 0%,#eef8ff 52%,#e5f3ff 100%)}
:is(.bn-hero-photo,.bn-hero-modern)::before{background:radial-gradient(ellipse at 75% 42%,#c8e8ff55,transparent 65%)}
@media(min-width:1181px) and (max-width:1599px){
  .bn-photo-stage{left:-32px;right:32px;mask-image:linear-gradient(to right,#000 0%,#000 calc(100% - 70px),transparent 100%)}
}
@media(min-width:1600px){
  .bn-photo-stage{
    right:clamp(64px,4.6vw,104px);
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 86%,transparent 100%),linear-gradient(to right,#000 0%,#000 calc(100% - 70px),transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 86%,transparent 100%),linear-gradient(to right,#000 0%,#000 calc(100% - 70px),transparent 100%);
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
  .bn-photo-scene .bn-scene-controls,:is(.bn-hero-photo,.bn-hero-modern) .hero-image-disclaimer{right:calc(50px + clamp(64px,4.6vw,104px))}
}

/* V14 — a smaller Optima mark and an original BlueNetwork mark on a glass plaque. */
.bn-photo-overlay .bn-optima-screen-brand{left:63.5%;top:20%;width:8.2%!important}
.bn-bluenetwork-plaque{
  position:absolute;left:43%;top:74%;width:22%;aspect-ratio:4.5;
  display:grid;place-items:center;padding:1%;z-index:2;
  transform:skewY(-7deg);transform-origin:left center;
  border:1px solid #fff;border-radius:14px;
  background:linear-gradient(135deg,#ffffffed 0%,#edf8ffe6 52%,#d9efffc9 100%);
  box-shadow:inset 0 0 0 1px #8acfff88,inset 0 2px 8px #fff,4px 6px 0 -1px #cceaff9c,0 15px 28px #087ada28,0 0 24px #30baff25;
}
.bn-bluenetwork-plaque::before{content:"";position:absolute;inset:7px;border:1px solid #fff9;border-radius:9px;pointer-events:none}
.bn-bluenetwork-plaque img{position:relative;z-index:1;display:block;width:100%!important;height:auto!important;max-width:none!important;aspect-ratio:auto!important;object-fit:contain!important;border-radius:0!important;filter:none!important}
.bn-brand-light{position:absolute;left:15%;right:15%;bottom:-5px;height:3px;border-radius:50%;background:#78dcff;box-shadow:0 0 14px 5px #19b4ff55}
.bn-brand-connection{position:absolute;top:100%;left:78%;height:22px;width:1px;background:linear-gradient(#7bd8ff,#1399ff33);box-shadow:0 0 6px #0ba9ff88}
.bn-brand-connection::after{content:"";position:absolute;bottom:-3px;left:-3px;width:7px;height:7px;border-radius:50%;background:#d5f7ff;box-shadow:0 0 8px #149cff}
@media(min-width:1600px){.bn-bluenetwork-plaque{left:31%;top:74%;width:29%}}
@media(min-width:1181px) and (max-width:1399px){.bn-bluenetwork-plaque{left:50%;top:82%;width:22%}}
@media(min-width:961px) and (max-width:1180px){.bn-bluenetwork-plaque{left:51%;top:83%;width:22%}}
@media(max-width:960px){.bn-bluenetwork-plaque{left:6%;top:auto;bottom:8px;width:60%;max-width:360px;padding:14px;transform:skewY(-5deg);border-radius:10px}}
@media(max-width:600px){.bn-bluenetwork-plaque{left:5%;width:70%;padding:11px;bottom:6px}}

/* V15 — smaller Optima wordmark and a level BlueNetwork plaque at every width. */
.bn-photo-overlay .bn-optima-screen-brand{width:6%!important}
.bn-bluenetwork-plaque{transform:none}

/* V16 — align the small Optima mark to the screen header; raise BlueNetwork to the marked height. */
.bn-photo-overlay .bn-optima-screen-brand{left:63.1%;top:20.4%;transform:matrix(1,-.18,0,1,0,0);transform-origin:left top}
@media(min-width:1600px){.bn-bluenetwork-plaque{top:40%}}
@media(min-width:1181px) and (max-width:1599px){.bn-bluenetwork-plaque{left:35%;top:40%;width:25%}}
@media(min-width:961px) and (max-width:1180px){.bn-bluenetwork-plaque{left:37%;top:40%;width:23%}}

/* V17 — follow the reference arrows while keeping responsive clearance. */
.bn-photo-overlay .bn-optima-screen-brand{left:62.35%;top:19%}
@media(min-width:1600px){.bn-bluenetwork-plaque{left:calc(31% - 64px);top:calc(40% - 24px)}}
@media(min-width:1181px) and (max-width:1599px){.bn-bluenetwork-plaque{left:calc(35% - 16px);top:calc(40% - 24px)}}
@media(min-width:961px) and (max-width:1180px){.bn-bluenetwork-plaque{left:calc(37% - 6px);top:calc(40% - 24px)}}

/* V18 — a slight extra lift and left shift, with a slightly larger Optima wordmark. */
.bn-photo-overlay .bn-optima-screen-brand{width:6.8%!important}
@media(min-width:1600px){.bn-bluenetwork-plaque{left:calc(31% - 88px);top:calc(40% - 36px)}}
@media(min-width:1181px) and (max-width:1599px){.bn-bluenetwork-plaque{left:calc(35% - 28px);top:calc(40% - 36px)}}
@media(min-width:961px) and (max-width:1180px){.bn-bluenetwork-plaque{left:calc(37% - 10px);top:calc(40% - 36px)}}
@media(max-width:960px){.bn-bluenetwork-plaque{left:calc(6% - 4px);bottom:12px}}
@media(max-width:600px){.bn-bluenetwork-plaque{left:calc(5% - 4px);bottom:10px}}

/* A single light follows a tilted ellipse, split around the glass face for depth. */
.bn-photo-overlay .bn-optima-screen-brand{left:calc(62.35% + 1mm);top:calc(19% + 1mm)}
.bn-bluenetwork-plaque{background:transparent;border-color:transparent;box-shadow:none;isolation:isolate}
.bn-bluenetwork-plaque::after{
  content:"";position:absolute;inset:-1px;z-index:1;pointer-events:none;
  border:1px solid #fff;border-radius:inherit;
  background:linear-gradient(135deg,#ffffffed 0%,#edf8ffe6 52%,#d9efffc9 100%);
  box-shadow:inset 0 0 0 1px #8acfff88,inset 0 2px 8px #fff,4px 6px 0 -1px #cceaff9c,0 15px 28px #087ada28,0 0 24px #30baff25;
}
.bn-bluenetwork-plaque::before{z-index:2}
.bn-bluenetwork-plaque img{z-index:3}
.bn-brand-light{z-index:2}.bn-brand-connection{z-index:0}
.bn-brand-orbit{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.bn-brand-orbit-back{z-index:0}.bn-brand-orbit-front{z-index:4}
.bn-brand-orbit-guide{fill:none;stroke:#61caff;stroke-width:1;stroke-opacity:.14;vector-effect:non-scaling-stroke}
.bn-brand-orbit-tail{
  fill:none;stroke:#72ddff;stroke-width:4;stroke-linecap:round;
  opacity:.9;
  filter:drop-shadow(0 0 8px #25b8ff);
}
.bn-brand-satellite{
  filter:drop-shadow(0 0 10px #37caff) drop-shadow(0 0 20px #009bffb0);
}
@media(prefers-reduced-motion:reduce){
  .bn-brand-orbit{display:none}
}

/* Gutenberg wrappers preserve the prototype layout and the original partner mark. */
.wp-block-bluenetwork-hero-scene{position:static;width:100%;min-width:0}
:is(.bn-hero-photo,.bn-hero-modern) .partner-box .wp-block-image{width:108px;max-width:34%;flex:none}
:is(.bn-hero-photo,.bn-hero-modern) .partner-box .wp-block-image img{width:100%;max-width:100%}
:is(.bn-hero-photo,.bn-hero-modern) .hero-actions .wp-block-button__link{min-height:48px;font-size:14px;padding:14px 23px}
.bn-hero-modern .product-identification{display:none}
.bn-photo-scene[data-motion-enabled="false"]{--bn-animation-state:paused}
.bn-photo-scene[data-motion-enabled="false"] .bn-scene-controls{display:none}
.bn-hero-editor-preview{margin:0;min-width:0;overflow:hidden;border-radius:12px}
.bn-hero-editor-preview img{display:block;width:100%;height:auto;aspect-ratio:auto}
.bn-hero-editor-preview figcaption{padding:8px 10px;font-size:12px;line-height:1.4;color:#496e94;background:#edf6ff}
@media(max-width:1180px){:is(.bn-hero-photo,.bn-hero-modern) .hero-actions .wp-block-button__link{font-size:12px;padding-inline:13px}}
@media(max-width:600px){:is(.bn-hero-photo,.bn-hero-modern) .partner-box .wp-block-image{width:93px}:is(.bn-hero-photo,.bn-hero-modern) .hero-actions .wp-block-button__link{font-size:13px;min-height:46px}}

/* V23 — lift the complete BlueNetwork plaque and its light orbit by 1 CSS cm. */
.bn-bluenetwork-plaque{transform:translateY(-1cm)}

/* V24 — another half centimetre above v23; 1.5cm above v22. */
.bn-bluenetwork-plaque{transform:translateY(-1.5cm)}
