/* ═══════════════════════════════════════════════════════════════
   HOME.CSS — homepage only (index.php). "Modernist" system.
   Tokens come from chrome.css (loaded after this file); every value
   here reads from var(--color-*), var(--space-*), etc.
═══════════════════════════════════════════════════════════════ */

.home{ background:var(--color-bg); color:var(--color-text); }
.home .wrap{ max-width:var(--wrap); margin:0 auto; padding:0 var(--gutter); }
.home section{ scroll-margin-top:calc(var(--hdr-h) + 12px); }
.home img{ max-width:100%; display:block; }
.home p{ margin:0; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.grayscale{ filter:grayscale(1) contrast(1.08); }

/* Section rhythm: strong rule between major sections */
.h-sec{ padding:clamp(64px, 9vw, 120px) 0; border-top:var(--rule); }
.h-sec.no-rule{ border-top:0; }
.kicker{
    display:block; margin:0 0 14px;
    font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
    color:var(--color-accent-700);
}
.h-title{
    font-weight:800; letter-spacing:-0.03em; line-height:1.02; margin:0;
    font-size:clamp(30px, 3.4vw, 46px); max-width:16ch;
}
.h-head{ display:grid; grid-template-columns:1.4fr 1fr; gap:32px; align-items:end; margin-bottom:40px; }
.h-head .h-lede{ font-size:15px; line-height:1.6; color:var(--color-muted); max-width:44ch; }
.h-link{
    display:inline-flex; align-items:center; gap:8px;
    font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
    color:var(--color-text); text-decoration:none;
}
.h-link:hover{ color:var(--color-accent); }
.h-link .bi{ transition:transform var(--t); }
.h-link:hover .bi{ transform:translateX(3px); }

/* ─── HERO ─────────────────────────────────────────────────── */
.hero{ padding:clamp(48px, 7vw, 96px) 0 clamp(56px, 7vw, 88px); }
.hero-grid{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(32px, 5vw, 72px); align-items:center; }
.avail{
    display:inline-flex; align-items:center; gap:10px; margin-bottom:28px;
    font-size:13px; font-weight:600; color:var(--color-text);
}
.avail-dot{ width:9px; height:9px; background:#1f8a4c; flex:none; }
.avail.is-wait .avail-dot{ background:#b7791f; }
.hero h1{
    margin:0 0 26px; font-weight:800; letter-spacing:-0.045em; line-height:.94;
    font-size:clamp(44px, 6vw, 84px);
}
.hero h1 .rot{ color:var(--color-accent); display:inline-block; min-width:1ch; }
.hero h1 .rot.is-out{ opacity:0; transform:translateY(8px); }
.hero h1 .rot{ transition:opacity .22s var(--ease), transform .22s var(--ease); }
.hero-lede{ font-size:clamp(15px, 1.1vw, 17px); line-height:1.6; max-width:44ch; margin-bottom:32px !important; }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:14px 24px; align-items:center; }
.hero-ctas .btn-primary{ min-width:220px; }

/* Hero panel — tabbed results from real roles */
.hp{ border:var(--rule-strong); background:var(--color-paper); }
.hp-tabs{ display:grid; grid-template-columns:repeat(3, 1fr); border-bottom:var(--rule-strong); }
.hp-tab{
    appearance:none; border:0; background:transparent; cursor:pointer; text-align:left;
    padding:12px 14px; font-family:var(--font-heading); font-size:12px; font-weight:700;
    letter-spacing:.08em; text-transform:uppercase; color:var(--color-text);
}
.hp-tab + .hp-tab{ border-left:1px solid var(--color-divider); }
.hp-tab:hover{ background:color-mix(in srgb, var(--color-text) 6%, transparent); }
.hp-tab[aria-selected="true"]{ background:var(--color-accent); color:#fff; }
.hp-tab small{ display:block; margin-top:3px; font-size:11px; font-weight:500; letter-spacing:0; text-transform:none; opacity:.75; }
.hp-body{ display:grid; grid-template-columns:1.1fr 1fr; }
.hp-metric{ padding:20px 20px 22px; border-right:var(--rule-strong); border-bottom:var(--rule-strong); }
.hp-metric .lbl{ font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--color-muted); }
.hp-metric .val{ font-size:clamp(40px, 3.8vw, 52px); font-weight:800; letter-spacing:-0.04em; line-height:1; color:var(--color-accent); margin:10px 0 6px; }
.hp-metric .sub{ font-size:13px; color:var(--color-muted); }
.hp-photo{ grid-row:span 2; position:relative; min-height:260px; background:var(--color-surface); }
.hp-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 20%; }
.hp-rows{ border-right:var(--rule-strong); }
.hp-row{ display:flex; justify-content:space-between; gap:12px; padding:11px 20px; border-bottom:1px solid var(--color-divider); font-size:14px; }
.hp-row:last-child{ border-bottom:0; }
.hp-row b{ font-weight:700; }
.hp-row span{ font-weight:700; color:var(--color-accent-700); white-space:nowrap; }
.hp-foot{ grid-column:1 / -1; border-top:var(--rule-strong); padding:10px 20px; font-size:12px; color:var(--color-muted); display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.hp-pane[hidden]{ display:none; }

/* ─── CLIENT STRIP ─────────────────────────────────────────── */
.clients{ border-top:var(--rule); border-bottom:var(--rule); }
.clients-grid{ display:grid; grid-template-columns:1.3fr repeat(5, 1fr); }
.clients-label{
    grid-row:span 3; padding:20px 20px 20px 0; border-right:var(--rule);
    display:flex; flex-direction:column; justify-content:space-between; gap:12px;
}
.clients-label strong{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--color-muted); }
.clients-label span{ font-size:13px; color:var(--color-muted); line-height:1.45; max-width:24ch; }
.cl-cell{
    display:flex; align-items:center; justify-content:center; min-height:84px; padding:14px 18px;
    border-right:1px solid var(--color-divider); border-bottom:1px solid var(--color-divider);
    text-decoration:none;
}
.cl-cell:nth-child(5n+1){ border-right:0; }
.cl-cell:nth-last-child(-n+5){ border-bottom:0; }
.cl-cell img{ max-height:40px; max-width:100%; width:auto; object-fit:contain; filter:grayscale(1) contrast(1.25) brightness(.8); opacity:.9; transition:opacity var(--t); }
.cl-cell:hover img{ opacity:1; }
.clients-note{ font-size:12px; color:var(--color-muted); padding:12px 0; border-top:1px solid var(--color-divider); }

/* ─── SERVICES (numbered practice rows) ───────────────────── */
.svc-list{ border-top:var(--rule-strong); }
.svc-row{
    display:grid; grid-template-columns:70px 1.25fr 1.4fr 110px; gap:24px; align-items:center;
    padding:26px 0; border-bottom:var(--rule); color:var(--color-text); text-decoration:none;
}
.svc-row:hover .svc-t{ color:var(--color-accent); }
.svc-n{ font-size:14px; font-weight:700; color:var(--color-accent); }
.svc-k{ display:block; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:6px; }
.svc-t{ display:block; font-size:clamp(18px, 1.6vw, 22px); font-weight:800; letter-spacing:-0.02em; line-height:1.1; transition:color var(--t); }
.svc-tags{ display:flex; flex-wrap:wrap; gap:6px; }
.tag{ display:inline-flex; align-items:center; padding:4px 9px; font-size:12px; line-height:1.3; border:1px solid var(--color-accent); color:var(--color-accent-700); }
.svc-go{ justify-self:end; font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; display:inline-flex; gap:8px; align-items:center; }
.svc-more{ margin-top:22px; font-size:15px; color:var(--color-muted); }
.svc-more a{ color:var(--color-text); font-weight:700; text-underline-offset:4px; }
.svc-more a:hover{ color:var(--color-accent-700); }

/* ─── PROOF (dark) ────────────────────────────────────────── */
.proof{ background:var(--color-text); color:var(--color-bg); border-top:0; }
.proof .kicker{ color:var(--color-accent-400); }
.proof .h-title{ color:var(--color-bg); }
.proof-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:40px; }
.proof-nav{ display:flex; gap:8px; }
.proof-nav button{
    width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
    background:transparent; color:var(--color-bg); border:2px solid var(--color-bg); font-size:16px;
}
.proof-nav button:hover{ background:var(--color-bg); color:var(--color-text); }
.proof-track{
    display:grid; grid-auto-flow:column; grid-auto-columns:minmax(300px, 1fr); gap:16px;
    overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:4px;
}
.proof-track::-webkit-scrollbar{ display:none; }
.pcard{ scroll-snap-align:start; border:1px solid color-mix(in srgb, var(--color-bg) 30%, transparent); display:flex; flex-direction:column; }
.pcard-top{
    height:150px; display:flex; align-items:center; justify-content:flex-start; padding:0 24px;
    border-bottom:1px solid color-mix(in srgb, var(--color-bg) 30%, transparent);
    background:color-mix(in srgb, var(--color-bg) 6%, transparent);
}
.pcard-top img{ max-height:52px; max-width:70%; filter:grayscale(1) brightness(0) invert(1); opacity:.9; }
/* Logos on a solid white canvas: invert, then screen away the black */
.pcard-top img.is-opaque{ max-height:88px; filter:grayscale(1) invert(1); mix-blend-mode:screen; opacity:1; }
.pcard-body{ padding:22px 24px 24px; display:flex; flex-direction:column; flex:1; }
.pcard-meta{ display:flex; justify-content:space-between; gap:10px; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin-bottom:12px; }
.pcard-meta .n{ color:var(--color-accent-400); }
.pcard-meta .c{ opacity:.75; text-align:right; }
.pcard h3{ font-size:20px; font-weight:800; line-height:1.12; letter-spacing:-0.02em; margin:0 0 18px; color:var(--color-bg); }
.pcard-metrics{ display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; border-top:1px solid color-mix(in srgb, var(--color-bg) 30%, transparent); padding-top:16px; margin-bottom:20px; }
.pcard-metrics b{ display:block; font-size:22px; font-weight:800; letter-spacing:-0.02em; color:var(--color-accent-400); }
.pcard-metrics span{ display:block; font-size:11px; letter-spacing:.06em; text-transform:uppercase; opacity:.8; margin-top:4px; line-height:1.35; }
.pcard .h-link{ color:var(--color-bg); margin-top:auto; }
.pcard .h-link:hover{ color:var(--color-accent-400); }
.proof-note{ margin-top:22px !important; font-size:13px; opacity:.7; }

/* ─── ECOSYSTEM ───────────────────────────────────────────── */
.eco{ display:grid; grid-template-columns:1fr 1fr; border:var(--rule-strong); }
.eco > *, .hero-grid > *, .contact-grid > *, .about-grid > *, .ind-grid > *, .faq-grid > *{ min-width:0; }
.eco-map{ background:var(--color-paper); padding:40px 24px; display:flex; flex-direction:column; align-items:center; border-right:var(--rule-strong); }
.eco-rowx{ display:flex; justify-content:center; }
.eco-line{ width:2px; height:26px; background:var(--color-text); }
.eco-node{
    appearance:none; cursor:pointer; min-width:132px; display:flex; justify-content:space-between; align-items:center; gap:14px;
    padding:12px 14px; border:2px solid var(--color-text); background:var(--color-bg);
    font-family:var(--font-heading); font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--color-text);
}
.eco-rowx .eco-node + .eco-node{ border-left:0; }
.eco-node:hover{ background:color-mix(in srgb, var(--color-accent) 10%, var(--color-bg)); }
.eco-node[aria-pressed="true"]{ background:var(--color-accent); border-color:var(--color-accent); color:#fff; }
.eco-rowx .eco-node[aria-pressed="true"] + .eco-node{ border-left:0; }
.eco-node.is-end{ background:var(--color-text); color:var(--color-bg); }
.eco-node.is-end[aria-pressed="true"]{ background:var(--color-accent); border-color:var(--color-accent); }
.eco-panel{ padding:36px 32px; }
.eco-panel h3{ font-size:clamp(22px, 2vw, 28px); font-weight:800; letter-spacing:-0.02em; line-height:1.08; margin:0 0 20px; max-width:14ch; }
.eco-panel p.eco-d{ font-size:15px; line-height:1.6; color:var(--color-muted); margin-bottom:18px; max-width:44ch; }
.eco-list{ list-style:none; margin:0; padding:0; border-top:var(--rule); }
.eco-list li{ display:flex; justify-content:space-between; align-items:center; padding:12px 0; border-bottom:1px solid var(--color-divider); font-size:15px; font-weight:600; }
.eco-list li::after{ content:""; width:9px; height:9px; background:var(--color-accent); flex:none; }

/* ─── ABOUT / STATS ───────────────────────────────────────── */
.about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px, 6vw, 96px); align-items:start; }
.about-copy p{ font-size:16px; line-height:1.65; margin-bottom:16px; max-width:52ch; }
.about-copy .h-title{ margin-bottom:24px; }
.about-links{ display:flex; flex-wrap:wrap; gap:14px 24px; margin-top:10px; }
.stats{ display:grid; grid-template-columns:1fr 1fr; border-top:var(--rule-strong); }
.stat{ padding:22px 0 26px; border-bottom:var(--rule); }
.stat:nth-child(odd){ padding-right:22px; border-right:var(--rule); }
.stat:nth-child(even){ padding-left:28px; }
.stat b{ display:block; font-size:clamp(40px, 4vw, 56px); font-weight:800; letter-spacing:-0.04em; line-height:1; color:var(--color-accent); }
.stat span{ display:block; margin-top:10px; font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.stat small{ display:block; margin-top:4px; font-size:13px; color:var(--color-muted); }

.dach{ margin-top:clamp(56px, 7vw, 88px); border-top:var(--rule-strong); display:grid; grid-template-columns:1fr 2fr; }
.dach-intro{ padding:24px 28px 24px 0; border-right:var(--rule); }
.dach-intro h3{ font-size:22px; font-weight:800; letter-spacing:-0.02em; margin:0 0 12px; }
.dach-intro p{ font-size:14px; line-height:1.6; color:var(--color-muted); margin-bottom:16px; }
.dach-intro .de{ color:var(--color-text); font-style:normal; border-left:2px solid var(--color-accent); padding-left:12px; }
.dach-cells{ display:grid; grid-template-columns:1fr 1fr; }
.dach-cell{ padding:24px 0 24px 28px; border-bottom:1px solid var(--color-divider); }
.dach-cell:nth-child(odd){ border-right:1px solid var(--color-divider); padding-right:28px; }
.dach-cell:nth-last-child(-n+2){ border-bottom:0; }
.dach-cell h4{ font-size:17px; font-weight:800; margin:0 0 6px; letter-spacing:-0.01em; }
.dach-cell p{ font-size:14px; line-height:1.55; color:var(--color-muted); }

/* ─── PROCESS ─────────────────────────────────────────────── */
.steps{ display:grid; grid-template-columns:repeat(3, 1fr); border-top:var(--rule-strong); }
.step{ padding:22px 28px 10px 0; }
.step + .step{ padding-left:28px; border-left:var(--rule); }
.step .n{ font-size:14px; font-weight:700; color:var(--color-accent); }
.step h3{ font-size:20px; font-weight:800; letter-spacing:-0.02em; margin:12px 0 10px; }
.step p{ font-size:15px; line-height:1.6; color:var(--color-muted); max-width:36ch; }

/* ─── INDUSTRIES ──────────────────────────────────────────── */
.ind-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px, 5vw, 72px); align-items:start; }
.ind-list{ list-style:none; margin:0; padding:0; border-top:var(--rule-strong); }
.ind-list li{ border-bottom:var(--rule); }
.ind-btn{
    appearance:none; width:100%; background:none; border:0; cursor:pointer; text-align:left;
    display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px 0;
    font-family:var(--font-heading); font-size:clamp(17px, 1.4vw, 20px); font-weight:800; letter-spacing:-0.02em; color:var(--color-text);
}
.ind-btn .bi{ font-size:16px; opacity:0; transition:opacity var(--t); color:var(--color-accent); }
.ind-btn:hover, .ind-btn[aria-selected="true"]{ color:var(--color-accent); }
.ind-btn[aria-selected="true"] .bi, .ind-btn:hover .bi{ opacity:1; }
.ind-panel{ position:sticky; top:calc(var(--hdr-h) + 24px); border:var(--rule-strong); background:var(--color-paper); }
.ind-panel-top{ min-height:280px; padding:28px 28px 24px; border-bottom:var(--rule-strong); background:var(--color-surface); display:flex; flex-direction:column; justify-content:space-between; gap:24px; }
.ind-panel-top .bi{ font-size:56px; line-height:1; color:var(--color-accent); display:block; }
.ind-panel-top h3{ font-size:24px; font-weight:800; letter-spacing:-0.02em; margin:0 0 10px; }
.ind-panel-top p{ font-size:15px; line-height:1.6; color:var(--color-muted); max-width:46ch; }
.ind-panel-body{ padding:22px 28px 26px; }
.ind-caps{ display:grid; grid-template-columns:1fr 1fr; border-top:var(--rule); margin:10px 0 22px; }
.ind-caps span{ padding:11px 0; border-bottom:1px solid var(--color-divider); font-size:14px; font-weight:700; }
.ind-caps span:nth-child(odd){ padding-right:14px; }
.ind-caps span:nth-child(even){ padding-left:14px; border-left:1px solid var(--color-divider); }
.ind-pane[hidden]{ display:none; }

/* ─── PROJECTS ────────────────────────────────────────────── */
.proj-grid{ display:grid; grid-template-columns:repeat(3, 1fr); border-top:var(--rule-strong); }
.proj{ padding:22px 24px 24px 0; border-bottom:var(--rule); display:flex; flex-direction:column; gap:10px; }
.proj:not(:nth-child(3n+1)){ padding-left:24px; border-left:var(--rule); }
.proj-top{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.proj-top .bi{ font-size:20px; color:var(--color-accent); }
.proj-tech{ font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--color-muted); text-align:right; }
.proj h3{ font-size:19px; font-weight:800; letter-spacing:-0.02em; margin:0; }
.proj p{ font-size:14px; line-height:1.55; color:var(--color-muted); flex:1; }
.proj-links{ display:flex; gap:18px; }
.proj-links a{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--color-text); text-decoration:none; display:inline-flex; gap:6px; align-items:center; }
.proj-links a:hover{ color:var(--color-accent); }

.bots{ margin-top:48px; }
.bots h3{ font-size:20px; font-weight:800; margin:0 0 14px; }
.tbl{ width:100%; border-collapse:collapse; font-size:14px; }
.tbl th{ text-align:left; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--color-muted); padding:10px 12px 10px 0; border-bottom:var(--rule-strong); }
.tbl td{ padding:14px 12px 14px 0; border-bottom:1px solid var(--color-divider); vertical-align:top; line-height:1.5; }
.tbl td:first-child{ font-weight:800; white-space:nowrap; }
.tbl td.muted{ color:var(--color-muted); }
.tbl td a{ color:var(--color-text); font-weight:700; text-decoration:none; white-space:nowrap; }
.tbl td a:hover{ color:var(--color-accent-700); }
.tbl tbody tr:hover{ background:color-mix(in srgb, var(--color-text) 4%, transparent); }
.tbl-wrap{ overflow-x:auto; }

/* AI prompts include — restyle its classes to the system */
#ai-prompts .aip-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:0; border-top:var(--rule-strong); }
#ai-prompts .aip-card{ background:transparent !important; border:0 !important; border-bottom:var(--rule) !important; padding:22px 24px 24px 0 !important; transform:none !important; }
#ai-prompts .aip-card:not(:nth-child(3n+1)){ padding-left:24px !important; border-left:var(--rule) !important; }
#ai-prompts .aip-ico{ background:none !important; border:0 !important; width:auto; height:auto; place-items:start; color:var(--color-accent) !important; font-size:20px; margin-bottom:10px; }
#ai-prompts .aip-cat{ color:var(--color-accent-700) !important; }
#ai-prompts .aip-card h3{ font-size:20px; font-weight:800; letter-spacing:-0.02em; }
#ai-prompts .aip-tag{ background:none !important; border:1px solid var(--color-divider) !important; color:var(--color-muted) !important; }
#ai-prompts a, #ai-prompts button{ font-family:var(--font-heading); }

/* ─── EXPERIENCE ──────────────────────────────────────────── */
.xp{ border-top:var(--rule-strong); }
.xp-row{ display:grid; grid-template-columns:220px 1fr 1.2fr; gap:28px; padding:26px 0; border-bottom:var(--rule); }
.xp-when{ font-size:13px; font-weight:700; letter-spacing:.04em; }
.xp-when small{ display:block; font-weight:500; color:var(--color-muted); margin-top:4px; letter-spacing:0; }
.xp-role h3{ font-size:19px; font-weight:800; letter-spacing:-0.02em; margin:0 0 4px; }
.xp-role .co{ font-size:15px; font-weight:700; color:var(--color-accent-700); }
.xp-role p{ font-size:14px; line-height:1.55; color:var(--color-muted); margin-top:10px; }
.xp-list{ list-style:none; margin:0; padding:0; }
.xp-list li{ position:relative; padding:0 0 8px 18px; font-size:14px; line-height:1.55; }
.xp-list li::before{ content:""; position:absolute; left:0; top:.55em; width:7px; height:7px; background:var(--color-accent); }
.xp-extra{ display:grid; grid-template-columns:repeat(3, 1fr); }
.xp-extra > div{ padding:24px 24px 8px 0; }
.xp-extra > div + div{ padding-left:24px; border-left:var(--rule); }
.xp-extra h4{ font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--color-muted); margin:0 0 10px; }
.xp-extra li{ font-size:14px; line-height:1.5; margin-bottom:6px; }
.xp-extra ul{ list-style:none; padding:0; margin:0; }

/* Project briefs: one collapsed line; opens to a compact list */
.briefs{ margin-top:40px; border-top:var(--rule); }
.briefs summary{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 0; cursor:pointer; list-style:none; font-size:14px; font-weight:700; }
.briefs summary::-webkit-details-marker{ display:none; }
.briefs summary span{ font-size:12px; font-weight:600; color:var(--color-muted); }
.briefs summary::after{ content:'\F4FE'; font-family:'bootstrap-icons'; font-weight:400; }
.briefs[open] summary::after{ transform:rotate(45deg); }
.briefs summary:hover{ color:var(--color-accent-700); }
.briefs-list{ list-style:none; margin:0 0 8px; padding:0; columns:2; column-gap:32px; }
.briefs-list li{ break-inside:avoid; display:flex; justify-content:space-between; gap:12px; padding:7px 0; border-bottom:1px solid var(--color-divider-soft); font-size:13px; }
.briefs-list a{ color:var(--color-text); text-decoration:none; }
.briefs-list a:hover{ color:var(--color-accent-700); text-decoration:underline; }
.briefs-list span{ color:var(--color-muted); white-space:nowrap; }
@media (max-width:640px){ .briefs-list{ columns:1; } }

/* ─── INSIGHTS ────────────────────────────────────────────── */
.posts{ display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; }
.post{ border-top:var(--rule-strong); padding-top:16px; color:var(--color-text); text-decoration:none; display:flex; flex-direction:column; }
.post-img{ aspect-ratio:16/10; background:var(--color-surface); overflow:hidden; margin-bottom:14px; }
.post-img img{ width:100%; height:100%; object-fit:cover; }
.post-meta{ display:flex; gap:8px; align-items:center; margin-bottom:10px; flex-wrap:wrap; }
.post-meta .tag{ font-size:11px; }
.post-meta time, .post-meta .rt{ font-size:12px; color:var(--color-muted); }
.post h3{ font-size:18px; font-weight:800; letter-spacing:-0.015em; line-height:1.2; margin:0; }
.post:hover h3{ color:var(--color-accent-700); }
.posts-empty{ grid-column:1 / -1; border-top:var(--rule-strong); padding:24px 0; color:var(--color-muted); }

/* ─── FAQ ─────────────────────────────────────────────────── */
.faq-grid{ display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(32px, 6vw, 96px); align-items:start; }
.faq{ border-top:var(--rule-strong); }
.faq-item{ border-bottom:var(--rule); }
.faq-q{
    appearance:none; width:100%; background:none; border:0; cursor:pointer; text-align:left;
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0;
    font-family:var(--font-heading); font-size:16px; font-weight:700; color:var(--color-text);
}
.faq-q:hover{ color:var(--color-accent-700); }
.faq-q .bi{ font-size:18px; flex:none; transition:transform var(--t); }
.faq-item.open .faq-q .bi{ transform:rotate(45deg); }
.faq-a{ overflow:hidden; max-height:0; transition:max-height .25s var(--ease); }
.faq-a p{ padding:0 0 20px; font-size:15px; line-height:1.65; color:var(--color-muted); max-width:60ch; }

/* ─── CONTACT + BRIEF FORM ────────────────────────────────── */
.contact-grid{ display:grid; grid-template-columns:1fr 1.25fr; gap:clamp(32px, 6vw, 96px); align-items:start; }
.contact-copy .h-title{ margin-bottom:20px; }
.contact-copy > p{ font-size:16px; line-height:1.6; max-width:44ch; margin-bottom:28px; }
.contact-list{ list-style:none; margin:0; padding:0; border-top:var(--rule-strong); }
.contact-list li{ border-bottom:var(--rule); }
.contact-list a{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:15px 0; color:var(--color-text); text-decoration:none; font-size:16px; font-weight:700; }
.contact-list a span{ font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--color-muted); }
.contact-list a:hover{ color:var(--color-accent-700); }

.lead-form{ position:relative; border:var(--rule-strong); background:var(--color-paper); padding:28px; }
.lead-form h3{ font-size:21px; font-weight:800; letter-spacing:-0.02em; margin:0 0 6px; }
.lead-form .form-lede{ font-size:14px; color:var(--color-muted); margin-bottom:22px; }
/* Honeypot: hidden without large offsets (those widen the page in RTL) */
.hp-field{ position:absolute !important; width:1px !important; height:1px !important; min-height:0 !important; padding:0 !important; border:0 !important; overflow:hidden; clip-path:inset(50%); opacity:0; pointer-events:none; }
.lead-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.lead-field{ margin-bottom:16px; }
.lead-field label{ display:block; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; margin-bottom:6px; }
.lead-field .req{ color:var(--color-accent); }
.lead-field input, .lead-field select, .lead-field textarea{
    width:100%; min-height:46px; padding:10px 12px; font:inherit; font-size:15px; color:var(--color-text);
    background:var(--color-bg); border:2px solid var(--color-divider); caret-color:var(--color-accent);
}
.lead-field input:hover, .lead-field select:hover, .lead-field textarea:hover{ border-color:color-mix(in srgb, var(--color-text) 60%, transparent); }
.lead-field input:focus-visible, .lead-field select:focus-visible, .lead-field textarea:focus-visible{ border-color:var(--color-accent); outline:0 !important; }
.lead-field textarea{ min-height:130px; resize:vertical; }
.field-hint, .char-count{ font-size:12px; color:var(--color-muted); margin-top:6px !important; }
.char-count{ text-align:right; }
.checkbox-label{ display:flex !important; gap:10px; align-items:flex-start; font-size:14px !important; font-weight:400 !important; letter-spacing:0 !important; text-transform:none !important; line-height:1.5; cursor:pointer; }
.checkbox-label input{ width:18px; min-height:18px; height:18px; margin-top:2px; accent-color:var(--color-accent); flex:none; }
.checkbox-label a{ color:var(--color-accent-700); }
.lead-submit-btn{ width:100%; min-height:52px; margin-top:20px; font-size:15px; }
.lead-foot{ font-size:12px; color:var(--color-muted); margin-top:12px !important; }
.lead-flash{ display:flex; gap:12px; padding:14px 16px; margin-bottom:20px; border:2px solid; font-size:14px; }
.lead-flash .bi{ font-size:18px; }
.lead-flash strong{ display:block; margin-bottom:2px; }
.lead-flash-success{ border-color:#1f8a4c; background:color-mix(in srgb, #1f8a4c 8%, var(--color-paper)); }
.lead-flash-error{ border-color:var(--color-accent); background:var(--color-accent-100); }

/* ─── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width:1100px){
    .clients-grid{ grid-template-columns:repeat(5, 1fr); }
    .clients-label{ grid-row:auto; grid-column:1 / -1; border-right:0; border-bottom:1px solid var(--color-divider); flex-direction:row; align-items:baseline; padding:14px 0; }
    .svc-row{ grid-template-columns:50px 1fr 1fr; }
    .svc-go{ display:none; }
    .xp-row{ grid-template-columns:170px 1fr; }
    .xp-row .xp-list{ grid-column:2; }
}
@media (max-width:960px){
    .hero-grid, .h-head, .about-grid, .ind-grid, .faq-grid, .contact-grid, .eco{ grid-template-columns:1fr; }
    .eco-map{ border-right:0; border-bottom:var(--rule-strong); }
    .dach{ grid-template-columns:1fr; }
    .dach-intro{ border-right:0; border-bottom:var(--rule); padding-right:0; }
    .dach-cell{ padding-left:0; }
    .dach-cell:nth-child(even){ padding-left:20px; }
    .ind-panel{ position:static; }
    .proj-grid, #ai-prompts .aip-grid{ grid-template-columns:1fr 1fr; }
    .proj:not(:nth-child(3n+1)), #ai-prompts .aip-card:not(:nth-child(3n+1)){ padding-left:0 !important; border-left:0 !important; }
    .proj:nth-child(even), #ai-prompts .aip-card:nth-child(even){ padding-left:20px !important; border-left:var(--rule) !important; }
    .posts{ grid-template-columns:1fr 1fr; }
    .steps{ grid-template-columns:1fr; }
    .step + .step{ padding-left:0; border-left:0; border-top:var(--rule); }
    .xp-extra{ grid-template-columns:1fr; }
    .xp-extra > div + div{ padding-left:0; border-left:0; border-top:var(--rule); }
}
@media (max-width:640px){
    .clients-grid{ grid-template-columns:repeat(3, 1fr); }
    .clients-label{ flex-direction:column; gap:4px; }
    .cl-cell:nth-child(5n+1){ border-right:1px solid var(--color-divider); }
    .cl-cell:nth-child(3n+1){ border-right:0; }
    .cl-cell:nth-last-child(-n+5){ border-bottom:1px solid var(--color-divider); }
    .cl-cell:nth-last-child(-n+3){ border-bottom:0; }
    .hp-tabs .hp-tab small{ display:none; }
    .hp-body{ grid-template-columns:1fr 1fr; }
    .hp-metric{ grid-column:1 / -1; border-right:0; }
    .hp-photo{ grid-row:auto; min-height:220px; }
    .hp-rows{ border-right:0; border-left:var(--rule-strong); }
    .hp-row{ flex-direction:column; gap:2px; padding:10px 12px; font-size:13px; }
    .svc-row{ grid-template-columns:36px 1fr; gap:14px; }
    .eco-map{ padding:28px 12px; }
    .eco-node{ min-width:0; padding:10px 9px; font-size:11px; letter-spacing:.06em; }
    .eco-node .bi{ display:none; }
    .eco-panel{ padding:26px 18px; }
    .svc-tags{ grid-column:2; }
    .proof-head{ flex-direction:column; align-items:flex-start; }
    .proof-track{ grid-auto-columns:86%; }
    .stats{ grid-template-columns:1fr 1fr; }
    .stat:nth-child(even){ padding-left:18px; }
    .dach-cells{ grid-template-columns:1fr; }
    .dach-cell:nth-child(odd){ border-right:0; padding-right:0; }
    .dach-cell:nth-child(even){ padding-left:0; }
    .dach-cell:nth-last-child(2){ border-bottom:1px solid var(--color-divider); }
    .proj-grid, #ai-prompts .aip-grid, .posts{ grid-template-columns:1fr; }
    .proj:nth-child(even), #ai-prompts .aip-card:nth-child(even){ padding-left:0 !important; border-left:0 !important; }
    .xp-row{ grid-template-columns:1fr; gap:10px; }
    .xp-row .xp-list{ grid-column:auto; }
    .lead-row{ grid-template-columns:1fr; gap:0; }
    /* Tables become stacked rows on phones */
    .tbl thead{ display:none; }
    .tbl, .tbl tbody, .tbl tr, .tbl td{ display:block; width:100%; }
    .tbl tr{ padding:14px 0; border-bottom:1px solid var(--color-divider); }
    .tbl tr:first-child{ border-top:var(--rule-strong); }
    .tbl td{ padding:2px 0; border:0; white-space:normal; }
    .tbl td:first-child{ white-space:normal; font-size:16px; }
    .tbl td:last-child{ padding-top:8px; }
    .lead-form{ padding:20px; }
    .ind-caps{ grid-template-columns:1fr; }
    .ind-caps span:nth-child(even){ padding-left:0; border-left:0; }
}

/* RTL: the homepage body is marked lang="en" dir="ltr" until it is
   translated, so it stays left-aligned even when the header is Arabic. */
.home[dir="ltr"]{ text-align:left; }

@media (prefers-reduced-motion: reduce){
    .hero h1 .rot{ transition:none; }
}