/* Silvano Birthday — roze & regenboog thema
   - Fonts: Pacifico (headings), Nunito (body)
   - Lichte, speelse look met confetti & bubbels
   - Masonry fotoalbum + lightbox
*/
:root{
  --pink: #ff5bbd;
  --pink-700: #ff2d9c;
  --pink-900: #e00077;
  --bg: #fff7fb;
  --text: #2a1234;
  --muted: #6b4b73;
  --card: #ffffff;
  --shadow: 0 10px 30px rgba(255, 45, 156, .12);
  --radius: 18px;
  --rainbow: linear-gradient(90deg,
    #ff3a7b, #ff7a00, #ffd300, #0fd850, #00c2ff, #7a00ff, #ff3a7b);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: 'Nunito', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  background:
    radial-gradient(1200px 800px at 100% -10%, #ffe0f3, transparent 60%),
    radial-gradient(1000px 800px at -10% 10%, #fff0ff, transparent 60%),
    var(--bg);
  line-height:1.6;
}

/* Accessibility */
.skip-link{
  position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;
}
.skip-link:focus{left:16px;top:16px;width:auto;height:auto;background:#fff;padding:.5rem .75rem;border-radius:8px;box-shadow:var(--shadow)}

/* Containers */
.container{max-width:1100px;margin:0 auto;padding: clamp(16px, 3vw, 32px);}

/* Header / Hero */
.site-header{
  position:relative;
  background: linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,.9)),
              radial-gradient(1200px 600px at 20% -40%, #ffd6f2, transparent 60%),
              #ffe7f5;
  overflow:hidden;
}
.site-header.small{padding-bottom: 8px;}
.hero{
  display:grid;grid-template-columns:1.1fr .9fr;gap: clamp(20px,3vw,48px);
  align-items:center;min-height: clamp(420px, 55vh, 640px);
}
.hero.upload-hero{grid-template-columns: 1fr;min-height:auto;}
.title{
  font-family:'Pacifico', cursive;
  font-size: clamp(42px, 6vw, 82px);
  margin:0 0 8px;color: var(--pink-900);
  text-shadow: 0 3px 0 #fff, 0 8px 25px rgba(255,45,156,.25);
}
.subtitle{
  margin:0 0 18px;font-weight:800;letter-spacing:.3px;
  background: var(--rainbow);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-img{width:100%;height:auto;display:block;filter:drop-shadow(0 24px 40px rgba(0,0,0,.15));}

.countdown{display:flex;gap:12px;align-items:stretch;flex-wrap:wrap;margin:18px 0 14px;}
.cd-box{background:var(--card);border-radius:14px;padding:10px 12px;box-shadow:var(--shadow);min-width:82px;text-align:center}
.cd-box span{display:block;font-weight:900;font-size:clamp(24px,4.5vw,40px)}
.cd-box small{display:block;color:var(--muted);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.6px}

.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px}
.btn{
  --_p: var(--pink-700);
  border:none;border-radius:999px;padding:12px 20px;font-weight:900;
  text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  box-shadow: var(--shadow);transition: transform .06s ease, box-shadow .2s ease, filter .2s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-rainbow{background:var(--rainbow);color:#141014}
.btn-ghost{background:#fff;color:var(--pink-900);outline: 3px solid rgba(255,45,156,.2)}
.btn-lg{padding:14px 26px;font-size:1.05rem}

.confetti-layer{
  position:absolute;inset:-80px -40px  -40px -40px;pointer-events:none;opacity:.35;
  background-image:
    radial-gradient(6px 6px at 10% 20%, #ff3a7b 40%, transparent 41%),
    radial-gradient(7px 7px at 20% 80%, #ff7a00 40%, transparent 41%),
    radial-gradient(5px 5px at 30% 10%, #ffd300 40%, transparent 41%),
    radial-gradient(6px 6px at 40% 60%, #0fd850 40%, transparent 41%),
    radial-gradient(7px 7px at 60% 30%, #00c2ff 40%, transparent 41%),
    radial-gradient(5px 5px at 75% 75%, #7a00ff 40%, transparent 41%),
    radial-gradient(6px 6px at 85% 40%, #ff3a7b 40%, transparent 41%);
  animation: floaty 18s linear infinite;
  filter: blur(.2px);
}
@keyframes floaty{
  from{transform: translateY(0)}
  to{transform: translateY(60px)}
}

/* Sections */
.section{padding: clamp(36px, 6vw, 80px) 0;}
.section-title{
  font-family:'Pacifico', cursive;font-size: clamp(32px, 4.5vw, 56px);margin:0 0 8px;color:var(--pink-900)
}
.section-sub{margin:0 0 28px;color:var(--muted);font-weight:700}

/* Album / Masonry */
.album{background:
  linear-gradient(180deg, rgba(255,255,255,.66), rgba(255,255,255,.9)),
  radial-gradient(800px 500px at 120% -20%, #ffe7fb, transparent 60%),
  var(--bg);
}
.masonry{column-gap: 18px;column-count: 1}
@media (min-width: 560px){ .masonry{column-count: 2}}
@media (min-width: 980px){ .masonry{column-count: 3}}
.masonry-item{break-inside: avoid;margin: 0 0 18px;background:var(--card);border-radius: var(--radius);box-shadow: var(--shadow);overflow:hidden}
.masonry-item img{width:100%;height:auto;display:block}
.masonry-item figcaption{padding:10px 12px;color:#55385e;font-weight:700;font-size:.95rem}

/* Gift */
.gift{background:#fff}
.gift-grid{display:grid;grid-template-columns: 1.2fr .8fr;gap:24px;align-items:stretch}
@media (max-width: 860px){.gift-grid{grid-template-columns:1fr}}
.gift-card{
  background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column
}
.gift-card-header{
  padding:12px 16px;font-weight:900;background:var(--rainbow);color:#1e0b23;text-transform:uppercase;letter-spacing:.6px
}
.gift-card-body{padding:18px}
.muted{color:var(--muted)}

/* About */
.about{background:
  radial-gradient(800px 400px at -10% 120%, #fff1fb, transparent 60%),
  #fff;
}
.about-text{font-size:1.05rem;max-width: 60ch}

/* Footer */
.site-footer{position:relative;background:#fff;padding: 26px 0 0;border-top: 6px solid #ffe0f3}
.footer-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.footer-nav{display:flex;gap:10px;font-weight:800}
.footer-rainbow{height:12px;background:var(--rainbow)}

/* Lightbox */
#lightbox{
  position:fixed;inset:0;display:none;align-items:center;justify-content:center;gap:12px;
  background:rgba(20,0,25,.7);backdrop-filter:saturate(120%) blur(6px);z-index:1000;padding:18px;
}
#lightbox.open{display:flex}
#lightbox img{max-width: min(96vw, 1100px);max-height: 80vh;border-radius: 14px;box-shadow: 0 20px 60px rgba(0,0,0,.45)}
#lightbox .caption{color:#fce7f6;text-align:center;font-weight:700;margin-top:8px}
.lb-close{
  position:absolute;top:14px;right:14px;border:none;border-radius:999px;width:44px;height:44px;
  font-size:30px;line-height:1;background:#fff;color:#7a145a;box-shadow: var(--shadow);cursor:pointer
}

/* Embeds */
.form-embed iframe{border:0;border-radius:14px;box-shadow: var(--shadow);background:#fff}

/* Utilities */
a{color:#851f6e}
a:hover{filter:brightness(1.1)}
img{max-width:100%;height:auto}
.terms{font-size:.95rem;color:var(--muted)}