:root{
  --pink:#F69B9D; --black:#000; --green:#D1B72F;
  --berry:#903259; --rose:#D89495; --rust:#722312; --cream:#FFF3E4;
  --f-body:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --f-black:"Was BusstickNP","Pirata One","UnifrakturCook",serif;
  --f-type:"Special Elite","Courier New",monospace;
  --wrap:1120px;
}
@font-face{font-family:"Was BusstickNP";src:local("Was BusstickNP"),local("WasBusstickNP");font-display:swap}
@font-face{font-family:"Drunken Hour";src:local("Drunken Hour"),local("DrunkenHour");font-display:swap}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;font-family:var(--f-body);color:var(--black);background:var(--pink);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.skip{position:absolute;left:-999px;top:8px;background:var(--black);color:var(--cream);padding:8px 14px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--black);outline-offset:3px}
.section--black :focus-visible,.section--berry :focus-visible{outline-color:var(--green)}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px clamp(16px,4vw,40px);background:rgba(246,155,157,.92);backdrop-filter:blur(8px);border-bottom:2px solid var(--black)}
.nav__logo img{height:30px;width:auto}
.nav__links{display:flex;gap:clamp(14px,2.4vw,30px);align-items:center;font-weight:700;font-size:.92rem;letter-spacing:.02em}
.nav__links a{text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
.nav__links a:hover{border-bottom-color:var(--black)}
.nav__links .nav__ig{background:var(--black);color:var(--pink);padding:7px 14px;border-radius:99px;border:0}
.nav__links .nav__ig:hover{background:var(--berry);color:var(--cream)}
.nav__toggle{display:none;background:none;border:2px solid var(--black);width:44px;height:44px;border-radius:10px;cursor:pointer;position:relative}
.nav__toggle span{position:absolute;left:10px;right:10px;height:2px;background:var(--black);transition:.2s}
.nav__toggle span:first-child{top:16px}.nav__toggle span:last-child{top:26px}
.nav__toggle[aria-expanded="true"] span:first-child{top:21px;transform:rotate(45deg)}
.nav__toggle[aria-expanded="true"] span:last-child{top:21px;transform:rotate(-45deg)}

/* ---------- patches (sewn on) ---------- */
.patch{position:absolute;pointer-events:none;user-select:none;z-index:2;
  width:var(--w,120px);left:var(--x);top:var(--y);
  rotate:var(--r,0deg);translate:var(--px,0) var(--py,0);
  filter:drop-shadow(1.5px 2px 0 rgba(0,0,0,.28)) drop-shadow(0 7px 7px rgba(0,0,0,.22));
  animation:bob 7s ease-in-out infinite;animation-delay:var(--d,0s)}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;padding:110px 20px 90px;display:grid;place-items:center;text-align:center;overflow:hidden;isolation:isolate}
.hero__star{position:absolute;z-index:-1;left:50%;top:50%;width:min(125vw,980px);aspect-ratio:1;translate:-50% -48%;background:var(--green);
  clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
  rotate:-8deg;animation:spin 60s linear infinite}
@keyframes spin{to{rotate:352deg}}
.hero__inner{position:relative;z-index:3;width:100%;max-width:960px}
.hero__title{margin:0}
.hero__barlow{width:100%;max-width:880px;margin:0 auto}
.hero__media{width:min(62%,540px);margin:10px auto 0}
.hero__services{font-size:clamp(.95rem,1.9vw,1.15rem);font-weight:400;max-width:44ch;margin:26px auto 0;line-height:1.5}
.hero__tag{font-size:clamp(1.05rem,2.2vw,1.35rem);font-weight:700;max-width:34ch;margin:14px auto 24px}
.hero__cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

.p-camera{--w:clamp(90px,14vw,190px);--x:3%;--y:19%;--r:-10deg}
.p-sparkle{--w:clamp(50px,6vw,84px);--x:20%;--y:12%;--r:12deg;--d:-2s}
.p-pink{--w:clamp(70px,10vw,140px);--x:84%;--y:15%;--r:14deg;--d:-4s}
.p-like{--w:clamp(90px,12vw,170px);--x:81%;--y:70%;--r:8deg;--d:-1s}
.p-flame{--w:clamp(60px,7vw,100px);--x:7%;--y:70%;--r:-12deg;--d:-3s}
.p-berry{--w:clamp(60px,8vw,110px);--x:68%;--y:84%;--r:-16deg;--d:-5s}

.btn{display:inline-block;font:700 1rem var(--f-body);letter-spacing:.03em;text-decoration:none;padding:14px 26px;border-radius:99px;border:2px solid var(--black);cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;box-shadow:4px 4px 0 var(--black)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--black)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--black)}
.btn--black{background:var(--black);color:var(--pink)}
.btn--black:hover{background:var(--berry);color:var(--cream)}
.btn--ghost{background:var(--cream);color:var(--black)}
.btn--green{background:var(--green);color:var(--black)}
.section--black .btn{border-color:var(--green);box-shadow:4px 4px 0 var(--berry)}
.section--black .btn:hover{box-shadow:6px 6px 0 var(--berry)}

/* ---------- marquee ---------- */
.marquee{background:var(--black);color:var(--pink);overflow:hidden;border-block:2px solid var(--black);white-space:nowrap}
.marquee__track{display:inline-flex;align-items:center;gap:26px;padding:15px 0;animation:slide 38s linear infinite;font:700 1.05rem var(--f-body);letter-spacing:.12em;text-transform:uppercase}
.marquee__track i{width:14px;height:14px;background:var(--green);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);flex:none}
@keyframes slide{to{transform:translateX(-50%)}}
.marquee:hover .marquee__track{animation-play-state:paused}

/* ---------- sections ---------- */
.section{position:relative;padding:clamp(70px,10vw,130px) 20px;overflow:hidden;isolation:isolate}
.wrap{position:relative;z-index:3;max-width:var(--wrap);margin:0 auto}
.section--berry{background:var(--berry);color:var(--cream)}
.section--pink{background:var(--pink)}
.section--cream{background:var(--cream)}
.section--black{background:var(--black);color:var(--cream)}
.eyebrow{font:700 .8rem var(--f-body);letter-spacing:.22em;text-transform:uppercase;margin:0 0 10px}
.eyebrow--green{color:var(--green)}
.section--berry .eyebrow{color:var(--cream)}
.lede{font-size:clamp(1.05rem,1.8vw,1.25rem);max-width:60ch;margin:18px 0 0}

/* ransom headings */
.ransom{font-family:var(--f-black);font-weight:400;font-size:clamp(3rem,9vw,6.4rem);line-height:1;margin:0;display:flex;flex-wrap:wrap;gap:.04em .02em;letter-spacing:0}
.ransom .l{display:inline-block;padding:.02em .1em;line-height:1.05}
.ransom .l:nth-child(4n+1){background:var(--black);color:var(--cream);rotate:-3deg;font-family:"Special Elite",monospace}
.ransom .l:nth-child(4n+2){color:var(--black);font-family:Georgia,"Times New Roman",serif;font-weight:700;rotate:2deg}
.ransom .l:nth-child(4n+3){background:var(--cream);color:var(--black);rotate:-1deg;border:2px solid var(--black)}
.ransom .l:nth-child(4n){color:var(--rust);rotate:3deg}
.ransom .sp{width:.3em}
#jessica-title .sp{flex-basis:100%;width:0;height:0}
.section--berry .ransom .l:nth-child(4n+2){color:var(--cream)}
.section--berry .ransom .l:nth-child(4n){color:var(--green)}
.section--berry .ransom .l:nth-child(4n+1){background:var(--green);color:var(--black)}
.ransom--dark .l:nth-child(4n+1){background:var(--green);color:var(--black)}
.ransom--dark .l:nth-child(4n+2){color:var(--cream)}
.ransom--dark .l:nth-child(4n+3){background:var(--pink);border-color:var(--pink)}
.ransom--dark .l:nth-child(4n){color:var(--rose)}

/* services */
.cards{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--cream);color:var(--black);border:2px solid var(--black);border-radius:6px;padding:26px 24px 28px;box-shadow:6px 6px 0 var(--black);transition:transform .2s,box-shadow .2s;position:relative}
.card:nth-child(3n+1){rotate:-.8deg}.card:nth-child(3n+2){rotate:.6deg}.card:nth-child(3n){rotate:-.4deg}
.card:hover{transform:translateY(-6px);rotate:0deg;box-shadow:6px 12px 0 var(--green)}
.card__n{font:400 .95rem var(--f-type);color:var(--berry)}
.card h3{font:400 1.9rem/1.05 var(--f-black);margin:8px 0 10px}
.card p{margin:0;font-size:.98rem}
.p-haha{--w:clamp(110px,13vw,190px);--x:76%;--y:7%;--r:7deg}
.p-flower{--w:clamp(70px,8vw,115px);--x:2%;--y:6%;--r:-14deg;--d:-3s}

/* owner */
.owner{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(30px,6vw,80px);align-items:center}
.owner__photo{margin:0;position:relative}
.owner__frame{border:2px solid var(--black);background:var(--green);padding:14px 14px 14px;box-shadow:10px 10px 0 var(--black);rotate:-2deg;transition:rotate .3s}
.owner__frame:hover{rotate:0deg}
.owner__frame img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%;border:2px solid var(--black)}
.owner__photo figcaption{font:400 .95rem var(--f-type);margin-top:22px;text-align:center}
.p-sparkle2{--w:clamp(60px,7vw,92px);--x:-6%;--y:-5%;--r:-12deg}
.owner__role{font-family:var(--f-black);font-size:clamp(1.5rem,3vw,2.2rem);margin:14px 0 18px;color:var(--rust)}
.owner__copy p{max-width:56ch}
.owner__sub{font:700 .8rem var(--f-body);letter-spacing:.22em;text-transform:uppercase;margin:30px 0 12px}
.folio{list-style:none;padding:0;margin:0 0 28px;display:grid;gap:10px}
.folio li{background:var(--cream);border:2px solid var(--black);padding:12px 16px;border-radius:6px;display:grid;gap:2px}
.folio span{font-size:.94rem}
.p-hearts{--w:clamp(70px,8vw,110px);--x:88%;--y:8%;--r:10deg}
.p-red{--w:clamp(70px,8vw,115px);--x:2%;--y:84%;--r:-8deg;--d:-2s}

/* band */
.band{background:var(--black);color:var(--pink);position:relative;padding:60px 20px;display:flex;align-items:center;justify-content:center;gap:clamp(20px,5vw,60px);flex-wrap:wrap;overflow:hidden}
.band__patch{position:relative;width:clamp(170px,22vw,270px);left:auto;top:auto;z-index:2}
.band__text{font:400 clamp(1.8rem,4.5vw,3.4rem)/1.1 var(--f-black);margin:0;max-width:16ch}

/* pricing */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:50px;align-items:stretch}
.tier{background:var(--pink);border:2px solid var(--black);border-radius:8px;padding:32px 26px 30px;box-shadow:8px 8px 0 var(--black);position:relative;display:flex;flex-direction:column}
.tier--hot{background:var(--berry);color:var(--cream);translate:0 -12px}
.tier.tier--hot li::before{background:var(--green)}
.tier__label{font:400 .9rem var(--f-type);margin:0}
.tier h3{font:400 2.6rem/1 var(--f-black);margin:6px 0 4px}
.tier__price{font:700 2.4rem/1 var(--f-body);margin:6px 0 20px}
.tier__price span{font:400 1rem var(--f-type);margin-right:6px}
.tier ul{padding:0;margin:0 0 28px;list-style:none;display:grid;gap:9px;flex:1}
.tier li{padding-left:24px;position:relative}
.tier li::before{content:"";position:absolute;left:0;top:.35em;width:13px;height:13px;background:var(--berry);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.tier .btn{align-self:flex-start}
.tier--hot .btn{border-color:var(--black)}
.tier__patch{width:62px;right:6px;top:-30px;left:auto;rotate:12deg}
.fine{margin:30px 0 0;font:400 .9rem var(--f-type)}
.p-camera2{--w:clamp(70px,9vw,130px);--x:88%;--y:9%;--r:12deg}

/* contact */
.contact{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(30px,6vw,80px);align-items:start}
.contact__links{list-style:none;padding:0;margin:34px 0 0;display:grid;gap:16px}
.contact__links span{display:block;font:700 .75rem var(--f-body);letter-spacing:.22em;text-transform:uppercase;color:var(--green)}
.contact__links a{font-size:clamp(1.05rem,2vw,1.35rem);font-weight:700;color:var(--pink);overflow-wrap:anywhere}
.contact__links a:hover{color:var(--green)}
.form{background:var(--pink);color:var(--black);border:2px solid var(--green);border-radius:8px;padding:clamp(22px,4vw,38px);box-shadow:10px 10px 0 var(--berry);display:grid;gap:18px}
.field{display:grid;gap:6px}
.field label{font:700 .78rem var(--f-body);letter-spacing:.16em;text-transform:uppercase}
.field input,.field select,.field textarea{font:400 1rem var(--f-body);color:var(--black);background:var(--cream);border:2px solid var(--black);border-radius:6px;padding:12px 14px;width:100%}
.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid var(--berry);outline-offset:1px}
.field .bad,.field [aria-invalid="true"]{border-color:var(--rust);background:#ffe3e0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form .btn{justify-self:start;box-shadow:4px 4px 0 var(--black);border-color:var(--black)}
.form .btn:hover{box-shadow:6px 6px 0 var(--black)}
.form .btn[disabled]{opacity:.6;cursor:wait}
.form__status{margin:0;font-weight:700;min-height:1.5em}
.form__status.ok{color:#4a1530}.form__status.err{color:var(--rust)}
.p-thanks{--w:clamp(70px,8vw,110px);--x:2%;--y:5%;--r:-10deg}
.p-star-green{--w:clamp(50px,6vw,80px);--x:92%;--y:88%;--r:16deg;--d:-3s}

/* footer */
.footer{background:var(--black);color:var(--pink);padding:34px 20px;display:flex;flex-wrap:wrap;gap:16px 34px;align-items:center;justify-content:center;border-top:2px solid var(--green)}
.footer img{height:34px;width:auto}
.footer :focus-visible,.nav__ig:focus-visible{outline-color:var(--green)}
.footer p{margin:0;font-size:.9rem}
.footer a{font-weight:700;text-decoration:none}
.footer a:hover{color:var(--green)}

/* reveal */
.js .reveal{opacity:0;translate:0 26px;transition:opacity .7s ease,translate .7s ease}
.js .reveal.in{opacity:1;translate:0 0}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .p-camera{--x:0%;--y:10%;--w:clamp(80px,11vw,140px)}
  .p-like{--x:84%;--y:76%;--w:clamp(80px,10vw,130px)}
}
@media (max-width:900px){
  .p-red{--x:84%;--y:95%}
  .cards{grid-template-columns:repeat(2,1fr)}
  .tiers{grid-template-columns:1fr;max-width:520px}
  .tier--hot{translate:none}
  .owner,.contact{grid-template-columns:1fr}
  .owner__photo{max-width:420px;margin:0 auto}
}
@media (max-width:720px){
  .nav__toggle{display:block}
  .nav__links{position:fixed;inset:64px 0 auto 0;background:var(--pink);flex-direction:column;align-items:flex-start;gap:0;padding:8px 20px 22px;border-bottom:2px solid var(--black);translate:0 -130%;transition:translate .3s;z-index:-1;visibility:hidden}
  .nav__links.open{translate:0 0;visibility:visible}
  .nav__links a{padding:14px 0;width:100%;font-size:1.1rem;border-bottom:1px solid rgba(0,0,0,.2)}
  .nav__links .nav__ig{width:auto;margin-top:14px}
  .cards{grid-template-columns:1fr}
  .card{rotate:0deg!important}
  .p-camera{--x:2%;--y:8%}.p-sparkle{--x:56%;--y:9%}.p-pink{--x:76%;--y:15%}
  .p-like{--x:70%;--y:78%}.p-flame{--x:2%;--y:76%}.p-berry{--x:42%;--y:88%}
  .p-haha{--x:56%;--y:2.5%}.p-flower{--x:-4%;--y:1%}
  .p-hearts{--x:76%;--y:2%}.p-red{--x:80%;--y:97%}
  .p-thanks{--x:70%;--y:1.5%}.p-star-green{--x:80%;--y:93%}
  .p-camera2{--x:76%;--y:2%}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;translate:none}
}