/* Yaseen ambassador inherits the approved Sadam Koumi editorial system.
   This file only adapts the hero around the documentary and Yaseen-specific field notes. */

.yaseen-page .sk-canvas{
  background:
    radial-gradient(circle at 84% 14%,rgba(199,67,53,.13),transparent 30%),
    radial-gradient(circle at 12% 8%,rgba(11,92,56,.28),transparent 28%),
    linear-gradient(180deg,var(--sk-deep) 0%,var(--sk-deep) 76%,var(--sk-deeper) 100%);
}

.yaseen-page .yaseen-hero-grid{
  grid-template-columns:minmax(560px,1.25fr) minmax(330px,.75fr);
  gap:42px;
  align-items:center;
}

.yaseen-page .yaseen-film-stack{
  width:100%;
  max-width:none;
  padding:20px 58px 34px 0;
}

.yaseen-page .yaseen-hero-film{
  width:100%;
  max-width:690px;
  padding:11px 11px 43px;
  transform:rotate(-1deg);
}

.yaseen-page .yaseen-film-frame{
  aspect-ratio:16/9;
  background:#03170f;
}

.yaseen-page .yaseen-film-frame video{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:#03170f;
}

.yaseen-page .yaseen-distance-note{
  right:-2px;
  bottom:6px;
  width:166px;
  min-height:132px;
  background:var(--sk-red);
}

.yaseen-page .yaseen-distance-note strong{
  margin:6px 0 7px;
  font-size:38px;
}

.yaseen-page .yaseen-intro .sk-lede{
  max-width:540px;
}

.yaseen-page .sk-stat strong{
  font-size:clamp(28px,4vw,40px);
}

.yaseen-page .sk-stat--tokyo strong,
.yaseen-page .sk-stat--trophy strong{
  font-size:clamp(26px,3.7vw,36px);
}

.yaseen-page .sk-story--note .sk-copy::after{
  content:"Yaseen*";
}

.yaseen-page .yaseen-purpose-block .sk-green-note{
  background:var(--sk-green-note);
}

.yaseen-page .yaseen-purpose-block .sk-green-note strong{
  font-size:28px;
}

.yaseen-page .yaseen-pending-note{
  position:relative;
  margin:8px 0 6px;
  padding:16px 17px 17px;
  border:1px solid rgba(255,241,201,.24);
  background:#ead482;
  color:var(--sk-deep);
  box-shadow:4px 5px 0 rgba(0,0,0,.16);
  transform:rotate(-.7deg);
}

.yaseen-page .yaseen-pending-note::before{
  content:"";
  position:absolute;
  top:-7px;
  left:46%;
  width:54px;
  height:14px;
  background:rgba(246,231,182,.76);
  transform:translateX(-50%) rotate(2deg);
}

.yaseen-page .yaseen-pending-note .sk-label{
  color:var(--sk-red);
}

.yaseen-page .yaseen-pending-note>strong{
  display:block;
  margin-top:7px;
  font:italic 400 27px/1 Anton,Impact,sans-serif;
  text-transform:uppercase;
}

.yaseen-page .yaseen-pending-note>p:last-child{
  margin:8px 0 0;
  font-size:12px;
  font-weight:700;
  line-height:1.48;
}

.yaseen-page .yaseen-field-grid{
  grid-template-columns:minmax(280px,.75fr) minmax(0,1.25fr);
  gap:34px;
  align-items:center;
}

.yaseen-page .yaseen-field-photo{
  width:100%;
  max-width:760px;
  justify-self:end;
  transform:rotate(.55deg);
}

.yaseen-page .yaseen-field-photo img{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  object-position:center;
}

.yaseen-page .sk-field-copy>p:not(.sk-overline){
  max-width:520px;
}

@media(max-width:1050px){
  .yaseen-page .yaseen-hero-grid{
    grid-template-columns:1fr;
  }
  .yaseen-page .yaseen-film-stack{
    max-width:820px;
    padding-right:54px;
  }
  .yaseen-page .yaseen-intro .sk-lede{
    max-width:760px;
  }
}

@media(max-width:900px){
  .yaseen-page .yaseen-field-grid{
    grid-template-columns:1fr;
  }
  .yaseen-page .yaseen-field-photo{
    justify-self:start;
    max-width:none;
  }
}

@media(max-width:699px){
  .yaseen-page .yaseen-film-stack{
    padding:10px 18px 32px 0;
  }
  .yaseen-page .yaseen-hero-film{
    padding:8px 8px 39px;
  }
  .yaseen-page .yaseen-distance-note{
    right:-2px;
    width:144px;
    min-height:116px;
  }
  .yaseen-page .yaseen-distance-note strong{
    font-size:31px;
  }
  .yaseen-page .sk-story--note .sk-copy::after{
    font-size:32px;
  }
}
