/* Antes y después · componente DT Clinic */
.ba-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,26px)}
.ba-grid--1{grid-template-columns:minmax(0,620px)}
.ba-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ba{margin:0;border-radius:var(--r);overflow:hidden;border:2px solid transparent;background:var(--grain-d) padding-box,linear-gradient(var(--dbox),var(--dbox)) padding-box,linear-gradient(135deg,#9C7740,#D8B57A 22%,#F6E4BC 45%,#C29A60 62%,#EED8A8 80%,#9C7740) border-box;box-shadow:0 18px 44px -26px rgba(40,26,12,.55);color:var(--ctxt)}
.ba[hidden]{display:none}
.ba-media{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#15100D}
.ba-ph{position:relative}
.ba-ph img{display:block;width:100%;height:auto;aspect-ratio:600/857;object-fit:cover}
.ba--stack .ba-media{grid-template-columns:1fr}
.ba--stack .ba-ph img{aspect-ratio:1200/422}
.ba-tag{position:absolute;left:10px;bottom:10px;padding:.44rem .72rem;border-radius:999px;font:500 .64rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;background:rgba(21,16,13,.74);color:#FBF5EA;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ba-tag.a{background:var(--grad-light);color:#1B1612}
.ba--stack .ba-tag{bottom:auto;top:10px}
.ba-cap{display:grid;gap:.32rem;padding:1rem 1.15rem 1.2rem}
.ba-cap b{font:500 1.16rem/1.22 var(--serif);color:var(--chead)}
.ba-cap span{font:400 .72rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ctxt-m)}
.ba-cap a{justify-self:start;margin-top:.25rem;font-size:.92rem;color:var(--gold-l);text-decoration:underline;text-underline-offset:3px}
.ba-filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:clamp(1.4rem,3vw,2.2rem)}
.ba-filter button{font:500 .74rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;padding:.8rem 1.15rem;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.ba-filter button small{margin-left:.35rem;opacity:.6;letter-spacing:.06em}
.ba-filter button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#FBF5EA}
.ba-filter button:focus-visible{outline:2px solid var(--gold-d);outline-offset:2px}
.ba-note{margin:clamp(1.4rem,3vw,2rem) 0 0;font-size:.9rem;line-height:1.65;color:var(--muted);max-width:78ch}
.ba-text{font-size:1.04rem;line-height:1.75;color:var(--ink-2)}
.ba-text h3{margin:1.6rem 0 .5rem}
@media (max-width:1180px){.ba-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.ba-grid,.ba-grid--2{grid-template-columns:1fr}.ba-filter button{padding:.72rem .95rem}}

/* Historias: barra de casos y visor a pantalla completa */
.bs-bar{display:flex;gap:clamp(.8rem,1.6vw,1.3rem);overflow-x:auto;scroll-snap-type:x proximity;padding:.4rem 2px 1rem;margin:0 0 .4rem;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent)}
.bs-bar::-webkit-scrollbar{display:none}
.bs-bar[hidden],.bs-ring[hidden],.bs-hint[hidden]{display:none}
.bs-ring{flex:0 0 auto;width:98px;display:flex;flex-direction:column;align-items:center;gap:.45rem;padding:0;border:0;background:none;color:var(--ink);font:400 .68rem/1.25 var(--sans);text-align:center;cursor:pointer;scroll-snap-align:start}
.bs-av{width:88px;height:88px;border-radius:50%;padding:3px;background:conic-gradient(from 210deg,#8A6A3E,#C9A46A,#F3E2BB,#B08A57,#E9D3A1,#8A6A3E);box-shadow:0 8px 18px -12px rgba(48,32,14,.6);transition:transform .45s var(--ease,ease)}
.bs-av img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid var(--bg);background:#15100D}
.bs-ring:hover .bs-av{transform:scale(1.06)}
.bs-ring:focus-visible{outline:none}
.bs-ring:focus-visible .bs-av{outline:2px solid var(--gold-d);outline-offset:3px}
.bs-ring.is-seen .bs-av{background:rgba(120,100,80,.35);box-shadow:none}
.bs-l{font:500 .74rem/1.2 var(--sans);max-width:100px}
.bs-n{font:400 .64rem/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:-.2rem}
.bs-hint{margin:0 0 clamp(1.4rem,3vw,2rem);font-size:.86rem;color:var(--muted)}
.ba-media[role="button"]{cursor:pointer}
.ba-media[role="button"]:focus-visible{outline:2px solid var(--gold-d);outline-offset:-2px}
html.bs-lock{overflow:hidden}
.bs-view{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;background:rgba(12,9,7,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.bs-view[hidden]{display:none}
.bs-stage{position:relative;width:min(100vw,calc(100dvh * 9 / 16),460px);height:min(100dvh,818px);max-height:100dvh;border-radius:22px;overflow:hidden;background:#15100D;box-shadow:0 40px 90px -30px #000;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.bs-bg{position:absolute;inset:-40px;background-size:cover;background-position:center;filter:blur(28px) brightness(.5) saturate(1.1);transform:scale(1.1)}
.bs-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .35s ease;-webkit-user-drag:none}
.bs-stage.is-swap .bs-img{opacity:.25}
.bs-top{position:absolute;inset:0 0 auto;z-index:3;padding:12px 12px 34px;background:linear-gradient(180deg,rgba(10,7,5,.72),transparent)}
.bs-prog{display:flex;gap:4px}
.bs-prog i{flex:1}
.bs-prog i{display:block;height:3px;border-radius:3px;background:rgba(255,255,255,.3);overflow:hidden}
.bs-prog b{display:block;height:100%;background:#F3E2BB;transform:scaleX(0);transform-origin:left}
.bs-head{display:flex;align-items:center;gap:.6rem;margin-top:.7rem;color:#FBF5EA}
.bs-logo{width:36px;height:36px;border-radius:50%;padding:2px;background:conic-gradient(from 210deg,#8A6A3E,#F3E2BB,#B08A57,#8A6A3E);flex:none}
.bs-logo img{width:100%;height:100%;border-radius:50%;object-fit:contain;background:#F4EFE8}
.bs-meta{display:grid;line-height:1.2;min-width:0;margin-right:auto}
.bs-meta b{font:500 .84rem/1.2 var(--sans);color:#FBF5EA}
.bs-meta small{font:400 .72rem/1.2 var(--sans);color:rgba(251,245,234,.72)}
.bs-btn{width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#FBF5EA;display:grid;place-items:center;cursor:pointer;flex:none}
.bs-btn svg,.bs-arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.bs-pause .p2{display:none;fill:currentColor;stroke:none}
.bs-view.is-paused .bs-pause .p1{display:none}
.bs-view.is-paused .bs-pause .p2{display:block}
.bs-nav{position:absolute;top:0;bottom:0;z-index:2;width:34%;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.bs-prev{left:0}
.bs-next{right:0;width:66%}
.bs-nav:focus-visible{outline:2px solid #F3E2BB;outline-offset:-4px}
.bs-foot{position:absolute;inset:auto 0 0;z-index:3;padding:46px 16px 16px;background:linear-gradient(0deg,rgba(10,7,5,.86) 30%,transparent);color:#FBF5EA;pointer-events:none}
.bs-foot a{pointer-events:auto}
.bs-chip{display:inline-block;padding:.5rem .85rem;border-radius:999px;font:500 .66rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;background:rgba(21,16,13,.78);color:#FBF5EA;border:1px solid rgba(243,226,187,.35)}
.bs-chip.is-after{background:linear-gradient(135deg,#C9A46A,#F3E2BB 55%,#C29A60);color:#1B1612;border-color:transparent}
.bs-title{margin:.6rem 0 .1rem;font:500 1.32rem/1.2 var(--serif);color:#FBF5EA}
.bs-count{margin:0;font:400 .74rem/1.3 var(--sans);letter-spacing:.08em;color:rgba(251,245,234,.7)}
.bs-cta{display:flex;gap:.6rem;margin-top:.85rem}
.bs-cta a{flex:1;display:grid;place-items:center;min-height:44px;padding:0 .8rem;border-radius:999px;font:500 .74rem/1.1 var(--sans);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;text-align:center}
.bs-cta a[hidden]{display:none}
.bs-link{border:1px solid rgba(243,226,187,.5);color:#FBF5EA}
.bs-wa{background:linear-gradient(135deg,#C9A46A,#F3E2BB 55%,#C29A60);color:#1B1612}
.bs-arrow{position:absolute;top:50%;width:46px;height:46px;margin-top:-23px;border-radius:50%;border:1px solid rgba(243,226,187,.35);background:rgba(21,16,13,.6);color:#FBF5EA;display:grid;place-items:center;cursor:pointer}
.bs-al{left:calc(50% - 300px)}
.bs-ar{right:calc(50% - 300px)}
@media (max-width:700px){.bs-arrow{display:none}.bs-stage{width:100vw;height:100dvh;border-radius:0}.bs-ring{width:84px}.bs-av{width:74px;height:74px}.bs-l{max-width:86px}}
@media (prefers-reduced-motion:reduce){.bs-img,.bs-av{transition:none}}

/* sin huecos: la última fila se centra y, con cuatro casos, van los cuatro en una fila */
.ba-grid,.ba-grid--1,.ba-grid--2{display:flex;flex-wrap:wrap;justify-content:center;--bag:clamp(14px,2vw,26px);gap:var(--bag)}
.ba-grid>.ba{flex:0 1 calc((100% - 2*var(--bag))/3);min-width:0}
.ba-grid:has(>.ba:nth-child(4):last-child)>.ba{flex-basis:calc((100% - 3*var(--bag))/4)}
.ba-grid:has(>.ba:nth-child(2):last-child)>.ba,.ba-grid--2>.ba{flex-basis:calc((100% - var(--bag))/2)}
.ba-grid:has(>.ba:only-child)>.ba,.ba-grid--1>.ba{flex-basis:min(620px,100%)}
@media (max-width:1180px){.ba-grid>.ba,.ba-grid:has(>.ba:nth-child(4):last-child)>.ba{flex-basis:calc((100% - var(--bag))/2)}}
@media (max-width:760px){.ba-grid>.ba,.ba-grid--2>.ba,.ba-grid:has(>.ba:nth-child(4):last-child)>.ba,.ba-grid:has(>.ba:nth-child(2):last-child)>.ba{flex-basis:100%}}