:root{
    --text:#202124;
    --muted:#555a65;
    --red:#e50914;
    --blue:#2f80ed;
    --card:#f2f3f4;
    --tip-border:#e0e2e5;
    --maxw:1290px;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    color:var(--text);
    background:#fff;
    line-height:1.4;
    -webkit-font-smoothing:antialiased;
  }
  .vd{
    max-width:var(--maxw);
    margin:0 auto;
    padding:52px 49px 64px;
  }
  
  /* ---------- Header ---------- */
  .vd__title{
    font-size:40px;
    font-weight:700;
    line-height:1.2;
    margin:0 0 24px;
  }
  .vd__lead-strong{
    font-size:20px;
    font-weight:700;
    margin:0 0 14px;
  }
  .vd__lead{
    font-size:15px;
    font-weight:400;
    color:var(--muted);
    margin:0 0 32px;
    max-width:1107px;
  }
  
  /* ---------- Two-column info row ---------- */
  .vd__cols{
    display:flex;
    flex-wrap:wrap;
    gap:40px 64px;
    justify-content:space-between;
    margin-bottom:44px;
  }
  .vd__col-head{
    font-size:20px;
    font-weight:600;
    margin:0 0 16px;
  }
  .vd__col--who .vd__col-head{color:var(--text);}
  .vd__col--terms .vd__col-head{color:var(--muted);}
  
  .vd__list{
    list-style:none;
    margin:0;
    padding:0;
    font-size:15px;
    color:var(--muted);
  }
  .vd__list li{
    position:relative;
    padding-left:18px;
    margin-bottom:6px;
  }
  .vd__list li::before{
    content:"";
    position:absolute;
    left:2px;top:8px;
    width:5px;height:5px;
    border-radius:50%;
    background:var(--muted);
  }
  
  /* info "!" badge + tooltip */
  .vd__info{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:15px;height:15px;
    margin-left:6px;
    border:1px solid var(--muted);
    border-radius:50%;
    color:var(--muted);
    font-size:10px;
    line-height:1;
    cursor:pointer;
    vertical-align:middle;
    user-select:none;
  }
  .vd__tip{
    position:absolute;
    top:50%;
    left:calc(100% + 14px);
    transform:translateY(-50%);
    width:326px;
    max-width:80vw;
    background:#fff;
    border:1px solid var(--tip-border);
    border-radius:15px;
    box-shadow:0 4px 12px rgba(52,52,52,.22);
    padding:20px 22px;
    font-size:15px;
    line-height:1.27;
    color:#000;
    z-index:20;
    opacity:0;
    visibility:hidden;
    transition:opacity .15s ease;
  }
  .vd__info:hover .vd__tip,
  .vd__info:focus .vd__tip,
  .vd__info.is-open .vd__tip{
    opacity:1;
    visibility:visible;
  }
  .vd__tip ul{
    list-style:none;
    margin:6px 0 0;
    padding:0;
  }
  .vd__tip li{
    position:relative;
    padding-left:12px;
    margin-bottom:4px;
  }
  .vd__tip li::before{
    content:"•";
    position:absolute;
    left:0;top:0;
  }
  
  /* blue outlined pill */
  .vd__pill{
    display:inline-block;
    border:1px solid var(--blue);
    border-radius:10px;
    color:var(--blue);
    font-size:16px;
    font-weight:600;
    padding:14px 22px;
    text-decoration:none;
    transition:background .15s ease,color .15s ease;
  }
  .vd__pill:hover{background:var(--blue);color:#fff;}
  
  /* ---------- Main grey card ---------- */
  .vd__card{
    background:var(--card);
    border-radius:15px;
    padding:57px 50px;
    display:grid;
    grid-template-columns:minmax(0,520px) minmax(0,1fr);
    gap:48px;
    align-items:center;
  }
  .vd__card-h{
    font-size:25px;
    font-weight:600;
    line-height:1.2;
    margin:0 0 22px;
  }
  .vd__card-list{
    list-style:none;
    margin:0 0 34px;
    padding:0;
    font-size:16px;
    color:var(--muted);
  }
  .vd__card-list li{
    position:relative;
    padding-left:18px;
    margin-bottom:8px;
  }
  .vd__card-list li::before{
    content:"";
    position:absolute;
    left:2px;top:9px;
    width:5px;height:5px;
    border-radius:50%;
    background:var(--muted);
  }
  .vd__card-strong{
    font-size:20px;
    font-weight:700;
    line-height:1.2;
    margin:0 0 24px;
  }
  .vd__cta{
    display:inline-block;
    background:var(--red);
    color:#fff;
    font-size:20px;
    font-weight:700;
    text-decoration:none;
    padding:25px 36px;
    border-radius:15px;
    transition:filter .15s ease,transform .05s ease;
  }
  .vd__cta:hover{filter:brightness(1.07);}
  .vd__cta:active{transform:translateY(1px);}
  
  .vd__photo{
    width:100%;
    height:100%;
    min-height:340px;
    object-fit:cover;
    border-radius:12px;
    display:block;
  }
  
  /* ---------- Tablet ---------- */
  @media (max-width:1100px){
    .vd__card{
      grid-template-columns:1fr;
      gap:32px;
    }
    .vd__photo{min-height:300px;}
    .vd__tip{
      left:auto;right:0;
      top:calc(100% + 12px);
      transform:none;
    }
  }
  
  /* ---------- Mobile ---------- */
  @media (max-width:680px){
    .vd{padding:28px 18px 40px;}
    .vd__title{font-size:26px;margin-bottom:16px;}
    .vd__lead-strong{font-size:17px;}
    .vd__lead{font-size:14px;margin-bottom:24px;}
  
    .vd__cols{
      gap:28px;
      margin-bottom:32px;
    }
    .vd__col{flex:1 1 100%;}
    .vd__col-head{font-size:17px;}
    .vd__list{font-size:14px;}
  
    .vd__pill{
      display:block;
      text-align:center;
      font-size:15px;
      padding:13px 18px;
    }
  
    /* tooltip becomes a full-width popover under the line on mobile */
    .vd__list li{position:relative;}
    .vd__info{position:static;}
    .vd__tip{
      position:absolute;
      left:0;right:auto;
      top:100%;
      transform:none;
      width:100%;
      max-width:none;
      margin-top:8px;
    }
  
    .vd__card{
      padding:26px 20px;
      border-radius:14px;
    }
    .vd__card-h{font-size:20px;margin-bottom:16px;}
    .vd__card-list{font-size:15px;margin-bottom:24px;}
    .vd__card-strong{font-size:17px;}
    .vd__cta{
      display:block;
      text-align:center;
      font-size:16px;
      padding:18px 20px;
    }
    .vd__photo{min-height:220px;order:-1;}
  }