/* A5.19.9 — MEDIA + CONCEPT COMPLETION
   Makes "Same Lauren. Different door." visible with only public-safe media.
   No held/review-only source is promoted by this stylesheet. */

/* HOMEPAGE / PERSON: turn the former acrylic corridor into a compact broadcast
   contact sheet using verified public proof. Architecture stays untouched. */
.person .person-acrylic{
  z-index:8!important;
  left:auto!important;
  right:4%!important;
  top:21%!important;
  width:30%!important;
  height:23%!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  border:5px solid rgba(255,250,241,.94)!important;
  background-color:#fff8eb!important;
  background-image:
    linear-gradient(180deg,rgba(255,246,229,.01),rgba(255,196,155,.04)),
    url('../img/a55/wimpb-campaign-main.jpg'),
    url('../img/a55/host-talent.jpg'),
    url('../img/scrambled-podium-smile.webp'),
    url('../img/activate-card.jpg')!important;
  background-size:100% 100%,25% 100%,25% 100%,25% 100%,25% 100%!important;
  background-position:0 0,0 0,33.333% 0,66.666% 0,100% 0!important;
  background-repeat:no-repeat!important;
  background-blend-mode:normal!important;
  backdrop-filter:none!important;
  box-shadow:0 22px 58px rgba(54,39,34,.17)!important;
  transform:rotate(.35deg)!important;
  overflow:visible;
}
.person .person-acrylic::before{
  content:'RANGE / SAME LAUREN · DIFFERENT DOOR';
  position:absolute;
  left:-5px;
  top:-27px;
  padding:6px 8px;
  background:#111014;
  color:#fff8eb;
  font:500 7px/1 'Space Mono',monospace;
  letter-spacing:.095em;
  text-transform:uppercase;
  white-space:nowrap;
}
.person .person-acrylic::after{
  content:'';
  position:absolute;
  inset:-12px -9px;
  z-index:-1;
  background:linear-gradient(100deg,rgba(255,190,138,.25),transparent 31%,rgba(122,224,224,.16) 64%,rgba(199,157,229,.16));
  filter:blur(15px);
}

/* CASTING / RANGE: editorial mosaic, not a KPI/card grid. */
.cast58 .range-section{
  position:relative;
  overflow:hidden;
  padding:clamp(82px,9vw,132px) var(--pad);
  background:
    radial-gradient(ellipse at 18% 16%,rgba(255,190,138,.27),transparent 33%),
    radial-gradient(ellipse at 82% 24%,rgba(124,222,224,.18),transparent 31%),
    radial-gradient(ellipse at 69% 88%,rgba(204,166,231,.2),transparent 36%),
    #fff8eb;
  color:#111014;
}
.cast58 .range-section::before{
  content:'RANGE';
  position:absolute;
  right:-.035em;
  top:.08em;
  font:900 clamp(115px,18vw,280px)/.72 Archivo,Arial,sans-serif;
  letter-spacing:-.095em;
  color:rgba(17,16,20,.035);
  pointer-events:none;
}
.cast58 .range-head{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(260px,.65fr);
  gap:clamp(30px,6vw,90px);
  align-items:end;
  max-width:1320px;
  margin:0 auto clamp(34px,5vw,68px);
}
.cast58 .range-head h2{
  margin:10px 0 0;
  font-size:clamp(68px,8.5vw,132px);
  line-height:.76;
  letter-spacing:-.085em;
}
.cast58 .range-head>p{
  margin:0;
  max-width:440px;
  font-size:clamp(14px,1.25vw,18px);
  line-height:1.52;
  color:rgba(17,16,20,.64);
}
.cast58 .range-mosaic{
  position:relative;
  z-index:3;
  max-width:1320px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.2fr .82fr 1.05fr .82fr 1fr;
  grid-template-rows:clamp(360px,38vw,560px);
  gap:clamp(8px,1vw,15px);
  align-items:stretch;
}
.cast58 .range-frame{
  position:relative;
  margin:0;
  overflow:hidden;
  background:#e7ded1;
  box-shadow:0 24px 66px rgba(53,39,34,.13);
}
.cast58 .range-frame:nth-child(1){transform:translateY(16px)}
.cast58 .range-frame:nth-child(2){height:82%;align-self:end}
.cast58 .range-frame:nth-child(3){height:92%;align-self:start;transform:translateY(-12px)}
.cast58 .range-frame:nth-child(4){height:76%;align-self:center}
.cast58 .range-frame:nth-child(5){height:88%;align-self:end;transform:translateY(10px)}
.cast58 .range-frame img{width:100%;height:100%;object-fit:cover;display:block}
.cast58 .range-frame.range-full img{object-fit:contain;object-position:center bottom;background:linear-gradient(180deg,#fff6e7,#f4eadb)}
.cast58 .range-frame.range-personality img{object-position:center 36%}
.cast58 .range-frame.range-live img{object-position:center 38%}
.cast58 .range-frame.range-tv img{object-position:center 34%}
.cast58 .range-frame.range-field img{object-position:center center}
.cast58 .range-frame figcaption{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  padding:11px 12px 10px;
  background:linear-gradient(180deg,transparent,rgba(10,10,12,.86));
  color:#fff;
  font:500 7px/1.2 'Space Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.cast58 .range-frame figcaption b{font:760 12px/1 Archivo,Arial,sans-serif;letter-spacing:-.02em;text-transform:none}
.cast58 .range-note{
  position:relative;
  z-index:3;
  max-width:1320px;
  margin:clamp(30px,4vw,54px) auto 0;
  padding-top:16px;
  border-top:1px solid rgba(17,16,20,.18);
  display:flex;
  justify-content:space-between;
  gap:24px;
  font:500 8px/1.45 'Space Mono',monospace;
  letter-spacing:.07em;
  text-transform:uppercase;
  color:rgba(17,16,20,.58);
}
.cast58 .range-note strong{font-family:Archivo,Arial,sans-serif;font-size:13px;letter-spacing:-.015em;text-transform:none;color:#111014}

@media (max-width:900px) and (min-width:761px){
  .person .person-acrylic{right:3%!important;top:25%!important;width:31%!important;height:19%!important}
  .person .person-acrylic::before{font-size:6px}
}

@media (max-width:760px){
  .person .person-acrylic{display:none!important}
  .cast58 .range-section{padding:74px 18px 82px}
  .cast58 .range-section::before{top:34px;font-size:112px}
  .cast58 .range-head{display:block;margin-bottom:32px}
  .cast58 .range-head h2{font-size:70px;margin-bottom:20px}
  .cast58 .range-head>p{font-size:14px;max-width:32em}
  .cast58 .range-mosaic{
    grid-template-columns:1.15fr .85fr;
    grid-template-rows:285px 210px 245px;
    gap:8px;
  }
  .cast58 .range-frame{height:auto!important;transform:none!important;align-self:stretch!important}
  .cast58 .range-frame:nth-child(1){grid-row:1 / span 2;grid-column:1}
  .cast58 .range-frame:nth-child(2){grid-row:1;grid-column:2}
  .cast58 .range-frame:nth-child(3){grid-row:2;grid-column:2}
  .cast58 .range-frame:nth-child(4){grid-row:3;grid-column:1}
  .cast58 .range-frame:nth-child(5){grid-row:3;grid-column:2}
  .cast58 .range-frame figcaption{padding:9px 8px 8px;display:block}
  .cast58 .range-frame figcaption b{display:block;font-size:10px;margin-bottom:2px}
  .cast58 .range-note{display:block;margin-top:28px}
  .cast58 .range-note span{display:block;margin-top:8px}
}
