
/* === VTVcab Brand Tokens (from brand guideline PDF) === */
:root{
  --vtv-red: #d4231c;
  --vtv-green: #009a44;
  --vtv-blue: #1717c8;
  --vtv-back: #027ced; /* official background */
  --vtv-text: #0b1220;
  --vtv-muted: #51607a;
  --vtv-surface: #ffffff;
  --vtv-surface-2: #f6f8ff;
  --vtv-border: rgba(2, 20, 60, .12);
  --vtv-shadow-sm: 0 6px 18px rgba(2,20,60,.10);
  --vtv-shadow-md: 0 12px 34px rgba(2,20,60,.14);
  --vtv-shadow-lg: 0 22px 70px rgba(2,20,60,.18);
  --vtv-radius: 20px;
  --vtv-radius-lg: 28px;
}

/* Modern Landing Pages (v2.6.0) - loaded only on core landings
   Goals: premium look, simple hierarchy, fast rendering. */

/* ==============================
   v3.0.0 UI/UX refresh
   - Stronger hierarchy
   - Conversion-focused components
   - Sticky CTA + section nav
   ============================== */

.vt-lp{
  --lp-radius: 22px;
  --lp-radius-sm: 16px;
  --lp-border: rgba(15,23,42,.10);
  --lp-bg-soft: rgba(2,124,237,.06);
  --lp-shadow-1: 0 14px 40px rgba(2, 6, 23, .10);
  --lp-shadow-2: 0 24px 70px rgba(2, 6, 23, .14);
  --lp-shadow-in: 0 1px 0 rgba(255,255,255,.65) inset;
  --lp-text: var(--vt-text);
  --lp-muted: var(--vt-muted);
  color: var(--lp-text);
}

.vt-lp-hero2{
  padding: clamp(34px, 5vw, 68px) 0;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(900px 520px at 12% 20%, rgba(2,124,237,.14), transparent 62%),
    radial-gradient(900px 520px at 88% 10%, rgba(0,154,68,.10), transparent 58%),
    linear-gradient(180deg, rgba(2,6,23,.02), transparent 58%);
  border-bottom: 1px solid var(--lp-border);
}

/* Section quick-nav (anchors) */
.vt-lpNav{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding: 14px;
  border-radius: 999px;
  border: 1px solid var(--lp-border);
  background: rgba(255,255,255,.72);
  box-shadow: var(--lp-shadow-sm);
  backdrop-filter: blur(12px);
  margin-top: 16px;
}
.vt-lpNav a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 10px 14px;
  border-radius: 999px;
  text-decoration:none;
  color: #0f172a;
  font-weight: 800;
  font-size: 13px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.92);
}
.vt-lpNav a:hover{ transform: translateY(-1px); box-shadow: var(--lp-shadow-1); }

/* Trust bar */
.vt-trustbar{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
  margin-top: 18px;
}
.vt-trust{
  border-radius: var(--lp-radius-sm);
  border: 1px solid var(--lp-border);
  background: rgba(255,255,255,.86);
  box-shadow: var(--lp-shadow-sm);
  padding: 14px 14px;
  display:flex;
  gap: 12px;
  align-items:flex-start;
}
.vt-trust__ico{
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display:grid;
  place-items:center;
  background: rgba(2,124,237,.10);
  color: #0b1220;
  flex: 0 0 auto;
}
.vt-trust__t{ font-weight: 900; font-size: 14px; margin: 0; }
.vt-trust__d{ margin: 2px 0 0; color: var(--lp-muted); font-size: 13px; line-height: 1.35; }
@media (max-width: 980px){
  .vt-trustbar{ grid-template-columns: 1fr; }
  .vt-lpNav{ border-radius: var(--lp-radius); }
}

/* Sticky CTA (mobile + desktop) */
.vt-stickyCta{
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 9999;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.88);
  box-shadow: 0 18px 60px rgba(2,6,23,.22);
  backdrop-filter: blur(14px);
  padding: 10px;
  display:flex;
  gap: 10px;
  align-items:center;
  justify-content: space-between;
}
.vt-stickyCta__left{ display:flex; flex-direction:column; gap:2px; min-width: 0; }
.vt-stickyCta__k{ font-size: 12px; font-weight: 900; color:#0f172a; white-space:nowrap; overflow:hidden; text-overflow: ellipsis; }
.vt-stickyCta__m{ font-size: 12px; color: var(--lp-muted); white-space:nowrap; overflow:hidden; text-overflow: ellipsis; }
.vt-stickyCta__btns{ display:flex; gap:10px; flex:0 0 auto; }
@media (min-width: 1100px){
  .vt-stickyCta{ left: 24px; right: 24px; max-width: 1080px; margin: 0 auto; }
}
@media (max-width: 520px){
  .vt-stickyCta__m{ display:none; }
}

/* Give pages breathing room so content isn't covered by sticky bar */
.vt-lp{ padding-bottom: 92px; }

/* ==============================
   v3.0.2 Combo page components
   ============================== */

.vtv-comboBuilder{
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 22px;
  background:
    radial-gradient(700px 420px at 18% 12%, rgba(2,124,237,.18), transparent 60%),
    radial-gradient(700px 420px at 90% 6%, rgba(0,154,68,.12), transparent 62%),
    rgba(255,255,255,.88);
  box-shadow: 0 14px 44px rgba(2,6,23,.10);
  overflow: hidden;
}

.vtv-comboBuilder__grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  padding: 18px;
}

.vtv-comboBuilder__left h2{ margin: 0 0 6px; }
.vtv-comboBuilder__hint{ color: var(--vtv-muted); margin: 0 0 14px; }

.vtv-comboBuilder__form{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
  margin-top: 10px;
}

.vtv-field label{
  display:block;
  font-weight: 800;
  font-size: 13px;
  margin-bottom: 6px;
}

.vtv-field select{
  width:100%;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.12);
  padding: 12px 12px;
  background: rgba(255,255,255,.92);
  font-weight: 700;
}

.vtv-comboBuilder__cta{
  margin-top: 12px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

.vtv-comboBuilder__right{
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 30px rgba(2,6,23,.10);
  padding: 14px;
  display:flex;
  flex-direction: column;
  gap: 10px;
}

.vtv-comboPrice__k{ font-size: 12px; color: var(--vtv-muted); font-weight: 800; }
.vtv-comboPrice__v{ font-size: 28px; font-weight: 950; letter-spacing: -0.02em; }
.vtv-comboPrice__v small{ font-size: 14px; font-weight: 900; color: var(--vtv-muted); }

.vtv-comboPerks{ display:grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.vtv-comboPerks li{ display:flex; gap: 8px; align-items:flex-start; color:#0f172a; font-weight: 700; }
.vtv-comboPerks li span{ color: var(--vtv-muted); font-weight: 600; }

.vtv-tabs{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 12px 0 14px;
}
.vtv-tab{
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 900;
  background: rgba(255,255,255,.92);
  cursor: pointer;
}
.vtv-tab.is-active{ background: rgba(2,124,237,.10); border-color: rgba(2,124,237,.25); }

.vtv-priceGrid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
  margin-top: 10px;
}
.vtv-priceCard{
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 28px rgba(2,6,23,.08);
  padding: 14px;
}
.vtv-priceCard__top{ display:flex; justify-content: space-between; gap: 10px; }
.vtv-priceCard__name{ font-weight: 950; margin: 0; }
.vtv-priceCard__sub{ margin: 6px 0 0; color: var(--vtv-muted); font-weight: 700; font-size: 13px; }
.vtv-priceCard__price{ margin-top: 12px; font-size: 22px; font-weight: 950; }
.vtv-priceCard__price small{ font-size: 12px; color: var(--vtv-muted); font-weight: 800; }

.vtv-priceCard--hot{
  border-color: rgba(2,124,237,.25);
  box-shadow: 0 16px 40px rgba(2,124,237,.12);
  transform: translateY(-2px);
}

.vtv-compare{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}
.vtv-compare .vtv-card{ height:100%; }

@media (max-width: 980px){
  .vtv-comboBuilder__grid{ grid-template-columns: 1fr; }
  .vtv-comboBuilder__form{ grid-template-columns: 1fr; }
  .vtv-priceGrid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .vtv-compare{ grid-template-columns: 1fr; }
}

@media (max-width: 520px){
  .vtv-priceGrid{ grid-template-columns: 1fr; }
}

.vt-hero2{
  display:grid;
  grid-template-columns: 1.12fr .88fr;
  gap: clamp(18px, 3.8vw, 44px);
  align-items:center;
}

@media (max-width: 980px){
  .vt-hero2{ grid-template-columns: 1fr; }
}

.vt-hero2__media{
  position: relative;
  border-radius: calc(var(--lp-radius) + 10px);
  overflow: hidden;
  box-shadow: var(--lp-shadow-2);
  border: 1px solid rgba(255,255,255,.35);
  background: transparent;
  min-height: clamp(220px, 32vw, 420px);
}

.vt-hero2__img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
  transform: scale(1.01);
}

/* v3.0.0: hard-stop any accidental dark overlays on hero media */
.vt-hero2__media::before,
.vt-hero2__media::after{ content:none !important; }
.vt-hero2__img{ background: transparent !important; filter:none !important; }

.vt-hero2__glow{
  position:absolute;
  inset:-60px;
  filter: blur(18px);
  opacity:.55;
  pointer-events:none;
}

.vt-hero2__glow--a{
  background: radial-gradient(closest-side, rgba(2,124,237,.45), transparent 60%);
  transform: translate(-24%, -18%);
}
.vt-hero2__glow--b{
  background: radial-gradient(closest-side, rgba(218,41,28,.40), transparent 62%);
  transform: translate(26%, 10%);
  opacity:.40;
}

/* Hero decorative chips (Router + WiFi + Speed) */
.vt-hero2__iconstack{
  position:absolute;
  left: 18px;
  bottom: 18px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  max-width: calc(100% - 36px);
  pointer-events: none;
  z-index: 3;
}
.vt-hero2__chip{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: 0 10px 28px rgba(0,0,0,.12);
  color:#0f172a;
  font-weight: 800;
  font-size: 12px;
  line-height: 1;
  backdrop-filter: blur(10px);
}
.vt-hero2__chip svg{display:block;opacity:.85}

@media (max-width: 900px){
  .vt-hero2__iconstack{left: 12px; bottom: 12px; gap: 8px; max-width: calc(100% - 24px)}
  .vt-hero2__chip{padding: 7px 10px; font-size: 11px}
}

.vt-hero2__content{
  max-width: 620px;
}

.vt-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--lp-border);
  background: rgba(255,255,255,.74);
  box-shadow: var(--lp-shadow-in);
  font-weight: 600;
  font-size: 13px;
  color: rgba(15,23,42,.86);
}

.vt-h1{
  font-size: clamp(30px, 3.4vw, 46px);
  line-height: 1.08;
  margin: 14px 0 10px;
  letter-spacing: -.02em;
}

.vt-sub{
  font-size: clamp(15px, 1.35vw, 18px);
  line-height: 1.6;
  color: var(--lp-muted);
  margin: 0 0 18px;
}

.vt-actions{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 10px 0 12px;
}

/* Mobile-first tuning: clearer hierarchy, less clutter, better tap targets */
@media (max-width: 560px){
  .vt-lp{--lp-radius:18px;--lp-radius-sm:14px}
  .vt-lp-hero2{padding: 26px 0 34px}
  .vt-hero2__media{min-height: 190px; border-radius: 20px}
  .vt-h1{font-size: 28px; line-height:1.12}
  .vt-sub{font-size: 15px}
  .vt-actions{flex-direction:column; gap:10px}
  .vt-actions .vt-btn{width:100%; justify-content:center}
  .vt-pricecard{padding: 16px}
  .vt-pricecard__price{font-size: 24px}
  .vt-combo-card{padding: 14px}
  .vt-ctaBand__inner{padding:16px}
}

.vt-note{
  font-size: 13px;
  color: rgba(15,23,42,.62);
}

.vt-lp-section2{
  padding: clamp(34px, 5vw, 64px) 0;
}

.vt-section-head{
  text-align:center;
  margin: 0 auto 18px;
  max-width: 760px;
}

.vt-h2{
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.2;
  margin: 0 0 8px;
  letter-spacing: -.01em;
}
.vt-p{
  margin: 0;
  color: var(--lp-muted);
  line-height: 1.65;
}

.vt-pricegrid{
  display:grid;
  gap: 16px;
  margin-top: 20px;
}
.vt-pricegrid--3{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vt-pricegrid--4{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px){
  .vt-pricegrid--4{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 940px){
  .vt-pricegrid--3{ grid-template-columns: 1fr; }
}
@media (max-width: 560px){
  .vt-pricegrid--4{ grid-template-columns: 1fr; }
}

.vt-pricecard{
  position: relative;
  display:flex;
  flex-direction:column;
  border-radius: var(--lp-radius);
  border: 1px solid var(--lp-border);
  background:
    radial-gradient(120% 90% at 10% 0%, rgba(255,255,255,.95), rgba(255,255,255,.88)),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.86));
  box-shadow: var(--lp-shadow-1);
  padding: 18px 18px 16px;
  transition: transform .18s ease, box-shadow .18s ease;
  will-change: transform;
}
.vt-pricecard .vt-checklist{margin-bottom:14px}
.vt-pricecard .vt-stack{margin-top:auto}
.vt-pricecard:hover{
  transform: translateY(-3px);
  box-shadow: var(--lp-shadow-2);
}
@media (prefers-reduced-motion: reduce){
  .vt-pricecard{ transition: none; }
  .vt-pricecard:hover{ transform:none; }
}

.vt-pricecard__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.vt-pricecard__title{
  font-weight: 700;
  letter-spacing: -.01em;
}

.vt-badge{
  font-size: 12px;
  font-weight: 700;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.55);
  color: rgba(255,255,255,.92);
  background: rgba(15,23,42,.70);
  box-shadow: 0 10px 26px rgba(2,6,23,.18);
}

.vt-pricecard__meta{
  color: rgba(15,23,42,.72);
  font-weight: 600;
  margin-bottom: 8px;
}

.vt-pricecard__price{
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -.02em;
  margin-bottom: 14px;
}

.vt-checklist{
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
}
.vt-checklist li{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  padding: 10px 0;
  border-top: 1px dashed rgba(15,23,42,.12);
  color: rgba(15,23,42,.78);
}
.vt-checklist li:first-child{ border-top: 0; padding-top:0; }
.vt-checklist li:before{
  content: "✓";
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 999px;
  color: #fff;
  font-weight: 900;
  background: rgba(2,124,237,.95);
  box-shadow: 0 10px 22px rgba(2,124,237,.22);
}

.vt-stack{ display:grid; gap: 10px; }

/* Accent gradients per card */
.vt-accent--1{ --acc: rgba(2,124,237,.18); --acc2: rgba(2,124,237,.08); }
.vt-accent--2{ --acc: rgba(0,154,68,.18); --acc2: rgba(0,154,68,.08); }
.vt-accent--3{ --acc: rgba(218,41,28,.18); --acc2: rgba(218,41,28,.08); }
.vt-accent--4{ --acc: rgba(23,28,143,.18); --acc2: rgba(23,28,143,.08); }

.vt-pricecard.vt-accent--1,
.vt-pricecard.vt-accent--2,
.vt-pricecard.vt-accent--3,
.vt-pricecard.vt-accent--4{
  background:
    radial-gradient(120% 90% at 10% 0%, rgba(255,255,255,.96), rgba(255,255,255,.86)),
    radial-gradient(900px 520px at 16% 10%, var(--acc), transparent 60%),
    radial-gradient(900px 520px at 88% 10%, var(--acc2), transparent 60%);
}

.vt-divider{
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(15,23,42,.12), transparent);
  margin: 26px 0;
}

/* Combo cards */
.vt-combo-grid{
  display:grid;
  gap: 14px;
  margin-top: 18px;
}

.vt-combo-card{
  display:grid;
  grid-template-columns: 240px 1fr;
  gap: 14px;
  align-items: stretch;
  border-radius: var(--lp-radius);
  border: 1px solid var(--lp-border);
  background:
    radial-gradient(120% 90% at 10% 0%, rgba(255,255,255,.96), rgba(255,255,255,.86)),
    radial-gradient(900px 520px at 16% 10%, var(--acc), transparent 60%);
  box-shadow: var(--lp-shadow-1);
  padding: 16px;
}

@media (max-width: 900px){
  .vt-combo-card{ grid-template-columns: 1fr; }
}

.vt-combo-code{
  font-weight: 900;
  font-size: 18px;
  letter-spacing: -.01em;
}
.vt-combo-speed{
  margin-top: 4px;
  color: rgba(15,23,42,.70);
  font-weight: 600;
}

.vt-combo-prices{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}

@media (max-width: 560px){
  .vt-combo-prices{ grid-template-columns: 1fr; }
}

.vt-combo-pricebox{
  border-radius: var(--lp-radius-sm);
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.72);
  box-shadow: var(--lp-shadow-in);
  padding: 12px 12px;
}

.vt-combo-label{
  font-weight: 700;
  color: rgba(15,23,42,.70);
  font-size: 13px;
}

.vt-combo-price{
  font-weight: 900;
  font-size: 20px;
  margin-top: 6px;
}

/* Compact prose (optional SEO content) */
.vt-prose--compact{
  max-width: 860px;
  margin: 22px auto 0;
}
.vt-prose--compact p{ line-height: 1.75; }

/* Improve focus visibility for landing CTAs */
.vt-lp :focus-visible{
  outline: 3px solid rgba(2,124,237,.55);
  outline-offset: 3px;
  border-radius: 12px;
}


/* --- SEO blocks & Q&A --- */
.vt-section--seo{padding-top:32px;padding-bottom:32px}
.vt-seoGrid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:start}
@media (max-width: 980px){.vt-seoGrid{grid-template-columns:1fr}}
.vt-qa{background:var(--vt-surface);border:1px solid var(--vt-border);border-radius:18px;padding:18px;box-shadow:var(--vt-shadow-2)}
.vt-qa .vt-h2{margin:4px 0 12px;font-size:20px}
.vt-qa__item{border-top:1px solid var(--vt-border);padding:14px 0}
.vt-qa__item:first-of-type{border-top:0}
.vt-qa__item summary{cursor:pointer;font-weight:600;list-style:none}
.vt-qa__item summary::-webkit-details-marker{display:none}
.vt-qa__body{padding-top:8px;color:var(--vt-muted)}
/* CTA band */
.vt-ctaBand{margin-top:22px;border-radius:20px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(135deg, rgba(77,124,255,.16), rgba(186,85,255,.14));box-shadow:var(--vt-shadow-3);overflow:hidden}
.vt-ctaBand__inner{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:18px 18px}
@media (max-width: 760px){.vt-ctaBand__inner{flex-direction:column;align-items:flex-start}}
.vt-ctaBand__title{font-weight:800;font-size:18px}
.vt-ctaBand__desc{color:var(--vt-muted);margin-top:4px}
.vt-ctaBand__actions{display:flex;gap:10px;flex-wrap:wrap}
/* Contact page */
.vt-hero--contact{padding:44px 0}
.vt-contact .vt-contact__map iframe{width:100%;min-height:320px;border:0;border-radius:14px}
.vt-note{background:rgba(15,23,42,.04);border:1px dashed var(--vt-border);padding:12px;border-radius:14px;color:var(--vt-muted)}
.vt-mt-6{margin-top:24px}


/* === Landing v2.7.0 layout === */
.vtv-container{max-width:1100px;margin:0 auto;padding:0 16px;}
.vtv-hero{margin:18px auto 18px; border-radius: var(--vtv-radius-lg); overflow:hidden; box-shadow: var(--vtv-shadow-lg); background: linear-gradient(135deg, rgba(2,124,237,.16), rgba(23,23,200,.12));}
.vtv-hero__inner{display:grid;grid-template-columns:1fr;gap:14px;align-items:center;padding:18px;}
.vtv-hero__title{font-size:28px;line-height:1.15;margin:0;color:var(--vtv-text);letter-spacing:-.02em;}
.vtv-hero__subtitle{margin:8px 0 0;color:var(--vtv-muted);font-size:15px;line-height:1.6;}
.vtv-hero__media{border-radius:18px;overflow:hidden;box-shadow:var(--vtv-shadow-md);background:transparent;}
.vtv-hero__media img{display:block;width:100%;height:100%;object-fit:cover;}
.vtv-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.vtv-badge{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--vtv-border);padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.7);backdrop-filter:saturate(160%) blur(10px);font-weight:600;font-size:13px;color:var(--vtv-text);}
.vtv-section{padding:26px 0;}
.vtv-section__head{text-align:center;margin-bottom:16px;}
.vtv-h2{font-size:22px;letter-spacing:-.02em;margin:0;color:var(--vtv-text);}
.vtv-lead{margin:10px auto 0;max-width:720px;color:var(--vtv-muted);line-height:1.7;font-size:15px;}
.vtv-pack-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:16px;}
.vtv-card{border:1px solid var(--vtv-border);border-radius:var(--vtv-radius);background:rgba(255,255,255,.92);box-shadow:var(--vtv-shadow-sm);overflow:hidden;}
.vtv-card:hover{box-shadow:var(--vtv-shadow-md);transform:translateY(-1px);}
.vtv-card__body{padding:16px;}
.vtv-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:7px 12px;font-weight:800;font-size:12px;color:#fff;letter-spacing:.03em}
.vtv-pill--red{background:linear-gradient(135deg,var(--vtv-red),#ff4a41);}
.vtv-pill--green{background:linear-gradient(135deg,var(--vtv-green),#20d07a);}
.vtv-pill--blue{background:linear-gradient(135deg,var(--vtv-blue),#3a45ff);}
.vtv-price{margin:12px 0 6px;font-size:32px;letter-spacing:-.03em;font-weight:900;color:var(--vtv-text);}
.vtv-price small{font-size:14px;font-weight:700;color:var(--vtv-muted);margin-left:6px}
.vtv-ul{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:10px;}
.vtv-ul li{display:flex;gap:10px;align-items:flex-start;color:var(--vtv-text);line-height:1.55}
.vtv-ul li:before{content:"";margin-top:5px;width:18px;height:18px;border-radius:50%;background:rgba(2,124,237,.12);border:1px solid rgba(2,124,237,.25);}
.vtv-btn{display:inline-flex;align-items:center;justify-content:center;border-radius:14px;padding:12px 14px;font-weight:900;text-decoration:none;border:0;cursor:pointer;width:100%;}
.vtv-btn--primary{background:linear-gradient(135deg,var(--vtv-back),var(--vtv-blue));color:#fff;box-shadow:var(--vtv-shadow-sm);}
.vtv-btn--primary:hover{filter:saturate(1.05);box-shadow:var(--vtv-shadow-md);}
.vtv-btn--ghost{background:#fff;border:1px solid var(--vtv-border);color:var(--vtv-text);}
.vtv-cta-band{margin-top:16px;border-radius:var(--vtv-radius);padding:16px;border:1px solid rgba(2,124,237,.25);background:linear-gradient(135deg,rgba(2,124,237,.12),rgba(23,23,200,.08));box-shadow:var(--vtv-shadow-sm);}
.vtv-cta-band__grid{display:grid;grid-template-columns:1fr;gap:10px;align-items:center;}
.vtv-cta-band__title{margin:0;font-size:18px;color:var(--vtv-text);letter-spacing:-.02em}
.vtv-cta-band__text{margin:6px 0 0;color:var(--vtv-muted);line-height:1.6}
.vtv-cta-actions{display:grid;grid-template-columns:1fr;gap:10px;}
.vtv-seo{border-top:1px solid rgba(2,20,60,.08);padding-top:18px;margin-top:18px;}
.vtv-seo h3{font-size:18px;margin:18px 0 10px;color:var(--vtv-text);}
.vtv-seo p{color:var(--vtv-muted);line-height:1.85;margin:0 0 12px;}
.vtv-qa{margin-top:14px;text-align:left;}
.vtv-qa details{border:1px solid var(--vtv-border);border-radius:16px;background:#fff;box-shadow:var(--vtv-shadow-sm);padding:12px 14px;margin-bottom:10px;}
.vtv-qa summary{cursor:pointer;font-weight:900;color:var(--vtv-text);list-style:none;}
.vtv-qa summary::-webkit-details-marker{display:none;}
.vtv-qa details p{margin:10px 0 0;color:var(--vtv-muted);line-height:1.75;}
/* tables for combo pricing */
.vtv-table-wrap{overflow:auto;border-radius:var(--vtv-radius);border:1px solid var(--vtv-border);background:#fff;box-shadow:var(--vtv-shadow-sm);}
.vtv-table{width:100%;border-collapse:collapse;min-width:680px;}
.vtv-table th,.vtv-table td{padding:12px 14px;border-bottom:1px solid rgba(2,20,60,.08);text-align:center;}
.vtv-table th{background:rgba(2,124,237,.06);font-weight:900;color:var(--vtv-text);white-space:nowrap;}
.vtv-table td{color:var(--vtv-text);font-weight:800;}
.vtv-table .vtv-rowhead{text-align:left;font-weight:900;color:var(--vtv-text);white-space:nowrap;}
/* desktop */
@media (min-width: 920px){
  .vtv-hero__inner{grid-template-columns: 1.05fr .95fr; padding:26px; gap:18px;}
  .vtv-hero__title{font-size:40px}
  .vtv-pack-grid{grid-template-columns:repeat(3,1fr);gap:16px;}
  .vtv-cta-band__grid{grid-template-columns: 1.25fr .75fr; gap:16px;}
  .vtv-cta-actions{grid-template-columns:1fr 1fr;}
}


/* === Internet Redesign v2.8.1 === */

/* Responsive pricing grid */
.vtv-pack-grid{grid-template-columns:1fr;}
@media (min-width:720px){ .vtv-pack-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (min-width:1024px){ .vtv-pack-grid{grid-template-columns:repeat(4,minmax(0,1fr));} }

/* Pricing card tweaks */
.vtv-card--pricing .vtv-card__top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.vtv-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;background:rgba(2,124,237,.10);color:var(--vtv-blue);border:1px solid rgba(2,124,237,.18)}
.vtv-speed{margin-top:10px;font-size:14px;font-weight:800;color:var(--vtv-muted)}
.vtv-card__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.vtv-card__actions .vtv-btn{flex:1 1 160px}

/* Featured */
.vtv-card--pricing.is-featured{border-color:rgba(2,124,237,.28);box-shadow:var(--vtv-shadow-md)}
.vtv-card--pricing.is-featured .vtv-card__body{background:linear-gradient(180deg, rgba(2,124,237,.06), rgba(255,255,255,.92))}

/* CTA strip */
.vtv-cta-strip{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 14px;border:1px solid var(--vtv-border);border-radius:18px;background:rgba(255,255,255,.92);box-shadow:var(--vtv-shadow-sm)}
.vtv-cta-strip .vtv-muted{margin-left:8px}
@media (max-width:720px){ .vtv-cta-strip{flex-direction:column;align-items:flex-start} }

/* Soft section */
.vtv-section--soft{background:linear-gradient(135deg, rgba(2,124,237,.06), rgba(23,23,200,.05));border:1px solid rgba(15,23,42,.06);border-radius:24px;padding:22px 16px}

/* Feature grid */
.vtv-feature-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-top:16px}
@media (min-width:860px){ .vtv-feature-grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (min-width:1100px){ .vtv-feature-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;} }

.vtv-feature{border:1px solid var(--vtv-border);border-radius:18px;background:rgba(255,255,255,.92);box-shadow:var(--vtv-shadow-sm);padding:16px}
.vtv-feature h3{margin:10px 0 6px;font-size:16px;letter-spacing:-.01em}
.vtv-feature p{margin:0;color:var(--vtv-muted);line-height:1.65}
.vtv-ico{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(2,124,237,.10);border:1px solid rgba(2,124,237,.18);font-size:18px}

/* Pick grid */
.vtv-pick-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-top:16px}
@media (min-width:860px){ .vtv-pick-grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
.vtv-pick{border:1px solid var(--vtv-border);border-radius:18px;background:rgba(255,255,255,.92);box-shadow:var(--vtv-shadow-sm);padding:16px}
.vtv-pick__head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.vtv-pick__head strong{font-size:16px}
.vtv-pick .vtv-ul{margin:0}

/* Steps */
.vtv-steps{counter-reset:step;display:grid;grid-template-columns:1fr;gap:12px;margin:16px 0 0;padding:0;list-style:none}
@media (min-width:860px){ .vtv-steps{grid-template-columns:repeat(3,minmax(0,1fr));} }
.vtv-steps li{border:1px solid var(--vtv-border);border-radius:18px;background:rgba(255,255,255,.92);box-shadow:var(--vtv-shadow-sm);padding:16px;position:relative}
.vtv-steps li:before{counter-increment:step;content:counter(step);position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(2,124,237,.10);border:1px solid rgba(2,124,237,.18);font-weight:900;color:var(--vtv-blue)}
.vtv-steps strong{display:block;margin-bottom:6px}

/* Accordion */
.vtv-accordion{display:grid;gap:10px;margin-top:14px}
.vtv-acc{border:1px solid var(--vtv-border);border-radius:16px;background:rgba(255,255,255,.92);box-shadow:var(--vtv-shadow-sm);padding:0;overflow:hidden}
.vtv-acc summary{cursor:pointer;padding:14px 14px;font-weight:800;list-style:none}
.vtv-acc summary::-webkit-details-marker{display:none}
.vtv-acc__content{padding:0 14px 14px;color:var(--vtv-muted);line-height:1.65}

/* Final CTA */
.vtv-final{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px;border-radius:22px;border:1px solid rgba(2,124,237,.18);background:linear-gradient(135deg, rgba(2,124,237,.10), rgba(255,255,255,.92));box-shadow:var(--vtv-shadow-sm)}
@media (max-width:720px){ .vtv-final{flex-direction:column;align-items:flex-start} }


/* Force "Vì sao nên chọn" section to stack (fix extra column / unwanted grid inheritance) */
.vtv-why{
  display:grid !important;
  grid-template-columns:1fr !important;
  align-items:start;
}
.vtv-why .vtv-section__head,
.vtv-why .vtv-feature-grid{
  grid-column:1 / -1 !important;
}
@media (min-width:860px){
  .vtv-why .vtv-section__head{ text-align:left; max-width:720px; }
  .vtv-why .vtv-feature-grid{ margin-top:18px; }
}

/* --------------------------------------------------------------------------
 * Landing block layout resets
 *
 * The theme's global styles define .vt-benefits/.vt-steps/.vt-faq as a 3-col
 * grid for other pages. Landing templates use different HTML (heading + list/
 * cards) so we reset layout only when the modifier class .vt-lp-block is present.
 * -------------------------------------------------------------------------- */
.vt-benefits.vt-lp-block,
.vt-steps.vt-lp-block,
.vt-faq.vt-lp-block{
  display:block !important;
  grid-template-columns:unset !important;
  gap:unset !important;
}

/* Consistent vertical rhythm between landing blocks */
.vt-lp-block{
  margin-top: clamp(18px, 3.2vw, 34px);
}

.vt-benefits.vt-lp-block > h2,
.vt-steps.vt-lp-block > h2,
.vt-faq.vt-lp-block > h2{margin:0 0 14px !important}

.vt-benefits.vt-lp-block .vt-grid3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

/* 2-column grid used by comparison blocks (e.g., Combo Family vs Family+) */
.vt-grid2{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
@media (max-width:980px){
  .vt-grid2{grid-template-columns:1fr}
}
@media (max-width:980px){
  .vt-benefits.vt-lp-block .vt-grid3{grid-template-columns:1fr}
}

.vt-benefits.vt-lp-block .vt-card{
  border-radius:18px;
  border:1px solid rgba(0,0,0,.07);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  padding: 18px;
}

/* Combo comparison block */
.vt-compare__hint{ color: var(--lp-muted); font-weight: 700; font-size: 14px; }
.vt-compare__card{ border:1px solid rgba(0,0,0,.07); }
.vt-compare__card--plus{ border-color: rgba(14,165,233,.32); box-shadow:0 12px 28px rgba(2,132,199,.10); }
.vt-compare__head{ display:flex; align-items:center; justify-content:flex-start; }
.vt-compare__note{ margin-top:10px; color: var(--lp-muted); font-weight: 600; }

/* Center the installation steps section (vertical stack) */
.vt-steps.vt-lp-block{
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.vt-steps.vt-lp-block .vt-stepper{
  margin: 0;
  padding-left: 18px;
  display: inline-block;
  text-align: left;
}
.vt-steps.vt-lp-block .vt-stepper li{margin:10px 0}

.vt-faq.vt-lp-block .vt-faq__list{display:grid;gap:10px}
.vt-lp-split{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  align-items:start;
}
@media (max-width: 980px){
  .vt-lp-split{grid-template-columns:1fr;}
}


/* v2.9.0 SEO + Conversion blocks */
.vtv-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width: 900px){.vtv-grid-3{grid-template-columns:1fr}}

.vtv-cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.vtv-cta-row .vtv-btn{white-space:nowrap}

.vtv-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width: 900px){.vtv-trust{grid-template-columns:1fr}}
.vtv-trust__item{border:1px solid var(--vt-border);border-radius:16px;padding:18px 18px;background:var(--vt-card)}
.vtv-trust__item strong{display:block}
.vtv-trust__item span{display:block;opacity:.85;margin-top:2px;font-size:14px}


/* === v2.9.3 Premium Landing Upgrade (non-pricing) === */
.vtv-hero{position:relative; background: linear-gradient(135deg, rgba(2,124,237,.18), rgba(0,154,68,.10), rgba(212,35,28,.10));}
.vtv-hero::before{content:"";position:absolute;inset:-2px;pointer-events:none;
  background:
    radial-gradient(900px 520px at 12% 22%, rgba(2,124,237,.22), transparent 62%),
    radial-gradient(700px 420px at 88% 18%, rgba(0,154,68,.16), transparent 58%),
    radial-gradient(520px 360px at 78% 82%, rgba(212,35,28,.12), transparent 62%);
  opacity:.9;
}
.vtv-hero__inner{position:relative;}

.vtv-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px auto 0;}
.vtv-proof__item{background:rgba(255,255,255,.72);border:1px solid var(--vtv-border);border-radius:18px;padding:12px 14px;box-shadow:var(--vtv-shadow-sm);backdrop-filter:saturate(140%) blur(8px);}
.vtv-proof__kpi{font-weight:800;color:var(--vtv-text);font-size:16px;line-height:1.2;}
.vtv-proof__kpi{display:flex;align-items:center;gap:10px;}
.vtv-icoimg{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:10px;background:rgba(2,124,237,.10);color:var(--vtv-accent);} 
.vtv-icoimg img{width:18px;height:18px;display:block;}
.vtv-proof__desc{margin-top:4px;color:var(--vtv-muted);font-size:13px;line-height:1.45;}
@media (max-width: 860px){.vtv-proof{grid-template-columns:1fr;}}

.vtv-card{transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;}
.vtv-card:hover{transform:translateY(-2px);box-shadow:var(--vtv-shadow-md);border-color:rgba(2,124,237,.26);}

.vtv-btn--primary{box-shadow:0 10px 22px rgba(212,35,28,.18);}
.vtv-btn--primary:hover{transform:translateY(-1px);}

.vtv-section--soft{background:linear-gradient(180deg, rgba(2,124,237,.07), rgba(2,124,237,.03));border:1px solid rgba(2,20,60,.08);}

/* Sticky CTA – premium */
.vtv-sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:9999;display:none;padding:10px 14px;background:rgba(255,255,255,.92);border-top:1px solid var(--vtv-border);backdrop-filter:saturate(150%) blur(10px);}
.vtv-sticky-cta__inner{max-width:1120px;margin:0 auto;display:flex;gap:10px;align-items:center;justify-content:space-between;}
.vtv-sticky-cta__text{font-size:13px;color:var(--vtv-muted);line-height:1.35;}
.vtv-sticky-cta__actions{display:flex;gap:10px;align-items:center;}
@media (max-width: 860px){
  .vtv-sticky-cta{display:block;}
  .vtv-sticky-cta__text{display:none;}
  body.has-sticky-cta{padding-bottom:64px;}
}

/* === v2.9.3.4 Hero media standardization (fix dark band) === */
.vtv-hero__media,
.vtv-hero__media img{
  background: transparent !important;
  filter: none !important;
}
.vtv-hero__media{position:relative;overflow:hidden;}
.vtv-hero__media::before,
.vtv-hero__media::after{
  content:none !important;
}

/* ===== v3.0.0: Section quick nav (anchors) ===== */
.vt-lp-nav{
  position: sticky;
  top: 64px;
  z-index: 30;
  margin-top: -18px;
  padding: 10px 0;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.72));
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--lp-border);
}
.vt-lp-nav__inner{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items:center;
}
.vt-chip{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 9px 12px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 26px rgba(2,6,23,.08);
  font-weight: 800;
  font-size: 13px;
  color: #0f172a;
  text-decoration:none;
}
.vt-chip:hover{ transform: translateY(-1px); }

@media (max-width: 980px){
  .vt-lp-nav{ top: 54px; }
}

/* ===== v3.0.0: Trust bar ===== */
.vt-trustbar{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 16px;
}
.vt-trust{
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.72);
  border-radius: 16px;
  padding: 14px 14px;
  box-shadow: 0 10px 26px rgba(2,6,23,.06);
}
.vt-trust__t{ font-weight: 900; color:#0b1220; font-size: 14px; }
.vt-trust__d{ margin-top: 4px; color: var(--lp-muted); font-size: 13px; line-height: 1.45; }
@media (max-width: 980px){
  .vt-trustbar{ grid-template-columns: 1fr; }
}

/* ===== v3.0.0: Sticky CTA bar ===== */
.vt-stickyCta{
  position: fixed;
  left: 0; right: 0; bottom: 14px;
  z-index: 60;
  pointer-events: none;
}
.vt-stickyCta__inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 10px;
}
.vt-stickyCta__card{
  pointer-events: auto;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.92);
  box-shadow: 0 20px 70px rgba(2,6,23,.18);
  backdrop-filter: blur(10px);
}
.vt-stickyCta__title{ font-weight: 900; color:#0b1220; font-size: 13px; }
.vt-stickyCta__meta{ color: var(--lp-muted); font-size: 12px; }
.vt-stickyCta__actions{ display:flex; gap: 10px; flex-wrap: wrap; }

@media (max-width: 980px){
  .vt-stickyCta{ bottom: 10px; }
  .vt-stickyCta__card{ flex-direction: column; align-items: stretch; }
  .vt-stickyCta__actions a{ width: 100%; }
}

/* Avoid content hidden behind sticky bar */
.vt-lp{ padding-bottom: 96px; }


/* ==============================
   v3.1.0 - NO POPUP / NO STICKY CTA
   Desktop-first balanced layout
   ============================== */

/* Hard-disable any legacy sticky CTA bars */
.vt-stickyCta,
.vt-sticky-cta,
.vtv-sticky-cta{display:none !important;}
body.has-sticky-cta{padding-bottom:0 !important;}

/* Keep desktop + mobile consistent: soften breakpoint jumps */
@media (max-width: 980px){
  .vt-pricegrid--4{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 640px){
  .vt-pricegrid--4{grid-template-columns: 1fr;}
}


/* v3.1.0: remove extra bottom padding added for sticky bars */
.vt-lp{padding-bottom:0 !important;}

