/* ============================================
   GLOW UP CENTER × HOSPITALIDAD — Kit Material Impreso v2
   Pieza 01: Lista precios A4 vertical
   Pieza 02: Tríptico in-room A4 horizontal plegado
   Pieza 03: Briefing staff credencial 85×55mm
   ============================================ */

:root {
  --color-bg-soft: #F4F1F8;
  --color-bg-base: #FFFFFF;
  --color-accent-soft: #8874C4;
  --color-accent: #7B2FE0;
  --color-accent-deep: #5B1AAF;
  --color-accent-darker: #3D0E78;
  --color-ink: #2E2252;
  --color-ink-soft: #4A3D78;
  --color-warm-rose: #F8E6E0;
  --color-warm-cream: #FBF6E9;

  --font-display: "Fraunces", "Cormorant Garamond", "Georgia", serif;
  --font-brand: "Nunito", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  background: #ECE7F3;
  font-family: var(--font-body);
  color: var(--color-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding: 18mm 0;
}

/* ===== HEADER KIT ===== */
.kit-header {
  max-width: 880px;
  margin: 0 auto 14mm;
  padding: 0 20mm;
  text-align: center;
}
.kit-eyebrow {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 9pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 5mm;
}
.kit-title {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: 36pt;
  line-height: 1.05;
  color: var(--color-ink);
  margin-bottom: 5mm;
  letter-spacing: -0.015em;
}
.kit-sub {
  font-family: var(--font-body);
  font-size: 12pt;
  line-height: 1.55;
  color: var(--color-ink-soft);
  max-width: 580px;
  margin: 0 auto;
}
.kit-edit-link {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 9pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-top: 8mm;
}
.kit-edit-link a {
  color: var(--color-accent);
  text-decoration: none;
  padding: 6px 14px;
  border: 1.5px solid var(--color-accent-soft);
  border-radius: 999px;
  transition: all 0.18s;
  margin: 0 4px;
  display: inline-block;
}
.kit-edit-link a:hover {
  background: var(--color-accent);
  color: #fff;
  border-color: var(--color-accent);
}

/* ===== PIECE BLOCK ===== */
.piece-block {
  max-width: 1180px;
  margin: 0 auto 28mm;
  padding: 0 20mm;
}
.piece-meta { margin-bottom: 10mm; max-width: 760px; }
.piece-meta-tag {
  display: inline-block;
  font-family: var(--font-brand);
  font-weight: 800;
  font-size: 8.5pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fff;
  background: var(--color-accent);
  padding: 4px 12px;
  border-radius: 14px;
  margin-bottom: 5mm;
}
.piece-meta-title {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 26pt;
  line-height: 1.1;
  color: var(--color-ink);
  margin-bottom: 3mm;
  letter-spacing: -0.015em;
}
.piece-meta-spec {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 9pt;
  letter-spacing: 0.05em;
  color: var(--color-accent);
  margin-bottom: 4mm;
}
.piece-meta-desc {
  font-family: var(--font-body);
  font-size: 11pt;
  line-height: 1.55;
  color: var(--color-ink-soft);
}

.cards-row {
  display: flex;
  gap: 14mm;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.caption {
  margin-top: 8mm;
  font-family: var(--font-body);
  font-size: 10pt;
  font-style: italic;
  color: #8A7BAA;
  text-align: center;
}

/* ===== CARD BASE ===== */
.card {
  position: relative;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 22px 50px -10px rgba(46, 34, 82, 0.25),
              0 8px 20px -8px rgba(46, 34, 82, 0.15);
  border-radius: 4px;
}

/* Common brand mark */
.mark-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #F8E6E0 0%, #7B2FE0 80%);
  box-shadow: 0 0 8px rgba(123, 47, 224, 0.5);
  vertical-align: middle;
}
.mark-dot-light {
  background: radial-gradient(circle at 30% 30%, #F8E6E0 0%, #B89DE8 80%);
  box-shadow: 0 0 10px rgba(248, 230, 224, 0.6);
}
.mark-text {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 11pt;
  color: var(--color-ink);
  vertical-align: middle;
  margin-left: 4px;
}
.mark-text-light { color: #F8E6E0; }
.mark-text-small { font-size: 9.5pt; }


/* ============================================================
   PIEZA 01 — LISTA DE PRECIOS A4 vertical
   210 × 297 mm
   ============================================================ */
.card-precios {
  width: 210mm;
  height: 297mm;
  background: #fff;
}
.precios-inner {
  padding: 12mm 16mm 22mm;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.precios-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 5mm;
  border-bottom: 1.5px solid var(--color-accent);
  margin-bottom: 8mm;
}
.precios-brand { display: flex; align-items: center; }
.precios-tag {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 8pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.precios-hero {
  text-align: center;
  margin-bottom: 6mm;
}
.precios-eyebrow {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 8pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 3mm;
}
.precios-title {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: 32pt;
  line-height: 1.05;
  color: var(--color-ink);
  margin-bottom: 3mm;
  letter-spacing: -0.015em;
}
.precios-rate {
  font-family: var(--font-body);
  font-size: 9pt;
  color: var(--color-ink-soft);
  font-style: italic;
}

.precios-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 14mm;
  flex: 1;
  align-content: start;
}
.precios-section { display: contents; }
.precios-section + .precios-section { display: contents; }

.precios-section-name {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 13pt;
  color: var(--color-accent-deep);
  margin-bottom: 2mm;
  padding-bottom: 1.5mm;
  border-bottom: 1px solid rgba(123, 47, 224, 0.3);
  letter-spacing: -0.01em;
}

.precios-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: baseline;
  gap: 0 6mm;
  padding: 1.2mm 0;
  border-bottom: 1px dotted rgba(136, 116, 196, 0.25);
}
.precios-svc {
  font-family: var(--font-body);
  font-size: 9pt;
  color: var(--color-ink);
  font-weight: 500;
}
.precios-cop {
  font-family: var(--font-body);
  font-size: 9pt;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--color-accent-deep);
  text-align: right;
}
.precios-usd {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 8.5pt;
  color: var(--color-ink-soft);
  text-align: right;
  min-width: 12mm;
}

.precios-footer {
  margin-top: 7mm;
  padding-top: 5mm;
  border-top: 1.5px solid var(--color-accent);
  display: flex;
  gap: 8mm;
  justify-content: space-between;
}
.precios-footer-left { flex: 1; }
.precios-footer-note {
  font-family: var(--font-body);
  font-size: 8.5pt;
  line-height: 1.45;
  color: var(--color-ink-soft);
  margin-bottom: 1.5mm;
}
.precios-footer-note strong { color: var(--color-accent-deep); }
.precios-footer-right { text-align: right; }
.precios-footer-handle {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 11pt;
  color: var(--color-accent-deep);
  margin-bottom: 1.5mm;
}
.precios-footer-addr,
.precios-footer-hours {
  font-family: var(--font-body);
  font-size: 8.5pt;
  color: var(--color-ink-soft);
  line-height: 1.4;
}


/* ============================================================
   PIEZA 02 — TRÍPTICO IN-ROOM A4 horizontal
   Abierto: 297 × 210 mm · Cerrado: 99 × 210 mm
   3 paneles de 99 mm cada uno
   ============================================================ */
.triptico-row {
  display: flex;
  flex-direction: column;
  gap: 14mm;
}
.triptico-side {
  display: flex;
  flex-direction: column;
}
.triptico-side-label {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 8pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 4mm;
}

.card-triptico {
  width: 297mm;
  height: 210mm;
  display: flex;
  flex-direction: row;
  background: #fff;
}
.triptico-panel {
  width: 99mm;
  height: 210mm;
  position: relative;
  overflow: hidden;
  border-right: 1px dashed rgba(123, 47, 224, 0.18);
}
.triptico-panel:last-child { border-right: none; }


/* ============ CARA EXTERNA ============ */

/* PANEL EXT 1 — Contraportada editorial con imagen */
.triptico-ext-back {
  position: relative;
  overflow: hidden;
}
.ext-back-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ext-back-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(46, 34, 82, 0.72) 0%, rgba(91, 26, 175, 0.85) 50%, rgba(46, 34, 82, 0.92) 100%);
}
.ext-back-content {
  position: relative;
  height: 100%;
  padding: 12mm 10mm 10mm;
  display: flex;
  flex-direction: column;
  color: #fff;
}
.ext-back-head {
  display: flex;
  align-items: center;
  padding-bottom: 5mm;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 8mm;
}
.ext-back-quote {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 3mm;
}
.ext-quote-mark {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 56pt;
  line-height: 0.6;
  color: #F8E6E0;
  opacity: 0.7;
  margin-bottom: 4mm;
}
.ext-back-quote-text {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: 17pt;
  line-height: 1.15;
  color: #fff;
  letter-spacing: -0.01em;
}
.ext-back-info {
  text-align: center;
  padding-top: 6mm;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}
.ext-back-handle {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 10pt;
  color: #F8E6E0;
  margin-bottom: 2mm;
}
.ext-back-addr {
  font-family: var(--font-body);
  font-size: 7.5pt;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.4;
  margin-bottom: 1.5mm;
}
.ext-back-hours {
  font-family: var(--font-body);
  font-size: 7.5pt;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.4;
}
.ext-back-rule {
  width: 14mm;
  height: 1px;
  background: rgba(248, 230, 224, 0.6);
  margin: 4mm auto 4mm;
}
.ext-back-cta {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 7.5pt;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #F8E6E0;
}

/* PANEL EXT 2 — Solapa interior */
.triptico-ext-flap {
  background: linear-gradient(160deg, #F4F1F8 0%, #ECE3F7 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10mm;
}
.flap-inner {
  text-align: center;
  max-width: 80mm;
}
.flap-eyebrow {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 7.5pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 5mm;
}
.flap-title {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: 22pt;
  line-height: 1.05;
  color: var(--color-ink);
  letter-spacing: -0.02em;
  margin-bottom: 5mm;
}
.flap-sub {
  font-family: var(--font-body);
  font-size: 9.5pt;
  line-height: 1.5;
  color: var(--color-ink-soft);
  margin-bottom: 7mm;
}
.flap-rule {
  width: 14mm;
  height: 1.5px;
  background: var(--color-accent);
  margin: 0 auto 7mm;
}
.flap-cta {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 16pt;
  color: var(--color-accent-deep);
  margin-bottom: 2mm;
  letter-spacing: -0.01em;
}
.flap-cta-en {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 7.5pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-accent);
}

/* PANEL EXT 3 — Portada con imagen */
.triptico-ext-front {
  position: relative;
  overflow: hidden;
}
.triptico-front-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.front-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(46, 34, 82, 0.55) 0%, rgba(46, 34, 82, 0.25) 40%, rgba(91, 26, 175, 0.85) 100%);
}
.front-content {
  position: relative;
  height: 100%;
  padding: 12mm 10mm;
  display: flex;
  flex-direction: column;
  color: #fff;
}
.front-head {
  display: flex;
  align-items: center;
  margin-bottom: auto;
}
.front-body {
  margin-bottom: 8mm;
}
.front-eyebrow {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 7.5pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #F8E6E0;
  margin-bottom: 5mm;
}
.front-title {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: 32pt;
  line-height: 0.98;
  color: #fff;
  letter-spacing: -0.025em;
  margin-bottom: 5mm;
}
.front-title em {
  background: linear-gradient(120deg, #F8E6E0 0%, #FBF6E9 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 600;
}
.front-title-en {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  font-size: 10pt;
  line-height: 1.1;
  color: rgba(248, 230, 224, 0.75);
}
.front-foot {
  padding-top: 6mm;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
}
.front-tagline {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 7.5pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(248, 230, 224, 0.9);
}


/* ============ CARA INTERNA ============ */

.triptico-int-packs,
.triptico-int-verts,
.triptico-int-domicilio {
  padding: 12mm 10mm;
  display: flex;
  flex-direction: column;
}

.int-eyebrow {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 7pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 3.5mm;
}
.int-title {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: 19pt;
  line-height: 0.98;
  color: var(--color-ink);
  letter-spacing: -0.02em;
  margin-bottom: 4mm;
}
.int-title em {
  color: var(--color-accent);
  font-weight: 600;
}
.int-sub {
  font-family: var(--font-body);
  font-size: 8.5pt;
  line-height: 1.45;
  color: var(--color-ink-soft);
  margin-bottom: 6mm;
  font-style: italic;
}

/* PANEL INT 1 — paquetes ricos */
.triptico-int-packs {
  background: linear-gradient(180deg, #fff 0%, #F4F1F8 100%);
}
.int-pack {
  position: relative;
  padding: 4mm 0 4mm;
  border-bottom: 1px solid rgba(136, 116, 196, 0.22);
}
.int-pack:last-child { border-bottom: none; padding-bottom: 0; }
.int-pack-head {
  display: flex;
  gap: 4mm;
  align-items: flex-start;
  margin-bottom: 2.5mm;
}
.int-pack-num {
  flex-shrink: 0;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 24pt;
  line-height: 0.85;
  color: var(--color-accent-deep);
  letter-spacing: -0.025em;
  width: 11mm;
}
.int-pack-1 .int-pack-num { color: #7B2FE0; }
.int-pack-2 .int-pack-num { color: #B5803E; }
.int-pack-3 .int-pack-num { color: #C46B5D; }

.int-pack-titles { flex: 1; }
.int-pack-tag {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 6pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 1mm;
}
.int-pack-name {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 13pt;
  line-height: 1;
  color: var(--color-ink);
  letter-spacing: -0.01em;
}
.int-pack-line {
  font-family: var(--font-body);
  font-size: 7.5pt;
  line-height: 1.45;
  color: var(--color-ink-soft);
  margin-bottom: 2.5mm;
}
.int-pack-includes {
  list-style: none;
  padding: 2mm 0 0;
  border-top: 1px dashed rgba(123, 47, 224, 0.25);
}
.int-pack-includes li {
  position: relative;
  padding: 0.6mm 0 0.6mm 5mm;
  font-family: var(--font-body);
  font-size: 7.5pt;
  line-height: 1.3;
  color: var(--color-ink);
  font-weight: 500;
}
.int-pack-includes li::before {
  content: '+';
  position: absolute;
  left: 0;
  top: 0;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 11pt;
  color: var(--color-accent);
  line-height: 1;
}

/* PANEL INT 2 — 4 caminos distribuidos en todo el alto */
.triptico-int-verts {
  background: linear-gradient(180deg, #fff 0%, #F8F4FC 100%);
}
.vert-stack {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.vert-card {
  display: flex;
  gap: 3.5mm;
  align-items: flex-start;
  padding: 3mm 0;
  border-bottom: 1px solid rgba(136, 116, 196, 0.22);
}
.vert-card:last-child { border-bottom: none; padding-bottom: 0; }
.vert-card:first-of-type { padding-top: 0; }
.vert-img {
  flex-shrink: 0;
  width: 21mm;
  height: 21mm;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 4px 10px rgba(46, 34, 82, 0.14);
}
.vert-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vert-img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(46, 34, 82, 0.25) 100%);
}
.vert-body { flex: 1; padding-top: 0; }
.vert-tag {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 5.5pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 0.8mm;
}
.vert-name {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 13pt;
  color: var(--color-ink);
  line-height: 1;
  margin-bottom: 1mm;
  letter-spacing: -0.01em;
}
.vert-promise {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: 7.5pt;
  line-height: 1.15;
  color: var(--color-accent-deep);
  margin-bottom: 1.2mm;
  letter-spacing: -0.005em;
}
.vert-line {
  font-family: var(--font-body);
  font-size: 6.3pt;
  line-height: 1.35;
  color: var(--color-ink-soft);
  margin-bottom: 1.5mm;
}
.vert-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.vert-list li {
  position: relative;
  padding: 0.2mm 0 0.2mm 3mm;
  font-family: var(--font-body);
  font-size: 5.8pt;
  line-height: 1.3;
  color: var(--color-ink);
  font-weight: 500;
}
.vert-list li::before {
  content: '·';
  position: absolute;
  left: 0;
  top: -1mm;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 700;
  font-size: 9pt;
  color: var(--color-accent);
  line-height: 1;
}

/* PANEL INT 3 — bienestar a domicilio (sin precios, foco experiencia) */
.triptico-int-domicilio {
  background: linear-gradient(160deg, #F8E6E0 0%, #FBF6E9 50%, #F4F1F8 100%);
}

.dom-quote {
  background: rgba(255, 255, 255, 0.45);
  border-left: 2px solid var(--color-accent);
  padding: 4mm 5mm 4mm 7mm;
  border-radius: 3px;
  margin-bottom: 5mm;
  position: relative;
}
.dom-quote-mark {
  position: absolute;
  top: -2mm;
  left: 3mm;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 28pt;
  line-height: 0.6;
  color: var(--color-accent);
  opacity: 0.55;
}
.dom-quote-text {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: 10pt;
  line-height: 1.2;
  color: var(--color-ink);
  letter-spacing: -0.005em;
}

.dom-card {
  display: flex;
  gap: 4mm;
  padding: 3mm 0;
  border-bottom: 1px solid rgba(123, 47, 224, 0.18);
}
.dom-card:first-of-type { padding-top: 2mm; }
.dom-card:last-of-type { border-bottom: none; padding-bottom: 4mm; }

.dom-card-icon {
  flex-shrink: 0;
  width: 9mm;
  height: 9mm;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.65);
  border: 1px solid rgba(123, 47, 224, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
}
.dom-icon-circle {
  width: 4mm;
  height: 4mm;
  border-radius: 50%;
  background: linear-gradient(135deg, #B89DE8, #5B1AAF);
}
.dom-icon-circle-2 {
  background: linear-gradient(135deg, #F8E6E0, #C46B5D);
}
.dom-card-body { flex: 1; }
.dom-card-name {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 11pt;
  color: var(--color-ink);
  margin-bottom: 1mm;
  letter-spacing: -0.01em;
}
.dom-card-line {
  font-family: var(--font-body);
  font-size: 7pt;
  line-height: 1.45;
  color: var(--color-ink-soft);
}

.dom-experience {
  margin-top: 5mm;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 6px;
  padding: 4mm 5mm;
  border-left: 2px solid var(--color-accent);
}
.dom-exp-label {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 6.5pt;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--color-accent-deep);
  margin-bottom: 2.5mm;
}
.dom-exp-list {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1mm 4mm;
}
.dom-exp-list li {
  position: relative;
  padding: 0.4mm 0 0.4mm 4mm;
  font-family: var(--font-body);
  font-size: 6.8pt;
  line-height: 1.3;
  color: var(--color-ink);
}
.dom-exp-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 1.8mm;
  width: 2.2mm;
  height: 2.2mm;
  border-radius: 50%;
  border: 1px solid var(--color-accent);
  background: rgba(123, 47, 224, 0.15);
}

.dom-promise {
  margin-top: 4mm;
  padding: 3mm 5mm;
  text-align: center;
  background: linear-gradient(135deg, rgba(123, 47, 224, 0.08), rgba(248, 230, 224, 0.4));
  border-radius: 4px;
}
.dom-promise-text {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: 8.5pt;
  line-height: 1.3;
  color: var(--color-ink);
  letter-spacing: -0.005em;
}

.dom-cta {
  margin-top: auto;
  padding-top: 4mm;
  border-top: 1.5px solid var(--color-accent);
  text-align: center;
}
.dom-cta-label {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 6.5pt;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 1.5mm;
}
.dom-cta-value {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 14pt;
  line-height: 1;
  color: var(--color-accent-deep);
  margin-bottom: 1.5mm;
  letter-spacing: -0.01em;
}
.dom-cta-en {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 6.5pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-accent);
}


/* ============================================================
   PIEZA 03 — BRIEFING DEL STAFF (CREDENCIAL 85 × 55 mm)
   ============================================================ */
.card-credencial {
  width: 85mm;
  height: 55mm;
  border-radius: 6px;
}
.cred-inner {
  padding: 4mm 5mm;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.card-credencial-front {
  background: linear-gradient(135deg, #2E2252 0%, #5B1AAF 100%);
  color: #fff;
}
.card-credencial-front::before {
  content: '';
  position: absolute;
  top: -25px; right: -25px;
  width: 90px; height: 90px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(248, 230, 224, 0.22) 0%, transparent 70%);
  filter: blur(15px);
}
.card-credencial-back {
  background: var(--color-bg-base);
  border: 1.5px solid var(--color-bg-soft);
}

.cred-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  padding-bottom: 1.8mm;
  border-bottom: 1px solid rgba(248, 230, 224, 0.25);
  margin-bottom: 2.5mm;
}
.cred-brand { display: flex; align-items: center; }
.cred-role {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 5.5pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #F8E6E0;
}
.cred-label {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 5pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(248, 230, 224, 0.7);
  margin-bottom: 0.5mm;
}
.cred-prop { position: relative; margin-bottom: 1.5mm; }
.cred-prop-value {
  font-family: var(--font-body);
  font-size: 8pt;
  font-weight: 600;
  color: #fff;
}
.cred-code { position: relative; margin-bottom: 1.8mm; }
.cred-code-value {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 12pt;
  line-height: 1;
  background: linear-gradient(120deg, #F8E6E0 0%, #FBF6E9 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  letter-spacing: 0.02em;
}
.cred-wa {
  position: relative;
  margin-top: auto;
  padding-top: 1.5mm;
  border-top: 1px solid rgba(248, 230, 224, 0.25);
}
.cred-wa-value {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 10pt;
  color: #fff;
}

/* Credencial back */
.cred-back-eyebrow {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 5.5pt;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 2mm;
}
.cred-cheats {
  margin-bottom: 2mm;
  flex: 1;
}
.cheat {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 2mm;
  padding: 1mm 0;
  border-bottom: 1px solid rgba(136, 116, 196, 0.2);
  font-family: var(--font-body);
  font-size: 6.5pt;
  color: var(--color-ink-soft);
}
.cheat:last-child { border-bottom: none; }
.cheat strong {
  font-family: var(--font-body);
  font-weight: 600;
  color: var(--color-ink);
}
.cheat span {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  color: var(--color-accent-deep);
  font-size: 7.5pt;
}
.cred-back-note {
  font-family: var(--font-body);
  font-size: 5.5pt;
  line-height: 1.3;
  color: var(--color-ink-soft);
  font-style: italic;
  padding-top: 1.5mm;
  border-top: 1px solid var(--color-bg-soft);
}

/* ===== KIT FOOTER ===== */
.kit-footer {
  text-align: center;
  padding: 14mm 20mm;
  border-top: 1px solid #D9CCE7;
  font-family: var(--font-body);
  font-size: 9pt;
  color: #8A7BAA;
}


/* ============================================================
   PRINT
   ============================================================ */
@page {
  margin: 0;
}
@media print {
  html, body { background: #fff; padding: 0; }
  .kit-header, .kit-footer, .piece-meta, .caption, .triptico-side-label { display: none; }
  .piece-block { margin: 0; padding: 0; page-break-after: always; break-after: page; }
  .piece-block:last-child { page-break-after: auto; }
  .cards-row, .triptico-row { gap: 0; justify-content: center; }
  .triptico-side { page-break-before: always; }
  .triptico-side:first-child { page-break-before: auto; }
  .card { box-shadow: none; }
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
}
