/* davidgalan.es · hoja común de las páginas de servicio
   (rotulación de vehículos, pliegos DTF, print on demand, ampliación de imágenes) */

@font-face{font-family:'Archivo';src:url('/fonts/archivo-wdth.woff2') format('woff2');font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/fonts/ibm-plex-mono-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/fonts/ibm-plex-mono-500.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --papel:#FBFBF8;--tinta:#121212;--gris:#75756F;--linea:#D9D9D2;
  --cian:#009FD4;--magenta:#E5007D;--amarillo:#FFD500;--wa:#1FAF5A;--maxw:1080px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{background:var(--papel);color:var(--tinta);font-family:'Archivo',system-ui,sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid var(--magenta);outline-offset:3px}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.mono{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gris)}
.cmyk{display:flex;height:7px}
.cmyk span{flex:1}
.cmyk .c{background:var(--cian)}.cmyk .m{background:var(--magenta)}.cmyk .y{background:var(--amarillo)}.cmyk .k{background:var(--tinta)}

/* CABECERA */
header{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--linea);background:rgba(251,251,248,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;max-width:var(--maxw);margin:0 auto;flex-wrap:wrap}
.logo{font-weight:900;font-stretch:125%;font-size:1.2rem;letter-spacing:-.03em;text-decoration:none;display:flex;align-items:center;gap:10px}
.reg{width:17px;height:17px;flex:none}
.head-tag{display:flex;gap:6px 20px;flex-wrap:wrap;order:3;width:100%}
.head-tag a{font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gris);text-decoration:none;white-space:nowrap}
.head-tag a:hover,.head-tag a[aria-current]{color:var(--tinta)}
@media(min-width:700px){.head-tag{order:0;width:auto;flex:1;justify-content:center}}
@media(max-width:520px){.head-tag{gap:4px 14px}.head-tag a{font-size:.62rem;letter-spacing:.04em}.head-in .btn{padding:10px 13px;font-size:.82rem}.head-in .logo{font-size:1rem}}

.btn{display:inline-flex;align-items:center;gap:9px;background:var(--tinta);color:#fff;text-decoration:none;font-weight:900;font-stretch:115%;font-size:.9rem;padding:12px 20px;border:none;cursor:pointer;transition:background .15s}
.btn:hover{background:var(--magenta)}
.btn .dot{width:9px;height:9px;border-radius:50%;background:var(--wa);flex:none}
.btn.big{padding:15px 28px;font-size:1rem}
.btn.inv{background:#fff;color:var(--tinta)}
.btn.inv:hover{background:var(--magenta);color:#fff}

/* HERO */
.hero{padding:60px 0 50px}
.volver{font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gris);text-decoration:none;display:inline-flex;gap:6px;margin-bottom:30px}
.volver:hover{color:var(--magenta)}
.badge{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--linea);padding:6px 14px;margin-bottom:24px;font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gris);background:#fff}
.badge i{width:8px;height:8px;border-radius:50%;background:var(--magenta);display:inline-block;flex:none}
h1{font-weight:900;font-stretch:125%;font-size:clamp(2.2rem,8vw,5rem);line-height:.91;letter-spacing:-.04em;max-width:17ch;text-transform:uppercase;overflow-wrap:break-word;hyphens:auto}
h1 em{font-style:normal;color:var(--magenta)}
.lead{margin:28px 0 32px;font-size:clamp(1.04rem,2.2vw,1.18rem);max-width:56ch;color:#3a3a36}
.ctas{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.ctas-alt{font-size:.92rem;color:var(--gris)}
.ctas-alt a{color:var(--tinta);font-weight:700}

/* FICHA TÉCNICA */
.ficha{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea);margin-top:40px}
@media(min-width:620px){.ficha{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.ficha{grid-template-columns:repeat(4,1fr)}}
.ficha div{background:#fff;padding:18px 20px}
.ficha dt{font-family:'IBM Plex Mono',monospace;font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gris);margin-bottom:5px}
.ficha dd{font-size:.92rem;font-weight:700;font-stretch:112%;line-height:1.45}

/* SECCIONES */
section{border-top:1px solid var(--linea)}
.sec{padding:60px 0}
.sec.blanco{background:#fff}
.sec.oscuro{background:var(--tinta);color:#fff}
.sec.oscuro h2,.sec.oscuro h3{color:#fff}
.sec.oscuro p,.sec.oscuro li{color:#b8b6b0}
h2{font-weight:900;font-stretch:125%;font-size:clamp(1.9rem,5vw,3rem);letter-spacing:-.035em;line-height:.94;text-transform:uppercase;max-width:20ch}
.sub{font-size:1rem;color:#3a3a36;max-width:58ch;margin-top:16px;line-height:1.66}
.rotulo{font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--magenta);display:block;margin-bottom:14px}

/* REJILLA DE TARJETAS */
.rejilla{display:grid;gap:16px;margin-top:34px}
@media(min-width:640px){.rejilla.c2{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.rejilla.c3{grid-template-columns:repeat(3,1fr)}.rejilla.c4{grid-template-columns:repeat(4,1fr)}}
.tarjeta{border:1px solid var(--linea);background:#fff;padding:26px 22px}
.sec.blanco .tarjeta{background:var(--papel)}
.tarjeta .n{font-weight:900;font-stretch:125%;font-size:2.6rem;color:var(--magenta);line-height:1;letter-spacing:-.04em;display:block;margin-bottom:10px}
.tarjeta h3{font-weight:900;font-stretch:120%;font-size:1rem;letter-spacing:-.02em;text-transform:uppercase;margin-bottom:8px}
.tarjeta p{font-size:.93rem;color:#3a3a36}

/* LISTA DE ENTREGABLES */
.entregables{display:grid;gap:12px;margin-top:30px;list-style:none}
@media(min-width:760px){.entregables{grid-template-columns:1fr 1fr}}
.entregables li{display:flex;gap:14px;align-items:flex-start;padding:18px 20px;border:1px solid var(--linea);background:#fff;font-size:.94rem;color:#3a3a36;line-height:1.55}
.entregables li::before{content:"✓";font-family:'IBM Plex Mono',monospace;font-size:.82rem;color:var(--magenta);font-weight:700;flex:none;margin-top:3px}
.entregables b{color:var(--tinta);font-weight:700;font-stretch:112%}

/* COMPARATIVA PROBLEMA / SOLUCIÓN */
.prob-sol{display:grid;gap:2px;margin-top:34px}
@media(min-width:760px){.prob-sol{grid-template-columns:1fr 1fr}}
.prob,.sol{padding:30px 28px}
.prob{background:var(--tinta);color:#fff}
.sol{background:var(--magenta);color:#fff}
.prob h3,.sol h3{font-weight:900;font-stretch:125%;font-size:clamp(1.3rem,3vw,1.8rem);letter-spacing:-.03em;text-transform:uppercase;line-height:.97;margin-bottom:16px;color:#fff}
.prob span.et,.sol span.et{font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;opacity:.6;margin-bottom:12px;display:block}
.prob ul,.sol ul{list-style:none;display:grid;gap:10px}
.prob li,.sol li{font-size:.95rem;padding-left:20px;position:relative;opacity:.88}
.prob li::before{content:"✗";position:absolute;left:0;font-family:'IBM Plex Mono',monospace;font-size:.78rem;color:#ff6b6b}
.sol li::before{content:"✓";position:absolute;left:0;font-family:'IBM Plex Mono',monospace;font-size:.78rem;color:#fff;font-weight:700}

/* PASOS */
.pasos{display:grid;gap:16px;margin-top:34px}
@media(min-width:640px){.pasos{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.pasos.p4{grid-template-columns:repeat(4,1fr)}.pasos.p3{grid-template-columns:repeat(3,1fr)}}
.paso{border:1px solid var(--linea);padding:24px 22px;background:#fff}
.sec.blanco .paso{background:var(--papel)}
.paso .n{font-weight:900;font-stretch:125%;font-size:2.8rem;color:var(--magenta);display:block;margin-bottom:8px;line-height:1;letter-spacing:-.04em}
.paso h3{font-weight:900;font-stretch:120%;font-size:.95rem;letter-spacing:-.02em;text-transform:uppercase;margin-bottom:8px}
.paso p{font-size:.9rem;color:#3a3a36}

/* PRECIO */
.precio{border:2px solid var(--tinta);display:grid;margin-top:34px}
@media(min-width:760px){.precio{grid-template-columns:1fr 1fr}}
.precio-izq{padding:34px 30px;border-bottom:1px solid var(--linea)}
@media(min-width:760px){.precio-izq{border-right:1px solid var(--linea);border-bottom:none}}
.precio-der{padding:34px 30px;background:#fff}
.cifra{font-weight:900;font-stretch:125%;font-size:3.8rem;letter-spacing:-.05em;line-height:1}
.cifra sup{font-size:1.5rem;vertical-align:.5em}
.desde{font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gris);display:block;margin-bottom:8px}
.precio-nota{font-size:.9rem;color:#3a3a36;margin-top:14px;max-width:38ch}
.precio-der ul{list-style:none;display:grid;gap:9px;margin-bottom:22px}
.precio-der li{font-size:.94rem;color:#3a3a36;padding-left:18px;position:relative}
.precio-der li::before{content:"·";position:absolute;left:0;color:var(--magenta);font-weight:700;font-size:1.1rem}

/* FAQ */
.faq{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea);margin-top:34px}
details{background:var(--papel)}
.sec.blanco details{background:#fff}
details summary{padding:19px 22px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;font-weight:700;font-stretch:115%;font-size:1rem;letter-spacing:-.01em;list-style:none;user-select:none}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";font-family:'IBM Plex Mono',monospace;font-size:1.2rem;color:var(--magenta);flex:none}
details[open] summary::after{content:"−"}
details[open] summary{border-bottom:1px solid var(--linea)}
.faq-r{padding:17px 22px 22px;color:#3a3a36;font-size:.96rem;max-width:68ch;line-height:1.66}
.faq-r p + p{margin-top:12px}

/* NOTA AL PIE DE SECCIÓN */
.nota{font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.04em;color:var(--gris);margin-top:24px;line-height:1.75;padding-top:16px;border-top:1px dashed var(--linea);max-width:72ch}

/* CTA FINAL */
.final{background:var(--tinta);color:#fff;text-align:center;padding:76px 24px}
.final h2{color:#fff;max-width:22ch;margin:0 auto 16px}
.final p{color:#b8b8b2;max-width:48ch;margin:0 auto 30px;font-size:1rem}
.final .cruce{font-size:.9rem;color:#b8b8b2;margin:26px auto 0}
.final .cruce a{color:#fff;text-underline-offset:3px}

/* FIGURAS */
.figura{margin:34px 0 0;border:1px solid var(--linea);background:#fff}
.figura figcaption{padding:14px 18px;border-top:1px solid var(--linea);font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.04em;color:var(--gris);line-height:1.65}
.figura figcaption b{color:var(--tinta);font-weight:500}

/* COMPARADOR DESLIZANTE */
.cmp{position:relative;width:100%;max-width:620px;margin:34px auto 0;border:1px solid var(--linea);background:#fff;aspect-ratio:900/1140;overflow:hidden;touch-action:none;user-select:none}
.cmp.cuadrado{aspect-ratio:1/1;max-width:560px}
.cmp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.cmp .cmp-top{clip-path:inset(0 50% 0 0)}
.cmp-linea{position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--magenta);transform:translateX(-1px);pointer-events:none}
.cmp-tirador{position:absolute;top:50%;left:50%;width:44px;height:44px;border-radius:50%;background:var(--magenta);transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 12px rgba(0,0,0,.35);pointer-events:none}
.cmp-tirador::before{content:"⟷";color:#fff;font-size:1.1rem;font-weight:700;line-height:1}
.cmp-etiq{position:absolute;top:14px;font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.09em;text-transform:uppercase;padding:6px 12px;color:#fff;background:rgba(18,18,18,.82);pointer-events:none}
.cmp-etiq.izq{left:14px}
.cmp-etiq.der{right:14px;background:var(--magenta)}
.cmp-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.cmp-pie{font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.04em;color:var(--gris);text-align:center;margin-top:14px;line-height:1.6}

/* PIE */
footer{padding:32px 0 44px;border-top:1px solid var(--linea)}
.foot-in{display:flex;flex-wrap:wrap;gap:14px 30px;justify-content:space-between;align-items:center}
footer a{text-decoration:none}
footer a:hover{color:var(--magenta)}

/* nav unificado: Precios solo en escritorio, Urgencia solo en movil */
.m-only{display:none}
@media(max-width:520px){
  .d-only{display:none}
  .m-only{display:inline}
}