/* About page art direction: image-led poster story layout. */
.page-header{
  min-height:470px;
  padding-top:48px !important;
  padding-bottom:96px !important;
  overflow:visible !important;
  background:
    radial-gradient(circle at 78% 7%, rgba(255,195,220,.28), transparent 36%),
    linear-gradient(180deg,#171116 0%,#050505 78%) !important;
}

.page-header::after{
  content:"";
  position:absolute;
  left:-128px;
  bottom:-118px;
  z-index:0;
  width:300px;
  height:300px;
  border-radius:50%;
  background:
    radial-gradient(circle at 40% 36%, rgba(255,229,239,.72), rgba(255,195,220,.94) 42%, rgba(255,195,220,.08) 70%, transparent 72%);
  filter:blur(.2px);
  pointer-events:none;
}

.page-header::before{
  right:-28px !important;
  top:26px !important;
  font-size:clamp(92px,17vw,150px) !important;
  opacity:.5;
}

.page-header .container{
  position:relative;
  z-index:2;
}

.page-header .container::after{
  content:"";
  position:absolute;
  right:clamp(18px,7vw,78px);
  bottom:-72px;
  z-index:-1;
  width:clamp(118px,24vw,190px);
  height:clamp(138px,28vw,220px);
  border:2px solid #fff;
  border-radius:16px;
  background:url("Images/Nails4.png") center/cover no-repeat;
  box-shadow:0 18px 34px rgba(0,0,0,.42);
  transform:rotate(7deg);
}

.page-header .page-title{
  max-width:720px;
  font-size:clamp(66px,13vw,118px) !important;
  line-height:.76 !important;
}

.page-header .page-subtitle{
  max-width:560px !important;
  margin-top:18px !important;
  font-size:clamp(15px,2.2vw,21px) !important;
  line-height:1.25 !important;
}

main{
  overflow:visible;
}

main > .section{
  position:relative;
  overflow:visible;
}

main > .section:nth-of-type(2){
  padding-top:64px !important;
}

.story-section{
  position:relative;
  min-height:420px;
  padding:42px 36px !important;
  overflow:visible;
  transform:rotate(.6deg) !important;
}

.story-section::before{
  content:"";
  position:absolute;
  left:-42px;
  top:34px;
  width:112px;
  height:138px;
  border:2px solid #fff;
  border-radius:14px;
  background:url("Images/Nails8.png") center/cover no-repeat;
  box-shadow:0 16px 30px rgba(0,0,0,.38);
  transform:rotate(-9deg);
}

.story-section::after{
  content:"STORY";
  position:absolute;
  right:-12px;
  bottom:16px;
  color:rgba(255,195,220,.1);
  font-family:Arial Black,Impact,sans-serif;
  font-size:82px;
  line-height:.8;
  letter-spacing:-.08em;
  writing-mode:vertical-rl;
}

.story-content{
  position:relative;
  z-index:2;
  max-width:58ch;
  padding-left:54px;
}

.story-content h2{
  font-size:clamp(34px,5vw,54px) !important;
  margin-bottom:22px;
}

.story-content p{
  max-width:44ch;
  margin-bottom:14px;
}

.story-image{
  position:absolute;
  right:22px;
  top:-36px;
  z-index:3;
  width:min(34%, 210px);
}

.story-image img{
  aspect-ratio:3/4;
  object-fit:cover;
  transform:rotate(5deg) !important;
}

.experience-badge{
  position:absolute;
  left:-18px;
  bottom:18px;
  display:grid;
  padding:10px 12px;
  transform:rotate(-5deg);
  box-shadow:0 10px 20px rgba(0,0,0,.28);
}

.experience-badge .years{
  font-family:Arial Black,Impact,sans-serif;
  font-size:18px;
  line-height:1;
}

.experience-badge .label{
  font-size:9px;
  text-transform:uppercase;
}

.stats-section{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
  position:relative;
}

.stats-section::before{
  content:"PROOF";
  position:absolute;
  left:-6px;
  top:-40px;
  color:rgba(255,195,220,.14);
  font-family:Arial Black,Impact,sans-serif;
  font-size:58px;
  letter-spacing:-.08em;
}

.stat-card{
  min-height:128px;
  display:grid;
  place-items:center;
  text-align:center;
}

.stat-card:nth-child(1){
  transform:rotate(-2deg) translateY(10px) !important;
}

.stat-card:nth-child(2){
  transform:rotate(2deg) !important;
}

.stat-card:nth-child(3){
  transform:rotate(1deg) !important;
}

.stat-card:nth-child(4){
  transform:rotate(-1.4deg) translateY(-8px) !important;
  background:#ffc3dc !important;
}

.stat-card:nth-child(4) .stat-number,
.stat-card:nth-child(4) .stat-label{
  color:#050505 !important;
}

.stat-number{
  font-size:clamp(34px,8vw,52px);
  line-height:1;
}

.stat-label{
  color:#fff !important;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}

.values-title{
  position:relative;
  margin:18px 0 34px !important;
  font-size:clamp(34px,7vw,58px) !important;
  line-height:.92;
}

.values-title::after{
  content:"";
  position:absolute;
  right:12px;
  bottom:-24px;
  width:102px;
  height:76px;
  border:2px solid #fff;
  border-radius:12px;
  background:url("Images/Nails11.png") center/cover no-repeat;
  transform:rotate(8deg);
  box-shadow:0 14px 24px rgba(0,0,0,.32);
}

.values-grid{
  gap:18px !important;
}

.value-card{
  position:relative;
  min-height:176px;
  padding:26px 22px 24px 132px !important;
  overflow:visible;
  text-align:left !important;
}

.value-card::before{
  content:"";
  position:absolute;
  left:16px;
  top:50%;
  width:92px;
  height:114px;
  border:2px solid #fff;
  border-radius:13px;
  background:center/cover no-repeat;
  box-shadow:0 14px 24px rgba(0,0,0,.32);
  transform:translateY(-50%) rotate(-5deg);
}

.value-card:nth-child(1)::before{
  background-image:url("Images/Nails12.png");
}

.value-card:nth-child(2)::before{
  background-image:url("Images/Nails15.png");
  transform:translateY(-50%) rotate(6deg);
}

.value-card:nth-child(3)::before{
  background-image:url("Images/Nails10.png");
}

.value-title{
  font-family:Arial Black,Impact,sans-serif;
  font-size:clamp(22px,4vw,32px);
  line-height:1;
  text-transform:uppercase;
}

.value-desc{
  max-width:42ch;
  text-align:left !important;
}

.artist-section{
  position:relative;
  padding:28px !important;
  overflow:visible;
  transform:rotate(-.6deg) !important;
}

.artist-section::before{
  content:"ARTIST";
  position:absolute;
  right:-16px;
  top:26px;
  color:rgba(255,195,220,.1);
  font-family:Arial Black,Impact,sans-serif;
  font-size:76px;
  line-height:.8;
  letter-spacing:-.08em;
  writing-mode:vertical-rl;
}

.artist-profile{
  grid-template-columns:minmax(150px,.7fr) 1fr !important;
  align-items:center;
}

.artist-photo img{
  aspect-ratio:3/4;
  object-fit:cover;
  transform:rotate(-5deg) !important;
}

.artist-name{
  font-family:Arial Black,Impact,sans-serif;
  font-size:30px;
  line-height:1;
}

.artist-role{
  color:#ffc3dc !important;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

@media (max-width:700px){
  .page-header{
    min-height:438px;
    padding-top:34px !important;
    padding-bottom:86px !important;
  }

  .page-header .container::after{
    right:14px;
    bottom:-84px;
    width:118px;
    height:142px;
    opacity:.78;
  }

  .page-header .page-title{
    font-size:clamp(58px,17vw,90px) !important;
  }

  .page-header .page-subtitle{
    max-width:390px !important;
    font-size:15px !important;
  }

  .story-section{
    min-height:auto;
    padding:150px 22px 28px !important;
  }

  .story-content{
    padding-left:0;
  }

  .story-section::before{
    left:22px;
    top:22px;
  }

  .story-image{
    right:24px;
    top:18px;
    width:128px;
  }

  .stats-section{
    grid-template-columns:1fr 1fr !important;
  }

  .value-card{
    padding:150px 20px 24px !important;
  }

  .value-card::before{
    left:20px;
    top:20px;
    transform:rotate(-5deg);
    width:118px;
    height:112px;
  }

  .artist-profile{
    grid-template-columns:1fr !important;
  }
}