/* =========================================================================
   OPCIÓN 1 · CLÁSICO  (todo bajo .d1)
   Tipografía: Bebas Neue + Barlow
   ========================================================================= */

.d1 {
  --rojo: #d3101f;
  --rojo-trans: rgba(211, 16, 31, 0.86);
  --carbon: #2a2c31;
  --carbon-2: #1d1f23;
  --gris-txt: #c9cbd0;
  --f-titulo: "Bebas Neue", Impact, sans-serif;
  --f-texto: "Barlow", Arial, sans-serif;
}

.d1 .tarjeta, .d1 .cartel { font-family: var(--f-texto); color: #fff; }
.d1 .tarjeta { background: var(--carbon); }

.d1 .frente__foto,
.d1 .reverso__fotos,
.d1 .cartel__fondo {
  background-size: cover;
  background-position: center;
}

/* ---------- ANVERSO ---------- */
.d1 .frente__foto { position: absolute; inset: 0 0 10mm 0; background-position: 72% center; filter: brightness(.68); }
.d1 .frente__banda {
  position: absolute; left: 0; right: 0; top: 23mm; height: 17mm;
  background: var(--rojo-trans);
  display: flex; align-items: center; justify-content: center;
}
.d1 .frente__marca { text-align: center; line-height: 1; text-transform: uppercase; }
.d1 .frente__nombre { font-family: var(--f-titulo); font-size: 10.5mm; letter-spacing: .05em; }
.d1 .frente__subtitulo { font-weight: 700; font-size: 2.5mm; letter-spacing: .17em; margin-top: .6mm; }
.d1 .frente__pie {
  position: absolute; left: 0; right: 0; bottom: 0; height: 10mm;
  background: var(--carbon);
  display: flex; align-items: center; justify-content: center; gap: 4mm;
  font-size: 2.45mm;
}
.d1 .frente__pie-item { display: flex; align-items: center; }
.d1 .frente__pie-item strong { font-weight: 800; letter-spacing: .04em; }
.d1 .frente__pie-sep { width: .3mm; height: 4mm; background: #555; }

/* ---------- REVERSO ---------- */
.d1 .reverso__fotos {
  position: absolute; left: 0; right: 0; top: 0; height: 36mm;
  background-position: center 45%;
  filter: brightness(.72);
}

.d1 .reverso__banda {
  position: absolute; left: 0; right: 0; top: 19mm; height: 17mm;
  background: var(--rojo-trans);
  padding: 2.4mm 25mm 2.4mm 3.5mm;
  display: flex; align-items: center;
}
.d1 .reverso__servicios { display: grid; grid-template-columns: 1fr 1fr; gap: 1.6mm 2.5mm; }
.d1 .reverso__servicio {
  display: flex; align-items: center;
  font-size: 2.05mm; font-weight: 700; text-transform: uppercase; line-height: 1.1;
}

.d1 .reverso__pie {
  position: absolute; left: 0; right: 0; bottom: 0; height: 14mm;
  background: var(--carbon);
  padding: 0 25mm 0 3.5mm;
  display: flex; align-items: center; justify-content: space-between; gap: 2mm;
}
.d1 .reverso__contacto { display: flex; align-items: center; min-width: 0; }
.d1 .reverso__contacto-texto { display: flex; flex-direction: column; line-height: 1.15; }
.d1 .reverso__contacto-texto strong { font-size: 2.5mm; font-weight: 700; }

.d1 .reverso__qr {
  position: absolute; right: 3mm; bottom: 3mm;
  width: 20mm; padding: 1.5mm 1.5mm 1mm;
  background: #fff; color: var(--carbon);
  box-shadow: 0 .5mm 2mm rgba(0, 0, 0, .35);
  text-align: center;
}
.d1 .reverso__qr-texto {
  display: block; margin-top: .6mm;
  font-size: 1.9mm; font-weight: 800; letter-spacing: .12em; color: var(--rojo);
  text-transform: uppercase;
}

/* ---------- CARTEL ---------- */
.d1 .cartel {
  display: grid; grid-template-columns: 830mm 470mm;
  background: var(--carbon-2);
}
.d1 .cartel__izq {
  position: relative;
  display: grid; grid-template-rows: 245mm 1fr;
  padding: 42mm 44mm 42mm;
}
.d1 .cartel__fondo { position: absolute; inset: 0; opacity: .9; background-position: 74% center; }
.d1 .cartel__izq::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(12, 15, 19, .87), rgba(12, 15, 19, .43)),
              linear-gradient(0deg, rgba(12, 15, 19, .65), transparent 65%);
}
.d1 .cartel__header, .d1 .cartel__servicios { position: relative; }

.d1 .cartel__etiqueta {
  font-weight: 700; font-size: 18mm; letter-spacing: .22em;
  color: var(--gris-txt); text-transform: uppercase;
}
.d1 .cartel__nombre {
  font-family: var(--f-titulo); font-weight: 400;
  font-size: 145mm; line-height: .9; letter-spacing: .035em;
  margin: 8mm 0 8mm; text-transform: uppercase;
}
.d1 .cartel__subtitulo {
  display: inline-block;
  background: var(--rojo);
  padding: 7mm 15mm;
  font-weight: 700; font-size: 30mm; letter-spacing: .04em; line-height: 1;
  white-space: nowrap; text-transform: uppercase;
}

.d1 .cartel__servicios {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12mm;
  margin-top: 25mm;
}
.d1 .servicio {
  display: flex; align-items: center;
  min-height: 95mm; padding: 13mm 17mm;
  background: rgba(20, 23, 28, .7);
  border-left: 3mm solid var(--rojo);
}
.d1 .servicio__nombre {
  font-weight: 700; font-size: 20mm; line-height: 1.1;
  text-transform: uppercase; text-wrap: balance;
}

.d1 .cartel__der {
  background: var(--carbon-2);
  border-left: 8mm solid var(--rojo);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 26mm; padding: 35mm;
  text-align: center;
}
.d1 .cartel__telefono {
  font-family: var(--f-titulo); font-size: 82mm; line-height: .9; letter-spacing: .02em;
}
.d1 .cartel__qr { width: 200mm; padding: 10mm 10mm 8mm; background: #fff; color: var(--carbon); }
.d1 .cartel__qr-texto {
  margin-top: 4mm;
  font-weight: 700; font-size: 12mm; line-height: 1.1; text-transform: uppercase;
}
.d1 .cartel__ubicacion {
  display: block;
  max-width: 100%; padding-top: 15mm;
  border-top: 2mm solid var(--rojo);
  font-family: var(--f-titulo); font-size: 32mm; letter-spacing: .04em; line-height: 1.05;
  text-transform: uppercase;
}
