

.ins-hero{ min-height:78vh; }
.ins-hero-content{ padding-top:clamp(112px,26vw,150px); padding-bottom:clamp(32px,6vw,50px); }

/* ================= Intro strip ================= */
.ins-intro{ background:var(--white); padding:clamp(40px,9vw,70px) 0 20px; }
.ins-intro p{ max-width:820px; color:var(--ink-soft); font-size:clamp(14.5px,3.6vw,17px); line-height:1.95; }

/* ================= Specialized split sections ================= */
.ins-split-section{ padding:clamp(40px,9vw,70px) 0; overflow:hidden; }
.ins-split-section:nth-of-type(even){ background:var(--secondary); }
.ins-split{
  display:grid; grid-template-columns:1fr; gap:clamp(28px,6vw,64px); align-items:center;
}
.ins-media{ position:relative; max-width:100%; }
.ins-media img{
  width:100%; height:clamp(190px,46vw,400px); object-fit:cover;
  border-radius:var(--radius-lg); box-shadow:var(--shadow-card); display:block;
}
.ins-icon-badge{
  position:absolute;
  bottom:clamp(-20px,-4vw,-10px); inset-inline-start:clamp(-20px,-4vw,-10px);
  width:clamp(42px,10vw,64px); height:clamp(42px,10vw,64px); border-radius:50%;
  background:var(--navy); color:var(--gold); display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-gold);
}
.ins-icon-badge svg{ width:clamp(18px,4.4vw,26px); height:clamp(18px,4.4vw,26px); }
.ins-content{ min-width:0; }
.ins-content .section-eyebrow{ margin-bottom:10px; }
.ins-content h2{
  font-family:var(--font-display); font-size:clamp(21px,4.4vw,32px); font-weight:800;
  color:var(--navy); margin-bottom:14px; line-height:1.35; overflow-wrap:break-word;
}
.ins-content p{ color:var(--ink-soft); font-size:clamp(14px,3.4vw,15.5px); line-height:1.9; margin-bottom:16px; }
.ins-points{ display:flex; flex-direction:column; gap:12px; }
.ins-points li{ display:flex; align-items:flex-start; gap:10px; color:var(--ink); font-size:clamp(13.5px,3.2vw,14.5px); line-height:1.6; }
.ins-points svg{ color:var(--gold); flex-shrink:0; margin-top:3px; width:18px; height:18px; }

@media (min-width:640px){
  .ins-media img{ height:clamp(260px,42vw,400px); }
}
@media (min-width:901px){
  .ins-split{ grid-template-columns:1fr 1fr; }
}

/* ================= Benefits ================= */
.ins-benefits{ background:var(--paper); }
.ins-benefits-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));
  gap:clamp(14px,3vw,24px); margin-top:clamp(30px,6vw,50px);
}
.ins-benefit-card{
  background:var(--white); border-radius:var(--radius-md);
  padding:clamp(20px,4.5vw,30px) clamp(16px,3.5vw,26px);
  box-shadow:var(--shadow-soft); text-align:center; min-width:0;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.ins-benefit-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-card); }
.ins-benefit-card svg{ color:var(--gold); margin-bottom:14px; width:28px; height:28px; }
.ins-benefit-card h3{ font-size:clamp(14.5px,3.4vw,16px); color:var(--navy); margin-bottom:8px; overflow-wrap:break-word; }
.ins-benefit-card p{ color:var(--ink-soft); font-size:clamp(12.5px,3vw,13.5px); line-height:1.8; }

/* ================= Small-screen refinements (<=480px) ================= */
@media (max-width:480px){
  .ins-hero-content{ padding-top:118px; }
  .breadcrumb{ font-size:12px; }
  .ins-icon-badge{ box-shadow:0 8px 18px rgba(212,175,55,.3); }
}

/* ================= Extra-narrow guard (<=360px, 320px devices) ================= */
@media (max-width:360px){
  .container{ padding-inline:18px; }
  .ins-content h2{ font-size:20px; }
  .ins-benefit-card{ padding:18px 14px; }
}
