:root {
      --navy: #35566d;
      --navy-soft: #526d7d;
      --blue: #669dbb;
      --blue-light: #86b2c7;
      --ice: #cbdde2;
      --cream: #eee8d9;
      --white: #f2ecdf;
    }

    * {
      box-sizing: border-box;
    }

    html,
    body {
      margin: 0;
      min-height: 100%;
    }

    body {
      min-height: 100svh;

      display: flex;
      justify-content: center;
      align-items: center;

      padding: 2rem 1.25rem;

      background:
        radial-gradient(
          circle at 50% 10%,
          #e8e5dc 0,
          var(--ice) 52%,
          #bcd2da 100%
        );

      color: var(--navy);

      font-family:
        "Trebuchet MS",
        "Segoe UI",
        Arial,
        sans-serif;
    }

    main {
      width: min(100%, 30rem);
      text-align: center;
    }

    .logo {
      width: min(30vw, 12rem);
      height: auto;
      display: block;
      margin: 0 auto 1.75rem;
    }

    h1 {
      margin: 0;

      font-size: clamp(1.8rem, 7vw, 2.5rem);
      line-height: 1.05;
      font-weight: 800;
      letter-spacing: -0.025em;
      text-transform: uppercase;
    }

    .message {
      max-width: 25rem;
      margin: 1rem auto 2rem;

      font-size: 1.05rem;
      line-height: 1.55;

      color: var(--navy-soft);
    }

    .prompt {
      margin: 0 0 1rem;

      font-size: 0.85rem;
      font-weight: 800;
      letter-spacing: 0.09em;
      text-transform: uppercase;

      color: var(--navy);
    }

    .review-options {
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }

    .review-link {
      position: relative;

      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;

      min-height: 6rem;
      padding: 1.1rem 1.5rem;

      overflow: hidden;

      border: 2px solid var(--navy-soft);
      border-radius: 1.5rem;

      text-decoration: none;

      transition:
        transform 120ms ease,
        box-shadow 120ms ease;
    }

    .review-link::after {
      content: "";
      position: absolute;
      width: 4rem;
      height: 4rem;
      right: -1rem;
      bottom: -2rem;

      border: 4px solid rgba(242, 236, 223, 0.2);
      border-radius: 50%;
    }

    .review-link strong,
    .review-link span {
      position: relative;
      z-index: 1;
    }

    .review-link strong {
      font-size: 1.3rem;
      line-height: 1.15;
    }

    .review-link span {
      margin-top: 0.25rem;

      font-size: 0.9rem;
      font-weight: 600;

      opacity: 0.82;
    }

    .google {
      background: var(--cream);
      color: var(--navy);

      box-shadow: 0.25rem 0.25rem 0 rgba(82, 109, 125, 0.32);
    }

    .junip {
      background: var(--navy);
      color: var(--white);

      box-shadow: 0.25rem 0.25rem 0 rgba(82, 109, 125, 0.32);
    }

    .review-link:hover,
    .review-link:focus-visible {
      transform: translate(-1px, -1px);

      box-shadow: 0.35rem 0.35rem 0 rgba(102, 157, 187, 0.42);
    }

    .review-link:active {
      transform: translate(1px, 1px);
      box-shadow: 0.12rem 0.12rem 0 rgba(82, 109, 125, 0.28);
    }

    footer {
      margin-top: 2rem;

      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;

      color: var(--navy-soft);
    }