/* ════════════════════════════════════════════════════════════
   GSR Basements — shared motion, dynamic accents & hero video
   Loaded on every page AFTER the page's inline <style>.
   ════════════════════════════════════════════════════════════ */

/* ---- Animated gold "Basements" wordmark ---- */
.logo .b{
  color:#A9772E;
  background:linear-gradient(90deg,#9A7830 0%,#DCB86B 45%,#A9772E 55%,#9A7830 100%);
  background-size:220% auto;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:gsrLogoShimmer 4.5s linear infinite;
}
@keyframes gsrLogoShimmer{0%{background-position:0% center}100%{background-position:220% center}}
.logo .bar{animation:gsrBarPulse 2.6s ease-in-out infinite;transform-origin:center}
@keyframes gsrBarPulse{0%,100%{opacity:.55;transform:scaleY(.9)}50%{opacity:1;transform:scaleY(1.18)}}

/* ---- Animated "financing available" pill (matches .fin-pill / .hero-finpill) ---- */
.fin-pill,.hero-finpill{position:relative;overflow:hidden}
.fin-pill::after,.hero-finpill::after{content:'';position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);animation:gsrPillShine 3.4s ease-in-out infinite;pointer-events:none}
@keyframes gsrPillShine{0%{left:-130%}55%,100%{left:170%}}

/* ---- Scroll reveal (motion) ---- */
html.gsr-motion [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.4,0,.2,1),transform .7s cubic-bezier(.4,0,.2,1);will-change:opacity,transform}
html.gsr-motion [data-reveal].in{opacity:1;transform:none}

/* ---- Shared hero walkthrough video (service pages) ---- */
.gsr-herovid{position:relative;max-width:360px;width:100%;margin:0 auto}
.gsr-herovid-inner{position:relative;aspect-ratio:9/16;border-radius:10px;overflow:hidden;background:#000;box-shadow:0 26px 64px rgba(30,24,19,.22);cursor:pointer}
.gsr-herovid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.gsr-hgrad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,24,19,.25) 0%,transparent 35%,transparent 55%,rgba(30,24,19,.74) 100%);pointer-events:none;transition:opacity .35s}
.gsr-hcap{position:absolute;left:16px;right:16px;bottom:16px;color:#F6F1E6;z-index:2;transition:opacity .35s}
.gsr-hcap .nm{font-weight:800;font-size:15px}
.gsr-hcap .pr{font-size:12.5px;color:#D8CFBE;margin-top:2px}
.gsr-hbadge{position:absolute;right:-12px;top:-16px;z-index:5;background:#211B14;color:#DCB86B;border-radius:12px;padding:14px 16px;text-align:center;box-shadow:0 16px 40px rgba(30,24,19,.4);border:1px solid rgba(220,184,107,.35);transition:opacity .35s}
.gsr-hbadge .n{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:26px;line-height:.9}
.gsr-hbadge .l{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:#B6AD9A;font-weight:700;margin-top:5px}
.gsr-sound{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:8px;background:rgba(20,17,13,.74);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1.5px solid #DCB86B;color:#F6F1E6;font-family:'Manrope',sans-serif;font-weight:800;font-size:14px;padding:14px 24px;border-radius:40px;cursor:pointer;transition:background .2s;box-shadow:0 8px 26px rgba(0,0,0,.4);animation:gsrSoundPulse 2.2s ease-in-out infinite;z-index:4}
.gsr-sound:hover{background:rgba(20,17,13,.92)}
.gsr-sound .d{width:8px;height:8px;border-radius:50%;background:#DCB86B}
@keyframes gsrSoundPulse{0%,100%{box-shadow:0 8px 26px rgba(0,0,0,.4),0 0 0 0 rgba(220,184,107,.5)}50%{box-shadow:0 8px 26px rgba(0,0,0,.4),0 0 0 9px rgba(220,184,107,0)}}

/* ---- Shared inline self-hosted video (testimonials, watch & learn) ---- */
/* Natural aspect (never cropped) · tap to play WITH sound from the top · buttons hide on tap */
.gsr-vid{position:relative;border-radius:10px;overflow:hidden;background:#000;cursor:pointer;line-height:0;box-shadow:0 10px 30px rgba(30,24,19,.14);max-width:300px;margin-left:auto;margin-right:auto;}
.gsr-vid video{width:100%;height:auto;display:block;}
.gsr-vplay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:68px;height:68px;border-radius:50%;background:rgba(20,16,12,.58);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;transition:opacity .25s;z-index:3;pointer-events:none;}
.gsr-vplay::after{content:'';border-left:21px solid #fff;border-top:13px solid transparent;border-bottom:13px solid transparent;margin-left:5px;}
.gsr-vsound{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:7px;white-space:nowrap;background:rgba(20,16,12,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1.5px solid #DCB86B;color:#F6F1E6;font-family:'Manrope',sans-serif;font-weight:800;font-size:12.5px;padding:8px 15px;border-radius:40px;z-index:4;transition:opacity .25s;}
.gsr-vid--playing .gsr-vplay{opacity:0;}
.gsr-vid--engaged .gsr-vsound{opacity:0;pointer-events:none;}

/* ---- Respect reduced-motion preference ---- */
@media(prefers-reduced-motion:reduce){
  .logo .b,.logo .bar{animation:none}
  .fin-pill::after,.hero-finpill::after{display:none}
  .gsr-sound{animation:none}
  html.gsr-motion [data-reveal]{opacity:1;transform:none;transition:none}
}

/* ---- Bigger footer tap targets on mobile (easier to thumb-tap) ---- */
@media(max-width:768px){
  .foot-col .links{gap:6px}
  .foot-col .links a{display:inline-block;padding:7px 0}
}