*{box-sizing:border-box;margin:0;padding:0}
:root{--gutter:clamp(16px,2.5vw,32px);--radius:6px;--muted:#8a8a8a}
body{background:#f2f2f2;color:#1a1a1a;font:15px/1.5 -apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.eyebrow{font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cr{--ease:cubic-bezier(.22,.61,.36,1);--out:cubic-bezier(.16,1,.3,1);--inout:cubic-bezier(.76,0,.24,1);--surface:#e4e4e4;--gap:clamp(16px,2.4vw,40px);max-width:1180px;margin:0 auto;padding:var(--gutter) var(--gutter) 12vh}
.cr img{display:block;width:100%;height:100%;object-fit:cover}
.cr figure{margin:0}
/* Hero: smaller than reference (max 620px tall) */
.cr-hero{--hero-h:min(70vh,620px);position:relative;display:grid;grid-template-columns:1fr 1fr;height:var(--hero-h);overflow:hidden;border-radius:var(--radius);background:var(--surface)}
.cr-hero__media{overflow:hidden}
.cr-hero__aside{display:flex;align-items:center;justify-content:center}
.cr-hero__frame{width:min(52%,calc(var(--hero-h)*.6/1.2));aspect-ratio:5/6;overflow:hidden;border-radius:var(--radius)}
.cr-hero__mark{position:absolute;top:36px;left:50%;right:0;font-size:clamp(30px,3.2vw,46px);font-weight:400;line-height:1;letter-spacing:-.03em;text-align:center;pointer-events:none;color:#1a1a1a}
.disc{font-size:11.5px;color:#6b6b6b;text-align:center;border-bottom:1px solid #d4d4d4;padding:14px 0}
/* Cards */
.cr-section{padding-block:clamp(56px,6vw,96px)}
.cr-section>.eyebrow{width:fit-content;color:#1a1a1a;margin-bottom:8px}
.week{font-size:13px;color:var(--muted);margin-bottom:36px}
.cr-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);list-style:none;max-width:1000px}
.cr-card{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--radius)}
.cr-card__media{aspect-ratio:8/9;overflow:hidden;background:#d9d9d9}
.cr-card__body{flex:1;display:flex;flex-direction:column;align-items:flex-start;padding:22px;background:var(--surface)}
.cr-card__title{display:inline-block;padding-bottom:2px;font-size:17px;font-weight:400;line-height:1.3;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .8s var(--out)}
.cr-card:hover .cr-card__title{background-size:100% 1px}
.cr-card__body .eyebrow{margin-top:6px;font-size:10px}
.cr-card__text{margin:14px 0 18px;font-size:14px;line-height:1.6;color:#3a3a3a}
.cr-btn{margin-top:auto;display:inline-block;background:#1a1a1a;color:#f2f2f2;text-decoration:none;font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:9px 22px;border-radius:999px}
.cr-btn:hover{background:#4a4a4a}
/* Split */
.cr-split{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);height:clamp(480px,44vw,680px)}
.cr-split__panel{display:flex;flex-direction:column;justify-content:space-between;padding:clamp(24px,3vw,48px);border-radius:var(--radius);background:var(--surface)}
.cr-split__thumb{width:clamp(110px,12vw,170px);aspect-ratio:3/4;overflow:hidden;border-radius:var(--radius)}
.cr-split__text{max-width:30em}
.cr-split__text .eyebrow{color:#1a1a1a}
.cr-split__copy{margin-top:18px;font-size:clamp(17px,1.5vw,22px);line-height:1.5}
.cr-split__media{overflow:hidden;border-radius:var(--radius)}
footer{text-align:center;font-size:11px;color:#9a9a9a;margin-top:48px}
/* ===== Motion (only with html.js; content visible without JS) ===== */
.cr-veil{display:none}
html.intro .cr-veil{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#1a1a1a;color:#f2f2f2;pointer-events:none;clip-path:inset(0 0 0 0);animation:cr-veil-lift 1.1s cubic-bezier(.76,0,.24,1) 1.55s forwards}
.cr-veil__mark{font-size:clamp(56px,8vw,128px);font-weight:400;line-height:1;letter-spacing:-.03em;animation:cr-veil-mark .9s cubic-bezier(.76,0,.24,1) 1.45s forwards}
.cr-veil .w,.cr-hero__mark .w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .03em .1em}
.cr-veil .ch{display:inline-block;transform:translateY(110%);animation:cr-veil-rise 1.1s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(.2s + var(--c)*.09s)}
@keyframes cr-veil-rise{to{transform:none}}
@keyframes cr-veil-mark{to{transform:translateY(-40px);opacity:0}}
@keyframes cr-veil-lift{to{clip-path:inset(0 0 100% 0)}}
html.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--out),transform .9s var(--out);transition-delay:calc(var(--i,0)*90ms)}
html.js .reveal--none{opacity:1;transform:none}
html.js .reveal.is-in{opacity:1;transform:none}
html.js .settled,html.js .settled *{transition-delay:0s!important}
html.js .eyebrow.reveal{opacity:1;transform:none;clip-path:inset(0 100% 0 0);transition:clip-path 1.3s var(--inout)}
html.js .eyebrow.reveal.is-in{clip-path:inset(0 0 0 0)}
html.js .cr-hero__media{clip-path:inset(100% 0 0 0)}
html.js .cr-hero__media img{transform:scale(1.2)}
html.js .cr-hero__frame{clip-path:inset(50% 50% 50% 50%)}
html.js .cr-hero__frame img{transform:scale(1.35)}
html.js .cr-hero__mark .ch{display:inline-block;transform:translateY(110%)}
html.js .cr-hero.is-loaded .cr-hero__media{clip-path:inset(0 0 0 0);transition:clip-path 1.5s var(--inout)}
html.js .cr-hero.is-loaded .cr-hero__media img{transform:none;transition:transform 3.4s var(--out)}
html.js .cr-hero.is-loaded .cr-hero__frame{clip-path:inset(0 0 0 0);transition:clip-path 1.5s var(--inout) .75s}
html.js .cr-hero.is-loaded .cr-hero__frame img{transform:none;transition:transform 2.8s var(--out) .75s}
html.js .cr-hero.is-loaded .cr-hero__mark .ch{transform:none;transition:transform 1.1s var(--out);transition-delay:calc(.9s + var(--c)*.06s)}
html.js .cr-card .cr-card__media{clip-path:inset(100% 0 0 0);transition:clip-path 1.3s var(--inout) calc(var(--i,0)*120ms)}
html.js .cr-card .cr-card__media img{transform:scale(1.25);transition:transform 1.9s var(--out) calc(var(--i,0)*120ms)}
html.js .cr-card .cr-card__body{clip-path:inset(0 0 100% 0);transition:clip-path 1.1s var(--inout) calc(var(--i,0)*120ms + .5s)}
html.js .cr-card .cr-card__body>*{opacity:0;transform:translateY(12px);transition:opacity .9s var(--out),transform .9s var(--out),background-size .8s var(--out),background-color .3s;transition-delay:calc(var(--i,0)*120ms + .85s + var(--k,0)*90ms)}
.cr-card__body>:nth-child(2){--k:1}.cr-card__body>:nth-child(3){--k:2}.cr-card__body>:nth-child(4){--k:3}
html.js .cr-card.is-in .cr-card__media,html.js .cr-card.is-in .cr-card__body{clip-path:inset(0 0 0 0)}
html.js .cr-card.is-in .cr-card__media img{transform:none}
html.js .cr-card.is-in .cr-card__body>*{opacity:1;transform:none}
html.js .cr-card.is-in:hover .cr-card__media img{transform:scale(1.06);transition-duration:1.6s}
html.js .cr-split__thumb{clip-path:inset(50% 50% 50% 50%);transition:clip-path 1.4s var(--inout)}
html.js .cr-split__thumb img{transform:scale(1.4);transition:transform 2.2s var(--out)}
html.js .cr-split__thumb.is-in{clip-path:inset(0 0 0 0)}
html.js .cr-split__thumb.is-in img{transform:none}
html.js .cr-split__media{clip-path:inset(0 100% 0 0);transition:clip-path 1.7s var(--inout)}
html.js .cr-split__media img{transform:scale(1.2);transition:transform 2.6s var(--out)}
html.js .cr-split__media.is-in{clip-path:inset(0 0 0 0)}
html.js .cr-split__media.is-in img{transform:none}
html.js .is-resetting,html.js .is-resetting *{transition:none!important}
@media(prefers-reduced-motion:reduce){html.js *,html.js *::before,html.js *::after{transition:none!important;animation:none!important}.cr-veil{display:none!important}}
@media(max-width:1000px){.cr-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){
 .cr-hero{grid-template-columns:1fr;height:auto}
 .cr-hero__mark{position:static;order:-1;padding:26px 0 22px;font-size:32px}
 .cr-hero__media{aspect-ratio:4/5}
 .cr-hero__aside{padding:56px var(--gutter)}
 .cr-hero__frame{width:62%}
 .cr-cards{grid-template-columns:1fr;gap:36px;max-width:440px;margin:0 auto}
 .cr-card__body{padding:20px}
 .cr-split{grid-template-columns:1fr;height:auto}
 .cr-split__panel{gap:64px;padding:32px 24px 40px}
 .cr-split__media{aspect-ratio:4/5}
}
