/* =========================================================
   AXL Studios — team.css
========================================================= */

.pp-team{
  width:100%;
  margin:0 auto;
  padding:clamp(72px,8vw,120px) 0;
  position:relative;
  overflow:hidden;
}

.pp-team-head{
  padding:0 var(--container-pad) clamp(40px,4vw,80px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
}

.pp-team-title{
  margin:0;
  color:#fff;
  font-family:"Urbanist";
  font-weight:600;
  font-size:clamp(77px,9.6vw,166px);
  line-height:1;
}

.pp-team-desc{
  width:min(100%,750px);
  margin:0;
  color:#fff;
  font-family:"Urbanist";
  font-weight:600;
  font-size:clamp(14px,1.92vw,26px);
  line-height:1.2;
  padding-top: 4px;
}

.pp-team-desc em{
  font-style:italic;
  font-weight:600;
}

.pp-team-grid{
  padding:0 var(--container-pad);
  display:grid;
  grid-template-columns:repeat(3, minmax(240px, 1fr));
  gap:clamp(14px,1.4vw,24px);
}

.pp-team-card{
  --team-card-image:url("../../card_team_bg.png");
  --team-card-layer:url("../../prova_place-holder.webp");
  --team-card-y:172%;
  width:100%;
  min-height:650px;
  padding:32px;
  border-radius:16px;
  position:relative;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(250,250,251,0.14);
  box-shadow:0 26px 44px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.16);
  background-color:#0d0d0d;
  background-image:
    linear-gradient(180deg, rgba(13, 13, 13, 0) 59.62%, #0d0d0d 80.29%, #0d0d0d 100%),
    var(--team-card-image, url("../../card_team_bg.png"));
  background-size:100% 100%, cover;
  background-position:center;
  background-repeat:no-repeat;
}

.pp-team-card::after{
  content:"";
  position:absolute;
  inset:0;
  padding-top:0;
  box-sizing:border-box;
  z-index:0;
  pointer-events:none;
  background-image:var(--team-card-layer, none);
  background-repeat:no-repeat;
  background-size:78% auto;
  background-position:center var(--team-card-y, 172%);
  background-origin:content-box;
  transition:background-size .24s ease;
}

 .pp-team-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgb(0, 0, 0) 78%, rgba(0,0,0,0.98) 100%);
}

.pp-team-card-inner{
  position:relative;
  z-index:2;
  flex:1 1 auto;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}

.pp-team-card-role{
  margin:0;
  padding:5px 14px;
  border-radius:20px;
  color:rgba(250,250,251,0.9);
  font-family:"Urbanist";
  font-size:18px;
  font-weight:500;
  line-height:1.2;
  letter-spacing:.01em;
  text-transform:uppercase;
  border:1px solid rgba(250,250,251,0.34);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.26) 0%, rgba(255, 255, 255, 0) 100%),
    rgba(20, 20, 24, 0);
  -webkit-backdrop-filter:blur(12px) saturate(132%);
  backdrop-filter:blur(12px) saturate(132%);
  text-shadow:0 1px 4px rgba(0,0,0,0.35);
}

.pp-team-card-copy{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:16px;
}

.pp-team-card-name{
  margin:0;
  color:#fff;
  font-family:"Urbanist";
  font-size:clamp(40px,3.2vw,48px);
  font-weight:700;
  line-height:1.1;
}

.pp-team-card-bio{
  margin:0;
  color:#fff;
  font-family:"Inter";
  font-size:18px;
  font-weight:400;
  line-height:1.5;
  max-width:40ch;
}

.pp-team-card--alfredo{
  --team-card-layer:url("../../team_alfredo_png.png");
  --team-card-y:55%;
}

.pp-team-card--lorenzo{
  --team-card-layer:url("../../team_lorenzo_png.png");
  --team-card-y:55%;
}

.pp-team-card--fabio{
  --team-card-layer:url("../../team_fabio_png.png");
  --team-card-y:55%;
}

.pp-team-card:hover{
  transform:translateY(-4px);
  transition:transform .22s ease, box-shadow .22s ease;
  box-shadow:0 32px 54px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.16);
}

.pp-team-card:hover::after{
  background-size:80% auto;
}

.pp-spacer-top-80{
  padding-top:80px;
}

@media (max-width:1200px){
  .pp-team-head{
    flex-direction:column;
    align-items:flex-start;
    gap:18px;
  }

  .pp-team-title{
    font-size:clamp(64px,14vw,128px);
    line-height:.92;
  }

  .pp-team-desc{
    width:100%;
    max-width:42rem;
    font-size:clamp(16px,2.7vw,22px);
    line-height:1.4;
  }

  .pp-team-desc br{
    display:none;
  }

  .pp-team-grid{
    grid-template-columns:repeat(2, minmax(260px, 1fr));
  }

  .pp-team-card{
    min-height:620px;
  }

  .pp-team-card::before {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgb(0, 0, 0) 78%, rgba(0,0,0,0.98) 100%);
  }
}

@media (max-width:860px){
  .pp-team-grid{
    grid-template-columns:1fr;
  }

  .pp-team-card{
    min-height:560px;
  }

  .pp-team-card::before {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgb(0, 0, 0) 78%, rgba(0,0,0,0.98) 100%);
  }
}

@media (max-width:560px){
  .pp-team{
    padding:64px 0 96px;
  }

  .pp-team-head{
    gap:14px;
    padding-bottom:28px;
  }

  .pp-team-title{
    font-size:clamp(54px,16vw,88px);
    max-width:100%;
  }

  .pp-team-desc{
    max-width:none;
    font-size:clamp(15px,4.6vw,18px);
    line-height:1.5;
    text-wrap:pretty;
  }

  .pp-team-card{
    min-height:520px;
    padding: 32px;
    border-radius:14px;
  }

  .pp-team-card-role{
    font-size:14px;
    padding:4px 12px;
  }

  .pp-team-card-name{
    font-size:clamp(32px,9vw,42px);
  }

  .pp-team-card-bio{
    font-size:15px;
    line-height:1.45;
  }

  .pp-team-card::before {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgb(0, 0, 0) 78%, rgba(0,0,0,0.98) 100%);
  }
}

@media (prefers-reduced-motion:reduce){
  .pp-team-card,
  .pp-team-card:hover{
    transform:none;
    transition:none;
  }
}