/* Reference composition: oversized lettering, clothing at left, courtyard at right. */
/* Keep the previous page visible until the next document is ready to paint. */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){display:none}
html{background:#dfd9d1;scrollbar-gutter:stable}
@font-face{font-family:Manrope;src:url("fonts/manrope-regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
.hero{background-color:#dfd9d1}
.hero-stage{width:min(100%,max(1100px,calc(100svh * 2)));aspect-ratio:2;--gutter:4cqw}
.masthead{height:4.6cqw;min-height:64px;padding:0 var(--gutter);gap:24px}
.header-logo{display:flex;align-items:center;gap:.35cqw;white-space:nowrap;color:#090c0d}
.header-logo svg{width:4.5cqw;height:auto}.header-logo span{font-family:Manrope,sans-serif;font-size:1.45cqw;letter-spacing:-.06em}
.nav{position:absolute;left:50%;transform:translateX(-50%);gap:3.6cqw}
.nav a,.browse-all,.hero .product-cta{font-size:clamp(12px,.77cqw,30px);text-transform:uppercase;letter-spacing:.2em;white-space:nowrap}
.browse-all,.hero .product-cta{display:flex;align-items:center;justify-content:space-between;background:#1c2427;color:#f4f1e9;border:1px solid #42494a;border-radius:3px;min-height:44px;padding:1cqw 1.7cqw;gap:1.8cqw;transition:background .2s}
.browse-all{margin-left:auto;width:11.3cqw}.browse-all:hover,.hero .product-cta:hover{background:#344044}
.brand{top:5.25cqw;left:4cqw;width:51cqw}.brand-mark{width:51cqw;color:#363d3e}
.clothing{width:44%;height:100%}
.model-render{left:35%;width:73%;height:87%;bottom:0}
.model-render:has(.frontgirl){clip-path:inset(-100% -100% 0 -100%)}
.model-cutout.frontgirl{position:relative;top:-13%;left:-35%;height:165%;clip-path:none;aspect-ratio:1500/2256;object-fit:contain}
.clothing .product-copy{left:9.1%;top:39.5%;width:36%;}
.hero .badge{border:0;padding:0;margin-bottom:.6cqw;font-size:clamp(12px,.8cqw,30px);text-transform:uppercase;letter-spacing:.35em;color:#535a5b}
.hero .product-copy h2{font-size:4.6cqw;line-height:1.02;letter-spacing:-.025em;text-transform:uppercase;transform:none}
.hero .product-copy p{font-family:Manrope,sans-serif;font-size:clamp(13px,.9cqw,34px);line-height:1.55;color:#606464;margin-top:.7cqw}
.hero .copy-rule{display:none}.hero .product-cta{margin-top:1.2cqw;width:12.6cqw;text-shadow:none}
.clothing .detail-rail{left:9.1%;right:auto;bottom:8.7%;width:28.5%;display:grid;grid-template-columns:1fr 1fr;gap:.6cqw}
.clothing .detail-image{border-radius:5px}.clothing .detail-rail button>span:last-child{display:none}
.environment{right:4cqw;bottom:3cqw;width:49.7%;height:73%;}
.environment::before{content:"";position:absolute;left:-2.5cqw;top:9.7cqw;bottom:0;width:1px;background:#7c818166}
.environment-render{inset:auto 0 0 auto;width:auto;height:28cqw;aspect-ratio:4/3;clip-path:none;border-radius:7px}
.environment-render img{object-fit:cover;object-position:50% 60%;}
.environment .product-copy{top:0;left:9.5cqw;right:0;color:#1c2427;text-shadow:none;border-left:1px solid #7c818188;padding-left:1.6cqw;min-height:7.6cqw}
.environment .product-copy h2{font-size:3.4cqw;white-space:nowrap}
.environment .product-copy p{font-size:.85cqw;max-width:26cqw}
.environment .product-cta{position:absolute;right:0;top:2.3cqw;width:12.4cqw;transform:translateY(0);margin-top:0}
.environment .product-copy{left:8cqw}
.environment .product-copy h2{font-size:3cqw}
.environment .product-copy p{max-width:25cqw}
@media(min-width:1001px){.environment .product-copy{left:0;padding-left:1.6cqw;right:0;margin-left:8cqw}.environment .product-cta{top:3.4cqw}.environment .product-copy h2{font-size:2.8cqw;max-width:28cqw}.environment .product-copy p{max-width:26cqw;font-size:.8cqw}.environment .product-cta{right:0;width:11cqw}.environment .product-copy h2,.environment .product-copy p{max-width:calc(100% - 11.5cqw)}.environment .product-copy h2{font-size:3.4cqw;transform:scaleX(.8);transform-origin:left}}
@media(min-width:641px) and (max-width:1000px){.hero-stage{width:100%;height:auto;min-height:0;aspect-ratio:1.55}.masthead{min-height:64px}.header-logo svg{width:7cqw}.header-logo span{font-size:2cqw}.nav{gap:2cqw}.browse-all{width:15cqw}.brand{top:8cqw;width:42cqw}.brand-mark{width:42cqw}.model-render{height:78%;left:40%;width:75%}.clothing .product-copy{top:39%;width:42%}.hero .product-copy h2{font-size:4.3cqw}.hero .product-cta{width:17cqw}.clothing .detail-rail{width:36%;bottom:8%}.environment{height:75%;bottom:4cqw}.environment .product-copy{left:0;top:5cqw;padding-left:1.5cqw}.environment .product-copy h2{font-size:3.5cqw}.environment .product-copy p{font-size:1.4cqw;max-width:none}.environment .product-cta{position:static;margin-top:1cqw;width:18cqw}.environment-render{height:27cqw}.environment::before{top:23cqw}}
@media(max-width:640px){.hero-stage{width:100%;height:auto;min-height:0;aspect-ratio:auto;display:block;padding-bottom:24px}.masthead{height:106px;min-height:0;align-items:flex-start;padding-top:18px}.header-logo{gap:4px}.header-logo svg{width:68px}.header-logo span{font-size:22px}.browse-all{width:auto;padding:10px 12px;font-size:11px;gap:14px;min-height:38px}.nav{top:65px;left:4cqw;right:4cqw;transform:none;width:auto;justify-content:space-between;gap:20px}.nav a{font-size:12px}.brand{top:115px;left:4cqw;width:92cqw}.brand-mark{width:92cqw}.clothing{height:143cqw;min-height:510px;max-height:760px;width:100%;margin:0}.model-render{height:89%;left:23%;width:77%}.clothing .product-copy{left:4cqw;top:35%;width:39%}.hero .badge{font-size:11px;letter-spacing:.25em;margin-bottom:8px}.hero .product-copy h2{font-size:10cqw;transform:none}.hero .product-copy p{font-size:12px;margin-top:10px}.hero .product-cta{font-size:11px;width:100%;padding:13px 12px;margin-top:15px;gap:10px;min-height:44px}.clothing .detail-rail{left:4cqw;width:32%;bottom:6%;gap:8px}.environment{margin:0 4cqw;width:auto;height:auto;min-height:0;max-height:none;inset:auto;padding-top:24px;border-top:1px solid #7c818166;display:flex;flex-direction:column;gap:20px}.environment::before{display:none}.environment .product-copy{position:relative;inset:auto;margin:0;padding:0;border:0;min-height:0}.environment .product-copy h2{font-size:9cqw;white-space:normal;max-width:none}.environment .product-copy p{font-size:13px;max-width:none}.environment .product-cta{position:static;width:155px;transform:none;margin-top:15px}.environment-render{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:4/3;order:2;flex:none}.environment-render img{position:absolute;inset:0}.hero-stage::after{bottom:auto;height:155cqw}}

.clothing .dress-detail{display:block;aspect-ratio:1;overflow:hidden;border-radius:5px}.clothing .dress-detail img{object-fit:cover;object-position:50% 30%}

/* Align the hospital heading and action with its 4:3 image. */
@media(min-width:641px){
  .environment{width:41.5%;height:auto;display:flex;flex-direction:column;gap:1.5cqw}
  .environment::before{display:none}
  .environment .product-copy{position:relative;inset:auto;margin:0;padding:0;border:0;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:1.5cqw;align-items:center}
  .environment .product-copy h2{font-size:3cqw;transform:none;max-width:none;grid-column:1}
  .environment .product-copy p{font-size:clamp(12px,.85cqw,30px);max-width:none;grid-column:1}
  .environment .product-cta{position:static;grid-column:2;grid-row:1 / 3;margin:0;width:11.5cqw;transform:none}
  .environment-render{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:4/3;flex:none;order:2}
  .environment-render img{position:absolute;inset:0;object-position:45% 50%}
}
@media(min-width:1001px){.brand,.brand-mark{width:49cqw}.model-render{left:49%}}
@media(min-width:641px) and (max-width:1000px){
  .environment{width:46%;gap:2cqw}
  .environment .product-copy{display:block}
  .environment .product-copy h2{font-size:4cqw}
  .environment .product-cta{margin-top:1.5cqw;width:18cqw}
}

/* The three lighting renders share one crop so the building stays aligned. */
.hospital-light{position:absolute;inset:0}
.hospital-day{clip-path:inset(0 66.6667% 0 0)}
.hospital-sunset{clip-path:inset(0 33.3333% 0 33.3333%)}
.hospital-night{clip-path:inset(0 0 0 66.6667%)}
.hospital-split .hospital-light img{object-position:45% 50%}
.hospital-light::after{content:"";position:absolute;inset:65% 0 0;background:linear-gradient(transparent,#0009);pointer-events:none}
.hospital-split::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,transparent calc(33.3333% - .5px),#ffffff70 calc(33.3333% - .5px),#ffffff70 calc(33.3333% + .5px),transparent calc(33.3333% + .5px),transparent calc(66.6667% - .5px),#ffffff70 calc(66.6667% - .5px),#ffffff70 calc(66.6667% + .5px),transparent calc(66.6667% + .5px))}
.light-label{position:absolute;z-index:1;bottom:6%;transform:translateX(-50%);font-family:Manrope,sans-serif;font-size:clamp(10px,.75cqw,24px);letter-spacing:.16em;text-transform:uppercase;color:#fff;text-shadow:0 1px 6px #000}
.hospital-day .light-label{left:16.6667%}.hospital-sunset .light-label{left:50%}.hospital-night .light-label{left:83.3333%}
