@import "https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Coiny&display=swap";
.hero-donaciones{background:linear-gradient(135deg,#ee135c 0%,#d10e4e 50%,#7b1fa2 100%);justify-content:center;align-items:center;height:520px;margin-top:100px;display:flex;position:relative;overflow:hidden}.hero-donaciones:before{content:"";opacity:.3;background:url("data:image/svg+xml,<svg width=\"100\" height=\"100\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"50\" cy=\"50\" r=\"2\" fill=\"rgba(255,255,255,0.1)\"/></svg>") 0 0/50px 50px;position:absolute;inset:0}.hero-overlay{z-index:1;text-align:center;color:#fff;padding:40px 20px;position:relative}.hero-overlay h1{text-shadow:0 4px 20px #0000004d;margin-bottom:25px;font-family:Coiny,system-ui;font-size:4rem}.hero-overlay p{opacity:.95;margin-bottom:40px;font-size:1.6rem;line-height:1.7}.btn-hero-scroll{color:#ee135c;background:#fff;border-radius:50px;padding:20px 45px;font-size:1.2rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-block;box-shadow:0 8px 25px #0003}.btn-hero-scroll:hover{transform:translateY(-3px);box-shadow:0 12px 35px #0000004d}.impacto-numeros{z-index:2;max-width:1200px;margin:-80px auto 80px;padding:0 40px;position:relative}.impacto-numeros h2{text-align:center;color:#333;margin-top:20px;margin-bottom:60px;font-family:Coiny,system-ui;font-size:3rem}.stats-grid{grid-template-columns:repeat(4,1fr);gap:25px;padding:0;list-style:none;display:grid}.stat-impact{text-align:center;background:#fff;border:2px solid #0000;border-radius:20px;padding:45px 20px;transition:all .3s;box-shadow:0 10px 30px #00000026}.stat-impact:hover{border-color:#ee135c;transform:translateY(-8px);box-shadow:0 15px 40px #ee135c4d}.stat-amount{color:#ee135c;margin-bottom:15px;font-family:Coiny,system-ui;font-size:3rem}.stat-description{color:#666;font-size:1.15rem;line-height:1.7}.por-que-donar{max-width:1200px;margin:90px auto;padding:0 40px}.por-que-donar h2{text-align:center;color:#333;margin-bottom:50px;font-family:Coiny,system-ui;font-size:3rem}.razones-grid{grid-template-columns:repeat(3,1fr);gap:30px;padding:0;list-style:none;display:grid}.razon-card{text-align:center;background:linear-gradient(135deg,#f8f9fa,#fff);border-radius:20px;padding:55px 35px;transition:all .3s;box-shadow:0 5px 20px #0000001a}.razon-card:hover{transform:translateY(-10px);box-shadow:0 15px 40px #368fe733}.razon-icon{margin-bottom:25px;font-size:4.5rem}.razon-card h3{color:#368fe7;margin-bottom:15px;font-family:Coiny,system-ui;font-size:1.8rem}.razon-card p{color:#666;font-size:1.2rem;line-height:1.9}.formulario-donacion{max-width:1400px;margin:90px auto;padding:0 40px}.formulario-donacion>h2{text-align:center;color:#333;margin-bottom:50px;font-family:Coiny,system-ui;font-size:3rem}.contenedor-pago{grid-template-columns:1fr 1.2fr;align-items:flex-start;gap:60px;display:grid}.apart-targeta{position:sticky;top:120px}.tarjeta-contenedor{perspective:1000px;width:100%;max-width:420px;margin:0 auto}.tarjeta-flip{width:100%;height:260px;transform-style:preserve-3d;transition:transform .8s ease-out;position:relative}.tarjeta-contenedor.girar .tarjeta-flip{transform:rotateY(180deg)}.tarjeta-frente,.tarjeta-reverso{backface-visibility:hidden;background:linear-gradient(135deg,#ee135c 0%,#d10e4e 50%,#7b1fa2 100%);border-radius:20px;width:100%;height:100%;transition:all .3s;position:absolute;overflow:hidden;box-shadow:0 20px 60px #ee135c66}.tarjeta-frente:hover,.tarjeta-reverso:hover{transform:scale(1.02);box-shadow:0 30px 80px #ee135c80}.tarjeta-reverso{transform:rotateY(180deg)}.glass-layer{-webkit-backdrop-filter:blur(10px)saturate(180%);z-index:1;pointer-events:none;background:#ffffff1a;border:1px solid #ffffff4d;position:absolute;inset:0;box-shadow:inset 0 1px #ffffff4d}.decorative-pattern{z-index:0;background:url("data:image/svg+xml,<svg width=\"60\" height=\"60\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"30\" cy=\"30\" r=\"3\" fill=\"rgba(255,255,255,0.05)\"/></svg>") 0 0/60px 60px;position:absolute;inset:0}.chip{z-index:2;background:linear-gradient(135deg,#f5f5f5,silver,#a8a8a8);border-radius:8px;width:60px;height:45px;margin:25px 0 0 30px;position:relative;box-shadow:0 2px 5px #0000004d,inset 0 1px #fff9,inset 0 -1px #0003}.chip:after{content:"";background:linear-gradient(90deg,#00000026 0%,#0000 50%,#00000026 100%);border-radius:3px;width:40px;height:30px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.chip img{filter:brightness(1.2)contrast(1.1)saturate(.8)drop-shadow(0 2px 3px #0003);border-radius:8px;width:100%;height:100%}.logo-tarjeta{z-index:2;width:60px;height:60px;position:absolute;top:25px;right:30px}.logo-tarjeta img{opacity:.3;filter:brightness(2);width:100%;height:100%}.num-tarjeta{z-index:2;color:#fff;text-align:center;letter-spacing:3px;text-shadow:0 2px 10px #0000004d;margin-top:50px;font-family:Courier New,monospace;font-size:1.6rem;font-weight:600;position:relative}.info-tarjeta{z-index:2;justify-content:space-between;margin-top:30px;padding:0 30px;display:flex;position:relative}.titular-info,.fecha-info{color:#fff}.titular-label,.fecha-label{opacity:.8;letter-spacing:1px;margin-bottom:5px;font-size:.65rem}.titular,.fecha{text-shadow:0 1px 5px #0000004d;text-transform:uppercase;font-size:1rem;font-weight:500}.tarjeta-footer{text-align:center;color:#fff;opacity:.7;z-index:2;font-size:.75rem;position:absolute;bottom:15px;left:0;right:0}.banda-magnetica{background:#333;width:100%;height:50px;margin-top:30px;box-shadow:0 2px 10px #00000080}.firma-box{z-index:2;margin:30px 30px 20px;position:relative}.firma-box label{color:#fff;opacity:.8;margin-bottom:5px;font-size:.7rem;display:block}.firma-line{background:#fff3;border-radius:5px;height:30px}.cvv-box{z-index:2;text-align:right;background:linear-gradient(135deg,#f5f5f5,#e0e0e0);border-radius:10px;margin:0 30px;padding:15px;position:relative;box-shadow:0 2px 8px #0003,inset 0 1px #fffc}.cvv-box label{color:#666;margin-bottom:5px;font-size:.7rem;font-weight:500;display:block}.cvv-valor{color:#000;letter-spacing:3px;font-family:Courier New,monospace;font-size:1.3rem;font-weight:600}.mensaje-reverso{z-index:2;text-align:center;color:#fff;opacity:.9;margin-top:25px;font-size:1rem;position:relative}.logo-tarjeta-reverso{z-index:2;width:50px;height:50px;position:absolute;bottom:20px;right:30px}.logo-tarjeta-reverso img{opacity:.3;filter:brightness(2);width:100%;height:100%}.card{background:#fff;border-radius:20px;width:100%;display:block;overflow:visible;box-shadow:0 10px 30px #0000001a}.card-contenedor{perspective:1000px;width:100%;height:auto}.card-flip{transform-style:preserve-3d;height:auto;min-height:500px;transition:transform .6s}.card-contenedor.girar .card-flip{transform:rotateY(180deg)}.frente-form,.reverso-form{backface-visibility:hidden;width:100%;padding:40px}.frente-form{backface-visibility:hidden;box-sizing:border-box;width:100%;padding:40px}.reverso-form{box-sizing:border-box;width:100%;padding:40px;position:absolute;top:0;left:0;transform:rotateY(180deg)}.top{text-align:center;margin-bottom:30px}.top .logo{height:80px;margin-bottom:20px}.top h3{color:#368fe7;margin-bottom:15px;font-family:Coiny,system-ui;font-size:1.8rem}.seguridad-badges{flex-wrap:wrap;justify-content:center;gap:15px;margin-top:15px;display:flex}.badge{color:#368fe7;background:#368fe71a;border-radius:20px;padding:8px 15px;font-size:1rem;font-weight:500;display:inline-block}.form-group{margin-bottom:20px}.form-group label{color:#333;margin-bottom:8px;font-size:1.05rem;font-weight:500;display:block}.form-group input{border:2px solid #e0e0e0;border-radius:10px;width:100%;padding:14px 15px;font-size:1.05rem;transition:all .3s}.form-group input:focus{border-color:#368fe7;outline:none;box-shadow:0 0 0 3px #368fe71a}.form-group.icon{position:relative}.form-group.icon i{color:#999;font-size:1.1rem;position:absolute;top:45px;right:15px}.form-row{grid-template-columns:1fr 1fr;gap:15px;display:grid}.form-actions{margin-top:30px}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#368fe7,#2563eb);border:none;border-radius:10px;width:100%;padding:16px;font-size:1.15rem;font-weight:600;transition:all .3s}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 20px #368fe74d}.form-note{text-align:center;color:#666;margin-top:15px;font-size:1rem}.montos-donacion{margin-bottom:30px}.montos-donacion h4{color:#333;margin-bottom:20px;font-size:1.2rem;font-weight:600}.opciones-monto{grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:20px;display:grid}.btn-monto{color:#333;cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:10px;padding:15px 10px;font-size:1.15rem;font-weight:600;transition:all .3s}.btn-monto:hover,.btn-monto.active,.btn-monto.selected{color:#fff;background:#ee135c;border-color:#ee135c;transform:translateY(-2px);box-shadow:0 6px 20px #ee135c66}.monto-personalizado{margin-top:15px}.monto-personalizado label{color:#333;margin-bottom:8px;font-size:1.05rem;font-weight:500;display:block}.monto-personalizado input{border:2px solid #e0e0e0;border-radius:10px;width:100%;padding:14px 15px;font-size:1.05rem}.padrino-section{background:#ee135c0d;border:2px dashed #ee135c;border-radius:15px;margin:30px 0;padding:25px}.switch-container{align-items:center;gap:15px;margin-bottom:20px;display:flex}.switch{flex-shrink:0;width:60px;height:34px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#ccc;transition:all .4s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;width:26px;height:26px;transition:all .4s;position:absolute;bottom:4px;left:4px}input:checked+.slider{background-color:#ee135c}input:checked+.slider:before{transform:translate(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.switch-label{color:#333;font-size:1.15rem;font-weight:600;line-height:1.5}.formulario-padrino{opacity:0;background:#fff;border-radius:10px;max-height:0;margin-top:20px;padding:40px;transition:max-height .5s,opacity .5s;overflow:hidden}.info-padrino{flex-direction:column;justify-content:center;align-items:center;width:100%;margin-top:-20px;margin-left:-14px;display:flex}.formulario-padrino.activo{opacity:1;max-height:1000px}.formulario-padrino h4{color:#ee135c;margin-bottom:20px;font-size:1.2rem}@keyframes fadeIn{0%{opacity:0;max-height:0}to{opacity:1;max-height:600px}}.form-grid{grid-template-columns:1fr 1fr;gap:15px;width:100%;max-width:500px;display:grid}.form-grid .form-group.full-width{grid-column:1/-1}.form-group-checkbox{grid-column:1/-1;margin-top:10px}.form-group-checkbox label{color:#333;cursor:pointer;align-items:center;gap:10px;font-size:1.05rem;display:flex}.boton-finalizar{margin-top:30px}.btn-finalizar{color:#fff;cursor:pointer;background:linear-gradient(135deg,#ee135c,#d10e4e);border:none;border-radius:10px;width:100%;padding:18px;font-size:1.2rem;font-weight:600;transition:all .3s}.btn-finalizar:hover{transform:translateY(-2px);box-shadow:0 10px 30px #ee135c66}.boton-finalizar p{text-align:center;color:#666;margin-top:15px;font-size:1rem}.otras-formas{max-width:1200px;margin:90px auto;padding:0 40px}.otras-formas h2{text-align:center;color:#333;margin-bottom:50px;font-family:Coiny,system-ui;font-size:3rem}.otras-grid{grid-template-columns:repeat(2,1fr);gap:40px;padding:0;list-style:none;display:grid}.otra-card{text-align:center;background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border-radius:20px;padding:55px 45px;transition:all .3s;box-shadow:0 5px 20px #00000014}.otra-card:hover{transform:translateY(-8px);box-shadow:0 15px 40px #368fe733}.otra-icon{margin-bottom:25px;font-size:4.5rem}.otra-card h3{color:#368fe7;margin-bottom:15px;font-family:Coiny,system-ui;font-size:1.8rem}.otra-card p{color:#666;margin-bottom:25px;font-size:1.2rem;line-height:1.9}.btn-otra{color:#fff;background:#368fe7;border-radius:25px;padding:14px 35px;font-size:1.1rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-block}.btn-otra:hover{background:#2563eb;transform:translateY(-2px);box-shadow:0 5px 15px #368fe74d}@media (max-width:1024px){.contenedor-pago{grid-template-columns:1fr;gap:40px}.apart-targeta{position:relative;top:0}.stats-grid{grid-template-columns:repeat(2,1fr)}.razones-grid,.otras-grid{grid-template-columns:1fr}}@media (max-width:768px){.hero-donaciones{height:auto;padding:60px 20px}.hero-overlay h1{font-size:2.8rem}.hero-overlay p{font-size:1.3rem}.stats-grid{grid-template-columns:1fr}.stat-amount{font-size:2.5rem}.stat-description{font-size:1.1rem}.opciones-monto{grid-template-columns:repeat(3,1fr)}.form-grid,.form-row{grid-template-columns:1fr}.impacto-numeros h2,.por-que-donar h2,.formulario-donacion>h2,.otras-formas h2{font-size:2.4rem}.razon-card h3{font-size:1.6rem}.razon-card p{font-size:1.15rem}.otra-card h3{font-size:1.6rem}.otra-card p{font-size:1.15rem}.form-group label,.form-group input{font-size:1rem}.switch-label{font-size:1.1rem}}@media (max-width:480px){.hero-overlay h1{font-size:2.2rem}.hero-overlay p{font-size:1.2rem}.opciones-monto{grid-template-columns:repeat(2,1fr)}.tarjeta-contenedor{max-width:100%}.frente-form,.reverso-form{padding:25px 20px}.top h3{font-size:1.5rem}.btn-monto{font-size:1.05rem}.btn-finalizar{font-size:1.1rem}.btn-primary{font-size:1.05rem}}
