/* ============================================================
   Sitioideal — Diseño «Toga» (abogados, despachos jurídicos, bufetes y notarías) · paso 7.z.59a
   Va encima de sitio.css. Serio y de prestigio, como el expediente de un despacho: papel marfil con un filete doble
   fino, la tinta oscura (el color principal oscurecido) y el acento en los números de los capítulos, de los artículos
   y de las secciones. Serifa clásica para los títulos (EB Garamond, con versalitas) y una letra clara para el texto
   (Schibsted Grotesk).
   La portada lleva el expediente (la carpeta del color del negocio con su pestaña, la hoja con el lugar y la fecha de
   hoy, la foto, la firma y el lacre con la balanza); los servicios legales, un pliego con sus capítulos en números
   romanos y cada servicio como un artículo con sus honorarios; la galería, los anexos sujetos con su clip. Cada título
   lleva su número de sección («§ 1», «§ 2»…) y abajo un filete doble.
   Los textos usan el color principal oscurecido para que siempre se lean.
   HTML propio: app/vistas/sitio/disenos/toga/
   ============================================================ */

.diseno-toga {
    --tg-titulo: "EB Garamond", "Garamond", "Iowan Old Style", Georgia, serif;
    --tg-letra: "Schibsted Grotesk", "Segoe UI", system-ui, sans-serif;
    --tg-papel: color-mix(in srgb, var(--c-fondo) 30%, #F8F5EE);                    /* el papel marfil */
    --tg-papel-2: color-mix(in srgb, var(--c-primario) 6%, #F1ECE1);
    --tg-blanco: #FFFEFB;
    --tg-tinta: color-mix(in srgb, var(--c-primario) 30%, #15171E);
    --tg-tinta-suave: color-mix(in srgb, var(--tg-tinta) 74%, transparent);
    --tg-principal: color-mix(in srgb, var(--c-primario) 86%, #000);
    --tg-principal-oscuro: color-mix(in srgb, var(--tg-principal) 70%, #000);
    --tg-acento: var(--c-acento);
    --tg-acento-texto: color-mix(in srgb, var(--c-acento) 60%, #2A1A06);           /* el acento, para leerse en lo claro */
    --tg-carpeta: color-mix(in srgb, var(--c-primario) 78%, #3A2A12);              /* la carpeta del expediente */
    --tg-suave: color-mix(in srgb, var(--c-primario) 8%, var(--tg-blanco));
    --tg-linea: color-mix(in srgb, var(--tg-tinta) 14%, transparent);
    --tg-linea-fuerte: color-mix(in srgb, var(--tg-tinta) 30%, transparent);
    --tg-sombra: 0 18px 34px -26px rgba(20, 18, 12, .55), 0 1px 2px rgba(20, 18, 12, .08);

    /* Superficies (sitio.css) */
    --s-fondo: var(--tg-papel);
    --s-alterna: var(--tg-papel-2);
    --s-tarjeta: var(--tg-blanco);
    --s-tarjeta-alterna: var(--tg-blanco);
    --s-encabezado: var(--tg-papel);
    --s-texto: var(--tg-tinta);
    --s-titulo: var(--tg-tinta);
    --s-linea: var(--tg-linea);
    --s-linea-fuerte: var(--tg-linea-fuerte);

    background: var(--tg-papel);
    font-family: var(--tg-letra);
    font-size: 1.03rem;
}

/* Donde el navegador puede, cada color se ajusta solo lo necesario para leerse sobre el papel */
@supports (color: oklch(from red l c h)) {
    .diseno-toga {
        --tg-principal: oklch(from var(--c-primario) min(l, .42) c h);
        --tg-tinta: oklch(from color-mix(in srgb, var(--c-primario) 30%, #15171E) min(l, .24) c h);
        --tg-acento-texto: oklch(from var(--c-acento) min(l, .45) c h);   /* .45: también sobre el papel alterno */
        --tg-carpeta: oklch(from color-mix(in srgb, var(--c-primario) 78%, #3A2A12) min(l, .4) c h);
    }
}

/* Títulos con serifa clásica */
.diseno-toga h1,
.diseno-toga h2,
.diseno-toga h3,
.diseno-toga h4,
.diseno-toga .logo__nombre,
.diseno-toga .especial__titulo,
.diseno-toga .equipo__titulo,
.diseno-toga .persona__nombre,
.diseno-toga .promocion__titulo,
.diseno-toga .servicio__nombre,
.diseno-toga .sucursal__nombre,
.diseno-toga .redes__titulo {
    font-family: var(--tg-titulo);
    font-stretch: normal;
    font-weight: 600;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

/* ---------- Encabezado: el papel con su filete ---------- */
.diseno-toga .encabezado {
    border-bottom: 3px double var(--tg-linea-fuerte);
    background: color-mix(in srgb, var(--tg-papel) 94%, transparent);
    backdrop-filter: saturate(1.1) blur(10px);
}
.diseno-toga .logo__nombre { color: var(--tg-tinta); font-size: 1.5rem; font-weight: 600; }
.diseno-toga .menu { column-gap: 20px; }   /* «Servicios legales» es largo: así caben las diez secciones en un renglón */
.diseno-toga .menu a { color: var(--tg-tinta); font-size: .9rem; font-weight: 500; }
.diseno-toga .menu a:hover { color: var(--tg-principal); }

/* ---------- Botones: sobrios, de esquinas casi rectas ---------- */
.diseno-toga .boton {
    border-radius: 4px;
    font-family: var(--tg-letra);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: .01em;
}
.diseno-toga .boton--principal { border: 0; background: var(--tg-principal); color: #FFFFFF; box-shadow: 0 10px 20px -14px color-mix(in srgb, var(--tg-principal) 90%, transparent); }
.diseno-toga .boton--principal:hover { background: var(--tg-principal-oscuro); }
.diseno-toga .boton--secundario { border: 1px solid var(--tg-tinta); background: transparent; color: var(--tg-tinta); }
.diseno-toga .boton--secundario:hover { background: var(--tg-tinta); color: var(--tg-papel); }
.diseno-toga .boton-chico { border-radius: 4px; }

/* ---------- Portada: el expediente ---------- */
.tg-portada {
    position: relative;
    padding-top: clamp(40px, 5vw, 80px);
    overflow: hidden;
    background: linear-gradient(180deg, var(--tg-papel), color-mix(in srgb, var(--tg-suave) 50%, var(--tg-papel)));
    color: var(--tg-tinta);
}
/* El filete doble, como el de un título o un diploma (solo adorno) */
.tg-portada::before {
    content: "";
    position: absolute;
    inset: clamp(10px, 1.6vw, 20px);
    border: 3px double var(--tg-linea-fuerte);
    pointer-events: none;
}
.tg-portada__rejilla {
    position: relative;
    display: grid;
    gap: 40px;
    padding-bottom: clamp(56px, 6vw, 92px);
}
@media (min-width: 900px) {
    .tg-portada__rejilla { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: center; gap: 60px; }
}

/* El giro en versalitas entre dos filetes, con la balanza */
.tg-giro {
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 100%;
    margin: 0 0 18px;
    color: var(--tg-acento-texto);
    font-family: var(--tg-titulo);
    font-size: 1.22rem;
    font-variant-caps: all-small-caps;
    font-weight: 600;
    letter-spacing: .16em;
    line-height: 1.2;
    overflow-wrap: anywhere;
}
.tg-giro::after { content: ""; flex: 1; max-width: 90px; min-width: 24px; height: 1px; background: currentColor; opacity: .6; }
.tg-giro .icono { flex: none; width: 24px; height: 24px; stroke-width: 1.7; }
.tg-portada__nombre {
    margin: 0 0 14px;
    color: var(--tg-tinta);
    font-size: clamp(2.9rem, 1.5rem + 4.3vw, 5.2rem);
    font-weight: 600 !important;
    letter-spacing: -.01em !important;
    line-height: 1;
    overflow-wrap: anywhere;
}
.tg-portada__nombre--medio { font-size: clamp(2.6rem, 1.4rem + 3.6vw, 4.4rem); }
.tg-portada__nombre--largo { font-size: clamp(2.2rem, 1.2rem + 2.9vw, 3.7rem); }
.tg-portada__eslogan {
    max-width: 40ch;
    margin: 0 0 16px;
    color: var(--tg-tinta-suave);
    font-family: var(--tg-titulo);
    font-size: clamp(1.25rem, 1.1rem + .4vw, 1.5rem);
    font-style: italic;
    line-height: 1.4;
}
.tg-membrete {
    display: inline-block;
    margin: 0 0 26px;
    padding: 6px 0;
    border-top: 1px solid var(--tg-linea-fuerte);
    border-bottom: 1px solid var(--tg-linea-fuerte);
    color: var(--tg-tinta);
    font-family: var(--tg-titulo);
    font-size: 1.08rem;
    font-variant-caps: all-small-caps;
    font-weight: 600;
    letter-spacing: .14em;
}
.tg-portada__botones { margin-bottom: 22px; }
.diseno-toga .estado-ahora--claro { border-color: var(--tg-linea-fuerte); border-radius: 4px; background: var(--tg-blanco); box-shadow: none; }

/* El expediente: la carpeta con su pestaña y la hoja encima */
.tg-portada__visual { position: relative; justify-self: center; width: min(100%, 430px); padding: 8px 14px 26px 0; box-sizing: border-box; }
.tg-expediente { position: relative; padding: 26px 0 0; transform: rotate(1.6deg); }
.tg-expediente::before {
    content: "";
    position: absolute;
    inset: 26px 0 0;
    border-radius: 3px 8px 8px 8px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .1), transparent 30%),
        var(--tg-carpeta);
    box-shadow: 0 30px 46px -30px rgba(20, 15, 5, .75);
}
.tg-expediente__pestana {
    position: absolute;
    top: 0;
    left: 0;
    padding: 6px 22px 10px;
    border-radius: 8px 8px 0 0;
    background: var(--tg-carpeta);
    color: rgba(255, 255, 255, .9);
    font-family: var(--tg-titulo);
    font-size: 1rem;
    font-variant-caps: all-small-caps;
    font-weight: 600;
    letter-spacing: .2em;
    line-height: 1.2;
}
.tg-hoja {
    position: relative;
    margin: 18px 16px 18px 14px;
    padding: 14px 16px 12px;
    border: 1px solid rgba(0, 0, 0, .06);
    background: var(--tg-blanco);
    box-shadow: 0 14px 26px -16px rgba(20, 15, 5, .6);
    transform: rotate(-3.2deg);
}
.tg-hoja__fecha {
    margin: 0 0 10px;
    color: var(--tg-tinta-suave);
    font-family: var(--tg-titulo);
    font-size: .98rem;
    font-style: italic;
    line-height: 1.25;
    text-align: right;
}
.tg-hoja__foto { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--tg-linea); background: var(--tg-suave); }
.tg-hoja__foto picture,
.tg-hoja__foto picture img { display: block; width: 100%; height: 100%; }
.tg-hoja__foto picture img { object-fit: cover; }
/* La nota de IA arriba a la izquierda (abajo a la derecha va el lacre) */
.tg-hoja__foto > .marca-ia--foto { top: 8px; bottom: auto; left: 8px; transform: none; }
/* Sin foto: la balanza grande */
.tg-hoja__foto--dibujo { display: grid; place-items: center; background: linear-gradient(180deg, var(--tg-suave), color-mix(in srgb, var(--c-primario) 14%, #FFFEFB)); }
.tg-hoja__balanza { display: grid; place-items: center; width: 52%; aspect-ratio: 1; color: var(--tg-principal); }
.tg-hoja__balanza .icono { width: 100%; height: 100%; stroke-width: 1.1; }
/* Las líneas de la firma */
.tg-hoja__firma { display: grid; justify-items: center; gap: 4px; width: 62%; margin: 22px auto 2px; color: var(--tg-tinta-suave); font-family: var(--tg-titulo); font-size: .86rem; font-variant-caps: all-small-caps; letter-spacing: .14em; line-height: 1.2; text-align: center; overflow-wrap: anywhere; }
.tg-hoja__raya { display: block; width: 100%; border-top: 1px solid var(--tg-tinta); }

/* El lacre con la balanza */
.tg-lacre {
    position: absolute;
    right: -10px;
    bottom: -14px;
    z-index: 2;
    display: grid;
    place-items: center;
    width: clamp(70px, 5vw + 34px, 92px);
    aspect-ratio: 1;
    background: radial-gradient(circle at 38% 34%, color-mix(in srgb, var(--c-acento) 70%, #FFFFFF) 0, var(--c-acento) 34%, color-mix(in srgb, var(--c-acento) 70%, #000) 100%);
    clip-path: polygon(100% 50%, 94.8% 57.9%, 97% 67.1%, 89.4% 72.8%, 88.3% 82.1%, 79.2% 84.9%, 75% 93.3%, 65.6% 92.8%, 58.7% 99.2%, 50% 95.5%, 41.3% 99.2%, 34.4% 92.8%, 25% 93.3%, 20.8% 84.9%, 11.7% 82.1%, 10.6% 72.8%, 3% 67.1%, 5.2% 57.9%, 0 50%, 5.2% 42.1%, 3% 32.9%, 10.6% 27.2%, 11.7% 17.9%, 20.8% 15.1%, 25% 6.7%, 34.4% 7.2%, 41.3% .8%, 50% 4.5%, 58.7% .8%, 65.6% 7.2%, 75% 6.7%, 79.2% 15.1%, 88.3% 17.9%, 89.4% 27.3%, 97% 32.9%, 94.8% 42.1%);
    color: color-mix(in srgb, var(--c-sobre-acento) 80%, transparent);
    transform: rotate(-14deg);
    filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .35));
}
.tg-lacre::before { content: ""; position: absolute; inset: 15%; border: 1.5px solid currentColor; border-radius: 50%; opacity: .55; }
.tg-lacre .icono { width: 44%; height: 44%; stroke-width: 1.6; }

@media (max-width: 899.98px) {
    .tg-portada__visual { width: min(100%, 410px); }
}
@media (max-width: 599.98px) {
    .tg-portada__visual { width: min(100%, 350px); padding: 0 10px 22px 0; }
    .tg-hoja { margin: 16px 12px 16px 10px; padding: 12px 12px 10px; }
    .tg-hoja__fecha { font-size: .86rem; }
    .tg-lacre { right: -6px; width: 64px; }
}

/* ---------- Títulos de sección: con su número de sección y un filete doble ---------- */
.diseno-toga main { counter-reset: tg-seccion; }
.diseno-toga .seccion h2 {
    color: var(--tg-tinta);
    font-size: clamp(2.3rem, 1.7rem + 1.9vw, 3.2rem);
    font-weight: 600;
    line-height: 1.05;
}
.diseno-toga .seccion h2::before {
    counter-increment: tg-seccion;
    content: "§ " counter(tg-seccion);
    display: inline-block;
    margin-right: .4em;
    color: var(--tg-acento-texto);
    font-size: .5em;
    font-style: italic;
    font-weight: 500;
    vertical-align: .32em;
    white-space: nowrap;
}
.diseno-toga .seccion h2::after {
    content: "";
    display: block;
    width: 80px;
    height: 4px;
    margin-top: 14px;
    border-top: 1px solid var(--tg-acento-texto);
    border-bottom: 1px solid var(--tg-acento-texto);
}
.diseno-toga .seccion [style*="text-align: center"] h2::after,
.diseno-toga .seccion .centrado h2::after { margin-inline: auto; }

.tg-cabeza { margin-bottom: 30px; }
.tg-cabeza h2 { margin: 0 !important; }
.tg-antetitulo {
    margin: 0 0 6px;
    color: var(--tg-acento-texto);
    font-family: var(--tg-titulo);
    font-size: 1.1rem;
    font-variant-caps: all-small-caps;
    font-weight: 600;
    letter-spacing: .16em;
    line-height: 1.2;
}

/* ---------- Servicios legales: el pliego con sus capítulos y artículos ---------- */
.diseno-toga .catalogo__indice a {
    border: 1px solid var(--tg-linea-fuerte);
    border-radius: 4px;
    background: var(--tg-blanco);
    color: var(--tg-tinta);
    font-weight: 500;
    white-space: nowrap;
}
.diseno-toga .catalogo__indice a:hover { border-color: var(--tg-principal); color: var(--tg-principal); }

.tg-pliego {
    position: relative;
    padding: clamp(26px, 4vw, 52px) clamp(18px, 4.4vw, 60px);
    border: 1px solid var(--tg-linea);
    background: var(--tg-blanco);
    box-shadow: var(--tg-sombra);
}
.tg-pliego::before { content: ""; position: absolute; inset: 9px; border: 1px solid var(--tg-linea); pointer-events: none; }
.tg-capitulo { position: relative; }
.tg-capitulo + .tg-capitulo { margin-top: 42px; padding-top: 38px; border-top: 3px double var(--tg-linea-fuerte); }
.tg-capitulo__nombre { display: grid; justify-items: center; gap: 4px; margin: 0 0 8px; text-align: center; }
.tg-capitulo__numero { color: var(--tg-acento-texto); font-family: var(--tg-titulo); font-size: 1.02rem; font-variant-caps: all-small-caps; font-weight: 600; letter-spacing: .22em; }
.tg-capitulo__titulo { display: inline-flex; align-items: center; gap: 10px; color: var(--tg-tinta); font-size: clamp(1.55rem, 1.3rem + .8vw, 2rem); line-height: 1.15; }
.tg-capitulo__titulo .icono { flex: none; width: 26px; height: 26px; color: var(--tg-principal); stroke-width: 1.6; }
.tg-capitulo__descripcion { max-width: 60ch; margin: 0 auto 6px; color: var(--tg-tinta-suave); font-family: var(--tg-titulo); font-size: 1.12rem; font-style: italic; text-align: center; }

.tg-articulos { display: grid; grid-template-columns: minmax(0, 1fr); margin: 14px 0 0; padding: 0; list-style: none; }
@media (min-width: 900px) {
    .tg-articulos { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 54px; }
}
.tg-articulo {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 22px 0 20px;
    border-bottom: 1px dotted var(--tg-linea-fuerte);
    color: var(--tg-tinta);
}
.tg-articulo__numero { margin: 0 0 4px; color: var(--tg-acento-texto); font-family: var(--tg-titulo); font-size: 1rem; font-style: italic; font-weight: 600; letter-spacing: .03em; }
.tg-articulo__solicitado {
    position: absolute;
    top: 20px;
    right: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 0;
    padding: 3px 10px;
    border: 1px solid var(--tg-acento-texto);
    border-radius: 3px;
    color: var(--tg-acento-texto);
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.tg-articulo__solicitado .icono { flex: none; width: 13px; height: 13px; fill: currentColor; }
.tg-articulo__cuerpo { flex: 1; }
.tg-articulo__cuerpo::after { content: ""; display: block; clear: both; }
.tg-articulo__foto { position: relative; float: right; width: 96px; aspect-ratio: 1; margin: 2px 0 8px 16px; overflow: hidden; border: 4px solid var(--tg-blanco); box-shadow: 0 0 0 1px var(--tg-linea), 0 8px 14px -10px rgba(0, 0, 0, .5); }
.tg-articulo__foto img { width: 100%; height: 100%; object-fit: cover; }
/* La nota de IA a lo ancho de la foto chica, en dos renglones */
.tg-articulo__foto > .marca-ia--foto { right: 2px; bottom: 2px; left: 2px; width: auto; max-width: none; padding: 1px 4px; border-radius: 4px; font-size: .58rem; line-height: 1.25; transform: none; }
.tg-articulo__nombre { margin: 0 0 6px; color: var(--tg-tinta); font-size: 1.5rem; font-weight: 600; line-height: 1.12; overflow-wrap: anywhere; }
.tg-articulo--solicitado .tg-articulo__nombre { padding-right: 0; }
.tg-articulo--solicitado .tg-articulo__numero { padding-right: 170px; }
.tg-articulo__descripcion { margin: 0; color: var(--tg-tinta-suave); font-size: .98rem; line-height: 1.55; }
.tg-articulo__nota { display: flex; align-items: flex-start; gap: 7px; margin: 8px 0 0; color: var(--tg-principal); font-size: .92rem; font-weight: 600; line-height: 1.35; }
.tg-articulo__nota .icono { flex: none; width: 16px; height: 16px; margin-top: 1px; }
.tg-articulo__pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 14px; }
.tg-honorarios { display: grid; margin: 0; color: var(--tg-tinta); line-height: 1.1; }
.tg-honorarios small { color: var(--tg-tinta-suave); font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.tg-honorarios strong { font-family: var(--tg-titulo); font-size: 1.7rem; font-weight: 600; white-space: nowrap; font-variant-numeric: lining-nums; }
.diseno-toga .tg-articulo .ficha-ver { margin-top: 8px; color: var(--tg-principal); }
.tg-consulta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-left: auto;
    padding: 8px 14px;
    border: 1px solid var(--tg-principal);
    border-radius: 4px;
    color: var(--tg-principal);
    font-size: .92rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.tg-consulta .icono { flex: none; width: 17px; height: 17px; }
.tg-consulta:hover { background: var(--tg-principal); color: #FFFFFF; }

@media (max-width: 599.98px) {
    .tg-articulo__nombre { font-size: 1.3rem; }
    .tg-articulo__foto { width: 78px; margin-left: 12px; }
    .tg-articulo--solicitado .tg-articulo__numero { padding-right: 0; }
    .tg-articulo__solicitado { position: static; align-self: flex-start; margin: 0 0 8px; }
    .tg-consulta { margin-left: 0; }
}

/* ---------- Galería: los anexos sujetos con su clip ---------- */
.tg-anexos {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 18px;
    margin: 0;
    padding: 14px 0 0;
    list-style: none;
}
@media (min-width: 1000px) {
    .tg-anexos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 42px 30px; }
}
.galeria__mas > .tg-anexos { margin-top: 26px; }
.diseno-toga .tg-anexo__enlace {
    position: relative;
    display: block;
    padding: 12px 12px 14px;
    border: 1px solid rgba(0, 0, 0, .06);
    border-radius: 2px;
    background: var(--tg-blanco);
    color: var(--tg-tinta);
    text-decoration: none;
    box-shadow: var(--tg-sombra);
    transform: rotate(-1.1deg);
    transition: transform .3s ease;
}
.tg-anexo:nth-child(even) .tg-anexo__enlace { transform: rotate(.9deg); }
.diseno-toga .tg-anexo__enlace:hover { transform: rotate(0) translateY(-2px); }
.diseno-toga .tg-anexo__enlace img { aspect-ratio: auto; transform: none; }
/* El clip */
.tg-anexo__clip {
    position: absolute;
    top: -14px;
    left: 26px;
    z-index: 2;
    width: 15px;
    height: 44px;
    border: 2.5px solid #8C9198;
    border-radius: 9px;
    box-sizing: border-box;
}
.tg-anexo__clip::before { content: ""; position: absolute; top: 6px; right: 2px; left: 2px; height: 24px; border: 2px solid #8C9198; border-top: 0; border-radius: 0 0 7px 7px; }
.tg-anexo__numero {
    display: block;
    margin: 0 0 8px;
    color: var(--tg-acento-texto);
    font-family: var(--tg-titulo);
    font-size: .98rem;
    font-variant-caps: all-small-caps;
    font-weight: 600;
    letter-spacing: .16em;
    line-height: 1.2;
    text-align: right;
}
.tg-anexo__imagen { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; }
.tg-anexo__imagen img { width: 100%; height: 100%; object-fit: cover; }
.tg-anexo__pie { display: block; margin-top: 10px; color: var(--tg-tinta); font-family: var(--tg-titulo); font-size: 1.05rem; font-style: italic; line-height: 1.3; overflow-wrap: anywhere; }
@media (max-width: 599.98px) {
    .tg-anexos { gap: 28px 12px; }
    .diseno-toga .tg-anexo__enlace { padding: 8px 8px 10px; }
    .tg-anexo__clip { left: 16px; height: 36px; }
    .tg-anexo__numero { font-size: .86rem; }
    .tg-anexo__pie { font-size: .9rem; }
}
@media (prefers-reduced-motion: reduce) {
    .diseno-toga .tg-anexo__enlace { transition: none; }
    .diseno-toga .tg-anexo__enlace:hover { transform: rotate(-1.1deg); }
    .tg-anexo:nth-child(even) .tg-anexo__enlace:hover { transform: rotate(.9deg); }
}
.diseno-toga .galeria__ver-mas { border-radius: 4px; }

/* ---------- Lo demás: tarjetas de papel de esquinas casi rectas ---------- */
.diseno-toga .testimonio,
.diseno-toga .promocion,
.diseno-toga .pregunta,
.diseno-toga .contacto__item,
.diseno-toga .sucursal,
.diseno-toga .especial__punto,
.diseno-toga .persona,
.diseno-toga .servicio,
.diseno-toga .destacado-tarjeta { border-color: var(--tg-linea); border-radius: 4px; box-shadow: var(--tg-sombra); }
.diseno-toga .promocion__foto { border-radius: 2px; }
.diseno-toga .promocion__hoy { border-radius: 3px; background: var(--c-acento); color: var(--c-sobre-acento); }
.diseno-toga .testimonio > .icono { color: var(--tg-acento); opacity: .5; }
.diseno-toga .testimonio p { font-family: var(--tg-titulo); font-size: 1.14rem; font-style: italic; }
.diseno-toga .testimonio__iniciales,
.diseno-toga .contacto__icono,
.diseno-toga .especial__marca,
.diseno-toga .persona__foto--iniciales,
.diseno-toga .pregunta__signo { background: var(--tg-suave); color: var(--tg-principal); }
.diseno-toga .nosotros__foto img { border: 8px solid var(--tg-blanco); border-radius: 2px; box-shadow: 0 0 0 1px var(--tg-linea), var(--tg-sombra); }
.diseno-toga .nosotros__desde { border: 1px solid var(--tg-linea-fuerte); border-radius: 3px; background: var(--tg-blanco); color: var(--tg-tinta); }
.diseno-toga .nosotros__desde strong,
.diseno-toga .nosotros__desde .icono { color: var(--tg-principal); }
.diseno-toga .mapa { border: 1px solid var(--tg-linea-fuerte); border-radius: 2px; box-shadow: var(--tg-sombra); }
.diseno-toga .red { border-color: var(--tg-linea-fuerte); border-radius: 4px; }
.diseno-toga .red:hover { background: var(--tg-papel-2); }

/* El horario en una tarjeta, con el día de hoy marcado */
.diseno-toga .horario__tabla { overflow: hidden; border: 1px solid var(--tg-linea); border-collapse: separate; border-spacing: 0; border-radius: 4px; background: var(--tg-blanco); }
.diseno-toga .horario__tabla th,
.diseno-toga .horario__tabla td { padding-inline: 18px; border-bottom-color: var(--tg-linea); }
.diseno-toga .horario__tabla td { font-variant-numeric: tabular-nums; }
.diseno-toga .horario__tabla tr:last-child th,
.diseno-toga .horario__tabla tr:last-child td { border-bottom: 0; }
.diseno-toga .horario__hoy th,
.diseno-toga .horario__hoy td { background: var(--tg-papel-2); }
.diseno-toga .horario__etiqueta { border-radius: 3px; background: var(--tg-principal); color: #FFFFFF; }

/* ---------- Pie oscuro con su filete doble, y barra del celular ---------- */
.diseno-toga .pie { border-top: 4px double var(--tg-acento); background: var(--tg-tinta); color: rgba(255, 255, 255, .84); }
.diseno-toga .barra-acciones { background: color-mix(in srgb, var(--tg-papel) 96%, transparent); backdrop-filter: blur(10px); }
.diseno-toga .barra-acciones__boton--principal { border-radius: 4px; font-weight: 600; }