.wepx-calc{
  --ground:#FAFAFA; --surface:#FFFFFF; --surface-2:#F4F4F8;
  --ink:#171650; --muted:#5B5B7B; --line:#E4E4EC;
  --primary:#171650; --primary-2:#29339B; --primary-soft:#EEF0FA;
  --gold:#E8C649; --gold-deep:#D9A216; --gold-ink:#6E5200; --gold-soft:#FDF7E0;
  --on-primary:#FFFFFF;
  --shadow: 0 1px 2px rgba(23,22,80,.05), 0 10px 28px -16px rgba(23,22,80,.25);
}
.wepx-calc *{box-sizing:border-box}
.wepx-calc{
  background:transparent; color:var(--ink);
  font-family:Rubik,"Segoe UI",system-ui,sans-serif; font-weight:400;
  line-height:1.65; -webkit-font-smoothing:antialiased;
}
.wepx-wrap{max-width:820px; margin:0 auto; padding-inline:16px; padding-block:8px 40px}
.wepx-calc[dir=rtl]{direction:rtl; text-align:right}

.wepx-eyebrow{
  font-size:.8rem; letter-spacing:.06em; font-weight:600;
  color:var(--gold-deep); margin:0;
}
.wepx-calc h1{
  font-family:Rubik,sans-serif; font-weight:700;
  font-size:clamp(1.8rem,5.5vw,2.5rem); line-height:1.15; margin:.3rem 0 .5rem;
  text-wrap:balance; color:var(--ink);
}
.wepx-lede{color:var(--muted); font-size:1.02rem; max-width:60ch; margin:0}

.wepx-panel{
  background:var(--surface); border:1px solid var(--line); border-radius:16px;
  padding:22px; box-shadow:var(--shadow); margin-top:22px;
}
.wepx-panel h2{
  font-size:1rem; color:var(--ink); font-weight:600; margin:0 0 14px;
  display:flex; align-items:center; gap:8px;
}
.wepx-panel h2::before{content:""; width:4px; height:1.05em; border-radius:2px; background:var(--gold)}

.wepx-seg{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,132px),1fr)); gap:10px}
.wepx-seg button{
  font:inherit; font-size:.95rem; font-weight:600; cursor:pointer; line-height:1.3;
  background:var(--surface); color:var(--ink);
  border:1.5px solid var(--line); border-radius:12px; padding:12px 8px;
  display:flex; flex-direction:column; gap:4px; align-items:center; justify-content:center; text-align:center;
  transition:background .15s, border-color .15s, color .15s;
}
.wepx-seg button:hover,.wepx-seg button:focus,.wepx-seg button:active{background:var(--surface); color:var(--ink); border-color:var(--primary-2); text-decoration:none}
.wepx-seg button .wepx-sub{font-size:.74rem; color:var(--muted); font-weight:400}
.wepx-seg button[aria-pressed=true],.wepx-seg button[aria-pressed=true]:hover,.wepx-seg button[aria-pressed=true]:focus,.wepx-seg button[aria-pressed=true]:active{
  background:var(--primary); border-color:var(--primary); color:var(--on-primary);
}
.wepx-seg button[aria-pressed=true] .wepx-sub{color:var(--gold)}
.wepx-seg button:focus-visible{outline:2px solid var(--gold-deep); outline-offset:2px}

.wepx-fields{display:grid; grid-template-columns:1fr; gap:14px; margin-top:4px}
@media(min-width:520px){ .wepx-fields{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))} }
.wepx-field label{display:block; font-size:.86rem; color:var(--ink); margin-bottom:6px; font-weight:500}
.wepx-field input{
  width:100%; font:inherit; font-size:1.05rem; font-weight:500; font-variant-numeric:tabular-nums;
  padding:11px 13px; border-radius:10px; border:1.5px solid var(--line);
  background:var(--ground); color:var(--ink);
}
.wepx-field input:focus-visible{outline:none; border-color:var(--primary-2); box-shadow:0 0 0 3px var(--primary-soft)}
.wepx-hint{font-size:.84rem; color:var(--muted); margin:12px 0 0}

.wepx-result{margin-top:22px; border-radius:16px; overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line)}
.wepx-result-top{
  background:linear-gradient(135deg,#171650 0%,#29339B 100%); color:#FFFFFF;
  padding:24px 22px;
}
.wepx-bignum{
  font-family:Rubik,sans-serif; font-weight:700;
  font-size:clamp(2.6rem,10vw,3.6rem); line-height:1; color:#FFFFFF;
  font-variant-numeric:tabular-nums; display:flex; align-items:baseline; gap:.4rem;
}
.wepx-bignum span{font-size:1.15rem; font-weight:500; color:#E8C649}
.wepx-breakdown{margin-top:12px; font-size:.9rem; color:rgba(255,255,255,.8); font-variant-numeric:tabular-nums}
.wepx-result-body{background:var(--surface); padding:22px}
.wepx-result-body h2{font-size:1rem; color:var(--ink); font-weight:600; margin:0 0 13px}

.wepx-packs{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px}
.wepx-pack{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--ground);
}
.wepx-pack .wepx-qty{
  background:var(--gold); color:#171650; border-radius:8px;
  padding:3px 10px; font-weight:700; font-size:.88rem; font-variant-numeric:tabular-nums; flex:none;
}
.wepx-pack .wepx-nm{flex:1 1 180px; font-size:.95rem; font-weight:500; min-width:0}
.wepx-pack .wepx-pr{font-weight:700; font-variant-numeric:tabular-nums; flex:none}
.wepx-pack a{
  flex:none; text-decoration:none; font-size:.86rem; font-weight:600;
  background:var(--primary); color:var(--on-primary); padding:7px 14px; border-radius:999px;
  transition:background .15s;
}
.wepx-pack a:hover,.wepx-pack a:focus,.wepx-pack a:active,.wepx-pack a:visited:hover{background:var(--primary-2); color:var(--on-primary); text-decoration:none}
.wepx-pack a:focus-visible{outline:2px solid var(--gold-deep); outline-offset:2px}

.wepx-total{
  display:flex; justify-content:space-between; align-items:baseline;
  margin-top:16px; padding-top:14px; border-top:1px dashed var(--line);
  font-variant-numeric:tabular-nums; font-weight:600;
}
.wepx-total .wepx-big{font-size:1.7rem; font-weight:700; color:var(--ink)}

.wepx-warn{
  margin-top:14px; padding:11px 14px; border-radius:10px;
  background:var(--gold-soft); color:var(--gold-ink);
  font-size:.88rem; font-weight:500; border:1px solid var(--gold);
}

.wepx-calc details{margin-top:14px; border-top:1px solid var(--line); padding-top:14px}
.wepx-calc details summary,details summary:hover{cursor:pointer; font-weight:600; font-size:.94rem; color:var(--primary-2); background:none}
.wepx-calc details summary:focus-visible{outline:2px solid var(--gold-deep); outline-offset:3px}
.wepx-formula{
  font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:.84rem;
  background:var(--ground); border:1px solid var(--line); border-radius:10px;
  padding:12px 14px; margin-top:11px; direction:ltr; text-align:left; overflow-x:auto;
}
.wepx-calc details p{font-size:.92rem; color:var(--muted)}

.wepx-faq{margin-top:36px}
.wepx-faq h2{font-family:Rubik,sans-serif; font-weight:700; font-size:1.5rem; margin:0 0 6px; color:var(--ink)}
.wepx-faq-item{border-bottom:1px solid var(--line); padding:16px 0}
.wepx-faq-item:last-child{border-bottom:0}
.wepx-faq-item h3{font-size:1.04rem; font-weight:600; margin:0 0 6px; color:var(--ink)}
.wepx-faq-item p{margin:0; color:var(--muted); font-size:.96rem}

.wepx-calc footer{margin-top:32px; padding:14px 16px; border-radius:12px; background:var(--surface-2); font-size:.85rem; color:var(--muted)}
.wepx-calc footer strong{color:var(--ink)}

.wepx-shape{display:inline-flex; gap:6px; margin:0 0 14px; padding:4px; border-radius:12px; background:var(--surface-2)}
.wepx-shape button,.wepx-shape button:hover,.wepx-shape button:focus,.wepx-shape button:active{font:inherit; font-size:.9rem; font-weight:600; padding:7px 18px; border:0; border-radius:9px; background:transparent; color:var(--muted); cursor:pointer; text-decoration:none}
.wepx-shape button[aria-pressed=true],.wepx-shape button[aria-pressed=true]:hover,.wepx-shape button[aria-pressed=true]:focus{background:var(--primary); color:var(--on-primary)}
.wepx-shape button:focus-visible{outline:2px solid var(--gold-deep); outline-offset:2px}
.wepx-shape[hidden]{display:none!important}
.wepx-pack-img{width:52px; height:52px; border-radius:8px; object-fit:cover; flex:none; background:var(--ground)}
.wepx-seg button .wepx-ico{width:64px; height:64px; object-fit:contain; margin-bottom:2px}

.wepx-addons{margin-top:20px; padding-top:16px; border-top:1px solid var(--line)}
.wepx-addon-list{list-style:none; padding:0; margin:0; display:grid; gap:10px}
.wepx-addon{display:flex; align-items:center; gap:12px; padding:10px 12px; border:1.5px solid var(--line); border-radius:12px; background:var(--surface); cursor:pointer; transition:border-color .15s, background .15s}
.wepx-addon:hover{border-color:var(--primary-2)}
.wepx-addon.on{border-color:var(--primary); background:var(--primary-soft)}
.wepx-addon input{width:20px; height:20px; accent-color:var(--primary); flex:none; margin:0}
.wepx-addon-img{width:52px; height:52px; border-radius:8px; object-fit:cover; flex:none; background:var(--ground)}
.wepx-addon-txt{flex:1; min-width:0}
.wepx-addon-txt b{display:block; font-size:.93rem; font-weight:600; color:var(--ink)}
.wepx-addon-txt .wepx-why{display:block; font-size:.83rem; color:var(--muted); line-height:1.45; margin-top:2px}
.wepx-addon-txt a,.wepx-addon-txt a:hover,.wepx-addon-txt a:visited{font-size:.8rem; color:var(--primary-2); text-decoration:underline; background:none}
.wepx-addon .wepx-pr{font-weight:700; font-variant-numeric:tabular-nums; flex:none; color:var(--ink)}

.wepx-grand{display:flex; justify-content:space-between; align-items:baseline; margin-top:14px; padding:12px 14px; border-radius:12px; background:var(--gold-soft); font-weight:600}
.wepx-grand .wepx-big{font-size:1.5rem; font-weight:700; color:var(--ink)}
.wepx-cartbtn,.wepx-cartbtn:focus,.wepx-cartbtn:active{display:block; width:100%; margin-top:14px; padding:14px; border:0; border-radius:12px; background:var(--primary); color:var(--on-primary); font:inherit; font-size:1.05rem; font-weight:700; cursor:pointer; text-decoration:none}
.wepx-cartbtn:hover{background:var(--primary-2); color:var(--on-primary)}
.wepx-cartbtn:focus-visible{outline:2px solid var(--gold-deep); outline-offset:2px}
.wepx-cartbtn[disabled]{opacity:.65; cursor:progress}
.wepx-addons[hidden],.wepx-grand[hidden],.wepx-cartbtn[hidden],.wepx-cartmsg[hidden],.wepx-warn[hidden]{display:none!important}
.wepx-cartmsg{margin:8px 0 0; font-size:.88rem; color:var(--muted); text-align:center}
@media (prefers-reduced-motion: reduce){ *{transition:none!important; animation:none!important} }
.wepx-cta{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin:22px 0; padding:18px 20px; border-radius:16px; background:linear-gradient(135deg,#171650 0%,#29339B 100%); color:#fff; font-family:Rubik,"Segoe UI",system-ui,sans-serif; direction:rtl; text-align:right}
.wepx-cta-txt{flex:1 1 240px; display:flex; flex-direction:column; gap:4px}
.wepx-cta-txt strong{font-size:1.1rem; font-weight:700; color:#fff}
.wepx-cta-txt span{font-size:.92rem; color:rgba(255,255,255,.82); line-height:1.5}
.wepx-cta-btn,.wepx-cta-btn:visited,.wepx-cta-btn:focus{flex:none; display:inline-block; padding:11px 22px; border-radius:999px; background:#E8C649; color:#171650; font-weight:700; font-size:.98rem; text-decoration:none}
.wepx-cta-btn:hover{background:#fff; color:#171650; text-decoration:none}
.wepx-home{background:#FAFAFA; padding:40px 0 8px}
.wepx-home[hidden]{display:none!important}
.wepx-home-title{max-width:820px; margin:0 auto; padding:0 16px; font-family:Rubik,sans-serif; font-weight:700; font-size:clamp(1.6rem,4vw,2.2rem); color:#171650; text-align:right; direction:rtl}
.wepx-compact .wepx-faq,.wepx-compact footer{display:none}
.wepx-home-toggle{display:none}
@media (max-width:767px){
  .wepx-home-body{position:relative; max-height:6000px; transition:max-height .5s ease}
  .wepx-home.is-collapsed .wepx-home-body{max-height:330px; overflow:hidden}
  .wepx-home.is-collapsed .wepx-home-body::after{content:""; position:absolute; left:0; right:0; bottom:0; height:140px; background:linear-gradient(rgba(250,250,250,0),#FAFAFA 85%); pointer-events:none}
  .wepx-home.is-collapsed .wepx-home-toggle,.wepx-home.is-collapsed .wepx-home-toggle:hover,.wepx-home.is-collapsed .wepx-home-toggle:focus{display:block; width:calc(100% - 32px); margin:-8px auto 0; padding:14px; border:0; border-radius:12px; background:#171650; color:#fff; font-family:Rubik,sans-serif; font-size:1.05rem; font-weight:700; cursor:pointer; position:relative; z-index:1}
}
.wepx-compact .wepx-wrap{padding-block:8px 32px}