/* Shared, resolution-independent UI icons. */
.vector-icon{display:inline-block;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;flex-shrink:0}
.tab .vector-icon{margin-left:0;color:inherit}
.restored-brand{font-family:Manrope,"Segoe UI",sans-serif;font-size:27px;font-weight:500;letter-spacing:-1.25px;gap:0;color:#20221e}
footer .restored-brand{font-size:24px}footer .molecule-symbol{width:37px;height:37px}
.header-search{border-radius:12px;background:#fafbf9}.button,.cart-button{border-radius:11px}.cart-trigger{border-radius:12px;padding:10px 0 10px 12px}
.product-image{border-radius:18px}.zoom-label{border-radius:10px;background:#ffffffed}.product-code{border-radius:5px}.quantity{border-radius:10px;overflow:hidden}.quantity button:hover{background:#f3f3ee}.detail-image{border-radius:16px;overflow:hidden}
dialog{border-radius:22px}.dialog-close{border-radius:50%;background:#f6f7f3}#cart-dialog{border-radius:22px 0 0 22px}.cart-row img{border-radius:10px}#toast{border-radius:12px}.research-note>span{border-radius:5px}
.product-info{border:0;gap:16px;padding:0;margin:6px 0 0}.info-item{border:1px solid #e9eae4;border-radius:16px;padding:24px;background:#fafbf8;column-gap:14px}.info-item>.icon{width:30px;height:30px}.research-note{padding-top:25px}
.sort-label{border-radius:10px}.tab:after{border-radius:3px}.label-grid figure{border-radius:18px}.label-grid img{border-radius:9px}.icon-gallery{border-radius:16px;overflow:hidden}

/* Campaign banner: typography remains live HTML over the generated photography. */
.hero.campaign{display:block;grid-template-columns:none;min-height:0;height:clamp(450px,37.8vw,600px);margin-top:26px;border-radius:22px;background:#f4f6f5;box-shadow:0 10px 32px #2731260b;isolation:isolate}
.hero-slide{position:absolute;inset:0}.hero-slide[hidden]{display:none}.hero-art{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:center}
.campaign-copy{position:relative;z-index:1;width:46%;height:100%;padding:clamp(34px,4vw,65px) 0 65px clamp(30px,3.6vw,58px);display:flex;align-items:flex-start;flex-direction:column}
.campaign h1,.campaign h2{font-family:var(--font);font-size:clamp(36px,3.45vw,55px);font-weight:750;letter-spacing:-1.8px;line-height:1.08;color:#202923}
.campaign .campaign-description{font-size:15px;line-height:1.6;color:#58615b;margin-top:18px}
.hero-features{display:flex;gap:0;width:90%;max-width:360px;margin-top:26px}
.hero-features>div{display:flex;align-items:center;flex-direction:column;gap:9px;flex:1;text-align:center;padding:0 12px;border-right:1px solid #d9ded8}.hero-features>div:first-child{padding-left:0}.hero-features>div:last-child{border:0}.hero-features .icon{height:27px;width:27px;stroke-width:1.5;color:#d47916}.hero-features span{font-size:11px;font-weight:550;white-space:nowrap}
.campaign .button{margin-top:26px;background:#ed9b16;color:#1e291f;border:1px solid #e5950d;box-shadow:0 4px 12px #c47b1114;gap:22px;padding:13px 19px;font-size:13px}.campaign .button:hover{background:#ffb22b}
.campaign .hero-research{font-size:10px;line-height:1.4;color:#737b74;margin-top:11px}
.hero-controls{position:absolute;bottom:20px;left:clamp(30px,3.6vw,58px);right:25px;display:flex;align-items:center;justify-content:space-between;z-index:2;pointer-events:none}.hero-controls button{pointer-events:auto}
.hero-pagination{display:flex;gap:7px}.hero-dot{width:58px;height:25px;display:flex;align-items:center;background:none}.hero-dot:before{content:"";display:block;width:100%;height:3px;border-radius:4px;background:#c9cec7}.hero-dot.active:before{background:#ed9b16}.hero-dot:hover:before{background:#b87514}
.hero-arrows{display:flex;align-items:center;gap:8px}.hero-counter{font:11px var(--mono);color:#626d62;margin-right:9px}.hero-arrows button{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#ffffffed;border:1px solid #dde1d7;box-shadow:0 2px 8px #00000005}.hero-arrows button:hover{background:#f6ae37;border-color:#f6ae37}.hero-arrows .icon{width:17px;height:17px;stroke-width:1.6}
@media(min-width:1650px){.campaign-copy{padding-top:60px}.hero.campaign{height:570px}}
@media(max-width:1100px){.hero.campaign{height:460px}.campaign-copy{width:49%;padding-top:35px}.campaign h1,.campaign h2{font-size:38px}.hero-features{margin-top:22px}.campaign .button{margin-top:22px}.campaign .campaign-description{font-size:14px}.info-item{padding:19px}.info-item p{font-size:12px}}
@media(max-width:760px){.hero.campaign{height:650px;border-radius:18px}.hero-art{height:310px;top:auto;bottom:0;object-fit:cover;object-position:80% center;width:170%;left:-70%}.campaign-copy{width:100%;height:auto;padding:27px 25px}.campaign h1,.campaign h2{font-size:35px;letter-spacing:-1.4px}.campaign .campaign-description{margin-top:12px}.hero-features{max-width:300px;margin-top:18px}.hero-features .icon{width:23px;height:23px}.campaign .button{margin-top:18px}.campaign .hero-research{font-size:9px;margin-top:8px}.hero-controls{left:24px;bottom:15px;right:18px}.hero-arrows button{width:32px;height:32px}.hero-counter{display:none}.product-info{grid-template-columns:1fr}.info-item{padding:22px}.product-image{border-radius:13px}.cart-button{border-radius:9px}}

/* The introduction stays in place; only the illustrated product panels change. */
.educational-slide{background:linear-gradient(110deg,#f9faf9,#f1f3f0)}
.vial-diagram,.storage-diagram{position:absolute;left:45%;right:20px;top:26px;bottom:57px}
.banner-heading{text-align:center;position:relative;z-index:2}.banner-heading>span{font-size:9px;letter-spacing:1.8px;font-weight:550;color:#9b7b3b}.campaign .banner-heading h2{font-size:clamp(21px,1.9vw,30px);letter-spacing:-.7px;line-height:1.2;margin-top:7px;font-weight:600}
.diagram-vial{position:absolute;top:19%;left:21%;width:58%;height:81%;object-fit:contain;mix-blend-mode:multiply}
.callout-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
.vial-callout{display:flex;align-items:center;gap:9px;position:absolute;z-index:2;background:#ffffffee;border:1px solid #e6e8e1;border-radius:15px;padding:14px 11px;width:31%;box-shadow:0 4px 12px #1c251008}
.vial-callout .icon{width:25px;height:25px;color:#d79820;stroke-width:1.4}.vial-callout h3{font-size:12px;font-weight:600;line-height:1.25}.campaign .vial-callout p{font-size:10px;color:#70796e;margin-top:5px;line-height:1.45}
.callout-cap{left:0;top:22%}.callout-crimp{right:0;top:33%}.callout-glass{left:0;top:65%}.callout-dose{right:0;top:76%}
.storage-diagram{padding:0 9px}.storage-visual{height:42%;position:relative;margin:4px 0 10px}.storage-visual>img{height:100%;width:29%;object-fit:contain;mix-blend-mode:multiply;position:absolute;left:0;top:0}
.storage-path{position:absolute;left:30%;right:2%;top:46%;display:flex;align-items:center}.storage-path>div{width:51px;height:51px;border:1px solid #eadcba;background:#fff9eb;border-radius:50%;display:grid;place-items:center;flex-shrink:0}.storage-path .icon{width:27px;height:27px;stroke-width:1.45;color:#cd901e}.storage-path>span{height:1px;background:#dec78d;flex:1;position:relative}.storage-path>span:after{content:'';position:absolute;left:50%;top:-2px;width:5px;height:5px;background:#dda938;border-radius:50%}
.storage-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.storage-card{border-top:1px solid #d8ddd4;padding:15px 2px 0}.storage-card>.icon{display:none}.storage-card h3{font-size:13px;font-weight:600}.campaign .storage-card p{font-size:11px;line-height:1.6;margin-top:8px;color:#6c7568}.campaign .storage-footnote{font-size:10px;text-align:center;color:#8c9486;margin-top:22px}
@media(min-width:1650px){.vial-callout{padding:19px 13px}.vial-callout h3{font-size:14px}.campaign .vial-callout p{font-size:12px}.storage-card h3{font-size:15px}.campaign .storage-card p{font-size:13px}.storage-visual{height:44%}}
@media(max-width:1100px) and (min-width:761px){.vial-diagram,.storage-diagram{left:48%;right:12px}.vial-callout{padding:10px 8px;gap:6px;width:34%}.vial-callout .icon{width:20px;height:20px}.vial-callout h3{font-size:10px}.campaign .vial-callout p{font-size:9px}.campaign .banner-heading h2{font-size:22px}.storage-cards{gap:8px}.storage-card h3{font-size:11px}.campaign .storage-card p{font-size:10px}.campaign .storage-footnote{font-size:9px;margin-top:14px}.storage-path>div{width:42px;height:42px}}
@media(max-width:760px){.hero.campaign{height:790px}.campaign .hero-art{height:410px}.vial-diagram,.storage-diagram{left:15px;right:15px;top:363px;bottom:58px}.campaign .banner-heading h2{font-size:23px}.vial-callout{width:34%;padding:11px 8px;gap:6px}.vial-callout .icon{width:19px;height:19px}.vial-callout h3{font-size:10px}.campaign .vial-callout p{font-size:9px}.storage-path>div{width:41px;height:41px}.storage-card h3{font-size:11px}.campaign .storage-card p{font-size:10px}.storage-cards{gap:10px}.campaign .storage-footnote{font-size:9px;margin-top:14px}}
.diagram-vial{top:17%;left:20%;width:60%;height:83%;filter:brightness(1.055)}.storage-visual>img{filter:brightness(1.055)}
