/* Maquiven — home layout "procuras" (HomeLayout, ARCHITECTURE §5.10, board Portada v2, block M-20). Linked by web/home.php with this layout only. The card is in
   procura-card.css. Partners prints between "¿Cómo participo?" and the categories (partials/portada-procuras-below). */
.pp { background: var(--c-navy); color: var(--c-white); }
.pp__inner { display: flex; flex-direction: column; gap: 14px; max-width: 1120px; margin-inline: auto; padding: 28px var(--sp-4) 32px; }
.pp__eyebrow { margin: 0; color: #F7A27E; font-size: var(--fs-secondary); font-weight: var(--fw-bold); letter-spacing: .08em; }
.pp__title { margin: 0; color: var(--c-white); font-size: clamp(28px, 4.4vw, 52px); line-height: 1.1; font-weight: var(--fw-extrabold); letter-spacing: var(--ls-tight); }
.pp__title .accent { color: var(--c-orange); }
.pp__line { display: block; }
.pp__sub { margin: 0; max-width: 620px; color: #DCE3EE; font-size: 17px; line-height: 1.45; }
.pp__search { display: flex; flex-wrap: wrap; gap: var(--sp-2); padding: var(--sp-2); border-radius: 14px; background: var(--c-surface); color: var(--c-navy); }
.pp__switch { display: flex; gap: var(--sp-1); padding: 3px; border-radius: 10px; background: #F4F5F7; }
.pp__switch[hidden] { display: none; }
.pp__switch button { min-height: var(--touch); padding: 0 var(--sp-4); border: 0; border-radius: 8px; background: transparent; color: var(--c-navy); font: inherit; font-size: 15px; font-weight: var(--fw-semibold); cursor: pointer; }
.pp__switch button[aria-pressed="true"] { background: var(--c-navy); color: var(--c-white); }
.pp__field { flex: 999 1 260px; min-width: 0; display: flex; align-items: center; gap: var(--sp-2); min-height: 48px; padding: 0 var(--sp-3); border-radius: 10px; background: #F4F5F7; color: #46546A; }
.pp__field .ico { flex-shrink: 0; width: 18px; height: 18px; }
.pp__field input { flex: 1 1 auto; min-width: 0; min-height: 44px; border: 0; outline: 0; background: transparent; color: var(--c-navy); font: inherit; font-size: 16px; }
.pp__field input::placeholder { color: #46546A; opacity: 1; text-overflow: ellipsis; }
.pp__field:focus-within { box-shadow: var(--sh-focus-field); }
.pp__go { flex: 1 0 auto; min-height: 48px; padding: 0 20px; border: 0; border-radius: 10px; background: var(--c-orange-btn); color: var(--c-white); font: inherit; font-size: 16px; font-weight: var(--fw-bold); cursor: pointer; }
.pp__go:hover { background: var(--c-orange-hover); }
/* Block M-20: three ways in, one under the other on a phone */
.pp__paths { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; max-width: 1120px; margin: 20px auto 0; padding: 0 var(--sp-4); box-sizing: border-box; }
.pp__path { display: flex; align-items: flex-start; gap: 14px; padding: var(--sp-4); border: 1px solid #E3E6EB; border-radius: 14px; background: var(--c-surface); color: var(--c-navy); text-decoration: none; }
.pp__path:hover { color: var(--c-navy); box-shadow: var(--sh-sm); }
.pp__path--main { border-color: #F6C9B3; background: #FDF1EA; }
.pp__pathico { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; border-radius: 12px; background: #E8EDF4; color: var(--c-navy); }
.pp__pathico .ico { width: 22px; height: 22px; }
.pp__path--main .pp__pathico { background: #FADBCB; color: #8F3410; }
.pp__pathtext { display: flex; flex-direction: column; gap: var(--sp-1); min-width: 0; }
.pp__patheyebrow { color: var(--c-orange-text); font-size: var(--fs-secondary); font-weight: var(--fw-bold); letter-spacing: .06em; }
.pp__path--main .pp__patheyebrow, .pp__path--main .pp__pathgo { color: #8F3410; }
.pp__pathtitle { font-size: 19px; font-weight: var(--fw-extrabold); letter-spacing: var(--ls-tight); }
.pp__pathbody { color: #46546A; font-size: 14px; line-height: 1.45; }
.pp__pathgo { margin-top: 2px; color: var(--c-orange-text); font-size: 14px; font-weight: var(--fw-bold); }
@media (min-width: 768px) { .pp__paths { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.pp-below { display: flex; flex-direction: column; gap: 26px; max-width: 1120px; margin-inline: auto; padding: 28px var(--sp-4); box-sizing: border-box; }
.pp-sec { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.pp-sec__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.pp-sec__head h2 { margin: 0; font-size: var(--fs-section); font-weight: var(--fw-extrabold); letter-spacing: var(--ls-tight); }
.pp-sec__head--lead { flex-wrap: wrap; align-items: flex-end; gap: 6px var(--sp-4); }
.pp-sec__lead { display: flex; flex-direction: column; gap: 6px; flex: 1 1 280px; min-width: 0; }
.pp-sec__lead p { margin: 0; color: #46546A; font-size: 15px; line-height: 1.45; }
.pp-sec__lead h2 { font-size: clamp(21px, 2.6vw, 30px); }
.pp-sec__note { margin: 0; color: #46546A; font-size: 15px; line-height: 1.45; }
.pp-sec__head a { display: inline-flex; align-items: center; min-height: var(--touch); color: var(--c-orange-text); font-size: 14px; font-weight: var(--fw-bold); white-space: nowrap; }
.pp-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 10px; overflow-x: auto; padding-bottom: var(--sp-1); scroll-snap-type: x proximity; }
.pp-row > * { scroll-snap-align: start; }
/* Categorías: 6 tiles with the same generic image. A sliding row on the phone, the whole width from 768 px. A name never breaks inside a word. */
.pp-row--cats { grid-auto-columns: 124px; }
.pp-cat { display: flex; flex-direction: column; gap: 6px; min-width: 0; color: var(--c-navy); font-size: 13px; font-weight: var(--fw-semibold); line-height: 1.25; text-decoration: none; }
.pp-cat:hover { color: var(--c-navy); }
.pp-cat__label { word-break: keep-all; overflow-wrap: normal; hyphens: none; }
.pp-cat__photo { display: flex; align-items: center; justify-content: center; height: 76px; border-radius: var(--r-md); background: #E6EBF1; color: var(--c-navy); }
/* Block M-11: every drawing 70 % of its box's height, same line weight whatever the crop */
.ico--art { width: auto; height: 70%; max-width: 88%; overflow: visible; stroke-width: 2px; }
.ico--art * { vector-effect: non-scaling-stroke; }
@media (min-width: 768px) {
  .pp-row--cats { grid-auto-columns: minmax(0, 1fr); overflow-x: visible; }
}
/* M-02 + M-04: one partner, same container and heading as the other rows, cards in the same sliding row */
.pp-partner__strip { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-3) 14px; border: 1px solid #E3E6EB; border-radius: var(--r-lg); background: var(--c-surface); }
.pp-partner__plate { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 132px; height: 42px; box-sizing: border-box; padding: 0 var(--sp-2); border-radius: 8px; overflow: hidden; background: #000; color: #FFF; font-size: 18px; font-weight: var(--fw-extrabold); letter-spacing: .08em; white-space: nowrap; }
.pp-partner__plate--img { padding: 0; }
.pp-partner__plate picture, .pp-partner__plate img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pp-partner__line { min-width: 0; color: #46546A; font-size: 14px; line-height: 1.4; }
.pp-pcard { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid #E3E6EB; border-radius: var(--r-lg); background: var(--c-surface); color: var(--c-navy); text-decoration: none; }
.pp-pcard:hover { color: var(--c-navy); box-shadow: var(--sh-sm); }
.pp-pcard__img { display: flex; align-items: center; justify-content: center; height: 120px; background: #E6EBF1; color: var(--c-navy); }
.pp-pcard__img picture, .pp-pcard__img > img { display: block; width: 100%; height: 100%; }
.pp-pcard__img img { width: 100%; height: 100%; object-fit: cover; }
.pp-pcard__body { display: flex; flex-direction: column; gap: 2px; padding: 10px var(--sp-3); }
.pp-pcard__model { font-size: 15px; font-weight: var(--fw-bold); line-height: 1.25; }
.pp-pcard__line { color: #46546A; font-size: 13px; line-height: 1.35; }
.pp-pcard__price { margin-top: 2px; font-size: 15px; font-weight: var(--fw-extrabold); }
/* Several partners here keep the usual section, without its own container (M-04) */
.pp-below .partners.section { padding: 0; }
.pp-below .partners > .container { max-width: none; padding-inline: 0; }
.pp-below .partners .section-head h2 { font-size: 20px; font-weight: var(--fw-extrabold); letter-spacing: var(--ls-tight); }
/* "¿Cómo participo en una procura?": full-width band */
.pp-steps { background: #F4F5F7; }
.pp-steps__inner { display: flex; flex-direction: column; gap: 18px; max-width: 1120px; margin-inline: auto; padding: 28px var(--sp-4); box-sizing: border-box; }
.pp-steps h2 { margin: 0; font-size: clamp(21px, 2.6vw, 30px); font-weight: var(--fw-extrabold); letter-spacing: var(--ls-tight); }
.pp-steps ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.pp-steps li { color: #46546A; font-size: 15px; line-height: 1.45; }
.pp-steps li strong { color: var(--c-navy); }
.pp-steps__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) 18px; color: #5B6678; font-size: 13px; }
.pp-steps__foot a { display: inline-flex; align-items: center; min-height: var(--touch); color: var(--c-orange-text); font-size: 15px; font-weight: var(--fw-bold); }
/* Block M-29: below 480 px, what matters first */
.pp__pathshort, .pp__patharrow { display: none; }
/* Equipos en venta y alquiler (block M-45) */
.pe-tabs { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.pe-tabs[hidden] { display: none; }
.pe-tabs button { min-height: var(--touch); padding: 0 var(--sp-4); border: 1px solid #C7CDD6; border-radius: var(--r-pill); background: var(--c-surface); color: var(--c-navy); font: inherit; font-size: 14px; font-weight: var(--fw-semibold); cursor: pointer; }
.pe-tabs button[aria-pressed="true"] { border-color: var(--c-navy); background: var(--c-navy); color: var(--c-white); }
.pe-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); }
.pe-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid #E3E6EB; border-radius: var(--r-lg); background: var(--c-surface); color: var(--c-navy); text-decoration: none; }
.pe-card[hidden] { display: none; }
.pe-card__photo { display: block; aspect-ratio: 4 / 3; background: #F4F5F7; }
.pe-card__photo picture { display: contents; }
.pe-card__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pe-card__body { display: flex; flex-direction: column; gap: 4px; padding: var(--sp-3); }
.pe-card__tag { align-self: flex-start; padding: 2px 8px; border-radius: 6px; background: #E8F0FB; color: #173F72; font-size: var(--fs-secondary); font-weight: var(--fw-semibold); }
.pe-card__test { color: #46546A; font-size: var(--fs-secondary); font-weight: var(--fw-semibold); }
.pe-card__title { font-size: 15px; line-height: 1.25; font-weight: var(--fw-bold); overflow-wrap: anywhere; }
.pe-card__meta { color: #46546A; font-size: 13px; line-height: 1.35; }
.pe-card__price { font-size: var(--fs-card-price); font-weight: var(--fw-extrabold); line-height: 1.2; }   /* block M-99: 20 px */
.pe-card__also { color: #46546A; font-size: 13px; }
.pe-box { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-4); border: 1px dashed #C7CDD6; border-radius: var(--r-lg); }
.pe-box h2 { flex: 1 1 240px; margin: 0; font-size: 18px; font-weight: var(--fw-extrabold); }
.pe-btn:hover { text-decoration: none; }
.pe-box__go { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.pe-btn { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; min-height: var(--btn-h); padding: 0 var(--sp-4); border: 1px solid #C7CDD6; border-radius: 10px; color: var(--c-navy); font-size: 15px; font-weight: var(--fw-bold); }
.pe-btn--main { border-color: var(--c-orange-btn); background: var(--c-orange-btn); color: var(--c-white); font-size: 16px; }
.pe-btn--main:hover { background: var(--c-orange-hover); color: var(--c-white); }
@media (min-width: 768px) { .pe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Block M-47: on a phone the Asistente steps aside while it would cover a button (procuras.js) */
.assistant-launcher--away { opacity: 0; pointer-events: none; }

@media (max-width: 479.98px) {
  .pp__eyebrow { display: none; }
  .pp__title { font-size: clamp(26px, 7.8vw, 30px); overflow-wrap: break-word; }
  .pp__inner { padding-block: 20px 22px; gap: var(--sp-3); }
  .pp__sub { font-size: 15px; }
  .pp__switch { flex: 1 1 100%; }
  .pp__switch button { flex: 1 1 0; }
  .pp__field { flex-basis: 100%; }
  .pp__go { flex-basis: 100%; }
  .pp__paths { gap: var(--sp-2); margin-top: var(--sp-3); }
  .pp__path { align-items: center; gap: var(--sp-3); min-height: 64px; padding: var(--sp-2) var(--sp-3); box-sizing: border-box; }
  .pp__pathico { width: 40px; height: 40px; }
  .pp__pathtext { flex: 1 1 auto; gap: 1px; }
  .pp__patheyebrow, .pp__pathbody, .pp__pathgo { display: none; }
  .pp__pathtitle { font-size: 16px; }
  .pp__pathshort { display: block; color: #46546A; font-size: 13px; line-height: 1.3; }
  .pp__patharrow { display: flex; flex-shrink: 0; color: #46546A; }
  .pp__patharrow .ico { width: 18px; height: 18px; }
  .pp-below { padding-block: 22px; }
  .pp-row--cats { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3) var(--sp-2); overflow: visible; }
  .pp-cat__label { font-size: var(--fs-secondary); letter-spacing: -.02em; }   /* block M-99: never under 13 px */
}

/* block M-65: price blocks per tab, a listing for both labels its two prices */
.pe-card__prices { display: flex; flex-direction: column; gap: 2px; }
.pe-card__prices[hidden] { display: none; }
.pe-card__label { font-weight: var(--fw-semibold); color: var(--c-text-2); font-size: .85em; }
.pe-card__price--second { font-size: .92em; }
