/* ══════════════════════════════════════════════════════════════
   Web pública · estilo del inicio (v6 "Pieza de museo")
   Base compartida por Nosotros, Flota, Software, Calculadora,
   Tienda, Login y Crear cuenta. Medidas en px (html está al 125%).
   ══════════════════════════════════════════════════════════════ */
@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600&family=Anton&display=swap");
:root { --f-head:"Inter Tight",sans-serif; --f-mark:"Anton",sans-serif; --deep:#060E10; --paper:#E8EDEB; --ink:#0B2629; --ink-muted:#4E6563; }
body { font-family:var(--font-body); background:var(--bg-base); }
.v6 .hidden { display:none !important; }
.v6 a:focus-visible, .v6 button:focus-visible, .v6 input:focus-visible, .v6 summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }

/* ── Primitivas (mismas que index.php) ── */
.v6-wrap { max-width:1440px; margin:0 auto; padding:0 30px; }
@media(max-width:600px){ .v6-wrap { padding:0 20px; } }
.v6-sec { padding:96px 0; }
@media(max-width:768px){ .v6-sec { padding:56px 0; } }
.v6-h1, .v6-h2, .v6-h3 { font-family:var(--f-head); font-weight:500; color:var(--text); text-wrap:balance; }
.v6-h1 { font-size:clamp(38px,4.4vw,66px); line-height:.98; letter-spacing:-.045em; }
.v6-h2 { font-size:clamp(30px,3.6vw,52px); line-height:1.02; letter-spacing:-.04em; }
.v6-h3 { font-size:22px; line-height:1.18; letter-spacing:-.02em; }
.v6-p { font-size:18px; line-height:1.6; color:var(--text-muted); }
.v6-note { font-size:15px; color:var(--text-dark); }
.v6-tag { font-family:var(--font-mono); font-size:13px; font-weight:500; color:var(--text-dark); }
.v6-btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:0 26px; border-radius:999px; background:var(--accent); color:#0A1214; font-weight:700; font-size:17px; text-decoration:none; white-space:nowrap; border:0; cursor:pointer; font-family:inherit; transition:background-color .15s; }
.v6-btn:hover { background:var(--accent-hover); }
.v6-btn-line { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:0 24px; border-radius:999px; border:1px solid var(--border-light); background:none; color:var(--text); font-weight:600; font-size:16px; text-decoration:none; cursor:pointer; font-family:inherit; }
.v6-btn-line:hover { border-color:var(--text-muted); }
.v6-link { font-size:16px; font-weight:600; color:var(--text); text-decoration:underline; text-decoration-color:rgb(var(--text-rgb) / .3); text-underline-offset:5px; }
.v6-link:hover { text-decoration-color:var(--accent); }
.v6-ctas { display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; }
@media(max-width:600px){ .v6-ctas .v6-btn, .v6-ctas .v6-btn-line { flex:1 1 100%; } }
.v6-head { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px 64px; align-items:end; margin-bottom:44px; }
.v6-head .v6-p { max-width:500px; }
@media(max-width:900px){ .v6-head { grid-template-columns:1fr; margin-bottom:28px; } }
.v6-well { background:var(--deep); }
.v6-chip { display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 18px; border-radius:999px; border:1px solid var(--border-light); background:none; color:var(--text); font:inherit; font-size:16px; font-weight:600; cursor:pointer; white-space:nowrap; text-decoration:none; transition:background-color .15s, border-color .15s, color .15s; }
.v6-chip:hover { border-color:var(--text-muted); }
.v6-chip[aria-pressed="true"], .v6-chip[aria-selected="true"] { background:var(--accent); border-color:var(--accent); color:#0A1214; }
@keyframes v6rot { to { transform:rotate(360deg); } }

/* Menú transparente sobre la cabecera, se oscurece al bajar */
body.v6-top > nav.fixed { background:transparent; border-color:transparent; backdrop-filter:none; }
body > nav.fixed { transition:background-color .25s, border-color .25s; }

/* Títulos que se imprimen al aparecer */
.js-rise .v6-rise { clip-path:inset(100% 0 0 0); }
.js-rise .v6-rise.in { clip-path:inset(0 0 -10% 0); transition:clip-path .9s steps(14, end); }

/* ── Cabecera de página: texto + pieza imprimiéndose ── */
.w-hero { position:relative; padding:150px 0 0; overflow:hidden; }
.w-hero-grid { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:24px 48px; align-items:end; padding-bottom:40px; }
.w-hero .v6-tag { display:block; margin-bottom:18px; color:var(--accent); }
.w-hero .v6-p { max-width:560px; margin:20px 0 30px; }
.w-stage { position:relative; height:320px; margin:0; }
.w-stage canvas { position:absolute; inset:0; width:100%; height:100%; }
.w-stage figcaption { position:absolute; left:0; right:0; bottom:0; text-align:center; }
.w-mark { position:absolute; right:-2vw; bottom:76px; z-index:1; font-family:var(--f-mark); font-size:clamp(110px,17vw,260px); line-height:.8; color:var(--bg-card); white-space:nowrap; pointer-events:none; user-select:none; }
@media(max-width:900px){
  .w-hero { padding-top:124px; }
  .w-hero-grid { grid-template-columns:1fr; padding-bottom:28px; }
  .w-stage { height:200px; order:-1; margin:-28px -20px 0; }
  .w-hero .v6-p { font-size:17px; margin:16px 0 24px; }
  .w-mark { display:none; }
}
.v6-meta { position:relative; z-index:2; border-top:1px dashed var(--border-light); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.v6-meta > div { padding:16px 0 20px; font-size:15px; line-height:1.45; color:var(--text-muted); }
.v6-meta > div + div { padding-left:24px; border-left:1px dashed var(--border-light); }
.v6-meta .v6-tag { display:block; margin-bottom:4px; }
.v6-meta b { color:var(--text); font-weight:600; }
@media(max-width:700px){
  .v6-meta { grid-template-columns:1fr 1fr; }
  .v6-meta > div { padding:12px 0 14px; font-size:14.5px; }
  .v6-meta > div:nth-child(3) { padding-left:0; border-left:0; }
  .v6-meta > div:nth-child(n+3) { border-top:1px dashed var(--border-light); }
  .v6-meta > div + div { padding-left:16px; }
  .v6-meta > div:nth-child(odd) { padding-left:0; border-left:0; }
}

/* ── Filas con separador punteado (índice tipográfico) ── */
.w-rows { list-style:none; margin:0; padding:0; border-top:1px dashed var(--border-light); }
.w-rows > li, .w-rows > a { display:grid; grid-template-columns:72px minmax(0,1fr) minmax(0,1.3fr); gap:6px 32px; align-items:baseline; padding:22px 0; border-bottom:1px dashed var(--border-light); text-decoration:none; color:inherit; }
.w-rows .n { font-family:var(--font-mono); font-size:13px; color:var(--text-dark); }
.w-rows .v6-h3 { font-size:24px; }
.w-rows .v6-p { font-size:16.5px; }
.w-rows > a { transition:background-color .2s; }
.w-rows > a:hover { background:linear-gradient(90deg, rgb(var(--accent-rgb) / .06), transparent 70%); }
.w-rows > a:hover .v6-h3 { color:var(--accent); }
@media(max-width:768px){
  .w-rows > li, .w-rows > a { grid-template-columns:40px minmax(0,1fr); padding:16px 0; }
  .w-rows .v6-p { grid-column:2; font-size:15.5px; }
  .w-rows .v6-h3 { font-size:20px; }
}

/* ── Tarjetas ── */
.w-cards { display:grid; grid-template-columns:repeat(var(--cols,3),minmax(0,1fr)); gap:12px; }
.w-card { position:relative; padding:28px; border-radius:16px; background:var(--bg-card); }
.w-card .v6-h3 { margin-bottom:8px; }
.w-card .v6-p { font-size:16px; }
@media(max-width:960px){ .w-cards { grid-template-columns:1fr; } .w-card { padding:22px 20px; } }

/* Lista con viñeta champagne */
.w-list { list-style:none; margin:0; padding:0; }
.w-list li { position:relative; padding:9px 0 9px 22px; font-size:16px; line-height:1.5; color:var(--text-muted); border-bottom:1px dashed var(--border); }
.w-list li:last-child { border-bottom:0; }
.w-list li::before { content:""; position:absolute; left:2px; top:18px; width:7px; height:7px; border-radius:2px; background:var(--accent); }
.w-list b { color:var(--text); font-weight:600; }

/* Pestañas en chips (scroll horizontal en celular) */
.w-tabs { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:2px 2px 4px; margin:0 -2px 24px; }
.w-tabs::-webkit-scrollbar { display:none; }
@media(max-width:600px){ .w-tabs { margin:0 -20px 20px; padding:2px 20px 4px; } .w-tabs .v6-chip { min-height:40px; padding:0 15px; font-size:15px; } }

/* Acordeón nativo */
.w-acc { border-top:1px dashed var(--border-light); }
.w-acc details { border-bottom:1px dashed var(--border-light); }
.w-acc summary { list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0; cursor:pointer; font-family:var(--f-head); font-weight:500; font-size:20px; letter-spacing:-.02em; color:var(--text); }
.w-acc summary::-webkit-details-marker { display:none; }
.w-acc summary::after { content:"+"; font-family:var(--font-mono); font-size:22px; color:var(--accent); transition:transform .2s; }
.w-acc details[open] summary::after { transform:rotate(45deg); }
.w-acc .body { padding:0 0 20px; }

/* Pasos del flujo */
.w-flow { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(var(--cols,4),minmax(0,1fr)); gap:12px; counter-reset:w; }
.w-flow li { position:relative; padding:24px 24px 26px; border-radius:16px; background:var(--bg-card); counter-increment:w; }
.w-flow li::before { content:counter(w, decimal-leading-zero); display:block; font-family:var(--f-head); font-weight:500; font-size:40px; line-height:1; letter-spacing:-.04em; color:var(--accent); margin-bottom:22px; }
.w-flow b { display:block; font-family:var(--f-head); font-weight:500; font-size:20px; letter-spacing:-.02em; color:var(--text); margin-bottom:6px; }
.w-flow span { font-size:15.5px; line-height:1.5; color:var(--text-muted); }
@media(max-width:1000px){ .w-flow { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:560px){
  .w-flow { grid-template-columns:1fr; gap:0; border-top:1px dashed var(--border-light); }
  .w-flow li { display:grid; grid-template-columns:48px 1fr; padding:16px 0; border-radius:0; background:none; border-bottom:1px dashed var(--border-light); }
  .w-flow li::before { font-size:26px; margin:0; grid-row:1 / 3; }
}

/* Cierre */
.w-final .v6-h2 { font-size:clamp(36px,5.4vw,84px); line-height:.98; letter-spacing:-.05em; max-width:1000px; }
.w-final .v6-ctas { margin-top:32px; }

/* Etiqueta "pronto" */
.w-soon { display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px; background:rgb(var(--petrol-light-rgb) / .14); color:var(--petrol-light); font-size:14px; font-weight:700; }
.w-soon i { width:7px; height:7px; border-radius:50%; background:var(--petrol-light); animation:wping 1.8s infinite; }
@keyframes wping { 0%{ box-shadow:0 0 0 0 rgb(var(--petrol-light-rgb) / .6); } 70%,100%{ box-shadow:0 0 0 9px rgb(var(--petrol-light-rgb) / 0); } }

@media(prefers-reduced-motion: reduce){ .w-soon i { animation:none; } }

/* ── Entrar / Crear cuenta ── */
.w-auth { min-height:100vh; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.w-auth-side { position:relative; overflow:hidden; background:var(--deep); padding:36px 48px 44px; display:flex; flex-direction:column; }
.w-auth-side .w-stage { flex:1; height:auto; min-height:300px; margin:12px 0 18px; }
.w-auth-side .v6-h2 { font-size:clamp(30px,3vw,46px); max-width:520px; }
.w-auth-side .w-list { margin-top:20px; max-width:480px; }
.w-auth-main { display:flex; flex-direction:column; padding:36px 48px; }
.w-auth-box { width:100%; max-width:420px; margin:auto; padding:40px 0; }
.w-auth-box .v6-h1 { font-size:clamp(34px,3.4vw,48px); margin-bottom:10px; }
.w-auth-box > .v6-p { font-size:17px; margin-bottom:28px; }
.w-logo { display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.w-logo img { height:42px; width:auto; display:block; }
.w-auth-top { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.w-auth-top a.back { font-size:15px; color:var(--text-muted); text-decoration:none; }
.w-auth-top a.back:hover { color:var(--text); }
.w-field { display:block; margin-bottom:16px; }
.w-field > span { display:block; font-size:14.5px; font-weight:600; color:var(--text-muted); margin-bottom:8px; }
.w-input { position:relative; }
.w-input input { width:100%; height:54px; padding:0 48px 0 18px; border-radius:12px; border:1px solid var(--border-light); background:var(--bg-card); color:var(--text); font:inherit; font-size:17px; transition:border-color .15s, box-shadow .15s; }
.w-input input::placeholder { color:var(--text-dark); }
.w-input input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgb(var(--accent-rgb) / .18); }
.w-input button { position:absolute; right:6px; top:7px; width:40px; height:40px; border:0; border-radius:8px; background:none; color:var(--text-dark); cursor:pointer; }
.w-input button:hover { color:var(--text); }
.w-alert { display:flex; gap:12px; padding:14px 16px; border-radius:12px; margin-bottom:20px; font-size:15.5px; line-height:1.5; }
.w-alert i { margin-top:3px; }
.w-alert.err { background:rgb(var(--error-rgb) / .1); color:#f2a3a3; }
.w-alert.warn { background:rgb(var(--warning-rgb) / .1); color:var(--text-muted); }
.w-alert.warn b { color:var(--warning); }
.w-auth-alt { margin-top:28px; padding-top:22px; border-top:1px dashed var(--border-light); font-size:15.5px; color:var(--text-muted); line-height:1.6; }
.w-auth-alt a { color:var(--text); font-weight:600; text-underline-offset:4px; }
@media(max-width:900px){
  .w-auth { grid-template-columns:1fr; min-height:0; }
  .w-auth-main { order:-1; padding:20px 20px 8px; }
  .w-auth-box { padding:28px 0 12px; margin:0 auto; }
  .w-auth-side { padding:28px 20px 40px; }
  .w-auth-side .w-stage { min-height:200px; flex:none; height:220px; margin:0 -20px 8px; }
  .w-auth-side .w-auth-top { display:none; }
}

/* ── Cotización de ejemplo que se arma sola (igual que en el inicio) ── */
.v6-quote { border-radius:16px; background:var(--bg-card); padding:28px; }
.v6-quote .hd { display:flex; justify-content:space-between; align-items:baseline; padding-bottom:16px; border-bottom:1px dashed var(--border-light); }
.v6-quote .hd b { font-family:var(--f-head); font-weight:500; font-size:22px; letter-spacing:-.02em; color:var(--text); }
.v6-quote ol { list-style:none; margin:0; padding:0; }
.v6-quote li { display:grid; grid-template-columns:64px minmax(0,1fr) auto; gap:4px 16px; align-items:center; padding:16px 0; border-bottom:1px dashed var(--border-light); opacity:.18; transition:opacity .4s; }
.v6-quote li.on { opacity:1; }
.v6-quote .pl { font-family:var(--font-mono); font-size:13px; color:var(--text-dark); }
.v6-quote .what { font-size:16px; color:var(--text); }
.v6-quote .what small { display:block; font-size:14px; color:var(--text-muted); }
.v6-quote .amt { font-family:var(--font-mono); font-size:16px; color:var(--text); text-align:right; }
.v6-quote .bar { grid-column:1 / -1; height:3px; border-radius:2px; background:rgb(var(--text-rgb) / .08); overflow:hidden; }
.v6-quote .bar i { display:block; height:100%; width:0; background:var(--accent); transition:width 1.1s linear; }
.v6-quote li.on .bar i { width:100%; }
.v6-quote .tot { display:flex; justify-content:space-between; align-items:baseline; padding-top:18px; }
.v6-quote .tot > span { font-size:16px; color:var(--text-muted); }
.v6-quote .tot b { font-family:var(--f-head); font-weight:500; font-size:40px; letter-spacing:-.03em; color:var(--accent); }
.v6-quote .send { display:flex; align-items:center; gap:10px; margin-top:18px; padding:14px 16px; border-radius:12px; background:rgb(var(--petrol-light-rgb) / .12); color:var(--text); font-size:15px; opacity:0; transform:translateY(6px); transition:opacity .4s, transform .4s; }
.v6-quote .send i { color:var(--petrol-light); }
.v6-quote.done .send { opacity:1; transform:none; }
@media(max-width:480px){ .v6-quote { padding:20px; } .v6-quote li { grid-template-columns:56px minmax(0,1fr) auto; gap:4px 10px; } .v6-quote .pl { font-size:12px; white-space:nowrap; } .v6-quote .tot b { font-size:32px; } }
