@font-face{font-family:"Pinyon Script";src:url("fonts/PinyonScript-Regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:dark;--edge:clamp(26px,6vw,100px)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#101d35}
body{color:#dfe8f0;-webkit-font-smoothing:antialiased}
::selection{background:#a6bad4;color:#172640}
.blue-hour{position:relative;isolation:isolate;display:flex;align-items:center;min-height:100svh;overflow:hidden;padding:60px var(--edge)}
.atmosphere{position:absolute;inset:0;z-index:-2;overflow:hidden;background:linear-gradient(180deg,#101d35 0%,#182c49 22%,#29446b 43%,#45658e 60%,#6583a7 74%,#435e81 87%,#1b304e 100%)}
.ambient-light{position:absolute;inset:-10%;background:radial-gradient(ellipse 86% 39% at 62% 67%,rgba(136,169,207,.14),transparent 78%),radial-gradient(ellipse 56% 74% at 0% 44%,rgba(7,17,39,.43),transparent 96%);transform:rotate(-6deg)}
.light-fall{position:absolute;inset:0;background:linear-gradient(110deg,rgba(11,21,42,.12),transparent 44%,rgba(11,23,42,.13))}
.identity{position:relative;width:min(100%,1500px);margin-inline:auto;padding-block:18px;transform:translateY(1.5svh)}
h1{font-family:"Pinyon Script",Georgia,serif;font-size:clamp(12rem,31vw,32rem);font-weight:400;line-height:1.12;letter-spacing:0;margin:0;width:fit-content}
.identity p{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.125rem,1.85vw,1.7rem);font-style:italic;line-height:1.5;letter-spacing:.015em;margin:16px 0 0 1.4%;color:#d5e1ee}
@media(max-width:800px){h1{font-size:42vw}.identity p{font-size:1.3rem;margin-top:12px}}
@media(max-width:520px){.blue-hour{padding-inline:26px}h1{font-size:50vw}.identity{transform:translateY(-1svh)}.identity p{font-size:1.15rem;margin:12px 0 0 4px}}
@media(max-height:500px) and (min-width:521px){.blue-hour{padding-block:30px}h1{font-size:clamp(10rem,26vw,18rem)}}

/* The original blue hour palette, with room for the first collection. */
.blue-hour{gap:6vw;padding-inline:clamp(28px,8vw,140px)}
.identity{width:auto;margin:0;flex:1;animation:arrive 1.9s cubic-bezier(.2,.65,.2,1) both}
h1{font-size:clamp(10rem,23vw,25rem)}
.identity p{font-size:clamp(1.1rem,1.5vw,1.45rem);margin-top:6px}
.photography-entry{display:flex;align-items:center;justify-content:space-between;gap:clamp(48px,9vw,150px);margin-top:8vh;padding:22px 0;color:#edf3f8;text-decoration:none;border-bottom:1px solid #c7d9ec65;font-family:Georgia,serif;font-size:clamp(1.35rem,2.15vw,2.1rem);font-weight:400;animation:arrive 2.3s cubic-bezier(.2,.65,.2,1) both;transition:border-color .3s}
.entry-arrow{font-family:Arial,sans-serif;font-size:1.3rem;transition:transform .4s}
.photography-entry:hover{border-color:#edf3f8}.photography-entry:hover .entry-arrow{transform:translate(4px,-4px)}
a:focus-visible,button:focus-visible{outline:2px solid #c9e0f6;outline-offset:7px}
.opening-doors{position:fixed;inset:0;z-index:100;perspective:1500px;pointer-events:none;animation:clear-doors 2.2s forwards}
.door{position:absolute;top:0;bottom:0;width:50.1%;backface-visibility:hidden;background:linear-gradient(180deg,#15253f,#375578 58%,#526f91 78%,#243955);box-shadow:0 0 50px #07132660}
.door-left{left:0;transform-origin:left center;animation:open-left 2.2s cubic-bezier(.25,.65,.2,1) forwards}
.door-right{right:0;transform-origin:right center;animation:open-right 2.2s cubic-bezier(.25,.65,.2,1) forwards}
@keyframes open-left{0%,8%{transform:rotateY(0)}100%{transform:rotateY(-105deg)}}
@keyframes open-right{0%,8%{transform:rotateY(0)}100%{transform:rotateY(105deg)}}
@keyframes clear-doors{0%,75%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@keyframes arrive{0%,15%{opacity:0;translate:0 16px}100%{opacity:1;translate:0 0}}
@media(max-width:600px){.blue-hour{flex-direction:column;align-items:flex-start;justify-content:center;gap:50px;padding:55px 9vw}.identity{flex:none;transform:none}h1{font-size:52vw}.photography-entry{margin:0 0 0 auto;width:66%;min-width:210px;font-size:1.35rem;gap:24px}.identity p{font-size:1.15rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.opening-doors{display:none}}
