/* ==========================================================================
   iPhone Venezuela — COMPONENTS
   Depends on tokens.css. Everything here is a signature element from
   PROJECT-MASTER.md section 7, built to the UX-ENGINE hard rules:
   one primary action per screen (the WhatsApp CTA), scannable, tables over
   prose, 44px tap targets, works at 360px on a bad connection.
   ========================================================================== */

/* ---------- Base rhythm (scoped to our content wrapper) ---------- */
.ip { font-family: var(--font-sans); color: var(--c-ink-soft); line-height: var(--lh-body); }
.ip * { box-sizing: border-box; }
.ip .wrap { max-width: var(--wide); margin: 0 auto; padding: 0 var(--s5); }
.ip .measure { max-width: var(--measure); }

.ip h1 { font-weight: var(--w-bold); font-size: var(--fs-h1); line-height: var(--lh-tight);
         letter-spacing: -.02em; color: var(--c-ink); margin: 0 0 var(--s4); }
.ip h2 { font-weight: var(--w-bold); font-size: var(--fs-h2); line-height: 1.2;
         letter-spacing: -.01em; color: var(--c-ink); margin: var(--s7) 0 var(--s4); }
.ip h3 { font-weight: var(--w-bold); font-size: var(--fs-h3); color: var(--c-ink);
         margin: var(--s5) 0 var(--s3); }
.ip p  { font-size: var(--fs-body); margin: 0 0 var(--s4); }
.ip a  { color: var(--c-link); text-decoration: none; }
.ip a:hover { text-decoration: underline; }

/* ---------- Eyebrow / "Actualizado hoy" live badge ---------- */
.ip .eyebrow { display: inline-flex; align-items: center; gap: var(--s2);
  font-size: var(--fs-eyebrow); font-weight: var(--w-bold); letter-spacing: .12em;
  text-transform: uppercase; color: var(--c-ink-mute); }

.updated-badge { display: inline-flex; align-items: center; gap: var(--s2);
  font-size: var(--fs-small); font-weight: var(--w-bold); color: var(--c-ink);
  background: var(--c-surface); border: 1px solid var(--c-line);
  padding: var(--s2) var(--s3); border-radius: var(--r-pill); }
.updated-badge .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ok);
  position: relative; }
.updated-badge .dot::after { content: ""; position: absolute; inset: -4px; border-radius: 50%;
  background: var(--ok); opacity: .35; animation: pulse 2s var(--ease) infinite; }
@keyframes pulse { 0% { transform: scale(.6); opacity: .5; } 100% { transform: scale(1.8); opacity: 0; } }

/* ---------- Answer box (AIO extraction zone, section 5.1 step 2) ---------- */
.answer-box { background: var(--c-accent-wash); border: 1px solid var(--c-line);
  border-left: 3px solid var(--c-accent); border-radius: var(--r-md);
  padding: var(--s5); margin: 0 0 var(--s5); }
.answer-box p { margin: 0; color: var(--c-ink); font-size: var(--fs-lead); line-height: 1.45; }
.answer-box .src { display: block; margin-top: var(--s3); font-size: var(--fs-small);
  color: var(--c-ink-mute); }

/* ---------- Price table (the core asset) ---------- */
.price-table-shell { overflow-x: auto; -webkit-overflow-scrolling: touch;
  border: 1px solid var(--c-line); border-radius: var(--r-md); }
.price-table { width: 100%; border-collapse: collapse; min-width: 520px;
  font-variant-numeric: var(--nums); }
.price-table caption { text-align: left; padding: var(--s4) var(--s5);
  font-size: var(--fs-small); color: var(--c-ink-mute); border-bottom: 1px solid var(--c-line); }
.price-table thead th { background: var(--c-ink); color: #fff; text-align: right;
  font-size: var(--fs-small); font-weight: var(--w-bold); letter-spacing: .02em;
  padding: var(--s3) var(--s4); white-space: nowrap; }
.price-table thead th:first-child { text-align: left; }
.price-table tbody td { padding: var(--s4); border-top: 1px solid var(--c-line);
  text-align: right; font-size: var(--fs-price-cell); color: var(--c-ink); }
.price-table tbody td:first-child { text-align: left; font-weight: var(--w-bold); }
.price-table tbody tr:nth-child(even) td { background: var(--c-surface); }
.price-table .bcv { display: block; font-size: var(--fs-small); color: var(--c-ink-mute);
  font-weight: var(--w-reg); }
.price-table .usd { font-weight: var(--w-bold); }

/* Big hero price (single-number moments, e.g. "desde $780") */
.price-hero { font-size: var(--fs-price); font-weight: var(--w-bold); color: var(--c-ink);
  letter-spacing: -.02em; font-variant-numeric: var(--nums); line-height: 1; }

/* ---------- Delta chip (▲ $20 / ▼ $15 vs semana pasada) ---------- */
.delta { display: inline-flex; align-items: center; gap: 2px; font-size: var(--fs-small);
  font-weight: var(--w-bold); padding: 1px var(--s2); border-radius: var(--r-sm);
  font-variant-numeric: var(--nums); }
.delta--up   { color: var(--up);   background: rgba(220,38,38,.08); }
.delta--down { color: var(--down); background: rgba(22,163,74,.08); }
.delta--flat { color: var(--flat); background: transparent; }

/* ---------- Availability badge ---------- */
.avail { display: inline-flex; align-items: center; gap: var(--s2); font-size: var(--fs-small);
  font-weight: var(--w-bold); }
.avail::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.avail--disponible { color: var(--ok); }
.avail--consultar  { color: var(--warn); }
.avail--agotado    { color: var(--gone); }

/* ---------- WhatsApp CTA (money button — the one palette break) ---------- */
.wa-cta { display: inline-flex; align-items: center; justify-content: center; gap: var(--s2);
  min-height: 48px; padding: var(--s3) var(--s5); background: var(--wa); color: #fff;
  font-weight: var(--w-bold); font-size: var(--fs-body); border-radius: var(--r-pill);
  border: 0; cursor: pointer; text-align: center; transition: filter var(--dur) var(--ease); }
.wa-cta:hover { filter: brightness(.95); text-decoration: none; }
.wa-cta svg { width: 20px; height: 20px; flex: none; }

/* Sticky mobile CTA — precio + transactional pages only (section 6) */
.wa-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
  padding: var(--s3) var(--s4); padding-bottom: calc(var(--s3) + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.92); backdrop-filter: blur(8px);
  border-top: 1px solid var(--c-line); display: none; }
.wa-sticky .wa-cta { width: 100%; }
@media (max-width: 820px) { .wa-sticky { display: block; } .ip.has-sticky { padding-bottom: 88px; } }

/* ---------- Card grid + callout + lead (shared layout helpers) ---------- */
.ip .card-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s4);
  margin: var(--s4) 0 var(--s5); }
@media (max-width: 700px) { .ip .card-grid { grid-template-columns: 1fr; } }
.ip .lead { max-width: var(--measure); }
.ip .callout { background: var(--c-surface); border: 1px solid var(--c-line);
  border-left: 3px solid var(--c-accent); padding: var(--s5); border-radius: var(--r-md);
  margin: var(--s4) 0; }

/* ---------- Tienda card (repeatable, future tenants slot in) ---------- */
.tienda-card { background: var(--c-paper); border: 1px solid var(--c-line);
  border-radius: var(--r-md); padding: var(--s5); box-shadow: var(--shadow-card);
  display: grid; gap: var(--s3); }
.tienda-card h3 { margin: 0; }
.tienda-card .meta { display: flex; flex-wrap: wrap; gap: var(--s3); font-size: var(--fs-small);
  color: var(--c-ink-mute); }

/* ---------- Breadcrumb (schema-marked, all non-home pages) ---------- */
.crumbs { font-size: var(--fs-small); color: var(--c-ink-mute); margin: 0 0 var(--s4); }
.crumbs a { color: var(--c-ink-mute); }
.crumbs a:hover { color: var(--c-link); }
.crumbs span[aria-current] { color: var(--c-ink); }

/* ---------- FAQ (schema-marked) ---------- */
.faq { border-top: 1px solid var(--c-line); }
.faq details { border-bottom: 1px solid var(--c-line); }
.faq summary { cursor: pointer; list-style: none; padding: var(--s4) 0; font-weight: var(--w-bold);
  color: var(--c-ink); display: flex; justify-content: space-between; gap: var(--s4); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--c-link); font-weight: var(--w-bold); }
.faq details[open] summary::after { content: "\2212"; } /* minus */
.faq details[open] summary { padding-bottom: var(--s2); }
.faq .a { padding: 0 0 var(--s4); color: var(--c-ink-soft); }

/* ---------- Copy-paste code block (operator APN pages) ---------- */
.ip .code-block { border: 1px solid var(--c-line); border-radius: var(--r-md); overflow: hidden; margin: var(--s4) 0 var(--s5); }
.ip .code-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--s3); padding: var(--s3) var(--s4); border-top: 1px solid var(--c-line); }
.ip .code-row:first-child { border-top: 0; }
.ip .code-label { font-size: var(--fs-small); color: var(--c-ink-mute); font-weight: var(--w-bold); }
.ip .code-value { font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; font-size: .9375rem;
  color: var(--c-ink); background: var(--c-surface); padding: 4px var(--s2); border-radius: var(--r-sm);
  user-select: all; word-break: break-all; }
.ip code { font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; background: var(--c-surface);
  padding: 2px 6px; border-radius: var(--r-sm); font-size: .9em; user-select: all; }

/* ---------- Site header + primary nav ---------- */
.ipv-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.92);
  backdrop-filter: blur(8px); border-bottom: 1px solid var(--c-line); font-family: var(--font-sans); }
.ipv-header .wrap { display: flex; align-items: center; justify-content: space-between;
  gap: var(--s4); min-height: 60px; }
.ipv-logo { font-weight: var(--w-bold); font-size: 1.0625rem; color: var(--c-ink); letter-spacing: -.02em; }
.ipv-logo:hover { text-decoration: none; }
.ipv-nav .ipv-menu { display: flex; gap: var(--s5); list-style: none; margin: 0; padding: 0; }
.ipv-menu a { font-weight: var(--w-bold); font-size: .9375rem; color: var(--c-ink); }
.ipv-menu a:hover { color: var(--c-link); text-decoration: none; }
.ipv-burger, .ipv-nav-toggle { display: none; }
@media (max-width: 820px) {
  .ipv-burger { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 44px; height: 44px; cursor: pointer; }
  .ipv-burger span { display: block; height: 2px; width: 22px; background: var(--c-ink); border-radius: 2px; }
  .ipv-nav { position: absolute; top: 60px; left: 0; right: 0; background: #fff;
    border-bottom: 1px solid var(--c-line); display: none; }
  .ipv-nav-toggle:checked ~ .ipv-nav { display: block; }
  .ipv-nav .ipv-menu { flex-direction: column; gap: 0; padding: 0 var(--s5); }
  .ipv-menu li { border-bottom: 1px solid var(--c-line); }
  .ipv-menu li:last-child { border-bottom: 0; }
  .ipv-menu a { display: flex; align-items: center; min-height: 48px; }
}

/* ---------- Site footer + footer nav ---------- */
.ipv-footer { background: var(--c-ink); color: #fff; margin-top: var(--s8);
  padding: var(--s7) 0 calc(var(--s6) + env(safe-area-inset-bottom)); font-family: var(--font-sans); }
.ipv-fnav .ipv-fmenu { display: flex; flex-wrap: wrap; gap: var(--s5); list-style: none;
  margin: 0 0 var(--s5); padding: 0; }
.ipv-fmenu a { color: rgba(255,255,255,.82); font-weight: var(--w-bold); font-size: .9375rem; }
.ipv-fmenu a:hover { color: #fff; text-decoration: none; }
.ipv-disclaimer { color: rgba(255,255,255,.58); font-size: .8125rem; line-height: 1.6;
  margin: 0 0 var(--s3); max-width: var(--measure); }
.ipv-legal { color: rgba(255,255,255,.58); font-size: .8125rem; margin: 0; }
.ipv-legal a { color: rgba(255,255,255,.82); }
.ipv-legal a:hover { color: #fff; }

/* ---------- Model selector (horizontal scroll, home) ---------- */
.model-rail { display: flex; gap: var(--s3); overflow-x: auto; -webkit-overflow-scrolling: touch;
  padding: var(--s2) 0 var(--s4); scroll-snap-type: x mandatory; }
.model-rail a { scroll-snap-align: start; flex: none; width: 132px; text-align: center;
  border: 1px solid var(--c-line); border-radius: var(--r-md); padding: var(--s4) var(--s3);
  background: var(--c-paper); transition: border-color var(--dur) var(--ease); }
.model-rail a:hover { border-color: var(--c-accent); text-decoration: none; }
.model-rail .m-name { display: block; font-weight: var(--w-bold); color: var(--c-ink); font-size: var(--fs-small); }
.model-rail .m-price { display: block; margin-top: var(--s1); color: var(--c-ink-mute); font-size: var(--fs-small); }

/* ==========================================================================
   v0.2 POLISH — standalone theme. Later rules intentionally override the
   earlier baseline. Ports the approved "market terminal" preview look.
   ========================================================================== */
:root { --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace; }

.skip-link { position:absolute; left:-9999px; top:0; z-index:200; background:var(--c-ink);
  color:#fff; padding:10px 16px; border-radius:0 0 8px 0; }
.skip-link:focus { left:0; }

/* ---------- Header ---------- */
.ipv-header { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.82);
  backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--c-line); }
.ipv-header .wrap { display:flex; align-items:center; justify-content:space-between; gap:var(--s4);
  min-height:64px; max-width:var(--wide); }
.ipv-logo { display:inline-flex; align-items:center; gap:10px; }
.ipv-logo:hover { text-decoration:none; }
.ipv-logo img { display:block; width:34px; height:34px; border-radius:9px; }
.ipv-logo-txt { font-weight:800; font-size:17px; letter-spacing:-.03em; color:var(--c-ink); line-height:1; }
.ipv-logo-txt em { font-style:normal; color:var(--c-accent); margin-left:.3em; font-weight:700; }
.ipv-nav { display:flex; align-items:center; gap:var(--s5); }
.ipv-nav .ipv-menu { display:flex; gap:var(--s5); list-style:none; margin:0; padding:0; }
.ipv-menu a { font-weight:600; font-size:14.5px; color:var(--c-ink-soft); }
.ipv-menu a:hover { color:var(--c-link); text-decoration:none; }
.ipv-live { display:inline-flex; align-items:center; gap:7px; font-family:var(--mono); font-size:10.5px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--c-ink-mute); font-weight:700; white-space:nowrap; }
.ipv-live .dot { width:7px; height:7px; border-radius:50%; background:var(--ok); position:relative; }
.ipv-live .dot::after { content:""; position:absolute; inset:-4px; border-radius:50%; background:var(--ok);
  opacity:.4; animation:pulse 2.4s var(--ease) infinite; }
.ipv-burger, .ipv-nav-toggle { display:none; }
@media (max-width:860px){
  .ipv-burger { display:inline-flex; flex-direction:column; justify-content:center; gap:5px;
    width:44px; height:44px; cursor:pointer; }
  .ipv-burger span { display:block; height:2px; width:22px; background:var(--c-ink); border-radius:2px; }
  .ipv-nav { position:absolute; top:64px; left:0; right:0; background:#fff; display:none;
    border-bottom:1px solid var(--c-line); flex-direction:column; align-items:stretch; gap:0; }
  .ipv-nav-toggle:checked ~ .ipv-nav { display:flex; }
  .ipv-nav .ipv-menu { flex-direction:column; gap:0; padding:0 var(--s5); }
  .ipv-menu li { border-bottom:1px solid var(--c-line); }
  .ipv-menu li:last-child { border-bottom:0; }
  .ipv-menu a { display:flex; align-items:center; min-height:52px; }
  .ipv-live { display:none; }
}

/* ---------- Hero (dark, accent glow) ---------- */
.surface-ink { position:relative; overflow:hidden; }
.surface-ink::before { content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 95% at 84% -12%, rgba(37,99,235,.32), transparent 55%); }
.surface-ink > * { position:relative; z-index:1; }
.surface-ink .wrap { max-width:var(--wide); }
.ip.surface-ink h1, .surface-ink h1 { font-size:clamp(34px,6vw,60px); line-height:1.02;
  letter-spacing:-.035em; font-weight:800; color:#fff; text-wrap:balance; }
.surface-ink .eyebrow { font-family:var(--mono); color:rgba(255,255,255,.6); }

/* ---------- Section rhythm ---------- */
.ip .wrap { max-width:var(--wide); }
.ip h2 { font-size:clamp(24px,3.2vw,34px); letter-spacing:-.02em; }

/* ---------- Price table as an elevated card ---------- */
.price-table-shell { border:1px solid var(--c-line); border-radius:16px; overflow:hidden;
  overflow-x:auto; background:var(--c-paper);
  box-shadow:0 1px 2px rgba(10,14,24,.04), 0 20px 44px rgba(10,14,24,.06); }
.price-table { min-width:520px; }
.price-table caption { text-align:left; padding:16px 20px; font-family:var(--mono); font-size:12px;
  letter-spacing:.02em; color:var(--c-ink-mute); border-bottom:1px solid var(--c-line); background:var(--c-surface); }
.price-table thead th { background:var(--c-ink); color:#fff; font-size:11.5px; letter-spacing:.06em;
  text-transform:uppercase; padding:13px 18px; }
.price-table tbody td { padding:15px 18px; font-size:16px; }
.price-table tbody tr:nth-child(even) td { background:transparent; }
.price-table tbody tr:hover td { background:var(--c-surface); }
.price-table .usd { font-weight:800; letter-spacing:-.01em; }

/* ---------- Answer box ---------- */
.answer-box { background:var(--accent-wash,#eff4fe); border:1px solid var(--c-line);
  border-left:3px solid var(--c-accent); border-radius:14px; padding:22px 24px; }
.answer-box p { font-size:var(--fs-lead); line-height:1.5; color:var(--c-ink); }

/* ---------- WhatsApp button ---------- */
.wa-cta { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:48px;
  padding:0 22px; background:var(--wa); color:#fff; font-weight:700; font-size:15px; border-radius:999px;
  box-shadow:0 8px 20px rgba(37,211,102,.28); transition:transform .15s var(--ease), filter .15s var(--ease); }
.wa-cta:hover { filter:brightness(.97); transform:translateY(-1px); text-decoration:none; }

/* ---------- Model rail (cards) ---------- */
.model-rail { display:flex; gap:12px; overflow-x:auto; padding:6px 0 12px; -webkit-overflow-scrolling:touch; }
.model-rail a { flex:0 0 auto; min-width:150px; padding:16px 18px; border:1px solid var(--c-line);
  border-radius:14px; background:var(--c-paper); transition:border-color .15s var(--ease), transform .15s var(--ease), box-shadow .15s var(--ease); }
.model-rail a:hover { border-color:var(--c-accent); transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(10,14,24,.08); text-decoration:none; }
.model-rail .m-name { display:block; font-weight:700; font-size:14px; color:var(--c-ink); }
.model-rail .m-price { display:block; margin-top:6px; font-size:19px; font-weight:800; letter-spacing:-.02em; color:var(--c-ink); }

/* ---------- Footer ---------- */
.ipv-footer { background:#08090C; color:rgba(255,255,255,.7); margin-top:var(--s8);
  padding:var(--s7) 0 calc(var(--s6) + env(safe-area-inset-bottom)); }
.ipv-footer .wrap { max-width:var(--wide); display:flex; flex-direction:column; gap:16px; }
.ipv-logo--footer .ipv-logo-txt { color:#fff; }
.ipv-fnav .ipv-fmenu { display:flex; flex-wrap:wrap; gap:var(--s5); list-style:none; margin:0; padding:0; }
.ipv-fmenu a { color:rgba(255,255,255,.82); font-weight:600; font-size:14px; }
.ipv-fmenu a:hover { color:#fff; text-decoration:none; }
.ipv-disclaimer { color:rgba(255,255,255,.5); font-size:12.5px; line-height:1.6; max-width:64ch; margin:0; }
.ipv-legal { color:rgba(255,255,255,.55); font-size:13px; margin:0; }
.ipv-legal a { color:rgba(255,255,255,.82); }

/* ---------- Delta chips (a touch more refined) ---------- */
.delta { font-family:var(--mono); font-weight:700; }

/* ==========================================================================
   v0.3 — buttons, home hero visual, section cards, product page (PDP)
   ========================================================================== */

/* ---------- Buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px;
  padding:0 24px; border-radius:999px; font-weight:700; font-size:15px; cursor:pointer; border:0;
  transition:transform .15s var(--ease), filter .15s var(--ease), background .15s var(--ease); }
.btn:hover { text-decoration:none; transform:translateY(-1px); }
.btn-primary { background:var(--c-accent); color:#fff; }
.btn-primary:hover { filter:brightness(1.06); }
.btn-ghost { background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.28); }
.btn-ghost:hover { border-color:rgba(255,255,255,.6); }
.cta-row { display:flex; flex-wrap:wrap; gap:12px; margin-top:var(--s5); }

/* ---------- Home hero ---------- */
.hero .hero-grid { display:grid; grid-template-columns:1.08fr .92fr; gap:56px; align-items:center;
  padding:88px 0 84px; max-width:var(--wide); }
.hero .eyebrow .tick { width:22px; height:1px; background:var(--c-accent); display:inline-block; }
.hero-copy h1 em { font-style:normal; color:#8fb4ff; }
.hero-copy .lead { color:rgba(255,255,255,.74); font-size:clamp(16px,1.7vw,19px); max-width:46ch; }
.hero-visual { display:flex; flex-direction:column; gap:14px; }
.pcard { display:block; border-radius:20px; border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05); backdrop-filter:blur(8px); box-shadow:0 30px 60px rgba(0,0,0,.4); }
.pcard--main { padding:24px 26px; }
.pcard--main:hover { text-decoration:none; border-color:rgba(255,255,255,.22); }
.pcard-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.pill { font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase;
  padding:4px 9px; border-radius:6px; }
.pill--new { color:#8fb4ff; background:rgba(37,99,235,.18); }
.pcard-live { display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-size:10.5px;
  letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.6); }
.pcard-live .dot { width:6px; height:6px; border-radius:50%; background:var(--ok); }
.pcard-name { color:rgba(255,255,255,.66); font-size:14px; font-weight:600; }
.pcard-price { color:#fff; font-size:44px; font-weight:800; letter-spacing:-.03em; line-height:1.05; margin:2px 0 14px; }
.pcard-foot { display:flex; align-items:center; justify-content:space-between; }
.pcard-foot .avail { color:#3ec77a; }
.pcard-cap { font-size:13px; color:#8fb4ff; font-weight:600; }
.pcard--mini { display:flex; align-items:center; justify-content:space-between; padding:15px 22px;
  color:rgba(255,255,255,.82); }
.pcard--mini span { font-size:14px; } .pcard--mini strong { font-size:18px; letter-spacing:-.02em; }
.pcard--m1 { margin-left:24px; opacity:.92; } .pcard--m2 { margin-left:48px; opacity:.82; }
@media (max-width:900px){ .hero .hero-grid { grid-template-columns:1fr; gap:36px; padding:56px var(--s5) 48px; }
  .pcard--mini { margin-left:0 !important; } }

/* ---------- Sections ---------- */
.sec { padding:56px 0; }
.sec-head { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:22px; }
.sec-head h2 { margin:0; }
.sec-link { font-weight:700; font-size:14px; color:var(--c-link); white-space:nowrap; }

/* ---------- Explore cards ---------- */
.explore-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media (max-width:820px){ .explore-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .explore-grid { grid-template-columns:1fr; } }
.ecard { display:block; padding:24px; border:1px solid var(--c-line); border-radius:16px; background:var(--c-paper);
  transition:border-color .15s var(--ease), transform .15s var(--ease), box-shadow .15s var(--ease); }
.ecard:hover { text-decoration:none; border-color:var(--c-accent); transform:translateY(-2px); box-shadow:0 14px 30px rgba(10,14,24,.08); }
.ecard-t { display:block; font-weight:700; font-size:17px; color:var(--c-ink); }
.ecard-t::after { content:" →"; color:var(--c-accent); }
.ecard-d { display:block; margin-top:6px; color:var(--c-ink-mute); font-size:14px; }

/* ---------- Trust strip ---------- */
.sec--trust { background:var(--c-surface); border-top:1px solid var(--c-line); border-bottom:1px solid var(--c-line); }
.trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
@media (max-width:760px){ .trust-grid { grid-template-columns:1fr; gap:20px; } }
.trust-n { font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--c-accent); font-weight:700; }
.trust-cell h3 { margin:8px 0 6px; font-size:17px; }
.trust-cell p { margin:0; color:var(--c-ink-soft); font-size:14.5px; }

/* ---------- Product page (PDP) ---------- */
.pdp-grid { display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:start; margin:8px 0 40px; }
@media (max-width:860px){ .pdp-grid { grid-template-columns:1fr; gap:28px; } }
.pdp-media { position:sticky; top:88px; display:flex; flex-direction:column; align-items:center;
  background:radial-gradient(60% 55% at 50% 40%, var(--c-accent-wash), transparent 70%); border-radius:24px; padding:24px; }
.pdp-media img { width:min(260px,70%); height:auto; }
.pdp-media-note { font-size:11px; color:var(--c-ink-faint); margin:12px 0 0; }
@media (max-width:860px){ .pdp-media { position:static; } .pdp-media img { width:180px; } }
.pdp-buy h1 { font-size:clamp(26px,3.4vw,38px); margin:14px 0 6px; }
.pdp-h1-sub { display:block; font-size:15px; font-weight:600; color:var(--c-ink-mute); letter-spacing:0; margin-top:4px; }
.pdp-price-row { display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin:14px 0 4px; }
.pdp-price { font-size:clamp(40px,6vw,54px); font-weight:800; letter-spacing:-.03em; color:var(--c-ink); line-height:1; }
.pdp-cfg { font-size:14px; color:var(--c-ink-mute); font-weight:600; }
.opt { margin:20px 0; }
.opt-label { display:block; font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--c-ink-mute); font-weight:700; margin-bottom:10px; }
.chips { display:flex; flex-wrap:wrap; gap:10px; }
.chip { min-height:44px; padding:0 18px; border-radius:12px; border:1.5px solid var(--c-line); background:var(--c-paper);
  font-weight:600; font-size:14.5px; color:var(--c-ink); cursor:pointer; transition:all .12s var(--ease); }
.chip:hover { border-color:var(--c-ink-mute); }
.chip.is-sel { border-color:var(--c-accent); background:var(--c-accent); color:#fff; }
.pdp-cta { width:100%; margin:22px 0 18px; font-size:16px; }
.pdp-trust { list-style:none; margin:0; padding:18px 0 0; border-top:1px solid var(--c-line); display:grid; gap:10px; }
.pdp-trust li { font-size:14px; color:var(--c-ink-soft); }
.pdp-detail { margin-top:16px; }
.wrap-h2 { max-width:var(--wide); }

/* ---------- Master table: calm the blue (model name dark, action stays blue) ---------- */
.price-table tbody td:first-child a { color:var(--c-ink); font-weight:700; }
.price-table tbody td:first-child a:hover { color:var(--c-link); }

/* ==========================================================================
   v0.4 — bigger CTAs, specs table, reviews, real product photo
   ========================================================================== */

/* Big, consistent WhatsApp CTA everywhere */
.wa-cta { min-height:54px; font-size:16px; padding:0 26px; }
.pdp-cta { min-height:60px; font-size:17px; width:100%; margin:24px 0 20px; }
.btn { min-height:52px; }

/* Real product photo (native featured image) vs vector fallback */
.pdp-media--photo { background:var(--c-surface); }
.pdp-photo { width:100%; max-width:420px; height:auto; border-radius:16px; }

/* Specs table (ficha técnica) */
.spec-wrap { border:1px solid var(--c-line); border-radius:14px; overflow:hidden; margin:8px 0 8px; }
.spec-table { width:100%; border-collapse:collapse; }
.spec-table th, .spec-table td { padding:14px 18px; text-align:left; font-size:15px; border-top:1px solid var(--c-line); vertical-align:top; }
.spec-table tr:first-child th, .spec-table tr:first-child td { border-top:0; }
.spec-table th { width:38%; color:var(--c-ink-mute); font-weight:600; font-family:var(--font-sans); }
.spec-table td { color:var(--c-ink); font-weight:600; }
.spec-table tr:nth-child(even) th, .spec-table tr:nth-child(even) td { background:var(--c-surface); }

/* Reviews / verified store */
.reviews { margin:var(--s7) auto 0; }
.review-card { display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  border:1px solid var(--c-line); border-radius:16px; padding:20px 22px; background:var(--c-paper); box-shadow:var(--shadow-card); }
.review-store { display:flex; align-items:center; gap:14px; }
.review-avatar { display:grid; place-items:center; width:46px; height:46px; border-radius:12px;
  background:var(--c-accent); color:#fff; font-weight:800; font-size:20px; }
.review-store strong { display:block; font-size:17px; color:var(--c-ink); }
.review-meta { display:block; font-size:13.5px; color:var(--c-ink-mute); }
.btn-outline { min-height:44px; padding:0 18px; border-radius:999px; border:1.5px solid var(--c-line);
  background:var(--c-paper); color:var(--c-ink); font-weight:700; font-size:14px; display:inline-flex; align-items:center; }
.btn-outline:hover { border-color:var(--c-accent); color:var(--c-link); text-decoration:none; }

/* ==========================================================================
   v0.5 — align hero cards, model cards with thumbnails (even edges + images)
   ========================================================================== */

/* Hero price-card stack: remove the staggered indents (weird edges) */
.pcard--m1, .pcard--m2 { margin-left:0 !important; opacity:1 !important; }
.hero-visual .pcard { width:100%; }

/* Model cards — used as a wrapping grid (home) or scroll rail (related) */
.model-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(162px,1fr)); gap:14px; }
.model-rail { display:flex; gap:14px; overflow-x:auto; padding:6px 0 14px; -webkit-overflow-scrolling:touch; }
.model-rail a, .model-grid a { display:flex; flex-direction:column; align-items:center; text-align:center;
  border:1px solid var(--c-line); border-radius:16px; background:var(--c-paper); padding:18px 14px 16px;
  transition:border-color .15s var(--ease), transform .15s var(--ease), box-shadow .15s var(--ease); }
.model-rail a { flex:0 0 auto; width:172px; }
.model-rail a:hover, .model-grid a:hover { border-color:var(--c-accent); transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(10,14,24,.10); text-decoration:none; }
.m-thumb { display:flex; align-items:center; justify-content:center; height:126px; width:100%; margin-bottom:12px;
  border-radius:12px; background:radial-gradient(60% 60% at 50% 45%, var(--c-accent-wash), transparent 72%); }
.m-thumb img { height:118px; width:auto; object-fit:contain; }
.m-thumb--svg img { height:110px; }
.m-name { font-weight:700; font-size:14px; color:var(--c-ink); line-height:1.25;
  min-height:2.5em; display:flex; align-items:center; justify-content:center; }
.m-price { margin-top:6px; font-size:18px; font-weight:800; letter-spacing:-.02em; color:var(--c-ink); }
@media (max-width:520px){ .model-grid { grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); } }

/* ==========================================================================
   v0.6 — premium polish (Inter, richer dark, tinted thumbs, motion)
   ========================================================================== */

/* Richer dark surfaces + layered glow */
.surface-ink { background:linear-gradient(180deg,#0b0d12 0%,#070809 100%); }
.surface-ink::before { background:
  radial-gradient(85% 70% at 84% -12%, rgba(37,99,235,.34), transparent 58%),
  radial-gradient(55% 50% at 6% 112%, rgba(124,58,237,.16), transparent 60%); }

/* Hero: tighter, bigger, with a soft load reveal */
.hero .hero-grid { padding:64px var(--s5) 64px; }
.hero-copy h1 { font-size:clamp(38px,6.2vw,66px); letter-spacing:-.04em; line-height:1.0; }
@media (prefers-reduced-motion:no-preference){
  .hero-copy > *, .hero-visual > * { animation:ipvUp .7s var(--ease) both; }
  .hero-copy > *:nth-child(1){animation-delay:.02s}
  .hero-copy > *:nth-child(2){animation-delay:.08s}
  .hero-copy > *:nth-child(3){animation-delay:.14s}
  .hero-copy > *:nth-child(4){animation-delay:.20s}
  .hero-visual > *:nth-child(1){animation-delay:.16s}
  .hero-visual > *:nth-child(2){animation-delay:.22s}
  .hero-visual > *:nth-child(3){animation-delay:.28s}
  .hero-visual > *:nth-child(4){animation-delay:.34s}
}
@keyframes ipvUp { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:none} }

/* Primary button — depth */
.btn-primary { background:linear-gradient(180deg,#3d86f7,#2563eb); box-shadow:0 8px 22px rgba(37,99,235,.34); }
.btn-primary:hover { box-shadow:0 12px 28px rgba(37,99,235,.46); filter:none; }

/* Hero glass cards — refined */
.pcard { background:rgba(255,255,255,.055); border-color:rgba(255,255,255,.14); }
.pcard--main { box-shadow:0 40px 90px rgba(0,0,0,.55); }
.pcard--mini { background:rgba(255,255,255,.04); }

/* Per-model tinted thumbnails (variety + life) */
.model-grid a:nth-child(6n+1) .m-thumb,.model-rail a:nth-child(6n+1) .m-thumb{background:radial-gradient(60% 60% at 50% 45%,rgba(37,99,235,.17),transparent 72%)}
.model-grid a:nth-child(6n+2) .m-thumb,.model-rail a:nth-child(6n+2) .m-thumb{background:radial-gradient(60% 60% at 50% 45%,rgba(124,58,237,.17),transparent 72%)}
.model-grid a:nth-child(6n+3) .m-thumb,.model-rail a:nth-child(6n+3) .m-thumb{background:radial-gradient(60% 60% at 50% 45%,rgba(14,165,233,.17),transparent 72%)}
.model-grid a:nth-child(6n+4) .m-thumb,.model-rail a:nth-child(6n+4) .m-thumb{background:radial-gradient(60% 60% at 50% 45%,rgba(236,72,153,.15),transparent 72%)}
.model-grid a:nth-child(6n+5) .m-thumb,.model-rail a:nth-child(6n+5) .m-thumb{background:radial-gradient(60% 60% at 50% 45%,rgba(245,158,11,.15),transparent 72%)}
.model-grid a:nth-child(6n+6) .m-thumb,.model-rail a:nth-child(6n+6) .m-thumb{background:radial-gradient(60% 60% at 50% 45%,rgba(16,185,129,.15),transparent 72%)}

/* Softer, more refined cards + shadows */
.ecard, .model-grid a, .model-rail a, .tienda-card { box-shadow:0 1px 2px rgba(10,14,24,.03); }
.price-table-shell { box-shadow:0 1px 2px rgba(10,14,24,.04),0 24px 50px rgba(10,14,24,.055); }

/* Nav underline on hover (subtle) */
.ipv-menu a { position:relative; }
.ipv-menu a::after { content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px;
  background:var(--c-accent); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .18s var(--ease); }
.ipv-menu a:hover::after { transform:scaleX(1); }

/* Section rhythm */
.sec { padding:64px 0; }
.sec-head h2, .ip h2 { letter-spacing:-.025em; }

/* Footer: hairline top glow */
.ipv-footer { background:linear-gradient(180deg,#0a0c11,#070809); border-top:1px solid rgba(255,255,255,.06); }

/* ==========================================================================
   v0.7 — CRO: CTA placement, reassurance, repeat conversion block
   ========================================================================== */
.hero-link { display:inline-block; margin-top:16px; color:rgba(255,255,255,.72); font-weight:600; font-size:14px; }
.hero-link:hover { color:#fff; text-decoration:none; }
.hero .cta-row { align-items:center; }

.cta-reassure { text-align:center; font-size:13px; color:var(--c-ink-mute); margin:6px 0 14px; }

.cta-block { background:linear-gradient(180deg,var(--c-surface),var(--c-paper)); border:1px solid var(--c-line);
  border-radius:22px; padding:40px 28px; text-align:center; margin:var(--s7) 0 0; }
.cta-block .wrap { padding:0; }
.cta-block .measure { margin:0 auto; }
.cta-block h2 { margin:0 0 8px; }
.cta-block p { color:var(--c-ink-soft); margin:0 auto 22px; max-width:48ch; }
.cta-block .wa-cta { min-width:300px; }
@media (max-width:560px){ .cta-block .wa-cta { min-width:0; width:100%; } }

/* ==========================================================================
   v0.8 — PDP CRO: payment options, trust badges, "cómo funciona" process
   ========================================================================== */
.pdp-pay { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:20px 0 2px; }
.pay-label { font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--c-ink-mute); font-weight:700; }
.pay-list { display:flex; gap:8px; flex-wrap:wrap; }
.pay-list span { font-size:13px; font-weight:600; color:var(--c-ink); background:var(--c-surface); border:1px solid var(--c-line); padding:6px 12px; border-radius:999px; }

.pdp-badges { list-style:none; margin:0; padding:20px 0 0; border-top:1px solid var(--c-line); display:grid; gap:14px; }
.pdp-badges li { display:flex; gap:12px; align-items:flex-start; }
.bi { flex:none; width:22px; height:22px; border-radius:50%; background:rgba(22,163,74,.13); color:var(--ok);
  display:grid; place-items:center; font-size:12px; font-weight:800; margin-top:1px; }
.pdp-badges div strong { display:block; font-size:14.5px; color:var(--c-ink); }
.pdp-badges div span { display:block; font-size:13px; color:var(--c-ink-mute); margin-top:1px; }

.process { list-style:none; margin:10px 0; padding:0; display:grid; gap:18px; }
.process li { display:flex; gap:16px; align-items:flex-start; }
.pnum { flex:none; width:34px; height:34px; border-radius:50%;
  background:linear-gradient(180deg,#1b1d22,#0a0a0b); color:#fff; display:grid; place-items:center; font-weight:800; font-size:15px; }
.process strong { display:block; font-size:16px; color:var(--c-ink); margin-bottom:2px; }
.process p { margin:0; color:var(--c-ink-soft); font-size:14.5px; }

/* ============================================================
   v0.9 — Real imagery: hero photo + floating price, local band
   ============================================================ */
.eyebrow .tick { width:22px; height:1px; background:var(--c-accent); display:inline-block; }

/* Hero: real iPhone photo with a live-price glass card floating over it */
.hero-photo { position:relative; margin:0; border-radius:22px; overflow:hidden; line-height:0;
  border:1px solid rgba(255,255,255,.12); box-shadow:0 40px 90px rgba(0,0,0,.55); }
.hero-photo img { width:100%; height:auto; display:block; }
.pcard--float { position:absolute; left:16px; bottom:16px; width:min(64%,262px); padding:15px 17px;
  background:rgba(14,16,22,.60); backdrop-filter:blur(16px) saturate(1.3); -webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,255,255,.18); border-radius:16px; box-shadow:0 20px 46px rgba(0,0,0,.5); }
.pcard--float .pcard-price { font-size:31px; margin:2px 0 10px; }
.pcard--float:hover { border-color:rgba(255,255,255,.34); text-decoration:none; }

.hero-minis { display:flex; gap:10px; margin-top:14px; }
.pmini { flex:1; display:flex; flex-direction:column; gap:2px; padding:12px 14px; border-radius:14px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); transition:transform .15s var(--ease),border-color .15s var(--ease); }
.pmini span { font-size:12.5px; color:rgba(255,255,255,.62); }
.pmini strong { font-size:17px; color:#fff; letter-spacing:-.02em; }
.pmini:hover { text-decoration:none; border-color:rgba(255,255,255,.26); transform:translateY(-1px); }

/* Local band: BellCell in Caracas */
.sec--local .local-grid { display:grid; grid-template-columns:.92fr 1.08fr; gap:52px; align-items:center; }
.local-media { margin:0; border-radius:20px; overflow:hidden; line-height:0; box-shadow:0 22px 54px rgba(10,10,11,.16);
  aspect-ratio:4/3; }
.local-media img { width:100%; height:100%; object-fit:cover; display:block; }
.local-copy h2 { margin:.5rem 0 .6rem; }
.local-copy .lead { color:var(--c-ink-soft); max-width:46ch; margin-bottom:var(--s5); }
.local-points { list-style:none; padding:0; margin:0 0 var(--s5); display:grid; gap:11px; }
.local-points li { position:relative; padding-left:28px; color:var(--c-ink-soft); font-size:15px; line-height:1.4; }
.local-points li::before { content:"✓"; position:absolute; left:0; top:0; color:var(--ok); font-weight:800; }

@media (max-width:900px){
  .sec--local .local-grid { grid-template-columns:1fr; gap:26px; }
  .pcard--float { width:min(72%,242px); }
  .hero-minis { flex-wrap:wrap; }
  .pmini { min-width:calc(50% - 5px); }
}

/* v0.9.1 — mobile: stack CTA rows so the hero doesn't overflow horizontally */
@media (max-width:560px){
  .cta-row { flex-direction:column; align-items:stretch; gap:10px; }
  .cta-row > * { width:100%; }
}

/* v0.9.2 — compact hero float card (beat .hero-visual .pcard width:100%);
   sticky bar renders outside .ip so it misses the border-box reset */
.hero-visual .pcard--float { width:min(64%,262px); }
.wa-sticky, .wa-sticky * { box-sizing:border-box; }

/* v0.9.3 — align header/footer inner content with body: center + side gutter.
   (Both set max-width:var(--wide) but were missing margin:auto + padding,
   so they were left-pinned on desktop and edge-touching on mobile.) */
.ipv-header .wrap, .ipv-footer .wrap {
  box-sizing:border-box;               /* they live outside .ip, so no border-box reset */
  margin-left:auto; margin-right:auto;
  padding-left:var(--s5); padding-right:var(--s5);
}

/* ============================================================
   v1.0 — Home design pass: editorial hero, stats, card polish
   ============================================================ */
/* Hero photo: black-on-black shot, cropped cinematic */
.hero-photo img { aspect-ratio:7/5; object-fit:cover; object-position:center 42%; }
.hero-photo { border-color:rgba(255,255,255,.09); }
.hero-photo::after { content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(8,9,12,.55)); }
.hero-photo .pcard--float { z-index:2; }

/* Reassurance microcopy under the money button */
.hero-reassure { margin:12px 0 0; font-size:13.5px; color:rgba(255,255,255,.55); }

/* Stats strip: quick trust markers */
.hero-stats { list-style:none; display:flex; gap:36px; padding:22px 0 0; margin:26px 0 0;
  border-top:1px solid rgba(255,255,255,.10); }
.hero-stats li { display:flex; flex-direction:column; gap:2px; }
.hero-stats strong { color:#fff; font-size:19px; font-weight:800; letter-spacing:-.02em; }
.hero-stats span { color:rgba(255,255,255,.55); font-size:12.5px; }

/* Model cards: lift + accent on hover, tighter type */
.model-grid a { transition:transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease); }
.model-grid a:hover { text-decoration:none; transform:translateY(-3px);
  border-color:var(--c-accent); box-shadow:0 14px 34px rgba(10,10,11,.10); }
.model-grid .m-name { font-size:14px; color:var(--c-ink-mute); font-weight:600; }
.model-grid .m-price { font-size:17px; color:var(--c-ink); font-weight:800; letter-spacing:-.02em; }

/* Explora cards: same interaction language */
.ecard { transition:transform .18s var(--ease), border-color .18s var(--ease), box-shadow .18s var(--ease); }
.ecard:hover { text-decoration:none; transform:translateY(-2px);
  border-color:var(--c-accent); box-shadow:0 12px 30px rgba(10,10,11,.08); }

/* Section head with eyebrow stacked over the h2 */
.sec-head > div .eyebrow { margin:0 0 4px; }
.sec-head > div h2 { margin:0; }
.sec .eyebrow { margin-bottom:6px; }
.sec .eyebrow + h2 { margin-top:0; }

@media (max-width:560px){
  .hero-stats { gap:18px; flex-wrap:wrap; }
  .hero-stats strong { font-size:17px; }
}

/* ============================================================
   v1.1 — CRO buttons, block rhythm, per-model SVGs, big footer
   ============================================================ */
/* Money button: deeper green (real contrast with white text), clear weight */
.wa-cta { background:linear-gradient(180deg,#22B95C,#149A4A); font-weight:800;
  box-shadow:0 10px 26px rgba(20,154,74,.35); }
.wa-cta:hover { filter:brightness(1.06); transform:translateY(-1px); }
/* Secondary: readable white ghost, not washed periwinkle */
.btn-ghost { color:#fff; border-color:rgba(255,255,255,.45); font-weight:700; }
.btn-ghost:hover { background:rgba(255,255,255,.08); border-color:#fff; }
.pcard-cap, .hero-copy .hero-link { color:#AFC5FF; }

/* Uniform vertical rhythm: half-padding per section = consistent 88px
   between blocks (the old 64px top+bottom stacked to 128, and sec--local
   was collecting an extra margin on top). */
.sec { padding:44px 0; }
.sec--trust { margin-bottom:0; padding:52px 0; }
.ipv-footer { margin-top:0; }

/* Per-model SVG thumbs */
.m-thumb svg { height:118px; width:auto; display:block;
  filter:drop-shadow(0 10px 18px rgba(10,10,11,.18)); }
.m-thumb--svg img { display:none; }

/* Footer: ecommerce grid */
.ipv-footer .fgrid { display:grid; grid-template-columns:1.35fr .9fr 1fr 1fr 1.25fr;
  gap:36px; padding:14px 0 30px; }
.ipv-footer .fcol h4 { margin:0 0 12px; font-size:11.5px; font-weight:800;
  letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.42); }
.ipv-footer .fcol ul { list-style:none; margin:0; padding:0; }
.ipv-footer .fcol li { margin:0 0 9px; }
.ipv-footer .fcol a { color:rgba(255,255,255,.78); font-size:14px; }
.ipv-footer .fcol a:hover { color:#fff; text-decoration:none; }
.fbrand-copy { margin:14px 0 16px; font-size:14px; color:rgba(255,255,255,.62); max-width:30ch; }
.fcol--brand .wa-cta { min-height:44px; font-size:14px; padding:0 20px; }
.fstore { font-style:normal; font-size:14px; line-height:1.75; color:rgba(255,255,255,.72); margin:0 0 12px; }
.fstore strong { color:#fff; }
.fstore-links { list-style:none; margin:0; padding:0; }
.fstore-links li { margin:0 0 8px; }
.fstore-links a { color:#9DB9FF; font-size:14px; }
.flegal { border-top:1px solid rgba(255,255,255,.10); padding-top:20px; }
.flegal .ipv-disclaimer { font-size:12.5px; color:rgba(255,255,255,.45); max-width:72ch; }
.flegal .ipv-legal { font-size:12.5px; color:rgba(255,255,255,.45); }
.flegal a { color:rgba(255,255,255,.66); }
@media (max-width:960px){ .ipv-footer .fgrid { grid-template-columns:1fr 1fr; }
  .fcol--brand { grid-column:1 / -1; } }
@media (max-width:520px){ .ipv-footer .fgrid { grid-template-columns:1fr; gap:26px; } }

/* ============================================================
   v1.2 — Apple feel: system type, flat color, quiet chrome
   ============================================================ */
/* Type: SF-style weights and tracking. 600/700, never 800. */
.ip h1, .ip h2, .ip h3, .sec-head h2 { font-weight:700; letter-spacing:-.021em; }
.hero-copy h1 { font-weight:700; letter-spacing:-.028em; }
.hero-copy h1 em { color:#2997FF; }
.pcard-price, .m-price, .price-hero, .pmini strong { font-weight:700; }
.hero-stats strong { font-weight:600; }
.ipv-logo-txt { font-weight:700; }

/* Eyebrows: quiet semibold caps, never monospace */
.ip .eyebrow, .surface-ink .eyebrow { font-family:var(--font-sans); font-size:12px;
  font-weight:600; letter-spacing:.08em; color:var(--c-ink-mute); }
.surface-ink .eyebrow { color:rgba(255,255,255,.56); }
.trust-cell .trust-n { font-family:var(--font-sans); font-weight:600; letter-spacing:.08em; }
.ipv-header .mono, .updated-badge { font-family:var(--font-sans); }

/* Buttons: flat Apple pills. No gradients, no glow. */
.btn-primary { background:var(--c-accent); box-shadow:none; }
.btn-primary:hover { background:#0077ED; box-shadow:none; filter:none; }
.wa-cta { background:var(--wa); box-shadow:none; font-weight:600; }
.wa-cta:hover { background:#23B465; filter:none; transform:none; }
.btn-ghost { font-weight:600; }
.btn, .wa-cta { transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.btn:hover { transform:none; }

/* Cards: Apple gray fill, no outlines, whisper shadow on hover */
.model-grid a, .ecard { background:var(--c-surface); border:1px solid transparent; border-radius:18px; }
.model-grid a:hover, .ecard:hover { border-color:transparent;
  box-shadow:0 10px 30px rgba(0,0,0,.09); transform:translateY(-2px); }
.m-name { color:var(--c-ink-soft); }
.ecard-d { color:var(--c-ink-mute); }

/* Dark hero chrome: quieter borders, no colored noise */
.hero-photo { border-color:rgba(255,255,255,.06); box-shadow:0 30px 80px rgba(0,0,0,.6); }
.pmini { background:rgba(255,255,255,.045); border-color:rgba(255,255,255,.09); }
.pcard--float { background:rgba(20,20,22,.62); border-color:rgba(255,255,255,.14); }
.pcard-cap { color:#2997FF; }
.hero-reassure { color:rgba(255,255,255,.5); }

/* Trust band: flat Apple gray */
.sec--trust { background:var(--c-surface); }
.trust-cell h3 { font-weight:600; letter-spacing:-.01em; }

/* v1.4 — "¿Cuánto cuesta?" answer block (AIO/featured-snippet target) */
.precio-lista { list-style:none; margin:var(--s4) 0; padding:0;
  border:1px solid var(--c-line); border-radius:14px; overflow:hidden; }
.precio-lista li { display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:13px 18px; font-size:15px; }
.precio-lista li + li { border-top:1px solid var(--c-line); }
.precio-lista li:nth-child(odd) { background:var(--c-surface); }
.precio-lista span { color:var(--c-ink-soft); }
.precio-lista strong { color:var(--c-ink); font-weight:700; font-variant-numeric:tabular-nums; }
.precio-nota { font-size:14px; color:var(--c-ink-mute); }

/* v1.5 — freshness badge degrades honestly when prices are not recent */
.ipv-live--stale .dot { background:var(--c-ink-mute); }
.ipv-live--stale .dot::after { display:none; animation:none; }
.ipv-live--stale { color:var(--c-ink-mute); }

/* v1.7 — iPhone 18: countdown + colores (cluster B, ventana de lanzamiento) */
.i18-countdown { background:var(--c-surface); border:1px solid var(--c-line); border-radius:16px;
  padding:20px 22px; margin:0 0 var(--s5); }
.i18-countdown .i18-eyebrow { display:block; font-size:11.5px; font-weight:600; letter-spacing:.09em;
  text-transform:uppercase; color:var(--c-ink-mute); margin-bottom:6px; }
.i18-countdown strong { display:block; font-size:22px; font-weight:700; letter-spacing:-.02em;
  color:var(--c-ink); line-height:1.15; }
.i18-countdown p { margin:8px 0 0; font-size:14.5px; color:var(--c-ink-soft); }

.i18-colores { list-style:none; padding:0; margin:var(--s4) 0; display:grid; gap:12px; }
.i18-colores li { display:flex; align-items:flex-start; gap:14px; }
.i18-colores .sw { flex:none; width:30px; height:30px; border-radius:50%; margin-top:2px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.12), 0 2px 6px rgba(0,0,0,.14); }
.i18-colores strong { display:block; font-size:15px; color:var(--c-ink); }
.i18-colores span { font-size:14px; color:var(--c-ink-soft); }
.i18-nota { font-size:13.5px; color:var(--c-ink-mute); }

/* v1.7.4 — enlaces cruzados de la generación iPhone 18 */
.i18-otros { list-style:none; padding:0; margin:var(--s4) 0; display:grid; gap:12px; }
.i18-otros li { padding:14px 16px; background:var(--c-surface); border-radius:14px; }
.i18-otros a { font-size:15.5px; }
.i18-otros span { display:block; margin-top:3px; font-size:14px; color:var(--c-ink-soft); }

/* v1.8 — página local de Caracas: ficha de tienda + mapa + zonas */
.local-card { display:grid; grid-template-columns:1.05fr .95fr; gap:0; margin:var(--s5) 0;
  border:1px solid var(--c-line); border-radius:18px; overflow:hidden; background:var(--c-surface); }
.local-card-body { padding:24px 26px; }
.local-card-body h3 { margin:0 0 10px; font-size:20px; }
.local-card address { font-style:normal; font-size:15px; line-height:1.65; color:var(--c-ink-soft);
  margin:0 0 var(--s4); }
.local-facts { list-style:none; padding:0; margin:0 0 var(--s5); display:grid; gap:9px; }
.local-facts li { font-size:14.5px; color:var(--c-ink-soft); line-height:1.5; }
.local-facts strong { color:var(--c-ink); }
.local-actions { display:flex; flex-wrap:wrap; gap:10px; }
.local-map { min-height:100%; line-height:0; }
.local-map iframe { width:100%; height:100%; min-height:340px; display:block; }

.zonas { list-style:none; padding:0; margin:var(--s4) 0; display:flex; flex-wrap:wrap; gap:8px; }
.zonas li { font-size:14px; color:var(--c-ink-soft); background:var(--c-surface);
  border:1px solid var(--c-line); border-radius:999px; padding:7px 14px; }

@media (max-width:820px){
  .local-card { grid-template-columns:1fr; }
  .local-map iframe { min-height:260px; }
}

/* v1.8.2 — criterios de verificación (lista numerada con descripción) */
.criterios { list-style:none; counter-reset:c; padding:0; margin:var(--s4) 0; display:grid; gap:14px; }
.criterios li { counter-increment:c; position:relative; padding:16px 18px 16px 54px;
  background:var(--c-surface); border-radius:14px; }
.criterios li::before { content:counter(c); position:absolute; left:18px; top:16px;
  width:24px; height:24px; border-radius:50%; background:var(--c-ink); color:#fff;
  display:grid; place-items:center; font-size:13px; font-weight:700; }
.criterios strong { display:block; font-size:15.5px; color:var(--c-ink); margin-bottom:3px; }
.criterios span { font-size:14.5px; color:var(--c-ink-soft); line-height:1.55; }

/* v1.9 — comparación por precio real contra modelos vecinos */
.compara-list { list-style:none; padding:0; margin:var(--s4) 0; display:grid; gap:12px; }
.compara-list li { display:flex; gap:14px; align-items:flex-start; padding:15px 17px;
  background:var(--c-surface); border-radius:14px; font-size:14.5px; color:var(--c-ink-soft); line-height:1.55; }
.cmp-tag { flex:none; font-size:12px; font-weight:700; padding:4px 10px; border-radius:999px;
  white-space:nowrap; font-variant-numeric:tabular-nums; }
.cmp-tag--down { background:rgba(31,164,92,.12); color:#158048; }
.cmp-tag--up { background:rgba(0,113,227,.12); color:var(--c-link); }
@media (max-width:560px){ .compara-list li { flex-direction:column; gap:8px; } }

/* v2.0 — resumen de mercado en el hub de precios */
.mercado-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:var(--s4) 0; }
.mercado-cell { background:var(--c-surface); border-radius:14px; padding:16px 18px; display:grid; gap:3px; }
.mc-label { font-size:11.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--c-ink-mute); }
.mercado-cell strong { font-size:15px; color:var(--c-ink); }
.mc-num { font-size:21px; font-weight:700; letter-spacing:-.02em; color:var(--c-ink); font-variant-numeric:tabular-nums; }
.movimientos { list-style:none; padding:0; margin:var(--s4) 0; display:grid; gap:9px; }
.movimientos li { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:14.5px;
  color:var(--c-ink-soft); padding:11px 14px; background:var(--c-surface); border-radius:12px; }
@media (max-width:700px){ .mercado-grid { grid-template-columns:1fr; } }

/* ============================================================
   v2.1 — UX/imagery pass: taller hero, tinted tiles, centered
   editorial columns, Caracas photo band
   ============================================================ */
/* Hero: taller, more cinematic crop; card tucked lower-left */
.hero-photo img { aspect-ratio:5/4; object-position:center 44%; }
.pcard--float { width:min(60%,250px); }

/* Catalog tiles: product color wash (bg set inline per model) */
.model-grid a { border:1px solid rgba(0,0,0,.04); }
.m-thumb svg { height:132px; }
.model-grid a:hover { box-shadow:0 14px 34px rgba(0,0,0,.12); }

/* Editorial columns: center the measure block (was hugging left with a
   dead right half on the hub and product detail) */
.ip .measure { margin-left:auto; margin-right:auto; }

/* Local band: real Caracas photo, slightly taller */
.local-media { aspect-ratio:4/3.2; }

/* Caracas page: photo break */
.foto-break { margin:var(--s6) 0; }
.foto-break img { width:100%; height:auto; border-radius:18px; display:block; }
.foto-break figcaption { margin-top:10px; font-size:13.5px; color:var(--c-ink-mute); }

/* v2.2 — fotos reales en la ficha de producto (imagen destacada) */
.pdp-media--photo { background:var(--c-surface); border-radius:20px; overflow:hidden; }
.pdp-media--photo .pdp-photo { width:100%; height:100%; min-height:380px; object-fit:cover; display:block; }

/* v2.3 — destacados con foto real (home) */
.destacados { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.dcard { display:grid; grid-template-rows:auto 1fr; background:var(--c-surface);
  border-radius:20px; overflow:hidden; transition:transform .18s var(--ease), box-shadow .18s var(--ease); }
.dcard:hover { text-decoration:none; transform:translateY(-3px); box-shadow:0 18px 44px rgba(0,0,0,.12); }
.dcard-media { display:block; aspect-ratio:16/10; overflow:hidden; }
.dcard-media img { width:100%; height:100%; object-fit:cover; display:block; }
.dcard-body { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; padding:18px 22px 20px; }
.dcard-cond { flex-basis:100%; font-size:12px; font-weight:600; letter-spacing:.07em;
  text-transform:uppercase; color:var(--c-ink-mute); }
.dcard-name { font-size:20px; font-weight:700; letter-spacing:-.02em; color:var(--c-ink); }
.dcard-price { font-size:17px; font-weight:700; color:var(--c-ink); font-variant-numeric:tabular-nums; }
.dcard-cta { margin-left:auto; font-size:14px; font-weight:600; color:var(--c-link); }
@media (max-width:760px){ .destacados { grid-template-columns:1fr; } }

/* ============================================================
   v2.3.1 — FIX: los botones heredaban el azul de enlace.
   `.ip a` (tipo+clase, 0-1-1) le ganaba a `.wa-cta`/`.btn` (solo
   clase, 0-1-0), así que todo botón que fuera un <a> dentro de
   .ip pintaba el texto azul en vez de blanco. Se corrige con
   selectores de mayor especificidad, no con !important.
   ============================================================ */
.ip a.wa-cta, .surface-ink a.wa-cta { color:#fff; }
.ip a.btn-primary, .surface-ink a.btn-primary { color:#fff; }
.ip a.btn-ghost, .surface-ink a.btn-ghost { color:#fff; }
.ip a.btn-ghost:hover, .surface-ink a.btn-ghost:hover { color:#fff; }
/* botones dentro del header/footer (fuera de .ip) ya heredan bien */

/* Pill "NUEVO" del hero: era mono + periwinkle de la v0.x; alineado
   al sistema actual (sans 600, azul Apple dark-mode legible). */
.pill { font-family:var(--font-sans); font-weight:600; letter-spacing:.07em; }
.pill--new { color:#7DB8FF; background:rgba(10,132,255,.22); }

/* v2.4 — PDP: render por modelo (imagen destacada solo para fotos reales) */
.pdp-render { display:grid; place-items:center; width:100%; min-height:380px; border-radius:20px; padding:36px; }
.pdp-render svg { height:300px; width:auto; filter:drop-shadow(0 16px 28px rgba(10,10,11,.22)); }

/* v2.5 — hub §5.2: sello sticky + índice */
.hub-sticky-badge { position:sticky; top:72px; z-index:40; display:flex; justify-content:flex-end;
  max-width:var(--wide); margin:0 auto; padding:0 var(--s5); pointer-events:none; height:0; }
.hub-sticky-badge .updated-badge { pointer-events:auto; box-shadow:0 6px 20px rgba(10,10,11,.12); }
@media (max-width:820px){ .hub-sticky-badge { display:none; } }
.master-table thead th[role="button"]:hover { text-decoration:underline; }

/* ============================================================
   v2.8 — AIRE. El texto respiraba poco: más espacio vertical en
   la pila del hero, las tarjetas de precio y el catálogo.
   ============================================================ */
/* Hero: la pila copy respira entre cada bloque */
.hero-copy .lead { margin-bottom: 26px; }
.hero-copy .cta-row { margin-top: 4px; }
.hero-reassure { margin-top: 16px; font-size: 14px; color: rgba(255,255,255,.6); }
.hero-stats { margin-top: 34px; padding-top: 26px; gap: 48px;
  border-top-color: rgba(255,255,255,.08); }
.hero-stats li { gap: 5px; }
.hero-stats strong { font-size: 22px; }
.hero-stats span { font-size: 13px; }

/* Tarjeta flotante del hero: aire entre pill, nombre y precio */
.pcard--float { padding: 18px 20px; }
.pcard--float .pcard-top { margin-bottom: 14px; }
.pcard--float .pcard-name { margin-bottom: 5px; font-size: 13.5px; letter-spacing: .01em; }
.pcard--float .pcard-price { margin: 0 0 12px; font-size: 33px; }

/* Minis bajo el hero */
.pmini { padding: 15px 17px; gap: 5px; }
.pmini span { font-size: 13px; }
.pmini strong { font-size: 18px; }

/* Catálogo: tarjetas con más padding y jerarquía nombre/precio separada */
.model-grid a { padding: 26px 16px 22px; border-radius: 20px; }
.m-thumb { margin-bottom: 16px; }
.model-grid .m-name { margin-bottom: 7px; font-size: 13.5px; }
.model-grid .m-price { font-size: 18.5px; }

/* Micro-motion: el equipo se levanta al pasar el cursor (sexy, sutil) */
.m-thumb svg { transition: transform .28s var(--ease); }
.model-grid a:hover .m-thumb svg { transform: translateY(-5px) scale(1.04); }

/* Cabeceras de sección con más aire hacia su contenido */
.sec-head { margin-bottom: 26px; }
.sec .eyebrow { margin-bottom: 8px; }