/* =========================================================================
   OPCIÓN 3 · CONTRASTE  (todo bajo .d3)
   Tipografía: Barlow Condensed (títulos) + Barlow (textos)
   Tarjeta  — nombre 10.5 · número 5 · rubro 2.3 · dato 2.4 · servicio 2 · pequeño 1.6 (mm)
   Cartel   — nombre 136 · número 78 · lugar 30 · rubro 34 · servicio 25 (mm)
   ========================================================================= */

.d3 {
  --rojo: #d3101f;
  --rojo-suave: #fbe9ea;
  --carbon: #26282c;
  --carbon-osc: #18191c;
  --gris: #6b6f76;
  --gris-claro: #a7abb2;
  --linea: #e3e4e7;
  --f-titulo: "Barlow Condensed", "Arial Narrow", sans-serif;
  --f-texto: "Barlow", Arial, sans-serif;
}

.d3 .tarjeta, .d3 .cartel { font-family: var(--f-texto); }

.d3 .frente__foto, .d3 .cartel__panel-foto {
  background-size: cover;
  background-position: center 57%;
}

/* ---------- ANVERSO ---------- */
.d3 .frente { background: var(--carbon-osc); color: #fff; }
.d3 .frente__foto {
  position: absolute; inset: 0 0 9mm 0;
  filter: brightness(.52) contrast(1.08);
}
.d3 .frente__marca {
  position: absolute; left: 0; right: 0; top: 0; bottom: 9mm;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
}
.d3 .frente__nombre {
  font-family: var(--f-titulo); font-weight: 700;
  font-size: 9.5mm; line-height: 1; letter-spacing: .06em; text-transform: uppercase;
  padding-left: .06em; /* compensa el espaciado final para centrar */
}
.d3 .frente__regla { width: 10mm; height: .6mm; background: var(--rojo); margin: 2mm 0 1.8mm; }
.d3 .frente__rubro {
  font-size: 2.25mm; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  padding-left: .2em;
}
.d3 .frente__barra {
  position: absolute; left: 0; right: 0; bottom: 0; height: 9mm;
  background: var(--rojo);
  display: flex; align-items: center; justify-content: center; gap: 4mm;
}
.d3 .frente__dato {
  display: flex; align-items: center;
  font-size: 2.25mm; font-weight: 600; line-height: 1; letter-spacing: .02em;
}
.d3 .frente__sep { width: .25mm; height: 3.4mm; background: rgba(255, 255, 255, .45); }

/* ---------- REVERSO ---------- */
.d3 .reverso { background: #fff; color: var(--carbon); display: flex; }
.d3 .reverso__contenido {
  flex: 1; padding: 5mm 4mm 4.5mm 5mm;
  display: flex; flex-direction: column;
}
.d3 .reverso__marca { display: flex; flex-direction: column; gap: .8mm; }
.d3 .reverso__nombre {
  font-family: var(--f-titulo); font-weight: 700;
  font-size: 4.6mm; line-height: 1; letter-spacing: .04em; text-transform: uppercase;
}
.d3 .reverso__rubro {
  font-size: 1.6mm; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; color: var(--rojo);
}
.d3 .reverso__servicios {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2.2mm 2.5mm;
  margin: auto 0;
}
.d3 .reverso__servicio { display: flex; align-items: center; padding-left: 1.5mm; border-left: .5mm solid var(--rojo); }
.d3 .reverso__servicio-nombre {
  font-size: 2.05mm; font-weight: 600; line-height: 1.15; text-wrap: balance;
}
.d3 .reverso__contacto {
  margin-top: auto;
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 2.4mm; border-top: .25mm solid var(--linea);
}
.d3 .reverso__telefono { display: flex; align-items: center; }
.d3 .reverso__telefono strong {
  display: block;
  font-family: var(--f-titulo); font-weight: 700;
  font-size: 4mm; line-height: .95; letter-spacing: .02em;
}
.d3 .reverso__ubicacion {
  display: flex; align-items: center;
  max-width: 33mm; font-size: 1.85mm; font-weight: 600; line-height: 1.1;
}

.d3 .reverso__panel {
  width: 25mm; flex: none;
  background: var(--carbon);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2mm;
  border-left: 1.2mm solid var(--rojo);
}
.d3 .reverso__qr-caja { width: 17mm; padding: 1.2mm; background: #fff; border-radius: .8mm; }
.d3 .reverso__qr-texto {
  max-width: 17mm;
  font-size: 1.6mm; font-weight: 600; line-height: 1.25;
  text-align: center; color: #fff; text-transform: uppercase; letter-spacing: .08em;
}

/* ---------- CARTEL ---------- */
.d3 .cartel {
  display: grid; grid-template-columns: 800mm 500mm;
  background: #fff; color: var(--carbon);
}
.d3 .cartel__principal { position: relative; padding: 55mm 55mm 0 65mm; min-width: 0; }
.d3 .cartel__marca { display: flex; flex-direction: column; align-items: flex-start; }
.d3 .cartel__etiqueta {
  font-size: 18mm; font-weight: 700; letter-spacing: .24em;
  text-transform: uppercase; color: var(--rojo);
}
.d3 .cartel__nombre {
  font-family: var(--f-titulo); font-weight: 700;
  font-size: 136mm; line-height: .88; letter-spacing: .02em; text-transform: uppercase;
  margin-top: 15mm;
}
.d3 .cartel__rubro {
  font-family: var(--f-titulo); font-weight: 600;
  font-size: 34mm; line-height: 1; letter-spacing: .1em; text-transform: uppercase;
  color: var(--gris);
  margin-top: 12mm;
}
.d3 .cartel__servicios {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 31mm 42mm;
  margin-top: 65mm;
}
.d3 .cartel__servicio { display: flex; align-items: flex-start; padding-top: 11mm; border-top: 3mm solid var(--rojo); }
.d3 .cartel__servicio-nombre {
  font-family: var(--f-titulo); font-weight: 600;
  font-size: 25mm; line-height: 1.08; letter-spacing: .025em; text-transform: uppercase;
  text-wrap: balance;
}
.d3 .cartel__franja { position: absolute; left: 0; right: 0; bottom: 0; height: 10mm; background: var(--rojo); }

.d3 .cartel__panel { position: relative; background: var(--carbon-osc); color: #fff; overflow: hidden; }
.d3 .cartel__panel-foto { position: absolute; top: 0; left: 0; right: 0; height: 330mm; background-position: center 58%; }
.d3 .cartel__contacto {
  position: absolute; left: 0; right: 0; bottom: 0; height: 290mm;
  display: flex; flex-direction: column; justify-content: center;
  padding: 28mm 34mm; text-align: left;
  background: var(--carbon-osc); border-top: 7mm solid var(--rojo);
}
.d3 .cartel__numero {
  font-family: var(--f-titulo); font-weight: 700;
  font-size: 78mm; line-height: .9; letter-spacing: .01em;
}
.d3 .cartel__contacto-pie {
  display: flex; align-items: center; gap: 28mm; margin-top: 20mm;
}
.d3 .cartel__qr {
  display: flex; flex-direction: column; align-items: center; gap: 4mm;
  flex: none;
}
.d3 .cartel__qr-caja { width: 105mm; padding: 6mm; background: #fff; }
.d3 .cartel__qr-texto {
  font-size: 10mm; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--gris-claro);
}
.d3 .cartel__ubicacion {
  display: block;
  max-width: 285mm; padding-left: 17mm;
  border-left: 2mm solid var(--rojo);
  font-family: var(--f-titulo); font-weight: 700;
  font-size: 30mm; line-height: 1.08; letter-spacing: .03em; text-transform: uppercase;
}
