/* =========================================================
   KYRIOS — páginas de tienda (categoría / producto / carrito / checkout)
   Misma escala rem que styles.css
   ========================================================= */

/* ---------- comunes ---------- */
.cart-badge {
  position: absolute;
  top: -0.9rem;
  right: -1.1rem;
  background: var(--negro);
  color: #fff;
  font-size: 1.2rem;
  font-weight: 700;
  min-width: 2.1rem;
  height: 2.1rem;
  border-radius: 50%;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0 .4rem;
}
.navbar__icon { position: relative; }

.btn-black {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--negro);
  color: #fff;
  font-size: 1.94rem;
  font-weight: 500;
  height: 5.4rem;
  border-radius: .6rem;
  letter-spacing: .04em;
  transition: opacity .15s;
  border: none;
  cursor: pointer;
  font-family: inherit;
}
.btn-black:hover { opacity: .85; }
.btn-block { width: 100%; }
.btn-outline {
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--negro);
  border: 1px solid var(--negro);
  font-size: 1.94rem;
  font-weight: 500;
  height: 5.4rem;
  border-radius: .6rem;
  cursor: pointer;
  font-family: inherit;
}
.btn-outline:hover { background: var(--negro); color: #fff; }

/* banda de título de página */
.page-hero {
  background: var(--gris-1);
  padding: 6rem 18.38rem 6rem;
}
.page-hero .crumbs {
  font-size: 1.5rem;
  font-weight: 500;
  color: #6d6d6d;
  margin-bottom: 2.6rem;
}
.page-hero .crumbs a:hover { color: var(--negro); text-decoration: underline; }
.page-hero .crumbs span { color: var(--negro); }
.page-hero__title {
  font-size: 4.87rem;
  font-weight: 500;
  font-style: italic;
  margin-top: 1.4rem;
}

/* toast */
.toast {
  position: fixed;
  left: 50%;
  bottom: 4rem;
  transform: translate(-50%, 15rem);
  background: var(--negro);
  color: #fff;
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding: 1.7rem 2.8rem;
  border-radius: .8rem;
  font-size: 1.8rem;
  font-weight: 500;
  z-index: 300;
  transition: transform .3s ease;
  box-shadow: 0 1rem 3rem rgba(0,0,0,.3);
  white-space: nowrap;
}
.toast.show { transform: translate(-50%, 0); }
.toast__check {
  background: #fff;
  color: var(--negro);
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  font-weight: 700;
  flex: none;
}
.toast__link { color: #fff; text-decoration: underline; font-weight: 700; }

/* ---------- CATEGORÍA ---------- */
.cat-wrap {
  background: var(--gris-2);
  padding: 5.5rem 18.38rem 10rem;
  display: flex;
  gap: 5rem;
  align-items: flex-start;
}
.cat-side {
  width: 28rem;
  flex: none;
  background: #fff;
  padding: 3.4rem 3rem 4rem;
  border-radius: .8rem;
}
.cat-side h4 {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: .08em;
  margin-bottom: 2rem;
}
.cat-side .fgroup { margin-bottom: 4rem; }
.cat-side .fgroup:last-child { margin-bottom: 0; }
.cat-side a {
  display: block;
  font-size: 1.8rem;
  font-weight: 500;
  color: #555;
  padding: .8rem 0;
  cursor: pointer;
}
.cat-side a:hover { color: var(--negro); }
.cat-side a.active { color: var(--negro); font-weight: 700; }
.cat-side a.active::before { content: '— '; }

.cat-main { flex: 1; }
.cat-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 3.4rem;
}
.cat-toolbar [data-count] { font-size: 1.8rem; font-weight: 500; color: #555; }
.cat-toolbar select {
  font-family: inherit;
  font-size: 1.7rem;
  font-weight: 500;
  color: var(--negro);
  background: #fff;
  border: 1px solid var(--gris-1);
  border-radius: .6rem;
  padding: 1.1rem 1.8rem;
  outline: none;
  cursor: pointer;
}

.cat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4.32rem;
}
.cat-grid .card {
  width: auto;
  height: auto;
  border-radius: .4rem;
  transition: box-shadow .2s, transform .2s;
}
.cat-grid .card:hover {
  box-shadow: 0 1.4rem 3.4rem rgba(0,0,0,.1);
  transform: translateY(-.4rem);
}
.cat-grid .card__img { height: 38rem; }
.cat-grid .card__body { padding: 2.2rem 2rem 3rem; }
.cat-grid .card__buy {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--negro);
  color: #fff;
  font-size: 1.6rem;
  font-weight: 500;
  width: 18rem;
  height: 4.2rem;
  margin: 2rem auto 0;
  border-radius: .4rem;
}
.empty-msg { font-size: 2rem; font-weight: 500; padding: 6rem 0; grid-column: 1 / -1; text-align: center; }

/* ---------- PRODUCTO ---------- */
.pdp {
  background: #fff;
  padding: 5.5rem 18.38rem 9rem;
  display: flex;
  gap: 7rem;
  align-items: flex-start;
}
.pdp__gallery { width: 76rem; flex: none; }
.pdp__main {
  background: var(--gris-2);
  border-radius: .8rem;
  overflow: hidden;
  height: 76rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pdp__main img { width: 100%; height: 100%; object-fit: cover; }
.pdp__thumbs { display: flex; gap: 1.8rem; margin-top: 1.8rem; }
.pdp__thumb {
  width: 12.6rem;
  height: 12.6rem;
  border-radius: .6rem;
  overflow: hidden;
  border: .2rem solid transparent;
  padding: 0;
  background: var(--gris-2);
  flex: none;
}
.pdp__thumb img { width: 100%; height: 100%; object-fit: cover; }
.pdp__thumb.active { border-color: var(--negro); }

.pdp__info { flex: 1; padding-top: 1rem; }
.pdp__brand {
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: .12em;
  color: var(--gris-texto);
}
.pdp__name {
  font-size: 3.6rem;
  font-weight: 700;
  line-height: 1.15;
  margin-top: 1.2rem;
}
.pdp__price {
  font-size: 3.4rem;
  font-weight: 700;
  margin-top: 2.2rem;
}
.pdp__desc {
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 1.65;
  color: #444;
  margin-top: 2.6rem;
  padding-top: 2.6rem;
  border-top: 1px solid var(--gris-1);
}
.pdp__label {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: .06em;
  margin: 3.2rem 0 1.4rem;
}
.pdp__sizes { display: flex; gap: 1.2rem; flex-wrap: wrap; }
.pdp__size {
  min-width: 5.4rem;
  height: 4.6rem;
  padding: 0 1.6rem;
  border: 1px solid var(--gris-1);
  border-radius: .6rem;
  background: #fff;
  font-family: inherit;
  font-size: 1.7rem;
  font-weight: 500;
  cursor: pointer;
}
.pdp__size.active { background: var(--negro); color: #fff; border-color: var(--negro); }

.pdp__actions { display: flex; gap: 2rem; margin-top: 3.6rem; align-items: stretch; }
.pdp__qty {
  display: flex;
  align-items: center;
  border: 1px solid var(--gris-1);
  border-radius: .6rem;
  height: 5.4rem;
}
.pdp__qty button {
  width: 4.6rem;
  height: 100%;
  font-size: 2.4rem;
  font-weight: 500;
  color: var(--negro);
}
.pdp__qty span { min-width: 3.6rem; text-align: center; font-size: 1.9rem; font-weight: 700; }
.pdp__actions .btn-black { flex: 1; }
.pdp__buynow { margin-top: 1.6rem; }

.pdp__trust {
  margin-top: 4rem;
  border-top: 1px solid var(--gris-1);
  padding-top: 2.8rem;
  display: grid;
  gap: 1.6rem;
}
.pdp__trust div { display: flex; align-items: center; gap: 1.4rem; font-size: 1.6rem; font-weight: 500; color: #444; }
.pdp__trust svg { width: 2.4rem; height: 2.4rem; fill: none; stroke: var(--negro); stroke-width: 1.6; flex: none; }

.related {
  background: var(--gris-2);
  padding: 7rem 18.38rem 9rem;
}
.related h2 { font-size: 3.4rem; font-weight: 700; text-align: center; }
.related__grid {
  margin-top: 4.4rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4.32rem;
}
.related__grid .card { width: auto; height: auto; }
.related__grid .card__img { height: 40rem; }
.related__grid .card__body { padding: 2.2rem 2rem 3rem; }
.related__grid .card__buy { display: none; }

/* ---------- CARRITO ---------- */
.cart-page {
  background: var(--gris-2);
  padding: 5.5rem 18.38rem 10rem;
  min-height: 50rem;
}
.cart-page h1 { font-size: 4.87rem; font-weight: 700; margin-bottom: 4.4rem; }
.cart-cols { display: flex; gap: 5rem; align-items: flex-start; }
.cart-list { flex: 1; display: grid; gap: 2rem; }

.cline {
  background: #fff;
  border-radius: .8rem;
  padding: 2.4rem 3rem;
  display: flex;
  align-items: center;
  gap: 2.8rem;
}
.cline__img {
  width: 11rem;
  height: 11rem;
  border-radius: .6rem;
  overflow: hidden;
  background: var(--gris-2);
  flex: none;
}
.cline__img img { width: 100%; height: 100%; object-fit: cover; }
.cline__info { flex: 1; display: grid; gap: .5rem; }
.cline__name { font-size: 1.9rem; font-weight: 700; }
.cline__name:hover { text-decoration: underline; }
.cline__meta { font-size: 1.4rem; font-weight: 500; color: var(--gris-texto); letter-spacing: .05em; }
.cline__unit { font-size: 1.6rem; font-weight: 500; color: #555; }
.cline__qty {
  display: flex;
  align-items: center;
  border: 1px solid var(--gris-1);
  border-radius: .6rem;
  height: 4.4rem;
}
.cline__qty button { width: 4rem; height: 100%; font-size: 2rem; }
.cline__qty span { min-width: 3.4rem; text-align: center; font-size: 1.7rem; font-weight: 700; }
.cline__total { font-size: 2.1rem; font-weight: 700; min-width: 14rem; text-align: right; }
.cline__del {
  font-size: 2.6rem;
  color: #999;
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  flex: none;
}
.cline__del:hover { background: var(--gris-2); color: var(--negro); }

.cart-summary, .co-summary {
  width: 42rem;
  flex: none;
  background: #fff;
  border-radius: .8rem;
  padding: 3.4rem 3.4rem 4rem;
}
.cart-summary h3, .co-summary h3 { font-size: 2.4rem; font-weight: 700; margin-bottom: 2.6rem; }
.srow {
  display: flex;
  justify-content: space-between;
  font-size: 1.8rem;
  font-weight: 500;
  padding: 1.1rem 0;
  color: #444;
}
.srow--total {
  border-top: 1px solid var(--gris-1);
  margin-top: 1.4rem;
  padding-top: 2rem;
  font-size: 2.3rem;
  font-weight: 700;
  color: var(--negro);
}
.ship-hint { font-size: 1.4rem; color: var(--gris-texto); font-weight: 500; }
.cart-summary .btn-black { margin-top: 2.8rem; }
.link-back {
  display: block;
  text-align: center;
  font-size: 1.6rem;
  font-weight: 500;
  margin-top: 2rem;
  color: #555;
}
.link-back:hover { color: var(--negro); text-decoration: underline; }

.cart-empty { text-align: center; padding: 8rem 0 4rem; }
.cart-empty svg { width: 9rem; height: 9rem; fill: none; stroke: var(--negro); stroke-width: 1.2; margin: 0 auto 2.6rem; display: block; }
.cart-empty p { font-size: 2.4rem; font-weight: 700; margin-bottom: 3rem; }
.cart-empty .btn-black { width: 32rem; margin: 0 auto; }

/* ---------- CHECKOUT ---------- */
.co-page {
  background: var(--gris-2);
  padding: 5.5rem 18.38rem 10rem;
}
.co-page h1 { font-size: 4.87rem; font-weight: 700; }
.co-steps {
  display: flex;
  gap: 3.6rem;
  margin: 3rem 0 4.4rem;
}
.co-steps span {
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: .04em;
  display: flex;
  align-items: center;
  gap: 1.1rem;
}
.co-steps i {
  font-style: normal;
  background: var(--negro);
  color: #fff;
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
}
.co-cols { display: flex; gap: 5rem; align-items: flex-start; }
.co-form { flex: 1; display: grid; gap: 2.4rem; }

.co-block {
  background: #fff;
  border-radius: .8rem;
  padding: 3.4rem 3.8rem 4rem;
}
.co-block h2 { font-size: 2.2rem; font-weight: 700; margin-bottom: 2.6rem; }
.frow { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-bottom: 2rem; }
.frow--1 { grid-template-columns: 1fr; }
.field label {
  display: block;
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: .05em;
  margin-bottom: .8rem;
}
.field input, .field select {
  width: 100%;
  height: 5rem;
  border: 1px solid var(--gris-1);
  border-radius: .6rem;
  padding: 0 1.7rem;
  font-family: inherit;
  font-size: 1.7rem;
  font-weight: 500;
  color: var(--negro);
  outline: none;
  background: #fff;
}
.field input:focus, .field select:focus { border-color: var(--negro); }

.radio-card {
  display: flex;
  align-items: center;
  gap: 1.8rem;
  border: 1px solid var(--gris-1);
  border-radius: .8rem;
  padding: 2rem 2.4rem;
  cursor: pointer;
  margin-bottom: 1.6rem;
  transition: border-color .15s;
}
.radio-card:has(input:checked) { border-color: var(--negro); background: #fafafa; }
.radio-card input { accent-color: var(--negro); width: 2rem; height: 2rem; flex: none; }
.radio-card b { font-size: 1.8rem; font-weight: 700; display: block; }
.radio-card small { font-size: 1.5rem; font-weight: 500; color: #666; display: block; margin-top: .3rem; }

.transfer-info {
  background: var(--gris-2);
  border-radius: .6rem;
  padding: 2rem 2.4rem;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.7;
  color: #444;
}

.co-summary { position: sticky; top: 3rem; }
.mini {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--gris-2);
}
.mini img { width: 6.4rem; height: 6.4rem; border-radius: .5rem; object-fit: cover; background: var(--gris-2); flex: none; }
.mini > div { flex: 1; display: grid; gap: .3rem; }
.mini__name { font-size: 1.5rem; font-weight: 700; line-height: 1.25; }
.mini__meta { font-size: 1.3rem; font-weight: 500; color: var(--gris-texto); }
.mini__price { font-size: 1.6rem; font-weight: 700; white-space: nowrap; }
.co-summary .srow:first-of-type { margin-top: 1.8rem; }
.co-summary .btn-black { margin-top: 2.6rem; }

/* success */
.success {
  position: fixed;
  inset: 0;
  background: rgba(17,17,17,.92);
  z-index: 400;
  display: none;
  align-items: center;
  justify-content: center;
}
.success.show { display: flex; }
.success__box {
  background: #fff;
  border-radius: 1.2rem;
  width: 62rem;
  max-width: 90vw;
  padding: 6.5rem 6rem;
  text-align: center;
}
.success__check {
  width: 8.4rem;
  height: 8.4rem;
  border-radius: 50%;
  background: var(--negro);
  color: #fff;
  font-size: 3.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 3rem;
}
.success__box h2 { font-size: 3.2rem; font-weight: 700; }
.success__box p { font-size: 1.8rem; font-weight: 500; color: #555; margin-top: 1.6rem; line-height: 1.6; }
.success__box p b { color: var(--negro); }
.success__box .btn-black { width: 30rem; margin: 3.6rem auto 0; }

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 767px) {
  .cart-badge {
    font-size: 2.2rem;
    min-width: 3.8rem;
    height: 3.8rem;
    top: -1.4rem;
    right: -1.8rem;
  }

  .btn-black, .btn-outline { font-size: 3.1rem; height: 9.6rem; border-radius: 1rem; }

  .page-hero { padding: 7rem 6.62rem; }
  .page-hero .crumbs { font-size: 2.6rem; margin-bottom: 3.4rem; }
  .page-hero__title { font-size: 5.6rem; }
  .chip--sm { white-space: nowrap; }

  .toast {
    font-size: 3rem;
    padding: 2.8rem 4rem;
    border-radius: 1.2rem;
    gap: 2.2rem;
    bottom: 6rem;
    max-width: 92vw;
    white-space: normal;
  }
  .toast__check { width: 4.4rem; height: 4.4rem; font-size: 2.6rem; }

  /* categoría */
  .cat-wrap { flex-direction: column; padding: 6rem 6.62rem 12rem; gap: 5rem; }
  .cat-side { width: 100%; padding: 4.6rem 4.6rem 5rem; border-radius: 1.2rem; }
  .cat-side h4 { font-size: 2.9rem; margin-bottom: 2.6rem; }
  .cat-side .fgroup { margin-bottom: 5rem; }
  .cat-side a { font-size: 3.2rem; padding: 1.4rem 0; }
  .cat-main { width: 100%; }
  .cat-toolbar { margin-bottom: 4.6rem; }
  .cat-toolbar [data-count] { font-size: 3rem; }
  .cat-toolbar select { font-size: 3rem; padding: 2rem 2.8rem; border-radius: 1rem; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); gap: 3.96rem; }
  .cat-grid .card__img { height: 44rem; }
  .cat-grid .card__body { padding: 3rem 2.4rem 4rem; }
  .cat-grid .card__buy { font-size: 2.47rem; width: 26rem; height: 7rem; margin-top: 2.8rem; border-radius: .8rem; }
  .empty-msg { font-size: 3.4rem; }

  /* producto */
  .pdp { flex-direction: column; padding: 6rem 6.62rem 10rem; gap: 6rem; }
  .pdp__gallery { width: 100%; }
  .pdp__main { height: 96rem; border-radius: 1.2rem; }
  .pdp__thumbs { gap: 2.4rem; margin-top: 2.4rem; }
  .pdp__thumb { width: 20rem; height: 20rem; border-radius: 1rem; border-width: .4rem; }
  .pdp__info { width: 100%; padding-top: 0; }
  .pdp__brand { font-size: 2.6rem; }
  .pdp__name { font-size: 5.6rem; }
  .pdp__price { font-size: 5.4rem; margin-top: 3rem; }
  .pdp__desc { font-size: 3.2rem; margin-top: 4rem; padding-top: 4rem; }
  .pdp__label { font-size: 2.8rem; margin: 5rem 0 2.4rem; }
  .pdp__sizes { gap: 2rem; }
  .pdp__size { min-width: 9.6rem; height: 8.4rem; font-size: 3.1rem; border-radius: 1rem; padding: 0 2.8rem; }
  .pdp__actions { gap: 2.8rem; margin-top: 5.6rem; }
  .pdp__qty { height: 9.6rem; border-radius: 1rem; }
  .pdp__qty button { width: 8rem; font-size: 4.4rem; }
  .pdp__qty span { min-width: 6rem; font-size: 3.4rem; }
  .pdp__buynow { margin-top: 2.6rem; }
  .pdp__trust { margin-top: 6.4rem; padding-top: 4.6rem; gap: 3rem; }
  .pdp__trust div { font-size: 2.9rem; gap: 2.4rem; }
  .pdp__trust svg { width: 4.4rem; height: 4.4rem; }

  .related { padding: 9rem 6.62rem 11rem; }
  .related h2 { font-size: 5.4rem; }
  .related__grid { grid-template-columns: repeat(2, 1fr); gap: 3.96rem; margin-top: 5.6rem; }
  .related__grid .card:nth-child(3) { display: none; }
  .related__grid .card__img { height: 46rem; }

  /* carrito */
  .cart-page { padding: 7rem 6.62rem 12rem; }
  .cart-page h1 { font-size: 7.17rem; margin-bottom: 5.6rem; }
  .cart-cols { flex-direction: column; gap: 5rem; }
  .cart-list { width: 100%; gap: 3rem; }
  .cline { flex-wrap: wrap; padding: 4rem; gap: 3.4rem; border-radius: 1.2rem; }
  .cline__img { width: 20rem; height: 20rem; border-radius: 1rem; }
  .cline__info { min-width: 50%; }
  .cline__name { font-size: 3.4rem; }
  .cline__meta { font-size: 2.5rem; }
  .cline__unit { font-size: 2.8rem; }
  .cline__qty { height: 8rem; border-radius: 1rem; }
  .cline__qty button { width: 7.4rem; font-size: 3.8rem; }
  .cline__qty span { min-width: 6rem; font-size: 3.2rem; }
  .cline__total { font-size: 3.8rem; min-width: 0; flex: 1; }
  .cline__del { font-size: 4.6rem; width: 6.6rem; height: 6.6rem; }
  .cart-summary, .co-summary { width: 100%; padding: 4.6rem 4.6rem 5.4rem; border-radius: 1.2rem; }
  .cart-summary h3, .co-summary h3 { font-size: 4.2rem; margin-bottom: 3.4rem; }
  .srow { font-size: 3.2rem; padding: 1.8rem 0; }
  .srow--total { font-size: 4rem; padding-top: 3rem; }
  .ship-hint { font-size: 2.5rem; }
  .link-back { font-size: 3rem; margin-top: 3.4rem; }
  .cart-empty svg { width: 16rem; height: 16rem; }
  .cart-empty p { font-size: 4.2rem; }
  .cart-empty .btn-black { width: 58rem; }

  /* checkout */
  .co-page { padding: 7rem 6.62rem 12rem; }
  .co-page h1 { font-size: 7.17rem; }
  .co-steps { gap: 4.4rem; margin: 4rem 0 5.6rem; flex-wrap: wrap; }
  .co-steps span { font-size: 2.9rem; gap: 1.8rem; }
  .co-steps i { width: 5.4rem; height: 5.4rem; font-size: 2.8rem; }
  .co-cols { flex-direction: column; gap: 5rem; }
  .co-form { width: 100%; gap: 3.4rem; }
  .co-block { padding: 4.6rem 4.6rem 5.4rem; border-radius: 1.2rem; }
  .co-block h2 { font-size: 3.9rem; margin-bottom: 3.6rem; }
  .frow { grid-template-columns: 1fr; gap: 3rem; margin-bottom: 3rem; }
  .field label { font-size: 2.6rem; margin-bottom: 1.4rem; }
  .field input, .field select { height: 9.4rem; font-size: 3.2rem; border-radius: 1rem; padding: 0 3rem; }
  .radio-card { padding: 3.4rem 3.8rem; gap: 3rem; border-radius: 1.2rem; margin-bottom: 2.6rem; }
  .radio-card input { width: 3.6rem; height: 3.6rem; }
  .radio-card b { font-size: 3.3rem; }
  .radio-card small { font-size: 2.7rem; margin-top: .6rem; }
  .transfer-info { font-size: 2.9rem; padding: 3.4rem 3.8rem; border-radius: 1rem; }
  .co-summary { position: static; }
  .mini { gap: 2.6rem; padding: 2rem 0; }
  .mini img { width: 11rem; height: 11rem; border-radius: .8rem; }
  .mini__name { font-size: 2.8rem; }
  .mini__meta { font-size: 2.4rem; }
  .mini__price { font-size: 2.9rem; }

  .success__box { width: 88rem; padding: 8rem 6rem; border-radius: 2rem; }
  .success__check { width: 14rem; height: 14rem; font-size: 6.4rem; margin-bottom: 4.4rem; }
  .success__box h2 { font-size: 5.2rem; }
  .success__box p { font-size: 3.1rem; margin-top: 2.6rem; }
  .success__box .btn-black { width: 52rem; margin-top: 5.4rem; }
}