/* kaikei.css ― 会計SaaS 紹介LP（落ち着いた正確性トーン・赤×白）。素CSS。namespace: body.ka / .kl- */
:root{
  --kl-bg:#ffffff; --kl-bg2:#f5f7fa; --kl-ink:#1f2933; --kl-sub:#566372; --kl-mute:#8a98a6;
  --kl-line:#e3e8ee; --kl-line2:#d3dae2; --kl-red:#bc002d; --kl-red-d:#8f0022; --kl-red-soft:#fbe4e9;
  --kl-blue:#2563a8; --kl-green:#1f7a4d;
  --kl-fd:"Zen Kaku Gothic New","Noto Sans JP",sans-serif; --kl-en:"Archivo","Helvetica Neue",sans-serif;
  --kl-maxw:1140px;
}
html[data-theme="dark"]{--kl-bg:#10151b;--kl-bg2:#161d25;--kl-ink:#e7edf3;--kl-sub:#9fb0c0;--kl-mute:#74839a;--kl-line:#26303c;--kl-line2:#2c3744;--kl-red:#e23a5e;--kl-red-soft:#241218}
*,*::before,*::after{box-sizing:border-box}
.ka{margin:0;background:var(--kl-bg);color:var(--kl-ink);font-family:var(--kl-fd);line-height:1.85;-webkit-font-smoothing:antialiased;font-feature-settings:"palt"}
.ka a{color:inherit;text-decoration:none} .ka h1,.ka h2,.ka h3{margin:0;line-height:1.4;font-weight:700;letter-spacing:.01em}
.kl-wrap{max-width:var(--kl-maxw);margin-inline:auto;padding-inline:clamp(1.2rem,4vw,2.2rem)}
.kl-en{font-family:var(--kl-en)} .kl-tnum{font-family:var(--kl-en);font-variant-numeric:tabular-nums}
.kl-eyebrow{font-family:var(--kl-en);font-weight:700;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--kl-red)}
/* topbar */
.kl-topbar{background:#141a21;color:#c4cedb} .kl-topbar__in{display:flex;justify-content:space-between;align-items:center;gap:.8rem;padding:.42rem 0;font-size:.78rem}
.kl-topbar__ctx{font-family:var(--kl-en);color:#8a98a6} .kl-topbar__back{color:#e7edf3;font-weight:700}
@media(max-width:560px){.kl-topbar__ctx{display:none}}
/* header */
.kl-header{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--kl-bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--kl-line)}
.kl-header__in{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 0}
.kl-logo{display:flex;align-items:center;gap:.55rem;font-weight:800;font-size:1.2rem}
.kl-logo__m{width:30px;height:30px;border-radius:8px;background:var(--kl-red);color:#fff;display:grid;place-items:center;font-family:var(--kl-en);font-weight:700}
.kl-logo small{display:block;font-family:var(--kl-en);font-size:.54rem;letter-spacing:.22em;color:var(--kl-mute);font-weight:700}
.kl-nav{display:flex;align-items:center;gap:1.2rem} .kl-nav a{font-size:.86rem;color:var(--kl-sub)} .kl-nav a:hover{color:var(--kl-red)}
.kl-btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--kl-fd);font-weight:700;font-size:.92rem;padding:.7em 1.4em;border-radius:8px;border:1px solid var(--kl-red);background:var(--kl-red);color:#fff;cursor:pointer;transition:.2s}
.kl-btn:hover{background:var(--kl-red-d);border-color:var(--kl-red-d)}
.kl-btn--ghost{background:transparent;color:var(--kl-ink);border-color:var(--kl-line2)} .kl-btn--ghost:hover{background:var(--kl-bg2);color:var(--kl-ink)}
.kl-link{font-family:var(--kl-en);font-weight:600;font-size:.82rem;border-bottom:1px solid currentColor;padding-bottom:2px}
/* hero */
.kl-hero{background:linear-gradient(180deg,var(--kl-bg),var(--kl-bg2));border-bottom:1px solid var(--kl-line);padding:clamp(3rem,7vw,5.5rem) 0}
.kl-hero h1{font-size:clamp(1.9rem,4.6vw,3.2rem);letter-spacing:.01em}
.kl-hero h1 em{font-style:normal;color:var(--kl-red)}
.kl-hero__sub{color:var(--kl-sub);max-width:38em;margin:1rem 0 0;font-size:clamp(1rem,1.6vw,1.12rem)}
.kl-hero__cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.kl-micro{margin-top:1rem;font-size:.78rem;color:var(--kl-mute);display:flex;gap:1.2rem;flex-wrap:wrap}
.kl-micro span{display:inline-flex;align-items:center;gap:.4em}
.kl-micro span::before{content:"✓";color:var(--kl-green);font-weight:700}
/* sections */
.kl-sec{padding:clamp(2.6rem,6vw,4.4rem) 0} .kl-sec--alt{background:var(--kl-bg2)}
.kl-h2{font-size:clamp(1.5rem,3vw,2.1rem);margin-bottom:.4rem} .kl-lead{color:var(--kl-sub);max-width:42em}
.kl-head{margin-bottom:1.8rem}
/* pains */
.kl-pains{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem} @media(max-width:880px){.kl-pains{grid-template-columns:1fr 1fr}}@media(max-width:520px){.kl-pains{grid-template-columns:1fr}}
.kl-pain{background:var(--kl-bg);border:1px solid var(--kl-line);border-radius:12px;padding:1.3rem}
.kl-pain__n{font-family:var(--kl-en);color:var(--kl-red);font-weight:700;font-size:.8rem} .kl-pain h3{font-size:1.04rem;margin:.5rem 0} .kl-pain p{color:var(--kl-sub);font-size:.86rem;margin:0}
/* feature table */
.kl-feat{width:100%;border-collapse:collapse;background:var(--kl-bg);border:1px solid var(--kl-line);border-radius:12px;overflow:hidden}
.kl-feat td{padding:1rem 1.1rem;border-bottom:1px solid var(--kl-line);vertical-align:top}
.kl-feat tr:last-child td{border-bottom:0}
.kl-feat__n{width:3rem;font-family:var(--kl-en);color:var(--kl-red);font-weight:700}
.kl-feat__t{font-weight:700;width:30%} .kl-feat__d{color:var(--kl-sub);font-size:.88rem}
/* demo cards */
.kl-demos{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}@media(max-width:820px){.kl-demos{grid-template-columns:1fr}}
.kl-demo{border:1px solid var(--kl-line);border-radius:14px;padding:1.4rem;background:var(--kl-bg);display:flex;flex-direction:column;gap:.5rem}
.kl-demo__role{font-family:var(--kl-en);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--kl-red);font-weight:700}
.kl-demo h3{font-size:1.1rem} .kl-demo p{color:var(--kl-sub);font-size:.85rem;margin:0;flex:1}
.kl-demo__acc{font-family:var(--kl-en);font-size:.82rem;background:var(--kl-bg2);border:1px solid var(--kl-line);border-radius:7px;padding:.5em .7em;color:var(--kl-ink)}
/* trust */
.kl-trust{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}@media(max-width:820px){.kl-trust{grid-template-columns:1fr}}
.kl-trust__c{border-left:3px solid var(--kl-red);background:var(--kl-bg);padding:1rem 1.2rem;border-radius:0 10px 10px 0}
.kl-trust__c h3{font-size:1rem;margin-bottom:.3rem} .kl-trust__c p{color:var(--kl-sub);font-size:.85rem;margin:0}
.kl-honest{background:var(--kl-red-soft);border:1px solid #f3c2cd;border-radius:12px;padding:1.2rem 1.4rem;margin-top:1.4rem;font-size:.88rem;color:var(--kl-red-d)}
html[data-theme="dark"] .kl-honest{border-color:#4a2230;color:#f0a8b8}
/* price */
.kl-price{border:1px solid var(--kl-line2);border-radius:14px;padding:clamp(1.4rem,3vw,2rem);max-width:760px;background:var(--kl-bg)}
.kl-price__amt{font-size:1.7rem;font-weight:800} .kl-price__amt em{font-style:normal;color:var(--kl-red)}
.kl-price ul{margin:.8rem 0 0;padding-left:1.2rem;color:var(--kl-sub);font-size:.88rem}
/* footer */
.kl-footer{background:#141a21;color:#9fb0c0;padding:2.6rem 0 1.6rem}
.kl-footer a{color:#e7edf3} .kl-footer__cols{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:1.6rem;margin-bottom:1.4rem}@media(max-width:700px){.kl-footer__cols{grid-template-columns:1fr}}
.kl-footer small{color:#74839a;font-family:var(--kl-en)}
.kl-note{font-size:.8rem;color:var(--kl-mute);line-height:1.7}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{transition-duration:.001ms!important}}
