@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

  .solutionFullBody{
    --brand:#1d2878; --brand-2:#01062e; --brand-soft:#EDEAFF; --brand-softer:#F4F2FF;
    --ink:#1E1B39; --ink-2:#4A4A63; --ink-3:#8A8AA3;
    --page:#F7F6FD; --card:#FFFFFF; --line:#ECEAF6; --line-2:#E7E5F2;
    --red:#EF4444; --red-soft:#FDEDED; --red-bg:#FEF5F5;
    --green:#16A34A; --green-soft:#E6F7EE; --green-bg:#F1FBF5;
    --blue:#2E6DE5; --blue-soft:#E9F0FE; --blue-bg:#F3F7FE;
    --violet:#7C3AED; --violet-soft:#F0EAFE; --violet-bg:#F7F3FE;
    --radius:18px;
    --fd:"Inter", sans-serif;
    --shadow:0 1px 2px rgba(30,27,57,.04), 0 24px 60px -28px rgba(30,27,57,.22);
    --shadow-sm:0 1px 2px rgba(30,27,57,.05), 0 10px 24px -16px rgba(30,27,57,.18);
	color:var(--ink);
  }
  *{box-sizing:border-box;}
  body{      
    -webkit-font-smoothing:antialiased;} 
	/*::-webkit-scrollbar{width:4px} 
::-webkit-scrollbar-track{background:#ddd} 
::-webkit-scrollbar-thumb{background:#fff;border-radius:99px} */
  svg{display:inline-block;}
  .ic{stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}

  /* solutionHeader */
  .solutionHead{text-align:center; padding:44px 0 26px;}
  .pill{display:inline-block; font-family:var(--fd); font-weight:600; font-size:.78rem; color:var(--brand); background:var(--brand-soft); padding:7px 16px; border-radius:999px; letter-spacing:.02em;}
  .solutionHead h1{font-family:var(--fd); font-weight:800; letter-spacing:-.02em; font-size:clamp(1.9rem,1.2rem+2.6vw,3rem); margin:16px 0 0; color:var(--ink);}
  .solutionHead .lede{margin:12px auto 0; max-width:760px; color:var(--ink-3); font-size:1.05rem;}

  /* main solutionPanel */
  .solutionPanel{background:var(--card); border:1px solid var(--line); border-radius:26px; box-shadow:var(--shadow); display:grid; grid-template-columns:330px 1fr; overflow:hidden; margin-bottom:30px;}
  .side{/*padding:24px 20px;*/ border-right:1px solid var(--line);}
  .side h3{font-family:var(--fd); font-weight:700; font-size:1.05rem; margin:0 0 16px;padding: 24px 20px 0px;}
  .sol-list{
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 660px;
    overflow: auto;
    padding: 5px 20px 24px;	  
  }
  .sol-item{display:flex !important; align-items:center; gap:13px; padding:13px 12px; border-radius:14px; cursor:pointer; border:1px solid transparent; background:#fff; transition:background .15s, border-color .15s, transform .1s; text-align:left; width:100%; font-family:inherit;}
  .sol-item:hover{background:#FAF9FF;}
  .sol-item.active{background:var(--brand-softer); border-color:#E3DEFF; box-shadow:inset 3px 0 0 var(--brand);}
  .sol-ic{width:42px;height:42px;border-radius:12px; flex:none; display:grid; place-items:center;}
  .sol-ic .ic{width:21px;height:21px;}
  .sol-tx{min-width:0; flex:1;}
  .sol-tx .t{display:block; font-family:var(--fd); font-weight:600; font-size:.92rem; line-height:1.2;}
  .sol-tx .d{display:block; color:var(--ink-3); font-size:.8rem; margin-top:3px; line-height:1.3;}
  .sol-item .chev{color:#C5C2DA; flex:none;}
  .sol-item.hidden-extra{display:none;}
  .viewall{margin-top:14px; width:100%; display:flex; align-items:center; justify-content:center; gap:9px; background:var(--brand-soft); color:var(--brand); border:0; border-radius:13px; padding:13px; font-family:var(--fd); font-weight:600; font-size:.9rem; cursor:pointer;}
  .viewall:hover{background:#E4DFFF;}

  /* Section content */
  .section-content{padding:26px 20px 20px; min-width:0;}
  .c-top{display:flex; align-items:flex-start; gap:16px; flex-wrap:wrap;}
  .c-ic{width:60px;height:60px;border-radius:16px; flex:none; display:grid; place-items:center;}
  .c-ic .ic{width:30px;height:30px;}
  .c-title-wrap{min-width:0; flex:1;}
  .c-title-row{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
  .c-title{font-family:var(--fd); font-weight:700; font-size:1.5rem; letter-spacing:-.01em; margin:0;}
  .c-tag{font-size:.74rem; font-weight:600; color:var(--brand); background:var(--brand-soft); padding:5px 12px; border-radius:999px; font-family:var(--fd);}
  .c-desc{color:var(--ink-2); font-size:.96rem; margin:10px 0 0; max-width:60ch;}
  .c-actions{display:flex; gap:10px; flex-wrap:wrap;}
  .solutionFullBody .btn{display:inline-flex; align-items:center; gap:8px; font-family:var(--fd); font-weight:600; font-size:.88rem; padding:11px 18px; border-radius:11px; cursor:pointer; border:1px solid transparent; transition:transform .15s, box-shadow .15s, background .15s;}
  .solutionFullBody .btn .ic{width:16px;height:16px;}
  .solutionFullBody .btn-ghost{background:#fff; color:var(--brand); border-color:#DAD3FF;}
  .solutionFullBody .btn-ghost:hover{background:var(--brand-softer);}
  .solutionFullBody .btn-primary{background:linear-gradient(135deg, var(--brand), var(--brand-2)); color:#fff; box-shadow:0 12px 24px -12px rgba(91,61,245,.7);}
  .solutionFullBody .btn-primary:hover{transform:translateY(-2px);}

  .solutionCards{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:24px;}
  .ccard{border-radius:var(--radius); padding:20px 18px; position:relative; overflow:hidden; min-height:230px; border:1px solid var(--line);}
  .ccard .ch{display:flex; align-items:center; gap:7px; font-family:var(--fd); font-weight:700; font-size: 14px; margin-bottom:14px;}
  .ccard .ch .ic{width:16px;height:16px;}
  .ccard p{margin:0; font-size:12px; color:var(--ink-2); line-height:1.5;}
  .ccard ul{list-style:none; margin:0; padding:0; display:grid; gap:11px;}
  .ccard li{display:flex; align-items:flex-start;gap: 6px;font-size: 12px;line-height: 1.4;color:var(--ink-2);}
  .ccard li .tk{width:18px;height:18px;flex:none;margin-top:1px;}
  .ccard .ghost-ic{position:absolute; right:-6px; bottom:-10px; opacity:.10;}
  .ccard .ghost-ic .ic{width:92px;height:92px; stroke-width:1.4;}
  .card-problem{background:var(--red-bg); border-color:#F8DCDC;} .card-problem .ch{color:var(--red);} .card-problem .ghost-ic{color:var(--red);}
  .card-solution{background:var(--green-bg); border-color:#CFEEDC;} .card-solution .ch{color:var(--green);} .card-solution li .tk{color:var(--green);} .card-solution .ghost-ic{color:var(--green);}
  .card-outcome{background:var(--blue-bg); border-color:#D8E5FB;} .card-outcome .ch{color:var(--blue);} .card-outcome .ghost-ic{color:var(--blue);}
  .card-benefit{background:var(--violet-bg); border-color:#E6DBFB;} .card-benefit .ch{color:var(--violet);} .card-benefit li .tk{color:var(--violet);} .card-benefit .ghost-ic{color:var(--violet);}

  /* how it works + applicable */
  .solutionBelt{
    /*display: grid;
    grid-template-columns: 1.55fr 1fr;*/
        display: flex;
    flex-wrap: wrap;
	    justify-content: center;
    gap: 20px;
    padding: 30px 0px 20px; 
  }
  .solutionBelt h4{font-family:var(--fd); font-weight:700; font-size:1.05rem; margin:0 0 18px;text-align:center;}
  .steps{display:flex; align-items:flex-start; flex-wrap:wrap; gap:6px;}
  .step{display:flex; flex-direction:column; align-items:center; text-align:center; width:96px;}
  .step .sc{width:50px;height:50px;border-radius:50%; display:grid; place-items:center; margin-bottom:9px;}
  .step .sc .ic{width:23px;height:23px;}
  .step .sl{font-size:.74rem; color:var(--ink-2); line-height:1.25;}
  .step .sl b{display:block; font-family:var(--fd); font-weight:600; color:var(--ink); font-size:.76rem;}
  .arr{display:flex; align-items:center; height:50px; color:#CFCAE6;}
  .arr .ic{width:18px;height:18px;}
  .applies{display:flex; flex-wrap:wrap; gap:10px;}
  .atag{display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line-2); background:#fff; border-radius:12px; padding:10px 14px; font-size:.85rem; font-weight:500; color:var(--ink-2); box-shadow:var(--shadow-sm);}
  .atag .ic{width:16px;height:16px; color:var(--brand);}

  /* bottom CTA */
  .cta{background:linear-gradient(180deg,#F3F1FE,#EFECFD); border:1px solid #E3DEFF; border-radius:20px; padding:22px 28px; display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-bottom:50px;}
  .cta .rk{width:48px;height:48px;border-radius:14px; background:#fff; display:grid; place-items:center; color:var(--brand); flex:none; box-shadow:var(--shadow-sm);}
  .cta .ctx{min-width:200px; flex:1;}
  .cta .ctx h3{font-family:var(--fd); font-weight:700; font-size:1.2rem; margin:0;}
  .cta .ctx p{margin:4px 0 0; color:var(--ink-2); font-size:.92rem;}
  .cta .cact{display:flex; gap:10px; flex-wrap:wrap;}

  /* solutionModal */
  .ov{position:fixed; inset:0; background:rgba(20,18,40,.5); backdrop-filter:blur(3px); display:none; align-items:center; justify-content:center; z-index:60; padding:20px;}
  .ov.show{display:flex;}
  .solutionModal{background:#fff; border-radius:20px; width:100%; max-width:440px; box-shadow:0 30px 70px -20px rgba(20,18,40,.5); overflow:hidden;}
  .solutionModal .mh{padding:22px 24px 0; display:flex; align-items:flex-start; gap:12px;}
  .solutionModal .mh .mic{width:44px;height:44px;border-radius:12px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;flex:none;}
  .solutionModal h3{font-family:var(--fd); font-weight:700; font-size:1.2rem; margin:0;}
  .solutionModal .msub{color:var(--ink-3); font-size:.86rem; margin-top:3px;}
  .solutionModal .close{margin-left:auto; background:none; border:0; cursor:pointer; color:var(--ink-3); padding:4px;}
  .solutionModal .mb{padding:18px 24px 24px;}
  .solutionModal label{display:block; font-size:.8rem; font-weight:600; color:var(--ink-2); margin:12px 0 6px;}
  .solutionModal input, .solutionModal textarea{width:100%; border:1px solid var(--line-2); border-radius:10px; padding:11px 12px; font-family:inherit; font-size:.9rem; outline:none;}
  .solutionModal input:focus, .solutionModal textarea:focus{border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-soft);}
  .solutionModal .submit{width:100%; margin-top:18px; justify-content:center;}
  .thanks{padding:30px 24px; text-align:center;}
  .thanks .tcirc{width:60px;height:60px;border-radius:50%;background:var(--green-soft);color:var(--green);display:grid;place-items:center;margin:0 auto 14px;}
  .thanks h3{font-family:var(--fd); margin:0 0 6px;}
  .thanks p{color:var(--ink-3); font-size:.9rem; margin:0;}

  /* toast */
  .toast{position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(16px); background:var(--ink); color:#fff; padding:12px 20px; border-radius:12px; font-weight:600; font-size:.88rem; opacity:0; pointer-events:none; transition:.25s; z-index:80; display:flex; gap:9px; align-items:center;}
  .toast.show{opacity:1; transform:translateX(-50%) translateY(0);}

  @media (max-width:1080px){ .solutionCards{grid-template-columns:1fr 1fr;} .solutionBelt{grid-template-columns:1fr;} }
  @media (max-width:880px){ .solutionPanel{grid-template-columns:1fr;} .side{border-right:0; border-bottom:1px solid var(--line);} }
  @media (max-width:560px){
  .solutionCards{grid-template-columns:1fr;} .c-actions{width:100%;}
  .solutionFullBody .btn {font-size: 12px;padding: 10px 15px;}
  .c-ic {
    width: 48px;
    height: 48px;
    border-radius: 10px;
  }
  .c-ic .ic {
    width: 22px;
    height: 22px;
}
.c-title{font-size: 17px;}
.c-desc {   
    font-size: 13px;
    line-height: 1.4;   
}
.cta {   
    padding: 20px 20px;    
}
.cta .ctx h3 {    
    font-size: 16px;
}
.cta .ctx p {    
    font-size: 13px;
    line-height: 1.4;
}
.atag {    
    border-radius: 10px;
    padding: 8px 14px;
    font-size: 12px;
    line-height: 1.4;    
}



  }