/* ============================================================
   CooBase LP (live content) — extra section styles
   Reuses the lp.css design tokens / components; only adds
   layouts the original LP didn't have.
   ============================================================ */

/* ---- generic screenshot placeholder (design-system striped) ---- */
.shot{
  position:relative;border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--shadow);
  background:repeating-linear-gradient(135deg,#eef3fb,#eef3fb 10px,#f6f9fe 10px,#f6f9fe 20px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  color:var(--ink-3);min-height:240px;padding:30px;text-align:center;
}
.shot svg{width:44px;height:44px;color:#b9c8e2;}
.shot .ph-t{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;letter-spacing:.03em;line-height:1.7;max-width:320px;}

/* ===== HERO value-trio line ===== */
.hero-trio{
  margin-top:30px;display:flex;flex-direction:column;gap:11px;max-width:540px;
}
.hero-trio .ht{
  display:flex;align-items:center;gap:11px;font-size:14px;font-weight:700;color:var(--ink-2);
}
.hero-trio .ht .ck{
  width:24px;height:24px;border-radius:8px;background:var(--grad-soft);color:var(--brand);
  display:flex;align-items:center;justify-content:center;flex:none;
}
.hero-trio .ht .ck svg{width:14px;height:14px;}
.hero-trio .ht b{color:var(--brand-deep);}

/* float card variant: voice / emotion */
.float-voice{bottom:14%;left:-22px;top:auto;border-left:4px solid var(--brand);max-width:212px;}
.float-voice .ico{background:#eaf3ff;color:var(--brand);}

/* ===== FEATURES (CooBaseでできること) ===== */
#features{background:#fff;}
.feat-sub{
  display:flex;align-items:center;gap:12px;margin:64px 0 26px;
}
.feat-sub h3{
  font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(20px,2.4vw,26px);color:var(--ink);
  white-space:nowrap;
}
.feat-sub .tag8{
  font-size:12px;font-weight:700;color:var(--brand);background:var(--grad-soft);
  padding:6px 14px;border-radius:999px;flex:none;
}
.feat-sub .rule{flex:1;height:1px;background:var(--line);}
.feat-sub p{font-size:13.5px;color:var(--ink-3);}

.fgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.fgrid.biz{grid-template-columns:repeat(4,1fr);}
.fcard{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:26px 24px 22px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;
  transition:transform .28s, box-shadow .28s, border-color .28s;
}
.fcard:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#d4e0f2;}
.fcard .fi{
  width:50px;height:50px;border-radius:14px;background:var(--grad);color:#fff;
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;box-shadow:var(--shadow-brand);
}
.fcard.biz .fi{background:var(--grad-soft);color:var(--brand);box-shadow:none;}
.fcard .fi svg{width:25px;height:25px;}
.fcard h4{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:17px;color:var(--ink);line-height:1.45;margin-bottom:9px;text-wrap:balance;}
.fcard p{font-size:13px;color:var(--ink-2);line-height:1.85;flex:1;}
.fcard .gain{
  margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);
  display:flex;flex-direction:column;gap:3px;
}
.fcard .gain .k{font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--ink-3);}
.fcard .gain .v{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:13px;color:var(--brand-deep);line-height:1.5;}
.fcard.biz .gain .k{color:var(--ink-3);}
.fcard.biz .gain .v{color:var(--ink-2);font-weight:700;}
.feat-line{margin-top:30px;text-align:center;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:clamp(16px,2vw,20px);color:var(--ink);}
.feat-line b{color:var(--brand);}

/* ===== PROBLEMS (6 numbered) ===== */
#problem{background:var(--bg);}
.prob6{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:54px;}
.prob6 .pc{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 28px;
  box-shadow:var(--shadow-sm);transition:transform .3s, box-shadow .3s;position:relative;overflow:hidden;
}
.prob6 .pc:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);}
.prob6 .pc .pn{
  font-family:"Zen Kaku Gothic New";font-weight:900;font-size:42px;line-height:1;
  color:transparent;-webkit-text-stroke:1.5px #c8d6ee;letter-spacing:-.02em;margin-bottom:14px;display:block;
}
.prob6 .pc h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:19px;color:var(--ink);margin-bottom:11px;line-height:1.5;}
.prob6 .pc p{font-size:14px;color:var(--ink-2);line-height:1.9;}
.prob6 .pc::after{content:"";position:absolute;top:0;left:0;width:4px;height:0;background:var(--grad);transition:height .35s;}
.prob6 .pc:hover::after{height:100%;}

/* ===== SOLUTION extras ===== */
#solution{overflow:hidden;}
/* metric chips above pillars */
.sol-metrics{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:54px;}
.sol-metric{
  display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:32px 34px;box-shadow:var(--shadow);
}
.sol-metric .big{
  font-family:"Zen Kaku Gothic New";font-weight:900;line-height:.95;letter-spacing:-.03em;color:var(--brand-deep);
  font-size:clamp(40px,4.6vw,60px);white-space:nowrap;text-align:center;
}
.sol-metric .big small{display:block;font-size:14px;color:var(--ink-3);font-weight:700;margin-top:8px;letter-spacing:0;}
.sol-metric .desc h4{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:18px;color:var(--ink);margin-bottom:9px;}
.sol-metric .desc p{font-size:13.5px;color:var(--ink-2);line-height:1.85;}
.sol-metric.alert .big{color:var(--alert);}

/* self-growth cycle band */
.cycle{
  margin-top:30px;background:var(--ink);color:#fff;border-radius:var(--r-xl);
  padding:46px 44px;box-shadow:var(--shadow-lg);position:relative;overflow:hidden;
}
.cycle::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(127,200,255,.08);top:-200px;right:-120px;}
.cycle h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(20px,2.6vw,28px);text-align:center;line-height:1.5;margin-bottom:34px;position:relative;}
.cycle h3 b{color:#7fd3ff;}
.cycle-flow{display:flex;align-items:stretch;justify-content:center;gap:14px;flex-wrap:wrap;position:relative;}
.cycle-node{
  flex:1;min-width:170px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r);padding:22px 20px;text-align:center;backdrop-filter:blur(4px);
}
.cycle-node .role{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:14px;color:#7fd3ff;margin-bottom:8px;}
.cycle-node .say{font-size:13px;color:rgba(255,255,255,.86);line-height:1.7;}
.cycle-node.engine{background:var(--grad);border-color:transparent;}
.cycle-node.engine .role{color:#fff;}
.cycle-node.engine .say{color:rgba(255,255,255,.95);font-weight:700;}
.cycle-arrow{display:flex;align-items:center;color:rgba(255,255,255,.4);font-size:22px;font-weight:700;}
.cycle-gain{margin-top:26px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative;}
.cycle-gain .cg{
  display:inline-flex;align-items:baseline;gap:8px;background:rgba(127,211,255,.12);
  border:1px solid rgba(127,211,255,.25);border-radius:999px;padding:10px 20px;
}
.cycle-gain .cg b{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:20px;color:#7fd3ff;}
.cycle-gain .cg span{font-size:12.5px;color:rgba(255,255,255,.85);font-weight:700;}

/* 3 育成 cards */
.grow3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px;}
.grow3 .gc{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 28px;box-shadow:var(--shadow-sm);transition:transform .3s,box-shadow .3s;}
.grow3 .gc:hover{transform:translateY(-5px);box-shadow:var(--shadow);}
.grow3 .gc .gi{width:50px;height:50px;border-radius:14px;background:var(--grad-soft);color:var(--brand);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.grow3 .gc .gi svg{width:25px;height:25px;}
.grow3 .gc h4{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:18px;color:var(--ink);margin-bottom:10px;}
.grow3 .gc p{font-size:13.5px;color:var(--ink-2);line-height:1.85;margin-bottom:14px;}
.grow3 .gc .gv{display:inline-flex;align-items:center;gap:7px;font-family:"Zen Kaku Gothic New";font-weight:900;font-size:14px;color:var(--brand-deep);background:var(--grad-soft);padding:7px 14px;border-radius:999px;}

/* ===== MECHANISM rows (OKR / Learning) ===== */
.mech{
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
  padding:60px 0;border-top:1px solid var(--line-2);
}
.mech.flip .mech-copy{order:2;}
.mech .eyebrow{margin-bottom:14px;}
.mech h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(23px,3vw,34px);line-height:1.4;color:var(--ink);margin-bottom:16px;letter-spacing:-.01em;}
.mech .lead{font-size:15px;color:var(--ink-2);line-height:1.95;margin-bottom:26px;}
.mech-steps{display:flex;flex-direction:column;gap:14px;}
.mech-steps .ms{display:flex;align-items:flex-start;gap:15px;}
.mech-steps .ms .no{
  width:34px;height:34px;border-radius:11px;background:var(--grad);color:#fff;flex:none;
  font-family:"Zen Kaku Gothic New";font-weight:900;font-size:15px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-brand);
}
.mech-steps .ms.result .no{background:var(--good);box-shadow:none;}
.mech-steps .ms p{font-size:14px;color:var(--ink-2);line-height:1.7;padding-top:5px;}
.mech-steps .ms.result p{font-weight:700;color:var(--ink);}
.mech-steps .ms.result b{color:var(--good);}

/* ===== MY AI demo ===== */
#myai{background:var(--bg);}
.myai-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-top:8px;}
.myai-copy h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(23px,3vw,34px);line-height:1.45;color:var(--ink);margin-bottom:18px;letter-spacing:-.01em;}
.myai-copy .lead{font-size:15px;color:var(--ink-2);line-height:1.95;margin-bottom:24px;}
.myai-list{list-style:none;display:flex;flex-direction:column;gap:13px;}
.myai-list li{display:flex;align-items:flex-start;gap:11px;font-size:14px;color:var(--ink-2);line-height:1.6;}
.myai-list li svg{width:18px;height:18px;color:var(--brand);flex:none;margin-top:3px;}
.myai-list li b{color:var(--ink);}
.myai-list li .new{font-size:9.5px;font-weight:900;letter-spacing:.06em;color:#fff;background:var(--alert);border-radius:5px;padding:2px 7px;margin-left:6px;vertical-align:middle;}
/* chat mock */
.chat{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);padding:22px;}
.chat .chat-head{display:flex;align-items:center;gap:10px;padding-bottom:16px;border-bottom:1px solid var(--line-2);margin-bottom:18px;}
.chat .chat-head .ai{width:34px;height:34px;border-radius:10px;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px;}
.chat .chat-head b{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:14px;color:var(--ink);}
.chat .chat-head span{font-size:11px;color:var(--good);font-weight:700;margin-left:auto;display:inline-flex;align-items:center;gap:6px;}
.chat .chat-head span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--good);}
.bubble{max-width:84%;font-size:13px;line-height:1.7;padding:12px 16px;border-radius:16px;margin-bottom:12px;}
.bubble.me{margin-left:auto;background:var(--grad);color:#fff;border-bottom-right-radius:5px;}
.bubble.ai{background:var(--bg);color:var(--ink);border:1px solid var(--line-2);border-bottom-left-radius:5px;}
.doc-card{margin-top:4px;border:1px solid var(--line);border-radius:14px;padding:14px 16px;display:flex;align-items:center;gap:12px;background:#f9fbff;}
.doc-card .dico{width:40px;height:48px;border-radius:7px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--alert);flex:none;font-weight:900;font-size:11px;font-family:"Zen Kaku Gothic New";}
.doc-card .dmeta b{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:13px;color:var(--ink);display:block;}
.doc-card .dmeta span{font-size:11px;color:var(--ink-3);}
.doc-card .dl{margin-left:auto;display:flex;gap:6px;flex:none;}
.doc-card .dl span{font-size:10.5px;font-weight:700;color:var(--brand);background:var(--grad-soft);padding:5px 11px;border-radius:999px;}
.myai-notes{margin-top:14px;display:flex;flex-direction:column;gap:7px;}
.myai-notes .mn{font-size:11.5px;color:var(--ink-3);display:flex;align-items:center;gap:8px;}
.myai-notes .mn::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brand);flex:none;}

/* features-detail link band */
.detail-link{margin-top:46px;text-align:center;background:#fff;border:1px dashed #c9d7ee;border-radius:var(--r-lg);padding:30px;}
.detail-link a{display:inline-flex;align-items:center;gap:8px;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:16px;color:var(--brand);}
.detail-link a svg{width:18px;height:18px;}
.detail-link p{font-size:13px;color:var(--ink-3);margin-top:8px;}

/* ===== TRANSFORM (before / after) ===== */
#transform{background:#fff;}
.tf-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:54px;}
.tf-col{border-radius:var(--r-xl);padding:34px 34px;border:1px solid var(--line);}
.tf-col.before{background:var(--bg);}
.tf-col.after{background:var(--grad);color:#fff;border-color:transparent;box-shadow:var(--shadow-lg);}
.tf-col .tf-cap{display:inline-flex;align-items:center;gap:9px;font-family:"Zen Kaku Gothic New";font-weight:900;font-size:15px;margin-bottom:22px;}
.tf-col.before .tf-cap{color:var(--ink-3);}
.tf-col.before .tf-cap .d{width:10px;height:10px;border-radius:50%;background:#b6c0d2;}
.tf-col.after .tf-cap .d{width:10px;height:10px;border-radius:50%;background:#7fd3ff;}
.tf-col ul{list-style:none;display:flex;flex-direction:column;gap:16px;}
.tf-col li{display:flex;align-items:flex-start;gap:12px;font-size:14px;line-height:1.8;}
.tf-col.before li{color:var(--ink-2);}
.tf-col.after li{color:rgba(255,255,255,.95);}
.tf-col li .ic{width:22px;height:22px;border-radius:7px;flex:none;display:flex;align-items:center;justify-content:center;margin-top:2px;}
.tf-col.before li .ic{background:#e6e9f0;color:#94a1ba;}
.tf-col.after li .ic{background:rgba(255,255,255,.18);color:#fff;}
.tf-col li .ic svg{width:13px;height:13px;}
.tf-ba{margin-top:24px;}
.tf-ba .shot{min-height:200px;}
.tf-disc{text-align:center;margin-top:16px;font-size:12px;color:var(--ink-3);}

/* ===== SECURITY ===== */
#security{background:var(--bg);}
.sec-vs{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:stretch;margin-top:54px;}
.sec-box{border-radius:var(--r-xl);padding:32px;border:1px solid var(--line);background:#fff;text-align:center;}
.sec-box .lab{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:13px;color:var(--ink-3);margin-bottom:6px;}
.sec-box.shared{background:#fbfcfe;}
.sec-box.shared .lab{color:var(--alert);}
.sec-box.ours{background:var(--grad-soft);border-color:#cfe0f7;}
.sec-box.ours .lab{color:var(--brand);}
.sec-box .grid-vis{display:flex;align-items:center;justify-content:center;gap:8px;margin:18px 0;flex-wrap:wrap;}
.sec-box .srv{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;font-family:"Zen Kaku Gothic New";}
.sec-box.shared .vault{width:110px;height:80px;border-radius:14px;background:#fff;border:2px solid #f0c4cf;display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;padding:10px;margin:18px auto;position:relative;}
.sec-box.shared .vault .who{width:28px;height:28px;border-radius:7px;background:#fbe3e8;color:var(--alert);font-size:9px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.sec-box.ours .single{width:120px;height:80px;border-radius:14px;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;margin:18px auto;box-shadow:var(--shadow-brand);font-family:"Zen Kaku Gothic New";font-weight:900;font-size:13px;}
.sec-box .cap{font-size:13px;color:var(--ink-2);line-height:1.7;}
.sec-box .cap b{color:var(--ink);font-family:"Zen Kaku Gothic New";}
.sec-box .safe-tag{display:inline-block;margin-top:14px;font-size:11.5px;font-weight:700;color:var(--good);background:var(--good-bg);padding:6px 14px;border-radius:999px;}
.sec-vsmark{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:16px;color:#fff;background:var(--ink);width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;align-self:center;}
.sec-note{text-align:center;font-size:12px;color:var(--ink-3);margin-top:18px;}
.sec-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:34px;}
.sec-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;box-shadow:var(--shadow-sm);}
.sec-card .sh{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.sec-card .sh .si{width:48px;height:48px;border-radius:13px;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-brand);flex:none;}
.sec-card .sh .si svg{width:24px;height:24px;}
.sec-card .sh h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:18px;color:var(--ink);line-height:1.4;}
.sec-card .sh span{display:block;font-size:12px;color:var(--ink-3);font-weight:500;margin-top:2px;}
.sec-card ul{list-style:none;display:flex;flex-direction:column;gap:12px;}
.sec-card li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--ink-2);line-height:1.7;}
.sec-card li svg{width:16px;height:16px;color:var(--good);flex:none;margin-top:3px;}
.sec-card li b{color:var(--ink);}
.sec-foot{margin-top:30px;text-align:center;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:clamp(15px,1.9vw,18px);color:var(--ink);line-height:1.8;}
.sec-foot b{color:var(--brand);}

/* ===== PRICING (5 plans) ===== */
.price-badges{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:40px;}
.price-badges .pb{display:inline-flex;flex-direction:column;align-items:center;gap:2px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 22px;box-shadow:var(--shadow-sm);}
.price-badges .pb b{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:13.5px;color:var(--brand-deep);}
.price-badges .pb span{font-size:11px;color:var(--ink-3);}

.plans5{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:30px;align-items:stretch;}
.plans5 .plan{padding:30px 22px;}
.plans5 .plan .price{font-size:30px;}
.plans5 .plan h3{font-size:20px;}
.plan .price .pre{display:block;font-size:11px;color:var(--ink-3);font-weight:500;margin-top:6px;}
.plan .guide{font-size:12px;color:var(--brand-deep);font-weight:700;background:var(--grad-soft);border-radius:8px;padding:7px 10px;margin:14px 0 4px;text-align:center;}
.ent-row{margin-top:18px;background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:30px 34px;display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;box-shadow:var(--shadow);}
.ent-row h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:22px;}
.ent-row .efor{font-size:12.5px;color:#9fb0cc;margin-top:4px;}
.ent-row ul{list-style:none;display:flex;gap:10px 24px;flex-wrap:wrap;}
.ent-row li{font-size:13px;color:rgba(255,255,255,.85);display:flex;align-items:center;gap:8px;}
.ent-row li::before{content:"";width:6px;height:6px;border-radius:50%;background:#7fd3ff;flex:none;}
.ent-row .btn{flex:none;}

.user-note{margin-top:22px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 30px;display:flex;align-items:center;gap:18px;box-shadow:var(--shadow-sm);flex-wrap:wrap;}
.user-note .un-tag{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:13px;color:#fff;background:var(--good);padding:8px 16px;border-radius:999px;flex:none;}
.user-note .un-txt b{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:16px;color:var(--ink);display:block;margin-bottom:2px;}
.user-note .un-txt span{font-size:13px;color:var(--ink-2);line-height:1.7;}

/* token grid */
.token-block{margin-top:30px;background:var(--grad-soft);border:1px solid #dcebff;border-radius:var(--r-lg);padding:30px 34px;}
.token-block h4{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:17px;color:var(--brand-deep);margin-bottom:4px;}
.token-block .th-sub{font-size:12.5px;color:var(--ink-3);margin-bottom:20px;}
.token-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
.token-grid .tk{background:#fff;border:1px solid #dcebff;border-radius:14px;padding:16px 14px;text-align:center;}
.token-grid .tk b{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:13.5px;color:var(--ink);display:block;margin-bottom:3px;}
.token-grid .tk span{font-size:11px;color:var(--ink-3);line-height:1.5;}

.addons{margin-top:22px;display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.addon{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;box-shadow:var(--shadow-sm);}
.addon h5{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:15px;color:var(--ink);margin-bottom:6px;}
.addon p{font-size:12.5px;color:var(--ink-2);line-height:1.8;}
.addon .pr{font-family:"Zen Kaku Gothic New";font-weight:700;color:var(--brand-deep);}

/* ===== FAQ helper ===== */
.faq-more{margin-top:36px;background:var(--grad-soft);border:1px solid #dcebff;border-radius:var(--r-lg);padding:36px;text-align:center;}
.faq-more h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:20px;color:var(--ink);margin-bottom:10px;}
.faq-more p{font-size:14px;color:var(--ink-2);line-height:1.8;margin-bottom:22px;}

/* ===== RESPONSIVE ===== */
@media(max-width:1020px){
  .fgrid,.fgrid.biz{grid-template-columns:repeat(2,1fr);}
  .prob6{grid-template-columns:repeat(2,1fr);}
  .sol-metrics{grid-template-columns:1fr;}
  .grow3{grid-template-columns:1fr;}
  .mech{grid-template-columns:1fr;gap:34px;}
  .mech.flip .mech-copy{order:0;}
  .myai-grid{grid-template-columns:1fr;gap:34px;}
  .tf-grid{grid-template-columns:1fr;}
  .sec-cards{grid-template-columns:1fr;}
  .plans5{grid-template-columns:repeat(2,1fr);}
  .token-grid{grid-template-columns:repeat(3,1fr);}
  .ent-row{grid-template-columns:1fr;gap:18px;text-align:center;}
  .ent-row ul{justify-content:center;}
}
@media(max-width:860px){
  .sec-vs{grid-template-columns:1fr;}
  .sec-vsmark{margin:0 auto;}
  .cycle-flow{flex-direction:column;}
  .cycle-arrow{transform:rotate(90deg);justify-content:center;}
}
@media(max-width:600px){
  .fgrid,.fgrid.biz,.prob6,.plans5,.addons{grid-template-columns:1fr;}
  .token-grid{grid-template-columns:repeat(2,1fr);}
  .sol-metric{grid-template-columns:1fr;text-align:center;gap:16px;}
}

/* ============================================================
   CONTACT FORM (embedded below final CTA)
   Styles target the ORIGINAL form markup classes (bootstrap-ish)
   — markup is left untouched; appearance is via CSS only.
   ============================================================ */
#contact-form{background:var(--bg);padding-top:0;}
.cf-card{
  max-width:880px;margin:-70px auto 0;position:relative;z-index:5;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);
  box-shadow:var(--shadow-lg);padding:clamp(30px,4vw,56px);
}
.cf-head{text-align:center;margin-bottom:36px;}
.cf-head .eyebrow{margin-bottom:14px;}
.cf-head h2{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(24px,3vw,34px);color:var(--ink);line-height:1.4;letter-spacing:-.01em;}
.cf-head p{font-size:14.5px;color:var(--ink-2);margin-top:14px;line-height:1.85;}
.cf-head .reassure{display:inline-flex;flex-wrap:wrap;gap:10px 18px;justify-content:center;margin-top:18px;}
.cf-head .reassure span{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:var(--brand-deep);}
.cf-head .reassure span svg{width:15px;height:15px;color:var(--brand);}

/* ---- reset the original wrappers ---- */
#contact-form .cf-form,
#contact-form .row.layout_row,
#contact-form .column-box,
#contact-form .block_box,
#contact-form form.form-horizontal{
  width:100%;max-width:none;margin:0;padding:0;float:none;display:block;
}
#contact-form .box-body{display:flex;flex-direction:column;}

/* ---- each field row: label + field ---- */
#contact-form .form-group{
  display:grid;grid-template-columns:190px 1fr;gap:8px 28px;align-items:start;
  padding:22px 0;border-bottom:1px solid var(--line-2);
}
#contact-form .form-group:first-child{padding-top:4px;}
#contact-form .col-sm-3.control-label{
  font-family:"Zen Kaku Gothic New";font-weight:700;font-size:14.5px;color:var(--ink);
  line-height:1.6;padding-top:11px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;
}
#contact-form .col-sm-9{min-width:0;}

/* required badge — original text is "(必須)" */
#contact-form .attention{
  font-size:11px;font-weight:700;color:#fff;background:var(--alert);
  border-radius:6px;padding:2px 9px;letter-spacing:.01em;line-height:1.6;white-space:nowrap;
}

/* ---- inputs / textarea ---- */
#contact-form .form-control{
  width:100%;max-width:480px;font-family:inherit;font-size:15px;color:var(--ink);
  background:#fbfcfe;border:1.5px solid var(--line);border-radius:var(--r-sm);
  padding:13px 15px;transition:border-color .2s, box-shadow .2s, background .2s;
}
#contact-form textarea.form-control{max-width:100%;resize:vertical;min-height:150px;line-height:1.8;}
#contact-form .form-control::placeholder{color:#a6b1c4;}
#contact-form .form-control:focus{outline:none;border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px rgba(36,86,199,.12);}

/* mail confirm row: "(メールアドレス確認)" label + input */
#contact-form .col-sm-9 .form-control + .form-inline,
#contact-form .form-inline{
  margin-top:12px;font-size:12.5px;font-weight:600;color:var(--ink-3);line-height:1.7;
}
#contact-form .form-inline .mailcheck{display:block;margin-top:7px;font-weight:400;}

/* ---- radio group (種類) ---- */
#contact-form .check-box .col-sm-9{display:flex;flex-wrap:wrap;gap:12px;}
#contact-form .check-box .col-sm-9 br{display:none;}
#contact-form .form_7417_class{position:absolute;opacity:0;width:0;height:0;pointer-events:none;}
#contact-form .check-box .col-sm-9 label{
  display:inline-flex;align-items:center;gap:9px;cursor:pointer;margin:0;white-space:nowrap;
  border:1.5px solid var(--line);border-radius:999px;padding:11px 20px;
  font-size:14px;font-weight:700;color:var(--ink-2);background:#fbfcfe;
  transition:border-color .2s, color .2s, background .2s, box-shadow .2s;
}
#contact-form .check-box .col-sm-9 label::before{
  content:"";width:18px;height:18px;border-radius:50%;border:2px solid #c2cee0;
  flex:none;transition:border-color .2s, box-shadow .2s;
}
#contact-form .form_7417_class:checked + label{
  border-color:var(--brand);color:var(--brand-deep);background:var(--grad-soft);
  box-shadow:0 0 0 3px rgba(36,86,199,.1);
}
#contact-form .form_7417_class:checked + label::before{border-color:var(--brand);box-shadow:inset 0 0 0 4px var(--brand);}
#contact-form .form_7417_class:focus-visible + label{outline:2px solid var(--brand);outline-offset:2px;}

/* ---- submit (original is input.btn.btn-default) ---- */
#contact-form .box-footer{margin-top:32px;text-align:center;border:none;padding:0;}
#contact-form .box-footer .btn,
#contact-form .box-footer input[type="button"]{
  font-family:"Zen Kaku Gothic New";font-weight:900;font-size:17px;color:#fff;cursor:pointer;
  background:var(--grad);border:none;border-radius:999px;padding:18px 64px;width:auto;
  box-shadow:var(--shadow-brand);transition:transform .2s, box-shadow .2s;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;letter-spacing:.04em;
}
#contact-form .box-footer .btn:hover,
#contact-form .box-footer input[type="button"]:hover{transform:translateY(-2px);box-shadow:0 16px 38px rgba(37,99,217,.4);}

@media(max-width:680px){
  .cf-card{margin-top:-50px;border-radius:var(--r-lg);padding:26px 20px;}
  #contact-form .form-group{grid-template-columns:1fr;gap:10px;}
  #contact-form .col-sm-3.control-label{padding-top:0;}
  #contact-form .form-control{max-width:100%;}
}
