/* ============================================================================
   vth-offers.css — the public offer page (/o/{slug}/{code?}).

   Design: Claude Design "Unified Marketing Module" (OFFER PAGE — LANDING and the
   LEARNING OUTCOMES POP-OUT). Every measurement below is the design's; where the
   design used a literal colour that the design system has as a token, the token is
   used. The few literals the design uses that are NOT tokens (tints for icon tiles,
   the CTA gradient) are declared once, on `.vth-offer`, and nowhere else.

   Colour model: `--vth-blue` (+ -hover/-focus/-dark, --surface-blue-soft) is the
   accent — VTH blue on the main site, re-pointed to the site's own sector palette
   on a sector domain (inline on `.vth-offer`, see offers/page.blade.php). The
   offer's sector tag uses `--sector` (always the offer's sector colour).

   Loaded after vth-tokens / vth-reset / vth-reskin / vth-components and
   components/vth-ds-button.css.
   ============================================================================ */

.vth.vth-offer{
  /* design literals that are not design-system tokens */
  --offer-page-bg:var(--tc-bg-website-sections-website);
  --offer-tint:var(--tc-bg-website-statistics-card-website);
  --offer-accent-soft:rgba(25,42,193,.10);           /* design: accent + "1A" */
  --offer-aggregate-bg:var(--pc-blue-100);
  --offer-cta-from:#1B23A8; --offer-cta-to:#2433DE;
  --offer-blue-fixed:#192AC1;                          /* the stat that is VTH blue on every site */
  --offer-tile-blue:#E4EAFF; --offer-tile-green:#DFF3E6; --offer-tile-yellow:#FFF1CC;
  --offer-fg-green:#1F8A4C; --offer-fg-yellow:#B07500;
  --offer-pt1:#DAE4FF; --offer-pt2:#FFDDE7; --offer-pt3:#D6F5E0;
  --offer-pt4:#FFF1CC; --offer-pt5:#E7DDFF; --offer-pt6:#CFF1F0;
  --offer-badge-purple-bg:#F3E8FF; --offer-badge-purple-fg:#5B21B6;
  --offer-share-soft:#FFECEC;
  --offer-chip-remove:#D3E3FF;
  --offer-divider-soft:#D6DAEA;
  --offer-card-line:#F1F1F1;
  --offer-cta-pill-fg:#40320A;
  --offer-stat-yellow:#8A5A00; --offer-stat-green:#14683A;

  background:var(--offer-page-bg);
  color:var(--text-primary);
}

/* The page's own <button>s that draw no border: say so here rather than rely on the shared
   `.vth button` reset, which no longer strips the browser's default border/background from
   `vth-*` classes. Declared before the components, so any border/background a component
   sets below still wins. */
.vth .vth-offer-seg__btn,
.vth .vth-offer-link,
.vth .vth-offer-inline-link,
.vth .vth-offer-cta__btn,
.vth .vth-offer-cta__link,
.vth .vth-offer-carousel__arrow,
.vth .vth-offer-carousel__dot,
.vth .vth-offer-sharepop__close{ border:0; }
.vth .vth-offer-seg__btn,
.vth .vth-offer-link,
.vth .vth-offer-inline-link,
.vth .vth-offer-cta__link{ background:none; }

/* Aligned with the live header's container (reskin-common-head:
   width calc(100% - 48px), max 1680) so the page's edges line up with the header. */
.vth-offer__shell{
  width:calc(100% - 48px); max-width:1680px; margin:0 auto;
  padding:24px 0 24px;
  display:flex; flex-direction:column; gap:24px;
}

/* -------------------------------------------------------------- primitives */

.vth .vth-offer-accent{ color:var(--vth-blue); }

.vth .vth-offer-eyebrow{
  display:inline-flex; align-self:flex-start; align-items:center; gap:8px;
  background:var(--surface-blue-soft); color:var(--vth-blue);
  border-radius:var(--radius-pill); padding:6px 14px;
  font-size:12px; line-height:18px; font-weight:var(--weight-bold); letter-spacing:.04em; text-transform:uppercase;
}
.vth .vth-offer-eyebrow i{ font-size:16px; }
.vth .vth-offer-hero .vth-offer-eyebrow{ font-size:13px; line-height:20px; }
.vth .vth-offer-eyebrow--warn{ background:var(--tc-bg-yellow-light-yellow); color:var(--offer-fg-yellow); }

.vth .vth-offer-kicker{
  display:block; font-size:13px; line-height:20px; font-weight:var(--weight-bold);
  letter-spacing:.04em; text-transform:uppercase; color:var(--text-subtle);
}
.vth .vth-offer-kicker--accent{ font-size:12.5px; letter-spacing:.08em; color:var(--vth-blue); }

.vth .vth-offer-h2{ margin:0; font-size:36px; line-height:46px; font-weight:var(--weight-semibold); }
.vth .vth-offer-h2--md{ font-size:32px; line-height:42px; }
.vth .vth-offer-h2--sm{ font-size:30px; line-height:40px; max-width:520px; }

.vth .vth-offer-card{
  background:var(--surface-card); border-radius:20px; box-shadow:var(--shadow-xs);
  padding:28px; display:flex; flex-direction:column; gap:14px;
}
.vth .vth-offer-card__title{ display:block; font-size:18px; line-height:27px; font-weight:var(--weight-semibold); }

.vth .vth-offer-link{
  align-self:flex-start; display:inline-flex; align-items:center; gap:6px; padding:0;
  font-size:15px; line-height:23px; font-weight:var(--weight-semibold); color:var(--vth-blue);
}
.vth .vth-offer-link i{ font-size:17px; }
.vth .vth-offer-link:hover{ color:var(--vth-blue-hover); }
.vth .vth-offer-link:focus-visible,
.vth .vth-offer-inline-link:focus-visible{ outline:none; box-shadow:var(--shadow-focus-blue); border-radius:4px; }

.vth .vth-offer-inline-link{ padding:0; font:inherit; font-weight:var(--weight-semibold); color:var(--vth-blue); }
.vth .vth-offer-inline-link:hover{ color:var(--vth-blue-hover); text-decoration:underline; }

.vth .vth-offer-tile{
  width:48px; height:48px; border-radius:14px; flex-shrink:0;
  display:grid; place-items:center; font-size:22px;
  background:var(--offer-accent-soft); color:var(--vth-blue);
}
.vth .vth-offer-tile--sm{ width:40px; height:40px; border-radius:12px; font-size:18px; }
.vth .vth-offer-tile--blue{ background:var(--offer-tile-blue); color:var(--vth-blue); }
.vth .vth-offer-tile--green{ background:var(--offer-tile-green); color:var(--offer-fg-green); }
.vth .vth-offer-tile--yellow{ background:var(--offer-tile-yellow); color:var(--offer-fg-yellow); }
.vth .vth-offer-tile--pt{ width:38px; height:38px; border-radius:11px; font-size:18px; color:var(--text-primary); }
.vth .vth-offer-tile--pt1{ background:var(--offer-pt1); }
.vth .vth-offer-tile--pt2{ background:var(--offer-pt2); }
.vth .vth-offer-tile--pt3{ background:var(--offer-pt3); }
.vth .vth-offer-tile--pt4{ background:var(--offer-pt4); }
.vth .vth-offer-tile--pt5{ background:var(--offer-pt5); }
.vth .vth-offer-tile--pt6{ background:var(--offer-pt6); }

.vth .vth-offer-round{
  width:48px; height:48px; border-radius:var(--radius-pill); flex-shrink:0;
  display:grid; place-items:center; font-size:24px;
}
.vth .vth-offer-round--blue{ background:var(--offer-tile-blue); color:var(--vth-blue); }
.vth .vth-offer-round--green{ background:var(--offer-tile-green); color:var(--offer-fg-green); }
.vth .vth-offer-round--blue-soft{ background:var(--offer-pt1); color:var(--text-primary); }
.vth .vth-offer-round--green-soft{ background:var(--offer-pt3); color:var(--text-primary); }
.vth .vth-offer-round--yellow-soft{ background:var(--offer-pt4); color:var(--text-primary); }

.vth .vth-offer-roundbtn{
  width:48px; height:48px; border-radius:var(--radius-pill); flex-shrink:0;
  border:1px solid var(--border-light); background:var(--surface-card); color:var(--text-primary);
  display:grid; place-items:center; font-size:19px;
  transition:background .15s ease, border-color .15s ease, opacity .15s ease;
}
.vth .vth-offer-roundbtn:hover{ background:var(--surface-subtle); color:var(--text-primary); text-decoration:none; }
.vth .vth-offer-roundbtn:focus-visible{ outline:none; box-shadow:var(--shadow-focus-blue); }
.vth .vth-offer-roundbtn:disabled{ opacity:.4; cursor:default; }

.vth .vth-offer-rule{ display:flex; align-items:center; gap:12px; margin:24px 0 18px; }
.vth .vth-offer-rule::before,
.vth .vth-offer-rule::after{ content:""; flex:1; height:1px; background:var(--border-light); }
.vth .vth-offer-rule span{
  font-size:12px; line-height:18px; font-weight:var(--weight-bold); letter-spacing:.04em;
  text-transform:uppercase; color:var(--text-subtle); text-align:center;
}
.vth .vth-offer-rule--plain{ width:100%; margin:0; gap:16px; }
.vth .vth-offer-rule--plain span{ font-size:13.5px; font-weight:var(--weight-regular); letter-spacing:0; text-transform:none; }

/* ------------------------------------------------------------------- hero */

.vth .vth-offer-hero{
  background:var(--surface-card); border-radius:24px;
  padding:clamp(28px, 3.8vw, 56px) clamp(20px, 3.6vw, 56px);
}
.vth .vth-offer-hero__main{ display:flex; flex-wrap:wrap; gap:44px; align-items:center; }
.vth .vth-offer-hero__copy{ flex:1 1 42%; min-width:min(100%, 300px); }
.vth .vth-offer-hero__eyebrows{ position:relative; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }

.vth .vth-offer-hero__title{
  margin:24px 0 16px; font-size:44px; line-height:54px; font-weight:var(--weight-semibold); letter-spacing:-.02em;
}
.vth .vth-offer-hero__sub{ margin:0 0 28px; max-width:560px; font-size:17px; line-height:27px; color:var(--text-subtle); }
.vth .vth-offer-hero__offer{ display:flex; flex-direction:column; gap:8px; margin-bottom:28px; }
.vth .vth-offer-hero__name{
  font-size:27px; line-height:37px; font-weight:var(--weight-semibold); color:var(--vth-blue);
  text-wrap:pretty; overflow-wrap:anywhere;
}
.vth .vth-offer-hero__about{ display:flex; flex-direction:column; gap:9px; }
.vth .vth-offer-hero__about-title{ font-size:14.5px; line-height:22px; font-weight:var(--weight-semibold); }
.vth .vth-offer-hero__excerpt{ max-width:560px; font-size:15px; line-height:25px; color:var(--text-secondary); }

.vth .vth-offer-ticks{ display:flex; flex-direction:column; gap:9px; }
.vth .vth-offer-ticks li{ display:flex; gap:9px; align-items:flex-start; font-size:14.5px; line-height:22px; color:var(--text-secondary); }
.vth .vth-offer-ticks__mark{
  width:20px; height:20px; margin-top:1px; flex-shrink:0; border-radius:var(--radius-pill);
  background:var(--offer-accent-soft); color:var(--vth-blue); display:grid; place-items:center; font-size:12px;
}

/* share pop-over (design: hero "Share with co-worker") */
.vth .vth-offer-sharepop{ position:relative; }
.vth .vth-offer-sharepop__trigger{
  display:inline-flex; align-items:center; gap:8px; padding:6px 14px;
  background:var(--surface-card); border:1.5px dashed var(--vth-red); color:var(--vth-red);
  border-radius:var(--radius-pill);
  font-size:13px; line-height:20px; font-weight:var(--weight-semibold); letter-spacing:.03em; text-transform:uppercase;
}
.vth .vth-offer-sharepop__trigger i{ font-size:15px; }
.vth .vth-offer-sharepop__trigger:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(235,57,57,.2); }
.vth .vth-offer-sharepop__panel{
  position:absolute; top:50px; left:0; z-index:100; width:380px;
  background:var(--surface-card); border-radius:20px; box-shadow:0 16px 44px rgba(0,0,0,.18);
  padding:24px; display:flex; flex-direction:column; gap:20px;
}
.vth .vth-offer-sharepop__arrow{
  position:absolute; top:-7px; left:30px; width:14px; height:14px; background:var(--surface-card); transform:rotate(45deg);
}
.vth .vth-offer-sharepop__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.vth .vth-offer-sharepop__head b{ font-size:22px; line-height:30px; font-weight:var(--weight-semibold); }
.vth .vth-offer-sharepop__close{
  width:36px; height:36px; flex-shrink:0; border-radius:var(--radius-pill);
  background:var(--surface-muted); color:var(--text-primary); display:grid; place-items:center; font-size:16px;
}
.vth .vth-offer-sharepop__item{ display:flex; align-items:center; gap:16px; }
.vth .vth-offer-sharepop__item img{ width:76px; height:68px; border-radius:8px; object-fit:cover; flex-shrink:0; }
.vth .vth-offer-sharepop__item span{ font-size:16px; line-height:24px; text-wrap:pretty; }
.vth .vth-offer-sharepop__actions{ display:flex; flex-direction:column; gap:10px; }
.vth .vth-offer-sharepop__grid{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; }
.vth .vth-offer-sharepop__btn{
  display:inline-flex; align-items:center; gap:12px; min-width:0;
  border:1px solid var(--border-light); background:var(--surface-card); border-radius:10px;
  padding:13px 14px; font-size:15px; line-height:22px; font-weight:var(--weight-medium); color:var(--text-primary);
}
.vth .vth-offer-sharepop__btn:hover{ background:var(--surface-subtle); color:var(--text-primary); text-decoration:none; }
.vth .vth-offer-sharepop__btn i{ font-size:18px; flex-shrink:0; }
.vth .vth-offer-sharepop__btn--wide{ justify-content:center; width:100%; padding:14px; }
.vth .vth-offer-sharepop__note{ font-size:12px; line-height:18px; color:var(--text-subtle); }

/* carousel */
.vth .vth-offer-hero__media{ flex:1 1 52%; min-width:min(100%, 300px); }
/* isolation: the slides (z 1) and arrows / dots (z 3) are ordered inside the carousel only.
   Without it they compete with the live header's dropdowns (ul.collapsible-body, z 1) and,
   coming later in the page, paint over them. */
.vth .vth-offer-carousel{
  position:relative; height:480px; border-radius:24px; overflow:hidden; background:var(--offer-page-bg);
  isolation:isolate;
}
.vth .vth-offer-carousel__slide{ position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s; }
.vth .vth-offer-carousel__slide.is-active{ opacity:1; visibility:visible; z-index:1; }
.vth .vth-offer-carousel__slide img,
.vth .vth-offer-carousel__video{ width:100%; height:100%; object-fit:cover; display:block; max-width:none; }
.vth .vth-offer-carousel__video{ background:#000; object-fit:contain; }
.vth .vth-offer-carousel__shade{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top, rgba(0,0,0,.34) 0%, rgba(0,0,0,0) 34%);
}
.vth .vth-offer-carousel__placeholder{ display:grid; place-items:center; }
.vth .vth-offer-carousel__fallback{ display:none; position:absolute; inset:0; place-items:center; background:var(--offer-page-bg); }
.vth .vth-offer-carousel__fallback img{ width:96px !important; height:96px !important; object-fit:contain !important; }
.vth .vth-offer-carousel__slide.is-broken > img,
.vth .vth-offer-carousel__slide.is-broken .vth-offer-carousel__shade{ display:none; }
.vth .vth-offer-carousel__slide.is-broken .vth-offer-carousel__fallback{ display:grid; }
.vth .vth-offer-carousel__placeholder img{ width:96px; height:96px; object-fit:contain; }
.vth .vth-offer-carousel__arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:44px; height:44px; border-radius:var(--radius-pill);
  background:rgba(255,255,255,.92); color:var(--text-primary); box-shadow:0 4px 12px rgba(0,0,0,.18);
  display:grid; place-items:center; font-size:19px;
}
.vth .vth-offer-carousel__arrow:focus-visible{ outline:none; box-shadow:var(--shadow-focus-blue); }
.vth .vth-offer-carousel__arrow--prev{ left:16px; }
.vth .vth-offer-carousel__arrow--next{ right:16px; }
.vth .vth-offer-carousel__dots{
  position:absolute; left:0; right:0; bottom:20px; z-index:3;
  display:flex; gap:7px; align-items:center; justify-content:center; transition:bottom .2s ease;
}
.vth .vth-offer-carousel__dots.is-raised{ bottom:64px; }   /* clear of a video's controls */
.vth .vth-offer-carousel__dot{
  width:8px; height:8px; padding:0; border-radius:var(--radius-pill);
  background:rgba(255,255,255,.55); box-shadow:0 1px 3px rgba(0,0,0,.25);
  transition:width .2s ease, background .2s ease;
}
.vth .vth-offer-carousel__dot.is-active{ width:24px; background:#FFFFFF; }
.vth .vth-offer-carousel__dot:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(255,255,255,.6); }

/* press row */
.vth .vth-offer-press{
  margin-top:clamp(28px, 3vw, 44px); padding-top:clamp(24px, 2.6vw, 32px); border-top:1px solid var(--border-light);
  display:flex; align-items:center; justify-content:space-between; gap:24px 32px; flex-wrap:wrap;
}
.vth .vth-offer-press__copy{ flex:1 1 320px; min-width:0; display:flex; flex-direction:column; gap:4px; }
.vth .vth-offer-press__copy .vth-offer-kicker{ font-size:12px; line-height:18px; }
.vth .vth-offer-press__copy b{ font-size:18px; line-height:27px; font-weight:var(--weight-semibold); }
.vth .vth-offer-press__logos{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.vth .vth-offer-press__logo{ background:var(--offer-page-bg); border-radius:12px; padding:14px 22px; display:grid; place-items:center; }
.vth .vth-offer-press__logo img{ height:26px; width:auto; }
.vth .vth-offer-press__logo--word{ font-size:22px; line-height:26px; font-weight:var(--weight-bold); letter-spacing:-.01em; color:var(--text-secondary); }

/* ------------------------------------------------------------ tinted bands */

.vth .vth-offer-band{
  border-radius:24px; padding:clamp(32px, 4.2vw, 64px) clamp(20px, 3.6vw, 56px);
  display:flex; flex-direction:column; gap:20px;
}
.vth .vth-offer-band--tint{ background:var(--offer-tint); }
.vth .vth-offer-band__head{ display:flex; flex-direction:column; gap:16px; }

/* course */
.vth .vth-offer-course{ display:flex; flex-direction:column; gap:24px; }
.vth .vth-offer-badges{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.vth .vth-offer-badge{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; height:36px;
  padding:7px 16px; border-radius:20px; white-space:nowrap;
  font-size:14.5px; line-height:20px; font-weight:var(--weight-medium);
}
.vth .vth-offer-badge i{ font-size:16px; margin-left:-4px; }
.vth .vth-offer-badge--blue{ background:var(--tc-badges-blue-bg); color:var(--tc-badges-blue-text-icon); }
.vth .vth-offer-badge--yellow{ background:var(--tc-badges-yellow-bg); color:var(--tc-badges-yellow-text-icon); }
.vth .vth-offer-badge--purple{ background:var(--offer-badge-purple-bg); color:var(--offer-badge-purple-fg); }
.vth .vth-offer-badge--gray{ background:var(--tc-badges-grey-bg); color:var(--tc-badges-grey-text); }

.vth .vth-offer-course__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.vth .vth-offer-course__sep{ width:1px; height:22px; background:var(--border-light); flex-shrink:0; }

.vth .vth-offer-sector{
  display:inline-flex; align-items:center; gap:8px; height:34px; padding:0 16px 0 8px;
  border-radius:20px; white-space:nowrap; font-size:14px; line-height:20px; font-weight:var(--weight-semibold);
  color:var(--sector); background:color-mix(in srgb, var(--sector) 10%, transparent);
}
@supports not (background:color-mix(in srgb, red 10%, transparent)){
  .vth .vth-offer-sector{ background:var(--offer-page-bg); }
}
.vth .vth-offer-sector img{ width:20px; height:20px; flex-shrink:0; }

.vth .vth-offer-mode{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; padding:8px; border-radius:17px; flex-shrink:0;
  color:var(--text-primary); font-size:16px; cursor:help; outline:none;
}
.vth .vth-offer-mode--yellow{ background:var(--tc-badges-yellow-bg); }
.vth .vth-offer-mode--blue{ background:var(--tc-badges-blue-bg); }
.vth .vth-offer-mode--green{ background:var(--tc-badges-green-bg); }
.vth .vth-offer-mode:focus-visible{ box-shadow:var(--shadow-focus-blue); }
.vth .vth-offer-tooltip{
  position:absolute; bottom:calc(100% + 10px); left:50%; transform:translateX(-50%); z-index:60;
  width:236px; padding:12px 14px; border-radius:12px; background:var(--text-primary); color:#FFFFFF;
  box-shadow:0 8px 24px rgba(0,0,0,.24); display:flex; flex-direction:column; gap:4px; text-align:left;
  opacity:0; visibility:hidden; transition:opacity .15s ease, visibility .15s; pointer-events:none; cursor:default;
}
.vth .vth-offer-tooltip::after{
  content:""; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  border:7px solid transparent; border-top-color:var(--text-primary);
}
.vth .vth-offer-tooltip b{ font-size:13.5px; line-height:20px; font-weight:var(--weight-semibold); }
.vth .vth-offer-tooltip span{ font-size:13px; line-height:19px; color:rgba(255,255,255,.82); }
.vth .vth-offer-mode:hover .vth-offer-tooltip,
.vth .vth-offer-mode:focus .vth-offer-tooltip{ opacity:1; visibility:visible; }

.vth .vth-offer-course__cards{ display:flex; flex-wrap:wrap; gap:16px; }
.vth .vth-offer-course__outcomes{ flex:1 1 58%; min-width:min(100%, 300px); }
.vth .vth-offer-course__clamp{
  font-size:15px; line-height:25px; color:var(--text-secondary);
  display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;
}
.vth .vth-offer-brochure{ flex:1 1 32%; min-width:min(100%, 260px); gap:16px; }
.vth .vth-offer-brochure__sub{ flex:1; font-size:15px; line-height:23px; color:var(--text-subtle); }

/* bundle */
.vth .vth-offer-bundle{ display:flex; flex-direction:column; gap:20px; }
.vth .vth-offer-bundle__excerpt{ font-size:16px; line-height:27px; color:var(--text-subtle); }
.vth .vth-offer-bundle__card{ background:var(--surface-card); border:1px solid var(--border-light); border-radius:20px; overflow:hidden; }
/* The design's minmax(340px) leaves a lone fourth figure on a row of empty cells at
   desktop width; 240px keeps all four on one row and still stacks on phones. */
.vth .vth-offer-bundle__stats{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap:1px; background:var(--border-light);
}
.vth .vth-offer-bundle__stat{ background:var(--surface-card); padding:22px 24px; display:flex; flex-direction:column; gap:4px; }
.vth .vth-offer-bundle__stat span{ font-size:13.5px; line-height:20px; color:var(--text-subtle); }
.vth .vth-offer-bundle__value{ font-size:30px; line-height:38px; font-weight:var(--weight-semibold); letter-spacing:-.02em; }
.vth .vth-offer-bundle__value--accent{ color:var(--vth-blue); }
.vth .vth-offer-bundle__value--yellow{ color:var(--offer-stat-yellow); }
.vth .vth-offer-bundle__value--blue{ color:var(--offer-blue-fixed); }
.vth .vth-offer-bundle__value--green{ color:var(--offer-stat-green); }
.vth .vth-offer-bundle__groups{
  border-top:1px solid var(--border-light);
  display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap:1px; background:var(--border-light);
}
.vth .vth-offer-bundle__group{ background:var(--surface-card); padding:24px; display:flex; flex-direction:column; gap:14px; }
.vth .vth-offer-bundle__group ul{ display:flex; flex-direction:column; gap:14px; }
.vth .vth-offer-bundle__label{
  font-size:11.5px; line-height:17px; font-weight:var(--weight-bold); letter-spacing:.08em; text-transform:uppercase; color:var(--vth-blue);
}
.vth .vth-offer-bundle__group li{ display:flex; align-items:flex-start; gap:11px; }
.vth .vth-offer-bundle__group li i{ font-size:19px; color:var(--vth-blue); flex-shrink:0; margin-top:1px; }
.vth .vth-offer-bundle__group li span{ min-width:0; font-size:14.5px; line-height:22px; font-weight:var(--weight-medium); color:var(--text-primary); }
.vth .vth-offer-bundle__brochure{
  border-top:1px solid var(--border-light); background:var(--surface-subtle);
  padding:16px 24px; display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.vth .vth-offer-bundle__brochure > i{ font-size:20px; color:var(--vth-blue); flex-shrink:0; }
.vth .vth-offer-bundle__brochure > span{ flex:1 1 280px; min-width:0; font-size:14.5px; line-height:22px; color:var(--text-secondary); }

/* -------------------------------------------------------- full-bleed bands */

.vth .vth-offer-bleed{
  background:var(--surface-card);
  width:100vw; margin-left:calc(50% - 50vw);
  padding:clamp(32px, 4.2vw, 64px) 0;
}
/* Content lines up with the rounded sections' content: shell edge + their padding. */
.vth .vth-offer-bleed__inner{
  width:calc(100vw - 48px); max-width:1680px; margin:0 auto;
  padding:0 clamp(20px, 3.6vw, 56px);
}

/* claim */
.vth .vth-offer-claim__inner{ display:flex; flex-wrap:wrap; gap:44px; align-items:flex-start; }
.vth .vth-offer-claimcard{
  flex:1 1 460px; max-width:560px; min-width:min(100%, 320px);
  background:var(--surface-card); border:1px solid var(--border-light); border-radius:20px; padding:28px;
}
.vth .vth-offer-seg{ display:flex; gap:4px; padding:4px; margin-bottom:24px; background:var(--offer-page-bg); border-radius:var(--radius-pill); }
.vth .vth-offer-seg__btn{
  flex:1; padding:10px 8px; border-radius:var(--radius-pill);
  font-size:14px; line-height:21px; font-weight:var(--weight-medium); color:var(--text-subtle);
  transition:background .15s ease, color .15s ease;
}
.vth .vth-offer-seg__btn.is-active{ background:var(--surface-card); color:var(--vth-blue); font-weight:var(--weight-semibold); box-shadow:var(--shadow-xs); }
.vth .vth-offer-seg__btn:focus-visible{ outline:none; box-shadow:var(--shadow-focus-blue); }
.vth .vth-offer-claimcard__title{ margin:0 0 10px; font-size:23px; line-height:32px; font-weight:var(--weight-semibold); }
.vth .vth-offer-claimcard__lead{ margin:0 0 8px; font-size:18px; line-height:27px; font-weight:var(--weight-semibold); color:var(--vth-blue); }
.vth .vth-offer-claimcard__sub{ margin:0 0 20px; font-size:15px; line-height:23px; color:var(--text-subtle); }
.vth .vth-offer-label{ display:block; margin-bottom:8px; font-size:14px; line-height:21px; font-weight:var(--weight-medium); color:var(--text-primary); }
.vth .vth-offer-input.vth-offer-input{
  width:100%; height:48px; margin:0 0 16px; padding:0 14px;
  border:1px solid var(--border-default); border-radius:12px; background:var(--surface-card);
  font-size:16px; color:var(--text-primary); box-shadow:none;
}
.vth .vth-offer-input.vth-offer-input::placeholder{ color:var(--text-muted); opacity:1; }
.vth .vth-offer-input.vth-offer-input:focus{ border-color:var(--vth-blue); box-shadow:var(--shadow-focus-blue); }
.vth .vth-offer-input.vth-offer-input.is-error{ border-color:var(--color-error); margin-bottom:8px; }
.vth .vth-offer-claimcard__error{
  display:flex; gap:6px; align-items:flex-start; margin:0 0 16px;
  font-size:13.5px; line-height:20px; font-weight:var(--weight-medium); color:var(--color-error);
}
.vth .vth-offer-claimcard__error i{ font-size:15px; margin-top:2px; flex-shrink:0; }
.vth .vth-offer-claimcard__alt{ margin-top:16px; display:flex; flex-direction:column; gap:6px; }
.vth .vth-offer-claimcard__alt p{ font-size:14px; line-height:22px; color:var(--text-subtle); }
.vth .vth-offer-claimcard__alt .vth-offer-inline-link{ font-size:14px; }
.vth .vth-offer-claimcard__hint{ font-size:12px; line-height:18px; }
.vth .vth-offer-claimcard__note{
  margin-top:20px; background:var(--offer-page-bg); border-radius:12px; padding:16px;
  font-size:14px; line-height:22px; color:var(--text-secondary);
}
.vth .vth-offer-why{ display:flex; flex-direction:column; gap:16px; }
.vth .vth-offer-why li{ display:flex; gap:12px; }
.vth .vth-offer-why b{ display:block; font-size:16px; line-height:24px; font-weight:var(--weight-semibold); }
.vth .vth-offer-why li > span:last-child > span{ display:block; font-size:14px; line-height:22px; color:var(--text-subtle); }
.vth .vth-offer-claimcard__secure{
  margin-top:20px; padding-top:16px; border-top:1px solid var(--border-light);
  display:flex; align-items:center; gap:8px; font-size:14px; line-height:21px; color:var(--text-subtle);
}
.vth .vth-offer-claimcard__secure i{ font-size:17px; }

.vth .vth-offer-schedule{ background:var(--offer-page-bg); border-radius:12px; padding:16px; display:flex; flex-direction:column; gap:14px; }
.vth .vth-offer-schedule__head{ display:flex; gap:10px; align-items:flex-start; }
.vth .vth-offer-schedule__head i{ font-size:20px; color:var(--vth-blue); flex-shrink:0; margin-top:1px; }
.vth .vth-offer-schedule__head p{ font-size:14px; line-height:22px; color:var(--text-secondary); }
.vth .vth-offer-schedule__head b{ font-weight:var(--weight-semibold); color:var(--text-primary); }
.vth .vth-offer-countdown{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px; }
.vth .vth-offer-countdown span{ background:var(--surface-card); border-radius:12px; padding:12px 6px; display:flex; flex-direction:column; align-items:center; gap:2px; }
.vth .vth-offer-countdown b{ font-size:24px; line-height:30px; font-weight:var(--weight-semibold); color:var(--vth-blue); font-variant-numeric:tabular-nums; }
.vth .vth-offer-countdown i{ font-style:normal; font-size:12px; line-height:18px; font-weight:var(--weight-medium); letter-spacing:.04em; text-transform:uppercase; color:var(--text-subtle); }

.vth .vth-offer-claim__side{ flex:1 1 520px; min-width:min(100%, 320px); display:flex; flex-direction:column; gap:28px; }
.vth .vth-offer-claim__head{ display:flex; flex-direction:column; gap:12px; }
.vth .vth-offer-claim__head p{ max-width:520px; font-size:16px; line-height:25px; color:var(--text-subtle); }
.vth .vth-offer-points{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 232px), 1fr)); gap:12px; }
.vth .vth-offer-points li{
  background:var(--surface-card); border:1px solid var(--offer-card-line); border-radius:14px;
  padding:16px; display:flex; gap:12px; align-items:flex-start;
}
.vth .vth-offer-points li > span:last-child{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.vth .vth-offer-points b{ font-size:15px; line-height:22px; font-weight:var(--weight-semibold); }
.vth .vth-offer-points li > span:last-child > span{ font-size:13.5px; line-height:20px; color:var(--text-subtle); }
.vth .vth-offer-ratingstrip{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:var(--offer-tint); border-radius:14px; padding:16px 18px; font-size:14px; line-height:21px; color:var(--text-subtle);
}
.vth .vth-offer-ratingstrip__score{ display:inline-flex; align-items:center; gap:8px; font-weight:var(--weight-semibold); color:var(--text-primary); }
.vth .vth-offer-ratingstrip__score i{ font-size:17px; color:var(--vth-yellow); }
.vth .vth-offer-ratingstrip__sep{ width:1px; height:18px; background:var(--offer-divider-soft); }

/* ------------------------------------------------------------- included */

.vth .vth-offer-included{
  padding:clamp(32px, 4.2vw, 64px) clamp(20px, 3.6vw, 56px);
  display:flex; flex-direction:column; gap:44px;
}
.vth .vth-offer-included__head{ display:flex; flex-direction:column; gap:16px; align-items:center; text-align:center; }
.vth .vth-offer-included__head .vth-offer-eyebrow{ align-self:center; }
.vth .vth-offer-included__head .vth-offer-h2{ max-width:900px; }
.vth .vth-offer-included__head p{ max-width:860px; font-size:17px; line-height:27px; color:var(--text-subtle); }
.vth .vth-offer-included__grid{
  max-width:1040px; width:100%; margin:0 auto;
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px;
}
.vth .vth-offer-feature{ align-items:center; text-align:center; gap:16px; }
.vth .vth-offer-feature b{ font-size:18px; line-height:27px; font-weight:var(--weight-semibold); }
.vth .vth-offer-feature p{ font-size:15px; line-height:23px; color:var(--text-subtle); }

/* ---------------------------------------------------------------- share */

.vth .vth-offer-share{ padding:clamp(40px, 5vw, 76px) 0; }
.vth .vth-offer-share__inner{ max-width:660px; display:flex; flex-direction:column; align-items:center; gap:32px; }
.vth .vth-offer-share__head{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px; }
.vth .vth-offer-share__head p{ max-width:460px; font-size:17px; line-height:27px; color:var(--text-subtle); }
.vth .vth-offer-share__icon{
  width:56px; height:56px; border-radius:var(--radius-pill); background:var(--offer-share-soft); color:var(--vth-red);
  display:grid; place-items:center; font-size:26px;
}
.vth .vth-offer-share__preview{
  width:100%; display:flex; align-items:center; gap:14px; background:var(--offer-tint); border-radius:16px; padding:16px 18px;
}
.vth .vth-offer-share__preview img{ width:48px; height:48px; border-radius:10px; object-fit:cover; flex-shrink:0; }
.vth .vth-offer-share__preview > span{ display:flex; flex-direction:column; gap:2px; flex:1 1 auto; min-width:0; }
.vth .vth-offer-share__preview > span > i{
  font-style:normal; font-size:12px; line-height:18px; font-weight:var(--weight-semibold); letter-spacing:.04em; text-transform:uppercase; color:var(--text-subtle);
}
.vth .vth-offer-share__preview > span > span{ font-size:15.5px; line-height:24px; color:var(--text-primary); }
.vth .vth-offer-share__form{ width:100%; display:flex; flex-direction:column; gap:14px; }
.vth .vth-offer-chips{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-height:52px; padding:8px 10px;
  border:1px solid var(--border-default); border-radius:12px; background:var(--surface-card); cursor:text;
}
.vth .vth-offer-chips:focus-within{ border-color:var(--vth-blue); box-shadow:var(--shadow-focus-blue); }
.vth .vth-offer-chips.is-error{ border-color:var(--vth-red); }
.vth .vth-offer-chip{
  display:inline-flex; align-items:center; gap:6px; max-width:100%; min-width:0;
  background:var(--surface-blue-soft); color:var(--vth-blue-focus); border-radius:var(--radius-pill);
  padding:6px 8px 6px 12px; font-size:14px; line-height:20px; font-weight:var(--weight-medium);
}
.vth .vth-offer-chip > i{ font-style:normal; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.vth .vth-offer-chip button{
  width:20px; height:20px; flex-shrink:0; border-radius:var(--radius-pill);
  background:var(--offer-chip-remove); color:var(--vth-blue-focus); display:grid; place-items:center; font-size:11px;
}
.vth .vth-offer-chips__input.vth-offer-chips__input{
  flex:1 1 200px; min-width:140px; height:36px; border:none; outline:none; background:transparent;
  font-size:16px; color:var(--text-primary); box-shadow:none;
}
.vth .vth-offer-chips__input::placeholder{ color:var(--text-muted); opacity:1; }
.vth .vth-offer-share__error{ display:inline-flex; align-items:center; gap:6px; font-size:13.5px; line-height:20px; font-weight:var(--weight-medium); color:var(--vth-red); }
.vth .vth-offer-share__error i{ font-size:15px; }
.vth .vth-offer-share__hint{ font-size:13.5px; line-height:21px; color:var(--text-subtle); }
.vth .vth-offer-share__sent{ display:inline-flex; align-items:flex-start; gap:8px; font-size:14px; line-height:21px; font-weight:var(--weight-medium); color:var(--offer-fg-green); }
.vth .vth-offer-share__sent i{ font-size:17px; margin-top:2px; flex-shrink:0; }
.vth .vth-offer-share__captcha-note{ margin-top:-4px; font-size:11.5px; line-height:17px; color:var(--text-muted); }
.vth .vth-offer-share__captcha-note a{ color:inherit; text-decoration:underline; }
.vth .vth-offer-share__form{ position:relative; }
/* Invisible reCAPTCHA host: laid out (Google won't render into display:none), never seen. */
.vth .vth-offer-share__captcha{ position:absolute; left:0; bottom:0; width:256px; height:60px; overflow:hidden; opacity:0; pointer-events:none; }
.vth .vth-offer-share__links{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }

/* -------------------------------------------------------------- reviews */

.vth .vth-offer-reviews{ gap:44px; }
.vth .vth-offer-reviews__top{ display:flex; align-items:flex-start; justify-content:space-between; gap:32px; flex-wrap:wrap; }
.vth .vth-offer-reviews__top .vth-offer-band__head{ max-width:860px; }
.vth .vth-offer-reviews__lead{ font-size:17px; line-height:27px; color:var(--text-subtle); }
.vth .vth-offer-reviews__nav{ display:flex; gap:12px; }
.vth .vth-offer-reviews__nav .vth-offer-roundbtn{ font-size:20px; }
.vth .vth-offer-reviews__body{ display:flex; flex-direction:column; gap:16px; }
.vth .vth-offer-reviews__viewport{ overflow:hidden; margin:-4px; padding:4px; }
.vth .vth-offer-reviews__track{
  --per:3; display:flex; gap:16px; transition:transform .35s ease;
}
.vth .vth-offer-review{ flex:0 0 calc((100% - (var(--per) - 1) * 16px) / var(--per)); gap:16px; min-width:0; }
.vth .vth-offer-stars{ display:flex; gap:3px; color:var(--vth-yellow); font-size:18px; }
.vth .vth-offer-stars .is-off{ opacity:.28; }
.vth .vth-offer-review__text{ flex:1; font-size:15.5px; line-height:25px; color:var(--text-secondary); overflow-wrap:anywhere; }
.vth .vth-offer-review__who{ display:flex; align-items:center; gap:12px; }
.vth .vth-offer-review__who img,
.vth .vth-offer-review__initials{ width:48px; height:48px; border-radius:var(--radius-pill); object-fit:cover; flex-shrink:0; }
.vth .vth-offer-review__initials{ display:grid; place-items:center; background:var(--offer-pt1); color:var(--text-primary); font-size:16px; font-weight:var(--weight-semibold); }
.vth .vth-offer-review__who b{ display:block; font-size:16px; line-height:24px; font-weight:var(--weight-semibold); }
.vth .vth-offer-review__who i{ font-style:normal; font-size:14px; line-height:21px; color:var(--text-subtle); }
.vth .vth-offer-reviews__aggregate{
  background:var(--offer-aggregate-bg); border-radius:20px; padding:28px 32px;
  display:flex; align-items:center; gap:24px; flex-wrap:wrap;
}
.vth .vth-offer-reviews__aggregate > b{ font-size:44px; line-height:52px; font-weight:var(--weight-semibold); color:var(--vth-blue); }
.vth .vth-offer-reviews__aggregate > span > b{ display:block; font-size:20px; line-height:30px; font-weight:var(--weight-semibold); }
.vth .vth-offer-reviews__aggregate > span > i{ font-style:normal; font-size:16px; line-height:24px; color:var(--text-secondary); }

/* ------------------------------------------------------------ bottom CTA */

.vth .vth-offer-cta{
  background:linear-gradient(120deg, var(--offer-cta-from) 0%, var(--offer-cta-to) 100%);
  border-radius:24px; padding:clamp(28px, 3.2vw, 48px) clamp(20px, 3.6vw, 56px);
  display:flex; align-items:center; justify-content:space-between; gap:28px 44px; flex-wrap:wrap;
}
.vth .vth-offer-cta__copy{ flex:1 1 520px; min-width:min(100%, 300px); display:flex; flex-direction:column; align-items:flex-start; gap:16px; }
.vth .vth-offer-cta__pill{
  display:inline-flex; align-items:center; gap:7px; padding:7px 15px; border-radius:var(--radius-pill);
  background:var(--vth-yellow); color:var(--offer-cta-pill-fg);
  font-size:12.5px; line-height:18px; font-weight:var(--weight-bold); letter-spacing:.06em; text-transform:uppercase;
}
.vth .vth-offer-cta__pill i{ font-size:15px; }
.vth .vth-offer-cta__title{
  margin:0; color:#FFFFFF; font-weight:var(--weight-bold);
  font-size:clamp(27px, 2.5vw, 34px); line-height:1.2; letter-spacing:-.01em;
}
.vth .vth-offer-cta__title span{ color:var(--vth-yellow); }
.vth .vth-offer-cta__copy p{ max-width:540px; font-size:15.5px; line-height:25px; color:rgba(255,255,255,.88); }
.vth .vth-offer-cta__actions{ display:flex; flex-direction:column; align-items:center; gap:12px; flex-shrink:0; }
.vth .vth-offer-cta__btn{
  display:inline-flex; align-items:center; gap:10px; padding:15px 28px; border-radius:var(--radius-pill);
  background:#FFFFFF; color:var(--vth-blue); font-size:16px; line-height:24px; font-weight:var(--weight-bold);
  transition:box-shadow .15s ease, transform .15s ease;
}
.vth .vth-offer-cta__btn i{ font-size:18px; }
.vth .vth-offer-cta__btn:hover{ box-shadow:0 6px 18px rgba(0,0,0,.18); }
.vth .vth-offer-cta__btn:focus-visible{ outline:none; box-shadow:0 0 0 4px rgba(255,255,255,.45); }
.vth .vth-offer-cta__link{
  padding:0; font-size:14px; line-height:21px; font-weight:var(--weight-semibold); color:#FFFFFF;
  text-decoration:underline; text-underline-offset:3px;
}
.vth .vth-offer-cta__link:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(255,255,255,.45); border-radius:4px; }

/* ------------------------------------------------- unavailable / states */

.vth .vth-offer-state{ background:var(--surface-card); border-radius:24px; padding:clamp(56px, 7vw, 96px) clamp(20px, 3.6vw, 56px); }
.vth .vth-offer-state__inner{ max-width:720px; margin:0 auto; text-align:center; display:flex; flex-direction:column; align-items:center; gap:20px; }
.vth .vth-offer-state__icon{ width:88px; height:88px; border-radius:var(--radius-pill); display:grid; place-items:center; font-size:44px; }
.vth .vth-offer-state__icon--warn{ background:var(--offer-tile-yellow); color:var(--offer-fg-yellow); }
.vth .vth-offer-state__icon--ok{ background:var(--surface-blue-soft); color:var(--vth-blue); }   /* design: SUCCESS */
.vth .vth-offer-state:focus{ outline:none; }
/* The page body, hidden (as one) once a claim result replaces it. */
.vth-offer__landing{ display:contents; }
.vth .vth-offer-state__title{ margin:0; font-size:36px; line-height:46px; font-weight:var(--weight-semibold); }
.vth .vth-offer-state__sub{ font-size:17px; line-height:27px; color:var(--text-subtle); }
.vth .vth-offer-state__note{ font-size:14px; line-height:21px; color:var(--text-subtle); }

/* ------------------------------------------------ learning outcomes modal */

.vth .vth-offer-outcomes{
  /* Design's pop-out on the shared .vth-modal__* overlay: wider, and the head and foot stay
     put while the body scrolls (the shared panel scrolls as a whole). */
  max-width:720px; display:flex; flex-direction:column; overflow:hidden; outline:none;
}
.vth .vth-offer-outcomes .vth-modal__head{ align-items:flex-start; gap:16px; padding:24px 28px 20px; }
.vth .vth-offer-outcomes .vth-modal__body{ flex:1 1 auto; min-height:0; overflow:auto; display:flex; flex-direction:column; gap:20px; padding:24px 28px 28px; }
.vth .vth-offer-outcomes .vth-modal__foot{ padding:18px 28px; }
/* Design: a round 40px close button (the shared icon button is a 36px rounded square). */
.vth .vth-offer-outcomes .vth-modal__head .vth-btn--icon{ width:40px; height:40px; border-radius:var(--radius-pill); border-color:var(--border-light); font-size:17px; }
.vth .vth-offer-outcomes__title{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.vth .vth-offer-outcomes__title span{ font-size:12px; line-height:18px; font-weight:var(--weight-bold); letter-spacing:.04em; text-transform:uppercase; color:var(--text-subtle); }
.vth .vth-offer-outcomes__title h3{ margin:0; font-size:22px; line-height:30px; font-weight:var(--weight-semibold); text-wrap:pretty; }
.vth .vth-offer-outcomes__block{ display:flex; flex-direction:column; gap:10px; }
.vth .vth-offer-outcomes__block b{ font-size:16px; line-height:24px; font-weight:var(--weight-semibold); }
.vth .vth-offer-outcomes__block p{ font-size:15.5px; line-height:26px; color:var(--text-secondary); }

/* The course description is CMS HTML — give it the pop-out's type, not Materialize's. */
.vth .vth-offer-prose{ font-size:15.5px; line-height:26px; color:var(--text-secondary); }
.vth .vth-offer-prose > * + *{ margin-top:12px; }
.vth .vth-offer-prose h1, .vth .vth-offer-prose h2, .vth .vth-offer-prose h3,
.vth .vth-offer-prose h4, .vth .vth-offer-prose h5, .vth .vth-offer-prose h6{ font-size:16px; line-height:24px; font-weight:var(--weight-semibold); color:var(--text-primary); }
.vth .vth-offer-prose ul, .vth .vth-offer-prose ol{ padding-left:22px; display:flex; flex-direction:column; gap:6px; }
.vth .vth-offer-prose ul{ list-style:disc; }
.vth .vth-offer-prose ol{ list-style:decimal; }
.vth .vth-offer-prose li{ list-style:inherit; padding-left:2px; }
.vth .vth-offer-prose a{ text-decoration:underline; }
.vth .vth-offer-prose img{ max-width:100%; height:auto; }

body.vth-offer-lock{ overflow:hidden; }

/* ------------------------------------------------ current offers (/offers) */
/* Design: SECTOR PAGE VIEW. */

.vth .vth-offer-list-hero{ display:flex; flex-direction:column; gap:20px; padding:clamp(32px, 4.2vw, 64px) clamp(20px, 3.6vw, 56px); }
.vth .vth-offer-h1{ margin:0; max-width:900px; font-size:36px; line-height:46px; font-weight:var(--weight-semibold); }
.vth .vth-offer-list-hero p{ max-width:860px; font-size:17px; line-height:27px; color:var(--text-subtle); }
.vth .vth-offer-list{ gap:44px; }
.vth .vth-offer-list__lead{ font-size:17px; line-height:27px; color:var(--text-subtle); }
/* auto-fill, not the design's auto-fit: with one or two offers the cards keep a card's
   width instead of stretching across the whole band. */
.vth .vth-offer-list__grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap:16px; }
.vth .vth-offer-listcard{
  background:var(--surface-card); border-radius:20px; box-shadow:var(--shadow-xs);
  overflow:hidden; display:flex; flex-direction:column; min-width:0;
}
.vth .vth-offer-listcard__media{ position:relative; display:block; height:200px; background:var(--offer-page-bg); isolation:isolate; }   /* see .vth-offer-carousel */
.vth .vth-offer-listcard__media > img{ position:relative; z-index:1; width:100%; height:100%; object-fit:cover; max-width:none; }
.vth .vth-offer-listcard__media.is-broken > img{ display:none; }
.vth .vth-offer-listcard__fallback{ position:absolute; inset:0; display:grid; place-items:center; }
.vth .vth-offer-listcard__fallback img{ width:72px; height:72px; object-fit:contain; }
.vth .vth-offer-listcard__body{ flex:1; padding:28px; display:flex; flex-direction:column; gap:16px; }
.vth .vth-offer-listcard__badge{
  display:inline-flex; align-self:flex-start; align-items:center; gap:8px;
  padding:6px 14px 6px 8px; border-radius:var(--radius-pill);
  background:var(--surface-card); border:1px solid var(--border-light);
  font-size:14px; line-height:21px; font-weight:var(--weight-medium); color:var(--text-primary);
}
.vth .vth-offer-listcard__badge img{ width:24px; height:24px; flex-shrink:0; }
.vth .vth-offer-listcard__title{ margin:0; font-size:18px; line-height:27px; font-weight:var(--weight-semibold); }
.vth .vth-offer-listcard__title a{ color:var(--text-primary); }
.vth .vth-offer-listcard__title a:hover{ color:var(--vth-blue); text-decoration:none; }
.vth .vth-offer-listcard__desc{ flex:1; font-size:15px; line-height:23px; color:var(--text-subtle); }
.vth .vth-offer-listcard__meta{ display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; font-size:14px; line-height:21px; color:var(--text-subtle); }
.vth .vth-offer-listcard__meta span{ display:inline-flex; align-items:center; gap:6px; }
.vth .vth-offer-listcard__meta i{ font-size:16px; }
.vth .vth-offer-list__empty{ align-items:center; text-align:center; gap:14px; max-width:560px; width:100%; margin:0 auto; }
.vth .vth-offer-list__empty p{ font-size:15px; line-height:23px; color:var(--text-subtle); }
/* /offers/upcoming: the sector badge and the amber "Starts …" badge share one row. */
.vth .vth-offer-listcard__tags{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.vth .vth-offer-listcard__tags .vth-offer-eyebrow{ align-self:auto; }
/* /offers: "N new free offers start this week · See upcoming offers" under the hero text. */
.vth .vth-offer-list__notice{
  display:inline-flex; align-items:center; flex-wrap:wrap; gap:6px 10px; align-self:flex-start;
  padding:10px 16px; border-radius:var(--radius-pill); background:var(--tc-bg-yellow-light-yellow);
  font-size:15px; line-height:22px; color:var(--text-primary);
}
.vth .vth-offer-list__notice > i{ font-size:17px; color:var(--offer-fg-yellow); }
.vth .vth-offer-list__notice a{ display:inline-flex; align-items:center; gap:4px; font-weight:var(--weight-semibold); color:var(--vth-blue); }
.vth .vth-offer-list__back{ display:inline-flex; align-items:center; gap:6px; align-self:flex-start; font-size:15px; font-weight:var(--weight-medium); color:var(--vth-blue); }
.vth .vth-offer-list__empty-actions{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
/* "Show more offers" (OffersListController): button, count, inline error, placeholder cards. */
.vth .vth-offer-list__more{ display:flex; flex-direction:column; align-items:center; gap:16px; margin-top:8px; }
.vth .vth-offer-list__more > .vth-offer-list__grid{ align-self:stretch; }
.vth .vth-offer-list__more .vth-dsbtn.is-disabled{ pointer-events:none; opacity:.7; }
.vth .vth-offer-list__count{ text-align:center; font-size:14px; line-height:21px; color:var(--text-subtle); }
.vth .vth-offer-list__more-error{ margin:0; }
.vth .vth-offer-listcard--skeleton{ padding-bottom:28px; gap:14px; }
.vth .vth-offer-skel{ display:block; border-radius:var(--radius-md); background:var(--offer-page-bg); position:relative; overflow:hidden; }
.vth .vth-offer-skel::after{
  content:""; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  animation:vth-offer-skel 1.2s ease-in-out infinite;
}
.vth .vth-offer-skel--media{ height:200px; border-radius:0; }
.vth .vth-offer-skel--line{ height:16px; margin:0 28px; }
.vth .vth-offer-skel--line.is-short{ width:55%; }
.vth .vth-offer-skel--btn{ height:48px; margin:8px 28px 0; border-radius:var(--radius-lg); }
@keyframes vth-offer-skel{ to{ transform:translateX(100%); } }
@media (prefers-reduced-motion: reduce){ .vth .vth-offer-skel::after{ animation:none; } }

/* ------------------------------------------------------------ responsive */

@media (max-width:900px){
  .vth .vth-offer-included__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

/* Bundle benefit columns stacked into one list: the empty spacer labels and the rules
   between columns would read as gaps, so the three columns become one run. */
@media (max-width:700px){
  .vth .vth-offer-bundle__groups{ gap:0; }
  .vth .vth-offer-bundle__group + .vth-offer-bundle__group{ padding-top:0; }
  .vth .vth-offer-bundle__group + .vth-offer-bundle__group .vth-offer-bundle__label{ display:none; }
  .vth .vth-offer-bundle__group:not(:last-child){ padding-bottom:14px; }
}

@media (max-width:760px){
  .vth .vth-offer-carousel{ height:clamp(260px, 72vw, 420px); }
  .vth .vth-offer-hero__title{ font-size:34px; line-height:43px; }
  .vth .vth-offer-hero__name{ font-size:23px; line-height:32px; }
  .vth .vth-offer-h2, .vth .vth-offer-h1{ font-size:28px; line-height:37px; }
  .vth .vth-offer-h2--md, .vth .vth-offer-h2--sm{ font-size:26px; line-height:35px; }
  .vth .vth-offer-state__title{ font-size:28px; line-height:37px; }
  .vth .vth-offer-included__grid{ grid-template-columns:minmax(0, 1fr); }
  .vth .vth-offer-reviews__aggregate > b{ font-size:36px; line-height:44px; }

  /* The pop-over spans the eyebrow row instead of hanging off the trigger, which
     would push it past the right edge of a phone. */
  .vth .vth-offer-sharepop{ position:static; }
  .vth .vth-offer-sharepop__panel{ top:calc(100% + 12px); left:0; right:0; width:auto; }
  .vth .vth-offer-sharepop__arrow{ display:none; }
}

@media (max-width:560px){
  .vth .vth-offer-hero__title{ font-size:30px; line-height:38px; }
  /* Full-bleed bands: content to the page gutter, like every other section's card. */
  .vth .vth-offer-bleed__inner{ padding:0; }
  .vth .vth-offer-seg__btn{ white-space:nowrap; }
  .vth .vth-offer-claimcard{ padding:20px; }
  .vth .vth-offer-sharepop__panel{ padding:20px; }
  .vth .vth-offer-sharepop__grid{ grid-template-columns:minmax(0, 1fr); }
  .vth .vth-offer-cta__actions{ width:100%; }
  .vth .vth-offer-cta__btn{ width:100%; justify-content:center; }
  .vth .vth-modal__backdrop:has(.vth-offer-outcomes){ padding:0; }
  .vth .vth-offer-outcomes{ height:100%; max-height:none; border-radius:0; }
}