/* ===================================================================
   codeib_footer.css  —  site-wide footer for codeib.ru (website #3, Odoo)

   Loaded as an ir.attachment, linked from <head> by the website.footer_custom
   view (id 2917) — see upload_footer.py. It is a plain file, separate from the
   editable footer content, so editing the footer in the website builder never
   touches these styles. To restyle: edit this file, re-run upload_footer.py
   (it overwrites the attachment), done.

   Design tokens are scoped to .site-footer so nothing leaks to the rest of the
   site. Source of the rules: the <style> block in codeib_homepage_v6.1(3).html
   (FOOTER section), svg-logo rules replaced by an <img> rule.
   =================================================================== */

/* --- scoped design tokens --- */
.site-footer {
  --codeib-bg-dark:             #141414;
  --codeib-yellow:              #FFD600;
  --codeib-text-on-dark:        #FFFFFF;
  --codeib-text-on-dark-muted:  rgba(255, 255, 255, 0.48);
  --codeib-border-on-dark:      rgba(255, 255, 255, 0.08);
  --codeib-font-mono:           'JetBrains Mono', 'SF Mono', ui-monospace, monospace;
}

/* --- logo (was inline <svg><use>, now <img src="/web/image/website/3/logo"> on a dark bg) --- */
.site-footer .header-logo { display: flex; align-items: center; text-decoration: none; color: var(--codeib-yellow); }
.site-footer .header-logo img { height: 30px; width: auto; display: block; filter: invert(1); transition: opacity 0.15s ease; }
.site-footer .header-logo:hover img { opacity: 0.85; }

/* --- container (Odoo's Bootstrap .container would be ~1140px; the homepage uses 1240px) --- */
.site-footer > .container { max-width: 1240px; margin: 0 auto; padding: 0 32px; width: 100%; }
@media (max-width: 768px) { .site-footer > .container { padding: 0 20px; } }

/* --- footer (verbatim from homepage) --- */
.stripe-yellow { height: 4px; background: var(--codeib-yellow); }
.site-footer { background: var(--codeib-bg-dark); color: var(--codeib-text-on-dark); padding: 56px 0 32px; }
.footer-top { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr; gap: 32px; margin-bottom: 48px; }
@media (max-width: 768px) { .footer-top { grid-template-columns: 1fr 1fr; gap: 24px; } }
.footer-brand { display: flex; flex-direction: column; gap: 16px; }
.footer-brand-desc { font-size: 14px; color: var(--codeib-text-on-dark-muted); line-height: 1.6; max-width: 260px; }
.footer-socials { display: flex; gap: 10px; flex-wrap: wrap; }
.footer-socials a {
  width: 40px; height: 40px; border: 1px solid rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
  color: var(--codeib-text-on-dark-muted); font-size: 11px; font-weight: 700; letter-spacing: 0.5px;
  text-decoration: none; transition: border-color 0.2s, color 0.2s;
  font-family: var(--codeib-font-mono);
}
.footer-socials a:hover { border-color: var(--codeib-yellow); color: var(--codeib-yellow); }
.footer-col h4 { font-family: var(--codeib-font-mono); font-size: 10px; font-weight: 500; text-transform: uppercase; letter-spacing: 2px; color: rgba(255,255,255,0.35); margin-bottom: 16px; }
.footer-col a { display: block; font-size: 14px; color: rgba(255,255,255,0.6); text-decoration: none; padding: 4px 0; transition: color 0.2s; }
.footer-col a:hover { color: var(--codeib-text-on-dark); }
.footer-bottom { border-top: 1px solid var(--codeib-border-on-dark); padding-top: 24px; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 16px; }
.footer-legal { font-size: 12px; color: rgba(255,255,255,0.4); line-height: 1.7; max-width: 680px; }
.footer-legal strong { color: rgba(255,255,255,0.6); font-weight: 500; }
.footer-contacts { display: flex; flex-direction: column; gap: 4px; text-align: right; }
@media (max-width: 768px) { .footer-contacts { text-align: left; } }
.footer-contacts a { font-size: 13px; color: rgba(255,255,255,0.55); text-decoration: none; transition: color 0.2s; }
.footer-contacts a:hover { color: var(--codeib-yellow); }
.footer-svedeniya { margin-top: 12px; }
.footer-svedeniya a { font-size: 11px; color: rgba(255,255,255,0.35); text-decoration: underline; transition: color 0.2s; font-family: var(--codeib-font-mono); letter-spacing: 0.5px; }
.footer-svedeniya a:hover { color: rgba(255,255,255,0.7); }
