/* ARGENTALIS · SIMULATOR PHOTO COMPOSITION
   The photo remains the base. Both white cards cross the photo boundary
   visibly, matching the supplied reference: top-left and right/bottom. */
.v3-visual-card.sim-photo-composition{
  position:relative;
  isolation:isolate;
  overflow:visible!important;
  width:100%;
  aspect-ratio:1.56/1;
  min-height:390px;
  border-radius:32px;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.v9-dark-section .v3-visual-card.sim-photo-composition{
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.v3-visual-card.sim-photo-composition picture{
  position:absolute;
  inset:0;
  display:block;
  overflow:hidden;
  border-radius:32px;
  background:transparent;
  box-shadow:0 26px 64px rgba(0,46,92,.16);
}
.v3-visual-card.sim-photo-composition .sim-photo-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:50% 67%;
  transform:scale(1.015);
}
.v3-visual-card.sim-photo-composition::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  border-radius:32px;
  background:
    linear-gradient(110deg,rgba(0,46,92,.08) 0%,rgba(0,46,92,0) 46%,rgba(0,46,92,.06) 100%),
    linear-gradient(0deg,rgba(0,24,52,.10) 0%,rgba(0,24,52,0) 43%);
}
.sim-photo-overlay{
  position:absolute;
  z-index:3;
  color:#003968;
  background:#fff;
  border:1px solid rgba(218,231,244,.98);
  box-shadow:0 20px 50px rgba(0,46,92,.20);
}
/* Roughly one third of this card is outside the photo, as in the reference. */
.sim-photo-saving{
  top:30px;
  left:0;
  width:min(224px,36%);
  padding:18px 18px 17px;
  border-radius:24px;
  transform:translate(-36%,-22%) rotate(-1.4deg);
  transform-origin:center;
}
.sim-photo-saving .sim-photo-kicker,
.sim-photo-main .sim-photo-kicker{
  display:block;
  margin:0 0 7px;
  color:#6c8295;
  font-size:11px;
  line-height:1.15;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.sim-photo-saving strong{
  display:block;
  color:#003968;
  font-size:clamp(22px,2.15vw,34px);
  line-height:1;
  font-weight:800;
  letter-spacing:-.035em;
}
.sim-photo-note{
  display:inline-flex;
  align-items:center;
  margin-top:12px;
  min-height:31px;
  padding:7px 11px;
  border-radius:999px;
  color:#2780bd;
  background:#eef7fd;
  font-size:11px;
  line-height:1.1;
  font-weight:800;
}
/* Roughly two fifths of this card is outside the photo on the right. */
.sim-photo-main{
  right:0;
  bottom:28px;
  width:min(306px,41%);
  padding:21px;
  border-radius:30px;
  transform:translate(40%,8%) rotate(1.6deg);
  transform-origin:center;
}
.sim-photo-main > strong{
  display:block;
  color:#003968;
  font-size:clamp(30px,3.4vw,52px);
  line-height:.98;
  font-weight:800;
  letter-spacing:-.045em;
  overflow-wrap:anywhere;
}
.sim-photo-subcard{
  margin-top:14px;
  padding:13px 14px;
  border-radius:17px;
  background:#fff;
  border:1px solid rgba(222,234,244,.95);
}
.sim-photo-subcard span{
  display:block;
  margin-bottom:3px;
  color:#72889a;
  font-size:12px;
  line-height:1.2;
  font-weight:600;
}
.sim-photo-subcard strong{
  display:block;
  color:#247fca;
  font-size:clamp(18px,2vw,26px);
  line-height:1.05;
  font-weight:800;
  letter-spacing:-.025em;
  overflow-wrap:anywhere;
}
.sim-photo-count strong{font-size:clamp(19px,2vw,27px)}

@media (max-width:900px){
  .v3-visual-card.sim-photo-composition{
    width:calc(100% - 46px);
    margin-inline:auto;
    min-height:0;
    aspect-ratio:1.06/1;
    border-radius:27px;
  }
  .v3-visual-card.sim-photo-composition picture,
  .v3-visual-card.sim-photo-composition::before{border-radius:27px}
  .v3-visual-card.sim-photo-composition .sim-photo-image{object-position:50% 66%}
  .sim-photo-saving{
    top:20px;
    left:0;
    width:42%;
    padding:15px 14px 14px;
    border-radius:20px;
    transform:translate(-24%,-16%) rotate(-1.1deg);
  }
  .sim-photo-main{
    right:0;
    bottom:18px;
    width:52%;
    padding:16px;
    border-radius:24px;
    transform:translate(24%,5%) rotate(1.1deg);
  }
  .sim-photo-saving .sim-photo-kicker,
  .sim-photo-main .sim-photo-kicker{font-size:9px;letter-spacing:.08em}
  .sim-photo-saving strong{font-size:clamp(19px,5.8vw,27px)}
  .sim-photo-main > strong{font-size:clamp(27px,8vw,38px)}
  .sim-photo-note{margin-top:9px;padding:6px 9px;min-height:27px;font-size:9px}
  .sim-photo-subcard{margin-top:9px;padding:9px 10px;border-radius:14px}
  .sim-photo-subcard span{font-size:9px}
  .sim-photo-subcard strong{font-size:clamp(15px,4.7vw,21px)}
}
@media (max-width:520px){
  .v3-visual-card.sim-photo-composition{
    width:calc(100% - 36px);
    aspect-ratio:.95/1;
    border-radius:24px;
  }
  .v3-visual-card.sim-photo-composition picture,
  .v3-visual-card.sim-photo-composition::before{border-radius:24px}
  .v3-visual-card.sim-photo-composition .sim-photo-image{object-position:51% 67%}
  .sim-photo-saving{
    top:15px;
    width:45%;
    padding:13px 12px;
    border-radius:18px;
    transform:translate(-18%,-12%) rotate(-1deg);
  }
  .sim-photo-main{
    bottom:12px;
    width:57%;
    padding:14px;
    border-radius:21px;
    transform:translate(18%,3%) rotate(1deg);
  }
  .sim-photo-saving strong{font-size:clamp(18px,6.7vw,25px)}
  .sim-photo-main > strong{font-size:clamp(25px,9vw,34px)}
  .sim-photo-subcard strong{font-size:clamp(14px,5.2vw,19px)}
}
@media (max-width:350px){
  .v3-visual-card.sim-photo-composition{width:calc(100% - 30px);aspect-ratio:.90/1}
  .sim-photo-saving{top:12px;width:47%;padding:11px 10px;transform:translate(-14%,-10%) rotate(-.8deg)}
  .sim-photo-main{bottom:9px;width:59%;padding:12px;transform:translate(14%,2%) rotate(.8deg)}
  .sim-photo-note{display:none}
}
