/* =====================================================================
   PUEBLER — Feed, inicio, compositor, detalle, búsqueda, notificaciones, postal
   Pantalla completa, sin tarjetas flotantes ni degradados.
   ===================================================================== */

/* ---------- Héroe del inicio ---------- */
.pb-home-hero { background: var(--puebler-surface); border-bottom: 1px solid var(--puebler-border); }
.pb-home-hero-inner { padding: 26px 24px 22px; text-align: center; }
.pb-loc-badge { display: inline-flex; align-items: center; gap: 8px; font-size: .8rem; font-weight: 700; color: var(--puebler-text); border: 1px solid var(--puebler-border); border-radius: 50px; padding: 6px 14px; background: var(--puebler-surface-2); }
.pb-loc-badge .bi-geo-alt-fill { color: var(--puebler-coral); }
.pb-loc-badge .bi-compass { color: var(--puebler-blue); }
.pb-loc-sep { width: 1px; height: 14px; background: var(--puebler-border); }
.pb-home-title { font-size: clamp(1.6rem, 3vw, 2.3rem); font-weight: 800; letter-spacing: -.8px; margin: 14px 0 6px; }
.pb-home-title span { color: var(--puebler-coral); }
.pb-home-sub { color: var(--puebler-text-muted); max-width: 680px; margin: 0 auto 18px; font-size: 1.02rem; }
.pb-home-search {
  max-width: 900px; margin: 0 auto; display: flex; align-items: center; gap: 10px;
  border: 1px solid var(--puebler-border); border-radius: 60px; padding: 6px 6px 6px 20px; background: var(--puebler-surface); box-shadow: var(--puebler-shadow-md);
}
.pb-home-search > i { color: var(--puebler-text-muted); font-size: 1.1rem; }
.pb-home-search input[type=search] { flex: 1; border: 0; outline: 0; background: transparent; font-size: .98rem; padding: 8px 0; color: var(--puebler-text); min-width: 0; }
.pb-home-search-loc { align-items: center; gap: 6px; font-weight: 700; font-size: .88rem; padding: 0 14px; border-left: 1px solid var(--puebler-border); white-space: nowrap; }
.pb-home-search-loc i { color: var(--puebler-coral); }

/* ---------- Barra de tipos ---------- */
.pb-typebar { display: flex; gap: 8px; overflow-x: auto; padding: 12px 20px; background: var(--puebler-surface); border-bottom: 1px solid var(--puebler-border); scrollbar-width: none; }
.pb-typebar::-webkit-scrollbar { display: none; }
.pb-typechip {
  --chip: var(--puebler-blue);
  display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; padding: 8px 16px 8px 8px; border-radius: 50px;
  border: 1px solid var(--puebler-border); color: var(--puebler-text); font-weight: 700; font-size: .88rem; background: var(--puebler-surface); transition: all .2s;
}
.pb-typechip i { width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--chip); background: color-mix(in srgb, var(--chip) 13%, transparent); }
.pb-typechip:hover { border-color: var(--chip); color: var(--chip); }
.pb-typechip.active { background: var(--chip); border-color: var(--chip); color: #fff; }
.pb-typechip.active i { background: rgba(255,255,255,.18); color: #fff; }

/* ---------- Historias ---------- */
.pb-stories { display: flex; gap: 16px; overflow-x: auto; padding: 14px 20px; background: var(--puebler-surface); border-bottom: 1px solid var(--puebler-border); align-items: center; scrollbar-width: thin; }
.pb-stories-label { writing-mode: vertical-rl; transform: rotate(180deg); font-size: .66rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--puebler-text-muted); display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
.pb-story { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 70px; color: var(--puebler-text); }
.pb-story-ring { width: 62px; height: 62px; border-radius: 50%; border: 3px solid var(--puebler-coral); padding: 2px; display: block; }
.pb-story-ring img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.pb-story:hover .pb-story-ring { border-color: var(--puebler-blue); }
.pb-story-name { font-size: .7rem; font-weight: 700; max-width: 72px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- División feed / mapa ---------- */
.pb-split { display: grid; grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); align-items: start; border-bottom: 1px solid var(--puebler-border); }
.pb-split-feed { background: var(--puebler-surface); border-right: 1px solid var(--puebler-border); min-height: calc(100vh - var(--topbar-h)); }
.pb-feed-tabs { position: sticky; top: var(--topbar-h); z-index: 20; background: var(--puebler-surface); padding: 0 12px; }
.pb-split-map { position: sticky; top: var(--topbar-h); height: calc(100vh - var(--topbar-h)); }
.pb-home-map { height: 100%; }
.pb-compose-prompt { display: flex; align-items: center; gap: 12px; padding: 14px 22px; border-bottom: 1px solid var(--puebler-border); color: var(--puebler-text-muted); font-weight: 600; }
.pb-compose-prompt > span:nth-child(2) { flex: 1; background: var(--puebler-surface-2); border: 1px solid var(--puebler-border); border-radius: 50px; padding: 10px 16px; }
.pb-compose-prompt:hover { color: var(--puebler-text); }
.pb-guest-band { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 22px; border-bottom: 1px solid var(--puebler-border); background: var(--puebler-blue-light); }
.pb-guest-band span { display: block; font-size: .85rem; color: var(--puebler-text-muted); }
.pb-feed-more, .pb-feed-end { text-align: center; padding: 22px; color: var(--puebler-text-muted); font-size: .88rem; font-weight: 600; }
.pb-feed-more[hidden] { display: none; }
.pb-map-legend { position: absolute; top: 14px; left: 14px; z-index: 500; display: flex; gap: 12px; background: var(--puebler-surface); border: 1px solid var(--puebler-border); padding: 7px 14px; border-radius: 50px; font-size: .76rem; font-weight: 700; box-shadow: var(--puebler-shadow-md); }
.pb-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 4px; vertical-align: -1px; }
.pb-map-bar {
  position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); z-index: 500;
  background: var(--puebler-surface); border-radius: 50px; padding: 6px 16px; box-shadow: 0 8px 28px rgba(0,0,0,.18);
  display: flex; align-items: center; gap: 10px; border: 1px solid var(--puebler-border);
}
.pb-map-bar-item { background: transparent; border: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; color: var(--puebler-text); font-size: .7rem; font-weight: 700; padding: 4px 8px; border-radius: 12px; }
.pb-map-bar-item i { font-size: 1.1rem; color: var(--puebler-blue-dark); }
.pb-map-bar-item:hover { background: var(--puebler-blue-light); color: var(--puebler-blue-dark); }
.pb-map-bar-add { width: 50px; height: 50px; border-radius: 50%; background: var(--puebler-blue); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; box-shadow: 0 4px 14px rgba(11,157,176,.4); }
.pb-map-bar-add:hover { background: var(--puebler-blue-dark); color: #fff; transform: scale(1.06); }
.pb-popup strong { display: block; font-size: .95rem; color: #16253B; }
.pb-popup small { display: block; color: #5A6A80; margin: 2px 0 6px; }
.pb-popup a { font-weight: 700; font-size: .82rem; }

/* ---------- Bandas inferiores ---------- */
.pb-band-section { background: var(--puebler-surface); border-bottom: 1px solid var(--puebler-border); padding: 30px 24px; }
.pb-band-flush { padding-left: 0; padding-right: 0; padding-bottom: 0; }
.pb-band-flush .pb-band-head { padding: 0 24px; }
.pb-band-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.pb-band-title { font-size: 1.55rem; font-weight: 800; letter-spacing: -.5px; margin: 0; }
.pb-popular { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 36px; }
.pb-popular li { border-bottom: 1px solid var(--puebler-border-soft); }
.pb-popular-row { display: flex; align-items: center; gap: 14px; padding: 12px 0; color: var(--puebler-text); }
.pb-popular-row:hover { color: var(--puebler-text); transform: translateX(3px); }
.pb-popular-n { font-family: var(--font-serif); font-size: 1.4rem; font-weight: 800; color: var(--puebler-blue); width: 24px; }
.pb-popular-row img { width: 58px; height: 58px; border-radius: 12px; object-fit: cover; }
.pb-popular-info { flex: 1; min-width: 0; }
.pb-popular-info strong { display: block; }
.pb-popular-info span { font-size: .8rem; color: var(--puebler-text-muted); }
.pb-popular-count { font-size: .8rem; color: var(--puebler-text-muted); text-align: right; }
.pb-popular-count b { display: block; font-size: 1.1rem; color: var(--puebler-text); }
.pb-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.pb-tile { position: relative; height: 300px; overflow: hidden; display: block; color: #fff; }
.pb-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.pb-tile::after { content: ''; position: absolute; inset: 0; background: rgba(16,28,45,.38); transition: background .3s; }
.pb-tile:hover img { transform: scale(1.07); }
.pb-tile:hover::after { background: rgba(16,28,45,.55); }
.pb-tile-tag { position: absolute; top: 14px; left: 14px; z-index: 2; background: #fff; color: #16253B; font-size: .7rem; font-weight: 800; padding: 4px 12px; border-radius: 30px; }
.pb-tile-text { position: absolute; left: 16px; right: 16px; bottom: 16px; z-index: 2; }
.pb-tile-text strong { display: block; font-family: var(--font-heading); font-size: 1.3rem; font-weight: 800; color: #fff; }
.pb-tile-text span { font-size: .8rem; opacity: .9; }
.pb-subregions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; }
.pb-subregion { --sr: #0B9DB0; display: flex; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--puebler-border-soft); color: var(--puebler-text); }
.pb-subregion:hover { color: var(--sr); }
.pb-subregion-ico { width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: var(--sr); background: color-mix(in srgb, var(--sr) 12%, transparent); flex-shrink: 0; }
.pb-subregion strong { display: block; }
.pb-subregion small { color: var(--puebler-text-muted); font-weight: 600; }
.pb-cta-band { background: #16253B; color: #fff; padding: 34px 24px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.pb-cta-band h2 { color: #fff; font-size: 1.5rem; font-weight: 800; margin: 4px 0; }
.pb-cta-band p { color: #B9C4D3; margin: 0; max-width: 640px; }
.pb-btn-cta-ghost { border-color: rgba(255,255,255,.4); color: #fff; }
.pb-btn-cta-ghost:hover { background: #fff; color: #16253B; }

/* ---------- Compositor ---------- */
.pb-compose { background: var(--puebler-surface); min-height: calc(100vh - var(--topbar-h)); }
.pb-compose-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; padding: 26px 24px 18px; border-bottom: 1px solid var(--puebler-border); }
.pb-geo-status { display: inline-flex; gap: 8px; align-items: center; font-size: .84rem; font-weight: 700; color: var(--puebler-text-muted); padding: 7px 14px; border-radius: 50px; border: 1px solid var(--puebler-border); }
.pb-geo-status.is-ok { color: #1F7A3A; border-color: #BFE5CC; background: #E7F6EC; }
.pb-geo-status.is-bad { color: #9A6B00; border-color: #F3DDA2; background: #FFF6E0; }
.pb-type-tabs { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); border-bottom: 1px solid var(--puebler-border); overflow-x: auto; }
.pb-type-tabs input { display: none; }
.pb-type-tabs label {
  --chip: var(--puebler-blue);
  cursor: pointer; display: flex; flex-direction: column; gap: 3px; padding: 16px 14px; border-right: 1px solid var(--puebler-border-soft); border-bottom: 3px solid transparent; min-width: 130px; margin: 0;
}
.pb-type-tabs label i { font-size: 1.35rem; color: var(--chip); }
.pb-type-tabs label strong { font-size: .92rem; }
.pb-type-tabs label small { font-size: .72rem; color: var(--puebler-text-muted); line-height: 1.3; }
.pb-type-tabs label:hover { background: var(--puebler-surface-2); }
.pb-type-tabs input:checked + label { border-bottom-color: var(--chip); background: color-mix(in srgb, var(--chip) 7%, var(--puebler-surface)); }
.pb-compose-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; }
.pb-compose-main { padding: 22px 24px 40px; border-right: 1px solid var(--puebler-border); max-width: 900px; }
.pb-compose-side { padding: 22px 24px 40px; position: sticky; top: var(--topbar-h); align-self: start; }
.pb-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.pb-span-2 { grid-column: span 2; }
.pb-req { color: var(--puebler-coral); }
.pb-dest-picker { display: grid; grid-template-columns: 1fr 1.4fr auto; gap: 8px; align-items: center; }
.pb-near-list { margin-top: 8px; border-top: 1px solid var(--puebler-border); }
.pb-near-item { display: flex; width: 100%; gap: 10px; align-items: center; border: 0; border-bottom: 1px solid var(--puebler-border-soft); background: transparent; padding: 10px 4px; text-align: left; color: var(--puebler-text); }
.pb-near-item small { color: var(--puebler-text-muted); flex: 1; }
.pb-near-item:hover { background: var(--puebler-surface-2); }
.pb-validate { border: 0; padding: 0; }
.pb-validate-opts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border: 1px solid var(--puebler-border); border-radius: 14px; overflow: hidden; }
.pb-validate-opts input { display: none; }
.pb-validate-opts label { margin: 0; cursor: pointer; padding: 14px; display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--puebler-border); }
.pb-validate-opts label:last-of-type { border-right: 0; }
.pb-validate-opts label i { font-size: 1.3rem; color: var(--puebler-blue-dark); }
.pb-validate-opts label small { font-size: .74rem; color: var(--puebler-text-muted); font-weight: 500; }
.pb-validate-opts input:checked + label { background: var(--puebler-blue-light); box-shadow: inset 0 -3px 0 var(--puebler-blue); }
.pb-qr-box { margin-top: 12px; }
.pb-qr-video { margin-top: 10px; }
.pb-qr-video video { width: 100%; max-width: 360px; border-radius: 14px; background: #000; display: block; margin-bottom: 8px; }
.pb-notice { display: flex; gap: 12px; padding: 12px 16px; border-left: 4px solid var(--puebler-gold); background: color-mix(in srgb, var(--puebler-gold) 10%, var(--puebler-surface)); margin-bottom: 16px; font-size: .9rem; }
.pb-notice i { font-size: 1.3rem; color: #8B6914; }
.pb-transport-pick { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.pb-transport-pick input { display: none; }
.pb-transport-pick label { margin: 0; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 6px; border: 1px solid var(--puebler-border); border-radius: 14px; font-size: .74rem; font-weight: 700; color: var(--puebler-text); }
.pb-transport-pick input:checked + label { background: #16253B; color: #F6C453; border-color: #16253B; }
.pb-ticket-mini { margin-top: 12px; display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-radius: 14px; background: #FAFBFC; border: 1px dashed #CBD5E1; color: #0B1D3A; max-width: 520px; }
.pb-tm-city { font-family: var(--font-serif); font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.pb-tm-icon { width: 36px; height: 36px; border-radius: 50%; background: #0B1D3A; color: #F6C453; display: flex; align-items: center; justify-content: center; }
.pb-tm-date { margin-left: auto; font-size: .78rem; font-weight: 800; color: #64748B; }
.pb-dropzone { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 22px 12px; border: 2px dashed var(--puebler-border); border-radius: 14px; cursor: pointer; text-align: center; font-weight: 700 !important; }
.pb-dropzone i { font-size: 1.8rem; color: var(--puebler-blue); }
.pb-dropzone small { font-weight: 500; color: var(--puebler-text-muted); font-size: .74rem; }
.pb-dropzone:hover { border-color: var(--puebler-blue); background: var(--puebler-blue-light); }
.pb-previews { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin-top: 8px; }
.pb-previews img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px; }
[data-types][hidden] { display: none !important; }

/* ---------- Detalle de publicación ---------- */
.pb-post-page { display: grid; grid-template-columns: minmax(0, 1fr) 380px; background: var(--puebler-surface); min-height: calc(100vh - var(--topbar-h)); }
.pb-post-page-main { border-right: 1px solid var(--puebler-border); min-width: 0; }
.pb-post-page-main > .pb-post { border-bottom: 1px solid var(--puebler-border); }
.pb-crumbs { display: flex; gap: 8px; align-items: center; padding: 12px 22px; border-bottom: 1px solid var(--puebler-border); font-size: .84rem; color: var(--puebler-text-muted); }
.pb-crumbs a { color: var(--puebler-text-muted); font-weight: 700; }
.pb-section-title { font-size: 1.05rem; font-weight: 800; margin: 0 0 12px; }
.pb-reactions-detail, .pb-comments { padding: 20px 22px; border-bottom: 1px solid var(--puebler-border); }
.pb-react-list { list-style: none; margin: 0; padding: 0; }
.pb-react-list li { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--puebler-border-soft); }
.pb-react-n { flex: 1; font-size: .9rem; }
.pb-react-faces { display: flex; }
.pb-react-faces img { margin-left: -6px; border: 2px solid var(--puebler-surface); }
.pb-comment-form { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 14px; }
.pb-comment-form textarea { flex: 1; }
.pb-comment-list { list-style: none; padding: 0; margin: 0; }
.pb-comment { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--puebler-border-soft); }
.pb-comment.is-best { border-left: 4px solid #1F7A3A; padding-left: 12px; background: color-mix(in srgb, #1F7A3A 5%, var(--puebler-surface)); }
.pb-comment-body { flex: 1; min-width: 0; }
.pb-comment-body .pb-line1 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-bottom: 3px; }
.pb-comment-actions { display: flex; gap: 2px; margin-left: -10px; }
.pb-post-page-side { padding: 0; position: sticky; top: var(--topbar-h); align-self: start; }
.pb-post-map { height: 260px; border-bottom: 1px solid var(--puebler-border); }
.pb-side-block { padding: 18px 22px; border-bottom: 1px solid var(--puebler-border); }
.pb-side-dest { display: flex; gap: 12px; align-items: center; color: var(--puebler-text); }
.pb-side-dest strong { display: block; font-size: 1.05rem; }
.pb-side-dest small { color: var(--puebler-text-muted); }
.pb-related { list-style: none; margin: 0; padding: 0; }
.pb-related a { display: flex; gap: 10px; align-items: center; padding: 8px 0; color: var(--puebler-text); border-bottom: 1px solid var(--puebler-border-soft); }
.pb-related img { width: 54px; height: 54px; border-radius: 10px; object-fit: cover; }
.pb-related strong { display: block; font-size: .86rem; }
.pb-related small { color: var(--puebler-text-muted); font-size: .76rem; }

/* ---------- Búsqueda ---------- */
.pb-search-page { background: var(--puebler-surface); min-height: calc(100vh - var(--topbar-h)); }
.pb-search-big { margin: 0; max-width: none; border-radius: 0; border: 0; border-bottom: 1px solid var(--puebler-border); box-shadow: none; padding: 14px 20px; }
.pb-search-tabs { padding: 0 12px; }
.pb-search-section { padding: 18px 22px; border-bottom: 1px solid var(--puebler-border); }
.pb-search-posts { padding-left: 0; padding-right: 0; }
.pb-search-posts .pb-section-title { padding: 0 22px; }
.pb-search-thumb { width: 52px; height: 52px; border-radius: 10px; object-fit: cover; }

/* ---------- Notificaciones ---------- */
.pb-notif-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--puebler-border); }
.pb-notif-list li { border-bottom: 1px solid var(--puebler-border-soft); }
.pb-notif-list li.is-unread { background: var(--puebler-blue-light); }
.pb-notif-row { display: flex; align-items: center; gap: 14px; padding: 14px 8px; color: var(--puebler-text); }
.pb-notif-row:hover { color: var(--puebler-text); background: var(--puebler-surface-2); }
.pb-notif-ico { position: relative; flex-shrink: 0; }
.pb-notif-ico i { position: absolute; right: -4px; bottom: -4px; width: 22px; height: 22px; border-radius: 50%; background: var(--puebler-blue); color: #fff; font-size: .7rem; display: flex; align-items: center; justify-content: center; border: 2px solid var(--puebler-surface); }
.pb-notif-text { flex: 1; font-size: .92rem; }
.pb-notif-text small { display: block; color: var(--puebler-text-muted); font-size: .76rem; margin-top: 2px; }
.pb-unread-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--puebler-coral); }

/* ---------- Postal digital ---------- */
.pb-postcard { display: grid; grid-template-columns: 54fr 46fr; background: #FBF7EE; color: #16253B; box-shadow: var(--puebler-shadow-lg); aspect-ratio: 16 / 10; overflow: hidden; }
.pb-postcard-photo { position: relative; background: #1B4332; }
.pb-postcard-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pb-postcard-greet { position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 24px; background: rgba(16,28,45,.72); color: #F6E2AA; font-size: .8rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.pb-postcard-greet strong { display: block; color: #fff; font-family: var(--font-serif); font-size: clamp(1.4rem, 3.4vw, 2.6rem); letter-spacing: .03em; }
.pb-postcard-back { padding: 26px 30px; border-left: 2px dashed #C9B48F; display: flex; flex-direction: column; }
.pb-postcard-top { display: flex; justify-content: space-between; align-items: flex-start; }
.pb-postcard-logo { width: 48px; height: 48px; border-radius: 12px; }
.pb-postcard-msg { font-family: var(--font-serif); font-style: italic; font-size: clamp(.9rem, 1.5vw, 1.15rem); line-height: 1.5; margin: 14px 0; flex: 1; color: #3A2E22; }
.pb-postcard-lines span { display: block; border-bottom: 1px solid #C9B48F; padding: 6px 0; font-size: .82rem; font-weight: 700; }
.pb-postcard-slogan { margin: 10px 0 0; font-size: .72rem; font-weight: 800; letter-spacing: .1em; color: #B5121B; text-transform: uppercase; }

/* ---------- Responsive ---------- */
@media (max-width: 1199px) {
  .pb-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pb-compose-grid { grid-template-columns: minmax(0, 1fr); }
  .pb-compose-main { border-right: 0; }
  .pb-compose-side { position: static; border-top: 1px solid var(--puebler-border); }
  .pb-post-page { grid-template-columns: minmax(0, 1fr); }
  .pb-post-page-main { border-right: 0; }
  .pb-post-page-side { position: static; }
}
@media (max-width: 991px) {
  .pb-split { grid-template-columns: minmax(0, 1fr); }
  .pb-split-map { position: relative; top: 0; height: 52vh; order: -1; }
  .pb-split-feed { border-right: 0; min-height: 0; }
  .pb-popular, .pb-subregions { grid-template-columns: minmax(0, 1fr); }
  .pb-type-tabs { grid-template-columns: repeat(8, 130px); }
}
@media (max-width: 767px) {
  .pb-home-hero-inner { padding: 18px 14px; }
  .pb-home-search { padding-left: 14px; }
  .pb-home-search .pb-btn { padding: 10px 14px; }
  .pb-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-tile { height: 220px; }
  .pb-map-bar { width: calc(100% - 24px); justify-content: space-between; padding: 6px 10px; bottom: 14px; }
  .pb-map-legend { display: none; }
  .pb-dest-picker { grid-template-columns: minmax(0, 1fr); }
  .pb-field-row { grid-template-columns: minmax(0, 1fr); }
  .pb-span-2 { grid-column: auto; }
  .pb-validate-opts { grid-template-columns: minmax(0, 1fr); }
  .pb-validate-opts label { border-right: 0; border-bottom: 1px solid var(--puebler-border); }
  .pb-transport-pick { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pb-compose-main, .pb-compose-side, .pb-compose-head { padding-left: 14px; padding-right: 14px; }
  .pb-postcard { grid-template-columns: minmax(0, 1fr); aspect-ratio: auto; }
  .pb-postcard-photo { height: 240px; }
  .pb-postcard-back { border-left: 0; border-top: 2px dashed #C9B48F; }
  .pb-band-section { padding: 22px 14px; }
  .pb-band-flush { padding: 22px 0 0; }
  .pb-band-flush .pb-band-head { padding: 0 14px; }
}

/* ---------- Utilidades de esta sección ---------- */
.min-w-0 { min-width: 0; }
.pb-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-subsection { font-size: .95rem; font-weight: 800; margin: 18px 0 8px; display: flex; align-items: center; gap: 8px; }
.pb-subsection i { color: var(--puebler-blue); }
.pb-price { font-weight: 800; color: var(--puebler-blue-dark); white-space: nowrap; font-size: .88rem; }
.pb-thumb-ico { display: inline-flex; align-items: center; justify-content: center; background: var(--puebler-blue-light); color: var(--puebler-blue-dark); font-size: 1.3rem; flex-shrink: 0; }
.pb-search-thumb { flex-shrink: 0; }
.pb-tab-count { display: inline-block; min-width: 20px; padding: 1px 7px; border-radius: 20px; background: var(--puebler-surface-2); border: 1px solid var(--puebler-border); font-size: .7rem; font-weight: 800; color: var(--puebler-text-muted); margin-left: 4px; }
.pb-search-tabs { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
.pb-search-tabs::-webkit-scrollbar { display: none; }
.pb-search-tabs .pb-tab { flex-shrink: 0; white-space: nowrap; }

/* ---------- Búsqueda: "Entendimos" ---------- */
.pb-understood { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 22px; border-bottom: 1px solid var(--puebler-border); background: var(--puebler-surface-2); }
.pb-understood-label { font-size: .8rem; font-weight: 800; color: var(--puebler-text-muted); display: inline-flex; align-items: center; gap: 6px; }
.pb-understood-label i { color: var(--puebler-coral); }
.pb-understood-chip { display: inline-flex; align-items: center; padding: 5px 12px; border-radius: 50px; border: 1px solid var(--puebler-blue); color: var(--puebler-blue-dark); background: var(--puebler-surface); font-size: .8rem; font-weight: 700; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-understood-chip.is-text { border-style: dashed; border-color: var(--puebler-border); color: var(--puebler-text); }
a.pb-understood-chip:hover { background: var(--puebler-blue); color: #fff; }
.pb-search-suggest { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; max-width: 620px; margin: 16px auto 0; }

/* ---------- Para tu estilo ---------- */
.pb-foryou-styles { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; }
.pb-foryou-dests { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; }
.pb-foryou-dest { position: relative; display: block; height: 170px; border-radius: 12px; overflow: hidden; color: #fff; background: #16253B; }
.pb-foryou-dest img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.pb-foryou-dest:hover img { transform: scale(1.04); }
.pb-foryou-dest > span { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 12px; background: rgba(16,28,45,.72); }
.pb-foryou-dest strong { display: block; font-size: .95rem; line-height: 1.2; }
.pb-foryou-dest small { display: block; font-size: .74rem; opacity: .85; }
.pb-foryou-dest:hover { color: #fff; }
.pb-foryou-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px 28px; }
.pb-foryou-cols .pb-row-link { padding: 6px 0; }
.pb-foryou-empty { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; background: var(--puebler-blue-light); }
.pb-foryou-empty strong { display: block; font-size: 1.05rem; }
.pb-foryou-empty span { display: block; color: var(--puebler-text-muted); font-size: .9rem; }

/* ---------- Notificaciones push ---------- */
.pb-push-panel { display: flex; align-items: center; gap: 14px; padding: 14px 16px; margin-bottom: 14px; border: 1px solid var(--puebler-border); border-radius: 12px; background: var(--puebler-surface-2); flex-wrap: wrap; }
.pb-push-panel > i { font-size: 1.6rem; color: var(--puebler-blue); }
.pb-push-panel > div:nth-child(2) { flex: 1 1 240px; min-width: 0; }
.pb-push-panel strong { display: block; }
.pb-push-panel span { display: block; color: var(--puebler-text-muted); font-size: .85rem; }
.pb-push-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.pb-push-actions [hidden] { display: none; }

/* ---------- Validación GPS + permanencia ---------- */
.pb-presence { display: flex; align-items: center; gap: 14px; margin-top: 12px; padding: 14px; border: 1px solid var(--puebler-border); border-left: 4px solid var(--puebler-blue); border-radius: 10px; background: var(--puebler-surface-2); }
.pb-presence[hidden] { display: none; }
.pb-presence-ring { --pct: 0; position: relative; width: 52px; height: 52px; flex-shrink: 0; }
.pb-presence-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.pb-presence-ring circle { fill: none; stroke-width: 4; }
.pb-ring-bg { stroke: var(--puebler-border); }
.pb-ring-fg { stroke: var(--puebler-blue); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--pct)); transition: stroke-dashoffset .8s linear; }
.pb-presence-ring > i { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--puebler-blue); font-size: 1.1rem; }
.pb-presence-body { flex: 1; min-width: 0; }
.pb-presence-body strong { display: block; font-size: .92rem; }
.pb-presence-body > span { display: block; font-size: .82rem; color: var(--puebler-text-muted); margin-bottom: 8px; }
.pb-presence-bar > span { background: var(--puebler-blue); transition: width 1s linear; }
.pb-presence-time { display: block; margin-top: 4px; font-weight: 800; font-variant-numeric: tabular-nums; font-size: .8rem; }
.pb-presence.is-done { border-left-color: var(--puebler-green); }
.pb-presence.is-done .pb-ring-fg, .pb-presence.is-done .pb-presence-ring > i { stroke: var(--puebler-green); color: var(--puebler-green); }
.pb-presence.is-done .pb-presence-bar > span { background: var(--puebler-green); }
.pb-presence.is-paused { border-left-color: var(--puebler-coral); }
.pb-presence.is-paused .pb-ring-fg { stroke: var(--puebler-coral); }
.pb-presence.is-paused .pb-presence-ring > i { color: var(--puebler-coral); }
#pbSubmit.is-waiting { opacity: .6; cursor: not-allowed; }

@media (max-width: 767px) {
  .pb-hide-xs { display: none; }
  .pb-understood { padding: 10px 14px; }
  .pb-search-section { padding: 16px 14px; }
  .pb-search-posts { padding-left: 0; padding-right: 0; }
  .pb-search-posts .pb-section-title { padding: 0 14px; }
  .pb-search-big { padding: 10px 12px 10px 16px; }
  .pb-foryou-dests { grid-auto-columns: 72%; }
  .pb-foryou-dest { height: 150px; }
  .pb-foryou-cols { grid-template-columns: minmax(0, 1fr); }
  .pb-presence { flex-wrap: wrap; }
  .pb-presence-body { flex: 1 1 calc(100% - 70px); }
  .pb-presence #pbPresStart { width: 100%; justify-content: center; }
}

/* ---------- Inicio en celular ---------- */
@media (max-width: 767px) {
  .pb-home-title { margin-top: 12px; }
  .pb-home-sub { font-size: .92rem; margin-bottom: 14px; }
  .pb-loc-badge { font-size: .74rem; padding: 5px 12px; gap: 6px; flex-wrap: wrap; justify-content: center; max-width: 100%; }
  .pb-typebar { padding: 10px 14px; }
  .pb-typechip { padding: 6px 12px 6px 6px; font-size: .82rem; }
  .pb-typechip i { width: 26px; height: 26px; }
  .pb-stories { padding: 12px 14px; gap: 12px; }
  .pb-story { min-width: 62px; }
  .pb-story-ring { width: 56px; height: 56px; }
  .pb-feed-tabs { padding: 0 4px; }
  .pb-feed-tabs .pb-tab { flex: 1 0 auto; justify-content: center; padding: 12px 7px; font-size: .84rem; gap: 4px; }
  .pb-compose-prompt { padding: 12px 14px; font-size: .9rem; }
  .pb-compose-prompt > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
  .pb-guest-band { padding: 12px 14px; flex-wrap: wrap; }
  .pb-map-bar .pb-map-bar-add { display: none; }
  .pb-map-bar { gap: 2px; padding: 6px 6px; }
  .pb-map-bar-item { flex: 1 1 0; min-width: 0; font-size: .62rem; padding: 4px 0; letter-spacing: -.1px; }
  .pb-map-bar-item span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media (max-width: 400px) {
  .pb-home-title { font-size: 1.45rem; }
  .pb-map-bar #pbMapReset { display: none; }
  .pb-feed-tabs .pb-tab i { display: none; }
  .pb-compose-prompt > span:nth-child(2) { padding: 9px 12px; }
}
.pb-feed-more-btn { display: flex; margin: 18px auto 22px; }
.pb-feed-more-btn[hidden] { display: none; }