.portfolio-page{background:#080909;color:#fff}
.portfolio-page .main-nav a.active{color:var(--gold);position:relative}
.portfolio-page .main-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:-12px;height:2px;background:var(--gold)}
.portfolio-hero{height:440px;position:relative;overflow:hidden;background:#080909;color:#fff}
.portfolio-hero-bg{position:absolute;inset:0;background:url('assets/studio-control-room.webp') center/cover no-repeat;transform:scale(1.01)}
.portfolio-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,5,5,.98) 0%,rgba(4,5,5,.94) 38%,rgba(4,5,5,.52) 63%,rgba(4,5,5,.16) 100%)}
.portfolio-hero-inner{position:relative;height:100%;display:flex;align-items:center}
.portfolio-hero-copy{max-width:660px;padding-top:10px}
.portfolio-hero h1{font-family:Montserrat,Arial,sans-serif;font-size:clamp(64px,8vw,96px);line-height:.92;letter-spacing:-.03em;margin:0 0 24px;text-transform:uppercase}
.portfolio-hero-copy>p:last-child{max-width:620px;font-size:17px;line-height:1.72;color:#ededed;margin:0}
.portfolio-dark{background:linear-gradient(180deg,#080909,#101112);color:#fff}
.portfolio-light{background:var(--cream);color:#111}
.portfolio-areas-top{padding:26px 0 42px}
.portfolio-area-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.portfolio-area-card{min-height:155px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:22px 16px}
.portfolio-area-card svg{width:54px;height:54px;fill:none;stroke:var(--gold);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-bottom:13px}
.portfolio-area-card h2{font:600 15px/1.25 Montserrat,Arial,sans-serif;text-transform:uppercase;margin:0}
.portfolio-projects-section{padding:34px 0 80px}
.portfolio-section-title{margin:0 0 34px}
.portfolio-section-title .eyebrow{margin-bottom:8px}
.portfolio-section-title h2{font:700 clamp(34px,4vw,51px)/1.08 Montserrat,Arial,sans-serif;margin:0;letter-spacing:-.025em}
.portfolio-section-title>p:last-child:not(.eyebrow){max-width:880px;color:#d3d3d3;line-height:1.7;font-size:16px}
.spaced-title{padding-top:10px;margin-bottom:38px}
.project-grid{display:grid;gap:18px}
.project-grid-three{grid-template-columns:repeat(3,1fr)}
.project-grid-secondary{margin-top:18px}
.project-card{background:#141617;border:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;min-width:0;box-shadow:0 18px 38px rgba(0,0,0,.18)}
.project-media{height:300px;background:#060707;display:flex;align-items:center;justify-content:center;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.08)}
.project-media img{width:100%;height:100%;display:block}
.project-media.contain img{object-fit:contain}
.light-media{background:#f1eadf}
.project-copy{padding:24px 24px 26px}
.project-copy h3{font:700 23px/1.2 Montserrat,Arial,sans-serif;margin:0 0 8px}
.project-credit{color:var(--gold)!important;font-weight:700;margin-bottom:12px!important}
.project-copy p{font-size:14px;line-height:1.65;color:#dedede;margin:0}
.classroom-placeholder{flex-direction:column;color:var(--gold);gap:10px;background:radial-gradient(circle at 50% 30%,rgba(200,154,66,.13),transparent 52%),#0b0c0d}
.classroom-placeholder svg{width:76%;max-width:290px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round}
.classroom-placeholder span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#9e9e9e}
.video-project-section{padding:78px 0}
.video-project-card{display:grid;grid-template-columns:1.25fr .75fr;gap:0;border:1px solid rgba(255,255,255,.11);background:#121415;min-height:380px}
.youtube-lazy{min-height:380px;background:#070808;position:relative}
.youtube-lazy iframe{width:100%;height:100%;min-height:380px;border:0;display:block}
.youtube-poster{position:absolute;inset:0;width:100%;border:0;color:#fff;background:linear-gradient(135deg,rgba(0,0,0,.4),rgba(0,0,0,.82)),url('https://img.youtube.com/vi/gXZimM5YxcY/hqdefault.jpg') center/cover no-repeat;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center}
.youtube-mark{position:absolute;left:22px;top:20px;background:#fff;color:#111;padding:6px 9px;font-weight:700;font-size:12px;border-radius:2px}
.youtube-play{width:82px;height:58px;border-radius:15px;background:#ff0033;position:relative;margin-bottom:22px;box-shadow:0 12px 28px rgba(0,0,0,.4)}
.youtube-play::after{content:"";position:absolute;left:34px;top:17px;border-left:20px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent}
.youtube-poster strong{font:700 clamp(23px,3vw,42px)/1.08 Montserrat,Arial,sans-serif;text-shadow:0 3px 14px #000}
.youtube-poster small{margin-top:10px;color:#ddd}
.video-project-copy{padding:44px;display:flex;flex-direction:column;justify-content:center}
.video-project-copy h3{font:700 30px/1.15 Montserrat,Arial,sans-serif;margin:0 0 18px}
.video-project-copy p{font-size:15px;line-height:1.72;color:#dedede;margin:0 0 24px}
.video-project-copy .btn{align-self:flex-start}
.portfolio-areas-summary{padding:52px 0 60px}
.summary-area-grid{display:grid;grid-template-columns:repeat(5,1fr);margin-top:24px}
.summary-area-grid article{padding:18px 24px;text-align:center;border-left:1px solid #d6cec1}
.summary-area-grid article:first-child{border-left:0}
.summary-area-grid h3{font:700 16px/1.25 Montserrat,Arial,sans-serif;text-transform:uppercase;margin:0 0 12px;color:#111}
.summary-area-grid p{font-size:13px;line-height:1.55;color:#5d5953;margin:0}
.schools-section{padding:78px 0}
.school-grid{display:grid;grid-template-columns:1.15fr 1fr .85fr;gap:18px}
.school-card{border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));padding:30px 28px}
.school-card h3{font:700 25px/1.1 Montserrat,Arial,sans-serif;color:var(--gold);margin:0 0 20px}
.school-card .region-second{margin-top:32px;padding-top:26px;border-top:1px solid rgba(255,255,255,.1)}
.school-card h4{font:700 15px/1.2 Montserrat,Arial,sans-serif;text-transform:uppercase;margin:20px 0 9px;color:#fff}
.school-card h4:first-of-type{margin-top:0}
.school-card ul{margin:0;padding-left:18px;color:#ddd;font-size:14px;line-height:1.65}
.world-music-strip{margin-top:20px;border:1px solid rgba(200,154,66,.35);background:linear-gradient(90deg,rgba(200,154,66,.08),rgba(255,255,255,.025));padding:30px 32px;display:grid;grid-template-columns:.48fr 1.52fr;gap:40px;align-items:center}
.world-music-strip h3{font:700 29px/1.1 Montserrat,Arial,sans-serif;margin:0}
.world-music-strip>p{font-size:16px;line-height:1.72;color:#e1e1e1;margin:0}
.collaborations-section{padding:78px 0 86px}
.collaboration-grid{display:grid;gap:16px}
.collaboration-grid-five{grid-template-columns:repeat(5,1fr)}
.collaboration-card,.album-card{border:1px solid rgba(255,255,255,.1);background:#141617;overflow:hidden}
.collaboration-media{aspect-ratio:1/1;background:#050606;display:flex;align-items:center;justify-content:center;overflow:hidden}
.collaboration-media img{width:100%;height:100%;object-fit:contain;display:block}
.collaboration-copy{padding:19px 18px 22px;min-height:124px}
.collaboration-copy h3,.album-copy h3{font:700 17px/1.25 Montserrat,Arial,sans-serif;color:var(--gold);margin:0 0 9px}
.collaboration-copy p,.album-copy p{font-size:13px;line-height:1.55;color:#ddd;margin:0}
.album-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.album-media{aspect-ratio:1/1;background:#050606;display:flex;align-items:center;justify-content:center}
.album-media img{width:100%;height:100%;object-fit:contain}
.album-copy{padding:23px 22px 27px}
.album-copy h3{font-size:19px}
.portfolio-footer{background:#060707;color:#fff;border-top:1px solid rgba(255,255,255,.08);padding:28px 0}
.portfolio-footer-grid{display:grid;grid-template-columns:1.1fr repeat(4,auto);gap:28px;align-items:center}
.portfolio-footer a,.portfolio-footer span{color:#ececec;text-decoration:none;font-size:12px;white-space:nowrap}
@media(max-width:1120px){.portfolio-area-grid,.summary-area-grid{grid-template-columns:repeat(3,1fr)}.collaboration-grid-five{grid-template-columns:repeat(3,1fr)}.portfolio-footer-grid{grid-template-columns:1fr 1fr}.portfolio-footer-grid .brand{grid-column:1/-1}.project-media{height:260px}}
@media(max-width:900px){.portfolio-hero{height:auto;padding:82px 0}.portfolio-hero-bg{background-position:65% center}.portfolio-area-grid,.project-grid-three,.school-grid,.album-grid{grid-template-columns:1fr 1fr}.video-project-card,.world-music-strip{grid-template-columns:1fr}.video-project-copy{padding:32px}.summary-area-grid{grid-template-columns:1fr 1fr}.collaboration-grid-five{grid-template-columns:1fr 1fr}.project-media{height:310px}}
@media(max-width:620px){.portfolio-hero h1{font-size:54px}.portfolio-areas-top{padding-top:18px}.portfolio-area-grid,.project-grid-three,.school-grid,.summary-area-grid,.collaboration-grid-five,.album-grid{grid-template-columns:1fr}.portfolio-area-card{min-height:125px}.portfolio-projects-section,.video-project-section,.schools-section,.collaborations-section{padding:54px 0}.project-media{height:290px}.portfolio-section-title h2{font-size:35px}.youtube-lazy,.youtube-lazy iframe{min-height:250px}.video-project-copy{padding:26px 22px}.world-music-strip{padding:26px 22px;gap:14px}.portfolio-footer-grid{grid-template-columns:1fr;gap:13px}.portfolio-footer-grid .brand{grid-column:auto}}


.project-media.cover img{width:100%;height:100%;object-fit:cover;display:block;}

/* Portfolio: creatività, immagine e produzione multidisciplinare */
.portfolio-hero-bg{background-image:url('assets/page-heroes/portfolio-creativita.png');background-position:center right}
.portfolio-hero-shade{background:linear-gradient(90deg,#040505 0%,#040505 39%,rgba(4,5,5,.94) 50%,rgba(4,5,5,.46) 70%,rgba(4,5,5,.12) 100%)}
@media(max-width:760px){.portfolio-hero-shade{background:linear-gradient(90deg,rgba(4,5,5,.97),rgba(4,5,5,.72))}}
