/*
Theme Name: AIカイゼンナビ LP
Theme URI: https://example.com/
Author: Design Team
Description: 中小企業向けAI導入支援の問い合わせ獲得LP用テーマ。ACFで全文編集可能、独自フォーム送信（DB蓄積＋メール通知＋CSV）対応。スマホファースト・構造化データ対応。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: akn
*/

/* ============ Tokens ============ */
:root{
  --accent:#0ea5e9;
  --accent-deep:#0369a1;
  --accent-soft:#e0f2fe;
  --ink:#0f172a;
  --muted:#475569;
  --muted-2:#64748b;
  --line:#e2e8f0;
  --bg:#ffffff;
  --bg-alt:#f5f9fc;
  --slate-50:#f8fafc;
  --slate-100:#f1f5f9;
  --slate-200:#e2e8f0;
  --rose:#f43f5e;
  --radius:16px;
  --maxw:1120px;
  --font-jp:'Noto Sans JP',sans-serif;
}

/* ============ Base ============ */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{margin:0;font-family:var(--font-jp);color:var(--ink);background:var(--bg);line-height:1.7;-webkit-font-smoothing:antialiased;font-size:16px;}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
ul,ol{margin:0;padding:0;list-style:none;}
h1,h2,h3,p{margin:0;}
::selection{background:var(--accent-soft);color:var(--accent-deep);}
.sp{display:none;}
@media(max-width:640px){.sp{display:block;}}

.container{max-width:var(--maxw);margin:0 auto;padding:0 20px;}
.container--narrow{max-width:860px;}

.akn-ic{width:24px;height:24px;}
.akn-ic-lg{width:32px;height:32px;}
.akn-ic-sm{width:18px;height:18px;}
.akn-ic-xs{width:14px;height:14px;}

.t-accent{color:var(--accent-deep);}
.t-mark{background-image:linear-gradient(transparent 62%,var(--accent-soft) 62%);padding:0 .1em;}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;border-radius:12px;
  transition:all .2s ease;white-space:nowrap;cursor:pointer;border:1px solid transparent;font-family:inherit;line-height:1.2;}
.btn-sm{padding:10px 18px;font-size:14px;}
.btn-lg{padding:16px 30px;font-size:16px;}
.btn:not(.btn-sm):not(.btn-lg){padding:12px 24px;font-size:15px;}
.btn-primary{background:var(--accent);color:#fff;box-shadow:0 10px 22px -8px rgba(14,165,233,.5);}
.btn-primary:hover{background:var(--accent-deep);transform:translateY(-2px);}
.btn-secondary{background:#fff;color:var(--ink);border-color:var(--line);}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent-deep);}
.btn-block{width:100%;}

/* ============ Sections ============ */
.section{padding:80px 0;}
@media(min-width:1024px){.section{padding:112px 0;}}
.section--white{background:#fff;}
.section--alt{background:var(--bg-alt);}
.section-head{margin-bottom:40px;}
.section-head.center{text-align:center;max-width:680px;margin-left:auto;margin-right:auto;}
.section-label{display:inline-flex;align-items:center;gap:8px;color:var(--accent-deep);font-weight:700;font-size:14px;letter-spacing:.04em;margin-bottom:14px;}
.label-line{width:24px;height:1px;background:var(--accent);}
.section-title{font-weight:900;font-size:28px;line-height:1.3;letter-spacing:-.01em;}
@media(min-width:640px){.section-title{font-size:36px;}}
.section-lead{margin-top:16px;color:var(--muted);font-size:15px;}
@media(min-width:640px){.section-lead{font-size:16px;}}

/* ============ Header ============ */
.site-header{position:fixed;top:0;left:0;right:0;z-index:40;transition:all .3s ease;}
.site-header.is-scrolled{background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--slate-100);box-shadow:0 1px 3px rgba(15,23,42,.06);}
.header-inner{height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.brand{display:flex;align-items:center;gap:10px;}
.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--accent);color:#fff;}
.brand-name{font-weight:800;font-size:17px;letter-spacing:-.01em;}
.main-nav{display:none;gap:28px;}
@media(min-width:1024px){.main-nav{display:flex;}}
.main-nav a{font-size:14px;font-weight:500;color:var(--muted);transition:color .2s;}
.main-nav a:hover{color:var(--accent-deep);}
.header-cta{display:flex;align-items:center;gap:12px;}
.header-tel{display:none;align-items:center;gap:6px;font-size:13px;font-weight:700;}
.header-tel .akn-ic-sm{color:var(--accent-deep);}
@media(min-width:768px){.header-tel{display:flex;}}

/* ============ Hero ============ */
.hero{position:relative;overflow:hidden;padding:112px 0 64px;
  background:radial-gradient(60% 50% at 80% 0%,var(--accent-soft) 0%,transparent 60%),radial-gradient(50% 40% at 0% 10%,#f1f5f9 0%,transparent 55%),#fff;}
@media(min-width:1024px){.hero{padding:144px 0 96px;}}
.hero-grid-bg{position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(15,23,42,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.03) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 0%,#000 0%,transparent 75%);
  mask-image:radial-gradient(70% 60% at 50% 0%,#000 0%,transparent 75%);}
.hero-split{position:relative;display:grid;gap:48px;align-items:center;}
@media(min-width:1024px){.hero-split{grid-template-columns:1fr 1fr;gap:40px;}}
.hero-centered{position:relative;max-width:760px;text-align:center;}
.hero-copy.align-center{display:flex;flex-direction:column;align-items:center;}

.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;background:var(--accent-soft);color:var(--accent-deep);
  padding:6px 16px;border-radius:999px;font-size:13px;font-weight:700;margin-bottom:24px;}
.hero-title{font-weight:900;line-height:1.25;letter-spacing:-.01em;font-size:34px;}
@media(min-width:640px){.hero-title{font-size:44px;}}
@media(min-width:1024px){.hero-title{font-size:52px;}}
.hero-title-2{display:block;margin-top:8px;}
.hero-sub{margin-top:24px;color:var(--muted);font-size:15px;max-width:560px;}
@media(min-width:640px){.hero-sub{font-size:17px;}}
.hero-centered .hero-sub,.hero-copy.align-center .hero-sub{margin-left:auto;margin-right:auto;}
.hero-actions{margin-top:32px;display:flex;flex-direction:column;gap:12px;}
@media(min-width:640px){.hero-actions{flex-direction:row;}}
.hero-copy.align-center .hero-actions{justify-content:center;}
.hero-badges{margin-top:32px;display:flex;flex-wrap:wrap;gap:8px 20px;}
.hero-copy.align-center .hero-badges{justify-content:center;}
.hero-badges li{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#334155;}
.badge-check{display:grid;place-items:center;width:20px;height:20px;border-radius:999px;background:var(--accent-soft);color:var(--accent-deep);}

.hero-visual-wrap{position:relative;}
.hero-centered + .hero-visual-wrap{max-width:980px;margin:48px auto 0;}
.hero-image img,.hero-ph{border-radius:18px;box-shadow:0 30px 60px -20px rgba(15,23,42,.25);}
.hero--split .hero-ph{aspect-ratio:4/3;}
.hero--centered .hero-ph{aspect-ratio:16/9;}

.ph-slot{background-color:#eef2f7;background-image:repeating-linear-gradient(135deg,#fff 0 12px,#e6edf5 12px 24px);
  border:1px dashed #c2cedb;display:grid;place-items:center;border-radius:18px;}
.ph-label{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:#64748b;background:rgba(255,255,255,.85);
  padding:6px 12px;border-radius:8px;border:1px solid #d6deea;text-align:center;}

.float-stat{position:absolute;background:#fff;border-radius:16px;border:1px solid var(--slate-100);
  box-shadow:0 18px 36px -14px rgba(15,23,42,.22);padding:12px 16px;display:flex;align-items:center;gap:12px;}
.float-stat .fs-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--accent-soft);color:var(--accent-deep);}
.float-stat strong{display:block;font-weight:900;font-size:18px;line-height:1;}
.float-stat small{display:block;font-size:11px;color:var(--muted-2);margin-top:4px;}
.float-stat--a{left:-12px;bottom:32px;}
.float-stat--b{right:-8px;top:-16px;}
.hero--centered .float-stat--a{left:-16px;top:33%;bottom:auto;}
.hero--centered .float-stat--b{right:-16px;bottom:40px;top:auto;}
@media(max-width:640px){.float-stat{display:none;}}

/* ============ Worries ============ */
.worry-tabs{margin-top:40px;display:flex;flex-direction:column;gap:12px;}
.worry-tab-row{display:flex;align-items:flex-start;gap:12px;}
.worry-group-label{flex:none;width:48px;font-size:11px;font-weight:700;color:#94a3b8;padding-top:10px;}
.worry-chips{display:flex;flex-wrap:wrap;gap:8px;}
.chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700;
  background:var(--slate-100);color:var(--muted);border:none;cursor:pointer;font-family:inherit;transition:all .2s;}
.chip:hover{background:var(--slate-200);}
.chip.is-active{background:var(--accent);color:#fff;box-shadow:0 8px 18px -8px rgba(14,165,233,.6);}

.worry-panels{margin-top:24px;}
.worry-panel{border:1px solid var(--slate-200);border-radius:24px;background:linear-gradient(to bottom,var(--slate-50),#fff);padding:24px;}
@media(min-width:640px){.worry-panel{padding:40px;}}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.worry-panel.is-active{animation:fadeUp .35s ease both;}
.worry-panel-head{display:flex;align-items:flex-start;gap:16px;margin-bottom:28px;}
.worry-panel-ic{flex:none;display:grid;place-items:center;width:56px;height:56px;border-radius:16px;background:var(--accent);color:#fff;}
.worry-panel-group{font-size:12px;font-weight:700;color:var(--accent-deep);}
.worry-panel-lead{margin-top:4px;font-weight:700;font-size:18px;line-height:1.5;}
@media(min-width:640px){.worry-panel-lead{font-size:20px;}}
.worry-items{display:grid;gap:12px;}
@media(min-width:640px){.worry-items{grid-template-columns:1fr 1fr;}}
.worry-items li{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--slate-200);border-radius:12px;padding:14px 16px;font-size:15px;color:#334155;font-weight:500;}
.worry-bang{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#fff1f2;color:var(--rose);font-weight:900;font-size:14px;}
.worry-cta{margin-top:28px;display:flex;flex-direction:column;gap:16px;align-items:flex-start;background:var(--accent-soft);border-radius:16px;padding:16px 20px;}
.worry-cta p{display:flex;align-items:center;gap:8px;color:var(--accent-deep);font-weight:700;font-size:15px;}
@media(min-width:640px){.worry-cta{flex-direction:row;align-items:center;justify-content:space-between;}}

/* ============ Solution ============ */
.solution-grid{display:grid;gap:40px;align-items:center;}
@media(min-width:1024px){.solution-grid{grid-template-columns:1fr 1.2fr;gap:64px;}}
.solution-intro .section-title{margin-top:2px;}
.solution-cta{margin-top:28px;}
.tool-grid{display:grid;gap:12px;}
@media(min-width:640px){.tool-grid{grid-template-columns:1fr 1fr;}}
.tool-card{background:#fff;border:1px solid var(--slate-200);border-radius:16px;padding:16px;transition:all .2s;}
.tool-card:hover{border-color:var(--accent);box-shadow:0 12px 24px -16px rgba(14,165,233,.5);}
.tool-head{display:flex;align-items:center;gap:8px;}
.tool-ic{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--accent-soft);color:var(--accent-deep);}
.tool-name{font-weight:700;font-size:15px;}
.tool-use{margin-top:8px;font-size:13px;color:var(--muted-2);line-height:1.5;}

/* ============ Before / After ============ */
.ba-rows{margin-top:40px;display:flex;flex-direction:column;gap:12px;}
.ba-legend{display:grid;grid-template-columns:1fr 48px 1fr;gap:12px;padding:0 4px;margin-bottom:2px;}
.ba-leg{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;}
.ba-leg-before{color:var(--muted-2);}
.ba-leg-after{color:var(--accent-deep);}
.dot{width:8px;height:8px;border-radius:999px;}
.dot-gray{background:#94a3b8;}
.dot-accent{background:var(--accent);}
.ba-row{display:grid;grid-template-columns:1fr 48px 1fr;gap:12px;align-items:stretch;}
.ba-cell{display:flex;align-items:center;gap:10px;border-radius:14px;padding:14px 18px;font-size:15px;line-height:1.5;}
.ba-cell.before{background:var(--slate-50);border:1px solid var(--slate-200);color:var(--muted-2);}
.ba-cell.after{background:var(--accent-soft);border:1px solid #bae6fd;color:var(--ink);font-weight:600;}
.ba-minus{flex:none;color:#94a3b8;}
.ba-strike{text-decoration:line-through;text-decoration-color:#cbd5e1;}
.ba-check{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:999px;background:var(--accent);color:#fff;}
.ba-rowarrow{display:grid;place-items:center;}
.ba-rowarrow span{display:grid;place-items:center;width:34px;height:34px;border-radius:999px;background:#fff;border:1px solid var(--slate-200);color:var(--accent);box-shadow:0 6px 14px -8px rgba(14,165,233,.5);}
@media(max-width:768px){
  .ba-legend{display:none;}
  .ba-row{grid-template-columns:1fr;gap:6px;}
  .ba-rowarrow{padding:1px 0;}
  .ba-rowarrow span{transform:rotate(90deg);width:28px;height:28px;}
}

/* ============ Flow ============ */
.flow-grid{margin-top:48px;display:grid;gap:20px;}
@media(min-width:768px){.flow-grid{grid-template-columns:repeat(4,1fr);gap:16px;}}
.flow-card{position:relative;background:#fff;border:1px solid var(--slate-200);border-radius:16px;padding:24px;}
.flow-no-row{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.flow-no{font-weight:900;color:var(--accent);font-size:30px;line-height:1;letter-spacing:-.02em;}
.flow-arrow{display:none;position:absolute;right:-12px;top:50%;transform:translateY(-50%);z-index:2;color:var(--accent);}
@media(min-width:768px){.flow-arrow{display:block;}}
.flow-title{font-weight:700;font-size:16px;line-height:1.5;}
.flow-desc{margin-top:8px;font-size:13px;color:var(--muted-2);}

/* ============ FAQ ============ */
.faq-list{display:flex;flex-direction:column;gap:12px;}
.faq-item{border:1px solid var(--slate-200);border-radius:16px;background:#fff;overflow:hidden;transition:border-color .2s;}
.faq-item[open]{border-color:var(--accent);background:rgba(240,249,255,.4);}
.faq-q{list-style:none;display:flex;align-items:center;gap:16px;padding:20px 24px;cursor:pointer;}
.faq-q::-webkit-details-marker{display:none;}
.faq-q-mark{flex:none;font-weight:900;color:var(--accent-deep);font-size:18px;}
.faq-q-text{flex:1;font-weight:700;font-size:15px;}
@media(min-width:640px){.faq-q-text{font-size:16px;}}
.faq-toggle{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:999px;background:var(--slate-100);color:var(--muted-2);transition:all .2s;}
.faq-item[open] .faq-toggle{background:var(--accent);color:#fff;}
.faq-minus{display:none;}
.faq-item[open] .faq-plus{display:none;}
.faq-item[open] .faq-minus{display:block;}
.faq-a{padding:0 24px 20px 56px;font-size:14px;color:var(--muted);line-height:1.8;}

/* ============ Diagnosis (dark) ============ */
.section--dark{position:relative;overflow:hidden;background:var(--ink);}
.dark-glow{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(40% 60% at 85% 10%,rgba(56,189,248,.22) 0%,transparent 60%),radial-gradient(40% 50% at 10% 90%,rgba(56,189,248,.14) 0%,transparent 60%);}
.diag-grid{position:relative;display:grid;gap:40px;align-items:start;}
@media(min-width:1024px){.diag-grid{grid-template-columns:1fr 1.15fr;gap:56px;}}
.diag-pitch{color:#fff;}
@media(min-width:1024px){.diag-pitch{padding-top:16px;}}
.diag-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);padding:6px 16px;border-radius:999px;font-size:13px;font-weight:700;margin-bottom:24px;}
.diag-title{font-weight:900;font-size:30px;line-height:1.3;letter-spacing:-.01em;}
@media(min-width:640px){.diag-title{font-size:40px;}}
.diag-title .t-accent{color:#7dd3fc;}
.diag-sub{margin-top:20px;color:#cbd5e1;font-size:15px;max-width:440px;}
.diag-points{margin-top:32px;display:flex;flex-direction:column;gap:12px;}
.diag-points li{display:flex;align-items:center;gap:12px;color:#e2e8f0;font-size:15px;}
.dp-check{display:grid;place-items:center;width:24px;height:24px;border-radius:999px;background:rgba(56,189,248,.2);color:#7dd3fc;flex:none;}

.diag-formcard{background:#fff;border-radius:24px;padding:24px;box-shadow:0 40px 80px -30px rgba(0,0,0,.5);}
@media(min-width:640px){.diag-formcard{padding:32px;}}
.form-title{font-weight:900;font-size:20px;margin-bottom:4px;}
.form-note{font-size:13px;color:var(--muted-2);margin-bottom:24px;}
.req{color:var(--rose);}
.form-alert{background:#fff1f2;color:#be123c;border:1px solid #fecdd3;border-radius:10px;padding:10px 14px;font-size:13px;font-weight:600;margin-bottom:16px;}
.field{margin-bottom:16px;}
.field-row{display:grid;gap:16px;margin-bottom:16px;}
@media(min-width:640px){.field-row{grid-template-columns:1fr 1fr;}}
.field-row .field{margin-bottom:0;}
.field label,.field-check{font-size:13px;font-weight:700;color:#334155;}
.field label{display:block;margin-bottom:6px;}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--slate-200);border-radius:12px;background:#fff;
  padding:12px 16px;font-size:15px;color:var(--ink);font-family:inherit;outline:none;transition:border-color .2s,box-shadow .2s;}
.field textarea{resize:vertical;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.field.has-error input,.field.has-error select{border-color:#fb7185;}
.field.has-error input:focus,.field.has-error select:focus{box-shadow:0 0 0 3px #ffe4e6;}
.err-msg{display:block;margin-top:6px;font-size:12px;color:var(--rose);font-weight:600;}
.field-check{margin-bottom:8px;}
.field-check label{display:flex;align-items:flex-start;gap:10px;font-weight:400;color:var(--muted);font-size:13px;cursor:pointer;}
.field-check input{width:16px;height:16px;margin-top:2px;accent-color:var(--accent);}
.field-check a{color:var(--accent-deep);text-decoration:underline;}
.btn-submit{margin-top:8px;padding:16px;font-size:16px;font-weight:900;}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

.form-done{text-align:center;padding:40px 8px;}
.form-done-ic{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 20px;border-radius:999px;background:var(--accent);color:#fff;}
.form-done h3{font-weight:900;font-size:20px;}
.form-done p{margin-top:12px;color:var(--muted);font-size:14px;}
.form-reset{display:inline-block;margin-top:24px;font-size:13px;font-weight:700;color:var(--accent-deep);text-decoration:underline;}

/* ============ Footer ============ */
.site-footer{background:#fff;border-top:1px solid var(--slate-200);padding:48px 0;}
.footer-top{display:flex;flex-direction:column;gap:24px;justify-content:space-between;}
@media(min-width:640px){.footer-top{flex-direction:row;align-items:center;}}
.site-footer .brand{align-items:center;}
.brand-tagline{font-size:12px;color:var(--muted-2);}
.footer-nav{display:flex;flex-wrap:wrap;gap:8px 24px;font-size:13px;color:var(--muted-2);}
.footer-nav a:hover{color:var(--accent-deep);}
.footer-bottom{margin-top:32px;padding-top:24px;border-top:1px solid var(--slate-100);font-size:12px;color:#94a3b8;}

/* ============ Sticky CTA ============ */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:12px;background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);border-top:1px solid var(--slate-200);transform:translateY(110%);transition:transform .3s ease;}
.sticky-cta.is-visible{transform:translateY(0);}
.sticky-cta .btn{padding:14px;font-size:15px;font-weight:900;}
@media(min-width:1024px){.sticky-cta{display:none;}}

/* ============ Reduced motion ============ */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}.worry-panel.is-active{animation:none;}.btn-primary:hover{transform:none;}}