/* Product photo annotations and compact, uncropped mobile imagery. */
.hero-detail-link{margin-left:auto;display:flex;gap:12px;align-items:center;color:#d1ebff;font-size:11px}
.hero-detail-link .icon{width:17px;height:17px}
.gallery-section{padding-top:38px}
.gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
.gallery-large{grid-column:auto;grid-row:auto;aspect-ratio:3/2}
.gallery-item img{object-fit:contain;object-position:center!important}
.gallery-item:hover img{transform:none}
.details-heading{margin-top:33px}
.annotation-section{padding:43px 0 46px;background:radial-gradient(ellipse at 55% 50%,#10283a,#06111b 70%)}
.annotation-section .section-heading{margin-bottom:23px}
.annotation-section .section-heading>p{font-size:12px}
.annotation-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.8fr);align-items:center;gap:22px}
.annotated-photo{position:relative;overflow:hidden;border:1px solid #9bc9e352;border-radius:8px;background:#0b1925;isolation:isolate}
.annotated-photo>img{width:100%;height:auto;aspect-ratio:1983/793;object-fit:cover}
.photo-pin{position:absolute;left:var(--pin-x);top:var(--pin-y);z-index:2;width:18px;height:18px;display:block;overflow:visible;padding:0;border:0;border-radius:50%;background:transparent;transform:translate(-50%,-50%);cursor:pointer}
.photo-pin::after{content:"";position:absolute;inset:5px;border:1px solid #e6f8ff;border-radius:50%;background:#a5e3ff;box-shadow:0 0 0 2px #8bd9ff43,0 0 10px 3px #8bd9ffad;transition:inset .18s,box-shadow .18s,background .18s}
.pin-leader{position:absolute;left:50%;top:50%;width:var(--leader-length);height:1px;transform:rotate(var(--leader-angle));transform-origin:0 50%;background:linear-gradient(90deg,#b8eaffd9,#b8eaff9c 72%,#b8eaff06);box-shadow:0 0 4px #82cefa40;pointer-events:none}
.photo-pin:hover::after,.photo-pin:focus-visible::after,.photo-pin.is-active::after{inset:3px;background:#e9faff;box-shadow:0 0 0 3px #8bd9ff50,0 0 15px 5px #8bd9ffdd}
.photo-pin:hover .pin-leader,.photo-pin:focus-visible .pin-leader,.photo-pin.is-active .pin-leader{height:1.5px;background:linear-gradient(90deg,#e5f7ff,#b9eaffc9 75%,#b8eaff08);box-shadow:0 0 7px #8bd9ff8c}
.annotation-list{display:grid;border-top:1px solid #a8c7dd32}
.annotation-item{width:100%;min-height:82px;display:grid;grid-template-columns:32px minmax(0,1fr) 18px;align-items:center;gap:12px;padding:13px 6px;background:transparent;border-bottom:1px solid #a8c7dd32;text-align:left;color:#eef5fb;transition:background .2s,padding .2s}
.annotation-item:hover,.annotation-item:focus-visible{background:#8ed4ff0c;padding-inline:11px}
.annotation-number{color:#8ed4ff;font-size:10px;letter-spacing:.1em}
.annotation-item strong{display:block;font-size:12px;font-weight:650}
.annotation-item small{display:block;margin-top:4px;color:#9fb5c6;font-size:10px;line-height:1.5}
.annotation-arrow{color:#82bfe8;font-size:14px;text-align:right;transition:transform .2s}
.annotation-item:hover .annotation-arrow{transform:translate(2px,-2px)}
.visual-note{color:#91a8b9;font-size:9px;line-height:1.7;margin-top:14px}
.toast{position:fixed;left:50%;bottom:26px;z-index:1000;display:grid;grid-template-columns:44px minmax(0,1fr) auto 34px;align-items:center;gap:13px;width:min(570px,calc(100% - 32px));padding:13px 14px 16px;border:1px solid #b6d3e6;border-radius:13px;background:#f7fbff;color:#122b3d;box-shadow:0 18px 60px #0005;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,18px) scale(.98);transition:opacity .24s ease,transform .24s ease,visibility .24s ease;overflow:hidden}
.toast.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1)}
.toast-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#e0f5ec;color:#207d5b}
.toast-icon .icon{width:22px;height:22px;stroke-width:2}
.toast[data-kind=error] .toast-icon{background:#fff0ed;color:#a64039}
.toast-copy{display:block;min-width:0}
.toast-title{display:block;font-size:12px;line-height:1.35;font-weight:750}
.toast-message{display:block;margin-top:3px;color:#607386;font-size:10px;line-height:1.4}
.toast-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:35px;padding:0 12px;border:1px solid #c2e2f5;border-radius:7px;background:#e9f6ff;color:#17527b;font-size:10px;font-weight:700;white-space:nowrap;transition:background .18s,border-color .18s}
.toast-action:hover{background:#d9efff;border-color:#9fd2f2}
.toast-action .icon{width:15px;height:15px}
.toast-dismiss{width:32px;height:32px;display:grid;place-items:center;padding:0;border-radius:50%;background:transparent;color:#6f8495;transition:background .18s,color .18s}
.toast-dismiss:hover{background:#eaf1f6;color:#243e52}
.toast-dismiss .icon{width:16px;height:16px}
.toast-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:#53a987;transform:scaleX(0);transform-origin:left}
.toast[data-kind=error] .toast-progress{background:#cb665d}
.toast.is-visible .toast-progress{transform:scaleX(1);transition:transform 4.8s linear}

@media(max-width:960px){
  .hero-image{object-fit:contain;object-position:center bottom!important;height:auto;bottom:0;top:auto}
  .hero,.hero-inner{min-height:650px}
  .hero-shade{background:linear-gradient(180deg,#06111b 0%,#06111bf2 23%,#06111b55 46%,transparent 72%,#06111b8c 100%)}
  .hero-copy{max-width:580px}
  .annotation-layout{grid-template-columns:minmax(0,1.45fr) minmax(235px,.8fr);gap:16px}
  .annotation-item{min-height:76px;gap:9px}
  .annotation-item small{font-size:9px}
}
@media(max-width:640px){
  .toast{left:12px;right:12px;bottom:78px;width:auto;grid-template-columns:38px minmax(0,1fr) 30px;gap:9px;padding:10px 11px 13px;transform:translateY(16px) scale(.985)}
  .toast.is-visible{transform:translateY(0) scale(1)}
  .toast-icon{width:36px;height:36px;border-radius:10px}
  .toast-icon .icon{width:20px;height:20px}
  .toast-title{font-size:11px}
  .toast-message{font-size:9px}
  .toast-action{grid-column:2;grid-row:2;justify-self:start;min-height:30px;margin-top:1px;padding-inline:10px;font-size:9px}
  .toast-dismiss{grid-column:3;grid-row:1;justify-self:end}
  .hero,.hero-inner{min-height:0}
  .hero{padding-bottom:0;display:flex;flex-direction:column;background:#06111b}
  .hero-inner{padding-top:29px;padding-bottom:0;order:0;display:contents}
  .hero-copy{padding:29px 20px 24px;order:0}
  .hero-shade{display:none}
  .hero-image{position:relative;order:1;height:auto;width:100%;object-fit:contain!important;object-position:center!important;aspect-ratio:1983/793;bottom:auto;top:auto}
  .hero-caption{position:relative;order:2;left:auto;right:auto;bottom:auto;margin:0;padding:14px 20px 18px;font-size:8px;flex-wrap:wrap;gap:7px;background:#06111b}
  .hero-detail-link{font-size:8px;margin-left:auto;gap:6px}
  .hero-detail-link .icon{height:13px;width:13px}
  .hero h1{font-size:clamp(34px,9.6vw,49px)}
  .hero-description{font-size:12px}
  .hero-cta{margin-top:20px}
  .annotation-section{padding:30px 0 33px}
  .annotation-section .section-heading h2{font-size:30px}
  .annotation-section .section-heading .eyebrow{font-size:8px}
  .annotation-section .split>p{font-size:10px!important;margin-top:10px}
  .annotation-section .split>p br{display:none}
  .annotation-layout{grid-template-columns:1fr;gap:13px}
  .annotated-photo{margin-inline:-3px;border-radius:6px}
  .annotated-photo>img{aspect-ratio:1983/793;object-fit:contain}
  .photo-pin{width:18px;height:18px}
  .annotation-item{min-height:68px;grid-template-columns:28px minmax(0,1fr) 18px;padding:10px 5px;gap:9px}
  .annotation-item:hover,.annotation-item:focus-visible{padding-inline:8px}
  .annotation-item strong{font-size:11px}
  .annotation-item small{font-size:9px}
  .gallery-section{padding:29px 0 23px}
  .gallery-section .split{display:block;margin-bottom:20px}
  .gallery-section .split .eyebrow{font-size:9px;margin-bottom:8px}
  .gallery-section h2{font-size:27px}
  .gallery-section .split>p{margin-top:12px;font-size:10px!important}
  .gallery-grid{grid-template-columns:1fr;grid-template-rows:auto;gap:12px}
  .gallery-large{aspect-ratio:auto;grid-column:auto}
  .gallery-item.gallery-large>img{height:auto;max-height:260px;object-fit:contain!important}
  .details-heading{margin:28px 0 17px}
  .details-heading .eyebrow{font-size:8px;letter-spacing:.22em}
  .details-grid{gap:10px}
  .detail-card>button{height:115px}
  .detail-card>div{padding:13px}
  .detail-card .icon{width:25px;height:25px;margin-bottom:8px}
  .detail-card h3{font-size:11px}
  .detail-card p{font-size:9px;line-height:1.6}
  .visual-note{text-align:left;font-size:8px;line-height:1.6;margin-top:13px}
}