/* ============================================================
   MINIATURAS DE ESTILO — GENERADO por tools/generar-mini.js
   Los tokens de los 19 Set A se leen de giros.css; los 7 originales
   están fijados a mano en el script (npage.css no declara --brand).
   NO editar a mano: regenerar.
   ============================================================ */

/* Mockup: barra de marca + dos servicios + botón. Todo con los tokens del estilo,
   así que la miniatura ES el estilo, no una aproximación pintada aparte. */
.mini{
  --bg:#fff;--card:#fff;--ink:#222;--line:#ddd;--brand:#666;--on-brand:#fff;--soft:#eee;
  --radius:12px;--radius-sm:9px;
  --font-display:system-ui,sans-serif;--font-text:system-ui,sans-serif;
  background:var(--bg);border-radius:10px;overflow:hidden;
  display:block;width:100%;aspect-ratio:4/3;
  border:1px solid rgba(0,0,0,.10);
  pointer-events:none;user-select:none;
}
.mini .mh{
  background:var(--brand);color:var(--on-brand);
  padding:9% 8% 8%;display:flex;align-items:center;gap:5%;
}
.mini .mh .dot{width:15%;aspect-ratio:1;border-radius:50%;background:var(--on-brand);opacity:.92;flex:none}
.mini .mh .t{font-family:var(--font-display);font-weight:700;font-size:.86rem;line-height:1;letter-spacing:.01em}
.mini .mb{padding:7% 8% 8%;display:flex;flex-direction:column;gap:5%}
.mini .sv{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:6% 7%;display:flex;justify-content:space-between;align-items:center;gap:6%;
}
.mini .sv .ln{height:.34rem;border-radius:99px;background:var(--ink);opacity:.26;flex:1}
.mini .sv .pr{font-family:var(--font-display);font-weight:800;font-size:.5rem;color:var(--brand);letter-spacing:-.02em}
/* Servicio elegido: es el gesto que más distingue a un estilo de otro */
.mini .sv.on{background:var(--brand);border-color:var(--brand)}
.mini .sv.on .ln{background:var(--on-brand);opacity:.85}
.mini .sv.on .pr{color:var(--on-brand)}
.mini .bt{
  background:var(--brand);color:var(--on-brand);border-radius:var(--radius-sm);
  height:1.15rem;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-text);font-weight:700;font-size:.46rem;letter-spacing:.03em;
}

/* ---- tokens por estilo ---- */
.mini.m-nitido{--bg:#ffffff;--card:#ffffff;--ink:#16130F;--line:#ECEAE6;--brand:#16130F;--on-brand:#ffffff;--soft:#F5F4F2;--radius:14px;--radius-sm:11px;--font-display:'Space Grotesk',system-ui,sans-serif;--font-text:'Hanken Grotesk',system-ui,sans-serif}
.mini.m-calido{--bg:#FBF7F0;--card:#ffffff;--ink:#2C241E;--line:#EFE6D9;--brand:#D6437E;--on-brand:#ffffff;--soft:#F7EFE3;--radius:22px;--radius-sm:16px;--font-display:'Fraunces',Georgia,serif;--font-text:'Hanken Grotesk',system-ui,sans-serif}
.mini.m-premium{--bg:#17120F;--card:#1E1815;--ink:#F3ECE2;--line:rgba(201,162,75,.26);--brand:#C9A24B;--on-brand:#ffffff;--soft:#241D19;--radius:4px;--radius-sm:3px;--font-display:'Playfair Display',Georgia,serif;--font-text:'Jost',system-ui,sans-serif}
.mini.m-impacto{--bg:#f4f1e9;--card:#ffffff;--ink:#0a0a0a;--line:#0a0a0a;--brand:#0a0a0a;--on-brand:#ffffff;--soft:#e8e4d8;--radius:0px;--radius-sm:0px;--font-display:'Archivo Black',system-ui,sans-serif;--font-text:'Hanken Grotesk',system-ui,sans-serif}
.mini.m-jardin{--bg:#f3f1e7;--card:#fbfaf5;--ink:#2e352b;--line:#dfe2d2;--brand:#5a7a52;--on-brand:#ffffff;--soft:#e7ebda;--radius:18px;--radius-sm:14px;--font-display:'Fraunces',Georgia,serif;--font-text:'Hanken Grotesk',system-ui,sans-serif}
.mini.m-retro{--bg:#fbf3e3;--card:#fffdf7;--ink:#2b2036;--line:#e8dcc4;--brand:#e0518a;--on-brand:#ffffff;--soft:#f6e6d6;--radius:16px;--radius-sm:12px;--font-display:'Bungee',system-ui,sans-serif;--font-text:'Hanken Grotesk',system-ui,sans-serif}
.mini.m-editorial{--bg:#faf8f4;--card:#ffffff;--ink:#1a1815;--line:#ddd9d2;--brand:#1a1815;--on-brand:#ffffff;--soft:#f0ece5;--radius:2px;--radius-sm:2px;--font-display:'Playfair Display',Georgia,serif;--font-text:'Jost',system-ui,sans-serif}

.mini.m-g-estetica{--bg:#FBF3F4;--card:#FFFBFB;--ink:#3B2530;--line:rgba(59,37,48,0.14);--brand:#B85F80;--on-brand:#FFF8FA;--soft:#F5E6E9;--radius:18px;--radius-sm:14px;--font-display:'Cormorant Garamond', serif;--font-text:'Jost',system-ui,sans-serif}
.mini.m-g-barberia{--bg:#12161C;--card:#1A2029;--ink:#EFE6D8;--line:rgba(239,230,216,0.18);--brand:#C0453C;--on-brand:#FFF6EA;--soft:#232B36;--radius:8px;--radius-sm:6px;--font-display:'Oswald', sans-serif;--font-text:'Jost',system-ui,sans-serif}
.mini.m-g-unas{--bg:#FAF3FB;--card:#FFFFFF;--ink:#3A2A45;--line:rgba(58,42,69,0.14);--brand:#C9509A;--on-brand:#FFF7FC;--soft:#F2E4F7;--radius:24px;--radius-sm:20px;--font-display:'Playfair Display', serif;--font-text:'Poppins',system-ui,sans-serif}
.mini.m-g-dentista{--bg:#F4F8FB;--card:#FFFFFF;--ink:#14283A;--line:rgba(20,40,58,0.14);--brand:#1E7FB8;--on-brand:#FFFFFF;--soft:#E6F0F7;--radius:14px;--radius-sm:10px;--font-display:'Outfit', sans-serif;--font-text:'Manrope',system-ui,sans-serif}
.mini.m-g-consultorio{--bg:#F6F8F6;--card:#FFFFFF;--ink:#17322C;--line:rgba(23,50,44,0.14);--brand:#2A7D62;--on-brand:#FFFFFF;--soft:#E4EEE9;--radius:12px;--radius-sm:8px;--font-display:'Lora', serif;--font-text:'Manrope',system-ui,sans-serif}
.mini.m-g-veterinaria{--bg:#FFF9F0;--card:#FFFFFF;--ink:#2E3A24;--line:rgba(46,58,36,0.14);--brand:#4A9A5E;--on-brand:#FFFFFF;--soft:#EAF2E0;--radius:20px;--radius-sm:16px;--font-display:'Baloo 2', cursive;--font-text:'Nunito',system-ui,sans-serif}
.mini.m-g-spa{--bg:#F4F2EC;--card:#FCFAF6;--ink:#33362E;--line:rgba(51,54,46,0.14);--brand:#6F8360;--on-brand:#FCFAF6;--soft:#E8E5DB;--radius:20px;--radius-sm:16px;--font-display:'Cormorant Garamond', serif;--font-text:'Karla',system-ui,sans-serif}
.mini.m-g-psico{--bg:#F5F4F9;--card:#FFFFFF;--ink:#262A40;--line:rgba(38,42,64,0.14);--brand:#5B5FA8;--on-brand:#FFFFFF;--soft:#E7E6F1;--radius:16px;--radius-sm:12px;--font-display:'Newsreader', serif;--font-text:'Karla',system-ui,sans-serif}
.mini.m-g-fisio{--bg:#F3F6FA;--card:#FFFFFF;--ink:#10233A;--line:rgba(16,35,58,0.14);--brand:#1F5FD0;--on-brand:#FFFFFF;--soft:#E2EAF4;--radius:12px;--radius-sm:8px;--font-display:'Archivo', sans-serif;--font-text:'Archivo',system-ui,sans-serif}
.mini.m-g-nutriologo{--bg:#F7FAF3;--card:#FFFFFF;--ink:#22331F;--line:rgba(34,51,31,0.14);--brand:#5E9435;--on-brand:#FFFFFF;--soft:#E8F1DE;--radius:16px;--radius-sm:12px;--font-display:'DM Serif Display', serif;--font-text:'DM Sans',system-ui,sans-serif}
.mini.m-g-tatuajes{--bg:#0F0F10;--card:#17171A;--ink:#EDE7DD;--line:rgba(237,231,221,0.18);--brand:#B3352F;--on-brand:#F7F2EA;--soft:#202024;--radius:6px;--radius-sm:6px;--font-display:'Bebas Neue', sans-serif;--font-text:'Space Grotesk',system-ui,sans-serif}
.mini.m-g-taller{--bg:#F2F2EF;--card:#FFFFFF;--ink:#1C1C1C;--line:rgba(28,28,28,0.16);--brand:#D98200;--on-brand:#1C1C1C;--soft:#E6E6E1;--radius:6px;--radius-sm:6px;--font-display:'Archivo', sans-serif;--font-text:'IBM Plex Sans',system-ui,sans-serif}
.mini.m-g-optica{--bg:#F4F5F7;--card:#FFFFFF;--ink:#1B2430;--line:rgba(27,36,48,0.14);--brand:#1D5F8A;--on-brand:#FFFFFF;--soft:#E7EAEF;--radius:10px;--radius-sm:6px;--font-display:'Space Grotesk', sans-serif;--font-text:'Space Grotesk',system-ui,sans-serif}
.mini.m-g-laboratorio{--bg:#F5F7F9;--card:#FFFFFF;--ink:#131C24;--line:rgba(19,28,36,0.14);--brand:#0E8F9E;--on-brand:#FFFFFF;--soft:#E5EDF2;--radius:8px;--radius-sm:6px;--font-display:'IBM Plex Mono', monospace;--font-text:'IBM Plex Sans',system-ui,sans-serif}
.mini.m-g-foto{--bg:#F7F7F5;--card:#FFFFFF;--ink:#111111;--line:rgba(17,17,17,0.14);--brand:#111111;--on-brand:#FFFFFF;--soft:#ECECE8;--radius:4px;--radius-sm:6px;--font-display:'Instrument Serif', serif;--font-text:'Jost',system-ui,sans-serif}
.mini.m-g-entrenador{--bg:#101214;--card:#191C1F;--ink:#F1F3F0;--line:rgba(241,243,240,0.18);--brand:#C8FF3D;--on-brand:#101214;--soft:#22262A;--radius:10px;--radius-sm:6px;--font-display:'Bebas Neue', sans-serif;--font-text:'Barlow',system-ui,sans-serif}
.mini.m-g-clases{--bg:#FBF8F0;--card:#FFFFFF;--ink:#1D2340;--line:rgba(29,35,64,0.14);--brand:#2C4BC4;--on-brand:#FFFFFF;--soft:#EFEADC;--radius:14px;--radius-sm:10px;--font-display:'Newsreader', serif;--font-text:'Karla',system-ui,sans-serif}
.mini.m-g-podologo{--bg:#F2F7F8;--card:#FFFFFF;--ink:#16303A;--line:rgba(22,48,58,0.14);--brand:#2C7F94;--on-brand:#FFFFFF;--soft:#E1EDF0;--radius:14px;--radius-sm:10px;--font-display:'Lora', serif;--font-text:'Karla',system-ui,sans-serif}
.mini.m-g-pasteleria{--bg:#FFF6EE;--card:#FFFDFA;--ink:#4A2B22;--line:rgba(74,43,34,0.14);--brand:#D6536C;--on-brand:#FFFDFA;--soft:#FBE6D6;--radius:26px;--radius-sm:22px;--font-display:'Playfair Display', serif;--font-text:'Quicksand',system-ui,sans-serif}

.mini.m-w-estetica{--bg:#FBF2F4;--card:#FFFFFF;--ink:#33202B;--line:rgba(51,32,43,0.14);--brand:#B0395F;--on-brand:#FFF6F8;--soft:#F5E4E8;--radius:20px;--radius-sm:16px;--font-display:'Cormorant Garamond', serif;--font-text:'Jost',system-ui,sans-serif}
.mini.m-w-barberia{--bg:#101419;--card:#181E26;--ink:#EFE6D8;--line:rgba(239,230,216,0.18);--brand:#D2483C;--on-brand:#FFF6EA;--soft:#1F2731;--radius:10px;--radius-sm:6px;--font-display:'Oswald', sans-serif;--font-text:'Jost',system-ui,sans-serif}
.mini.m-w-unas{--bg:#FAF2FB;--card:#FFFFFF;--ink:#33203F;--line:rgba(51,32,63,0.13);--brand:#C0327F;--on-brand:#FFF6FB;--soft:#F2E2F8;--radius:26px;--radius-sm:22px;--font-display:'Playfair Display', serif;--font-text:'Poppins',system-ui,sans-serif}
.mini.m-w-dentista{--bg:#F2F7FB;--card:#FFFFFF;--ink:#0F2436;--line:rgba(15,36,54,0.13);--brand:#1478C8;--on-brand:#FFFFFF;--soft:#E4EFF7;--radius:16px;--radius-sm:12px;--font-display:'Outfit', sans-serif;--font-text:'Manrope',system-ui,sans-serif}
.mini.m-w-consultorio{--bg:#F5F8F5;--card:#FFFFFF;--ink:#12312A;--line:rgba(18,49,42,0.13);--brand:#1F7A5E;--on-brand:#FFFFFF;--soft:#E3EEE8;--radius:14px;--radius-sm:10px;--font-display:'Lora', serif;--font-text:'Manrope',system-ui,sans-serif}
.mini.m-w-veterinaria{--bg:#FFF8EF;--card:#FFFFFF;--ink:#2B3722;--line:rgba(43,55,34,0.13);--brand:#3E9350;--on-brand:#FFFFFF;--soft:#EAF3DE;--radius:24px;--radius-sm:20px;--font-display:'Baloo 2', cursive;--font-text:'Nunito',system-ui,sans-serif}
.mini.m-w-spa{--bg:#F3F1EB;--card:#FBF9F5;--ink:#2E322B;--line:rgba(46,50,43,0.14);--brand:#6B8058;--on-brand:#FBF9F5;--soft:#E7E4D9;--radius:22px;--radius-sm:18px;--font-display:'Cormorant Garamond', serif;--font-text:'Karla',system-ui,sans-serif}
.mini.m-w-psico{--bg:#F4F4FA;--card:#FFFFFF;--ink:#22263C;--line:rgba(34,38,60,0.13);--brand:#4E52A8;--on-brand:#FFFFFF;--soft:#E6E6F2;--radius:20px;--radius-sm:16px;--font-display:'Newsreader', serif;--font-text:'Karla',system-ui,sans-serif}
.mini.m-w-fisio{--bg:#F1F5FA;--card:#FFFFFF;--ink:#0D2038;--line:rgba(13,32,56,0.13);--brand:#1250D8;--on-brand:#FFFFFF;--soft:#E1EAF5;--radius:14px;--radius-sm:10px;--font-display:'Archivo', sans-serif;--font-text:'Archivo',system-ui,sans-serif}
.mini.m-w-nutriologo{--bg:#F6FAF2;--card:#FFFFFF;--ink:#1E301B;--line:rgba(30,48,27,0.13);--brand:#4E8C28;--on-brand:#FFFFFF;--soft:#E8F1DD;--radius:18px;--radius-sm:14px;--font-display:'DM Serif Display', serif;--font-text:'DM Sans',system-ui,sans-serif}
.mini.m-w-tatuajes{--bg:#0D0D0E;--card:#15151A;--ink:#EDE7DD;--line:rgba(237,231,221,0.18);--brand:#C33A2F;--on-brand:#F7F2EA;--soft:#1D1D22;--radius:6px;--radius-sm:6px;--font-display:'Bebas Neue', sans-serif;--font-text:'Space Grotesk',system-ui,sans-serif}
.mini.m-w-taller{--bg:#131313;--card:#1C1C1C;--ink:#EFEFE9;--line:rgba(239,239,233,0.16);--brand:#F0A000;--on-brand:#131313;--soft:#242423;--radius:6px;--radius-sm:6px;--font-display:'Archivo', sans-serif;--font-text:'IBM Plex Sans',system-ui,sans-serif}
.mini.m-w-optica{--bg:#F3F5F8;--card:#FFFFFF;--ink:#161F2B;--line:rgba(22,31,43,0.13);--brand:#15557E;--on-brand:#FFFFFF;--soft:#E5E9EF;--radius:12px;--radius-sm:8px;--font-display:'Space Grotesk', sans-serif;--font-text:'Space Grotesk',system-ui,sans-serif}
.mini.m-w-laboratorio{--bg:#F4F7F9;--card:#FFFFFF;--ink:#101A22;--line:rgba(16,26,34,0.13);--brand:#0A8494;--on-brand:#FFFFFF;--soft:#E4EDF2;--radius:10px;--radius-sm:6px;--font-display:'IBM Plex Mono', monospace;--font-text:'IBM Plex Sans',system-ui,sans-serif}
.mini.m-w-foto{--bg:#F6F6F4;--card:#FFFFFF;--ink:#0E0E0E;--line:rgba(14,14,14,0.14);--brand:#0E0E0E;--on-brand:#FFFFFF;--soft:#EAEAE6;--radius:4px;--radius-sm:6px;--font-display:'Instrument Serif', serif;--font-text:'Jost',system-ui,sans-serif}
.mini.m-w-entrenador{--bg:#0E1012;--card:#181B1E;--ink:#F1F3F0;--line:rgba(241,243,240,0.18);--brand:#C8FF3D;--on-brand:#0E1012;--soft:#202427;--radius:12px;--radius-sm:8px;--font-display:'Bebas Neue', sans-serif;--font-text:'Barlow',system-ui,sans-serif}
.mini.m-w-clases{--bg:#FBF8F0;--card:#FFFFFF;--ink:#1B2140;--line:rgba(27,33,64,0.13);--brand:#2440BE;--on-brand:#FFFFFF;--soft:#EFE9DB;--radius:16px;--radius-sm:12px;--font-display:'Newsreader', serif;--font-text:'Karla',system-ui,sans-serif}
.mini.m-w-podologo{--bg:#F1F7F8;--card:#FFFFFF;--ink:#132C36;--line:rgba(19,44,54,0.13);--brand:#1F7488;--on-brand:#FFFFFF;--soft:#E0EDF0;--radius:18px;--radius-sm:14px;--font-display:'Lora', serif;--font-text:'Karla',system-ui,sans-serif}
.mini.m-w-pasteleria{--bg:#FFF5ED;--card:#FFFDFA;--ink:#452720;--line:rgba(69,39,32,0.13);--brand:#D34462;--on-brand:#FFFDFA;--soft:#FBE5D4;--radius:28px;--radius-sm:24px;--font-display:'Playfair Display', serif;--font-text:'Quicksand',system-ui,sans-serif}

/* ============================================================
   FORMAS POR ARQUITECTURA (Set B).
   Set A y los clásicos comparten un mockup genérico porque entre ellos solo
   cambia la piel. Set B no: aurora, split, cinema y bento son composiciones
   distintas, y una miniatura que solo cambiara de color mentiría sobre lo que
   el dueño va a recibir. Cada forma es un esquema de su layout real.
   ============================================================ */
.mini.arq{padding:0;position:relative}
.mini.arq .aa{font-family:var(--font-display);font-weight:700;color:var(--ink);line-height:1}
.mini.arq .ln{border-radius:99px;background:var(--ink);opacity:.24;display:block}
.mini.arq .pill{border-radius:99px;background:var(--brand);display:block}

/* aurora — todo centrado sobre un resplandor. */
.mini.arq-aurora{background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7%}
.mini.arq-aurora::before{content:"";position:absolute;inset:0;
  background:radial-gradient(58% 52% at 22% 16%,color-mix(in srgb,var(--brand) 34%,transparent),transparent 68%),
             radial-gradient(66% 54% at 78% 96%,color-mix(in srgb,var(--soft) 88%,transparent),transparent 70%)}
.mini.arq-aurora > *{position:relative}
.mini.arq-aurora .dot{width:15%;aspect-ratio:1;border-radius:50%;background:var(--brand);opacity:.9}
.mini.arq-aurora .eb{width:26%;height:.2rem;border-radius:99px;background:var(--brand);opacity:.75}
.mini.arq-aurora .aa{font-size:.95rem}
.mini.arq-aurora .ln{width:44%;height:.2rem}

/* split — bloque a un costado y tarjeta encimada. */
.mini.arq-split{background:var(--bg);display:block}
.mini.arq-split .bloque{position:absolute;left:0;top:0;bottom:0;width:56%;
  background:linear-gradient(158deg,var(--brand),color-mix(in srgb,var(--brand) 66%,var(--ink)))}
.mini.arq-split .panel{position:absolute;right:6%;top:16%;bottom:16%;width:56%;
  background:var(--card);border-radius:var(--radius-sm);box-shadow:0 8px 18px rgba(0,0,0,.18);
  display:flex;flex-direction:column;justify-content:center;gap:9%;padding:0 8%}
.mini.arq-split .eb{width:44%;height:.16rem;border-radius:99px;background:var(--brand)}
.mini.arq-split .aa{font-size:.72rem}
.mini.arq-split .ln{width:70%;height:.16rem}

/* cinema — a sangre con el título abajo. */
.mini.arq-cinema{background:var(--bg);display:flex;flex-direction:column;justify-content:flex-end;padding:0 9% 9%;gap:5%}
.mini.arq-cinema::before{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,color-mix(in srgb,var(--brand) 30%,transparent) 0%,transparent 45%,
             color-mix(in srgb,var(--ink) 55%,transparent) 100%)}
.mini.arq-cinema > *{position:relative}
.mini.arq-cinema .eb{width:24%;height:.16rem;border-radius:99px;background:var(--brand)}
.mini.arq-cinema .aa{font-size:1.05rem;letter-spacing:-.01em}
.mini.arq-cinema .ln{width:52%;height:.16rem;opacity:.4}

/* bento — mosaicos, con la celda de acción en color pleno. */
.mini.arq-bento{background:var(--bg);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:5%;padding:7%}
.mini.arq-bento .t{background:var(--card);border:1px solid var(--line);border-radius:calc(var(--radius-sm) * .55);
  display:flex;flex-direction:column;justify-content:flex-end;gap:12%;padding:7%}
.mini.arq-bento .t.grande{grid-column:span 2;grid-row:span 2;justify-content:center}
.mini.arq-bento .t.cta{background:var(--brand);border-color:var(--brand)}
.mini.arq-bento .aa{font-size:.62rem}
.mini.arq-bento .ln{width:80%;height:.14rem}
.mini.arq-bento .t.cta .ln{background:var(--on-brand);opacity:.85}