/* sma-resu.com 共通シェル
   ここは「ヘッダー・フッター・余白・タイポの土台」だけを持つ。
   MVやセクションの意匠はデザイナー納品物が持ち込むため、
   ここでは汎用セレクタ（h1{} .title{} 等の素当て）を使わない。 */

:root{
  --ink:#0D1B2A;
  --ink-mute:#5A6672;
  --accent:#0D4F8B;
  --line:#E4E8EC;
  --tint:#F5F7F9;
  --max:1200px;
  --header-h:72px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:'Noto Sans JP',-apple-system,BlinkMacSystemFont,'Hiragino Sans',sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.8;
  font-size:16px;
  font-feature-settings:"palt";
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}

.inner{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:24px}
.inner.narrow{max-width:820px}

.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:#fff;padding:8px 12px;z-index:1000}

/* ── header ── */
.site-header{
  position:sticky;top:0;z-index:100;height:var(--header-h);
  background:rgba(255,255,255,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.site-header .inner{height:100%;display:flex;align-items:center;gap:24px}
.site-header .brand{font-weight:900;font-size:19px;letter-spacing:.02em;text-decoration:none}
.gnav{margin-left:auto;overflow-x:auto}
.gnav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;white-space:nowrap}
.gnav a{font-size:14px;font-weight:500;text-decoration:none;color:var(--ink-mute);padding-block:6px}
.gnav a:hover{color:var(--accent)}
.gnav a[aria-current="page"]{color:var(--ink);font-weight:700;box-shadow:inset 0 -2px 0 var(--accent)}

.cta{
  display:inline-block;background:var(--accent);color:#fff;text-decoration:none;
  font-weight:700;padding:14px 30px;border-radius:6px;font-size:15px;
}
.cta:hover{opacity:.88}
.cta--sm{padding:9px 18px;font-size:13px;flex:0 0 auto}

/* ── MV placeholder（8/19-20 のデザイン納品で丸ごと置き換わる） ── */
.mv--placeholder{padding:80px 0 72px;border-bottom:1px solid var(--line)}
.mv--placeholder .eyebrow{margin:0 0 12px;font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--accent)}
.mv--placeholder h1{margin:0 0 20px;font-size:clamp(28px,4.4vw,46px);line-height:1.42;font-weight:900;letter-spacing:-.02em}
.mv--placeholder h1 .sub{font-size:.5em;font-weight:500;color:var(--ink-mute);letter-spacing:0}
.mv--placeholder .lead{margin:0 0 32px;max-width:44em;color:var(--ink-mute);font-size:16px}
.mv--placeholder .cta-row{margin:0}

/* ── section ── */
.section{padding:72px 0}
.section--tint{background:var(--tint)}
.section h2{margin:0 0 24px;font-size:24px;font-weight:900;letter-spacing:-.01em}
.section p{margin:0 0 16px}
.note{font-size:14px;color:var(--ink-mute)}

/* ── product cards ── */
.cards{list-style:none;margin:0;padding:0;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.cards a{
  display:flex;flex-direction:column;gap:8px;height:100%;
  padding:24px;background:#fff;border:1px solid var(--line);border-radius:10px;
  text-decoration:none;transition:border-color .15s,transform .15s;
}
.cards a:hover{border-color:var(--accent);transform:translateY(-2px)}
.cards strong{font-size:16px;font-weight:700}
.cards span{font-size:14px;line-height:1.75;color:var(--ink-mute)}

/* ── footer ── */
.site-footer{border-top:1px solid var(--line);padding:48px 0;margin-top:24px;background:var(--tint)}
.site-footer .brand{font-weight:900;font-size:17px;margin:0 0 18px}
.fnav{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;margin:0 0 14px;padding:0}
.fnav a{font-size:14px;text-decoration:none;color:var(--ink-mute)}
.fnav a:hover{color:var(--accent)}
.fnav--sub a{font-size:13px}
.copy{margin:22px 0 0;font-size:12px;color:var(--ink-mute)}

@media (max-width:820px){
  .site-header .inner{gap:14px;padding-inline:16px}
  .gnav{margin-left:0;order:3;width:100%;overflow:visible}
  .gnav ul{flex-wrap:wrap;white-space:normal;gap:10px 18px}
  .site-header{height:auto;position:static}
  .site-header .inner{flex-wrap:wrap;padding-block:12px}
  .inner{padding-inline:16px}
  .mv--placeholder{padding:48px 0 44px}
  .section{padding:48px 0}
}

/* ── FAQ ── */
.page-title{margin:0 0 36px;font-size:30px;font-weight:900;letter-spacing:-.02em}
.qa{padding:26px 0;border-bottom:1px solid var(--line)}
.qa:first-of-type{border-top:1px solid var(--line)}
.qa .q{margin:0 0 10px;font-size:17px;font-weight:700;line-height:1.6}
.qa .a{margin:0;color:var(--ink-mute)}

/* ── /local-llm 用コンポーネント（トークン駆動・KV確定後は :root だけ触れば追従する） ── */
.sec-lead{margin:-8px 0 28px;color:var(--ink-mute);max-width:52em}
.numlist{list-style:none;counter-reset:n;margin:0;padding:0;display:grid;gap:14px}
.numlist li{counter-increment:n;display:grid;grid-template-columns:44px 1fr;gap:4px 16px;padding:22px 24px;background:#fff;border:1px solid var(--line);border-radius:10px}
.numlist li::before{content:counter(n,decimal-leading-zero);grid-row:span 2;font-size:20px;font-weight:900;color:var(--accent);opacity:.5;line-height:1.4}
.numlist strong{font-size:16px;font-weight:700}
.numlist span{font-size:14px;line-height:1.8;color:var(--ink-mute)}
.roles{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.role{padding:28px;border:1px solid var(--line);border-radius:10px;background:#fff}
.role__name{margin:0 0 6px;font-size:17px;font-weight:900}
.role__tag{display:inline-block;margin:0 0 12px;padding:3px 12px;border-radius:999px;background:var(--accent);color:#fff;font-size:12px;font-weight:700}
.role__desc{margin:0;font-size:14px;line-height:1.8;color:var(--ink-mute)}
.cards li.card--static{display:flex;flex-direction:column;gap:8px;padding:24px;background:#fff;border:1px solid var(--line);border-radius:10px}
.cards li.card--static strong{font-size:16px;font-weight:700}
.cards li.card--static span{font-size:14px;line-height:1.75;color:var(--ink-mute)}
.levels{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.level{padding:28px;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:10px;background:#fff}
.level__name{margin:0 0 4px;font-size:17px;font-weight:900}
.level__for{margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--accent)}
.level__desc{margin:0;font-size:14px;line-height:1.8;color:var(--ink-mute)}

/* ── /company /news（配色はヘッダー／フッター／MVと同じ #0171ea 系に揃える） ── */
.co-eyebrow{margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.14em;color:#0171ea}
/* hero: 青のグラデーション＋浮遊するイラスト（ブレクサ提案資料の illust_hero を流用） */
.co-hero{position:relative;overflow:hidden;padding:88px 0 72px;color:#fff;background:linear-gradient(118deg,#0a48b8 0%,#0171ea 52%,#2f93ff 100%)}
.co-hero__bg{position:absolute;inset:0;pointer-events:none}
.co-hero__orb{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;background:radial-gradient(circle,#9fd0ff 0%,rgba(159,208,255,0) 70%)}
.co-hero__orb--1{width:520px;height:520px;top:-180px;left:-120px;animation:co-drift 16s ease-in-out infinite}
.co-hero__orb--2{width:640px;height:640px;right:-200px;bottom:-320px;background:radial-gradient(circle,#ffffff 0%,rgba(255,255,255,0) 70%);opacity:.28;animation:co-drift 20s ease-in-out infinite reverse}
.co-hero__dots{position:absolute;inset:0;opacity:.22;background-image:radial-gradient(rgba(255,255,255,.55) 1px,transparent 1.5px);background-size:26px 26px;mask-image:linear-gradient(90deg,transparent 0,#000 45%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 45%,#000 100%)}
.co-hero__in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,520px);gap:40px;align-items:center}
.co-hero__eyebrow{margin:0 0 14px;font-size:12px;font-weight:700;letter-spacing:.18em;color:#bfe0ff}
.co-hero h1{margin:0 0 20px;font-size:clamp(34px,4.6vw,52px);line-height:1.3;font-weight:900;letter-spacing:-.02em}
.co-hero__lead{margin:0;max-width:34em;font-size:16px;line-height:1.9;color:rgba(255,255,255,.9)}
.co-hero__art{width:100%;height:auto;filter:drop-shadow(0 24px 40px rgba(6,40,100,.35));animation:co-float 6s ease-in-out infinite}
@keyframes co-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes co-drift{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,28px)}}
/* profile / member / cta */
.co-table{margin:0;border-top:1px solid var(--line)}
.co-table>div{display:grid;grid-template-columns:150px 1fr;gap:4px 24px;padding:18px 0;border-bottom:1px solid var(--line)}
.co-table dt{margin:0;font-size:14px;font-weight:700}
.co-table dd{margin:0;font-size:15px;line-height:1.8}
.co-table dd small{display:block;margin-top:4px;font-size:13px;line-height:1.7;color:var(--ink-mute)}
.co-table a,.co-about a{color:#0171ea;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.co-table a:hover,.co-about a:hover{color:#0160c8}
.co-biz{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.co-biz li{display:grid;grid-template-columns:150px 1fr;gap:2px 16px}
.co-biz strong{font-size:14px;font-weight:700;color:#0171ea}
.co-biz span{font-size:14px;line-height:1.75;color:var(--ink-mute)}
.co-people{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.co-person{padding:32px;border:1px solid var(--line);border-top:4px solid #0171ea;border-radius:12px;background:#fff}
.co-person img{width:104px;height:104px;margin:0 0 18px;border-radius:50%;object-fit:cover}
.co-person__role{margin:0 0 4px;font-size:12px;font-weight:700;letter-spacing:.06em;color:#0171ea}
.co-person h3{margin:0 0 12px;font-size:20px;font-weight:900;letter-spacing:-.01em}
.co-person p{margin:0;font-size:14px;line-height:1.9;color:var(--ink-mute)}
.co-cta{padding:72px 0;text-align:center;color:#fff;background:linear-gradient(118deg,#0a48b8 0%,#0171ea 60%,#2f93ff 100%)}
.co-cta h2{margin:0 0 10px;font-size:26px;font-weight:900}
.co-cta p{margin:0 0 24px;color:rgba(255,255,255,.88)}
.co-cta .cta{padding:15px 36px;border-radius:999px;background:#fff;color:#0171ea;font-size:15px}
.co-cta .cta:hover{opacity:1;background:#eaf3ff}
/* news */
/* お知らせ: 1画面目に一覧が見えるよう、見出しと注意書きは薄く（2026-09-09 土戸指摘） */
.nw-hero{padding:34px 0 24px}
.nw-hero .eyebrow{margin:0 0 6px}
.nw-hero h1{margin:0 0 6px;font-size:30px}
.nw-hero .lead{margin:0;font-size:14px}
.nw-section{padding:20px 0 72px}
.nw-notice{margin:16px 0 0!important;padding:0 0 0 12px;border-left:2px solid #cfe0f5;font-size:12px;line-height:1.75;color:#8698ad}
.nw-notice b{margin-right:8px;font-weight:700;color:#40536b}
.nw-hero .nw-notice{max-width:none}
@media (max-width:900px){.nw-notice .pc{display:none}}
.nw-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.nw-item{border-bottom:1px solid var(--line)}
.nw-item>a,.nw-item>div{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:start;padding:22px 0;text-decoration:none;color:inherit}
.nw-item>a:hover .nw-item__title{color:#0171ea}
.nw-item__img{width:100%;aspect-ratio:1200/630;object-fit:cover;border:1px solid var(--line);border-radius:8px;background:#f4f8fc}
.nw-item__meta{display:flex;align-items:center;gap:12px;margin:0 0 8px}
.nw-item time{font-size:13px;color:var(--ink-mute);font-variant-numeric:tabular-nums}
.nw-cat{display:inline-block;padding:1px 12px;border:1px solid #0171ea;border-radius:999px;font-size:11px;font-weight:700;line-height:1.8;color:#0171ea}
.nw-cat--seminar{border-color:#1a9c6b;color:#1a9c6b}
.nw-cat--release{border-color:#d9822b;color:#d9822b}
.nw-cat--event{border-color:#7a4fd6;color:#7a4fd6}
.nw-item__title{margin:0;font-size:16px;font-weight:700;line-height:1.7}
.nw-item__ext{margin:8px 0 0;font-size:12px;color:var(--ink-mute)}
@media (max-width:900px){
  .co-hero{padding:56px 0 40px}
  .co-hero__in{grid-template-columns:1fr;gap:24px}
  .co-hero__art{max-width:440px;margin:0 auto}
}
@media (max-width:640px){
  .co-table>div{grid-template-columns:1fr;gap:2px}
  .co-biz li{grid-template-columns:1fr}
  .co-person{padding:24px}
  .nw-item>a,.nw-item>div{grid-template-columns:1fr;gap:12px}
  .nw-item__img{max-width:320px}
  .nw-hero{padding:24px 0 18px}
}
@media (prefers-reduced-motion:reduce){
  .co-hero__art,.co-hero__orb{animation:none}
}
