/* ── Footer hanging sign: chains read as bolted to the footer's top border,
   sign hangs down from there, content flows below in normal document order.
   PLACEHOLDER ASSET (see /images/wade-live-logo.webp), swap when the real
   transparent PSD/PNG arrives, same filename so no markup change needed. ── */
.wl-hang-wrap{display:flex;justify-content:center;margin-top:-18px;margin-bottom:18px;pointer-events:none}
.wl-hang-sign{width:200px;height:auto;transform-origin:top center;animation:wl-hang-sway 6s ease-in-out infinite}
@media (min-width:768px){.wl-hang-wrap{margin-top:-26px;margin-bottom:26px}.wl-hang-sign{width:260px}}
@media (max-width:479.98px){.wl-hang-wrap{margin-top:-10px;margin-bottom:10px}.wl-hang-sign{width:120px}}
@keyframes wl-hang-sway{0%,100%{transform:rotate(-1.4deg)}50%{transform:rotate(1.4deg)}}
@media (prefers-reduced-motion:reduce){.wl-hang-sign{animation:none}}

/* ── Wade Live rebrand layer: logo lockup, spotlight hero, header polish ── */

/* Logo lockup (replaces boxed wordmark image) */
.wl-lockup{display:inline-flex;flex-direction:column;line-height:1;position:relative;isolation:isolate}
.wl-lockup__name{font-family:var(--font-display);font-weight:800;font-size:1.55rem;letter-spacing:.03em;color:#fff;display:flex;align-items:baseline;gap:.1em;text-transform:uppercase}
.wl-lockup__name em{font-family:var(--font-serif);font-style:italic;font-weight:500;color:var(--color-gold);font-size:1.22em;line-height:.8;text-transform:none;transform:translateY(1px)}
.wl-lockup__desc{margin-top:.32rem;font-family:var(--font-display);font-size:.52rem;font-weight:600;letter-spacing:.52em;text-transform:uppercase;color:rgba(233,226,207,.62);white-space:nowrap}
@media (min-width:768px){.wl-lockup__name{font-size:1.72rem}.wl-lockup__desc{font-size:.56rem}}
/* hover shine sweep across the name */
.wl-lockup__name{position:relative;overflow:hidden;padding-top:.44em;margin-top:-.44em}
.wl-lockup__name::after{content:"";position:absolute;inset:-4px;background:linear-gradient(115deg,transparent 42%,rgba(255,244,214,.55) 50%,transparent 58%);transform:translateX(-130%);pointer-events:none}
a:hover .wl-lockup__name::after{transition:transform .8s ease;transform:translateX(130%)}

/* Footer variant */
.wl-lockup--footer .wl-lockup__name{font-size:1.9rem}
.wl-lockup--footer .wl-lockup__desc{font-size:.55rem}
.wl-tagline{margin-top:.55rem;font-family:var(--font-display);font-size:.62rem;font-weight:600;letter-spacing:.42em;text-transform:uppercase;color:var(--color-gold)}

/* Header: scroll progress hairline + shrink */
.wl-progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:60;background:linear-gradient(90deg,var(--color-gold-deep),var(--color-gold),#f5cd7e);box-shadow:0 0 8px rgba(232,168,56,.55);pointer-events:none}
header.wl-shrunk .wl-lockup__name{font-size:1.35rem;transition:font-size .35s ease}
@media (min-width:768px){header.wl-shrunk .wl-lockup__name{font-size:1.5rem}}
.wl-lockup__name{transition:font-size .35s ease}

/* CTA sheen */
.btn-gold{position:relative;overflow:hidden}
.btn-gold::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,250,235,.5) 50%,transparent 60%);transform:translateX(-140%);animation:wl-sheen 6s ease-in-out infinite;pointer-events:none}
@keyframes wl-sheen{0%,72%{transform:translateX(-140%)}86%{transform:translateX(140%)}100%{transform:translateX(140%)}}

/* Pillar cards: photo layer that lights up on hover (spotlight motif) */
.pillar{overflow:hidden}
.pillar__photo{position:absolute;inset:0;background-size:cover;background-repeat:no-repeat;opacity:.6;filter:grayscale(.35) brightness(.62) contrast(1.05);transform:scale(1.05);transition:opacity .55s ease,filter .55s ease,transform .9s cubic-bezier(.22,1,.36,1);pointer-events:none}
.pillar__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,20,.42) 0%,rgba(10,12,20,.6) 38%,rgba(10,12,20,.88) 62%,rgba(10,12,20,.97) 100%)}
.pillar:hover .pillar__photo{opacity:.85;filter:grayscale(0) brightness(.78) contrast(1.02);transform:scale(1.12)}
.pillar__icon,.pillar__title,.pillar__body{position:relative;z-index:1}
.pillar .pillar__icon{background:radial-gradient(circle at 50% 32%,rgba(232,168,56,.24),rgba(232,168,56,.06) 70%),rgba(10,12,20,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
@media (hover:none){.pillar__photo{opacity:.7;filter:grayscale(.1) brightness(.66)}}
@media (prefers-reduced-motion:reduce){.pillar__photo{transition:none}}

/* Spotlight hero */
.wl-veil{position:absolute;inset:0;background:rgba(8,10,18,.52);backdrop-filter:saturate(.55) brightness(.82);-webkit-backdrop-filter:saturate(.55) brightness(.82);
  -webkit-mask-image:radial-gradient(circle var(--spot-r,300px) at var(--spot-x,68%) var(--spot-y,44%),transparent 0 34%,rgba(0,0,0,.72) 68%,#000 100%);
  mask-image:radial-gradient(circle var(--spot-r,300px) at var(--spot-x,68%) var(--spot-y,44%),transparent 0 34%,rgba(0,0,0,.72) 68%,#000 100%);
  pointer-events:none}
.wl-spot-glow{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(circle calc(var(--spot-r,300px)*.85) at var(--spot-x,68%) var(--spot-y,44%),rgba(255,213,138,.24) 0%,rgba(255,196,94,.08) 45%,transparent 70%)}
.wl-beam{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:.5}
.wl-sparks{position:absolute;inset:0;pointer-events:none;z-index:30}
@media (prefers-reduced-motion:reduce){
  .wl-veil{background:rgba(8,10,18,.22);-webkit-mask-image:none;mask-image:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .wl-spot-glow,.wl-beam{display:none}
  .btn-gold::before{animation:none}
}

/* ── Stepped booking form (progressive enhancement) ── */
.book-form.wl-stepped{grid-template-columns:1fr}
.book-form.wl-stepped .book-field{display:none}
.book-form.wl-stepped .book-field.wl-active{display:flex;animation:wl-step-in .45s cubic-bezier(.22,1,.36,1)}
@keyframes wl-step-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.book-form.wl-stepped .book-actions{display:none}
.book-form.wl-stepped.wl-last .book-actions{display:flex;animation:wl-step-in .45s cubic-bezier(.22,1,.36,1)}
.wl-step-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.25rem}
.wl-step-count{font-family:var(--font-display);font-size:.68rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--color-gold)}
.wl-step-dots{display:flex;gap:.45rem}
.wl-step-dots i{width:7px;height:7px;border-radius:50%;background:rgba(233,226,207,.22);transition:background .3s,transform .3s}
.wl-step-dots i.on{background:var(--color-gold);transform:scale(1.25)}
.wl-step-react{min-height:1.4em;font-family:var(--font-serif);font-style:italic;font-size:1.02rem;color:rgba(233,226,207,.78);margin:.2rem 0 .4rem}
.wl-step-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.6rem}
.wl-step-back{font-family:var(--font-display);font-size:.7rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:rgba(233,226,207,.55);background:none;border:0;cursor:pointer;padding:.5rem 0;transition:color .3s}
.wl-step-back:hover{color:var(--color-gold)}
.wl-step-back[hidden]{visibility:hidden;display:block}
.book-form.wl-stepped.wl-last .wl-step-next{display:none}

/* ── Meet Wade ── */
.wl-meet-grid{display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:center}
@media (min-width:768px){.wl-meet-grid{grid-template-columns:5fr 6fr;gap:4rem}}
.wl-meet-photo{position:relative;border-radius:6px;overflow:hidden;border:1px solid rgba(232,168,56,.35);box-shadow:0 40px 80px -40px rgba(0,0,0,.9),0 0 60px -30px rgba(232,168,56,.35);transform:rotate(-1.2deg);transition:transform .6s cubic-bezier(.22,1,.36,1)}
.wl-meet-photo:hover{transform:rotate(0) scale(1.015)}
.wl-meet-photo img{display:block;width:100%;height:auto}
.wl-meet-photo figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.6rem 1rem .55rem;background:linear-gradient(180deg,transparent,rgba(10,12,20,.85));font-family:var(--font-display);font-size:.58rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:rgba(233,226,207,.55);text-align:right}
.wl-meet-stats{display:flex;gap:2.2rem;margin-top:1.9rem;justify-content:center}
@media (min-width:768px){.wl-meet-stats{justify-content:flex-start}}
.wl-meet-stats b{display:block;font-family:var(--font-display);font-weight:800;font-size:1.7rem;color:var(--color-gold);line-height:1}
.wl-meet-stats span{display:block;margin-top:.35rem;font-family:var(--font-display);font-size:.6rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:rgba(233,226,207,.6)}

/* ── In good company logo row (reviews) ── */
.wl-logo-band{margin-top:4rem;text-align:center}
.wl-logo-row{margin-top:1.6rem;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1.4rem 2rem;align-items:center;justify-items:center}
@media (max-width:767px){.wl-logo-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem 2rem;max-width:300px;margin-left:auto;margin-right:auto}}
.wl-logo-row img{max-height:44px;max-width:110px;width:auto;object-fit:contain;filter:grayscale(1) invert(1) brightness(1.3) contrast(1.05);opacity:.6;transition:opacity .35s,transform .35s}
.wl-logo-row img:hover{opacity:1;transform:translateY(-2px)}
@media (max-width:767px){.wl-logo-row img{max-height:34px;max-width:110px;opacity:.75}}

/* ── SVG seal ── */
.guarantee-seal-art__img text{font-family:var(--font-display)}

/* ── Custom hero cursor: gold ring, grows over links; native cursor hidden only when JS activates it ── */
@media (hover:hover) and (pointer:fine){
  section.hero.wl-has-cursor, section.hero.wl-has-cursor a, section.hero.wl-has-cursor button{cursor:none}
}
.wl-cursor{position:fixed;top:0;left:0;width:26px;height:26px;margin:-13px 0 0 -13px;border:1.5px solid rgba(232,168,56,.9);border-radius:50%;z-index:80;pointer-events:none;opacity:0;box-shadow:0 0 14px -3px rgba(232,168,56,.6);transition:opacity .25s ease,width .25s ease,height .25s ease,margin .25s ease,background .25s ease}
.wl-cursor::after{content:"";position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:#f5cd7e}
.wl-cursor.on{opacity:1}
.wl-cursor.is-link{width:46px;height:46px;margin:-23px 0 0 -23px;background:rgba(232,168,56,.12)}
@media (prefers-reduced-motion:reduce),(hover:none){.wl-cursor{display:none}}

/* ── Static hero photo (Wade pointing, crowd baked in). Replaced the 3-frame
   crossfade + cutout-stack combo: this single photo already contains Wade,
   so no separate cutout layer. Object-position differs by breakpoint since
   the photo is landscape with Wade on the right and dark space on the left;
   a narrow portrait crop needs to shift further right to keep his face and
   pointing hand in frame. ── */
.wl-hero-static{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% 30%}
@media (max-width:767.98px){.wl-hero-static{object-position:66% 20%}}


/* ── The Spark: dot of the i in Live becomes a magic spark ── */
.wl-i{position:relative;font-style:inherit}
.wl-spark{position:absolute;left:50%;top:.02em;width:.4em;height:.4em;margin-left:-.2em;background:#f5cd7e;
  clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);
  filter:drop-shadow(0 0 5px rgba(245,205,126,.85));
  animation:wl-twinkle 3.4s ease-in-out infinite}
.wl-spark::after{content:"";position:absolute;right:-.3em;top:-.06em;width:.13em;height:.13em;border-radius:50%;background:#e8a838}
@keyframes wl-twinkle{0%,100%{transform:scale(1) rotate(0deg)}50%{transform:scale(.78) rotate(22deg)}}
a:hover .wl-spark{animation:wl-twinkle .7s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.wl-spark{animation:none}}
