/* Brand mark: fuchsia and white stand out against the golden field. */
.brand>img{width:44px;height:44px;object-fit:contain}
.monogram{color:#fff}
.monogram img{width:76%;height:76%;object-fit:contain;padding:18px;border-radius:34px;background:#fff;box-shadow:0 18px 40px rgba(50,16,71,.24)}
.mobile-whatsapp{display:none}

/* Llamada a la acción visual dentro de “Un espacio para hablar”. */
.free-mentoring-banner{display:flex;align-items:center;gap:22px;max-width:660px;margin:30px 0;padding:24px 28px;border:2px solid #f8d96f;border-radius:22px;background:linear-gradient(110deg,#fff 0 64%,#ffe681 100%);color:#451253;text-decoration:none;box-shadow:0 18px 42px rgba(17,3,24,.3);transition:transform .2s ease,box-shadow .2s ease}
.free-mentoring-banner:hover{transform:translateY(-3px);box-shadow:0 22px 50px rgba(17,3,24,.38)}
.free-banner-icon{display:grid;flex:0 0 72px;width:72px;height:72px;place-items:center;border-radius:50%;background:#d80a79;color:#fff}
.free-banner-icon svg{width:40px;height:40px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.free-banner-copy{display:flex;min-width:0;flex-direction:column;gap:5px}
.free-banner-copy small{color:#7e397f;font-size:.82rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.free-banner-copy strong{color:#d80a79;font:600 clamp(1.65rem,3vw,2.45rem)/1 'Playfair Display',serif;letter-spacing:.015em}
.free-banner-copy em{color:#5b2468;font:600 .92rem 'DM Sans',sans-serif;font-style:normal}

/* Mobile refinements. */
html,body{max-width:100%;overflow-x:hidden}
@media(max-width:820px){
  .nav{height:74px}
  .hero{gap:48px;padding-block:48px 72px}
  .hero-copy{max-width:680px}
  .hero-art{width:100%;margin-inline:auto}
  .crisis,.listen-section,.contact{padding-block:76px}
  .method-grid article{min-height:285px}
  .about{gap:58px}
  .monogram{width:100%;max-width:520px;margin-inline:auto}
}
@media(max-width:520px){
  .wrap{width:calc(100% - 32px)}
  .nav{height:68px}
  .brand{gap:9px;font-size:.88rem}
  .brand>img{width:34px;height:34px}
  .nav-cta{font-size:.86rem}
  .hero{gap:38px;padding-block:42px 62px}
  .hero h1{font-size:clamp(2.65rem,13vw,3.2rem);line-height:1.02}
  .lead{font-size:1.04rem;margin-block:24px 28px}
  .actions,.contact-actions{width:100%}
  .actions .button,.contact-actions .button{width:100%;min-height:54px;text-align:center}
  .trust{flex-wrap:wrap;row-gap:7px;margin-top:30px}
  .hero-art{height:420px;border-radius:24px 92px 24px 24px;box-shadow:12px 14px 0 #f1d477}
  .photo-caption{left:22px;bottom:20px}
  .photo-caption span{font-size:1.3rem}
  .crisis,.listen-section,.contact{padding-block:64px}
  .crisis h2,.section h2,.listen-section h2,.contact h2{font-size:clamp(2.25rem,11vw,3rem)}
  .section{padding-block:68px}
  .section-head{gap:18px;margin-bottom:34px}
  .method-grid article{padding:26px 22px;min-height:0}
  .method-grid article:hover,.method-grid .active{transform:none}
  .letter{margin:26px 0 16px;font-size:3.8rem}
  .paths article{padding:30px 22px}
  .path-number{margin-bottom:24px}
  .listen-grid{gap:30px}
  .free-mentoring-banner{gap:15px;margin:26px 0;padding:19px 17px;border-radius:18px}
  .free-banner-icon{flex-basis:54px;width:54px;height:54px}
  .free-banner-icon svg{width:30px;height:30px}
  .free-banner-copy strong{font-size:1.48rem}
  .privacy-card{padding:26px 22px}
  .monogram{height:280px;box-shadow:-12px 14px 0 #eadff0}
  .monogram img{width:78%;height:78%;padding:12px;border-radius:24px}
  .credentials{gap:8px}
  .credentials span{font-size:.78rem}
  .contact-inner{gap:30px}
  .email-link{font-size:.94rem}
  footer{gap:9px;padding-block:26px 92px}
  .mobile-whatsapp{position:fixed;z-index:20;display:flex;align-items:center;justify-content:center;gap:12px;right:16px;bottom:16px;min-height:52px;padding:0 20px;border-radius:999px;background:var(--fuchsia);color:#fff;text-decoration:none;font-weight:600;box-shadow:0 10px 28px rgba(50,16,71,.32)}
}

/* Tarjeta de privacidad: cálida, visible y alineada con la identidad DM */
.privacy-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,#5a246b,#3f164f);
  border:2px solid #f6d56a;
  border-radius:22px;
  box-shadow:0 0 0 1px rgba(255,247,194,.45),0 22px 55px rgba(24,5,34,.3);
}
.privacy-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:20px;
  box-shadow:inset 0 0 24px rgba(255,220,111,.12);
}
.privacy-card h3{color:#f8d96f;margin-top:0}
.privacy-card p{color:#fff}
.privacy-card small{color:#e2d5e6}

/* Contacto: jerarquía clara, redes separadas y cierre profesional */
.contact-heading{max-width:640px}
.contact-options{grid-template-columns:minmax(0,1fr) 178px;column-gap:36px;row-gap:20px;align-items:start}
.contact-options>.contact-intro,.contact-options>.contact-actions,.contact-options>.social-area{grid-column:1}
.contact-options>.contact-intro{margin:0;max-width:560px}
.contact-options>.contact-actions{margin-top:2px;align-items:center}
.contact-email-button{border:1px solid rgba(255,255,255,.52);color:#fff}
.contact-email-button:hover{border-color:#f8d96f;color:#f8d96f}
.contact-options>.qr-card{grid-column:2;grid-row:1/4;align-self:start;border-radius:16px}
.social-area{padding-top:20px;border-top:1px solid rgba(255,255,255,.18)}
.social-label{display:block;margin-bottom:12px;color:#d8c9dd;font-size:.84rem;letter-spacing:.08em;text-transform:uppercase}
.social-links{display:flex;gap:12px;flex-wrap:wrap}
.social-links a{display:inline-flex;width:48px;height:48px;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.32);border-radius:50%;color:#fff;text-decoration:none;transition:.2s ease}
.social-links a:hover{border-color:#f8d96f;color:#f8d96f;transform:translateY(-2px)}
.social-links svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.social-links .fill-icon,.social-links .fill-dot{fill:currentColor;stroke:none}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:34px}
.site-footer>div{display:flex;flex-direction:column;gap:3px}
.site-footer>div span,.site-footer>small{color:#766c7a;font-size:.82rem}
@media(max-width:820px){
  .contact-options{grid-template-columns:1fr}
  .contact-options>.contact-intro,.contact-options>.contact-actions,.contact-options>.social-area,.contact-options>.qr-card{grid-column:1}
  .contact-options>.qr-card{grid-row:auto;margin-top:4px}
  .site-footer{flex-direction:column;gap:16px;text-align:center}
  .site-footer>div{align-items:center}
}
@media(max-width:520px){
  .contact-options>.contact-actions{align-items:stretch}
  .contact-options>.qr-card{width:178px;margin-inline:auto}
  .social-links{justify-content:center}
}

/* Contacto por bloques: tres caminos claros, sin ruido visual */
.contact-panel{display:block}
.contact-panel .contact-heading{max-width:760px;margin:0 auto 48px;text-align:center}
.contact-panel .contact-heading h2{margin-bottom:18px}
.contact-panel .contact-heading>p:last-child{max-width:640px;margin-inline:auto;color:#d8c9dd}
.contact-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.22);border-bottom:1px solid rgba(255,255,255,.22)}
.contact-card{position:relative;display:flex;min-width:0;min-height:360px;flex-direction:column;align-items:center;padding:42px 30px;text-align:center}
.contact-card+.contact-card{border-left:1px solid rgba(255,255,255,.22)}
.contact-icon{display:grid;width:50px;height:50px;place-items:center;margin-bottom:18px;color:#f8d96f}
.contact-icon svg{width:36px;height:36px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.contact-card h3{margin:0 0 14px;color:#fff;font:600 1.25rem 'DM Sans',sans-serif;text-transform:uppercase;letter-spacing:.06em}
.contact-card p{margin:0 auto 22px;color:#d8c9dd;line-height:1.6}
.contact-card-link{margin-top:auto;color:#fff;font-weight:600;text-underline-offset:5px;overflow-wrap:anywhere}
.contact-card-link:hover{color:#f8d96f}
.compact-qr{display:flex;align-items:center;gap:10px;margin-top:18px;color:#d8c9dd;text-decoration:none}
.compact-qr img{width:58px;height:58px;border:5px solid #fff;border-radius:8px}
.compact-qr small{font-size:.76rem;text-transform:uppercase;letter-spacing:.06em}
.contact-card .social-links{margin-top:auto;justify-content:center}
@media(max-width:900px){
  .contact-cards{grid-template-columns:1fr}
  .contact-card{min-height:0;padding:38px 24px}
  .contact-card+.contact-card{border-left:0;border-top:1px solid rgba(255,255,255,.22)}
  .contact-card-link,.contact-card .social-links{margin-top:4px}
}