@charset "UTF-8";
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 */
@font-face {
  font-family: 'GothamNarrow';
  /* Generic family name */
  src: url(/assets/GothamNarrow-Light-07427914fdb6c88fe0bddfba73de00f1b22da4a6b1938fab67253416d1d26de2.otf) format("opentype");
  font-weight: 300;
  /* Use numeric weight */
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'GothamNarrow';
  /* Same generic family name */
  src: url(/assets/GothamNarrow-Medium-5ccc50e9e27b577e04bb89988b13e572c9ed03fb9c2fef261e8daefde647e606.otf) format("opentype");
  font-weight: 400;
  /* Use numeric weight */
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'GothamNarrow';
  /* Same generic family name */
  src: url(/assets/GothamNarrow-Bold-d4a383f5eb59001c3a72489164d6b799a01a78da5ae7fba7f05106fc11d6116e.otf) format("opentype");
  font-weight: 700;
  /* Use numeric weight */
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'GothamNarrow';
  /* Same generic family name */
  src: url(/assets/GothamNarrow-BookItalic-141664cc9cefe8b83b7a222fa1a245763e7f80abb221d301b5ba30cf25b484f5.otf) format("opentype");
  font-weight: 300;
  /* Use numeric weight */
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'GothamNarrow';
  /* Same generic family name */
  src: url(/assets/GothamNarrow-Book-3e673e22df374032beb36e3604550c04d389252e8b230136efe65c209127834d.otf) format("opentype");
  font-weight: 300;
  /* Use numeric weight */
  font-style: normal;
  font-display: swap;
}

@tailwind base;
@tailwind components;
@tailwind utilities;
/*

@layer components {
  .btn-primary {
    @apply py-2 px-4 bg-blue-200;
  }
}

*/
/* line 20, app/assets/stylesheets/application.scss */
:root {
  /* Default root size */
  font-size: clamp(0.75rem, calc(1vw + 0.5rem), 20px);
  line-height: calc(1vw + 1.5rem);
  font-family: 'GothamNarrow', sans-serif;
  font-weight: 300;
}

/* line 27, app/assets/stylesheets/application.scss */
.content {
  margin: 0 auto;
  padding: calc(1vw + 1rem) calc(1vw + 1rem);
}

/* line 33, app/assets/stylesheets/application.scss */
h1, h2, h3, h4 {
  color: #002e59;
  font-size: 2rem;
  line-height: 2rem;
  margin: 1rem 0;
}

/* line 39, app/assets/stylesheets/application.scss */
h2 {
  font-size: 1.5rem;
  line-height: 2rem;
}

/* line 43, app/assets/stylesheets/application.scss */
h3 {
  font-size: 1.2rem;
  line-height: 1.5rem;
}

/* line 47, app/assets/stylesheets/application.scss */
h4 {
  font-size: 1rem;
  line-height: 1.2rem;
}

/* line 51, app/assets/stylesheets/application.scss */
hr {
  border-width: 2px;
}

/* line 54, app/assets/stylesheets/application.scss */
a {
  color: #0065ca;
}

/* line 56, app/assets/stylesheets/application.scss */
a:hover {
  text-decoration: underline;
}

/* line 60, app/assets/stylesheets/application.scss */
p {
  font-size: 1.2rem;
  line-height: 1.8rem;
}

/* line 66, app/assets/stylesheets/application.scss */
.cta {
  background-color: #54722d;
  color: #fff;
  font-size: 1.8rem;
  margin: calc(1vw + 1rem) auto;
  padding: clamp(0.75rem, calc(1vw + 2rem), 33px);
  border-radius: .5rem;
  border-color: #54722d;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5);
  display: block;
  width: fit-content;
}

/* line 79, app/assets/stylesheets/application.scss */
.cta:hover {
  background-color: rgba(84, 114, 45, 0.8);
  cursor: pointer;
}

/* line 85, app/assets/stylesheets/application.scss */
header .content {
  padding: 0 calc(1vw + 1rem);
}

/* line 88, app/assets/stylesheets/application.scss */
.usaa-header {
  color: #fff;
  background-color: #123a5c;
  padding: calc(1vw + 0.5rem) 0;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.5);
}

/* line 96, app/assets/stylesheets/application.scss */
.usaa-header a {
  color: #fff;
}

/* line 97, app/assets/stylesheets/application.scss */
.sub-header {
  display: flex;
  justify-content: space-between;
  margin: calc(1vw + 1.5rem) auto;
}

/* line 102, app/assets/stylesheets/application.scss */
.usaa-perks-logo {
  max-height: calc(1vw + 2rem);
}

/* line 107, app/assets/stylesheets/application.scss */
.powered-by {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: end;
}

/* line 113, app/assets/stylesheets/application.scss */
.powered-by span {
  margin-right: calc(1vw + 1rem);
}

/* line 116, app/assets/stylesheets/application.scss */
.powered-by img {
  max-height: calc(1vw + 1.5rem);
}

/* line 121, app/assets/stylesheets/application.scss */
.hero {
  display: flex;
  height: calc(1vw + 25rem);
  background-repeat: no-repeat;
  background-size: clamp(375px, 150%, 2000px) auto;
  background-position: top center;
}

/* line 128, app/assets/stylesheets/application.scss */
.hero .oem, .hero .oem .content {
  display: flex;
  align-self: flex-end;
  background-color: #000;
  flex-grow: 1;
}

/* line 134, app/assets/stylesheets/application.scss */
.hero .oem .content {
  justify-content: space-between;
  align-items: flex-end;
  padding: calc(1vw + 0.8rem) calc(1vw + 1rem);
}

/* line 139, app/assets/stylesheets/application.scss */
.hero .oem img {
  width: auto;
  height: 100%;
  object-fit: contain;
}

/* line 144, app/assets/stylesheets/application.scss */
.hero .oem .oem-name {
  height: calc(1vw + .8rem);
}

/* line 147, app/assets/stylesheets/application.scss */
.hero .oem .oem-logo {
  height: calc(1vw + 3rem);
}

/* line 152, app/assets/stylesheets/application.scss */
.incentive-details {
  text-align: center;
  justify-content: center;
}

/* line 158, app/assets/stylesheets/application.scss */
.how-it-works {
  justify-items: center;
}

/* line 161, app/assets/stylesheets/application.scss */
.how-it-works ol {
  margin: 0 calc(1vw + 0.8rem);
  list-style: none;
  counter-reset: list-counter;
  /* Resets counter */
  padding-left: 0;
}

/* line 167, app/assets/stylesheets/application.scss */
.how-it-works ol li {
  counter-increment: list-counter;
  /* Increments counter */
  display: flex;
  align-items: center;
  margin: 2rem auto 1rem;
}

/* line 176, app/assets/stylesheets/application.scss */
.how-it-works ol li::before {
  content: counter(list-counter);
  /* Displays counter */
  font-weight: bold;
  font-size: 2rem;
  width: clamp(0.75rem, calc(1vw + 3rem), 5rem);
  height: clamp(0.75rem, calc(1vw + 3rem), 5rem);
  line-height: 3.5rem;
  justify-content: center;
  margin-right: 1.5rem;
  background-color: #002e59;
  color: white;
  border-radius: 50%;
  display: inline-flex;
  flex-shrink: 0;
}

/* line 193, app/assets/stylesheets/application.scss */
.what-are-member-incentives {
  background-repeat: no-repeat;
  background-size: clamp(375px, 200%, 2000px) auto;
  background-position: bottom center;
  background-color: #5598bd;
  text-align: center;
  color: #fff;
  height: calc(1vw + 38rem);
}

/* line 202, app/assets/stylesheets/application.scss */
.what-are-member-incentives h1 {
  color: #fff;
}

/* line 211, app/assets/stylesheets/application.scss */
.eligible-models {
  text-align: center;
}

/* line 214, app/assets/stylesheets/application.scss */
.eligible-models h1 {
  letter-spacing: -0.05rem;
}

/* line 217, app/assets/stylesheets/application.scss */
.eligible-models ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  /* 2 equal columns */
  gap: 1.5rem 1rem;
  /* Space between items */
  list-style: none;
  margin-top: 3rem;
}

/* line 224, app/assets/stylesheets/application.scss */
.eligible-models ul li {
  justify-items: center;
  width: 100%;
}

/* line 228, app/assets/stylesheets/application.scss */
.eligible-models ul li img {
  width: 90%;
}

/* line 231, app/assets/stylesheets/application.scss */
.eligible-models ul li h2 {
  color: #000;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* line 238, app/assets/stylesheets/application.scss */
.eligible-models ul li h4 {
  font-size: 1.8rem;
  line-height: 2rem;
}

/* line 242, app/assets/stylesheets/application.scss */
.eligible-models ul li h4,
.eligible-models ul li h3 {
  color: #53722d;
  font-weight: 700;
}

/* line 249, app/assets/stylesheets/application.scss */
.registration.content {
  padding-top: 0;
}

/* line 252, app/assets/stylesheets/application.scss */
.registration .info-card {
  margin-bottom: 0.5rem;
}

/* line 255, app/assets/stylesheets/application.scss */
.registration .registration-form {
  margin: 2rem 0;
}

/* line 258, app/assets/stylesheets/application.scss */
.registration .registration-form-fields {
  display: grid;
  gap: 10px;
}

/* line 263, app/assets/stylesheets/application.scss */
.input-group {
  height: 6rem;
}

/* line 268, app/assets/stylesheets/application.scss */
.error-msg {
  color: red;
  font-style: italic;
  font-size: .8rem;
  display: none;
  margin: 0;
}

/* line 276, app/assets/stylesheets/application.scss */
input.input-error,
.input-error {
  border: 1px solid red;
}

/* line 281, app/assets/stylesheets/application.scss */
label {
  font-size: 1.2rem;
  display: block;
}

/* line 287, app/assets/stylesheets/application.scss */
input {
  border: 1px solid #0f0f0f;
  padding: .5rem;
  font-size: 1.2rem;
  width: 100%;
}

/* line 293, app/assets/stylesheets/application.scss */
input::placeholder {
  font-style: italic;
}

/* line 296, app/assets/stylesheets/application.scss */
input:focus {
  border-color: #002e59;
}

/* line 299, app/assets/stylesheets/application.scss */
input[type="checkbox"] {
  width: 2rem;
  height: 2rem;
  margin: 1rem 1rem 1rem 0;
}

/* line 305, app/assets/stylesheets/application.scss */
.tac {
  display: flex;
  align-items: center;
}

/* line 309, app/assets/stylesheets/application.scss */
.tac-checkbox-label {
  font-size: 1.4rem;
  font-style: italic;
}

/* line 316, app/assets/stylesheets/application.scss */
.coupon.content {
  padding-top: 0;
}

/* line 319, app/assets/stylesheets/application.scss */
.coupon hr {
  margin: 2.5rem auto;
}

/* line 322, app/assets/stylesheets/application.scss */
.coupon .oem-logo {
  width: clamp(3rem, 80vw, 15rem);
  height: auto;
  margin: 2rem auto;
}

/* line 327, app/assets/stylesheets/application.scss */
.coupon .offer-code-label,
.coupon .offer-code {
  font-weight: 400;
  text-align: center;
}

/* line 332, app/assets/stylesheets/application.scss */
.coupon .offer-code-label {
  font-size: 2rem;
  margin-bottom: calc(1vw + 1.5rem);
  color: #002e59;
}

/* line 337, app/assets/stylesheets/application.scss */
.coupon .offer-code {
  font-size: calc(1vw + 3.3rem);
  color: #000;
}

/* line 343, app/assets/stylesheets/application.scss */
.print-form .oem-logo {
  width: clamp(3rem, 10vw, 15rem);
  height: auto;
  display: block;
  margin: 0 auto 2rem;
}

/* line 349, app/assets/stylesheets/application.scss */
.print-form section {
  margin-top: 2rem;
}

/* line 352, app/assets/stylesheets/application.scss */
.pricing-table {
  width: 95%;
  margin: 2rem auto;
}

/* line 356, app/assets/stylesheets/application.scss */
.pricing-table h2 {
  margin-bottom: 0;
}

/* line 359, app/assets/stylesheets/application.scss */
.pricing-table p {
  margin-top: 0;
}

/* line 362, app/assets/stylesheets/application.scss */
.print-form table {
  width: 100%;
  border: 1px solid #ccc;
  border-spacing: 0;
}

/* line 367, app/assets/stylesheets/application.scss */
.print-form table tr th {
  padding: 0 .5rem;
  border: 1px solid #ddd;
  background-color: #ccc;
}

/* line 372, app/assets/stylesheets/application.scss */
.print-form table tr td {
  padding: 0 .5rem;
  border: 1px solid #ccc;
  width: 25%;
}

/* line 377, app/assets/stylesheets/application.scss */
.print-form table tr:nth-child(odd) {
  background-color: #fff;
}

/* line 380, app/assets/stylesheets/application.scss */
.print-form table tr:nth-child(even) {
  background-color: #f5f5f5;
}

/* line 383, app/assets/stylesheets/application.scss */
.print-form .eligible-models {
  font-style: italic;
  text-align: left;
  margin-top: 1rem;
  font-size: 1rem;
}

/* line 389, app/assets/stylesheets/application.scss */
.contact-oem-form tr td:nth-child(odd) {
  background-color: #eee;
  font-weight: bold;
}

/* line 393, app/assets/stylesheets/application.scss */
.print-form .fine-print ol {
  padding-left: 2rem;
}

/* line 396, app/assets/stylesheets/application.scss */
.contact-dealer-form td {
  vertical-align: top;
  font-weight: 700;
}

/* line 400, app/assets/stylesheets/application.scss */
.contact-dealer-form td,
.contact-oem-form td {
  width: 50%;
  height: 3.2rem;
  line-height: 1.8rem;
}

/* line 406, app/assets/stylesheets/application.scss */
.contact-dealer-form td div {
  font-weight: 300;
}

/* line 411, app/assets/stylesheets/application.scss */
.disclosures {
  background-color: #ebeae7;
  padding: 1rem 2rem;
}

/* line 415, app/assets/stylesheets/application.scss */
.disclosures p {
  font-size: clamp(0.5rem, 5vw, 1rem);
}

/* Plus size phones (≥ 430px) */
@media (min-width: 430px) {
  /* line 421, app/assets/stylesheets/application.scss */
  .hero {
    height: calc(1vw + 27rem);
  }
  /* line 426, app/assets/stylesheets/application.scss */
  .what-are-member-incentives {
    height: calc(1vw + 40rem);
  }
}

/* Tablets (≥ 600px) */
@media (min-width: 600px) {
  /* Styles for tablets */
}

/* Small Laptops (≥ 768px) */
@media (min-width: 768px) {
  /* line 437, app/assets/stylesheets/application.scss */
  .hero {
    height: calc(1vw + 37rem);
  }
  /* line 442, app/assets/stylesheets/application.scss */
  .what-are-member-incentives {
    height: calc(1vw + 46rem);
  }
  /* line 447, app/assets/stylesheets/application.scss */
  .eligible-models ul {
    /* 3 equal columns */
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  /* line 452, app/assets/stylesheets/application.scss */
  .registration .registration-form-fields {
    display: grid;
    /* 2 equal columns */
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  /* line 457, app/assets/stylesheets/application.scss */
  .input-group {
    height: 7rem;
  }
}

/* Desktops (≥ 1024px) */
@media (min-width: 1024px) {
  /* Styles for desktops */
  /* line 465, app/assets/stylesheets/application.scss */
  .content {
    max-width: 1024px;
  }
  /* line 469, app/assets/stylesheets/application.scss */
  .hero {
    height: calc(1vw + 41rem);
  }
  /* line 474, app/assets/stylesheets/application.scss */
  .what-are-member-incentives {
    height: calc(1vw + 49rem);
  }
}

/* Large Screens (≥ 1440px) */
@media (min-width: 1440px) {
  /* Styles for large screens */
  /* line 485, app/assets/stylesheets/application.scss */
  .hero {
    background-size: cover;
  }
  /* line 491, app/assets/stylesheets/application.scss */
  .what-are-member-incentives {
    background-size: cover;
  }
}