/* Sa fira (/muestras/ y /ca/mostres/). Se carga solo en esas páginas. */
.fira-portada{padding-block:clamp(3rem,8vw,6rem) clamp(2.5rem,6vw,4rem)}
.fira-portada h1{font-size:var(--t-4)}
.fira-portada .entradilla{font-size:var(--t-1);line-height:1.45;color:var(--suave);margin-top:1.4rem;max-width:46ch}
.filtros{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:2rem}
.filtros button{min-height:44px;padding:.5rem 1.1rem;border-radius:999px;border:2px solid var(--tinta);background:transparent;font:600 .95rem var(--f-txt);color:var(--tinta);cursor:pointer}
.filtros [aria-pressed="true"]{background:var(--tinta);color:var(--blanc)}
html:not(.js) .filtros{display:none}
/* Cada web es una paradeta de la fira, con su toldo de rayas */
.fira{padding-block:clamp(3.5rem,8vw,6rem)}
.parades{display:grid;gap:clamp(3rem,5vw,3.6rem) clamp(1.4rem,3vw,2.2rem)}
@media (min-width:700px){.parades{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.parades{grid-template-columns:repeat(3,1fr)}}
.paradeta{position:relative;display:flex;flex-direction:column;background:var(--blanc);border:2px solid var(--tinta);border-radius:0 0 12px 12px;box-shadow:6px 8px 0 var(--tinta)}
.paradeta[hidden]{display:none}
.toldo{position:relative;height:2.2rem;margin:-2px -10px 0;border:2px solid var(--tinta);border-radius:8px 8px 0 0;background:repeating-linear-gradient(90deg,var(--t) 0 2.2rem,var(--blanc) 2.2rem 4.4rem)}
.toldo::after{content:"";position:absolute;left:-2px;right:-2px;top:100%;height:1.1rem;background:radial-gradient(circle at 1.1rem 0,var(--t) 1.05rem,transparent 1.1rem) 0 0/4.4rem 1.1rem repeat-x,radial-gradient(circle at 3.3rem 0,var(--blanc) 1.05rem,transparent 1.1rem) 0 0/4.4rem 1.1rem repeat-x;filter:drop-shadow(0 2px 0 var(--tinta))}
.vista{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;margin:1.4rem 1rem 0;border:2px solid var(--tinta);border-radius:6px;background:var(--cal)}
.vista::after{content:"";position:absolute;inset:0;transition:background-color var(--d-2)}.vista:hover::after{background:#15213A14}
.rotul{display:grid;gap:.5rem;padding:1.2rem 1.2rem 1.4rem;flex:1;align-content:start}
.ofici{font-weight:700;font-size:.9rem;color:var(--coral-fosc,#B23E22)}
.rotul h2{font-size:var(--t-2)}.rotul p:not(.ofici){color:var(--suave)}
.rotul .btn{justify-self:start;margin-top:.6rem}
.fira .aviso{margin-top:2.6rem;color:var(--suave)}

.tuya{background:var(--sol);padding-block:clamp(3.5rem,8vw,6rem)}
.tuya .env{display:grid;gap:1.4rem;justify-items:start}
.tuya h2{font-size:var(--t-3);max-width:16ch}.tuya p{font-size:var(--t-1)}
.volver{display:inline-block;margin-bottom:1.6rem;font-weight:600}

/* Captura de cada demo en su paradeta (sustituye al iframe en vivo) */
.vista img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top left}