.gallery-page-hero{min-height:clamp(570px,78svh,710px);position:relative;isolation:isolate;display:flex;align-items:center;overflow:hidden;padding:54px 5.3%;background:#fff url('../images/galeria.png') right center/min(90vw,1450px) auto no-repeat}
.gallery-page-hero:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 24%,rgba(255,255,255,.87) 36%,rgba(255,255,255,.45) 48%,transparent 66%)}
.gallery-hero-copy{position:relative;z-index:1;width:min(49%,700px)}
.gallery-page-hero .eyebrow{font-size:10px;letter-spacing:.25em}
.gallery-page-hero h1{font:700 clamp(64px,8vw,116px)/.9 var(--display);letter-spacing:-.085em;margin:0 0 18px;white-space:nowrap}
.gallery-title-dark{color:#101426}.gallery-title-gradient{background:linear-gradient(90deg,#087ff1 0%,#533bff 49%,#e52b9c 100%);background-clip:text;-webkit-background-clip:text;color:transparent}
.gallery-title-mark{display:block;width:80px;height:7px;border-radius:8px;background:linear-gradient(90deg,#009ff5,#693cff,#e72ba2);margin:0 0 20px}
.gallery-hero-copy>p{max-width:520px;margin:0 0 31px;color:#151a2b;font-size:clamp(18px,2.2vw,27px);line-height:1.4}
.gallery-categories{display:grid;grid-template-columns:repeat(2,minmax(100px,1fr));max-width:510px;scroll-margin-top:85px}
.gallery-category{min-height:122px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;padding:0 13px;text-align:center;font-size:14px;line-height:1.15;font-weight:700;transition:transform .2s ease}
.gallery-category:nth-child(odd){border-right:1px solid #a9adba}.gallery-category:hover,.gallery-category:focus-visible{transform:translateY(-4px);outline:none}
.gallery-category-icon{display:grid;place-items:center;border-radius:50%;color:#fff;width:66px;height:66px;box-shadow:0 8px 18px #11142a18}.gallery-category-icon svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.gallery-aula .gallery-category-icon{background:#126ef2}.gallery-feria .gallery-category-icon{background:#ef1375}.gallery-proyeccion .gallery-category-icon{background:#6738ec}.gallery-centros .gallery-category-icon{background:#f39a00}
.gallery-hero-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.gallery-intro{padding:76px 8% 32px;text-align:center;background:#fff}.gallery-intro h2{font:700 clamp(36px,4.8vw,58px)/.98 var(--display);letter-spacing:-.06em;margin:0 0 14px}.gallery-intro h2 span{color:#693cf1}.gallery-intro p{max-width:680px;margin:0 auto;color:#535a69;font-size:16px;line-height:1.55}
.gallery-showcase{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:22px 5.3% 78px;background:#fff}
.gallery-showcase-card{scroll-margin-top:90px;overflow:hidden;border-radius:15px;border:1px solid #ebeaf0;background:#fff;box-shadow:0 8px 25px #161a300b;transition:transform .25s ease,box-shadow .25s ease}.gallery-showcase-card:hover{transform:translateY(-5px);box-shadow:0 16px 30px #161a3014}
.gallery-work-image{height:235px;background-position:center;background-size:cover;background-color:#e9eaf0}.work-aula{background-image:url('../images/photos/art%C3%ADstica-1.png')}.work-feria{background-image:url('../images/photos/aprender.png')}.work-proyeccion{background-image:url('../images/photos/ashe2-concierto.png')}.work-centros{background-image:url('../images/photos/sonidos.png')}
.gallery-work-copy{padding:22px 20px 24px}.card-kicker{display:block;font-size:9px;letter-spacing:.13em;color:#6c48db;font-weight:800;margin-bottom:8px}.gallery-work-copy h3{font:700 22px/1.1 var(--display);letter-spacing:-.035em;margin:0 0 9px}.gallery-work-copy p{font-size:13px;line-height:1.5;color:#51596a;margin:0}
@media(max-width:1100px){.gallery-page-hero{min-height:600px}.gallery-hero-copy{width:min(55%,660px)}.gallery-page-hero h1{font-size:clamp(62px,8.5vw,95px)}.gallery-categories{max-width:470px}.gallery-category{padding-left:8px;padding-right:8px}.gallery-showcase{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-work-image{height:195px}}
@media(max-width:760px){.gallery-page-hero{min-height:760px;align-items:flex-start;padding:55px 7% 28px;background-position:58% bottom;background-size:auto 42%}.gallery-page-hero:before{background:linear-gradient(180deg,#fff 0%,#fffffff5 34%,#ffffffc9 49%,transparent 70%)}.gallery-hero-copy{width:100%;max-width:570px}.gallery-page-hero h1{font-size:clamp(62px,13vw,88px);white-space:normal}.gallery-hero-copy>p{font-size:19px;max-width:440px;margin-bottom:25px}.gallery-categories{grid-template-columns:repeat(2,minmax(0,1fr));max-width:500px;gap:7px}.gallery-category{min-height:95px;display:flex;justify-content:flex-start;gap:7px;padding:6px 4px;font-size:11px}.gallery-category:nth-child(odd){border-right:1px solid #a9adba}.gallery-category-icon{width:48px;height:48px}.gallery-category-icon svg{width:27px;height:27px}.gallery-intro{padding:54px 7% 20px}.gallery-intro h2{font-size:40px}.gallery-intro p{font-size:14px}.gallery-showcase{grid-template-columns:1fr;padding:16px 7% 52px;gap:12px}.gallery-work-image{height:220px}.gallery-work-copy{padding:18px}}
@media(max-width:390px){.gallery-page-hero{min-height:730px}.gallery-page-hero h1{font-size:60px}.gallery-hero-copy>p{font-size:17px}.gallery-category{min-height:82px;font-size:10px}.gallery-category-icon{width:42px;height:42px}.gallery-work-image{height:190px}}
@media(max-width:760px) and (orientation:landscape){.gallery-page-hero{min-height:min(690px,calc(100svh - 62px));align-items:center;padding:34px 7%;background-position:right center;background-size:min(90vw,1000px) auto}.gallery-page-hero:before{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.94) 38%,rgba(255,255,255,.55) 57%,transparent 76%)}.gallery-hero-copy{width:58%}.gallery-page-hero h1{font-size:clamp(44px,9vw,70px)}.gallery-hero-copy>p{font-size:16px}.gallery-categories{max-width:100%}.gallery-category{min-height:94px;padding:0 6px;font-size:10px}.gallery-category-icon{width:46px;height:46px}.gallery-category-icon svg{width:25px;height:25px}.gallery-showcase{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px) and (orientation:portrait){.gallery-page-hero{background-position:center bottom;background-size:200vw auto}}
@media(prefers-reduced-motion:reduce){.gallery-category,.gallery-showcase-card{transition:none}}
