/* Restore the approved brand / illustration composition without changing card data. */
html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .credit-card__header {
  display:grid;grid-template-columns:minmax(0,1fr) 104px;
  grid-template-areas:"brand art" "proof art";align-items:center;align-content:center;
  gap:12px 14px;min-height:150px;padding:0;margin:0 0 22px;
}
html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .credit-card__header .brand {
  grid-area:brand;display:flex;align-items:center;min-width:0;gap:12px;
}
html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .brand__logo {
  width:44px;height:44px;flex:0 0 44px;border-radius:14px;
}
html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .brand__text {
  min-width:0;
}
html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .brand__text h3 {
  font-size:clamp(18px,1.5vw,23px);line-height:1.22;letter-spacing:-.5px;
  overflow-wrap:break-word;word-break:normal;margin:0;
}
html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .card-proof {
  grid-area:proof;justify-self:start;max-width:100%;width:auto;margin:0;padding:0;
}
html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .license-pill {
  font-size:12px;padding:7px 10px;white-space:normal;
}
html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .bank-loan-art {
  grid-area:art;position:static;inset:auto;display:block;align-self:center;justify-self:end;
  width:104px;height:120px;margin:0;object-fit:contain;transform:none;filter:none;box-shadow:none;
}
html body .rf-page .rf-card .metrics {align-items:stretch;gap:12px;grid-auto-rows:minmax(146px,auto)}
html body .rf-page .rf-card .metric {align-items:flex-start;justify-content:flex-start;padding:18px 16px}
html body .rf-page .rf-card .metric__body {width:100%;min-width:0;display:flex;flex-direction:column;gap:12px}
html body .rf-page .rf-card .metric__label {font-size:13px;line-height:1.5;min-height:20px}
html body .rf-page .rf-card .rf-metric {font-size:18px;line-height:1.4;letter-spacing:-.35px;overflow-wrap:break-word}
html body .cc-offer h3 {min-width:0;overflow-wrap:anywhere;word-break:normal}
html body #credit-card-offers .bank-premium.cc-refined .cc-refined-name h3 {overflow-wrap:anywhere;word-break:normal}
html body #rko-offers .bank-premium .rk-metric strong {white-space:normal;overflow-wrap:anywhere}
html body a:is(.mfo-card__cta,.cc-button--primary)>svg,
html body .rko-offer__actions a>.rk-icon {display:none!important}
/* Native disclosure remains keyboard- and no-JS-compatible, without browser triangles. */
html body .credit-card .offer-details>summary {
  display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none;
  padding:16px 18px;min-height:54px;box-sizing:border-box;border:1px solid #c7d9f5;
  border-radius:15px;background:linear-gradient(135deg,#f4f8ff,#fff);color:#0758da;
  font-size:14px;font-weight:750;line-height:1.45;cursor:pointer;
}
html body .credit-card .offer-details>summary::-webkit-details-marker {display:none}
html body .credit-card .offer-details>summary::marker {content:""}
html body .credit-card .offer-details>summary::after {
  content:"+";display:grid;place-items:center;flex:0 0 26px;width:26px;height:26px;
  border:1px solid #b8d1fa;border-radius:9px;background:#eaf2ff;color:#0758da;
  font-size:22px;font-weight:500;line-height:1;transform:none;
}
html body .credit-card .offer-details[open]>summary::after {content:"−"}
html body .credit-card .offer-details>summary:hover {border-color:#7aa8f0;background:#edf4ff}
html body .credit-card .offer-details>summary:focus-visible {outline:3px solid #2d79ff;outline-offset:4px}
html body .credit-card .offer-details[open]>.offer-details-body {padding:22px 0 0}
html[data-theme="dark"] body .credit-card .offer-details>summary {
  background:linear-gradient(135deg,#102844,#0d2038);color:#b8d7ff;border-color:#34547c;
}
html[data-theme="dark"] body .credit-card .offer-details>summary::after {background:#17385c;border-color:#416b9f;color:#c3ddff}
html[data-theme="dark"] body .credit-card .offer-details>summary:hover {background:#173455;border-color:#79aff5}
@media(max-width:1100px){
  html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .brand__text h3 {font-size:21px}
}
@media(max-width:430px){
  html body #rko-offers .bank-premium .rko-offer__actions {display:grid;grid-template-columns:1fr;gap:12px}
  html body #rko-offers .bank-premium .rko-offer__actions>* {width:100%;min-width:0;min-height:48px;white-space:normal;box-sizing:border-box}
  html body #rko-offers .bank-premium .rk-head {grid-template-columns:minmax(0,1fr) 80px;gap:12px}
  html body #rko-offers .bank-premium .rk-art {width:80px;height:88px;object-fit:contain}
  html body #rko-offers .bank-premium .rk-brand {min-width:0;gap:10px}
  html body #rko-offers .bank-premium .rk-mark {width:40px;height:40px;flex:0 0 40px}
  html body #rko-offers .bank-premium .rk-name h3 {font-size:20px;overflow-wrap:anywhere}
  html body #rko-offers .bank-premium .rk-price strong {font-size:30px;white-space:normal;overflow-wrap:anywhere}
  html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .credit-card__header {
    grid-template-columns:minmax(0,1fr) 90px;grid-template-areas:"brand brand" "proof art";
    min-height:150px;gap:12px;margin-bottom:20px;
  }
  html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .bank-loan-art {width:90px;height:88px}
  html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .brand__text h3 {font-size:21px}
  html body .rf-page .rf-card .rf-metric {font-size:18px}
  html body .rf-page .rf-card .metric {padding:16px 12px}
}
@media(max-width:360px){
  html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .brand__text h3 {font-size:19px}
  html body :is(.credit-page,.rf-page) .credit-card[data-bank-art] .brand__logo {width:38px;height:38px;flex-basis:38px}
  html body .rf-page .rf-card .metrics {grid-template-columns:1fr;grid-auto-rows:auto}
  html body .rf-page .rf-card .rf-metric {font-size:20px}
  html body .credit-card .offer-details>summary {padding:14px 12px;font-size:13px}
}
