/* Trabajos de ejemplo: cada tablero es un tipo de pieza distinto, con su propio lenguaje gráfico */
.board{container-type:inline-size;aspect-ratio:16/10;height:auto;overflow:hidden;position:relative}
.board::after{display:none}
.bd-web{background:var(--c2)}
.bd-web::after{display:block;content:"";position:absolute;left:-6%;bottom:-24%;width:46%;aspect-ratio:1;background:var(--c0);rotate:45deg}
.bd-web .bw{position:absolute;left:5%;top:9%;width:62%;background:#fff;box-shadow:0 24px 50px rgba(0,0,0,.28);z-index:1}
.bd-web .bs{container-type:inline-size;height:calc(100cqw * .36);overflow:hidden}
.bd-web .bp{position:absolute;right:6%;top:6%;width:25%;aspect-ratio:9/18.5;background:#111;border:5px solid #111;border-radius:12px;overflow:hidden;box-shadow:0 24px 50px rgba(0,0,0,.35);container-type:inline-size;z-index:2}

/* camioneta y cartelería: industrial, condensada, cuadrícula técnica */
.bd-van{background-color:#14213D;background-image:repeating-linear-gradient(0deg,transparent 0 6cqw,rgba(255,255,255,.07) 6cqw 6.25cqw),repeating-linear-gradient(90deg,transparent 0 6cqw,rgba(255,255,255,.07) 6cqw 6.25cqw);color:#fff}
.bl-bill{position:absolute;left:5%;top:8%;width:55%;height:52%;background:var(--c0);color:var(--c1);padding:3cqw;display:grid;align-content:space-between;overflow:hidden}
.bl-bill b{font:700 8.6cqw/.88 'Barlow Condensed',sans-serif;text-transform:uppercase;position:relative;z-index:1}
.bl-ill{position:absolute;right:-1cqw;bottom:-3cqw;width:40%}
.bl-bill span{background:var(--c1);color:var(--c0);font:700 2.6cqw 'Barlow Condensed',sans-serif;padding:1cqw 2.4cqw;justify-self:start;text-transform:uppercase;position:relative;z-index:1}
.bl-bill em{font:600 1.9cqw 'Barlow Condensed',sans-serif;font-style:normal;position:relative;z-index:1;opacity:.85}
.van{position:absolute;left:30%;top:52%;width:66%}
.bl-tag{position:absolute;right:5%;top:8%;background:#fff;color:#14213D;padding:2cqw 3cqw;display:grid;text-align:center}
.bl-tag b{font:700 9cqw/.9 'Barlow Condensed',sans-serif}.bl-tag span{font:600 1.9cqw 'Barlow Condensed',sans-serif;text-transform:uppercase}

/* barbería: negro, dorado, serif, tarjetas y letrero */
.bd-lux{background-color:#0d0d0d;background-image:radial-gradient(circle at 72% 22%,rgba(201,162,75,.2),transparent 55%);color:#f2ebdd;font-family:'Playfair Display',serif}
.lx-card{position:absolute;width:35%;aspect-ratio:1.75;display:grid;place-content:center;text-align:center;box-shadow:0 2cqw 4cqw rgba(0,0,0,.6)}
.lx-card.f{left:7%;top:13%;background:#111;border:.3cqw solid var(--c0);color:var(--c0);rotate:-4deg}
.lx-card.f b{font:700 3.2cqw 'Playfair Display',serif;letter-spacing:.35em}
.lx-card.f span{font:500 1.15cqw Inter,sans-serif;letter-spacing:.3em;margin-top:1.2cqw;color:#f2ebdd}
.lx-card.r{left:23%;top:42%;background:#f2ebdd;color:#111;rotate:5deg}
.lx-card.r i{font:700 9cqw/1 'Playfair Display',serif;font-style:normal;color:var(--c0)}
.lx-card.r span{font:500 1.2cqw Inter,sans-serif;letter-spacing:.1em}
.lx-sign{position:absolute;right:13%;top:0;width:21%;display:grid;justify-items:center}
.rope{width:.5cqw;height:11cqw;background:var(--c0)}
.plate{width:100%;aspect-ratio:.95;background:#111;border:.35cqw solid var(--c0);display:grid;place-content:center;text-align:center;color:var(--c0)}
.plate b{font:700 6cqw 'Playfair Display',serif;letter-spacing:.18em}
.plate span{font:600 2.6cqw 'Playfair Display',serif;letter-spacing:.6em}
.lx-tin{position:absolute;right:8%;bottom:8%;width:27%;aspect-ratio:1.7;background:var(--c0);color:#111;display:grid;place-content:center;text-align:center;box-shadow:0 2cqw 4cqw rgba(0,0,0,.6)}
.lx-tin b{font:700 2.6cqw 'Playfair Display',serif;letter-spacing:.3em}.lx-tin span{font:600 1cqw Inter,sans-serif;letter-spacing:.3em}

/* clínica: folleto, web móvil y tarjeta de cita; suave y redondeado */
.bd-soft{background:#CFEFF2;font-family:'Nunito',sans-serif;color:var(--c1)}
.sf-bro{position:absolute;left:5%;top:10%;width:58%;height:70%;display:grid;grid-template-columns:repeat(3,1fr);gap:.6cqw;filter:drop-shadow(0 2cqw 3cqw rgba(15,59,68,.25))}
.sf-bro>div{background:#fff;padding:2cqw;border-radius:1.4cqw;display:grid;align-content:start;gap:1cqw;font-size:1.5cqw}
.sf-bro .p1{background:var(--c0);color:#fff}
.sf-bro .p1 b{font:800 3.2cqw/1 Nunito,sans-serif}.sf-bro .p1 span{font-size:1.5cqw}
.sf-ill{width:72%;justify-self:center;margin-top:auto}
.sf-bro h5{font:800 2.1cqw Nunito,sans-serif;letter-spacing:0}
.sf-bro ul{padding:0}.sf-bro li{list-style:none;display:flex;justify-content:space-between;gap:1cqw;font-size:1.35cqw;padding:.6cqw 0}
.sf-bro .p3 em{font-style:normal;background:var(--c0);color:#fff;padding:1cqw 2cqw;border-radius:99px;justify-self:start;font-weight:800;margin-top:1cqw}
.sf-ph{position:absolute;right:9%;top:6%;width:22%;aspect-ratio:9/16;background:#fff;border-radius:3cqw;border:.8cqw solid #0F3B44;overflow:hidden;container-type:inline-size;box-shadow:0 2cqw 4cqw rgba(15,59,68,.3)}
.sf-sc{display:grid;gap:3cqw;padding:6cqw;align-content:start;text-align:left;height:100%;background:var(--c3)}
.sf-sc b{font:800 6cqw Nunito,sans-serif}.sf-sc h4{font:800 11cqw/1.02 Nunito,sans-serif;letter-spacing:-.02em;color:var(--c1)}
.sf-sc .ill{width:70%;justify-self:center}.sf-sc em{font-style:normal;background:var(--c0);color:#fff;padding:3cqw 6cqw;border-radius:99px;font:800 6cqw Nunito,sans-serif;justify-self:start}
.sf-appt{position:absolute;right:3%;bottom:7%;background:#fff;border-radius:1.6cqw;padding:2cqw 3cqw;display:grid;box-shadow:0 2cqw 4cqw rgba(15,59,68,.25)}
.sf-appt b{font:800 1.8cqw Nunito,sans-serif}.sf-appt span{font-size:1.5cqw;color:var(--c0);font-weight:800}

/* limpieza: historias de Instagram y volante, verde fresco y amigable */
.bd-fresh{background:#DFF3E4;font-family:'Nunito',sans-serif}
.fr-st{position:absolute;top:8%;width:17%;aspect-ratio:9/16;border-radius:2cqw;padding:2.4cqw 1.8cqw 1.8cqw;overflow:hidden;display:grid;align-content:space-between;box-shadow:0 2cqw 3cqw rgba(20,52,31,.25)}
.fr-st i{position:absolute;top:1cqw;left:1cqw;right:1cqw;height:.4cqw;background:rgba(255,255,255,.75);border-radius:9px}
.fr-st.k1{left:6%;background:var(--c0);color:#fff}.fr-st.k2{left:26%;top:15%;background:#fff;color:var(--c1)}.fr-st.k3{left:46%;background:var(--c2);color:var(--c1)}
.fr-st b{font:800 2.7cqw/1 Nunito,sans-serif}.fr-st h5{font:800 2.2cqw Nunito,sans-serif;letter-spacing:0}
.fr-st ul{padding:0}.fr-st li{list-style:none;display:grid;font-size:1.2cqw;margin-bottom:.9cqw}.fr-st li b{font-size:1.3cqw}
.fr-st em{font-style:normal;background:var(--c0);color:#fff;padding:.9cqw 1.6cqw;border-radius:99px;font-weight:800;font-size:1.3cqw;justify-self:start}
.fr-st div{width:92%;justify-self:center}
.fr-fly{position:absolute;right:6%;top:6%;width:30%;aspect-ratio:.72;background:#fff;color:var(--c1);padding:2.4cqw;display:grid;align-content:space-between;box-shadow:0 2cqw 4cqw rgba(20,52,31,.3);rotate:3deg}
.fh{font:800 1.4cqw Nunito,sans-serif;letter-spacing:.2em;color:var(--c0)}
.fr-fly>b{font:800 3.6cqw/1 Nunito,sans-serif}
.fr-fly ul{padding:0}.fr-fly li{list-style:none;display:flex;justify-content:space-between;font-size:1.3cqw;padding:.5cqw 0;border-bottom:.2cqw dashed var(--c2)}
.qr{display:grid;grid-template-columns:repeat(7,1fr);width:9cqw;gap:.15cqw;border:.3cqw solid var(--c1);padding:.4cqw}
.qr i{aspect-ratio:1;background:#fff;position:static;height:auto;border-radius:0}.qr i.o{background:var(--c1)}

/* panadería: papel kraft, serif cálida, packaging y menú */
.bd-craft{background-color:#D2B07A;background-image:radial-gradient(rgba(90,46,31,.14) 1px,transparent 1.4px);background-size:1.6cqw 1.6cqw;font-family:'Fraunces',serif;color:var(--c1)}
.cr-bag{position:absolute;left:8%;top:12%;width:27%;aspect-ratio:.64;background:#C79A5A;clip-path:polygon(4% 3%,96% 3%,100% 100%,0 100%)}
.cr-bag .fold{position:absolute;left:0;right:0;top:0;height:9%;background:#A67C3F}
.cr-bag .cl{position:absolute;left:12%;right:12%;top:27%;bottom:17%;background:var(--c3);display:grid;place-content:center;text-align:center;justify-items:center;gap:.6cqw}
.cr-ill{width:60%}
.cr-bag .cl b{font:800 2.7cqw Fraunces,serif}.cr-bag .cl span{font:600 .95cqw Inter,sans-serif;letter-spacing:.2em}
.cr-menu{position:absolute;left:42%;top:8%;width:25%;aspect-ratio:.66;background:var(--c3);padding:2.4cqw;display:grid;align-content:start;gap:1cqw;box-shadow:0 2cqw 4cqw rgba(60,30,10,.35);rotate:-2deg}
.cr-menu h5{font:800 3.4cqw Fraunces,serif;letter-spacing:-.02em}
.cr-menu span{font:600 1.1cqw Inter,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--c0)}
.cr-menu ul{padding:0}.cr-menu li{list-style:none;display:flex;gap:.6cqw;align-items:baseline;font-size:1.45cqw;padding:.6cqw 0}
.cr-menu li i{flex:1;border-bottom:.2cqw dotted var(--c1);opacity:.5}
.cr-st{position:absolute;right:6%;top:14%;width:21%;display:grid;grid-template-columns:1fr 1fr;gap:1.6cqw}
.cr-st>i{aspect-ratio:1;border-radius:50%;background:var(--c2);display:grid;place-items:center;padding:1cqw;font-style:normal}
.cr-st>i.b{background:var(--c0);color:#fff}.cr-st>i.c{background:var(--c1);color:var(--c3)}
.cr-st b{font:800 1.5cqw Fraunces,serif}

/* trabajos v11 */
.bd-web .bp2{position:absolute;right:5%;top:5%;width:23%;aspect-ratio:9/19.5;z-index:2;filter:drop-shadow(0 2cqw 3cqw rgba(0,0,0,.35))}
.bd-web .bs{height:calc(100cqw * .4)}
.bl-lg{width:64%}
.lx-card.f{display:grid;place-items:center}.lx-card.f .lg{width:86%}
.lx-card.r{display:grid;place-items:center;align-content:center;gap:.6cqw}.lx-card.r .ic{width:22%}.lx-card.r span{text-align:center}
.plate{display:grid;place-items:center;place-content:center;gap:.8cqw}.plate .ic{width:46%}.plate span{padding-left:.6em;font:600 1.6cqw 'Playfair Display',serif;letter-spacing:.5em}
.lx-tin{display:grid;place-items:center;place-content:center;gap:.5cqw}.lx-tin .ic{width:30%}.lx-tin span{padding-left:.3em;text-align:center}
.sfl{width:96%}.sfl2{width:78%}
.bd-fresh{background:#DCE9FB}.fr-fly .fh{width:84%}
.cr-ill .ic{display:block}

.bl-bill{height:58%;align-content:start;gap:1.2cqw}.bl-bill b{font-size:6.6cqw}.bl-ill{width:30%;bottom:-2cqw}
.van{top:60%;left:34%;width:60%}

.bl-bill .lg{width:100%}

.wimg{display:block;width:100%;height:100%;object-fit:cover}
.st-win .wimg{position:absolute;inset:0;opacity:.6}.st-glass,.st-decal{z-index:1}
.kt-bp{overflow:hidden}.kt-bp .wimg{border-radius:50%}
.bk-win{overflow:hidden}.bk-win .wimg{display:block}

/* ===== trabajos v17 ===== */
.bd-store{background:#101010}.fl-bg{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#171717 0 4.2cqw,#101010 4.2cqw 4.5cqw),radial-gradient(circle at 80% 20%,rgba(201,162,75,.18),transparent 50%)}
.fl-ph{position:absolute;left:4%;top:8%;width:44%;height:84%;border:.5cqw solid var(--c0);overflow:hidden;box-shadow:0 2cqw 4cqw rgba(0,0,0,.6)}
.fl-cap{position:absolute;left:0;right:0;bottom:0;padding:6cqw 3cqw 2.4cqw;background:linear-gradient(transparent,rgba(0,0,0,.85));display:grid;gap:.4cqw;color:var(--c0);font-family:'Playfair Display',serif}.fl-cap b{font-size:3cqw;letter-spacing:.2em}.fl-cap span{font-size:1.8cqw;color:#f2ebdd;letter-spacing:.14em}
.fl-sign{position:absolute;left:52%;top:8%;width:44%;height:19%;background:#0a0a0a;border:.45cqw solid var(--c0);display:grid;place-items:center;padding:1cqw}.fl-sign .lg{height:100%;width:auto}
.fl-c1{position:absolute;left:52%;top:32%;width:23%;aspect-ratio:1.75;background:#f2ebdd;color:#111;rotate:-4deg;display:grid;place-content:center;justify-items:start;gap:.3cqw;padding:2cqw;box-shadow:0 1.6cqw 3cqw rgba(0,0,0,.6)}.fl-c1 .ic{width:5cqw;margin-bottom:.4cqw}.fl-c1 b{font:600 2.4cqw 'Playfair Display'}.fl-c1 span{font-size:1.3cqw;letter-spacing:.06em}
.fl-c2{position:absolute;left:73%;top:35%;width:23%;aspect-ratio:1.75;background:var(--c0);color:#111;rotate:5deg;display:grid;align-content:center;gap:.5cqw;padding:1.8cqw;box-shadow:0 1.6cqw 3cqw rgba(0,0,0,.6);font-family:'Playfair Display',serif}.fl-c2 b{font-size:2.6cqw}.fl-c2 span{font-size:1.2cqw;letter-spacing:.14em}.fl-c2 div{display:grid;grid-template-columns:repeat(5,1fr);gap:.6cqw}.fl-c2 i{aspect-ratio:1;border:.2cqw solid #111;border-radius:50%}.fl-c2 i:nth-child(-n+6){background:#111}
.fl-pole{position:absolute;left:54%;top:64%;width:7%}.fl-pole svg{width:100%;display:block}
.fl-tin{position:absolute;left:64%;top:62%;width:14%;aspect-ratio:1;border-radius:50%;background:var(--c0);color:#111;display:grid;place-content:center;justify-items:center;gap:.4cqw;box-shadow:0 1.6cqw 3cqw rgba(0,0,0,.6)}.fl-tin .ic{width:4.4cqw}.fl-tin span{font:600 1cqw 'Playfair Display';letter-spacing:.1em;text-align:center}
.fl-menu{position:absolute;left:81%;top:62%;width:15%;background:#0a0a0a;border:.3cqw solid var(--c0);padding:1.4cqw;display:grid;gap:.6cqw;color:#f2ebdd;font:600 1.3cqw 'Playfair Display'}.fl-menu b{color:var(--c0);letter-spacing:.2em}.fl-menu span{display:flex;gap:.4cqw}.fl-menu i{flex:1;border-bottom:.15cqw dotted rgba(255,255,255,.4)}
.bd-van2{background:#DCE9FB;font-family:Poppins,sans-serif}
.ch-fly{position:absolute;left:3%;top:7%;width:25%;height:86%;background:#fff;rotate:-2deg;box-shadow:0 2cqw 4cqw rgba(11,42,91,.3);display:grid;grid-template-rows:42% auto auto auto auto;gap:1cqw;padding:1.4cqw;color:var(--c1)}.ch-fp{overflow:hidden}.ch-fly>b{font:700 2.6cqw/1.1 Poppins}.ch-fly ul{list-style:none;padding:0;display:grid;gap:.4cqw;font-size:1.4cqw}.ch-fly li::before{content:"✓ ";color:var(--c0);font-weight:700}.ch-pr{display:flex;align-items:baseline;gap:.8cqw;font-size:1.4cqw}.ch-pr b{font:700 3.4cqw Poppins;color:var(--c0)}.ch-fly em{font-style:normal;background:var(--c0);color:#fff;text-align:center;padding:.8cqw;font-size:1.4cqw;font-weight:600}
.ch-polo{position:absolute;left:32%;top:7%;width:14%}.ch-polo svg{width:100%;display:block;filter:drop-shadow(0 1cqw 1.6cqw rgba(0,0,0,.25))}.ch-polo span{position:absolute;left:58%;top:30%;width:18%}.ch-polo span svg{filter:none}
.ch-hang{position:absolute;left:50%;top:6%;width:10%;aspect-ratio:.42;background:#fff;border-radius:1cqw;display:grid;align-content:end;justify-items:center;gap:.5cqw;padding:1.2cqw;text-align:center;box-shadow:0 1.4cqw 2.4cqw rgba(0,0,0,.25);font-size:.9cqw}.ch-hang i{position:absolute;top:2cqw;left:50%;translate:-50% 0;width:3cqw;height:3cqw;border-radius:50%;background:#DCE9FB}.ch-hang div{width:4cqw}.ch-hang div svg{width:100%;display:block}.ch-hang b{font:700 1.4cqw Poppins}.ch-hang u{text-decoration:none;color:var(--c0);font-weight:700}
.ch-van{position:absolute;left:32%;top:40%;width:50%}.ch-van svg{width:100%;display:block;filter:drop-shadow(0 1.6cqw 2cqw rgba(11,42,91,.35))}.ch-lg{position:absolute;left:7%;top:42%;width:46%}
.ch-ph{position:absolute;right:4%;top:6%;width:18%;aspect-ratio:1;border-radius:50%;overflow:hidden;border:.6cqw solid #fff;box-shadow:0 1.4cqw 2.4cqw rgba(0,0,0,.25)}
.bd-bake{background-color:#D2B07A;background-image:radial-gradient(rgba(90,46,31,.14) 1px,transparent 1.4px);background-size:1.6cqw 1.6cqw;font-family:'Fraunces',serif;color:var(--c1)}
.sx-poster{position:absolute;left:3%;top:7%;width:24%;height:86%;background:#232a27;rotate:-1.5deg;display:grid;grid-template-rows:62% 38%;overflow:hidden;box-shadow:0 2cqw 4cqw rgba(60,30,10,.4)}.sx-poster>div{padding:1.8cqw;color:#f6ebd6;display:grid;align-content:center;gap:.6cqw}.sx-poster b{font:800 3.6cqw/1 Fraunces}.sx-poster span{font:600 1.1cqw Inter;letter-spacing:.14em;color:var(--c2)}
.sx-chalk{position:absolute;left:30%;top:10%;width:23%;height:70%;background:#232a27;border:.9cqw solid #8a6a43;color:#f6ebd6;padding:2cqw;display:grid;align-content:start;gap:1.2cqw;box-shadow:0 2cqw 3cqw rgba(0,0,0,.35)}.sx-chalk b{font:800 3cqw Fraunces;border-bottom:.2cqw dashed rgba(255,255,255,.4);padding-bottom:.8cqw}.sx-chalk ul{list-style:none;padding:0;display:grid;gap:.9cqw;font-size:1.7cqw}.sx-chalk li{display:flex;gap:.5cqw;align-items:baseline}.sx-chalk li i{flex:1;border-bottom:.2cqw dotted rgba(255,255,255,.5)}.sx-w{position:absolute;right:1.6cqw;bottom:1.2cqw;width:7cqw}.sx-w svg{width:100%}
.sx-box{position:absolute;left:56%;top:26%;width:24%;height:48%;background:#C79A5A;box-shadow:0 2cqw 3cqw rgba(60,30,10,.4);display:grid;place-items:center}.sx-box::before{content:"";position:absolute;left:0;right:0;top:0;height:14%;background:#A67C3F}.sx-win{width:70%;aspect-ratio:1.5;overflow:hidden;margin-top:8%}.sx-lb{position:absolute;left:50%;bottom:6%;translate:-50% 0;display:flex;align-items:center;gap:.8cqw;background:var(--c3);padding:.7cqw 1.4cqw}.sx-lb .ic{width:2.6cqw;height:2.6cqw}.sx-lb b{font:800 1.6cqw Fraunces}
.sx-bag{position:absolute;right:3%;top:10%;width:15%;aspect-ratio:.64;background:#C79A5A;clip-path:polygon(4% 3%,96% 3%,100% 100%,0 100%);display:grid;place-items:center}.sx-bag::before{content:"";position:absolute;left:0;right:0;top:0;height:9%;background:#A67C3F}.sx-bl{background:var(--c3);padding:1.2cqw;display:grid;justify-items:center;gap:.3cqw;text-align:center}.sx-bl .ic{width:4.6cqw;height:4.6cqw}.sx-bl b{font:800 1.5cqw Fraunces}.sx-bl span{font:600 .75cqw Inter;letter-spacing:.2em}
.sx-st{position:absolute;right:6%;bottom:7%;display:flex;gap:1.2cqw}.sx-st i{width:7cqw;height:7cqw;border-radius:50%;background:var(--c2);display:grid;place-items:center;padding:.9cqw;font-style:normal}.sx-st i.b{background:var(--c0);color:#fff}.sx-st b{font:800 1.3cqw Fraunces}.sx-st svg{width:100%}