:root{
    --bg: #f8fafc;
    --muted: #6b7280;
    --text: #0f172a;
    --card: #ffffff;
    --accent: #cc4d04; /* orange accent */
    --accent-dark: #a63d03;
    --accent-light: #e55f12;
    --radius: 12px;
    --max-width: 1200px;
  }

  .site-footer{
    background: var(--bg);
    color: var(--text);
    border-top: 1px solid rgba(15,23,42,0.04);
    padding: 40px 20px 28px;
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.45;
  }

  .footer-inner{
    max-width: var(--max-width);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 28px;
  }

  /* Top: logo */
  .footer-top{
    display:flex;
    align-items:center;
  }
  .footer-logo{ display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit; }
  .footer-logo-img{ height:44px; width:auto; display:block; }
  .brand-text .brand-sub{ display:block; color:var(--muted); font-weight:600; font-size:0.95rem; letter-spacing:0.2px; }

  /* Grid: columns */
  .footer-grid{
    display:grid;
    grid-template-columns: 1fr 1fr 360px;
    gap: 24px;
    align-items:start;
  }

  .col h4{
    margin:0 0 10px 0;
    font-size:1rem;
    color:var(--text);
    font-weight:700;
  }

  .col nav a{
    display:block;
    color:var(--muted);
    text-decoration:none;
    padding:6px 0;
    transition: color .18s ease, transform .18s ease;
    font-weight:600;
  }

  .col nav a:hover{ color:var(--text); transform: translateX(4px); }

  /* Newsletter */
  .newsletter-col .muted{ color:var(--muted); margin:6px 0 12px 0; max-width:36ch; }
  .newsletter-form .newsletter-row{ display:flex; gap:10px; align-items:center; }
  .newsletter-form input[type="email"]{
    flex:1;
    padding:10px 12px;
    border-radius:10px;
    border:1px solid rgba(15,23,42,0.06);
    background: #fff;
    font-size:0.95rem;
    color:var(--text);
  }
  .newsletter-form input::placeholder{ color:#9ca3af; }

  .btn-cta{
    padding:10px 14px;
    border-radius:10px;
    border:0;
    background: linear-gradient(180deg, var(--accent), var(--accent-dark));
    color:white;
    font-weight:700;
    cursor:pointer;
    font-size:0.95rem;
    transition: transform .18s ease, box-shadow .18s ease;
  }
  .btn-cta:hover{ transform: translateY(-2px); box-shadow: 0 6px 18px rgba(204,77,4,0.12); }

  .newsletter-msg{ margin-top:10px; color:var(--muted); font-size:0.95rem; min-height:1.15em; }

  /* Footer bottom */
  .footer-bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    border-top:1px solid rgba(15,23,42,0.04);
    padding-top:16px;
  }
  .footer-bottom .left{ flex:1; }
  .footer-bottom .right{ display:flex; align-items:center; gap:14px; }

  .copyright{ margin:0; color:var(--muted); font-weight:600; font-size:0.95rem; }
  .credit a{ color:var(--muted); text-decoration:none; font-weight:700; }
  .credit a:hover{ color:var(--text); text-decoration:underline; }

  /* social */
  .social{ display:flex; gap:10px; align-items:center; }
  .social a{ display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:8px; text-decoration:none; background:transparent; color:var(--muted); border:1px solid rgba(15,23,42,0.03); transition: background .18s ease, color .18s ease, transform .18s ease; }
  .social a:hover{ background:#fff; color:var(--text); transform: translateY(-3px); box-shadow: 0 6px 18px rgba(2,6,23,0.04); }
  .social-icon{ width:18px; height:18px; display:block; }

  /* small screens: stack everything */
  @media (max-width: 880px){
    .footer-grid{ grid-template-columns: 1fr 1fr; grid-auto-rows: auto; }
    .newsletter-col{ grid-column: 1 / -1; order: 3; }
  }

  @media (max-width: 560px){
    .footer-inner{ gap:18px; }
    .footer-grid{ grid-template-columns: 1fr; }
    /* LEFT ALIGN LOGO ON MOBILE (no extra padding/margin on logo) */
    .footer-top{ justify-content:flex-start; text-align:left; }
    .footer-logo{ margin-left: 0; } /* ensure logo itself has no left margin */
    .brand-text .brand-sub{ font-size:0.9rem; }
    .footer-bottom{ flex-direction:column; align-items:center; gap:8px; padding-top:12px; }
    .footer-bottom .right{ order:2; }
  }

  /* Accessibility helpers & focus */
  .sr-only{
    position:absolute !important;
    width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
  }

  /* Soft focus (warm orange tint instead of green/blue) */
  .site-footer a:focus,
  .btn-cta:focus,
  .newsletter-form input:focus {
    outline: 2px solid rgba(204,77,4,0.12);
    outline-offset: 3px;
  }