/* NHIS Gallery page. Scoped to .nhgy so the school's header and footer are untouched. */
body.nhgy-body #main-content{background:#fff}
.nhgy{--nh-a:#BD648B;--nh-d:#8f3d63;--nh-s:#f6e0eb;--nh-f:#fdf3f8;--ink:#231F20;--mut:#6a6468;--line:#eee6ea;
 font-family:Rubik,Helvetica,Arial,sans-serif;font-size:16px;font-weight:300;line-height:1.55;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;overflow:hidden}
.nhgy *,.nhgy *::before,.nhgy *::after{box-sizing:border-box}
.nhgy h1,.nhgy h2,.nhgy h3,.nhgy p,.nhgy figure{margin:0;padding:0}
.nhgy a{color:inherit;text-decoration:none}
.nhgy button,.nhgy select{font-family:inherit}
.nhgy :focus-visible{outline:3px solid color-mix(in srgb,var(--nh-a) 55%,#fff);outline-offset:3px;border-radius:10px}
.nhgy-wrap{width:min(1240px,100% - 48px);margin-inline:auto}
.nhgy [hidden]{display:none!important}

/* hero + tabs */
.nhgy-hero{padding:160px 24px 0;text-align:center;background:radial-gradient(900px 380px at 50% 0,#fff 0,transparent 70%),linear-gradient(180deg,var(--nh-f) 0,var(--nh-s) 170%)}
.nhgy-hero__in{max-width:760px;margin:0 auto}
.nhgy-eyebrow{display:inline-block;padding:6px 14px;border-radius:999px;background:var(--nh-s);color:var(--nh-d);font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase}
.nhgy-hero h1{margin:22px 0 0;font-size:clamp(34px,5.4vw,56px);font-weight:500;line-height:1.1;letter-spacing:-.025em;text-wrap:balance}
.nhgy-lead{max-width:520px;margin:18px auto 0;font-size:clamp(16px,1.9vw,18.5px);line-height:1.6;color:#4d474b;text-wrap:balance}
.nhgy-tabs{display:inline-flex;gap:6px;margin-top:34px;padding:6px;border-radius:999px;background:#fff;box-shadow:0 10px 30px color-mix(in srgb,var(--nh-a) 16%,transparent),0 1px 4px rgba(35,31,32,.06);transform:translateY(50%)}
.nhgy-tabbtn{min-width:140px;height:48px;padding:0 28px;border:0;border-radius:999px;background:transparent;color:var(--ink);font-size:15.5px;font-weight:400;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.nhgy-tabbtn:hover{color:var(--nh-d);background:var(--nh-f)}
.nhgy-tabbtn.is-on{background:var(--nh-a);color:#fff;font-weight:500;box-shadow:0 8px 20px color-mix(in srgb,var(--nh-a) 30%,transparent)}

.nhgy-sec{padding:96px 0 84px;min-height:50vh;scroll-margin-top:96px}
.nhgy-panel{animation:nhgyPop .4s cubic-bezier(.2,.8,.2,1) both}
@keyframes nhgyPop{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.nhgy-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:6px}
.nhgy h2{font-size:clamp(26px,3.2vw,34px);font-weight:500;letter-spacing:-.02em;line-height:1.15}
.nhgy-meta{margin-top:6px;font-size:14.5px;color:var(--mut)}
.nhgy-sel{display:inline-flex;align-items:center;gap:12px;font-size:14.5px;color:var(--mut)}
.nhgy-sel select{appearance:none;-webkit-appearance:none;height:44px;padding:0 42px 0 18px;border:1.5px solid var(--line);border-radius:999px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23231F20' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center/16px;font-size:14.5px;color:var(--ink);cursor:pointer}
.nhgy-sel select:hover{border-color:var(--nh-a)}
.nhgy-chips{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 28px}
.nhgy-chip{height:42px;padding:0 20px;border:1.5px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font-size:14.5px;font-weight:400;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .15s}
.nhgy-chip:hover{border-color:var(--nh-a);color:var(--nh-d)}
.nhgy-chip.is-on{background:var(--nh-a);border-color:var(--nh-a);color:#fff;font-weight:500;box-shadow:0 8px 20px color-mix(in srgb,var(--nh-a) 28%,transparent)}
.nhgy-chip:active{transform:scale(.96)}
.nhgy-empty{padding:40px 0 8px;text-align:center;color:var(--mut)}
.nhgy-more{margin-top:22px;text-align:center}
.nhgy .nhgy-btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 32px;border-radius:999px;border:1.5px solid var(--nh-a);background:#fff;color:var(--nh-d);font-size:15.5px;font-weight:500;transition:background .2s,color .2s,transform .2s,box-shadow .2s}
.nhgy .nhgy-btn:hover{background:var(--nh-a);color:#fff;transform:translateY(-2px);box-shadow:0 10px 24px color-mix(in srgb,var(--nh-a) 32%,transparent)}

/* photo grid */
.nhgy-grid{column-count:4;column-gap:18px}
.nhgy .nhgy-tile{position:relative;display:block;break-inside:avoid;margin:0 0 18px;border-radius:20px;overflow:hidden;background:var(--nh-s);box-shadow:0 1px 2px rgba(35,31,32,.05);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.nhgy-tile:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(35,31,32,.16)}
.nhgy-tile__btn{position:relative;display:block;width:100%;padding:0;border:0;background:none;text-align:left;color:#fff;cursor:zoom-in;overflow:hidden}
.nhgy-tile--portrait .nhgy-tile__btn{aspect-ratio:4/5}
.nhgy-tile--tall .nhgy-tile__btn{aspect-ratio:3/4.4}
.nhgy-tile--square .nhgy-tile__btn{aspect-ratio:1/1}
.nhgy-tile--wide .nhgy-tile__btn{aspect-ratio:4/3}
.nhgy-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.nhgy-tile:hover img{transform:scale(1.06)}
.nhgy-tile figcaption{position:absolute;left:0;right:0;bottom:0;padding:48px 16px 14px;font-size:13.5px;font-weight:400;line-height:1.35;color:#fff;background:linear-gradient(180deg,transparent,rgba(35,31,32,.78))}

/* yearbook folder cards */
.nhgy-yb{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:26px}
.nhgy-card{position:relative;background:var(--nh-f);border:1px solid var(--line);border-radius:6.2%/7.4%;aspect-ratio:353/298;overflow:hidden;container-type:inline-size;--u:calc(100cqw/353)}
.nhgy-step{position:absolute;left:calc(var(--u)*19);top:calc(var(--u)*20);font-size:calc(var(--u)*13);color:#8a8a8e;z-index:5}
.nhgy-frame{position:absolute;display:block;width:calc(var(--u)*150);height:calc(var(--u)*130);padding:calc(var(--u)*5);border:0;background:#f1f3f7;border-radius:calc(var(--u)*20);box-shadow:0 calc(var(--u)*6) calc(var(--u)*18) rgba(0,0,0,.12);transition:transform .25s ease,box-shadow .25s ease}
button.nhgy-frame{cursor:zoom-in}
.nhgy-frame img{display:block;width:100%;height:100%;object-fit:cover;background:#dcdde1;border-radius:calc(var(--u)*15)}
.nhgy-frame.is-empty{display:grid;place-items:center;color:var(--t);opacity:.8}
.nhgy-frame.is-empty span{display:grid;place-items:center;width:100%;height:100%;border-radius:calc(var(--u)*15);background:#e7e9ee}
.nhgy-frame.is-empty svg{width:calc(var(--u)*30);height:calc(var(--u)*30)}
.nhgy-frame--l{left:calc(var(--u)*24);top:calc(var(--u)*38);transform:rotate(-4deg)}
.nhgy-frame--r{left:calc(var(--u)*180);top:calc(var(--u)*48);transform:rotate(4deg);z-index:1}
button.nhgy-frame--l:hover{transform:rotate(-4deg) translateY(-4px) scale(1.02);box-shadow:0 12px 26px rgba(0,0,0,.18)}
button.nhgy-frame--r:hover{transform:rotate(4deg) translateY(-4px) scale(1.02);box-shadow:0 12px 26px rgba(0,0,0,.18)}
.nhgy-folder{position:absolute;left:calc(var(--u)*16);right:calc(var(--u)*16);bottom:calc(var(--u)*16);height:calc(var(--u)*126);z-index:3;pointer-events:none}
.nhgy-tab{position:absolute;left:0;top:0;width:58%;height:calc(var(--u)*44);border-radius:calc(var(--u)*14) calc(var(--u)*14) 0 0;background:var(--c)}
.nhgy-tab::after{content:"";position:absolute;right:calc(var(--u)*-17);top:0;width:calc(var(--u)*36);height:calc(var(--u)*44);background:var(--c);transform:skewX(32deg);transform-origin:top;border-top-right-radius:calc(var(--u)*10)}
.nhgy-fbody{position:absolute;left:0;right:0;top:calc(var(--u)*33);bottom:0;background:var(--c);border-radius:0 calc(var(--u)*12) calc(var(--u)*12) calc(var(--u)*12);padding:calc(var(--u)*25) calc(var(--u)*20) 0}
.nhgy .nhgy-folder h3{position:absolute;left:calc(var(--u)*20);top:calc(var(--u)*15);font-weight:500;font-size:calc(var(--u)*22);line-height:calc(var(--u)*30);color:var(--t);z-index:2}
.nhgy-rule{height:1px;background:rgba(0,0,0,.12);margin:0 0 calc(var(--u)*14)}
.nhgy .nhgy-fbody p{font-size:calc(var(--u)*15);line-height:calc(var(--u)*20);color:#4a4a4f}
.nhgy-c1{--c:#e4e9f3;--t:#14284b}.nhgy-c2{--c:#f3e3e6;--t:#6d1428}.nhgy-c3{--c:#e1ede6;--t:#1b4d34}.nhgy-c4{--c:#f5ecd4;--t:#8a6414}.nhgy-c5{--c:#ece3f0;--t:#4e1f63}.nhgy-c6{--c:#dcecee;--t:#12565e}.nhgy-c7{--c:#f6e5da;--t:#9a4a14}.nhgy-c8{--c:#e6e8eb;--t:#2b3440}.nhgy-c9{--c:#dfe8f8;--t:#1f3f8f}.nhgy-c10{--c:#ebecd9;--t:#55600f}.nhgy-c11{--c:#f4e1e8;--t:#8a2150}.nhgy-c12{--c:#ece6dd;--t:#5c4a36}

/* lightbox */
.nhgy-lb{position:fixed;inset:0;z-index:2147483000;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:56px 14px 28px;background:rgba(20,15,18,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:nhgyFade .25s ease both}
@keyframes nhgyFade{from{opacity:0}to{opacity:1}}
.nhgy-lb__fig{display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0}
.nhgy-lb__fig img{max-width:100%;max-height:calc(100vh - 180px);max-height:calc(100dvh - 180px);border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.5);object-fit:contain;background:#111}
.nhgy-lb__fig figcaption{text-align:center;color:#fff}
.nhgy-lb__fig strong{display:block;font-size:18px;font-weight:500}
.nhgy-lb__fig span{display:block;margin-top:3px;font-size:13px;color:rgba(255,255,255,.65)}
.nhgy-lb__x,.nhgy-lb__nav{display:grid;place-items:center;width:46px;height:46px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;cursor:pointer;transition:background .2s}
.nhgy-lb__x:hover,.nhgy-lb__nav:hover{background:var(--nh-a)}
.nhgy-lb__x{position:absolute;top:10px;right:12px}
.nhgy-lb__nav--p svg{transform:rotate(180deg)}
html.nhgy-lock,html.nhgy-lock body{overflow:hidden!important}

@media (max-width:1100px){.nhgy-grid{column-count:3}.nhgy-yb{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}}
@media (max-width:640px){
 .nhgy-wrap{width:calc(100% - 32px)}
 .nhgy-hero{padding:112px 16px 0}
 .nhgy-tabs{width:100%;margin-top:26px}
 .nhgy-tabbtn{flex:1;min-width:0;padding:0 12px}
 .nhgy-sec{padding:84px 0 60px}
 .nhgy-grid{column-count:2;column-gap:12px}
 .nhgy .nhgy-tile{margin-bottom:12px;border-radius:16px}
 .nhgy-tile figcaption{padding:36px 12px 11px;font-size:12.5px}
 .nhgy-chips{flex-wrap:nowrap;overflow-x:auto;margin:20px -16px 22px;padding:2px 16px 8px;scrollbar-width:none}
 .nhgy-chips::-webkit-scrollbar{display:none}
 .nhgy-chip{flex:none;height:40px}
 .nhgy-yb{grid-template-columns:minmax(0,1fr)}
 .nhgy-lb{grid-template-columns:minmax(0,1fr);padding:60px 10px 80px}
 .nhgy-lb__nav{position:absolute;bottom:18px;width:48px;height:48px}
 .nhgy-lb__nav--p{left:calc(50% - 58px)}.nhgy-lb__nav--n{right:calc(50% - 58px)}
}
@media (max-width:360px){.nhgy-grid{column-count:1}}
@media (prefers-reduced-motion:reduce){.nhgy *,.nhgy *::before,.nhgy *::after{animation:none!important;transition:none!important}}
