*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#142447;font:16px/1.65 Inter,system-ui,sans-serif;background:#fff}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}a:focus-visible,select:focus-visible{outline:3px solid #548afa;outline-offset:4px}.wrap{width:min(1140px,90%);margin:auto}.bar{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px}.brand{display:flex;align-items:center;gap:12px;font-weight:850;line-height:1;letter-spacing:.06em}.brand small{display:block;margin-top:5px;font-size:.65rem;letter-spacing:.15em}.mark{display:block;width:44px;height:44px;flex:none}.brand{color:#102f74}.brand small{color:#2854a4}header{border-block-end:1px solid #e4edfb}.bar nav{display:flex;gap:26px;font-weight:600}.bar label{display:flex;align-items:center;gap:8px;border:1px solid #dce4f2;border-radius:9px;padding:6px 9px}select{border:0;background:white;color:inherit;font:inherit;max-width:125px}.hero{background:linear-gradient(120deg,#fff 15%,#f0f6ff 100%);color:#102f74}.grid{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:42px;min-height:530px;padding-block:50px}.eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#2458bd}.hero .eyebrow{color:#2458bd}.hero h1{font-size:clamp(2.35rem,5.5vw,4.6rem);line-height:1.09;margin:15px 0;letter-spacing:-.035em}.intro{color:#405677;font-size:1.13rem;max-width:38ch}.button{display:inline-block;margin-top:12px;padding:12px 20px;background:#1546b0;color:#fff;border-radius:8px;font-weight:750}.hero-art{aspect-ratio:1.2;border-radius:24px;background:#142957 url(lab.webp) 65% center/cover;box-shadow:inset 0 0 0 1px #abc5ff40}.about,.docs{padding-block:65px}.about p:last-child{max-width:62ch}.docs{background:#f0f5ff}h2{font-size:clamp(1.75rem,4vw,2.8rem);line-height:1.2;margin:10px 0 20px}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.cards article{background:white;border:1px solid #dfe8fa;border-radius:14px;padding:24px}.cards strong{color:#2458bd}.cards h3{margin-bottom:4px}.cards p{margin:0}footer{background:#eaf2ff;color:#102f74;border-block-start:1px solid #dce8fa}@media(max-width:700px){header .bar{flex-wrap:wrap;padding-block:12px}.bar nav{order:3;width:100%;gap:15px;flex-wrap:wrap}.grid,.cards{grid-template-columns:1fr}.grid{min-height:0}.hero-art{aspect-ratio:1.65}.about,.docs{padding-block:42px}}
.lab-section{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(22px,5vw,70px);align-items:center;padding-block:0 64px}.lab-section figure{margin:0}.lab-section img{display:block;width:100%;height:auto;border-radius:18px;aspect-ratio:3/2;object-fit:cover}.lab-section figcaption{margin-block-start:8px;color:#4e6081;font-size:.84rem}.lab-section p{max-width:49ch}@media(max-width:700px){.lab-section{grid-template-columns:1fr;padding-block-end:42px}}
.hero-art{background-image:url(vials.webp)}.hero-figure,.factory figure{margin:0}.hero-figure figcaption,.factory figcaption{margin-block-start:8px;font-size:.84rem}.hero-figure figcaption{color:#4e6081}.factory{padding-block:0 64px}.factory img{display:block;width:100%;aspect-ratio:2.25;object-fit:cover;border-radius:18px}.factory figcaption{color:#4e6081}@media(max-width:700px){.factory{padding-block-end:42px}.factory img{aspect-ratio:1.5}}
.brand{gap:10px;letter-spacing:.085em;font-size:1.12rem;font-weight:800}.brand small{font-size:.59rem;letter-spacing:.205em;font-weight:700}.mark{width:40px;height:40px}
:root{--night:#090f1c;--panel:#101b30;--line:#273852;--accent:#8ac8ff;--muted:#b9c8df}body{background:var(--night);color:#f5f8ff}header,footer{background:var(--night);color:#f5f8ff;border-color:var(--line)}.brand{color:#fff}.brand small,.eyebrow,.hero .eyebrow,.cards strong{color:var(--accent)}.bar nav a{padding:6px 12px;border-radius:9px}.bar nav .active{background:#152b48;color:var(--accent)}.bar label{border-color:var(--line)}select{background:var(--night)}.hero{background:radial-gradient(ellipse at 3% 12%,#14294a 0,transparent 34%),radial-gradient(ellipse at 92% 70%,#152a49 0,transparent 34%),var(--night);color:#fff}.grid{min-height:690px;grid-template-columns:1fr 1fr;padding-block:clamp(58px,9vw,120px);gap:48px}.hero h1{font-size:clamp(2.75rem,5.4vw,4.65rem);max-width:11ch;margin-block:24px 18px}.hero .eyebrow{display:inline-block;border:1px solid #2b4770;border-radius:100px;padding:6px 14px;background:#11243e}.intro,.about p:last-child,.cards p,.lab-section p{color:var(--muted)}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}.button{background:#8ac8ff;color:#071a33}.button.secondary{background:transparent;border:1px solid #6a819f;color:white;padding-inline:28px}.hero-figure img,.showcase img{display:block;width:100%;height:auto;object-fit:cover;border-radius:15px}.hero-figure img{aspect-ratio:16/9;box-shadow:0 16px 60px #02071280}.hero-figure figcaption,.factory figcaption,.lab-section figcaption,.showcase figcaption{color:var(--muted);font-size:.84rem;margin-block-start:8px}.showcase,.docs{background:var(--panel);padding-block:64px;margin-block-end:64px}.showcase figure{margin:0;max-width:650px}.showcase img{aspect-ratio:16/9}.docs{margin-block-end:0}.cards article{background:var(--night);border-color:var(--line)}@media(max-width:700px){.grid{grid-template-columns:1fr;min-height:0;gap:24px}.hero h1{max-width:15ch}.bar nav{gap:4px}.bar nav a{padding-inline:8px}.showcase,.docs{padding-block:40px}.showcase{margin-block-end:42px}}
.branded-vials{position:relative}.showcase .branded-vials img{aspect-ratio:4/3}.vial-brand{position:absolute;top:45%;width:3.2%;aspect-ratio:1;transform:translateX(-50%);background:url(vial-logo.svg) center/contain no-repeat;pointer-events:none}.vial-brand-left{left:25.6%}.vial-brand-center{left:50%}.vial-brand-right{left:74.2%}
.about > p:not(.eyebrow){max-width:73ch;color:var(--muted)}.about .cards{margin-block:25px 10px}.about .cards article{background:var(--panel)}.about .cards h3{margin-block-start:0}
:root{color-scheme:light;--ink:#10223c;--muted:#465d76;--line:#dce5ef;--paper:#f1f5fa;--blue:#244f83}
html{scroll-padding-top:90px}
body{background:#fff;color:var(--ink)}
header{position:sticky;top:0;z-index:5;background:#fff;color:var(--ink);border-color:var(--line);box-shadow:0 4px 18px #10223c09}
.brand{color:#102b50}.brand small,.eyebrow,.cards strong{color:var(--blue)}
.bar nav .active,.bar nav a:hover{background:var(--paper);color:var(--blue);text-decoration:none}
select{background:#fff}
.hero{background:radial-gradient(ellipse at 82% 36%,#294f7b 0%,#122e50 45%,#081a30 83%);color:white}
.grid{min-height:580px;padding-block:70px;gap:clamp(24px,5vw,74px)}
.hero h1{max-width:13ch;font-size:clamp(2.55rem,5.7vw,4.9rem)}
.hero .intro,.hero-figure figcaption{color:#d4e2f3}
.hero .eyebrow{color:#d4e6ff;border-color:#54759a;background:#213f60}
.hero-figure img{aspect-ratio:4/3;border:1px solid #8aafd34d;box-shadow:0 26px 60px #0411247a}
.button{display:inline-flex;align-items:center;gap:12px;background:#214c80;color:white;transition:transform .2s,background .2s,box-shadow .2s}
.button:hover{transform:translateY(-2px);background:#123760;box-shadow:0 8px 20px #0e284a26;text-decoration:none}
.hero .button:not(.secondary){background:#dceafb;color:#102744}.hero .button.secondary:hover{background:#294b72}
.about .cards article,.cards article{background:white;border-color:var(--line)}
.about .cards article,.docs .cards article{transition:box-shadow .25s,transform .25s}
.about .cards article:hover,.docs .cards article:hover{transform:translateY(-4px);box-shadow:0 12px 26px #17385d15}
.factory{display:grid;grid-template-columns:1fr 1.25fr;align-items:center;gap:clamp(18px,5vw,68px)}
.factory img{aspect-ratio:16/10}
.showcase,.docs{background:var(--paper)}
.showcase>.wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(18px,5vw,68px);align-items:center}
.showcase figure{margin:0}.showcase img{aspect-ratio:16/10}
footer{background:#081a30;color:#edf5ff;border-color:#284467}
@media(prefers-reduced-motion:no-preference){
  .hero .lead{animation:enter .65s ease-out both}
  .hero-figure{animation:enter .85s .12s ease-out both}
  .entering{animation:enter .62s ease-out both}
}
@keyframes enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){html{scroll-padding-top:132px}.grid,.factory,.showcase>.wrap{grid-template-columns:1fr}.grid{min-height:0;padding-block:48px}.hero h1{max-width:15ch}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.cards article{transition:none}.button:hover,.cards article:hover{transform:none}}

.hero{position:relative;isolation:isolate}
.hero>.grid{position:relative;z-index:1}
.peptide-scene{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.peptide-chain{position:absolute;fill:none;stroke:#8fcaff;stroke-width:1.5;opacity:.24}
.peptide-chain circle{fill:#234b76;stroke:#a5d6ff}
.peptide-chain-upper{width:clamp(230px,39vw,560px);inset-block-start:0;inset-inline-end:1%}
.peptide-chain-lower{width:clamp(190px,28vw,420px);inset-block-end:-18px;inset-inline-start:18%;opacity:.17}
@media(prefers-reduced-motion:no-preference){
  .peptide-chain-upper{animation:peptide-drift 17s ease-in-out infinite alternate}
  .peptide-chain-lower{animation:peptide-drift 21s ease-in-out -8s infinite alternate-reverse}
}
@keyframes peptide-drift{
  from{transform:translate3d(0,0,0) rotate(-4deg)}
  to{transform:translate3d(-20px,20px,0) rotate(4deg)}
}
@media(max-width:700px){
  .peptide-chain-upper{inset-inline-end:-44px;opacity:.16}
  .peptide-chain-lower{inset-inline-start:-30px;opacity:.13}
}
.catalog{padding-block:60px;background:#f1f5fa;margin-block-end:64px}.catalog-note{color:var(--muted)}.catalog-search{display:grid;gap:6px;max-width:420px;font-weight:650;margin-block:20px}.catalog-search input{font:inherit;padding:10px 12px;border:1px solid #8094af;border-radius:8px;background:white;color:#10223c}.catalog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr));gap:18px;align-items:start}.catalog-card{min-width:0;background:white;border:1px solid var(--line);border-radius:13px;overflow:hidden}.catalog-pack{position:relative}.catalog-pack>img{display:block;width:100%;height:auto}.pack-label{position:absolute;left:50%;top:61%;transform:translate(-50%,-50%);display:grid;justify-items:center;line-height:1.1;gap:2px;color:#103d96;direction:ltr;font-size:clamp(9px,1.1vw,13px);letter-spacing:.07em}.pack-label img{width:19px;height:19px}.pack-label small{font-size:.66em}.catalog-info{padding:15px}.catalog-info h3{margin:0 0 12px;overflow-wrap:anywhere;unicode-bidi:plaintext}.catalog-info table{width:100%;border-collapse:collapse;font-size:.87rem}.catalog-info th,.catalog-info td{text-align:start;padding:5px 2px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.catalog-info th:last-child,.catalog-info td:last-child{text-align:end;white-space:nowrap}
.pack-label{width:34%;top:60%}.pack-product{max-width:100%;font-size:.64em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px;letter-spacing:0}

/* The label follows the proportions of the square catalog packshot. */
.catalog-pack{container-type:inline-size}
.pack-label{top:59.8%;width:37%;height:43.5%;padding:4% 1.8% 3%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1cqw;background:linear-gradient(90deg,#dce5ef 0%,#fff 19%,#f8fbff 78%,#dce5ef 100%);border-block:1.1cqw solid #143862;color:#102e53;letter-spacing:.13em}
.pack-label>img{width:8cqw;height:8cqw}
.pack-label>b{font-size:4.5cqw;line-height:1}
.pack-label>small{font-size:2.1cqw;letter-spacing:.19em}
.pack-product{margin-top:1cqw;padding-top:1.5cqw;width:100%;text-align:center;border-top:1px solid #9bb0c7;font-size:2.65cqw;font-weight:750;line-height:1.2;white-space:normal;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}

.company-address{margin-block-start:24px;padding:16px 20px;border-inline-start:3px solid #5484b8;background:var(--paper);border-radius:6px}.company-address address{font-style:normal;margin-block-start:4px;text-align:start}.footer-address{padding-block-end:24px}.footer-address .company-address{margin:0;background:#142b47;color:#edf5ff}
.reviews{background:#0b1d35;color:#f5f8ff;padding-block:clamp(44px,7vw,82px)}.review-disclosure{color:#b9d0e8}.review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:18px;margin-block-start:26px}.review-grid article{padding:24px;border:1px solid #355173;border-radius:14px;background:#132a45}.review-grid h3{color:#a9d5ff;margin:0 0 10px}.review-grid p{margin:0}
.review-grid h3{display:flex;align-items:center;gap:9px}.review-avatar{display:block;flex:0 0 52px;width:52px;height:52px;border-radius:50%;border:1px solid #6384aa;background-image:url(review-portraits.webp);background-repeat:no-repeat;background-size:300% auto}.avatar-jp{background-position:left center}.avatar-de{background-position:center}.avatar-th{background-position:right center}

.catalog-controls{text-align:center;margin-block-start:18px}.catalog-controls .button{border:0;font:inherit;font-weight:750;cursor:pointer}.catalog-controls [hidden]{display:none}

.review-grid img.review-avatar{background:none;object-fit:cover}
.review-flag{display:block;width:24px;height:18px;flex:none;border-radius:2px;box-shadow:0 0 0 1px #ffffff40}

.hero{background:radial-gradient(ellipse at 78% 42%,#173967 0%,#0d223e 43%,#071524 80%)}
.hero>.grid{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);min-height:560px;gap:clamp(26px,5vw,78px);padding-block:clamp(50px,7vw,96px)}
.hero .eyebrow{background:transparent;border:0;border-inline-start:2px solid #8ac8ff;border-radius:0;padding:0 12px;margin:0;color:#b9dbff}
.hero h1{font-size:clamp(2.3rem,4.8vw,4.35rem);line-height:1.13;max-width:16ch;text-wrap:balance;margin-block:20px 16px}
html[lang=th] .hero h1{letter-spacing:normal;max-width:none;font-size:clamp(2rem,4.5vw,3.85rem);line-height:1.22;word-break:normal}
.hero .intro{max-width:43ch;font-weight:400;color:#d0deef}
.hero .actions{margin-block-start:26px}
.hero .actions .button{margin-top:0;border-radius:8px}
.hero-figure .branded-vials{border-radius:20px;padding:0;box-shadow:0 24px 56px #020d225c}
.hero-figure img{border-radius:20px;border-color:#6194ca80;box-shadow:none}
.hero-figure figcaption{font-size:.78rem;margin-block-start:12px;color:#b8c9df}
.peptide-chain-upper{opacity:.19}.peptide-chain-lower{opacity:.12}
@media(max-width:700px){.hero>.grid{grid-template-columns:minmax(0,1fr);min-height:0;gap:30px;padding-block:42px}.hero h1{max-width:19ch}}

.hero-product-stage{position:relative;isolation:isolate;display:grid;place-items:center;min-width:0}
.hero-product-stage::before{content:"";position:absolute;z-index:-1;inset:12% 4% 1%;background:radial-gradient(ellipse at 50% 58%,#3978c049,transparent 70%);pointer-events:none}
.hero .hero-product-stage img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border:0;border-radius:0;background:none;box-shadow:none;filter:drop-shadow(0 22px 19px #020914a3)}
.hero-product-stage + figcaption{text-align:center}

.hero-lab-stage{position:relative}
.hero .hero-lab-stage img{border:0;border-radius:0;box-shadow:none;aspect-ratio:3/2;object-fit:cover;mask-image:radial-gradient(ellipse 72% 71% at 50% 47%,#000 43%,transparent 98%)}
.hero-lab-stage + figcaption{text-align:center}

/* Corporate landing page */
.hero{max-width:1450px;margin-inline:auto;background:#eaf3fb;overflow:hidden}
.hero>.grid{position:static;display:flex;min-height:clamp(500px,46vw,650px);align-items:center}
.hero .lead{position:relative;z-index:2;width:min(100%,660px)}
.hero .hero-figure{position:absolute;inset:0;z-index:0;animation:none}
.hero .hero-lab-stage{position:absolute;inset:0}
.hero .hero-lab-stage img{width:100%;height:100%;object-position:70% 44%;mask-image:none}
.hero .hero-lab-stage::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f7fbff 3%,#f2f8fdf2 31%,#eef6fbc2 53%,#e7f2fd15 100%)}
[dir=rtl] .hero .hero-lab-stage::after{transform:scaleX(-1)}
.hero .hero-figure figcaption{position:absolute;inset-block-end:18px;inset-inline-end:24px;background:#f8fbfff0;border-radius:4px;padding:5px 10px;color:#183757;margin:0}
.hero h1{color:#092d53;max-width:16ch}
.hero .intro{color:#314d69}
.hero .eyebrow{color:#21538d;border-color:#487cb0}
.hero .button:not(.secondary){background:#103e70;color:white}
.hero .button.secondary{color:#173e70;background:#ffffffbf;border-color:#7293bc}
.peptide-scene{z-index:1;opacity:.4}
.catalog{background:#08294e;color:#f1f7ff;margin-block-end:0}
.catalog-note{color:#c5d8ef}
.catalog-card{color:#10223c}
.catalog-controls .button{background:#e4effc;color:#133b65}
@media(max-width:700px){
  .hero>.grid{min-height:510px;padding-block:46px 98px}
  .hero .hero-lab-stage img{object-position:65% center}
  .hero .hero-lab-stage::after{background:linear-gradient(90deg,#f7fbfff5,#eef6fbd1)}
  .hero .hero-figure figcaption{inset-inline:12px;text-align:center}
}
.product-science{margin-block:10px;padding:10px;background:#eef5fc;border-radius:7px;font-size:.83rem;overflow-wrap:anywhere}.product-science summary{cursor:pointer;color:#164777;font-weight:750}.product-science p{margin:8px 0}.product-science dl{display:grid;grid-template-columns:1fr auto;gap:4px 8px;margin:8px 0}.product-science dd{margin:0;font-weight:650}.product-science a{text-decoration:underline;color:#164777}

.catalog-facts{background:#f4f8fc;border-block:1px solid #dce6f0}
.catalog-facts>.wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-block:24px}
.catalog-facts .wrap>div{display:grid;gap:4px;padding-inline:clamp(8px,3vw,36px);border-inline-start:1px solid #cddbea}
.catalog-facts .wrap>div:first-child{border:0;padding-inline-start:0}
.catalog-facts strong{font-size:clamp(1.3rem,3vw,2rem);color:#143f71;line-height:1.1}
.catalog-facts span{font-size:.88rem;color:#425b76}
.catalog{background:#edf3fa;color:#10223c}
.catalog-note{color:#425b76;max-width:62ch}
.catalog-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:22px}
.catalog-card{box-shadow:0 5px 20px #1636510d;border-color:#d4e0ed}
.catalog-info{padding:18px}
.catalog-info th{color:#425b76;font-weight:700}
.catalog-info td:last-child{font-variant-numeric:tabular-nums;color:#153c68;font-weight:700}
.catalog-controls .button{background:#143f71;color:white}
.peptide-education{background:#081a30;color:#f4f8ff;padding-block:clamp(48px,7vw,90px);text-align:center}.knowledge-intro{max-width:68ch;margin:0 auto 10px;color:#cadbef}.knowledge-source{color:#a9d5ff;text-decoration:underline}.knowledge-heading{font-size:clamp(1.45rem,3vw,2.3rem);line-height:1.25;margin:42px 0 20px}.knowledge-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:16px}.knowledge-grid article{background:#112941;border:1px solid #314d6a;border-radius:14px;padding:24px 16px}.knowledge-grid article>span{display:grid;place-items:center;margin:auto;width:44px;height:44px;border-radius:50%;background:#23496c;color:#b6ddff;font-size:22px}.knowledge-grid h4{margin:12px 0 6px}.knowledge-grid p{color:#cadbef;margin:0;font-size:.94rem}

.catalog-evidence{max-width:76ch;margin-block:16px 22px;padding:12px 16px;background:white;border:1px solid #d4e0ed;border-radius:9px}.catalog-evidence summary{cursor:pointer;font-weight:750;color:#143f71}.catalog-evidence dl{margin-block:12px 0}.catalog-evidence dt{font-weight:700}.catalog-evidence dd{margin:0 0 10px;color:#425b76}.catalog-evidence dd:last-child{margin-bottom:0}
.company-email{margin-block-start:12px}.company-email a{text-decoration:underline;overflow-wrap:anywhere}

.coa-section{padding-block:clamp(42px,6vw,76px);background:#f4f8fc;color:#10223c}.coa-section select{max-width:100%;width:100%;padding:10px;border:1px solid #8094af;border-radius:8px}.coa-link{display:inline-block;margin-block-start:12px;color:#164777;text-decoration:underline;font-weight:700}

.factory.factory-story{display:block}.factory-story>p{color:#425b76;max-width:72ch}.factory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px;margin-block:24px 12px}.factory-grid article{overflow:hidden;border:1px solid #d4e0ed;border-radius:14px;background:#f6f9fc}.factory-grid img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:0}.factory-grid h3,.factory-grid p{margin-inline:18px}.factory-grid h3{margin-block:16px 8px}.factory-grid p{margin-block:0 18px;color:#425b76}.factory-disclosure{font-size:.84rem}
