/* Sección "¿Cuándo acudir con un Cirujano Pediatra?" */
.sx{position:relative;overflow:hidden;background:#f2f9ff;padding:5rem 0 6rem;color:#1a2e66}
@media (min-width:768px){.sx{padding:7rem 0 8rem}}
.sx-wrap{position:relative;max-width:80rem}
.sx-cloud{position:absolute;color:#fff;pointer-events:none}
.sx-head{max-width:48rem;margin:0 auto;text-align:center}
.sx-kicker{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;background:#fff;padding:.4rem 1rem;font-family:var(--font-fredoka),ui-rounded,system-ui,sans-serif;font-size:.95rem;font-weight:600;color:#2d50b8;box-shadow:0 1px 2px #14213d0d,0 8px 24px #14213d0f}
.sx-kicker i{width:.6rem;height:.6rem;border-radius:9999px;background:#ffc93c}
.sx-head .h2{margin-top:1.1rem}
.sx-intro{margin-top:1.25rem;font-size:1.125rem;line-height:1.65;color:#1a2e66b3}
@media (min-width:768px){.sx-intro{font-size:1.25rem}}

.sx-group{margin-top:3.5rem}
@media (min-width:768px){.sx-group{margin-top:5rem}}
.sx-group:first-of-type{margin-top:2.5rem}
@media (min-width:768px){.sx-group:first-of-type{margin-top:3.5rem}}
.sx-gtitle{display:flex;align-items:center;justify-content:center;gap:.9rem;text-align:center;font-family:var(--font-fredoka),ui-rounded,system-ui,sans-serif;font-size:1.35rem;font-weight:600;line-height:1.2;color:#1a2e66}
@media (min-width:768px){.sx-gtitle{font-size:1.75rem;justify-content:flex-start;text-align:left}}
.sx-gtitle::after{content:"";display:none;flex:1;height:3px;border-radius:9999px;background:repeating-linear-gradient(90deg,#bde3fa 0 14px,transparent 14px 22px)}
@media (min-width:768px){.sx-gtitle::after{display:block}}
.sx-gdot{flex:none;display:grid;place-items:center;width:3rem;height:3rem;border-radius:42% 58% 55% 45%/48% 42% 58% 52%;}
.sx-gdot img{width:2rem;height:2rem}

.sx-grid{margin-top:1.75rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:.75rem;list-style:none;padding:0}
@media (min-width:640px){.sx-grid{gap:1.5rem}}
@media (min-width:768px){.sx-grid{gap:1.75rem}}
@media (min-width:1280px){.sx-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

.sx-card{position:relative;display:flex;flex-direction:column;align-items:center;border-radius:1.5rem;background:#fff;padding:1.25rem .75rem 1rem;text-align:center;box-shadow:0 1px 2px #14213d0d,0 8px 24px #14213d0f,0 24px 48px -12px #2d50b81a;outline:2px solid transparent;outline-offset:-2px;transition:transform .3s ease-out,box-shadow .3s ease-out,outline-color .3s}
@media (min-width:640px){.sx-card{border-radius:2rem;padding:2rem 1.5rem 1.5rem}}
.sx-card:hover{transform:translateY(-6px);box-shadow:0 2px 4px #14213d0d,0 16px 32px #2d50b81f,0 40px 72px -16px #2d50b838;outline-color:var(--ring)}
.sx-icon{position:relative;width:5rem;height:5rem}
@media (min-width:640px){.sx-icon{width:7rem;height:7rem}}
.sx-icon::before{content:"";position:absolute;right:-.75rem;top:-.25rem;width:2.75rem;height:2.75rem;border-radius:9999px;background:var(--dot)}
@media (min-width:640px){.sx-icon::before{right:-1rem;width:4rem;height:4rem}}
.sx-blob{position:relative;display:grid;place-items:center;width:100%;height:100%;border-radius:42% 58% 55% 45%/48% 42% 58% 52%;background:var(--blob);transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.sx-card:hover .sx-blob{transform:rotate(-3deg) scale(1.1)}
.sx-blob img{width:4rem;height:4rem;filter:drop-shadow(0 6px 8px rgba(26,46,102,.15))}
@media (min-width:640px){.sx-blob img{width:5.75rem;height:5.75rem}}
.sx-card h3{margin-top:1rem;display:flex;min-height:2.9rem;align-items:center;justify-content:center;font-family:var(--font-fredoka),ui-rounded,system-ui,sans-serif;font-size:.98rem;font-weight:600;line-height:1.3;color:#1a2e66}
@media (min-width:640px){.sx-card h3{margin-top:1.5rem;min-height:3.4rem;font-size:1.3rem}}
.sx-panel{display:grid;width:100%;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.22,1,.36,1)}
.sx-panel>div{min-height:0;overflow:hidden}
.sx-panel p{padding-top:.75rem;font-size:.875rem;line-height:1.65;color:#1a2e66b3;opacity:0;transform:translateY(-.5rem);transition:opacity .5s ease-out,transform .5s ease-out}
@media (min-width:640px){.sx-panel p{font-size:.95rem}}
.sx-card.is-open .sx-panel{grid-template-rows:1fr}
.sx-card.is-open .sx-panel p{opacity:1;transform:none}
.sx-more{margin-top:.75rem;display:inline-flex;align-items:center;gap:.375rem;border:0;border-radius:9999px;background:var(--btn);padding:.5rem .875rem;font-family:var(--font-fredoka),ui-rounded,system-ui,sans-serif;font-size:.875rem;font-weight:600;color:#1a2e66;cursor:pointer;transition:transform .3s ease-out}
@media (min-width:640px){.sx-more{margin-top:1.25rem;gap:.5rem;padding:.625rem 1.25rem;font-size:.98rem}}
.sx-more:hover{transform:scale(1.05)}
.sx-more:active{transform:scale(.95)}
.sx-more:focus-visible{outline:3px solid #2d50b8;outline-offset:2px}
.sx-more svg{width:1rem;height:1rem;transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.sx-card.is-open .sx-more svg{transform:rotate(180deg)}

/* Paletas (mismas que las tarjetas de cirugías) */
.sx-c1{--dot:#bde3fa;--blob:#e3f2fd;--btn:#e3f2fd;--ring:#bde3fa}
.sx-c2{--dot:#cfefec;--blob:#e8f7f6;--btn:#e8f7f6;--ring:rgb(64 193 182/.6)}
.sx-c3{--dot:#dcd6fd;--blob:#ece9fe;--btn:#ece9fe;--ring:rgb(167 155 245/.5)}
.sx-c4{--dot:#ffd3b8;--blob:#ffeadd;--btn:#ffeadd;--ring:rgb(255 159 104/.6)}
.sx-c5{--dot:#c9e9b6;--blob:#e6f5dc;--btn:#e6f5dc;--ring:rgb(109 190 69/.5)}
.sx-c6{--dot:#ffe39a;--blob:#fff4d1;--btn:#fff4d1;--ring:rgb(255 201 60/.7)}
.sx-c7{--dot:#ffc9d4;--blob:#ffe6eb;--btn:#ffe6eb;--ring:rgb(255 150 170/.5)}
.sx-c8{--dot:#dce4f8;--blob:#eef2fc;--btn:#eef2fc;--ring:rgb(45 80 184/.3)}

/* Urgencias */
.sx-alert{position:relative;margin:4.5rem auto 0;max-width:64rem;border:2px solid #ff9f68;border-radius:2.5rem;background:#fff;padding:2.25rem 1.5rem 2rem;text-align:center;box-shadow:0 1px 2px #14213d0d,0 8px 24px #14213d0f,0 24px 48px -12px #ff9f6840;overflow:hidden}
@media (min-width:768px){.sx-alert{margin-top:6rem;display:flex;align-items:center;gap:2.5rem;padding:3rem 3.5rem;text-align:left}}
.sx-alert::before{content:"";position:absolute;right:-6rem;top:-6rem;width:18rem;height:18rem;border-radius:9999px;background:#ffeadd}
.sx-alert>*{position:relative}
.sx-alert-icon{flex:none;margin:0 auto;display:grid;place-items:center;width:6.5rem;height:6.5rem;border-radius:42% 58% 55% 45%/48% 42% 58% 52%;background:#ffeadd;animation:sx-pulse 2.4s ease-in-out infinite}
@media (min-width:768px){.sx-alert-icon{margin:0;width:8rem;height:8rem}}
.sx-alert-icon img{width:4.5rem;height:4.5rem}
@media (min-width:768px){.sx-alert-icon img{width:5.75rem;height:5.75rem}}
.sx-alert h2{margin-top:1.25rem;font-family:var(--font-fredoka),ui-rounded,system-ui,sans-serif;font-size:1.6rem;font-weight:600;line-height:1.2;color:#1a2e66}
@media (min-width:768px){.sx-alert h2{margin-top:0;font-size:2rem}}
.sx-alert p{margin-top:.9rem;font-size:1.05rem;line-height:1.7;color:#1a2e66cc}
.sx-alert strong{font-weight:600;color:#1a2e66;background:linear-gradient(transparent 62%,#ffe39a 62%)}
@keyframes sx-pulse{0%,100%{box-shadow:0 0 0 0 rgb(255 159 104/.45)}50%{box-shadow:0 0 0 14px rgb(255 159 104/0)}}

/* Aparición al hacer scroll */
.sx-rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease-out,transform .7s cubic-bezier(.22,1,.36,1)}
.sx-rv.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.sx-rv{opacity:1;transform:none;transition:none}.sx-alert-icon{animation:none}.sx-card,.sx-blob,.sx-panel,.sx-panel p{transition:none}}
