/* Three distinct art directions, inspired by the reference's miniature websites. */

/* Academic: an editorial split between generous typography and a quiet still life. */
.deck-academics{background:#d8ceba;color:#211f19}
.deck-academics .mini-header{padding-bottom:14px;border-bottom:1px solid #211f1940}
.deck-academics .deck-photo{top:60px;bottom:0;right:0;width:50%;opacity:1;mask-image:none;background-size:cover;background-position:center}
.deck-academics h2{width:46%;margin-top:48px;font-family:Georgia,'Times New Roman',serif;font-size:43px;line-height:1.04;letter-spacing:-2px}
.deck-academics h2 em{font-size:43px;font-style:normal}
.deck-academics>p{max-width:40%;line-height:1.5}
.area-academics{background:#d8ceba;color:#29271e}
.area-academics .area-photo{inset:0;border-radius:0;background-size:cover;background-position:center;box-shadow:none}
.area-academics .caption-bottom{background:#f4eddfed;color:#29271e}

/* Exploration: dark architectural space, directional light, and pale oversized type. */
.deck-exploration{background:#202a25;color:#d7edf1}
.deck-exploration .deck-photo{inset:0;width:100%;opacity:1;mask-image:none;background-size:cover;background-position:center}
.deck-exploration h2{margin-top:48px;font-size:61px;line-height:.98;letter-spacing:-3px;max-width:500px}
.deck-exploration h2 em{font-family:inherit;font-size:69px;font-style:normal;font-weight:450}
.deck-exploration>p{max-width:80%;background:#19221bbf;padding:8px 12px;left:22px;bottom:24px}
.area-exploration{background:#202a25;color:#e0eef0}
.area-exploration .area-photo{inset:0;border-radius:0;background-size:cover;background-position:72% center;box-shadow:none}
.area-exploration .caption-bottom{background:#dcece9;color:#27382e}

/* Leadership: a dark portfolio with a full-width strip of three different projects. */
.deck-leadership{background:#21170f;color:#f1f1e9}
.deck-leadership .deck-photo{top:auto;left:16px;right:16px;bottom:16px;width:auto;height:184px;opacity:1;mask-image:none;background-size:cover;background-position:center}
.deck-leadership h2{margin-top:24px;font-size:48px;line-height:1;letter-spacing:-2px;max-width:none}
.deck-leadership h2 em{font-family:inherit;font-size:48px;font-style:normal;font-weight:600}
.deck-leadership>p{top:190px;bottom:auto;font-size:10px;letter-spacing:.3px}
.area-leadership{background:#21170f;color:#f1f1e9}
.portfolio-grid{height:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:9px;padding-right:28px}
.portfolio-tile{min-width:0;transform:translateY(-65px)}
.portfolio-tile:nth-child(2){transform:translateY(0)}
.portfolio-tile:nth-child(3){transform:translateY(65px)}
.portfolio-photo{aspect-ratio:1;background-image:url('assets/card-creative-projects.png');background-size:300% 100%;background-position:left center;box-shadow:0 18px 30px #0003}
.portfolio-tile:nth-child(2) .portfolio-photo{background-position:center}
.portfolio-tile:nth-child(3) .portfolio-photo{background-position:right center}
.portfolio-tile>span{display:block;margin-top:12px;font-size:9px;letter-spacing:.7px;color:#e2d7c4}
.area-leadership .caption-bottom{background:#403124;color:#f5ecde}

@media(max-width:1100px){
  .deck-academics .deck-photo{top:60px}
  .deck-academics h2,.deck-academics h2 em{font-size:35px;letter-spacing:-1.6px}
  .deck-academics h2{margin-top:34px}
  .deck-academics>p{font-size:10px}
  .deck-exploration h2{font-size:51px;margin-top:41px}
  .deck-exploration h2 em{font-size:59px}
  .deck-leadership h2,.deck-leadership h2 em{font-size:39px}
  .deck-leadership h2{margin-top:20px}
  .deck-leadership>p{top:155px;font-size:9px}
  .deck-leadership .deck-photo{height:145px;bottom:14px;left:14px;right:14px}
  .portfolio-grid{gap:6px;padding-right:20px}
  .portfolio-tile>span{font-size:7px;letter-spacing:.4px}
}
@media(max-width:700px){
  .deck-academics .deck-photo{top:49px}
  .deck-academics .mini-header{padding-bottom:13px}
  .deck-academics h2,.deck-academics h2 em{font-size:clamp(23px,6.7vw,31px);letter-spacing:-1.2px}
  .deck-academics h2{margin-top:32px}
  .deck-academics>p{font-size:9px;left:24px;bottom:25px;max-width:38%}
  .deck-exploration h2{font-size:40px;letter-spacing:-2px;margin-top:33px}
  .deck-exploration h2 em{font-size:47px}
  .deck-exploration>p{font-size:8px;left:14px;bottom:17px;padding:7px 10px}
  .deck-leadership h2,.deck-leadership h2 em{font-size:32px;letter-spacing:-1px}
  .deck-leadership h2{margin-top:16px}
  .deck-leadership>p{top:127px;font-size:8px}
  .deck-leadership .deck-photo{height:auto;aspect-ratio:3;left:12px;right:12px;bottom:12px}
  .area-academics .program-visual,.area-exploration .program-visual,.area-leadership .program-visual{max-width:none}
  .area-academics .area-photo{background-size:contain;background-position:center;background-color:#b8af94}
  .area-exploration .area-photo{background-size:cover;background-position:center 68%}
  .portfolio-grid{padding:0 22px;gap:7px}
  .portfolio-tile{transform:translateY(-43px)}
  .portfolio-tile:nth-child(3){transform:translateY(43px)}
  .portfolio-tile>span{font-size:7px;letter-spacing:.3px;margin-top:9px}
}

/* User-selected dance photographs: one distinct image on each named card.
   Fit the complete photographs so hands, feet, and fabric are not cropped. */
.journey-card.deck-dance{background:#050505;color:#fbf7ee}
.deck-dance .deck-photo{inset:0;width:100%;height:100%;opacity:1;mask-image:none;background-size:contain;background-position:right bottom;background-repeat:no-repeat;z-index:0}
.deck-dance::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#05050580,transparent 60%)}
.deck-dance .mini-header{text-shadow:0 1px 8px #000}
.deck-dance h2{font-size:50px;line-height:1.04;letter-spacing:-1.8px;max-width:370px;margin-top:48px;text-shadow:0 2px 20px #0008}
.deck-dance h2 em{font-size:53px}
.deck-dance>p{left:34px;bottom:28px;top:auto;max-width:80%;font-size:11px;line-height:1.5;padding:0;background:none;text-shadow:0 1px 10px #000}
.deck-exploration.deck-dance{background:#05080c;color:#fff1e4}
.deck-exploration.deck-dance .deck-photo{background-size:auto 100%}
.deck-exploration.deck-dance h2{max-width:300px;font-size:49px}
.deck-exploration.deck-dance h2 em{font-size:54px}
.deck-college.deck-dance{color:#e3f4f0}
.deck-college.deck-dance h2{margin-top:24px;font-size:47px;max-width:390px}
.deck-college.deck-dance h2 em{font-size:50px}
.deck-college.deck-dance::after{background:linear-gradient(180deg,#0003,transparent 48%)}
.deck-essays.deck-dance{color:#ffedef}
.deck-essays.deck-dance::after{background:linear-gradient(90deg,#07030399,#07030340 43%,transparent 68%)}

@media(max-width:1100px){
  .deck-dance h2{margin-top:39px;font-size:41px;max-width:330px}
  .deck-dance h2 em{font-size:44px}
  .deck-exploration.deck-dance h2{font-size:40px;max-width:250px}
  .deck-exploration.deck-dance h2 em{font-size:44px}
  .deck-college.deck-dance h2{margin-top:21px;font-size:39px;max-width:330px}
  .deck-college.deck-dance h2 em{font-size:42px}
  .deck-dance>p{font-size:10px}
}
@media(max-width:700px){
  .deck-dance h2{margin-top:25px;font-size:32px;letter-spacing:-1px;max-width:280px}
  .deck-dance h2 em{font-size:35px}
  .deck-dance>p{left:24px;bottom:20px;font-size:8px;max-width:85%}
  .deck-exploration.deck-dance .deck-photo{background-size:auto 86%}
  .deck-exploration.deck-dance h2{font-size:31px;max-width:180px;margin-top:37px}
  .deck-exploration.deck-dance h2 em{font-size:34px}
  .deck-college.deck-dance h2{margin-top:16px;font-size:31px;line-height:1.02;max-width:285px}
  .deck-college.deck-dance h2 em{font-size:33px}
  .deck-essays.deck-dance h2{max-width:225px}
}
@media(max-width:360px){
  .deck-exploration.deck-dance .deck-photo{background-size:auto 78%}
  .deck-exploration.deck-dance h2{font-size:27px;max-width:150px}
  .deck-exploration.deck-dance h2 em{font-size:29px}
}

/* Making and belonging: original uploaded photographs with copy on the right. */
.journey-card.deck-editorial{background:#25221e;color:#fff6e8}
.deck-editorial .deck-photo{inset:0;width:100%;height:100%;opacity:1;mask-image:none;background-size:cover;background-position:center;z-index:0}
.deck-editorial::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(270deg,#12100ca6,#12100c35 35%,transparent 65%),linear-gradient(180deg,#14120a22,transparent 65%,#14120a66)}
.deck-editorial .mini-header{text-shadow:0 1px 8px #000}
.deck-editorial h2{position:absolute;top:83px;right:32px;margin:0;width:47%;max-width:none;font-size:44px;line-height:1.06;letter-spacing:-1.5px;text-align:right;text-shadow:0 2px 18px #0005}
.deck-editorial h2 em{font-size:47px}
.deck-editorial>p{top:auto;bottom:27px;left:auto;right:32px;max-width:80%;padding:0;background:none;font-size:11px;line-height:1.5;text-align:right;text-shadow:0 1px 10px #000}
.deck-college.deck-editorial{color:#f4f4ef}
.deck-college.deck-editorial h2{top:96px;width:42%}
.deck-college.deck-editorial .deck-photo{background-position:48% center}
@media(max-width:1100px){
  .deck-editorial h2{top:76px;right:28px;font-size:36px;letter-spacing:-1.2px}
  .deck-editorial h2 em{font-size:39px}
  .deck-editorial>p{right:28px;bottom:25px;font-size:10px}
  .deck-college.deck-editorial h2{top:83px}
}
@media(max-width:700px){
  .deck-editorial h2{top:60px;right:22px;width:55%;font-size:clamp(26px,7.6vw,32px);letter-spacing:-1px}
  .deck-editorial h2 em{font-size:clamp(28px,8.2vw,35px)}
  .deck-editorial>p{right:22px;bottom:20px;font-size:8px}
  .deck-summer.deck-editorial .deck-photo{background-position:52% center}
  .deck-college.deck-editorial h2{top:73px;right:20px;width:43%;font-size:clamp(23px,6.7vw,30px)}
  .deck-college.deck-editorial h2 em{font-size:clamp(27px,7.6vw,34px)}
  .deck-college.deck-editorial .deck-photo{background-position:46% center}
}