/* ==========================================================================
   Kodiak Skins — base.css
   Structural styles for the markup contract (see CONTRACT.md).
   This file never contains a colour, font name or radius literal:
   every visual decision comes from a skin's tokens. Swap the skin, not this file.
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--c-bg);color:var(--c-text);font-family:var(--f-body);font-size:var(--fs-body,1rem);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--c-link)}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:var(--fw-display);text-transform:var(--tt-display);letter-spacing:var(--ls-display);line-height:var(--lh-display);margin:0;text-wrap:balance}
h1{font-size:clamp(2.2rem,5.4vw,var(--fs-h1,3.75rem))}
h2{font-size:clamp(1.7rem,3.6vw,var(--fs-h2,2.6rem))}
h3{font-size:1.2rem;letter-spacing:0;line-height:1.25}
p{margin:0}
:focus-visible{outline:3px solid var(--c-accent);outline-offset:2px}
.k-skip{position:absolute;left:-999px}.k-skip:focus{left:16px;top:16px;z-index:99;background:var(--c-brand);color:var(--c-brand-ink);padding:10px 14px}

.k-wrap{width:100%;max-width:var(--wrap,1160px);margin-inline:auto;padding-inline:var(--gutter,24px)}

/* buttons */
.k-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:44px;padding:.8em 1.4em;border-radius:var(--r-btn);font-family:var(--f-body);font-weight:700;font-size:.95rem;text-transform:var(--tt-btn);letter-spacing:var(--ls-btn,0);text-decoration:none;border:var(--bw,1.5px) solid transparent;cursor:pointer;transition:transform .15s,background-color .15s,border-color .15s}
.k-btn--primary{background:var(--c-brand);color:var(--c-brand-ink)}
.k-btn--primary:hover{background:var(--c-brand-hover);transform:translateY(-1px)}
.k-btn--ghost{background:transparent;color:inherit;border-color:currentColor}
.k-btn--ghost:hover{background:color-mix(in srgb,currentColor 10%,transparent)}
.k-section[data-tone="dark"] .k-btn--primary,.k-cta .k-btn--primary{background:var(--btn-dark-bg);color:var(--btn-dark-ink)}
.k-hero .k-btn--primary,.k-header .k-btn--primary{background:var(--btn-hero-bg);color:var(--btn-hero-ink)}
.k-hero .k-form .k-btn--primary{background:var(--c-brand);color:var(--c-brand-ink)}
.k-actions{display:flex;flex-wrap:wrap;gap:12px}

/* header */
.k-header{position:sticky;top:0;z-index:50;background:var(--hdr-bg);color:var(--hdr-text);border-bottom:1px solid var(--hdr-line)}
.k-header .k-wrap{display:flex;align-items:center;gap:24px;min-height:68px}
.k-logo{font-family:var(--f-display);font-weight:var(--fw-display);text-transform:var(--tt-display);font-size:1.25rem;color:inherit;text-decoration:none;margin-right:auto}
.k-logo img{height:40px;width:auto}
.k-nav{display:flex;gap:22px;align-items:center}
.k-nav a{color:inherit;text-decoration:none;font-size:.93rem;font-weight:500;opacity:.86}
.k-nav a:hover,.k-nav a[aria-current="page"]{opacity:1}
.k-phone{font-weight:700;color:inherit;text-decoration:none;white-space:nowrap}
@media(max-width:860px){.k-nav{display:none}.k-header .k-btn{padding:.6em 1em}}

/* sections + tones */
.k-section{padding-block:var(--sec-y,88px);background:var(--c-bg);color:var(--c-text)}
.k-section[data-tone="alt"]{background:var(--c-surface-2)}
.k-section[data-tone="dark"]{background:var(--c-dark);color:var(--c-on-dark);--c-muted:var(--c-on-dark-muted);--c-line:var(--c-on-dark-line);--c-surface:var(--c-dark-surface);--c-link:var(--c-on-dark)}
.k-section[data-tone="brand"]{background:var(--c-brand);color:var(--c-brand-ink);--c-muted:var(--c-brand-ink);--c-line:color-mix(in srgb,var(--c-brand-ink) 25%,transparent);--c-surface:color-mix(in srgb,var(--c-brand-ink) 8%,transparent);--c-link:var(--c-brand-ink)}
.k-section[data-tone="brand"] .k-btn--primary{background:var(--c-brand-ink);color:var(--c-brand)}
@media(max-width:700px){.k-section{padding-block:calc(var(--sec-y,88px) * .68)}}
.k-head{max-width:760px;margin-bottom:44px;display:grid;gap:12px}
.k-head--center{margin-inline:auto;text-align:center}
.k-eyebrow{font-family:var(--f-mono,var(--f-body));font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-accent-text)}
.k-section[data-tone="dark"] .k-eyebrow,.k-hero .k-eyebrow{color:var(--c-accent-on-dark)}
.k-section[data-tone="brand"] .k-eyebrow{color:inherit}
.k-lead{font-size:1.12rem;color:var(--c-muted);max-width:62ch}

/* hero */
.k-hero{background:var(--hero-bg);color:var(--hero-text);padding-block:clamp(56px,8vw,104px);position:relative;overflow:hidden}
.k-hero .k-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
/* Beside a form the copy starts level with the top of the form. Centring it left the headline floating
   well below the form's top edge once the form grew taller than the copy. */
.k-hero .k-wrap:has(> .k-form){align-items:start}
.k-hero--solo .k-wrap{grid-template-columns:1fr;max-width:860px}
.k-hero__copy{display:grid;gap:20px;justify-items:start}
.k-hero .k-lead{color:var(--hero-muted)}
.k-hero h1 em,.k-head h2 em{font-style:normal;color:var(--c-hl-on-hero)}
.k-head h2 em{color:var(--c-hl)}
.k-section[data-tone="dark"] .k-head h2 em{color:var(--c-hl-on-dark)}
.k-section[data-tone="brand"] .k-head h2 em{color:inherit;text-decoration:underline}
.k-hero__media{border-radius:var(--r-card);overflow:hidden;border:1px solid var(--hero-line)}
.k-ticks{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.k-ticks li{padding-left:1.7em;position:relative}
.k-ticks li::before{content:"";position:absolute;left:0;top:.45em;width:.9em;height:.5em;border-left:3px solid var(--c-accent-on-hero);border-bottom:3px solid var(--c-accent-on-hero);transform:rotate(-45deg)}
.k-section .k-ticks li::before{border-color:var(--c-accent-text)}
.k-section[data-tone="dark"] .k-ticks li::before{border-color:var(--c-accent-on-dark)}
@media(max-width:860px){.k-hero .k-wrap{grid-template-columns:1fr}}
.k-crumbs{font-size:.82rem;opacity:.8;display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.k-crumbs li+li::before{content:"/";margin-right:6px;opacity:.5}
.k-crumbs a{color:inherit}

/* grids + cards */
.k-grid{display:grid;gap:20px;grid-template-columns:repeat(3,minmax(0,1fr))}
.k-grid[data-cols="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.k-grid[data-cols="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:980px){.k-grid,.k-grid[data-cols="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.k-grid,.k-grid[data-cols="2"],.k-grid[data-cols="4"]{grid-template-columns:1fr}}
.k-card{background:var(--c-surface);border:var(--bw,1px) solid var(--c-line);border-radius:var(--r-card);padding:26px;display:grid;gap:10px;align-content:start;box-shadow:var(--shadow-card,none)}
.k-card p{color:var(--c-muted)}
.k-card__icon{width:44px;height:44px;border-radius:var(--r-icon,var(--r-card));background:var(--c-icon-bg);color:var(--c-accent-text);display:grid;place-items:center}
.k-card a{font-weight:700}
.k-split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
@media(max-width:860px){.k-split{grid-template-columns:1fr}}

/* steps */
.k-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;counter-reset:k;list-style:none;margin:0;padding:0}
.k-step{counter-increment:k;border-top:3px solid var(--c-accent-text);padding-top:16px;display:grid;gap:8px;align-content:start}
.k-section[data-tone="dark"] .k-step{border-color:var(--c-accent-on-dark)}
.k-step::before{content:counter(k,decimal-leading-zero);font-family:var(--f-mono,var(--f-display));font-weight:700;color:var(--c-muted);font-size:.85rem}
.k-step p{color:var(--c-muted)}
@media(max-width:980px){.k-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.k-steps{grid-template-columns:1fr}}

/* stats */
.k-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin:0;padding:0;list-style:none}
.k-stat strong{display:block;font-family:var(--f-display);font-weight:var(--fw-display);font-size:clamp(1.9rem,4vw,2.8rem);line-height:1;font-variant-numeric:tabular-nums}
.k-stat span{color:var(--c-muted);font-size:.9rem}
@media(max-width:700px){.k-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* reviews */
.k-review{background:var(--c-surface);border:var(--bw,1px) solid var(--c-line);border-radius:var(--r-card);padding:26px;margin:0;display:grid;gap:14px;align-content:start}
.k-review blockquote{margin:0}
.k-review figcaption{font-size:.88rem;color:var(--c-muted)}
.k-stars{color:var(--c-star,#E8A317);letter-spacing:2px}

/* faq */
.k-faq{display:grid;gap:10px;max-width:820px}
.k-faq details{background:var(--c-surface);border:var(--bw,1px) solid var(--c-line);border-radius:var(--r-card);padding:0 22px}
.k-faq summary{cursor:pointer;font-weight:700;padding:18px 0;list-style:none;display:flex;justify-content:space-between;gap:16px}
.k-faq summary::-webkit-details-marker{display:none}
.k-faq summary::after{content:"+";font-family:var(--f-mono,inherit);color:var(--c-accent-text)}
.k-faq details[open] summary::after{content:"–"}
.k-faq details>*:not(summary){padding-bottom:18px;color:var(--c-muted)}

/* chips */
.k-chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0}
.k-chip{display:inline-block;padding:.5em 1em;border:var(--bw,1px) solid var(--c-line);border-radius:var(--r-btn);text-decoration:none;color:inherit;font-size:.92rem;background:var(--c-surface)}
.k-chip:hover{border-color:var(--c-accent-text)}

/* forms */
.k-form{background:var(--c-surface);color:var(--c-text);border:var(--bw,1px) solid var(--c-line);border-radius:var(--r-card);padding:26px;display:grid;gap:14px}
.k-hero .k-form{--c-surface:var(--form-bg);--c-text:var(--form-text);--c-line:var(--form-line);--c-muted:var(--form-muted)}
.k-form label{display:grid;gap:6px;font-size:.88rem;font-weight:600}
.k-form input,.k-form select,.k-form textarea{font:inherit;font-weight:400;padding:.7em .85em;min-height:44px;border:1.5px solid var(--c-line);border-radius:var(--r-input,var(--r-btn));background:var(--c-field,transparent);color:inherit;width:100%}
.k-form .k-btn{width:100%}
.k-form small{color:var(--c-muted)}

/* prose + tables */
.k-prose{max-width:70ch;display:grid;gap:1.1em}
.k-prose h2{font-size:clamp(1.5rem,3vw,2rem);margin-top:.8em}
.k-prose h3{margin-top:.5em}
.k-prose ul,.k-prose ol{margin:0;padding-left:1.3em;display:grid;gap:.4em}
.k-table{overflow-x:auto}
.k-table table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
.k-table th{text-align:left;border-bottom:2px solid var(--c-text);padding:10px 12px;font-size:.88rem}
.k-table td{border-bottom:1px solid var(--c-line);padding:12px}

/* closing cta */
.k-cta{background:var(--c-dark);color:var(--c-on-dark);padding-block:var(--sec-y,88px)}
.k-cta .k-wrap{display:grid;gap:18px;justify-items:start}
.k-cta h2{max-width:20ch}
.k-cta .k-lead{color:var(--c-on-dark-muted)}
.k-cta h2 em{font-style:normal;color:var(--c-hl-on-dark)}
.k-cta small{color:var(--c-on-dark-muted)}

/* footer */
.k-footer{background:var(--ftr-bg);color:var(--ftr-text);padding-block:56px 32px;font-size:.92rem}
.k-footer .k-wrap{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
.k-footer a{color:inherit;text-decoration:none;opacity:.85}.k-footer a:hover{opacity:1;text-decoration:underline}
.k-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.k-footer h3{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px;font-family:var(--f-body);font-weight:700}
.k-footer__legal{grid-column:1/-1;border-top:1px solid var(--ftr-line);padding-top:20px;opacity:.75;display:flex;flex-wrap:wrap;gap:8px 20px}
@media(max-width:860px){.k-footer .k-wrap{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.k-footer .k-wrap{grid-template-columns:1fr}}

/* sticky mobile call bar */
.k-callbar{display:none}
@media(max-width:700px){.k-callbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;inset:auto 0 0 0;z-index:60;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));background:var(--hdr-bg);border-top:1px solid var(--hdr-line)}body:has(.k-callbar){padding-bottom:72px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ==========================================================================
   Engine additions. Same rule as above: tokens only, no colour or font literals.
   ========================================================================== */
.k-split>.k-head{margin-bottom:0}
.k-stack{display:grid;gap:16px;align-content:start}
.k-ticks--cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 36px;max-width:920px}
@media(max-width:700px){.k-ticks--cols{grid-template-columns:1fr}}
.k-figure{margin:0;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--c-line)}
.k-figure img{width:100%}
.k-figure figcaption,.k-hero__media figcaption{font-size:.78rem;color:var(--c-muted);padding:8px 12px;background:var(--c-surface)}
.k-hero__media figcaption{color:var(--hero-muted);background:transparent}
.k-meta{font-size:.85rem;color:var(--c-muted);font-family:var(--f-mono,var(--f-body))}
.k-hero .k-meta{color:var(--hero-muted)}
.k-more{margin-top:28px;font-weight:700}
.k-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.k-form__title{font-family:var(--f-display);font-weight:var(--fw-display);text-transform:var(--tt-display);letter-spacing:var(--ls-display);font-size:1.3rem;line-height:1.2}
.k-form textarea{min-height:96px;resize:vertical}
.k-form select{appearance:auto}
.k-menu{display:none;position:relative}
.k-menu summary{list-style:none;cursor:pointer;font-weight:700;min-height:44px;display:flex;align-items:center;padding-inline:4px}
.k-menu summary::-webkit-details-marker{display:none}
.k-menu nav{position:absolute;right:0;top:calc(100% + 8px);min-width:230px;display:grid;gap:2px;padding:10px;background:var(--hdr-bg);color:var(--hdr-text);border:1px solid var(--hdr-line);border-radius:var(--r-card);box-shadow:0 12px 32px color-mix(in srgb,var(--c-dark) 30%,transparent)}
.k-menu nav a{color:inherit;text-decoration:none;font-weight:600;padding:10px 12px;min-height:44px;display:flex;align-items:center;border-radius:var(--r-btn)}
.k-menu nav a:hover{background:color-mix(in srgb,currentColor 10%,transparent)}
@media(max-width:860px){.k-menu{display:block}.k-phone{display:none}.k-header .k-wrap{gap:12px}.k-logo{font-size:1.05rem}}
.k-prose{font-size:1.05rem}
.k-prose a{font-weight:600}
.k-prose blockquote{margin:0;padding-left:1em;border-left:3px solid var(--c-accent-text);color:var(--c-muted)}
.k-prose table{border-collapse:collapse;width:100%;font-size:.95rem}
.k-prose th{text-align:left;border-bottom:2px solid var(--c-text);padding:8px 10px}
.k-prose td{border-bottom:1px solid var(--c-line);padding:10px}
.k-prose+.k-table{margin-top:28px;max-width:820px}
.k-table+small,.k-prose+small{display:block;margin-top:14px;color:var(--c-muted);max-width:70ch}
.k-card ul{margin:0;padding-left:1.2em;color:var(--c-muted);display:grid;gap:4px}
.k-card h4{font-family:var(--f-body);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;margin-top:6px}
.k-footer p{opacity:.85;margin-top:12px;max-width:38ch}
.k-card h2{font-size:1.2rem;letter-spacing:0;line-height:1.25}
.k-header .k-btn{white-space:nowrap}
