@charset "utf-8";
/* =====================================================================================
   3CATORCE · diseño G «Aurora» (el de ce3catorce.online) para CUATRO landings del portal
   Orden de Alberto, 02-10-2026: «Modifica la landing de fitosanitario y hazla estilo nuestra
   web, con protección de datos y alérgenos haz lo mismo en esas landing».
   La cargan SOLO /curso/fitosanitario, /curso/renovacion-fitosanitarios,
   /curso/proteccion-de-datos y /curso/alergenos-appcc (LANDINGS_G en server.js), que ponen
   class="estilo-g" en <html>. Todo cuelga de html.estilo-g: sin esa clase, esta hoja no hace nada.
   Desde el 02-10-2026 por la tarde («Dale a la de piscinas… dale a la de encargo»), también
   /curso/piscinas-360 (la misma maqueta: no necesita nada propio) y /encargo, que pone
   class="estilo-g g-enc" y tiene su bloque al final («/encargo»).
   Reglas que no se rompen:
   · SOLO el aspecto: ni un texto, precio, casilla, enlace ni orden de secciones cambia.
   · No se cambia el display de .btn ni de .reserva/.movil (el móvil esconde y enseña botones).
   · Sin !important: gana por especificidad (html.estilo-g delante), también a la hoja de alérgenos.
   ===================================================================================== */

@font-face{font-family:'Inter';src:url(inter-latin.woff2) format('woff2');font-weight:300 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter Tight';src:url(inter-tight-latin.woff2) format('woff2');font-weight:300 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* mientras llega la letra, Arial con las medidas de Inter: el texto no salta al cambiar */
@font-face{font-family:'Inter reserva';src:local('Arial');size-adjust:107%;ascent-override:90%;descent-override:22.4%;line-gap-override:0%}
@font-face{font-family:'Inter Tight reserva';src:local('Arial');size-adjust:101%;ascent-override:95%;descent-override:23.6%;line-gap-override:0%}

/* ---------- paleta de la web: rojo #cc0000 y tinta #1e1e1e (también pisa la índigo de alérgenos) ---------- */
html.estilo-g{
  color-scheme:only light;   /* el modo oscuro del móvil no la oscurece a medias (como la venta de GS) */
  --rojo:#cc0000; --rojo-2:#a80000; --acento:#1e1e1e; --pastel:#fff4f1; --verde:#1e1e1e;
  --tinta:#1e1e1e; --gris:#6d6663; --linea:rgba(30,30,30,.1); --fondo:#fcfbfa; --blanco:#fff;
  --ind:#cc0000; --ind-t:#ffeeeb; --raya:rgba(30,30,30,.08); --humo:#f6f3f1; --tenue:#6d6663; --texto:#34302e;
  --g-titulo:'Inter Tight','Inter Tight reserva',Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --g-texto:Inter,'Inter reserva',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --g-degradado:linear-gradient(135deg,#e3141d,#b00000);
  --g-baldosa:linear-gradient(140deg,#e3141d,#9d0000);
  --g-sombra:0 1px 1px rgba(30,20,20,.03),0 12px 32px -14px rgba(120,20,20,.18);
  --g-sombra-alta:0 2px 4px rgba(30,20,20,.04),0 40px 70px -30px rgba(140,20,20,.35);
  --g-cristal:rgba(255,255,255,.78); --g-borde:rgba(255,255,255,.95);
  --g-curva:cubic-bezier(.2,.75,.2,1); --g-suave:cubic-bezier(.16,1,.3,1);
  background:#fcfbfa;
}
/* las manchas suaves del fondo van en el body (de arriba abajo de la página): así no hacen escalón en ningún borde */
html.estilo-g body{font-family:var(--g-texto);color:#1e1e1e;font-optical-sizing:auto;
  background:radial-gradient(700px 560px at -8% 34%,rgba(230,20,30,.06),transparent 70%),radial-gradient(660px 600px at 108% 56%,rgba(255,140,120,.11),transparent 70%),
    radial-gradient(640px 540px at -6% 82%,rgba(230,20,30,.05),transparent 70%),#fcfbfa}
html.estilo-g ::selection{background:#ffdcd6;color:#1e1e1e}
html.estilo-g h1,html.estilo-g h2,html.estilo-g h3{font-family:var(--g-titulo);text-wrap:balance}
html.estilo-g .marca,html.estilo-g .precio-g,html.estilo-g .pimp,html.estilo-g .vs-n,html.estilo-g .oimp,
html.estilo-g .movil .p,html.estilo-g .pn,html.estilo-g .faq summary{font-family:var(--g-titulo)}
html.estilo-g a:focus-visible,html.estilo-g .btn:focus-visible,html.estilo-g summary:focus-visible{outline:3px solid rgba(204,0,0,.45);outline-offset:3px}
/* los enlaces de texto, en el rojo de la web */
html.estilo-g main a:not([class]){color:#cc0000;text-decoration-color:rgba(204,0,0,.35);text-underline-offset:2px}

/* ---------- barra: una píldora de cristal que flota ---------- */
html.estilo-g .barra{position:sticky;top:10px;z-index:20;width:min(1100px,calc(100% - 24px));margin:12px auto 0;border-radius:999px;
  background:rgba(255,255,255,.62);-webkit-backdrop-filter:saturate(1.8) blur(20px);backdrop-filter:saturate(1.8) blur(20px);
  border:1px solid rgba(255,255,255,.9);box-shadow:0 24px 60px -28px rgba(140,20,20,.45),inset 0 1px 0 #fff}
html.estilo-g .barra .wrap{height:58px;min-height:0;max-width:none;padding:0 9px 0 24px;gap:12px}
html.estilo-g .marca{font-weight:700;color:#1e1e1e;font-size:17px;line-height:1.15;min-width:0}
html.estilo-g .marca span{color:#cc0000}
html.estilo-g .barra .tel{flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
  background:var(--g-degradado);color:rgba(255,255,255,.88);border-radius:999px;padding:10px 18px;font-size:14px;font-weight:600;
  box-shadow:0 10px 24px -12px rgba(204,0,0,.8),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .3s var(--g-curva),box-shadow .3s var(--g-curva)}
html.estilo-g .barra .tel b{color:#fff;font-weight:700}
html.estilo-g .barra .tel:hover{transform:translateY(-1px);box-shadow:0 16px 30px -14px rgba(204,0,0,.85),inset 0 1px 0 rgba(255,255,255,.25)}
/* la franja de oferta de alérgenos, en la tinta de la web */
html.estilo-g .banda{background:#1e1e1e;color:rgba(255,255,255,.86)}
html.estilo-g .banda b{color:#ff8a7f}

/* ---------- portada: blanca, con la aurora roja que se mueve despacio ---------- */
/* sube por debajo de la píldora (12 de margen + 58 de alto + 2 de borde) */
html.estilo-g .barra ~ .hero{margin-top:-72px;padding-top:72px}
html.estilo-g .hero{background:transparent;color:#1e1e1e;position:relative;isolation:isolate;overflow:hidden;overflow:clip;
  padding-bottom:clamp(52px,7vw,92px)}
html.estilo-g .hero::before,html.estilo-g .hero::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(60px);opacity:.75;pointer-events:none}
/* Las dos manchas se miden en % de la portada y se apagan antes de su borde de abajo (también al moverse):
   si el borde las cortara, se vería un escalón; y así valen igual para la landing que para «solicitud recibida». */
html.estilo-g .hero::before{width:max(62%,440px);height:105%;left:-16%;top:-30%;
  background:radial-gradient(closest-side,rgba(230,20,30,.45),transparent);animation:g3-aurora1 18s ease-in-out infinite alternate}
html.estilo-g .hero::after{width:max(52%,380px);height:62%;right:-14%;top:22%;
  background:radial-gradient(closest-side,rgba(255,140,120,.55),transparent);animation:g3-aurora2 22s ease-in-out infinite alternate}
@keyframes g3-aurora1{0%{transform:translate(0,0) scale(1)}50%{transform:translate(14%,6%) scale(1.08)}100%{transform:translate(4%,10%) scale(.96)}}
@keyframes g3-aurora2{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-16%,-8%) scale(1.06)}100%{transform:translate(-6%,-14%) scale(1.1)}}
html.estilo-g .hero .motivo{display:none}   /* la franja de puntos del tema: la web no la lleva */
html.estilo-g .hero .hgrid{padding-top:clamp(34px,5.4vw,70px)}
html.estilo-g .hero .in{padding-top:clamp(34px,5vw,56px)}
html.estilo-g .ojo{background:rgba(255,255,255,.75);color:#cc0000;border:1px solid rgba(204,0,0,.2);border-radius:999px;padding:7px 15px;
  font-size:11.5px;font-weight:700;letter-spacing:.12em;line-height:1.45;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
html.estilo-g .hero h1{color:#1e1e1e;font-weight:700;font-size:clamp(30px,4.4vw,50px);line-height:1.04;letter-spacing:-.045em;margin:20px 0 16px}
html.estilo-g .hero h1 .precio-h1,html.estilo-g .hero h1 .verde{color:#cc0000}
html.estilo-g .hero .lead{color:#4a4543;font-size:18px;line-height:1.62;margin:0 0 26px;max-width:52ch}
html.estilo-g .hero .chips li{background:rgba(255,255,255,.66);border:1px solid var(--g-borde);border-radius:16px;color:#3a3533;padding:10px 14px;
  -webkit-backdrop-filter:blur(14px) saturate(1.5);backdrop-filter:blur(14px) saturate(1.5);box-shadow:0 1px 1px rgba(30,20,20,.03),0 12px 28px -18px rgba(120,20,20,.3)}
html.estilo-g .hero .chips b{color:#cc0000;font-size:10.5px;letter-spacing:.12em}
html.estilo-g .hero .confia{color:#3a3533}
html.estilo-g .hero .tic{color:#cc0000}
html.estilo-g .hero .confia a{border-bottom-color:rgba(30,30,30,.22)}
html.estilo-g .hero .aviso-op{color:#5f5754}   /* sobre la aurora, un punto más oscuro que en la web: contraste 4,5:1 */
html.estilo-g .resenas{color:#34302e;border-bottom-color:rgba(30,30,30,.18)}

/* ---------- la caja de precio: panel oscuro de cristal, como «Precio cerrado» de la web ---------- */
html.estilo-g .reserva{color:#fff;border:1px solid rgba(255,255,255,.07);border-radius:28px;padding:28px 26px;
  background:radial-gradient(120% 70% at 100% 0%,rgba(230,20,30,.38),transparent 62%),radial-gradient(90% 60% at 0% 100%,rgba(255,120,100,.16),transparent 62%),#1e1e1e;
  box-shadow:0 40px 80px -40px rgba(100,10,10,.75),inset 0 1px 0 rgba(255,255,255,.08)}
html.estilo-g .reserva .desde{color:rgba(255,255,255,.62);letter-spacing:.14em;font-size:11px}
html.estilo-g .reserva .precio-g{color:#fff;font-weight:700;letter-spacing:-.05em;font-size:clamp(40px,4.4vw,54px);margin:8px 0 4px}
html.estilo-g .reserva .precio-g s{color:rgba(255,255,255,.45)}
html.estilo-g .reserva .o-bon{color:rgba(255,255,255,.72)}
html.estilo-g .reserva .o-bon b{color:#fff}
html.estilo-g .reserva .puntos i{background:rgba(255,255,255,.14)}
html.estilo-g .reserva .puntos i.on{background:linear-gradient(90deg,#ff5a4f,#cc0000)}
html.estilo-g .reserva .plazas-txt{color:rgba(255,255,255,.72)}
html.estilo-g .reserva .plazas-txt b{color:#fff}
html.estilo-g .reserva .segura{color:rgba(255,255,255,.58)}
html.estilo-g .reserva .fiable{color:rgba(255,255,255,.62)}
html.estilo-g .reserva .fiable a{color:#fff}
html.estilo-g .reserva .regalo{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.16)}

/* ---------- botones: píldora roja con brillo (los de línea, de cristal) ---------- */
html.estilo-g .btn:not(.linea):not(.wa):not(.ver){background:var(--g-degradado);color:#fff;border:0;border-radius:999px;font-weight:650;letter-spacing:-.005em;
  box-shadow:0 14px 30px -14px rgba(204,0,0,.85),inset 0 1px 0 rgba(255,255,255,.25);position:relative;overflow:hidden;
  transition:transform .3s var(--g-curva),box-shadow .3s var(--g-curva)}
html.estilo-g .btn:not(.linea):not(.wa):not(.ver)::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);transition:transform .9s var(--g-suave)}
html.estilo-g .btn:not(.linea):not(.wa):not(.ver):hover{background:linear-gradient(135deg,#d30f18,#9c0000);transform:translateY(-2px);
  box-shadow:0 20px 36px -16px rgba(204,0,0,.9),inset 0 1px 0 rgba(255,255,255,.25)}
html.estilo-g .btn:not(.linea):not(.wa):not(.ver):hover::after{transform:translateX(120%)}
html.estilo-g .btn:not(.linea):not(.wa):not(.ver):active{transform:translateY(0)}
html.estilo-g .btn.linea,html.estilo-g .btn.ver{background:rgba(255,255,255,.72);color:#1e1e1e;border:1px solid rgba(30,30,30,.12);border-radius:999px;font-weight:650;
  box-shadow:0 10px 24px -18px rgba(120,20,20,.35);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:background .2s,border-color .2s,color .2s,transform .3s var(--g-curva)}
html.estilo-g .btn.linea:hover,html.estilo-g .btn.ver:hover{background:#fff;border-color:rgba(204,0,0,.35);color:#cc0000;transform:translateY(-2px)}
html.estilo-g .btn.wa{border-radius:999px;font-weight:650}
html.estilo-g .movil .wa-mini{border-radius:16px}

/* las páginas de «solicitud recibida» y «pago» de estas campañas: centradas y con su tarjeta */
html.estilo-g .in{max-width:820px;margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}
html.estilo-g .in>.card{background:var(--g-cristal);border:1px solid var(--g-borde);border-radius:26px;padding:clamp(20px,3vw,30px);
  box-shadow:var(--g-sombra),inset 0 1px 0 rgba(255,255,255,.9);margin:clamp(28px,4vw,44px) 0}

/* ---------- cuerpo ---------- */
html.estilo-g main{padding:clamp(44px,6vw,76px) 0 36px}
html.estilo-g section{margin:0 0 clamp(46px,6vw,76px)}
html.estilo-g main h2{color:#1e1e1e;font-weight:650;font-size:clamp(26px,3.5vw,40px);letter-spacing:-.04em;line-height:1.06;margin:0 0 10px}
/* la rayita roja de los títulos de la web */
html.estilo-g main section>h2:first-child::before{content:"";display:block;width:40px;height:4px;border-radius:4px;background:linear-gradient(90deg,#ff5a4f,#cc0000);margin:0 0 16px}
html.estilo-g main h3{letter-spacing:-.02em}
html.estilo-g .contrato h2{font-size:24px}   /* la página del contrato conserva sus tamaños de documento */
html.estilo-g .sub{color:#6d6663;font-size:16.5px;line-height:1.62}
html.estilo-g .rot{color:#cc0000;letter-spacing:.14em}

/* tarjetas de cristal */
html.estilo-g .tarjeta{background:var(--g-cristal);border:1px solid var(--g-borde);border-radius:26px;padding:clamp(18px,3vw,30px);box-shadow:var(--g-sombra),inset 0 1px 0 rgba(255,255,255,.9)}
html.estilo-g .pcard{background:var(--g-cristal);border:1px solid var(--g-borde);border-radius:26px;padding:clamp(20px,2.8vw,30px);box-shadow:var(--g-sombra),inset 0 1px 0 rgba(255,255,255,.9)}
html.estilo-g .pcard.destaca{border-color:rgba(204,0,0,.32);box-shadow:var(--g-sombra-alta),inset 0 1px 0 #fff}
html.estilo-g .etiqueta{background:var(--g-degradado);border-radius:999px;padding:5px 13px;font-size:11px;letter-spacing:.1em;box-shadow:0 8px 18px -8px rgba(204,0,0,.6)}
html.estilo-g .pimp{color:#1e1e1e;font-weight:700;letter-spacing:-.05em}
html.estilo-g .pcard.destaca .pimp{color:#cc0000}
/* la letra pequeña que va detrás de una cifra («por persona», «el primer año…») no se aprieta como la cifra */
html.estilo-g .pimp small,html.estilo-g .precio-g small,html.estilo-g .vs-n small{font-family:var(--g-texto);letter-spacing:0}
html.estilo-g .pcard h3{color:#1e1e1e;font-weight:650}
html.estilo-g .pcard p{color:#6d6663}

/* pasos: números en baldosa roja */
html.estilo-g .pn{background:var(--g-baldosa);color:#fff;border-radius:12px;font-weight:700;box-shadow:0 10px 20px -10px rgba(204,0,0,.7),inset 0 1px 0 rgba(255,255,255,.3)}
html.estilo-g .pasos li::before{background:linear-gradient(#ffcfc6,rgba(255,207,198,.15))}
html.estilo-g .pt{color:#34302e}

/* listas con la marca de la web */
html.estilo-g .lista li{color:#34302e}
html.estilo-g .lista li::before{content:"\2713";display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;margin-top:1px;border-radius:50%;
  background:#ffeeeb;color:#cc0000;font-size:12px;font-weight:800;line-height:1}

/* el aviso legal, en tono cálido */
html.estilo-g .legal{background:linear-gradient(180deg,#fff,#fff6f3);border:1px solid rgba(204,0,0,.16);border-radius:22px;box-shadow:var(--g-sombra)}
html.estilo-g .legal h3{color:#a80000}
html.estilo-g .legal p{color:#4a4543}
html.estilo-g .legal-det summary{color:#cc0000;font-weight:650}
html.estilo-g .urg{background:#fff4f1;border:1px solid rgba(204,0,0,.14);border-radius:16px;color:#5f5754}
html.estilo-g .aviso{border-radius:16px}

/* preguntas: una tarjeta de cristal por pregunta, con el «+» rojo a la derecha */
html.estilo-g .tarjeta.faq{background:transparent;border:0;box-shadow:none;padding:0}
html.estilo-g .faq details{background:var(--g-cristal);border:1px solid var(--g-borde);border-radius:20px;box-shadow:var(--g-sombra);margin:0 0 10px;padding:0 clamp(16px,2.4vw,24px)}
html.estilo-g .faq details:last-child{border-bottom:1px solid var(--g-borde);margin-bottom:0}
html.estilo-g .faq summary{justify-content:space-between;align-items:center;gap:14px;padding:17px 0;color:#1e1e1e;font-weight:600;font-size:17px;letter-spacing:-.015em}
html.estilo-g .faq summary::before{order:2;flex:0 0 28px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#ffeeeb;color:#cc0000;
  font-family:var(--g-texto);font-size:17px;font-weight:700;line-height:1}
html.estilo-g .faq details[open] summary::before{background:var(--g-degradado);color:#fff}
html.estilo-g .faq p{margin:0 0 18px;color:#5f5754}

/* «antes de pagar, compruébalo» y «qué tienes»: tarjetas con el icono en baldosa de degradado */
html.estilo-g .que div{background:var(--g-cristal);border:1px solid var(--g-borde);border-radius:22px;padding:22px 20px 20px;box-shadow:var(--g-sombra)}
html.estilo-g .que i{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--g-baldosa);color:#fff;
  font-style:normal;font-size:17px;font-weight:700;letter-spacing:0;line-height:1;box-shadow:0 12px 24px -10px rgba(204,0,0,.6),inset 0 1px 0 rgba(255,255,255,.3)}
html.estilo-g .que b{color:#1e1e1e;font-family:var(--g-titulo);font-weight:650;letter-spacing:-.015em;margin:14px 0 4px}
html.estilo-g .que p{color:#6d6663}

/* comparativas (alérgenos) */
html.estilo-g .vs>div{border-radius:26px}
html.estilo-g .vs-mal{background:linear-gradient(180deg,#fff,#fbf5f3);border:1px solid rgba(30,30,30,.08);box-shadow:var(--g-sombra)}
html.estilo-g .vs-bien{background:rgba(255,255,255,.88);border:1px solid rgba(204,0,0,.3);box-shadow:var(--g-sombra-alta)}
html.estilo-g .vs-t,html.estilo-g .vs-mal .vs-t{color:#6d6663;letter-spacing:.12em}
html.estilo-g .vs-n{font-weight:700;letter-spacing:-.045em}
html.estilo-g .vs-mal .vs-n{color:#1e1e1e}
html.estilo-g .vs-bien .vs-n{color:#cc0000}
html.estilo-g .vs p{color:#6d6663}
html.estilo-g .suena li::before{color:#cc0000}
html.estilo-g .suena-p{border-left-color:#cc0000}

/* los 16 documentos: panel oscuro con su aurora */
html.estilo-g .docs{border-radius:32px;background:radial-gradient(70% 90% at 0% 0%,rgba(230,20,30,.32),transparent 60%),radial-gradient(60% 80% at 100% 100%,rgba(255,130,110,.18),transparent 60%),#1e1e1e;
  box-shadow:0 40px 80px -40px rgba(100,10,10,.65)}
html.estilo-g .docs .rot{color:#ff8a7f}
html.estilo-g .docs h2{color:#fff}
html.estilo-g .docs .sub{color:rgba(255,255,255,.66)}
html.estilo-g .docs li{color:rgba(255,255,255,.88)}
html.estilo-g .docs li b{color:#ff7468}

/* el bloque de la carta del QR */
html.estilo-g .franja{background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(251,243,241,.9));border:1px solid var(--g-borde);border-radius:clamp(22px,3vw,32px);box-shadow:var(--g-sombra)}
html.estilo-g .qr-pasos b{background:var(--g-baldosa);color:#fff;box-shadow:0 8px 16px -8px rgba(204,0,0,.6)}
html.estilo-g .qr-pasos span{color:#34302e}
html.estilo-g .qr-pasos i{color:#1e1e1e}
html.estilo-g .movilqr{background:#1e1e1e}

/* ---------- formulario: el mismo, con los bordes y el foco de la web ---------- */
html.estilo-g input:not([type=checkbox]):not([type=radio]),html.estilo-g select{border-color:rgba(30,30,30,.16);border-radius:12px}
html.estilo-g input:not([type=checkbox]):not([type=radio]):focus,html.estilo-g select:focus{outline:0;border-color:#cc0000;box-shadow:0 0 0 4px rgba(204,0,0,.12)}
html.estilo-g form label{color:#4a4543}
html.estilo-g .elige{color:#6d6663;letter-spacing:.1em}
html.estilo-g .opcion label{border:1px solid rgba(30,30,30,.12);border-radius:18px;background:#fff}
html.estilo-g .opcion label:has(input:checked){border-color:#cc0000;background:#fff5f3;box-shadow:0 14px 28px -18px rgba(204,0,0,.55)}
html.estilo-g .opcion .oimp{color:#cc0000;letter-spacing:-.04em}
html.estilo-g .opcion input,html.estilo-g .acepto input,html.estilo-g label.check input{accent-color:#cc0000}
html.estilo-g .acepto{color:#5f5754}
html.estilo-g .acepto a{color:#cc0000}
/* la casilla de privacidad de la lista de espera, al lado de su frase (salía sola en una línea) */
html.estilo-g form label.check{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;font-weight:400;line-height:1.5;color:#5f5754;margin:6px 0 0}
html.estilo-g form label.check input{width:auto;flex:none;margin-top:3px}
html.estilo-g main .aviso a:not([class]){color:inherit;text-decoration-color:currentColor}

/* ---------- la reserva: panel oscuro redondeado, como las llamadas a la acción de la web ---------- */
html.estilo-g section#inscribirme{scroll-margin-top:84px;color:#fff;border-radius:40px;padding:clamp(28px,5vw,56px) clamp(18px,4.6vw,52px);
  background:radial-gradient(70% 60% at 0% 0%,rgba(230,20,30,.42),transparent 62%),radial-gradient(60% 50% at 100% 100%,rgba(255,130,110,.22),transparent 62%),#1e1e1e;
  box-shadow:0 40px 80px -40px rgba(100,10,10,.7)}
html.estilo-g section#inscribirme>h2{color:#fff}
html.estilo-g section#inscribirme>.sub{color:rgba(255,255,255,.74)}
html.estilo-g section#inscribirme>.wa-linea{color:rgba(255,255,255,.74)}
html.estilo-g section#inscribirme>.wa-linea a{color:#fff}
html.estilo-g section#inscribirme>.wa-linea a[href*="wa.me"]{color:#5ee08f}
html.estilo-g section#inscribirme>.urg{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:rgba(255,255,255,.86)}
html.estilo-g section#inscribirme>.tarjeta{background:#fff;color:#1e1e1e;border:0;box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}

/* ---------- barra fija del móvil, de cristal ---------- */
html.estilo-g .movil{background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(1.8) blur(20px);backdrop-filter:saturate(1.8) blur(20px);
  border-top:1px solid rgba(255,255,255,.9);border-radius:22px 22px 0 0;box-shadow:0 -18px 40px -24px rgba(120,20,20,.4)}
html.estilo-g .movil .p{color:#1e1e1e;font-weight:700;letter-spacing:-.04em}
html.estilo-g .movil .p small{font-family:var(--g-texto);letter-spacing:0;color:#6d6663}

/* ---------- pie oscuro y redondeado, como el de la web ---------- */
html.estilo-g .pie{background:radial-gradient(60% 140% at 72% 140%,rgba(204,0,0,.32),transparent 70%),#1e1e1e;color:rgba(255,255,255,.62);border-top:0;
  border-radius:40px 40px 0 0;margin-top:clamp(24px,4vw,48px);padding:clamp(34px,5vw,52px) 0 clamp(40px,5vw,56px)}
html.estilo-g .pie b{color:#fff}
html.estilo-g .pie a{color:rgba(255,255,255,.88)}

@media (max-width:899px){
  /* el hueco que deja la barra fija de abajo, del color del pie */
  html.estilo-g .pie{box-shadow:0 90px 0 #1e1e1e}
}
@media (max-width:599px){
  html.estilo-g .barra{top:8px;width:calc(100% - 16px);margin-top:8px}
  html.estilo-g .barra .wrap{height:56px;padding:0 6px 0 16px;gap:10px}
  html.estilo-g .marca{font-size:14.5px}
  html.estilo-g .barra .tel{font-size:12.5px;padding:9px 13px}
  html.estilo-g .barra ~ .hero{margin-top:-66px;padding-top:66px}
  html.estilo-g .hero h1{font-size:29px;letter-spacing:-.04em;line-height:1.08}
  html.estilo-g .hero .lead{font-size:16.5px}
  html.estilo-g .hero::before{opacity:.5} html.estilo-g .hero::after{opacity:.6}   /* en el móvil la aurora queda detrás del texto: más suave */
  html.estilo-g .reserva{padding:20px 20px 22px;border-radius:24px}
  html.estilo-g main h2{font-size:26px}
  html.estilo-g .faq summary{font-size:16px}
  /* la reserva llega a los bordes: el formulario no pierde ancho en el móvil */
  html.estilo-g section#inscribirme{margin-left:-20px;margin-right:-20px;border-radius:30px;padding:30px 14px 16px}
  html.estilo-g section#inscribirme>h2,html.estilo-g section#inscribirme>.sub,html.estilo-g section#inscribirme>.wa-linea{padding:0 6px}
  html.estilo-g section#inscribirme>.tarjeta{border-radius:22px}
  html.estilo-g .pie{border-radius:30px 30px 0 0}
}
@media (prefers-reduced-motion:reduce){
  html.estilo-g .hero::before,html.estilo-g .hero::after{animation:none}
  html.estilo-g .btn,html.estilo-g .btn::after,html.estilo-g .barra .tel{transition:none}
}
@media print{   /* al imprimir no hay fondos: el pie y el teléfono, en tinta; sin aurora ni bloque negro al final */
  html.estilo-g .pie{box-shadow:none;background:none;color:#1e1e1e}
  html.estilo-g .pie b,html.estilo-g .pie a{color:#1e1e1e}
  html.estilo-g .barra .tel{background:none;box-shadow:none;color:#1e1e1e}
  html.estilo-g .barra .tel b{color:#1e1e1e}
  html.estilo-g .hero::before,html.estilo-g .hero::after{display:none}
}

/* «Reducir movimiento» en los botones (02-10-2026, tarde). El bloque de arriba (transition:none en
   html.estilo-g .btn) no llegaba a los botones rojos ni a los de línea: sus reglas tienen más especificidad
   (:not(.linea):not(.wa):not(.ver)). Aquí, con la misma y después, se quitan la transición, el brillo y el salto. */
@media (prefers-reduced-motion:reduce){
  html.estilo-g .btn:not(.linea):not(.wa):not(.ver),html.estilo-g .btn:not(.linea):not(.wa):not(.ver)::after,
  html.estilo-g .btn.linea,html.estilo-g .btn.ver{transition:none}
  html.estilo-g .btn:not(.linea):not(.wa):not(.ver):hover,html.estilo-g .btn.linea:hover,html.estilo-g .btn.ver:hover,
  html.estilo-g .barra .tel:hover{transform:none}
}

/* «¿Dudas?» de la píldora del teléfono (revisión, 02-10-2026, tarde): a rgba(255,255,255,.88) se quedaba en
   unos 4,2:1 sobre la parte clara del degradado rojo (#e3141d); en blanco, 4,8:1, como el número. Solo en
   pantalla: al imprimir manda la regla de print de arriba (tinta sobre blanco). */
@media screen{
  html.estilo-g .barra .tel{color:#fff}
}

/* =====================================================================================
   /encargo · el encargo de gestión firmable (encFormulario en server.js), 02-10-2026
   Pone class="estilo-g g-enc" en <html>: todo lo de aquí cuelga de html.estilo-g.g-enc.
   · SOLO aspecto: campos, firma (canvas), opciones, forma de pago, condiciones y envío, iguales.
   · No se toca ningún display: la firma, el error y el campo trampa se enseñan y esconden por
     clase o por JS. El lienzo de la firma conserva su alto (160) y su borde de 2 px.
   · Su .barra es la del botón de enviar, fija ABAJO: aquí se deshace la píldora de cristal que
     las landings ponen ARRIBA con ese mismo nombre (incluido lo que cambia en el móvil).
   · Sin aurora animada: es una página para firmar con el dedo, y una capa desenfocada moviéndose
     detrás gasta batería y puede dar tirones al trazar. La aurora va quieta, en el fondo.
   ===================================================================================== */
html.estilo-g.g-enc body{background:radial-gradient(760px 440px at 6% -8%,rgba(230,20,30,.15),transparent 70%),
  radial-gradient(640px 460px at 104% 0%,rgba(255,140,120,.24),transparent 70%),
  radial-gradient(700px 560px at -8% 50%,rgba(230,20,30,.05),transparent 70%),
  radial-gradient(660px 600px at 108% 78%,rgba(255,140,120,.1),transparent 70%),#fcfbfa}
html.estilo-g.g-enc input,html.estilo-g.g-enc button{font-family:inherit}
html.estilo-g.g-enc .fw{padding:18px 16px 44px}

/* cabecera: tarjeta de cristal con el logo y el título en la letra de los titulares */
html.estilo-g.g-enc .cab{background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.95);border-radius:28px;padding:18px 22px;gap:16px;
  -webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);
  box-shadow:0 24px 60px -30px rgba(140,20,20,.45),inset 0 1px 0 #fff}
html.estilo-g.g-enc .cab h1{font-weight:700;font-size:clamp(25px,4vw,32px);line-height:1.05;letter-spacing:-.04em;color:#1e1e1e}
html.estilo-g.g-enc .cab p{margin-top:6px;color:#cc0000;font-weight:600;font-size:14px}
html.estilo-g.g-enc .intro{margin:16px 4px 0;font-size:15px;line-height:1.6;color:#4a4543}
html.estilo-g.g-enc .intro b{color:#1e1e1e}

/* los cuatro pasos: tarjetas de cristal con el número en baldosa roja */
html.estilo-g.g-enc .caja-s{background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.95);border-radius:26px;padding:clamp(18px,3vw,28px);margin-top:16px;
  box-shadow:var(--g-sombra),inset 0 1px 0 rgba(255,255,255,.9)}
html.estilo-g.g-enc h2{gap:11px;margin:0 0 16px;font-size:14px;font-weight:700;letter-spacing:.12em;color:#1e1e1e}
html.estilo-g.g-enc h2 .n{width:30px;height:30px;border-radius:10px;background:var(--g-baldosa);color:#fff;font-size:14px;font-weight:700;letter-spacing:0;
  box-shadow:0 10px 20px -10px rgba(204,0,0,.7),inset 0 1px 0 rgba(255,255,255,.3)}
html.estilo-g.g-enc .nota{color:#6d6663}

/* datos del cliente (los bordes y el foco rojo son los de la hoja de arriba) */
html.estilo-g.g-enc .campos{gap:12px 14px}
html.estilo-g.g-enc .cp label{margin-bottom:5px;font-size:12.5px;font-weight:650}
html.estilo-g.g-enc .cp input{background:#fff;padding:12px 13px;transition:border-color .2s,box-shadow .2s}

/* las opciones de cada servicio: tarjetas blancas; la marcada, con borde rojo y su firma dentro */
html.estilo-g.g-enc .serv+.serv{margin-top:24px}
html.estilo-g.g-enc .serv-t b{font-family:var(--g-titulo);font-size:20px;font-weight:650;letter-spacing:-.025em}
html.estilo-g.g-enc .ops{gap:12px;margin-top:12px}
html.estilo-g.g-enc .op{border:1px solid rgba(30,30,30,.12);border-radius:20px;background:#fff;padding:14px 15px;
  box-shadow:0 1px 1px rgba(30,20,20,.03),0 12px 26px -20px rgba(120,20,20,.4);transition:border-color .2s,box-shadow .2s,background .2s}
html.estilo-g.g-enc .op:hover{border-color:rgba(204,0,0,.3)}
html.estilo-g.g-enc .op.on{border-color:#cc0000;background:#fff7f5;box-shadow:0 0 0 3px rgba(204,0,0,.1),0 18px 34px -20px rgba(204,0,0,.55)}
html.estilo-g.g-enc .op-cab{border-radius:12px}
html.estilo-g.g-enc .op-cab:focus-visible{outline:3px solid rgba(204,0,0,.45);outline-offset:4px}
html.estilo-g.g-enc .caja{border-radius:8px}
html.estilo-g.g-enc .op.on .caja{background:var(--g-degradado);border-color:#cc0000;box-shadow:0 6px 14px -6px rgba(204,0,0,.7)}
html.estilo-g.g-enc .op-nom b{font-family:var(--g-titulo);font-size:16.5px;font-weight:650;letter-spacing:-.015em}
html.estilo-g.g-enc .op-pre b{font-family:var(--g-titulo);font-size:26px;font-weight:700;letter-spacing:-.045em}
html.estilo-g.g-enc .op.on .op-pre b{color:#cc0000}
html.estilo-g.g-enc .op-txt{color:#4a4543;line-height:1.55}
html.estilo-g.g-enc .op-firma canvas{border-color:rgba(204,0,0,.42);border-radius:16px}
html.estilo-g.g-enc .op.firmada .op-firma canvas{border-color:rgba(30,30,30,.2)}
html.estilo-g.g-enc .borra{border:1px solid rgba(30,30,30,.14);border-radius:999px;background:#fff;padding:6px 14px;font-weight:600;color:#1e1e1e;transition:border-color .2s,color .2s}
html.estilo-g.g-enc .borra:hover{border-color:rgba(204,0,0,.4);color:#cc0000}
html.estilo-g.g-enc .quita{color:#6d6663}
html.estilo-g.g-enc .quita:hover{color:#cc0000}
html.estilo-g.g-enc .borra:focus-visible,html.estilo-g.g-enc .quita:focus-visible,html.estilo-g.g-enc .enviar:focus-visible{outline:3px solid rgba(204,0,0,.45);outline-offset:3px}
html.estilo-g.g-enc .cuota{margin-top:16px;background:#fff4f1;border:1px solid rgba(204,0,0,.14);border-radius:16px;padding:12px 15px;color:#34302e;line-height:1.55}
html.estilo-g.g-enc .cuota b{color:#1e1e1e}

/* forma de pago: cada opción, una píldora; la elegida, en rojo */
html.estilo-g.g-enc .pagos{gap:10px}
html.estilo-g.g-enc .pg{border:1px solid rgba(30,30,30,.12);border-radius:999px;background:#fff;padding:9px 16px 9px 12px;color:#1e1e1e;
  box-shadow:0 10px 22px -18px rgba(120,20,20,.35);transition:border-color .2s,background .2s,box-shadow .2s}
html.estilo-g.g-enc .pg:hover{border-color:rgba(204,0,0,.3)}
html.estilo-g.g-enc .pg:has(input:checked){border-color:#cc0000;background:#fff5f3;box-shadow:0 14px 28px -18px rgba(204,0,0,.55)}
html.estilo-g.g-enc .pg input{width:18px;height:18px;margin:0}

/* condiciones: el desplegable y la casilla, en su tarjeta blanca */
html.estilo-g.g-enc details{background:#fff;border:1px solid rgba(30,30,30,.1);border-radius:16px;padding:12px 16px;margin:0 0 12px;color:#4a4543}
html.estilo-g.g-enc summary{margin:0;color:#cc0000;font-weight:650}
html.estilo-g.g-enc details[open] summary{margin-bottom:10px}
html.estilo-g.g-enc details p b{color:#1e1e1e}
html.estilo-g.g-enc .ck{border:1px solid rgba(30,30,30,.12);border-radius:16px;background:#fff;padding:13px 14px;color:#34302e;transition:border-color .2s,background .2s}
html.estilo-g.g-enc .ck:has(input:checked){border-color:#cc0000;background:#fff5f3}
html.estilo-g.g-enc .err{border-radius:16px;background:#fff4f1;border-color:rgba(204,0,0,.32);color:#8a1010}

/* la barra del botón, fija abajo como estaba: se deshace la píldora de arriba de las landings */
html.estilo-g.g-enc .barra{position:sticky;top:auto;bottom:0;z-index:auto;width:auto;margin:8px 0 0;border:0;border-radius:0;box-shadow:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;padding:22px 0 10px;background:linear-gradient(rgba(252,251,250,0),#fcfbfa 30%)}
html.estilo-g.g-enc .enviar{border-radius:999px;background:var(--g-degradado);padding:16px 20px;font-weight:650;letter-spacing:-.005em;position:relative;overflow:hidden;
  box-shadow:0 14px 30px -14px rgba(204,0,0,.85),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .3s var(--g-curva),box-shadow .3s var(--g-curva)}
html.estilo-g.g-enc .enviar::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);transition:transform .9s var(--g-suave)}
html.estilo-g.g-enc .enviar:not(:disabled):hover{background:linear-gradient(135deg,#d30f18,#9c0000);transform:translateY(-2px);
  box-shadow:0 20px 36px -16px rgba(204,0,0,.9),inset 0 1px 0 rgba(255,255,255,.25)}
html.estilo-g.g-enc .enviar:not(:disabled):hover::after{transform:translateX(120%)}
html.estilo-g.g-enc .enviar:not(:disabled):active{transform:translateY(0)}
html.estilo-g.g-enc .prueba{margin-top:10px;color:#6d6663}   /* antes #8b8480: no llegaba a 4,5:1 sobre el fondo */

@media (max-width:560px){
  html.estilo-g.g-enc .cab{border-radius:24px;padding:14px 16px;gap:12px}
  html.estilo-g.g-enc .cab img{height:40px}
  html.estilo-g.g-enc .caja-s{border-radius:22px}
}
@media (prefers-reduced-motion:reduce){
  html.estilo-g.g-enc .op,html.estilo-g.g-enc .pg,html.estilo-g.g-enc .ck,html.estilo-g.g-enc .borra,html.estilo-g.g-enc .cp input,
  html.estilo-g.g-enc .enviar,html.estilo-g.g-enc .enviar::after{transition:none}
  html.estilo-g.g-enc .enviar:not(:disabled):hover{transform:none}
}
@media print{
  html.estilo-g.g-enc body{background:#fff}
  html.estilo-g.g-enc .barra{position:static;background:none}
  html.estilo-g.g-enc .cab{-webkit-backdrop-filter:none;backdrop-filter:none}
}
