/*
 * CaseSteward storefront styling — the single source of truth.
 *
 * HISTORY: this used to live in mcn.local's Oxygen tracking-code option, which
 * meant the pricing cards, chooser and assistant were styled by ONE site's
 * database row. Any other site running these shortcodes rendered them naked —
 * the CaseSteward product site showed a pricing grid with display:block and
 * borderless cards, because the CSS simply was not there.
 *
 * The widget CSS below was lifted out of that blob and now ships with the
 * plugin, so the shortcodes look the same anywhere they are used.
 *
 * DESIGN TOKENS: every var(--t-*) carries a fallback. A site that defines the
 * McNeary tokens (mcnearydesigns.com) keeps using its own values; a site that
 * does not gets the fallback and still renders correctly. That is deliberately
 * independent of stylesheet load order, which is not something to gamble on.
 *
 * The tracking-code copy is still present on mcnearydesigns.com and still
 * wins there — identical values, so no visual change. It can be deleted from
 * that option once this has been live for a bit.
 */

/* ══ Base widget styling (lifted from tracking code) ══ */

.cs-btn {display:inline-block;background:var(--t-orange, #E69138);color:#3B2005;font-weight:700;font-size:16px;
padding:16px 30px;border:0;border-radius:var(--t-r, 10px);text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s}
.cs-btn:hover {background:#D8830F;color:#3B2005;transform:translateY(-2px);box-shadow:var(--t-glow, 0 6px 22px rgba(31,41,51,.10))}
.cs-btn--blue {background:var(--t-purple, #7B3FA0);color:#fff}
.cs-btn--blue:hover {background:#68348A;color:#fff;box-shadow:var(--t-glow, 0 6px 22px rgba(31,41,51,.10))}
.cs-btn--ghost {background:transparent;border:1.5px solid var(--t-line, #E1E8EF);color:var(--t-ink, #1F2933)}
.cs-btn--soon {background:#E7EDF3;color:var(--t-muted, #5A6672);cursor:not-allowed}
.cs-btn--soon:hover {transform:none;box-shadow:none}
.mcn-band--dark .cs-btn--blue {background:#fff;color:var(--t-ink, #1F2933)}
.px_ai_ring {position:absolute;z-index:0;border-radius:50%;aspect-ratio:1/1;pointer-events:none;
width:420px;height:420px;top:52%;left:50%;transform:translate(-50%,-50%);
box-shadow:0 0 110px 0 rgba(123,63,160,.16), inset 0 0 60px 0 rgba(61,133,198,.12)}
.px_ai_ring_inner {position:absolute;width:100%;height:100%;border-radius:50%;animation:px_psycho 10s linear 0s infinite;
box-shadow:0 1px 0 0 var(--t-blue, #3D85C6),0 -1px 0 0 var(--t-purple, #7B3FA0),1px 0 0 0 var(--t-green, #38761D),-1px 0 0 0 var(--t-green, #38761D),
1px -1px 0 0 var(--t-blue, #3D85C6),-1px 1px 0 0 var(--t-orange, #E69138),1px 1px 0 0 var(--t-purple, #7B3FA0),-1px -1px 0 0 var(--t-orange, #E69138)}
.px_ai_ring_inner_bold {box-shadow:0 5px 0 0 var(--t-blue, #3D85C6),0 -5px 0 0 var(--t-purple, #7B3FA0),5px 0 0 0 var(--t-green, #38761D),-5px 0 0 0 var(--t-green, #38761D),
5px -5px 0 0 var(--t-blue, #3D85C6),-5px 5px 0 0 var(--t-orange, #E69138),5px 5px 0 0 var(--t-purple, #7B3FA0),-5px -5px 0 0 var(--t-orange, #E69138)}
.px_ai_ring_inner_bold_blur_1 {filter:blur(15px);opacity:.5}
.px_ai_ring_inner_2 {top:10px;right:10px;animation-delay:.1s}
.px_ai_ring_inner_3 {top:10px;left:10px;animation-delay:.25s}
.px_ai_ring_inner_4 {bottom:10px;left:10px;animation-delay:.25s}
.mcn-hero .px_ai_ring {z-index:-1}
.mcn-bot-ring .px_ai_ring {width:660px;height:660px;top:50%;z-index:-1;opacity:.9}
.mcn-bot-ring .md-assistant {position:relative;z-index:2;max-width:620px;
background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
border:1px solid var(--t-line, #E1E8EF);box-shadow:0 10px 44px rgba(31,41,51,.14)}
@media(max-width:780px){
	.mcn-bot-ring .px_ai_ring{width:380px;height:380px}
}
.md-assistant {background:var(--t-tile, #FFFFFF);border:1px solid var(--t-line, #E1E8EF);border-radius:var(--t-r, 10px);padding:36px;
max-width:780px;margin:0 auto;width:100%;box-shadow:var(--t-shadow, 0 2px 14px rgba(31,41,51,.07))}
.md-bot-title {font-size:22px;font-weight:600;margin:0 0 18px;color:var(--t-ink, #1F2933)}
.md-bot-products {display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.md-bot-product {background:#fff;border:1.5px solid var(--t-line, #E1E8EF);color:var(--t-ink, #1F2933);font-weight:600;
font-family:var(--t-font, 'Plus Jakarta Sans',system-ui,sans-serif);font-size:15px;padding:12px 22px;border-radius:var(--t-pill, 50px);cursor:pointer;transition:all .15s}
.md-bot-product:hover {color:#fff}
.md-bot-product[data-product="web_development"]:hover {background:var(--t-blue, #3D85C6);border-color:var(--t-blue, #3D85C6)}
.md-bot-product[data-product="seo"]:hover {background:var(--t-green, #38761D);border-color:var(--t-green, #38761D)}
.md-bot-product[data-product="custom_crm"]:hover {background:var(--t-purple, #7B3FA0);border-color:var(--t-purple, #7B3FA0)}
.md-bot-product[data-product="casesteward"]:hover {background:var(--t-orange, #E69138);border-color:var(--t-orange, #E69138);color:#3B2005}
.md-bot-hint {font-size:15px;color:var(--t-muted, #5A6672);margin:0 0 14px}
.md-assistant textarea {width:100%;background:#fff;border:1px solid var(--t-line, #E1E8EF);border-radius:var(--t-r, 10px);
padding:16px;font-family:var(--t-font, 'Plus Jakarta Sans',system-ui,sans-serif);font-size:15px;margin-bottom:16px;box-sizing:border-box;color:var(--t-ink, #1F2933)}
.md-assistant textarea::placeholder {color:#93A1AE}
.md-bot-msg {font-size:16px;line-height:1.7;margin:0 0 10px;color:var(--t-ink, #1F2933)}
.md-bot-msg--err {color:#A33B00}
.md-bot-reply {margin-top:16px}
.cs-pricing-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--t-gap, 30px);width:100%}
.cs-tier-card {position:relative;background:var(--t-tile, #FFFFFF);border:1px solid var(--t-line, #E1E8EF);border-radius:var(--t-r, 10px);
padding:34px 28px;display:flex;flex-direction:column;box-shadow:var(--t-shadow, 0 2px 14px rgba(31,41,51,.07));transition:border-color .2s,box-shadow .2s}
.cs-tier-card:hover {box-shadow:var(--t-glow, 0 6px 22px rgba(31,41,51,.10))}
.cs-tier-card--popular {border-color:var(--t-purple, #7B3FA0)}
.cs-tier-card--match {border-color:var(--t-green, #38761D);box-shadow:0 5px 24px rgba(56,118,29,.2)}
.cs-tier-card--dark {background:var(--t-ink, #1F2933)}
.cs-tier-card--dark .cs-tier-name,.cs-tier-card--dark .cs-tier-price {color:#fff}
.cs-tier-card--dark .cs-tier-seats,.cs-tier-card--dark .cs-tier-features li,.cs-tier-card--dark .cs-tier-annual {color:rgba(255,255,255,.85)}
.cs-badge {position:absolute;top:-14px;left:26px;background:var(--t-purple, #7B3FA0);color:#fff;font-size:13px;font-weight:700;padding:6px 16px;border-radius:var(--t-pill, 50px)}
.cs-badge--once {background:var(--t-green, #38761D)}
.cs-tier-name {font-size:20px;font-weight:600;margin:8px 0 6px;color:var(--t-ink, #1F2933)}
.cs-tier-seats {font-size:15px;color:var(--t-muted, #5A6672);margin:0 0 16px}
.cs-tier-price {font-size:34px;font-weight:600;margin:0;color:var(--t-ink, #1F2933)}
.cs-tier-price span {font-size:16px;font-weight:400;color:var(--t-muted, #5A6672)}
.cs-price-tbd {font-size:16px;font-weight:500;color:var(--t-muted, #5A6672)}
.cs-tier-annual {font-size:14px;color:var(--t-muted, #5A6672);margin:4px 0 0}
.cs-tier-features {list-style:none;padding:0;margin:18px 0 26px;flex:1}
.cs-tier-features li {padding:6px 0 6px 28px;position:relative;font-size:15px;color:var(--t-ink, #1F2933)}
.cs-tier-features li::before {content:'✓';position:absolute;left:0;color:var(--t-green, #38761D);font-weight:700}
.cs-tier-features li.cs-feature-minus {color:var(--t-muted, #5A6672)}
.cs-tier-features li.cs-feature-minus::before {content:'—';color:var(--t-muted, #5A6672)}
.cs-btn--buy {text-align:center;background:var(--t-purple, #7B3FA0);color:#fff}
.cs-btn--buy:hover {background:#68348A}
.cs-tools {display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--t-gap, 30px);width:100%}
.cs-chooser {background:var(--t-tile, #FFFFFF);border:1px solid var(--t-line, #E1E8EF);border-radius:var(--t-r, 10px);padding:34px;box-shadow:var(--t-shadow, 0 2px 14px rgba(31,41,51,.07))}
.cs-chooser-title {font-size:22px;font-weight:600;margin:0 0 16px;color:var(--t-ink, #1F2933)}
.cs-chooser-label {display:block;font-weight:600;font-size:15px;margin:16px 0 8px;color:var(--t-ink, #1F2933)}
.cs-chooser input[type=range] {width:100%;accent-color:var(--t-purple, #7B3FA0)}
.cs-chooser-count {font-size:15px;margin:6px 0 0;color:var(--t-muted, #5A6672)}
.cs-chooser-result {margin-top:16px}
.cs-rec {background:#EEF6E9;border:1px solid rgba(56,118,29,.35);border-radius:var(--t-r, 10px);padding:14px 18px;margin:0;font-size:16px;color:var(--t-ink, #1F2933)}
.cs-rec a {color:var(--t-purple, #7B3FA0);font-weight:700}
.cs-demo-frame {width:100%;border:1px solid var(--t-line, #E1E8EF);border-radius:var(--t-r, 10px);overflow:hidden;box-shadow:var(--t-glow, 0 6px 22px rgba(31,41,51,.10))}
.cs-demo-frame iframe {display:block;width:100%;height:640px;border:0;background:#fff}
.cs-demo-note {text-align:center;font-size:15px;color:var(--t-muted, #5A6672);margin:16px 0 0}
.cs-demo-note a {color:var(--t-purple, #7B3FA0);font-weight:600}
@media(prefers-reduced-motion:reduce){
	.px_ai_ring_inner{animation:none}
}
@media(max-width:780px){
	.px_ai_ring{width:290px;height:290px}
}
/* ---- grid texture inside the spinning circle ---- */
.px_ai_ring::after {content:'';position:absolute;inset:6%;border-radius:50%;pointer-events:none;
background-image:
  linear-gradient(rgba(6,72,130,.16) 1px,transparent 1px),
  linear-gradient(90deg,rgba(6,72,130,.16) 1px,transparent 1px);
background-size:20px 20px;
-webkit-mask-image:radial-gradient(circle,#000 52%,transparent 80%);
mask-image:radial-gradient(circle,#000 52%,transparent 80%)}
/* the bot ring's texture is finer and dimmer so the card stays the hero */
.mcn-bot-ring .px_ai_ring::after {background-size:26px 26px;
background-image:
  linear-gradient(rgba(123,63,160,.14) 1px,transparent 1px),
  linear-gradient(90deg,rgba(123,63,160,.14) 1px,transparent 1px)}
/* ===== v14: floating assistant launcher (the spinning ring) ===== */
.mcn-fab-wrap {position:fixed;right:26px;bottom:26px;z-index:900;display:flex;flex-direction:column;
align-items:flex-end;gap:14px}
.mcn-fab {position:relative;width:76px;height:76px;border:0;padding:0;border-radius:50%;cursor:pointer;
background:#fff;box-shadow:0 8px 28px rgba(31,41,51,.22);display:flex;align-items:center;justify-content:center;
transition:transform .18s ease}
.mcn-fab:hover {transform:scale(1.06)}
/* the ring motif, scaled into the launcher */
.mcn-fab .px_ai_ring {position:absolute;inset:0;width:100%;height:100%;top:auto;left:auto;transform:none;
box-shadow:0 0 26px rgba(123,63,160,.30), inset 0 0 16px rgba(61,133,198,.18)}
.mcn-fab .px_ai_ring::after {display:none}
.mcn-fab-core {position:relative;z-index:2;width:46px;height:46px;border-radius:50%;background:#fff;
display:flex;align-items:center;justify-content:center;color:var(--t-purple, #7B3FA0)}
.mcn-fab-core svg {width:24px;height:24px}
.mcn-fab-wrap.is-open .mcn-fab {transform:scale(.92)}
.mcn-fab-panel {position:relative;width:min(420px,calc(100vw - 40px));background:#fff;border:1px solid var(--t-line, #E1E8EF);
border-radius:18px;box-shadow:0 20px 60px rgba(31,41,51,.26);padding:8px;order:-1;
animation:mcn-fab-in .18s ease}
.mcn-fab-panel .md-assistant {box-shadow:none;border:0;padding:22px;max-width:100%}
.mcn-fab-panel .md-bot-title {font-size:18px}
.mcn-fab-panel .md-bot-product {font-size:13.5px;padding:9px 16px}
.mcn-fab-close {position:absolute;top:10px;right:12px;z-index:3;background:transparent;border:0;
font-size:26px;line-height:1;color:var(--t-muted, #5A6672);cursor:pointer;padding:4px 8px;border-radius:8px}
.mcn-fab-close:hover {background:var(--t-surface, #F5F8FB);color:var(--t-ink, #1F2933)}
@media(max-width:780px){
	.mcn-fab-wrap{right:16px;bottom:16px}
	.mcn-fab{width:62px;height:62px}
	.mcn-fab-core{width:38px;height:38px}
}
@media(prefers-reduced-motion:reduce){
	.mcn-fab-panel{animation:none}
	.mcn-fab:hover{transform:none}
}
/* ===== v15: launcher ring orbits OUTSIDE the core (overlap like the hero) ===== */
.mcn-fab {background:transparent;box-shadow:none;overflow:visible;width:92px;height:92px}
.mcn-fab:hover {transform:scale(1.05)}
/* ring extends past the core on every side */
.mcn-fab .px_ai_ring {position:absolute;inset:-8px;width:auto;height:auto;top:-8px;left:-8px;right:-8px;bottom:-8px;
transform:none;box-shadow:0 0 30px rgba(123,63,160,.32), inset 0 0 18px rgba(61,133,198,.16)}
/* the white puck is now the core, not the button */
.mcn-fab-core {position:relative;z-index:2;width:60px;height:60px;border-radius:50%;background:#fff;
display:flex;align-items:center;justify-content:center;color:var(--t-purple, #7B3FA0);
box-shadow:0 6px 22px rgba(31,41,51,.24)}
.mcn-fab-core svg {width:26px;height:26px}
@media(max-width:780px){
	.mcn-fab{width:78px;height:78px}
	.mcn-fab-core{width:52px;height:52px}
	.mcn-fab-core svg{width:23px;height:23px}
}
/* sub-heads: one step down, still distinct from body */
.mcn-card h3,.cs-tier-name,.md-bot-title,.cs-chooser-title,.mcn-faq h3,.mcn-work-card h3,.mcn-work-card h2 {font-weight:500}
.cs-btn {font-weight:600}
.md-bot-product {font-weight:500}
.cs-tier-price {font-weight:400}
.cs-badge {font-weight:600}
.cs-tier-features li {font-weight:400}
.mcn-card p,.mcn-quote,.mcn-faq p,.mcn-svc-block p,.md-bot-msg {font-weight:400}
/* ===== v17: launcher rings stack concentrically like the hero ===== */
.mcn-fab {text-align:left;line-height:0}
.mcn-fab .px_ai_ring {text-align:left;line-height:0;font-size:0}
.mcn-fab .px_ai_ring_inner {top:0;left:0}
/* keep the three offset rings offset (they set their own edges) */
.mcn-fab .px_ai_ring_inner_2 {top:6px;left:auto;right:6px}
.mcn-fab .px_ai_ring_inner_3 {top:6px;left:6px;right:auto}
.mcn-fab .px_ai_ring_inner_4 {top:auto;bottom:6px;left:6px;right:auto}
/* the core re-centers itself inside the left-aligned button */
.mcn-fab {display:flex;align-items:center;justify-content:center}
/* buttons back to a consistent weight (megamenu CTA had drifted to 500) */
.mcn-mega-foot .cs-btn {font-weight:600}
.mcn-band--photo .cs-btn--blue {background:#fff;color:var(--t-ink, #1F2933)}
.mcn-band--photo .cs-btn--blue:hover {background:#EEF2F6;color:var(--t-ink, #1F2933)}
.mcn-bot-ring .px_ai_ring {display:none}
.mcn-bot-ring .md-assistant {background:var(--t-tile, #FFFFFF);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:var(--t-shadow, 0 2px 14px rgba(31,41,51,.07))}
.mcn-svc-card .cs-btn {margin-top:auto;align-self:flex-start}
.mcn-svc-card--web .cs-btn {background:var(--t-blue-btn, #3576B0);color:#fff}
.mcn-svc-card--web .cs-btn:hover,.mcn-svc-card--web .cs-btn:focus-visible {background:var(--t-blue-btn-hover, #2C6295);color:#fff}
.mcn-svc-card--seo .cs-btn {background:var(--t-green, #38761D);color:#fff}
.mcn-svc-card--seo .cs-btn:hover,.mcn-svc-card--seo .cs-btn:focus-visible {background:var(--t-green-hover, #2A5A16);color:#fff}
.mcn-svc-card--crm .cs-btn {background:var(--t-purple, #7B3FA0);color:#fff}
.mcn-svc-card--crm .cs-btn:hover,.mcn-svc-card--crm .cs-btn:focus-visible {background:var(--t-purple-hover, #68348A);color:#fff}
.svc-theme--web .cs-btn {background:var(--t-blue-btn, #3576B0);color:#fff}
.svc-theme--web .cs-btn:hover,.svc-theme--web .cs-btn:focus-visible {background:var(--t-blue-btn-hover, #2C6295);color:#fff}
.svc-theme--seo .cs-btn {background:var(--t-green, #38761D);color:#fff}
.svc-theme--seo .cs-btn:hover,.svc-theme--seo .cs-btn:focus-visible {background:var(--t-green-hover, #2A5A16);color:#fff}
.svc-theme--crm .cs-btn {background:var(--t-purple, #7B3FA0);color:#fff}
.svc-theme--crm .cs-btn:hover,.svc-theme--crm .cs-btn:focus-visible {background:var(--t-purple-hover, #68348A);color:#fff}
.mcn-band--dark .cs-btn {background:#fff;color:var(--t-ink, #1F2933)}
.mcn-band--photo .cs-btn {background:#fff;color:var(--t-ink, #1F2933)}
.mcn-band--photo .cs-btn:hover,.mcn-band--photo .cs-btn:focus-visible {background:#EEF2F6;color:var(--t-ink, #1F2933)}
.mcn-hero.mcn-band--photo .px_ai_ring {z-index:1}
.mcn-mega .cs-btn,.mcn-mega .cs-btn--blue,.mcn-nav a.cs-btn[href*="#assistant"],a.cs-btn[href*="#assistant"] {background:var(--t-navy, #064882);color:#fff;border-color:var(--t-navy, #064882)}
.mcn-mega .cs-btn:hover,.mcn-mega .cs-btn:focus-visible,a.cs-btn[href*="#assistant"]:hover,a.cs-btn[href*="#assistant"]:focus-visible {background:var(--t-navy-hover, #08599F);color:#fff}
.md-bot-send,button.cs-btn.md-bot-send {background:var(--t-navy, #064882);color:#fff}
.md-bot-send:hover,.md-bot-send:focus-visible,button.cs-btn.md-bot-send:hover,button.cs-btn.md-bot-send:focus-visible {background:var(--t-navy-hover, #08599F);color:#fff}
.md-bot-product[data-product="casesteward"]:hover,.md-bot-product[data-product="casesteward"]:focus-visible {background:var(--t-orange-deep, #B25E10);border-color:var(--t-orange-deep, #B25E10);color:#fff}
.md-bot-product[data-product="web_development"]:hover,.md-bot-product[data-product="web_development"]:focus-visible {background:var(--t-blue-btn, #3576B0);border-color:var(--t-blue-btn, #3576B0);color:#fff}
.cs-btn {font-size:17px;padding:16px 32px}
@media (max-width:700px){
	.cs-btn{font-size:16px}
}
.cs-btn {background:var(--t-orange-deep, #B25E10);color:#fff}
.cs-btn:hover,.cs-btn:focus-visible {background:#9A4F0B;color:#fff}
.cs-btn--blue {background:var(--t-purple, #7B3FA0);color:#fff}
.cs-btn--blue:hover,.cs-btn--blue:focus-visible {background:var(--t-purple-hover, #68348A);color:#fff}
.cs-btn--buy {background:var(--t-purple, #7B3FA0);color:#fff}
.cs-btn--buy:hover,.cs-btn--buy:focus-visible {background:var(--t-purple-hover, #68348A);color:#fff}
.cs-btn--ghost {background:transparent;color:var(--t-ink, #1F2933)}
.cs-btn--ghost:hover,.cs-btn--ghost:focus-visible {background:var(--t-surface, #F5F8FB);color:var(--t-ink, #1F2933)}
.cs-btn--soon,.cs-btn--soon:hover {background:#E7EDF3;color:var(--t-muted, #5A6672)}
.mcn-band--dark .cs-btn--blue,.mcn-band--photo .cs-btn--blue,.mcn-band--photo .cs-btn {background:#fff;color:var(--t-ink, #1F2933)}
.mcn-band--dark .cs-btn--blue:hover,.mcn-band--photo .cs-btn--blue:hover,.mcn-band--photo .cs-btn:hover {background:#EEF2F6;color:var(--t-ink, #1F2933)}
.md-bot-send,button.cs-btn.md-bot-send {background:var(--t-navy, #064882);color:#fff}
.md-bot-send:hover,button.cs-btn.md-bot-send:hover {background:var(--t-navy-hover, #08599F);color:#fff}
.mcn-mega .cs-btn {background:var(--t-navy, #064882);color:#fff}
.mcn-mega .cs-btn:hover {background:var(--t-navy-hover, #08599F);color:#fff}
.cs-addons {margin-top:3rem}
.cs-addons .cs-addons-title {font-size:1.5rem;margin:0 0 1.25rem}
.cs-addons .cs-addons-grid {display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.cs-addons .cs-addon {border:1px solid rgba(0,0,0,.12);border-radius:10px;padding:1.25rem;background:#fff}
.cs-addons .cs-addon .cs-addon-name {font-size:1.05rem;line-height:1.3;font-weight:600;margin:0 0 .35rem}
.cs-addons .cs-addon .cs-addon-price {font-size:1rem;font-weight:700;margin:0 0 .5rem}
.cs-addons .cs-addon .cs-addon-note {font-size:.9rem;line-height:1.5;margin:0;opacity:.75}
.cs-chooser .cs-chooser-select {display:block;width:100%;margin:0 0 1rem;padding:.6rem .75rem;border:1px solid rgba(0,0,0,.18);border-radius:8px;font:inherit;background:#fff;color:inherit}
.cs-chooser .cs-rec-note {margin:.5rem 0 0;font-size:.9rem;line-height:1.5;opacity:.8}
.cs-demo-cta {margin:1.5rem 0 .75rem;text-align:center}
.cs-demo-note {text-align:center;font-size:.9rem;opacity:.75}
.cs-chooser .cs-show-fit {display:inline-block;margin-top:1rem;cursor:pointer;border:0;font:inherit}
.cs-chooser .cs-other-wrap {margin:0 0 1rem}
.cs-chooser .cs-btn--small {padding:.4rem 1rem;font-size:.9rem;cursor:pointer;border:0}
.cs-chooser .cs-other-thanks {margin-left:.6rem;font-size:.9rem;opacity:.8}
.cs-modules {margin-top:1.5rem}
.cs-modules .cs-modules-intro {max-width:46rem;margin:0 0 2rem;font-size:1.05rem;line-height:1.6}
.cs-modules .cs-modules-grid {display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}
.cs-modules .cs-module {position:relative;border:1px solid rgba(0,0,0,.12);border-radius:10px;padding:1.4rem;background:#fff}
.cs-modules .cs-module--base {border-color:#3eb489;box-shadow:0 0 0 1px #3eb489}
.cs-modules .cs-module-badge {display:inline-block;background:#3eb489;color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:.2rem .55rem;border-radius:99px;margin-bottom:.6rem}
.cs-modules .cs-module .cs-module-name {font-size:1.05rem;font-weight:600;line-height:1.3;margin:0 0 .4rem}
.cs-modules .cs-module .cs-module-price {font-size:1.15rem;font-weight:700;margin:0 0 .6rem}
.cs-modules .cs-module .cs-module-alt {font-size:.85rem;font-weight:400;opacity:.7}
.cs-modules .cs-module .cs-module-note {font-size:.9rem;line-height:1.5;margin:0;opacity:.78}
.cs-modules .cs-modules-foot {margin-top:2rem}
.md-q {margin-top:1rem}
.md-q .md-q-progress {font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;opacity:.6;margin:0 0 .35rem}
.md-q .md-q-prompt {font-size:1.05rem;font-weight:600;line-height:1.4;margin:0 0 .9rem}
.md-q .md-q-options {display:grid;gap:.5rem;margin-bottom:.75rem}
.md-q .md-q-option {display:block;width:100%;text-align:left;font:inherit;font-size:.95rem;cursor:pointer;padding:.7rem .9rem;border:1px solid rgba(0,0,0,.18);border-radius:8px;background:#fff;color:inherit;transition:border-color .15s,box-shadow .15s}
.md-q .md-q-option:hover {border-color:#3eb489;box-shadow:0 0 0 1px #3eb489}
.md-q .md-q-back,.md-q .md-q-restart {font:inherit;font-size:.85rem;background:none;border:0;padding:.3rem 0;opacity:.7;cursor:pointer;text-decoration:underline}
.md-q--done .md-q-summary {font-size:1rem;line-height:1.55;margin:0 0 .5rem}
.md-q--done .md-q-hand {font-size:.9rem;opacity:.75;margin:0 0 1rem}

/* ══ Components added after the consolidation ══ */

/* ── Needs-based fit chooser ───────────────────────────────────────────── */
.cs-fit .cs-needs {
	display: grid;
	gap: 0.5rem;
	margin: 0.5rem 0 1rem;
}
.cs-fit .cs-need {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.95rem;
	line-height: 1.4;
	cursor: pointer;
}
.cs-fit .cs-need input { margin-top: 0.2rem; flex: 0 0 auto; }

.cs-fit-result { margin-top: 1rem; }
.cs-fit-result .cs-fit-price {
	font-size: 1.6rem;
	line-height: 1.2;
	margin: 0.25rem 0 0.75rem;
}
.cs-fit-result .cs-fit-alt {
	font-size: 0.9rem;
	font-weight: 400;
	opacity: 0.7;
}
.cs-fit-result .cs-fit-why,
.cs-fit-result .cs-fit-flags,
.cs-fit-result .cs-fit-lines {
	margin: 0 0 0.75rem;
	padding-left: 1.1rem;
	font-size: 0.92rem;
	line-height: 1.55;
}
.cs-fit-result .cs-fit-flags { opacity: 0.85; }
.cs-fit-result .cs-fit-headline {
	font-weight: 600;
	line-height: 1.5;
	margin: 0 0 0.75rem;
	padding: 0.75rem 0.9rem;
	border-left: 3px solid currentColor;
	background: rgba(127, 127, 127, 0.08);
}

/* ── Competitor comparison ─────────────────────────────────────────────── */
/*
 * Card shell copied from the assistant block (.md-assistant), whose styling
 * lives in the Oxygen tracking-code option rather than any file here. Values
 * were read off the computed style on the live page so the two blocks are the
 * same object visually — this one now sits in the slot the assistant used to
 * occupy, and a near-miss would read as a mistake rather than a pairing.
 */
.cs-compare {
	max-width: 780px;
	margin: 0;
	padding: 36px;
	background: #fff;
	color: #1f2933;
	border: 1px solid #e1e8ef;
	border-radius: 10px;
	box-shadow: 0 2px 14px rgba(31, 41, 51, 0.07);
	/* The site header is sticky; without this, scrolling to the section puts
	   its title underneath the header. */
	scroll-margin-top: 6rem;
}
.cs-compare .cs-compare-title {
	font-size: 22px;
	font-weight: 500;
	line-height: 1.3;
	margin: 0 0 18px;
	color: #1f2933;
}

@media (max-width: 600px) {
	.cs-compare { padding: 22px; }
}
.cs-compare .cs-compare-intro,
.cs-compare .cs-compare-count { margin: 0 0 0.75rem; }
.cs-compare .cs-compare-label { display: block; font-weight: 600; margin-bottom: 0.35rem; }
.cs-compare input[type="range"] { width: 100%; max-width: 26rem; display: block; }
.cs-compare .cs-compare-count { font-size: 0.95rem; opacity: 0.8; }

/* Wide tables must scroll inside themselves, never the page. */
.cs-compare .cs-compare-table { overflow-x: auto; }
.cs-compare .cs-compare-grid {
	width: 100%;
	min-width: 30rem;
	border-collapse: collapse;
	margin-top: 0.5rem;
}
.cs-compare .cs-compare-grid th,
.cs-compare .cs-compare-grid td {
	text-align: left;
	padding: 0.75rem 0.9rem;
	border-bottom: 1px solid rgba(127, 127, 127, 0.25);
	vertical-align: top;
}
.cs-compare .cs-compare-grid th { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; opacity: 0.7; }
.cs-compare .cs-compare-grid .cs-compare-price { text-align: right; white-space: nowrap; font-weight: 700; }
.cs-compare .cs-compare-grid .cs-compare-note {
	font-size: 0.85rem;
	line-height: 1.45;
	opacity: 0.72;
	margin-top: 0.2rem;
	max-width: 34rem;
}
.cs-compare .cs-compare-grid .cs-row-ours { background: rgba(9, 105, 218, 0.07); }
.cs-compare .cs-peer-tag {
	display: inline-block;
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 0.1rem 0.4rem;
	border-radius: 999px;
	background: rgba(127, 127, 127, 0.2);
	vertical-align: middle;
}
.cs-compare .cs-compare-caveat,
.cs-compare .cs-compare-foot {
	font-size: 0.85rem;
	line-height: 1.55;
	opacity: 0.75;
	margin-top: 0.9rem;
	max-width: 46rem;
}

/* ── "Get only what you need" card + guided builder ────────────────────── */
.cs-tier-card--alt { border-style: dashed; }
.cs-tier-card--alt .cs-tier-price--from { font-size: 1.1rem; opacity: 0.9; }
.cs-badge--alt { background: #1f2933; color: #fff; }

.md-build .md-build-intro { font-size: 0.9rem; line-height: 1.5; opacity: 0.8; margin: 0 0 0.75rem; }
.md-build .md-build-list { display: grid; gap: 0.4rem; margin-bottom: 0.9rem; }
.md-build .md-build-row {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 0.55rem;
	align-items: start;
	padding: 0.5rem 0.6rem;
	border: 1px solid rgba(127, 127, 127, 0.22);
	border-radius: 8px;
	cursor: pointer;
	font-size: 0.9rem;
}
.md-build .md-build-row.is-base { opacity: 0.75; cursor: default; }
.md-build .md-build-note { display: block; font-size: 0.8rem; line-height: 1.4; opacity: 0.7; }
.md-build .md-build-price { white-space: nowrap; font-weight: 600; font-size: 0.85rem; }
.md-build .md-build-total { font-size: 1.05rem; margin: 0 0 0.75rem; }
.md-build-err { color: #b42318; font-size: 0.85rem; line-height: 1.5; margin-top: 0.6rem; }

/* ── Intake page: one centred column ───────────────────────────────────── */
/*
 * The Oxygen shortcode wrapper runs the full width of the section, so the form
 * and the plan confirmation sit hard against the left edge of a very wide
 * band. Selected by what the wrapper CONTAINS rather than by its generated
 * class (.oxy-shortcode-31-3) or a page id — both of those are per-install and
 * would silently stop matching on production, where the page has different ids.
 */
.oxy-shortcode:has(.gform_wrapper),
.oxy-shortcode:has(.cs-plan-confirm) {
	max-width: 780px;
	margin-left: auto;
	margin-right: auto;
}

/* ── Plan confirmation on the intake page ──────────────────────────────── */
.cs-plan-confirm {
	border: 1px solid #e1e8ef;
	border-left: 4px solid #0969da;
	border-radius: 10px;
	padding: 1.1rem 1.3rem;
	margin: 0 auto 1.5rem;
	background: #fff;
	max-width: 780px;
}
.cs-plan-confirm .cs-plan-confirm-eyebrow {
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	opacity: 0.6;
	margin: 0 0 0.2rem;
}
.cs-plan-confirm .cs-plan-confirm-plan { font-size: 1.2rem; margin: 0 0 0.15rem; }
.cs-plan-confirm .cs-plan-confirm-detail { font-size: 0.95rem; opacity: 0.8; margin: 0 0 0.5rem; }
.cs-plan-confirm .cs-plan-confirm-note { font-size: 0.85rem; line-height: 1.55; opacity: 0.8; margin: 0; }