/* GENERADO por fuente/construir.py desde fuente/sectores/veterinarias/: no se edita a mano. */
@font-face { font-family: "Vet Titulos"; src: url(/fuentes/veterinarias/young-serif-latin-400.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Vet Texto"; src: url(/fuentes/veterinarias/andika-latin-400.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Vet Texto"; src: url(/fuentes/veterinarias/andika-latin-700.woff2) format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@layer sector {
/* veterinarias — «La cartilla» (v4). Papel crema con grano, tinta verde casi negra, terracota, sello de goma.
   CSS anidado: todo vive dentro de body[data-sector="veterinarias"] (lo exige el constructor). */
body[data-sector="veterinarias"] {
  --s-fondo: #F3EBDC; --s-superficie: #FFFAF0; --s-texto: #232B21; --s-suave: #565E50; --s-borde: #7D7560;
  --s-acento: #B8451A; --s-sobre-acento: #FFFAF0; --s-error: #8F1D1D;
  --s-fuente: "Vet Texto", Andika, "Trebuchet MS", sans-serif;
  --s-fuente-titulo: "Vet Titulos", "Young Serif", Georgia, serif;
  --s-base: 18px; --s-linea: 1.75; --s-medida: 36ch; --s-ancho: 72rem; --s-radio: 4px;
  --v-verde: #2E5A3F; --v-aviso: #8F1D1D; --v-sello: #E5B53B; --v-linea: #D3C6AA; --v-sombra: rgba(35, 43, 33, .16);
  --v-grano: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/><feColorMatrix values='0 0 0 0 .35 0 0 0 0 .3 0 0 0 0 .2 0 0 0 .2 0'/></filter><rect width='160' height='160' filter='u%72l(%23n)'/></svg>");
  /* Widget de la demo en vivo: se viste como una pieza más de la cartilla */
  --dv-fondo: #FFFAF0; --dv-superficie: #F3EBDC; --dv-texto: #232B21; --dv-texto-suave: #565E50; --dv-acento: #B8451A;
  --dv-acento-texto: #FFFAF0; --dv-radio: 4px 14px 4px 14px; --dv-fuente: "Vet Texto", Andika, sans-serif;
  --dv-sombra: 4px 4px 0 #232B21; --dv-borde: #232B21;

  background: var(--v-grano), var(--s-fondo);
  overflow-x: hidden;
  letter-spacing: .005em;

  h1, h2, h3 { font-weight: 400; letter-spacing: -.01em; }
  h3 { font-family: var(--s-fuente); font-weight: 700; font-size: 1.15rem; letter-spacing: 0; }
  p { max-width: 36ch; }
  .ico { display: none; }

  /* ─ tira de marca ─ */
  .s-marca { border-top: 0; border-bottom: 1px solid var(--v-linea); background: var(--v-grano), var(--s-fondo); }
  .s-marca-fila { width: auto; margin-inline: 4vw; }
  .s-marca-lema { font-size: .9rem; }

  /* ─ botón de goma ─ */
  .s-boton { background: var(--s-acento); color: var(--s-sobre-acento); border: 0; border-radius: 4px 14px 4px 14px; box-shadow: 4px 4px 0 var(--s-texto);
    font: 700 1.1rem/1.2 var(--s-fuente); padding: 1rem 1.7rem; min-height: 56px; transition: transform .12s, box-shadow .12s; }
  .s-boton:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0 var(--s-texto); }

  /* ─ primera pantalla ─ */
  .v-heroe { padding: 0; }
  .v-heroe-rejilla { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 1.5rem; padding: 3.5rem 4vw 0; position: relative; }
  .v-h1 { grid-column: 1 / 9; grid-row: 1; position: relative; z-index: 3; align-self: start; margin: 2rem 0 0;
    font-size: clamp(3rem, 6.6vw, 6.4rem); line-height: 1.04; letter-spacing: -.02em; text-wrap: initial; }
  .v-h1 em { font-style: normal; color: var(--s-acento); background: linear-gradient(transparent 62%, rgba(229, 181, 59, .42) 62%, rgba(229, 181, 59, .42) 90%, transparent 90%); }
  .v-foto { grid-column: 8 / 13; grid-row: 1 / 3; align-self: start; margin: -1.5rem -4vw 0 0; position: relative; height: 640px; }
  .v-foto-img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; filter: sepia(.22) saturate(1.05) contrast(1.03);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 12% 100%, 0 88%); }
  .v-sello { position: absolute; left: -70px; bottom: 70px; width: 170px; height: 170px; border-radius: 50%; border: 3px double var(--v-aviso); color: var(--v-aviso);
    display: grid; place-items: center; text-align: center; background: var(--s-superficie); transform: rotate(-12deg);
    font: 700 .8rem/1.25 var(--s-fuente); letter-spacing: .08em; text-transform: uppercase; box-shadow: 0 0 0 5px var(--s-superficie), 0 0 0 6px var(--v-aviso); }
  .v-sello strong { display: block; font: 400 1.9rem/1 var(--s-fuente-titulo); letter-spacing: 0; margin: .15rem 0; }
  .v-txt { grid-column: 1 / 6; grid-row: 2; align-self: end; margin-top: 2rem; padding-bottom: 3.5rem; }
  .v-etiqueta { font-size: .9rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--s-suave); margin: 0 0 var(--s-e2); max-width: none; }
  .v-lead { font-size: 1.2rem; max-width: 30ch; margin-bottom: 1.6rem; }
  .v-botonera { margin-bottom: 1.2rem; }
  .v-nota { font-size: .95rem; color: var(--s-suave); margin: 0; }

  /* ─ la banda verde y la hoja de cartilla ─ */
  .v-banda { background: var(--v-grano), var(--v-verde); color: var(--s-superficie); padding: 6rem 4vw 6.5rem; margin-top: 2rem; clip-path: polygon(0 3rem, 100% 0, 100% 100%, 0 100%); }
  .v-banda-cols { display: grid; grid-template-columns: 5fr 7fr; gap: 4rem; align-items: start; max-width: 76rem; margin-inline: auto; }
  .v-h2 { font-size: clamp(2.2rem, 3.8vw, 3.4rem); line-height: 1.1; margin-bottom: 1.2rem; text-wrap: initial; }
  .v-banda-texto p { color: #EDE6D3; font-size: 1.1rem; max-width: 28ch; }
  .v-banda-texto .v-h2 { margin-top: 1.5rem; }
  .v-hoja { background-color: var(--s-superficie); color: var(--s-texto); padding: 2rem 2.2rem 2.2rem 3.4rem; transform: rotate(1.6deg); box-shadow: 10px 12px 0 rgba(0, 0, 0, .22); position: relative;
    background-image: repeating-linear-gradient(transparent 0 2.75rem, var(--v-linea) 2.75rem calc(2.75rem + 1px)); background-position: 0 3.2rem; }
  .v-hoja::before { content: ""; position: absolute; left: 1.2rem; top: 1rem; bottom: 1rem; width: 10px;
    background: radial-gradient(circle, var(--v-verde) 0 4px, transparent 5px) 0 0 / 10px 2.2rem repeat-y; }
  .v-hoja-t { font: 700 .85rem/1.4 var(--s-fuente); letter-spacing: .14em; text-transform: uppercase; color: var(--s-suave); margin: 0 0 1rem; max-width: none; background: var(--s-superficie); }
  .v-hoja-filas { display: grid; }
  .v-fila { display: grid; grid-template-columns: 7.5rem 1fr auto; gap: 1rem; align-items: center; height: 2.75rem; font-size: 1.1rem; }
  .v-fecha { font-weight: 700; color: #A33A12; background: var(--s-superficie); justify-self: start; padding-right: .3rem; }
  .v-puesta { font: 700 .8rem/1.5 var(--s-fuente); font-style: normal; outline: 2px solid var(--v-verde); outline-offset: 4px; margin-right: 6px; color: var(--v-verde); padding: 0 .6rem; border-radius: 3px; background: var(--s-superficie); }
  .v-toca { color: var(--v-aviso); background: var(--s-superficie); }
  .v-vac { background: var(--s-superficie); justify-self: start; }

  /* ─ secciones sobre papel ─ */
  .v-seccion { padding-block: clamp(64px, 9vw, 120px); }
  .v-ancho { width: min(72rem, 100% - 8vw); margin-inline: auto; }
  .v-cols-57 { display: grid; grid-template-columns: 5fr 7fr; gap: 4rem; align-items: start; }
  .v-cols-75 { display: grid; grid-template-columns: 7fr 5fr; gap: 4rem; align-items: center; }
  .v-cols-57b { display: grid; grid-template-columns: 5fr 7fr; gap: 4rem; align-items: center; }
  .v-intro { margin-bottom: 2rem; }

  .v-foto-vert { margin: 0; transform: rotate(-1.4deg); }
  .v-recorte { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; filter: sepia(.22) saturate(1.05);
    clip-path: polygon(0 0, 100% 5%, 100% 100%, 9% 100%, 0 93%); }
  .v-lista { display: grid; margin-top: 1.5rem; }
  .v-renglon { display: grid; grid-template-columns: 3.4rem 1fr; gap: 1rem; padding: 1.1rem 0; border-bottom: 1px solid var(--v-linea); }
  .v-renglon:first-child { border-top: 1px solid var(--v-linea); }
  .v-n { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border: 2px solid var(--v-verde); color: var(--v-verde); border-radius: 3px;
    font: 400 1.5rem/1 var(--s-fuente-titulo); transform: rotate(-4deg); }
  .v-renglon p { margin: 0; color: var(--s-suave); }
  .v-renglon h3 { margin-bottom: .2rem; }

  .v-como { background: var(--v-grano), var(--s-superficie); border-block: 1px dashed var(--s-borde); }
  .v-pasos { display: grid; gap: 1.6rem; margin-top: 2rem; }
  .v-paso { display: grid; grid-template-columns: 4.2rem 1fr; gap: 0 1.2rem; align-items: start; }
  .v-paso:nth-child(2) { margin-left: 2.5rem; }
  .v-paso:nth-child(3) { margin-left: 5rem; }
  .v-pegatina { display: grid; place-items: center; grid-row: 1 / 3; width: 3.6rem; height: 3.6rem; background: var(--v-sello); color: var(--s-texto);
    border-radius: 3px 14px 3px 14px; font: 400 1.9rem/1 var(--s-fuente-titulo); transform: rotate(-5deg); box-shadow: 2px 3px 0 var(--v-sombra); }
  .v-paso h3 { margin: 0; align-self: end; }
  .v-paso p { margin: 0; color: var(--s-suave); }
  .v-foto-cuadrada { margin: 0 -4vw 0 0; }
  .v-recorte-2 { width: 100%; aspect-ratio: 1; object-fit: cover; filter: sepia(.22) saturate(1.05); clip-path: polygon(0 0, 88% 0, 100% 12%, 100% 100%, 0 100%); }

  .v-mensajes-texto p { margin-bottom: 1.2rem; }
  .v-aparte { border-left: 4px solid var(--v-aviso); padding-left: 1rem; color: var(--v-aviso); font-weight: 700; }
  .v-papel { transform: rotate(-1deg); }
  .s-chat { max-width: none; background: var(--s-superficie); border: 2px solid var(--s-texto); border-radius: 2px; box-shadow: 8px 8px 0 var(--v-sombra); }
  .s-chat-cabeza { border-bottom: 2px dashed var(--s-borde); padding: 1.1rem 1.4rem; }
  .s-chat-cabeza b { font: 400 1.25rem/1.3 var(--s-fuente-titulo); }
  .s-chat-aviso { font-weight: 700; color: var(--v-aviso); font-size: .9rem; }
  .s-chat-lista { padding: 1.4rem; gap: .8rem; }
  .s-burbuja { max-width: 88%; padding: .7rem 1rem; border-radius: 2px 16px 16px 16px; background: var(--v-verde); color: var(--s-superficie); line-height: 1.55; }
  .s-burbuja.cliente { border: 2px solid var(--s-texto); background: var(--s-fondo); color: var(--s-texto); border-radius: 16px 2px 16px 16px; }
  .n-hueco { border: 1px dashed currentColor; font-size: .9em; }

  /* ─ franja de objetos (imagen generada con IA) ─ */
  .v-objetos { margin: 0; }
  .v-objetos-fig { margin: 0; height: clamp(180px, 22vw, 300px); overflow: hidden; clip-path: polygon(0 0, 100% 14%, 100% 100%, 0 86%); margin-block: -1.5rem; }
  .v-objetos-img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; filter: sepia(.22) saturate(.95); }
  .v-botiquin { margin: 2.2rem 0 0; width: min(15rem, 70%); transform: rotate(-2.5deg); box-shadow: 6px 7px 0 rgba(0, 0, 0, .25); border: 6px solid var(--s-superficie); background: var(--s-superficie); }
  .v-botiquin-img { width: 100%; aspect-ratio: 1; object-fit: cover; filter: sepia(.22); }

  /* ─ lo que ya sabemos: etiquetas pegadas ─ */
  .v-franja { padding-block: 3rem; border-block: 1px solid var(--v-linea); }
  .s-pruebas { gap: 1.2rem; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); margin-top: .5rem; }
  .s-prueba { background: var(--s-superficie); border: 2px solid var(--v-verde); padding: .9rem 1.1rem 1rem; border-radius: 3px; box-shadow: 3px 3px 0 var(--v-sombra); gap: .2rem; }
  .s-prueba:nth-child(odd) { transform: rotate(-.9deg); }
  .s-prueba:nth-child(even) { transform: rotate(.7deg) translateY(4px); }
  .s-prueba b { font: 400 1.3rem/1.2 var(--s-fuente-titulo); color: var(--v-verde); }
  .s-prueba span:not(.ico) { color: var(--s-suave); font-size: 1rem; line-height: 1.5; }

  /* ─ placas de collar ─ */
  .s-paquetes { grid-template-columns: repeat(3, 1fr); gap: 1.6rem; align-items: start; margin-top: 2.4rem; }
  .s-paquete { position: relative; background: var(--s-superficie); border: 2px solid var(--s-texto); border-radius: 4px 30px 4px 30px; padding: 3.4rem 1.6rem 1.8rem; box-shadow: 6px 6px 0 var(--v-sombra); }
  .s-paquete::before { content: ""; position: absolute; top: 1.1rem; left: 50%; width: 18px; height: 18px; margin-left: -9px; border: 2px solid var(--s-texto); border-radius: 50%; background: var(--s-fondo); }
  .s-paquete:nth-child(1) { transform: rotate(-1deg); }
  .s-paquete:nth-child(2) { transform: translateY(-1.4rem) rotate(.8deg); }
  .s-paquete:nth-child(3) { transform: rotate(-.5deg) translateY(.6rem); }
  .s-paquete.destacado { background: var(--v-verde); color: var(--s-superficie); border-width: 2px; border-color: var(--s-texto); box-shadow: 8px 8px 0 var(--s-texto); }
  .s-paquete.destacado::before { background: var(--v-sello); }
  .s-paquete-cabeza { justify-content: center; text-align: center; }
  .s-paquete-cabeza h3 { font: 400 1.7rem/1.1 var(--s-fuente-titulo); margin: 0; width: 100%; text-align: center; }
  .s-insignia { background: var(--v-sello); color: var(--s-texto); padding: .1rem .7rem; border-radius: 3px; transform: rotate(-3deg); font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; margin-top: .4rem; }
  .s-precio { margin: 1.2rem 0 0; text-align: center; max-width: none; }
  .s-precio b { font: 400 2.8rem/1 var(--s-fuente-titulo); color: var(--s-acento); display: block; }
  .s-paquete.destacado .s-precio b { color: var(--v-sello); }
  .s-precio span { color: inherit; opacity: .85; font-size: .95rem; }
  .s-cuota { text-align: center; font-size: 1.15rem; margin: .4rem 0 1rem; max-width: none; border-bottom: 1px dashed currentColor; padding-bottom: 1rem; }
  .s-paquete-texto { font-size: 1.02rem; line-height: 1.65; margin-bottom: .6rem; }
  .s-paquete-nota { font-size: .95rem; margin: 0; font-weight: 700; }
  .s-iva { margin-top: 2.6rem; font-size: 1rem; max-width: 60ch; }

  /* ─ tabla de peso ─ */
  .v-calc { background: var(--v-grano), var(--s-superficie); border-block: 1px dashed var(--s-borde); }
  .s-calc { gap: 3rem; align-items: start; }
  .s-calc-campos { gap: 1.6rem; }
  .s-etiqueta-campo { font-weight: 700; margin: 0; }
  .s-campo { background: transparent; border: 0; border-bottom: 3px solid var(--s-texto); border-radius: 0; font: 400 1.7rem/1.2 var(--s-fuente-titulo); padding: .3rem .2rem; min-height: 56px; }
  .s-campo:focus { background: rgba(229, 181, 59, .25); }
  .s-campo::placeholder { font: 400 1rem var(--s-fuente); }
  .s-calc-resultado { position: relative; background: var(--s-fondo); border: 2px solid var(--s-texto); padding: 1.6rem 1.8rem 3.6rem; transform: rotate(.8deg); box-shadow: 6px 6px 0 var(--v-sombra); }
  .s-calc-resultado::after { content: ""; position: absolute; left: 1.4rem; right: 1.4rem; bottom: 1rem; height: 1.3rem;
    background: repeating-linear-gradient(90deg, var(--s-texto) 0 2px, transparent 2px 14px) 0 100% / 100% 55% no-repeat,
                repeating-linear-gradient(90deg, var(--s-texto) 0 2px, transparent 2px 70px) 0 100% / 100% 100% no-repeat; }
  .s-calc-mes { font: 400 clamp(3rem, 8vw, 5.2rem)/1 var(--s-fuente-titulo); color: var(--s-acento); margin: .3rem 0; }
  .s-calc-t { font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: .9rem; color: var(--s-suave); }
  .s-nota { font-size: 1rem; max-width: 60ch; }
  .s-nota a { color: var(--s-acento); }

  /* ─ preguntas ─ */
  .v-faq-lado { position: sticky; top: 2rem; }
  .v-foto-siesta { margin: 2rem 0 0; max-width: 18rem; }
  .v-recorte-3 { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: sepia(.22); clip-path: polygon(0 0, 100% 0, 100% 90%, 85% 100%, 0 100%); }
  .s-pregunta { border-color: var(--s-borde); }
  .s-pregunta summary { list-style: none; display: grid; grid-template-columns: 1.7rem 1fr; gap: .9rem; align-items: start; font-size: 1.15rem; padding: 1.1rem 0; line-height: 1.4; }
  .s-pregunta summary::-webkit-details-marker { display: none; }
  .s-pregunta summary::before { content: ""; width: 1.5rem; height: 1.5rem; margin-top: .1rem; border: 2px solid var(--v-verde); border-radius: 3px; background: var(--s-superficie); }
  .s-pregunta[open] summary::before { background: var(--v-verde) radial-gradient(circle at 50% 50%, var(--s-superficie) 0 3px, transparent 4px); }
  .s-pregunta p { margin-left: 2.6rem; max-width: 52ch; }

  /* ─ final verde con formulario ─ */
  .v-final { background: var(--v-grano), var(--v-verde); color: var(--s-superficie); padding: 7rem 4vw 6rem; margin-top: 3rem; clip-path: polygon(0 3rem, 100% 0, 100% 100%, 0 100%); }
  .v-final-cols { display: grid; grid-template-columns: 5fr 6fr; gap: 4rem; max-width: 72rem; margin-inline: auto; align-items: start; }
  .v-final .v-etiqueta { color: #D9D2BC; }
  .v-final-texto p { color: #EDE6D3; font-size: 1.1rem; }
  .v-ticks { display: grid; gap: .5rem; margin-top: 1.4rem; }
  .v-ticks li { padding-left: 2rem; position: relative; }
  .v-ticks li::before { content: ""; position: absolute; left: 0; top: .35rem; width: 1.1rem; height: 1.1rem; border: 2px solid var(--v-sello); border-radius: 3px; }
  .v-final-papel { background: var(--s-superficie); color: var(--s-texto); padding: 2rem; border: 2px solid var(--s-texto); box-shadow: 10px 12px 0 rgba(0, 0, 0, .25); }
  .v-final-papel .s-campo { font: 400 1.1rem var(--s-fuente); border: 0; box-shadow: 0 0 0 2px var(--s-texto); margin: 2px; width: calc(100% - 4px); border-radius: 3px; background: var(--s-fondo); padding: 0 1rem; min-height: 52px; }
  .v-final-papel .s-etiqueta-campo { margin-top: .6rem; }
  .v-final-papel .s-casilla { margin-block: 1rem; }
  .v-final-papel .s-boton { width: 100%; }
  .v-final-papel [data-demo-vivo] { margin-top: 1.5rem; }

  /* ─ pie ─ */
  .s-pie { border-top: 1px dashed var(--s-borde); color: var(--s-suave); background: var(--v-grano), var(--s-fondo); }
  .s-pie-fila { width: auto; margin-inline: 4vw; }

  /* ─ móvil ─ */
  @media (max-width: 879px) {
    .v-heroe-rejilla { display: block; padding: 2rem 5vw 0; }
    .v-h1 { font-size: 2.9rem; margin: 0; }
    .v-foto { margin: 2rem -5vw 0; height: 400px; }
    .v-foto-img { clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 100%); }
    .v-sello { left: auto; right: 14px; bottom: -34px; width: 124px; height: 124px; font-size: .6rem; }
    .v-sello strong { font-size: 1.35rem; }
    .v-txt { padding: 3.4rem 0 2.5rem; }
    .v-banda { padding: 4.5rem 5vw 4.5rem; clip-path: polygon(0 2rem, 100% 0, 100% 100%, 0 100%); }
    .v-banda-cols, .v-cols-57, .v-cols-75, .v-cols-57b, .v-final-cols { display: block; }
    .v-hoja { margin-top: 2.4rem; padding: 1.4rem 1rem 1.6rem 2.6rem; transform: rotate(1deg); }
    .v-fila { grid-template-columns: 4.8rem 1fr auto; font-size: 1rem; gap: .5rem; }
    .v-foto-vert { margin: 0 0 2.4rem; width: 82%; }
    .v-paso:nth-child(2) { margin-left: .8rem; }
    .v-paso:nth-child(3) { margin-left: 1.6rem; }
    .v-foto-cuadrada { margin: 2.4rem 0 0; width: 82%; margin-left: auto; margin-right: 0; }
    .v-papel { margin-top: 2rem; }
    .s-paquetes { grid-template-columns: 1fr; gap: 1.8rem; }
    .s-paquete:nth-child(n) { transform: rotate(-.6deg); }
    .s-paquete:nth-child(2) { transform: rotate(.6deg); }
    .s-calc-resultado { margin-top: 2rem; }
    .v-faq-lado { position: static; margin-bottom: 1.4rem; }
    .v-foto-siesta { display: none; }
    .v-objetos-fig { height: 150px; }
    .v-final { padding: 5rem 5vw 4rem; clip-path: polygon(0 2rem, 100% 0, 100% 100%, 0 100%); }
    .v-final-papel { margin-top: 2.4rem; padding: 1.4rem; transform: none; }
    .s-marca-fila, .s-pie-fila { margin-inline: 5vw; }
    p { max-width: none; }
  }
}

}
