@font-face{font-family:'Big Shoulders Display';font-style:normal;font-weight:800;font-display:swap;src:url(../fuentes/big-shoulders-display-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url(../fuentes/archivo-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url(../fuentes/archivo-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url(../fuentes/fraunces-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:400;font-display:swap;src:url(../fuentes/fraunces-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fuentes/instrument-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fuentes/instrument-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(../fuentes/cormorant-garamond-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url(../fuentes/cormorant-garamond-latin-500-italic.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url(../fuentes/manrope-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url(../fuentes/manrope-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'DM Serif Display';font-style:normal;font-weight:400;font-display:swap;src:url(../fuentes/dm-serif-display-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'DM Serif Display';font-style:italic;font-weight:400;font-display:swap;src:url(../fuentes/dm-serif-display-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400;font-display:swap;src:url(../fuentes/inter-tight-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:600;font-display:swap;src:url(../fuentes/inter-tight-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(../fuentes/instrument-serif-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(../fuentes/instrument-serif-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url(../fuentes/bricolage-grotesque-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400;font-display:swap;src:url(../fuentes/bricolage-grotesque-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:600;font-display:swap;src:url(../fuentes/bricolage-grotesque-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Azeret Mono';font-style:normal;font-weight:500;font-display:swap;src:url(../fuentes/azeret-mono-latin-500-normal.woff2) format('woff2')}
/* PubliCode · catálogo de estilos por giro */
.catalogo-intro{padding-bottom:1rem}
.catalogo-intro .titular{margin-top:1rem}
.catalogo-intro .entrada{margin-top:1.25rem;max-width:44rem}
.giros{margin-top:2rem}
.giros ul{display:flex;flex-wrap:wrap;gap:.5rem}
.giros a{display:inline-flex;align-items:center;min-height:2.75rem;padding:.5rem 1rem;border:1px solid var(--linea);border-radius:99px;background:var(--papel-2);font-size:.9375rem;text-decoration:none}
.giros a:hover{border-color:var(--tinta)}
.nivel .cabeza{margin-bottom:2rem}
.nivel .cabeza .titular{font-size:clamp(2rem,4.6vw,3.25rem)}
.nivel .cabeza .entrada{margin-top:.75rem}
.nivel--media{background:var(--papel-2)}
.giro{scroll-margin-top:5rem}
.giro+.giro{margin-top:3.5rem}
.giro-titulo{font:400 1.75rem/1.1 var(--serif);padding-bottom:.75rem;border-bottom:1px solid var(--linea);margin-bottom:1.5rem;display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.giro-titulo small{font:500 .75rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--suave);white-space:nowrap}
.estilos{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:2rem 1.5rem}
.estilo{display:flex;flex-direction:column;gap:1rem;scroll-margin-top:5rem}
.estilo-info h3{font:600 1.0625rem/1.3 var(--sans);display:flex;align-items:center;gap:.6rem}
.codigo{font:500 .75rem/1 var(--mono);letter-spacing:.08em;padding:.35rem .5rem;border-radius:.375rem;background:var(--noche);color:var(--papel)}
.estilo-info p{margin-top:.4rem;font-size:.9375rem;color:var(--suave)}
.estilo-info .ficha{font:500 .6875rem/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase}
.boton.boton--chico{margin-top:.9rem;min-height:2.75rem;padding:.5rem 1rem;font-size:.9375rem}
.boton--chico svg{width:1.1rem;height:1.1rem}

/* Miniatura de tarjeta en un teléfono (decorativa) */
.mini{position:relative;width:100%;max-width:17rem;aspect-ratio:9/16.5;margin-inline:auto;overflow:hidden;border:7px solid #0E1A21;border-radius:1.75rem;background:var(--f);color:var(--t);font-family:var(--ft),system-ui,sans-serif;box-shadow:0 1.25rem 2.5rem -1.25rem rgba(14,26,33,.45);transition:transform .25s ease}
.estilo:hover .mini{transform:translateY(-4px)}
.mini-portada{position:relative;height:36%;background:var(--s);overflow:hidden}
.mini-sello{position:absolute;left:1rem;top:calc(36% - 1.6rem);width:3.2rem;height:3.2rem;display:grid;place-items:center;border-radius:.9rem;background:var(--a);color:var(--o);border:3px solid var(--f)}
.mini-sello svg{width:1.9rem;height:1.9rem}
.mini-nombre{margin:2.1rem 1rem 0;font-family:var(--fd),Georgia,serif;font-weight:var(--pd);font-size:1.55rem;line-height:.95;letter-spacing:-.01em}
.mini-nombre span{display:block}
.mini[data-ital] .mini-nombre span+span{font-style:italic;font-weight:400}
.mini[data-may] .mini-nombre{text-transform:uppercase;letter-spacing:.01em;font-size:1.45rem}
.mini[data-may] .mini-nombre span+span{color:var(--pr)}
.mini-linea{margin:.45rem 1rem 0;font-size:.6875rem;color:var(--m)}
.mini-estado{display:inline-flex;align-items:center;gap:.35rem;margin:.55rem 1rem 0;font-size:.625rem;font-weight:600;color:var(--t)}
.mini-estado::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:#2FB45A}
.mini-boton{display:flex;align-items:center;justify-content:center;gap:.4rem;margin:.75rem 1rem 0;padding:.55rem;border-radius:.6rem;background:var(--a);color:var(--o);font-size:.75rem;font-weight:600}
.mini-boton svg{width:.9rem;height:.9rem}
.mini-serv{margin:.85rem 1rem 0;border-top:1px solid color-mix(in srgb,var(--t) 16%,transparent)}
.mini-serv li{display:flex;justify-content:space-between;gap:.5rem;padding:.45rem 0;font-size:.6875rem;border-bottom:1px solid color-mix(in srgb,var(--t) 16%,transparent)}
.mini-serv b{font-family:var(--fd),Georgia,serif;font-weight:var(--pd);color:var(--pr);white-space:nowrap}

/* Estructuras */
.mini[data-base="taller"] .mini-portada{clip-path:polygon(0 0,100% 0,100% 82%,0 100%);background:repeating-linear-gradient(-45deg,var(--a) 0 9px,transparent 9px 22px),var(--s)}
.mini[data-base="taller"] .mini-sello{border-radius:.4rem;transform:rotate(-4deg)}
.mini[data-base="taller"] .mini-boton{border-radius:.3rem}
.mini[data-base="editorial"] .mini-portada{margin:.45rem .45rem 0;border-radius:1.1rem 1.1rem 0 0;background:radial-gradient(circle at 1px 1px,color-mix(in srgb,var(--a) 55%,transparent) 1.2px,transparent 1.6px) 0 0/11px 11px,var(--s);-webkit-mask:radial-gradient(circle at 50% 100%,transparent .4rem,#000 .45rem) bottom/1.1rem 100% repeat-x;mask:radial-gradient(circle at 50% 100%,transparent .4rem,#000 .45rem) bottom/1.1rem 100% repeat-x}
.mini[data-base="editorial"] .mini-sello{border-radius:50%}
.mini[data-base="editorial"] .mini-boton{border-radius:99px}
.mini[data-base="botanica"] .mini-portada{background:radial-gradient(60% 80% at 15% 20%,color-mix(in srgb,var(--a) 45%,transparent),transparent 70%),radial-gradient(55% 70% at 90% 85%,color-mix(in srgb,var(--a) 30%,transparent),transparent 70%),var(--s);border-radius:0 0 45% 45%/0 0 18% 18%}
.mini[data-base="botanica"] .mini-sello{border-radius:50% 50% 50% .4rem}
.mini[data-base="botanica"] .mini-boton{border-radius:99px}
.mini[data-base="clasica"] .mini-portada{background:repeating-linear-gradient(45deg,color-mix(in srgb,var(--a) 22%,transparent) 0 1px,transparent 1px 13px),repeating-linear-gradient(-45deg,color-mix(in srgb,var(--a) 22%,transparent) 0 1px,transparent 1px 13px),var(--s);box-shadow:inset 0 0 0 .55rem var(--s),inset 0 0 0 .62rem var(--a),inset 0 0 0 .85rem var(--s),inset 0 0 0 .9rem color-mix(in srgb,var(--a) 60%,transparent)}
.mini[data-base="clasica"] .mini-sello{left:50%;transform:translateX(-50%);border-radius:50%}
.mini[data-base="clasica"] .mini-nombre,.mini[data-base="clasica"] .mini-linea{text-align:center}
.mini[data-base="clasica"] .mini-estado{display:flex;justify-content:center}
.mini[data-base="clasica"] .mini-boton{border-radius:.2rem}
.mini[data-base="volcan"] .mini-portada{background:linear-gradient(170deg,color-mix(in srgb,var(--a) 35%,var(--s)) 0%,var(--s) 70%)}
.mini[data-base="volcan"] .mini-portada svg{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:42%;fill:var(--f)}
.mini[data-base="volcan"] .mini-boton{border-radius:.5rem}

@media (prefers-reduced-motion:reduce){.mini{transition:none}.estilo:hover .mini{transform:none}}
@media (max-width:30rem){.estilos{grid-template-columns:1fr 1fr;gap:1.5rem 1rem}.mini{border-width:5px;border-radius:1.25rem}.mini-nombre{font-size:1.15rem;margin-top:1.9rem}.mini[data-may] .mini-nombre{font-size:1.1rem}.mini-sello{width:2.6rem;height:2.6rem;left:.7rem;top:calc(36% - 1.3rem)}.mini-sello svg{width:1.5rem;height:1.5rem}.mini-nombre,.mini-linea,.mini-estado,.mini-boton,.mini-serv{margin-left:.7rem;margin-right:.7rem}.mini-serv li:nth-child(2){display:none}.estilo-info p:not(.ficha){font-size:.875rem}.estilo-info .ficha{display:none}.boton.boton--chico{width:100%;padding:.5rem .6rem;font-size:.875rem}}
