:root{--ink:#162521;--paper:#f2efe7;--night:#10232d;--teal:#365e5a;--moss:#9fc584;--gold:#ddb768;--line:rgba(22,37,33,.22)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,sans-serif}a{color:inherit}.masthead,footer{display:flex;justify-content:space-between;gap:2rem;padding:1.1rem 4vw;border-bottom:1px solid var(--line);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}.masthead a{text-decoration:none;font-weight:700}.hero{min-height:72vh;padding:12vh 7vw 7vh;display:grid;grid-template-columns:1fr 2fr;align-content:center}.kicker{font-size:.68rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}.hero h1{grid-column:2;font-family:Georgia,serif;font-size:clamp(5rem,12vw,11rem);font-weight:400;line-height:.72;letter-spacing:-.055em;margin:0}.intro{grid-column:2;font-family:Georgia,serif;font-size:clamp(1.35rem,2.3vw,2.4rem);margin:3rem 0 0}.panel{display:grid;grid-template-columns:1fr 1.18fr;min-height:92vh}.copy{padding:9vw 7vw;display:flex;flex-direction:column;justify-content:center}.copy--dark{background:var(--night);color:#e8eee9}.copy--light{background:#dbe8d2}.number{font-family:Georgia,serif;font-size:4rem;margin:0 0 3rem;opacity:.5}.copy h2,.hinge h2{font-family:Georgia,serif;font-weight:400;letter-spacing:-.03em}.copy h2{font-size:clamp(3rem,6vw,6rem);line-height:.88;margin:0 0 2.5rem}.copy>p:not(.number){max-width:35rem;font-size:clamp(1rem,1.4vw,1.3rem);line-height:1.75}.aside{border-left:2px solid var(--moss);padding-left:1.5rem;margin-top:2rem;font-style:italic}.image{margin:0;position:relative;min-height:70vh;overflow:hidden}.image img{width:100%;height:100%;object-fit:cover;display:block}.image figcaption{position:absolute;left:1.5rem;right:1.5rem;bottom:1.5rem;background:rgba(242,239,231,.9);backdrop-filter:blur(8px);padding:.9rem 1.1rem;font-size:.72rem;letter-spacing:.04em;max-width:27rem}.hinge{min-height:80vh;padding:12vh 7vw;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;background:#eadfca;transition:background .9s ease}.hinge__line{position:absolute;inset:0;display:flex;justify-content:center;pointer-events:none}.hinge__line:before{content:"";width:1px;background:rgba(22,37,33,.2)}.hinge__line span{position:absolute;top:26%;width:2px;height:47%;background:var(--ink);transform:rotate(11deg);clip-path:polygon(0 0,100% 0,40% 28%,100% 48%,25% 72%,80% 100%,0 100%,45% 72%,0 48%,60% 28%);transition:transform .9s ease}.hinge h2{font-size:clamp(3.4rem,8vw,8rem);line-height:.83;margin:2rem 0;position:relative}.hinge__text{font-family:Georgia,serif;font-size:clamp(1.3rem,2.2vw,2.1rem);max-width:48rem;line-height:1.25;position:relative}.hinge button{margin-top:2rem;border:1px solid var(--ink);background:var(--ink);color:var(--paper);padding:1rem 1.6rem;border-radius:100px;font:700 .72rem Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;position:relative;transition:.3s}.hinge button:hover{transform:translateY(-3px);box-shadow:0 8px 0 rgba(22,37,33,.15)}.hint{font-size:.7rem;opacity:.65;margin-top:1rem}.open-copy{display:none}.panel--second{opacity:.12;filter:grayscale(1);transition:opacity 1.1s ease,filter 1.1s ease}.is-open .sealed-copy{display:none}.is-open .open-copy{display:inline}.is-open .hinge{background:#cbdcc0}.is-open .hinge__line span{transform:rotate(11deg) scale(1.7)}.is-open .panel--second{opacity:1;filter:none}.copy blockquote{font-family:Georgia,serif;font-size:clamp(1.5rem,2.6vw,2.8rem);line-height:1.05;margin:3rem 0 0;padding-top:2rem;border-top:1px solid var(--line)}footer{border-top:1px solid var(--line);border-bottom:0;padding-block:2rem}
@media(max-width:760px){.masthead span{display:none}.hero{min-height:60vh;display:block;padding-top:10vh}.hero h1{font-size:21vw;margin-top:2rem}.panel{display:flex;flex-direction:column;min-height:0}.panel--first .copy{order:1}.panel--first .image{order:2}.panel--second .image{order:1}.panel--second .copy{order:2}.copy{padding:18vw 8vw}.image{min-height:66vh}.hinge{min-height:72vh;padding-inline:8vw}.hinge h2{font-size:15vw}.hero .intro{margin-top:2rem}footer{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.panel--second,.hinge,.hinge__line span{transition:none}}
