/* Base + background with soft rose glow */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; color:var(--ink);
  font-family: ui-sans-serif, system-ui, Arial, sans-serif;
  background:
    radial-gradient(1000px 700px at 8% -6%, rgba(255,143,179,.12), transparent 60%),
    radial-gradient(800px 520px at 110% 10%, rgba(255,79,135,.08), transparent 60%),
    var(--bg);
  position:relative; overflow-x:hidden;
}
body::before{
  content:""; position:fixed; inset:-25vmax; z-index:-1; pointer-events:none;
  background:
    radial-gradient(50% 50% at 20% 30%, rgba(255,143,179,.12), transparent 60%),
    radial-gradient(50% 50% at 78% 72%, rgba(255,79,135,.08), transparent 60%);
  filter:blur(40px);
  animation:float 16s ease-in-out infinite alternate;
}
@keyframes float{to{transform:translate3d(0,-16px,0) scale(1.02)}}

a{color:var(--rose-400); text-decoration:none}
a:hover{color:var(--rose-500); text-decoration:underline}

img{max-width:100%; display:block}

/* Utilities */
.container{max-width:1150px; margin:0 auto; padding:var(--sp-5) var(--sp-4)}
.center{display:flex; justify-content:center; margin:16px 0}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}