:root {
  --azul-oscuro: #0b2c3f;
  --azul-claro: #1a6c89;
  --verde: #257d49;
  --naranjo: #f4a300;
  --gris-claro: #f1f1f1;
}

    
    
    body, html {
      margin: 0;
      padding: 0;
      height: 100%;
      font-family: 'Arial', sans-serif;
      background-color: #0A2540;
    }
    .landing-container {
      display: flex;
      min-height: 100vh;
    }
    .left-side {
      flex: 1;
      background-color: #0A2540;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 40px 80px;
      color: #ffffff;
      text-align: left;
    }
    .rotating-content {
      font-size: 2rem;
      line-height: 1.4;
      max-width: 600px;
      min-height: 150px;
      position: relative;
    }
    .typewriter-text {
      display: inline;
      font-weight: normal;
    }
    .cursor {
      display: inline-block;
      background-color: white;
      width: 10px;
      height: 10px;
      border-radius: 50%;
      margin-left: 8px;
      animation: blink 1s infinite;
      vertical-align: middle;
    }
    @keyframes blink {
      0%, 50% { opacity: 1; }
      51%, 100% { opacity: 0; }
    }
    .right-side {
      flex: 1;
      background: #ffffff;
      display: flex;
      flex-direction: column;
      min-width: 350px;
      min-height: 100vh;
      padding: 0;
      position: relative;
      justify-content: space-between;
      align-items: stretch;
    }
    .headline {
      width: 100%;
      text-align: center;
      font-size: 1.5rem;
      color: #0A2540;
      font-weight: bold;
      margin: 48px 0 0 0;
      padding: 0 20px;
      max-width: 700px;
      align-self: center;
    }
    .main-content {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 0 20px;
    }
    .main-content h2 {
      font-size: 2rem;
      margin: 0 0 30px 0;
      color: #0A2540;
      text-align: center;
      width: 100%;
    }
    .buttons {
      display: flex;
      gap: 20px;
      margin-bottom: 20px;
      justify-content: center;
      width: 100%;
    }
    .login-btn {
      background-color: #FDB714;
      color: #0A2540;
      padding: 12px 30px;
      border: none;
      border-radius: 25px;
      font-size: 1rem;
      font-weight: bold;
      cursor: pointer;
      transition: background 0.3s;
    }
    .login-btn:hover {
      background-color: #FFC300;
    }
    .signup-btn {
      background-color: #0A2540;
      color: white;
      padding: 12px 30px;
      border: none;
      border-radius: 25px;
      font-size: 1rem;
      font-weight: bold;
      cursor: pointer;
      transition: background 0.3s;
    }
    .signup-btn:hover {
      background-color: #00182E;
    }
    .footer-wrapper {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: stretch;
    }
    .main-footer {
      width: 100%;
      background: #fff;
      font-size: 1rem;
      color: #0A2540;
      box-shadow: 0 -2px 16px rgba(10,37,64,0.10);
      border-radius: 20px 20px 0 0;
      overflow: hidden;
      padding-bottom: 18px;
      margin-top: 0;
      transition: box-shadow 0.2s;
    }
    .main-footer:hover {
      box-shadow: 0 -4px 24px rgba(10,37,64,0.13);
    }
    .footer-row {
      max-width: 700px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px 20px 0 20px;
    }
    .footer-logo-text {
      display: flex;
      align-items: center;
      gap: 18px;
      justify-content: center;
      width: 100%;
      font-size: 1.1rem;
      font-weight: 500;
      letter-spacing: 0.5px;
    }
    .footer-logo {
      width: 54px;
      height: auto;
      border-radius: 50%;
      background: #fff;
      border: 2px solid #4A90C2;
    }
    .footer-bottom-row {
      max-width: 700px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20px 20px 0 20px;
      margin-top: 10px; /* Espacio entre líneas del footer */
    }
    .footer-social {
      display: flex;
      gap: 20px;
      align-items: center;
    }
    .footer-social a svg {
      transition: transform 0.2s, filter 0.2s;
    }
    .footer-social .biee-blue svg { fill: #14304A; }
    .footer-social .biee-orange svg { fill: #D89B36; }
    .footer-social .biee-green svg { fill: #32643C; }
    .footer-social .biee-celeste svg { fill: #4A90C2; }
    .footer-social a:hover svg {
      transform: scale(1.18);
      filter: drop-shadow(0 2px 6px #FDB71433);
    }
    .footer-links {
      display: flex;
      gap: 18px;
      align-items: center;
      font-size: 1rem;
    }
    .footer-links a {
      color: #0A2540;
      text-decoration: none;
      transition: color 0.2s;
      font-weight: 500;
    }
    .footer-links a:hover {
      color: #FDB714;
    }
    
.login-btn, .signup-btn {
  text-decoration: none;
}