

    footer{
      background:var(--primary);
      color:var(--white);
      width: 100%;

    }

    .footer-container{
      max-width:1280px;
      margin:0 auto;
      margin-top: 20px;
      


      gap:48px;
    }
    .footer-content{
      display:grid;
      grid-template-columns:0.7fr 1fr;

      gap:30px;
    }

    h4{
      font-size:var(--p1);
      font-weight:400;
    }

    .stack p, a{
      font-size:var(--p3);
      line-height:1.6;
      color:var(--white);
      text-decoration:none;
    }

    .muted{color:var(--accent)}
    .danger{color:var(--danger)}

    .footer-stacks{
      display:grid;
      grid-template-columns:auto auto 0.6fr;
      gap:20px;
    }

    .newsletter-content{
      display: flex;
      flex-direction: column;
      gap: 5px;
    }
    .stack{
      display:flex;
      flex-direction:column;
      gap:10px;
      align-items: normal;
        margin-top: 1rem;

    }

    .danger p{
      color: var(--accent);
    }
    .address{
      width:auto;
      gap:10px;
    }
    .address h4{
      margin-bottom:3px;
      
    }
    .address p,a{
      font-size: var(--p3);
    }
    .contacts p{
      color: var(--white);
    }
   
  .link{
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
    
    .links a{
        opacity:.9;
    color: var(--white);}
    .links a:hover{
      opacity:1;
     color:var(--accent);  
    
    }

    .socials{
      display:flex;
      gap:10px;
      margin-top:5px
    
    }
    .socials a{
      width:32px;
      height:32px;
      opacity:.8;
    }
    .socials a{
      color:var(--white);
        text-align:center;
    
      
    }
    .socials a:hover{opacity:1;cursor:pointer}
    .newsletter{
      display:flex;
      flex-direction:column;
      gap:10px;
    }

    .newsletter p{text-align:left}

    .subscribe{
      display:flex;
      gap:12px;
    }

    .subscribe input{
      flex:1;
      height:45px;
      border:1px solid var(--white);
      background:transparent;
      border-radius:8px;
      padding:0 12px;
      color:var(--white);
    }

    .subscribe button{
      height:45px;
      padding:0 24px;
      border:1px solid var(--white);
      background:transparent;
      color:var(--white);
      border-radius:8px;
      cursor:pointer;
    }

    .divider{
      margin:20px 0 16px;
      border-top:.5px solid rgba(205,219,254,.45);
    }

    .footer-bottom{
      margin:auto;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:24px;
      flex-wrap:wrap;
      margin-bottom:20px;
    }

    .footer-bottom small{color:  rgba(205,219,254,.45);}

    .policies{display:flex;gap:24px;flex-wrap:wrap}
    .policies a{color: rgba(205,219,254,.45);}

    /* RESPONSIVE */
    @media(max-width:900px){
      .footer-content{grid-template-columns: 1fr; gap:0;}
      .footer-stacks{
        margin-left: 0;
        gap: 0;
      }
      .stack h4{
        font-size: var(--p3);
      }

      .address p{
        width: 100%;
      }
    }

    @media(max-width:520px){
      .footer-container{
        grid-template-columns:repeat(1,minmax(0,1fr));
        gap:24px;
        padding: 0 16px ;
      }
      .footer-stacks{
        padding: auto 10px;
        gap: 10px;
      }
      .stack p{
        font-size: var(--p3);
      }
      .links a{

        font-size: var(--p3);
      }
      .stack {
        gap: 5px;

      }
      .newsletter p{
        text-align:left;
        font-size: var(--p3);
      
      }
    
      .subscribe{flex-direction:row}
        .subscribe input{
        height:40px;  
        padding:1rem;
      }
      .footer-bottom{flex-direction:column;text-align:center}
  
    }