/* Flow-price hero visual layout fix v18 */
@media (min-width: 681px){
  .hero-visual{
    display:grid;
    grid-template-columns:170px minmax(0,1fr);
    grid-template-rows:auto auto;
    gap:16px 18px;
    align-items:end;
  }

  .hero-frame{
    display:contents;
  }

  .hero-photo{
    grid-column:1 / -1;
    grid-row:1;
  }

  .hero-mini{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    top:auto !important;
    grid-column:1;
    grid-row:2;
    width:170px !important;
    border-radius:24px;
    overflow:hidden;
    border:8px solid rgba(244,247,251,.98);
    box-shadow:0 18px 36px rgba(0,0,0,.35);
    align-self:start;
  }

  .hero-mini img{
    width:100%;
    height:190px;
    object-fit:cover;
  }

  .hero-badge{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    top:auto !important;
    grid-column:2;
    grid-row:2;
    width:100%;
    max-width:none !important;
    margin:0 !important;
    min-height:190px;
    padding:22px 24px !important;
    border-radius:24px;
    background:rgba(3,8,16,.84) !important;
    box-shadow:0 16px 40px rgba(0,0,0,.28);
    display:flex;
    flex-direction:column;
    justify-content:center;
  }

  .hero-badge-title{
    font-size:16px;
    margin-bottom:8px;
  }

  .hero-badge p{
    font-size:14px;
    line-height:1.85;
  }
}

@media (min-width: 681px) and (max-width: 980px){
  .hero-visual{
    grid-template-columns:142px minmax(0,1fr);
    gap:14px 16px;
    margin-left:26px;
  }

  .hero-mini{
    width:142px !important;
    border-width:6px;
  }

  .hero-mini img{
    height:166px;
  }

  .hero-badge{
    min-height:166px;
    padding:18px 20px !important;
  }
}