
/* =========================
   Who Is This For v2
   Desktop: right white glass panel
   Mobile: white glass overlay on image (NOT split)
   Fixes:
   1) Mobile overlay uses white glass like desktop
   2) Title sizing/weight matches standard H2
   3) Text baseline aligns to icon circle center
   ========================= */

#wh-screen2-who-v2{
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  color:#333;
}
#wh-screen2-who-v2 *{ box-sizing:border-box; }
#wh-screen2-who-v2 img{ display:block; max-width:100%; }

/* Media container */
#wh-screen2-who-v2 .wh2-media{
  width:100%;
  min-height:560px;
  position:relative;
  overflow:hidden;
  border-radius:12px;
  max-width:1920px;
  margin:0 auto 64px;
}

/* Background image */
#wh-screen2-who-v2 .wh2-media__bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
}

/* Copy panel (Desktop) */
#wh-screen2-who-v2 .wh2-media__copy{
  position:absolute;
  top:0;
  right:0;
  height:100%;
  width:min(54vw, 860px);
  z-index:2;

  display:flex;
  align-items:flex-start;     /* title sits higher */
  padding:56px 64px 72px;     /* top pushed up a bit */

  background:rgba(255,255,255,.84);
  backdrop-filter:saturate(140%) blur(2px);
  border-left:1px solid rgba(238,238,238,0.9);
}

/* Inner wrapper */
#wh-screen2-who-v2 .wh2-copy__inner{ width:100%; }

/* Title (H2 standard: 28–32 / 700 / 1.25) */
#wh-screen2-who-v2 .wh2-title{
  margin:0 0 36px 0;
  color:#1a2530;
  font-weight:700;
  font-size:clamp(28px, 2.2vw, 32px);
  line-height:1.25;
  letter-spacing:-0.01em;
}

/* List */
#wh-screen2-who-v2 .wh2-list{
  list-style:none;
  margin:0;
  padding:0;
  width:100%;
}

/* Items: align text with icon circle center */
#wh-screen2-who-v2 .wh2-item{
  display:flex;
  align-items:center;         /* ✅ centers text block to icon circle */
  gap:14px;
  padding:10px 0;
}
#wh-screen2-who-v2 .wh2-item:last-child{ padding-bottom:0; }

/* Icon */
#wh-screen2-who-v2 .wh2-icon{
  width:44px;
  height:44px;
  border-radius:50%;
  background:#8B5A2B;
  color:#fff;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:19px;
  flex-shrink:0;
}

/* Text */
#wh-screen2-who-v2 .wh2-text{
  margin:0;
  font-size:17px;
  line-height:1.8;
  color:#495057;
  font-weight:400;
  max-width:70ch;
}
#wh-screen2-who-v2 .wh2-text strong{
  color:#1a2530;
  font-weight:600;
}

/* ===== Mobile: white glass overlay on image (NOT split) ===== */
@media (max-width:768px){
  #wh-screen2-who-v2 .wh2-media{
    min-height:520px;
    border-radius:12px;
    margin-bottom:56px;
  }

  /* keep image as absolute background */
  #wh-screen2-who-v2 .wh2-media__bg{
    position:absolute;
    inset:0;
    height:100%;
  }

  /* overlay card uses SAME white glass style */
  #wh-screen2-who-v2 .wh2-media__copy{
    position:absolute;
    inset:auto 14px 14px 14px;
    width:auto;
    height:auto;

    padding:26px 22px;
    border-radius:12px;

    background:rgba(255,255,255,.88);  /* ✅ white glass like desktop */
    backdrop-filter:saturate(140%) blur(2px);
    border:1px solid rgba(238,238,238,0.9);
    box-shadow:0 10px 30px rgba(0,0,0,.12);

    align-items:flex-start;
  }

  /* Title: match standard guidance title range (22–24 on mobile) */
  #wh-screen2-who-v2 .wh2-title{
    font-size:clamp(22px, 5.2vw, 24px);
    margin-bottom:14px;
    color:#1a2530;
    line-height:1.25;
  }

  /* Keep icon/text proportions */
  #wh-screen2-who-v2 .wh2-icon{
    width:40px;
    height:40px;
    font-size:18px;
  }
  #wh-screen2-who-v2 .wh2-item{
    gap:12px;
    padding:8px 0;
  }
  #wh-screen2-who-v2 .wh2-text{
    font-size:17px;
    line-height:1.8;
    color:#495057;
    max-width:60ch;
  }
  #wh-screen2-who-v2 .wh2-text strong{
    color:#1a2530;
    font-weight:600;
  }
}
