/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Poppins:wght@300;400;600&display=swap');

:root{
  --rose: #ff5d8f;
  --blush: #ff8fb0;
  --lavender: #efe7ff;
  --midnight: #2d1f35;
  --white: #ffffff;
}

*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif;}

body{
  color:var(--midnight);
  background:var(--lavender);
  scroll-behavior:smooth;
}

/* ===== LANDING HERO ===== */
.hero{
  min-height:100vh;
  background:linear-gradient(rgba(45,31,53,.5),rgba(45,31,53,.7)),url('../img/hero-bg.jpg') center/cover no-repeat;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;
  padding:0 1.2rem;
}
.hero h1{
  font-family:'Great Vibes',cursive;
  font-size:4rem;
  color:var(--white);
  text-shadow:0 3px 10px rgba(0,0,0,.3);
  animation:fadeIn 1.8s ease forwards;
}
.hero p{
  color:var(--lavender);max-width:600px;margin:1.2rem 0 2rem;font-size:1.1rem;
  animation:fadeIn 2.3s ease forwards;
}
.btn{
  display:inline-block;padding:.9rem 2.5rem;border-radius:40px;font-weight:600;
  background:var(--rose);color:var(--white);text-decoration:none;border:0;
  transition:transform .3s ease,box-shadow .3s ease;
}
.btn:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(255,93,143,.35);}
.section{padding:4rem 1rem;text-align:center;}
.section h2{font-family:'Great Vibes',cursive;font-size:3rem;color:var(--rose);margin-bottom:.5rem;}
.section p{max-width:700px;margin:0 auto 2.5rem;}

/* ===== FORM CARD ===== */
.card{
  background:var(--white);
  padding:2rem;
  border-radius:20px;
  box-shadow:0 10px 20px rgba(0,0,0,.08);
  max-width:420px;margin:2rem auto;
  animation:popIn .7s cubic-bezier(.68,-0.55,.27,1.55);
}
.card h3{color:var(--rose);margin-bottom:1.2rem;font-size:1.8rem;text-align:center;font-family:'Great Vibes',cursive;}
input[type="text"],input[type="date"],input[type="file"]{
  width:100%;padding:.75rem 1rem;margin-bottom:1.1rem;border:2px solid var(--lavender);
  border-radius:12px;font-size:1rem;outline:none;transition:border .25s;
}
input:focus{border-color:var(--rose);}
.preview{width:100%;margin-bottom:1.2rem;border-radius:12px;overflow:hidden;display:none;}
.preview img{width:100%;display:block;}
.loader{display:none;text-align:center;margin-top:1rem;color:var(--rose);}

/* ===== ANIMATIONS ===== */
@keyframes fadeIn{from{opacity:0;transform:translateY(25px);}to{opacity:1;transform:translateY(0);}}
@keyframes popIn{0%{transform:scale(.5);opacity:0;}70%{transform:scale(1.05);}100%{transform:scale(1);opacity:1;}}
/* ===== FOOTER ===== */
footer{padding:2rem 1rem;text-align:center;font-size:.9rem;color:#776d83;}
footer a{color:var(--rose);text-decoration:none;}

/* ==== CHECKOUT CARD ==== */
.checkout-card{
  background:var(--white);
  max-width:460px;margin:4rem auto;
  padding:2rem 2.2rem;border-radius:22px;
  box-shadow:0 12px 24px rgba(0,0,0,.08);
  animation:popIn .8s cubic-bezier(.68,-0.55,.27,1.55);
}
.order-row{display:flex;justify-content:space-between;margin-bottom:1rem;font-size:.95rem;}
.order-row.total{font-weight:600;font-size:1.05rem;border-top:1px dashed var(--lavender);padding-top:1rem;}
.payment-options{margin:2rem 0 1.2rem;display:flex;gap:1rem;flex-wrap:wrap;}
.payment-options button{
  flex:1 1 140px;display:flex;align-items:center;justify-content:center;
  padding:.8rem;border:2px solid var(--lavender);border-radius:12px;background:#fff;
  cursor:pointer;transition:all .25s;font-size:.9rem;
}
.payment-options button.active,
.payment-options button:hover{border-color:var(--rose);color:var(--rose);}
.qr-box{display:none;text-align:center;margin-top:1.2rem;}
.qr-box img{width:180px;height:180px;border-radius:12px;}
.notice{font-size:.8rem;text-align:center;color:#776d83;margin-top:1.5rem;}