/* =====================================================================
   apple.css — Estilo inspirado en la tienda de Apple
   Se carga la ÚLTIMA en cada página (después de tema.css y de los
   estilos propios), así que manda sobre todo lo anterior.
   No usa JavaScript: menús, galerías, carruseles y preguntas siguen
   funcionando solo con HTML y CSS.
   Para cambiar el color de los botones basta con tocar --ap-azul.
   ===================================================================== */

:root{
  --ap-tinta:#1d1d1f;      /* texto principal */
  --ap-gris:#6e6e73;       /* texto secundario */
  --ap-gris2:#86868b;      /* segunda parte de los titulares */
  --ap-fondo:#f5f5f7;      /* fondo gris claro de secciones */
  --ap-linea:#d2d2d7;      /* líneas y bordes */
  --ap-azul:#0071e3;       /* botones */
  --ap-azul-dk:#0077ed;
  --ap-enlace:#0066cc;     /* enlaces de texto */
  --ap-naranja:#b64400;    /* etiquetas tipo «Nuevo» (naranja de marca oscurecido para que se lea) */
  --ap-r:18px;--ap-r-sm:12px;
  --ap-sh:2px 4px 12px rgba(0,0,0,.08);
  --ap-sh-h:2px 4px 16px rgba(0,0,0,.16);
  --ap-max:1200px;
  /* tipografía de sistema de Apple; Inter como alternativa en Windows y Android */
  --font:-apple-system,BlinkMacSystemFont,'SF Pro Text','SF Pro Display','Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --brand:var(--ap-azul);--brand-dk:var(--ap-azul);--brand-bg:#e8f2fd;
  --morado:var(--ap-tinta);--morado-bg:var(--ap-fondo);
  --grad:var(--ap-azul);
  --ink:var(--ap-tinta);--ink-2:var(--ap-gris);--ink-3:var(--ap-gris2);--dark:var(--ap-tinta);
  --sh:var(--ap-sh);--sh-hover:var(--ap-sh-h)
}

/* ---------- Base ---------- */
.mo-header{display:flex!important;flex-direction:column}
.mo-bar{order:1}
html body{background:#fff;color:var(--ap-tinta);font-size:17px;line-height:1.47;letter-spacing:-.022em;-webkit-font-smoothing:antialiased}
body p,body li{letter-spacing:-.022em}
h1,h2,h3,h4,.sec-title,.prod-title,.home-hero h1{font-weight:600!important;letter-spacing:-.015em!important;color:var(--ap-tinta)}
/* titulares en dos tonos, como «Comprar un iPhone. Elige tu modelo.» */
h1 em,h2 em,h1 i,h2 i,.sec-title em,.prod-title em,.cat-h2 em,.hero-h1 em{color:var(--ap-gris2)!important;font-weight:600!important}
::selection{background:#b3d7ff;color:var(--ap-tinta)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,label:focus-within{outline:2px solid var(--ap-azul)!important;outline-offset:2px}
.wrap,.mo-wrap{max-width:var(--ap-max)}

/* Etiquetas pequeñas sobre los titulares («Fotografía Digital», «Paso a paso»...) */
.sec-ey,.pricing-ey,.prod-eyebrow,.prod-ey,.hero-ey,.hero-eyebrow,.about-ey,.mo-srv-ey,.pcol-title,.panel-title,.price-block-title,.cat-ey{color:var(--ap-naranja)!important;font-size:14px!important;font-weight:600!important;letter-spacing:-.01em!important;text-transform:none!important}
.sec-ey::before,.hero-eyebrow::before,.hero-eyebrow::after,.hero-ey::before,.cat-ey::before{display:none!important}
.sec-title::after{display:none!important}
.sec-title,.cat-h2{font-size:clamp(28px,3.4vw,40px)!important;line-height:1.1!important;margin-bottom:.4em}
.sec-sub{color:var(--ap-gris)!important;font-size:19px!important;max-width:720px}

/* ---------- Botones: píldoras azules ---------- */
[class^="btn"],[class*=" btn"],.btn,.mo-cta,.mo-btn,.mo-doc .button,.mo-doc button,.mo-doc input[type=submit]{border-radius:980px!important;font-weight:400!important;letter-spacing:-.01em!important;text-transform:none!important;box-shadow:none!important;transform:none!important;transition:background .2s,color .2s!important}
.btn-brand,.btn-p,.btn-hero-p,.btn-wh,.btn-primary,.mo-btn,.mo-doc .button,.mo-doc button,.mo-doc input[type=submit],button[type=submit],input[type=submit]{background:var(--ap-azul)!important;color:#fff!important;border:0!important;padding:12px 24px!important;font-size:17px!important}
.btn-brand:hover,.btn-p:hover,.btn-hero-p:hover,.btn-wh:hover,.btn-primary:hover,.mo-btn:hover,.mo-doc .button:hover,.mo-doc button:hover{background:var(--ap-azul-dk)!important;filter:none!important}
.btn-ol,.btn-g,.btn-hero-g,.btn-sec,.btn-outline{background:transparent!important;color:var(--ap-azul)!important;border:1px solid var(--ap-azul)!important;padding:11px 23px!important;font-size:17px!important}
.btn-ol:hover,.btn-g:hover,.btn-hero-g:hover{background:var(--ap-azul)!important;color:#fff!important}
.sec-more,.mo-all{color:var(--ap-enlace)!important;font-size:17px!important;font-weight:400!important;text-transform:none!important;letter-spacing:-.01em!important}
.sec-more:hover{text-decoration:underline}

/* =====================================================================
   CABECERA (barra translúcida fina, como la de apple.com)
   ===================================================================== */
.mo-header{background:rgba(251,251,253,.8)!important;backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:0!important;box-shadow:none}
/* franja superior: aviso fino gris, como el de envío gratis de Apple */
.mo-top{background:var(--ap-fondo)!important;color:var(--ap-tinta)!important;font-size:12px!important;order:2}
.mo-top .mo-wrap{justify-content:center!important;min-height:34px;text-align:center;gap:4px 16px}
.mo-top a{color:var(--ap-enlace)!important;font-weight:400!important}
.mo-bar{position:relative}
.mo-bar .mo-wrap{min-height:52px!important;gap:16px;position:static!important}
.mo-logo{font-size:15px!important;font-weight:600!important;color:var(--ap-tinta)!important}
.mo-logo img{width:30px!important;height:30px!important}
.mo-nav{margin-left:auto;margin-right:auto}
.mo-nav>ul{gap:0}
.mo-nav>ul>li>a{padding:8px 12px!important;border-radius:0!important;font-size:13px!important;font-weight:400!important;color:var(--ap-tinta)!important;opacity:.85;background:none!important}
.mo-nav>ul>li>a:hover,.mo-dd:hover>a,.mo-dd:focus-within>a{opacity:1;background:none!important;color:#000!important}
.mo-dd>a::after{display:none!important}
/* desplegable a todo lo ancho, con enlaces grandes */
.mo-panel{left:0!important;right:0!important;top:100%!important;border:0!important;border-radius:0!important;background:rgba(250,250,252,.98)!important;box-shadow:0 30px 40px -20px rgba(0,0,0,.12)!important;padding:36px max(24px,calc((100vw - 1000px)/2)) 48px!important;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))!important;gap:2px 40px!important}
.mo-panel p{color:var(--ap-gris)!important;font-size:12px!important;font-weight:400!important;text-transform:none!important;letter-spacing:0!important;margin:14px 0 6px!important}
.mo-panel p:first-child{margin-top:0!important}
.mo-panel a{font-size:17px!important;font-weight:600!important;color:#333336!important;padding:4px 0!important;border-radius:0!important;background:none!important}
.mo-panel a:hover{color:var(--ap-enlace)!important;background:none!important}
.mo-panel a.mo-all{color:var(--ap-enlace)!important;font-weight:400!important}
.mo-cta{background:var(--ap-azul)!important;color:#fff!important;padding:5px 14px!important;font-size:13px!important;font-weight:400!important}
.mo-cta:hover{background:var(--ap-azul-dk)!important}
.mo-burger{font-size:20px!important;color:var(--ap-tinta)!important;background:none!important}
@media (max-width:1020px){
  .mo-nav{background:#fff!important;box-shadow:none!important;height:calc(100vh - 52px);max-height:none!important;padding:16px 32px 48px!important;margin:0}
  .mo-nav>ul>li>a{font-size:26px!important;font-weight:600!important;padding:10px 0!important;opacity:1}
  .mo-panel{display:grid!important;position:static!important;background:none!important;box-shadow:none!important;padding:0 0 12px!important;grid-template-columns:1fr 1fr!important}
  .mo-panel a{font-size:15px!important;font-weight:400!important;color:var(--ap-gris)!important}
  .mo-burger{margin-left:auto!important}
  .mo-cta{margin-left:0}
}
@media (max-width:560px){.mo-panel{grid-template-columns:1fr!important}.mo-nav{padding:8px 16px 40px!important}}

/* ruta de navegación: discreta, gris pequeño */
.breadcrumb,.breadcrumb-bar{background:#fff!important;border:0!important;font-size:12px!important;color:var(--ap-gris)!important;padding:14px 0 0!important}
.breadcrumb a,.breadcrumb-bar a{color:var(--ap-gris)!important}
.breadcrumb a:hover{color:var(--ap-tinta)!important;text-decoration:underline}

/* =====================================================================
   PORTADA
   ===================================================================== */
.home-hero{background:#fff!important;color:var(--ap-tinta)!important;padding:56px 0 24px!important;min-height:0!important;overflow:visible!important}
.home-hero::before,.home-hero::after{display:none!important}
.home-hero .hero-inner{max-width:var(--ap-max)!important;margin:0 auto!important;padding:0 24px!important;text-align:left!important}
.home-hero h1{font-size:clamp(40px,6vw,64px)!important;line-height:1.06!important;color:var(--ap-tinta)!important;max-width:900px;margin:.15em 0 .45em!important}
.home-hero .respuesta-directa,.respuesta-directa.sobre-oscuro{color:var(--ap-tinta)!important;font-size:21px!important;line-height:1.38!important;max-width:820px!important;margin:0 0 .8em!important;text-align:left!important}
.home-hero .hero-sub{color:var(--ap-gris)!important;font-size:17px!important;line-height:1.47!important;max-width:820px!important;margin:0 0 28px!important;text-align:left!important}
.hero-ctas{justify-content:flex-start!important;gap:14px!important}
.hero-stats{display:flex!important;flex-wrap:wrap;justify-content:flex-start!important;border:0!important;gap:56px!important;margin-top:44px!important;padding:0!important}
.hero-stat-n,.hstat-val{color:var(--ap-tinta)!important;font-size:40px!important;font-weight:600!important;letter-spacing:-.02em!important;line-height:1.1!important}
.hero-stat-l,.hstat-lbl{color:var(--ap-gris)!important;font-size:14px!important;text-transform:none!important;letter-spacing:0!important}
/* accesos a categorías: fila de iconos como la de la tienda de Apple */
.cat-quick{position:static!important;max-width:var(--ap-max)!important;margin:56px auto 0!important;padding:8px 24px 0!important;background:none!important;display:flex!important;gap:8px!important;justify-content:flex-start;overflow-x:auto;transform:none!important;border:0!important;box-shadow:none!important}
.cq-item{flex:0 0 auto;display:flex!important;flex-direction:column!important;align-items:center!important;gap:10px!important;width:150px;padding:8px!important;background:none!important;border:0!important;box-shadow:none!important;text-align:center;color:var(--ap-tinta)!important}
.cq-ico{font-size:48px!important;width:auto!important;height:auto!important;background:none!important;line-height:1}
.cq-lbl,.cq-arr{display:none!important}
.cq-name{font-size:14px!important;font-weight:600!important;color:var(--ap-tinta)!important}
.cq-item:hover .cq-name{color:var(--ap-enlace)!important}

/* secciones de categoría sobre gris, con carrusel de tarjetas */
.cat-section{background:var(--ap-fondo)!important;padding:56px 0 24px!important;border:0!important}
.cat-section+.cat-section{padding-top:24px!important}
.cat-head{align-items:flex-end!important;margin-bottom:24px!important}

/* ---------- Tarjetas de producto ---------- */
.pcard{background:#fff!important;border:0!important;border-radius:var(--ap-r)!important;box-shadow:var(--ap-sh)!important;overflow:hidden;transition:transform .3s cubic-bezier(0,0,.5,1),box-shadow .3s cubic-bezier(0,0,.5,1)!important}
.pcard:hover{transform:scale(1.015)!important;box-shadow:var(--ap-sh-h)!important}
.pcard-img{border-radius:0!important;background:#fff}
.pcard-img img{transition:none!important;transform:none!important}
.pcard-lbl,.pcard-lbl span{font-size:17px!important;font-weight:600!important;text-transform:none!important;letter-spacing:-.015em!important;color:var(--ap-tinta)!important;border:0!important}
.pcard-lbl{padding:16px 20px 22px!important;background:#fff!important}
/* portada: productos en filas (cuadrícula que salta de línea, sin barra de desplazamiento) */
.cat-section .prod-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important;grid-auto-flow:row!important;gap:16px!important;overflow:visible!important;padding:8px 0 24px!important;margin:0!important}
.cat-section .pcard-lbl{padding:10px 12px 12px!important}
.cat-section .pcard-lbl,.cat-section .pcard-lbl span{font-size:14px!important;line-height:1.25!important}
/* páginas de producto: carrusel horizontal sin JS (se desliza con el dedo, el ratón o la barra) */
.related-grid{display:grid!important;grid-auto-flow:column!important;grid-template-columns:none!important;grid-auto-columns:minmax(220px,260px)!important;gap:20px!important;overflow-x:auto!important;scroll-snap-type:x mandatory;scroll-padding:0 24px;padding:12px 0 28px!important;margin:0!important;scrollbar-width:thin;scrollbar-color:#c7c7cc transparent}
.related-grid>*{scroll-snap-align:start}

/* ---------- Quiénes somos ---------- */
.about-section{background:#fff!important;color:var(--ap-tinta)!important;padding:88px 0!important}
.about-section h2{font-size:clamp(28px,3.4vw,40px)!important;color:var(--ap-tinta)!important;line-height:1.1}
.about-ey::before,.about-ey::after{display:none!important}
.cta-fin p[style]{color:var(--ap-naranja)!important;text-transform:none!important;letter-spacing:-.01em!important;font-size:14px!important}
.cta-fin p[style] span{display:none!important}
.about-section p{color:var(--ap-gris)!important;font-size:17px}
.about-vals{gap:16px!important}
.about-val{background:var(--ap-fondo)!important;border:0!important;border-radius:var(--ap-r)!important;padding:22px!important}
.about-val-t{color:var(--ap-tinta)!important;font-size:17px!important;font-weight:600!important}
.about-val-d{color:var(--ap-gris)!important;font-size:14px!important}
.about-val-ico{background:none!important;font-size:28px!important}
.about-img-col img{border-radius:var(--ap-r)!important;object-fit:cover}

/* =====================================================================
   PÁGINA DE PRODUCTO (como «Comprar un iPhone»)
   ===================================================================== */
.hero-strip{background:#fff!important;color:var(--ap-tinta)!important;padding:40px 0 64px!important;border:0!important}
.hero-strip::before,.hero-strip::after{display:none!important}
.hero-inner{gap:56px!important;align-items:center!important}
.hero-h1{font-size:clamp(34px,4.6vw,56px)!important;line-height:1.07!important;color:var(--ap-tinta)!important}
.hero-strip .respuesta-directa{color:var(--ap-tinta)!important;font-size:19px!important;line-height:1.42!important}
.hero-strip .hero-sub{color:var(--ap-gris)!important;font-size:17px!important}
.hero-stats{gap:40px!important}
.hstat{background:none!important;border:0!important;padding:0!important;text-align:left!important}
.hstat-val{font-size:32px!important}
.hero-trust{gap:8px!important}
.htrust{background:var(--ap-fondo)!important;color:var(--ap-tinta)!important;border:0!important;border-radius:980px!important;font-size:12px!important;padding:6px 12px!important}
.hero-foto img{border-radius:var(--ap-r)!important;box-shadow:none!important;max-height:480px!important}

/* zona de compra: foto fija a la izquierda, opciones a la derecha */
.prod-section{background:#fff!important;padding:24px 0 88px!important;border-top:1px solid var(--ap-linea)}
.prod-section .prod-grid{display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)!important;gap:64px!important;align-items:start!important}
@media (min-width:900px){.prod-section .gallery{position:sticky;top:110px}}
@media (max-width:899px){.prod-section .prod-grid{grid-template-columns:1fr!important;gap:32px!important}}
.gallery-main{background:var(--ap-fondo)!important;border:0!important;border-radius:var(--ap-r)!important;overflow:hidden}
.gallery-main img{border-radius:0!important}
.gallery-thumbs{gap:12px!important;margin-top:16px!important}
.gthumb,label.gthumb,label.thumb{border:2px solid transparent!important;border-radius:var(--ap-r-sm)!important;overflow:hidden;background:var(--ap-fondo)!important;opacity:1!important}
.gthumb img{border-radius:10px!important}
body:has(#g1:checked) label[for="g1"],body:has(#g2:checked) label[for="g2"],
body:has(#g3:checked) label[for="g3"],body:has(#g4:checked) label[for="g4"],
body:has(#g5:checked) label[for="g5"],body:has(#g6:checked) label[for="g6"],
body:has(#g7:checked) label[for="g7"],body:has(#g8:checked) label[for="g8"]{border-color:var(--ap-azul)!important}
.prod-h2,.prod-title{font-size:clamp(28px,3.2vw,40px)!important;line-height:1.1!important;color:var(--ap-tinta)!important;margin:.15em 0 .3em!important}
.prod-desde{font-size:17px!important;color:var(--ap-tinta)!important;font-weight:400!important;padding-bottom:24px;border-bottom:1px solid var(--ap-linea);margin-bottom:28px!important}
.prod-desde span{color:var(--ap-gris)!important}
.prod-iva{color:var(--ap-gris)!important;font-size:12px!important}
.prod-desc{color:var(--ap-tinta)!important;font-size:17px!important}

/* calculadora: pasos con desplegables grandes, como el configurador */
.calc-box{background:none!important;border:0!important;padding:0!important;box-shadow:none!important}
.calc-title{font-size:24px!important;font-weight:600!important;color:var(--ap-tinta)!important;margin-bottom:20px!important}
.calc-grid{grid-template-columns:1fr!important;gap:18px!important}
.calc-field label,.calc-lbl{font-size:17px!important;font-weight:600!important;color:var(--ap-tinta)!important;margin-bottom:8px!important;text-transform:none!important;letter-spacing:-.015em!important}
.calc-field select,.calc-box select,.mo-calc select{height:56px;padding:0 44px 0 16px!important;border:1px solid var(--ap-gris2)!important;border-radius:var(--ap-r-sm)!important;font-size:17px!important;color:var(--ap-tinta)!important;background-color:#fff!important;background-position:right 16px center!important}
.calc-field select:hover{border-color:var(--ap-tinta)!important}
.calc-field select:focus{outline:0!important;border:2px solid var(--ap-azul)!important;box-shadow:none!important}
.calc-result{background:var(--ap-fondo)!important;border:0!important;border-radius:var(--ap-r)!important;padding:22px 24px!important;margin-top:24px!important}
.calc-result-lbl{color:var(--ap-gris)!important;font-size:14px!important}
.calc-result-price,.price-val{color:var(--ap-tinta)!important;font-size:32px!important;font-weight:600!important;letter-spacing:-.02em}
.pt-price,.price-table td{color:var(--ap-tinta)!important;font-size:17px!important;font-weight:600!important;white-space:nowrap}
@media (max-width:734px){.pt-price,.price-table td{font-size:14px!important}.price-table td{white-space:normal}}
.calc-result-note{color:var(--ap-gris)!important;font-size:12px!important}
label.opt-pill{border:1px solid var(--ap-gris2)!important;border-radius:var(--ap-r-sm)!important;background:#fff!important;color:var(--ap-tinta)!important}
label.opt-pill:has(input:checked){border:2px solid var(--ap-azul)!important;background:#fff!important;color:var(--ap-tinta)!important}

.specs-row{gap:8px!important}
.spec-pill{background:var(--ap-fondo)!important;border:0!important;border-radius:980px!important;color:var(--ap-tinta)!important;font-size:13px!important;padding:7px 14px!important}
.spec-pill strong{font-weight:400!important}
.trust-list{border-top:1px solid var(--ap-linea);padding-top:20px!important;margin-top:24px!important}
.titem{font-size:14px!important;color:var(--ap-tinta)!important}
.prod-info .btn-brand{width:100%;padding:16px 24px!important;margin-top:24px!important}

/* ---------- Secciones de contenido ---------- */
.materials-section,.uses-section,.feat-section{background:var(--ap-fondo)!important;padding:88px 0!important}
.process-section,.proc-section{background:#fff!important;padding:88px 0!important}
.faq-section{background:#fff!important;padding:40px 0 88px!important}
.related-section{background:var(--ap-fondo)!important;padding:72px 0 48px!important}
.mat-grid,.feat-grid,.use-grid{gap:20px!important;margin-top:36px!important}
.mat-card,.feat-card,.use-card,.spec-card{background:#fff!important;border:0!important;border-radius:var(--ap-r)!important;box-shadow:none!important;padding:32px 28px!important;text-align:left!important}
.mat-card:hover,.feat-card:hover,.use-card:hover{transform:none!important;box-shadow:var(--ap-sh)!important}
.mat-ico,.feat-ico,.use-ico{font-size:40px!important;background:none!important;margin:0 0 14px!important;width:auto!important;height:auto!important;justify-content:flex-start!important}
.mat-name,.feat-name,.use-name{font-size:21px!important;font-weight:600!important;color:var(--ap-tinta)!important;letter-spacing:-.015em}
.mat-desc,.feat-desc,.use-desc{font-size:15px!important;color:var(--ap-gris)!important;line-height:1.45!important}

.proc-steps,.proc-grid{gap:20px!important;margin-top:36px!important}
.pstep,.proc-step{background:var(--ap-fondo)!important;border:0!important;border-radius:var(--ap-r)!important;padding:28px 24px!important;box-shadow:none!important;text-align:left!important}
.pstep::before,.pstep::after,.proc-steps::before{display:none!important}
.proc-n,.pstep-num,.pstep-n{background:none!important;color:var(--ap-gris2)!important;font-size:40px!important;font-weight:600!important;width:auto!important;height:auto!important;border:0!important;margin:0 0 10px!important;justify-content:flex-start!important;box-shadow:none!important}
.pstep-title{font-size:19px!important;font-weight:600!important;color:var(--ap-tinta)!important}
.pstep-desc{font-size:15px!important;color:var(--ap-gris)!important}

/* preguntas: lista con líneas finas */
.fq-list{border-bottom:1px solid var(--ap-linea);margin-top:32px!important;max-width:980px}
details.fq{background:none!important;border:0!important;border-top:1px solid var(--ap-linea)!important;border-radius:0!important;box-shadow:none!important;margin:0!important}
details.fq>summary,.fq-btn{font-size:19px!important;font-weight:600!important;color:var(--ap-tinta)!important;padding:22px 48px 22px 0!important;background:none!important;position:relative}
details.fq[open]>summary{color:var(--ap-tinta)!important}
.fq-tgl{position:absolute;right:4px;top:50%;margin-top:-14px;background:none!important;color:var(--ap-gris)!important;font-size:26px!important;font-weight:300!important;width:28px!important;height:28px!important;border:0!important;display:grid!important;place-items:center;transition:transform .25s!important}
.fq-ans{font-size:17px!important;color:var(--ap-gris)!important;padding:0 48px 26px 0!important;background:none!important}

/* cierre con llamada a la acción */
.cta-fin{background:#fff!important;color:var(--ap-tinta)!important;padding:96px 0!important;text-align:center;border:0!important}
.cta-fin::before,.cta-fin::after{display:none!important}
.cta-fin h2{font-size:clamp(30px,4vw,48px)!important;line-height:1.08!important;color:var(--ap-tinta)!important}
.cta-fin p{color:var(--ap-gris)!important;font-size:19px!important}
.cta-fin p span{background:var(--ap-linea)!important}
.cta-row{justify-content:center!important;gap:14px!important}

/* franja de contacto */
.cstrip{background:#fff!important;border-top:1px solid var(--ap-linea)!important;color:var(--ap-tinta)!important}
.cstrip-inner{max-width:var(--ap-max)!important}
.ci{background:none!important;border:0!important}
.ci-ico{background:none!important;font-size:28px!important}
.ci-lbl{color:var(--ap-gris)!important;font-size:12px!important;text-transform:none!important;letter-spacing:0!important;font-weight:400!important}
.ci-val,.ci-val a{color:var(--ap-tinta)!important;font-size:17px!important;font-weight:600!important}
.ci-val a:hover{color:var(--ap-enlace)!important}

/* ---------- Así trabajamos: tarjetas blancas sobre gris ---------- */
.mo-srv{background:var(--ap-fondo)!important;color:var(--ap-tinta)!important;padding:72px 0!important}
.mo-srv-ey{text-align:left!important}
.mo-srv h2{text-align:left!important;color:var(--ap-tinta)!important;font-size:clamp(28px,3.4vw,40px)!important;margin:0 0 32px!important}
.mo-srv-i{background:#fff!important;border:0!important;border-radius:var(--ap-r)!important;box-shadow:var(--ap-sh);color:var(--ap-tinta)!important;text-align:left!important;padding:30px 26px!important;transition:transform .3s cubic-bezier(0,0,.5,1),box-shadow .3s!important}
a.mo-srv-i:hover{transform:scale(1.015)!important;background:#fff!important;box-shadow:var(--ap-sh-h)}
.mo-srv-ico{background:none!important;margin:0 0 14px!important;width:auto!important;height:auto!important;font-size:36px!important;display:block!important}
.mo-srv-i h3{color:var(--ap-tinta)!important;font-size:21px!important;font-weight:600!important}
.mo-srv-i p{color:var(--ap-gris)!important;font-size:15px!important}
.mo-srv-faq{background:#fff!important;border:0!important}
.mo-srv-faq .mo-srv-ico{background:none!important}
a.mo-srv-faq h3::after{content:" ›";color:var(--ap-enlace)!important}

/* =====================================================================
   PIE (gris claro, letra pequeña, como el de apple.com)
   ===================================================================== */
footer,.mo-footer{background:var(--ap-fondo)!important;color:var(--ap-gris)!important;border:0!important;border-image:none!important;font-size:12px!important;line-height:1.34!important;padding-top:24px!important}
footer .foot-grid,.mo-fgrid{border-top:0;padding-top:20px!important;padding-bottom:24px!important;gap:24px 32px!important}
footer p,.mo-footer p,.mo-footer address{color:var(--ap-gris)!important;font-size:12px!important;line-height:1.5!important}
footer h4,.mo-ft{color:var(--ap-tinta)!important;font-size:12px!important;font-weight:600!important;text-transform:none!important;letter-spacing:0!important;margin-bottom:10px!important}
footer a,.mo-footer a{color:#424245!important;font-size:12px!important;font-weight:400!important}
footer a:hover,.mo-footer a:hover{color:var(--ap-tinta)!important;text-decoration:underline}
footer li{padding:3px 0!important}
.foot-brand img,.mo-logo-w img,footer img[src$="logo.svg"]{filter:none!important;opacity:1!important;background:none!important;padding:0!important;height:30px!important;width:auto!important}
.mo-logo-w{color:var(--ap-tinta)!important}
.fbadge{background:#fff!important;color:var(--ap-gris)!important;border:1px solid var(--ap-linea)!important;font-size:11px!important;font-weight:400!important}
.foot-bot,.mo-fbot{border-top:1px solid var(--ap-linea)!important;color:var(--ap-gris)!important;font-size:12px!important;padding-top:16px!important;padding-bottom:24px!important}
.foot-bot a,.mo-fbot a{color:#424245!important}

/* =====================================================================
   PÁGINAS DE CONTENIDO (avisos, tiendas, vinilos, FAQ...)
   ===================================================================== */
body.mo-page{background:#fff!important;color:var(--ap-tinta)!important}
.mo-ptitle{background:#fff!important;color:var(--ap-tinta)!important;padding:56px 0 24px!important}
.mo-ptitle h1{color:var(--ap-tinta)!important;font-size:clamp(34px,5vw,56px)!important;line-height:1.07}
.mo-ptitle p,.mo-ptitle .respuesta-directa{color:var(--ap-gris)!important;font-size:21px!important;line-height:1.38}
.mo-doc a{color:var(--ap-enlace)!important}
.mo-doc .button,.mo-doc a.button{color:#fff!important}
.mo-doc img{border-radius:var(--ap-r-sm)}
.mo-doc table{box-shadow:none!important;border:1px solid var(--ap-linea);border-radius:var(--ap-r-sm)}
.mo-doc th{background:var(--ap-fondo)!important;color:var(--ap-tinta)!important;font-weight:600!important}
.mo-doc tr:nth-child(even) td{background:#fbfbfd!important}
.mo-doc .tab-nav a{background:var(--ap-fondo)!important;color:var(--ap-tinta)!important;font-weight:400!important}
.mo-doc .shop-categories>div,.mo-doc .grid-6>div{border-radius:var(--ap-r)!important;box-shadow:var(--ap-sh)!important}
.mo-gal img,.mo-hero-gal figure{border-radius:var(--ap-r)!important;box-shadow:none!important}
.mo-hero-gal figcaption{background:linear-gradient(transparent,rgba(0,0,0,.55))!important;font-weight:600!important}
.mo-doc input:not([type=checkbox]):not([type=radio]):not([type=submit]),.mo-doc select,.mo-doc textarea{border:1px solid var(--ap-gris2)!important;border-radius:var(--ap-r-sm)!important;padding:14px 16px!important;font-size:17px!important}
.mo-faq h2{color:var(--ap-tinta)!important;font-size:24px!important;text-transform:none!important;letter-spacing:-.015em!important;font-weight:600!important}
.mo-faq details.fq{border-radius:0!important}
.mo-faq details.fq>summary::after{background:none!important;color:var(--ap-gris)!important;font-weight:300!important;font-size:26px}
.mo-faq-cta{background:var(--ap-fondo)!important;border:0!important;border-radius:var(--ap-r)!important}
.mo-faq-cta a:not(.mo-btn){color:var(--ap-enlace)!important}

/* ---------- Móvil ---------- */
@media (max-width:734px){
  html body{font-size:17px}
  .home-hero{padding:32px 0 8px!important}
  .home-hero .respuesta-directa,.respuesta-directa.sobre-oscuro{font-size:19px!important}
  .hero-stats{gap:28px!important;flex-wrap:wrap}
  .hero-stat-n{font-size:26px!important;white-space:nowrap}
  .cat-quick{margin-top:32px!important;padding:0 12px!important}
  .cq-item{width:110px}
  .cq-ico{font-size:40px!important}
  .related-grid{grid-auto-columns:72%!important}
  .cat-section .prod-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))!important;gap:12px!important}
  .cat-section .pcard-lbl,.cat-section .pcard-lbl span{font-size:13px!important}
  .materials-section,.process-section,.related-section,.about-section,.mo-srv,.cta-fin{padding-top:56px!important;padding-bottom:56px!important}
  .mo-srv-g,.mo-srv-g4{grid-auto-flow:column;grid-template-columns:none!important;grid-auto-columns:80%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
  .mo-srv-i{scroll-snap-align:start}
  .mo-srv-faq{grid-column:auto!important}
}

/* =====================================================================
   CABECERAS Y BANDAS QUE ANTES ERAN OSCURAS: pasan a blanco o gris claro
   ===================================================================== */
.prod-hero,.hero,.cat-hero,.pricing-section{background:#fff!important;color:var(--ap-tinta)!important;border:0!important}
.feat-strip,.price-block,.cta-card,.config-cta,.price-display,.desde-badge,.price-desde{background:var(--ap-fondo)!important;color:var(--ap-tinta)!important;border:0!important;box-shadow:none!important}
.feat-strip{padding-top:48px!important;padding-bottom:48px!important}
.price-block,.cta-card,.config-cta,.price-display{border-radius:var(--ap-r)!important}
.desde-badge,.price-desde{border-radius:var(--ap-r-sm)!important}
:is(.prod-hero,.hero,.cat-hero,.pricing-section)::before,:is(.prod-hero,.hero,.cat-hero,.pricing-section)::after{display:none!important}
:is(.prod-hero,.hero,.cat-hero,.pricing-section,.feat-strip,.price-block,.cta-card,.config-cta,.price-display,.desde-badge,.price-desde) :is(h1,h2,h3,h4,h5,p,li,span,div,strong,b,small,td,th,label,dt,dd,a):not([class*="btn"]):not([class*="ey"]):not([class*="badge"]){color:inherit!important}
:is(.prod-hero,.hero,.cat-hero,.pricing-section,.feat-strip) :is(p,small,li,dd,[class*="sub"],[class*="lbl"],[class*="label"],[class*="desc"],[class*="note"]):not([class*="btn"]):not(.respuesta-directa){color:var(--ap-gris)!important}
:is(.prod-hero,.hero,.cat-hero,.pricing-section) .respuesta-directa{color:var(--ap-tinta)!important;font-size:19px!important;line-height:1.42!important}
:is(.prod-hero,.hero,.cat-hero) h1{font-size:clamp(34px,4.6vw,56px)!important;line-height:1.07!important}
/* cajitas que eran blanco translúcido sobre oscuro */
:is(.prod-hero,.hero,.cat-hero,.pricing-section) [class*="stat"],:is(.prod-hero,.hero,.cat-hero) [class*="trust"]>*,:is(.prod-hero,.hero,.cat-hero) [class*="chip"],:is(.prod-hero,.hero,.cat-hero) [class*="tag"]{border-color:var(--ap-linea)!important}
:is(.prod-hero,.hero,.cat-hero,.pricing-section) [style*="rgba(255"]{color:var(--ap-gris)!important}
.pricing-section table,.pricing-section .price-table{background:#fff!important;border:1px solid var(--ap-linea)!important;border-radius:var(--ap-r-sm)!important;box-shadow:none!important}
.pricing-section th,.price-table th{background:var(--ap-fondo)!important;color:var(--ap-tinta)!important}
.pricing-section td{border-color:var(--ap-linea)!important}
.mo-doc a.mo-btn,.mo-doc a[class*="btn"],.mo-doc a.button{color:#fff!important}
.mo-doc a.btn-ol,.mo-doc a.btn-g,.mo-doc a.btn-hero-g{color:var(--ap-azul)!important}

/* =====================================================================
   MÓVIL Y TABLETA (30/10/2026)
   Ajustes para que todas las páginas se vean bien de 320 a 1024 px.
   Solo CSS: no hace falta JavaScript.
   ===================================================================== */
/* nada puede ser más ancho que la pantalla */
img,video,iframe,svg{max-width:100%}
input,select,textarea{max-width:100%}
.form-row>*,.form-group,.prod-inner>*,.calc-row>*,.calc-field{min-width:0}
.form-group input,.form-group select,.form-group textarea{width:100%;min-width:0;box-sizing:border-box}
.fields>*,.proc-steps>*,.proc-grid>*{min-width:0}
.fields input,.fields select,.fields textarea{width:100%;min-width:0;box-sizing:border-box}
.proc-text,.pstep-desc,.fq-ans{overflow-wrap:anywhere}

/* márgenes laterales en las secciones que se quedaban pegadas al borde
   (zona de compra, preguntas, productos relacionados y pasos) */
:is(.prod-section,.faq-section,.related-section,.process-section):has(>.prod-inner,>.section-inner){padding-left:20px!important;padding-right:20px!important}
@media (max-width:1248px){
  .breadcrumb-bar{padding:14px 24px 0!important}
}

/* pie de página: textos que eran blancos sobre el gris claro */
footer .brand-name{color:var(--ap-tinta)!important;font-weight:600}
footer .brand-tag,footer .footer-copy,footer .footer-bottom,footer .footer-bottom span,footer .footer-tagline,footer .footer-col-title,footer p[style]{color:var(--ap-gris)!important}
footer .footer-address,footer .footer-address a{color:#424245!important}
@media (max-width:1248px){footer .foot-bot{padding-left:20px!important;padding-right:20px!important}}
.footer-logo img{filter:none!important;opacity:1!important}
.btn-cta-out{color:var(--ap-azul)!important;border-color:var(--ap-azul)!important}

/* precios: el importe y el símbolo € siempre juntos */
.calc-result-price,.price-val,.pt-price,.price-desde-val,.price-row-val,.hstat-val,.hero-stat-n,.pz[class*="price-out"]{white-space:nowrap}

/* tabletas (hasta 1024 px) */
@media (max-width:1100px){
  .price-table td,.price-table th{white-space:normal}
  .price-table{width:100%}
}

/* teléfonos */
@media (max-width:734px){
  /* letra mínima legible (12 px) en etiquetas, notas y cifras pequeñas */
  .hstat-l,.calc-note,.calc-result-note,.gallery-badge,.gallery-badge-2,.gallery-badge-eco,.fbadge,.cat-hero-badge,.sec-eyebrow,
  .proc-text,.pcard-desc,.price-tier-l,.price-display-note,.config-title,.quote-lbl,.qtag,.price-tabla-tag,.cat-stat-l,
  .price-best,.prod-card-badge,.prod-card-ey,.stat-l,.pcard-badge,.pcard-cta,.cat-hero-ey,.prod-hero-badge,.prod-badge,
  .spec-card-lbl,.datos-preview-title,.sub-preview,.price-table-head,.price-note,.form-note,.price-desde-label,
  .price-iva-note,.prod-iva,.ci-lbl,.htrust,.mo-top,.breadcrumb,.breadcrumb-bar,
  .pz[class*="note"],.pz[class*="unit"],th,
  .prod-section span[style*="font-size"],.prod-hero span,.cat-hero span{font-size:12px!important}
  small{font-size:max(12px,80%)!important}
  .form-group label{font-size:12px!important}
  /* campos de formulario a 16 px: así el iPhone no amplía la página al escribir */
  input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px!important}
  /* enlaces del pie más fáciles de pulsar con el dedo */
  footer li{padding:6px 0!important}
  footer .footer-links{gap:12px!important}
  footer a,.mo-footer a{display:inline-block;min-height:24px}
  /* datos de contacto: el horario no deja una «h» sola en una línea */
  .ci-val,.ci-val a{font-size:15px!important;text-wrap:balance}
  .ci:has(a[href^="mailto"]){grid-column:1/-1}
  /* tablas anchas: se deslizan dentro de su caja, nunca la página */
  .mo-doc table,.pricing-section table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  /* botón flotante «subir»: tapaba el texto en pantallas pequeñas */
  .scroll-top{display:none!important}
  /* titulares largos sin palabras que se salgan */
  h1,h2,h3{overflow-wrap:break-word;hyphens:manual}
  /* calculadora: el importe un poco menor para que quepa al lado de la etiqueta */
  .calc-result-price,.price-val{font-size:28px!important}
}
/* tablas de precios con tres columnas (calendarios): en el móvil se veía
   solo el precio de «Restantes»; ahora se ven las tres columnas */
.price-table .pt-orient{color:var(--ap-tinta)!important;font-weight:600}
@media (max-width:734px){
  .price-table .pt-head,.price-table .pt-row{grid-template-columns:1.1fr 1fr 1fr!important;padding-left:16px!important;padding-right:16px!important;gap:8px}
  .price-table .pt-head:has(>:nth-child(3)) span:nth-child(2),.price-table .pt-orient{display:block!important;text-align:center}
  .price-table .pt-price{text-align:right}
  .pt-head span,.price-badge,.animal-card-lbl span,.foot-bot span,.footer-bottom span{font-size:12px!important}
  .prod-section p[style*="font-size"],.pricing-section p[style*="font-size"]{font-size:12px!important}
}
/* sin ratón (móvil, tableta): fuera el aviso de «pasa el ratón» */
@media (hover:none){.img-hint{display:none!important}}

/* =====================================================================
   FOTOS FIJAS EN MÓVIL (03/11/2026)
   En móvil y tableta la galería de producto ya no se queda fija al hacer
   scroll: se desplaza con la página y no tapa los textos.
   ===================================================================== */
@media (max-width:1023px){
  .gallery-wrap,.gallery,.prod-gallery,.prod-section .gallery,.spec-card{position:static!important;top:auto!important}
}