/* Project portfolio + product demo centre. Public rules are scoped to body.site; admin rules use the adm-/badge-status prefixes. */

/* ---------- Status chips (shared by cards, heroes, detail pages) ---------- */
body.site .status-chip, body.site .verified-badge { --c:#8a8478; display:inline-flex; align-items:center; gap:.4rem; padding:.28rem .7rem; border-radius:999px; font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; line-height:1.2; white-space:nowrap; }
body.site .status-chip { color:color-mix(in srgb, var(--c) 72%, var(--color-heading)); background:color-mix(in srgb, var(--c) 14%, transparent); }
body.site .status-chip i { width:.45rem; height:.45rem; border-radius:50%; background:var(--c); flex-shrink:0; }
body.site .st-LIVE { --c:#22a06b; } body.site .st-PILOT { --c:#d99a1b; } body.site .st-IN_DEVELOPMENT { --c:#3b82f6; }
body.site .st-PLANNED { --c:#8b7cf6; } body.site .st-PROTOTYPE { --c:#d6568f; } body.site .st-COMPLETED { --c:#14a3a3; }
body.site .verified-badge { --c:#22a06b; color:color-mix(in srgb, var(--c) 72%, var(--color-heading)); background:color-mix(in srgb, var(--c) 14%, transparent); }
body.site .verified-badge svg { width:.9rem; height:.9rem; }
body.site .page-hero .status-chip, body.site .page-hero .verified-badge { color:color-mix(in srgb, var(--c) 55%, #fff); background:color-mix(in srgb, var(--c) 22%, transparent); }
body.site .hero-badges { display:flex; flex-wrap:wrap; gap:.6rem; margin:-.6rem 0 1.4rem; }

/* ---------- Catalogue / portfolio cards (modelled on a clean idea-board card) ---------- */
body.site .pgrid { display:grid; gap:1.5rem; grid-template-columns:repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
body.site .pcard { display:flex; flex-direction:column; background:var(--color-surface); border:1px solid var(--color-surface-border); border-radius:1.1rem; padding:.7rem; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
body.site .pcard[hidden] { display:none; }
body.site .pcard:hover { transform:translateY(-4px); box-shadow:var(--shadow-card); border-color:color-mix(in srgb, var(--accent) 40%, var(--color-surface-border)); }
body.site .pcard-cover { position:relative; aspect-ratio:16/10; border-radius:.8rem; overflow:hidden; display:flex; align-items:center; justify-content:center; background:#1c140c; }
body.site .pcard-cover img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
body.site .pcard:hover .pcard-cover img { transform:scale(1.04); }
body.site .pcard-cover.art-0 { background:linear-gradient(135deg, #ee5a2e 0%, #5b2410 100%); }
body.site .pcard-cover.art-1 { background:linear-gradient(135deg, #e0a94e 0%, #5b3a10 100%); }
body.site .pcard-cover.art-2 { background:linear-gradient(135deg, #1489ff 0%, #0b1f44 100%); }
body.site .pcard-cover.art-3 { background:linear-gradient(135deg, #19b8c8 0%, #0b2f3a 100%); }
body.site .pcard-cover:not(:has(img))::before { content:""; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(255,255,255,.16) 1px, transparent 1px); background-size:20px 20px; mask-image:radial-gradient(ellipse 80% 80% at 70% 30%, #000 10%, transparent 75%); }
body.site .pcard-cover:not(:has(img))::after { content:""; position:absolute; width:62%; aspect-ratio:1; border-radius:50%; right:-14%; bottom:-38%; background:rgba(255,255,255,.12); }
body.site .pcard-mark { position:relative; z-index:1; font-family:var(--font-display); font-weight:250; font-size:clamp(2.6rem, 5vw, 3.6rem); letter-spacing:-.04em; color:rgba(255,255,255,.92); }
body.site .pcard-body { padding:1rem .6rem .4rem; flex:1; }
body.site .pcard-tags { display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; min-height:1.6rem; margin-bottom:.7rem; }
body.site .pcard-badge { display:inline-flex; align-items:center; padding:.22rem .6rem; border-radius:999px; font-size:.68rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--accent-strong); background:var(--accent-soft); }
body.site .pcard h3 { margin:0 0 .45rem; font-size:1.05rem; line-height:1.3; color:var(--color-heading); }
body.site .pcard-summary { margin:0; font-size:.88rem; line-height:1.6; color:var(--color-muted); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
body.site .pcard-foot { display:flex; justify-content:space-between; align-items:center; gap:.75rem; margin:.9rem .6rem .35rem; padding-top:.8rem; border-top:1px solid var(--color-surface-border); font-size:.76rem; color:var(--color-muted); }
body.site .pcard-cat { display:inline-flex; align-items:center; gap:.45rem; min-width:0; }
body.site .pcard-cat svg { width:1rem; height:1rem; flex-shrink:0; }
body.site .pcard-stat { font-weight:700; color:var(--color-heading); text-align:right; }

/* ---------- Filter bar ---------- */
body.site .sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
body.site .filter-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 1.5rem; margin-bottom:2rem; }
body.site .filter-groups { display:flex; flex-direction:column; gap:.7rem; }
body.site .pills { display:flex; flex-wrap:wrap; gap:.5rem; }
body.site .pill { display:inline-flex; align-items:center; gap:.45rem; padding:.5rem 1rem; border-radius:999px; border:1px solid var(--color-surface-border); background:transparent; color:var(--color-text); font:inherit; font-size:.82rem; font-weight:600; cursor:pointer; transition:border-color .15s, background .15s, color .15s; }
body.site .pill span { font-size:.72rem; font-weight:700; color:var(--color-muted); }
body.site .pill:hover { border-color:var(--accent); }
body.site .pill.is-active { background:var(--accent); border-color:var(--accent); color:#fff; }
body.site .pill.is-active span { color:rgba(255,255,255,.8); }
body.site .filter-search { position:relative; width:17rem; max-width:100%; }
body.site .filter-search svg { position:absolute; left:.9rem; top:50%; transform:translateY(-50%); width:1rem; height:1rem; color:var(--color-muted); pointer-events:none; }
body.site .filter-search input { width:100%; padding:.65rem 1rem .65rem 2.4rem; border-radius:999px; border:1px solid var(--color-surface-border); background:var(--color-surface); color:var(--color-text); font:inherit; font-size:.88rem; }
body.site .filter-empty { text-align:center; color:var(--color-muted); padding:2.5rem 0; }
body.site .filter-empty[hidden] { display:none; }
body.site .catalogue-cta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.25rem; margin-top:3.5rem; padding:1.75rem 2rem; border-radius:1.1rem; background:var(--color-soft); border:1px solid var(--color-surface-border); }
body.site .catalogue-cta h3 { margin:0 0 .3rem; }
body.site .catalogue-cta p { margin:0; color:var(--color-muted); font-size:.92rem; }

/* ---------- Detail pages ---------- */
body.site .anchor-nav { display:flex; gap:.4rem; overflow-x:auto; padding-bottom:.25rem; margin-bottom:2.5rem; border-bottom:1px solid var(--color-surface-border); scrollbar-width:thin; }
body.site .anchor-nav a { flex-shrink:0; padding:.7rem 1rem; font-size:.84rem; font-weight:600; color:var(--color-muted); border-bottom:2px solid transparent; margin-bottom:-1px; }
body.site .anchor-nav a:hover { color:var(--accent); border-bottom-color:var(--accent); }
body.site .pd-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:2.5rem; }
@media (min-width:960px) { body.site .pd-layout { grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:3.5rem; } body.site .pd-aside { position:sticky; top:6rem; align-self:start; } }
body.site .pd-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-bottom:2rem; }
body.site .pd-cover { width:100%; border-radius:1.1rem; border:1px solid var(--color-surface-border); margin-bottom:2rem; aspect-ratio:16/9; object-fit:cover; }
body.site .pd-block { margin-bottom:3rem; scroll-margin-top:6rem; }
body.site .pd-block > h2 { font-size:clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); margin-bottom:1.1rem; }
body.site .pd-sub { margin:1.5rem 0 .8rem; font-size:.95rem; }
body.site .pd-text { color:var(--color-muted); font-size:1.02rem; line-height:1.8; }
body.site .pd-tick { display:flex; align-items:flex-start; gap:.65rem; padding:.8rem 1rem; font-size:.92rem; }
body.site .pd-tick svg { width:1.05rem; height:1.05rem; margin-top:.15rem; flex-shrink:0; color:var(--accent); }
body.site .chip-list { display:flex; flex-wrap:wrap; gap:.55rem; list-style:none; margin:0; padding:0; }
body.site .chip { display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .95rem; border-radius:999px; background:var(--color-surface); border:1px solid var(--color-surface-border); font-size:.85rem; color:var(--color-text); }
body.site .chip svg { width:.95rem; height:.95rem; color:var(--accent); flex-shrink:0; }
body.site .plain-list { margin:0; padding-left:1.1rem; color:var(--color-muted); line-height:1.9; font-size:.92rem; }
body.site .glance h3 { margin-bottom:1rem; }
body.site .glance dl { margin:0 0 1.25rem; display:grid; grid-template-columns:auto 1fr; gap:.7rem 1rem; font-size:.88rem; align-items:center; }
body.site .glance dt { color:var(--color-muted); }
body.site .glance dd { margin:0; color:var(--color-heading); font-weight:600; text-align:right; }
body.site .verify-box { margin-top:1.1rem; padding-top:1.1rem; border-top:1px solid var(--color-surface-border); }
body.site .verify-box p { margin:.7rem 0 0; font-size:.82rem; color:var(--color-muted); }

/* Outcome metrics */
body.site .metric-tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(11rem, 1fr)); gap:1rem; margin-bottom:3rem; }
body.site .metric { padding:1.4rem 1.5rem; border-radius:1.1rem; background:var(--color-surface); border:1px solid var(--color-surface-border); border-top:3px solid var(--accent); }
body.site .metric strong { display:block; font-family:var(--font-display); font-weight:300; font-size:clamp(2rem, 1.5rem + 1.6vw, 2.8rem); line-height:1.05; letter-spacing:-.03em; color:var(--color-heading); }
body.site .metric span { display:block; margin-top:.5rem; font-size:.84rem; color:var(--color-muted); line-height:1.45; }
body.site .arch-figure { margin:1.25rem 0 0; }
body.site .arch-figure img { width:100%; border-radius:1rem; border:1px solid var(--color-surface-border); background:#fff; }
body.site .ref-quote { margin:0 0 3rem; padding:1.75rem 2rem; border-radius:1.1rem; background:var(--color-soft); border-left:4px solid var(--accent); }
body.site .ref-quote blockquote { margin:0 0 1rem; font-family:var(--font-display); font-weight:300; font-size:1.25rem; line-height:1.55; color:var(--color-heading); }
body.site .ref-quote figcaption { display:flex; flex-direction:column; gap:.15rem; font-size:.88rem; color:var(--color-heading); }
body.site .ref-quote figcaption span { color:var(--color-muted); }

/* Demo */
body.site .demo-card { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.25rem; }
body.site .demo-card h3 { margin-bottom:.3rem; }
body.site .demo-frame { border-radius:1.1rem; overflow:hidden; border:1px solid var(--color-surface-border); background:#fff; box-shadow:var(--shadow-card); }
body.site .demo-frame iframe { display:block; width:100%; height:min(70vh, 640px); border:0; }
body.site .demo-note { margin:.9rem 0 0; font-size:.85rem; color:var(--color-muted); }
body.site .demo-note a { color:var(--accent); display:inline-flex; align-items:center; gap:.35rem; }
body.site .demo-note svg { width:.9rem; height:.9rem; }

/* Docs + FAQ */
body.site .doc-list { list-style:none; margin:0; padding:0; display:grid; gap:.6rem; }
body.site .doc-list a { display:flex; align-items:center; gap:.75rem; padding:.85rem 1.1rem; border-radius:.8rem; background:var(--color-surface); border:1px solid var(--color-surface-border); font-size:.92rem; font-weight:600; color:var(--color-heading); }
body.site .doc-list a:hover { border-color:var(--accent); }
body.site .doc-list svg { width:1.1rem; height:1.1rem; color:var(--accent); flex-shrink:0; }
body.site .doc-list a svg:last-child { margin-left:auto; color:var(--color-muted); width:.95rem; height:.95rem; }
body.site .faq-list { display:grid; gap:.7rem; }
body.site .faq-item { border-radius:.9rem; background:var(--color-surface); border:1px solid var(--color-surface-border); }
body.site .faq-item summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.25rem; font-weight:600; font-size:.95rem; color:var(--color-heading); cursor:pointer; list-style:none; }
body.site .faq-item summary::-webkit-details-marker { display:none; }
body.site .faq-item summary svg { width:1.1rem; height:1.1rem; flex-shrink:0; color:var(--accent); transition:transform .2s; }
body.site .faq-item[open] summary svg { transform:rotate(180deg); }
body.site .faq-item p { margin:0; padding:0 1.25rem 1.15rem; color:var(--color-muted); font-size:.92rem; }

/* Demo request form */
body.site .req-form { position:relative; }
body.site .req-grid { display:grid; gap:0 1.25rem; grid-template-columns:1fr; }
@media (min-width:640px) { body.site .req-grid { grid-template-columns:1fr 1fr; } }

/* ---------- Admin: badges, form sections, repeaters ---------- */
.badge-status.LIVE { background:#dcfce7; color:#166534; }
.badge-status.PILOT { background:#fef3c7; color:#92400e; }
.badge-status.IN_DEVELOPMENT { background:#dbeafe; color:#1e40af; }
.badge-status.PLANNED { background:#ede9fe; color:#5b21b6; }
.badge-status.COMPLETED { background:#ccfbf1; color:#115e59; }
.badge-status.FEATURED { background:#ffedd5; color:#9a3412; margin-left:.35rem; }
.admin-table tr[data-filtered-out] { display:none; }
.adm-filters { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; }
.adm-filters select { padding:.5rem .7rem; border-radius:.6rem; border:1px solid var(--color-surface-border); background:var(--color-surface); color:var(--color-text); font-size:.82rem; }
.adm-linkbtn { background:none; border:none; color:inherit; cursor:pointer; padding:0; font:inherit; }
.btn svg { width:1rem; height:1rem; flex-shrink:0; }
.adm-form { max-width:60rem; }
.adm-section { margin-bottom:1.25rem; }
.adm-section > h3 { margin:0 0 1rem; font-size:1.02rem; padding-bottom:.7rem; border-bottom:1px solid var(--color-surface-border); }
.adm-grid-2 { display:grid; grid-template-columns:1fr; gap:0 1.25rem; }
@media (min-width:720px) { .adm-grid-2 { grid-template-columns:1fr 1fr; } }
.adm-check { display:flex; align-items:center; gap:.5rem; font-weight:400 !important; font-size:.88rem; cursor:pointer; }
.adm-check input { width:auto !important; }
.adm-savebar { position:sticky; bottom:0; z-index:20; display:flex; justify-content:flex-end; gap:.75rem; padding:.9rem 1.25rem; margin-top:1.25rem; background:var(--color-surface); border:1px solid var(--color-surface-border); border-radius:.9rem; box-shadow:0 -8px 24px -12px rgba(0,0,0,.18); }
.adm-thumb-row { display:flex; align-items:center; gap:1rem; margin-bottom:.6rem; }
.adm-thumb { width:5rem; height:5rem; object-fit:cover; border-radius:.6rem; border:1px solid var(--color-surface-border); background:#fff; }
.adm-thumb-lg { width:9rem; height:5.6rem; }
.adm-thumb-grid { display:flex; flex-wrap:wrap; gap:.75rem; margin-bottom:.75rem; }
.adm-thumb-item { display:flex; flex-direction:column; align-items:center; gap:.35rem; font-size:.75rem; }
.adm-details { margin-top:.6rem; font-size:.85rem; }
.adm-details summary { cursor:pointer; color:var(--color-blue); }
.adm-details textarea { margin-top:.5rem; }
.adm-repeater-rows { display:grid; gap:.6rem; margin-bottom:.7rem; }
.adm-repeater-row { display:flex; gap:.6rem; align-items:flex-start; }
.adm-repeater-row input, .adm-repeater-row textarea { min-width:0; }
.adm-row-remove { flex-shrink:0; width:2.2rem; height:2.4rem; border-radius:.6rem; border:1px solid var(--color-surface-border); background:var(--color-surface); color:var(--color-muted); font-size:1.3rem; line-height:1; cursor:pointer; }
.adm-row-remove:hover { color:#dc2626; border-color:#dc2626; }
.adm-row-add { padding:.55rem 1rem; font-size:.82rem; }
.adm-row-add svg { width:1rem; height:1rem; }
@media (max-width:640px) { .adm-repeater-row { flex-wrap:wrap; } .adm-repeater-row input, .adm-repeater-row textarea { flex:1 1 100% !important; } }

/* Icons inside buttons/links must be sized explicitly (inline SVGs have no intrinsic size) */
body.site .btn svg { width:1rem; height:1rem; flex-shrink:0; }
body.site .pd-actions .btn { white-space:nowrap; }

/* ---------- Admin: Pages manager ---------- */
.badge-status.BUILTIN { background:#e0e7ff; color:#3730a3; }
.badge-status.CUSTOM { background:#fce7f3; color:#9d174d; }
.badge-status.HIDDEN { background:#e5e7eb; color:#374151; }
.badge-status.CUSTOMISED { background:#fef3c7; color:#92400e; margin-left:.35rem; }
.adm-intro { margin:0 0 1rem; font-size:.88rem; color:var(--color-muted); max-width:52rem; }
.adm-sub { color:var(--color-muted); font-size:.78rem; }
.adm-note { background:color-mix(in srgb, var(--color-blue) 6%, var(--color-surface)); }
.adm-slug { display:flex; align-items:center; gap:.35rem; }
.adm-slug span { color:var(--color-muted); font-size:.88rem; white-space:nowrap; }
.adm-slug input { flex:1; min-width:0; }
.badge-status.PRODUCT { background:#dbeafe; color:#1e40af; }
.badge-status.PROJECT { background:#ccfbf1; color:#115e59; }

/* ---------- Product colour themes: each product page/card can carry its own accent ---------- */
body.site .theme-coral, body.site .art-t-coral { --theme-c:#ee5a2e; }
body.site .theme-gold, body.site .art-t-gold { --theme-c:#e0a94e; }
body.site .theme-blue, body.site .art-t-blue { --theme-c:#2f7df6; }
body.site .theme-teal, body.site .art-t-teal { --theme-c:#0f9fa0; }
body.site .theme-violet, body.site .art-t-violet { --theme-c:#7c5cf0; }
body.site .theme-green, body.site .art-t-green { --theme-c:#2f9e5f; }
body.site .theme-wrap { --accent:color-mix(in srgb, var(--theme-c) 84%, var(--color-heading)); --accent-strong:color-mix(in srgb, var(--theme-c) 66%, var(--color-heading)); --accent-soft:color-mix(in srgb, var(--theme-c) 14%, transparent); --signature-glow:color-mix(in srgb, var(--theme-c) 70%, #fff); }
body.site .theme-wrap .page-hero { background:radial-gradient(ellipse 60% 95% at 88% 15%, color-mix(in srgb, var(--theme-c) 40%, transparent), transparent 70%), var(--ink); }
body.site .theme-wrap .page-hero::after { content:""; position:absolute; right:-6%; top:10%; width:min(34vw, 26rem); aspect-ratio:1; border-radius:50%; border:1px solid color-mix(in srgb, var(--theme-c) 45%, transparent); box-shadow:0 0 0 2.5rem color-mix(in srgb, var(--theme-c) 8%, transparent), 0 0 0 5rem color-mix(in srgb, var(--theme-c) 5%, transparent); pointer-events:none; }
body.site .pcard-cover[class*="art-t-"] { background:linear-gradient(135deg, var(--theme-c) 0%, color-mix(in srgb, var(--theme-c) 28%, #0b0906) 100%); }

.badge-status.PROTOTYPE { background:#fce7f3; color:#9d174d; }

/* ================= Phase 1 restructure: Home, Solutions, Capabilities, About, Our Work ================= */
body.site .pain-card h3 { font-size:1.05rem; }

/* Solutions — one themed section per industry */
body.site .sol-toolbar { background:var(--color-soft); border-bottom:1px solid var(--color-surface-border); padding:1.1rem 0; }
body.site .sol-toolbar-inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 1.5rem; }
body.site .sol-toolbar .pill { text-decoration:none; }
body.site .ind-section { padding:clamp(4rem, 9vh, 6.5rem) 0; scroll-margin-top:4.5rem; }
body.site .ind-section.is-alt { background:var(--color-soft); }
body.site .ind-section[hidden] { display:none; }
body.site .ind-grid { display:grid; grid-template-columns:minmax(0, 1fr); gap:2.5rem; }
@media (min-width:960px) { body.site .ind-grid { grid-template-columns:minmax(0, 1fr) minmax(0, 2fr); gap:4.5rem; } body.site .ind-intro { position:sticky; top:6rem; align-self:start; } }
body.site .ind-index { display:block; font-family:var(--font-display); font-weight:250; font-size:clamp(3.2rem, 6vw, 5rem); line-height:1; letter-spacing:-.04em; color:var(--accent); margin-bottom:1.2rem; }
body.site .ind-intro .eyebrow { margin-bottom:.8rem; }
body.site .ind-tagline { margin:1rem 0 1.8rem; font-size:1.05rem; color:var(--color-muted); max-width:24rem; }
body.site .area-grid { list-style:none; margin:0; padding:0; display:grid; gap:1rem; grid-template-columns:repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr)); align-content:start; }
body.site .area-card { background:var(--color-surface); border:1px solid var(--color-surface-border); border-top:3px solid var(--accent); border-radius:.9rem; padding:1.25rem 1.4rem 1.4rem; }
body.site .area-card[hidden] { display:none; }
body.site .area-card h3 { font-size:1rem; margin-bottom:.45rem; line-height:1.35; }
body.site .area-card p { margin:0; font-size:.88rem; line-height:1.6; color:var(--color-muted); }
body.site .sol-empty { text-align:center; color:var(--color-muted); padding:3rem 0; }

/* Capabilities — numbered rows by type of work */
body.site .cap-list { list-style:none; margin:0; padding:0; }
body.site .cap-row { display:grid; grid-template-columns:3.5rem minmax(0, 1fr); gap:.9rem 1.2rem; padding:2.2rem 0; border-top:1px solid var(--color-surface-border); align-items:start; }
body.site .cap-row:last-child { border-bottom:1px solid var(--color-surface-border); }
body.site .cap-num { font-family:var(--font-display); font-weight:250; font-size:2.2rem; line-height:1; letter-spacing:-.03em; color:var(--accent); }
body.site .cap-title { display:flex; align-items:center; gap:.9rem; }
body.site .cap-title h3 { margin:0; font-size:1.25rem; }
body.site .cap-text { grid-column:2; margin:0; color:var(--color-muted); font-size:.98rem; line-height:1.8; }
@media (min-width:900px) {
  body.site .cap-row { grid-template-columns:5rem minmax(0, 1.1fr) minmax(0, 1.4fr); gap:2rem; padding:2.6rem 0; align-items:center; }
  body.site .cap-text { grid-column:auto; }
}

/* About */
/* Narrow reading columns stay on the page's left edge (same axis as the headings) instead of floating centred. */
body.site .container.narrow > *, body.site .container.about-story > * { max-width:var(--narrow, 52rem); }
body.site .about-story h2 { margin-bottom:0; }
body.site .about-story p { color:var(--color-muted); font-size:1.02rem; }
body.site .about-story p.lead { color:var(--color-heading); font-size:clamp(1.2rem, 1rem + .9vw, 1.6rem); line-height:1.55; font-family:var(--font-display); font-weight:300; }
body.site .about-card { padding:2rem; }
body.site .about-statement { font-family:var(--font-display); font-weight:300; font-size:clamp(1.25rem, 1rem + .8vw, 1.6rem); line-height:1.45; color:var(--color-heading); margin:0; }
body.site .value-card { padding:1.6rem; }
body.site .value-num { display:block; font-size:.78rem; font-weight:700; letter-spacing:.14em; color:var(--accent); margin-bottom:.9rem; }
body.site .value-card p { margin:0; font-size:.9rem; color:var(--color-muted); }
body.site .meet-band { display:grid; grid-template-columns:1fr; gap:2rem; align-items:center; }
@media (min-width:820px) { body.site .meet-band { grid-template-columns:auto 1fr; gap:4rem; } }
body.site .meet-art { display:flex; justify-content:center; }

/* Our Work */
body.site .work-types { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fit, minmax(15rem, 1fr)); margin-bottom:1.75rem; }
body.site .work-type { border-top:2px solid var(--accent); padding-top:1rem; }
body.site .work-type h3 { font-size:1rem; margin-bottom:.4rem; }
body.site .work-type p { margin:0; font-size:.88rem; color:var(--color-muted); }
body.site .evidence-note { display:flex; gap:.8rem; align-items:flex-start; padding:1rem 1.25rem; margin:0 0 2.5rem; border-radius:.9rem; background:var(--color-soft); border:1px solid var(--color-surface-border); font-size:.88rem; color:var(--color-muted); }
body.site .evidence-note svg { width:1.2rem; height:1.2rem; flex-shrink:0; margin-top:.1rem; color:var(--accent); }
body.site .evidence-note span { line-height:1.6; }

.adm-checks { display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; }
[data-only][hidden] { display:none !important; }

/* ---------- Phase 2: catalogue cards, problem filter, search ---------- */
body.site .sol-problems { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin-top:1rem; }
body.site .sol-problems-label { font-size:.74rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--color-muted); margin-right:.4rem; }
body.site .area-meta { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:.7rem; }
body.site .area-card h3 a { color:inherit; }
body.site .area-card h3 a:hover { color:var(--accent); }
body.site .area-link { display:inline-block; margin-top:.9rem; font-size:.82rem; font-weight:600; color:var(--accent); }
body.site .area-link:hover { text-decoration:underline; }
body.site .area-checks { border:1px solid var(--color-surface-border); border-radius:.8rem; padding:.9rem 1.1rem 1rem; margin:0 0 1rem; }
body.site .area-checks[hidden] { display:none; }
body.site .area-checks legend { font-weight:600; font-size:.88rem; padding:0 .4rem; color:var(--color-heading); }
body.site .area-checks legend small { font-weight:400; color:var(--color-muted); margin-left:.3rem; }
body.site .check-row { display:flex; align-items:flex-start; gap:.6rem; padding:.3rem 0; font-size:.9rem; cursor:pointer; }
body.site .check-row input { width:auto; margin-top:.25rem; }
body.site .search-form { display:flex; gap:.75rem; flex-wrap:wrap; }
body.site .search-form .filter-search { flex:1 1 18rem; }
body.site .result-heading { font-size:1.3rem; margin:2.5rem 0 .8rem; }
body.site .result-list { list-style:none; margin:0; padding:0; }
body.site .result-list li { padding:1rem 0; border-bottom:1px solid var(--color-surface-border); }
body.site .result-list a { display:flex; align-items:baseline; gap:.7rem; flex-wrap:wrap; color:var(--color-heading); }
body.site .result-list a:hover strong { color:var(--accent); }
body.site .result-in { font-size:.78rem; color:var(--color-muted); }
body.site .result-list p { margin:.3rem 0 0; font-size:.9rem; color:var(--color-muted); }

/* ---------- Phase 3: pricing plans, checkout, orders, invoicing ---------- */
body.site .plan-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
body.site .plan-card { display:flex; flex-direction:column; padding:1.6rem; border-top:3px solid var(--accent); }
body.site .plan-card h3 { margin-bottom:.8rem; }
body.site .plan-price { margin:0 0 .8rem; }
body.site .plan-price strong { font-family:var(--font-display); font-weight:300; font-size:2rem; letter-spacing:-.02em; color:var(--color-heading); }
body.site .plan-price small { display:block; color:var(--color-muted); font-size:.78rem; margin-top:.2rem; }
body.site .plan-desc { color:var(--color-muted); font-size:.9rem; flex:1; margin-bottom:1.2rem; }
body.site .plan-card .btn { margin-top:auto; }
body.site .checkout-grid { display:grid; gap:2rem; grid-template-columns:minmax(0,1fr); align-items:start; }
@media (min-width:900px) { body.site .checkout-grid { grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); } body.site .checkout-grid .order-summary { position:sticky; top:6rem; } }
body.site .order-summary h3 { margin-bottom:1rem; }
body.site .order-item { margin:0 0 .6rem; }
body.site .order-lines { display:grid; grid-template-columns:1fr auto; gap:.55rem 1rem; margin:1rem 0; font-size:.92rem; }
body.site .order-lines dt { color:var(--color-muted); }
body.site .order-lines dd { margin:0; text-align:right; color:var(--color-heading); font-weight:600; }
body.site .order-lines dd small { font-weight:400; color:var(--color-muted); }
body.site .order-lines .total { border-top:1px solid var(--color-surface-border); padding-top:.7rem; font-size:1.05rem; color:var(--color-heading); }
body.site .pay-card { text-align:center; padding:2.5rem; max-width:34rem; margin:0 auto; }
.adm-plans-grid { display:grid; gap:1.25rem; grid-template-columns:1fr; align-items:start; }
@media (min-width:1000px) { .adm-plans-grid { grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); } }
.adm-bulk { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; margin:0 0 1rem; padding:.8rem 1rem; border:1px dashed var(--color-surface-border); border-radius:.8rem; font-size:.85rem; }
.adm-bulk select { padding:.45rem .6rem; border-radius:.6rem; border:1px solid var(--color-surface-border); background:var(--color-surface); color:var(--color-text); font-size:.82rem; }
.adm-dl { display:grid; grid-template-columns:8rem 1fr; gap:.55rem 1rem; margin:0; font-size:.9rem; }
.adm-dl dt { color:var(--color-muted); } .adm-dl dd { margin:0; }
.adm-log { list-style:none; margin:0; padding:0; font-size:.82rem; display:grid; gap:.6rem; }
.adm-log span { color:var(--color-muted); } .adm-log code { font-size:.75rem; word-break:break-all; }
.adm-checklist { list-style:none; margin:0 0 1rem; padding:0; display:grid; gap:.8rem; }
.adm-checklist li { display:flex; gap:.8rem; align-items:flex-start; }
.adm-checklist li > span { width:1.5rem; height:1.5rem; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:.8rem; font-weight:700; }
.adm-checklist li.ok > span { background:#dcfce7; color:#166534; } .adm-checklist li.todo > span { background:#fef3c7; color:#92400e; }


/* ================= Final review pass: symmetry and polish ================= */
/* Solution grids: fixed 3 / 2 / 1 columns so rows are even; a lone last card spans the row instead of dangling. */
@media (min-width:1280px) {
  body.site .area-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); }
  body.site .area-grid .area-card:last-child:nth-child(3n+1) { grid-column:1 / -1; }
}
@media (min-width:640px) and (max-width:1279px) {
  body.site .area-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  body.site .area-grid .area-card:last-child:nth-child(2n+1) { grid-column:1 / -1; }
}
@media (max-width:639px) { body.site .area-grid { grid-template-columns:minmax(0, 1fr); } }
body.site .area-card { display:flex; flex-direction:column; }
body.site .area-card .area-link { margin-top:auto; padding-top:.9rem; }
/* Numbered rows: description reads left-aligned in its column. */
body.site .x-desc { text-align:left; max-width:26rem; }

body.site .cap-title h2 { margin:0; font-family:var(--font-display); font-weight:600; font-size:1.25rem; letter-spacing:-.01em; line-height:1.3; }

/* Keep the footer at the bottom of short pages (404, search, order status) so the page ends cleanly. */
body.site { min-height:100vh; }
body.site > main { flex:1 0 auto; }

/* ================= Marketing batch 1: WhatsApp button, cookie notice, social links ================= */
body.site .wa-float { position:fixed; left:1.25rem; bottom:1.25rem; z-index:60; width:3.5rem; height:3.5rem; border-radius:50%; background:#25d366; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 28px -8px rgba(0,0,0,.45); transition:transform .18s ease, box-shadow .18s ease; }
body.site .wa-float:hover { transform:translateY(-3px) scale(1.04); box-shadow:0 14px 32px -8px rgba(0,0,0,.5); }
body.site .mobile-menu.open ~ .wa-float { display:none; }
@media (max-width:640px) { body.site .wa-float { width:3.25rem; height:3.25rem; left:1rem; bottom:1rem; } }
body.site .consent-bar { position:fixed; left:50%; transform:translateX(-50%); bottom:1.25rem; z-index:80; width:min(44rem, calc(100% - 2rem)); display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.5rem; justify-content:space-between; padding:1rem 1.25rem; border-radius:1rem; background:var(--ink); color:var(--cream); border:1px solid var(--line); box-shadow:0 20px 60px -20px rgba(0,0,0,.6); }
body.site .consent-bar p { margin:0; flex:1 1 16rem; font-size:.86rem; color:var(--mist); line-height:1.55; }
body.site .consent-bar a { color:var(--signature-glow); text-decoration:underline; }
body.site .consent-actions { display:flex; gap:.6rem; }
body.site .consent-actions .btn { padding:.55rem 1.1rem; font-size:.82rem; }
body.site .consent-actions .btn-secondary { color:var(--cream); border-color:var(--line); }
body.site .cookie-prefs { background:none; border:none; padding:0; font:inherit; color:var(--mist-dim); cursor:pointer; text-decoration:underline; }
body.site .cookie-prefs:hover { color:var(--cream); }

.adm-section > p.hint, .adm-form > p.hint, .adm-note p.hint { font-size:.8rem; line-height:1.55; color:var(--color-muted); }

/* ================= Batch 2: Insights, trust strip, admin extras ================= */
body.site .article-meta { color:var(--color-muted); font-size:.85rem; margin:0 0 1.5rem; }
body.site .article-cover { width:100%; border-radius:1.1rem; margin:0 0 2rem; aspect-ratio:16/9; object-fit:cover; border:1px solid var(--color-surface-border); }
body.site .article-body { font-size:1.06rem; line-height:1.85; color:var(--color-text); }
body.site .article-body > * { max-width:none; }
body.site .article-body h2 { font-size:clamp(1.5rem, 1.2rem + 1vw, 2rem); margin:2.6rem 0 1rem; }
body.site .article-body h3 { font-size:1.2rem; margin:2rem 0 .7rem; }
body.site .article-body p { margin:0 0 1.2rem; color:var(--color-text); }
body.site .article-body ul, body.site .article-body ol { margin:0 0 1.4rem; padding-left:1.4rem; }
body.site .article-body li { margin-bottom:.45rem; }
body.site .article-body a { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
body.site .article-body blockquote { margin:1.8rem 0; padding:.4rem 0 .4rem 1.4rem; border-left:3px solid var(--accent); font-family:var(--font-display); font-weight:300; font-size:1.3rem; line-height:1.55; color:var(--color-heading); }
body.site .article-body figure { margin:2rem 0; }
body.site .article-body figure img { width:100%; border-radius:1rem; border:1px solid var(--color-surface-border); }
body.site .article-body figcaption { margin-top:.6rem; font-size:.82rem; color:var(--color-muted); }
body.site .article-cta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.25rem; margin-top:3rem; padding:1.6rem 1.8rem; border-radius:1.1rem; background:var(--color-soft); border:1px solid var(--color-surface-border); }
body.site .article-cta h3 { margin-bottom:.3rem; } body.site .article-cta p { margin:0; font-size:.92rem; color:var(--color-muted); }
body.site .trust-strip { padding-block:clamp(2.5rem, 6vh, 4rem); border-top:1px solid var(--color-surface-border); }
body.site .logo-row { list-style:none; margin:1rem 0 0; padding:0; display:flex; flex-wrap:wrap; align-items:center; gap:1.5rem 2.75rem; }
body.site .logo-row img { height:2.6rem; width:auto; max-width:9rem; object-fit:contain; filter:grayscale(1); opacity:.75; transition:filter .2s, opacity .2s; }
body.site .logo-row a:hover img, body.site .logo-row img:hover { filter:none; opacity:1; }
body.site .logo-row span { font-family:var(--font-display); font-weight:500; font-size:1.15rem; color:var(--color-muted); }
.adm-code { margin:.4rem 0 0; padding:.8rem 1rem; border-radius:.7rem; background:var(--color-soft); border:1px solid var(--color-surface-border); font-size:.8rem; overflow-x:auto; white-space:pre-wrap; word-break:break-all; }
.lk-qr { width:13rem; max-width:100%; padding:.8rem; background:#fff; border-radius:.8rem; border:1px solid var(--color-surface-border); }
.lk-qr svg { display:block; width:100%; height:auto; }

body.site .video-frame { position:relative; aspect-ratio:16 / 9; border-radius:1.1rem; overflow:hidden; border:1px solid var(--color-surface-border); background:#000; margin-bottom:1.2rem; box-shadow:var(--shadow-card); }
body.site .video-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }

/* ---------- AIRaah helper: solution finder ---------- */
body.site .companion-label { display:block; font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--color-muted); margin-bottom:.45rem; }
body.site .companion-find-row { display:flex; gap:.45rem; }
body.site .companion-find-row input { flex:1; min-width:0; padding:.55rem .75rem; border-radius:.65rem; border:1px solid var(--color-surface-border); background:var(--color-soft); color:var(--color-text); font:inherit; font-size:.85rem; }
body.site .companion-find-row .btn { padding:.5rem .95rem; font-size:.8rem; }
body.site .companion-results { display:flex; flex-direction:column; gap:.4rem; font-size:.82rem; color:var(--color-muted); }
body.site .companion-results:empty { display:none; }
body.site .companion-results p { margin:0; }
body.site .companion-result { display:flex; flex-direction:column; gap:.1rem; padding:.6rem .8rem; border-radius:.7rem; border:1px solid var(--color-surface-border); background:var(--color-surface); }
body.site .companion-result:hover { border-color:var(--accent); }
body.site .companion-result strong { color:var(--color-heading); font-size:.86rem; }
body.site .companion-result span { font-size:.7rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
body.site .companion-result small { color:var(--color-muted); font-size:.76rem; line-height:1.45; }
body.site .companion-result-more { font-size:.8rem; font-weight:600; color:var(--accent); padding:.2rem .1rem; }

/* ---------- Quote basket ---------- */
body.site .area-foot { display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-top:auto; padding-top:.35rem; flex-wrap:wrap; }
body.site .quote-add { font:inherit; font-size:.76rem; font-weight:600; padding:.3rem .7rem; border-radius:999px; border:1px solid var(--color-surface-border); background:transparent; color:var(--color-muted); cursor:pointer; transition:border-color .15s, color .15s, background .15s; }
body.site .quote-add:hover { border-color:var(--accent); color:var(--accent); }
body.site .quote-add.is-added { border-color:var(--accent); color:var(--accent); background:var(--color-soft); }
body.site .btn.quote-add { font-size:.9rem; padding:.7rem 1.4rem; border-radius:999px; }
body.site .quote-tray { position:fixed; left:50%; transform:translateX(-50%); bottom:1.25rem; z-index:70; display:flex; align-items:center; gap:1rem; padding:.55rem .6rem .55rem 1.1rem; border-radius:999px; background:var(--color-surface); border:1px solid var(--color-surface-border); box-shadow:0 18px 50px -18px rgba(0,0,0,.55); max-width:calc(100% - 2rem); }
body.site .quote-tray-count { font-size:.85rem; font-weight:600; color:var(--color-heading); white-space:nowrap; }
body.site .quote-tray .btn { padding:.5rem 1.1rem; font-size:.82rem; white-space:nowrap; }
@media (max-width:520px) { body.site .quote-tray { gap:.6rem; padding-left:.85rem; } body.site .quote-tray-count { font-size:.78rem; white-space:normal; } }
body.site .quote-lead { color:var(--color-muted); margin:0 0 1.5rem; }
body.site .quote-group { margin-bottom:1.75rem; }
body.site .quote-group-title { font-size:1.15rem; margin:0 0 .75rem; }
body.site .quote-group-title span { font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); margin-left:.5rem; }
body.site .quote-items { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.6rem; }
body.site .quote-items li { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:.9rem 1.1rem; border-radius:.9rem; border:1px solid var(--color-surface-border); background:var(--color-surface); }
body.site .quote-items strong { color:var(--color-heading); }
body.site .quote-items p { margin:.25rem 0 0; font-size:.86rem; color:var(--color-muted); }
body.site .quote-remove { font:inherit; font-size:.78rem; background:none; border:0; color:var(--color-muted); cursor:pointer; text-decoration:underline; flex-shrink:0; }
body.site .quote-remove:hover { color:var(--accent); }
body.site .quote-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; margin-top:2rem; }
body.site .btn-link-quiet { font:inherit; font-size:.85rem; background:none; border:0; color:var(--color-muted); cursor:pointer; text-decoration:underline; }
body.site .quote-note { margin-top:1.25rem; font-size:.8rem; color:var(--color-muted); }
@media print {
  body.site .no-print, body.site header, body.site footer, body.site .quote-tray, body.site .wa-float, body.site .companion-mount, body.site .consent-bar, body.site .page-hero .crumbs { display:none !important; }
  body.site { background:#fff !important; color:#000 !important; }
  body.site .quote-items li { break-inside:avoid; border-color:#999; background:#fff; }
}

/* ---------- Admin: launch readiness ---------- */
.ready-tiles { display:grid; grid-template-columns:repeat(4, 1fr); gap:1rem; margin-bottom:1.25rem; }
.ready-tile { display:flex; flex-direction:column; gap:.2rem; padding:1rem 1.2rem; border-radius:.9rem; border:1px solid var(--color-surface-border); background:var(--color-surface); text-decoration:none; }
.ready-tile strong { font-size:1.6rem; line-height:1.1; color:var(--color-heading); }
.ready-tile span { font-size:.78rem; color:var(--color-muted); }
.ready-tile:hover { border-color:var(--accent, #38b6ff); }
.ready-card { padding:0; }
.ready-card > summary { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; padding:1rem 1.25rem; cursor:pointer; list-style:none; }
.ready-card > summary::-webkit-details-marker { display:none; }
.ready-title { font-weight:700; color:var(--color-heading); }
.ready-score { font-size:.82rem; color:var(--color-muted); }
.ready-bar { flex:1 1 10rem; height:.5rem; border-radius:99px; background:var(--color-soft); overflow:hidden; }
.ready-bar > span { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg, #2dd4bf, #38b6ff); }
.ready-list { list-style:none; margin:0; padding:0 1.25rem 1rem; }
.ready-list li { display:flex; align-items:center; gap:.85rem; padding:.65rem 0; border-top:1px solid var(--color-surface-border); }
.ready-mark { flex:0 0 1.35rem; height:1.35rem; border-radius:50%; border:2px solid var(--color-surface-border); display:flex; align-items:center; justify-content:center; font-size:.75rem; color:#fff; }
.ready-list li.is-done .ready-mark { background:#16a34a; border-color:#16a34a; }
.ready-text { flex:1; display:flex; flex-direction:column; gap:.1rem; min-width:0; }
.ready-text strong { font-size:.9rem; color:var(--color-heading); }
.ready-text small { font-size:.78rem; color:var(--color-muted); }
.ready-list li.is-done .ready-text strong { color:var(--color-muted); font-weight:500; }
.ready-go { font-size:.8rem; font-weight:600; white-space:nowrap; }
@media (max-width:720px) { .ready-tiles { grid-template-columns:repeat(2, 1fr); } }
body.site .area-foot .area-link { margin-top:0; padding-top:0; }
/* Helper panel: long result lists scroll inside the panel instead of running off-screen */
body.site .companion-panel { max-height:min(82vh, 640px); display:flex; flex-direction:column; }
body.site .companion-panel-head { flex:0 0 auto; }
body.site .companion-panel-body { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; }
body.site .companion-panel[hidden] { display:none; }
body.site .companion-divider { height:1px; background:var(--color-surface-border); margin:.5rem 0; flex:0 0 auto; }
/* Quote tray: compact on phones and kept clear of the helper and WhatsApp buttons */
body.site .quote-tray .qt-long { display:inline; }
@media (max-width:520px) {
  body.site .quote-tray { bottom:5rem; padding:.45rem .5rem .45rem .9rem; }
  body.site .quote-tray .qt-long { display:none; }
  body.site .quote-tray-count { white-space:nowrap; }
}

/* ======================================================================================================================
   Solution catalogue browser (Solutions page + suite pages): sidebar filters, industry tabs, card grid / list, paging
   ====================================================================================================================== */
body.site .hero-stat { display:inline-flex; align-items:baseline; gap:.4rem; padding:.4rem .9rem; border-radius:999px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.06); color:rgba(255,255,255,.78); font-size:.8rem; }
body.site .hero-stat strong { color:var(--gold, #e8b95c); font-size:.95rem; font-weight:700; }

body.site .cat { padding:2.25rem 0 4rem; background:var(--color-bg); }
body.site .cat-layout { display:grid; grid-template-columns:minmax(0, 1fr); gap:1.75rem; align-items:start; }
body.site .cat-main { min-width:0; }
@media (min-width:960px) { body.site .cat.js-cat .cat-layout { grid-template-columns:16.5rem minmax(0, 1fr); gap:2.25rem; } }

/* Sidebar */
body.site .cat-side { display:none; background:var(--color-surface); border:1px solid var(--color-surface-border); border-radius:1.1rem; padding:1.1rem 1.2rem 1.3rem; }
body.site .cat.js-cat .cat-side { display:block; }
@media (max-width:959px) { body.site .cat.js-cat .cat-side { display:none; } body.site .cat.js-cat .cat-side.is-open { display:block; } }
@media (min-width:960px) { body.site .cat-side { position:sticky; top:5.5rem; max-height:calc(100vh - 6.5rem); overflow-y:auto; overscroll-behavior:contain; } }
body.site .cat-side-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:.4rem; color:var(--color-heading); }
body.site .cat-clear { font:inherit; font-size:.78rem; font-weight:600; color:var(--accent); background:none; border:0; cursor:pointer; padding:0; }
body.site .cat-clear:hover { text-decoration:underline; }
body.site .cat-facet { border-top:1px solid var(--color-surface-border); padding:.8rem 0 .5rem; }
body.site .cat-facet:first-of-type { border-top:0; }
body.site .cat-facet > summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; font-size:.82rem; font-weight:700; letter-spacing:.02em; color:var(--color-heading); margin-bottom:.45rem; }
body.site .cat-facet > summary::-webkit-details-marker { display:none; }
body.site .cat-facet > summary::after { content:""; width:.5rem; height:.5rem; border-right:2px solid var(--color-muted); border-bottom:2px solid var(--color-muted); transform:rotate(45deg); transition:transform .15s; margin-right:.2rem; }
body.site .cat-facet[open] > summary::after { transform:rotate(-135deg); }
body.site .cat-check { display:flex; align-items:center; gap:.6rem; padding:.28rem 0; font-size:.84rem; color:var(--color-text); cursor:pointer; }
body.site .cat-check input { accent-color:var(--accent); width:1rem; height:1rem; flex-shrink:0; margin:0; }
body.site .cat-check span { flex:1; min-width:0; }
body.site .cat-check em { font-style:normal; font-size:.72rem; color:var(--color-muted); }
body.site .cat-help { margin-top:1rem; padding:1rem 1.1rem; border-radius:.9rem; background:var(--color-soft); border:1px solid var(--color-surface-border); }
body.site .cat-help strong { color:var(--color-heading); font-size:.9rem; }
body.site .cat-help p { margin:.35rem 0 .8rem; font-size:.8rem; color:var(--color-muted); line-height:1.5; }
body.site .cat-help .btn { width:100%; justify-content:center; padding:.6rem 1rem; font-size:.82rem; }

/* Search, tabs, banner, bar */
body.site .cat-search-row { display:flex; gap:.7rem; align-items:center; margin-bottom:1rem; }
body.site .cat:not(.js-cat) .cat-search-row, body.site .cat:not(.js-cat) .cat-tabs, body.site .cat:not(.js-cat) .cat-tools { display:none; }
body.site .cat-search-row .filter-search { flex:1; max-width:none; }
body.site .cat-filter-toggle { display:none; white-space:nowrap; padding:.6rem 1.1rem; font-size:.85rem; }
@media (max-width:959px) { body.site .cat.js-cat .cat-filter-toggle { display:inline-flex; } }
body.site .cat-tabs { display:flex; gap:.5rem; overflow-x:auto; padding:.15rem .1rem .6rem; margin-bottom:.4rem; scrollbar-width:thin; }
body.site .cat-tab { flex:0 0 auto; font:inherit; font-size:.85rem; font-weight:600; padding:.5rem 1rem; border-radius:999px; border:1px solid var(--color-surface-border); background:var(--color-surface); color:var(--color-heading); cursor:pointer; display:inline-flex; gap:.5rem; align-items:center; transition:border-color .15s, background .15s, color .15s; }
body.site .cat-tab span { font-size:.72rem; font-weight:700; color:var(--color-muted); }
body.site .cat-tab:hover { border-color:var(--accent); }
body.site .cat-tab.is-active { background:var(--ink, #15130f); border-color:var(--ink, #15130f); color:#fff; }
body.site .cat-tab.is-active span { color:rgba(255,255,255,.7); }
body.site .cat-banner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 1.5rem; margin:.4rem 0 1.2rem; padding:1.2rem 1.4rem; border-radius:1rem; background:var(--color-surface); border:1px solid var(--color-surface-border); border-left:4px solid var(--accent); }
body.site .cat-banner[hidden] { display:none; }
body.site .cat-banner .eyebrow { margin:0 0 .3rem; }
body.site .cat-banner h2 { margin:0; font-size:1.35rem; }
body.site .cat-banner p:not(.eyebrow) { margin:.3rem 0 0; color:var(--color-muted); font-size:.9rem; max-width:34rem; }
body.site .cat-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.7rem 1.2rem; margin:.6rem 0 .9rem; }
body.site .cat-count { margin:0; font-size:.88rem; color:var(--color-muted); }
body.site .cat-count strong { color:var(--color-heading); }
body.site .cat-tools { display:flex; align-items:center; gap:.9rem; }
body.site .cat-sort { display:flex; align-items:center; gap:.5rem; font-size:.8rem; color:var(--color-muted); }
body.site .cat-sort select { font:inherit; font-size:.84rem; padding:.45rem 2rem .45rem .8rem; border-radius:.7rem; border:1px solid var(--color-surface-border); background:var(--color-surface); color:var(--color-heading); }
body.site .cat-view { display:inline-flex; border:1px solid var(--color-surface-border); border-radius:.7rem; overflow:hidden; background:var(--color-surface); }
body.site .cat-view button { border:0; background:transparent; color:var(--color-muted); padding:.45rem .65rem; cursor:pointer; display:flex; }
body.site .cat-view button svg { width:1.05rem; height:1.05rem; }
body.site .cat-view button.is-active { background:var(--ink, #15130f); color:#fff; }
body.site .cat-active { display:flex; flex-wrap:wrap; gap:.45rem; margin:0 0 1rem; }
body.site .cat-active[hidden] { display:none; }
body.site .cat-chip { font:inherit; font-size:.78rem; font-weight:600; padding:.3rem .75rem; border-radius:999px; border:1px solid var(--accent); background:color-mix(in srgb, var(--accent) 10%, transparent); color:var(--color-heading); cursor:pointer; }
body.site .cat-chip:hover { background:color-mix(in srgb, var(--accent) 20%, transparent); }

/* Cards */
body.site .cat-grid { list-style:none; margin:0; padding:0; display:grid; gap:1.1rem; grid-template-columns:repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }
body.site .cat-grid[hidden] { display:none; }
body.site .cat-card { display:flex; flex-direction:column; gap:.55rem; padding:1.15rem 1.25rem 1.1rem; border-radius:1.05rem; background:var(--color-surface); border:1px solid var(--color-surface-border); border-top:3px solid var(--accent); scroll-margin-top:6rem; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
body.site .cat-card[hidden] { display:none; }
body.site .cat-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-card, 0 14px 34px -18px rgba(0,0,0,.35)); }
body.site .cat-card.is-target { box-shadow:0 0 0 2px var(--accent); }
body.site .cat-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:.6rem; }
body.site .cat-icon { flex:0 0 2.6rem; width:2.6rem; height:2.6rem; border-radius:.8rem; display:flex; align-items:center; justify-content:center; background:color-mix(in srgb, var(--accent) 14%, transparent); color:var(--accent); }
body.site .cat-icon svg { width:1.3rem; height:1.3rem; }
body.site .cat-chips { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.35rem; }
body.site .cat-card h3 { margin:.2rem 0 0; font-size:1.02rem; line-height:1.35; }
body.site .cat-card h3 a { color:var(--color-heading); }
body.site .cat-card h3 a:hover { color:var(--accent); }
body.site .cat-summary { margin:0; font-size:.86rem; line-height:1.55; color:var(--color-muted); }
body.site .cat-industry { margin:.1rem 0 0; display:flex; align-items:center; gap:.4rem; font-size:.78rem; color:var(--color-muted); }
body.site .cat-industry svg { width:.9rem; height:.9rem; flex-shrink:0; }
body.site .cat-tags { list-style:none; margin:.1rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.35rem; }
body.site .cat-tags li { font-size:.7rem; font-weight:600; padding:.22rem .6rem; border-radius:999px; background:var(--color-soft); color:var(--color-muted); }
body.site .cat-tags li.is-flag { background:color-mix(in srgb, var(--accent) 12%, transparent); color:var(--accent); }
body.site .cat-foot { display:flex; align-items:center; justify-content:space-between; gap:.7rem; flex-wrap:wrap; margin-top:auto; padding-top:.7rem; border-top:1px solid var(--color-surface-border); }
body.site .cat-foot .area-link { margin:0; padding:0; }

/* List layout */
@media (min-width:700px) {
  body.site .cat-grid.is-list { grid-template-columns:minmax(0, 1fr); gap:.8rem; }
  body.site .cat-grid.is-list .cat-card { display:grid; grid-template-columns:2.8rem minmax(0, 1fr) auto; column-gap:1rem; row-gap:.2rem; align-items:start; border-top-width:1px; border-left:3px solid var(--accent); }
  body.site .cat-grid.is-list .cat-card-top { display:contents; }
  body.site .cat-grid.is-list .cat-icon { grid-column:1; grid-row:1 / span 4; }
  body.site .cat-grid.is-list .cat-chips { grid-column:3; grid-row:1; }
  body.site .cat-grid.is-list .cat-card h3 { grid-column:2; grid-row:1; margin:0; }
  body.site .cat-grid.is-list .cat-summary { grid-column:2; grid-row:2; }
  body.site .cat-grid.is-list .cat-industry { grid-column:2; grid-row:3; }
  body.site .cat-grid.is-list .cat-tags { grid-column:2; grid-row:4; margin-top:.3rem; }
  body.site .cat-grid.is-list .cat-foot { grid-column:3; grid-row:2 / span 3; flex-direction:column; align-items:flex-end; justify-content:flex-end; border-top:0; padding-top:0; gap:.5rem; }
}
body.site .cat-more { display:flex; justify-content:center; margin-top:1.6rem; }
body.site .cat-more[hidden] { display:none; }
body.site .cat-empty { text-align:center; padding:3rem 1rem; border:1px dashed var(--color-surface-border); border-radius:1.1rem; color:var(--color-muted); }
body.site .cat-empty[hidden] { display:none; }
body.site .cat-empty strong { display:block; color:var(--color-heading); font-size:1.05rem; margin-bottom:.4rem; }
body.site .cat-empty .btn { margin:.3rem .25rem 0; }
/* Suite pages: the same grid inside the product-detail column */
body.site .cat-compact { padding:0; background:transparent; }
body.site .cat-compact .cat-grid { grid-template-columns:repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr)); }

/* Compact hero for catalogue-style pages */
body.site .hero-compact .page-hero { padding:clamp(6.5rem, 13vh, 8rem) 0 clamp(2.2rem, 4.5vh, 3.2rem); }
body.site .hero-compact .page-hero h1 { font-size:clamp(2.2rem, 4.6vw, 3.6rem); }
body.site .hero-compact .page-hero .desc { max-width:40rem; }
body.site .cat-compact .cat-grid { grid-template-columns:repeat(auto-fill, minmax(min(100%, 18.5rem), 1fr)); }
body.site .quote-tray .btn { display:inline-block; }

/* ======================================================================================================================
   Home: "When complexity gets in the way" + "Solutions built around your world" — brand palette only (ink, cream, coral, gold)
   ====================================================================================================================== */
body.site .fx-section { position:relative; overflow:hidden; isolation:isolate; padding-block:clamp(4.5rem, 9vh, 7rem); }
body.site .fx-section::before, body.site .fx-section::after { content:""; position:absolute; z-index:-1; width:38rem; height:38rem; border-radius:50%; filter:blur(80px); pointer-events:none; }
body.site .fx-section::before { right:-14rem; top:-14rem; background:radial-gradient(circle, rgba(224,169,78,.30), transparent 65%); }
body.site .fx-section::after { left:-14rem; bottom:-16rem; background:radial-gradient(circle, rgba(238,90,46,.20), transparent 65%); }
body.site .fx-soft { background:var(--color-soft); }
body.site .fx-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem 2.5rem; margin-bottom:2.6rem; }
body.site .fx-head .eyebrow { margin-bottom:.7rem; }
body.site .fx-head h2 em { font-style:normal; background:linear-gradient(90deg, #e0a94e 0%, #ee5a2e 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
body.site .fx-lead { margin:0; max-width:24rem; font-size:.98rem; line-height:1.6; color:var(--color-muted); }

/* Cursor spotlight shared by both card types */
body.site .fx-spot { --mx:50%; --my:0%; }
body.site .fx-spot::before { content:""; position:absolute; inset:0; z-index:0; border-radius:inherit; opacity:0; transition:opacity .25s ease; pointer-events:none;
  background:radial-gradient(20rem circle at var(--mx) var(--my), color-mix(in srgb, var(--c) 22%, transparent), transparent 62%); }
body.site .fx-spot:hover::before { opacity:1; }
body.site .fx-spot > * { position:relative; z-index:1; }

/* ---------- Problem cards: white card + a dark glowing "screen" with the animated illustration ---------- */
body.site .tone-coral { --c:#ee5a2e; --c-deep:#cf4219; }
body.site .tone-gold { --c:#e0a94e; --c-deep:#9a6210; }
html[data-theme="dark"] body.site .tone-coral, html[data-theme="dark"] body.site .tone-gold { --c-deep:var(--c); }
@media (prefers-color-scheme: dark) { html:not([data-theme="light"]) body.site .tone-coral, html:not([data-theme="light"]) body.site .tone-gold { --c-deep:var(--c); } }

body.site .prob-grid { display:grid; gap:1.2rem; grid-template-columns:repeat(4, minmax(0, 1fr)); }
@media (max-width:1100px) { body.site .prob-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:600px) { body.site .prob-grid { grid-template-columns:minmax(0, 1fr); } }
body.site .prob-card { position:relative; display:flex; flex-direction:column; gap:.6rem; padding:.65rem .65rem 1.2rem; border-radius:1.5rem; overflow:hidden; isolation:isolate; color:inherit;
  background:var(--color-surface); border:1px solid var(--color-surface-border); box-shadow:var(--shadow-card);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease, opacity .6s ease; }
body.site .prob-card:hover { transform:translateY(-6px); border-color:color-mix(in srgb, var(--c) 70%, transparent); box-shadow:0 30px 56px -28px color-mix(in srgb, var(--c) 85%, transparent); }
body.site .prob-art { position:relative; height:6.2rem; padding:1.35rem 1.2rem .9rem; border-radius:1.05rem; overflow:hidden; color:var(--c);
  background:radial-gradient(130% 150% at 85% 0%, color-mix(in srgb, var(--c) 34%, #1a1009) 0%, #120b06 55%, #0a0806 100%); }
body.site .prob-art::before { content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.09) 1px, transparent 1px); background-size:14px 14px; -webkit-mask-image:linear-gradient(180deg, #000, transparent 90%); mask-image:linear-gradient(180deg, #000, transparent 90%); }
body.site .prob-art::after { content:""; position:absolute; left:10%; right:10%; bottom:0; height:1px; background:linear-gradient(90deg, transparent, var(--c), transparent); opacity:.8; }
body.site .prob-idx { position:absolute; top:.7rem; left:.9rem; z-index:2; font-size:.68rem; font-weight:700; letter-spacing:.16em; color:rgba(246,234,216,.55); }
body.site .prob-svg { position:relative; z-index:1; display:block; width:100%; height:100%; overflow:visible; filter:drop-shadow(0 0 7px color-mix(in srgb, var(--c) 80%, transparent)); transition:transform .4s ease; }
body.site .prob-card:hover .prob-svg { transform:scale(1.06); }
body.site .prob-card h3 { margin:.55rem .5rem 0; font-size:1.14rem; line-height:1.3; color:var(--color-heading); }
body.site .prob-card p { margin:0 .5rem; font-size:.9rem; line-height:1.55; color:var(--color-muted); }
body.site .prob-eg { list-style:none; margin:.3rem .5rem 0; padding:0; display:flex; flex-direction:column; gap:.32rem; }
body.site .prob-eg li { position:relative; padding-left:1.1rem; font-size:.8rem; font-weight:600; color:var(--color-heading); }
body.site .prob-eg li::before { content:""; position:absolute; left:0; top:.4em; width:.5rem; height:.5rem; border-radius:50%; background:var(--c); box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 22%, transparent); }
body.site .prob-foot { display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin:auto .5rem 0; padding-top:.9rem; font-size:.82rem; }
body.site .prob-count { padding:.3rem .75rem; border-radius:999px; background:color-mix(in srgb, var(--c) 13%, transparent); color:var(--color-heading); font-weight:600; }
body.site .prob-count strong { color:var(--c-deep); }
body.site .prob-go { display:inline-flex; align-items:center; gap:.4rem; padding:.38rem .85rem; border-radius:999px; border:1px solid color-mix(in srgb, var(--c) 55%, transparent); font-weight:700; color:var(--c-deep); transition:background .22s ease, color .22s ease, border-color .22s ease; }
body.site .prob-go svg { transition:transform .2s ease; }
body.site .prob-card:hover .prob-go { background:var(--c); border-color:var(--c); color:#1c140c; }
body.site .prob-card:hover .prob-go svg { transform:translateX(3px); }

/* Illustrations — gentle loops that hint at each problem */
body.site .pg-bars rect { opacity:.4; transform-box:fill-box; transform-origin:bottom; animation:pg-bar 3.2s ease-in-out infinite; animation-delay:calc(var(--i) * .22s); }
@keyframes pg-bar { 0%, 100% { transform:scaleY(.55); } 50% { transform:scaleY(1); } }
body.site .pg-trend { stroke-dasharray:190; stroke-dashoffset:190; animation:pg-draw 4s ease-in-out infinite; }
@keyframes pg-draw { 0% { stroke-dashoffset:190; } 55%, 100% { stroke-dashoffset:0; } }
body.site .pg-dot { animation:pg-pop 4s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
@keyframes pg-pop { 0%, 50% { opacity:0; transform:scale(.3); } 62%, 100% { opacity:1; transform:scale(1); } }
body.site .pg-q { animation-duration:4.2s; animation-iteration-count:infinite; animation-timing-function:ease-in-out; }
body.site .pg-q-stop { animation-name:pg-queue; animation-delay:calc(var(--i) * .35s); opacity:.8; }
body.site .pg-q-pass { animation-name:pg-pass; }
@keyframes pg-queue { 0% { transform:translateX(0); opacity:0; } 15% { opacity:.85; } 55%, 85% { transform:translateX(62px); opacity:.85; } 100% { transform:translateX(62px); opacity:0; } }
@keyframes pg-pass { 0% { transform:translateX(0); opacity:0; } 12% { opacity:1; } 100% { transform:translateX(138px); opacity:0; } }
body.site .pg-spin { transform-box:view-box; transform-origin:80px 32px; animation:pg-rotate 7s linear infinite; }
@keyframes pg-rotate { to { transform:rotate(360deg); } }
body.site .pg-tick { opacity:.22; animation:pg-tick 2.4s ease-in-out infinite; animation-delay:calc(var(--i) * .3s); }
@keyframes pg-tick { 0%, 100% { opacity:.18; } 40%, 60% { opacity:.8; } }
body.site .pg-links path { stroke-dasharray:5 5; animation:pg-flow 1.4s linear infinite; opacity:.7; }
@keyframes pg-flow { to { stroke-dashoffset:-20; } }
body.site .pg-ring { transform-box:fill-box; transform-origin:center; animation:pg-pulse 2.4s ease-out infinite; }
@keyframes pg-pulse { 0% { transform:scale(1); opacity:.8; } 100% { transform:scale(2.6); opacity:0; } }

/* ---------- Industry tiles: four brand "skins" — ink, coral, light, gold ---------- */
body.site .world-grid { --gap:1.2rem; display:flex; flex-wrap:wrap; justify-content:center; gap:var(--gap); }
body.site .world-grid .world-tile { flex:0 0 100%; max-width:100%; }
@media (min-width:640px) { body.site .world-grid .world-tile { flex-basis:calc((100% - var(--gap)) / 2); max-width:calc((100% - var(--gap)) / 2); } }
@media (min-width:1000px) { body.site .world-grid .world-tile { flex-basis:calc((100% - 2 * var(--gap)) / 3); max-width:calc((100% - 2 * var(--gap)) / 3); } }
body.site .world-tile { --tt:#1c140c; --tm:#6b6052; --chip:rgba(28,20,12,.06); --chip-b:rgba(28,20,12,.14); --ic-bg:linear-gradient(135deg, #f46a3a, #cf4219); --ic-fg:#fff;
  position:relative; display:flex; flex-direction:column; gap:.6rem; min-height:21rem; padding:1.5rem 1.6rem 1.4rem; border-radius:1.6rem; overflow:hidden; isolation:isolate; color:var(--tt);
  border:1px solid transparent; transition:transform .3s ease, box-shadow .3s ease, opacity .6s ease; }
body.site .world-tile:hover { transform:translateY(-6px); }
body.site .tile-ink { --c:#e0a94e; --tt:#f6ead8; --tm:#b9b2a6; --chip:rgba(255,255,255,.07); --chip-b:rgba(255,255,255,.16); --ic-bg:linear-gradient(135deg, #f2c877, #c98a2c); --ic-fg:#1c140c;
  background:radial-gradient(circle at 100% 0%, rgba(224,169,78,.32), transparent 55%), radial-gradient(circle at 0% 100%, rgba(238,90,46,.20), transparent 55%), #100a06; border-color:rgba(255,255,255,.1); box-shadow:0 24px 44px -28px rgba(10,8,6,.7); }
body.site .tile-coral { --c:#ffffff; --tt:#ffffff; --tm:rgba(255,255,255,.86); --chip:rgba(255,255,255,.16); --chip-b:rgba(255,255,255,.34); --ic-bg:#ffffff; --ic-fg:#d8481e;
  background:radial-gradient(circle at 100% 0%, rgba(255,214,150,.45), transparent 52%), linear-gradient(140deg, #f66e3c 0%, #e04a1f 55%, #b9380f 100%); box-shadow:0 24px 44px -26px rgba(216,72,30,.75); }
body.site .tile-light { --c:var(--accent); --tt:var(--color-heading); --tm:var(--color-muted); --chip:color-mix(in srgb, var(--accent) 9%, var(--color-surface)); --chip-b:color-mix(in srgb, var(--accent) 24%, transparent);
  background:radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--accent) 20%, transparent), transparent 55%), var(--color-surface); border-color:var(--color-surface-border); box-shadow:var(--shadow-card); }
body.site .tile-gold { --c:#1c140c; --tt:#1c140c; --tm:rgba(28,20,12,.72); --chip:rgba(28,20,12,.07); --chip-b:rgba(28,20,12,.22); --ic-bg:#1c140c; --ic-fg:#f2c877;
  background:radial-gradient(circle at 100% 0%, rgba(255,240,205,.7), transparent 50%), linear-gradient(140deg, #f4cd82 0%, #e0a94e 55%, #c48a2a 100%); box-shadow:0 24px 44px -26px rgba(196,138,42,.75); }
body.site .world-rings { position:absolute; z-index:0; right:-4.5rem; top:-4.5rem; width:16rem; height:16rem; border-radius:50%; pointer-events:none;
  background:repeating-radial-gradient(circle, transparent 0 .9rem, color-mix(in srgb, var(--c) 30%, transparent) .9rem calc(.9rem + 1px));
  -webkit-mask-image:radial-gradient(circle, #000 20%, transparent 70%); mask-image:radial-gradient(circle, #000 20%, transparent 70%);
  animation:world-drift 14s ease-in-out infinite alternate; }
@keyframes world-drift { from { transform:translate(0, 0) scale(1) rotate(0); } to { transform:translate(-.8rem, .8rem) scale(1.12) rotate(18deg); } }
body.site .world-tile::after { content:""; position:absolute; z-index:0; left:-30%; top:0; width:60%; height:100%; background:linear-gradient(100deg, transparent, rgba(255,255,255,.18), transparent); transform:translateX(-120%) skewX(-12deg); transition:transform .8s ease; pointer-events:none; }
body.site .world-tile:hover::after { transform:translateX(420%) skewX(-12deg); }
body.site .world-tile > * { position:relative; z-index:1; }
body.site .world-tile > .world-rings { position:absolute; z-index:0; }
body.site .world-top { display:flex; align-items:center; justify-content:space-between; }
body.site .world-icon { width:3.1rem; height:3.1rem; border-radius:1rem; display:flex; align-items:center; justify-content:center; color:var(--ic-fg); background:var(--ic-bg); box-shadow:0 12px 24px -12px rgba(0,0,0,.5); transition:transform .28s ease; }
body.site .world-icon svg { width:1.4rem; height:1.4rem; }
body.site .world-tile:hover .world-icon { transform:rotate(-7deg) scale(1.1); }
body.site .world-num { font-family:var(--font-display); font-weight:250; font-size:2.8rem; line-height:1; letter-spacing:-.04em; color:var(--tt); opacity:.4; }
body.site .world-tile h3 { margin:.55rem 0 0; font-family:var(--font-display); font-weight:300; font-size:clamp(1.5rem, 1.1rem + 1vw, 1.95rem); letter-spacing:-.015em; color:var(--tt); }
body.site .world-sum { margin:0; font-size:.9rem; line-height:1.55; color:var(--tm); max-width:30rem; }
body.site .world-chips { list-style:none; margin:.3rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.4rem; }
body.site .world-chips li { font-size:.72rem; font-weight:600; padding:.3rem .7rem; border-radius:999px; background:var(--chip); border:1px solid var(--chip-b); color:var(--tt); backdrop-filter:blur(4px); }
body.site .world-chips li.is-more { background:transparent; border-style:dashed; color:var(--tm); }
body.site .world-foot { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:auto; padding-top:1rem; font-size:.82rem; color:var(--tm); }
body.site .world-foot strong { color:var(--tt); font-size:1.05rem; }
body.site .world-arrow { width:2.5rem; height:2.5rem; border-radius:50%; display:flex; align-items:center; justify-content:center; border:1px solid var(--chip-b); color:var(--tt); transition:background .25s ease, color .25s ease, transform .25s ease, border-color .25s ease; }
body.site .world-tile:hover .world-arrow { background:var(--tt); color:var(--ic-fg, #fff); border-color:var(--tt); transform:translateX(4px); }
body.site .tile-light:hover .world-arrow { background:var(--accent); border-color:var(--accent); color:#fff; }
body.site .tile-light:hover { box-shadow:0 30px 54px -28px color-mix(in srgb, var(--accent) 80%, transparent); }
body.site .tile-ink:hover { box-shadow:0 30px 54px -24px rgba(224,169,78,.5); }
body.site .tile-ink:hover .world-arrow { color:#1c140c; }
body.site .tile-coral:hover .world-arrow { color:#d8481e; }
body.site .tile-gold:hover .world-arrow { color:#f2c877; }

@media (prefers-reduced-motion: reduce) {
  body.site .pg-bars rect, body.site .pg-trend, body.site .pg-dot, body.site .pg-q, body.site .pg-spin, body.site .pg-tick, body.site .pg-links path, body.site .pg-ring, body.site .world-rings { animation:none; }
  body.site .pg-trend { stroke-dashoffset:0; } body.site .pg-bars rect { opacity:.55; } body.site .pg-q-stop { opacity:.8; transform:translateX(30px); } body.site .pg-ring { opacity:.4; }
}

/* ======================================================================================================================
   Brand lock-up (logo + punch line) and the "Our approach" timeline
   ====================================================================================================================== */
body.site .brand { gap:.8rem; align-items:center; }
body.site .brand .badge { width:3.1rem; height:3.1rem; border-radius:.95rem; padding:.42rem; box-shadow:0 0 0 1px rgba(255,255,255,.22), 0 10px 26px -10px rgba(224,169,78,.7); transition:transform .25s ease, box-shadow .25s ease; }
body.site .brand:hover .badge { transform:rotate(-5deg) scale(1.05); box-shadow:0 0 0 1px rgba(255,255,255,.3), 0 14px 30px -10px rgba(224,169,78,.9); }
body.site .brand-text { display:flex; flex-direction:column; line-height:1.05; }
body.site .brand-name { font-family:var(--font-display); font-weight:700; font-size:1.75rem; letter-spacing:-.025em; }
body.site .brand-raah { background:linear-gradient(90deg, #f2c877, #e0a94e 55%, #ee7a3a); -webkit-background-clip:text; background-clip:text; color:transparent; }
body.site .brand-tag { margin-top:.28rem; font-family:var(--font-sans); font-weight:600; font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(246,234,216,.62); white-space:nowrap; }
body.site .site-header .bar { padding-block:.75rem; }
@media (max-width:640px) {
  body.site .brand { gap:.6rem; }
  body.site .brand .badge { width:2.6rem; height:2.6rem; border-radius:.8rem; padding:.36rem; }
  body.site .brand-name { font-size:1.4rem; }
  body.site .brand-tag { font-size:.5rem; letter-spacing:.14em; }
}
body.site .footer-grid .brand-name { font-size:1.9rem; }

/* Home — approach band */
body.site .approach { background:var(--ink); padding:clamp(4rem, 9vh, 7rem) 0; }
body.site .approach h2 { color:var(--cream); margin-bottom:3rem; }
body.site .approach-steps { list-style:none; margin:0; padding:0; display:grid; gap:2.5rem 2rem; grid-template-columns:1fr; }
@media (min-width:640px) { body.site .approach-steps { grid-template-columns:1fr 1fr; } }
@media (min-width:1024px) { body.site .approach-steps { grid-template-columns:repeat(4, 1fr); } }
body.site .approach-steps li { border-top:1px solid var(--line); padding-top:1.4rem; }
body.site .approach-num { display:block; font-family:var(--font-display); font-weight:250; font-size:2.6rem; line-height:1; letter-spacing:-.03em; color:var(--signature-glow); margin-bottom:1.1rem; }
body.site .approach-steps h3 { color:var(--cream); font-size:1.1rem; }
body.site .approach-steps p { color:var(--mist); font-size:.92rem; margin:0; }
