/* ==================================================
   footer.css — «Підвал» сайту
   PROD build 26-04-2025
   ================================================== */

/* ---------- wrapper -------------------------------- */
.footer{
  /* fluid-padding: 32-96 px top | 16-48 px bottom */
  padding-block:clamp(32px,10vh,96px) clamp(16px,6vh,48px);
  background:rgba(255,255,255,.02);
  backdrop-filter:blur(16px);
  border-top:1px solid rgba(255,255,255,.06);
  color:var(--txt-accent-dark);
  font-size:1rem;line-height:1.6;
  opacity:0;transform:translateY(40px);
  transition:opacity .8s ease,transform .8s ease;
}
.footer.in-view{opacity:1;transform:translateY(0);}
body.light-theme .footer{
  background:rgba(0,0,0,.04);
  color:var(--txt-accent-light);
}

/* ---------- grid ----------------------------------- */
.footer-grid{
  max-width:1280px;margin-inline:auto;
  display:grid;gap:20px;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}

/* ---------- brand / logo --------------------------- */
.footer-logo{width:64px;margin-bottom:12px;}
.footer-col.brand p{
  font-size:.95rem;line-height:1.6;color:#999;max-width:360px;margin-bottom:20px;
}
body.light-theme .footer-col.brand p{color:#444;}

/* ---------- description ---------------------------- */
.footer-description{
  font-size:1rem;text-align:left;margin-top:20px;
  color:var(--txt-accent-dark);
}
.footer-description .highlight-gradient{
  background:linear-gradient(90deg,rgba(99,102,241,.8),rgba(139,92,246,.8));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:600;
}
.footer-description .highlight-orange{color:#cacaca;font-weight:600;}
body.light-theme .footer-description{color:var(--txt-accent-light);}
body.light-theme .footer-description .highlight-gradient{
  background:linear-gradient(90deg,#6366f1,#8b5cf6);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}

/* ---------- CTA button ----------------------------- */
.footer-cta{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 36px;border-radius:24px;font-size:1.1rem;font-weight:600;
  background:rgba(255,255,255,.1);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.2);color:#fff;text-decoration:none;
  box-shadow:0 6px 20px rgba(79,70,229,.4);transition:.3s;
}
.footer-cta:hover{
  background:rgba(37,99,235,.2);
  box-shadow:0 8px 30px rgba(37,99,235,.5);
  transform:translateY(-2px);
}
.footer-cta img.btn-icon{width:20px;height:20px;filter:brightness(0) invert(1);}

/* ---------- nav ------------------------------------ */
.footer-col.nav ul{display:flex;flex-direction:column;gap:.5rem;}
.footer-col h4{
  font-size:1.15rem;font-weight:700;margin-bottom:12px;
  border-bottom:2px solid var(--primary-color);padding-bottom:4px;
  display:inline-block;
}
.footer-col a{color:inherit;text-decoration:none;transition:color .3s;}
.footer-col a:hover{color:var(--primary-color);}

/* ---------- form ----------------------------------- */
.footer-form .form-group{
  display:flex;gap:10px;padding:10px 14px;border-radius:12px;
  background:rgba(255,255,255,.06);backdrop-filter:blur(8px);
}
.footer-form input[type=email]{
  flex:1;background:transparent;border:none;outline:none;
  color:#fff;font-size:.95rem;
}
.footer-form button{
  background:var(--primary-color);border:none;border-radius:8px;
  padding:8px 12px;color:#fff;font-size:1rem;cursor:pointer;transition:.3s;
}
.footer-form button:hover{background:#2563eb;}
body.light-theme .footer-form .form-group{background:rgba(0,0,0,.06);}
body.light-theme .footer-form input[type=email]{color:#000;}

/* ---------- social --------------------------------- */
.footer-social{
  margin-top:16px;display:flex;justify-content:center;gap:12px;
}
.footer-social a{
  font-size:1.8rem;color:inherit;transition:transform .3s,color .3s;
}
.footer-social a:hover{
  color: #2563eb; /* Лёгкий синий цвет при наведении */
  transform: scale(1.1); /* Увеличение для акцента */
}

/* ---------- love / hashtags ------------------------ */
.footer-love,
.footer-love-inline,
.footer-hashtags{
  display:flex;justify-content:center;align-items:center;flex-wrap:wrap;
  gap:12px;margin-top:18px;font-size:.9rem;text-align:center;
}
.footer-love-logo{width:24px;height:24px;}
.footer-hashtags a{
  text-decoration:none;font-weight:500;transition:transform .3s;
  background:linear-gradient(90deg,rgba(99,102,241,.8),rgba(139,92,246,.8));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.footer-hashtags a:hover{transform:scale(1.1);}
body.light-theme .footer-hashtags a{
  background:linear-gradient(90deg,#6366f1,#8b5cf6);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}

/* ---------- bottom --------------------------------- */
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.05);
  margin-top:20px;padding-top:10px;font-size:.85rem;text-align:center;color:#666;
}
body.light-theme .footer-bottom{color:#999;}

/* ---------- prefers-reduced-motion ----------------- */
@media (prefers-reduced-motion:reduce){
  .footer{transition:none;}
  .footer-cta,.footer-social a{transition:none !important;}
}

/* ---------- responsive ----------------------------- */
/* ≤768 px */
@media (max-width:768px){
  .footer-grid{grid-template-columns:1fr;text-align:center;}
  .footer-form .form-group{flex-direction:column;align-items:stretch;}
  .footer-cta{margin-bottom:16px;width:100%;justify-content:center;}
}
/* ≤640 px */
@media (max-width:640px){
  .footer-col.nav ul{align-items:center;}
  .footer-description{text-align:center;}
  .footer-hashtags{gap:8px;font-size:.85rem;}
  .footer-love-inline{flex-direction:column;gap:4px;font-size:.85rem;}
  .footer-bottom{font-size:.8rem;}
}
/* ≤480 px */
@media (max-width:480px){
  .footer-grid{gap:24px;}
  .footer{padding-block:clamp(30px,22vh,60px) clamp(15px,8vh,30px);}
  .footer-description{font-size:.9rem;}
  .footer-social{gap:6px;flex-wrap:wrap;}
  .footer-form .form-group{padding:12px;}
  .footer-love,
  .footer-hashtags{flex-direction:column;gap:6px;font-size:.8rem;}
  .footer-love-logo{width:20px;height:20px;}
}