/*
 * WP24x7 component styles + design tokens.
 *
 * Single source of truth for the token-based components ported from the Astro
 * frontend (src/components/library/*.astro). Loading this in the block editor
 * (and the WP front-end fallback) makes each block's render.php preview render
 * with the SAME colours/spacing as the live Astro site.
 *
 * Tokens mirror wp24x7-frontend/src/layouts/Layout.astro :root.
 * Per-component rule blocks are appended below as each block is implemented
 * (de-scoped from its .astro <style>). Keep selectors here in sync with the
 * class names emitted by both render.php and the matching .astro component.
 *
 * @package WP24x7
 */

:root {
  --accent: #21759b;
  --accent-dark: #164a63;
  --primary: #1d9e75;
  --primary-dark: #0f6e56;
  --primary-soft: #e8f5f0;
  --accent-cta: #d85a30;
  --accent-cta-soft: #fae8e0;
  --dark: #0b0f18;
  --dark-2: #0f6e56;
  --surface: #f8f7f3;
  --ink: #111827;
  --muted: #6b7280;
  --muted-2: #9ca3af;
  --line: #e5e3dc;
  --bg: #ffffff;
  --bg-soft: #f8f7f3;
  --color-warning: #d97706;
  --color-error: #dc2626;
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Animations shared by several components (pulsing status dots, hero progress bar). */
@keyframes pulse { 0%, 100% { opacity: 1 } 50% { opacity: .3 } }
@keyframes fill-bar { 0% { width: 0% } 65% { width: 68% } 100% { width: 68% } }

/* ==========================================================================
   Per-component styles are appended below as each block is implemented.
   e.g. .ui-tag, .alert-block, .status-label, .service-status-list, …
   ========================================================================== */

/* --- acf/tag (Tag.astro) --------------------------------------------------- */
.ui-tag { display:inline-flex; align-items:center; gap:.4rem; font-size:.85rem; font-weight:600; padding:.3rem .75rem; border-radius:999px; border:1px solid transparent; line-height:1.2; font-family:var(--font-sans); }
.ui-tag--success { color:var(--primary-dark); background:var(--primary-soft); border-color:color-mix(in srgb, var(--primary,#1d9e75) 25%, transparent); }
.ui-tag--warning { color:#92620a; background:#fef3d9; border-color:rgba(234,179,8,.3); }
.ui-tag--neutral { color:var(--muted); background:var(--bg-soft); border-color:var(--line); }
.ui-tag-remove { appearance:none; background:none; border:none; padding:0; margin:0; display:inline-flex; align-items:center; justify-content:center; width:1rem; height:1rem; color:inherit; opacity:.65; cursor:pointer; border-radius:999px; }
.ui-tag-remove:hover { opacity:1; background:rgba(0,0,0,.08); }
.ui-tag-remove:focus-visible { outline:2px solid var(--primary); outline-offset:1px; }

/* --- acf/status-label (StatusLabel.astro) ---------------------------------- */
.status-label { display:inline-flex; align-items:center; gap:.4rem; font-family:var(--font-sans); font-size:.8125rem; font-weight:600; color:var(--ink); line-height:1; }
.status-label-dot { width:.5rem; height:.5rem; flex-shrink:0; border-radius:50%; background:var(--dot-color); }
.status-label-dot.is-pulsing { animation:status-label-pulse 1.8s ease-out infinite; }
@keyframes status-label-pulse { 0% { box-shadow:0 0 0 0 color-mix(in srgb, var(--dot-color) 55%, transparent); } 70% { box-shadow:0 0 0 6px transparent; } 100% { box-shadow:0 0 0 0 transparent; } }
@media (prefers-reduced-motion: reduce) { .status-label-dot.is-pulsing { animation:none; } }

/* --- acf/alert (Alert.astro) ----------------------------------------------- */
.alert-block { display:flex; align-items:flex-start; gap:.75rem; padding:1rem 1.1rem; border-radius:12px; border:1px solid transparent; transition:opacity .2s ease, transform .2s ease; font-family:var(--font-sans); }
.alert-block.is-dismissed { opacity:0; transform:translateY(-4px); }
.alert-icon { width:22px; height:22px; flex-shrink:0; margin-top:.05rem; }
.alert-body { flex:1; min-width:0; }
.alert-title { margin:0; font-weight:700; font-size:.95rem; }
.alert-message { margin-top:.2rem; font-size:.88rem; line-height:1.5; opacity:.9; }
.alert-message p { margin:0; }
.alert-dismiss { flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; padding:0; background:transparent; border:none; border-radius:6px; color:currentColor; opacity:.6; cursor:pointer; }
.alert-dismiss:hover { opacity:1; background:rgba(0,0,0,.06); }
.alert-dismiss svg { width:14px; height:14px; }
.alert-block--success { color:var(--primary-dark); background:var(--primary-soft); border-color:color-mix(in srgb, var(--primary,#1d9e75) 25%, transparent); }
.alert-block--warning { color:#92620a; background:#fef3d9; border-color:rgba(234,179,8,.3); }
.alert-block--error { color:#b91c1c; background:#fde2e2; border-color:rgba(239,68,68,.3); }
.alert-block--info { color:#1d4ed8; background:#e0ecff; border-color:rgba(59,130,246,.3); }

/* --- acf/featured-image (FeaturedImage.astro) ------------------------------ */
.featured-image { --featured-image-height:260px; margin:0; border-radius:14px; overflow:hidden; border:1px solid var(--line); background:var(--surface); font-family:var(--font-sans); }
.featured-image__img { display:block; width:100%; height:var(--featured-image-height); object-fit:cover; }
.featured-image__placeholder { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; height:var(--featured-image-height); color:var(--muted-2); background:repeating-linear-gradient(135deg, var(--surface), var(--surface) 10px, #f0efe9 10px, #f0efe9 20px); font-size:.85rem; font-weight:600; }
.featured-image__caption { display:flex; align-items:baseline; justify-content:space-between; gap:.75rem; padding:.65rem .9rem; font-size:.8rem; color:var(--muted); border-top:1px solid var(--line); }
.featured-image__caption-text { color:var(--ink); font-weight:500; }
.featured-image__credit { white-space:nowrap; font-style:italic; }

/* --- acf/status-banner (StatusBanner.astro) -------------------------------- */
.status-banner { display:flex; align-items:center; gap:.9rem; padding:1rem 1.25rem; border-radius:.75rem; background:var(--banner-bg); border:1px solid color-mix(in srgb, var(--banner-color) 25%, transparent); font-family:var(--font-sans); }
.status-banner-dot { flex-shrink:0; width:.75rem; height:.75rem; border-radius:50%; background:var(--banner-color); box-shadow:0 0 0 4px color-mix(in srgb, var(--banner-color) 18%, transparent); }
.status-banner-copy { flex:1; min-width:0; }
.status-banner-label { margin:0; font-weight:700; font-size:.95rem; color:var(--banner-color); }
.status-banner-message { margin:.15rem 0 0; font-size:.875rem; color:var(--ink); }
.status-banner-checked { flex-shrink:0; margin:0; font-size:.75rem; color:var(--muted); white-space:nowrap; }
@media (max-width:640px){ .status-banner { flex-wrap:wrap; } .status-banner-checked { width:100%; } }

/* --- acf/empty-state (EmptyState.astro) ------------------------------------ */
.es-wrap { display:flex; justify-content:center; font-family:var(--font-sans); }
.es-card { max-width:480px; width:100%; text-align:center; position:relative; }
.es-status { display:inline-block; margin-bottom:1rem; padding:.25rem .75rem; border-radius:999px; background:var(--surface); border:1px solid var(--line); color:var(--muted); font-size:.75rem; font-weight:600; letter-spacing:.03em; text-transform:uppercase; }
.es-icon { display:flex; align-items:center; justify-content:center; width:4.5rem; height:4.5rem; margin:0 auto 1.5rem; border-radius:999px; background:var(--primary-soft, var(--surface)); color:var(--primary); }
.es-icon svg { width:2rem; height:2rem; }
.es-heading { margin:0 0 .5rem; font-size:1.35rem; font-weight:700; color:var(--ink); }
.es-message { margin:0 auto 1.5rem; max-width:380px; color:var(--muted); line-height:1.6; }
.es-actions { display:flex; justify-content:center; }
.es-btn { display:inline-flex; align-items:center; justify-content:center; padding:.6rem 1.25rem; border-radius:8px; background:var(--primary); color:#fff; font-weight:600; font-size:.9rem; text-decoration:none; }
.es-btn:hover { background:var(--primary-dark); }

/* --- acf/invoice-row (InvoiceRow.astro) ------------------------------------ */
.invoice-row { display:flex; align-items:flex-start; justify-content:space-between; gap:1.25rem; padding:1.1rem 1.25rem; background:#fff; border:1px solid var(--line); border-radius:12px; font-family:var(--font-sans); }
.invoice-row--compact { padding:.8rem 1rem; border-radius:10px; }
.invoice-row-main { min-width:0; flex:1; }
.invoice-row-heading { display:flex; align-items:center; flex-wrap:wrap; gap:.6rem; margin-bottom:.35rem; }
.invoice-row-number { font-family:var(--font-mono); font-size:.9rem; font-weight:700; color:var(--ink); }
.invoice-row--compact .invoice-row-number { font-size:.82rem; }
.invoice-row-status { display:inline-flex; align-items:center; font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:.22rem .55rem; border-radius:999px; border:1px solid transparent; line-height:1; }
.invoice-row-status--success { color:var(--primary-dark); background:var(--primary-soft); border-color:color-mix(in srgb, var(--primary,#1d9e75) 25%, transparent); }
.invoice-row-status--warning { color:#92620a; background:#fef3d9; border-color:rgba(234,179,8,.3); }
.invoice-row-status--danger { color:#b91c1c; background:#fde2e2; border-color:rgba(239,68,68,.3); }
.invoice-row-status--neutral { color:var(--muted); background:var(--surface); border-color:var(--line); }
.invoice-row-desc { font-size:.88rem; color:var(--muted); line-height:1.5; margin-bottom:.35rem; }
.invoice-row-desc p { margin:0; }
.invoice-row-date { font-size:.78rem; color:var(--muted-2); }
.invoice-row-aside { flex-shrink:0; display:flex; flex-direction:column; align-items:flex-end; gap:.5rem; }
.invoice-row-amount { font-family:var(--font-mono); font-size:1.05rem; font-weight:700; color:var(--ink); white-space:nowrap; }
.invoice-row--compact .invoice-row-amount { font-size:.92rem; }
.invoice-row-download { display:inline-flex; align-items:center; gap:.35rem; font-size:.78rem; font-weight:600; color:var(--primary-dark); text-decoration:none; white-space:nowrap; }
.invoice-row-download:hover { text-decoration:underline; }

/* --- acf/header-search (HeaderSearch.astro) -------------------------------- */
.header-search { position:relative; font-family:var(--font-sans); width:100%; }
.header-search .hs-form { position:relative; display:flex; align-items:center; }
.header-search .hs-icon { position:absolute; left:14px; color:var(--muted); pointer-events:none; }
.header-search .hs-input { width:100%; border:1px solid var(--line); border-radius:999px; padding:10px 40px 10px 40px; font-size:.92rem; font-family:var(--font-sans); background:#f9fafb; color:var(--ink); min-height:44px; transition:border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.header-search .hs-input:focus { outline:none; border-color:var(--primary); background:#fff; box-shadow:0 0 0 3px color-mix(in srgb, var(--primary,#1d9e75) 15%, transparent); }
.header-search.is-mobile { width:auto; display:flex; justify-content:flex-end; }
.header-search.is-mobile .hs-toggle { display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%; border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer; }
.header-search.is-mobile .hs-form { display:none; }

/* --- acf/author-bio (AuthorBio.astro) -------------------------------------- */
.author-bio { container-type:inline-size; font-family:var(--font-sans); }
.author-bio .block-inner { display:flex; gap:1.25rem; align-items:flex-start; padding:1.5rem; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.author-bio .avatar-photo { width:64px; height:64px; border-radius:50%; object-fit:cover; display:block; flex-shrink:0; }
.author-bio .avatar-fallback { width:64px; height:64px; border-radius:50%; flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:1.4rem; color:#fff; background:linear-gradient(135deg, var(--dark), var(--primary-dark, var(--primary))); }
.author-bio .content { min-width:0; flex:1; }
.author-bio .heading-row { display:flex; align-items:flex-start; justify-content:space-between; gap:.75rem; }
.author-bio .name { margin:0; font-weight:700; color:var(--ink); font-size:1.05rem; }
.author-bio .role { margin:.15rem 0 0; font-size:.85rem; color:var(--muted); }
.author-bio .linkedin-link { flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; color:var(--muted); background:#fff; border:1px solid var(--line); transition:color .15s ease, border-color .15s ease; }
.author-bio .linkedin-link:hover { color:var(--primary); border-color:var(--primary); }
.author-bio .bio { margin:.65rem 0 0; color:var(--muted); font-size:.92rem; line-height:1.6; }
.author-bio .articles-link { margin-top:.85rem; display:inline-flex; align-items:center; gap:.35rem; font-size:.85rem; font-weight:600; color:var(--primary); text-decoration:none; }
.author-bio .articles-link svg { transition:transform .15s ease; }
.author-bio .articles-link:hover svg { transform:translateX(2px); }

/* --- acf/button-group (ButtonGroup.astro) — InnerBlocks container ----------- */
.ui-btn-group--stacked { display:flex; flex-direction:column; gap:.75rem; }
.ui-btn-group--stacked > .wp-block-button { width:100%; }
.ui-btn-group--stacked > .wp-block-button .wp-block-button__link { display:block; text-align:center; }
.ui-btn-group--segmented { display:inline-flex; border:1px solid var(--line); border-radius:8px; overflow:hidden; width:fit-content; }
/* Raw <button> children (frontend Button components) */
.ui-btn-group--segmented button { border:none; border-right:1px solid var(--line); background:#fff; padding:10px 18px; font-family:var(--font-sans); font-size:.85rem; font-weight:600; color:var(--muted); cursor:pointer; transition:background .15s ease, color .15s ease; }
.ui-btn-group--segmented button:last-child { border-right:none; }
.ui-btn-group--segmented button:hover { background:var(--surface); }
.ui-btn-group--segmented button[aria-pressed='true'] { background:var(--primary); color:#fff; }
/* Core button children (editor InnerBlocks) styled to match the segmented look */
.ui-btn-group--segmented > .wp-block-button { margin:0; }
.ui-btn-group--segmented > .wp-block-button:not(:last-child) .wp-block-button__link { border-right:1px solid var(--line); }
.ui-btn-group--segmented > .wp-block-button .wp-block-button__link { border-radius:0; background:#fff; color:var(--muted); padding:10px 18px; font-weight:600; }

/* --- acf/trust-badge-row (TrustBadgeRow.astro) ----------------------------- */
.trust-badge-row__caption { margin:0 0 1.25rem; text-align:center; font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-family:var(--font-sans); }
.trust-badge-row__list { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.6rem 1rem; margin:0; padding:0; list-style:none; }
.trust-badge-row__item { display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .9rem; border-radius:999px; border:1px solid var(--line); background:var(--bg-soft); color:var(--ink); font-size:.85rem; font-weight:600; white-space:nowrap; font-family:var(--font-sans); }
.trust-badge-row__icon { width:1.1rem; height:1.1rem; flex:0 0 auto; color:var(--primary); }

/* --- acf/live-ticker (LiveTicker.astro) — fixed corner pill ---------------- */
.live-ticker { position:fixed; bottom:1.25rem; z-index:40; display:inline-flex; align-items:center; gap:.65rem; max-width:min(360px, calc(100vw - 2.5rem)); padding:.7rem 1.1rem; border-radius:999px; background:var(--dark); color:#fff; box-shadow:0 10px 30px -8px rgba(0,0,0,.35); font-family:var(--font-sans); font-size:.82rem; line-height:1.35; }
.live-ticker--bottom-left { left:1.25rem; }
.live-ticker--bottom-right { right:1.25rem; }
.live-ticker__dot { flex:0 0 auto; width:.55rem; height:.55rem; border-radius:50%; background:var(--primary); animation:live-ticker-pulse 2s ease-out infinite; }
@keyframes live-ticker-pulse { 0% { box-shadow:0 0 0 0 color-mix(in srgb, var(--primary,#1d9e75) 55%, transparent); } 70% { box-shadow:0 0 0 8px transparent; } 100% { box-shadow:0 0 0 0 transparent; } }
.live-ticker__viewport { position:relative; flex:1 1 auto; min-height:1.1em; }
.live-ticker__msg { margin:0; display:none; }
.live-ticker__msg.is-active { display:block; }

/* --- acf/currency-switcher (CurrencySwitcher.astro) ------------------------ */
.currency-switcher-block { display:inline-flex; }
.currency-switcher-block .block-inner { display:flex; flex-direction:column; align-items:center; gap:.5rem; background:var(--bg,#fff); border:1px solid var(--line); border-radius:14px; padding:.85rem 1rem; }
.currency-switcher-block .dropdown-switcher { position:relative; font-family:var(--font-sans); }
.currency-switcher-block .switcher-trigger { display:inline-flex; align-items:center; gap:.4rem; background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:.5rem .9rem; font:inherit; font-size:.85rem; font-weight:600; color:var(--ink); cursor:pointer; transition:border-color .15s ease, color .15s ease; }
.currency-switcher-block .switcher-trigger:hover { border-color:var(--primary); }
.currency-switcher-block .switcher-symbol { color:var(--primary); font-weight:700; }
.currency-switcher-block .switcher-chevron { color:var(--muted); transition:transform .15s ease; flex-shrink:0; }
.currency-switcher-block .dropdown-switcher.open .switcher-trigger { color:var(--primary); border-color:var(--primary); }
.currency-switcher-block .dropdown-switcher.open .switcher-chevron { transform:rotate(180deg); }
.currency-switcher-block .switcher-menu { position:absolute; top:100%; left:50%; transform:translate(-50%,-6px); margin:.5rem 0 0; padding:.4rem; min-width:200px; list-style:none; background:var(--bg,#fff); border:1px solid var(--line); border-radius:10px; box-shadow:0 12px 32px rgba(0,0,0,.14); opacity:0; visibility:hidden; transition:opacity .15s ease, transform .15s ease, visibility .15s; z-index:40; }
.currency-switcher-block .dropdown-switcher.open .switcher-menu { opacity:1; visibility:visible; transform:translate(-50%,0); }
.currency-switcher-block .switcher-option { display:flex; align-items:center; gap:.5rem; width:100%; background:none; border:none; border-radius:6px; padding:.5rem .6rem; font:inherit; font-size:.85rem; color:var(--ink); text-align:left; cursor:pointer; }
.currency-switcher-block .switcher-option:hover { background:var(--surface); }
.currency-switcher-block .switcher-option[aria-selected='true'] { color:var(--primary); font-weight:700; }
.currency-switcher-block .opt-symbol { font-weight:700; color:var(--primary); min-width:1.4ch; }
.currency-switcher-block .opt-code { font-weight:700; color:var(--muted); min-width:3ch; }
.currency-switcher-block .switcher-note { margin:0; font-size:.75rem; color:var(--muted); text-align:center; max-width:220px; }

/* --- acf/language-switcher (LanguageSwitcher.astro) ------------------------ */
.language-switcher-block { display:inline-flex; }
.language-switcher-block .block-inner { display:inline-flex; background:var(--bg,#fff); border:1px solid var(--line); border-radius:14px; padding:.85rem 1rem; }
.language-switcher-block .dropdown-switcher { position:relative; font-family:var(--font-sans); }
.language-switcher-block .switcher-trigger { display:inline-flex; align-items:center; gap:.45rem; background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:.5rem .9rem; font:inherit; font-size:.85rem; font-weight:600; color:var(--ink); cursor:pointer; transition:border-color .15s ease, color .15s ease; }
.language-switcher-block .switcher-trigger:hover { border-color:var(--primary); }
.language-switcher-block .switcher-icon { color:var(--muted); flex-shrink:0; }
.language-switcher-block .switcher-label { color:var(--muted); font-weight:500; }
.language-switcher-block .switcher-chevron { color:var(--muted); transition:transform .15s ease; flex-shrink:0; }
.language-switcher-block .dropdown-switcher.open .switcher-trigger { color:var(--primary); border-color:var(--primary); }
.language-switcher-block .dropdown-switcher.open .switcher-chevron { transform:rotate(180deg); }
.language-switcher-block .switcher-menu { position:absolute; top:100%; left:0; margin:.5rem 0 0; padding:.4rem; min-width:180px; list-style:none; background:var(--bg,#fff); border:1px solid var(--line); border-radius:10px; box-shadow:0 12px 32px rgba(0,0,0,.14); opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .15s ease, transform .15s ease, visibility .15s; z-index:40; }
.language-switcher-block .dropdown-switcher.open .switcher-menu { opacity:1; visibility:visible; transform:translateY(0); }
.language-switcher-block .switcher-option { display:flex; align-items:center; gap:.5rem; width:100%; background:none; border:none; border-radius:6px; padding:.5rem .6rem; font:inherit; font-size:.85rem; color:var(--ink); text-align:left; cursor:pointer; }
.language-switcher-block .switcher-option:hover { background:var(--surface); }
.language-switcher-block .switcher-option[aria-selected='true'] { color:var(--primary); font-weight:700; }
.language-switcher-block .opt-code { font-weight:700; color:var(--muted); min-width:2ch; }
.language-switcher-block .switcher-option[aria-selected='true'] .opt-code { color:var(--primary); }
.language-switcher-block.is-mobile, .language-switcher-block.is-mobile .block-inner { display:flex; width:100%; }
.language-switcher-block.is-mobile .dropdown-switcher { width:100%; }
.language-switcher-block.is-mobile .switcher-trigger { width:100%; justify-content:center; border-radius:10px; }

/* --- acf/uptime-strip (UptimeStrip.astro) ---------------------------------- */
.uptime-strip { font-family:var(--font-sans); }
.uptime-strip-head { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:.6rem; }
.uptime-strip-title { margin:0; font-weight:600; font-size:.9375rem; color:var(--ink); }
.uptime-strip-percent { margin:0; font-weight:700; font-size:.9375rem; color:var(--primary-dark, var(--primary)); font-family:var(--font-mono, var(--font-sans)); }
.uptime-strip-bars { display:flex; align-items:stretch; gap:2px; height:2.25rem; }
.uptime-strip-bar { flex:1; min-width:2px; border-radius:2px; background:var(--bar-color); opacity:.85; transition:opacity .15s ease, transform .15s ease; }
.uptime-strip-bar:hover { opacity:1; transform:scaleY(1.05); }
.uptime-strip-bar.is-incident { box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--bar-color) 70%, black); }
.uptime-strip-labels { display:flex; justify-content:space-between; margin-top:.4rem; font-size:.75rem; color:var(--muted); }

/* --- acf/service-status-list (ServiceStatusList.astro) --------------------- */
.service-status-list { font-family:var(--font-sans); }
.service-status-items { list-style:none; margin:0; padding:0; border:1px solid var(--line); border-radius:.75rem; overflow:hidden; background:var(--bg); }
.service-status-item { display:flex; align-items:center; gap:.75rem; padding:.9rem 1.1rem; }
.service-status-item + .service-status-item { border-top:1px solid var(--line); }
.service-status-dot { flex-shrink:0; width:.6rem; height:.6rem; border-radius:50%; background:var(--dot-color); }
.service-status-copy { flex:1; min-width:0; }
.service-status-name { margin:0; font-weight:600; font-size:.9375rem; color:var(--ink); }
.service-status-desc { margin:.15rem 0 0; font-size:.8125rem; color:var(--muted); }
.service-status-badge { flex-shrink:0; font-size:.8125rem; font-weight:700; }

/* --- acf/incident-history (IncidentHistory.astro) -------------------------- */
.incident-history { font-family:var(--font-sans); }
.incident-history-empty { margin:0; padding:1rem 1.1rem; border:1px dashed var(--line); border-radius:.75rem; color:var(--muted); font-size:.9rem; text-align:center; }
.incident-history-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.75rem; }
.incident-history-item { border:1px solid var(--line); border-radius:.75rem; padding:1rem 1.1rem; background:var(--bg); }
.incident-history-item-head { display:flex; align-items:baseline; justify-content:space-between; gap:.75rem; }
.incident-history-item-title { margin:0; font-weight:600; font-size:.9375rem; color:var(--ink); }
.incident-history-badge { flex-shrink:0; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.02em; }
.incident-history-date { margin:.25rem 0 0; font-size:.75rem; color:var(--muted); }
.incident-history-desc { margin:.5rem 0 0; font-size:.8125rem; color:var(--ink); line-height:1.6; }

/* --- acf/partner-badge-row (PartnerBadgeRow.astro) ------------------------- */
.partner-badge-row .heading { margin:0 0 1.25rem; text-align:center; font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-family:var(--font-sans); }
.partner-badge-row .badge-list { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:2.25rem; list-style:none; margin:0; padding:0; }
.partner-badge-row .badge { display:inline-flex; align-items:center; justify-content:center; color:inherit; text-decoration:none; }
.partner-badge-row .badge img { display:block; max-height:40px; width:auto; filter:grayscale(100%); opacity:.6; transition:filter .25s ease, opacity .25s ease, transform .25s ease; }
.partner-badge-row .badge:hover img { filter:grayscale(0%); opacity:1; transform:scale(1.04); }
.partner-badge-row .badge-fallback { font-weight:700; font-size:1.05rem; color:var(--muted); filter:grayscale(100%); opacity:.6; transition:filter .25s ease, opacity .25s ease, color .25s ease; font-family:var(--font-sans); }
.partner-badge-row .badge:hover .badge-fallback { filter:grayscale(0%); opacity:1; color:var(--primary); }

/* --- acf/icon-box-grid (IconBoxGrid.astro) — for dark sections ------------- */
.icon-box-grid-heading { font-family:var(--font-sans); font-size:1.5rem; font-weight:700; color:#fff; text-align:center; margin:0 0 1.75rem; }
.icon-box-grid-list { display:grid; grid-template-columns:repeat(var(--ibg-cols,4),1fr); gap:1.25rem; }
.icon-box { background:#111b28; border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:1.4rem 1.3rem; display:flex; flex-direction:column; gap:.6rem; transition:transform .2s ease, box-shadow .2s ease; }
.icon-box:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(0,0,0,.25); }
.icon-box-icon { width:40px; height:40px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:color-mix(in srgb, var(--primary,#1d9e75) 16%, transparent); color:var(--primary); font-size:1.15rem; }
.icon-box-icon img { width:20px; height:20px; object-fit:contain; }
.icon-box-title { font-family:var(--font-sans); font-size:1rem; font-weight:700; color:#fff; margin:0; }
.icon-box-desc { font-family:var(--font-sans); font-size:.85rem; line-height:1.5; color:rgba(255,255,255,.6); margin:0; }
@media (max-width:900px){ .icon-box-grid-list { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .icon-box-grid-list { grid-template-columns:1fr; } }

/* --- acf/related-articles (RelatedArticles.astro) -------------------------- */
.related-articles { font-family:var(--font-sans); }
.related-articles .reason { margin:0 0 1rem; font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--primary); }
.related-articles .article-list { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:1.1rem; list-style:none; margin:0; padding:0; }
.related-articles .article-card { display:flex; flex-direction:column; height:100%; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--surface); color:inherit; text-decoration:none; transition:box-shadow .18s ease, transform .18s ease; }
.related-articles .article-card:hover { box-shadow:0 10px 24px rgba(11,15,24,.08); transform:translateY(-2px); }
.related-articles .thumb { aspect-ratio:16/9; width:100%; object-fit:cover; display:block; background:var(--line); }
.related-articles .thumb-fallback { display:flex; align-items:center; justify-content:center; font-weight:800; font-size:1.4rem; color:#fff; background:linear-gradient(135deg, var(--dark), var(--primary-dark, var(--primary))); }
.related-articles .body { padding:.9rem 1rem 1.1rem; display:flex; flex-direction:column; gap:.35rem; flex:1; }
.related-articles .category { align-self:flex-start; font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--primary); }
.related-articles .title { margin:0; font-size:1rem; font-weight:700; color:var(--ink); line-height:1.35; }
.related-articles .title mark, .related-articles .excerpt mark { background:var(--primary-soft, var(--surface)); color:inherit; padding:0 .1em; border-radius:2px; }
.related-articles .excerpt { margin:0; font-size:.85rem; color:var(--muted); line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.related-articles .date { margin-top:auto; padding-top:.4rem; font-size:.75rem; color:var(--muted); }

/* --- acf/tabs (Tabs.astro) ------------------------------------------------- */
.tabs-block { width:100%; font-family:var(--font-sans); }
.tabs-empty { color:var(--muted); font-size:.95rem; padding:1rem 0; }
.tabs-list { display:flex; flex-wrap:wrap; gap:.25rem; border-bottom:1px solid var(--line); margin-bottom:1.25rem; }
.tabs-tab { appearance:none; background:none; border:none; border-bottom:2px solid transparent; padding:.65rem 1rem; font:inherit; font-weight:600; font-size:.95rem; color:var(--muted); cursor:pointer; margin-bottom:-1px; transition:color .15s ease, border-color .15s ease; }
.tabs-tab:hover { color:var(--ink); }
.tabs-tab.is-active { color:var(--primary-dark); border-color:var(--primary); }
.tabs-panel { color:var(--ink); line-height:1.6; }
.tabs-panel p:last-child { margin-bottom:0; }

/* --- acf/invoice-history-list (InvoiceHistoryList.astro; uses .invoice-row) - */
.invoice-history-list { font-family:var(--font-sans); }
.invoice-history-list-title { font-size:1.1rem; font-weight:700; color:var(--ink); margin:0 0 1rem; }
.invoice-history-list-rows { display:flex; flex-direction:column; gap:.65rem; }
.invoice-history-list-empty { font-size:.9rem; color:var(--muted); padding:1.5rem; text-align:center; background:var(--surface); border:1px dashed var(--line); border-radius:12px; margin:0; }

/* =========================================================================
   Section Appearance — shared background / text / spacing layer.
   Emitted by inc/section-appearance.php (editor) and sectionAppearance.js
   (Astro). Blocks opt in by reading the vars WITH THEIR OWN VALUE AS FALLBACK,
   e.g. `color: var(--wpbg-heading, #fff)` — so unset === unchanged.
   ========================================================================= */
.wpbg--filled,
.wpbg--image { position: relative; }
.wpbg__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.wpbg__overlay { position: absolute; inset: 0; background: #0B0F18; z-index: 0; pointer-events: none; }
/* Content must sit above the image/overlay layers. Blocks already give their
   own inner wrapper a z-index; this covers any that don't. */
.wpbg--image > *:not(.wpbg__img):not(.wpbg__overlay) { position: relative; z-index: 1; }

/* Text tone presets — these simply set the two vars every block reads. */
.wpbg--text-light { --wpbg-heading:#ffffff; --wpbg-subheading:rgba(255,255,255,.72); --wpbg-text:rgba(255,255,255,.72); --wpbg-muted:rgba(255,255,255,.45); }
.wpbg--text-dark { --wpbg-heading:#111827; --wpbg-subheading:#4b5563; --wpbg-text:#374151; --wpbg-muted:#9ca3af; }

/* --- acf/urgency-bar (UrgencyBar.astro) — dark live-stat bar --------------- */
.urgency-bar { position:relative; background:#160606; border-top:1px solid rgba(239,68,68,.12); border-bottom:1px solid rgba(239,68,68,.12); padding:10px 0; width:100%; font-family:var(--font-sans); }
.urgency-bar__inner { max-width:1200px; margin:0 auto; padding:0 24px; display:flex; align-items:center; justify-content:center; gap:20px; flex-wrap:wrap; }
.urgency-bar__live { display:flex; align-items:center; gap:7px; }
.urgency-bar__live-dot { width:7px; height:7px; background:#ef4444; border-radius:50%; display:block; animation:pulse 1.5s ease-in-out infinite; }
.urgency-bar__live-label { font-size:13px; font-weight:600; color:#f87171; }
.urgency-bar__sep { font-size:13px; color:rgba(255,255,255,.2); }
.urgency-bar__stat { font-size:13px; color:rgba(255,255,255,.5); }
.urgency-bar__stat strong { color:#fff; font-weight:700; }
.urgency-bar__dismiss { position:absolute; right:16px; top:50%; transform:translateY(-50%); display:inline-flex; align-items:center; justify-content:center; width:1.5rem; height:1.5rem; border:none; border-radius:999px; background:rgba(255,255,255,.08); color:rgba(255,255,255,.5); font-size:.8rem; line-height:1; cursor:pointer; transition:background .15s ease; }
.urgency-bar__dismiss:hover { background:rgba(255,255,255,.18); color:#fff; }

/* --- acf/support-ticket-tracker (SupportTicketTracker.astro) --------------- */
.ticket-tracker { display:flex; flex-direction:column; gap:1.75rem; font-family:var(--font-sans); }
.ticket-tracker-steps { display:flex; list-style:none; margin:0; padding:0; }
.ticket-tracker-step { flex:1; display:flex; flex-direction:column; align-items:center; text-align:center; gap:.5rem; }
.ticket-tracker-step-row { display:flex; align-items:center; width:100%; }
.ticket-tracker-step-dot { flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:2rem; height:2rem; border-radius:999px; font-size:.8rem; font-weight:700; border:2px solid var(--line); background:#fff; color:var(--muted); margin-left:auto; margin-right:auto; }
.ticket-tracker-step:first-child .ticket-tracker-step-dot { margin-left:0; }
.ticket-tracker-step:last-child .ticket-tracker-step-dot { margin-right:0; }
.ticket-tracker-connector { flex:1; height:2px; background:var(--line); margin-left:-1px; }
.ticket-tracker-step--done .ticket-tracker-step-dot { background:var(--primary); border-color:var(--primary); color:#fff; }
.ticket-tracker-step--done .ticket-tracker-connector { background:var(--primary); }
.ticket-tracker-step--current .ticket-tracker-step-dot { border-color:var(--primary); color:var(--primary-dark); box-shadow:0 0 0 4px var(--primary-soft); }
.ticket-tracker-step-label { font-size:.78rem; font-weight:600; color:var(--muted); }
.ticket-tracker-step--done .ticket-tracker-step-label, .ticket-tracker-step--current .ticket-tracker-step-label { color:var(--ink); }
.ticket-tracker-meta { background:#fff; border:1px solid var(--line); border-radius:14px; padding:1.25rem 1.4rem; display:flex; flex-direction:column; gap:.6rem; }
.ticket-tracker-meta-head { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.ticket-tracker-meta-number { font-family:var(--font-mono); font-size:.85rem; font-weight:700; color:var(--muted); }
.ticket-tracker-meta-status { display:inline-flex; align-items:center; gap:.35rem; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--primary-dark); background:var(--primary-soft); border:1px solid color-mix(in srgb, var(--primary,#1d9e75) 25%, transparent); padding:.25rem .6rem; border-radius:999px; }
.ticket-tracker-meta-status::before { content:''; width:6px; height:6px; border-radius:999px; background:currentColor; }
.ticket-tracker-meta-subject { font-size:1rem; font-weight:700; color:var(--ink); margin:0; }
.ticket-tracker-meta-note { font-size:.88rem; color:var(--muted); line-height:1.55; margin:0; padding:.75rem .9rem; background:var(--surface); border-radius:10px; }
.ticket-tracker-meta-foot { display:flex; flex-wrap:wrap; gap:.25rem 1rem; font-size:.76rem; color:var(--muted-2); }

/* --- acf/scan-widget (ScanWidget.astro) ------------------------------------ */
.scan-widget { font-family:var(--font-sans); }
.scan-widget-inner { max-width:640px; margin:0 auto; background:var(--bg); border:1px solid var(--line); border-radius:1rem; padding:2rem; text-align:center; }
.scan-heading { margin:0 0 .5rem; font-size:1.6rem; color:var(--ink); }
.scan-desc { color:var(--muted); margin:0 0 1.5rem; }
.scan-form { display:flex; gap:.75rem; flex-wrap:wrap; align-items:stretch; }
.scan-input { flex:1 1 240px; min-width:0; padding:.85rem 1rem; border:1px solid var(--line); border-radius:.6rem; font-size:1rem; color:var(--ink); background:var(--bg); }
.scan-input:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
.scan-btn { display:inline-flex; align-items:center; justify-content:center; padding:.85rem 1.5rem; border-radius:.6rem; background:var(--primary); color:#fff; font-weight:600; border:none; cursor:pointer; font-size:1rem; }
.scan-btn:hover { background:var(--primary-dark); }
.scan-disclaimer { margin:.85rem 0 0; font-size:.8rem; color:var(--muted-2, var(--muted)); }
.scan-progress-track { height:8px; border-radius:999px; background:var(--surface); overflow:hidden; margin-bottom:1.5rem; }
.scan-progress-bar { height:100%; width:0%; background:var(--primary); border-radius:999px; transition:width .35s ease; }
.scan-steps { list-style:none; margin:0; padding:0; text-align:left; display:flex; flex-direction:column; gap:.85rem; }
.scan-step { display:flex; align-items:center; gap:.75rem; color:var(--muted); font-size:.95rem; transition:color .2s ease; }
.scan-step-icon { position:relative; width:1.4rem; height:1.4rem; border-radius:999px; border:2px solid var(--line); flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.scan-step-check { opacity:0; color:#fff; transition:opacity .15s ease; }
.scan-step-spinner { position:absolute; inset:-2px; border-radius:999px; border:2px solid transparent; border-top-color:var(--primary); opacity:0; animation:scan-spin .8s linear infinite; }
.scan-step.is-active { color:var(--ink); font-weight:600; }
.scan-step.is-active .scan-step-spinner { opacity:1; }
.scan-step.is-active .scan-step-icon { border-color:var(--primary); }
.scan-step.is-done { color:var(--ink); }
.scan-step.is-done .scan-step-icon { background:var(--primary); border-color:var(--primary); }
.scan-step.is-done .scan-step-check { opacity:1; }
@keyframes scan-spin { to { transform:rotate(360deg); } }
.scan-result-summary { display:flex; flex-direction:column; align-items:center; gap:.5rem; margin-bottom:1.25rem; }
.scan-grade { display:inline-flex; align-items:center; justify-content:center; width:3.5rem; height:3.5rem; border-radius:999px; background:var(--primary-soft, #e8f5f0); color:var(--primary-dark, var(--primary)); font-weight:800; font-size:1.4rem; }
.scan-score { font-family:var(--font-mono); color:var(--ink); }
.scan-score-num { font-size:2rem; font-weight:700; }
.scan-score-max { color:var(--muted); font-size:1rem; }
.scan-score-summary { margin:0; color:var(--muted); max-width:46ch; }
.scan-stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(110px,1fr)); gap:1rem; margin:1.5rem 0; padding:1.25rem; background:var(--surface); border-radius:.75rem; }
.scan-stat dt { font-size:.75rem; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); margin:0 0 .25rem; }
.scan-stat dd { margin:0; font-weight:700; font-size:1.1rem; color:var(--ink); }
.scan-ctas { display:flex; gap:.75rem; justify-content:center; flex-wrap:wrap; margin-bottom:1rem; }
.scan-cta { display:inline-flex; align-items:center; padding:.7rem 1.25rem; border-radius:.6rem; font-weight:600; font-size:.9rem; text-decoration:none; cursor:pointer; }
.scan-cta--primary { background:var(--primary); color:#fff; }
.scan-cta--ghost { background:#fff; color:var(--ink); border:1px solid var(--line); }
.scan-reset { background:none; border:none; color:var(--muted); text-decoration:underline; cursor:pointer; font-size:.85rem; font-family:var(--font-sans); }
.scan-reset:hover { color:var(--ink); }

/* --- acf/live-chat-widget (LiveChatWidget.astro) --------------------------- */
.live-chat-widget { position:relative; display:inline-block; font-family:var(--font-sans); }
.live-chat-widget.is-fixed { position:fixed; bottom:1.5rem; right:1.5rem; z-index:9999; }
.live-chat-widget .block-inner { position:relative; }
.chat-bubble { display:flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:999px; border:none; background:var(--primary); color:#fff; cursor:pointer; box-shadow:0 10px 30px rgba(0,0,0,.25); transition:transform .15s ease, background .15s ease; }
.chat-bubble:hover { background:var(--primary-dark, var(--primary)); transform:translateY(-2px); }
.chat-panel { position:absolute; bottom:calc(100% + 16px); right:0; width:320px; max-width:88vw; max-height:420px; display:flex; flex-direction:column; background:var(--bg,#fff); border:1px solid var(--line); border-radius:16px; box-shadow:0 24px 60px rgba(0,0,0,.22); opacity:0; visibility:hidden; transform:translateY(12px); transition:opacity .18s ease, transform .18s ease, visibility .18s; overflow:hidden; z-index:1; }
.live-chat-widget.open .chat-panel { opacity:1; visibility:visible; transform:translateY(0); }
.chat-header { display:flex; align-items:flex-start; justify-content:space-between; gap:.75rem; padding:.9rem 1rem; background:var(--dark); color:#fff; }
.chat-title { margin:0; font-size:.95rem; font-weight:700; }
.chat-subtitle { margin:.15rem 0 0; font-size:.75rem; color:rgba(255,255,255,.65); }
.chat-close { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border:none; border-radius:8px; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; flex-shrink:0; }
.chat-close:hover { background:rgba(255,255,255,.22); }
.chat-messages { flex:1; display:flex; flex-direction:column; gap:.6rem; padding:1rem; overflow-y:auto; background:var(--surface); min-height:180px; }
.msg { display:flex; max-width:82%; }
.msg p { margin:0; padding:.55rem .8rem; border-radius:14px; font-size:.85rem; line-height:1.4; }
.msg-incoming { align-self:flex-start; }
.msg-incoming p { background:var(--bg,#fff); border:1px solid var(--line); color:var(--ink); border-bottom-left-radius:4px; }
.msg-outgoing { align-self:flex-end; }
.msg-outgoing p { background:var(--primary); color:#fff; border-bottom-right-radius:4px; }
.chat-input-row { display:flex; align-items:center; gap:.5rem; padding:.75rem; border-top:1px solid var(--line); background:var(--bg,#fff); }
.chat-input { flex:1; min-width:0; border:1px solid var(--line); border-radius:999px; padding:.55rem .9rem; font:inherit; font-size:.85rem; color:var(--ink); background:var(--surface); }
.chat-send { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; flex-shrink:0; border:none; border-radius:999px; background:var(--primary); color:#fff; cursor:pointer; transition:background .15s ease; }
.chat-send:hover { background:var(--primary-dark, var(--primary)); }

/* --- acf/toast (Toast.astro) — fixed corner popup -------------------------- */
.toast-block { position:fixed; z-index:200; display:flex; align-items:flex-start; gap:.65rem; max-width:380px; padding:.9rem 1rem; border-radius:12px; background:var(--surface,#fff); border:1px solid var(--line); box-shadow:0 12px 30px rgba(15,23,42,.16); opacity:0; visibility:hidden; transform:translateY(-8px); transition:opacity .25s ease, transform .25s ease, visibility .25s; pointer-events:none; font-family:var(--font-sans); }
.toast-block.is-visible { opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
.toast-block--top-right { top:1.25rem; right:1.25rem; }
.toast-block--top-left { top:1.25rem; left:1.25rem; }
.toast-block--bottom-right { bottom:1.25rem; right:1.25rem; transform:translateY(8px); }
.toast-block--bottom-right.is-visible { transform:translateY(0); }
.toast-block--bottom-left { bottom:1.25rem; left:1.25rem; transform:translateY(8px); }
.toast-block--bottom-left.is-visible { transform:translateY(0); }
.toast-icon { width:20px; height:20px; flex-shrink:0; margin-top:.05rem; }
.toast-title { flex:1; margin:0; font-size:.88rem; font-weight:600; color:var(--ink); line-height:1.4; }
.toast-dismiss { flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; padding:0; background:transparent; border:none; border-radius:6px; color:var(--muted); cursor:pointer; }
.toast-dismiss:hover { background:var(--bg-soft); color:var(--ink); }
.toast-dismiss svg { width:13px; height:13px; }
.toast-block--success .toast-icon { color:var(--primary); }
.toast-block--warning .toast-icon { color:var(--color-warning, #d97706); }
.toast-block--error .toast-icon { color:var(--color-error, #ef4444); }
.toast-block--info .toast-icon { color:var(--color-info, #3b82f6); }
/* editor preview: pin inline & visible */
.toast-block--preview { position:static; opacity:1; visibility:visible; transform:none; pointer-events:auto; }

/* --- acf/modal (Modal.astro) — fixed overlay ------------------------------- */
.modal-block { position:fixed; inset:0; z-index:300; display:none; align-items:flex-start; justify-content:center; padding:4rem 1rem; overflow-y:auto; font-family:var(--font-sans); }
.modal-block.is-centered { align-items:center; }
.modal-block.is-open { display:flex; }
.modal-backdrop { position:fixed; inset:0; background:rgba(15,23,42,.55); animation:modal-fade-in .2s ease; }
.modal-dialog { position:relative; z-index:1; width:100%; max-width:480px; background:var(--surface,#fff); border-radius:16px; box-shadow:0 24px 60px rgba(15,23,42,.28); animation:modal-pop-in .22s ease; outline:none; }
.modal-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1.25rem 1.5rem 0; }
.modal-title { margin:0; font-size:1.15rem; font-weight:700; color:var(--ink); }
.modal-subtitle { margin:.25rem 0 0; font-size:.88rem; color:var(--muted); }
.modal-close { flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; padding:0; background:transparent; border:none; border-radius:8px; color:var(--muted); cursor:pointer; }
.modal-close:hover { background:var(--bg-soft); color:var(--ink); }
.modal-close svg { width:15px; height:15px; }
.modal-body { padding:1.25rem 1.5rem; font-size:.92rem; line-height:1.6; color:var(--ink); }
.modal-footer { display:flex; align-items:center; justify-content:flex-end; gap:.6rem; padding:0 1.5rem 1.5rem; }
.modal-block--danger .modal-dialog { border-top:4px solid var(--color-error, #ef4444); }
.modal-block--brand .modal-dialog { border-top:4px solid var(--primary); }
@keyframes modal-fade-in { from { opacity:0; } to { opacity:1; } }
@keyframes modal-pop-in { from { opacity:0; transform:translateY(8px) scale(.98); } to { opacity:1; transform:translateY(0) scale(1); } }
/* editor preview: pin inline, no fixed overlay */
.modal-block--preview { position:static; display:block; padding:0; z-index:auto; }
.modal-block--preview .modal-backdrop { display:none; }
.modal-block--preview .modal-dialog { margin:0 auto; animation:none; }

/* ==========================================================================
   Workstream B — redesign blocks (new + restyled)
   ========================================================================== */

/* --- acf/service-cards (ServiceCards.astro) -------------------------------- */
.svc-cards { font-family:var(--font-sans); }
.svc-cards__inner { max-width:1200px; margin:0 auto; padding:0 24px; }
.svc-cards__head { text-align:center; margin-bottom:52px; }
.svc-cards__eyebrow { font-size:12px; font-weight:600; color:var(--primary); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.svc-cards__heading { font-size:40px; font-weight:800; color:var(--ink); margin:0 0 14px; letter-spacing:-.02em; }
.svc-cards__subtitle { font-size:17px; color:var(--muted); max-width:520px; margin:0 auto; line-height:1.6; }
.svc-cards__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.svc-card { background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,.05); display:flex; flex-direction:column; }
.svc-card__media { aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; }
.svc-card__icon { width:60px; height:60px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; }
.svc-card__body { padding:20px 24px 24px; display:flex; flex-direction:column; gap:.5rem; }
.svc-card__badge { align-self:flex-start; display:inline-block; font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px; letter-spacing:.04em; text-transform:uppercase; }
.svc-card__title { font-size:20px; font-weight:700; color:var(--ink); margin:0; }
.svc-card__desc { font-size:14px; color:var(--muted); line-height:1.65; margin:0; }
.svc-card__features { list-style:none; margin:.4rem 0; padding:0; display:flex; flex-direction:column; gap:7px; }
.svc-card__features li { display:flex; align-items:center; gap:7px; font-size:13px; color:#374151; }
.svc-card__features li svg { color:var(--primary); flex-shrink:0; }
.svc-card__cta { margin-top:.5rem; width:100%; text-align:center; padding:12px; border-radius:8px; font-size:15px; font-weight:700; text-decoration:none; }
.svc-card--orange .svc-card__media { background:linear-gradient(135deg,#1C0A06,#2D1208); }
.svc-card--orange .svc-card__icon { background:rgba(216,90,48,.2); color:#D85A30; }
.svc-card--orange .svc-card__badge { background:#FAE8E0; color:#D85A30; }
.svc-card--orange .svc-card__cta { background:#D85A30; color:#fff; }
.svc-card--red .svc-card__media { background:linear-gradient(135deg,#1A0606,#2D0808); }
.svc-card--red .svc-card__icon { background:rgba(163,45,45,.2); color:#ef4444; }
.svc-card--red .svc-card__badge { background:#FEE2E2; color:#DC2626; }
.svc-card--red .svc-card__cta { background:#0F6E56; color:#fff; }
.svc-card--green .svc-card__media { background:linear-gradient(135deg,#071A0E,#0A2D18); }
.svc-card--green .svc-card__icon { background:rgba(99,153,34,.2); color:#639922; }
.svc-card--green .svc-card__badge { background:#DCFCE7; color:#16A34A; }
.svc-card--green .svc-card__cta { background:#0F6E56; color:#fff; }
.svc-card--teal .svc-card__media { background:linear-gradient(135deg,#06171A,#0A2828); }
.svc-card--teal .svc-card__icon { background:rgba(29,158,117,.2); color:#1D9E75; }
.svc-card--teal .svc-card__badge { background:#E8F5F0; color:#0F6E56; }
.svc-card--teal .svc-card__cta { background:#0F6E56; color:#fff; }
.svc-card--purple .svc-card__media { background:linear-gradient(135deg,#0A0618,#16082D); }
.svc-card--purple .svc-card__icon { background:rgba(124,58,237,.18); color:#a78bfa; }
.svc-card--purple .svc-card__badge { background:#EDE9FE; color:#7C3AED; }
.svc-card--purple .svc-card__cta { background:#111827; color:#fff; }
@media (max-width:900px){ .svc-cards__grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .svc-cards__grid { grid-template-columns:1fr; } }

/* --- acf/incident-hero (IncidentHero.astro) -------------------------------- */
.em-hero { position:relative; overflow:hidden; background:#0B0F18; font-family:var(--font-sans); }
.em-hero__bg { position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(29,158,117,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(29,158,117,.035) 1px,transparent 1px); background-size:52px 52px; }
.em-hero__bg::before { content:''; position:absolute; width:700px; height:700px; top:-250px; left:-200px; background:radial-gradient(circle,rgba(29,158,117,.09) 0%,transparent 65%); }
.em-hero__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:var(--sec-pt,52px) 24px var(--sec-pb,96px); display:grid; grid-template-columns:1fr 420px; gap:56px; align-items:center; }
.em-hero__badge { display:inline-flex; align-items:center; gap:8px; background:rgba(29,158,117,.1); border:1px solid rgba(29,158,117,.22); border-radius:999px; padding:6px 16px; margin-bottom:26px; font-size:13px; font-weight:500; color:#1D9E75; }
.em-hero__badge-dot { width:7px; height:7px; background:#1D9E75; border-radius:50%; display:block; animation:pulse 2s ease-in-out infinite; flex-shrink:0; }
.em-hero .em-hero__title { font-family:var(--font-heading,var(--font-sans)); font-size:62px; font-weight:800; line-height:1.06; color:var(--wpbg-heading,#fff); margin:0 0 22px; letter-spacing:-.03em; }
.em-hero .em-hero__accent { color:var(--wpbg-accent,#1D9E75); }
.em-hero .em-hero__subtitle { font-size:17px; line-height:1.65; color:var(--wpbg-subheading,rgba(255,255,255,.58)); margin:0 0 36px; max-width:500px; }
.em-hero__actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:24px; }
.em-hero__cta { display:inline-flex; align-items:center; gap:8px; padding:15px 28px; border-radius:8px; font-size:16px; font-weight:700; text-decoration:none; }
.em-hero__cta--primary { background:#D85A30; color:#fff; }
.em-hero__cta--ghost { background:transparent; color:rgba(255,255,255,.85); border:1px solid rgba(255,255,255,.18); font-weight:500; }
.em-hero .em-hero__footnote { font-size:14px; color:var(--wpbg-muted,rgba(255,255,255,.38)); margin:0 0 24px; }
.em-hero__stats { display:flex; align-items:center; gap:0; padding-top:28px; border-top:1px solid rgba(255,255,255,.08); flex-wrap:wrap; }
.em-hero__stat { padding-right:24px; padding-bottom:8px; margin-right:24px; border-right:1px solid rgba(255,255,255,.1); }
.em-hero__stat:last-child { border-right:none; margin-right:0; }
.em-hero .em-hero__stat-value { font-size:20px; font-weight:800; color:var(--wpbg-heading,#fff); line-height:1; }
.em-hero .em-hero__stat-label { font-size:12px; color:var(--wpbg-muted,rgba(255,255,255,.4)); margin-top:3px; }
.em-hero__card { background:#111B28; border:1px solid #1E2F42; border-radius:16px; padding:22px; box-shadow:0 0 80px rgba(29,158,117,.1); }
.em-hero__card-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.em-hero__card-monitor { display:flex; align-items:center; gap:7px; font-size:11px; font-weight:600; color:rgba(255,255,255,.35); letter-spacing:.08em; text-transform:uppercase; }
.em-hero__card-live { display:flex; align-items:center; gap:5px; background:rgba(29,158,117,.1); border:1px solid rgba(29,158,117,.2); border-radius:999px; padding:3px 10px; font-size:11px; color:#1D9E75; font-weight:500; }
.em-hero__alert { background:rgba(163,45,45,.15); border:1px solid rgba(239,68,68,.2); border-radius:10px; padding:12px 14px; margin-bottom:14px; }
.em-hero__alert-tag { display:flex; align-items:center; gap:8px; font-size:11px; font-weight:700; color:#f87171; letter-spacing:.06em; text-transform:uppercase; margin-bottom:5px; }
.em-hero__alert-dot { width:8px; height:8px; background:#ef4444; border-radius:50%; display:block; animation:pulse 1.2s ease-in-out infinite; }
.em-hero__alert-title { font-size:14px; font-weight:700; color:#fff; margin:0 0 2px; }
.em-hero__alert-meta { font-size:12px; color:rgba(255,255,255,.32); margin:0; }
.em-hero__timeline { list-style:none; margin:0 0 14px; padding-left:4px; position:relative; display:flex; flex-direction:column; gap:12px; }
.em-hero__timeline::before { content:''; position:absolute; left:8px; top:12px; bottom:12px; width:1px; background:rgba(29,158,117,.2); }
.em-hero__timeline-item { display:flex; align-items:flex-start; gap:12px; }
.em-hero__timeline-dot { width:20px; height:20px; background:#1D9E75; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; z-index:1; }
.em-hero__timeline-body { flex:1; }
.em-hero__timeline-row { display:flex; justify-content:space-between; }
.em-hero__timeline-label { font-size:13px; font-weight:600; color:rgba(255,255,255,.78); }
.em-hero__timeline-time { font-size:11px; color:rgba(255,255,255,.25); }
.em-hero__timeline-meta { font-size:12px; color:rgba(255,255,255,.35); }
.em-hero__resolved { background:rgba(29,158,117,.1); border:1px solid rgba(29,158,117,.22); border-radius:10px; padding:12px 14px; display:flex; align-items:center; gap:10px; }
.em-hero__resolved-icon { width:28px; height:28px; background:#1D9E75; border-radius:8px; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; }
.em-hero__resolved-title { font-size:13px; font-weight:700; color:#1D9E75; margin:0 0 1px; }
.em-hero__resolved-note { font-size:11px; color:rgba(255,255,255,.3); margin:0; }
.em-hero__compare { margin-top:10px; background:#111B28; border:1px solid #1E2F42; border-radius:12px; padding:14px 18px; display:flex; align-items:center; justify-content:space-between; }
.em-hero__compare-label { font-size:11px; color:rgba(255,255,255,.3); margin:0 0 3px; letter-spacing:.04em; text-transform:uppercase; }
.em-hero__compare-value { font-size:22px; font-weight:800; color:#1D9E75; margin:0; line-height:1; }
.em-hero__compare-value span { font-size:13px; font-weight:400; color:rgba(255,255,255,.3); }
.em-hero__compare--muted { text-align:right; }
.em-hero__compare--muted .em-hero__compare-value { color:rgba(255,255,255,.2); }
.em-hero__compare--muted .em-hero__compare-value span { color:rgba(255,255,255,.18); }
@media (max-width:900px){ .em-hero__inner { grid-template-columns:1fr; } .em-hero__title { font-size:44px; } }

/* --- acf/featured-service (FeaturedService.astro) -------------------------- */
.fs { position:relative; background:#fff; padding:var(--sec-pt,72px) 0 var(--sec-pb,72px); font-family:var(--font-sans); }
.fs__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.fs__badge { display:inline-flex; align-items:center; gap:8px; background:#FAE8E0; border:1px solid rgba(216,90,48,.2); border-radius:999px; padding:5px 14px; margin-bottom:28px; font-size:12px; font-weight:600; color:#D85A30; letter-spacing:.05em; }
.fs__grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
.fs .fs__title { font-family:var(--font-heading,var(--font-sans)); font-size:38px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 16px; letter-spacing:-.02em; }
.fs .fs__desc { font-size:16px; color:var(--wpbg-subheading,#6B7280); line-height:1.7; margin:0 0 28px; }
.fs .fs__issues-heading { font-size:14px; font-weight:600; color:var(--wpbg-heading,#111827); margin:0 0 12px; }
.fs__issues { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:28px; }
.fs .fs__issue { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--wpbg-text,#374151); }
.fs__cta { background:#D85A30; color:#fff; padding:14px 32px; border-radius:8px; font-size:16px; font-weight:700; border:none; text-decoration:none; display:inline-block; cursor:pointer; }
.fs__steps { display:flex; flex-direction:column; gap:12px; }
.fs__step { background:#F8F7F3; border-radius:12px; padding:18px 20px; display:flex; align-items:flex-start; gap:14px; }
.fs__step-num { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:14px; font-weight:800; color:#fff; background:#D85A30; }
.fs__step:nth-child(3n+2) .fs__step-num { background:#0F6E56; }
.fs__step:nth-child(3n+3) .fs__step-num { background:#111827; }
.fs .fs__step-title { font-size:15px; font-weight:700; color:var(--wpbg-heading,#111827); margin:0 0 4px; }
.fs .fs__step-desc { font-size:13px; color:var(--wpbg-text,#6B7280); margin:0; line-height:1.5; }
@media (max-width:820px){ .fs__grid { grid-template-columns:1fr; } }

/* --- acf/vertical-timeline (VerticalTimeline.astro) ------------------------ */
.vt { position:relative; background:#fff; padding:var(--sec-pt,80px) 0 var(--sec-pb,80px); font-family:var(--font-sans); }
.vt__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.vt__head { text-align:center; margin-bottom:52px; }
.vt .vt__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.vt .vt__title { font-family:var(--font-heading,var(--font-sans)); font-size:38px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 12px; letter-spacing:-.02em; }
.vt .vt__subtitle { font-size:17px; color:var(--wpbg-subheading,#6B7280); max-width:460px; margin:0 auto; line-height:1.6; }
.vt__list { max-width:860px; margin:0 auto; display:flex; flex-direction:column; position:relative; }
.vt__line { position:absolute; left:31px; top:20px; bottom:20px; width:2px; background:linear-gradient(to bottom,#1D9E75 60%,#E5E3DC); }
.vt__item { display:flex; gap:24px; align-items:flex-start; padding-bottom:24px; }
.vt__item:last-child { padding-bottom:0; }
.vt__marker { width:64px; flex-shrink:0; display:flex; justify-content:center; z-index:1; }
.vt__circle { width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:800; color:#fff; background:#1D9E75; box-shadow:0 0 0 6px #fff,0 0 0 8px rgba(29,158,117,.15); }
.vt__circle--dark-green { background:#0F6E56; box-shadow:0 0 0 6px #fff,0 0 0 8px rgba(15,110,86,.15); }
.vt__circle--orange { background:#D85A30; box-shadow:0 0 0 6px #fff,0 0 0 8px rgba(216,90,48,.15); }
.vt__circle--dark { background:#111827; box-shadow:0 0 0 6px #fff,0 0 0 8px rgba(17,24,39,.1); }
.vt__card { background:#F8F7F3; border-radius:14px; padding:22px 24px; flex:1; }
.vt__card--highlight { background:#E8F5F0; border:1px solid #C5E8DC; }
.vt__card-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; gap:12px; }
.vt .vt__card-title { font-size:18px; font-weight:700; color:var(--wpbg-heading,#111827); margin:0; }
.vt__badge { font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px; letter-spacing:.04em; white-space:nowrap; color:#1D9E75; background:#E8F5F0; }
.vt__badge--orange { color:#D85A30; background:#FAE8E0; }
.vt__badge--muted { color:#6B7280; background:#E5E3DC; }
.vt__badge--dark-green { color:#0F6E56; background:rgba(15,110,86,.1); }
.vt .vt__card-desc { font-size:14px; color:var(--wpbg-text,#6B7280); line-height:1.65; margin:0; }
.vt__card--highlight .vt__card-desc { color:#374151; }
.vt__tags { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.vt__tag { font-size:12px; font-weight:500; color:#374151; background:#fff; border:1px solid #E5E3DC; border-radius:6px; padding:4px 10px; }
@media (max-width:600px){ .vt__title { font-size:30px; } }

/* --- acf/stats (Stats.astro) — green stat band ---------------------------- */
.stats { position:relative; background:#0F6E56; padding:var(--sec-pt,72px) 0 var(--sec-pb,72px); font-family:var(--font-sans); }
.stats__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.stats__head { text-align:center; margin-bottom:44px; }
.stats .stats__title { font-family:var(--font-heading,var(--font-sans)); font-size:36px; font-weight:800; color:var(--wpbg-heading,#fff); margin:0 0 10px; letter-spacing:-.02em; }
.stats .stats__subtitle { font-size:17px; color:var(--wpbg-subheading,rgba(255,255,255,.75)); max-width:600px; margin:0 auto; line-height:1.6; }
.stats__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
.stats__item { text-align:center; padding:0 24px; border-right:1px solid rgba(255,255,255,.15); }
.stats__item:last-child { border-right:none; }
.stats .stats__number { font-size:56px; font-weight:800; color:var(--wpbg-heading,#fff); line-height:1; margin-bottom:8px; }
.stats .stats__label { font-size:15px; font-weight:500; color:var(--wpbg-text,rgba(255,255,255,.7)); }
.stats .stats__desc { font-size:13px; color:var(--wpbg-muted,rgba(255,255,255,.5)); margin-top:6px; }
@media (max-width:820px){ .stats__grid { grid-template-columns:repeat(2,1fr); gap:32px 0; } .stats__item:nth-child(2n){ border-right:none; } }
@media (max-width:480px){ .stats__grid { grid-template-columns:1fr; } .stats__item { border-right:none; } }

/* --- acf/cta (Cta.astro) — dark CTA banner -------------------------------- */
.cta-banner { position:relative; overflow:hidden; background:#0B0F18; border-top:1px solid #1A2332; padding:var(--sec-pt,88px) 0 var(--sec-pb,88px); font-family:var(--font-sans); }
.cta-banner__glow { position:absolute; width:600px; height:600px; background:radial-gradient(circle,rgba(29,158,117,.07) 0%,transparent 65%); top:-200px; right:-100px; pointer-events:none; }
.cta-banner__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; text-align:center; }
.cta-banner .cta-banner__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 16px; }
.cta-banner .cta-banner__title { font-family:var(--font-heading,var(--font-sans)); font-size:44px; font-weight:800; color:var(--wpbg-heading,#fff); margin:0 0 16px; letter-spacing:-.025em; }
.cta-banner .cta-banner__desc { font-size:18px; color:var(--wpbg-subheading,rgba(255,255,255,.55)); max-width:520px; margin:0 auto 36px; line-height:1.6; }
.cta-banner__actions { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; }
.cta-banner__btn { padding:16px 36px; border-radius:8px; font-size:17px; font-weight:700; text-decoration:none; border:1px solid transparent; }
.cta-banner__btn--primary { background:#D85A30; color:#fff; }
.cta-banner__btn--ghost { background:transparent; color:rgba(255,255,255,.8); font-weight:500; border-color:rgba(255,255,255,.2); }
.cta-banner .cta-banner__footnote { font-size:13px; color:var(--wpbg-muted,rgba(255,255,255,.3)); margin:20px 0 0; }
@media (max-width:600px){ .cta-banner__title { font-size:32px; } }

/* --- acf/process (Process.astro) — 4-step horizontal ---------------------- */
.process { position:relative; background:#F8F7F3; padding:var(--sec-pt,88px) 0 var(--sec-pb,88px); font-family:var(--font-sans); }
.process__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.process__head { text-align:center; margin-bottom:56px; }
.process .process__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.process .process__title { font-family:var(--font-heading,var(--font-sans)); font-size:40px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 14px; letter-spacing:-.02em; }
.process .process__subtitle { font-size:17px; color:var(--wpbg-subheading,#6B7280); max-width:480px; margin:0 auto; line-height:1.6; }
.process__steps { display:flex; align-items:flex-start; gap:0; }
.process__step { flex:1; text-align:center; padding:0 12px; }
.process__num { width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 18px; font-size:24px; font-weight:800; color:#fff; }
.process__num--green { background:#1D9E75; box-shadow:0 4px 20px rgba(29,158,117,.3); }
.process__num--dark-green { background:#0F6E56; box-shadow:0 4px 20px rgba(15,110,86,.25); }
.process__num--orange { background:#D85A30; box-shadow:0 4px 20px rgba(216,90,48,.25); }
.process__num--dark { background:#111827; box-shadow:0 4px 20px rgba(0,0,0,.2); }
.process .process__step-title { font-size:16px; font-weight:700; color:var(--wpbg-heading,#111827); margin:0 0 8px; }
.process .process__step-desc { font-size:13.5px; color:var(--wpbg-text,#6B7280); line-height:1.6; margin:0; }
.process__connector { flex:none; display:flex; align-items:flex-start; padding-top:32px; }
.process__connector span { width:52px; height:2px; background:#D1D5DB; position:relative; display:block; }
.process__connector span::after { content:''; position:absolute; right:-5px; top:-4px; width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:7px solid #D1D5DB; }
.process__cta-wrap { text-align:center; margin-top:52px; }
.process__cta { background:#D85A30; color:#fff; padding:14px 32px; border-radius:8px; font-size:16px; font-weight:700; border:none; text-decoration:none; display:inline-block; }
.process .process__footnote { font-size:13px; color:var(--wpbg-muted,#9CA3AF); margin:10px 0 0; }
@media (max-width:820px){ .process__steps { flex-direction:column; gap:32px; } .process__connector { display:none; } }

/* --- acf/features (Features.astro) — "why choose" 4-up -------------------- */
.features { position:relative; background:#F8F7F3; padding:var(--sec-pt,88px) 0 var(--sec-pb,88px); font-family:var(--font-sans); }
.features__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.features__head { text-align:center; margin-bottom:52px; }
.features .features__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.features .features__title { font-family:var(--font-heading,var(--font-sans)); font-size:40px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 14px; letter-spacing:-.02em; }
.features .features__subtitle { font-size:17px; color:var(--wpbg-subheading,#6B7280); max-width:520px; margin:0 auto; line-height:1.6; }
.features__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.features__card { background:#fff; border:1px solid #E5E3DC; border-radius:14px; padding:28px 24px; display:flex; flex-direction:column; gap:14px; }
.features__icon { width:50px; height:50px; border-radius:11px; display:flex; align-items:center; justify-content:center; }
.features__icon--green { background:#E8F5F0; color:#1D9E75; }
.features__icon--orange { background:#FAE8E0; color:#D85A30; }
.features .features__card-title { font-size:17px; font-weight:700; color:var(--wpbg-heading,#111827); margin:0 0 6px; }
.features .features__card-desc { font-size:14px; color:var(--wpbg-text,#6B7280); line-height:1.6; margin:0; }
.features__check { display:flex; align-items:center; gap:7px; padding-top:6px; border-top:1px solid #F1EEE8; color:#1D9E75; }
.features__check svg { flex-shrink:0; }
.features .features__check span { font-size:13px; font-weight:500; color:var(--wpbg-accent,#1D9E75); }
@media (max-width:1000px){ .features__grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .features__grid { grid-template-columns:1fr; } }

/* --- acf/services (Services.astro) — services grid ------------------------ */
.svc-grid { position:relative; background:#fff; padding:var(--sec-pt,88px) 0 var(--sec-pb,88px); font-family:var(--font-sans); }
.svc-grid__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.svc-grid__head { text-align:center; margin-bottom:52px; }
.svc-grid .svc-grid__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.svc-grid .svc-grid__title { font-family:var(--font-heading,var(--font-sans)); font-size:40px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 14px; letter-spacing:-.02em; }
.svc-grid .svc-grid__subtitle { font-size:17px; color:var(--wpbg-subheading,#6B7280); max-width:500px; margin:0 auto; line-height:1.6; }
.svc-grid__grid { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; }
.svc-grid__card { flex:1 1 340px; max-width:373px; background:#fff; border:1px solid #E5E3DC; border-radius:14px; overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,.05); display:flex; flex-direction:column; }
.svc-grid__media { position:relative; aspect-ratio:16 / 9; display:flex; align-items:center; justify-content:center; padding:32px 24px; }
.svc-grid__icon { width:60px; height:60px; border-radius:14px; display:flex; align-items:center; justify-content:center; border:1px solid transparent; }
.svc-grid__badge { position:absolute; top:12px; right:12px; border-radius:6px; padding:3px 8px; font-size:10px; font-weight:700; letter-spacing:.04em; }
.svc-grid__body { padding:20px 22px 24px; }
.svc-grid .svc-grid__card-title { font-size:18px; font-weight:700; color:var(--wpbg-heading,#111827); margin:0 0 8px; }
.svc-grid .svc-grid__card-desc { font-size:14px; color:var(--wpbg-text,#6B7280); line-height:1.6; margin:0 0 14px; }
.svc-grid .svc-grid__link { font-size:14px; font-weight:600; display:inline-flex; align-items:center; gap:5px; text-decoration:none; color:var(--wpbg-link,#1D9E75); }
.svc-grid__card--orange .svc-grid__media { background:linear-gradient(135deg,#1C0A06 0%,#2D1208 100%); }
.svc-grid__card--orange .svc-grid__icon { background:rgba(216,90,48,.2); border-color:rgba(216,90,48,.3); color:#D85A30; }
.svc-grid__card--orange .svc-grid__badge { background:rgba(216,90,48,.15); border:1px solid rgba(216,90,48,.3); color:#D85A30; }
.svc-grid__card--orange .svc-grid__link { color:#D85A30; }
.svc-grid__card--red .svc-grid__media { background:linear-gradient(135deg,#1A0606 0%,#2D0808 100%); }
.svc-grid__card--red .svc-grid__icon { background:rgba(163,45,45,.2); border-color:rgba(163,45,45,.3); color:#ef4444; }
.svc-grid__card--red .svc-grid__badge { background:rgba(163,45,45,.15); border:1px solid rgba(163,45,45,.3); color:#ef4444; }
.svc-grid__card--olive .svc-grid__media { background:linear-gradient(135deg,#071A0E 0%,#0A2D18 100%); }
.svc-grid__card--olive .svc-grid__icon { background:rgba(99,153,34,.2); border-color:rgba(99,153,34,.3); color:#639922; }
.svc-grid__card--olive .svc-grid__badge { background:rgba(99,153,34,.15); border:1px solid rgba(99,153,34,.3); color:#639922; }
.svc-grid__card--teal .svc-grid__media { background:linear-gradient(135deg,#06171A 0%,#0A2828 100%); }
.svc-grid__card--teal .svc-grid__icon { background:rgba(29,158,117,.2); border-color:rgba(29,158,117,.3); color:#1D9E75; }
.svc-grid__card--teal .svc-grid__badge { background:rgba(29,158,117,.15); border:1px solid rgba(29,158,117,.3); color:#1D9E75; }
.svc-grid__card--violet .svc-grid__media { background:linear-gradient(135deg,#0A0618 0%,#16082D 100%); }
.svc-grid__card--violet .svc-grid__icon { background:rgba(124,58,237,.18); border-color:rgba(124,58,237,.28); color:#a78bfa; }
.svc-grid__card--violet .svc-grid__badge { background:rgba(124,58,237,.15); border:1px solid rgba(124,58,237,.28); color:#a78bfa; }
@media (max-width:560px){ .svc-grid__card { flex-basis:100%; max-width:420px; } }

/* --- acf/hero (Hero.astro) — green services hero -------------------------- */
.svc-hero { position:relative; background:linear-gradient(135deg,#0F6E56,#1D9E75); padding:var(--sec-pt,68px) 0 var(--sec-pb,68px); font-family:var(--font-sans); }
.svc-hero__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; text-align:center; }
.svc-hero .svc-hero__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,rgba(255,255,255,.65)); letter-spacing:.1em; text-transform:uppercase; margin:0 0 12px; }
.svc-hero .svc-hero__title { font-family:var(--font-heading,var(--font-sans)); font-size:48px; font-weight:800; color:var(--wpbg-heading,#fff); margin:0 0 14px; letter-spacing:-.025em; }
.svc-hero .svc-hero__subtitle { font-size:18px; color:var(--wpbg-subheading,rgba(255,255,255,.78)); max-width:520px; margin:0 auto; line-height:1.6; }
.svc-hero__actions { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:28px; }
.svc-hero__btn { padding:14px 30px; border-radius:8px; font-size:16px; font-weight:700; text-decoration:none; }
.svc-hero__btn--primary { background:#fff; color:#0F6E56; }
.svc-hero__btn--ghost { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.4); font-weight:500; }
@media (max-width:600px){ .svc-hero__title { font-size:34px; } }

/* --- acf/testimonials (Testimonials.astro) — 3-up rating cards ------------ */
.tst { position:relative; background:#fff; padding:var(--sec-pt,88px) 0 var(--sec-pb,88px); font-family:var(--font-sans); }
.tst__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.tst__head { text-align:center; margin-bottom:52px; }
.tst .tst__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.tst .tst__title { font-family:var(--font-heading,var(--font-sans)); font-size:40px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 14px; letter-spacing:-.02em; }
.tst .tst__subtitle { font-size:17px; color:var(--wpbg-subheading,#6B7280); max-width:480px; margin:0 auto; line-height:1.6; }
.tst__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.tst__card { background:#fff; border:1px solid #E5E3DC; border-radius:14px; padding:28px 24px; display:flex; flex-direction:column; }
.tst__stars { display:flex; gap:3px; margin-bottom:16px; color:#F59E0B; }
.tst .tst__quote { font-size:15px; line-height:1.7; color:var(--wpbg-text,#374151); font-style:italic; flex:1; margin:0 0 22px; }
.tst__divider { height:1px; background:#F1EEE8; margin-bottom:18px; }
.tst__person { display:flex; align-items:center; gap:12px; }
.tst__avatar { width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:14px; font-weight:700; color:#fff; }
.tst__avatar--green { background:#1D9E75; }
.tst__avatar--dark-green { background:#0F6E56; }
.tst__avatar--orange { background:#D85A30; }
.tst .tst__name { font-size:14px; font-weight:700; color:var(--wpbg-heading,#111827); margin:0 0 2px; }
.tst .tst__role { font-size:12px; color:var(--wpbg-muted,#9CA3AF); margin:0; }
@media (max-width:900px){ .tst__grid { grid-template-columns:1fr; max-width:520px; margin:0 auto; } }

/* --- acf/icon-box-grid (IconBoxGrid.astro) — "what we fix" grid ----------- */
.ibg { position:relative; background:#F8F7F3; padding:var(--sec-pt,80px) 0 var(--sec-pb,80px); font-family:var(--font-sans); }
.ibg__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.ibg__head { text-align:center; margin-bottom:48px; }
.ibg .ibg__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.ibg .ibg__title { font-family:var(--font-heading,var(--font-sans)); font-size:38px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 12px; letter-spacing:-.02em; }
.ibg .ibg__subtitle { font-size:17px; color:var(--wpbg-subheading,#6B7280); max-width:480px; margin:0 auto; line-height:1.6; }
.ibg__grid { display:grid; grid-template-columns:repeat(var(--ibg-cols,4),1fr); gap:14px; }
.ibg__card { background:#fff; border:1px solid #E5E3DC; border-radius:12px; padding:18px 16px; display:flex; align-items:flex-start; gap:12px; }
.ibg__icon { width:36px; height:36px; border-radius:9px; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.ibg__icon--orange { background:#FAE8E0; color:#D85A30; }
.ibg__icon--green { background:#E8F5F0; color:#1D9E75; }
.ibg__icon--red { background:#FEE2E2; color:#ef4444; }
.ibg .ibg__card-title { font-size:14px; font-weight:700; color:var(--wpbg-heading,#111827); margin:0 0 3px; }
.ibg .ibg__card-desc { font-size:12px; color:var(--wpbg-muted,#9CA3AF); margin:0; line-height:1.4; }
.ibg .ibg__footnote { text-align:center; margin-top:24px; font-size:14px; color:var(--wpbg-muted,#9CA3AF); }
.ibg__footnote p { margin:0; }
.ibg .ibg__footnote a { color:var(--wpbg-link,#1D9E75); font-weight:600; text-decoration:none; }
@media (max-width:1000px){ .ibg__grid { grid-template-columns:repeat(2,1fr) !important; } }
@media (max-width:560px){ .ibg__grid { grid-template-columns:1fr !important; } }

/* --- acf/pricing (Pricing.astro) — 3-tier cards --------------------------- */
.pricing { position:relative; background:#F8F7F3; padding:var(--sec-pt,80px) 0 var(--sec-pb,80px); font-family:var(--font-sans); }
.pricing__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; }
.pricing__head { text-align:center; margin-bottom:52px; }
.pricing .pricing__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.pricing .pricing__title { font-family:var(--font-heading,var(--font-sans)); font-size:38px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 12px; letter-spacing:-.02em; }
.pricing .pricing__subtitle { font-size:17px; color:var(--wpbg-subheading,#6B7280); max-width:440px; margin:0 auto; line-height:1.6; }
.pricing__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start; }
.pricing__card { position:relative; background:#fff; border:1px solid #E5E3DC; border-radius:16px; padding:32px 28px; }
.pricing__card--dark { background:#0F6E56; border:2px solid #1D9E75; }
.pricing__badge { position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:#D85A30; color:#fff; font-size:11px; font-weight:700; padding:4px 16px; border-radius:999px; letter-spacing:.04em; white-space:nowrap; }
.pricing__name { font-size:13px; font-weight:600; color:#6B7280; text-transform:uppercase; letter-spacing:.08em; margin:0 0 14px; }
.pricing__card--dark .pricing__name { color:rgba(255,255,255,.6); }
.pricing__price-row { margin-bottom:6px; }
.pricing .pricing__price { font-size:48px; font-weight:800; color:var(--wpbg-heading,#111827); letter-spacing:-.03em; line-height:1; }
.pricing__card--dark .pricing__price { color:#fff; }
.pricing .pricing__price-suffix { font-size:15px; color:var(--wpbg-muted,#9CA3AF); }
.pricing__card--dark .pricing__price-suffix { color:rgba(255,255,255,.55); }
.pricing .pricing__note { font-size:13px; color:var(--wpbg-muted,#9CA3AF); margin:0 0 18px; }
.pricing__card--dark .pricing__note { color:rgba(255,255,255,.5); }
.pricing .pricing__desc { font-size:14px; color:var(--wpbg-text,#6B7280); line-height:1.6; margin:0 0 22px; }
.pricing__card--dark .pricing__desc { color:rgba(255,255,255,.72); }
.pricing__features { display:flex; flex-direction:column; gap:10px; margin:0 0 26px; padding:0; list-style:none; }
.pricing .pricing__feature { display:flex; align-items:center; gap:9px; font-size:14px; color:var(--wpbg-text,#374151); }
.pricing__feature svg { color:#1D9E75; flex-shrink:0; }
.pricing__card--dark .pricing__feature { color:rgba(255,255,255,.85); }
.pricing__card--dark .pricing__feature svg { color:#7FDFC0; }
.pricing__cta { display:block; width:100%; text-align:center; padding:14px; border-radius:9px; font-size:15px; font-weight:700; text-decoration:none; border:1px solid transparent; box-sizing:border-box; }
.pricing__cta--light { background:#F8F7F3; color:#111827; border-color:#E5E3DC; }
.pricing__cta--primary { background:#D85A30; color:#fff; }
.pricing__cta--dark { background:#111827; color:#fff; }
.pricing__footnote { text-align:center; font-size:13px; color:#9CA3AF; margin:22px 0 0; }
@media (max-width:900px){ .pricing__grid { grid-template-columns:1fr; max-width:420px; margin:0 auto; } }

/* --- acf/faq (Faq.astro) — sticky two-column FAQ -------------------------- */
.faq2 { position:relative; background:#F8F7F3; padding:var(--sec-pt,80px) 0 var(--sec-pb,80px); font-family:var(--font-sans); }
.faq2__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:0 24px; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
.faq2__aside { position:sticky; top:80px; }
.faq2 .faq2__eyebrow { font-size:12px; font-weight:600; color:var(--wpbg-accent,#1D9E75); letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.faq2 .faq2__title { font-family:var(--font-heading,var(--font-sans)); font-size:38px; font-weight:800; color:var(--wpbg-heading,#111827); margin:0 0 16px; letter-spacing:-.02em; }
.faq2 .faq2__lead { font-size:16px; color:var(--wpbg-subheading,#6B7280); line-height:1.65; margin:0 0 28px; }
.faq2__cta { background:#D85A30; color:#fff; padding:13px 26px; border-radius:8px; font-size:15px; font-weight:700; border:none; display:inline-flex; align-items:center; gap:8px; text-decoration:none; }
.faq2__list { display:flex; flex-direction:column; }
.faq2__item { border-bottom:1px solid #E5E3DC; padding:22px 0; }
.faq2__item:first-child { padding-top:0; }
.faq2__item:last-child { border-bottom:none; padding-bottom:0; }
.faq2 .faq2__q { font-size:16px; font-weight:700; color:var(--wpbg-heading,#111827); margin:0 0 10px; }
.faq2 .faq2__a { font-size:14px; color:var(--wpbg-text,#6B7280); line-height:1.65; margin:0; }
@media (max-width:820px){ .faq2__inner { grid-template-columns:1fr; gap:32px; } .faq2__aside { position:static; } }

/* --- acf/service-hero (ServiceHero.astro) — configurable hero ------------- */
.sh { position:relative; overflow:hidden; background:var(--sh-bg,#0B0F18); font-family:var(--font-sans); }
.sh--red { --sh-accent:#ef4444; --sh-accent-rgb:239,68,68; }
.sh--orange { --sh-accent:#D85A30; --sh-accent-rgb:216,90,48; }
.sh--green { --sh-accent:#1D9E75; --sh-accent-rgb:29,158,117; }
.sh--purple { --sh-accent:#a78bfa; --sh-accent-rgb:139,92,246; --sh-bg:#14082b; }
.sh--emerald { --sh-accent:#10b981; --sh-accent-rgb:16,185,129; }
.sh--cyan { --sh-accent:#38bdf8; --sh-accent-rgb:56,189,248; }
.sh--amber { --sh-accent:#fb923c; --sh-accent-rgb:251,146,60; }
.sh__glow { position:absolute; width:600px; height:600px; background:radial-gradient(circle,rgba(var(--sh-accent-rgb),.08) 0%,transparent 65%); top:-200px; right:-100px; pointer-events:none; }
.sh__grid { position:absolute; inset:0; background-image:linear-gradient(rgba(var(--sh-accent-rgb),.025) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--sh-accent-rgb),.025) 1px,transparent 1px); background-size:52px 52px; pointer-events:none; }
.sh__inner { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:var(--sec-pt,64px) 24px var(--sec-pb,80px); display:grid; grid-template-columns:1fr 400px; gap:56px; align-items:center; }
.sh--centered .sh__inner { grid-template-columns:1fr; text-align:center; }
.sh--centered .sh__copy { max-width:720px; margin:0 auto; }
.sh--centered .sh__actions, .sh--centered .sh__checklist, .sh--centered .sh__trust { justify-content:center; }
.sh__badge { display:inline-flex; align-items:center; gap:8px; background:rgba(var(--sh-accent-rgb),.1); border:1px solid rgba(var(--sh-accent-rgb),.25); border-radius:999px; padding:6px 16px; margin-bottom:24px; font-size:13px; font-weight:600; color:var(--sh-accent); }
.sh__badge-dot { width:7px; height:7px; background:var(--sh-accent); border-radius:50%; flex-shrink:0; animation:sh-pulse 1.2s ease-in-out infinite; }
.sh__badge-icon { display:inline-flex; color:var(--sh-accent); }
.sh .sh__headline { font-family:var(--font-heading,var(--font-sans)); font-size:56px; font-weight:800; line-height:1.05; color:var(--wpbg-heading,#fff); margin:0 0 20px; letter-spacing:-.03em; }
.sh .sh__accent { color:var(--wpbg-accent,var(--sh-accent)); }
.sh__accent2 { color:#1D9E75; }
.sh .sh__subtitle { font-size:17px; line-height:1.65; color:var(--wpbg-subheading,rgba(255,255,255,.55)); margin:0 0 32px; max-width:520px; }
.sh--centered .sh__subtitle { max-width:620px; margin-left:auto; margin-right:auto; }
.sh__actions { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:24px; }
.sh__btn { display:inline-flex; align-items:center; gap:8px; padding:14px 28px; border-radius:8px; font-size:15px; font-weight:700; text-decoration:none; border:1px solid transparent; }
.sh__btn--accent { background:var(--sh-accent); color:#fff; }
.sh__btn--orange { background:#D85A30; color:#fff; }
.sh__btn--green { background:#1D9E75; color:#fff; }
.sh__btn--cyan { background:#38bdf8; color:#0B0F18; }
.sh__btn--whatsapp { background:#25D366; color:#fff; }
.sh__btn--ghost { background:transparent; color:rgba(255,255,255,.8); border-color:rgba(255,255,255,.18); font-weight:500; }
.sh__wa-inline { font-size:13px; margin:0 0 24px; }
.sh__wa-inline a { color:#25D366; font-weight:600; text-decoration:none; }
.sh__trust { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:24px; padding:12px 0; border-top:1px solid rgba(255,255,255,.07); border-bottom:1px solid rgba(255,255,255,.07); }
.sh .sh__trust-label { font-size:10px; color:var(--wpbg-muted,rgba(255,255,255,.3)); text-transform:uppercase; letter-spacing:.08em; }
.sh .sh__trust-item { font-size:11px; font-weight:700; color:var(--wpbg-muted,rgba(255,255,255,.22)); letter-spacing:.06em; }
.sh__checklist { display:flex; gap:20px; flex-wrap:wrap; }
.sh .sh__check { display:flex; align-items:center; gap:7px; color:var(--wpbg-accent,#1D9E75); }
.sh .sh__check span { font-size:13px; color:var(--wpbg-text,rgba(255,255,255,.55)); }
.sh__panel { width:100%; }
.sh-incident { position:relative; overflow:hidden; background:#111b28; border:1px solid rgba(var(--sh-accent-rgb),.25); border-radius:16px; padding:24px; }
.sh-incident__bar { position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(to right,var(--sh-accent),#D85A30); }
.sh-incident__eyebrow { font-size:11px; font-weight:700; color:rgba(255,255,255,.3); letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px; }
.sh-incident__status { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.sh-incident__dot { width:8px; height:8px; background:var(--sh-accent); border-radius:50%; animation:sh-pulse 1s ease-in-out infinite; }
.sh-incident__status-label { font-size:14px; font-weight:700; color:var(--sh-accent); }
.sh-incident__meta { font-size:13px; color:rgba(255,255,255,.5); margin:0 0 16px; }
.sh-incident__steps { list-style:none; margin:0 0 18px; padding:0; display:flex; flex-direction:column; gap:10px; }
.sh-incident__step { display:flex; align-items:center; gap:10px; font-size:13px; color:rgba(255,255,255,.65); }
.sh-incident__step--pending { opacity:.4; color:rgba(255,255,255,.4); }
.sh-incident__circle { width:14px; height:14px; border:2px solid rgba(255,255,255,.15); border-radius:50%; flex-shrink:0; }
.sh-incident__progress { background:rgba(255,255,255,.04); border-radius:999px; height:5px; overflow:hidden; margin-bottom:8px; }
.sh-incident__progress-fill { height:100%; background:linear-gradient(to right,var(--sh-accent),#D85A30); }
.sh-incident__note { font-size:11px; color:rgba(255,255,255,.3); margin-bottom:16px; }
.sh-incident__cta { display:block; width:100%; text-align:center; background:#D85A30; color:#fff; padding:12px; border-radius:8px; font-size:14px; font-weight:700; text-decoration:none; box-sizing:border-box; }
.sh-incident__cta-note { font-size:11px; color:rgba(255,255,255,.3); text-align:center; margin:8px 0 0; }
.sh-ba { display:flex; flex-direction:column; gap:12px; }
.sh-ba__card { background:#111b28; border-radius:14px; padding:20px; display:flex; align-items:center; gap:16px; }
.sh-ba__card--before { border:1px solid rgba(239,68,68,.25); }
.sh-ba__card--after { border:1px solid rgba(29,158,117,.35); }
.sh-ba__grade { width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:20px; font-weight:800; }
.sh-ba__card--before .sh-ba__grade { background:rgba(239,68,68,.1); border:2px solid #ef4444; color:#ef4444; }
.sh-ba__card--after .sh-ba__grade { background:rgba(29,158,117,.15); border:2px solid #1D9E75; color:#1D9E75; }
.sh-ba__eyebrow { font-size:11px; color:rgba(255,255,255,.35); text-transform:uppercase; letter-spacing:.08em; margin-bottom:3px; }
.sh-ba__value { font-size:20px; font-weight:800; color:#fff; }
.sh-ba__note { font-size:12px; color:rgba(255,255,255,.4); }
.sh-ba__note--good { color:#1D9E75; font-weight:600; }
.sh-ba__arrow { display:flex; justify-content:center; }
.sh-ba__cta { background:#D85A30; color:#fff; padding:13px; border-radius:8px; font-size:14px; font-weight:700; text-align:center; text-decoration:none; margin-top:4px; }
.sh__panel--below { max-width:none; width:100%; margin-top:48px; text-align:left; }
/* Background image (editor uses a CSS background; the Astro frontend uses an
   <img> so it can carry srcset + intrinsic dimensions). Overlay darkens it so
   hero text stays readable; both sit below the glow/grid and content. */
.sh--has-bg-image { background-size:cover; background-position:center; background-repeat:no-repeat; }
.sh__bg-overlay { position:absolute; inset:0; background:#0B0F18; z-index:0; pointer-events:none; }
/* Code panel */
.sh-code { background:#060c14; border:1px solid #1E2F42; border-radius:16px; overflow:hidden; }
.sh-code__chrome { padding:12px 16px; border-bottom:1px solid #1a2435; display:flex; align-items:center; gap:8px; }
.sh-code__dot { width:10px; height:10px; border-radius:50%; }
.sh-code__dot--red { background:#ef4444; }
.sh-code__dot--yellow { background:#eab308; }
.sh-code__dot--green { background:#1D9E75; }
.sh-code__filename { font-size:11px; color:rgba(255,255,255,.3); margin-left:8px; font-family:monospace; }
.sh-code__body { padding:20px; font-family:monospace; font-size:12px; line-height:1.8; }
.sh-code__prompt { background:rgba(139,92,246,.08); border:1px solid rgba(139,92,246,.2); border-radius:6px; padding:10px; margin-bottom:10px; }
.sh-code__prompt-line { font-size:11px; color:rgba(255,255,255,.4); white-space:pre-wrap; }
.sh-code__prompt-line--first { color:#a78bfa; }
.sh-code__line { color:rgba(255,255,255,.85); white-space:pre-wrap; }
.sh-code__line--comment { color:rgba(139,92,246,.6); }
.sh-code__line--ok { color:rgba(29,158,117,.7); margin-top:8px; }
.sh-code__footer { padding:10px 20px; border-top:1px solid rgba(255,255,255,.05); display:flex; align-items:center; gap:8px; font-size:11px; color:rgba(255,255,255,.35); }
.sh-code__pulse { width:6px; height:6px; background:#1D9E75; border-radius:50%; display:block; animation:sh-pulse 2s ease-in-out infinite; }
/* Chat panel */
.sh-chat { background:#1a0a2e; border:1px solid rgba(var(--sh-accent-rgb),.3); border-radius:16px; overflow:hidden; box-shadow:0 0 48px rgba(var(--sh-accent-rgb),.15); }
.sh-chat__head { background:linear-gradient(135deg,#2d1240,#1a0a2e); padding:14px 18px; border-bottom:1px solid rgba(var(--sh-accent-rgb),.2); display:flex; align-items:center; gap:10px; }
.sh-chat__avatar { width:32px; height:32px; background:linear-gradient(135deg,#a78bfa,#7c3aed); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; }
.sh-chat__title { font-size:13px; font-weight:700; color:#fff; }
.sh-chat__status { display:flex; align-items:center; gap:5px; font-size:11px; color:rgba(255,255,255,.5); }
.sh-chat__status-dot { width:5px; height:5px; background:#1D9E75; border-radius:50%; }
.sh-chat__messages { padding:16px; display:flex; flex-direction:column; gap:10px; background:#120828; }
.sh-chat__row { display:flex; gap:8px; align-items:flex-end; }
.sh-chat__row--user { justify-content:flex-end; }
.sh-chat__mini-avatar { width:26px; height:26px; background:rgba(var(--sh-accent-rgb),.25); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--sh-accent); }
.sh-chat__bubble { padding:10px 13px; max-width:220px; }
.sh-chat__bubble p { font-size:13px; margin:0; line-height:1.5; }
.sh-chat__bubble--bot { background:#1e0d35; border:1px solid rgba(var(--sh-accent-rgb),.2); border-radius:10px 10px 10px 3px; }
.sh-chat__bubble--bot p { color:rgba(255,255,255,.85); }
.sh-chat__bubble--user { background:rgba(var(--sh-accent-rgb),.2); border:1px solid rgba(var(--sh-accent-rgb),.3); border-radius:10px 10px 3px 10px; max-width:200px; }
.sh-chat__bubble--user p { color:#fff; }
.sh-chat__input { background:#120828; border-top:1px solid rgba(var(--sh-accent-rgb),.15); padding:12px; display:flex; gap:8px; align-items:center; }
.sh-chat__field { flex:1; background:#1e0d35; border:1px solid rgba(var(--sh-accent-rgb),.2); border-radius:8px; padding:9px 12px; color:rgba(255,255,255,.4); font-size:13px; }
.sh-chat__send { width:36px; height:36px; background:var(--sh-accent); border-radius:8px; display:flex; align-items:center; justify-content:center; color:#fff; box-shadow:0 0 12px rgba(var(--sh-accent-rgb),.4); flex-shrink:0; }
/* Workflow panel */
.sh-wf { background:#111b28; border:1px solid #1E2F42; border-radius:16px; padding:24px; }
.sh-wf__eyebrow { font-size:11px; font-weight:700; color:rgba(255,255,255,.3); letter-spacing:.1em; text-transform:uppercase; margin-bottom:16px; }
.sh-wf__steps { display:flex; flex-direction:column; }
.sh-wf__step { display:flex; gap:12px; align-items:flex-start; padding-bottom:16px; position:relative; }
.sh-wf__step:last-child { padding-bottom:0; }
.sh-wf__line { position:absolute; left:15px; top:32px; bottom:0; width:1px; background:rgba(29,158,117,.2); }
.sh-wf__node { width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; z-index:1; }
.sh-wf__node--green { background:rgba(29,158,117,.15); border:1px solid rgba(29,158,117,.3); color:#1D9E75; }
.sh-wf__node--purple { background:rgba(139,92,246,.2); border:1px solid rgba(139,92,246,.3); color:#a78bfa; }
.sh-wf__node--emerald { background:rgba(16,185,129,.15); border:1px solid rgba(16,185,129,.3); color:#10b981; }
.sh-wf__node--orange { background:rgba(216,90,48,.15); border:1px solid rgba(216,90,48,.3); color:#D85A30; }
.sh-wf__node--solid { background:#1D9E75; border-color:#1D9E75; color:#fff; }
.sh-wf__title { font-size:13px; font-weight:600; color:#fff; }
.sh-wf__title--highlight { color:#1D9E75; }
.sh-wf__meta { font-size:11px; color:rgba(255,255,255,.4); }
/* Architecture panel */
.sh-arch { background:#111b28; border:1px solid rgba(var(--sh-accent-rgb),.2); border-radius:16px; padding:24px; box-shadow:0 0 40px rgba(var(--sh-accent-rgb),.08); }
.sh-arch__eyebrow { font-size:11px; font-weight:700; color:rgba(255,255,255,.3); letter-spacing:.1em; text-transform:uppercase; margin-bottom:16px; }
.sh-arch__stack { display:flex; flex-direction:column; gap:10px; }
.sh-arch__node { background:#0B0F18; border-radius:10px; padding:14px 16px; display:flex; align-items:center; gap:12px; }
.sh-arch__node--top { border:1px solid rgba(29,158,117,.2); }
.sh-arch__node--bottom { border:1px solid rgba(var(--sh-accent-rgb),.25); }
.sh-arch__letter { width:36px; height:36px; border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:15px; font-weight:900; }
.sh-arch__letter--green { background:rgba(29,158,117,.15); color:#1D9E75; }
.sh-arch__letter--accent { background:rgba(var(--sh-accent-rgb),.1); color:var(--sh-accent); }
.sh-arch__node-title { font-size:13px; font-weight:700; color:#fff; }
.sh-arch__node-meta { font-size:11px; color:rgba(255,255,255,.4); }
.sh-arch__connector { display:flex; justify-content:center; align-items:center; gap:8px; }
.sh-arch__vline { width:1px; height:20px; background:rgba(var(--sh-accent-rgb),.3); display:block; }
.sh-arch__api { background:#111b28; border:1px solid rgba(var(--sh-accent-rgb),.3); border-radius:6px; padding:3px 10px; display:flex; align-items:center; gap:6px; font-size:10px; color:var(--sh-accent); font-weight:700; }
.sh-arch__arrow { display:flex; justify-content:center; }
.sh-arch__result { background:rgba(29,158,117,.08); border:1px solid rgba(29,158,117,.25); border-radius:10px; padding:12px 16px; text-align:center; }
.sh-arch__result-title { font-size:14px; font-weight:800; color:#1D9E75; }
.sh-arch__result-note { font-size:11px; color:rgba(255,255,255,.35); margin-top:3px; }
/* Comparison panel */
.sh-cmp { display:flex; flex-direction:column; gap:16px; }
.sh-cmp__box { background:#111b28; border:1px solid rgba(var(--sh-accent-rgb),.25); border-radius:16px; padding:24px; }
.sh-cmp__eyebrow { font-size:11px; font-weight:700; color:rgba(255,255,255,.3); letter-spacing:.1em; text-transform:uppercase; margin-bottom:16px; }
.sh-cmp__rows { display:flex; flex-direction:column; gap:14px; }
.sh-cmp__row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.sh-cmp__label { font-size:13px; color:rgba(255,255,255,.6); }
.sh-cmp__values { display:flex; align-items:center; gap:8px; }
.sh-cmp__before { font-size:13px; color:rgba(255,255,255,.3); text-decoration:line-through; }
.sh-cmp__after { font-size:15px; font-weight:800; }
.sh-cmp__after--green { color:#1D9E75; }
.sh-cmp__after--amber { color:#fb923c; }
.sh-cmp__cta { background:var(--sh-accent); color:#fff; padding:13px; border-radius:8px; font-size:14px; font-weight:700; text-align:center; text-decoration:none; }
/* Pricing panel (centered, full-width below copy) */
.sh-pricing { width:100%; }
.sh-pricing__toggle { display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:48px; }
.sh-pricing__toggle-off { font-size:14px; color:rgba(255,255,255,.5); }
.sh-pricing__toggle-on { font-size:14px; color:#fff; font-weight:600; }
.sh-pricing__switch { width:42px; height:24px; background:#1D9E75; border-radius:999px; position:relative; display:inline-block; }
.sh-pricing__knob { width:18px; height:18px; background:#fff; border-radius:50%; position:absolute; right:3px; top:3px; }
.sh-pricing__save { background:rgba(29,158,117,.15); border:1px solid rgba(29,158,117,.3); border-radius:999px; padding:3px 12px; font-size:12px; color:#1D9E75; font-weight:600; }
.sh-pricing__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; text-align:left; margin-bottom:48px; }
.sh-pricing__card { position:relative; overflow:hidden; background:#111b28; border:1px solid #1E2F42; border-radius:16px; padding:28px; }
.sh-pricing__card--popular { border:2px solid #1D9E75; box-shadow:0 0 40px rgba(29,158,117,.15); overflow:visible; }
.sh-pricing__card--premium { border:1px solid rgba(216,90,48,.3); }
.sh-pricing__badge { position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:#1D9E75; color:#fff; font-size:11px; font-weight:700; padding:4px 16px; border-radius:999px; letter-spacing:.06em; white-space:nowrap; }
.sh-pricing__topbar { position:absolute; top:0; left:0; right:0; height:3px; background:#D85A30; border-radius:16px 16px 0 0; }
.sh-pricing__name { font-size:18px; font-weight:700; color:rgba(255,255,255,.85); margin:0 0 4px; }
.sh-pricing__desc { font-size:12px; color:rgba(255,255,255,.4); margin:0 0 16px; }
.sh-pricing__price { margin-bottom:6px; }
.sh-pricing__price span { font-size:40px; font-weight:800; color:#fff; }
.sh-pricing__price em { font-style:normal; font-size:13px; color:rgba(255,255,255,.4); }
.sh-pricing__save-note { display:inline-flex; align-items:center; gap:5px; background:rgba(29,158,117,.1); border:1px solid rgba(29,158,117,.2); border-radius:999px; padding:3px 10px; margin-bottom:20px; color:#1D9E75; }
.sh-pricing__save-note span { font-size:11px; font-weight:600; }
.sh-pricing__cta { display:block; width:100%; text-align:center; padding:12px; border-radius:8px; font-size:14px; font-weight:700; text-decoration:none; margin-bottom:22px; box-sizing:border-box; border:1px solid transparent; }
.sh-pricing__cta--ghost { background:transparent; color:#1D9E75; border-color:#1D9E75; }
.sh-pricing__cta--green { background:#1D9E75; color:#fff; }
.sh-pricing__cta--orange { background:#D85A30; color:#fff; }
.sh-pricing__features { display:flex; flex-direction:column; gap:10px; }
.sh-pricing__feature { display:flex; align-items:center; gap:8px; color:#1D9E75; }
.sh-pricing__feature span { font-size:13px; color:rgba(255,255,255,.7); }
.sh-pricing__feature--off { opacity:.4; color:rgba(255,255,255,.2); }
.sh-pricing__feature--off span { color:rgba(255,255,255,.3); }
.sh-pricing__stats { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; background:#111b28; border:1px solid #1E2F42; border-radius:16px; padding:36px; }
.sh-pricing__stat { text-align:center; }
.sh-pricing__stat-value { font-size:40px; font-weight:800; line-height:1; }
.sh-pricing__stat-value--white { color:#fff; }
.sh-pricing__stat-value--green { color:#1D9E75; }
.sh-pricing__stat-value--orange { color:#D85A30; }
.sh-pricing__stat-label { font-size:13px; color:rgba(255,255,255,.4); margin-top:5px; }
@keyframes sh-pulse { 0%,100% { opacity:1; } 50% { opacity:.35; } }
@keyframes sh-spin { to { transform:rotate(360deg); } }
.sh-spin { animation:sh-spin .9s linear infinite; transform-origin:center; }
@media (max-width:900px){ .sh__inner { grid-template-columns:1fr; gap:40px; } .sh__headline { font-size:40px; } .sh-pricing__grid { grid-template-columns:1fr; max-width:420px; margin-left:auto; margin-right:auto; } .sh-pricing__stats { grid-template-columns:repeat(2,1fr); } }
