:root{
  --bg:#FFF7F0;
  --pink:#FFD6E0;
  --peach:#FFE3C2;
  --mint:#D7F2E3;
  --lavender:#E5DBFF;
  --sky:#D6ECFF;
  --ink:#3A2E2E;
  --coral:#FF7A6E;
  --purple:#8B6FD9;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg);color:var(--ink);font-family:'Nunito',sans-serif;}
a{text-decoration:none;color:inherit;}

/* ---------- NAV ---------- */
.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 6vw;background:white;position:sticky;top:0;z-index:10;
  box-shadow:0 2px 12px rgba(200,150,150,0.08);
}
.nav .logo{font-family:'Fredoka',sans-serif;font-weight:700;font-size:1.3rem;color:var(--coral);}
.nav .links{display:flex;gap:28px;font-weight:700;font-size:.9rem;}
.nav .links a:hover{color:var(--coral);}
.nav .cta{background:var(--coral);color:white;padding:10px 20px;border-radius:50px;font-family:'Fredoka',sans-serif;font-weight:600;font-size:.85rem;}

/* ---------- GENERIC HERO BAND ---------- */
.page-hero{padding:50px 6vw 40px;text-align:center;border-radius:0 0 40px 40px;}
.crumb{font-size:.8rem;font-weight:700;color:#8a7362;margin-bottom:14px;}
.crumb a{color:var(--coral);}
h1{font-family:'Fredoka',sans-serif;font-weight:700;font-size:clamp(2rem,5vw,3.2rem);}
.page-hero p{margin-top:12px;font-weight:600;color:#6b5c5c;max-width:480px;margin-left:auto;margin-right:auto;}

.bg-peach{background:linear-gradient(180deg,var(--peach) 0%, var(--bg) 100%);}
.bg-pink{background:linear-gradient(180deg,var(--pink) 0%, var(--bg) 100%);}
.bg-mint{background:linear-gradient(180deg,var(--mint) 0%, var(--bg) 100%);}
.bg-sky{background:linear-gradient(180deg,var(--sky) 0%, var(--bg) 100%);}
.bg-lavender{background:linear-gradient(180deg,var(--lavender) 0%, var(--bg) 100%);}

/* ---------- FILTER BAR ---------- */
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:30px 6vw 10px;}
.filter-bar a{
  font-family:'Nunito',sans-serif;font-weight:700;font-size:.85rem;
  border:2px solid var(--pink);background:white;color:var(--ink);
  padding:8px 18px;border-radius:50px;
}
.filter-bar a.active{background:var(--coral);border-color:var(--coral);color:white;}

/* ---------- WISH GRID / CARDS ---------- */
.wish-grid{max-width:1200px;margin:0 auto;padding:30px 6vw 90px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.wish-card{background:white;border-radius:20px;padding:26px;box-shadow:0 6px 20px rgba(160,130,130,0.10);display:flex;flex-direction:column;justify-content:space-between;}
.wish-card .pill{display:inline-block;font-size:11px;font-weight:700;padding:5px 12px;border-radius:50px;margin-bottom:16px;width:fit-content;}
.p-pink{background:var(--pink);color:#B8385C;}
.p-mint{background:var(--mint);color:#2E8B63;}
.p-lav{background:var(--lavender);color:var(--purple);}
.p-sky{background:var(--sky);color:#3A7BB8;}
.p-peach{background:var(--peach);color:#B87333;}
.wish-card p.text{font-size:1.05rem;font-weight:600;line-height:1.5;margin-bottom:18px;}
.wish-card .actions{display:flex;gap:16px;font-size:.85rem;color:#9a8a8a;font-weight:700;border-top:1px solid #f1e6e6;padding-top:14px;}
.wish-card .actions span{cursor:pointer;}
.wish-card .actions span:hover{color:var(--coral);}
.wish-card a.card-link{display:block;}

.load-more{display:block;margin:0 auto 90px;background:white;border:2px solid var(--coral);color:var(--coral);font-family:'Fredoka',sans-serif;font-weight:600;padding:14px 34px;border-radius:50px;cursor:pointer;font-size:.95rem;}
.load-more:hover{background:var(--coral);color:white;}

/* ---------- OCCASION TILES (homepage) ---------- */
.occasions{padding:60px 6vw 20px;max-width:1200px;margin:0 auto;}
.occasions h2{font-family:'Fredoka',sans-serif;text-align:center;font-size:1.8rem;margin-bottom:36px;}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.tile{border-radius:24px;padding:28px 22px;min-height:150px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .18s ease;}
.tile:hover{transform:translateY(-6px) rotate(-1deg);}
.tile .emoji{font-size:2rem;}
.tile .label{font-family:'Fredoka',sans-serif;font-weight:600;font-size:1.15rem;}
.tile .count{font-size:.8rem;font-weight:700;opacity:.6;}
.bg-tile-peach{background:var(--peach);}
.bg-tile-mint{background:var(--mint);}
.bg-tile-lavender{background:var(--lavender);}
.bg-tile-sky{background:var(--sky);}
.bg-tile-pink{background:var(--pink);}

/* ---------- QUOTE DETAIL ---------- */
.quote-stage{max-width:700px;margin:0 auto;padding:36px 6vw 30px;}
.quote-card{background:linear-gradient(135deg,var(--lavender) 0%, var(--pink) 100%);border-radius:32px;padding:60px 44px;text-align:center;}
.quote-card .pill{display:inline-block;background:white;color:var(--purple);font-size:12px;font-weight:800;padding:6px 16px;border-radius:50px;margin-bottom:26px;}
.quote-card blockquote{font-family:'Fredoka',sans-serif;font-weight:600;font-size:clamp(1.5rem,3.4vw,2.1rem);line-height:1.35;color:var(--ink);}
.quote-card .occasion-tag{margin-top:24px;font-size:.9rem;font-weight:700;color:#6b5c5c;}
.action-row{display:flex;justify-content:center;gap:14px;margin-top:26px;flex-wrap:wrap;}
.action-row button{font-family:'Fredoka',sans-serif;font-weight:600;font-size:.9rem;border:none;border-radius:50px;padding:12px 24px;cursor:pointer;}
.btn-primary{background:var(--coral);color:white;}
.btn-secondary{background:white;color:var(--ink);box-shadow:0 3px 12px rgba(160,130,130,0.15);}
.btn-secondary:hover{background:#fceeee;}
.related{max-width:1200px;margin:70px auto 0;padding:0 6vw;}
.related h2{font-family:'Fredoka',sans-serif;font-size:1.6rem;text-align:center;margin-bottom:30px;}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding-bottom:90px;}

/* ---------- FOOTER ---------- */
footer{text-align:center;padding:40px;color:#9a8a8a;font-weight:700;font-size:.85rem;}

/* ---------- CONTENT PANEL (e.g. about page contact box) ---------- */
.info-card{background:white;border-radius:16px;padding:30px;box-shadow:0 4px 16px rgba(160,130,130,0.10);margin-bottom:24px;}

@media(max-width:900px){
  .grid{grid-template-columns:repeat(2,1fr);}
  .wish-grid{grid-template-columns:1fr;}
  .cards{grid-template-columns:1fr;}
}
@media(max-width:820px){
  .nav .links{display:none;}
}