.ph{--navy:#34506B;--gold:#D0A840;position:relative;margin:28px 0 8px;font-family:var(--p-text);color:var(--p-ink);isolation:isolate}
.ph__shapes{position:absolute;inset:0;pointer-events:none;z-index:-1;overflow:hidden;border-radius:inherit}
.ph__shape{position:absolute;display:block}
.ph__stage{position:relative;display:grid;place-items:center}
.ph__disc{width:100%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;padding:7%;box-sizing:border-box}
.ph__disc .lpp-intro{width:100%}
.ph__disc .lpp-intro .lpp-svg{width:100%}
.ph__copy{display:flex;flex-direction:column;gap:18px;min-width:0}
.ph__kicker{display:flex;align-items:center;gap:10px;font-family:var(--p-display);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--navy)}
.ph__kicker::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--gold)}
.ph__title{font-family:var(--p-display);font-weight:600;font-size:clamp(34px,4.2vw,56px);line-height:1.02;letter-spacing:-.01em;margin:0;color:var(--p-ink);text-wrap:balance}
.ph__title em{font-style:normal;color:var(--navy)}
.ph__title .zh{display:block;font-family:"ZCOOL KuaiLe",var(--p-display);font-weight:400;font-size:.5em;letter-spacing:.12em;margin-top:10px;color:var(--navy)}
.ph__lede{font-size:clamp(17px,1.4vw,20px);line-height:1.55;margin:0;max-width:44ch;text-wrap:pretty}
.ph__lede em{font-style:normal;font-weight:700;color:var(--navy)}
.ph__lede-zh{font-size:15px;line-height:1.75;margin:0;max-width:44ch;opacity:.8}
.ph__chips{display:flex;flex-wrap:wrap;gap:8px}
.ph__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.ph__btn{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 22px;border-radius:999px;border:2px solid var(--p-ink);font-family:var(--p-display);font-weight:600;font-size:15px;text-decoration:none;color:var(--p-ink);background:#fff;box-shadow:3px 3px 0 var(--p-ink);transition:transform .15s,box-shadow .15s}
.ph__btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--p-ink);color:var(--p-ink)}
.ph__btn--primary{background:var(--navy);color:#fff}
.ph__btn--primary:hover{color:#fff}
.ph__replay{position:absolute;bottom:4%;right:4%;font-family:var(--p-display);font-weight:600;font-size:12px;letter-spacing:.06em;color:var(--navy);background:rgba(255,255,255,.85);border:1.5px solid currentColor;border-radius:999px;padding:6px 12px;cursor:pointer}
.ph__replay:hover{background:#fff}

/* A — Sun panel: one bold yellow block, logo on a white disc */
.ph[data-v="a"]{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center;padding:clamp(28px,4vw,56px);background:var(--p-yellow);border:2px solid var(--p-ink);border-radius:36px;box-shadow:6px 6px 0 var(--p-ink)}
.ph[data-v="a"] .ph__disc{max-width:500px;background:#fff;border:2px solid var(--p-ink)}
.ph[data-v="a"] .s1{width:46%;aspect-ratio:1;border-radius:50%;background:var(--navy);right:-14%;bottom:-30%}
.ph[data-v="a"] .s2{width:44px;height:44px;border-radius:50%;background:var(--p-pink);left:46%;top:8%}
.ph[data-v="a"] .s3{width:120px;height:28px;border-radius:999px;background:#fff;border:2px solid var(--p-ink);left:4%;bottom:6%}
.ph[data-v="a"] .ph__copy{background:#fff;border:2px solid var(--p-ink);border-radius:24px;padding:clamp(22px,2.6vw,36px)}

.ph__col{display:contents}

@media (max-width:900px){
.ph[data-v="a"]{grid-template-columns:1fr}
.ph[data-v="a"] .ph__disc{max-width:360px}
}
