/* APEX v5.1 / FULL STOREFRONT REDESIGN — progressive override, no changes to order logic */
:root{--apex-lime:#7546FF;--apex-bg:#070907;--apex-surface:#111510;--apex-line:#283025}
html{scroll-padding-top:105px}body{background:#070907;color:#f7f8f4;-webkit-font-smoothing:antialiased}
header{background:rgba(7,9,7,.96);border-bottom:1px solid #273024}nav{max-width:1460px;min-height:84px;padding:10px 32px}.brand-logo{width:168px;height:59px}.portal-label{font-size:10px;letter-spacing:2.3px;color:#a9d746}.nav-right{display:flex;align-items:center;gap:26px}.nav-availability{font-size:10px;letter-spacing:1.6px;color:#aeb7a8;font-weight:800;white-space:nowrap}.nav-availability i,.eyebrow-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7546FF;box-shadow:0 0 12px #c6ff0088;margin-right:7px}.nav-browse{font-size:12px;font-weight:800;text-decoration:none;color:#0a0d07;background:#7546FF;padding:13px 18px;border-radius:5px;white-space:nowrap}.nav-browse span{margin-left:8px}
.shell{max-width:1460px;padding:0 32px}.hero{padding:0;min-height:505px;display:grid;grid-template-columns:1.05fr .95fr;border-bottom:1px solid #2b3526;overflow:hidden;position:relative}.hero-copy{position:relative;z-index:1;padding:75px 20px 0 0}.hero-eyebrow,.section-kicker{font-size:10px;font-weight:850;letter-spacing:2.5px;color:#7546FF}.eyebrow-sep{margin:0 8px;color:#65714f}.hero h1{font-size:clamp(54px,6vw,100px);letter-spacing:-.075em;line-height:.97;max-width:700px;margin:26px 0 23px;font-weight:900}.hero h1 em{font-style:normal;color:#7546FF}.hero p{font-size:15px;line-height:1.85;max-width:490px;color:#abb5a7;margin:0}.hero-actions{display:flex;align-items:center;gap:25px;margin-top:28px}.hero-cta{display:inline-flex;align-items:center;gap:35px;background:#7546FF;color:#0c0f08;font-weight:850;text-decoration:none;padding:16px 20px;border-radius:5px;font-size:13px;transition:transform .18s}.hero-cta:hover{transform:translateY(-2px)}.hero-note{font-size:10px;letter-spacing:1.2px;font-weight:700;color:#a0aa9c;white-space:nowrap}.note-line{display:inline-block;width:22px;height:1px;background:#a0aa9c;vertical-align:middle;margin-right:9px}.hero-metrics{display:flex;gap:32px;margin-top:50px}.hero-metrics>div{border-left:1px solid #46553c;padding-left:15px;display:flex;flex-direction:column;gap:7px}.hero-metrics strong{font-size:23px;line-height:1;color:#f6f8f2;letter-spacing:-.05em}.hero-metrics span{font-size:9px;color:#8e9a89;letter-spacing:1.1px;font-weight:750}
.hero-art{position:relative;overflow:hidden;min-height:505px;background:radial-gradient(circle at 51% 48%,#273b14 0%,#111a0d 30%,#0a0f09 65%,transparent 85%);border-left:1px solid #202a1d}.art-grid{position:absolute;inset:0;background-image:linear-gradient(#9bce1020 1px,transparent 1px),linear-gradient(90deg,#9bce1020 1px,transparent 1px);background-size:34px 34px;mask-image:radial-gradient(circle at 50% 50%,black,transparent 76%)}.art-orbit{position:absolute;left:50%;top:50%;border:1px solid #b3ec3040;border-radius:50%;transform:translate(-50%,-50%)}.orbit-one{width:350px;height:350px}.orbit-two{width:480px;height:480px;border-style:dashed;border-color:#b3ec3022}.art-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:235px;height:235px;border:1px solid #b8ef3d66;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#172410 10%,#0b1109 75%);box-shadow:0 0 0 18px #9cd51c08,0 0 75px #b5f6261b}.art-apex{font-size:112px;font-weight:950;line-height:1;letter-spacing:-.13em;padding-right:18px;color:#f7faf3}.art-apex span{font-size:54px;color:#7546FF;vertical-align:top;letter-spacing:-.1em}.art-core-caption{font-size:11px;letter-spacing:4px;font-weight:900;color:#7546FF;margin-top:8px}.art-cross{position:absolute;color:#7546FF;font-size:20px}.cross-a{top:19%;left:21%}.cross-b{right:18%;bottom:22%}.art-coordinate{position:absolute;left:26px;bottom:25px;font-size:10px;line-height:1.9;letter-spacing:1.5px;color:#899a7a}.art-side-label{position:absolute;right:20px;top:25px;writing-mode:vertical-rl;font-size:9px;letter-spacing:2px;color:#8d9d7c}
.catalog-heading{padding:58px 0 26px;display:flex;align-items:end;justify-content:space-between;gap:20px}.catalog-heading h2{font-size:clamp(30px,3.5vw,49px);letter-spacing:-.055em;margin:10px 0 9px;line-height:1.1}.lime-period{color:#7546FF}.catalog-heading p{color:#a1ada0;font-size:13px;margin:0}.catalog-heading-badge{border:1px solid #3c4934;padding:12px 15px;border-radius:5px;color:#a9b89f;font-size:10px;font-weight:800;letter-spacing:1px;white-space:nowrap}.catalog-heading-badge span{color:#7546FF;margin-left:10px}.catalog-toolbar{border:1px solid #2e392a;background:#10150e;padding:15px 18px 4px;border-radius:9px;margin:8px 0 27px}.toolbar-label{font-size:10px;font-weight:850;letter-spacing:1.7px;color:#a5b49b;display:flex;align-items:center;gap:12px}.toolbar-line{height:1px;background:#35432e;flex:1}.controls{margin:12px 0 12px;gap:10px}.warehouse{border-radius:5px;background:#1a2117;border-color:#394633;font-size:12px;padding:12px 17px;min-height:47px}.warehouse.active{background:#7546FF;color:#080c07;border-color:#7546FF}.search{border-radius:5px;background:#090d08;min-height:47px;font-size:13px}.category-title{font-size:10px;letter-spacing:1.7px;color:#9eae95}.category-bar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#536443 transparent;padding:2px 0 13px;margin:0 0 16px}.category-button{white-space:nowrap;border-radius:5px;min-height:40px;font-size:11px;background:#131a11}.category-button.active{background:#7546FF;color:#080b06}.products-heading{display:flex;align-items:center;justify-content:space-between;margin:8px 0 17px;gap:12px}.products-title{font-size:11px;font-weight:850;letter-spacing:1.7px;display:flex;align-items:center;gap:14px;white-space:nowrap}.products-title-line{width:42px;height:1px;background:#63784f}.products-heading .small{font-size:11px}.layout{grid-template-columns:minmax(0,1fr) 308px;gap:22px}.grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}.product{border-radius:8px;background:#10150f;border-color:#2d3829;overflow:hidden}.product:hover{transform:translateY(-4px);box-shadow:0 18px 35px #0008;border-color:#c6ff0088}.product-image-frame{position:relative;background:#f2f3ee;padding:0 13px 11px}.product-image-top{display:flex;justify-content:space-between;align-items:center;padding:12px 1px 0;font-size:8px;letter-spacing:1.4px;color:#56634d;font-weight:900}.image-corner{font-size:16px;color:#647b51}.pic{height:215px;background:transparent}.pic img{object-fit:contain;mix-blend-mode:multiply}.details{padding:17px;gap:10px}.product-category{font-size:9px;color:#a2c872;font-weight:850;letter-spacing:1.3px;text-transform:uppercase;min-height:11px}.details h3{font-size:15px;min-height:41px;line-height:1.35}.meta{font-size:12px;color:#a4b09f}.stock{font-size:10px;letter-spacing:.4px}.price-row{display:flex;align-items:baseline;justify-content:space-between;gap:5px;margin-top:5px}.price{font-size:23px;color:#f8fbf5}.price-unit{font-size:9px;color:#869480;letter-spacing:1px;font-weight:750}.view-info{border:1px solid #35482a;border-radius:5px;background:transparent;color:#c8e9a3;text-align:left;display:flex;justify-content:space-between;padding:12px;font-size:12px}.add{border-radius:5px;font-size:12px;min-height:45px;font-weight:900;letter-spacing:.2px}.panel{border-radius:9px;background:#11170f;top:106px}.panel h2{font-size:23px}.apex-floating{border-radius:7px;padding:14px 22px;font-size:13px}.apex-cart-drawer{background:#0e130c}.apex-dialog{border-radius:10px}footer{border-top:1px solid #2a3427;margin-top:75px;padding:35px 0 45px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8e9c86;font-size:11px}.footer-brand{font-weight:950;font-size:20px;letter-spacing:-1px;color:white}.footer-brand span{color:#7546FF}
@media(max-width:1100px){.hero h1{font-size:clamp(52px,6vw,76px)}.hero-copy{padding-top:65px}.hero-metrics{gap:16px}.layout{grid-template-columns:minmax(0,1fr) 285px}.grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}.hero-art{min-height:460px}.hero{min-height:460px}}
@media(max-width:850px){.hero{grid-template-columns:1fr;min-height:0}.hero-copy{padding:58px 0 40px}.hero h1{max-width:680px}.hero-art{min-height:260px;border:1px solid #273521;border-radius:8px;margin-bottom:25px}.art-core{width:145px;height:145px}.art-apex{font-size:67px}.art-apex span{font-size:33px}.orbit-one{width:210px;height:210px}.orbit-two{width:320px;height:320px}.art-core-caption{font-size:8px}.art-side-label{font-size:7px}.layout{display:block}.layout>aside.panel{display:none}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.catalog-heading{padding-top:38px}.hero-metrics{margin-top:38px}.nav-availability{display:none}}
@media(max-width:600px){nav{padding:9px 16px;min-height:70px}.brand-logo{width:126px;height:46px}.portal-label{font-size:8px;letter-spacing:1.1px;padding-left:9px}.nav-browse{padding:11px 12px;font-size:10px}.shell{padding:0 16px}.hero-copy{padding:45px 0 32px}.hero h1{font-size:clamp(48px,12vw,68px);letter-spacing:-.07em;margin:19px 0}.hero p{font-size:13px;line-height:1.75}.hero-actions{gap:15px;flex-wrap:wrap}.hero-cta{padding:14px 16px;font-size:12px}.hero-note{font-size:9px}.hero-metrics{gap:12px;margin-top:32px}.hero-metrics>div{padding-left:10px}.hero-metrics strong{font-size:19px}.hero-metrics span{font-size:8px;letter-spacing:.3px}.hero-art{min-height:210px}.catalog-heading{padding:35px 0 20px}.catalog-heading h2{font-size:35px}.catalog-heading-badge{display:none}.catalog-toolbar{padding:13px 12px 4px}.controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}.warehouse{padding:10px 5px;font-size:11px;min-width:0}.search{grid-column:1/-1;width:100%;min-width:0}.grid{gap:10px}.product-image-frame{padding:0 7px 7px}.product-image-top{font-size:7px;padding-top:9px}.pic{height:clamp(155px,42vw,205px)}.details{padding:11px;gap:8px}.details h3{font-size:13px;min-height:36px}.meta{font-size:11px}.price{font-size:19px}.price-unit{font-size:8px}.view-info{padding:10px 8px;font-size:11px}.add{font-size:11px;min-height:43px}.apex-floating{left:12px;right:12px;bottom:12px;min-height:51px}.products-title{font-size:9px;letter-spacing:1px}.products-title-line{width:20px}footer{margin-top:50px;display:block;line-height:2;padding-bottom:90px}}
@media(max-width:380px){.portal-label{display:none}.hero h1{font-size:46px}.hero-metrics span{font-size:7px}.pic{height:145px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* NYTE Peptides v5.2: approved vial photograph replaces abstract A+ hero art. */
.hero-art.apex-vial-hero{
  background:#050905 url("apex-v52-hero-vials.webp") center center / cover no-repeat;
  border-left:1px solid #202a1d;
  min-height:505px;
}
@media(max-width:1100px){.hero-art.apex-vial-hero{min-height:460px}}
@media(max-width:850px){.hero-art.apex-vial-hero{min-height:clamp(290px,90vw,550px);background-position:center center}}
@media(max-width:480px){.hero-art.apex-vial-hero{min-height:clamp(275px,94vw,430px);background-size:cover}}

/* v5.2 mobile homepage: approved mockup-inspired presentation, original NYTE Peptides implementation. */
.apex-mobile-nav,.apex-mobile-menu,.apex-mobile-research-cta,.apex-mobile-trust{display:none}
@media(max-width:700px){
  header{z-index:50;background:#050907}
  nav{min-height:70px;padding:8px 16px;gap:12px}
  .brand-logo{width:min(43vw,170px);height:53px}
  .portal-label,.nav-right{display:none!important}
  .apex-mobile-nav{display:flex;align-items:center;gap:7px;margin-left:auto}
  .apex-mobile-nav a,.apex-mobile-nav button{display:flex;align-items:center;justify-content:center;width:38px;height:42px;background:none;border:0;color:#f5fff7;text-decoration:none;font-size:24px;cursor:pointer}
  .apex-mobile-nav button:focus-visible,.apex-mobile-nav a:focus-visible{outline:2px solid #3dff83;outline-offset:2px}
  .apex-mobile-menu:not([hidden]){display:grid;gap:0;background:#0b130e;border-top:1px solid #24432e;padding:7px 16px 12px}
  .apex-mobile-menu a{color:#eaffec;text-decoration:none;padding:13px 8px;border-bottom:1px solid #24382a;font-size:14px}
  .shell{padding:0 15px}
  .hero{display:flex;flex-direction:column;gap:0;min-height:0;padding:0!important;margin:0}
  .hero-art.apex-vial-hero{order:0;width:calc(100% + 30px);margin:0 -15px!important;min-height:0!important;height:auto;aspect-ratio:1.22;background-size:cover;background-position:center center;border:0!important;border-radius:0!important}
  .hero-copy{order:1;padding:18px 0 24px!important}
  .hero-eyebrow{color:#3cff84;font-size:11px;letter-spacing:4px}
  .hero h1{font-size:clamp(36px,8.5vw,56px)!important;letter-spacing:-.055em;line-height:1.06;margin:13px 0 12px;max-width:620px}
  .hero h1 em{color:#3cff84}
  .hero p{font-size:13px;line-height:1.65;color:#c3c9c3;max-width:560px}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:20px}
  .hero-cta,.apex-mobile-research-cta{display:flex;align-items:center;justify-content:center;gap:16px;min-height:54px;border-radius:7px;text-decoration:none;font-size:14px;font-weight:800}
  .hero-cta{background:#3dff72;color:#06100a}
  .apex-mobile-research-cta{border:1px solid #6b8470;color:#f4fff6;background:#080d0a}
  .hero-note,.hero-metrics{display:none!important}
  .apex-mobile-trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:24px;padding:18px 0 8px;border-bottom:1px solid #223126}
  .apex-mobile-trust span{display:flex;align-items:center;flex-direction:column;gap:8px;text-align:center;color:#3cff84;font-size:24px}
  .apex-mobile-trust b{font-size:9px;line-height:1.35;color:#e6f3e8;font-weight:700}
  .catalog-heading{padding:30px 0 18px}
  .catalog-heading h2{font-size:30px}
  .grid{grid-template-columns:1fr!important;gap:18px}
  .product-image-frame{padding:0 12px 12px}
  .pic{height:clamp(235px,65vw,340px)!important}
  .details{padding:17px;gap:10px}
  .details h3{font-size:19px;min-height:0}
  .price{font-size:24px}
  .add{min-height:51px;font-size:13px}
  .apex-v52-trust{margin:46px 0}
}
@media(min-width:701px){.apex-mobile-nav,.apex-mobile-menu,.apex-mobile-research-cta,.apex-mobile-trust{display:none!important}}

/* v5.2: show both full vials without clipping at any viewport. */
.hero-art.apex-vial-hero{background-color:#050905;background-image:url("apex-v52-hero-vials.webp");background-repeat:no-repeat;background-position:center;background-size:contain!important}
@media(min-width:851px){.hero-art.apex-vial-hero{background-size:96% auto!important}}
@media(max-width:850px){.hero-art.apex-vial-hero{background-size:contain!important}}

/* Wide reference hero: keep the original vial image, fill right side with full-height image. */
@media(min-width:851px){
.hero{position:relative;isolation:isolate;min-height:clamp(560px,43vw,710px)}
.hero-copy{position:relative;z-index:2;padding-top:clamp(65px,7vw,120px)}
.hero-art.apex-vial-hero{position:absolute;inset:0 0 0 39%;width:61%;height:100%;min-height:0;border:0;border-radius:0;background-color:#050905;background-image:url("apex-v52-hero-vials.webp");background-repeat:no-repeat;background-position:center center;background-size:auto 100%!important}
.hero-art.apex-vial-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#050905 0%,rgba(5,9,5,.6) 10%,transparent 32%);pointer-events:none}
}
@media(max-width:850px){.hero-art.apex-vial-hero{background-image:url("apex-v52-hero-vials.webp");background-color:#050905;background-size:contain!important;background-position:center}}

/* v5.2 full-bleed hero layout — overrides older split-panel layout.
   The original vial photo is positioned on the RIGHT at its complete height.
   Copy floats over a dark gradient on the LEFT. No panel edge. */
@media (min-width: 851px) {
  .shell .hero {
    display:block !important;
    position:relative !important;
    isolation:isolate;
    min-height:clamp(600px,46vw,710px) !important;
    overflow:hidden;
    background:#050805;
    padding:0 !important;
    border-bottom:1px solid #263320;
  }
  .shell .hero .hero-art.apex-vial-hero {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    margin:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background-color:#050805 !important;
    background-image:url("apex-v52-hero-vials.webp") !important;
    background-position:right center !important;
    background-repeat:no-repeat !important;
    background-size:auto 100% !important;
    z-index:0;
  }
  .shell .hero .hero-art.apex-vial-hero::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#050805 0%,#050805 22%,rgba(5,8,5,.97) 32%,rgba(5,8,5,.74) 43%,rgba(5,8,5,.08) 60%,transparent 74%);
    pointer-events:none;
  }
  .shell .hero .hero-copy {
    position:relative !important;
    z-index:2 !important;
    width:min(55%,710px) !important;
    padding:clamp(78px,8vw,115px) 0 45px clamp(12px,2.2vw,32px) !important;
    box-sizing:border-box;
  }
  .shell .hero h1 {
    font-size:clamp(49px,4.65vw,74px) !important;
    line-height:1.05 !important;
    letter-spacing:-.055em !important;
    max-width:690px !important;
    margin:24px 0 24px !important;
  }
  .shell .hero p {max-width:510px !important;font-size:15px !important;line-height:1.8 !important;}
  .shell .hero .hero-metrics {margin-top:38px;}
}
@media (min-width:851px) and (max-width:1100px) {
  .shell .hero .hero-copy {width:59% !important;}
  .shell .hero h1 {font-size:clamp(43px,5vw,57px) !important;}
}
@media (max-width:850px) {
  /* Mobile keeps the approved image-first design; display full vial photo. */
  .shell .hero .hero-art.apex-vial-hero {
    background-size:contain !important;
    background-position:center center !important;
    background-color:#050805 !important;
  }
}

/* v5.2 mobile hero correction — image is the actual approved NYTE Peptides master.
   Copy sits ON the artwork (left side), never in a second section below. */
@media (max-width:700px) {
  :root { --apex-lime:#7546FF !important; }
  .shell .hero {
    position:relative !important; display:block !important; isolation:isolate;
    min-height:420px !important; margin:0 -15px !important;
    padding:0 15px 22px !important; overflow:hidden !important;
    background:#050805 !important; border-bottom:1px solid #293321;
  }
  .shell .hero .hero-art.apex-vial-hero {
    position:absolute !important; inset:0 !important; z-index:-1 !important;
    order:unset !important; width:100% !important; height:100% !important;
    min-height:0 !important; margin:0 !important; border:0 !important;
    border-radius:0 !important; aspect-ratio:auto !important;
    background-color:#050805 !important;
    background-image:url('apex-v52-hero-vials.webp') !important;
    background-size:100% auto !important; background-position:center top !important;
    background-repeat:no-repeat !important;
  }
  .shell .hero .hero-art.apex-vial-hero::after {
    content:'';position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(90deg,rgba(3,6,3,.95) 0%,rgba(3,6,3,.88) 27%,rgba(3,6,3,.47) 48%,rgba(3,6,3,.05) 78%),
      linear-gradient(0deg,#050805 3%,rgba(5,8,5,.8) 24%,transparent 63%);
  }
  .shell .hero .hero-copy {
    position:relative !important; z-index:2 !important; order:unset !important;
    padding:23px 0 0 !important; width:100% !important; max-width:none !important;
    box-sizing:border-box !important;
  }
  .shell .hero .hero-eyebrow {color:#7546FF !important;font-size:9px !important;letter-spacing:1.7px !important;max-width:56%;}
  .shell .hero .eyebrow-dot {background:#7546FF !important;box-shadow:0 0 12px #c6ff0088 !important;}
  .shell .hero h1 {
    font-size:clamp(23px,6.1vw,32px) !important; line-height:1.11 !important;
    letter-spacing:-.045em !important;max-width:55% !important;
    margin:12px 0 10px !important; overflow-wrap:normal;
  }
  .shell .hero h1 em {color:#7546FF !important;}
  .shell .hero p {
    font-size:11px !important;line-height:1.45 !important;color:#e0e5d9 !important;
    max-width:54% !important; margin:0 !important;
  }
  .shell .hero .hero-actions {
    display:grid !important;grid-template-columns:1fr !important;gap:9px !important;
    margin-top:24px !important;max-width:100% !important;
  }
  .shell .hero .hero-cta,.shell .hero .apex-mobile-research-cta {
    min-height:47px !important;border-radius:6px !important;
    font-size:13px !important;font-weight:850 !important;
  }
  .shell .hero .hero-cta {background:#7546FF !important;color:#080b05 !important;}
  .shell .hero .apex-mobile-research-cta {border-color:#55643c !important;color:#fff !important;background:#11190fe8 !important;}
  .shell .hero .apex-mobile-trust {margin-top:14px !important;padding-top:12px !important;}
  .shell .hero .apex-mobile-trust span {color:#7546FF !important;}
  .apex-mobile-nav button:focus-visible,.apex-mobile-nav a:focus-visible {outline-color:#7546FF !important;}
}
@media (max-width:370px) {
  .shell .hero h1 {font-size:22px !important;}
  .shell .hero p {font-size:10px !important;}
}
