/* =========================================================
   KOKORO COURSE & PRICING ENGINE V1.1
   Dedicated stylesheet so the pricing engine remains visually
   consistent even when an older global stylesheet is cached.
========================================================= */
#pricing .pricing-engine{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(320px,.75fr);
  gap:24px;
  align-items:start;
}
#pricing .pricing-select,
#pricing .quote-box{
  background:#fff;
  border:1px solid #eadfe0;
  border-radius:24px;
  padding:26px;
  box-shadow:0 14px 40px rgba(120,15,20,.08);
}
#pricing .pricing-engine-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  margin-bottom:20px;
}
#pricing .pricing-engine-head h3{margin:10px 0 4px;font-size:1.35rem}
#pricing .pricing-engine-head p{margin:0;color:#667085;font-size:.92rem;max-width:620px}
#pricing .selection-count{
  flex:0 0 auto;
  background:#fff1f2;
  color:#ef1b23;
  border:1px solid #f3cdd0;
  border-radius:999px;
  padding:8px 12px;
  font-size:.78rem;
  font-weight:900;
  white-space:nowrap;
}
#pricing .course-select-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
#pricing .course-select-card{
  position:relative;
  display:grid;
  grid-template-columns:40px 1fr;
  grid-template-rows:auto auto auto;
  column-gap:12px;
  align-items:center;
  min-height:118px;
  border:1.5px solid #eadfe0;
  border-radius:18px;
  padding:16px;
  cursor:pointer;
  background:linear-gradient(180deg,#fff 0%,#fffafa 100%);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
#pricing .course-select-card:hover{transform:translateY(-2px);border-color:#ef1b23;box-shadow:0 10px 25px rgba(239,27,35,.09)}
#pricing .course-select-card input{position:absolute;opacity:0;pointer-events:none}
#pricing .course-select-card:has(input:checked){border-color:#ef1b23;background:#fff4f5;box-shadow:0 0 0 3px rgba(239,27,35,.08)}
#pricing .select-check{
  grid-column:1;
  grid-row:1 / span 3;
  width:34px;height:34px;
  border:2px solid #d9c4c6;
  border-radius:10px;
  display:grid;place-items:center;
  color:transparent;
  font-weight:900;
  background:#fff;
  transition:.2s ease;
}
#pricing .course-select-card:has(input:checked) .select-check{background:#ef1b23;border-color:#ef1b23;color:#fff}
#pricing .select-level{grid-column:2;color:#ef1b23;font-size:.72rem;font-weight:900;letter-spacing:.06em}
#pricing .course-select-card strong{grid-column:2;font-size:1rem;line-height:1.3;margin-top:2px}
#pricing .course-select-card small{grid-column:2;color:#ef1b23;font-size:.94rem;font-weight:900;margin-top:4px}
#pricing .course-select-card small:empty{display:none}
#pricing .bundle-offers{margin-top:26px;padding-top:23px;border-top:1px solid #eee}
#pricing .bundle-offers-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
#pricing .bundle-offers-head h3{margin-top:4px;font-size:1.22rem}
#pricing .mini-label{color:#ef1b23;font-size:.7rem;font-weight:900;letter-spacing:.08em}
#pricing .auto-badge{border:1px solid #dcefe3;background:#f3fff7;color:#198754;border-radius:999px;padding:7px 10px;font-size:.68rem;font-weight:900;white-space:nowrap}
#pricing .bundle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#pricing .bundle-mini{position:relative;border:1px solid #f0d1d3;border-radius:16px;padding:16px;background:linear-gradient(180deg,#fff,#fff7f7);min-height:145px}
#pricing .bundle-mini:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#ef1b23;border-radius:16px 0 0 16px}
#pricing .bundle-mini strong{display:block;font-size:.98rem;line-height:1.3;padding-left:4px}
#pricing .bundle-mini span{display:inline-flex;color:#ef1b23;background:#fff0f1;border-radius:999px;padding:5px 8px;font-weight:900;font-size:.72rem;margin:9px 0 7px 4px}
#pricing .bundle-mini p{font-size:.78rem;line-height:1.5;color:#667085;margin:0 0 0 4px}
#pricing .quote-box{position:sticky;top:100px;background:#171717;color:#fff;border-color:#171717;overflow:hidden}
#pricing .quote-box:before{content:"";position:absolute;width:180px;height:180px;border:35px solid rgba(239,27,35,.18);border-radius:50%;right:-95px;top:-95px;pointer-events:none}
#pricing .quote-box h3{font-size:1.45rem;margin:10px 0 2px;position:relative}
#pricing .quote-subtitle{color:#aaa;font-size:.82rem;margin-bottom:8px;position:relative}
#pricing .quote-empty{color:#b8b8b8;padding:24px 0;line-height:1.7}
#pricing .quote-selection{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0 2px}
#pricing .quote-selection span{background:#2a2a2a;border:1px solid #444;color:#eee;border-radius:999px;padding:5px 8px;font-size:.7rem;font-weight:800}
#pricing .quote-plan,#pricing .quote-line,#pricing .quote-total{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid #333;position:relative}
#pricing .quote-plan span,#pricing .quote-line span{color:#aaa}
#pricing .quote-plan strong{color:#fff;text-align:right}
#pricing .quote-line.discount strong{color:#ff7379}
#pricing .quote-total{border-bottom:0;align-items:end;margin-top:4px}
#pricing .quote-total span{color:#ddd;font-weight:800}
#pricing .quote-total strong{color:#fff;font-size:1.55rem}
#pricing .quote-bonus{background:rgba(239,27,35,.13);border:1px solid rgba(239,27,35,.42);color:#ffd9db;padding:13px;border-radius:13px;margin:14px 0 17px;font-size:.82rem;line-height:1.55}
#pricing .quote-box .btn{width:100%;position:relative}
@media(max-width:1050px){
  #pricing .pricing-engine{grid-template-columns:1fr}
  #pricing .quote-box{position:static}
  #pricing .bundle-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  #pricing .pricing-select,#pricing .quote-box{padding:19px;border-radius:20px}
  #pricing .pricing-engine-head{flex-direction:column}
  #pricing .selection-count{align-self:flex-start}
  #pricing .course-select-grid{grid-template-columns:1fr}
  #pricing .bundle-grid{grid-template-columns:1fr}
  #pricing .bundle-mini{min-height:auto}
}
@media(max-width:480px){
  #pricing .course-select-card{min-height:105px;padding:13px}
  #pricing .course-select-card strong{font-size:.92rem}
  #pricing .quote-total strong{font-size:1.35rem}
}
