
:root{
  --pink:#ec0b7f;
  --hot:#ff1493;
  --black:#050505;
  --gold:#d8a436;
  --soft:#fff3fb;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial, sans-serif;color:#111;background:white}
a{color:inherit}
.nav{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:12px 6%;
  background:linear-gradient(135deg,#000 0%,#060606 82%,var(--pink));
  color:white;border-bottom:3px solid var(--hot);
}
.brand{display:flex;align-items:center;gap:10px}
.fairy{font-size:30px}
.brand strong{font-size:23px;line-height:.85;color:var(--hot);display:block}
.brand em{display:block;color:white;font-style:italic;font-size:14px}
.nav nav{display:flex;gap:22px;font-size:13px;text-transform:uppercase;font-weight:900}
.nav nav a{text-decoration:none}
.book,.btn,.call,button{
  display:inline-block;padding:13px 23px;border-radius:999px;
  background:var(--hot);color:white;text-decoration:none;font-weight:900;
  border:2px solid white;box-shadow:0 4px 0 rgba(0,0,0,.25)
}
.hero{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px;
  padding:50px 6%;
  background:
    radial-gradient(circle at 7% 18%,#ffe1f3 0 12%,transparent 30%),
    linear-gradient(110deg,#fff 0 62%,var(--pink) 62% 78%,#040404 78%);
}
.hero:before{content:"✦ ✧ ♡ ✦";position:absolute;left:7%;top:70px;color:var(--gold);font-size:42px;letter-spacing:35px;opacity:.9}
.script{font-size:38px;font-style:italic;font-weight:900;margin:0 0 10px}
.hero h1{font-size:104px;line-height:.86;margin:0;font-weight:900;letter-spacing:-5px}
.hero h1 span{color:var(--pink)}
.hero h2{font-size:50px;color:var(--pink);font-style:italic;margin:8px 0 18px}
.pill{display:inline-block;background:var(--pink);color:#fff;border-radius:999px;padding:14px 20px;font-size:18px;font-weight:900}
.tagline{font-size:25px;font-style:italic;font-weight:900;max-width:620px}
.hero-buttons{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.call{background:white;color:var(--pink);border-color:var(--pink)}
.hero-art{border:5px solid var(--gold);border-radius:28px;overflow:hidden;box-shadow:0 20px 55px rgba(0,0,0,.4);background:white}
.hero-art img{width:100%;display:block}
section{padding:65px 6%}
.services,.reviews{
  background:#050505;color:white;
  background-image:radial-gradient(circle at 8% 15%,rgba(216,164,54,.38),transparent 10%),radial-gradient(circle at 86% 80%,rgba(236,11,127,.26),transparent 12%);
}
.services h2,.reviews h2{text-align:center;font-size:38px;margin:0 0 40px;text-transform:uppercase}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cards article{border:2px solid var(--gold);border-radius:18px;padding:30px;background:rgba(255,255,255,.04)}
.icon{width:75px;height:75px;margin:-68px auto 15px;border-radius:50%;display:grid;place-items:center;background:var(--pink);border:4px solid var(--gold);font-size:34px}
.cards h3{color:var(--hot);text-transform:uppercase}
.cards li{margin:10px 0}
.why{display:grid;grid-template-columns:.8fr 1.2fr;gap:35px;background:linear-gradient(135deg,#070707,#161616);color:white;border-top:3px solid var(--gold);border-bottom:3px solid var(--gold)}
.why-title p{font-size:40px;font-style:italic;margin:0;color:white}
.why-title h2{font-size:48px;color:var(--gold);font-style:italic;margin:5px 0}
.why-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.why-grid div{border-left:2px solid var(--gold);padding:12px;text-align:center}
.why-grid span{font-size:34px}.why-grid strong{display:block;color:var(--gold);text-transform:uppercase;margin:8px 0}
.gallery{background:white}
.gallery h2{text-align:center;font-size:34px;margin-top:0}
.gallery h2 span{color:var(--pink);text-transform:uppercase}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.gallery-grid div{height:155px;border:3px solid var(--gold);border-radius:15px;background:linear-gradient(135deg,#ffe9f7,#fff,#111);display:grid;place-items:end center;padding:15px;color:var(--pink);font-weight:900;text-transform:uppercase}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
blockquote{border:2px solid var(--gold);border-radius:16px;padding:28px;margin:0;text-align:center;font-size:18px}
.booking{display:grid;grid-template-columns:.85fr 1.15fr;gap:35px;align-items:center;background:linear-gradient(135deg,var(--pink),#ff4db2);color:white}
.booking h2{font-size:42px;margin:0 0 15px}
form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
input,select,textarea{width:100%;padding:15px;border:0;border-radius:10px;font-size:16px}
textarea{grid-column:1/-1;min-height:120px}
button{grid-column:1/-1;background:#050505;cursor:pointer}
footer{text-align:center;background:#000;color:white;padding:28px}
@media(max-width:950px){
  .nav{position:relative;flex-wrap:wrap}.nav nav{display:none}
  .hero{grid-template-columns:1fr;background:linear-gradient(#fff,#fff3fb)}
  .hero h1{font-size:66px}
  .cards,.why,.why-grid,.gallery-grid,.review-grid,.booking{grid-template-columns:1fr}
  form{grid-template-columns:1fr}
}
