/* Plan examples: feature callouts and the guided walkthrough (Sage Web Co.).
   Shared by all three plan examples. */
.ex--live{--t:#1FA971;--t-num-bg:#5EDBA6;--t-num-fg:#08281C;--t-ink:#0B6B47;--t-soft:rgba(31,169,113,.18)}
.ex--found{--t:#E8AE1E;--t-num-bg:#FFC83D;--t-num-fg:#10233F;--t-ink:#7A5200;--t-soft:rgba(232,174,30,.20)}
.ex--office{--t:#8B6CFF;--t-num-bg:#6E4CF5;--t-num-fg:#FFFFFF;--t-ink:#5536C8;--t-soft:rgba(139,108,255,.18)}

/* Overlay layers: body items sit under the sticky header, header items above it */
.exo{position:fixed;inset:0;pointer-events:none}
.exo--body{z-index:39}
.exo--head{z-index:61}
.exo-ring{position:absolute;left:0;top:0;border:2px solid var(--t);border-radius:16px;box-shadow:0 0 0 5px var(--t-soft);pointer-events:none;will-change:transform}
.exo-ring--sm{border-radius:10px;box-shadow:0 0 0 3px var(--t-soft)}
.exo-tag{position:absolute;left:0;top:0;pointer-events:auto;display:inline-flex;align-items:center;gap:7px;margin:0;border:0;cursor:pointer;background:#10233F;color:#FFFFFF;border-radius:999px;padding:4px 12px 4px 4px;font:700 12.5px/1.2 'Figtree',Inter,system-ui,-apple-system,'Segoe UI',sans-serif;letter-spacing:.01em;white-space:nowrap;box-shadow:0 8px 22px -8px rgba(16,35,63,.55),0 0 0 1px rgba(255,255,255,.14) inset;will-change:transform;transition:background .15s ease}
.exo-tag:hover{background:#1B3559}
.exo-tag:focus-visible{outline:3px solid var(--t);outline-offset:2px}
.exo-num{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;box-sizing:border-box;border-radius:999px;background:var(--t-num-bg);color:var(--t-num-fg);font:800 11.5px/1 'Figtree',Inter,system-ui,sans-serif}
.exo-tag em{font-style:normal;color:var(--t-num-bg);font-weight:800}
.ex--office .exo-tag em{color:#C9BCFF}
.exo-tag--mini{padding:3px;gap:0}
/* tap targets: the tags and the close button keep their small look but get a 44px touch area */
.exo-tag::after{content:"";position:absolute;left:-8px;right:-8px;top:-8px;bottom:-8px}
.exo-tag--mini::after{left:-9px;right:-9px;top:-9px;bottom:-9px}
.exo-tag--mini .exo-txt{max-width:0;overflow:hidden;opacity:0;transition:max-width .2s ease,opacity .2s ease,margin .2s ease}
.exo-tag--mini:hover .exo-txt,.exo-tag--mini:focus-visible .exo-txt{max-width:220px;opacity:1;margin:0 8px 0 7px}
.exo.is-off{display:none}
.ext-on .exo-ring{visibility:hidden !important}

/* Walkthrough */
.ext-spot{position:fixed;left:0;top:0;z-index:2147482000;border-radius:16px;border:2px solid var(--t);box-shadow:0 0 0 5px var(--t-soft),0 0 0 200vmax rgba(9,18,32,.58);pointer-events:none;transition:transform .35s ease,width .35s ease,height .35s ease,opacity .2s ease}
.ext-spot.is-none{border-color:transparent;box-shadow:0 0 0 200vmax rgba(9,18,32,.58)}
.ext-card{position:fixed;z-index:2147482001;width:min(392px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;box-sizing:border-box;background:#FFFFFF;color:#22303F;border-radius:18px;padding:20px 22px 16px;box-shadow:0 32px 70px -24px rgba(9,18,32,.6),0 0 0 1px rgba(16,35,63,.08);font:500 15px/1.55 'Figtree',Inter,system-ui,-apple-system,'Segoe UI',sans-serif;text-align:left}
.ext-card:focus{outline:none}
.ext-card *{box-sizing:border-box}
.ext-card--wide{width:min(560px,calc(100vw - 24px))}
.ext-card--split{width:min(660px,calc(100vw - 24px))}
.ext-card--split .ext-cols{display:grid;grid-template-columns:minmax(0,1fr) 246px;gap:20px;align-items:start}
.ext-card--split .ext-aside .ext-sample{margin:30px 0 12px}
.ext-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 30px 8px 0}
.ext-eyebrow{margin:0;display:flex;align-items:center;gap:8px;font:800 11.5px/1.3 'Figtree',Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--t-ink)}
.ext-eyebrow i{width:9px;height:9px;border-radius:50%;background:var(--t);box-shadow:0 0 0 3px var(--t-soft);flex:none}
.ext-count{font:700 12px/1 'Figtree',Inter,system-ui,sans-serif;color:#6B7684;white-space:nowrap}
.ext-x{position:absolute;right:12px;top:12px;width:32px;height:32px;border:0;border-radius:50%;background:#F1F3F6;color:#22303F;font:400 20px/1 system-ui,sans-serif;cursor:pointer;display:grid;place-items:center}
.ext-x::after{content:"";position:absolute;left:-6px;right:-6px;top:-6px;bottom:-6px}
.ext-x:hover{background:#E4E8EE}
.ext-title{margin:0 0 6px;font:800 20px/1.25 'Figtree',Inter,system-ui,sans-serif;letter-spacing:-.01em;color:#10233F}
.ext-body{margin:0 0 12px;color:#3A4757}
.ext-value{display:block;margin:0 0 12px;padding:9px 12px;border-radius:12px;background:var(--t-soft);color:#22303F;font-weight:700;font-size:14px;line-height:1.4}
.ext-value b{color:var(--t-ink)}
.ext-sample{margin:0 0 14px;padding:12px;border-radius:14px;background:#F4F6F9;border:1px solid #E6EAF0}
.ext-sample-k{margin:0 0 8px;font:800 10.5px/1 'Figtree',Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#6B7684}
.ext-sms{max-width:92%;padding:9px 12px;border-radius:16px 16px 16px 4px;background:#FFFFFF;border:1px solid #E1E6ED;color:#22303F;font-size:14px;line-height:1.45}
.ext-sms b{display:block;margin-bottom:2px;font-size:12.5px;color:#10233F}
.ext-mail{padding:10px 12px;border-radius:12px;background:#FFFFFF;border:1px solid #E1E6ED;font-size:14px;line-height:1.45;color:#22303F}
.ext-mail p{margin:0}
.ext-mail .ext-subj{margin:0 0 6px;padding-bottom:6px;border-bottom:1px solid #EDF0F4;font-weight:800;color:#10233F}
.ext-list{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:9px}
.ext-list li{position:relative;padding-left:28px;color:#22303F}
.ext-list li::before{content:"";position:absolute;left:0;top:2px;width:19px;height:19px;border-radius:50%;background:var(--t-num-bg)}
.ext-list li::after{content:"";position:absolute;left:6px;top:6.5px;width:7px;height:4px;border-left:2px solid var(--t-num-fg);border-bottom:2px solid var(--t-num-fg);transform:rotate(-45deg)}
.ext-list b{color:#10233F}
.ext-list small{display:block;color:#5B6675;font-size:13.5px;line-height:1.45}
.ext-links{margin:0 0 12px;display:flex;flex-wrap:wrap;gap:8px 14px}
.ext-links a,.ext-link{color:#10233F;font-weight:800;text-decoration:underline;text-decoration-color:var(--t);text-decoration-thickness:2px;text-underline-offset:3px}
.ext-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:10px 18px;border-radius:999px;border:0;background:#10233F;color:#FFFFFF !important;font:800 14.5px/1.1 'Figtree',Inter,system-ui,sans-serif;text-decoration:none !important;cursor:pointer}
.ext-btn:hover{background:#1B3559}
.ext-btn--gold{background:#FFC83D;color:#10233F !important}
.ext-btn--gold:hover{background:#FFD566}
.ext-btn--ghost{background:#FFFFFF;color:#10233F !important;box-shadow:inset 0 0 0 1.5px #C9D1DC}
.ext-btn--ghost:hover{background:#F4F6F9}
.ext-btn--sm{min-height:44px;padding:8px 14px;font-size:13.5px}
.ext-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px;padding-top:12px;border-top:1px solid #EDF0F4}
.ext-dots{display:flex;gap:5px;flex-wrap:wrap;justify-content:center}
.ext-dots span{width:6px;height:6px;border-radius:50%;background:#D5DBE3}
.ext-dots span.on{background:var(--t);width:16px;border-radius:999px}
.ext-back{background:transparent;border:0;color:#3A4757;font:700 14px 'Figtree',Inter,system-ui,sans-serif;cursor:pointer;padding:8px 6px}
.ext-back[disabled]{visibility:hidden}
/* Summary */
.ext-rows{list-style:none;margin:0 0 14px;padding:0;border-top:1px solid #EDF0F4}
.ext-rows li{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:9px 0;border-bottom:1px solid #EDF0F4;font-size:14.5px;line-height:1.4}
.ext-rows li span{display:flex;gap:10px;align-items:baseline}
.ext-rows li span::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--t);transform:translateY(-1px)}
.ext-rows li em{font-style:normal;flex:none;white-space:nowrap;font-size:12.5px;font-weight:800;color:var(--t-ink);background:var(--t-soft);padding:3px 9px;border-radius:999px}
.ext-promise{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0 0 14px;padding:10px 12px;border-radius:12px;background:#F4F6F9;font-size:13.5px;font-weight:700;color:#22303F}
.ext-promise span::before{content:"\2713";margin-right:6px;color:#0A7A47;font-weight:900}
.ext-cta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.ext-small{margin:0;font-size:13px;color:#5B6675}
@media (max-width:640px){
  .ext-card{left:10px !important;right:10px !important;width:auto;max-height:62vh;padding:16px 16px 12px;border-radius:16px}
  .ext-card--wide{max-height:86vh}
  .ext-title{font-size:18px}
  .ext-rows li{flex-wrap:wrap;gap:4px 10px}
  .ext-cta .ext-btn{flex:1 1 auto}
}
@media (prefers-reduced-motion:reduce){
  .ext-spot,.exo-tag,.exo-tag--mini .exo-txt{transition:none}
}
@media print{.exo,.ext-spot,.ext-card{display:none !important}}
.ext-sale{margin:0 0 12px;padding:9px 12px;border-radius:12px;background:#FFF1EC;border-left:4px solid #E5563A;color:#5A1D0E;font-size:14px;line-height:1.4}
.ext-sale b{color:#8A2410}
