/* Darling Digital Pro: estilos compartidos (botón de guía gratis, formulario y botones de compartir) */

/* ---------- Botón "Recibe mi guía gratis" ---------- */
.guia-row{display:flex; justify-content:center; margin-top:14px;}
.guia-btn{
  display:inline-flex; align-items:center; gap:10px; cursor:pointer;
  padding:14px 26px; border-radius:999px; font:inherit; font-family:'Inter',system-ui,sans-serif;
  font-size:13px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:#D4AF37; background:rgba(212,175,55,.08); border:1px dashed rgba(212,175,55,.7);
  transition:background .2s, border-color .2s, transform .15s;
}
.guia-btn:hover{background:rgba(212,175,55,.16); border-style:solid; transform:translateY(-1px);}
.guia-btn:focus-visible{outline:2px solid #F2F0EE; outline-offset:3px;}
.guia-btn svg{width:18px; height:18px; flex-shrink:0;}

/* ---------- Formulario (ventana) ---------- */
#guia-modal{position:fixed; inset:0; z-index:99999; overflow-y:auto; display:flex; padding:24px 16px;
  background:rgba(5,5,5,.82); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  font-family:'Inter',system-ui,sans-serif; color:#F2F0EE; -webkit-font-smoothing:antialiased;}
#guia-modal[hidden]{display:none}
html.guia-open, html.guia-open body{overflow:hidden}
#guia-modal .lg-card{position:relative; margin:auto; width:100%; max-width:440px; padding:34px 28px; border-radius:20px; background:#141414;
  border:1px solid rgba(212,175,55,.35); box-shadow:0 30px 80px -30px rgba(0,0,0,.9); text-align:left;}
#guia-modal .lg-close{position:absolute; top:12px; right:12px; width:36px; height:36px; border-radius:50%; border:1px solid #545454; background:transparent;
  color:#cfcfcf; font-size:20px; line-height:1; cursor:pointer; display:grid; place-items:center; padding:0; box-shadow:none;}
#guia-modal .lg-close:hover{border-color:#cfcfcf; color:#fff}
#guia-modal .lg-gift{display:block; width:44px; height:44px; margin:0 auto 10px; color:#D4AF37;}
#guia-modal .lg-brand{margin:0 0 6px; text-align:center; font-family:'Playfair Display',serif; font-size:15px; letter-spacing:.08em; color:#cfcfcf;}
#guia-modal .lg-brand b{font-weight:500; color:#E52B2B;}
#guia-modal h2{margin:0 0 10px; text-align:center; font-family:'Playfair Display',serif; font-weight:500; font-size:26px; line-height:1.25; color:#F2F0EE;}
#guia-modal .lg-sub{margin:0 0 22px; text-align:center; font-size:14px; line-height:1.6; color:#9A9A9A;}
#guia-modal label{display:block; margin:0 0 6px; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#D4AF37;}
#guia-modal input[type=text],#guia-modal input[type=email],#guia-modal input[type=tel]{width:100%; margin:0 0 16px; padding:13px 14px; font:inherit; font-size:16px; color:#F2F0EE;
  background:#0E0E0E; border:1px solid #545454; border-radius:10px; box-sizing:border-box;}
#guia-modal input::placeholder{color:#666}
#guia-modal input:focus{outline:2px solid #D4AF37; outline-offset:1px; border-color:#D4AF37}
#guia-modal input[aria-invalid=true]{border-color:#E52B2B}
#guia-modal .lg-consent{display:flex; gap:10px; align-items:flex-start; margin:2px 0 6px; font-size:12.5px; line-height:1.5; color:#9A9A9A; text-transform:none; letter-spacing:0; font-weight:400;}
#guia-modal .lg-consent input{margin-top:3px; accent-color:#E52B2B; flex-shrink:0}
#guia-modal .lg-consent a{color:#D4AF37}
#guia-modal .lg-err{min-height:18px; margin:6px 0 10px; font-size:12.5px; color:#ff6b6b;}
#guia-modal .lg-send{width:100%; padding:15px 20px; font:inherit; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; cursor:pointer;
  color:#fff; background:#E52B2B; border:0; border-radius:10px; box-shadow:0 0 24px -4px rgba(229,43,43,.5);}
#guia-modal .lg-send:hover{opacity:.92} #guia-modal .lg-send:disabled{opacity:.6; cursor:default}
#guia-modal .lg-send:focus-visible{outline:2px solid #F2F0EE; outline-offset:2px}
#guia-modal .lg-done{text-align:center}
#guia-modal .lg-done p{margin:0 0 22px; font-size:15px; line-height:1.6; color:#cfcfcf}
/* Trampa invisible para robots: las personas no ven este campo */
#guia-modal .lg-hp{position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden;}

/* ---------- Precios largos en celular (ej. US$16,60/mes) ---------- */
@media (max-width:480px){
  .price-card .price-big{font-size:clamp(28px, 9.5vw, 40px); overflow-wrap:anywhere;}
}

/* ---------- Compartir ---------- */
.share-box{max-width:520px; margin:0 auto; padding:40px 20px 10px; text-align:center; font-family:'Inter',system-ui,sans-serif;}
.share-title{margin:0 0 16px; font-size:12px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-foreground, #9A9A9A);}
.share-btns{display:flex; flex-wrap:wrap; gap:10px; justify-content:center;}
.share-btn{display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius:999px; cursor:pointer;
  font:inherit; font-size:13px; font-weight:600; text-decoration:none; color:var(--foreground, #F2F0EE);
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.18); transition:border-color .2s, background .2s;}
.share-btn:hover{background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.4);}
.share-btn:focus-visible{outline:2px solid var(--foreground, #F2F0EE); outline-offset:2px;}
.share-btn svg{width:18px; height:18px; flex-shrink:0;}
.share-btn.wa svg{color:#25D366} .share-btn.fb svg{color:#1877F2}
.share-btn.copied{border-color:#25D366; color:#25D366;}
.share-hint{min-height:20px; margin:12px 0 0; font-size:13px; color:var(--muted-foreground, #9A9A9A);}
