/* ==========================================================================
   Shared content-page layout for thevegasvacation.com

   Used by:  /Home/OpenDated            /Home/DoIQualify
             /Home/Package              /Home/AboutThePresentation
             /Home/LvvUpgardes          /Home/RecordedVerification
             /Home/ShoppingReward

   Every rule is namespaced under .lvv / .lvv-* so nothing leaks into other
   pages or overrides layout_style.css anywhere else on the site.

   Upload to: /css/lvv_pages.css
   ========================================================================== */

/* shared content-page design system — namespaced .lvv / .lvv-* */
.lvv {
    --ink: #14122e;
    --muted: #5b5c78;
    --brand: #2a1fd4;
    --red: #e11414;
    --line: #e4e6f1;
    --surface: #f5f6fb;
    --aqua: #0d7f8f;
    --aqua-soft: #eaf6f7;
    --sand: #fbf7ef;
    --gold: #f0c419;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    display: block;
    padding: 46px 0 64px;
    background: #fff;
}

/* reset inherited site rules inside this block only */
.lvv h1,
.lvv h2,
.lvv h3,
.lvv h4,
.lvv p,
.lvv li,
.lvv span,
.lvv strong,
.lvv em {
    position: static;
    text-align: left;
    text-transform: none;
    background: none;
    font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    letter-spacing: normal;
    padding: 0;
}

.lvv ul,
.lvv ol,
.lvv li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.lvv p {
    margin: 0 0 14px;
    color: var(--muted);
    font-size: 15.5px;
    line-height: 1.72;
}

.lvv p strong,
.lvv li strong {
    color: var(--ink);
    font-weight: 700;
}

.lvv a {
    color: var(--brand);
    text-decoration: none;
    border-bottom: 1px solid rgba(42, 31, 212, .28);
    transition: border-color .18s ease;
}

.lvv a:hover,
.lvv a:focus {
    border-bottom-color: var(--brand);
}

/* ---------- intro ---------- */
.lvv .lvv-eyebrow {
    display: block;
    margin: 0 0 10px;
    color: var(--red);
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.lvv h1.lvv-title {
    margin: 0 0 18px;
    color: var(--brand);
    font-size: 38px;
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -.015em;
    text-transform: uppercase;
}

.lvv h1.lvv-title--sentence {
    text-transform: none;
    letter-spacing: -.02em;
}

.lvv-lead {
    font-size: 17px !important;
    line-height: 1.68 !important;
    color: var(--ink) !important;
    max-width: 64ch;
}

/* ---------- section headings ---------- */
.lvv-rule {
    margin: 40px 0 24px;
    border-top: 2px solid var(--ink);
}

.lvv h2.lvv-h2 {
    margin: 0 0 8px;
    color: var(--ink);
    font-size: 24px;
    font-weight: 800;
    line-height: 1.24;
    letter-spacing: -.01em;
}

.lvv h3.lvv-h3 {
    margin: 0 0 8px;
    color: var(--ink);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.35;
}

.lvv-sub {
    margin: 0 0 22px !important;
    font-size: 14.5px !important;
}

/* ---------- stat strip ---------- */
.lvv-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin: 26px 0 30px;
}

.lvv-stats--2 { grid-template-columns: repeat(2, 1fr); }

.lvv-stat {
    padding: 18px 20px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
}

.lvv .lvv-stat__v {
    display: block;
    color: var(--brand);
    font-size: 26px;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -.02em;
}

.lvv .lvv-stat__k {
    display: block;
    margin-top: 6px;
    color: var(--ink);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}

/* ---------- tinted panel ---------- */
.lvv-panel {
    margin: 26px 0 30px;
    padding: 26px 28px 22px;
    border: 1px solid #d5e9ec;
    border-radius: 14px;
    background: linear-gradient(180deg, var(--aqua-soft) 0%, #fff 78%);
}

.lvv-panel--sand {
    border-color: #eee0c4;
    background: linear-gradient(180deg, var(--sand) 0%, #fff 80%);
}

.lvv .lvv-panel__eyebrow {
    display: block;
    margin: 0 0 16px;
    color: var(--aqua);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.lvv-panel--sand .lvv-panel__eyebrow { color: #9a7415; }

.lvv-panel > *:last-child { margin-bottom: 0 !important; }

/* ---------- check / cross lists ---------- */
.lvv-check li {
    position: relative;
    margin: 0 0 10px;
    padding-left: 26px;
    color: var(--ink);
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.55;
}

.lvv-check li:last-child { margin-bottom: 0; }

.lvv-check li::before {
    content: "\2713";
    position: absolute;
    left: 0;
    top: -1px;
    color: var(--aqua);
    font-size: 15px;
    font-weight: 900;
}

.lvv-check--plain li {
    font-weight: 500;
    color: var(--muted);
}

/* ---------- two-column list block ---------- */
.lvv-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: stretch;
    margin: 0 0 8px;
}

.lvv-card {
    display: flex;
    flex-direction: column;
    padding: 24px 26px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(20, 18, 46, .05);
}

.lvv-card--tint {
    border-color: #d5e9ec;
    background: var(--aqua-soft);
}

.lvv .lvv-card__tag {
    display: inline-block;
    align-self: flex-start;
    margin: 0 0 12px;
    padding: 5px 11px;
    border-radius: 999px;
    background: var(--ink);
    color: #fff;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.lvv-card h3.lvv-h3 { margin-bottom: 14px; }

/* ---------- numbered steps ---------- */
.lvv-steps {
    counter-reset: lvvstep;
    margin: 0 0 8px;
}

.lvv-steps li {
    position: relative;
    counter-increment: lvvstep;
    padding: 0 0 22px 54px;
}

.lvv-steps li::before {
    content: counter(lvvstep);
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--brand);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
}

.lvv-steps li::after {
    content: "";
    position: absolute;
    left: 17px;
    top: 40px;
    bottom: 6px;
    width: 1px;
    background: var(--line);
}

.lvv-steps li:last-child { padding-bottom: 0; }
.lvv-steps li:last-child::after { display: none; }

.lvv .lvv-steps__k {
    display: block;
    margin: 6px 0 5px;
    color: var(--ink);
    font-size: 16px;
    font-weight: 800;
    line-height: 1.35;
}

.lvv-steps p {
    margin: 0;
    font-size: 14.5px;
}

/* ---------- numbered inclusion cards ---------- */
.lvv-incs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    align-items: stretch;
    margin: 0 0 8px;
    counter-reset: lvvinc;
}

.lvv-inc {
    display: flex;
    position: relative;
    counter-increment: lvvinc;
    flex-direction: column;
    padding: 22px 24px 22px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(20, 18, 46, .05);
    transition: box-shadow .22s ease, transform .22s ease;
}

.lvv-inc:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(20, 18, 46, .1);
}

.lvv .lvv-inc__n {
    display: block;
    margin: 0 0 10px;
    color: #b9bccd;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .12em;
}

.lvv .lvv-inc__v {
    display: block;
    margin: 0 0 6px;
    color: var(--aqua);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.lvv-inc h3 {
    margin: 0 0 10px;
    color: var(--ink);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.32;
}

.lvv-inc p {
    margin: 0 0 10px;
    font-size: 14.5px;
    line-height: 1.66;
}

.lvv-inc p:last-child { margin-bottom: 0; }

/* ---------- price card ---------- */
.lvv-price {
    display: grid;
    grid-template-columns: 190px 1fr;
    gap: 0;
    overflow: hidden;
    margin: 26px 0 30px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
}

.lvv-price__tag {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 26px 24px;
    background: var(--ink);
}

.lvv .lvv-price__amt {
    display: block;
    color: #fff;
    font-size: 42px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.03em;
}

.lvv .lvv-price__lab {
    display: block;
    margin-top: 8px;
    color: rgba(255, 255, 255, .72);
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.lvv-price__body {
    padding: 24px 26px;
}

.lvv-price__body > *:last-child { margin-bottom: 0 !important; }

/* ---------- pull quote ---------- */
.lvv-quote {
    margin: 30px 0;
    padding: 26px 30px;
    border-left: 4px solid var(--gold);
    background: var(--surface);
    border-radius: 0 12px 12px 0;
}

.lvv-quote p {
    margin: 0 0 12px;
    color: var(--ink);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.6;
}

.lvv-quote p:last-child { margin-bottom: 0; }

.lvv .lvv-quote__cite {
    display: block;
    margin-top: 14px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

/* ---------- dark callout ---------- */
.lvv-callout {
    margin: 30px 0 0;
    padding: 26px 30px;
    border-radius: 14px;
    background: var(--ink);
}

.lvv-callout p {
    margin: 0 0 12px;
    color: rgba(255, 255, 255, .8);
}

.lvv-callout p:last-child { margin-bottom: 0; }

.lvv-callout p strong { color: #fff; }

.lvv .lvv-callout__lead {
    color: #fff;
    font-size: 19px;
    font-weight: 800;
    line-height: 1.45;
}

.lvv-callout .lvv-check li { color: #fff; }
.lvv-callout .lvv-check li::before { color: var(--gold); }

/* ---------- banner strip (all-caps promise line) ---------- */
.lvv-strip {
    margin: 30px 0 0;
    padding: 20px 26px;
    border-radius: 12px;
    background: linear-gradient(90deg, var(--brand) 0%, #4a3ff0 100%);
}

.lvv .lvv-strip__t {
    display: block;
    color: #fff;
    font-size: 17px;
    font-weight: 900;
    letter-spacing: .05em;
    line-height: 1.4;
    text-transform: uppercase;
}

/* ---------- category chips ---------- */
.lvv-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin: 0 0 8px;
}

.lvv-chips li {
    padding: 9px 15px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
    color: var(--ink);
    font-size: 13.5px;
    font-weight: 600;
}

/* ---------- note ---------- */
.lvv-note {
    margin: 20px 0 0 !important;
    padding-left: 14px;
    border-left: 3px solid var(--gold);
    color: var(--muted) !important;
    font-size: 13.5px !important;
    line-height: 1.62 !important;
}

/* ---------- inline CTA button ---------- */
.lvv-cta {
    display: inline-block;
    margin: 6px 0 0;
    padding: 13px 24px;
    border: 0 !important;
    border-radius: 999px;
    background: var(--red);
    color: #fff !important;
    font-size: 13.5px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    transition: background .18s ease, transform .18s ease;
}

.lvv-cta:hover,
.lvv-cta:focus {
    background: #c00f0f;
    color: #fff !important;
    transform: translateY(-1px);
}

.lvv-aside { padding-top: 6px; }

/* ---------- responsive ---------- */
@media (max-width: 991px) {
    .lvv h1.lvv-title { font-size: 31px; }
    .lvv-stats { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 767px) {
    .lvv { padding: 30px 0 44px; }
    .lvv h1.lvv-title { font-size: 26px; }
    .lvv-lead { font-size: 16px !important; }
    .lvv-stats,
    .lvv-cols,
    .lvv-incs { grid-template-columns: 1fr; }
    .lvv-panel { padding: 22px 18px 18px; }
    .lvv-price { grid-template-columns: 1fr; }
    .lvv-price__tag { padding: 20px 22px; }
    .lvv .lvv-price__amt { font-size: 34px; }
    .lvv-price__body { padding: 20px 22px; }
    .lvv-quote { padding: 20px 22px; }
    .lvv-quote p { font-size: 16.5px; }
    .lvv-callout { padding: 22px 20px; }
    .lvv .lvv-callout__lead { font-size: 17px; }
    .lvv-strip { padding: 18px 20px; }
    .lvv .lvv-strip__t { font-size: 15px; }
    .lvv-steps li { padding-left: 46px; }
    .lvv-steps li::before { width: 30px; height: 30px; font-size: 13px; }
    .lvv-steps li::after { left: 15px; top: 36px; }
}

@media (prefers-reduced-motion: reduce) {
    .lvv-inc,
    .lvv-cta { transition: none; }
    .lvv-inc:hover,
    .lvv-cta:hover { transform: none; }
}

/* ------------------------------------------------------------------ *
 * The site-wide script `$('h2').textEffect('slide')` splits every h2
 * into per-letter spans parked far to the right, which pushed the
 * document ~300px wider than the viewport (sideways scroll on phones).
 * Inside this block the letters are pinned in place; the rest of the
 * site keeps the effect untouched.
 * ------------------------------------------------------------------ */
.lvv h2 .text-effect,
.lvv h2 span.text-effect {
    position: static !important;
    left: auto !important;
    top: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: inline !important;
}