/* Sonny Astani academic-home visual.
   The collage is reconstructed as a verified WebP during the Vercel build.
   Keep the artwork free of a hard rectangular frame and feather it into the
   cream page surface so the torn-paper composition feels embedded. */
.home-academic-art-wrap{
  position:relative;
  min-width:0;
  min-height:clamp(500px,43vw,680px);
  overflow:visible;
  isolation:isolate;
}

.home-academic-art-wrap::before{
  content:"";
  position:absolute;
  inset:1% -12% -2% -9%;
  z-index:0;
  pointer-events:none;
  background:radial-gradient(ellipse at 50% 52%,rgba(229,216,200,.62) 0%,rgba(245,236,225,.28) 56%,rgba(255,253,249,0) 84%);
  filter:blur(34px);
}

.home-academic-art{
  position:absolute;
  z-index:1;
  inset:-8% -14% -10% -8%;
  background-image:url('/images/home/sonny-astani/academic-collage.webp?v=3');
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  filter:drop-shadow(0 24px 38px rgba(27,16,19,.10));
  -webkit-mask-image:radial-gradient(ellipse at center,#000 0%,#000 78%,rgba(0,0,0,.93) 87%,rgba(0,0,0,.48) 95%,transparent 100%);
  mask-image:radial-gradient(ellipse at center,#000 0%,#000 78%,rgba(0,0,0,.93) 87%,rgba(0,0,0,.48) 95%,transparent 100%);
}

@media (width <= 980px){
  .home-academic-art-wrap{min-height:clamp(420px,65vw,560px)}
  .home-academic-art{inset:-5% -9% -7% -5%}
}

@media (width <= 720px){
  .home-academic-art-wrap{min-height:min(96vw,520px);margin-top:20px}
  .home-academic-art{inset:-2% -8% -4% -8%;background-position:center top}
  .home-academic-art-wrap::before{inset:3% -7% -2%}
}