@font-face{font-family:"Fraunces";src:url("../fonts/Fraunces-var-latin.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Nunito";src:url("../fonts/Nunito-var-latin.woff2") format("woff2");font-weight:200 1000;font-display:swap}

:root{
  --purple:#3d2466;
  --purple-2:#5b3a94;
  --pink:#e8559a;
  --pink-soft:#fbe3ef;
  --gold:#c9a24a;
  --teal:#2bb3b1;
  --ink:#2a2233;
  --muted:#5e5569;
  --cream:#fdf8f3;
  --card:#ffffff;
  --radius:18px;
  --shadow:0 10px 30px rgba(61,36,102,.12);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;font-family:"Nunito",system-ui,sans-serif;font-size:1.08rem;line-height:1.7;color:var(--ink);background:var(--cream)}
img{max-width:100%;height:auto;display:block}
a{color:var(--purple-2)}
h1,h2,h3{font-family:"Fraunces",Georgia,serif;line-height:1.15;margin:0 0 .6em;color:var(--purple)}
h2{font-size:clamp(2rem,4vw,2.8rem);text-align:center}
h2::after{content:"";display:block;width:72px;height:4px;margin:.45em auto 0;border-radius:4px;background:linear-gradient(90deg,var(--pink),var(--gold),var(--teal))}
h3{font-size:1.45rem}
.wrap{width:min(1120px,100% - 32px);margin-inline:auto}

/* Toppmeny */
.topbar{position:sticky;top:0;z-index:10;background:rgba(253,248,243,.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(61,36,102,.08)}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px}
.brand img{width:160px;padding-block:6px}
nav{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
nav a{text-decoration:none;font-weight:700;color:var(--purple);padding:.45em .9em;border-radius:999px;font-size:.98rem}
nav a:hover{background:var(--pink-soft)}
nav .nav-cta{background:var(--pink);color:#fff}
nav .nav-cta:hover{background:var(--purple-2)}

/* Toppbild med rubrik */
.hero{position:relative;min-height:min(78vh,720px);display:flex;align-items:flex-end;overflow:hidden;color:#fff}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 85%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(61,36,102,0) 35%,rgba(61,36,102,.78) 100%)}
.hero-content{position:relative;padding-block:56px}
.hero h1{color:#fff;font-size:clamp(2.4rem,6.5vw,4.6rem);text-shadow:0 2px 18px rgba(0,0,0,.35);margin:0}
.hero h1 span{color:#ffd7ea}
.sparkles i{position:absolute;width:14px;height:14px;background:#fff;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);opacity:.0;animation:twinkle 3.2s ease-in-out infinite}
.sparkles i:nth-child(1){top:14%;left:12%}
.sparkles i:nth-child(2){top:22%;left:78%;animation-delay:.6s;width:20px;height:20px}
.sparkles i:nth-child(3){top:48%;left:88%;animation-delay:1.2s}
.sparkles i:nth-child(4){top:38%;left:6%;animation-delay:1.8s;width:18px;height:18px}
.sparkles i:nth-child(5){top:10%;left:52%;animation-delay:2.3s}
.sparkles i:nth-child(6){top:60%;left:64%;animation-delay:.9s;width:10px;height:10px}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.4) rotate(0)}50%{opacity:.95;transform:scale(1) rotate(45deg)}}
@media (prefers-reduced-motion:reduce){.sparkles i{animation:none;opacity:.7}html{scroll-behavior:auto}}

/* Presentation */
.intro{display:grid;grid-template-columns:1fr;gap:40px;padding-block:72px;align-items:center}
.intro-text p{margin:0 0 1.1em;color:var(--muted)}
.intro-text .lead{font-size:1.22rem;color:var(--ink)}
.intro-photo{margin:0;justify-self:center;max-width:380px;position:relative}
.intro-photo img{border-radius:var(--radius);box-shadow:var(--shadow)}
.intro-photo::before{content:"";position:absolute;inset:-12px 12px 12px -12px;border:3px solid var(--pink);border-radius:var(--radius);z-index:-1}
@media (min-width:900px){.intro{grid-template-columns:1.35fr 1fr;gap:64px}}

/* Vårt utbud (shower) */
.offer{background:linear-gradient(180deg,#f3ecfb 0%,var(--cream) 100%);padding-block:72px}
.shows{display:grid;gap:28px;margin-top:40px}
@media (min-width:760px){.shows{grid-template-columns:repeat(3,1fr)}}
.show{background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.show img{aspect-ratio:800/1132;object-fit:cover;width:100%}
.show-body{padding:22px 24px 26px}
.show-body p{margin:0;color:var(--muted)}

/* Bildgalleri */
.gallery{display:grid;gap:20px;padding-block:24px 72px}
.gallery img{border-radius:var(--radius);width:100%;height:100%;object-fit:cover;box-shadow:var(--shadow)}
@media (min-width:760px){.gallery{grid-template-columns:2fr 1fr}.gallery img{max-height:520px}}

/* Kontakt och priser */
.contact{background:var(--purple);color:#f4eefc;padding-block:80px}
.contact h2{color:#fff}
.contact-lines{text-align:center;font-size:1.15rem;margin:28px 0 44px}
.contact-lines p{margin:.3em 0}
.contact-lines a{color:#ffd7ea;font-weight:700}
.prices{display:grid;gap:28px;max-width:900px;margin-inline:auto}
@media (min-width:760px){.prices{grid-template-columns:1fr 1fr}}
.price{background:#fff;color:var(--ink);border-radius:var(--radius);padding:32px 30px;box-shadow:0 12px 36px rgba(0,0,0,.25);border-top:6px solid var(--pink)}
.price-special{border-top-color:var(--gold)}
.price h3{font-size:1.3rem}
.amount{font-family:"Fraunces",Georgia,serif;font-size:2.2rem;font-weight:700;color:var(--pink);margin:0 0 .5em;line-height:1.1}
.price-special .amount{color:#9a7a2c;font-size:1.7rem}
.price ul{list-style:none;padding:0;margin:0}
.price li{position:relative;padding-left:1.6em;margin:.45em 0;color:var(--muted)}
.price li::before{content:"";position:absolute;left:0;top:.45em;width:12px;height:12px;background:var(--pink);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}
.price-special li::before{background:var(--gold)}

/* Sidfot */
.footer{background:#2a1947;color:#d9cdea;padding-block:40px;text-align:center}
.footer img{width:160px;margin:0 auto 14px;background:#fdf8f3;border-radius:12px;padding:6px 10px}
.footer a{color:#ffd7ea}
.footer-links{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:.3em 0}
.credit{font-size:.9rem;opacity:.8;margin:.8em 0 0}

@media (max-width:520px){
  .brand img{width:130px}
  nav a{padding:.4em .7em;font-size:.9rem}
  nav a:not(.nav-cta){display:none}
}