/* ONDE ATENDO — one reusable block for every page that lists offices (index, sobre, marcar).
   Markup: <div class="offices"> + one <article class="office"> per office.
   To add an office: copy one whole <article class="office">…</article>, change its texts, links and
   image. Layout adapts by itself: 1 office = one wide card (print + details side by side);
   2+ offices = cards side by side, print on top. In marcar's sidebar use .offices--compact. */
.offices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:clamp(34px,5vw,64px);margin-top:clamp(30px,4.5vw,56px)}
.office{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-content:start;
  background:var(--card);border-radius:3px;box-shadow:var(--shadow-paper);padding:clamp(20px,2.6vw,30px)}
.office-print{--tilt:-2deg;margin:-6px 4px 0}
.office-print .ph{aspect-ratio:3/4;overflow:hidden}
.office-print img{object-position:50% 50%}
.office-body{position:relative;display:flex;flex-direction:column;gap:10px;min-width:0}
.office-body .stamp-wrap{position:absolute;right:0;top:0}
.office-place{display:block;font:600 1.6rem/1.05 var(--script);color:var(--red);padding-right:78px}
.office h3{font-size:clamp(1.6rem,2.4vw,2.1rem);line-height:1.12;margin:0;padding-right:78px}
.office address{font-style:normal;color:var(--ink-2);line-height:1.6}
.office-days{display:inline-flex;align-items:center;gap:10px;margin:2px 0 0;color:var(--ink-2);font-weight:500}
.office-days::before{content:"";width:22px;height:1px;background:var(--red);flex:none}
.office .btns{margin-top:10px;gap:10px 16px;align-items:center}

/* one office: a single wide card, intentional rather than half-empty */
.office:only-child{grid-column:1/-1;width:100%;max-width:1040px;margin-inline:auto;
  grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(30px,5vw,72px);align-items:center;
  padding:clamp(26px,4vw,52px) clamp(24px,4.5vw,60px) clamp(26px,4vw,52px) clamp(22px,3.5vw,44px);transform:rotate(-.4deg)}
.office:only-child .office-print{margin:calc(-1 * clamp(44px,6vw,80px)) 0 0;--tilt:-2.4deg}
.office:only-child .office-body{transform:rotate(.4deg)}
.office:only-child h3{font-size:clamp(1.8rem,3vw,2.5rem)}
@media (max-width:760px){
  .office:only-child{grid-template-columns:minmax(0,1fr);transform:none;padding:22px 20px 26px}
  .office:only-child .office-print{margin:-30px 10% 0;--tilt:-2deg}
  .office:only-child .office-body{transform:none}
}

/* compact (marcar sidebar card): text only, no print, no stamp, no booking button */
.offices--compact{display:block;margin-top:0}
.offices--compact .office{display:block;background:none;box-shadow:none;padding:0;transform:none;max-width:none}
.offices--compact .office + .office{margin-top:16px;padding-top:16px;border-top:1px solid var(--rule)}
.offices--compact .office-print,.offices--compact .stamp-wrap,.offices--compact .btn{display:none}
.offices--compact .office-body{transform:none;gap:6px}
.offices--compact .office-place{font:600 .74rem/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);padding:0}
.offices--compact .office h3,.book aside .card .offices--compact h3{font:600 1.05rem/1.3 var(--sans);padding:0;color:var(--ink)}
.offices--compact .office address{font-size:.95rem}
.offices--compact .office-days{font-size:.95rem}
.offices--compact .btns{margin-top:4px}
