/* =============================================================
   出田米 IDETA RICE ― Aboutページ専用スタイル（v11）
   site.css のデザイントークン（色・書体）を継承し、新しい色は追加しない。
   スマートフォン優先。装飾ではなく「読み進められること」を最優先に設計。
   ============================================================= */

/* ===== 共通レイアウト ===== */
.ab-sec{padding:clamp(74px,13vw,128px) 0}
.ab-sec.tight{padding-top:clamp(56px,9vw,88px)}
.ab-sec.paper2{background:var(--paper-2)}
.ab-wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 26px}
.ab-wrap.wide{max-width:var(--wide)}
.ab-label{font-family:var(--latin);font-size:13px;letter-spacing:.42em;text-transform:uppercase;color:var(--teal);font-weight:500;display:flex;align-items:center;gap:14px}
.ab-label::before{content:"";width:26px;height:1px;background:var(--teal);opacity:.6}
.ab-h2{font-family:var(--serif);font-weight:600;font-size:clamp(24px,6.6vw,36px);line-height:1.7;letter-spacing:.06em;margin-top:22px;color:var(--ink)}
.ab-lead{font-size:clamp(15.5px,4.2vw,17px);line-height:2.15;color:var(--ink-soft);margin-top:26px}
.ab-p{font-size:clamp(15px,4vw,16.5px);line-height:2.15;color:var(--ink-soft);margin-top:22px}
.ab-p.em{color:var(--ink);font-family:var(--serif);font-size:clamp(16px,4.4vw,18.5px);line-height:2.05;letter-spacing:.05em}
.ab-fig{margin:44px 0 0}
.ab-fig img{width:100%;border-radius:3px;display:block}
.ab-fig figcaption{font-family:var(--serif);font-size:12.5px;letter-spacing:.18em;color:var(--ink-faint);margin-top:13px;text-align:center}

/* ===== 01 Hero ===== */
.ab-hero{position:relative;overflow:hidden;color:#fff;display:flex;align-items:flex-end;min-height:clamp(460px,78svh,720px)}
.ab-hero .bg{position:absolute;inset:0}
.ab-hero .bg img{width:100%;height:100%;object-fit:cover;object-position:center 55%}
.ab-hero .veil{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(16,32,34,.42),rgba(16,32,34,.38) 40%,rgba(15,26,25,.74) 100%)}
.ab-hero .inner{position:relative;z-index:2;width:100%;padding:0 0 clamp(52px,9vw,88px)}
.ab-hero .ab-label{color:#fff}
.ab-hero .ab-label::before{background:#fff;opacity:.7}
.ab-hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(26px,7.4vw,46px);line-height:1.72;letter-spacing:.07em;margin-top:24px;text-shadow:0 2px 26px rgba(10,25,23,.45)}
.ab-hero .ab-sub{margin-top:26px;font-size:clamp(14.5px,3.9vw,16.5px);line-height:2.15;color:rgba(255,255,255,.93);font-weight:300;max-width:32em;text-shadow:0 1px 14px rgba(10,25,23,.5)}

/* ===== 02 創業ストーリー ===== */
.ab-quote{margin:38px 0 6px;padding:0 0 0 22px;border-left:2px solid var(--teal);font-family:var(--serif);font-size:clamp(18px,5.2vw,24px);line-height:1.95;letter-spacing:.06em;color:var(--ink)}
.ab-dialog{margin:36px 0 0;display:flex;flex-direction:column;gap:14px}
.ab-dialog p{background:var(--paper-2);border:1px solid var(--line);border-radius:3px;padding:18px 22px;font-size:clamp(14.5px,4vw,16px);line-height:2;color:var(--ink);letter-spacing:.04em}
.ab-dialog p::before{content:"";display:block;font-family:var(--latin);font-size:11px;letter-spacing:.28em;color:var(--teal);margin-bottom:6px}
.ab-dialog p.v1::before{content:"VOICE 01"}
.ab-dialog p.v2::before{content:"VOICE 02"}
.ab-list{margin:32px 0 0;list-style:none}
.ab-list li{font-family:var(--serif);font-size:clamp(16px,4.4vw,19px);line-height:2;letter-spacing:.08em;color:var(--ink);padding:5px 0 5px 20px;position:relative}
.ab-list li::before{content:"";position:absolute;left:0;top:1.05em;width:8px;height:1px;background:var(--teal)}
.ab-sign{margin-top:38px;font-family:var(--serif);font-size:17px;letter-spacing:.14em;color:var(--ink)}
.ab-sign .role{display:block;font-family:var(--sans);font-size:12px;letter-spacing:.26em;color:var(--teal);font-weight:500;margin-bottom:6px}

/* ===== 03 循環図 ===== */
.ab-cycle{margin:40px auto 0;max-width:520px;background:#fff;border:1px solid var(--line);border-radius:4px;padding:26px 18px 22px}
.ab-cycle svg{width:100%;height:auto;display:block}
.ab-cycle figcaption{font-size:12.5px;color:var(--ink-faint);letter-spacing:.06em;line-height:1.95;margin-top:16px;text-align:center}

/* ===== 04-06 Purpose / Vision / Mission（縦の物語） ===== */
.pvm{margin-top:14px;position:relative}
.pvm-item{position:relative;padding-left:34px;padding-bottom:clamp(48px,8vw,72px)}
.pvm-item::before{content:"";position:absolute;left:6px;top:14px;bottom:0;width:1px;background:var(--line)}
.pvm-item:last-child::before{display:none}
.pvm-item .dot{position:absolute;left:0;top:8px;width:13px;height:13px;border-radius:50%;background:var(--paper);border:1.5px solid var(--teal)}
.pvm-item .when{font-family:var(--sans);font-size:11.5px;letter-spacing:.3em;color:var(--ink-faint);display:block;margin-bottom:8px}
.pvm-item .ab-label{margin-bottom:0}
.pvm-item h2{font-family:var(--serif);font-weight:600;font-size:clamp(20px,5.4vw,27px);line-height:1.8;letter-spacing:.06em;color:var(--ink);margin-top:18px}
.pvm-item .ab-p{margin-top:20px}

/* ===== 07 Value Proposition ===== */
.ab-verses{margin:34px 0 0;border-left:1px solid var(--line);padding-left:26px}
.ab-verses p{font-family:var(--serif);font-size:clamp(17px,4.8vw,21px);line-height:2;letter-spacing:.08em;color:var(--ink);padding:8px 0}
.ab-acts{margin-top:36px;display:grid;grid-template-columns:1fr;gap:12px}
.ab-act{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--line);border-radius:3px;background:var(--paper);padding:19px 22px;transition:.4s}
.ab-act:hover,.ab-act:focus-visible{border-color:var(--teal);background:#fff}
.ab-act .at{font-family:var(--serif);font-size:16px;font-weight:600;letter-spacing:.06em;color:var(--ink)}
.ab-act .ad{display:block;font-family:var(--sans);font-size:12px;color:var(--ink-faint);margin-top:5px;letter-spacing:.04em;font-weight:400}
.ab-act .arw{font-family:var(--latin);color:var(--teal);font-size:20px}
@media(min-width:680px){.ab-acts{grid-template-columns:repeat(2,1fr)}}

/* ===== 08 Philosophy ===== */
.ab-philo{position:relative;overflow:hidden;color:#fff}
.ab-philo .bg{position:absolute;inset:0}
.ab-philo .bg img{width:100%;height:100%;object-fit:cover;object-position:center 50%}
.ab-philo .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(18,40,38,.66),rgba(16,34,32,.76))}
.ab-philo .inner{position:relative;z-index:2;padding:clamp(84px,15vw,150px) 0}
.ab-philo .ab-label{color:#fff}
.ab-philo .ab-label::before{background:#fff;opacity:.7}
.ab-philo .three{margin-top:30px;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .1em}
.ab-philo .three span{font-family:var(--serif);font-weight:500;font-size:clamp(34px,10.5vw,64px);line-height:1.5;letter-spacing:.1em;text-shadow:0 2px 26px rgba(0,0,0,.4)}
.ab-philo .ab-p{color:rgba(255,255,255,.92)}
.ab-philo .ab-p.em{color:#fff}

/* ===== 09 Values ===== */
.av-flow{margin-top:30px;display:flex;flex-wrap:wrap;gap:8px 12px;font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;color:var(--ink-faint)}
.av-flow span::after{content:"→";margin-left:12px;color:var(--teal)}
.av-flow span:last-child::after{content:""}
.av-list{margin-top:26px;border-top:1px solid var(--line)}
.av-item{display:flex;gap:clamp(16px,4vw,28px);align-items:flex-start;padding:30px 2px;border-bottom:1px solid var(--line)}
.av-item .no{font-family:var(--latin);font-size:clamp(26px,7vw,34px);line-height:1;color:var(--teal);font-weight:500;min-width:46px}
.av-item h3{font-family:var(--serif);font-size:clamp(17px,4.6vw,20px);font-weight:600;letter-spacing:.06em;color:var(--ink);line-height:1.7}
.av-item p{font-size:14.5px;line-height:2;color:var(--ink-soft);margin-top:10px;letter-spacing:.04em}

/* ===== 10 Company Profile ===== */
.ab-company{background:var(--paper-2)}
.cp-list{margin-top:34px}
.cp-list>div{display:flex;flex-direction:column;gap:4px;padding:20px 2px;border-bottom:1px solid var(--line)}
.cp-list>div:first-child{border-top:1px solid var(--line)}
.cp-list dt{font-family:var(--serif);font-size:12.5px;letter-spacing:.26em;color:var(--ink-faint)}
.cp-list dd{font-size:15.5px;line-height:1.95;color:var(--ink);letter-spacing:.04em}
.cp-list dd .addr{display:inline-block}
.cp-note{margin-top:24px;font-size:12.5px;color:var(--ink-faint);line-height:1.95;letter-spacing:.04em}
.cp-cta{margin-top:30px}
@media(min-width:680px){
  .cp-list>div{flex-direction:row;align-items:baseline;gap:28px}
  .cp-list dt{flex:0 0 168px;padding-top:2px}
  .cp-list dd{flex:1}
}

/* ===== 11 Corporate Statement ===== */
.ab-cs{position:relative;overflow:hidden;color:#fff;text-align:center}
.ab-cs .bg{position:absolute;inset:0}
.ab-cs .bg img{width:100%;height:100%;object-fit:cover;object-position:center 55%}
.ab-cs .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(18,40,38,.6),rgba(16,32,30,.74))}
.ab-cs .inner{position:relative;z-index:2;padding:clamp(96px,18vw,176px) 0}
.ab-cs .ab-label{justify-content:center;color:#fff}
.ab-cs .ab-label::before{background:#fff;opacity:.7}
.ab-cs h2{font-family:var(--serif);font-weight:500;font-size:clamp(25px,7vw,42px);line-height:1.85;letter-spacing:.08em;margin-top:26px;text-shadow:0 2px 24px rgba(0,0,0,.4)}
.ab-cs p{max-width:30em;margin:30px auto 0;font-size:15px;line-height:2.25;color:rgba(255,255,255,.93);font-weight:300}

/* ===== 12 最終CTA ===== */
.ab-final{background:var(--paper);text-align:center}
.ab-final .btns{margin-top:32px;display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.ab-final .btns .btn{min-width:210px}
@media(max-width:480px){.ab-final .btns .btn{width:100%;min-width:0}}

/* ===== 読みやすさの微調整 ===== */
@media(max-width:480px){
  .ab-sec{padding:64px 0}
  .ab-quote{padding-left:18px}
}

/* ===== アンカー位置（stickyヘッダー分） ===== */
section[id],figure[id]{scroll-margin-top:84px}
