/*
  tool.css — iAssure tool page layout
  Loaded by tool.njk only. Supplements main.css.
*/

:root {
  --t-navy:      #1B2A4A;
  --t-navy-dk:   #0f1e32;
  --t-gold:      #C8A050;
  --t-gold-dim:  #9a7830;
  --t-cream:     #FDFCFB;
  --t-cream-2:   #F5EFE6;
  --t-amber:     #D97706;
  --t-amber-bg:  #FFFBEB;
  --t-red:       #B94A48;
  --t-red-bg:    rgba(185,74,72,0.07);
  --t-green:     #4B8C6B;
  --t-green-bg:  rgba(75,140,107,0.07);
  --t-text:      #334155;
  --t-text-2:    #64748b;
  --t-text-3:    #94a3b8;
  --t-border:    #e2e8f0;
  --t-border-2:  #f1f5f9;
  --t-surface:   #ffffff;
  --t-fh:        'Lora', Georgia, serif;
  --t-fb:        'Inter', system-ui, -apple-system, 'Helvetica Neue', sans-serif;
  --t-r:         12px;
  --t-r-sm:      8px;
  --t-max:       720px;
}

body.tool-page { background: var(--t-cream); margin: 0; overflow-x: hidden; }

/* ── Skip link ────────────────────────────────────────────── */
.tool-skip { position:absolute;top:-40px;left:0;background:var(--t-navy);color:#fff;padding:8px 14px;font-size:13px;text-decoration:none;z-index:1000;border-radius:0 0 6px 0;transition:top .15s; }
.tool-skip:focus { top:0; }

/* ── Nav button ───────────────────────────────────────────── */
.tool-nav-btn { position:fixed;top:10px;right:12px;z-index:500;width:40px;height:40px;border-radius:50%;background:var(--t-surface);border:1px solid var(--t-border);box-shadow:0 2px 8px rgba(0,0,0,.1);display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent; }
.tool-nav-btn svg { width:17px;height:13px;display:block; }

/* ── Nav drawer ───────────────────────────────────────────── */
.tool-nav-overlay { position:fixed;inset:0;z-index:400;background:rgba(15,30,50,.45);opacity:0;pointer-events:none;transition:opacity .22s;backdrop-filter:blur(2px); }
.tool-nav-overlay.open { opacity:1;pointer-events:all; }
.tool-nav-drawer { position:absolute;top:0;right:0;bottom:0;width:78vw;max-width:300px;background:var(--t-surface);border-left:1px solid var(--t-border);transform:translateX(100%);transition:transform .26s cubic-bezier(.16,1,.3,1);padding:60px 22px 40px;overflow-y:auto; }
.tool-nav-overlay.open .tool-nav-drawer { transform:translateX(0); }
.tool-nav-close { position:absolute;top:14px;right:14px;background:none;border:none;font-size:20px;color:var(--t-text-2);cursor:pointer;padding:4px;line-height:1; }
.tool-nav-section { font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--t-gold);margin:18px 0 5px;padding-bottom:4px;border-bottom:1px solid var(--t-border-2); }
.tool-nav-section:first-child { margin-top:0; }
.tool-nav-link { display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--t-border-2);font-size:14px;color:var(--t-text);text-decoration:none; }
.tool-nav-link .arr { color:var(--t-text-3);font-size:11px; }
.tool-nav-brand { padding-bottom:14px;border-bottom:1px solid var(--t-border);margin-bottom:4px; }
.tool-nav-brand img { max-width:110px;height:auto; }

/* ── Disclosure bar ───────────────────────────────────────── */
.tool-disc { position:sticky;top:8px;z-index:300;background:var(--t-amber-bg);max-width:720px;margin:8px auto 0;border-radius:10px;border:1px solid rgba(217,119,6,.2);box-shadow:0 2px 8px rgba(217,119,6,.08); }
.tool-disc summary { list-style:none;display:block;padding:8px 16px;font-size:13px;color:var(--t-amber);cursor:pointer;text-decoration:underline;text-decoration-color:rgba(217,119,6,.3);text-underline-offset:2px;line-height:1.4;-webkit-tap-highlight-color:transparent;border-radius:10px; }
.tool-disc summary::-webkit-details-marker,.tool-disc summary::marker { display:none; }
details.tool-disc[open] summary { white-space:normal;overflow:visible; }
details.tool-disc[open] .disc-more { display:none; }
.tool-disc-full { padding:10px 14px 14px;font-size:11.5px;color:var(--t-text-2);line-height:1.65;border-top:1px solid rgba(217,119,6,.15);max-height:50vh;overflow-y:auto; }
.tool-disc-full p { margin:0 0 7px; }
.tool-disc-full p:last-child { margin:0; }
.tool-disc-full strong { color:var(--t-text); }

/* ── Page wrapper ─────────────────────────────────────────── */
.tool-main { max-width:var(--t-max);margin:0 auto;padding:0 14px 60px; }

/* ── Page header ──────────────────────────────────────────── */
.tool-page-header { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0 8px; }
.tool-page-title { font-family:var(--t-fh);font-size:15px;font-weight:600;color:var(--t-navy);letter-spacing:-.01em;line-height:1.2;flex:1;min-width:0; }
.tool-province-toggle { display:flex;border:1.5px solid var(--t-border);border-radius:20px;overflow:hidden;flex-shrink:0;background:var(--t-surface); }
.tool-prov-btn { padding:5px 13px;font-size:12px;font-weight:600;border:none;background:transparent;color:var(--t-text-2);cursor:pointer;font-family:var(--t-fb);transition:all .12s;-webkit-tap-highlight-color:transparent; }
.tool-prov-btn.active { background:var(--t-navy);color:#fff;border-radius:18px; }

/* ── Calc wrapper ─────────────────────────────────────────── */
.tool-calc-wrap { background:var(--t-cream-2);border-radius:var(--t-r);padding:14px;margin-bottom:14px; }
.tool-card { background:var(--t-surface);border-radius:var(--t-r);padding:14px;margin-bottom:10px;box-shadow:0 1px 3px rgba(0,0,0,.06); }
.tool-card:last-child { margin-bottom:0; }

/* ── Sliders ──────────────────────────────────────────────── */
.tool-slider-group { margin-bottom:14px; }
.tool-slider-group:last-child { margin-bottom:0; }
.tool-sl-row { display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px; }
.tool-sl-label { font-size:13px;font-weight:600;color:var(--t-text); }
.tool-sl-val { font-family:var(--t-fh);font-size:1.2rem;font-weight:700;color:var(--t-navy);font-variant-numeric:tabular-nums; }
#sbd-grind-calculator input[type=range] { -webkit-appearance:none;appearance:none;width:100%;height:36px;background:transparent;cursor:pointer;padding:0;margin:0; }
#sbd-grind-calculator input[type=range]::-webkit-slider-runnable-track { height:4px;border-radius:2px;background:var(--t-border); }
#sbd-grind-calculator input[type=range]::-webkit-slider-thumb { -webkit-appearance:none;width:26px;height:26px;margin-top:-11px;border-radius:50%;background:var(--t-navy);border:3px solid var(--t-surface);box-shadow:0 0 0 1.5px var(--t-navy),0 2px 6px rgba(0,0,0,.12); }
#sbd-grind-calculator input[type=range]::-moz-range-track { height:4px;border-radius:2px;background:var(--t-border); }
#sbd-grind-calculator input[type=range]::-moz-range-thumb { width:26px;height:26px;border-radius:50%;background:var(--t-navy);border:3px solid var(--t-surface);box-shadow:0 0 0 1.5px var(--t-navy); }
.tool-sl-ticks { display:flex;justify-content:space-between;padding:0 2px;margin-top:-4px; }
.tool-sl-tick { font-size:9px;color:var(--t-text-3); }
.tool-sl-tick.w { color:var(--t-amber); }
.tool-sl-tick.d { color:var(--t-red); }

/* ── Metric cards ─────────────────────────────────────────── */
.tool-metric-grid { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px; }
.tool-metric-card { background:var(--t-surface);border-radius:var(--t-r);padding:12px;box-shadow:0 1px 3px rgba(0,0,0,.06); }
.tool-metric-label { font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--t-text-3);margin-bottom:4px; }
.tool-metric-rate { font-size:11px;color:var(--t-text-2);margin-bottom:5px; }
.tool-metric-rate strong { color:var(--t-green); }
.tool-metric-val { font-family:var(--t-fh);font-size:1.5rem;font-weight:700;line-height:1;color:var(--t-navy);font-variant-numeric:tabular-nums; }
.tool-metric-val.gone { color:var(--t-red);font-size:1rem; }
.tool-metric-val.red { color:var(--t-red); }
.tool-metric-val.gold { color:var(--t-gold-dim); }
.tool-metric-sub { font-size:10px;color:var(--t-text-3);margin-top:3px;line-height:1.4; }
.tool-zone-badge { display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;margin-bottom:5px; }
.tool-zone-badge.safe { background:rgba(75,140,107,.12);color:var(--t-green); }
.tool-zone-badge.warn { background:rgba(217,119,6,.12);color:var(--t-amber); }
.tool-zone-badge.danger { background:rgba(185,74,72,.12);color:var(--t-red); }

/* ── Damage box ───────────────────────────────────────────── */
.tool-damage-box { border-radius:var(--t-r);padding:12px 14px;margin-bottom:10px;border:1.5px solid var(--t-border-2);background:var(--t-surface);text-align:center; }
.tool-damage-box.active { background:var(--t-red-bg);border-color:rgba(185,74,72,.25); }
.tool-damage-box.zero { background:var(--t-green-bg);border-color:rgba(75,140,107,.2); }
.tool-damage-label { font-size:11px;color:var(--t-text-2);margin-bottom:4px; }
.tool-damage-val { font-family:var(--t-fh);font-size:2.2rem;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;color:var(--t-text-3); }
.tool-damage-box.active .tool-damage-val { color:var(--t-red); }
.tool-damage-box.zero .tool-damage-val { color:var(--t-green);font-size:1.2rem; }
.tool-damage-sub { font-size:11px;color:var(--t-text-2);margin-top:5px;line-height:1.4; }
.tool-damage-10y { font-size:12px;font-weight:700;color:var(--t-red);margin-top:3px; }

/* ── Chart ────────────────────────────────────────────────── */
.tool-chart-title { font-family:var(--t-fh);font-size:14px;font-weight:700;color:var(--t-navy);margin:0 0 2px; }
.tool-chart-caption { font-size:11px;color:var(--t-text-3);margin:0 0 6px; }
.tool-chart-rdtoh { display:flex;align-items:center;gap:6px;font-size:11px;color:var(--t-text-2);cursor:pointer;margin-bottom:8px; }
.tool-chart-rdtoh input { accent-color:var(--t-navy); }
#sbd-chart-svg { min-height:200px; }
.tool-chart-legend { display:flex;gap:14px;flex-wrap:wrap;margin-top:6px; }
.tool-legend-item { display:flex;align-items:center;gap:4px;font-size:10px;color:var(--t-text-3); }

/* ── Table scroll ─────────────────────────────────────────── */
.tool-table-wrap { overflow-x:auto;position:relative; }
.tool-table-wrap::after { content:'';position:absolute;top:0;right:0;bottom:0;width:28px;background:linear-gradient(to right,transparent,rgba(255,255,255,.9));pointer-events:none;border-radius:0 var(--t-r-sm) var(--t-r-sm) 0; }
.tool-table-wrap.no-overflow::after { display:none; }
.tool-scroll-hint { font-size:10px;color:var(--t-text-3);font-style:italic;margin-bottom:4px;display:flex;align-items:center;gap:3px; }

/* ── Dynamic JS panels ────────────────────────────────────── */
#sbd-pool-panel,#sbd-salary-panel,#sbd-compare-panel { background:var(--t-surface);border-radius:var(--t-r);padding:14px;margin-bottom:10px;box-shadow:0 1px 3px rgba(0,0,0,.06); }

/* ── Timing grid ──────────────────────────────────────────── */
.tool-timing-grid { display:grid;grid-template-columns:1fr;gap:8px; }
@media(min-width:520px){ .tool-timing-grid { grid-template-columns:repeat(3,1fr); } }

/* ── CTA ──────────────────────────────────────────────────── */
.tool-cta { background:var(--t-cream-2);border-radius:var(--t-r);padding:18px 16px;margin-bottom:14px;border-left:3px solid var(--t-gold); }
.tool-cta-eyebrow { font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--t-gold);margin-bottom:5px; }
.tool-cta-hl { font-family:var(--t-fh);font-size:18px;font-weight:600;color:var(--t-navy);line-height:1.3;margin-bottom:6px; }
.tool-cta-body { font-size:13px;color:var(--t-text-2);line-height:1.5;margin-bottom:14px; }
.tool-cta-btn { display:flex;align-items:center;justify-content:center;width:100%;padding:15px 16px;background:linear-gradient(180deg,#c8a050 0%,#b8923f 100%);color:#fff;border:none;border-radius:var(--t-r-sm);font-size:15px;font-weight:700;font-family:var(--t-fb);text-align:center;text-decoration:none;cursor:pointer;min-height:50px;box-shadow:0 4px 12px rgba(200,160,80,.3);transition:opacity .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent; }
.tool-cta-btn:hover { opacity:.92; }
.tool-cta-btn:active { opacity:.85; }

/* ── Booking panel ────────────────────────────────────────── */
.tool-booking { display:none;margin-top:14px;padding-top:14px;border-top:1px solid var(--t-border-2); }
.tool-booking.open { display:block; }
.tool-booking-label { font-size:12px;font-weight:600;color:var(--t-text-2);margin-bottom:8px; }
.tool-intent-list { display:flex;flex-direction:column;gap:6px;margin-bottom:14px; }
.tool-intent-item { display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:var(--t-r-sm);border:1.5px solid var(--t-border);background:var(--t-cream);font-size:13px;color:var(--t-text);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .12s,background .12s; }
.tool-intent-item.sel { border-color:var(--t-navy);background:rgba(27,42,74,.05); }
.tool-intent-check { width:18px;height:18px;border-radius:50%;border:1.5px solid var(--t-border);display:flex;align-items:center;justify-content:center;font-size:10px;flex-shrink:0;transition:all .12s; }
.tool-intent-item.sel .tool-intent-check { background:var(--t-navy);border-color:var(--t-navy);color:#fff; }
.tool-slots-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:8px; }
.tool-slot { padding:9px 4px;border-radius:var(--t-r-sm);border:1.5px solid var(--t-border);background:var(--t-cream);text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:all .12s; }
.tool-slot.sel { border-color:var(--t-navy);background:rgba(27,42,74,.05); }
.tool-slot-loading { display:flex;align-items:center;justify-content:center;padding:14px;font-size:12px;color:var(--t-text-3);grid-column:1/-1; }
.tool-slot-date { font-size:9px;color:var(--t-text-2); }
.tool-slot-time { font-size:12px;font-weight:700;color:var(--t-text);margin-top:2px; }
.tool-slot.sel .tool-slot-time { color:var(--t-navy); }
.tool-other-times { display:block;text-align:center;font-size:11px;color:var(--t-text-3);text-decoration:underline;text-underline-offset:2px;cursor:pointer;margin-bottom:10px;background:none;border:none;width:100%;font-family:var(--t-fb); }
.tool-confirm-btn { display:block;width:100%;padding:13px;border-radius:var(--t-r-sm);background:var(--t-navy);color:#fff;border:none;font-size:14px;font-weight:700;font-family:var(--t-fb);cursor:pointer;min-height:48px;transition:opacity .15s; }
.tool-confirm-btn:disabled { background:var(--t-border);color:var(--t-text-3);cursor:default; }

/* Cal.com inline embed */
.tool-cal-embed { display:none;margin-top:14px;border-radius:var(--t-r-sm);overflow:hidden;border:1px solid var(--t-border);min-height:450px; }
.tool-cal-embed.open { display:block; }

/* ── Learn sections ───────────────────────────────────────── */
.tool-learn-stack { margin-top:4px; }
details.tool-learn { border-top:1px solid var(--t-border); }
details.tool-learn:last-of-type { border-bottom:1px solid var(--t-border);margin-bottom:16px; }
details.tool-learn > summary { list-style:none;padding:13px 2px;font-family:var(--t-fh);font-size:15px;font-weight:600;color:var(--t-navy);cursor:pointer;display:flex;justify-content:space-between;align-items:center;min-height:50px;-webkit-tap-highlight-color:transparent;user-select:none;line-height:1.3; }
details.tool-learn > summary::-webkit-details-marker,details.tool-learn > summary::marker { display:none; }
.tl-chev { font-size:10px;color:var(--t-text-3);flex-shrink:0;transition:transform .18s;margin-left:8px; }
details.tool-learn[open] .tl-chev { transform:rotate(180deg); }
.tool-learn-body { padding:2px 0 16px;font-size:14px;line-height:1.7;color:var(--t-text); }
.tool-learn-body p { margin:0 0 11px; }
.tool-learn-body p:last-child { margin:0; }
.tool-learn-body h2,.tool-learn-body h3 { font-family:var(--t-fh);color:var(--t-navy);margin:16px 0 8px;font-size:15px; }
.tool-learn-body ul { padding-left:18px;display:flex;flex-direction:column;gap:5px;margin-bottom:11px; }
.tool-learn-body strong { color:var(--t-navy); }
.tool-learn-body a { color:var(--t-navy);text-underline-offset:2px; }
.tool-zone-cards { display:grid;grid-template-columns:1fr;gap:10px;margin:12px 0; }
@media(min-width:520px){ .tool-zone-cards { grid-template-columns:repeat(3,1fr); } }
.tool-zone-card { padding:14px 16px;border-radius:var(--t-r-sm);border-left:3px solid;background:var(--t-cream-2);font-size:13px;line-height:1.5;color:var(--t-text); }
.tool-zone-card-title { font-weight:700;font-size:13px;margin-bottom:5px; }
.tool-learn-table { width:100%;border-collapse:collapse;font-size:12px;margin:10px 0; }
.tool-learn-table th { font-size:9px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:var(--t-gold-dim);padding:5px 8px;border-bottom:1px solid var(--t-border);text-align:right; }
.tool-learn-table th:first-child { text-align:left; }
.tool-learn-table td { padding:6px 8px;border-bottom:1px solid var(--t-border-2);text-align:right;color:var(--t-text-2); }
.tool-learn-table td:first-child { text-align:left; }
.tool-learn-table tr.hi td { color:var(--t-red);font-weight:700; }

/* ── Cards (case studies / related tools) ─────────────────── */
.tool-cards-section { margin:20px 0; }
.tool-cards-heading { font-family:var(--t-fh);font-size:14px;font-weight:600;color:var(--t-navy);margin-bottom:10px; }
.tool-cards-scroll { display:flex;gap:10px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px; }
.tool-cards-scroll::-webkit-scrollbar { display:none; }
@media(min-width:600px){ .tool-cards-scroll { display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));overflow:visible; } }
.tool-card-chip { flex-shrink:0;width:170px;padding:12px;border-radius:var(--t-r-sm);border:1px solid var(--t-border);background:var(--t-surface);text-decoration:none;display:block;transition:box-shadow .15s,border-color .15s; }
.tool-card-chip:hover { border-color:var(--t-gold);box-shadow:0 2px 8px rgba(200,160,80,.15); }
@media(min-width:600px){ .tool-card-chip { width:auto; } }
.tool-card-tag { font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--t-gold-dim);margin-bottom:4px; }
.tool-card-title { font-size:12px;color:var(--t-text);line-height:1.4; }

/* ── Compliance tags ──────────────────────────────────────── */
.tool-compliance-tags { display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 16px; }
.tool-comp-tag { display:inline-block;padding:3px 8px;border-radius:4px;font-size:10px;font-weight:600;line-height:1.4; }
.tool-comp-tag.tax { background:#FEF3C7;color:#92400E; }
.tool-comp-tag.mf  { background:#e2e8f0;color:#1a2744; }
.tool-comp-tag.ins { background:var(--t-cream-2);color:#1a2744; }

/* ── Footer ───────────────────────────────────────────────── */
.tool-footer { border-top:1px solid var(--t-border-2);padding:16px 14px;max-width:var(--t-max);margin:0 auto;font-size:11px;color:var(--t-text-3);line-height:1.6; }
.tool-footer a { color:var(--t-text-3);text-underline-offset:2px; }
.tool-footer-brand { margin-bottom:8px; }
.tool-footer-brand img { max-width:80px;opacity:.6; }

/* ── Desktop (≥769px) ─────────────────────────────────────── */
@media(min-width:769px){
  .tool-main { padding:0 20px 80px; }
  /* Learn sections stay collapsible on desktop too — same behaviour everywhere */
  details.tool-learn > summary { font-size:17px !important; padding:16px 2px !important; min-height:auto; }
  .tool-learn-body { font-size:15px;padding:0 0 20px; }
  .tool-metric-grid { grid-template-columns:repeat(3,1fr); }
  .tool-metric-val { font-size:1.8rem; }
  .tool-damage-val { font-size:2.8rem; }
  #sbd-chart-svg { min-height:280px; }
  .tool-page-title { font-size:20px; }
  .tool-calc-wrap { padding:20px; }
  .tool-card { padding:18px 20px; }
}

/* ── Tiny screens (<375px) ────────────────────────────────── */
@media(max-width:374px){
  .tool-metric-grid { grid-template-columns:1fr; }
  .tool-slots-grid { grid-template-columns:1fr 1fr; }
}

/* ── Calc button styles ───────────────────────────────────── */
#sbd-grind-calculator .sbd-calc-btn { padding:6px 16px;border-radius:6px;border:none;cursor:pointer;font-size:13px;font-weight:600;font-family:var(--t-fb);background:var(--t-border);color:var(--t-text);transition:background .15s,color .15s; }
#sbd-grind-calculator .sbd-calc-btn.sbd-calc-btn--active { background:var(--t-navy);color:#fff; }
#sbd-grind-calculator .sbd-calc-btn.sbd-calc-btn--sm { padding:3px 10px;font-size:11px; }
#sbd-grind-calculator .sbd-calc-btn.sbd-calc-btn--sm.sbd-calc-btn--active { background:var(--t-gold);color:var(--t-navy); }

/* ═══════════════════════════════════════════════════════════
   AI-OPTIMIZATION ELEMENTS
   Added by tool.njk layout automatically from frontmatter.
   ═══════════════════════════════════════════════════════════ */

/* ── Key facts block ─────────────────────────────────────── */
.tool-keypoints {
  background: var(--t-surface);
  border: 1.5px solid var(--t-border);
  border-left: 4px solid var(--t-gold);
  border-radius: var(--t-r);
  padding: 14px 16px;
  margin-bottom: 14px;
}
.tool-keypoints-heading {
  font-family: var(--t-fh);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--t-gold-dim);
  margin: 0 0 10px;
  padding: 0;
}
.tool-keypoints-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.tool-keypoints-list li {
  font-size: 13px;
  color: var(--t-text);
  line-height: 1.5;
  padding-left: 16px;
  position: relative;
}
.tool-keypoints-list li::before {
  content: '▸';
  position: absolute;
  left: 0;
  color: var(--t-gold);
  font-size: 10px;
  top: 3px;
}
.tool-keypoints-list strong { color: var(--t-navy); }
.tool-keypoints-list a { color: var(--t-navy); text-underline-offset: 2px; }

@media(min-width: 769px) {
  .tool-keypoints { padding: 16px 20px; margin-bottom: 16px; }
  .tool-keypoints-list { gap: 8px; }
  .tool-keypoints-list li { font-size: 14px; }
}

/* ── Definition terms — <dfn> tags in content ────────────── */
dfn {
  font-style: normal;
  font-weight: 600;
  color: var(--t-navy);
  border-bottom: 1.5px dotted var(--t-gold);
  cursor: help;
  text-decoration: none;
}
abbr[title] {
  border-bottom: 1.5px dotted var(--t-text-3);
  cursor: help;
  text-decoration: none;
}

/* ── Sources section ─────────────────────────────────────── */
.tool-sources {
  margin: 20px 0 4px;
  padding-top: 16px;
  border-top: 1px solid var(--t-border-2);
}
.tool-sources-heading {
  font-family: var(--t-fh);
  font-size: 13px;
  font-weight: 600;
  color: var(--t-text-2);
  margin: 0 0 10px;
}
.tool-sources-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tool-source-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  line-height: 1.5;
}
.tool-source-type {
  flex-shrink: 0;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .06em;
  padding: 2px 6px;
  border-radius: 3px;
  margin-top: 1px;
  white-space: nowrap;
}
.tool-source--legislation .tool-source-type { background: #EDE9FE; color: #5B21B6; }
.tool-source--government  .tool-source-type { background: #DBEAFE; color: #1E40AF; }
.tool-source--regulator   .tool-source-type { background: #DCFCE7; color: #166534; }
.tool-source--academic    .tool-source-type { background: #FEF3C7; color: #92400E; }
.tool-source-item a {
  color: var(--t-text-2);
  text-decoration: underline;
  text-underline-offset: 2px;
  font-size: 12px;
  line-height: 1.5;
  word-break: break-word;
}
.tool-source-item a:hover { color: var(--t-navy); }

/* ── Bottom full disclosure ──────────────────────────────── */
.tool-disc-bottom {
  margin: 24px 0 8px;
  background: #F8F6F0;
  border-radius: var(--t-r);
  border: 1px solid #EDE8DC;
  overflow: hidden;
}
.tool-disc-bottom-summary {
  list-style: none;
  padding: 13px 16px;
  font-size: 12px;
  font-weight: 600;
  color: var(--t-text-2);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  min-height: 46px;
}
.tool-disc-bottom-summary::-webkit-details-marker,
.tool-disc-bottom-summary::marker { display: none; }
details.tool-disc-bottom[open] .tl-chev { transform: rotate(180deg); }
.tool-disc-bottom-body {
  padding: 0 16px 16px;
  font-size: 12px;
  line-height: 1.65;
  color: var(--t-text-2);
  border-top: 1px solid #EDE8DC;
}
.tool-disc-bottom-body p { margin: 10px 0 0; }
.tool-disc-bottom-body p:first-child { margin-top: 12px; }
.tool-disc-bottom-body strong { color: var(--t-text); }
.tool-disc-bottom-body a { color: var(--t-text-2); text-underline-offset: 2px; }

/* ═══════════════════════════════════════════════════════════
   FIXES — April 2026
   ═══════════════════════════════════════════════════════════ */

/* ── 1. Disclosure: larger font for easier tap ──────────── */
.tool-disc { text-align: center; }
.tool-disc summary {
  font-size: 13px !important;
  padding: 7px 16px !important;
  text-align: center !important;
  justify-content: center !important;
  display: inline-block !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* ── 2. Sliders: force full width, fix track fill ────────── */
.tool-slider-group { width: 100%; }
.tool-slider-group input[type=range] { width: 100% !important; display: block !important; }

/* Override any flex shrink on slider parent */
#sbd-abi-slider,
#sbd-aaii-slider { flex: none !important; width: 100% !important; }

/* ── 3. Input mode toggle active state ─────────────────────
   Both buttons were appearing the same colour.
   Inactive = light grey. Active = navy fill + white text.  */
.sbd-input-mode-row { display: flex; align-items: center; gap: 6px; }
#sbd-input-aaii-vis,
#sbd-input-gains-vis {
  padding: 5px 13px !important;
  font-size: 12px !important;
  border-radius: 6px !important;
  border: 1.5px solid var(--t-border) !important;
  background: var(--t-cream) !important;
  color: var(--t-text-2) !important;
  font-weight: 600 !important;
  transition: all .12s !important;
  cursor: pointer !important;
}
#sbd-input-aaii-vis.sbd-calc-btn--active,
#sbd-input-gains-vis.sbd-calc-btn--active {
  background: var(--t-navy) !important;
  color: #fff !important;
  border-color: var(--t-navy) !important;
}

/* ── 4. Chart: thicker, rounder lines via CSS override ────── */
#sbd-chart-svg polyline,
#sbd-chart-svg path[fill="none"] {
  stroke-width: 3.5 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
/* Keep threshold dashed lines thinner */
#sbd-chart-svg line[stroke-dasharray] {
  stroke-width: 1.5 !important;
}
/* Chart text: slightly larger */
#sbd-chart-svg text {
  font-size: 11px !important;
}

/* ── 5. Chevrons: larger, right-aligned, clear ───────────── */
.tl-chev {
  font-size: 14px !important;
  opacity: 0.6;
  transition: transform .2s, opacity .2s !important;
}
details[open] > summary .tl-chev { opacity: 1; }

/* Key facts collapsible chevron */
.tool-kf-chev {
  font-size: 13px;
  color: var(--t-gold-dim);
  opacity: 0.7;
  flex-shrink: 0;
  margin-left: 8px;
  transition: transform .2s;
}
details.tool-kf-details[open] .tool-kf-chev { transform: rotate(180deg); opacity: 1; }
details.tool-kf-details > summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  padding: 0;
}
details.tool-kf-details > summary::-webkit-details-marker,
details.tool-kf-details > summary::marker { display: none; }
details.tool-kf-details:not([open]) .tool-keypoints-list { display: none; }

/* ── 6. Intent checkboxes: rectangle (multi-select feel) ─── */
.tool-intent-check {
  width: 18px !important;
  height: 18px !important;
  border-radius: 4px !important;        /* rectangle, not circle */
  border: 1.5px solid var(--t-border) !important;
  background: var(--t-surface) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  flex-shrink: 0 !important;
  font-weight: 700 !important;
}
.tool-intent-item.sel .tool-intent-check {
  background: var(--t-navy) !important;
  border-color: var(--t-navy) !important;
  color: #fff !important;
}

/* ── 7. Redesigned damage boxes ──────────────────────────── */
.tool-total-trigger-box {
  border-radius: var(--t-r);
  padding: 14px 16px;
  margin-bottom: 8px;
  text-align: center;
  border: 1.5px solid;
}
.tool-total-trigger-box.zero {
  background: var(--t-surface);
  border-color: var(--t-border);
}
.tool-total-trigger-box.active {
  background: rgba(185,74,72,.06);
  border-color: rgba(185,74,72,.2);
}
.tool-ttb-label {
  font-size: 11px;
  color: var(--t-text-2);
  margin-bottom: 3px;
  letter-spacing: .01em;
}
.tool-ttb-val {
  font-family: var(--t-fh);
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--t-text-3);
}
.tool-total-trigger-box.active .tool-ttb-val { color: var(--t-red); }
.tool-total-trigger-box.zero .tool-ttb-val { color: var(--t-green); font-size: 1.4rem; }
.tool-ttb-rate { font-size: 12px; font-weight: 700; color: var(--t-text-2); margin-top: 3px; }
.tool-total-trigger-box.active .tool-ttb-rate { color: var(--t-red); }
.tool-ttb-10y { font-size: 11px; color: var(--t-red); font-weight: 700; margin-top: 4px; }

.tool-grind-sub-box {
  border-radius: var(--t-r);
  padding: 10px 14px;
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--t-surface);
  border: 1px solid var(--t-border-2);
  gap: 8px;
}
.tool-gsb-label { font-size: 12px; color: var(--t-text-2); flex: 1; line-height: 1.4; }
.tool-gsb-val {
  font-family: var(--t-fh);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--t-red);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.tool-gsb-note { font-size: 10px; color: var(--t-text-3); margin-top: 2px; }

/* ── 8. Bottom sheet overlay for cal.eu ─────────────────── */
#toolCalSheet {
  position: fixed; inset: 0; z-index: 700;
  background: rgba(0,0,0,0); /* no dark overlay — we use our own booking panel */
  display: none;
  align-items: flex-end;
  pointer-events: none;
}
#toolCalSheet.open {
  display: flex;
  pointer-events: all;
  background: rgba(11,31,58,.55);
}
#toolCalSheetInner {
  width: 100%; height: 88vh;
  background: #fff;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 -4px 24px rgba(0,0,0,.18);
}
#toolCalSheetHeader {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--t-border);
  flex-shrink: 0;
}
#toolCalSheetTitle {
  font-family: var(--t-fh);
  font-size: 15px; font-weight: 600; color: var(--t-navy);
}
#toolCalSheetClose {
  background: none; border: none; font-size: 20px;
  color: var(--t-text-2); cursor: pointer; padding: 4px; line-height: 1;
}
#toolCalIframe {
  flex: 1; width: 100%; border: none; min-height: 0;
}
@media (min-width: 769px) {
  #toolCalSheet.open { align-items: center; padding: 20px; }
  #toolCalSheetInner { width: 100%; max-width: 620px; height: 80vh; border-radius: 16px; margin: auto; }
}

/* ── 9. Slot buttons ─────────────────────────────────────── */
.tool-slots-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-bottom: 10px; }
.tool-slot {
  padding: 11px 6px; border-radius: var(--t-r-sm);
  border: 1.5px solid var(--t-border); background: var(--t-cream);
  text-align: center; cursor: pointer;
  -webkit-tap-highlight-color: transparent; transition: all .12s;
}
.tool-slot:active, .tool-slot.sel { border-color: var(--t-navy); background: rgba(27,42,74,.06); }
.tool-slot-date { font-size: 10px; color: var(--t-text-2); }
.tool-slot-time { font-size: 13px; font-weight: 700; color: var(--t-text); margin-top: 3px; }
.tool-slot.sel .tool-slot-time { color: var(--t-navy); }
.tool-other-times {
  display: block; text-align: center; font-size: 11px;
  color: var(--t-text-3); text-decoration: underline; text-underline-offset: 2px;
  cursor: pointer; margin-bottom: 12px; background: none; border: none;
  width: 100%; font-family: var(--t-fb);
}

/* ── Open learn sections (no details wrapper) ─────────────── */
.tool-learn-open {
  padding: 20px 0;
  border-top: 1px solid var(--t-border-2);
}
.tool-learn-open:last-of-type { border-bottom: 1px solid var(--t-border-2); }
.tool-learn-open-title {
  font-family: var(--t-fh);
  font-size: 16px;
  font-weight: 600;
  color: var(--t-navy);
  margin: 0 0 12px;
  line-height: 1.3;
}
@media(min-width:769px){
  .tool-learn-open-title { font-size: 18px; }
  .tool-learn-open { padding: 24px 0; }
}

@media(min-width:600px){.tool-metric-grid{grid-template-columns:1fr 1fr !important;width:100%;}.tool-total-trigger-box{width:100%;}.tool-grind-sub-box{width:100%;}}

/* ── Pre-CTA avenues text ────────────────────────────────── */
.tool-cta-avenues {
  margin: 0 0 14px;
  padding: 10px 14px;
  background: rgba(201,160,80,.08);
  border-radius: var(--t-r-sm);
  border-left: 3px solid var(--t-gold);
}
.tool-avenues-lead {
  font-size: 13px;
  color: var(--t-text);
  line-height: 1.55;
  margin: 0;
}
.tool-avenues-lead strong { color: var(--t-navy); }

/* ── Slot period sub-label ───────────────────────────────── */
.tool-slot-period {
  font-size: 9px;
  color: var(--t-text-3);
  margin-top: 1px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* ── Key facts: ensure details[open] chevron works ──────── */
details.tool-kf-details > summary {
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent;
}
details.tool-kf-details:not([open]) .tool-keypoints-list {
  display: none;
}

/* ── Metric grid: force full width ─────────────────────── */
.tool-metric-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  width: 100% !important;
  gap: 8px !important;
}
.sbd-metric-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  width: 100% !important;
  gap: 8px !important;
}


/* ── Disclosure expanded: constrain width on desktop ────── */
.tool-disc-full {
  padding: 12px 16px 14px !important;
  border-radius: 0 0 10px 10px !important;
  box-sizing: border-box !important;
}
/* Disclosure font: slightly larger */
.tool-disc summary,
details.tool-disc > summary {
  font-size: 13.5px !important;
}

/* ── Metric cards: clean flex layout ───────────────────── */
.tool-metric-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
}
.tm-top { margin-bottom: 8px; }
.tm-eyebrow {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--t-text-3);
}
.tm-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--t-text-3);
  margin-bottom: 4px;
}
.tm-value {
  font-family: var(--t-fh);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
  color: var(--t-navy);
  font-variant-numeric: tabular-nums;
  margin-bottom: 6px;
  word-break: break-all;
}
.tm-value--red { color: var(--t-red) !important; }
.tm-sub {
  font-size: 11px;
  color: var(--t-text-3);
  line-height: 1.4;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tm-rate-note {
  font-size: 10px;
  color: var(--t-text-3);
}

/* ── Email form: auto-visible, no toggle needed ─────────── */
#sbd-send-panel { margin-top: 0 !important; }

/* ═══════════════════════════════════════════════════════════
   TEMPLATE-LEVEL COMPONENTS (migration from page-level)
   ═══════════════════════════════════════════════════════════ */

/* ── Commitment line (anti-pressure signal near CTA) ────── */
.tool-commitment {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 12px;
  margin: 0 0 14px;
  background: rgba(75,140,107,0.06);
  border-radius: var(--t-r-sm);
  border-left: 3px solid var(--t-green);
  font-size: 12px;
  line-height: 1.5;
  color: var(--t-text);
}
.tool-commitment svg {
  color: var(--t-green);
  flex-shrink: 0;
  margin-top: 2px;
}
.tool-commitment span strong { color: var(--t-navy); }

/* ── Collapsible learn sections (back to drop-downs) ─────── */
details.tool-learn {
  border-top: 1px solid var(--t-border);
  margin: 0;
}
details.tool-learn:last-of-type {
  border-bottom: 1px solid var(--t-border);
  margin-bottom: 16px;
}
details.tool-learn > summary {
  list-style: none;
  padding: 14px 2px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 52px;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  gap: 10px;
}
details.tool-learn > summary::-webkit-details-marker,
details.tool-learn > summary::marker { display: none; }
.tool-learn-title {
  font-family: var(--t-fh);
  font-size: 15px;
  font-weight: 600;
  color: var(--t-navy);
  line-height: 1.35;
  flex: 1;
  min-width: 0;
}
details.tool-learn > summary .tl-chev {
  font-size: 14px;
  color: var(--t-text-3);
  flex-shrink: 0;
  transition: transform .2s, color .2s;
}
details.tool-learn[open] > summary .tl-chev {
  transform: rotate(180deg);
  color: var(--t-gold);
}
details.tool-learn[open] > summary .tool-learn-title {
  color: var(--t-navy);
}
.tool-learn-body {
  padding: 4px 0 20px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--t-text);
}
.tool-learn-body p { margin: 0 0 11px; }
.tool-learn-body p:last-child { margin: 0; }
.tool-learn-body h2, .tool-learn-body h3 {
  font-family: var(--t-fh);
  color: var(--t-navy);
  margin: 16px 0 8px;
  font-size: 15px;
}
.tool-learn-body ul {
  padding-left: 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 11px;
}
.tool-learn-body strong { color: var(--t-navy); }
.tool-learn-body a {
  color: var(--t-navy);
  text-underline-offset: 2px;
}
.tool-learn-body dfn {
  font-style: normal;
  font-weight: 600;
  color: var(--t-navy);
  border-bottom: 1.5px dotted var(--t-gold);
}

@media(min-width: 769px) {
  details.tool-learn > summary { padding: 18px 2px; min-height: 60px; }
  .tool-learn-title { font-size: 17px; }
  .tool-learn-body { font-size: 15px; padding: 4px 0 24px; }
}

/* ── Email results card (template-level) ─────────────────── */
.tool-email-results {
  background: var(--t-surface);
  border-radius: var(--t-r);
  padding: 16px 18px;
  margin: 14px 0;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
  border: 1px solid var(--t-border-2);
}
.tool-email-heading {
  font-family: var(--t-fh);
  font-size: 15px;
  font-weight: 700;
  color: var(--t-navy);
  margin-bottom: 4px;
}
.tool-email-desc {
  font-size: 12px;
  color: var(--t-text-3);
  margin-bottom: 14px;
  line-height: 1.5;
}
.tool-email-form-wrap {
  background: var(--t-cream-2);
  border-radius: var(--t-r-sm);
  border: 1px solid var(--t-border);
  padding: 14px;
}
.tool-email-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tool-email-form input[type="email"],
.tool-email-form input[type="text"] {
  padding: 10px 12px;
  border: 1.5px solid var(--t-border);
  border-radius: var(--t-r-sm);
  font-size: 13px;
  font-family: var(--t-fb);
  width: 100%;
  box-sizing: border-box;
  background: var(--t-surface);
}
.tool-email-form input:focus {
  outline: none;
  border-color: var(--t-navy);
}
.tool-email-sub-label {
  font-size: 11px;
  color: var(--t-text-2);
  margin-top: 2px;
}
.tool-email-form button {
  align-self: flex-start;
  padding: 10px 22px;
  font-size: 13px;
  margin-top: 4px;
}
.tool-email-msg {
  font-size: 12px;
  margin: 8px 0 0;
  min-height: 1.2em;
}
.tool-email-legal {
  font-size: 10px;
  color: var(--t-text-3);
  margin-top: 10px;
  line-height: 1.5;
}

/* ── Sticky mobile CTA bar ───────────────────────────────── */
.tool-sticky-cta {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 450;
  padding: 8px 10px 10px;
  background: linear-gradient(180deg, rgba(253,252,251,0.85) 0%, rgba(253,252,251,1) 30%);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 -4px 16px rgba(0,0,0,.06);
  transform: translateY(100%);
  transition: transform .3s cubic-bezier(.2,.9,.3,1);
  display: flex;
  align-items: center;
  gap: 6px;
  padding-bottom: calc(10px + env(safe-area-inset-bottom));
}
.tool-sticky-cta.show { transform: translateY(0); }
.tool-sticky-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 13px 14px;
  background: linear-gradient(180deg, #c8a050 0%, #b8923f 100%);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  font-family: var(--t-fb);
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(200,160,80,.3);
  -webkit-tap-highlight-color: transparent;
}
.tool-sticky-btn:active { transform: scale(.98); }
.tool-sticky-arr { font-size: 16px; }
.tool-sticky-dismiss {
  width: 34px;
  height: 42px;
  flex-shrink: 0;
  background: rgba(255,255,255,0.8);
  border: 1px solid var(--t-border);
  border-radius: 8px;
  font-size: 14px;
  color: var(--t-text-2);
  cursor: pointer;
  line-height: 1;
  -webkit-tap-highlight-color: transparent;
}
@media(min-width: 769px) {
  .tool-sticky-cta { display: none; } /* desktop has main CTA visible more often */
}

/* Push body when sticky CTA visible to prevent overlap of bottom content */
body.tool-page { padding-bottom: 0; }
@media(max-width: 768px) {
  body.tool-page { padding-bottom: 80px; }
}

/* ═══════════════════════════════════════════════════════════
   POLISH — April 2026 (template-level visual refinements)
   ═══════════════════════════════════════════════════════════ */

/* ── CTA pulse when in danger zone (controlled by JS class) ── */
@keyframes toolCtaPulse {
  0%, 100% { box-shadow: 0 4px 12px rgba(200,160,80,.3); }
  50%      { box-shadow: 0 4px 24px rgba(200,160,80,.55), 0 0 0 3px rgba(200,160,80,.15); }
}
.tool-cta-btn.tool-pulse { animation: toolCtaPulse 1.8s ease-in-out infinite; }

/* ── Number count-up transition ────────────────────────── */
.tool-ttb-val, .tool-gsb-val, .tm-value {
  transition: color .3s ease;
}

/* ── Chart draw-in animation ──────────────────────────── */
@keyframes toolChartFade {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}
#sbd-chart-svg svg {
  animation: toolChartFade .4s ease-out both;
}

/* ── Slot loading skeleton ─────────────────────────────── */
@keyframes toolSkeletonShimmer {
  0%   { background-position: -200px 0; }
  100% { background-position: calc(200px + 100%) 0; }
}
.tool-slot-skeleton {
  background: linear-gradient(90deg, var(--t-cream) 0%, var(--t-cream-2) 40%, var(--t-cream) 80%);
  background-size: 200px 100%;
  background-repeat: no-repeat;
  animation: toolSkeletonShimmer 1.2s linear infinite;
  border-radius: var(--t-r-sm);
  height: 58px;
  border: 1.5px solid var(--t-border);
}

/* ── Commitment line (no-pressure promise) ────────────── */
.tool-commitment {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 10px 12px;
  margin: 10px 0 12px;
  background: rgba(75,140,107,.08);
  border-radius: var(--t-r-sm);
  font-size: 12px;
  color: var(--t-text-2);
  line-height: 1.5;
}
.tool-commitment svg {
  flex-shrink: 0;
  color: var(--t-green);
  margin-top: 2px;
}

/* ── Sticky mobile CTA bar ─────────────────────────────── */
.tool-sticky-cta {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--t-surface);
  border-top: 1px solid var(--t-border);
  box-shadow: 0 -2px 12px rgba(0,0,0,.08);
  padding: 10px 14px;
  z-index: 480;
  display: none;
  align-items: center;
  gap: 10px;
  transform: translateY(100%);
  transition: transform .3s ease;
}
.tool-sticky-cta.show {
  display: flex;
  transform: translateY(0);
}
.tool-sticky-cta-btn {
  flex: 1;
  padding: 11px 14px;
  background: linear-gradient(180deg, #c8a050 0%, #b8923f 100%);
  color: #fff;
  border: none;
  border-radius: var(--t-r-sm);
  font-size: 14px;
  font-weight: 700;
  font-family: var(--t-fb);
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(200,160,80,.3);
}
.tool-sticky-cta-close {
  background: none;
  border: none;
  font-size: 20px;
  color: var(--t-text-3);
  cursor: pointer;
  padding: 8px;
  line-height: 1;
  flex-shrink: 0;
}
@media(min-width:769px){ .tool-sticky-cta { display: none !important; } }

/* ══════════════════════════════════════════════════════════
   COMPACT FIRST CTA — above the chart
   Scrolls to full CTA / booking panel at page end
   ══════════════════════════════════════════════════════════ */
.tool-cta-lead {
  display: flex;
  align-items: center;
  gap: 14px;
  background: linear-gradient(135deg, rgba(27,42,74,.03) 0%, rgba(200,160,80,.06) 100%);
  border: 1.5px solid rgba(200,160,80,.25);
  border-left: 4px solid var(--t-gold);
  border-radius: var(--t-r);
  padding: 14px 16px;
  margin: 0 0 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.tool-cta-lead-body {
  flex: 1;
  min-width: 0;
}
.tool-cta-lead-hl {
  font-family: var(--t-fh);
  font-size: 15px;
  font-weight: 700;
  color: var(--t-navy);
  line-height: 1.25;
  margin-bottom: 3px;
}
.tool-cta-lead-sub {
  font-size: 12px;
  color: var(--t-text-2);
  line-height: 1.45;
}
.tool-cta-lead-btn {
  flex-shrink: 0;
  padding: 10px 16px;
  background: linear-gradient(180deg, #c8a050 0%, #b8923f 100%);
  color: #fff;
  border: none;
  border-radius: var(--t-r-sm);
  font-size: 13px;
  font-weight: 700;
  font-family: var(--t-fb);
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(200,160,80,.25);
  transition: transform .15s ease, box-shadow .15s ease;
}
.tool-cta-lead-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(200,160,80,.35);
}
@media(max-width:640px){
  .tool-cta-lead { flex-direction: column; align-items: stretch; gap: 10px; text-align: left; }
  .tool-cta-lead-btn { width: 100%; padding: 12px; font-size: 14px; }
}
