/* kolkatachicks.com - price list page (kolkata-escort-price-list.html), 2026-09-13.
   Replaces the old pink/blue gradient cards. Slate + white panels + one rose accent,
   headings in the display font. All classes start with kpr- (nothing else uses it). */

.kpr { padding: 8px 0 20px; }
.kpr-wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.kpr-sec { margin: 52px 0 0; }
body .kpr-h2 { margin: 0 0 8px; font-family: var(--kc-display); font-weight: 700; font-size: clamp(22px, 2.6vw, 30px);
  line-height: 1.2; letter-spacing: -.01em; color: var(--kc-txt); text-align: left; text-wrap: balance; text-transform: none; }
.kpr-h2 em { font-style: normal; color: var(--kc-rose-deep); }
.kpr-lede { margin: 0 0 22px; max-width: 70ch; font-size: 16px; line-height: 1.7; color: var(--kc-txt-2) !important; }
.kpr p a, .kpr li a { color: var(--kc-rose-deep); font-weight: 700; }

/* ---- 1. intro + travel card ---- */
.kpr-intro { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px 40px; align-items: start; margin-top: 40px; }
.kpr-intro p { font-size: 16px; line-height: 1.75; color: var(--kc-txt) !important; margin: 0 0 14px; max-width: 70ch; }
.kpr-travel { padding: 22px 22px 18px; border-radius: 16px; background: var(--kc-slate); color: var(--kc-slate-txt); }
body .kpr-travel h3 { margin: 0 0 6px; font: 700 12px/1.2 var(--kc-body); letter-spacing: .12em; text-transform: uppercase; color: var(--kc-rose); text-align: left; }
.kpr-travel p { margin: 0 0 14px !important; font-size: 14.5px !important; line-height: 1.6 !important; color: var(--kc-slate-txt-2) !important; }
.kpr-travel ol { list-style: none; margin: 0; padding: 0; }
.kpr-travel li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid rgba(255,255,255,.1);
  font-size: 14.5px; color: var(--kc-slate-txt); font-variant-numeric: tabular-nums; }
.kpr-travel li b { color: #fff; white-space: nowrap; }
.kpr-travel li b.kpr-free { color: #6be3a4; }

/* ---- 2. the three packages ---- */
.kpr-plans { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: stretch; }
.kpr-plan { position: relative; display: flex; flex-direction: column; padding: 26px 24px 22px; border-radius: 18px; background: var(--kc-panel);
  border: 1px solid var(--kc-line); box-shadow: 0 6px 22px rgba(31, 34, 51, .06); }
.kpr-plan-top { background: var(--kc-slate); border-color: var(--kc-slate); color: var(--kc-slate-txt); box-shadow: 0 16px 38px rgba(31, 34, 51, .26); }
.kpr-badge { position: absolute; top: -12px; left: 24px; padding: 6px 12px; border-radius: 999px; background: var(--kc-rose); color: #fff;
  font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
body .kpr-plan h3 { margin: 0 0 12px; font: 800 13px/1.2 var(--kc-body); letter-spacing: .14em; text-transform: uppercase; color: var(--kc-txt-2); text-align: left; }
body .kpr-plan-top h3 { color: var(--kc-slate-txt-2); }
.kpr-price { margin: 0 0 4px; font-family: var(--kc-display); font-size: clamp(30px, 3.2vw, 38px); line-height: 1; color: var(--kc-txt);
  font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.kpr-plan-top .kpr-price { color: #fff; }
.kpr-price small { display: block; margin-bottom: 8px; font: 800 11px/1 var(--kc-body); letter-spacing: .12em; text-transform: uppercase; color: var(--kc-rose-deep); }
.kpr-plan-top .kpr-price small { color: var(--kc-rose); }
.kpr-per { margin: 0 0 18px !important; font-size: 13.5px; color: var(--kc-txt-2) !important; }
.kpr-plan-top .kpr-per { color: var(--kc-slate-txt-2) !important; }
.kpr-feat { list-style: none; margin: 0 0 22px; padding: 16px 0 0; border-top: 1px solid var(--kc-line); }
.kpr-plan-top .kpr-feat { border-top-color: rgba(255,255,255,.12); }
.kpr-feat li { display: flex; align-items: center; gap: 10px; padding: 6px 0; font-size: 15px; color: var(--kc-txt); }
.kpr-plan-top .kpr-feat li { color: var(--kc-slate-txt); }
.kpr-feat svg { flex: none; width: 20px; height: 20px; border-radius: 50%; padding: 3px; }
.kpr-feat .kpr-y svg { background: rgba(33, 196, 107, .14); fill: #169c55; }
.kpr-plan-top .kpr-feat .kpr-y svg { background: rgba(107, 227, 164, .16); fill: #6be3a4; }
.kpr-feat .kpr-n { color: #9a97ab; text-decoration: line-through; text-decoration-color: rgba(154,151,171,.5); }
.kpr-plan-top .kpr-feat .kpr-n { color: #7d7a92; }
.kpr-feat .kpr-n svg { background: #efeef4; fill: #a9a6b8; }
.kpr-plan-top .kpr-feat .kpr-n svg { background: rgba(255,255,255,.06); fill: #6f6c84; }
.kpr-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto; }
.kpr-wa, .kpr-call { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 12px 10px; border-radius: 10px;
  font-weight: 800; font-size: 14.5px; line-height: 1; text-decoration: none !important; transition: background .2s ease, border-color .2s ease; }
.kpr-wa { background: var(--kc-rose); color: #fff !important; }
.kpr-wa:hover { background: var(--kc-rose-deep); }
.kpr-call { border: 1.5px solid var(--kc-line); color: var(--kc-txt) !important; background: transparent; }
.kpr-call:hover { border-color: var(--kc-txt); }
.kpr-plan-top .kpr-call { border-color: rgba(255,255,255,.28); color: #fff !important; }
.kpr-plan-top .kpr-call:hover { border-color: #fff; }
.kpr-wa svg, .kpr-call svg { width: 17px; height: 17px; fill: currentColor; flex: none; }
.kpr-note { margin: 16px 0 0 !important; font-size: 14px; color: var(--kc-txt-2) !important; }

/* ---- 3. every girl's price ---- */
.kpr-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin: 0 0 14px; }
.kpr-group { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.kpr-group > span { margin-right: 4px; font-size: 11.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--kc-txt-2); }
.kpr-chip { padding: 8px 13px; border-radius: 999px; border: 1px solid var(--kc-line); background: var(--kc-panel); color: var(--kc-txt);
  font: 700 13.5px/1 var(--kc-body); cursor: pointer; transition: border-color .15s ease, background .15s ease, color .15s ease; }
.kpr-chip:hover { border-color: var(--kc-rose); }
.kpr-chip[aria-pressed="true"] { background: var(--kc-slate); border-color: var(--kc-slate); color: #fff; }
.kpr-chip:focus-visible { outline: 3px solid var(--kc-rose); outline-offset: 2px; }
.kpr-count { margin: 0 0 10px !important; font-size: 13.5px; font-weight: 700; color: var(--kc-txt-2) !important; }

.kpr-tbl { border: 1px solid var(--kc-line); border-radius: 16px; background: var(--kc-panel); box-shadow: 0 6px 22px rgba(31, 34, 51, .05); }
.kpr-tbl table { width: 100%; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.kpr-tbl caption { caption-side: bottom; padding: 14px 18px; font-size: 13.5px; color: var(--kc-txt-2); text-align: left; }
.kpr-tbl thead th { position: sticky; top: 0; z-index: 2; padding: 13px 16px; background: var(--kc-slate); color: #fff; text-align: right;
  font-size: 11.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.kpr-tbl thead th:first-child { text-align: left; border-top-left-radius: 15px; }
.kpr-tbl thead th:last-child { border-top-right-radius: 15px; }
.kpr-tbl thead th small { display: block; margin-top: 3px; font-size: 10.5px; font-weight: 600; letter-spacing: .04em; text-transform: none; color: var(--kc-slate-txt-2); }
.kpr-tbl tbody th, .kpr-tbl tbody td { padding: 10px 16px; border-bottom: 1px solid var(--kc-line); color: var(--kc-txt); }
.kpr-tbl tbody tr:last-child th, .kpr-tbl tbody tr:last-child td { border-bottom: 0; }
.kpr-tbl tbody tr:hover th, .kpr-tbl tbody tr:hover td { background: #faf9fc; }
.kpr-tbl tbody td { text-align: right; font-size: 15px; font-weight: 600; white-space: nowrap; }
.kpr-tbl tbody td.kpr-1h { font-weight: 800; color: var(--kc-txt); }
.kpr-tbl tbody th { text-align: left; font-weight: 400; }
.kpr-who { display: flex; align-items: center; gap: 12px; min-width: 0; }
.kpr-who img { flex: none; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; background: #e9e8ef; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(23,25,39,.18); }
.kpr-who a { font-weight: 800; font-size: 15.5px; color: var(--kc-txt) !important; text-decoration: none !important; }
.kpr-who a:hover { color: var(--kc-rose-deep) !important; }
.kpr-tag { display: inline-block; margin-left: 6px; padding: 3px 7px; border-radius: 5px; font-size: 10px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; vertical-align: 2px; line-height: 1.2; }
.kpr-vip { background: rgba(255, 45, 149, .12); color: var(--kc-rose-deep); }
.kpr-na { background: var(--kc-slate); color: #fff; }
.kpr-tbl tr.kc-row-off th, .kpr-tbl tr.kc-row-off td, .kpr-tbl tr.kc-row-off .kpr-who a { color: #9a97ad !important; }
.kpr-tbl tr.kc-row-off .kpr-who img { filter: grayscale(1); opacity: .7; }
.kpr-empty { padding: 26px 18px; text-align: center; font-weight: 700; color: var(--kc-txt-2); }

/* ---- 4. the ladder ---- */
.kpr-ladder { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 28px 40px; align-items: start; }
.kpr-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.kpr-steps li { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 16px; border-radius: 12px;
  background: var(--kc-panel); border: 1px solid var(--kc-line); font-variant-numeric: tabular-nums; }
.kpr-steps b { font-size: 15px; color: var(--kc-txt); }
.kpr-steps i { display: block; height: 10px; border-radius: 99px; background: linear-gradient(90deg, var(--kc-slate), var(--kc-slate)) no-repeat left / var(--w) 100%, #ecebf2; font-style: normal; }
.kpr-steps li:first-child i { background: linear-gradient(90deg, var(--kc-rose), var(--kc-rose)) no-repeat left / var(--w) 100%, #ecebf2; }
.kpr-steps span { font-weight: 800; font-size: 15.5px; color: var(--kc-txt); white-space: nowrap; }
.kpr-steps small { display: block; font-size: 12px; font-weight: 600; color: var(--kc-txt-2); }
.kpr-how { padding: 22px; border-radius: 16px; background: var(--kc-panel); border: 1px solid var(--kc-line); border-left: 4px solid var(--kc-rose); }
body .kpr-how h3 { margin: 0 0 10px; font-size: 18px; text-align: left; }
.kpr-how p { margin: 0 0 12px !important; font-size: 15px; line-height: 1.65; color: var(--kc-txt) !important; }
.kpr-how p:last-child { margin-bottom: 0 !important; }

/* ---- 5. FAQ ---- */
.kpr-faq { max-width: 860px; }
.kpr-faq details { border-bottom: 1px solid var(--kc-line); }
.kpr-faq summary { cursor: pointer; list-style: none; position: relative; padding: 18px 36px 18px 0; font-weight: 800; font-size: 16.5px; color: var(--kc-txt); }
.kpr-faq summary::-webkit-details-marker { display: none; }
.kpr-faq summary::after { content: "+"; position: absolute; right: 6px; top: 14px; font: 700 22px/1 var(--kc-display); color: var(--kc-rose-deep); }
.kpr-faq details[open] summary::after { content: "\2212"; }
.kpr-faq summary:focus-visible { outline: 2px solid var(--kc-rose); outline-offset: 2px; }
.kpr-faq p { margin: 0 0 18px !important; max-width: 72ch; font-size: 15.5px; line-height: 1.7; color: var(--kc-txt-2) !important; }

/* ---- 6. book band ---- */
.kpr-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 28px; padding: 28px 30px; border-radius: 20px;
  background: var(--kc-slate); color: var(--kc-slate-txt); }
body .kpr-cta h2 { margin: 0 0 6px; font-size: clamp(20px, 2.2vw, 26px); color: #fff; text-align: left; text-transform: none; }
.kpr-cta p { margin: 0 !important; color: var(--kc-slate-txt-2) !important; font-size: 15px; }
.kpr-cta .kpr-btns { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.kpr-cta .kpr-wa, .kpr-cta .kpr-call { padding: 14px 20px; font-size: 15px; }
.kpr-cta .kpr-call { border-color: rgba(255,255,255,.3); color: #fff !important; }
.kpr-cta .kpr-call:hover { border-color: #fff; }

/* ---- responsive ---- */
@media (max-width: 991px) {
  .kpr-intro, .kpr-ladder { grid-template-columns: 1fr; }
  .kpr-plans { grid-template-columns: 1fr; max-width: 520px; }
  .kpr-plan-top { order: -1; }
}
@media (max-width: 700px) {
  .kpr-wrap { padding: 0 16px; }
  .kpr-sec { margin-top: 40px; }
  /* the table becomes one compact card per girl - no sideways scrolling */
  .kpr-tbl { border: 0; background: transparent; box-shadow: none; }
  .kpr-tbl thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .kpr-tbl table, .kpr-tbl tbody { display: block; }
  .kpr-tbl tbody tr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 0 10px; border: 1px solid var(--kc-line);
    border-radius: 14px; background: var(--kc-panel); overflow: hidden; }
  .kpr-tbl tbody tr[hidden] { display: none; }
  .kpr-tbl tbody th { grid-column: 1 / -1; padding: 12px 14px 8px; border-bottom: 0; }
  .kpr-tbl tbody td { padding: 8px 6px 12px; border-bottom: 0; text-align: center; font-size: 14px; }
  .kpr-tbl tbody td::before { content: attr(data-l); display: block; margin-bottom: 2px; font-size: 10.5px; font-weight: 800; letter-spacing: .06em;
    text-transform: uppercase; color: var(--kc-txt-2); }
  .kpr-tbl tbody td.kpr-1h { color: var(--kc-rose-deep); }
  .kpr-tbl tbody tr:hover th, .kpr-tbl tbody tr:hover td { background: transparent; }
  /* table is a flex column on phones so the caption can sit AFTER the cards (a block table puts it first) */
  .kpr-tbl table { display: flex; flex-direction: column; }
  .kpr-tbl caption { display: block; order: 2; padding: 4px 2px 0; }
  .kpr-steps li { grid-template-columns: 96px minmax(0, 1fr) auto; gap: 10px; padding: 11px 12px; }
  .kpr-cta { padding: 22px 18px; }
  .kpr-cta .kpr-btns { width: 100%; flex-direction: column; }
  .kpr-cta .kpr-wa, .kpr-cta .kpr-call { flex: 1 1 auto; width: 100%; white-space: nowrap; }
}
@media (max-width: 380px) {
  .kpr-btns { grid-template-columns: 1fr; }
  .kpr-tbl tbody td { font-size: 13px; padding-left: 3px; padding-right: 3px; }
}