.peptide-hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(135deg,#071e2e 0%,#0a2d42 40%,#0b3350 100%);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#fff;box-sizing:border-box;margin:0;padding:0}
.peptide-hero *,.peptide-hero *::before,.peptide-hero *::after{box-sizing:border-box}
.peptide-hero p,.peptide-hero h1{margin:0}
.peptide-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.ph-overlay{position:absolute;inset:0;z-index:1;pointer-events:none}
.ph-ov-1{background:linear-gradient(135deg,rgba(7,30,46,.82) 0%,rgba(10,45,66,.7) 50%,rgba(11,51,80,.82) 100%)}
.ph-ov-2{background:radial-gradient(at 50% 40%,rgba(6,182,212,.18) 0%,transparent 65%)}
.ph-ov-3{background:radial-gradient(transparent 30%,rgba(0,0,0,.5) 100%)}
.ph-ov-top{top:0;left:0;right:0;height:6rem;background:linear-gradient(rgba(7,30,46,1),transparent);z-index:2;position:absolute;inset:auto}
.ph-ov-bottom{bottom:0;left:0;right:0;height:8rem;background:linear-gradient(to top,rgba(7,30,46,1),transparent);z-index:2;position:absolute;inset:auto}
.ph-grid{background-image:linear-gradient(rgba(6,182,212,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(6,182,212,.04) 1px,transparent 1px);background-size:60px 60px}

.hero-decor{position:absolute;z-index:4;filter:drop-shadow(0 0 18px rgba(6,182,212,.3));pointer-events:none}
.helix-tl{top:8%;left:3%;animation:phHelix 7s ease-in-out 0s infinite alternate}
.helix-tr{top:12%;right:4%;animation:phHelix 7s ease-in-out 1.5s infinite alternate}
.helix-bl{top:55%;left:1%;animation:phHelix 7s ease-in-out .8s infinite alternate}
.helix-br{top:58%;right:2%;animation:phHelix 7s ease-in-out 2s infinite alternate}
.mol-1{top:32%;left:9%;animation:phRing 8s ease-in-out .4s infinite alternate}
.mol-2{top:42%;right:8%;animation:phRing 8s ease-in-out 1.8s infinite alternate}
.mol-3{top:72%;left:18%;animation:phRing 8s ease-in-out 1s infinite alternate}
.mol-4{top:20%;right:20%;animation:phRing 8s ease-in-out 2.5s infinite alternate}
@keyframes phHelix{0%{transform:translate(0,0)}100%{transform:translate(8px,-16px)}}
@keyframes phRing{0%{transform:translate(0,0) rotate(0) scale(1)}100%{transform:translate(-6px,10px) rotate(12deg) scale(1.05)}}
@keyframes phData{0%{transform:translateY(0)}100%{transform:translateY(-10px)}}

.hero-mol3d{position:absolute;z-index:3;pointer-events:none;width:clamp(220px,28vw,440px);height:auto;opacity:.35;mix-blend-mode:screen;filter:drop-shadow(0 0 30px rgba(6,182,212,.45))}
.hero-mol3d-tl{top:-40px;left:-60px;transform:rotate(-8deg);animation:phMolA 9s ease-in-out infinite alternate}
.hero-mol3d-br{bottom:-60px;right:-70px;transform:rotate(165deg);animation:phMolB 11s ease-in-out infinite alternate}
@keyframes phMolA{0%{transform:translate(0,0) rotate(-8deg)}100%{transform:translate(14px,18px) rotate(-4deg)}}
@keyframes phMolB{0%{transform:translate(0,0) rotate(165deg)}100%{transform:translate(-16px,-14px) rotate(170deg)}}

.hero-data-card{position:absolute;z-index:5;background:rgba(7,30,46,.65);border:1px solid rgba(34,211,238,.2);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:12px;padding:10px 16px;min-width:120px;animation:phData 6s ease-in-out .3s infinite alternate}
.hero-data-label{color:rgba(103,232,249,.5);font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin:0 0 2px}
.hero-data-value{color:rgba(255,255,255,.92);font-size:18px;font-weight:800;line-height:1;margin:0}
.hero-data-unit{font-size:11px;color:rgba(103,232,249,.6);margin-left:3px}

.ph-center-glow{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:3}
.ph-center-glow>div{width:900px;height:520px;background:radial-gradient(rgba(6,182,212,.22) 0%,rgba(20,184,166,.1) 40%,transparent 70%);filter:blur(70px)}

.peptide-hero-content{position:relative;z-index:10;width:100%;max-width:64rem;margin:0 auto;padding:3rem 1.5rem 5rem;text-align:center}
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:999px;background:rgba(6,182,212,.12);border:1px solid rgba(34,211,238,.35);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);margin-bottom:32px;font-size:12px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#a5f3fc}
.hero-badge-dot{width:8px;height:8px;border-radius:50%;background:#22d3ee;animation:phPulse 2s ease-in-out infinite;display:inline-block}
@keyframes phPulse{50%{opacity:.4}}

.hero-title{font-weight:900;letter-spacing:-.02em;line-height:1;margin:0 0 24px;color:#fff;font-size:clamp(2.6rem,8vw,5.5rem)}
.hero-title-grad{background:linear-gradient(90deg,#22d3ee 0%,#67e8f9 40%,#2dd4bf 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero-desc{font-size:clamp(1rem,1.6vw,1.25rem);max-width:640px;margin:0 auto 32px;line-height:1.6;font-weight:300;color:rgba(165,243,252,.78)}
.hero-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:40px}
.hero-tag{padding:6px 14px;border-radius:999px;font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.05em;background:rgba(6,182,212,.08);border:1px solid rgba(34,211,238,.3);color:rgba(165,243,252,.85);backdrop-filter:blur(6px)}
.hero-buttons{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
@media(min-width:640px){.hero-buttons{flex-direction:row}}
.hero-btn-primary{display:inline-block;text-decoration:none;padding:16px 36px;border-radius:14px;font-weight:900;color:#fff;font-size:13px;letter-spacing:.18em;text-transform:uppercase;background:linear-gradient(135deg,#0e7490 0%,#06b6d4 100%);box-shadow:0 8px 40px rgba(6,182,212,.45);border:none;cursor:pointer;transition:transform .2s}
.hero-btn-primary:hover{transform:translateY(-2px);color:#fff}
.hero-btn-secondary{display:inline-block;text-decoration:none;padding:16px 36px;border-radius:14px;font-weight:600;font-size:13px;background:rgba(255,255,255,.06);border:1px solid rgba(34,211,238,.25);color:rgba(165,243,252,.85);backdrop-filter:blur(10px);cursor:pointer;transition:color .2s}
.hero-btn-secondary:hover{color:#fff}

.hero-scroll{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;z-index:10;color:rgba(103,232,249,.5);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.ph-bounce{animation:phBounce 1s infinite}
@keyframes phBounce{0%,100%{transform:translateY(-25%)}50%{transform:translateY(0)}}

@media(max-width:860px){.mol-3,.mol-4{display:none}.helix-bl,.helix-tr{opacity:.55;transform:scale(.85)}}
@media(max-width:640px){.peptide-hero{min-height:760px}.hero-data-card{min-width:92px;padding:8px 12px}.hero-data-value{font-size:14px}.helix-tl,.helix-br{opacity:.45;transform:scale(.7)}.helix-bl,.helix-tr{display:none}.mol-1,.mol-2{opacity:.55;transform:scale(.8)}.hero-mol3d{width:200px;opacity:.25}.hero-mol3d-tl{top:-20px;left:-40px}.hero-mol3d-br{bottom:-30px;right:-40px}}
