:root {
        --brand: #0b6b4b;
        --brand-2: #0f7e59;
        --text: #ffffff;
        --overlay: rgba(0, 0, 0, 0.2);
        --radius: 14px;
        --btn-h: 54px;
      }


      .hero {
        position: fixed;
        top: 0;
        bottom: 0;
        min-height: 100vh;
        z-index: 9999;
        width: 100%;
        display: flex;
        align-items: center; /* centra verticalmente */
        justify-content: center; /* centra horizontalmente */
        background-color: #6391A3;
        background: 
          url("https://platform-ps-files.s3.us-east-2.amazonaws.com/images/origin/WINE_3_e8376a4733.jpg")
            no-repeat center/cover;
      }

      .btns {
        display: flex;
        gap: 16px;
        flex-wrap: wrap;
        justify-content: center;
      }

      .cta {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: var(--btn-h);
        padding: 0 1.5rem;
        width: 40vw;
        max-width: 300px;
        border-radius: var(--radius);
        background: var(--brand);
        color: var(--text);
        text-decoration: none;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        transition: background 0.2s ease, transform 0.2s ease;
      }
      .cta:hover {
        background: var(--brand-2);
        transform: translateY(-1px);
      }
      .cta:active {
        transform: translateY(0);
      }