/* Hero-only art direction. The letter and diary retain their existing styles. */
.cover-header{color:#4b6568;height:104px;padding:0 5.5%}
.cover-header .brand{font:12px/1.2 var(--sans);letter-spacing:6px;gap:24px}
.cover-header .brand::after{content:'';width:96px;height:1px;background:#76939766}
.cover-header nav{gap:34px;padding:0;border:0;border-radius:0;background:none}
.cover-header nav a{font-size:12px;letter-spacing:1px}
.cover-header nav a:after{background:#547579}
.hero.bluepink{--cover-ink:#435e60;position:relative;isolation:isolate;display:flex;align-items:center;height:100svh;min-height:740px;max-height:1100px;padding:100px 9% 65px;color:var(--cover-ink);background:#edf5f6}
.hero.bluepink::before{inset:0;border:0;box-shadow:none;background:linear-gradient(110deg,#f7faf9 8%,#eef6f7 43%,#e5eff3 78%);z-index:-3}
.hero.bluepink::after{inset:auto 0 0;height:90px;background:linear-gradient(0deg,#f3e9ed00,#f3e9ed00);opacity:1;transform:none;filter:none}
.bluepink .arch-scene{inset:0 -4% 0 36%;width:auto;height:100%;opacity:1;background:none;transform:translateY(var(--parallax,0px)) scale(1.035);z-index:-2;mask-image:linear-gradient(90deg,transparent,#000 24%);pointer-events:none}
.bluepink .arch-scene>img{display:block;width:100%;height:100%;object-fit:cover;object-position:56% 50%}
.bluepink .arch-scene::after{inset:0;background:linear-gradient(180deg,#edf5f666,transparent 25%,transparent 75%,#e8eef166)}
.bluepink .hero-copy{width:53%;padding:0;margin-top:12px;animation:cover-arrive .85s both;z-index:2}
.bluepink .cover-years{font:italic 23px/1.2 Georgia,serif;letter-spacing:2px;margin-bottom:29px;color:#657c7d}
.bluepink h1{font-family:'Songti SC','SimSun',serif;font-size:clamp(82px,7.6vw,118px);font-weight:400;letter-spacing:.08em;line-height:1.12}
.bluepink h1>span{font:400 clamp(40px,4.1vw,63px)/1.2 Georgia,serif;letter-spacing:-2px;color:#56777d;margin:12px 0 0;text-shadow:none}
.bluepink .hero-disciplines{font:14px/1.8 var(--sans);letter-spacing:1.5px;margin-top:34px;white-space:nowrap}
.bluepink .cover-description{font-size:13px;letter-spacing:.5px;line-height:1.9;margin-top:19px;color:#64767b;max-width:390px;text-wrap:pretty}
.cover-actions{display:flex;align-items:center;gap:18px;margin-top:43px}
.cover-actions a{min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:26px;padding:0 26px;border-radius:30px;font-size:12px;letter-spacing:1px;transition:background .25s,transform .25s}
.cover-actions a:first-child{background:#58777a;color:#fff}
.cover-actions a:last-child{border:1px solid #829d9f;background:#f8fcfb33;min-width:126px}
.cover-actions a:hover{transform:translateY(-3px);background:#d6e5e8}
.cover-actions a:first-child:hover{background:#44666a}
.cover-actions a:focus-visible,.cover-header a:focus-visible{outline-color:#526f78}
.cover-actions span{font-size:17px;line-height:1}
.cover-annotations{position:absolute;inset:0;pointer-events:none;font:10px/1.55 var(--sans);color:#5d5d69;letter-spacing:.65px;z-index:1}
.cover-annotation{position:absolute;display:flex;flex-direction:column;align-items:start}
.cover-annotation span{background:#f2cddc;padding:2px 7px;margin-bottom:3px}
.annotation-top{left:59%;top:23%}
.annotation-bottom{right:9%;bottom:16%}
.cover-annotation::after{content:'';position:absolute;left:100%;top:50%;width:48px;height:26px;border-top:1px solid #6d8c8c88;border-right:1px solid #6d8c8c88;transform:skewX(30deg)}
.annotation-bottom::after{left:auto;right:100%;top:-18px;transform:skewX(30deg);border-right:0;border-left:1px solid #6d8c8c88}
.cover-dots{position:absolute;width:100px;height:96px;background-image:radial-gradient(#688b8d 1px,transparent 1px);background-size:10px 10px;opacity:.19;pointer-events:none;mask-image:linear-gradient(135deg,#000,transparent)}
.cover-dots.top{top:136px;left:3.5%;width:72px;height:66px}
.cover-dots.bottom{bottom:35px;right:3.5%;transform:rotate(180deg)}
.cover-baseline{position:absolute;bottom:39px;left:9%;width:90px;height:8px;background:repeating-linear-gradient(90deg,#9bb7ba 0 8px,transparent 8px 13px);opacity:.38}
@keyframes cover-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(min-width:1700px){.hero.bluepink{padding-left:12%}.bluepink .hero-copy{width:48%}.cover-baseline{left:12%}}
@media(max-width:1000px) and (min-width:701px){.hero.bluepink{padding-left:7%;padding-right:7%;min-height:720px}.bluepink .hero-copy{width:60%}.bluepink .hero-disciplines{font-size:12px;letter-spacing:.5px}.annotation-top{left:64%;top:19%}.annotation-bottom{right:8%;bottom:12%}.bluepink .arch-scene{left:34%;opacity:.85}}
@media(max-width:700px){
 .cover-header{height:76px;padding:0 7%}.cover-header .brand{font-size:10px;letter-spacing:3px}.cover-header .brand::after{display:none}.cover-header nav{gap:20px;padding:0}.cover-header nav a{font-size:11px}.cover-header nav a:last-child{display:none}
 .hero.bluepink{height:auto;min-height:850px;max-height:none;padding:126px 8% 390px;display:block}
 .bluepink .hero-copy{width:100%;margin:0;padding:0}.bluepink .cover-years{font-size:18px;margin-bottom:22px}.bluepink h1{font-size:76px;letter-spacing:.08em}.bluepink h1>span{font-size:43px;margin-top:8px;letter-spacing:-1px}
 .bluepink .hero-disciplines{font-size:12px;letter-spacing:.4px;margin-top:26px}.bluepink .cover-description{font-size:12px;max-width:300px;margin-top:14px;line-height:1.9}.cover-actions{margin-top:26px;gap:13px}.cover-actions a{min-height:44px;padding:0 23px}
 .bluepink .arch-scene{inset:auto -7% -12px -7%;height:430px;width:auto;opacity:1;transform:none;mask-image:linear-gradient(180deg,transparent,#000 23%)}.bluepink .arch-scene>img{object-position:58% 52%}.bluepink .arch-scene::after{background:linear-gradient(180deg,#edf5f655,transparent 50%)}
 .cover-annotations{font-size:8px;letter-spacing:.3px}.annotation-top{left:8%;top:auto;bottom:255px}.annotation-bottom{right:9%;bottom:39px}.cover-annotation::after{width:25px;height:18px}.cover-dots.top{top:94px;left:auto;right:7%;width:60px;height:40px}.cover-dots.bottom,.cover-baseline{display:none}
}
@media(prefers-reduced-motion:reduce){.bluepink .hero-copy{animation:none}.bluepink .arch-scene{transform:none}.cover-actions a:hover{transform:none}}
