/*
 * Public module: /tra-gop
 * Scope: [data-cost-ui="v2"] only. No Admin selectors and no global overrides.
 */
.cost-loan-page[data-cost-ui="v2"]{
  --cost-red:#e60012;
  --cost-red-dark:#b70713;
  --cost-ink:#171a1f;
  --cost-muted:#68727d;
  --cost-line:#e1e5e9;
  --cost-surface:#fff;
  --cost-soft:#f5f6f8;
  --cost-shadow:0 18px 55px rgba(18,25,33,.09);
  min-height:100vh;
  overflow-x:clip;
  background:
    radial-gradient(circle at 8% 0%,rgba(230,0,18,.07),transparent 30%),
    linear-gradient(180deg,#fafafa 0%,#f1f3f5 52%,#f7f8f9 100%);
  color:var(--cost-ink);
}

.cost-loan-page[data-cost-ui="v2"] .mmv-section{
  width:min(1240px,calc(100% - 40px));
  margin-inline:auto;
}

.cost-loan-page[data-cost-ui="v2"] .cost-loan-hero{
  display:block;
  padding-top:54px;
  padding-bottom:30px;
}


.cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-copy{max-width:860px}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-copy>p{
  margin:0 0 10px;
  color:var(--cost-red);
  font-size:12px;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-copy h1{
  margin:0;
  color:#14171b;
  font-size:clamp(36px,4.6vw,62px);
  font-weight:950;
  line-height:.98;
  letter-spacing:-.045em;
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-copy>span{
  display:block;
  max-width:720px;
  margin-top:17px;
  color:var(--cost-muted);
  font-size:16px;
  line-height:1.65;
}

.cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-points{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:20px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-points span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:32px;
  padding:6px 11px;
  border:1px solid #dfe3e7;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  color:#4e5862;
  font-size:12px;
  font-weight:800;
  box-shadow:0 5px 16px rgba(17,24,39,.04);
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-points span:before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--cost-red);
  box-shadow:0 0 0 4px rgba(230,0,18,.08);
}


.cost-loan-page[data-cost-ui="v2"] .cost-loan-workspace{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(410px,.98fr);
  gap:24px;
  align-items:start;
  padding-top:24px;
  padding-bottom:72px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-card{
  min-width:0;
  border:1px solid var(--cost-line);
  border-radius:24px;
  background:var(--cost-surface);
  box-shadow:var(--cost-shadow);
  overflow:hidden;
}

.cost-loan-page[data-cost-ui="v2"] .cost-loan-form-v30{
  display:grid;
  gap:22px;
  padding:26px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-card-heading{
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}
.cost-loan-page[data-cost-ui="v2"] .cost-card-heading>span{
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  flex:0 0 40px;
  border-radius:13px;
  background:var(--cost-ink);
  color:#fff;
  font-size:13px;
  font-weight:950;
  box-shadow:inset 0 -2px 0 rgba(255,255,255,.07);
}
.cost-loan-page[data-cost-ui="v2"] .cost-card-heading>div{min-width:0}
.cost-loan-page[data-cost-ui="v2"] .cost-card-heading small{
  display:block;
  margin-bottom:3px;
  color:#88919a;
  font-size:10px;
  font-weight:850;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.cost-loan-page[data-cost-ui="v2"] .cost-card-heading h2{
  margin:0;
  color:#1a1e23;
  font-size:20px;
  line-height:1.25;
}
.cost-loan-page[data-cost-ui="v2"] .cost-card-heading-small{
  padding-top:4px;
  border-top:1px solid #edf0f2;
}
.cost-loan-page[data-cost-ui="v2"] .cost-card-heading-small>span{
  margin-top:17px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-card-heading-small>div{
  margin-top:17px;
}

.cost-loan-page[data-cost-ui="v2"] .cost-context-strip{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-context-strip>div{
  display:grid;
  gap:5px;
  min-width:0;
  padding:13px 14px;
  border:1px solid #e5e8eb;
  border-radius:15px;
  background:#f8f9fa;
}
.cost-loan-page[data-cost-ui="v2"] .cost-context-strip span{
  color:#7d8790;
  font-size:10px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.cost-loan-page[data-cost-ui="v2"] .cost-context-strip strong{
  color:#1b2025;
  font-size:14px;
  font-weight:900;
  line-height:1.3;
}
.cost-loan-page[data-cost-ui="v2"] .cost-context-strip>div:last-child strong{color:var(--cost-red)}

.cost-loan-page[data-cost-ui="v2"] .cost-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-form-grid .span-2{grid-column:1/-1}
.cost-loan-page[data-cost-ui="v2"] .cost-form-grid label{
  display:grid;
  gap:7px;
  min-width:0;
  color:#47515b;
  font-size:11px;
  font-weight:900;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.cost-loan-page[data-cost-ui="v2"] .cost-form-grid input,
.cost-loan-page[data-cost-ui="v2"] .cost-form-grid select{
  width:100%;
  min-width:0;
  min-height:51px;
  border:1px solid #d8dde2;
  border-radius:13px;
  background:#fff;
  padding:0 14px;
  color:#171b20;
  font-size:15px;
  font-weight:750;
  outline:none;
  box-shadow:0 1px 0 rgba(17,24,39,.02);
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.cost-loan-page[data-cost-ui="v2"] .cost-form-grid input:hover,
.cost-loan-page[data-cost-ui="v2"] .cost-form-grid select:hover{border-color:#bfc6cd}
.cost-loan-page[data-cost-ui="v2"] .cost-form-grid input:focus,
.cost-loan-page[data-cost-ui="v2"] .cost-form-grid select:focus{
  border-color:var(--cost-red);
  box-shadow:0 0 0 4px rgba(230,0,18,.08);
}
.cost-loan-page[data-cost-ui="v2"] .cost-primary-select select{
  min-height:56px;
  border-color:#cfd5da;
  background:linear-gradient(180deg,#fff,#fbfbfc);
  font-size:16px;
  font-weight:850;
}
.cost-loan-page[data-cost-ui="v2"] .cost-registration-grid-v38{
  display:grid;
  grid-template-columns:1.35fr .9fr 1fr;
  gap:12px;
  padding:15px;
  border:1px solid #e5e8eb;
  border-radius:17px;
  background:#f7f8fa;
}
.cost-loan-page[data-cost-ui="v2"] .cost-registration-grid-v38 select{background:#fff}

.cost-loan-page[data-cost-ui="v2"] .cost-loan-toggle-card{padding:0}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch{
  position:relative;
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  gap:14px;
  align-items:center;
  padding:16px;
  border:1px solid #dfe3e7;
  border-radius:17px;
  background:linear-gradient(180deg,#fbfbfc,#f6f7f8);
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch:hover{
  border-color:#c9cfd5;
  box-shadow:0 8px 22px rgba(16,24,32,.05);
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch input[data-public-loan-enabled]{
  position:absolute;
  inset:0;
  z-index:5;
  width:100%;
  height:100%;
  margin:0;
  opacity:0;
  cursor:pointer;
  pointer-events:auto;
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch>span{
  position:relative;
  width:52px;
  height:29px;
  border-radius:999px;
  background:#b8c0c8;
  transition:background .2s ease;
  pointer-events:none;
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch>span:after{
  content:"";
  position:absolute;
  top:4px;
  left:4px;
  width:21px;
  height:21px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 7px rgba(0,0,0,.2);
  transition:transform .2s ease;
}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch input:checked+span{background:var(--cost-red)}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch input:checked+span:after{transform:translateX(23px)}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch>div{display:grid;gap:3px;min-width:0;pointer-events:none}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch strong{color:#1d2227;font-size:14px;font-weight:900}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-switch small{color:#77818b;font-size:11px;line-height:1.45}
.cost-loan-page[data-cost-ui="v2"] [data-public-loan-fields][hidden],
.cost-loan-page[data-cost-ui="v2"] [data-public-loan-ratio][hidden],
.cost-loan-page[data-cost-ui="v2"] [data-public-loan-custom][hidden]{display:none!important}
.cost-loan-page[data-cost-ui="v2"] .cost-loan-fields-v30{display:grid;gap:18px}
.cost-loan-page[data-cost-ui="v2"] .cost-form-note{
  margin:0;
  padding:12px 14px;
  border-radius:13px;
  background:#fff8e9;
  color:#77613c;
  font-size:11px;
  line-height:1.55;
}

.cost-loan-page[data-cost-ui="v2"] .cost-result-panel-v30{
  position:sticky;
  top:18px;
  display:grid;
  gap:16px;
  padding:22px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-heading-v38{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-vehicle{min-width:0}
.cost-loan-page[data-cost-ui="v2"] .cost-result-vehicle>span{
  color:var(--cost-red);
  font-size:10px;
  font-weight:950;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-vehicle h2{
  margin:5px 0 0;
  color:#171b20;
  font-size:21px;
  line-height:1.3;
  overflow-wrap:anywhere;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-policy-badge-v38{
  flex:0 0 auto;
  padding:7px 9px;
  border:1px solid #dfe4e7;
  border-radius:999px;
  background:#f7f8f9;
  color:#69737d;
  font-size:9px;
  font-weight:850;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.cost-loan-page[data-cost-ui="v2"] .cost-total-hero{
  position:relative;
  display:grid;
  gap:6px;
  padding:21px 22px 22px 25px;
  border-radius:19px;
  overflow:hidden;
  background:linear-gradient(145deg,#20242a 0%,#101216 72%);
  color:#fff;
  box-shadow:0 18px 35px rgba(15,18,21,.16);
}
.cost-loan-page[data-cost-ui="v2"] .cost-total-hero:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:5px;
  background:var(--cost-red);
}
.cost-loan-page[data-cost-ui="v2"] .cost-total-hero small{
  color:#c2c8cf;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
}
.cost-loan-page[data-cost-ui="v2"] .cost-total-hero strong{
  color:#fff;
  font-size:clamp(29px,3.3vw,43px);
  font-weight:950;
  line-height:1.08;
  letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;
}
.cost-loan-page[data-cost-ui="v2"] .cost-total-hero>span{color:#aeb6bf;font-size:10px;line-height:1.45}

.cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30 article{
  display:grid;
  gap:5px;
  min-width:0;
  padding:13px 14px;
  border:1px solid #e3e7ea;
  border-radius:14px;
  background:#f9fafb;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30 article.is-discount{
  border-color:#f1d4d6;
  background:#fff7f7;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30 article.is-fee{
  border-color:#dce4ec;
  background:#f5f8fb;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30 small{
  color:#7a848d;
  font-size:10px;
  font-weight:800;
  line-height:1.35;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30 strong{
  color:#1a1f24;
  font-size:15px;
  font-weight:950;
  line-height:1.3;
  font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30 article.is-discount strong{color:var(--cost-red)}

.cost-loan-page[data-cost-ui="v2"] .cost-loan-result-section{
  display:grid;
  gap:10px;
  padding-top:3px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-section-title-v38{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-section-title-v38>span{
  color:#20262c;
  font-size:12px;
  font-weight:950;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-section-title-v38>small{
  color:#7d8790;
  font-size:10px;
  font-weight:800;
}
.cost-loan-page[data-cost-ui="v2"] .cost-result-loan-grid-v38 article{background:#fff}
.cost-loan-page[data-cost-ui="v2"] .cost-result-note{
  margin:0;
  padding-top:2px;
  color:#838c95;
  font-size:10px;
  line-height:1.5;
}

@media(max-width:1024px){
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero{
    padding-top:40px;
  }
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-workspace{grid-template-columns:1fr}
  .cost-loan-page[data-cost-ui="v2"] .cost-result-panel-v30{position:static}
}

@media(max-width:700px){
  .cost-loan-page[data-cost-ui="v2"] .mmv-section{width:min(100% - 24px,1240px)}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero{
    padding-top:28px;
    padding-bottom:20px;
  }
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-copy h1{font-size:36px;line-height:1.02}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-copy>span{margin-top:13px;font-size:14px;line-height:1.55}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-points{margin-top:14px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-points span{font-size:10px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-workspace{gap:14px;padding-top:18px;padding-bottom:48px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-card{border-radius:18px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-form-v30,
  .cost-loan-page[data-cost-ui="v2"] .cost-result-panel-v30{padding:17px}
  .cost-loan-page[data-cost-ui="v2"] .cost-card-heading>span{width:36px;height:36px;flex-basis:36px;border-radius:11px}
  .cost-loan-page[data-cost-ui="v2"] .cost-card-heading h2{font-size:17px}
  .cost-loan-page[data-cost-ui="v2"] .cost-context-strip{grid-template-columns:1fr}
  .cost-loan-page[data-cost-ui="v2"] .cost-form-grid{grid-template-columns:1fr;gap:12px}
  .cost-loan-page[data-cost-ui="v2"] .cost-form-grid .span-2{grid-column:auto}
  .cost-loan-page[data-cost-ui="v2"] .cost-registration-grid-v38{grid-template-columns:1fr;padding:12px}
  .cost-loan-page[data-cost-ui="v2"] .cost-form-grid input,
  .cost-loan-page[data-cost-ui="v2"] .cost-form-grid select{min-height:49px;font-size:16px}
  .cost-loan-page[data-cost-ui="v2"] .cost-primary-select select{min-height:53px;font-size:16px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-switch{grid-template-columns:48px minmax(0,1fr);gap:12px;padding:14px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-switch>span{width:48px;height:28px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-switch>span:after{width:20px;height:20px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-switch input:checked+span:after{transform:translateX(20px)}
  .cost-loan-page[data-cost-ui="v2"] .cost-result-heading-v38{display:grid}
  .cost-loan-page[data-cost-ui="v2"] .cost-result-policy-badge-v38{justify-self:start}
  .cost-loan-page[data-cost-ui="v2"] .cost-total-hero{padding:18px 18px 19px 21px}
  .cost-loan-page[data-cost-ui="v2"] .cost-total-hero strong{font-size:31px}
  .cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30{grid-template-columns:1fr 1fr}
  .cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30 article{padding:12px}
  .cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30 strong{font-size:14px}
}

@media(max-width:420px){
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-copy h1{font-size:32px}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-points{display:grid;grid-template-columns:1fr 1fr}
  .cost-loan-page[data-cost-ui="v2"] .cost-loan-hero-points span:last-child{grid-column:1/-1}
  .cost-loan-page[data-cost-ui="v2"] .cost-result-grid-v30{grid-template-columns:1fr}
  .cost-loan-page[data-cost-ui="v2"] .cost-result-section-title-v38{align-items:flex-start;flex-direction:column;gap:3px}
}