/* A variation of the shared offer family, using the site's existing palette. */
.offer-tools {
  --tools-spectrum: linear-gradient(100deg, var(--cyan), var(--purple) 28%, var(--pink) 54%, var(--orange) 78%, var(--yellow));
  --tools-text-spectrum: linear-gradient(100deg, color-mix(in srgb, var(--cyan) 65%, white), color-mix(in srgb, var(--purple) 50%, white) 30%, color-mix(in srgb, var(--pink) 55%, white) 58%, var(--orange) 82%, var(--yellow));
}
.offer-tools .hero {
  background:
    radial-gradient(800px 460px at 8% 0%, rgb(var(--cyan-rgb) / 0.12), transparent 58%),
    radial-gradient(800px 460px at 94% 25%, rgb(var(--purple-rgb) / 0.12), transparent 60%),
    var(--card);
}
.offer-tools .brand { text-decoration: none; }
.offer-tools :is(a, button, summary):focus-visible { outline: 3px solid var(--cyan); outline-offset: 5px; }
.offer-tools a.premium { color: var(--cream); text-decoration: none; }
.offer-tools a.premium::after { background: var(--tools-spectrum); }
.offer-tools .block-underline { transform: scaleX(1); background: var(--tools-spectrum); }
.offer-tools .block-body h3 { margin-top: 1.5rem; font-size: 1.03rem; color: var(--cream); }
.offer-tools .block-body h3:first-child { margin-top: 0; }
.offer-tools .block-body strong { color: var(--cream); }
.offer-tools .block-title span,
.offer-tools .micro-copy,
.offer-tools .tools-price,
.offer-tools .tools-budget .block-title,
.offer-tools .hero-title .title-gradient {
  color: var(--cream);
  background: var(--tools-text-spectrum);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: none;
}
.offer-tools .hero-title { hyphens: none; }
.offer-tools .cta-primary::before { animation: none; opacity: 0.3; }
.tools-breadcrumb { display: flex; flex-wrap: wrap; gap: 0.4rem 0.7rem; margin-bottom: 1.25rem; color: var(--muted); font-size: 0.8rem; }
.tools-promise { margin-bottom: 1rem; color: var(--cream); font-size: 1.15rem; font-weight: 700; }
.tools-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 0 1.5rem; }
/* Native disclosures keep the five scenarios usable without JavaScript. */
.offer-tools #situation { margin-bottom: 0.65rem; }
.tools-scenarios { margin-block: 0.25rem 1rem; }
.tools-scenarios details { border: 1px solid var(--border); border-radius: var(--radius-lg); margin-bottom: 0.65rem; background: rgb(var(--bg-rgb) / 0.4); }
.tools-scenarios details[open] { border-color: transparent; background: linear-gradient(var(--bg), var(--bg)) padding-box, var(--tools-spectrum) border-box; }
.tools-scenarios summary { display: flex; gap: 0.75rem; align-items: center; padding: 1rem; cursor: pointer; list-style: none; }
.tools-scenarios summary::-webkit-details-marker { display: none; }
.tools-scenarios summary::after { content: "+"; margin-left: auto; flex-shrink: 0; color: var(--cream); font-size: 1.4rem; line-height: 1; }
.tools-scenarios details[open] > summary::after { content: "−"; }
.offer-tools .tools-scenarios summary h3 { margin: 0; font-size: 1rem; line-height: 1.4; }
.tools-scenario-number { font-size: 0.75rem; font-weight: 700; color: var(--cream); }
.tools-scenario-body { padding: 0 1rem 1.1rem; }
.tools-scenario-body .tools-result { border-top: 1px solid var(--border); padding-top: 0.75rem; color: var(--muted); font-size: 0.88rem; }
.offer-tools .tools-data-flow li { margin-block: 0.75rem; }
.offer-tools .tools-data-flow li::before { background: var(--tools-spectrum); box-shadow: none; }
.tools-steps { margin: 0; padding-left: 1.5rem; }
.offer-tools .tools-steps li { padding-left: 0.5rem; margin-bottom: 1.25rem; }
.offer-tools .tools-steps li::before { content: none; }
.tools-steps li::marker { color: var(--cream); font-weight: 800; }
/* The price has a full-width heading row rather than a narrow, empty label column. */
.tools-budget { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; background: radial-gradient(ellipse at 95% 0%, rgb(var(--pink-rgb) / 0.07), transparent 60%), var(--card); }
.tools-budget-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem 2rem; padding-bottom: 1.2rem; border-bottom: 1px solid var(--border); }
.offer-tools .tools-budget .block-title { font-size: clamp(1.4rem, 2.8vw, 1.85rem); line-height: 1.2; max-width: 22ch; }
.offer-tools .tools-budget .block-title span { display: block; background: none; }
.tools-price { margin: 0; font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 800; letter-spacing: -0.03em; }
.tools-budget-amount { flex-shrink: 0; }
.tools-budget-amount .small { color: var(--muted); margin-top: 0.3rem; font-size: 0.8rem; }
.tools-budget-note { color: var(--muted); font-size: 0.9rem; }
.tools-faq details { border-bottom: 1px solid var(--border); padding-block: 0.9rem; scroll-margin-top: var(--scroll-offset); }
.tools-faq summary { cursor: pointer; color: var(--cream); font-weight: 650; padding: 0.3rem 0.2rem; }
.tools-faq summary::marker { color: var(--cyan); }
.tools-faq details p { margin: 0.8rem 0.2rem 0.25rem; }
.offer-tools .reserve-mail { color: var(--cream); background: none; }
@media (max-width: 720px) {
  .offer-tools main { padding: 1.5rem 0.85rem calc(3.75rem + 96px); }
  .offer-tools .hero { padding: 1.5rem 1.2rem; }
  .tools-actions { gap: 0.4rem 1rem; }
  .tools-budget-heading { flex-direction: column; align-items: flex-start; gap: 0.9rem; }
  .offer-tools #contact a { overflow-wrap: anywhere; }
}
@media (max-width: 380px) {
  .offer-tools .badge { font-size: 0.65rem; letter-spacing: 0.06em; }
  .offer-tools .hero { padding-inline: 0.95rem; }
}
@media (prefers-reduced-motion: reduce) {
  .offer-tools *, .offer-tools *::before, .offer-tools *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  .offer-tools .hero-title :is(.title-soft, .title-gradient),
  .offer-tools .block-title span, .offer-tools .micro-copy,
  .offer-tools .tools-price, .offer-tools .tools-budget .block-title { background: none; color: CanvasText; -webkit-text-fill-color: CanvasText; filter: none; }
  .tools-scenarios details[open] { border-color: Highlight; }
}
@supports not (color: color-mix(in srgb, blue, white)) {
  .offer-tools { --tools-text-spectrum: var(--brand-gradient); }
}
