/* =========================================================================
   Shiv Shakti — shared site footer
   Used by every page via assets/site-footer.js. Edit here once.
   Namespaced with .ss- so it never collides with the page stylesheets.
   ========================================================================= */
.ss-footer{
  position:relative;
  background:
    radial-gradient(120% 140% at 82% -20%, rgba(217,176,74,.14), transparent 58%),
    radial-gradient(90% 120% at 8% 0%, rgba(110,22,34,.5), transparent 60%),
    linear-gradient(180deg,#320810 0%,var(--ss-maroon-950,#280509) 100%);
  color:#cbb9a6;
  overflow:hidden;
  isolation:isolate;
}
.ss-footer::before{           /* gold hairline, mirrors the header */
  content:""; position:absolute; inset:0 0 auto; height:2px;
  background:linear-gradient(90deg,transparent,var(--ss-gold-500,#c79a2e) 22%,var(--ss-gold-300,#e8c876) 50%,var(--ss-gold-500,#c79a2e) 78%,transparent);
  opacity:.7;
}
.ss-footer::after{            /* faint devotional watermark */
  content:""; position:absolute; right:-140px; bottom:-180px; z-index:-1;
  width:560px; height:560px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(232,200,118,.12),transparent 62%);
}
.ss-foot-in{max-width:var(--ss-shell,1320px); margin:0 auto; padding:0 var(--ss-shell-pad,32px);}

/* ------------------------------------------------------------- newsletter */
.ss-foot-news{
  display:flex; align-items:center; justify-content:space-between; gap:30px 48px;
  flex-wrap:wrap;
  padding:34px 0 32px;
  border-bottom:1px solid rgba(217,176,74,.18);
}
.ss-foot-news h4{
  font-family:var(--display,'Cinzel',serif);
  font-size:1.5rem; margin:0 0 7px; letter-spacing:.02em;
  color:var(--ss-cream,#fbf5e8);
}
.ss-foot-news p{margin:0; font-size:.88rem; color:#b9a48e; max-width:460px;}
.ss-foot-news form{display:flex; gap:10px; flex:1 1 380px; max-width:520px;}
.ss-foot-news input{
  flex:1; min-width:0;
  background:rgba(251,245,232,.06);
  border:1px solid rgba(217,176,74,.3);
  border-radius:999px; padding:13px 22px;
  color:var(--ss-cream,#fbf5e8); font-family:inherit; font-size:.9rem;
}
.ss-foot-news input::placeholder{color:#a08c78;}
.ss-foot-news input:focus{outline:none; border-color:var(--ss-gold-400,#d9b04a); background:rgba(251,245,232,.1);}
.ss-foot-news button{
  flex:none; border:0; border-radius:999px; cursor:pointer;
  padding:13px 28px; font-family:inherit; font-size:.86rem; font-weight:600; letter-spacing:.03em;
  background:linear-gradient(135deg,var(--ss-gold-400,#d9b04a),var(--ss-gold-600,#a9791f));
  color:var(--ss-maroon-950,#280509);
  transition:filter .25s, transform .25s;
}
.ss-foot-news button:hover{filter:brightness(1.08); transform:translateY(-1px);}
.ss-foot-note{
  margin:12px 0 0; font-size:.75rem; color:#8d7a68;
  display:flex; align-items:center; gap:7px;
}
.ss-foot-note svg{width:13px; height:13px; color:var(--ss-gold-500,#c79a2e);}

/* ------------------------------------------------------------------- grid */
.ss-foot-grid{
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1.25fr; gap:44px;
  padding:52px 0 46px;
  border-bottom:1px solid rgba(217,176,74,.18);
}
.ss-foot-brand .ss-brand{margin-bottom:18px;}
.ss-foot-brand p{font-size:.87rem; line-height:1.75; max-width:320px; margin:0;}
.ss-foot-social{display:flex; gap:10px; margin-top:20px;}
/* each icon wears its own brand colour; --glow tints the hover halo */
.ss-foot-social a{
  --glow:rgba(255,255,255,.35);
  width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#fff;
  box-shadow:0 8px 18px -10px rgba(0,0,0,.8), inset 0 0 0 1px rgba(255,255,255,.18);
  transition:transform .35s var(--ss-ease,cubic-bezier(.22,.61,.36,1)), box-shadow .35s, filter .3s;
}
.ss-foot-social a svg{width:18px; height:18px;}
.ss-foot-social a:hover{
  transform:translateY(-4px) scale(1.06);
  filter:brightness(1.08);
  box-shadow:0 12px 22px -8px var(--glow), 0 0 0 3px rgba(255,255,255,.12);
}
.ss-foot-social .ss-s-ig{
  --glow:rgba(221,42,123,.75);
  background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%);
}
.ss-foot-social .ss-s-fb{--glow:rgba(24,119,242,.75); background:#1877f2;}
.ss-foot-social .ss-s-wa{--glow:rgba(37,211,102,.7); background:linear-gradient(145deg,#2fdc72,#1ea952);}
.ss-foot-social .ss-s-mail{--glow:rgba(234,67,53,.7); background:linear-gradient(145deg,#f0594a,#c5221f);}
.ss-foot-col h5{
  font-family:var(--display,'Cinzel',serif);
  color:var(--ss-gold-300,#e8c876);
  font-size:.96rem; letter-spacing:.06em; margin:0 0 18px; font-weight:600;
}
.ss-foot-col ul{margin:0; padding:0; list-style:none;}
.ss-foot-col li{margin-bottom:11px;}
.ss-foot-col li a{
  display:inline-block; font-size:.87rem; color:#cbb9a6; text-decoration:none;
  transition:color .3s, transform .35s var(--ss-ease,cubic-bezier(.22,.61,.36,1));
}
.ss-foot-col li a:hover{color:var(--ss-gold-300,#e8c876); transform:translateX(5px);}

/* --------------------------------------------------------------- contact */
.ss-foot-contact{margin:0; padding:0; list-style:none;}
.ss-foot-contact li{
  display:flex; gap:12px; align-items:flex-start;
  font-size:.85rem; line-height:1.6; margin-bottom:16px;
}
.ss-foot-contact .ic{
  flex:none; width:32px; height:32px; border-radius:9px;
  display:grid; place-items:center; margin-top:1px;
  background:rgba(217,176,74,.1); border:1px solid rgba(217,176,74,.26);
  color:var(--ss-gold-300,#e8c876);
}
.ss-foot-contact .ic svg{width:15px; height:15px;}
.ss-foot-contact a{color:#cbb9a6; text-decoration:none; transition:color .25s;}
.ss-foot-contact a:hover{color:var(--ss-gold-300,#e8c876);}
.ss-foot-contact .sep{color:#7e6c5c; margin:0 3px;}

/* ----------------------------------------------------------- bottom strip */
.ss-foot-bottom{
  display:flex; align-items:center; justify-content:space-between; gap:12px 26px;
  flex-wrap:wrap; padding:20px 0 24px;
  padding-right:72px;          /* keeps clear of the floating back-to-top button */
  font-size:.78rem; color:#9a8676;
}
.ss-foot-legal{display:flex; align-items:center; gap:18px; flex-wrap:wrap;}
.ss-foot-legal a{color:#9a8676; text-decoration:none; transition:color .25s;}
.ss-foot-legal a:hover{color:var(--ss-gold-300,#e8c876);}
.ss-foot-credit{color:#8d7a68;}
.ss-foot-credit a{
  color:var(--ss-gold-400,#d9b04a); font-weight:600; text-decoration:none;
  border-bottom:1px solid rgba(217,176,74,.35); transition:color .25s, border-color .25s;
}
.ss-foot-credit a:hover{color:var(--ss-gold-300,#e8c876); border-bottom-color:currentColor;}

/* --------------------------------------------------------- back to top */
.ss-totop{
  position:relative;                     /* lives in the .ss-float column */
  width:52px; height:52px; border-radius:50%; border:0; padding:0; cursor:pointer;
  display:grid; place-items:center;
  color:var(--ss-gold-300,#e8c876); background:var(--ss-maroon-900,#3a0a11);
  box-shadow:0 14px 30px -10px rgba(40,5,9,.75);
  opacity:0; visibility:hidden; transform:translateY(16px);
  transition:opacity .4s, visibility .4s, transform .5s var(--ss-ease,cubic-bezier(.22,.61,.36,1)), background .3s;
}
.ss-totop.is-on{opacity:1; visibility:visible; transform:translateY(0);}
.ss-totop:hover{background:var(--ss-maroon-700,#6e1622);}
.ss-totop .ring{position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg);}
.ss-totop .ring circle{
  fill:none; stroke:var(--ss-gold-400,#d9b04a); stroke-width:2.5; stroke-linecap:round;
  stroke-dasharray:151; stroke-dashoffset:151;
}
.ss-totop .arrow{width:18px; height:18px; transition:transform .4s var(--ss-ease,cubic-bezier(.22,.61,.36,1));}
.ss-totop:hover .arrow{transform:translateY(-3px);}

/* ------------------------------------------- floating WhatsApp + call */
/* --ss-dock-lift lets a page raise the column over its own bottom bar */
.ss-float{
  position:fixed; right:24px; bottom:calc(24px + var(--ss-dock-lift,0px)); z-index:90;
  display:flex; flex-direction:column; align-items:center; gap:12px;
  transition:bottom .3s var(--ss-ease,cubic-bezier(.22,.61,.36,1));
}
.ss-float-btn{
  position:relative; width:56px; height:56px; border-radius:50%;
  display:grid; place-items:center; text-decoration:none; color:#fff;
  animation:ssFloatIn .6s var(--ss-ease,cubic-bezier(.22,.61,.36,1)) backwards;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s;
}
.ss-float-btn svg{width:26px; height:26px; position:relative; z-index:1;}
.ss-float-btn:hover{transform:translateY(-3px) scale(1.06);}
.ss-float-wa{
  animation-delay:.9s;
  background:linear-gradient(145deg,#2fdc72,#1ea952);
  box-shadow:0 14px 28px -10px rgba(30,169,82,.85), inset 0 0 0 1px rgba(255,255,255,.25);
}
.ss-float-call{
  animation-delay:1.05s;
  color:var(--ss-gold-300,#e8c876);
  background:linear-gradient(145deg,var(--ss-maroon-700,#6e1622),var(--ss-maroon-950,#280509));
  box-shadow:0 14px 28px -10px rgba(40,5,9,.85), inset 0 0 0 1px rgba(217,176,74,.45);
}
.ss-float-call svg{width:22px; height:22px;}
/* WhatsApp sends out a soft ripple every few seconds; the phone gives a small ring */
.ss-float-wa::before, .ss-float-wa::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  border:2px solid rgba(37,211,102,.6);
  animation:ssRipple 3.2s ease-out 2s infinite;
}
.ss-float-wa::after{animation-delay:2.5s;}
.ss-float-call svg{animation:ssRing 4s ease-in-out 3s infinite; transform-origin:50% 60%;}
@keyframes ssFloatIn{from{opacity:0; transform:translateY(18px) scale(.6);}}
@keyframes ssRipple{0%{opacity:.9; transform:scale(1);} 70%,100%{opacity:0; transform:scale(1.7);}}
@keyframes ssRing{
  0%,70%,100%{transform:rotate(0);}
  74%{transform:rotate(-14deg);} 78%{transform:rotate(12deg);}
  82%{transform:rotate(-10deg);} 86%{transform:rotate(8deg);} 90%{transform:rotate(0);}
}
/* label slides out to the left on hover / keyboard focus */
.ss-float-tip{
  position:absolute; right:calc(100% + 12px); top:50%;
  padding:8px 14px; border-radius:999px; white-space:nowrap;
  font-size:.8rem; font-weight:600; letter-spacing:.02em;
  color:var(--ss-maroon-900,#3a0a11); background:#fffdf8;
  box-shadow:0 10px 24px -12px rgba(40,5,9,.6), 0 0 0 1px rgba(169,121,31,.25);
  opacity:0; visibility:hidden; transform:translate(8px,-50%);
  transition:opacity .25s, visibility .25s, transform .35s var(--ss-ease,cubic-bezier(.22,.61,.36,1));
  pointer-events:none;
}
.ss-float-btn:hover .ss-float-tip, .ss-float-btn:focus-visible .ss-float-tip{
  opacity:1; visibility:visible; transform:translate(0,-50%);
}

/* ------------------------------------------------------------ responsive */
@media (max-width:1080px){
  .ss-foot-grid{grid-template-columns:1fr 1fr; gap:38px;}
  .ss-foot-brand{grid-column:1 / -1;}
  .ss-foot-in{padding:0 22px;}
}
@media (max-width:760px){
  .ss-foot-in{padding:0 16px;}
  .ss-foot-news{padding:28px 0; gap:18px;}
  .ss-foot-news h4{font-size:1.28rem;}
  .ss-foot-news form{flex:1 1 100%; max-width:none;}
  .ss-foot-news button{padding:13px 20px;}
  /* Shop + Company side by side; brand and contact keep the full width */
  .ss-foot-grid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px 20px; padding:36px 0 32px;}
  .ss-foot-grid > .ss-foot-col:last-child{grid-column:1 / -1;}
  .ss-foot-brand p{max-width:none;}
  .ss-foot-col h5{margin-bottom:12px;}
  .ss-foot-col li{margin-bottom:4px;}
  .ss-foot-col li a{padding:3px 0; line-height:1.5;}
  .ss-foot-contact li{margin-bottom:12px;}
  .ss-foot-bottom{
    justify-content:flex-start; font-size:.75rem;
    padding:18px 0 78px; padding-right:0;
  }
  .ss-totop{width:46px; height:46px;}
  .ss-float{right:16px; bottom:calc(16px + var(--ss-dock-lift,0px)); gap:10px;}
  .ss-float-btn{width:50px; height:50px;}
  .ss-float-btn svg{width:23px; height:23px;}
  .ss-float-call svg{width:20px; height:20px;}
  .ss-float-tip{display:none;}               /* no hover on touch screens */
  .ss-totop .arrow{width:16px; height:16px;}
}
@media (prefers-reduced-motion:reduce){
  .ss-foot-col li a, .ss-foot-social a, .ss-totop{transition-duration:.01ms !important;}
  .ss-float-btn, .ss-float-btn svg, .ss-float-wa::before, .ss-float-wa::after{animation:none !important;}
}
