.coouv-campaign, .coouv-campaign * { box-sizing: border-box; }
.coouv-mobile-link { display:none; }
@media(max-width:980px) {
  .coouv-campaign .coouv-mobile-link {
    position:absolute; z-index:4; right:4%; bottom:8%;
    display:inline-flex; align-items:center; justify-content:center; isolation:isolate;
    width:128px; height:44px; max-width:44%; padding:0 22px;
    border:0; border-radius:0;
    background:transparent; color:#fff; text-decoration:none;
    font:800 11px/1.3 Arial,'Microsoft YaHei',sans-serif;
    letter-spacing:.03em;
  }
  .coouv-mobile-link .specular-link__label { width:100%; text-align:center; }
  .coouv-mobile-link .specular-link__arrow { position:absolute; right:7px; top:50%; transform:translateY(-50%); font-size:19px; line-height:1; }
  .coouv-mobile-link:focus-visible { outline:2px solid #25c4ff; outline-offset:3px; }
  .coouv-mobile-link:active { filter:brightness(1.2); }
}

    .coouv-campaign { margin:0; padding:0; color:#102337; background:#fff; position:relative; width:100%; height:100svh; max-height:65vw; min-height:420px; overflow:hidden; isolation:isolate; }
    .coouv-photos { position:absolute; inset:0; background:linear-gradient(180deg,#fff 0%,#fff 63%,#c4c9cf 72%,#263748 79%,#0c1d2f 86%,#0c1d2f 100%); }
    /* A continuous lower fade keeps white dividers out of the white logo. */
    .coouv-campaign::after { content:''; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 65%,rgba(12,29,47,.15) 74%,rgba(12,29,47,.62) 84%,rgba(12,29,47,.9) 100%); }
    .coouv-panel { --edge-inset:clamp(2px,.4vw,8px); position:absolute; top:0; bottom:0; margin:0; overflow:hidden; clip-path:polygon(calc(15% + var(--edge-inset)) 0,calc(100% - var(--edge-inset)) 0,calc(85% - var(--edge-inset)) 100%,var(--edge-inset) 100%); }
    .coouv-panel { background:#f3f2f3; }
    /* Normalize subject scale per original photograph, rather than cover-fill. */
    .coouv-panel img { position:absolute; top:var(--photo-top); left:var(--photo-x,50%); display:block; width:auto; max-width:none; height:var(--photo-height); transform:translateX(-50%); }
    .coouv-panel:nth-child(1) { --photo-height:100%; --photo-top:0%; --photo-x:57%; }
    .coouv-panel:nth-child(2) { --photo-height:110%; --photo-top:0%; --photo-x:43%; }
    .coouv-panel:nth-child(3) { --photo-height:180%; --photo-top:-10%; --photo-x:49%; }
    .coouv-panel:nth-child(4) { --photo-height:104%; --photo-top:-4%; --photo-x:47%; }
    .coouv-panel:nth-child(5) { --photo-height:185%; --photo-top:-10%; --photo-x:43%; }
    .coouv-panel:nth-child(1) { left:-4%; width:27.3%; }
    .coouv-panel:nth-child(2) { left:19.4%; width:25.2%; }
    .coouv-panel:nth-child(3) { left:41.05%; width:22.8%; }
    .coouv-panel:nth-child(4) { left:60.65%; width:22.8%; }
    .coouv-panel:nth-child(5) { left:80.25%; width:25.5%; }
    .coouv-panel:nth-child(n) img { object-position:center center; }
    .coouv-panel::after { content:''; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(255,255,255,.55),transparent 12%,transparent 55%,rgba(6,20,34,.2) 73%,rgba(6,20,34,.85)); }
    .coouv-title { position:absolute; z-index:2; bottom:9%; left:3%; width:43vw; max-width:880px; margin:0; line-height:0; pointer-events:none; }
    .coouv-title img, .coouv-brand img { display:block; width:100%; height:auto; }
    .coouv-identity { position:absolute; z-index:3; inset:0; pointer-events:none; font-family:'Microsoft YaHei',sans-serif; }
    .coouv-brand { position:absolute; right:3%; bottom:21%; width:clamp(78px,9vw,172px); }
    .coouv-identity h2 { position:absolute; right:3%; bottom:17%; margin:0; color:#fff; font-size:clamp(16px,2.1vw,42px); font-weight:400; letter-spacing:.23em; }
    .coouv-identity p { position:absolute; left:3.3%; bottom:3.4%; margin:0; color:#fff; font:400 clamp(7px,.7vw,14px)/1.65 Arial,sans-serif; letter-spacing:.32em; }
    .coouv-identity p br { display:none; }
    .coouv-identity p br::after { content:' '; }
    .coouv-explore { position:absolute; z-index:3; bottom:8%; right:3%; text-decoration:none; color:#fff; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.65); padding:15px 27px; border-radius:40px; font:400 clamp(12px,.95vw,20px)/1.2 'Microsoft YaHei',sans-serif; letter-spacing:.15em; transition:background .2s; }
    .coouv-explore:hover { background:rgba(255,255,255,.16); }
    .coouv-explore:focus-visible { outline:3px solid #287bb0; outline-offset:4px; }
    @media(max-width:700px) {
      .coouv-campaign { height:auto; min-height:0; max-height:none; aspect-ratio:16/10; }
      .coouv-title { bottom:11%; }
      .coouv-brand { width:64px; bottom:26%; }
      .coouv-identity h2 { font-size:12px; bottom:21%; }
      .coouv-identity p { font-size:6px; letter-spacing:.18em; }
      .coouv-explore { bottom:7%; padding:7px 10px; font-size:9px; }
    }
/* English labels use a compact single-line heading in the same lockup. */
html[lang="en"] .coouv-identity h2 { font-size:clamp(14px,1.5vw,30px); letter-spacing:.08em; }
@media(max-width:700px) { html[lang="en"] .coouv-identity h2 { font-size:10px; letter-spacing:.02em; } }

/* Reveal more of the original photo without changing the person's scale. */
.coouv-panel {
  transition:left 520ms cubic-bezier(.22,.7,.25,1), width 520ms cubic-bezier(.22,.7,.25,1);
  clip-path:polygon(calc(var(--coouv-slant) + var(--edge-inset)) 0,calc(100% - var(--edge-inset)) 0,calc(100% - var(--coouv-slant) - var(--edge-inset)) 100%,var(--edge-inset) 100%);
}
.coouv-caption {
  position:absolute; z-index:2; left:17%; right:17%; bottom:34%; margin:0;
  padding:0; color:#fff; background:none; isolation:isolate;
  text-align:left; pointer-events:none;
  text-shadow:0 2px 18px rgba(6,20,34,.38);
  opacity:0; transform:translateY(12px);
  /* Fade the whole lockup first; reset its entrance offset only once hidden. */
  transition:opacity 160ms linear,transform 0s 160ms;
}
.coouv-caption::before {
  content:''; position:absolute; z-index:-1; inset:-65% -30%;
  background:radial-gradient(ellipse,rgba(6,20,34,.5),rgba(6,20,34,.18) 42%,transparent 72%);
}
.coouv-caption__index {
  display:flex; align-items:center; gap:14px; margin-bottom:14px;
  font:400 12px/1 'Arial',sans-serif; letter-spacing:.18em;
  color:inherit; font-variant-numeric:tabular-nums;
}
.coouv-caption__index::after { content:''; width:36px; height:1px; background:rgba(255,255,255,.65); }
.coouv-caption__name {
  display:block; font:300 clamp(20px,1.8vw,36px)/1.5 'Microsoft YaHei UI','PingFang SC','Microsoft YaHei',sans-serif;
  letter-spacing:.16em; text-wrap:balance;
}
html[lang="en"] .coouv-caption__name {
  font-family:'Barlow Condensed','Arial Narrow',Arial,sans-serif;
  font-size:clamp(24px,2.6vw,50px); font-weight:400; line-height:1.08;
  letter-spacing:.055em; text-transform:uppercase;
}
.coouv-panel:focus-visible { outline:0; }
.coouv-panel:focus-visible .coouv-caption { opacity:1; transform:none; outline:2px solid #fff; outline-offset:4px; transition:opacity 260ms ease,transform 400ms cubic-bezier(.22,.7,.25,1); }
.coouv-panel:nth-child(1) { --coouv-slant:4.095vw; }
.coouv-panel:nth-child(2) { --coouv-slant:3.78vw; }
.coouv-panel:nth-child(3) { --coouv-slant:3.42vw; }
.coouv-panel:nth-child(4) { --coouv-slant:3.42vw; }
.coouv-panel:nth-child(5) { --coouv-slant:3.825vw; }
@media(min-width:701px) {
/* Keep each expanded lockup's line breaks stable throughout panel contraction. */
.coouv-caption { right:auto; width:var(--coouv-caption-width); }
.coouv-panel:nth-child(1) { --coouv-caption-width:20.658vw; }
.coouv-panel:nth-child(2) { --coouv-caption-width:19.272vw; }
.coouv-panel:nth-child(3) { --coouv-caption-width:17.688vw; }
.coouv-panel:nth-child(4) { --coouv-caption-width:17.688vw; }
.coouv-panel:nth-child(5) { --coouv-caption-width:19.47vw; }
.coouv-photos:has(> .coouv-panel:nth-child(1):focus-visible) > .coouv-panel:nth-child(1) { left:-4%; width:31.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(1):focus-visible) > .coouv-panel:nth-child(2) { left:23.4%; width:24.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(1):focus-visible) > .coouv-panel:nth-child(3) { left:44.05%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(1):focus-visible) > .coouv-panel:nth-child(4) { left:62.65%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(1):focus-visible) > .coouv-panel:nth-child(5) { left:81.25%; width:24.5%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):focus-visible) > .coouv-panel:nth-child(1) { left:-4%; width:26.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):focus-visible) > .coouv-panel:nth-child(2) { left:18.4%; width:29.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):focus-visible) > .coouv-panel:nth-child(3) { left:44.05%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):focus-visible) > .coouv-panel:nth-child(4) { left:62.65%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):focus-visible) > .coouv-panel:nth-child(5) { left:81.25%; width:24.5%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):focus-visible) > .coouv-panel:nth-child(1) { left:-4%; width:26.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):focus-visible) > .coouv-panel:nth-child(2) { left:18.4%; width:24.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):focus-visible) > .coouv-panel:nth-child(3) { left:39.05%; width:26.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):focus-visible) > .coouv-panel:nth-child(4) { left:62.65%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):focus-visible) > .coouv-panel:nth-child(5) { left:81.25%; width:24.5%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):focus-visible) > .coouv-panel:nth-child(1) { left:-4%; width:26.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):focus-visible) > .coouv-panel:nth-child(2) { left:18.4%; width:24.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):focus-visible) > .coouv-panel:nth-child(3) { left:39.05%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):focus-visible) > .coouv-panel:nth-child(4) { left:57.65%; width:26.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):focus-visible) > .coouv-panel:nth-child(5) { left:81.25%; width:24.5%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):focus-visible) > .coouv-panel:nth-child(1) { left:-4%; width:26.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):focus-visible) > .coouv-panel:nth-child(2) { left:18.4%; width:24.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):focus-visible) > .coouv-panel:nth-child(3) { left:39.05%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):focus-visible) > .coouv-panel:nth-child(4) { left:57.65%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):focus-visible) > .coouv-panel:nth-child(5) { left:76.25%; width:29.5%; }
}
@media(min-width:701px) and (hover:hover) and (pointer:fine) {
.coouv-photos:has(> .coouv-panel:nth-child(1):hover) > .coouv-panel:nth-child(1) { left:-4%; width:31.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(1):hover) > .coouv-panel:nth-child(2) { left:23.4%; width:24.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(1):hover) > .coouv-panel:nth-child(3) { left:44.05%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(1):hover) > .coouv-panel:nth-child(4) { left:62.65%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(1):hover) > .coouv-panel:nth-child(5) { left:81.25%; width:24.5%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):hover) > .coouv-panel:nth-child(1) { left:-4%; width:26.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):hover) > .coouv-panel:nth-child(2) { left:18.4%; width:29.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):hover) > .coouv-panel:nth-child(3) { left:44.05%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):hover) > .coouv-panel:nth-child(4) { left:62.65%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(2):hover) > .coouv-panel:nth-child(5) { left:81.25%; width:24.5%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):hover) > .coouv-panel:nth-child(1) { left:-4%; width:26.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):hover) > .coouv-panel:nth-child(2) { left:18.4%; width:24.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):hover) > .coouv-panel:nth-child(3) { left:39.05%; width:26.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):hover) > .coouv-panel:nth-child(4) { left:62.65%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(3):hover) > .coouv-panel:nth-child(5) { left:81.25%; width:24.5%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):hover) > .coouv-panel:nth-child(1) { left:-4%; width:26.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):hover) > .coouv-panel:nth-child(2) { left:18.4%; width:24.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):hover) > .coouv-panel:nth-child(3) { left:39.05%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):hover) > .coouv-panel:nth-child(4) { left:57.65%; width:26.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(4):hover) > .coouv-panel:nth-child(5) { left:81.25%; width:24.5%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):hover) > .coouv-panel:nth-child(1) { left:-4%; width:26.3%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):hover) > .coouv-panel:nth-child(2) { left:18.4%; width:24.2%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):hover) > .coouv-panel:nth-child(3) { left:39.05%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):hover) > .coouv-panel:nth-child(4) { left:57.65%; width:21.8%; }
.coouv-photos:has(> .coouv-panel:nth-child(5):hover) > .coouv-panel:nth-child(5) { left:76.25%; width:29.5%; }
.coouv-panel:hover .coouv-caption { opacity:1; transform:none; transition:opacity 260ms ease,transform 400ms cubic-bezier(.22,.7,.25,1); }
}
@media(max-width:700px) {
  .coouv-caption { left:12%; right:12%; bottom:39%; }
  .coouv-caption__index { margin-bottom:6px; gap:6px; font-size:12px; }
  .coouv-caption__index::after { width:16px; }
  .coouv-caption__name { font-size:14px; letter-spacing:.04em; line-height:1.35; overflow-wrap:anywhere; }
  html[lang="en"] .coouv-caption__name { font-size:14px; letter-spacing:.02em; line-height:1.15; }
}
@media(prefers-reduced-motion:reduce) { .coouv-panel,.coouv-panel .coouv-caption { transition:none; } }
