.dashicons-bs-tb-filtros {
    width: 24px;
    height: 24px;
    background: url(icon.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}

/* Team Buildings · «¿Para qué?» + tarjetas. Todo scoped a .bs-tbf y con
   clases prefijadas (tbf-*) para no chocar con el CSS del tema. */
.bs-tbf {
	--o1: #F68B29;
	--o2: #D9700F;
	--o3: #A4520A;
	--o4: #F2B36A;
	--tint: #FCF1E6;
	--ink: #1a1a1a;
	--line: #E6E4DE;
	--muted: #5c5c5c;
	--soft: #8a8a8a;
	color: var(--ink);
	line-height: 1.5;
}
:where(.bs-tbf *) { box-sizing: border-box; margin: 0; padding: 0; }
:where(.bs-tbf button) { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; text-align: left; }
:where(.bs-tbf a) { color: inherit; text-decoration: none; }

.bs-tbf .tbf-wrap { width: 100%; max-width: var(--wp--style--global--wide-size, 1380px); margin: 0 auto; }

.bs-tbf .tbf-pill { display: inline-flex; align-items: center; gap: 8px; background: #000; color: #fff; border-radius: 999px; padding: 12px 22px; font-size: 15px; font-weight: 500; white-space: nowrap; transition: background .2s; }
.bs-tbf .tbf-pill:hover { background: var(--o2); }
.bs-tbf .tbf-pill.tbf-ghost { background: #fff; color: var(--ink); border: 1px solid var(--line); }
.bs-tbf .tbf-pill.tbf-ghost:hover { border-color: var(--o2); color: var(--o2); }
.bs-tbf .tbf-lead { font-size: 17px; color: var(--muted); max-width: 560px; }

/* ---------- ¿Para qué? ---------- */
.bs-tbf .tbf-pq { display: flex; align-items: center; gap: 8px; margin: 0 0 32px; flex-wrap: wrap; }
.bs-tbf .tbf-pq .tbf-l { font-size: 15px; font-weight: 700; margin-right: 6px; }
.bs-tbf .tbf-pqc { display: flex; gap: 7px; align-items: center; background: #fff; border: 1px solid #E1DED6; border-radius: 999px; padding: 7px 12px; font-size: 13.5px; white-space: nowrap; transition: .15s; }
.bs-tbf .tbf-pqc:hover { border-color: var(--o1); }
.bs-tbf .tbf-pqc.tbf-on { background: var(--ink); color: #fff; border-color: var(--ink); }
.bs-tbf .tbf-pqc.tbf-on svg { stroke: #fff; }
.bs-tbf .tbf-pqc em { font-style: normal; font-size: 10.5px; font-weight: 700; color: #fff; background: var(--o2); border-radius: 6px; padding: 1px 6px; letter-spacing: .04em; text-transform: uppercase; }

/* ---------- sección ---------- */
.bs-tbf .tbf-tbsec { padding: 0; }

/* ---------- tarjetas ---------- */
.bs-tbf .tbf-exps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.bs-tbf .tbf-exp { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; transition: opacity .2s, transform .2s; }
.bs-tbf .tbf-exp.tbf-dim { opacity: .25; }
.bs-tbf .tbf-exp.tbf-hit { box-shadow: 0 0 0 2px var(--o1); }
.bs-tbf .tbf-ev { display: block; height: 150px; position: relative; }
.bs-tbf .tbf-ev-anim { display: flex; height: 100%; align-items: center; justify-content: center; background: #FBF8F3; }
.bs-tbf .tbf-mini { width: 100%; height: 100%; }
.bs-tbf .tbf-mini * { transform-box: fill-box; }
.bs-tbf .tbf-eb { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 22px; }
.bs-tbf .tbf-etag { align-self: flex-start; display: inline-block; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: var(--o3); background: var(--tint); border-radius: 6px; padding: 3px 8px; }
.bs-tbf .tbf-eb h3 { font-size: 21px; line-height: 1.15; font-weight: 800; margin-top: 12px; }
.bs-tbf .tbf-eb p { font-size: 14.5px; color: var(--muted); margin-top: 4px; }
.bs-tbf .tbf-eb .tbf-mom { font-size: 16px; line-height: 1.3; font-style: italic; font-weight: 600; color: var(--o2); margin-top: 8px; }
.bs-tbf .tbf-eb .tbf-etxt { font-size: 14.5px; color: #4a4a4a; margin-top: 10px; line-height: 1.55; }
.bs-tbf .tbf-rec { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 14px; font-size: 13px; font-weight: 600; }
.bs-tbf .tbf-rec span { background: #F4F4F1; border-radius: 8px; padding: 5px 9px; }
.bs-tbf .tbf-rec .tbf-ra { background: none; padding: 0; color: var(--o1); }
.bs-tbf .tbf-mix { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--line); }
.bs-tbf .tbf-mi { display: flex; justify-content: space-between; align-items: center; font-size: 12.5px; }
.bs-tbf .tbf-mi b { font-weight: 600; color: #444; }
.bs-tbf .tbf-mi i { display: flex; gap: 4px; font-style: normal; }
.bs-tbf .tbf-mi em { display: block; width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--o1); }
.bs-tbf .tbf-mi em.tbf-on, .bs-tbf .tbf-mi em.on { background: var(--o1); }
.bs-tbf .tbf-eb .tbf-emeta { font-size: 13px; color: var(--soft); margin-top: auto; padding-top: 14px; }
.bs-tbf .tbf-eb .tbf-eobj { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--o3); margin-top: 10px; }


/* ---------- animaciones SVG ---------- */
.bs-tbf .tbf-spot { animation: bs-tbf-spot 10s ease-in-out infinite; }
.bs-tbf .tbf-fig { fill: #CFCBC2; animation: bs-tbf-lit 10s ease-in-out infinite; }
.bs-tbf .tbf-f1 { animation-delay: 2s; }
.bs-tbf .tbf-f2 { animation-delay: 4s; }
.bs-tbf .tbf-f3 { animation-delay: 6s; }
.bs-tbf .tbf-f4 { animation-delay: 8s; }
.bs-tbf .tbf-dsc.tbf-d0 { animation: bs-tbf-dz0 6s ease-in-out infinite; }
.bs-tbf .tbf-dsc.tbf-d1 { animation: bs-tbf-dz1 6s ease-in-out infinite; }
.bs-tbf .tbf-dsc.tbf-d2 { animation: bs-tbf-dz2 6s ease-in-out infinite; }
.bs-tbf .tbf-dsc.tbf-d3 { animation: bs-tbf-dz3 6s ease-in-out infinite; }
.bs-tbf .tbf-dlink { animation: bs-tbf-dl 6s ease-in-out infinite; }
.bs-tbf .tbf-bar { transform-origin: 50% 100%; animation: bs-tbf-eq 1.1s ease-in-out infinite alternate; }
.bs-tbf .tbf-b1 { animation-duration: .8s; }
.bs-tbf .tbf-b2 { animation-duration: 1.3s; animation-delay: -.4s; }
.bs-tbf .tbf-b3 { animation-duration: .95s; animation-delay: -.2s; }
.bs-tbf .tbf-b4 { animation-duration: 1.5s; animation-delay: -.7s; }
.bs-tbf .tbf-note { animation: bs-tbf-nt 3.2s ease-out infinite; }
.bs-tbf .tbf-n2 { animation-delay: 1.6s; }
.bs-tbf .tbf-march { animation: bs-tbf-mr 1.2s linear infinite; }
.bs-tbf .tbf-bub { transform-origin: 0 100%; animation: 6s ease-out infinite; }
.bs-tbf .tbf-k1 { animation-name: bs-tbf-bb1; }
.bs-tbf .tbf-k2 { animation-name: bs-tbf-bb2; }
.bs-tbf .tbf-k3 { animation-name: bs-tbf-bb3; }
.bs-tbf .tbf-pc { animation: 6s ease-in-out infinite; }
.bs-tbf .tbf-p0 { animation-name: bs-tbf-pp0; }
.bs-tbf .tbf-p1 { animation-name: bs-tbf-pp1; }
.bs-tbf .tbf-p2 { animation-name: bs-tbf-pp2; }
.bs-tbf .tbf-p3 { animation-name: bs-tbf-pp3; }
.bs-tbf .tbf-shackle { animation: bs-tbf-sh 6s ease-in-out infinite; }

@keyframes bs-tbf-spot{0%,16%{transform:translateX(0);opacity:1}20%,36%{transform:translateX(50px)}40%,56%{transform:translateX(100px)}60%,76%{transform:translateX(150px)}80%,94%{transform:translateX(200px);opacity:1}98%{transform:translateX(200px);opacity:0}100%{transform:translateX(0);opacity:0}}
@keyframes bs-tbf-lit{0%,15%{fill:#F68B29}19%,100%{fill:#CFCBC2}}
@keyframes bs-tbf-dz0{0%,100%{transform:translate(-95px,-28px)}38%,78%{transform:translate(0,0)}}
@keyframes bs-tbf-dz1{0%,100%{transform:translate(98px,-30px)}38%,78%{transform:translate(0,0)}}
@keyframes bs-tbf-dz2{0%,100%{transform:translate(-88px,34px)}38%,78%{transform:translate(0,0)}}
@keyframes bs-tbf-dz3{0%,100%{transform:translate(96px,30px)}38%,78%{transform:translate(0,0)}}
@keyframes bs-tbf-dl{0%,36%{opacity:0}46%,74%{opacity:1}82%,100%{opacity:0}}
@keyframes bs-tbf-eq{from{transform:scaleY(.3)}to{transform:scaleY(1)}}
@keyframes bs-tbf-nt{0%{transform:translateY(14px);opacity:0}25%{opacity:1}100%{transform:translateY(-30px);opacity:0}}
@keyframes bs-tbf-mr{to{stroke-dashoffset:-24}}
@keyframes bs-tbf-bb1{0%,6%{transform:scale(0);opacity:0}14%,84%{transform:scale(1);opacity:1}94%,100%{opacity:0}}
@keyframes bs-tbf-bb2{0%,24%{transform:scale(0);opacity:0}32%,84%{transform:scale(1);opacity:1}94%,100%{opacity:0}}
@keyframes bs-tbf-bb3{0%,44%{transform:scale(0);opacity:0}54%,84%{transform:scale(1);opacity:1}94%,100%{opacity:0}}
@keyframes bs-tbf-pp0{0%,8%{transform:translate(-110px,-55px);opacity:0}12%{opacity:1}36%,88%{transform:translate(0,0);opacity:1}96%,100%{opacity:0}}
@keyframes bs-tbf-pp1{0%,14%{transform:translate(115px,-50px);opacity:0}18%{opacity:1}40%,88%{transform:translate(0,0);opacity:1}96%,100%{opacity:0}}
@keyframes bs-tbf-pp2{0%,20%{transform:translate(-105px,45px);opacity:0}24%{opacity:1}44%,88%{transform:translate(0,0);opacity:1}96%,100%{opacity:0}}
@keyframes bs-tbf-pp3{0%,26%{transform:translate(110px,45px);opacity:0}30%{opacity:1}48%,88%{transform:translate(0,0);opacity:1}96%,100%{opacity:0}}
@keyframes bs-tbf-sh{0%,52%{transform:translateY(0)}60%,86%{transform:translateY(-9px)}94%,100%{transform:translateY(0)}}

@media (prefers-reduced-motion: reduce) {
	.bs-tbf .tbf-mini * { animation: none !important; }
}

@media (max-width: 1100px) {
	.bs-tbf .tbf-exps { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
	.bs-tbf .tbf-exps { grid-template-columns: 1fr; }
	.bs-tbf .tbf-ev { height: 130px; }
}