@charset "utf-8";
/* Urban Flora · secciones y piezas de cada página */

/* =================== INICIO =================== */
.hero { position: relative; display: grid; gap: clamp(28px, 4vw, 56px); padding: clamp(24px, 3vw, 40px) var(--gut-r) clamp(56px, 6vw, 90px) var(--gut); max-width: 1600px; margin-inline: auto; }
@media (min-width: 1100px) { .hero { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; padding-left: max(40px, env(safe-area-inset-left, 0px)); padding-right: max(40px, env(safe-area-inset-right, 0px)); min-height: calc(100vh - var(--hdr-h)); } }
.hero-txt { display: grid; gap: clamp(18px, 2.2vw, 28px); align-content: center; min-width: 0; }
.hero-txt .eyebrow { margin: 0; }
.hero h1 { font-size: clamp(3.4rem, 8.6vw, 8.6rem); }
.hl-l { display: inline-block; }
.hl-c { display: inline-block; }
.hl-c b { display: inline-block; color: var(--c); -webkit-text-stroke: 2px var(--tinta); paint-order: stroke fill; font-weight: inherit; transition: transform .45s var(--ease-b); }
.hl-c b:hover { transform: translateY(-.08em) rotate(-4deg); }
@keyframes carta { to { background-position: -200% 0; } }
.js .hl-l { opacity: 0; transform: translateY(.4em) rotate(2deg); animation: sube .9s var(--ease) forwards; }
.hl-l:nth-child(2) { animation-delay: .08s; } .hl-l:nth-child(3) { animation-delay: .16s; } .hl-l:nth-child(4) { animation-delay: .24s; }
@keyframes sube { to { opacity: 1; transform: none; } }
.hero-hoy { font-size: .7rem; color: var(--tinta-2); display: flex; align-items: center; gap: .6em; }
.hero-hoy::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #2BB673; flex: none; }

.pared-zona { min-width: 0; display: grid; gap: 14px; }
.pared-filtros { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 6px; scrollbar-width: none; }
.pared-filtros::-webkit-scrollbar { display: none; }
.pared-filtros .chip { flex: none; font-size: .85rem; }
.pared { --gap: clamp(6px, 1vw, 12px); position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: calc(var(--gap) * 2.2) var(--gap); padding: clamp(12px, 2vw, 24px); border-radius: 10px;
  background-color: #F7F5F0; background-image: linear-gradient(#DCD7CC 1.5px, transparent 1.5px), linear-gradient(90deg, #DCD7CC 1.5px, transparent 1.5px); background-size: 46px 23px; background-position: -1px -1px; box-shadow: inset 0 0 0 1.5px var(--tinta); }
@media (min-width: 700px) and (max-width: 1099px) { .pared { grid-template-columns: repeat(9, minmax(0, 1fr)); } }
.cubo { position: relative; appearance: none; border: 0; background: none; padding: 0 0 22px; cursor: pointer; display: grid; justify-items: center; transition: transform .35s var(--ease-b), opacity .35s, filter .35s; -webkit-tap-highlight-color: transparent; }
.cubo::after { content: ""; position: absolute; left: calc(var(--gap) * -.5 - 1px); right: calc(var(--gap) * -.5 - 1px); bottom: 14px; height: 5px; background: linear-gradient(#8C918D, #61665F); border-radius: 1px; z-index: -1; }
.cubo canvas { width: 100%; aspect-ratio: 1; filter: drop-shadow(0 6px 4px rgba(26, 23, 20, .22)); transition: transform .4s var(--ease-b); }
.cubo:hover canvas, .cubo:focus-visible canvas { transform: translateY(-6px) rotate(-4deg) scale(1.05); }
.cubo:focus-visible { outline-offset: 0; }
.cubo-etq { position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%); white-space: nowrap; font-size: clamp(.5rem, .7vw, .62rem); background: var(--papel); padding: 1px 6px; border-radius: 2px; box-shadow: 0 0 0 1px var(--tinta); }
.cubo-n { position: absolute; top: -4px; right: -2px; min-width: 26px; height: 26px; padding: 0 4px; border-radius: 13px; background: var(--tinta); color: var(--papel); font-size: .7rem; display: none; place-items: center; z-index: 2; }
.cubo.is-elegido .cubo-n { display: grid; }
.cubo.is-elegido canvas { transform: translateY(-4px); }
.cubo.is-pulso canvas { animation: pulso .45s var(--ease-b); }
@keyframes pulso { 40% { transform: scale(.9); } }
.cubo.is-vacio { cursor: not-allowed; }
.cubo.is-vacio .cubo-etq { text-decoration: line-through; color: var(--tinta-3); }
.cubo.is-apagado { opacity: .22; filter: grayscale(1); }
.pared-nota { font-size: .7rem; color: var(--tinta-3); text-transform: uppercase; letter-spacing: .04em; }
.cubo-info { position: absolute; left: 0; top: 0; z-index: 20; width: 230px; background: var(--tinta); color: var(--papel); border-radius: 8px; padding: 14px 16px; pointer-events: none; box-shadow: 0 18px 40px -12px rgba(0,0,0,.4); }
.cubo-info .tag { color: #AEB6B1; }
.ci-t { font-size: 1.5rem; font-weight: 800; font-stretch: 75%; line-height: 1; margin: 6px 0 10px; }
.ci-t span { display: block; font-weight: 300; font-stretch: 100%; font-size: 1.05rem; margin-top: 2px; }
.cubo-info .kv dt { color: #AEB6B1; }

.tallo-vuela { position: fixed; z-index: 70; width: 28px; height: 28px; margin: -14px 0 0 -14px; border-radius: 50%; box-shadow: 0 0 0 2px var(--tinta); pointer-events: none; transition: transform .65s cubic-bezier(.5, -0.3, .4, 1), opacity .65s; }

/* dock del ramo: abajo a la izquierda, deja libre la esquina derecha */
.dock { position: fixed; left: max(16px, env(safe-area-inset-left, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 45; width: min(400px, calc(100vw - 32px)); background: var(--tinta); color: var(--papel); border-radius: 14px; box-shadow: 0 24px 60px -18px rgba(0,0,0,.55); transform: translateY(130%); transition: transform .55s var(--ease-b); overflow: hidden; }
.dock.is-on { transform: none; }
.dock-tira { width: 100%; display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: none; border: 0; color: inherit; cursor: pointer; text-align: left; border-bottom: 1px solid #2E3532; }
.dock-n { font-size: .74rem; text-transform: uppercase; }
.dock-total { margin-left: auto; font-size: .82rem; font-weight: 700; }
.dock-flecha { width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .3s; margin-top: -4px; }
.dock.is-plegado .dock-flecha { transform: rotate(-135deg); margin-top: 4px; }
.dock.is-plegado .dock-cuerpo { display: none; }
.dock-cuerpo { padding: 14px 16px 16px; display: grid; gap: 14px; max-height: min(70vh, 560px); overflow-y: auto; }
.dock-top { display: flex; gap: 14px; align-items: center; }
.dock-cv { width: 112px; height: 112px; flex: none; border-radius: 50%; background: #2A2622; }
.dock-datos { min-width: 0; }
.dock-datos .tag { color: #AEB6B1; }
.dock-precio { font-size: 2.6rem; font-weight: 800; font-stretch: 75%; line-height: 1; margin: 4px 0 6px; font-variant-numeric: tabular-nums; }
.dock-aviso { font-size: .7rem; line-height: 1.5; color: #FFB6A8; }
.dock-aviso.is-ok { color: #9FE0B8; }
.dock-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; max-height: 168px; overflow-y: auto; }
.dock-lista li { display: grid; grid-template-columns: auto 1fr auto auto auto; gap: 8px; align-items: center; font-size: .9rem; padding: 4px 0; border-bottom: 1px dashed #2E3532; }
.dock-lista li i { width: 12px; height: 12px; border-radius: 50%; background: var(--c); }
.dock-lista li small { color: #AEB6B1; }
.dock-lista li .mono { font-size: .7rem; }
.dock-lista button { width: 26px; height: 26px; border-radius: 50%; border: 1px solid #565E59; background: none; color: inherit; cursor: pointer; line-height: 1; }
.dock-lista button:hover { background: var(--papel); color: var(--tinta); }
.dock-papel { display: flex; flex-wrap: wrap; gap: 6px; }
.dock .chip { box-shadow: 0 0 0 1.5px #565E59 inset; font-size: .8rem; }
.dock .chip.is-on { background: var(--papel); color: var(--tinta); }
.dock-acc { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.dock .btn-ghost { --f: var(--papel); box-shadow: 0 0 0 1.5px var(--papel) inset; }
.dock-vaciar { background: none; border: 0; color: #AEB6B1; font-size: .7rem; text-transform: uppercase; cursor: pointer; text-decoration: underline; margin-left: auto; }

/* madrugada */
.madrugada .split { align-items: center; }
.mad-fig { border-radius: 12px; }
.mad-txt { display: grid; gap: 24px; }
.mad-txt .eyebrow { margin: 0; }
.mad-txt .eyebrow::before { box-shadow: 0 0 0 2px var(--papel) inset; background: #FFC81F; }
.mad-txt .txt { color: #DCD3EA; }
.mad-datos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 8px 0 0; border-top: 1px solid #4A3F66; }
.mad-datos div { padding: 16px 0; border-bottom: 1px solid #4A3F66; }
.mad-datos div:nth-child(odd) { padding-right: 16px; border-right: 1px solid #4A3F66; }
.mad-datos div:nth-child(even) { padding-left: 16px; }
.mad-datos dt { color: #A99BC9; }
.mad-datos dd { margin: 4px 0 0; font-size: clamp(2.2rem, 4vw, 3.4rem); font-weight: 800; font-stretch: 75%; line-height: 1; font-variant-numeric: tabular-nums; }
.mad-nota { font-size: .7rem; color: #FFC81F; }

/* cinco mostradores */
.tramos-cab { margin-bottom: clamp(32px, 4vw, 56px); }
.tramos-lista { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--tinta); }
.tramo { border-bottom: 2px solid var(--tinta); }
.tramo a { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 56px; gap: 6px 24px; align-items: center; padding: clamp(20px, 2.6vw, 34px) 0; text-decoration: none; isolation: isolate; }
.tramo a::before { content: ""; position: absolute; inset: 0 calc(-1 * var(--gut)); background: var(--c); transform: scaleY(0); transform-origin: bottom; transition: transform .5s var(--ease); z-index: -1; }
.tramo a:hover::before, .tramo a:focus-visible::before { transform: scaleY(1); }
.tramo-t { grid-column: 1; font-size: clamp(2.4rem, 6.4vw, 6rem); font-weight: 800; font-stretch: 75%; line-height: .9; letter-spacing: -.03em; transition: transform .5s var(--ease); }
.tramo-d { grid-column: 1; max-width: 46ch; color: var(--tinta-2); }
.tramo-ir { grid-column: 2; grid-row: 1 / span 2; width: 52px; height: 52px; border-radius: 50%; box-shadow: 0 0 0 2px var(--tinta) inset; background: var(--c); position: relative; transition: transform .5s var(--ease-b); }
.tramo-ir::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -9px; border-top: 2.5px solid var(--tinta); border-right: 2.5px solid var(--tinta); transform: rotate(45deg); }
.tramo a:hover .tramo-ir { transform: rotate(-45deg) scale(1.08); background: var(--papel); }
.tramo a:hover .tramo-t { transform: translateX(14px); }
.tramo-fig { display: none; }
@media (min-width: 900px) {
  .tramo a { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) 56px; }
  .tramo-t { grid-row: 1; } .tramo-d { grid-column: 2; grid-row: 1; } .tramo-ir { grid-column: 3; grid-row: 1; }
  .tramo-fig { display: block; position: absolute; right: 120px; top: 50%; width: 220px; border-radius: 999px 999px 8px 8px; transform: translateY(-50%) rotate(6deg) scale(.6); opacity: 0; transition: transform .55s var(--ease-b), opacity .35s; pointer-events: none; z-index: 2; box-shadow: 0 0 0 2px var(--tinta); }
  .tramo a:hover .tramo-fig { opacity: 1; transform: translateY(-50%) rotate(-4deg) scale(1); }
  .tramo a:hover .tramo-d { opacity: 0; }
  .tramo-d { transition: opacity .3s; }
}
@media (max-width: 899px) { .tramo-fig { display: block; grid-column: 1 / -1; width: 100%; aspect-ratio: 16 / 9; border-radius: 10px; margin-top: 12px; } }

/* tarjetas */
.tarjetas-cab { max-width: 760px; margin-bottom: clamp(32px, 4vw, 64px); }
.tarjetas-mesa { display: grid; gap: clamp(18px, 2.4vw, 30px); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); align-items: start; }
.tarjeta { margin: 0; background: #FFFDF8; padding: 28px 24px 22px; border-radius: 3px; box-shadow: 0 1px 0 rgba(0,0,0,.06), 0 14px 30px -18px rgba(26,23,20,.35); transform: rotate(var(--r)); position: relative; transition: transform .45s var(--ease-b); }
.tarjeta::before { content: ""; position: absolute; top: -9px; left: 50%; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 2px var(--tinta), 0 3px 4px rgba(0,0,0,.2); }
.tarjeta:hover { transform: rotate(0) translateY(-6px); }
.js .tarjeta.rv { transform: translateY(26px) rotate(var(--r)); }
.js .tarjeta.rv.is-in { transform: rotate(var(--r)); }
.js .tarjeta.rv.is-in:hover { transform: rotate(0) translateY(-6px); }
.tarjeta blockquote { margin: 0 0 18px; font-size: 1.22rem; line-height: 1.35; font-weight: 400; font-stretch: 92%; font-variation-settings: 'opsz' 30; background: repeating-linear-gradient(transparent 0 calc(1.35em - 1px), #E7DCCB calc(1.35em - 1px) 1.35em); }
.tarjeta figcaption { font-size: .7rem; text-transform: uppercase; color: var(--tinta-3); }

/* diario */
.diario-cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: clamp(28px, 3.6vw, 52px); }
.diario-grid { display: grid; gap: clamp(24px, 3vw, 40px); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.post { display: grid; gap: 12px; align-content: start; min-width: 0; }
.post figure { border-radius: 10px; margin-bottom: 6px; }

.post .tag { color: var(--tinta-3); }
.post .sub { max-width: 40ch; }

/* visita */
.visita .split { align-items: center; }
.visita-txt { display: grid; gap: 22px; }
.visita-txt .eyebrow { margin: 0; }
.visita-txt .eyebrow::before { background: var(--coral); }
.visita-estado { font-size: .74rem; }
.mapa { border-radius: 14px; overflow: hidden; box-shadow: 0 0 0 2px var(--tinta); background: #FFF5D6; }
.mapa svg { width: 100%; height: auto; display: block; }
.mapa-pin { transform-origin: 410px 300px; animation: pin 3s var(--ease-b) infinite; }
@keyframes pin { 0%, 70%, 100% { transform: none; } 80% { transform: translateY(-8px); } 90% { transform: none; } }

@media (max-width: 699px) {
  .pared { grid-template-columns: repeat(6, minmax(0, 1fr)); padding: 10px; }
  .cubo-etq { font-size: .7rem; padding: 0 3px; }
  .cubo { padding-bottom: 16px; }
  .cubo::after { bottom: 10px; height: 4px; }
  .cubo-n { min-width: 20px; height: 20px; font-size: .7rem; }
  .cubo-info { display: none; }
}

/* =================== RAMOS =================== */
.ramos-hero-pie { display: grid; gap: 28px; align-items: end; }
@media (min-width: 960px) { .ramos-hero-pie { grid-template-columns: 1.4fr 1fr; } }
.ramos-kv { border-top: 1.5px solid var(--tinta); padding-top: 14px; gap: 10px 18px; }
.ramos-filtros-sec { position: sticky; top: calc(env(safe-area-inset-top, 0px)); z-index: 30; background: color-mix(in srgb, var(--papel) 94%, transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-block: 1.5px solid var(--tinta); }
.ramos-filtros { display: grid; gap: 10px; padding-block: 12px; }
.ramos-filtros .chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding: 2px; }
.ramos-filtros .chips::-webkit-scrollbar { display: none; }
.ramos-filtros .chip { flex: none; font-size: .85rem; }
.ramos-cuenta { font-size: .7rem; text-transform: uppercase; color: var(--tinta-3); }
.ramos-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: clamp(28px, 3vw, 44px) clamp(16px, 2vw, 28px); grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.ramo-card[hidden] { display: none; }
.ramo-btn { all: unset; box-sizing: border-box; cursor: pointer; display: grid; gap: 8px; width: 100%; }
.ramo-btn:focus-visible { outline: 3px solid var(--aciano); outline-offset: 6px; border-radius: 6px; }
.ramo-fig { border-radius: 999px 999px 10px 10px; margin-bottom: 8px; transition: border-radius .6s var(--ease); }
.ramo-btn:hover .ramo-fig { border-radius: 10px; }
.ramo-fig .ph-cv, .ramo-fig .ph-img { transition: transform .8s var(--ease), opacity .9s var(--ease); }
.ramo-btn:hover .ramo-fig .ph-cv, .ramo-btn:hover .ramo-fig .ph-img { transform: scale(1.06) rotate(-2deg); }
.ramo-calle { color: var(--tinta-3); }
.ramo-nom { font-size: clamp(2rem, 3.2vw, 2.8rem); font-weight: 800; font-stretch: 75%; line-height: .95; letter-spacing: -.025em; }
.ramo-pie { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.ramo-dots { display: flex; }
.ramo-dots i { width: 18px; height: 18px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1.5px var(--tinta); margin-right: -5px; }
.ramo-tono { color: var(--tinta-2); font-size: .95rem; }
.sel { appearance: none; border: 0; border-radius: var(--r-tag); padding: .75em 2.4em .75em 1.1em; background: var(--papel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231A1714' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 1em center; color: var(--tinta); font-weight: 600; max-width: 100%; cursor: pointer; box-shadow: 0 0 0 1.5px var(--tinta) inset; }
.metro-sec .split { align-items: center; }
.metro-txt { display: grid; gap: 22px; min-width: 0; }
.metro-txt .eyebrow { margin: 0; }
.metro-txt .eyebrow::before { box-shadow: 0 0 0 2px var(--papel) inset; }
.metro-txt .lead { color: #CDD4CF; }
.metro-ctrl { display: grid; gap: 10px; justify-items: start; }
.metro-ctrl .tag { color: #AEB6B1; }
.band-tinta .chip { box-shadow: 0 0 0 1.5px #565E59 inset; }
.band-tinta .chip:hover { background: #2C2823; }
.band-tinta .chip.is-on { background: var(--papel); color: var(--tinta); }
.metro-res { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 6px 0 0; border-top: 1px solid #2E3532; }
.metro-res > div { padding: 14px 10px 14px 0; border-bottom: 1px solid #2E3532; }
.metro-res dt { color: #AEB6B1; }
.metro-res dd { margin: 4px 0 0; font-size: clamp(1.4rem, 2.4vw, 2.2rem); font-weight: 800; font-stretch: 75%; line-height: 1; font-variant-numeric: tabular-nums; }
.metro-dice { grid-column: 1 / -1; padding-top: 14px; color: #FFC81F; font-size: .98rem; max-width: 52ch; }
.metro-lienzo { background: #24201C; border-radius: 14px; padding: clamp(10px, 2vw, 24px); min-width: 0; }
.metro-lienzo svg, .ficha-metro svg { width: 100%; height: auto; display: block; }
.metro-ramo { transform-origin: 330px 430px; animation: crece .7s var(--ease-b); }
@keyframes crece { from { transform: scale(.85); opacity: .4; } }
@media (max-width: 560px) { .metro-res { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ayer-in { display: grid; gap: clamp(28px, 5vw, 80px); align-items: center; }
@media (min-width: 900px) { .ayer-in { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } }
.ayer-fig { border-radius: 50%; box-shadow: 0 0 0 10px #A9AEA9, 0 0 0 12px var(--tinta); margin: 12px; max-width: 520px; }
.ayer-txt { display: grid; gap: 20px; }
.ayer-txt .eyebrow { margin: 0; }
.ayer-nota { font-size: .7rem; text-transform: uppercase; color: var(--tinta-3); }
.otra .btn { justify-self: start; }

/* ficha (dialog) */
.ficha { width: min(1180px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 0; border: 0; border-radius: 16px; background: var(--papel); color: var(--tinta); overflow: auto; overscroll-behavior: contain; }
.ficha::backdrop { background: rgba(26, 23, 20, .72); backdrop-filter: blur(4px); }
.ficha[open] { animation: abre .5s var(--ease-b); }
@keyframes abre { from { transform: translateY(30px) scale(.97); opacity: 0; } }
.ficha-in { display: grid; position: relative; }
@media (min-width: 900px) { .ficha-in { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } .ficha-fig { position: sticky; top: 0; height: min(100%, calc(100dvh - 24px)); min-height: 560px; } }
.ficha-fig { aspect-ratio: 3 / 4; margin: 0; }
@media (min-width: 900px) { .ficha-fig { aspect-ratio: 3 / 4; } }
.ficha-x { position: absolute; right: 14px; top: 14px; z-index: 5; width: 46px; height: 46px; border-radius: 50%; border: 0; background: var(--tinta); cursor: pointer; }
.ficha-x::before, .ficha-x::after { content: ""; position: absolute; left: 13px; top: 22px; width: 20px; height: 2.5px; background: var(--papel); transform: rotate(45deg); }
.ficha-x::after { transform: rotate(-45deg); }
.ficha-cuerpo { padding: clamp(24px, 3.4vw, 48px); display: grid; gap: 18px; align-content: start; min-width: 0; }
.ficha-cuerpo .tag { color: var(--tinta-3); }
.ficha-tono { font-size: .7rem; text-transform: uppercase; }
.ficha-txt { font-size: 1.15rem; max-width: 46ch; }
.ficha-tallas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.talla { appearance: none; border: 0; cursor: pointer; border-radius: 10px; padding: 12px 12px 10px; background: var(--papel-2); text-align: left; display: grid; gap: 2px; box-shadow: 0 0 0 1.5px transparent inset; transition: background .2s, box-shadow .2s; }
.talla b { font-size: 1.8rem; font-stretch: 75%; line-height: 1; }
.talla span { font-size: .85rem; }
.talla.is-on { background: var(--acc); box-shadow: 0 0 0 2px var(--tinta) inset; }
.ficha-metro { background: var(--papel-2); border-radius: 12px; padding: 10px; }
.ficha-receta ul { list-style: none; margin: 8px 0 0; padding: 0; }
.ficha-receta li { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px dashed var(--papel-3); }
.ficha-receta li i { width: 14px; height: 14px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1.5px var(--tinta); }
.ficha-receta li small { color: var(--tinta-3); }
.ficha-receta li .mono { font-size: .7rem; color: var(--tinta-3); }
.receta-jarron { grid-template-columns: 1fr !important; font-family: var(--f-mono); font-size: .72rem; font-stretch: 85%; color: var(--tinta-2); }
.ficha-acc { display: grid; gap: 10px; justify-items: start; padding-top: 6px; }
.ficha-nota { font-size: .7rem; color: var(--tinta-3); }

/* =================== FORMULARIOS (compartido) =================== */
.campo { display: grid; gap: 10px; border: 0; padding: 0; margin: 0; min-width: 0; }
.campo legend, .campo label, .campo-2 label { font-family: var(--f-mono); font-size: var(--t-tag); text-transform: uppercase; letter-spacing: .05em; font-stretch: 85%; padding: 0; margin-bottom: 10px; display: flex; justify-content: space-between; gap: 10px; }
.campo label { margin-bottom: 0; }
.campo-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.campo-2 > div { display: grid; gap: 10px; min-width: 0; }
.inp { width: 100%; border: 0; border-radius: 10px; padding: .8em 1em; background: var(--papel); box-shadow: 0 0 0 1.5px var(--tinta) inset; font-size: 1rem; min-width: 0; }
.inp:focus { outline: none; box-shadow: 0 0 0 2.5px var(--aciano) inset; }
textarea.inp { min-height: 110px; resize: vertical; line-height: 1.5; }
.inp.is-error { box-shadow: 0 0 0 2px var(--ko) inset; background: #FFF0EE; }
.err { color: var(--ko); font-size: .85rem; }
.check { display: flex; gap: 10px; align-items: center; cursor: pointer; font-weight: 600; }
.check input { width: 22px; height: 22px; accent-color: var(--tinta); flex: none; }
input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 30px; background: transparent; cursor: pointer; }
input[type="range"]::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: linear-gradient(90deg, var(--tinta), var(--tinta)) no-repeat, var(--papel-3); }
input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 28px; height: 28px; margin-top: -11px; border-radius: 50%; background: var(--acc); box-shadow: 0 0 0 2px var(--tinta) inset; }
input[type="range"]::-moz-range-track { height: 6px; border-radius: 3px; background: var(--papel-3); }
input[type="range"]::-moz-range-thumb { width: 26px; height: 26px; border: 2px solid var(--tinta); border-radius: 50%; background: var(--acc); }

/* =================== BODAS =================== */
.ev-hero { padding-block: clamp(32px, 5vw, 80px) var(--sec); overflow: hidden; }
.ev-hero-in { display: grid; gap: 32px; position: relative; }
@media (min-width: 1000px) { .ev-hero-in { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; } }
.ev-hero-txt { display: grid; gap: 24px; position: relative; z-index: 2; }
.ev-hero-txt .eyebrow { margin: 0; }
.ev-hero-fig { border-radius: 50%; aspect-ratio: 1; box-shadow: 0 0 0 12px #A9AEA9, 0 0 0 14px var(--tinta); margin: 14px; }
.ev-figs { position: relative; min-width: 0; }
.ev-hero-fig2 { position: absolute; width: clamp(120px, 15vw, 220px); border-radius: 50%; right: -18px; bottom: -36px; box-shadow: 0 0 0 2px var(--tinta), 0 0 0 10px var(--papel); z-index: 3; }
@media (max-width: 999px) { .ev-hero-fig2 { left: auto; right: 12px; bottom: -30px; } }
.receta-cab { max-width: 800px; display: grid; gap: 20px; margin-bottom: clamp(32px, 4vw, 56px); }
.receta-cab .eyebrow { margin: 0; }
.receta-in { display: grid; gap: clamp(24px, 3vw, 48px); align-items: start; }
@media (min-width: 1000px) { .receta-in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.receta-form { display: grid; gap: 26px; padding: clamp(20px, 2.6vw, 32px); border-radius: 14px; background: var(--papel-2); min-width: 0; }
.receta-form output { font-size: 1.1rem; font-weight: 700; }
.paletas { display: grid; gap: 8px; }
.paleta { appearance: none; border: 0; cursor: pointer; display: flex; align-items: center; gap: 14px; padding: 10px 14px; border-radius: var(--r-tag); background: var(--papel); box-shadow: 0 0 0 1.5px var(--papel-3) inset; font-weight: 600; text-align: left; transition: box-shadow .2s, background .2s; }
.paleta.is-on { box-shadow: 0 0 0 2px var(--tinta) inset; background: #FFF; }
.paleta-dots { display: flex; }
.paleta-dots i { width: 22px; height: 22px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1.5px var(--tinta); margin-right: -6px; }
.hoja { --cuad: 22px; position: relative; background-color: #FFFEF9; background-image: linear-gradient(#D9E6EE 1px, transparent 1px), linear-gradient(90deg, #D9E6EE 1px, transparent 1px); background-size: var(--cuad) var(--cuad); border-radius: 4px; padding: clamp(20px, 3vw, 40px); box-shadow: 0 30px 50px -30px rgba(26,23,20,.4), 0 0 0 1px #E6DFD0; display: grid; gap: 22px; min-width: 0; }
.hoja::before { content: ""; position: absolute; left: clamp(10px, 1.6vw, 22px); top: 0; bottom: 0; width: 1.5px; background: #F28C8C; }
.hoja-cab { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; font-size: .7rem; border-bottom: 2px solid var(--tinta); padding-bottom: 10px; }
.hoja-tabla { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: .95rem; }
.hoja-tabla th { font-family: var(--f-mono); font-size: .7rem; font-weight: 500; text-transform: uppercase; letter-spacing: .04em; text-align: right; padding: 6px 4px; color: var(--tinta-3); font-stretch: 85%; }
.hoja-tabla th:first-child, .hoja-tabla td:first-child { text-align: left; }
.hoja-tabla td { padding: 7px 4px; text-align: right; border-bottom: 1px dashed #BFC6C1; }
.hoja-sum td { font-weight: 800; border-bottom: 0; border-top: 2px solid var(--tinta); font-size: 1.05rem; }
.hoja-flores { display: grid; gap: 6px; }
.hf { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; align-items: center; padding: 8px 10px; border-radius: 8px; background: linear-gradient(90deg, color-mix(in srgb, var(--c) 40%, transparent) var(--p), transparent var(--p)); }
.hf i { grid-row: span 2; width: 18px; height: 18px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1.5px var(--tinta); }
.hf .mono { font-size: .7rem; color: var(--tinta-3); text-transform: uppercase; }
.hf.is-fuera span:first-of-type { text-decoration: line-through; text-decoration-color: var(--ko); text-decoration-thickness: 2px; }
.hf.is-fuera .mono { color: var(--ko); }
.hoja-aviso { padding: 12px 14px; background: #FFF4C9; border-radius: 8px; font-size: .95rem; transform: rotate(-.6deg); box-shadow: 0 6px 10px -6px rgba(0,0,0,.2); }
.hoja-tot { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 0; border-top: 2px solid var(--tinta); }
.hoja-tot > div { padding: 12px 0; }
.hoja-tot dd { margin: 4px 0 0; font-size: 1.5rem; font-weight: 800; font-stretch: 75%; font-variant-numeric: tabular-nums; }
.hoja-precio { grid-column: 1 / -1; border-top: 1px dashed #BFC6C1; }
.hoja-precio dd { font-size: clamp(2.2rem, 4.4vw, 3.6rem); line-height: 1; }
.hoja .btn { justify-self: start; }
.proc-lista { list-style: none; margin: clamp(32px, 4vw, 56px) 0 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); counter-reset: none; }
.proc-lista li { display: grid; gap: 12px; align-content: start; padding: 24px 0 0; border-top: 2px solid var(--tinta); }
.proc-n { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--acc); box-shadow: 0 0 0 2px var(--tinta) inset; font-weight: 800; font-size: 1.5rem; font-stretch: 75%; }
.proc-lista p { color: var(--tinta-2); }
.proc-lista .tag { color: var(--tinta); }
.galeria { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: clamp(150px, 20vw, 290px); }
.galeria figure { border-radius: 10px; }
.galeria figcaption { position: absolute; left: 10px; bottom: 10px; z-index: 4; background: var(--papel); padding: 4px 8px; border-radius: 4px; font-size: .7rem; text-transform: uppercase; max-width: calc(100% - 20px); }
.g1 { grid-column: span 2; grid-row: span 2; }
.g2 { grid-row: span 2; }
@media (min-width: 900px) { .galeria { grid-template-columns: repeat(4, minmax(0, 1fr)); } .g1 { grid-column: 1 / span 2; grid-row: 1 / span 2; } .g2 { grid-column: 3; grid-row: 1 / span 2; } .g3 { grid-column: 4; grid-row: 1; } .g4 { grid-column: 4; grid-row: 2; } .g5 { grid-column: 1 / span 4; } }
.empresas-ev .eyebrow::before { box-shadow: 0 0 0 2px var(--papel) inset; }
.faq-sec .split { align-items: start; }

/* =================== FLOR FIJA =================== */
.fija-hero-pie { display: grid; gap: 24px; align-items: end; }
@media (min-width: 960px) { .fija-hero-pie { grid-template-columns: 1fr auto; } }
.calendario-sec .eyebrow::before { box-shadow: 0 0 0 2px var(--papel) inset; }
.cal-cab { display: grid; gap: 20px; margin-bottom: 36px; align-items: end; }
@media (min-width: 960px) { .cal-cab { grid-template-columns: 1fr 1fr; } }
.cal-cab .lead { color: #CDD4CF; }
.cal-ctrl { display: flex; flex-wrap: wrap; gap: 24px 40px; margin-bottom: 32px; }
.cal-ctrl .tag { color: #AEB6B1; }
.tira { display: grid; grid-auto-flow: column; grid-auto-columns: clamp(170px, 17vw, 220px); gap: 14px; overflow-x: auto; padding: 8px 2px 18px; scroll-snap-type: x mandatory; scrollbar-color: #565E59 transparent; }
.entrega { scroll-snap-align: start; background: var(--c); color: var(--tinta); border-radius: 10px; padding: 16px 16px 18px; display: grid; gap: 4px; box-shadow: 0 0 0 2px var(--tinta) inset; animation: entra .6s var(--ease-b) both; }
.entrega:nth-child(2) { animation-delay: .04s; } .entrega:nth-child(3) { animation-delay: .08s; } .entrega:nth-child(4) { animation-delay: .12s; } .entrega:nth-child(5) { animation-delay: .16s; }
@keyframes entra { from { opacity: 0; transform: translateY(20px); } }
.entrega canvas { width: 100%; aspect-ratio: 1; border-radius: 50%; background: rgba(255,255,255,.35); margin-bottom: 10px; }
.entrega-f { font-size: .7rem; text-transform: uppercase; }
.entrega-t { font-size: 1.5rem; font-weight: 800; font-stretch: 75%; line-height: 1; }
.entrega-s { font-size: .88rem; line-height: 1.3; }
.cal-tot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 24px; margin-top: 24px; border-top: 1px solid #2E3532; padding-top: 24px; }
.cal-tot dl { display: flex; flex-wrap: wrap; gap: 16px 40px; margin: 0; }
.cal-tot dt { color: #AEB6B1; }
.cal-tot dd { margin: 4px 0 0; font-size: clamp(2rem, 3.6vw, 3rem); font-weight: 800; font-stretch: 75%; line-height: 1; font-variant-numeric: tabular-nums; }
.cal-nota { flex-basis: 100%; font-size: .7rem; color: var(--mimosa); }
.pq-grid { display: grid; gap: clamp(32px, 4vw, 64px); }
@media (min-width: 900px) { .pq-grid { grid-template-columns: 1fr 1fr; } .pq:nth-child(2) { margin-top: 90px; } }
.pq { display: grid; gap: 14px; align-content: start; }
.pq figure { border-radius: 12px; margin-bottom: 8px; }
.pq .tag { color: var(--tinta-3); }
.pq .h3 { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.pq .sub { max-width: 52ch; }
.pq-lista { list-style: none; padding: 0; margin: 4px 0 0; display: grid; gap: 6px; }
.pq-lista li { display: flex; gap: 10px; align-items: center; font-weight: 600; }
.pq-lista li::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--acc); box-shadow: 0 0 0 1.5px var(--tinta); }

/* =================== PLANTAS =================== */
.ventana { display: grid; gap: clamp(24px, 4vw, 56px); align-items: center; }
@media (min-width: 1000px) { .ventana { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); } }
.ven-ctrl { display: grid; gap: 24px; min-width: 0; }
.ven-ctrl .eyebrow { margin: 0; }
.brujula { position: relative; width: 190px; height: 190px; border-radius: 50%; background: var(--papel-2); box-shadow: 0 0 0 2px var(--tinta) inset; }
.brujula button { position: absolute; width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--papel); box-shadow: 0 0 0 1.5px var(--tinta) inset; font-weight: 800; font-size: 1.1rem; cursor: pointer; z-index: 2; transition: background .2s, color .2s; }
.brujula button.is-on { background: var(--helecho); color: var(--papel); }
.b-n { left: 71px; top: 8px; } .b-s { left: 71px; bottom: 8px; } .b-e { right: 8px; top: 71px; } .b-o { left: 8px; top: 71px; }
.brujula-aguja { position: absolute; left: 50%; top: 50%; width: 14px; height: 64px; margin: -64px 0 0 -7px; transform-origin: 50% 100%; transition: transform .6s var(--ease-b); }
.brujula-aguja::before { content: ""; position: absolute; inset: 0; background: var(--coral); clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.brujula-aguja::after { content: ""; position: absolute; left: -3px; bottom: -10px; width: 20px; height: 20px; border-radius: 50%; background: var(--tinta); }
.ven-escena { border-radius: 14px; overflow: hidden; box-shadow: 0 0 0 2px var(--tinta); min-width: 0; }
.ven-escena svg { display: block; width: 100%; height: auto; }
.maceta { transition: transform .5s var(--ease-b); }
.ven-dice { margin: clamp(28px, 3vw, 44px) 0; font-size: var(--t-lead); max-width: 60ch; line-height: 1.4; }
.ven-dice b { background: linear-gradient(transparent 60%, #CDE6C7 60%); }
.plantas-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.planta { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 14px; padding: 12px; border-radius: 12px; background: var(--papel-2); transition: opacity .4s, filter .4s, transform .4s var(--ease-b); }
.planta figure { border-radius: 8px; align-self: start; }
.planta.is-no { opacity: .38; filter: grayscale(.9); }
.planta:not(.is-no) { box-shadow: 0 0 0 2px var(--helecho) inset; }
.planta-txt { display: grid; gap: 6px; min-width: 0; }
.planta-n { font-size: 1.3rem; font-weight: 800; font-stretch: 75%; line-height: 1; }
.planta-l { font-style: italic; font-size: .85rem; color: var(--tinta-3); }
.planta .kv { font-size: .7rem; gap: 3px 10px; }
.planta-pie { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 4px; }
.planta-no { font-size: .7rem; text-transform: uppercase; color: var(--tinta-3); }
.talleres-sec .eyebrow::before { box-shadow: 0 0 0 2px var(--papel) inset; }
.tal-cab { margin-bottom: clamp(32px, 4vw, 56px); align-items: end; }
.talleres { list-style: none; margin: 0; padding: 0; border-top: 1px solid #4A3F48; }
.taller { display: grid; gap: 14px 28px; padding: 26px 0; border-bottom: 1px solid #4A3F48; align-items: center; }
@media (min-width: 1000px) { .taller { grid-template-columns: 140px minmax(0, 1.6fr) minmax(0, 1fr) auto; } }
.taller-f { font-size: .72rem; text-transform: uppercase; color: var(--mimosa); line-height: 1.6; }
.taller-t { display: grid; gap: 6px; min-width: 0; }
.taller-t p { color: #CDD4CF; }
.taller-plazas { display: grid; gap: 8px; }
.plazas { display: flex; flex-wrap: wrap; gap: 5px; }
.plazas i { width: 16px; height: 16px; border-radius: 50%; box-shadow: 0 0 0 1.5px #8E877C inset; }
.plazas i.is-ocupada { background: var(--salvia); box-shadow: none; }
.taller-plazas .mono { font-size: .7rem; text-transform: uppercase; color: #AEB6B1; }
.taller-acc { display: flex; align-items: center; gap: 16px; }
.taller-acc .precio { font-size: 1.2rem; }
.taller.is-lleno .h3 { color: #8E877C; }
.talleres-sec .btn-acc { --acc: var(--mimosa); --acc-ink: var(--tinta); }
.cui-fig { border-radius: 14px; }
.cui-txt { display: grid; gap: 22px; }
.cui-txt .eyebrow { margin: 0; }

/* =================== DESPEDIDAS =================== */
body[data-acc="despedidas"] .mega, body[data-acc="despedidas"] .h1, body[data-acc="despedidas"] .h2 { font-stretch: 88%; font-weight: 700; letter-spacing: -.02em; }
.desp-hero .h1 { font-size: clamp(2.8rem, 7vw, 6.4rem); line-height: .95; }
.desp-hero-pie { display: grid; gap: 32px; align-items: end; }
@media (min-width: 960px) { .desp-hero-pie { grid-template-columns: 1.3fr 1fr; } }
.desp-tel { border-left: 2px solid var(--tinta); padding-left: 22px; display: grid; gap: 6px; }
.desp-num { font-size: clamp(2.4rem, 4.6vw, 3.8rem); font-weight: 800; font-stretch: 75%; text-decoration: none; line-height: 1; font-variant-numeric: tabular-nums; }
.desp-nota { font-size: .7rem; color: var(--tinta-3); }
.cinta-cab { display: grid; gap: 18px; max-width: 760px; margin-bottom: 40px; }
.cinta-cab .eyebrow { margin: 0; }
.cinta-in { display: grid; gap: clamp(24px, 4vw, 56px); align-items: center; }
@media (min-width: 960px) { .cinta-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.cinta-form { display: grid; gap: 22px; min-width: 0; }
.cinta-form .mono.is-mal, .cinta-aviso.is-mal { color: var(--ko); }
.sugerencias .chip { font-size: .82rem; }
.cinta-vista { background: radial-gradient(circle at 50% 35%, #FBF8F2, #E0D9CC); border-radius: 14px; box-shadow: 0 0 0 1.5px var(--tinta); padding: 10px; min-width: 0; }
.cinta-vista svg { width: 100%; height: auto; display: block; max-height: 560px; }
.cinta-aviso { margin-top: 20px; font-family: var(--f-mono); font-size: .74rem; font-stretch: 85%; }
.llega-sec .split { align-items: start; }
.llega { display: grid; gap: 20px; padding: clamp(20px, 3vw, 32px); border-radius: 14px; box-shadow: 0 0 0 1.5px var(--tinta) inset; min-width: 0; }
.llega-res { display: grid; gap: 10px; padding-top: 16px; border-top: 1.5px solid var(--tinta); }
.llega-si, .llega-no { font-size: 2rem; font-weight: 800; font-stretch: 80%; display: flex; align-items: center; gap: 12px; line-height: 1; }
.llega-si i, .llega-no i { width: 18px; height: 18px; border-radius: 50%; background: var(--ok); }
.llega-no i { background: var(--ko); }
.llega-nota { font-size: .7rem; color: var(--tinta-3); }
.desp-cat .h2 { margin-bottom: clamp(28px, 4vw, 48px); }
.desp-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 28px 18px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.dp { display: grid; gap: 10px; align-content: start; }
.dp figure { border-radius: 10px; margin-bottom: 6px; }
.dp p { color: #CDD4CF; }
.dp-pie { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; }
.desp-garant { list-style: none; margin: clamp(40px, 5vw, 64px) 0 0; padding: 24px 0 0; border-top: 1px solid #2E3532; display: grid; gap: 14px 32px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); color: #CDD4CF; }
.desp-garant b { color: var(--papel); display: block; }

/* =================== TIENDA =================== */
.tienda-hero { padding-block: clamp(32px, 5vw, 70px) 0; }
.tienda-hero-in { display: grid; gap: 32px; }
.tienda-fig { border-radius: 14px; box-shadow: 0 0 0 2px var(--tinta); }
.historia .split { align-items: start; }
.hist-txt p:first-child::first-letter { font-size: 3.4em; font-weight: 800; font-stretch: 75%; float: left; line-height: .8; margin: .06em .08em 0 0; color: var(--aciano); }
.reloj-in { display: grid; gap: clamp(32px, 5vw, 80px); align-items: center; }
@media (min-width: 960px) { .reloj-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.reloj-txt { display: grid; gap: 22px; min-width: 0; }
.reloj-txt .eyebrow { margin: 0; }
.reloj-txt .eyebrow::before { box-shadow: 0 0 0 2px var(--papel) inset; }
.reloj-txt .lead { color: #DCD3EA; }
.reloj-ctrl { justify-items: start; }
.reloj-ctrl label { width: 100%; }
.reloj-ctrl output { font-size: 1.1rem; }
.band-noche input[type="range"]::-webkit-slider-runnable-track { background: #4A3F66; }
.band-noche .chip { box-shadow: 0 0 0 1.5px #6B5E8E inset; }
.band-noche .chip:hover { background: #2C2148; }
.reloj { max-width: 520px; width: 100%; justify-self: center; filter: drop-shadow(0 30px 40px rgba(0,0,0,.4)); }
.reloj svg { width: 100%; height: auto; display: block; }
.reloj-panel { display: grid; gap: 10px; padding: 20px; border-radius: 12px; background: #261A42; min-height: 190px; align-content: start; }
.reloj-fase { font-size: 1.7rem; font-weight: 800; font-stretch: 78%; line-height: 1; display: flex; gap: 12px; align-items: center; }
.reloj-fase i { width: 18px; height: 18px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 2px var(--papel); flex: none; }
.reloj-envio { color: #FFC81F; }
.eq-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 28px 18px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); }
.eq { display: grid; gap: 8px; align-content: start; justify-items: start; }
.eq figure { width: 100%; border-radius: 999px 999px 10px 10px; margin-bottom: 8px; }
.eq-rol { color: var(--tinta-2); font-size: .95rem; }
.diario-sig { font-size: .7rem; color: var(--tinta-3); text-transform: uppercase; }
.diario-lista { display: grid; gap: clamp(24px, 3vw, 40px) clamp(16px, 2vw, 28px); grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }

/* =================== PEDIDO =================== */
.ped-hero { padding-block: clamp(32px, 4vw, 60px) 28px; }
.ped-hero .h1 { margin-bottom: 28px; font-size: clamp(2.6rem, 6vw, 5.4rem); }
.pasos { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px 22px; flex-wrap: wrap; }
.pasos li { display: flex; align-items: center; gap: 8px; font-weight: 700; font-stretch: 85%; color: var(--tinta-3); }
.pasos li span { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; box-shadow: 0 0 0 1.5px currentColor inset; font-size: .85rem; }
.pasos li.is-on { color: var(--tinta); }
.pasos li.is-on span { background: var(--mimosa); box-shadow: 0 0 0 2px var(--tinta) inset; }
.pasos li.is-hecho { color: var(--tinta); cursor: pointer; }
.pasos li.is-hecho span { background: var(--tinta); color: var(--papel); }
.pasos-barra { height: 4px; background: var(--papel-3); margin-top: 18px; border-radius: 2px; overflow: hidden; }
.pasos-barra i { display: block; height: 100%; background: linear-gradient(90deg, #FFC81F, #FF7A2F, #FF4F3A, #E8287F, #B6A0FF, #2F4BFF); transform: scaleX(.25); transform-origin: left; transition: transform .6s var(--ease); }
.ped { display: grid; gap: clamp(24px, 4vw, 56px); align-items: start; padding-bottom: var(--sec); }
@media (min-width: 1000px) { .ped { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); } }
.ped-form { min-width: 0; display: grid; gap: 28px; }
.paso { border: 0; padding: 0; margin: 0; display: grid; gap: 22px; min-width: 0; }
.paso.is-on { animation: entra .5s var(--ease); }
.paso-t { font-size: clamp(1.8rem, 3vw, 2.6rem); padding: 0; margin-bottom: 4px; }
.paso-t:focus { outline: none; }
.ped-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ped-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 10px; background: var(--papel-2); }
.ped-item-t { display: grid; gap: 2px; min-width: 0; }
.ped-item-t small { color: var(--tinta-3); font-size: .85rem; overflow-wrap: anywhere; }
.ped-quitar { background: none; border: 0; text-decoration: underline; cursor: pointer; font-size: .82rem; color: var(--tinta-2); }
.ped-vacio { padding: 18px; border-radius: 10px; box-shadow: 0 0 0 1.5px var(--papel-3) inset; }
.ped-add { display: grid; gap: 14px; }
@media (min-width: 700px) { .ped-add { grid-template-columns: 1.3fr 1fr; } }
.ped-add-b { display: grid; gap: 12px; align-content: start; justify-items: start; padding: 18px; border-radius: 12px; box-shadow: 0 0 0 1.5px var(--tinta) inset; min-width: 0; }
.ped-add-b .campo-2 { width: 100%; }
.ped-add-b .sel { width: 100%; }
.ped-mini { font-size: .7rem; color: var(--tinta-3); }
.ped-otros { font-size: .7rem; color: var(--tinta-3); }
.ped-otros a { color: var(--tinta); }
.campo-col { display: grid; gap: 18px; min-width: 0; }
.tarj-in { display: grid; gap: 28px; align-items: start; }
@media (min-width: 760px) { .tarj-in { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); } }
.tarj-vista { position: relative; aspect-ratio: 3 / 2; background: #FBFCFA; border-radius: 6px; padding: 28px 26px 22px 46px; box-shadow: 0 20px 40px -24px rgba(26,23,20,.5), 0 0 0 1px #D3D8D3; transform: rotate(-2deg); display: grid; align-content: start; gap: 12px; transition: opacity .3s, transform .4s var(--ease-b); max-width: 100%; }
.tarj-vista.is-off { opacity: .25; transform: rotate(-2deg) scale(.95); }
.tarj-ojal { position: absolute; left: 16px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-radius: 50%; box-shadow: 0 0 0 2px var(--kraft) inset; }
.tarj-ojal::after { content: ""; position: absolute; right: 100%; top: 6px; width: 40px; height: 2px; background: var(--kraft); }
.tarj-msg { font-size: 1.25rem; line-height: 1.3; font-stretch: 90%; overflow-wrap: anywhere; }
.tarj-msg.is-ph { color: var(--tinta-3); }
.tarj-firma { font-weight: 700; }
.tarj-logo { position: absolute; right: 18px; bottom: 12px; font-size: .72rem; font-weight: 300; }
.tarj-logo img { display: inline-block; height: .95em; width: auto; vertical-align: -.1em; margin-right: .3em; }
.envio { display: grid; gap: 18px; }
.envio[hidden] { display: none; }
.cp-res { align-self: end; font-size: .7rem; line-height: 1.5; padding: 8px 0; }
.cp-res.is-ok { color: var(--ok); }
.cp-res.is-mal { color: var(--ko); }
.dias { display: grid; grid-auto-flow: column; grid-auto-columns: 74px; gap: 8px; overflow-x: auto; padding: 2px 2px 10px; scrollbar-width: thin; }
.dia, .franja { appearance: none; border: 0; cursor: pointer; border-radius: 12px; background: var(--papel-2); display: grid; justify-items: center; gap: 2px; padding: 10px 4px; box-shadow: 0 0 0 1.5px transparent inset; transition: background .2s, box-shadow .2s; }
.dia small { font-family: var(--f-mono); font-size: .7rem; text-transform: uppercase; font-stretch: 85%; }
.dia b { font-size: 1.7rem; font-stretch: 75%; line-height: 1; }
.dia:hover:not(:disabled), .franja:hover:not(:disabled) { box-shadow: 0 0 0 1.5px var(--tinta) inset; }
.dia.is-on, .franja.is-on { background: var(--tinta); color: var(--papel); }
.dia:disabled, .franja:disabled { opacity: .35; cursor: not-allowed; background: repeating-linear-gradient(-45deg, var(--papel-2) 0 6px, var(--papel-3) 6px 7px); }
.franjas { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; }
.franja { justify-items: start; padding: 14px 16px; text-align: left; }
.franja b { font-size: 1.2rem; }
.franja .mono { font-size: .72rem; }
.franja small { font-size: .8rem; opacity: .75; }
.factura { display: grid; gap: 18px; padding: 18px; border-radius: 12px; background: var(--papel-2); }
.factura[hidden] { display: none; }
.ped-nav { display: flex; justify-content: space-between; gap: 12px; border-top: 1.5px solid var(--tinta); padding-top: 22px; }
.ped-nav [data-sig] { margin-left: auto; }
.etiqueta { position: relative; background: var(--kraft); color: var(--tinta); border-radius: 10px 10px 10px 10px; padding: 52px 24px 26px; display: grid; gap: 16px; clip-path: polygon(16% 0, 84% 0, 100% 8%, 100% 100%, 0 100%, 0 8%); background-image: var(--grano); min-width: 0; }
@media (min-width: 1000px) { .etiqueta { position: sticky; top: calc(var(--hdr-h) + 20px); } }
.etiqueta-ojal { position: absolute; left: 50%; top: 18px; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%; background: var(--papel); box-shadow: 0 0 0 4px #E7D3B5; }
.etiqueta .tag { color: #5A4027; }
.etq-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.etq-items li { display: flex; justify-content: space-between; gap: 12px; font-weight: 600; padding-bottom: 6px; border-bottom: 1px dashed #8C6A47; }
.etq-items li span:first-child { min-width: 0; overflow-wrap: anywhere; }
.etq-items .mono { font-size: .72rem; flex: none; }
.etq-vacia { color: #5A4027; font-weight: 400 !important; }
.etq-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 14px; margin: 0; font-size: .88rem; }
.etq-dl dt { font-family: var(--f-mono); font-size: .7rem; text-transform: uppercase; padding-top: 3px; color: #5A4027; font-stretch: 85%; }
.etq-dl dd { margin: 0; overflow-wrap: anywhere; }
.etq-total { display: flex; justify-content: space-between; align-items: baseline; border-top: 2px solid var(--tinta); padding-top: 12px; }
.etq-total span:last-child { font-size: 2.6rem; font-weight: 800; font-stretch: 75%; font-variant-numeric: tabular-nums; line-height: 1; }
.etq-pie { font-size: .7rem; color: #4A3520; line-height: 1.6; }
.confirma { display: grid; gap: 22px; justify-items: start; padding: clamp(24px, 4vw, 48px); border-radius: 16px; background: var(--papel-2); min-width: 0; }
.confirma:focus { outline: none; }
.confirma .eyebrow { margin: 0; }
.confirma-sello { width: 92px; height: 92px; border-radius: 50%; display: grid; grid-template-columns: 1fr 1fr; padding: 16px; gap: 4px; background: radial-gradient(circle at 35% 30%, #EEF0EC, #9DA29D 70%, #6F7570); animation: abre .7s var(--ease-b); }
.confirma-sello i { border-radius: 50%; background: var(--coral); } .confirma-sello i:nth-child(2) { background: var(--mimosa); } .confirma-sello i:nth-child(3) { background: var(--aciano); } .confirma-sello i:nth-child(4) { background: var(--fucsia); }
.confirma-nota { font-size: .7rem; color: var(--tinta-3); }
.ped-contacto-in { display: grid; gap: 24px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.ped-tel { font-size: 2rem; font-weight: 800; font-stretch: 75%; font-variant-numeric: tabular-nums; }
.ped-contacto .estado { margin-top: 8px; }

/* =================== LEGAL =================== */
.legal-in { display: grid; gap: clamp(28px, 4vw, 64px); padding-bottom: var(--sec); align-items: start; }
@media (min-width: 960px) { .legal-in { grid-template-columns: 260px minmax(0, 1fr); } .legal-nav { position: sticky; top: calc(var(--hdr-h) + 20px); } }
.legal-nav { display: grid; gap: 18px; font-size: .95rem; }
.legal-nav ol { margin: 0; padding: 0 0 0 1.2em; display: grid; gap: 6px; }
.legal-nav a { text-decoration: none; }
.legal-nav a:hover { text-decoration: underline; }
.legal-otras { display: grid; gap: 6px; padding-top: 16px; border-top: 1.5px solid var(--tinta); }
.legal-otras a[aria-current] { font-weight: 800; }
.legal-txt { max-width: 72ch; min-width: 0; }
.legal-txt h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); margin: 2.2em 0 .6em; font-stretch: 85%; letter-spacing: -.01em; line-height: 1.05; }
.legal-txt h2:first-child { margin-top: 0; }
.legal-txt p, .legal-txt ul { margin: 0 0 1em; }
.legal-txt li { margin-bottom: .4em; }
.tabla-wrap { overflow-x: auto; margin: 0 0 1.4em; }
.legal-txt table { width: 100%; border-collapse: collapse; font-size: .92rem; min-width: 560px; }
.legal-txt th, .legal-txt td { text-align: left; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--papel-3); vertical-align: top; }
.legal-txt th { font-family: var(--f-mono); font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 500; border-bottom: 2px solid var(--tinta); font-stretch: 85%; }
.campo, .llega { grid-template-columns: minmax(0, 1fr); }
.campo .sel, .campo-2 .sel { width: 100%; text-overflow: ellipsis; }
.campo-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 420px) { .llega .campo-2, .envio .campo-2 { grid-template-columns: minmax(0, 1fr); } }

/* ramo dentro de la columna del titular (escritorio) */
@media (min-width: 1100px) {
  .hero { align-items: start; }
  .hero-txt { position: sticky; top: calc(var(--hdr-h) + 24px); padding-top: clamp(20px, 6vh, 80px); }
  .hero.con-ramo .hero-txt { padding-top: 8px; gap: 18px; }
  .hero.con-ramo .hero-txt .lead, .hero.con-ramo .hero-txt .btns, .hero.con-ramo .hero-hoy { display: none; }
  .hero.con-ramo h1 { font-size: clamp(3rem, 5.4vw, 5.6rem); }
}
.dock.en-hero { position: relative; left: auto; bottom: auto; width: 100%; max-width: 460px; transform: none; z-index: 1; box-shadow: 0 24px 50px -24px rgba(0,0,0,.5); }
.dock.en-hero .dock-cuerpo { max-height: none; }
.dock.en-hero .dock-cv { width: 150px; height: 150px; }

/* ramos como muestras de carta de color */
.ramo-btn.muestra { gap: 0; background: #FFFDF8; border-radius: 4px; padding: 10px 10px 0; box-shadow: 0 1px 0 rgba(0,0,0,.05), 0 18px 30px -22px rgba(26,23,20,.45), 0 0 0 1px #D3D8D3; transition: transform .45s var(--ease-b), box-shadow .3s; }
.ramo-btn.muestra:hover { transform: translateY(-6px) rotate(-.6deg); box-shadow: 0 30px 40px -24px rgba(26,23,20,.5), 0 0 0 1.5px var(--tinta); }
.muestra .ramo-fig { border-radius: 2px; margin: 0; }
.ramo-btn.muestra:hover .ramo-fig { border-radius: 2px; }
.muestra-franja { display: flex; height: 28px; gap: 2px; margin-top: 2px; }
.muestra-franja i { display: block; background: var(--c); }
.muestra-cuerpo { display: grid; gap: 8px; padding: 16px 6px 16px; }
.muestra-cod { font-size: .7rem; color: var(--tinta-3); text-transform: uppercase; line-height: 1.6; }
.muestra .ramo-pie { border-top: 1px dashed #C9CFCA; padding-top: 10px; }
.muestra .precio { font-size: .74rem; }
.muestra-ver { font-weight: 700; font-size: .9rem; display: inline-flex; gap: 6px; align-items: center; }
.muestra-ver::after { content: ""; width: 9px; height: 9px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); }

/* ---- ronda 1 del árbitro ---- */
.chip-color input { width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; overflow: hidden; }
.chip-color input::-webkit-color-swatch-wrapper { padding: 0; }
.chip-color input::-webkit-color-swatch { border: 1.5px solid var(--tinta); border-radius: 50%; }
.chip-color input::-moz-color-swatch { border: 1.5px solid var(--tinta); border-radius: 50%; }
.chip-color.is-on { background: var(--c, var(--tinta)); color: var(--tinta); box-shadow: 0 0 0 2px var(--tinta) inset; }
.pared-pie { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; }
@media (hover: none) { .solo-raton { display: none; } }
.mostradores { list-style: none; margin: 0; padding: 0; display: grid; gap: clamp(28px, 3vw, 40px) clamp(14px, 2vw, 28px); grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }
.mostrador a { display: grid; gap: 12px; justify-items: start; text-decoration: none; }
.mostrador-boca { display: block; width: 100%; aspect-ratio: 1; border-radius: 50%; padding: 7%; background: radial-gradient(circle at 35% 30%, #EEF0EC, #A9AEA9 60%, #6F7570); box-shadow: 0 0 0 2px var(--tinta), 0 22px 30px -20px rgba(26,23,20,.5); position: relative; transition: transform .5s var(--ease-b); }
.mostrador-fig { border-radius: 50%; width: 100%; box-shadow: inset 0 0 0 6px #3B4A52; }
.mostrador a:hover .mostrador-boca, .mostrador a:focus-visible .mostrador-boca { transform: translateY(-10px) rotate(-5deg); }
.mostrador-t { font-size: clamp(1.7rem, 2.4vw, 2.3rem); font-weight: 800; font-stretch: 75%; line-height: .95; letter-spacing: -.02em; margin-top: 6px; }
.mostrador-d { color: var(--tinta-2); font-size: .98rem; max-width: 30ch; }
.mostrador a:hover .mostrador-t { text-decoration: underline; text-decoration-color: var(--c); text-decoration-thickness: 4px; text-underline-offset: 6px; }
@media (max-width: 699px) { .mostradores { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mostrador-d { font-size: .88rem; } }
.diario-osc .sub { color: #BFC6C1; }
.diario-osc .post .tag { color: #AEB6B1; }
.diario-osc .eyebrow::before { box-shadow: 0 0 0 2px var(--papel) inset; }
.diario-osc .lnk { text-decoration-color: var(--mimosa); }
.tarjeta::before { display: none; }
.tarjeta { padding: 26px 24px 40px 44px; }
.tarjeta::after { content: ""; position: absolute; left: 16px; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; box-shadow: 0 0 0 2px var(--kraft) inset; }
.tarjeta-logo { position: absolute; right: 16px; bottom: 12px; font-size: .72rem; font-weight: 300; }
.tarjeta-logo img { display: block; height: 14px; width: auto; }
.ped-add .campo-2 { grid-template-columns: minmax(0, 1fr); }
.plantas-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }

/* ---- ronda 2 del árbitro ---- */
.ramos-hero-pie, .fija-hero-pie { align-items: start; }
.albaran { background: #FBFCFA; padding: 18px 20px; border-radius: 3px; box-shadow: 0 0 0 1px #D3D8D3, 0 24px 40px -28px rgba(26,23,20,.5); transform: rotate(1.2deg); background-image: repeating-linear-gradient(transparent 0 31px, #EFE6D4 31px 32px); min-width: 0; }
.albaran-cab, .albaran-pie { display: flex; justify-content: space-between; gap: 10px; font-size: .7rem; text-transform: uppercase; }
.albaran-cab { border-bottom: 2px solid var(--tinta); padding-bottom: 8px; }
.albaran-pie { border-top: 1px dashed var(--tinta-3); padding-top: 8px; color: var(--tinta-3); }
.albaran-lista { list-style: none; margin: 6px 0; padding: 0; columns: 2; column-gap: 18px; }
.albaran-lista li { break-inside: avoid; }
.albaran-lista button { all: unset; box-sizing: border-box; cursor: pointer; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; align-items: center; padding: 6px 2px; font-weight: 700; font-stretch: 85%; font-size: .95rem; }
.albaran-lista button:hover span:first-child, .albaran-lista button:focus-visible span:first-child { text-decoration: underline; text-decoration-color: var(--coral); text-decoration-thickness: 3px; }
.albaran-lista button:focus-visible { outline: 2px solid var(--aciano); }
.albaran-lista .mono { font-size: .7rem; }
.alb-dots { display: flex; } .alb-dots i { width: 11px; height: 11px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1px var(--tinta); margin-right: -3px; }
@media (max-width: 560px) { .albaran-lista { columns: 1; } }
.cinta-anio { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3px; margin-top: clamp(32px, 4vw, 56px); }
.mes { background: var(--c); padding: 12px 8px 14px; min-height: 140px; display: grid; align-content: start; gap: 6px; border-radius: 4px; transition: transform .3s var(--ease-b); min-width: 0; }
.mes .mono { font-size: .7rem; text-transform: uppercase; }
.mes b { font-size: 1rem; font-stretch: 75%; line-height: 1.05; overflow-wrap: anywhere; }
.mes small { font-size: .72rem; line-height: 1.25; overflow-wrap: anywhere; }
.mes.is-hoy { box-shadow: 0 0 0 2.5px var(--tinta); transform: translateY(-8px); }
.mes:nth-child(9), .mes:nth-child(10), .mes:nth-child(12) { color: var(--papel); }
@media (max-width: 899px) { .cinta-anio { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 120px; overflow-x: auto; padding: 10px 2px; } }
.pl-hero { display: grid; gap: 32px; align-items: end; }
@media (min-width: 960px) { .pl-hero { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } }
.pl-hero-txt { display: grid; gap: 0; }
.ficha-hosp { background: #FBFCFA; border-radius: 3px; padding: 18px 20px; box-shadow: 0 0 0 1px #D3D8D3, 0 24px 40px -28px rgba(26,23,20,.5); transform: rotate(-1.4deg); border-top: 10px solid var(--helecho); }
.ficha-hosp-cab, .ficha-hosp-pie { font-size: .7rem; text-transform: uppercase; }
.ficha-hosp ul { list-style: none; margin: 12px 0; padding: 0; }
.ficha-hosp li { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding: 8px 0; border-bottom: 1px dashed #C9CFCA; }
.ficha-hosp li b { font-size: 1.9rem; font-stretch: 75%; line-height: 1; font-variant-numeric: tabular-nums; }
.ficha-hosp-pie { color: var(--tinta-3); }
.desp-dcha { display: grid; gap: 24px; }
.recepcion { background: #FBFCFA; border-radius: 3px; padding: 16px 18px; box-shadow: 0 0 0 1px #D3D8D3; }
.recepcion-cab { font-size: .7rem; border-bottom: 2px solid var(--tinta); padding-bottom: 8px; }
.recepcion ul { list-style: none; margin: 0; padding: 0; }
.recepcion li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; padding: 8px 0; border-bottom: 1px dashed #C9CFCA; font-size: .92rem; align-items: center; }
.recepcion .mono { font-size: .7rem; }
.recepcion .is-ok { color: var(--ok); } .recepcion .is-no { color: var(--tinta-3); }
@media (max-width: 560px) { .recepcion li { grid-template-columns: minmax(0, 1fr) auto; } .recepcion li span:nth-child(2) { display: none; } }
.crono { position: relative; }
@media (min-width: 900px) { .crono::before { content: ""; position: absolute; left: 0; right: 0; top: 51px; height: 3px; background: linear-gradient(90deg, #FFC81F, #FF8FB1, #E8287F); } .crono li { border-top: 0; padding-top: 0; } }
.crono .proc-n { width: auto; min-width: 104px; height: 104px; padding: 0 12px; font-size: 1.3rem; position: relative; z-index: 1; background: radial-gradient(circle at 35% 30%, #EEF0EC, #A9AEA9 70%, #6F7570); box-shadow: 0 0 0 2px var(--tinta); }
.crono .proc-n { border-radius: 50%; width: 104px; }
.crono li:last-child .proc-n { background: var(--acc); }
.tablon { background-color: #B98A5A; background-image: radial-gradient(#8E6538 1px, transparent 1.4px), radial-gradient(#D2A877 1px, transparent 1.4px); background-size: 7px 7px, 11px 11px; background-position: 0 0, 3px 4px; padding: clamp(24px, 3vw, 44px); border-radius: 8px; box-shadow: inset 0 0 0 10px #6B4E35, inset 0 0 0 12px #3E2C1E; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.tablon .tarjeta:nth-of-type(2) { margin-top: 40px; } .tablon .tarjeta:nth-of-type(3) blockquote { font-size: 1.05rem; } .tablon .tarjeta:nth-of-type(4) { margin-top: 24px; }
.polaroid { margin: 0; background: #FFF; padding: 10px 10px 14px; transform: rotate(var(--r)); box-shadow: 0 14px 24px -14px rgba(0,0,0,.5); display: grid; gap: 10px; align-self: start; }
.js .polaroid.rv { transform: translateY(26px) rotate(var(--r)); } .js .polaroid.rv.is-in { transform: rotate(var(--r)); }
.polaroid-foto { display: block; width: 100%; }
.polaroid figcaption { font-size: .7rem; text-transform: uppercase; color: var(--tinta-2); }
.desp-grid, .diario-lista { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
@media (min-width: 1000px) { .desp-grid, .diario-lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cta-strip > div { display: grid; gap: 16px; }
.paso-t { font-weight: 800; font-stretch: 75%; line-height: .95; letter-spacing: -.02em; }
.etiqueta { color: var(--tinta); }
.etiqueta .tag, .etq-dl dt, .etq-vacia, .etq-pie { color: #3A2816 !important; }
.etiqueta-ojal::after { content: ""; position: absolute; left: 50%; bottom: 100%; width: 2px; height: 70px; margin-left: -1px; background: repeating-linear-gradient(#E9DCC4 0 3px, #B8A27E 3px 6px); transform: rotate(14deg); transform-origin: bottom; }
.etiqueta { overflow: visible; }
.etiqueta-sello { position: absolute; right: 16px; top: 46px; width: 84px; height: 84px; border-radius: 50%; border: 2px solid rgba(160,30,40,.55); color: rgba(160,30,40,.6); font-family: var(--f-mono); font-size: .7rem; display: grid; place-items: center; text-align: center; padding: 12px; transform: rotate(-14deg); line-height: 1.5; letter-spacing: .1em; }
.ped-barra { display: none; }
@media (max-width: 999px) { .ped-barra { position: fixed; z-index: 40; left: max(12px, env(safe-area-inset-left, 0px)); right: 84px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 12px; background: var(--kraft); color: var(--tinta); text-decoration: none; box-shadow: 0 14px 30px -12px rgba(0,0,0,.5); font-weight: 700; } .ped-barra b { font-size: 1.3rem; font-stretch: 75%; } .ped-barra span:last-child { margin-left: auto; font-size: .85rem; text-decoration: underline; } .ped-barra .mono { font-size: .7rem; text-transform: uppercase; } .ped { padding-bottom: calc(var(--sec) + 40px); } }
@media (max-width: 599px) {
  .ramos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 10px; }
  .ramo-btn.muestra { padding: 6px 6px 0; }
  .muestra-franja { height: 16px; }
  .muestra-cuerpo { padding: 10px 2px 10px; gap: 5px; }
  .muestra .ramo-nom { font-size: 1.4rem; }
  .muestra-cod, .muestra .ramo-tono, .muestra .ramo-calle { display: none; }
  .muestra .ramo-pie { flex-direction: column; align-items: start; gap: 4px; }
  .muestra .precio { font-size: .7rem; }
}
.dock-lista { -webkit-mask-image: linear-gradient(#000 80%, transparent); mask-image: linear-gradient(#000 80%, transparent); padding-bottom: 18px; }
.ped-barra.is-vacia { display: none !important; }

/* ---- verificación ---- */
.etiqueta-sello { top: auto; bottom: 92px; right: 20px; width: 74px; height: 74px; }
.etiqueta-ojal::after { height: 120px; width: 2.5px; }
.desp-hero-pie { align-items: start; }
.etiqueta-sello { bottom: 16px; right: 16px; width: 70px; height: 70px; }
.etq-pie { padding-right: 84px; }
