/* ============================================================
   CooBase LP — sections part 2
   ============================================================ */

/* ===== PILLARS ===== */
#value .pillar{
  display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;
  padding:64px 0;border-top:1px solid var(--line-2);
}
#value .pillar:first-of-type{border-top:none;}
#value .pillar.flip .pcopy{order:2;}
.pnum{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:13px;letter-spacing:.18em;color:var(--brand);display:flex;align-items:center;gap:12px;}
.pnum .v{color:#c4d2ea;}
.pnum .tag{background:var(--grad-soft);color:var(--brand-deep);padding:4px 13px;border-radius:999px;font-size:11.5px;letter-spacing:.05em;}
.pillar h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(26px,3.5vw,40px);line-height:1.38;margin:18px 0 18px;color:var(--ink);letter-spacing:-.01em;}
.pillar h3 .grad-text{display:inline;}
.pillar p.lead{font-size:15.5px;color:var(--ink-2);line-height:2;margin-bottom:22px;}
.feats{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:26px;}
.feats span{font-size:12.5px;font-weight:700;border:1px solid #d4e0f2;color:var(--brand-deep);background:#fff;border-radius:999px;padding:7px 15px;}
.pstat{display:flex;align-items:baseline;gap:14px;padding:18px 22px;background:var(--grad-soft);border-radius:var(--r);border:1px solid #dcebff;}
.pstat .big{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(48px,5.5vw,72px);color:var(--brand-deep);line-height:.92;letter-spacing:-.03em;}
.pstat .lbl{font-size:13.5px;font-weight:700;color:var(--ink-2);}
.pstat .note{font-size:11px;color:var(--ink-3);}

/* ----- mini UI mockups (CSS-built, brand-styled) ----- */
.mock{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);padding:22px;position:relative;
}
.mock-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.mock-head .ttl{display:flex;align-items:center;gap:9px;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:14px;color:var(--ink);}
.mock-head .ttl .d{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;}
.mock-head .ttl .d svg{width:15px;height:15px;}
.mock-head .pill{font-size:11px;font-weight:700;padding:4px 11px;border-radius:999px;}

/* mock A: emotion / alert */
.emo-row{display:flex;align-items:flex-end;gap:8px;height:96px;padding:8px 4px 0;}
.emo-row .bar{flex:1;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,#bcd8fb,#dcebff);position:relative;}
.emo-row .bar.lo{background:linear-gradient(180deg,#f3a9b8,#fbd8df);}
.emo-row .bar.lo::after{content:"";position:absolute;inset:0;border:1.5px solid var(--alert);border-radius:inherit;}
.emo-x{display:flex;justify-content:space-between;margin-top:8px;font-size:10px;color:var(--ink-3);}
.alert-strip{margin-top:16px;display:flex;align-items:center;gap:11px;background:var(--alert-bg);border:1px solid #f4c4cf;border-radius:12px;padding:12px 14px;}
.alert-strip .ic{width:34px;height:34px;border-radius:10px;background:#fff;color:var(--alert);display:flex;align-items:center;justify-content:center;flex:none;box-shadow:var(--shadow-sm);}
.alert-strip .ic svg{width:18px;height:18px;}
.alert-strip b{font-size:12.5px;color:var(--alert);font-family:"Zen Kaku Gothic New";display:block;}
.alert-strip span{font-size:11px;color:var(--ink-2);}

/* mock B: skill radar */
.radar-wrap{display:flex;align-items:center;gap:20px;}
.radar{width:150px;height:150px;flex:none;}
.skill-list{flex:1;display:flex;flex-direction:column;gap:11px;}
.skill-row{display:flex;align-items:center;gap:10px;}
.skill-row .nm{font-size:12px;font-weight:700;color:var(--ink-2);width:64px;flex:none;}
.skill-row .track{flex:1;height:7px;background:#eef2f8;border-radius:99px;overflow:hidden;}
.skill-row .fill{height:100%;background:var(--grad);border-radius:99px;}
.skill-row .lv{font-size:11px;font-weight:900;color:var(--gold);width:40px;text-align:right;flex:none;}
.badge-row{display:flex;gap:8px;margin-top:16px;}
.badge-chip{display:inline-flex;align-items:center;gap:6px;background:#fffaf0;border:1px solid #f0dca8;color:#9a7b1f;font-size:11px;font-weight:700;padding:6px 11px;border-radius:999px;}

/* mock C: exec dashboard */
.exec-top{display:grid;grid-template-columns:1.1fr 1fr;gap:12px;}
.exec-score{background:var(--grad);border-radius:var(--r);padding:18px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;}
.exec-score .lbl{font-size:11.5px;opacity:.9;font-weight:700;}
.exec-score .v{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:40px;line-height:1;margin-top:6px;}
.exec-score .v small{font-size:15px;opacity:.85;}
.exec-score .delta{font-size:11.5px;margin-top:8px;opacity:.95;}
.exec-mini{display:grid;gap:10px;}
.exec-cell{background:#f7faff;border:1px solid var(--line-2);border-radius:12px;padding:11px 13px;}
.exec-cell .k{font-size:10.5px;color:var(--ink-3);font-weight:700;}
.exec-cell .n{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:19px;color:var(--ink);}
.exec-cell .n.g{color:var(--good);}
.exec-row{display:flex;align-items:center;gap:10px;margin-top:14px;padding:11px 13px;border:1px solid var(--line-2);border-radius:12px;}
.exec-row .av{width:30px;height:30px;border-radius:50%;background:var(--grad-soft);color:var(--brand);font-weight:900;font-size:12px;display:flex;align-items:center;justify-content:center;flex:none;}
.exec-row .who b{font-size:12px;color:var(--ink);display:block;font-family:"Zen Kaku Gothic New";}
.exec-row .who span{font-size:10.5px;color:var(--ink-3);}
.exec-row .tag{margin-left:auto;font-size:10.5px;font-weight:700;color:var(--good);background:var(--good-bg);padding:4px 10px;border-radius:999px;}

.all-feat{margin-top:48px;text-align:center;background:#fff;border:1px dashed #c9d7ee;border-radius:var(--r-lg);padding:32px;}
.all-feat p{font-size:15px;color:var(--ink-2);}
.all-feat b{color:var(--brand-deep);font-family:"Zen Kaku Gothic New";}
.all-feat a{color:var(--brand);font-weight:700;text-decoration:underline;text-underline-offset:3px;}

/* ===== CASE ===== */
#case{background:var(--bg);}
.case-card{
  display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:center;margin-top:50px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:44px;box-shadow:var(--shadow);
}
.case-photo{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;
  background:repeating-linear-gradient(135deg,#eef3fb,#eef3fb 10px,#f6f9fe 10px,#f6f9fe 20px);
  border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--ink-3);}
.case-photo .ph-ico{width:48px;height:48px;color:#b9c8e2;}
.case-photo .ph-t{font-family:ui-monospace,monospace;font-size:11px;letter-spacing:.04em;text-align:center;padding:0 20px;}
.case-meta{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--ink-3);margin-bottom:16px;}
.case-meta .badge{background:var(--grad-soft);color:var(--brand-deep);padding:4px 12px;border-radius:999px;}
.case-quote{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:clamp(19px,2.4vw,25px);line-height:1.75;color:var(--ink);margin-bottom:18px;text-wrap:pretty;}
.case-quote .mk{color:var(--brand);}
.case-body{font-size:14.5px;color:var(--ink-2);line-height:1.95;margin-bottom:24px;}
.case-stats{display:flex;gap:30px;flex-wrap:wrap;border-top:1px solid var(--line-2);padding-top:22px;}
.case-stats .cs b{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:26px;color:var(--brand-deep);display:block;line-height:1.1;}
.case-stats .cs span{font-size:12px;color:var(--ink-3);}
.case-disc{text-align:center;margin-top:18px;font-size:12px;color:var(--ink-3);}

/* ===== COMPARE ===== */
.cmp-wrap{margin-top:50px;overflow-x:auto;border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--shadow);}
table.cmp{width:100%;border-collapse:collapse;font-size:14px;min-width:720px;background:#fff;}
table.cmp th,table.cmp td{padding:18px 18px;text-align:center;border-bottom:1px solid var(--line-2);}
table.cmp thead th{background:#f6f9fe;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:13px;color:var(--ink-2);vertical-align:bottom;}
table.cmp thead th.you{background:var(--grad);color:#fff;border-radius:14px 14px 0 0;font-size:15px;position:relative;}
table.cmp tbody td.you{background:#f0f6ff;}
table.cmp tbody tr:last-child td{border-bottom:none;}
table.cmp td:first-child,table.cmp th:first-child{text-align:left;font-weight:700;color:var(--ink);width:25%;background:#fbfcfe;}
table.cmp .ng{color:#b6c0d2;font-size:18px;}
table.cmp .tri{color:var(--ink-3);font-size:13px;}
table.cmp .ok{color:var(--good);font-weight:700;font-size:13px;display:inline-flex;align-items:center;gap:5px;}
table.cmp .ok .mk{font-size:16px;}
table.cmp td.you .price{font-family:"Zen Kaku Gothic New";font-weight:900;color:var(--brand-deep);font-size:16px;}
table.cmp small{display:block;font-size:11px;color:var(--ink-3);font-weight:500;margin-top:2px;}

/* ===== TRUST ===== */
#trust{background:var(--bg);}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:54px;}
.trust-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:34px 30px;box-shadow:var(--shadow-sm);transition:transform .3s,box-shadow .3s;}
.trust-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);}
.trust-ico{width:56px;height:56px;border-radius:16px;background:var(--grad);display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:20px;box-shadow:var(--shadow-brand);}
.trust-ico svg{width:28px;height:28px;}
.trust-card h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:18px;line-height:1.5;margin-bottom:12px;color:var(--ink);}
.trust-card p{font-size:14px;color:var(--ink-2);line-height:1.9;}

/* ===== PRICING ===== */
.loss{
  display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;
  margin-top:50px;background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:36px 44px;box-shadow:var(--shadow);
}
.loss .side{text-align:center;}
.loss .side .cap{font-size:12.5px;font-weight:700;color:var(--ink-3);margin-bottom:8px;}
.loss .side .amt{font-family:"Zen Kaku Gothic New";font-weight:900;line-height:1.05;}
.loss .side.bad .amt{font-size:clamp(32px,4.4vw,54px);color:var(--alert);letter-spacing:-.02em;}
.loss .side.good .amt{font-size:clamp(32px,4.4vw,54px);color:var(--brand-deep);letter-spacing:-.02em;}
.loss .side .sub{font-size:12px;color:var(--ink-3);margin-top:8px;line-height:1.6;}
.loss .vs{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:18px;color:#fff;background:var(--ink);width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.loss-note{text-align:center;margin-top:26px;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:clamp(17px,2.2vw,22px);color:var(--ink);}
.loss-note b{color:var(--brand);}

.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:46px;align-items:stretch;}
.plan{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:34px 28px;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);transition:transform .3s,box-shadow .3s;}
.plan:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);}
.plan.feat{border:2px solid var(--brand);box-shadow:var(--shadow-lg);position:relative;transform:scale(1.03);}
.plan.feat:hover{transform:scale(1.03) translateY(-6px);}
.plan.feat .ribbon-tag{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--grad);color:#fff;font-size:12px;font-weight:700;padding:6px 18px;border-radius:999px;font-family:"Zen Kaku Gothic New";box-shadow:var(--shadow-brand);white-space:nowrap;}
.plan h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:22px;color:var(--ink);}
.plan .for{font-size:12.5px;color:var(--ink-3);margin:6px 0 18px;}
.plan .price{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:34px;color:var(--brand-deep);line-height:1;}
.plan .price small{font-size:14px;font-weight:700;color:var(--ink-3);margin-left:3px;}
.plan .price .tax{display:block;font-size:11px;color:var(--ink-3);font-weight:500;margin-top:6px;}
.plan ul{list-style:none;margin:22px 0;display:flex;flex-direction:column;gap:12px;flex:1;}
.plan ul li{font-size:13.5px;color:var(--ink-2);display:flex;align-items:flex-start;gap:9px;line-height:1.6;}
.plan ul li svg{width:17px;height:17px;color:var(--brand);flex:none;margin-top:3px;}
.plan .btn{margin-top:6px;}

.more-plans{margin-top:30px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm);}
#ent-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 28px;background:none;border:none;cursor:pointer;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:15.5px;color:var(--ink);text-align:left;}
#ent-toggle .chev{width:28px;height:28px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;transition:transform .3s;flex:none;}
#ent-toggle .chev svg{width:16px;height:16px;color:var(--brand);}
#ent-toggle.open .chev{transform:rotate(180deg);}
#ent-panel{max-height:0;overflow:hidden;transition:max-height .4s ease;}
#ent-panel.open{max-height:420px;}
.ent-inner{padding:0 28px 28px;display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid var(--line-2);}
.ent-card{padding-top:24px;}
.ent-card h4{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:17px;color:var(--brand-deep);margin-bottom:6px;}
.ent-card .for{font-size:12px;color:var(--ink-3);margin-bottom:10px;}
.ent-card p{font-size:13.5px;color:var(--ink-2);line-height:1.85;}

.campaign{
  margin-top:34px;background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:24px 30px;
  display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;text-align:center;box-shadow:var(--shadow);
}
.campaign .tagk{background:var(--warn);color:#fff;font-size:12px;font-weight:700;padding:6px 14px;border-radius:999px;font-family:"Zen Kaku Gothic New";}
.campaign .txt{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:16px;}
.campaign .txt s{color:rgba(255,255,255,.5);}
.campaign .txt b{color:#7fd3ff;font-size:22px;}