/* Kindra AI x Kindra Hire cross-brand blocks, v5. Beacon 20261024.
   Tokens copied from live kindrahire.com.au (index.html inline :root and /assets/khnav/khnav.20261002w1.css, 24 Oct 2026).
   Every rule is scoped under .khx; the font family name is unique (KHX Big Shoulders) so nothing leaks into the Kindra AI styles. */
@font-face{font-family:'KHX Big Shoulders';src:url('/img/xpromo/khx-bsd-700.woff2') format('woff2');font-weight:700 900;font-style:normal;font-display:swap}
.khx{--khx-navy:#0A1628;--khx-navy2:#071120;--khx-ink:#050B14;--khx-teal:#00B4A6;--khx-mag:#E91E8C;--khx-btn:#E11684;--khx-ice:#E8F4F2;--khx-mist:#C5D5DE;--khx-muted:#B7C9D4;--khx-slate:#7E93AE;--khx-line:rgba(232,244,242,.14);--khx-c:#0B4E63;
 --khx-disp:'KHX Big Shoulders',"Arial Narrow",Impact,sans-serif;--khx-body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--khx-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
 box-sizing:border-box;color:var(--khx-ice);font-family:var(--khx-body);font-size:16px;line-height:1.5;letter-spacing:normal;text-align:left;-webkit-font-smoothing:antialiased}
.khx *,.khx *::before,.khx *::after{box-sizing:border-box}
.khx .khx-x{display:inline-flex;white-space:nowrap;align-items:center;gap:.55em;margin:0 0 1.1rem;padding:.42rem .8rem;border:1px solid var(--khx-line);border-radius:999px;background:rgba(5,11,20,.72);font:600 .75rem/1 var(--khx-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--khx-ice)}
.khx .khx-x i{font-style:normal;color:var(--khx-mag);font-weight:700}
.khx .khx-x b{color:var(--khx-teal);font-weight:600}
.khx img.khx-logo{display:block;width:240px;max-width:72%;height:auto;margin:0 0 1rem;padding:0}
.khx .khx-h{font-family:var(--khx-disp);font-weight:900;text-transform:uppercase;line-height:.95;letter-spacing:.005em;margin:0 0 .9rem;color:var(--khx-ice);text-shadow:none;background:none;-webkit-text-fill-color:currentColor}
.khx .khx-h span{display:block}
.khx .khx-h em{display:block;font-style:normal;color:var(--khx-mag)}
.khx p.khx-p{margin:0 0 1.4rem;max-width:42ch;color:var(--khx-mist);font-size:1.0625rem;line-height:1.55}
.khx a.khx-btn{display:inline-flex;align-items:center;gap:.6rem;min-height:48px;padding:15px 30px;border-radius:7px;border:0;background:var(--khx-btn);color:#fff;font:600 15px/1.2 var(--khx-body);text-decoration:none;box-shadow:0 10px 30px -12px rgba(233,30,140,.7);transition:transform .15s ease,box-shadow .15s ease}
.khx a.khx-btn:hover{transform:translateY(-1px);box-shadow:0 14px 34px -12px rgba(233,30,140,.85)}
.khx a.khx-btn:focus-visible,.khx.khx-badge:focus-visible{outline:2px solid var(--khx-teal);outline-offset:3px}
.khx .khx-ai{position:absolute;z-index:2;font:600 .72rem/1 var(--khx-mono);letter-spacing:.08em;color:var(--khx-ice);background:rgba(5,11,20,.78);border:1px solid var(--khx-line);border-radius:6px;padding:.4rem .55rem}
.khx .khx-ai b{color:var(--khx-teal);font-weight:600}
.khx .khx-slot{position:relative;overflow:hidden;background:var(--khx-c)}
.khx .khx-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;margin:0;max-width:none;border-radius:0}
.khx .khx-rule{height:3px;background:linear-gradient(90deg,var(--khx-teal),var(--khx-mag))}
/* 1. Home strip: full-bleed ink plate */
.khx.khx-strip{background:var(--khx-ink);padding:0;margin:0;border-top:1px solid var(--khx-line);border-bottom:1px solid var(--khx-line)}
.khx-strip .khx-in{max-width:1280px;margin:0 auto;position:relative}
.khx-strip .khx-slot{aspect-ratio:4/5}
.khx-strip .khx-slot::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,11,20,0) 55%,var(--khx-ink) 100%)}
.khx-strip .khx-ai{right:1rem;top:1rem}
.khx-strip .khx-copy{position:relative;z-index:1;margin:-4.5rem 1rem 0;padding:1.6rem 1.4rem 1.8rem;background:var(--khx-navy);border:1px solid var(--khx-line);border-radius:7px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.khx-strip .khx-copy::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;border-radius:7px 7px 0 0;background:linear-gradient(90deg,var(--khx-teal),var(--khx-mag))}
.khx-strip .khx-h{font-size:clamp(2.1rem,9vw,3.6rem)}
.khx-strip .khx-foot{height:2rem}
@media (min-width:900px){
 .khx-strip .khx-slot{aspect-ratio:21/9}
 .khx-strip .khx-slot::after{background:linear-gradient(90deg,rgba(5,11,20,.94) 0%,rgba(5,11,20,.72) 34%,rgba(5,11,20,0) 62%),linear-gradient(0deg,rgba(5,11,20,.5),rgba(5,11,20,0) 30%)}
 .khx-strip .khx-copy{position:absolute;left:clamp(1.5rem,4vw,3.5rem);top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;margin:0;max-width:30rem;padding:1.5rem 0;background:none;border:0;box-shadow:none}
 .khx-strip img.khx-logo{width:200px}
 .khx-strip .khx-copy::before{display:none}
 .khx-strip .khx-h{font-size:clamp(2rem,3.5vw,3.3rem)}
 .khx-strip p.khx-p{font-size:1rem}
 .khx-strip .khx-ai{right:1.25rem;top:auto;bottom:1.25rem}
 .khx-strip .khx-foot{display:none}
}
/* 2. Services / how-we-charge plate */
.khx.khx-cardband{background:var(--khx-ink);padding:clamp(2.5rem,6vw,4.5rem) 0;margin:0}
.khx-card{max-width:1120px;margin:0 auto;padding:0 1.25rem}
.khx-card .khx-box{position:relative;display:grid;background:var(--khx-navy);border:1px solid var(--khx-line);border-radius:7px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(0,0,0,.85)}
.khx-card .khx-box::before{content:"";position:absolute;z-index:3;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--khx-teal),var(--khx-mag))}
.khx-card .khx-slot{aspect-ratio:4/3}
.khx-card .khx-ai{left:1rem;bottom:1rem}
.khx-card .khx-copy{padding:1.75rem 1.4rem 2rem}
.khx-card .khx-h{font-size:clamp(2.2rem,8vw,3.4rem)}
@media (min-width:900px){.khx-card .khx-box{grid-template-columns:1.05fr 1fr;align-items:stretch}.khx-card .khx-slot{aspect-ratio:auto;min-height:100%}.khx-card .khx-copy{padding:3rem 3rem 3.2rem;align-self:center}}
/* 3. Footer badge (all 169 pages) */
.khx.khx-badge{position:relative;display:flex;align-items:center;gap:1rem;width:100%;max-width:44rem;margin:0 0 1.75rem;padding:.85rem 1.1rem .85rem .85rem;background:linear-gradient(100deg,var(--khx-navy) 0%,var(--khx-navy2) 100%);border:1px solid var(--khx-line);border-radius:7px;color:var(--khx-ice);text-decoration:none;overflow:hidden}
.khx.khx-badge::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--khx-teal),var(--khx-mag))}
.khx-badge .khx-slot{flex:0 0 64px;width:64px;height:64px;border-radius:7px;border:1px solid var(--khx-line)}
.khx-badge .khx-t{display:flex;flex-direction:column;gap:.3rem;min-width:0;flex:1}
.khx-badge .khx-t .khx-x{margin:0;padding:0;border:0;background:none;font-size:.62rem;letter-spacing:.1em}
.khx-badge .khx-t strong{font:900 1.25rem/1.02 var(--khx-disp);text-transform:uppercase;color:var(--khx-ice);letter-spacing:.01em}
.khx-badge .khx-t strong em{font-style:normal;color:var(--khx-mag)}
.khx-badge .khx-go{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:7px;background:var(--khx-btn);color:#fff}
.khx-badge:hover{border-color:rgba(0,180,166,.55)}
@media (min-width:700px){.khx-badge .khx-t strong{font-size:1.6rem}}
@media (prefers-reduced-motion:reduce){.khx a.khx-btn{transition:none}.khx a.khx-btn:hover{transform:none}}
/* v6 fix 24 Oct: phone only. Keep Buddy's face clear of the Kindra AI fixed menu (header.nav, 76px tall at 360-414). */
@media (max-width:899px){.khx.khx-strip{padding-top:92px}.khx-strip .khx-slot{border-radius:7px 7px 0 0;margin:0 .75rem}.khx-strip .khx-slot img{object-position:50% 20%}}
/* v7 24 Oct (Buddy ok): desktop offset. Kindra AI fixed menu bottom measured at 76.6px at 1280; 92px keeps label and Buddy's head clear. */
@media (min-width:900px){.khx.khx-strip{padding-top:92px}}
