/*
 * CAPSORISM v2 — /about/creed/ only (loaded by inc/capsorism.php, after the TOP header/footer CSS).
 * Values are the final cascade of docs/capsorism-v2/reference/capsorism-v2.html (frozen reference).
 * Every selector is under .capsorism, so nothing leaks to other pages or to the TOP.
 */
body.capsor-creed {
  --cr-ink:#0f1c25; --cr-muted:#68747d; --cr-edge:#dce2e4; --cr-accent:#ef501f;
  --cr-ease:cubic-bezier(.22,1,.36,1);
  --cr-gutter:clamp(24px,6.6vw,108px); --cr-max:1440px;
}
@media(max-width:760px){ body.capsor-creed { --cr-gutter:24px; } }

/* The reference prints a "補足説明" label for review; the template outputs it for non-production editors only. */
.capsorism .cr-explain-label { display:block; }
body.capsorism-marks .capsorism [data-copy-kind="official"] { outline:1px dashed #2f7d4f; outline-offset:6px; }
body.capsorism-marks .capsorism .cr-explain { outline:1px dashed #b86a1c; outline-offset:6px; }
body.capsorism-marks .capsorism [data-copy-kind="logo-story"] { outline:1px dashed #6b5ca5; outline-offset:4px; }

body.capsor-creed .capsorism { color:var(--cr-ink); line-height:1.8; }
.capsorism h1, .capsorism h2, .capsorism h3, .capsorism p { margin:0; }

/* HERO */
.capsorism .cr-hero { position:relative; overflow:hidden; isolation:isolate; background:#0e1d29; color:#fff; }
.capsorism .cr-hero::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.38; z-index:-1;
  background:radial-gradient(circle at 87% 25%,#29475c 0%,transparent 37%),linear-gradient(135deg,#10253300 10%,#050e15b0 100%); }
.capsorism .cr-hero-inner { max-width:var(--cr-max); margin:auto; display:flex; flex-direction:column; justify-content:center;
  padding:49px var(--cr-gutter) 72px; position:relative; }
.capsorism .cr-gauge { position:absolute; z-index:0; top:13%; right:-13%; width:min(65vw,890px); aspect-ratio:1; pointer-events:none; opacity:.48; }
.capsorism .cr-gauge .track { fill:none; stroke:#668493; stroke-width:1.2; stroke-dasharray:3 11; opacity:.65; }
.capsorism .cr-gauge .stroke { fill:none; stroke:#e96034; stroke-width:5; stroke-linecap:round; stroke-dasharray:420; stroke-dashoffset:160; opacity:.65; }
.capsorism .cr-gauge .beam { fill:none; stroke:#f16b48; stroke-width:4; opacity:.45; }
.capsorism .cr-breadcrumb { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:13px; align-items:center;
  font:11px/1.6 Arial,sans-serif; letter-spacing:.09em; color:#b1c0c8; margin:0 0 30px; }
.capsorism .cr-breadcrumb a { min-height:28px; display:inline-flex; align-items:center; }
.capsorism .cr-breadcrumb a:hover { color:#fff; }
.capsorism .cr-breadcrumb .slash { color:#57727e; }
.capsorism .cr-identity { position:relative; z-index:1; padding-bottom:28px; border-bottom:1px solid #7891a03d; max-width:1100px; }
.capsorism .cr-title { position:relative; z-index:2; font:700 clamp(36px,4.4vw,64px)/1 Arial,sans-serif; letter-spacing:-.035em; } /* review: thinner and smaller than the reference */
.capsorism .cr-identity-sub { font-size:13px; letter-spacing:.15em; color:#b7c9d2; margin-top:12px; }
.capsorism .cr-creed-hero { position:relative; z-index:1; margin-top:35px; max-width:990px; }
.capsorism .cr-category { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.capsorism .cr-category::before { content:""; width:24px; height:2px; background:var(--cr-accent); }
.capsorism .cr-category h2 { font:700 13px/1.4 Arial,sans-serif; letter-spacing:.16em; }
.capsorism .cr-category .jp-label { font-size:11px; font-weight:500; letter-spacing:.09em; color:#a9bec9; }
.capsorism .cr-creed-en { display:block; font:italic 800 clamp(46px,7.2vw,104px)/1.14 Arial,sans-serif; letter-spacing:-.055em; margin:21px 0 9px; }
.capsorism .cr-creed-en em { font-style:inherit; color:#ff7144; }
.capsorism .cr-creed-jp { font-size:clamp(26px,3.1vw,46px); font-weight:800; line-height:1.6; letter-spacing:-.025em; }
.capsorism .cr-explain { margin-top:26px; border-left:1px solid #c5cfd3; padding-left:18px; max-width:720px; }
.capsorism .cr-explain-label { font-size:10px; font-weight:500; letter-spacing:.08em; color:#6f7c86; margin-bottom:7px; }
.capsorism .cr-explain p { font-size:15px; line-height:2.15; color:#51636e; font-weight:400; }
.capsorism .cr-hero .cr-explain { border-color:#637c895c; max-width:655px; }
.capsorism .cr-hero .cr-explain-label { color:#97afb9; }
.capsorism .cr-hero .cr-explain p { font-size:14px; color:#cfdae0; line-height:2; }

/* PAGE INDEX */
.capsorism .cr-index { background:#fff; border-bottom:1px solid var(--cr-edge); }
.capsorism .cr-index-inner { max-width:var(--cr-max); margin:auto; padding:19px var(--cr-gutter); display:flex; gap:25px; align-items:center; }
.capsorism .cr-index small { font:10px Arial,sans-serif; letter-spacing:.12em; color:#7b8990; flex:none; }
.capsorism .cr-index nav { display:flex; gap:32px; flex-wrap:wrap; align-items:center; }
.capsorism .cr-index a { font:600 12px/1.7 Arial,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans CJK JP","Yu Gothic",Meiryo,sans-serif;
  color:#495b65; min-height:30px; display:inline-flex; align-items:center; gap:12px; }
.capsorism .cr-index a span { color:#a94b2c; font-size:12px; }
.capsorism .cr-index a:hover { color:var(--cr-accent); }

/* shared */
.capsorism .cr-wrap { max-width:var(--cr-max); margin:0 auto; padding:0 var(--cr-gutter); }
.capsorism .cr-flag { display:flex; align-items:center; gap:18px; color:var(--cr-muted); font:700 11px/1.5 Arial,sans-serif; letter-spacing:.15em; text-transform:uppercase; }
.capsorism .cr-flag span { font-weight:800; color:var(--cr-accent); }

/* PURPOSE / VISION */
.capsorism .cr-pv { background:#fff; }
.capsorism .cr-statement { padding:96px 0 99px; display:grid; grid-template-columns:220px minmax(0,1fr); gap:55px; }
.capsorism .cr-statement + .cr-statement { border-top:1px solid var(--cr-edge); }
.capsorism .cr-statement-label .cr-flag { gap:12px; }
.capsorism .cr-statement-label h2 { font:700 30px/1.3 Arial,sans-serif; letter-spacing:-.025em; margin-top:17px; }
.capsorism .cr-statement-jp { font-size:12px; letter-spacing:.1em; color:#62727d; margin-top:7px; }
.capsorism .cr-statement-body { min-width:0; }
.capsorism .cr-statement-original { font-size:clamp(27px,2.6vw,38px); line-height:1.7; letter-spacing:-.035em; font-weight:700; }
.capsorism .cr-line { display:block; }
.capsorism .cr-accent { color:#d74922; }
.capsorism .cr-statement-body .cr-explain { margin-top:29px; }

/* VALUES */
.capsorism .cr-values { padding:100px 0 108px; background:#f5f7f6; }
.capsorism .cr-values-header { display:flex; justify-content:space-between; align-items:start; gap:40px; }
.capsorism .cr-values-heading { font:700 48px/1.1 Arial,sans-serif; letter-spacing:-.04em; margin:20px 0 11px; }
.capsorism .cr-values-sub { font-size:17px; font-weight:500; letter-spacing:.08em; }
.capsorism .cr-values-lead { font-size:13px; line-height:2; color:#53636c; max-width:360px; margin-top:28px; }
.capsorism .cr-values-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:46px; }
.capsorism .cr-value-card { min-height:330px; background:#fff; position:relative; padding:35px 36px 38px; overflow:hidden;
  border:1px solid #dce3e6; display:flex; flex-direction:column; justify-content:flex-start; }
.capsorism .cr-value-card::before { content:""; position:absolute; top:0; left:0; height:3px; width:100%; background:#ed612f; }
.capsorism .cr-value-no { font:900 87px/.85 Arial,sans-serif; letter-spacing:-.1em; color:#ecf0f1; position:absolute; right:25px; top:25px; }
.capsorism .cr-value-en { font:600 10px/1.5 Arial,sans-serif; color:#556d7a; letter-spacing:.14em; z-index:1; }
.capsorism .cr-value-copy { position:relative; z-index:1; margin-top:61px; }
.capsorism .cr-value-copy h3 { font-size:clamp(22px,2.05vw,30px); line-height:1.5; letter-spacing:-.04em; }
.capsorism .cr-value-card .cr-explain { max-width:none; border:0; padding:0; margin-top:16px; }
.capsorism .cr-value-card .cr-explain-label { margin-bottom:5px; }
.capsorism .cr-value-card .cr-explain p { font-size:14px; line-height:2.1; color:#51616a; }

/* LOGO */
.capsorism .cr-logo { background:#f1eee8; overflow:hidden; }
.capsorism .cr-logo-grid { max-width:var(--cr-max); margin:auto; display:grid; grid-template-columns:1fr 1fr; min-height:480px; }
.capsorism .cr-logo-copy { padding:85px 50px 85px var(--cr-gutter); display:flex; flex-direction:column; justify-content:center; }
.capsorism .cr-logo-copy h2 { font-size:clamp(26px,3.05vw,42px); font-weight:800; line-height:1.5; letter-spacing:-.04em; margin:25px 0; }
.capsorism .cr-logo-copy p { font-size:14px; line-height:2.2; max-width:430px; margin:0 0 15px; }
.capsorism .cr-logo-art { position:relative; min-height:480px; background:#efe7df; display:grid; place-items:center; overflow:hidden; }
.capsorism .cr-logo-art img { width:clamp(150px,16vw,228px); height:auto; padding:clamp(18px,2vw,28px); background:#fff; border-radius:12px; box-shadow:0 20px 50px #241b141f; } /* review: the page's official logo mark (white-backed PNG) as a tile instead of the illustration */

/* BUSINESS */
.capsorism .cr-work { background:#101d26; color:#fff; padding:87px 0 95px; overflow:hidden; }
.capsorism .cr-flag-dark { color:#a9bdc6; }
.capsorism .cr-work-heading { font-size:clamp(29px,3vw,43px); font-weight:800; line-height:1.55; letter-spacing:-.05em; margin:22px 0 20px; }
.capsorism .cr-work-lead { font-size:14px; line-height:2; max-width:680px; color:#b4c4cb; }
.capsorism .cr-work-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:17px; margin-top:33px; }
.capsorism .cr-work-item { min-width:0; display:flex; }
.capsorism .cr-work-card { position:relative; flex:1; display:flex; flex-direction:column; overflow:hidden;
  background:linear-gradient(145deg,#284457,#192f40); border:1px solid #3b4d59; transition:transform .4s var(--cr-ease),border-color .4s; }
/* review: same photos as the TOP business cards */
.capsorism .cr-work-photo { display:block; position:relative; height:clamp(150px,13vw,200px); overflow:hidden; background:#1d2a30; }
.capsorism .cr-work-photo img { display:block; width:100%; height:100%; object-fit:cover; filter:saturate(.76) contrast(1.03); }
.capsorism .cr-work-photo.is-real img { filter:none; }
.capsorism .cr-work-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,22,30,.18),transparent 45%,rgba(10,22,30,.45)); }
.capsorism .cr-work-body { flex:1; display:flex; flex-direction:column; justify-content:space-between; min-height:200px; padding:26px 26px 24px; }
.capsorism .cr-work-item:nth-child(2) .cr-work-card { background:linear-gradient(135deg,#263843,#182831); }
.capsorism .cr-work-item:nth-child(3) .cr-work-card { background:linear-gradient(135deg,#3a3431,#1b262b); }
.capsorism .cr-work-card:hover, .capsorism .cr-work-card:focus-visible { transform:translateY(-8px); border-color:#f37a50; }
.capsorism .cr-work-card .number { font:900 49px/.8 Arial,sans-serif; color:#ffffff24; }
.capsorism .cr-work-card h3 { font-size:clamp(18px,1.6vw,23px); line-height:1.6; margin-top:30px; }
.capsorism .cr-work-card p { color:#c1cdd3; font-size:12px; line-height:1.9; margin-top:8px; }
.capsorism .cr-work-card .goto { color:#ff956f; margin-top:24px; font-size:11px; display:flex; align-items:center; justify-content:space-between; }
.capsorism .cr-work-card .goto span:last-child { font-size:20px; }

/* RELATED */
.capsorism .cr-next { padding:59px 0 66px; background:#fff; text-align:center; }
.capsorism .cr-next h2 { font-size:24px; font-weight:600; line-height:1.6; letter-spacing:0; margin:0 0 24px; }
.capsorism .cr-next-links { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; }
.capsorism .cr-next-link { min-width:190px; padding:16px 22px; background:var(--cr-ink); color:#fff; border-radius:50px; font-size:12px; font-weight:700; }
.capsorism .cr-next-link.secondary { background:#f1f3f3; color:#25353d; }
.capsorism .cr-next-link:hover { background:var(--cr-accent); color:#fff; }

@media(min-width:1600px){
  .capsorism .cr-gauge { right:-4%; width:760px; }
  .capsorism .cr-hero-inner { padding-top:57px; padding-bottom:66px; }
}
@media(max-width:1100px){
  .capsorism .cr-creed-en { font-size:clamp(46px,7.2vw,86px); }
  .capsorism .cr-gauge { width:78vw; right:-28%; opacity:.43; }
  .capsorism .cr-statement { grid-template-columns:170px minmax(0,1fr); gap:34px; }
  .capsorism .cr-value-card { padding:29px 29px 33px; }
  .capsorism .cr-value-copy h3 { font-size:24px; }
  .capsorism .cr-work-body { padding:23px 20px; }
}
@media(max-width:940px){
  .capsorism .cr-gauge { top:14%; }
  .capsorism .cr-logo-copy { padding:65px 33px 65px var(--cr-gutter); }
  .capsorism .cr-logo-art { min-height:430px; }
}
@media(max-width:760px){
  .capsorism .cr-hero-inner { padding:28px 24px 48px; }
  .capsorism .cr-breadcrumb { font-size:9px; margin-bottom:23px; gap:9px; }
  .capsorism .cr-title { font-size:clamp(32px,8.4vw,44px); line-height:1; letter-spacing:-.035em; }
  .capsorism .cr-identity { padding-bottom:23px; }
  .capsorism .cr-identity-sub { font-size:11px; margin-top:11px; }
  .capsorism .cr-creed-hero { margin-top:27px; }
  .capsorism .cr-category { gap:12px; }
  .capsorism .cr-category h2 { font-size:11px; }
  .capsorism .cr-category .jp-label { font-size:10px; }
  .capsorism .cr-category::before { width:17px; }
  .capsorism .cr-creed-en { font-size:clamp(42px,11.4vw,66px); line-height:1.1; letter-spacing:-.05em; margin:20px 0 15px; }
  .capsorism .cr-creed-en .drive, .capsorism .cr-creed-en em { display:block; }
  .capsorism .cr-creed-en em { margin-top:2px; }
  .capsorism .cr-creed-jp { font-size:clamp(21px,6vw,32px); line-height:1.55; letter-spacing:-.04em; }
  .capsorism .cr-hero .cr-explain { margin-top:24px; padding-left:13px; }
  .capsorism .cr-hero .cr-explain p { font-size:13px; line-height:2.1; }
  .capsorism .cr-explain-label { font-size:9px; }
  .capsorism .cr-gauge { width:510px; right:-315px; top:18%; opacity:.23; }
  .capsorism .cr-index-inner { padding:13px 24px; display:block; }
  .capsorism .cr-index small { font-size:9px; display:block; margin-bottom:7px; }
  .capsorism .cr-index nav { gap:5px 18px; }
  .capsorism .cr-index a { font-size:11px; gap:7px; }
  .capsorism .cr-statement { display:block; padding:61px 0 62px; }
  .capsorism .cr-statement-label .cr-flag { font-size:9px; gap:9px; }
  .capsorism .cr-statement-label h2 { font-size:25px; margin-top:13px; display:inline-block; }
  .capsorism .cr-statement-jp { display:inline-block; margin:0 0 0 13px; font-size:11px; }
  .capsorism .cr-statement-body { margin-top:27px; }
  .capsorism .cr-statement-original { font-size:clamp(23px,5.9vw,32px); line-height:1.75; letter-spacing:-.025em; }
  .capsorism .cr-statement-original .cr-line { display:inline; }
  .capsorism .cr-statement-original .cr-accent { display:block; }
  .capsorism .cr-vision-original .cr-line { display:block; }
  .capsorism .cr-statement-body .cr-explain { margin-top:23px; padding-left:13px; }
  .capsorism .cr-explain p { font-size:13px; line-height:2.05; }
  .capsorism .cr-values { padding:65px 0 67px; }
  .capsorism .cr-values-header { display:block; }
  .capsorism .cr-values-heading { font-size:39px; line-height:1.2; margin:17px 0 9px; }
  .capsorism .cr-values-sub { font-size:14px; }
  .capsorism .cr-values-lead { max-width:none; font-size:12px; margin-top:19px; }
  .capsorism .cr-values-grid { grid-template-columns:1fr; margin-top:28px; gap:16px; }
  .capsorism .cr-value-card { min-height:280px; padding:26px 24px 29px; }
  .capsorism .cr-value-en { font-size:9px; }
  .capsorism .cr-value-no { font-size:68px; top:23px; right:20px; }
  .capsorism .cr-value-copy { margin-top:41px; }
  .capsorism .cr-value-copy h3 { font-size:clamp(21px,5.7vw,27px); letter-spacing:-.045em; line-height:1.55; }
  .capsorism .cr-value-card .cr-explain { margin-top:14px; }
  .capsorism .cr-value-card .cr-explain p { font-size:13px; line-height:2.1; }
  .capsorism .cr-logo-grid { grid-template-columns:1fr; }
  .capsorism .cr-logo-copy { padding:60px 24px 35px; }
  .capsorism .cr-logo-copy h2 { font-size:28px; margin:19px 0 21px; }
  .capsorism .cr-logo-copy p { font-size:13px; max-width:none; line-height:2.1; }
  .capsorism .cr-logo-art { min-height:310px; }
  .capsorism .cr-logo-art img { width:150px; padding:18px; }
  .capsorism .cr-work { padding:62px 0 65px; }
  .capsorism .cr-work-heading { font-size:28px; margin-top:20px; }
  .capsorism .cr-work-lead { font-size:13px; }
  .capsorism .cr-work-grid { grid-template-columns:1fr; margin-top:28px; gap:12px; }
  .capsorism .cr-work-body { min-height:0; padding:23px 24px; display:block; }
  .capsorism .cr-work-photo { height:clamp(160px,46vw,240px); }
  .capsorism .cr-work-card .number { display:block; font-size:33px; line-height:1; }
  .capsorism .cr-work-card h3 { font-size:22px; margin-top:15px; }
  .capsorism .cr-work-card .goto { margin-top:19px; }
  .capsorism .cr-next { padding:42px 0 48px; }
  .capsorism .cr-next h2 { font-size:21px; margin-bottom:20px; }
  .capsorism .cr-next-links { gap:10px; }
  .capsorism .cr-next-link { min-width:0; width:100%; font-size:12px; padding:14px 18px; }
}
@media(max-width:700px){
  .capsorism .cr-next-links { flex-direction:column; }
}
@media(prefers-reduced-motion:reduce){
  .capsorism .cr-work-card { transition:none; }
  .capsorism .cr-work-card:hover, .capsorism .cr-work-card:focus-visible { transform:none; }
}
@media print{
  .capsorism .cr-hero, .capsorism .cr-logo, .capsorism .cr-work { print-color-adjust:exact; -webkit-print-color-adjust:exact; }
}