/* Layer the supplied Cousino artwork in CSS perspective. */
.hero-grid{perspective:1500px}
.hero-visual{transform-style:preserve-3d}
.hero-visual .portrait-frame{transform:translateZ(28px) rotate(2deg);box-shadow:10px 10px 0 #b31c36,15px 15px 0 #748baa,20px 20px 0 #182a47,0 35px 60px #0009}
.hero-visual .hero-number{transform:translateZ(95px) rotate(-7deg);filter:drop-shadow(2px 3px 0 #4a0715) drop-shadow(4px 6px 0 #071326) drop-shadow(0 17px 12px #0008)}
.hero-visual .season-stamp{transform:translateZ(75px) rotate(-9deg);box-shadow:3px 4px 0 #87122b,6px 8px 0 #3d122a,0 20px 28px #0006}
.hero-visual .vertical-label{transform:translateZ(14px)}
.chrome-name{position:relative;display:flow-root;max-width:590px;isolation:isolate}
.chrome-name .name-art{filter:drop-shadow(1px 2px 0 #971c31) drop-shadow(2px 3px 0 #142745) drop-shadow(0 13px 12px #0009)}
.chrome-name:after{content:"";position:absolute;inset:24px 0 22px;pointer-events:none;opacity:0;background:linear-gradient(110deg,transparent 40%,#edf5ff55 46%,#fff9 50%,#d8e8ff55 54%,transparent 60%) 180% center/280% 100%;mask:url('assets/name.webp') center/contain no-repeat;-webkit-mask:url('assets/name.webp') center/contain no-repeat}
.identity-card{box-shadow:5px 7px 0 #020a18,0 20px 35px #0003}
.college-card{position:relative;box-shadow:4px 6px 0 #a9b8ca,0 15px 24px #1738561c}
.college-card:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;border:1px solid #ffffff50;background:radial-gradient(circle at var(--shine-x,50%) var(--shine-y,25%),#ffffff33,transparent 55%);opacity:0;transition:opacity .25s}
.college-card-head{box-shadow:inset 0 2px 0 #ffffff40,inset 0 -3px 0 #0003}
.college-monogram{text-shadow:1px 1px 0 #dbe6f0,2px 3px 0 #0005,3px 5px 8px #0003}
.accepted{box-shadow:0 3px 0 #0003}
.award-banner{box-shadow:7px 9px 0 #bdc9d8,0 20px 32px #15294125}
.button.red{box-shadow:0 4px 0 #8e1128,0 9px 24px #c4143230}
.button.red:active{transform:translateY(2px);box-shadow:0 2px 0 #8e1128,0 5px 12px #c4143230}
.motion-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#ffffff0b;border:1px solid #b6c8e64f;border-radius:30px;padding:8px 15px;color:#d3def0;font-size:.875rem;line-height:1.4;letter-spacing:0;min-height:42px;white-space:nowrap}
.motion-toggle:before{content:"Ⅱ";font-weight:700;color:#ff8294;font-size:.875rem}
.motion-toggle[aria-pressed="false"]:before{content:"▷"}
.motion-toggle:disabled{cursor:default;opacity:.65}
.hero-bottom{align-items:center;gap:20px}
.depth-surface{--tilt-x:0deg;--tilt-y:0deg;--raise:0px;transform:perspective(1200px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(var(--raise));transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
body[data-motion="on"] .depth-surface.is-tilting{transition:transform .13s ease-out,box-shadow .3s;will-change:transform}
body[data-motion="on"] .college-card.is-tilting{box-shadow:6px 9px 0 #97abc2,0 25px 35px #17385630}
body[data-motion="on"] .college-card.is-tilting:after{opacity:1}
body[data-motion="on"] .hero.in-view .hero-number{animation:number-hover 5s ease-in-out infinite}
body[data-motion="on"] .hero.in-view .season-stamp{animation:gentle-float 6s ease-in-out -2s infinite}
body[data-motion="on"] .hero.in-view .chrome-name:after{animation:chrome-sweep 7s ease-in-out infinite}
body[data-motion="on"] .identity-card.in-view .identity-art{animation:gentle-float 5.5s ease-in-out infinite;perspective:700px}
body[data-motion="on"] .identity-card.in-view:nth-child(2) .identity-art{animation-delay:-1.8s}
body[data-motion="on"] .identity-card.in-view:nth-child(3) .identity-art{animation-delay:-3.4s}
body[data-motion="on"] .award-banner.in-view>img{animation:gentle-float 6s ease-in-out -1s infinite}
body[data-motion="on"] .reveal-ready{opacity:1;translate:0 0;transition:opacity .65s ease,translate .65s cubic-bezier(.2,.8,.2,1),transform .3s,box-shadow .3s}
body[data-motion="on"] .reveal-ready:not(.revealed){opacity:0;translate:0 22px}
body[data-motion="on"] .reveal-ready:focus-within{opacity:1;translate:0 0}
body.motion-background *,body.motion-background *:after{animation-play-state:paused!important}
@keyframes gentle-float{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes number-hover{0%,100%{translate:0 0;rotate:0 1 0 -5deg}50%{translate:0 -13px;rotate:0 1 0 6deg}}
@keyframes chrome-sweep{0%,12%{background-position:180% center;opacity:0}17%{opacity:.65}36%{background-position:-80% center;opacity:.65}42%,100%{background-position:-80% center;opacity:0}}
@media(hover:hover) and (pointer:fine){body[data-motion="on"] .college-card:hover{--raise:-4px;transform:perspective(1200px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(var(--raise))}}
@media(max-width:760px){.chrome-name{margin-inline:auto}.chrome-name:after{inset:22px 2.5% 18px}.hero-visual .portrait-frame{box-shadow:7px 8px 0 #b31c36,11px 12px 0 #748baa,15px 16px 0 #182a47,0 25px 38px #0007}.hero-visual .hero-number{transform:translateZ(45px) rotate(-7deg)}.hero-visual .season-stamp{transform:translateZ(35px) rotate(-9deg)}.hero-bottom{flex-wrap:wrap;gap:16px 10px}.hero-bottom>span{max-width:calc(50% - 10px)}.hero-bottom>span:last-child{margin-left:auto}.motion-toggle{order:3;margin-inline:auto;min-height:44px;font-size:.8125rem}.identity-card{box-shadow:3px 5px 0 #020a18,0 14px 23px #0003}.college-card{box-shadow:3px 5px 0 #a9b8ca,0 12px 20px #17385616}.award-banner{box-shadow:4px 6px 0 #bdc9d8,0 15px 22px #15294120}@keyframes number-hover{0%,100%{translate:0 0;rotate:0 1 0 -3deg}50%{translate:0 -8px;rotate:0 1 0 4deg}}}
body[data-motion="off"] .depth-surface{--tilt-x:0deg!important;--tilt-y:0deg!important;--raise:0px!important;transform:perspective(1200px) rotateX(0) rotateY(0)}
body[data-motion="off"] .reveal-ready{opacity:1;translate:0 0}
@media(prefers-reduced-motion:reduce){.depth-surface{transform:none!important}.reveal-ready{opacity:1!important;translate:0 0!important}.chrome-name:after{display:none}body[data-motion] *,body[data-motion] *:before,body[data-motion] *:after{animation:none!important;transition:none!important}}
