Add estimates package modals, magical animations and pricing links

- estimates: per-package detail modals with min/max breakdown and specs,
  opening with a wand-flick spiral spring and sparkle trail, closing with a
  perimeter sparkle burst
- home: pricing teaser section linking to estimates; contact form pre-fills
  a message when arriving from a package "Enquire" link
- mascot: Star Trek-style teleport-in (delay, sparkle charge, bottom-up
  materialise with near-white energy wash and rising sparkle beam)
- buttons: wand-sparkle swipe speed and density now scale with button width
- themed scrollbars site-wide with stable gutter to stop modal scroll shift

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

css/style.css

@@ -32,7 +32,11 @@
 
 /* --- Reset --- */
 *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
-html { scroll-behavior: smooth; }
+html {
+    scroll-behavior: smooth;
+    background: #251D70;          /* matches dark sections so the reserved gutter blends */
+    scrollbar-gutter: stable;     /* reserve scrollbar space so locking scroll doesn't shift the page */
+}
 body {
     font-family: var(--font-body);
     color: var(--text);
@@ -40,6 +44,23 @@ body {
     line-height: 1.6;
     overflow-x: hidden;
 }
+
+/* --- Custom scrollbars (themed) --- */
+html { scrollbar-width: thin; scrollbar-color: rgba(251,191,36,0.55) rgba(255,255,255,0.06); }
+.pkg-modal, .nav-links { scrollbar-width: thin; scrollbar-color: rgba(251,191,36,0.55) rgba(255,255,255,0.06); }
+::-webkit-scrollbar { width: 12px; height: 12px; }
+::-webkit-scrollbar-track { background: rgba(255,255,255,0.05); }
+::-webkit-scrollbar-thumb {
+    background: linear-gradient(180deg, var(--gold), var(--orange));
+    background-clip: padding-box;
+    border: 3px solid transparent;   /* slims the thumb and leaves breathing room in the track */
+    border-radius: 10px;
+}
+::-webkit-scrollbar-thumb:hover {
+    background: linear-gradient(180deg, var(--orange), var(--gold));
+    background-clip: padding-box;
+}
+::-webkit-scrollbar-corner { background: transparent; }
 img { max-width: 100%; display: block; }
 a { text-decoration: none; color: inherit; }
 ul { list-style: none; }
@@ -397,6 +418,8 @@ ul { list-style: none; }
     display: block;
     filter: drop-shadow(0 8px 24px rgba(0,0,0,0.35));
 }
+/* Hidden until the JS "transporter" effect materialises it (see main.js) */
+.mascot-teleport { opacity: 0; }
 
 /* Wave */
 .hero-wave {
@@ -672,6 +695,13 @@ ul { list-style: none; }
     transform: translateX(4px);
 }
 
+/* ================================================
+   PRICING TEASER
+   ================================================ */
+.pricing-teaser { background: #3B2DA8; }
+.pricing-teaser .section-header { margin-bottom: 0; }
+.pricing-teaser-btn { margin-top: 32px; }
+
 /* ================================================
    CONTACT
    ================================================ */