/* CV2CU Design System 5.17 — shared product language */
:root{
 --cv-content:min(1240px,calc(100% - 40px));
 --cv-content-narrow:min(820px,calc(100% - 40px));
 --cv-section-space:clamp(4rem,8vw,8rem);
 --cv-control-h:48px;
 --cv-control-h-sm:40px;
 --cv-ring:0 0 0 3px rgba(var(--cv-brand-rgb),.16),0 0 0 1px rgba(var(--cv-brand-rgb),.55);
 --cv-glass-strong:color-mix(in srgb,var(--cv-surface-solid) 82%,transparent);
 --cv-gradient-brand:linear-gradient(135deg,var(--cv-brand),var(--cv-sky));
 --cv-gradient-action:linear-gradient(135deg,var(--cv-action),#FFD08A);
}
.cv-container{width:var(--cv-content);margin-inline:auto}
.cv-container--narrow{width:var(--cv-content-narrow);margin-inline:auto}
.cv-section{padding-block:var(--cv-section-space)}
.cv-eyebrow,.cv-section-label{font:800 .7rem/1.2 var(--font-display);letter-spacing:.16em;text-transform:uppercase;color:var(--cv-brand)}
.cv-display{font-family:var(--font-display);letter-spacing:-.05em;line-height:1.04}
.cv-balance{text-wrap:balance}
.cv-muted{color:var(--cv-text-soft)}
.cv-surface{background:var(--cv-surface);border:1px solid var(--cv-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.cv-surface--quiet{box-shadow:none;background:color-mix(in srgb,var(--cv-surface) 72%,transparent)}
.cv-surface--glow{position:relative;overflow:hidden}
.cv-surface--glow:before{content:"";position:absolute;inset:-30%;background:radial-gradient(circle at 15% 20%,rgba(var(--cv-brand-rgb),.12),transparent 34%),radial-gradient(circle at 90% 85%,rgba(var(--cv-action-rgb),.08),transparent 30%);pointer-events:none}
.cv-stack{display:flex;flex-direction:column;gap:var(--space-md)}
.cv-cluster{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap}
.cv-grid{display:grid;gap:var(--space-lg)}
.cv-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cv-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cv-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cv-divider{height:1px;background:linear-gradient(90deg,transparent,var(--cv-border-strong),transparent);border:0}
.cv-btn,.cv2cu-btn,.button,.wp-block-button__link{min-height:var(--cv-control-h);display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.7rem 1rem;border:1px solid transparent;border-radius:12px;cursor:pointer;text-decoration:none;transition:transform .2s var(--ease-out),box-shadow .2s,border-color .2s,background .2s,color .2s}
.cv-btn:hover,.cv2cu-btn:hover,.button:hover,.wp-block-button__link:hover{transform:translateY(-2px)}
.cv-btn:active,.cv2cu-btn:active,.button:active,.wp-block-button__link:active{transform:translateY(0) scale(.985)}
.cv-btn:focus-visible,.cv2cu-btn:focus-visible,.button:focus-visible,.wp-block-button__link:focus-visible{outline:none;box-shadow:var(--cv-ring)}
.cv-btn--primary{background:var(--cv-gradient-action);color:var(--cv-on-action);box-shadow:0 12px 30px rgba(var(--cv-action-rgb),.18)}
.cv-btn--brand{background:var(--cv-gradient-brand);color:var(--cv-on-brand);box-shadow:0 12px 30px rgba(var(--cv-brand-rgb),.16)}
.cv-btn--ghost{background:rgba(var(--cv-fg-rgb),.035);border-color:var(--cv-border);color:var(--cv-text)}
.cv-btn--ghost:hover{border-color:var(--cv-border-strong);background:rgba(var(--cv-fg-rgb),.065)}
.cv-kbd{display:inline-flex;align-items:center;justify-content:center;min-width:1.8em;padding:.18rem .42rem;border:1px solid var(--cv-border-strong);border-radius:7px;background:rgba(var(--cv-fg-rgb),.045);font:700 .68rem/1 var(--font-code);color:var(--cv-text-soft)}
.cv-status{display:inline-flex;align-items:center;gap:.4rem;padding:.34rem .62rem;border-radius:999px;border:1px solid var(--cv-border);font:750 .72rem var(--font-display)}
.cv-status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}
.cv-status--success{color:var(--cv-success);background:rgba(74,222,159,.07)}
.cv-status--warning{color:var(--cv-warning);background:rgba(var(--cv-gold-rgb),.07)}
.cv-status--danger{color:var(--cv-danger);background:rgba(255,122,138,.07)}
.cv-status--info{color:var(--cv-info);background:rgba(var(--cv-sky-rgb),.07)}
.cv2cu-reveal{animation:cv2cuReveal .65s var(--ease-out) both}
@keyframes cv2cuReveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:900px){.cv-grid--3,.cv-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){:root{--cv-content:calc(100% - 28px);--cv-content-narrow:calc(100% - 28px);--cv-section-space:clamp(3.25rem,14vw,5rem)}.cv-grid--2,.cv-grid--3,.cv-grid--4{grid-template-columns:1fr}.cv-btn,.cv2cu-btn,.button,.wp-block-button__link{min-height:46px}}
@media(prefers-reduced-motion:reduce){.cv2cu-reveal{animation:none}.cv-btn,.cv2cu-btn,.button,.wp-block-button__link{transition:none}}
@media print{.cv-surface{box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}.cv2cu-reveal{animation:none}}


/* ---------------------------------------------------------
   CV2CU 5.18 component contract
   --------------------------------------------------------- */
:root{
 --cv-elev-1:0 8px 24px rgba(var(--cv-shadow-rgb),.18);
 --cv-elev-2:0 16px 44px rgba(var(--cv-shadow-rgb),.28);
 --cv-elev-3:0 28px 90px rgba(var(--cv-shadow-rgb),.34);
 --cv-radius-sm:10px;--cv-radius-md:14px;--cv-radius-lg:20px;--cv-radius-xl:28px;
 --cv-space-1:.375rem;--cv-space-2:.625rem;--cv-space-3:.875rem;--cv-space-4:1.125rem;--cv-space-5:1.5rem;--cv-space-6:2rem;--cv-space-7:3rem;
 --cv-max:1240px;--cv-max-narrow:820px;
}
.cv2cu-product-surface{position:relative;isolation:isolate;background:var(--cv-surface);border:1px solid var(--cv-border);border-radius:var(--cv-radius-lg);box-shadow:var(--cv-elev-2);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.cv2cu-product-surface::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(var(--cv-brand-rgb),.07),transparent 38%,rgba(var(--cv-action-rgb),.035));z-index:-1}
.cv2cu-product-surface--quiet{box-shadow:var(--cv-elev-1);background:color-mix(in srgb,var(--cv-surface) 76%,transparent)}
.cv2cu-product-surface--hero{box-shadow:var(--cv-elev-3);border-color:var(--cv-border-strong)}
.cv2cu-status{display:inline-flex;align-items:center;gap:.45rem;min-height:30px;padding:.35rem .7rem;border:1px solid var(--cv-border);border-radius:999px;font:800 .7rem/1 var(--font-display);letter-spacing:.04em}
.cv2cu-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}
.cv2cu-status--success{color:var(--cv-success);background:rgba(74,222,159,.07)}
.cv2cu-status--warning{color:var(--cv-warning);background:rgba(var(--cv-gold-rgb),.07)}
.cv2cu-status--danger{color:var(--cv-danger);background:rgba(255,122,138,.07)}
.cv2cu-status--info{color:var(--cv-info);background:rgba(var(--cv-sky-rgb),.07)}
.cv2cu-surface-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--cv-space-5)}
.cv2cu-surface-grid>*{min-width:0;grid-column:span 4}
.cv2cu-section-heading{max-width:760px;margin-bottom:var(--cv-space-6)}
.cv2cu-section-heading h1,.cv2cu-section-heading h2,.cv2cu-section-heading h3{margin:.35rem 0 0;font-family:var(--font-display);letter-spacing:-.045em;line-height:1.06}
.cv2cu-section-heading p{margin:.75rem 0 0;max-width:68ch;color:var(--cv-text-soft)}
.cv2cu-metric{padding:var(--cv-space-5);border:1px solid var(--cv-border);border-radius:var(--cv-radius-md);background:rgba(var(--cv-fg-rgb),.025)}
.cv2cu-metric strong{display:block;font:800 clamp(1.5rem,3vw,2.25rem)/1 var(--font-display);letter-spacing:-.04em}
.cv2cu-metric span{display:block;margin-top:.35rem;color:var(--cv-text-soft);font-size:.76rem}
.cv2cu-divider{height:1px;border:0;background:linear-gradient(90deg,transparent,var(--cv-border-strong),transparent)}
.cv2cu-app :where(.cv2cu-content-shell,.cv2cu-main,.mcb-app-shell){min-width:0}
.cv2cu-app :where(.mcb-workspace__card,.mcb-fluent-configuration,.mcb-fluent-panels article,.mcb-workflow-lane,.mcb-setup-step,.mcb-setup-list article){border-color:var(--cv-border);border-radius:var(--cv-radius-lg)}
@media(max-width:900px){.cv2cu-surface-grid>*{grid-column:span 6}}
@media(max-width:650px){.cv2cu-surface-grid{grid-template-columns:1fr}.cv2cu-surface-grid>*{grid-column:auto}.cv2cu-product-surface{border-radius:16px}.cv2cu-section-heading{margin-bottom:var(--cv-space-5)}}
@media(prefers-reduced-motion:reduce){.cv2cu-product-surface,.cv2cu-product-surface::after{backdrop-filter:none;-webkit-backdrop-filter:none}}
