/* Opt-in stylesheet for marketing, account/orders, and /manage/ only.
   Never load from the creator/public/publish or editor shells. */
:root {
  --site-glass-light: linear-gradient(135deg, rgba(255,255,255,.95), rgba(240,243,255,.88) 55%, rgba(237,248,244,.86));
  --site-glass-dark: linear-gradient(135deg, rgba(122,147,191,.16), rgba(173,151,204,.07) 55%, rgba(255,255,255,.035));
  --site-glass-edge: rgba(255,255,255,.85);
  --site-glass-shadow: inset 0 1px 0 #fff, 0 12px 32px rgba(69,81,115,.06);
}
:is(.pricing-card, .pricing-why-choose-card,
    .packages-compared-closing-card, .occasion-product-card, .compare-invite-card,
    .marketing-card, .marketing-pricing-card, .marketing-steps li,
    .compare-block, .tfw-product, .tfw-month, .tfw-video,
    .tfw-form-card, .tfw-quote, .vb-feature-card, .vb-testimonial-card) {
  background: var(--site-glass-light);
  border: 1px solid var(--site-glass-edge);
  border-radius: 1.25rem;
  box-shadow: var(--site-glass-shadow);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
:is(.pricing-card-featured, .occasion-product-card-featured, .marketing-pricing-card--featured) {
  background: linear-gradient(135deg, #d4d6eee0, #e5def3b8 55%, #cedee8b3);
  border-color: #aaa5d3;
  box-shadow: inset 0 1px 0 #ffffffdd, 0 16px 44px #65568f26;
}
.marketing-section--soft {
  background: radial-gradient(ellipse at 15% 70%, #dceaff88, transparent 55%),
    radial-gradient(ellipse at 85% 70%, #e8def888, transparent 50%), #f8fafc;
}
.marketing-section--dark :is(.marketing-card, .marketing-pricing-card, .marketing-steps li),
.pricing-addon-card, .compare-table-wrapper, .tfw-value,
.qvc-glass-card,
body.help-page :is(.help-cat, .help-rail-card),
.account-page :is(.account-card, .order-card),
.manage-page .manage-card {
  background: var(--site-glass-dark);
  border: 1px solid rgba(215,228,255,.18);
  border-radius: 1.25rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 12px 32px rgba(0,0,0,.12);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.marketing-section--dark .marketing-pricing-card--featured { border-color: #b6a3da99; }
.marketing-section--dark .marketing-testimonial figcaption span { color: #b9c7dc; }
.marketing-section--dark .marketing-card__link { color: #fca5a5; }
.manage-page .manage-card-body { background: rgba(255,255,255,.035); }
/* Avoid changing controls, table rows, payment fields, status colors, or buttons. */
@media (prefers-reduced-transparency: reduce) {
  :is(.pricing-card, .pricing-why-choose-card,
      .packages-compared-closing-card, .occasion-product-card, .compare-invite-card,
      .marketing-card, .marketing-pricing-card, .marketing-steps li,
      .compare-block, .tfw-product, .tfw-month, .tfw-video,
    .tfw-form-card, .tfw-quote, .vb-feature-card, .vb-testimonial-card) {
    background: #f5f6fb; backdrop-filter: none; -webkit-backdrop-filter: none;
  }
  .marketing-section--dark :is(.marketing-card, .marketing-pricing-card, .marketing-steps li),
  .pricing-addon-card, .compare-table-wrapper, .tfw-value,
  .qvc-glass-card,
  body.help-page :is(.help-cat, .help-rail-card), .account-page :is(.account-card, .order-card), .manage-page .manage-card {
    background: #182032; backdrop-filter: none; -webkit-backdrop-filter: none;
  }
}

.pricing-badge-best, .occasion-badge {
  background: linear-gradient(135deg, #746394ed, #493c70ed 65%, #465a7aed);
  color: #fff;
  border: 1px solid #ffffff66;
  border-radius: 999px;
  box-shadow: inset 0 1px 0 #ffffff55, 0 4px 16px #57427625;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  text-transform: none;
  letter-spacing: 0;
}
.pricing-save-badge {
  background: #e0f0e9cc;
  color: #28644f;
  border: 1px solid #ffffffaa;
}

@media print {
  .account-page :is(.account-card, .order-card) {
    background: #fff;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-color: #ddd;
  }
}

/* Clipper landing only: the active editing workspace keeps its own surfaces. */
.clipper-body:not(.clipper-editor-active) :is(.clipper-dropzone, .resume-banner, .lp-step-card, .lp-feature-card, .lp-use-card) {
  background: var(--site-glass-dark);
  border-color: rgba(215,228,255,.22);
  border-radius: 1.25rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 12px 32px rgba(0,0,0,.12);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.clipper-body:not(.clipper-editor-active) .clipper-dropzone:is(:hover, .is-dragover) {
  border-color: var(--theme-primary-color);
  background: linear-gradient(135deg, rgba(147,172,213,.2), rgba(194,157,206,.14));
}
@media (prefers-reduced-transparency: reduce) {
  .clipper-body:not(.clipper-editor-active) :is(.clipper-dropzone, .resume-banner, .lp-step-card, .lp-feature-card, .lp-use-card) {
    background: #182032;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

/* Keep the image caption part of the same translucent workplace video card. */
.tfw-video-cap { background: transparent; }
.compare-block-text p { color: #4b5563; }

/* Give feature cards a distinct glass edge against the comparison page's white canvas. */
body.page-compare .compare-block {
  background: linear-gradient(135deg, rgba(242,244,246,.95), rgba(226,232,239,.9));
  border-color: rgba(148,163,184,.24);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 8px 24px rgba(51,65,85,.055);
}
@media (prefers-reduced-transparency: reduce) {
  body.page-compare .compare-block { background: #e9edf2; }
}

/* Hero glass accents retain the badge shape and secondary button hierarchy. */
body.page-compare :is(.compare-hero-vs-badge, .compare-btn-secondary) {
  color: #fff;
  background: linear-gradient(135deg, rgba(225,234,255,.18), rgba(184,170,213,.08) 60%, rgba(255,255,255,.05));
  border: 1px solid rgba(225,234,255,.3);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25), inset 0 -1px 0 rgba(255,255,255,.04), 0 6px 20px rgba(0,0,0,.14);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
body.page-compare .compare-btn-secondary:hover {
  background: linear-gradient(135deg, rgba(225,234,255,.25), rgba(184,170,213,.14));
  border-color: rgba(225,234,255,.5);
}
body.page-compare .compare-btn-secondary:focus-visible {
  outline: 2px solid #c7d8ff;
  outline-offset: 4px;
}
@media (prefers-reduced-transparency: reduce) {
  body.page-compare :is(.compare-hero-vs-badge, .compare-btn-secondary) {
    background: #242c3f;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* Workplace surfaces: neutral glass with enough separation from pale sections. */
.tfw :is(.tfw-product, .tfw-bottomcta .tfw-form-card, .tfw-howto-core) {
  background: linear-gradient(135deg, rgba(243,245,248,.96), rgba(219,228,238,.9));
  border: 1px solid rgba(126,145,170,.32);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 14px 32px rgba(39,57,82,.12);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.tfw :is(.tfw-tears .tfw-pill, #products .tfw-pill) {
  background: linear-gradient(135deg, rgba(255,255,255,.72), rgba(214,225,238,.66));
  color: #26364b;
  border: 1px solid rgba(126,145,170,.3);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 4px 14px rgba(39,57,82,.08);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.tfw .tfw-howto-bubble {
  background: linear-gradient(145deg, rgba(229,94,76,.88), rgba(177,37,24,.95));
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: inset 0 2px 1px rgba(255,255,255,.35), 0 12px 28px rgba(88,36,31,.18);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.tfw .tfw-value {
  background: linear-gradient(135deg, rgba(151,173,206,.22), rgba(94,113,143,.12));
  border-color: rgba(215,228,255,.32);
}
.tfw .tfw-video-examples { background: #fff; }
.tfw .tfw-section-title { color: #030712; }
.tfw .tfw-darksection .tfw-section-title { color: #fff; }
@media (prefers-reduced-transparency: reduce) {
  .tfw :is(.tfw-product, .tfw-bottomcta .tfw-form-card, .tfw-howto-core, .tfw-tears .tfw-pill, #products .tfw-pill) {
    background: #e6ecf3;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .tfw .tfw-value { background: #263247; }
  .tfw .tfw-howto-bubble { background: #bc3021; backdrop-filter: none; -webkit-backdrop-filter: none; }
}

/* A warm glass accent for the tears-of-joy label. */
.tfw .tfw-tears .tfw-pill {
  background: linear-gradient(135deg, rgba(255,242,239,.82), rgba(239,177,167,.52));
  color: #8b3027;
  border-color: rgba(183,87,73,.28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 4px 14px rgba(125,51,39,.09);
}
@media (prefers-reduced-transparency: reduce) {
  .tfw .tfw-tears .tfw-pill { background: #f6d5ce; }
}
