/* GENERADO por fuente/construir.py desde fuente/sectores/estetica/: no se edita a mano. */
@font-face { font-family: "Estetica Titulos"; src: url(/fuentes/estetica/bodoni-moda-latin-500.woff2) format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Estetica Titulos"; src: url(/fuentes/estetica/bodoni-moda-latin-700.woff2) format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Estetica Texto"; src: url(/fuentes/estetica/instrument-sans-latin-400.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Estetica Texto"; src: url(/fuentes/estetica/instrument-sans-latin-600.woff2) format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@layer sector {
/* estetica — «Etiqueta de frasco» (v4). Didona, rosa piel y granate, duotono, código de barras. Sin esquinas redondas.
   CSS anidado: todo dentro de body[data-sector="estetica"]. */
body[data-sector="estetica"] {
  --s-fondo: #F6E3DE; --s-superficie: #FDF6F3; --s-texto: #2A1618; --s-suave: #6A4F52; --s-borde: #8C6D70;
  --s-acento: #7C2336; --s-sobre-acento: #FDF6F3; --s-error: #7C2336;
  --s-fuente: "Estetica Texto", "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --s-fuente-titulo: "Estetica Titulos", "Bodoni Moda", "Didot", Georgia, serif;
  --s-base: 18px; --s-linea: 1.8; --s-medida: 56ch; --s-ancho: 74rem; --s-radio: 0px;
  --e-granate: #7C2336; --e-salvia: #4A5E4B; --e-tinta: #2A1618; --e-linea: rgba(42, 22, 24, .22); --e-sombra: rgba(42, 22, 24, .2);
  --e-barras: repeating-linear-gradient(90deg, #2A1618 0 2px, transparent 2px 5px, #2A1618 5px 6px, transparent 6px 10px, #2A1618 10px 13px, transparent 13px 15px);
  /* Widget de la demo en vivo: etiqueta cuadrada, sin redondeos */
  --dv-fondo: #FDF6F3; --dv-superficie: #F6E3DE; --dv-texto: #2A1618; --dv-texto-suave: #6A4F52; --dv-acento: #2A1618;
  --dv-acento-texto: #FDF6F3; --dv-radio: 0; --dv-fuente: "Estetica Texto", "Instrument Sans", sans-serif;
  --dv-sombra: 5px 6px 0 rgba(42, 22, 24, .2); --dv-borde: #2A1618;

  overflow-x: hidden;
  h1, h2, h3 { font-weight: 500; letter-spacing: -.02em; }
  h3 { font-family: var(--s-fuente); font-weight: 600; font-size: 1.15rem; letter-spacing: 0; }
  .ico { display: none; }
  p { max-width: 56ch; }

  .s-marca { border-top: 0; border-bottom: 1px solid var(--e-linea); }
  .s-marca-fila { width: auto; margin-inline: 4vw; }
  .s-marca-lema { letter-spacing: .12em; text-transform: uppercase; font-size: .78rem; }

  .s-boton { background: var(--e-tinta); color: var(--s-superficie); border: 0; border-radius: 0; font: 600 1.05rem/1.2 var(--s-fuente); letter-spacing: .02em; padding: 1.05rem 2rem; min-height: 56px; }
  .s-boton:hover { background: var(--e-granate); }

  .e-etiqueta { font-size: .78rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--s-suave); margin: 0 0 1.2rem; max-width: none; line-height: 1.5; }
  .e-ancho { width: min(74rem, 100% - 8vw); margin-inline: auto; }
  .e-h2 { font-size: clamp(2rem, 3.4vw, 3.2rem); line-height: 1.1; margin-bottom: 1.8rem; max-width: 20ch; text-wrap: initial; }
  .e-h2-ancho { max-width: 26ch; }
  .e-h3 { font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.2; margin-bottom: 1.4rem; max-width: 24ch; }
  .e-intro { margin-bottom: 2rem; }
  .e-barras { display: block; height: 22px; background: var(--e-barras); }

  /* ─ primera pantalla: tres franjas ─ */
  .e-heroe { display: grid; grid-template-columns: 3rem repeat(11, 1fr); gap: 0 1.4rem; padding: 0 0 0 4vw; min-height: 820px; position: relative; }
  .e-vertical { grid-column: 1; grid-row: 1 / 3; writing-mode: vertical-rl; transform: rotate(180deg); align-self: center; font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: var(--s-suave); white-space: nowrap; margin: 0; max-width: none; }
  .e-heroe-texto { grid-column: 2 / 9; grid-row: 1; align-self: center; padding: 4rem 0 2rem; }
  .e-h1 { font-size: clamp(3.2rem, 7.4vw, 7.2rem); line-height: 1.02; margin: 0; text-wrap: initial; }
  .e-h1 s { text-decoration: line-through; text-decoration-color: currentColor; text-decoration-thickness: .07em; color: var(--e-granate); }
  .e-h1 b { font-weight: 700; color: var(--e-granate); }
  .e-lado { grid-column: 2 / 7; grid-row: 2; padding-bottom: 4.5rem; }
  .e-lead { font-size: 1.15rem; max-width: 30rem; margin-bottom: 1.6rem; }
  .e-nota { font-size: .95rem; color: var(--s-suave); margin: 1.2rem 0 0; }
  .e-foto { grid-column: 9 / 13; grid-row: 1 / 3; margin: 0; position: relative; background: var(--e-granate); isolation: isolate; align-self: stretch; }
  .e-foto-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.15) brightness(1.05); mix-blend-mode: multiply; }
  .e-etq { position: absolute; left: -150px; bottom: 90px; width: 290px; background: var(--s-superficie); padding: 1.1rem 1.2rem 1rem; border: 1px solid var(--e-tinta); transform: rotate(-2.4deg); box-shadow: 6px 7px 0 var(--e-sombra); font-size: .85rem; line-height: 1.5; z-index: 2; }
  .e-etq p { margin: 0 0 1.1rem; }
  .e-etq-n { font: 500 3.4rem/1 var(--s-fuente-titulo); color: var(--e-granate); display: flex; justify-content: space-between; align-items: flex-end; max-width: none; }
  .e-etq-n small { font: 600 .75rem var(--s-fuente); letter-spacing: .16em; text-transform: uppercase; color: var(--s-suave); padding-bottom: .5rem; }
  .e-etq hr { border: 0; border-top: 1px solid var(--e-tinta); margin: 0 0 .6rem; }
  .e-etq b, .e-etq span { display: block; }
  .e-etq .e-barras { margin-top: .7rem; }

  /* ─ carta ─ */
  .e-carta { position: relative; overflow: hidden; background: var(--s-superficie); padding: 7rem 0 6rem; }
  .e-carta::before { content: "Carta"; position: absolute; top: 1rem; left: -3vw; font: 700 clamp(9rem, 22vw, 22rem)/.8 var(--s-fuente-titulo); color: var(--s-fondo); white-space: nowrap; pointer-events: none; }
  .e-carta-rejilla { position: relative; display: grid; grid-template-columns: 4fr 7fr; gap: 4rem; padding-top: 6rem; align-items: start; }
  .e-muestra { margin: 0; position: relative; }
  .e-muestra-img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; filter: saturate(.85); }
  .e-chapa { position: absolute; right: -14px; background: var(--e-granate); color: var(--s-superficie); font: 600 .75rem/1.4 var(--s-fuente); letter-spacing: .14em; text-transform: uppercase; padding: .25rem .6rem; }
  .e-chapa-a { top: 52%; } .e-chapa-b { top: 62%; } .e-chapa-c { top: 72%; }
  .e-items { display: grid; }
  .e-it { display: flex; align-items: baseline; gap: .8rem; padding: .9rem 0; border-bottom: 1px solid var(--e-linea); }
  .e-no { font: 500 1.5rem/1 var(--s-fuente-titulo); color: var(--e-granate); width: 2.6rem; flex: none; }
  .e-it-t b { font-weight: 600; display: block; }
  .e-it-t span { display: block; color: var(--s-suave); font-size: 1rem; line-height: 1.5; }
  .e-puntos { flex: 1; border-bottom: 2px dotted rgba(42, 22, 24, .45); transform: translateY(-.3rem); min-width: 1rem; }
  .e-pr { font-weight: 600; white-space: nowrap; }
  .e-hueco { border-bottom: 1px dotted currentColor; color: var(--s-suave); font-weight: 400; }
  .e-pie-carta { margin: 1.4rem 0 0; font-size: .95rem; color: var(--s-suave); }

  /* ─ cabina (imagen generada con IA, en duotono) ─ */
  .e-cabina { background: var(--e-granate); }
  .e-cabina-fig { margin: 0; position: relative; isolation: isolate; background: var(--e-granate); height: clamp(260px, 34vw, 480px); overflow: hidden; }
  .e-cabina-img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; filter: grayscale(1) contrast(1.1) brightness(1.1); mix-blend-mode: multiply; }
  .e-cabina-pie { position: absolute; left: 4vw; bottom: 1.6rem; background: var(--s-superficie); border: 1px solid var(--e-tinta); padding: .9rem 1.2rem; max-width: 22rem; box-shadow: 5px 6px 0 var(--e-sombra); z-index: 2; }
  .e-cabina-pie b { display: block; font: 500 1.6rem/1.1 var(--s-fuente-titulo); color: var(--e-granate); }
  .e-cabina-pie span { font-size: 1rem; line-height: 1.5; color: var(--s-suave); }

  /* ─ vitrina (el problema) ─ */
  .e-problema { background: var(--e-tinta); color: var(--s-superficie); padding: 6rem 0; }
  .e-problema .e-etiqueta { color: #E8CFCB; }
  .e-dolores { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 3rem; border-top: 1px solid rgba(253, 246, 243, .35); }
  .e-dolor { padding: 2rem 2rem 2.2rem 0; border-bottom: 1px solid rgba(253, 246, 243, .35); }
  .e-dolor:nth-child(even) { padding-left: 2rem; border-left: 1px solid rgba(253, 246, 243, .35); padding-right: 0; }
  .e-rom { display: block; font: 500 4.6rem/1 var(--s-fuente-titulo); color: #E8A9B4; margin-bottom: .6rem; }
  .e-dolor h3 { margin-bottom: .4rem; font-size: 1.25rem; }
  .e-dolor p { margin: 0; color: #EAD9D5; max-width: 34ch; }

  /* ─ tres pasos ─ */
  .e-como { padding: 7rem 0; }
  .e-como-rejilla { display: grid; grid-template-columns: 3fr 8fr; gap: 5rem; align-items: start; }
  .e-tira { margin: 0; background: var(--e-granate); isolation: isolate; position: relative; }
  .e-tira-img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; filter: grayscale(1) contrast(1.1) brightness(1.08); mix-blend-mode: multiply; }
  .e-pasos { display: grid; counter-reset: p; margin-top: 2rem; border-top: 1px solid var(--e-tinta); }
  .e-paso { display: grid; grid-template-columns: 9rem 1fr; gap: .2rem 2rem; padding: 1.6rem 0; border-bottom: 1px solid var(--e-linea); }
  .e-cita { grid-row: 1 / 3; font: 500 1.9rem/1.1 var(--s-fuente-titulo); color: var(--e-granate); }
  .e-paso h3 { margin: 0; }
  .e-paso p { margin: 0; color: var(--s-suave); }

  /* ─ conversación ─ */
  .e-mensajes { background: var(--s-superficie); padding: 6rem 0; border-block: 1px solid var(--e-linea); }
  .e-mensajes-rejilla { display: grid; grid-template-columns: 5fr 6fr; gap: 5rem; align-items: center; }
  .e-tarjeta { transform: rotate(1.2deg); }
  .s-chat { max-width: none; background: var(--s-superficie); border: 1px solid var(--e-tinta); border-radius: 0; box-shadow: 8px 9px 0 var(--e-sombra); }
  .s-chat-cabeza { border-bottom: 1px solid var(--e-tinta); padding: 1.1rem 1.4rem; }
  .s-chat-cabeza b { font: 500 1.35rem/1.2 var(--s-fuente-titulo); }
  .s-chat-aviso { font-size: .85rem; letter-spacing: .06em; font-weight: 600; color: var(--e-granate); }
  .s-chat-lista { padding: 1.4rem; gap: .7rem; }
  .s-burbuja { border-radius: 0; background: var(--s-fondo); max-width: 88%; padding: .8rem 1.1rem; line-height: 1.6; }
  .s-burbuja:not(.cliente) { background: var(--e-granate); color: var(--s-superficie); }
  .s-burbuja.cliente { border: 1px solid var(--e-tinta); background: var(--s-superficie); }
  .n-hueco { border: 0; border-bottom: 1px dotted currentColor; padding: 0; }
  .s-chat::after { content: ""; display: block; height: 22px; margin: 0 1.4rem 1.4rem; background: var(--e-barras); }

  /* ─ frasco y ficha de piel ─ */
  .e-ficha { padding: 6rem 0; }
  .e-ficha-rejilla { display: grid; grid-template-columns: 7fr 5fr; gap: 4rem; align-items: center; }
  .e-frasco { margin: 0 -4vw 0 0; background: var(--e-granate); isolation: isolate; }
  .e-frasco-img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; filter: grayscale(1) contrast(1.15) brightness(1.05); mix-blend-mode: multiply; }
  .e-ficha-papel { background: var(--s-superficie); border: 1px solid var(--e-tinta); padding: 2rem; transform: rotate(-1deg); box-shadow: 6px 7px 0 var(--e-sombra); margin-left: -6rem; position: relative; z-index: 2; }
  .e-renglones { display: grid; gap: .3rem; margin-bottom: 1.4rem; }
  .e-renglones li { display: flex; align-items: baseline; gap: .8rem; font-weight: 600; }
  .e-renglones i { flex: 1; border-bottom: 1px solid var(--e-tinta); height: 1.6rem; }
  .s-pruebas { grid-template-columns: 1fr 1fr; gap: 1rem 1.4rem; margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--e-linea); }
  .s-prueba b { font: 500 1.15rem/1.25 var(--s-fuente-titulo); color: var(--e-granate); }
  .s-prueba span:not(.ico) { font-size: .95rem; line-height: 1.5; color: var(--s-suave); }

  /* ─ lotes (paquetes) ─ */
  .e-precios { padding: 6rem 0; background: var(--s-superficie); border-top: 1px solid var(--e-linea); }
  .s-paquetes { counter-reset: lote; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 3rem; align-items: stretch; }
  .s-paquete { counter-increment: lote; border: 0; border-top: 1px solid var(--e-tinta); border-left: 1px solid var(--e-linea); padding: 2rem 1.8rem 2.2rem; position: relative; background: transparent; }
  .s-paquete:first-child { border-left: 0; padding-left: 0; }
  .s-paquete::before { content: "Nº " counter(lote, decimal-leading-zero); display: block; font: 600 .75rem/1 var(--s-fuente); letter-spacing: .18em; text-transform: uppercase; color: var(--s-suave); margin-bottom: 1.4rem; }
  .s-paquete.destacado { background: var(--e-granate); color: var(--s-superficie); border: 0; margin-block: -1.6rem; padding-block: 3.6rem 3.8rem; box-shadow: 8px 9px 0 var(--e-sombra); }
  .s-paquete.destacado::before { color: #F0D3D6; }
  .s-paquete-cabeza { justify-content: flex-start; }
  .s-paquete-cabeza h3 { font: 500 2rem/1.1 var(--s-fuente-titulo); margin: 0; }
  .s-insignia { background: var(--s-superficie); color: var(--e-granate); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; padding: .2rem .6rem; }
  .s-precio { margin: 1.4rem 0 0; max-width: none; }
  .s-precio b { font: 500 3.4rem/1 var(--s-fuente-titulo); display: block; color: var(--e-granate); }
  .s-paquete.destacado .s-precio b { color: var(--s-superficie); }
  .s-precio span { color: inherit; opacity: .85; }
  .s-cuota { font-size: 1.15rem; margin: .4rem 0 1.2rem; padding-bottom: 1.2rem; border-bottom: 1px solid currentColor; max-width: none; }
  .s-paquete-texto { font-size: 1.02rem; line-height: 1.65; }
  .s-paquete-nota { font-weight: 600; font-size: .95rem; margin: 0; }
  .s-iva { margin-top: 3.2rem; color: var(--s-suave); font-size: 1rem; }

  /* ─ cuenta de cabina ─ */
  .e-calc { padding: 6.5rem 0; }
  .s-calc { gap: 4rem; align-items: start; }
  .s-calc-campos { gap: 1.8rem; }
  .s-etiqueta-campo { font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; margin: 0; }
  .s-campo { background: transparent; border: 0; border-bottom: 1px solid var(--e-tinta); border-radius: 0; font: 500 2rem/1.2 var(--s-fuente-titulo); padding: .3rem 0; min-height: 60px; }
  .s-campo:focus { background: var(--s-superficie); }
  .s-campo::placeholder { font: 400 1rem var(--s-fuente); }
  .s-calc-resultado { background: var(--s-superficie); border: 1px solid var(--e-tinta); padding: 1.6rem 1.8rem 4.4rem; position: relative; transform: rotate(-1deg); box-shadow: 6px 7px 0 var(--e-sombra); }
  .s-calc-resultado::after { content: ""; position: absolute; left: 1.8rem; right: 1.8rem; bottom: 1.6rem; height: 24px; background: var(--e-barras); }
  .s-calc-t { font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; color: var(--s-suave); }
  .s-calc-mes { font: 500 clamp(3.2rem, 8vw, 5.6rem)/1 var(--s-fuente-titulo); color: var(--e-granate); margin: .4rem 0; }
  .s-nota { font-size: 1rem; max-width: 62ch; }
  .s-nota a { color: var(--e-granate); }

  /* ─ preguntas ─ */
  .e-faq { padding: 6rem 0; background: var(--s-superficie); border-top: 1px solid var(--e-linea); }
  .e-faq-rejilla { display: grid; grid-template-columns: 4fr 7fr; gap: 5rem; align-items: start; }
  .s-faq { counter-reset: q; }
  .s-pregunta { counter-increment: q; border-color: var(--e-linea); }
  .s-pregunta summary { list-style: none; display: grid; grid-template-columns: 3rem 1fr; gap: .8rem; align-items: baseline; font-size: 1.1rem; font-weight: 600; padding: 1.2rem 0; }
  .s-pregunta summary::-webkit-details-marker { display: none; }
  .s-pregunta summary::before { content: counter(q, upper-roman); font: 500 1.4rem/1 var(--s-fuente-titulo); color: var(--e-granate); }
  .s-pregunta[open] summary { color: var(--e-granate); }
  .s-pregunta p { margin-left: 3.8rem; max-width: 54ch; }

  /* ─ final granate con etiqueta ─ */
  .e-final { background: url("/fotos/estetica/lino-800.webp") center / cover, var(--e-granate); background-blend-mode: multiply; color: var(--s-superficie); padding: 7rem 0 6.5rem; }
  @media (min-width: 880px) { .e-final { background-image: url("/fotos/estetica/lino.webp"); } }
  .e-final .e-etiqueta { color: #F0D3D6; }
  .e-final-rejilla { display: grid; grid-template-columns: 5fr 6fr; gap: 5rem; align-items: start; }
  .e-final-texto p { color: #F8E6E4; font-size: 1.1rem; }
  .e-lista { display: grid; gap: .5rem; margin-top: 1.6rem; }
  .e-lista li { padding-left: 1.6rem; position: relative; }
  .e-lista li::before { content: ""; position: absolute; left: 0; top: .85rem; width: .8rem; border-top: 1px solid currentColor; }
  .e-final-etq { background: var(--s-superficie); color: var(--s-texto); padding: 2rem 2rem 1.6rem; border: 1px solid var(--e-tinta); box-shadow: 10px 11px 0 rgba(0, 0, 0, .3); }
  .e-final-etq .s-campo { border: 0; box-shadow: 0 0 0 1px var(--e-tinta); margin: 1px; width: calc(100% - 2px); background: var(--s-fondo); font: 400 1.05rem var(--s-fuente); padding: 0 1rem; min-height: 52px; }
  .e-final-etq .s-etiqueta-campo { margin-top: .6rem; }
  .e-final-etq .s-casilla { margin-block: 1rem; }
  .e-final-etq .s-boton { width: 100%; }
  .e-final-etq > .e-barras { margin-top: 1.6rem; }
  .e-final-etq [data-demo-vivo] { margin-top: 1.5rem; }

  .s-pie { border-top: 1px solid var(--e-linea); color: var(--s-suave); }
  .s-pie-fila { width: auto; margin-inline: 4vw; }

  @media (max-width: 879px) {
    p { max-width: none; }
    .e-heroe { display: block; padding: 0; min-height: 0; }
    .e-vertical { display: none; }
    .e-heroe-texto { padding: 2.4rem 5vw 1.8rem; }
    .e-h1 { font-size: 3rem; }
    .e-foto { height: 420px; margin-left: 12vw; }
    .e-etq { left: -12vw; bottom: -40px; width: 240px; }
    .e-lado { padding: 4.6rem 5vw 3rem; }
    .e-carta { padding: 4rem 0 3rem; }
    .e-carta-rejilla, .e-como-rejilla, .e-mensajes-rejilla, .e-ficha-rejilla, .e-faq-rejilla, .e-final-rejilla { display: block; }
    .e-carta-rejilla { padding-top: 3.5rem; }
    .e-muestra { width: 78%; margin-bottom: 2.4rem; }
    .e-it { flex-wrap: wrap; } .e-puntos { display: none; } .e-it-t { flex: 1; }
    .e-pr { width: 100%; padding-left: 3.4rem; }
    .e-problema, .e-como, .e-mensajes, .e-ficha, .e-precios, .e-calc, .e-faq { padding-block: 4rem; }
    .e-final { padding-block: 4.5rem; }
    .e-cabina-fig { height: 300px; }
    .e-cabina-pie { left: 5vw; right: 5vw; max-width: none; }
    .e-dolores { grid-template-columns: 1fr; }
    .e-dolor, .e-dolor:nth-child(even) { padding: 1.6rem 0; border-left: 0; }
    .e-rom { font-size: 3.4rem; }
    .e-tira { width: 56%; margin-bottom: 2.4rem; }
    .e-paso { grid-template-columns: 1fr; }
    .e-cita { grid-row: auto; margin-bottom: .3rem; }
    .e-tarjeta { margin-top: 2.2rem; transform: none; }
    .e-frasco { margin: 0 -4vw 2rem; }
    .e-ficha-papel { margin-left: 0; transform: none; padding: 1.4rem; }
    .s-pruebas { grid-template-columns: 1fr; }
    .s-paquetes { grid-template-columns: 1fr; }
    .s-paquete, .s-paquete:first-child { border-left: 0; padding: 1.8rem 0 2rem; }
    .s-paquete.destacado { margin: 1.2rem 0; padding: 2.4rem 1.4rem 2.6rem; }
    .s-calc-resultado { margin-top: 2.4rem; transform: none; }
    .s-pregunta p { margin-left: 0; }
    .e-final-etq { margin-top: 2.4rem; padding: 1.4rem; }
    .s-marca-fila, .s-pie-fila { margin-inline: 5vw; }
    .e-h2 { max-width: none; }
  }
}

}
