/* VOLVO.COM.UA — final support + seamless footer, v28 */

/* Final support section: same typography as the story, transparent artwork. */
.support-final{
  position:relative;
  margin-top:8px;
  margin-bottom:0;
  padding:2px 0 8px;
  text-align:left;
  background:transparent!important;
}
.support-final-art{
  display:block;
  width:min(1220px,calc(100vw - 26px));
  max-width:none;
  height:auto;
  margin:0 0 -8px 50%;
  transform:translateX(-50%);
  background:transparent!important;
  filter:drop-shadow(0 8px 14px rgba(32,91,125,.045));
}
.support-final-copy{
  width:100%;
  max-width:none!important;
  margin:0 auto;
  padding:0 18px;
  text-align:left;
  background:transparent!important;
}
.support-final-copy p{
  margin:0 0 11px!important;
  font-size:18px!important;
  line-height:1.64!important;
  color:#153d59!important;
  font-weight:650!important;
  letter-spacing:.003em!important;
  text-align:justify!important;
  text-align-last:left!important;
  text-justify:inter-word!important;
  hyphens:none!important;
  -webkit-hyphens:none!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.support-final-copy p:last-of-type{margin-bottom:0!important}
.support-final-action{text-align:center;margin-top:13px}
.support-final-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  min-height:42px;
  padding:8px 18px 8px 20px;
  border:1px solid rgba(31,105,158,.38);
  border-radius:12px;
  background:rgba(255,255,255,.56);
  box-shadow:0 5px 15px rgba(24,80,118,.07),inset 0 0 0 1px rgba(255,255,255,.52);
  color:#0d5d9e;
  text-decoration:none;
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.support-final-button span{font-size:23px;line-height:1;color:#d5a91a;margin-top:-2px}
.support-final-button:hover{
  transform:translateY(-1px);
  border-color:rgba(11,92,157,.62);
  background:rgba(255,255,255,.84);
  box-shadow:0 7px 18px rgba(24,80,118,.10),0 0 0 2px rgba(236,190,42,.08);
}

/* Footer is the visual ending of the page, not a separate box. */
.club-final-footer{
  position:relative;
  width:100%;
  max-width:none;
  margin:-2px 0 0;
  padding:44px 0 0;
  overflow:hidden;
  color:#24526f;
  border:0!important;
  background:linear-gradient(to bottom,
    rgba(247,251,253,0) 0%,
    rgba(244,250,253,.38) 14%,
    rgba(236,247,252,.72) 48%,
    rgba(232,245,251,.92) 100%);
}
.club-final-footer::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:92px;
  pointer-events:none;
  background:linear-gradient(to bottom,rgba(247,251,253,0),rgba(247,251,253,.64) 56%,rgba(247,251,253,0));
}
.club-final-visual{
  position:relative;
  z-index:1;
  width:100%;
  max-width:none;
  margin:0;
}
.club-final-visual>img{
  display:block;
  width:100%;
  max-width:none;
  height:auto;
  margin:0;
  background:transparent!important;
  filter:drop-shadow(0 -5px 15px rgba(45,103,137,.025));
}
.club-final-join{
  position:absolute;
  z-index:4;
  left:70.2%;
  top:69.0%;
  width:10.9%;
  height:11.6%;
  border-radius:14px;
}
.club-final-join:focus-visible{
  outline:3px solid rgba(236,190,42,.9);
  outline-offset:3px;
}

/* Navigation and copyright now sit on the footer artwork. */
.club-final-meta{
  position:absolute;
  z-index:5;
  left:50%;
  bottom:10px;
  transform:translateX(-50%);
  width:min(1060px,calc(100% - 42px));
  padding:6px 14px 5px;
  border:1px solid rgba(101,153,184,.13);
  border-radius:15px;
  background:rgba(247,251,253,.70);
  box-shadow:0 4px 15px rgba(24,75,105,.045);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
.club-final-links{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:3px 8px;
  width:100%;
  margin:0;
  padding:0;
  border:0;
  font-size:11.5px;
  line-height:1.3;
}
.club-final-links a{
  color:#1d587e;
  text-decoration:none;
  font-weight:650;
  white-space:nowrap;
}
.club-final-links a:hover{
  color:#0b72b5;
  text-decoration:underline;
  text-decoration-color:#e8b822;
  text-underline-offset:3px;
}
.club-final-links span{color:#d9ad22;font-size:9px}
.club-final-copy{
  margin-top:3px;
  text-align:center;
  font-size:9px;
  line-height:1.25;
  color:#758f9f;
}

@media(max-width:900px){
  .support-final-art{width:min(1160px,calc(100vw - 16px));margin-bottom:-4px}
  .support-final-copy{padding:0 10px}
  .support-final-copy p{font-size:17px!important;line-height:1.64!important;font-weight:650!important}
  .club-final-footer{padding-top:30px}
  .club-final-meta{bottom:7px;width:calc(100% - 24px);padding:5px 9px 4px}
  .club-final-links{font-size:10.5px;gap:3px 6px}
  .club-final-copy{font-size:8.5px}
}
@media(max-width:560px){
  .support-final{padding-bottom:2px}
  .support-final-art{width:calc(100vw - 6px);margin-bottom:2px}
  .support-final-copy{padding:0 5px}
  .support-final-copy p{font-size:16px!important;line-height:1.6!important;font-weight:650!important}
  .support-final-action{margin-top:10px}
  .support-final-button{min-height:40px;padding:7px 14px;font-size:12px}
  .club-final-footer{padding-top:20px}
  .club-final-visual>img{width:122%;max-width:none;margin-left:-11%}
  .club-final-join{left:69%;top:68.5%;width:13.5%;height:12.5%}
  .club-final-meta{
    bottom:4px;
    width:calc(100% - 14px);
    padding:4px 7px 3px;
    border-radius:11px;
    background:rgba(247,251,253,.76);
  }
  .club-final-links{font-size:9.5px;gap:2px 5px;line-height:1.22}
  .club-final-links span{display:none}
  .club-final-links a{padding:1px 2px}
  .club-final-copy{margin-top:2px;font-size:7.8px}
}
