/*
Theme Name: Alpha Mu Omega
Description: Cinematic Alpha Mu Omega Alumni Chapter CMP theme.
Version: 1.0.0
Author: Alpha Mu Omega
*/
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/font-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/font-1.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/font-2.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/font-3.ttf) format('truetype');
}

:root{--brown:#29221d;--gold:#d4af37;font-family:'DM Sans',Arial,sans-serif;background:var(--gold);color:var(--brown);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer;background:none;border:0;color:inherit;font-size:11px;letter-spacing:1px;padding:10px 0}button:focus-visible{outline:2px solid currentColor;outline-offset:6px}[hidden]{display:none!important}
.hero{position:relative;isolation:isolate;height:100svh;min-height:560px;overflow:hidden;background:var(--gold)}
.top-header{position:absolute;z-index:5;top:26px;left:16px;right:16px;text-align:center;color:var(--gold);pointer-events:none}.top-header p{font-size:16px;font-weight:500;letter-spacing:5px;line-height:1.6;margin:0}.revealed .top-header{color:var(--brown)}
.hero-overlay{position:absolute;inset:0;z-index:1;background:var(--brown)}.revealed .hero-overlay{visibility:hidden}
.intro-ui{position:absolute;inset:0;z-index:4;color:var(--gold);pointer-events:none}.overlay-text-container{position:absolute;left:3vw;top:115px;font-size:clamp(18px,2vw,30px);height:1.35em;overflow:hidden}.overlay-text p{margin:0;height:1.35em;line-height:1.35}.counter{position:absolute;bottom:22px;right:3vw;font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(100px,15vw,240px);font-weight:600;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.055em}.skip{position:absolute;bottom:30px;left:3vw;pointer-events:auto}
/* Seven siblings, never wrapped: every image shares the same vertical center. */
.hero-images{position:absolute;z-index:2;top:46%;left:50%;transform:translate(-50%,-50%);display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;gap:2.5vw;width:max-content}
.img{flex:none;margin:0;width:9vw;height:clamp(110px,20vw,310px);overflow:hidden;will-change:transform,clip-path}.img img{display:block;width:100%;height:100%;object-fit:cover}.hero-img{width:14vw;height:14vw;z-index:2}.hero-img img{object-fit:contain}.community-img{visibility:visible}
.revealed .community-img{visibility:hidden}.revealed .hero-img{width:min(35vw,43svh);height:min(35vw,43svh);mix-blend-mode:normal}.revealed .hero-images{top:38%}
.hero-header{position:absolute;z-index:3;left:2vw;right:2vw;bottom:62px;text-align:center}h1{margin:0;font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:clamp(44px,11.5vw,185px);line-height:.85;font-weight:700;letter-spacing:-.035em}.title-line{display:block;white-space:nowrap}.title-line+.title-line{font-size:.83em;margin-top:.07em}.word-mask{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}.word-mask>span{display:inline-block;will-change:transform}
footer{position:absolute;z-index:3;bottom:15px;left:3vw;right:3vw;display:flex;align-items:center;justify-content:space-between}footer p{font-size:9px;letter-spacing:2px;margin:0}footer p span{margin-left:20px}
@media(max-width:600px){.top-header{top:22px}.overlay-text-container{top:130px;left:5vw}.hero-images{gap:2vw}.img{width:9vw;height:29vw}.hero-img{width:18vw;height:18vw}.revealed .hero-img{width:min(64vw,36svh);height:min(64vw,36svh)}.revealed .hero-images{top:42%}.hero-header{bottom:95px}h1{font-size:12vw}footer{left:5vw;right:5vw}footer p{font-size:7px;letter-spacing:1px}footer p span{display:block;margin:5px 0 0}.counter{right:5vw}.skip{left:5vw}}
@media(max-height:600px) and (min-width:601px){.hero{min-height:420px}.top-header{top:12px}.overlay-text-container{top:70px}.revealed .hero-img{width:32svh;height:32svh}.revealed .hero-images{top:35%}h1{font-size:min(10vw,20svh)}.hero-header{bottom:55px}}

.revealed .hero-images{mix-blend-mode:normal}


body:not(.revealed) .word-mask > span{transform:translateY(115%)}
