:root {
    --paper: #f6f5f1;        /* 製図用紙 */
    --paper-deep: #efeee8;
    --ink: #1b201c;          /* 緑がかった墨 */
    --ink-muted: #5a615b;
    --rule: #d9dad1;         /* 罫線 */
    --rule-strong: #b9bcae;
    --green: #2f9e4d;        /* 機械緑（ポップ寄りに明るく） */
    --green-deep: #23803c;
    --green-dark: #17251b;   /* 暗部パネル */
    --line-art: #b9d4bb;     /* 線画の色 */
    /* 事業カラーコード（ストリップ・タグ・カードで共通） */
    --c-fa: #f08c1e;
    --c-media: #2f9e4d;
    --c-app: #3b82d8;
    --c-dev: #2a9d8f;
    --c-consul: #8b6fd0;
    --c-event: #d9566e;
    --c-crn: #2a9d8f;
    --c-note: #64748b;
    --sans: "IBM Plex Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
    --mono: "IBM Plex Mono", ui-monospace, monospace;
    --disp: "Archivo", "IBM Plex Sans JP", sans-serif;
    --container: 72rem;
    --header-h: 64px;
  }
  * { margin: 0; padding: 0; box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { font-family: var(--sans); color: var(--ink); background: var(--paper); line-height: 1.8; overflow-x: clip; }
  img, svg { display: block; }
  a { color: inherit; text-decoration: none; }
  ul { list-style: none; }
  :focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
  .container { max-width: var(--container); margin: 0 auto; padding: 0 1.25rem; width: 100%; }
  @media (min-width: 640px) { .container { padding: 0 2rem; } }

  /* 方眼グリッド（紙面セクションの下地） */
  .grid-paper {
    background-image:
      repeating-linear-gradient(0deg, rgba(27,32,28,.035) 0 1px, transparent 1px 8px),
      repeating-linear-gradient(90deg, rgba(27,32,28,.035) 0 1px, transparent 1px 8px),
      repeating-linear-gradient(0deg, rgba(27,32,28,.05) 0 1px, transparent 1px 40px),
      repeating-linear-gradient(90deg, rgba(27,32,28,.05) 0 1px, transparent 1px 40px);
  }

  .mono { font-family: var(--mono); }
  .disp { font-family: var(--disp); font-variation-settings: "wdth" 116; font-weight: 800; letter-spacing: .01em; text-transform: uppercase; }

  /* 寸法線：両端に寸法補助線のティック */
  .dim { position: relative; height: 1px; background: var(--rule-strong); }
  .dim::before, .dim::after { content: ""; position: absolute; top: -4px; width: 1px; height: 9px; background: var(--rule-strong); }
  .dim::before { left: 0; }
  .dim::after { right: 0; }

  /* セクション見出しパターン */
  .sec-head { margin-bottom: 2.5rem; }
  .sec-index { display: inline-block; font-family: var(--mono); font-size: .7rem; font-weight: 500; letter-spacing: .25em; color: var(--ink-muted); text-transform: uppercase; background: #fff; border: 1px solid var(--rule-strong); border-radius: 999px; padding: .15rem .85rem .15rem 1rem; transform: rotate(-2deg); }
  .sec-head .dim { margin-top: .6rem; width: 64px; }
  .sec-title { margin-top: 1.1rem; font-family: var(--disp); font-variation-settings: "wdth" 118; font-weight: 850; font-size: 2.4rem; line-height: 1; letter-spacing: .01em; text-transform: uppercase; }
  .sec-jp { margin-top: .7rem; font-size: 1.05rem; font-weight: 700; }
  .sec-note { margin-top: .7rem; max-width: 42rem; font-size: .875rem; line-height: 1.9; color: var(--ink-muted); }
  @media (min-width: 640px) {
    .sec-title { font-size: 3.1rem; }
    .sec-jp { font-size: 1.2rem; }
    .sec-head { margin-bottom: 3.5rem; }
  }

  /* 見出しの現れ方（寸法線が引かれる） */
  .sec-head .dim { transform-origin: left center; }
  @media (prefers-reduced-motion: no-preference) {
    .sec-head .dim { transform: scaleX(0); transition: transform .7s cubic-bezier(.22,1,.36,1) .1s; }
    .sec-head .sec-title, .sec-head .sec-jp { opacity: 0; transform: translateY(8px); transition: opacity .5s ease .25s, transform .5s ease .25s; }
    .sec-head.in .dim { transform: scaleX(1); }
    .sec-head.in .sec-title, .sec-head.in .sec-jp { opacity: 1; transform: none; }
  }

  /* ボタン（丸みのあるピル・バウンドするホバー） */
  .btn { display: inline-flex; align-items: center; gap: .6rem; border-radius: 999px; padding: .8rem 1.7rem; font-size: .875rem; font-weight: 700; transition: background-color .2s, border-color .2s, color .2s, transform .25s cubic-bezier(.34,1.56,.64,1); }
  .btn:hover { transform: translateY(-2px); }
  .btn .arrow { font-family: var(--mono); font-weight: 500; }
  .btn-fill { background: var(--green); color: #fff; border: 1px solid var(--green); }
  .btn-fill:hover { background: var(--green-deep); border-color: var(--green-deep); }
  .btn-line { border: 1px solid var(--rule-strong); background: transparent; color: var(--ink); }
  .btn-line:hover { border-color: var(--ink); }

  /* ===== Header ===== */
  .site-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--rule); background: rgba(246,245,241,.92); backdrop-filter: blur(8px); }
  .site-header .inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; row-gap: .6rem; padding-top: .85rem; padding-bottom: .85rem; }
  .site-logo { display: flex; align-items: center; gap: .65rem; }
  .site-logo .mark { width: 30px; height: 30px; color: var(--green); flex-shrink: 0; }
  .site-logo .name { font-weight: 700; font-size: .98rem; line-height: 1.2; }
  .site-logo .en { display: block; font-family: var(--mono); font-size: .58rem; font-weight: 500; letter-spacing: .22em; color: var(--ink-muted); text-transform: uppercase; margin-top: .15rem; }
  .gnav { display: flex; flex-wrap: wrap; align-items: center; column-gap: 1.3rem; row-gap: .4rem; }
  .gnav a { font-size: .85rem; color: var(--ink-muted); transition: color .2s; display: inline-flex; align-items: center; gap: .25rem; }
  .gnav a:hover { color: var(--green-deep); }
  .gnav .divider { display: none; height: 1rem; width: 1px; background: var(--rule-strong); }
  .gnav .ext { font-family: var(--mono); font-size: .7rem; }
  @media (min-width: 640px) { .gnav .divider { display: block; } }

  /* ===== Hero ===== */
  .hero { border-bottom: 1px solid var(--rule); background: var(--paper); }
  .hero-grid { display: grid; align-items: stretch; }
  .hero-copy-wrap { display: flex; align-items: center; }
  .hero-copy { margin: 0 auto; width: 100%; max-width: var(--container); padding: 3.5rem 1.25rem 4rem; }
  .hero-label { display: flex; align-items: center; gap: .8rem; font-family: var(--mono); font-size: .7rem; font-weight: 500; letter-spacing: .3em; color: var(--green-deep); }
  .hero-label .dim { width: 40px; background: var(--green); }
  .hero-label .dim::before, .hero-label .dim::after { background: var(--green); }
  .hero h1 { margin-top: 1.6rem; font-family: var(--disp); font-variation-settings: "wdth" 112; font-weight: 850; font-size: clamp(1.85rem, 8vw, 2.7rem); line-height: 1.0; letter-spacing: .005em; }
  .hero h1 .g { color: var(--green); }
  .hero-sub { margin-top: 1.7rem; font-size: 1.2rem; line-height: 1.6; font-weight: 700; }
  .hl { background: linear-gradient(transparent 55%, rgba(47,158,77,.28) 55% 92%, transparent 92%); padding: 0 .08em; }
  .hero-desc { margin-top: 1.2rem; max-width: 36rem; font-size: .875rem; line-height: 2; color: var(--ink-muted); }
  .hero-ctas { margin-top: 2.2rem; display: flex; flex-wrap: wrap; gap: .75rem; }
  @media (prefers-reduced-motion: no-preference) {
    .hero-label, .hero h1, .hero-sub, .hero-desc, .hero-ctas { opacity: 0; transform: translateY(10px); animation: rise .6s cubic-bezier(.22,1,.36,1) forwards; }
    .hero h1 { animation-delay: .08s; }
    .hero-sub { animation-delay: .16s; }
    .hero-desc { animation-delay: .22s; }
    .hero-ctas { animation-delay: .3s; }
    @keyframes rise { to { opacity: 1; transform: none; } }
  }
  /* 図面パネル（写真の代わりの線画スキーマ） */
  .hero-board { position: relative; min-height: 18rem; overflow: hidden; background: var(--green-dark); }
  .board-grid { position: absolute; inset: 0;
    background-image:
      repeating-linear-gradient(0deg, rgba(185,212,187,.07) 0 1px, transparent 1px 8px),
      repeating-linear-gradient(90deg, rgba(185,212,187,.07) 0 1px, transparent 1px 8px),
      repeating-linear-gradient(0deg, rgba(185,212,187,.12) 0 1px, transparent 1px 40px),
      repeating-linear-gradient(90deg, rgba(185,212,187,.12) 0 1px, transparent 1px 40px);
  }
  .hero-board svg.schema { position: absolute; inset: 0; width: 100%; height: 100%; }
  .board-tag { position: absolute; left: 1rem; bottom: .8rem; font-family: var(--mono); font-size: .62rem; letter-spacing: .2em; color: rgba(185,212,187,.55); text-transform: uppercase; }
  @media (min-width: 640px) { .hero-board { min-height: 24rem; } .hero h1 { font-size: 3.6rem; } .hero-copy { padding: 4rem 2rem 4.5rem; } }
  @media (min-width: 1024px) {
    .hero { display: flex; flex-direction: column; min-height: calc(100svh - var(--header-h)); }
    .hero-grid { grid-template-columns: 1.22fr 1fr; min-height: 0; flex: 1; }
    .hero-copy { max-width: none; padding: 6rem 3.5rem 6rem max(2rem, calc((100vw - var(--container)) / 2 + 2rem)); }
    .hero h1 { font-size: 3.5rem; }
  }
  @media (min-width: 1280px) { .hero h1 { font-size: 4rem; } }

  /* 事業クイックストリップ */
  .hero-strip { border-top: 1px solid var(--rule); }
  .strip-grid { display: grid; grid-template-columns: repeat(2, 1fr); }
  .strip-grid li:nth-child(2n) { border-left: 1px solid var(--rule); }
  .strip-grid li:nth-child(-n+4) { border-bottom: 1px solid var(--rule); }
  .strip-grid li:nth-child(5) { grid-column: 1 / -1; }
  .strip-grid a { display: block; height: 100%; padding: 1.2rem 1rem; transition: background-color .2s; }
  .strip-grid a:hover { background: var(--paper-deep); }
  .strip-no { display: flex; align-items: center; gap: .6rem; font-family: var(--mono); font-size: .65rem; font-weight: 500; letter-spacing: .15em; color: var(--ink-muted); }
  .strip-no .tick { display: inline-block; width: 16px; height: 5px; border-radius: 999px; }
  .strip-name { margin-top: .55rem; font-size: .9rem; font-weight: 700; }
  .strip-grid a:hover .strip-name { color: var(--green-deep); }
  .strip-en { margin-top: .1rem; font-family: var(--mono); font-size: .62rem; letter-spacing: .18em; color: var(--ink-muted); text-transform: uppercase; }
  @media (min-width: 640px) {
    .strip-grid { grid-template-columns: repeat(5, 1fr); }
    .strip-grid li { border-bottom: 0 !important; border-left: 0; }
    .strip-grid li:nth-child(5) { grid-column: auto; }
    .strip-grid li + li { border-left: 1px solid var(--rule); }
    .strip-grid a { padding: 1.4rem 1.2rem; }
  }


  /* ===== 共通セクション ===== */
  section { scroll-margin-top: 5.5rem; }
  .sec { padding: 4.5rem 0; }
  @media (min-width: 640px) { .sec { padding: 6.5rem 0; } }

  /* ===== News ===== */
  .news-sec { border-bottom: 1px solid var(--rule); }
  .news-list { border-top: 1px solid var(--rule-strong); }
  .news-list li { border-bottom: 1px solid var(--rule); }
  .news-row { display: flex; flex-wrap: wrap; align-items: center; column-gap: 1.4rem; row-gap: .4rem; padding: 1.15rem 0; }
  a.news-row:hover .news-title { color: var(--green-deep); text-decoration: underline; text-underline-offset: 4px; }
  .news-date { flex-shrink: 0; font-family: var(--mono); font-size: .8rem; font-weight: 500; color: var(--ink-muted); }
  .news-tag { display: inline-flex; flex-shrink: 0; align-items: center; gap: .45rem; border: 1px solid var(--rule); background: #fff; border-radius: 999px; padding: .14rem .7rem; font-family: var(--mono); font-size: .66rem; font-weight: 500; letter-spacing: .08em; color: var(--ink-muted); }
  .news-tag .sq { height: 8px; width: 8px; border-radius: 999px; }
  .news-title { font-size: .875rem; font-weight: 500; transition: color .15s; }
  .news-more { margin-top: 2rem; }
  @media (min-width: 640px) { .news-row { flex-wrap: nowrap; } .news-title { flex: 1; } }

  /* ===== Business ===== */
  .biz-sec { background: #fbfaf7; border-bottom: 1px solid var(--rule); }
  .biz-banner { position: relative; margin-bottom: 2.2rem; aspect-ratio: 2 / 1; overflow: hidden; border: 1px solid var(--rule-strong); border-radius: 16px; background: var(--green-dark); }
  @media (min-width: 640px) { .biz-banner { aspect-ratio: 25 / 7; } }
  .biz-banner svg.schema { position: absolute; inset: 0; width: 100%; height: 100%; }
  .biz-list { display: grid; gap: 1.1rem; }
  .biz-card { position: relative; display: block; border: 1px solid var(--rule-strong); border-radius: 16px; background: var(--paper); padding: 1.8rem 1.6rem; transition: border-color .2s, background-color .2s, transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s; }
  .biz-card:hover { border-color: var(--green); background: #fff; transform: translateY(-4px) rotate(-.3deg); box-shadow: 0 14px 30px rgba(27,32,28,.08); }
  .biz-no { position: absolute; top: 1.1rem; right: 1.2rem; font-family: var(--mono); font-size: .7rem; font-weight: 500; letter-spacing: .15em; color: var(--ink-muted); }
  .biz-no::before { content: "No."; margin-right: .2rem; opacity: .7; }
  .biz-key { display: flex; align-items: center; gap: .6rem; }
  .biz-key .tick { width: 20px; height: 6px; border-radius: 999px; flex-shrink: 0; }
  .biz-key .en { font-family: var(--mono); font-size: .66rem; font-weight: 500; letter-spacing: .2em; color: var(--ink-muted); text-transform: uppercase; }
  .biz-card h3 { margin-top: .8rem; font-size: 1.25rem; font-weight: 700; }
  .biz-desc { margin-top: .8rem; font-size: .875rem; line-height: 1.9; color: var(--ink-muted); }
  .biz-link { margin-top: 1.3rem; font-size: .84rem; font-weight: 700; color: var(--green-deep); }
  .biz-link .arrow { font-family: var(--mono); }
  .biz-card:hover .biz-link { text-decoration: underline; text-underline-offset: 4px; }
  .biz-detail { margin-top: 1.6rem; border-top: 1px dashed var(--rule-strong); padding-top: 1.4rem; display: grid; gap: .65rem; }
  .biz-detail li { position: relative; padding-left: 1.4rem; font-size: .84rem; line-height: 1.9; color: var(--ink-muted); }
  .biz-detail li::before { content: ""; position: absolute; left: 0; top: .62em; width: 12px; height: 4px; border-radius: 999px; background: var(--green); opacity: .7; }
  @media (min-width: 640px) { .biz-card { padding: 2.2rem 2.4rem; } .biz-banner { margin-bottom: 2.6rem; } }
  @media (min-width: 1024px) {
    .biz-split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); gap: 3rem; }
    .biz-detail { margin-top: 0; border-top: 0; border-left: 1px dashed var(--rule-strong); padding-top: .2rem; padding-left: 3rem; }
  }

  /* ===== Brands ===== */
  .brands-sec { position: relative; overflow: hidden; background: var(--green-dark); color: #eef3ee; padding: 4.5rem 0; }
  .brands-sec .board-grid { opacity: .8; }
  .brands-mark { pointer-events: none; position: absolute; right: -6rem; bottom: -7rem; width: 22rem; height: 22rem; color: var(--line-art); opacity: .08; }
  .brands-sec .sec-index { color: rgba(238,243,238,.6); }
  .brands-sec .dim, .brands-sec .dim::before, .brands-sec .dim::after { background: rgba(185,212,187,.6); }
  .brands-sec .sec-note { color: rgba(238,243,238,.65); }
  .brands-grid { margin-top: 2.4rem; display: grid; gap: 1rem; position: relative; }
  .brand-card { display: block; border: 1px solid rgba(185,212,187,.28); border-radius: 16px; overflow: hidden; background: rgba(246,245,241,.04); transition: background-color .2s, border-color .2s, transform .3s cubic-bezier(.34,1.56,.64,1); }
  .brand-card:hover { background: rgba(246,245,241,.09); border-color: rgba(185,212,187,.55); transform: translateY(-4px) rotate(.3deg); }
  .brand-visual { position: relative; aspect-ratio: 3 / 1; display: grid; place-items: center; border-bottom: 1px solid rgba(185,212,187,.22); }
  .brand-visual .ph { font-family: var(--mono); font-size: .68rem; font-weight: 500; letter-spacing: .3em; color: rgba(238,243,238,.5); text-transform: uppercase; }
  .brand-body { padding: 1.4rem 1.5rem 1.6rem; }
  .brand-body h3 { font-size: 1.05rem; font-weight: 700; }
  .brand-card:hover h3 { text-decoration: underline; text-underline-offset: 4px; }
  .brand-body .ext { font-family: var(--mono); font-size: .8rem; margin-left: .3rem; }
  .brand-body p { margin-top: .5rem; font-size: .8rem; line-height: 1.8; color: rgba(238,243,238,.65); }
  @media (min-width: 640px) {
    .brands-sec { padding: 6.5rem 0; }
    .brands-grid { margin-top: 3.2rem; grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
  }
  @media (min-width: 1024px) { .brands-grid { grid-template-columns: repeat(3, 1fr); } }

  /* ===== Company（表題欄スタイル） ===== */
  .company-sec { border-bottom: 1px solid var(--rule); }
  .company-grid { display: grid; gap: 2.5rem; }
  .company-head h2 { margin-top: 1.1rem; font-size: 1.15rem; font-weight: 700; }
  /* 図面の表題欄：全罫線のテーブル */
  .title-block { width: 100%; max-width: 46rem; border: 1px solid var(--rule-strong); border-collapse: collapse; background: rgba(255,255,255,.55); }
  .title-block th, .title-block td { border: 1px solid var(--rule); padding: .9rem 1.1rem; text-align: left; vertical-align: top; }
  .title-block th { width: 9.5rem; font-family: var(--mono); font-size: .72rem; font-weight: 500; letter-spacing: .12em; color: var(--ink-muted); background: var(--paper-deep); }
  .title-block th .jp { display: block; font-family: var(--sans); font-size: .84rem; font-weight: 700; letter-spacing: 0; color: var(--ink); }
  .title-block td { font-size: .875rem; line-height: 1.9; color: var(--ink); }
  /* スマホでは見出し列を細く */
  @media (max-width: 639px) {
    .title-block th { width: 5.5rem; padding: .8rem .6rem; }
    .title-block td { padding: .8rem .7rem; }
  }
  .company-more { margin-top: 2rem; }
  @media (min-width: 1024px) {
    .company-grid { grid-template-columns: 13rem 1fr; gap: 4rem; }
  }

  /* ===== Contact ===== */
  .contact-sec { position: relative; overflow: hidden; background: var(--green-dark); color: #eef3ee; }
  .contact-rule { position: relative; height: 6px; background: linear-gradient(90deg, var(--c-fa) 0 20%, var(--c-media) 20% 40%, var(--c-app) 40% 60%, var(--c-dev) 60% 80%, var(--c-consul) 80% 100%); }
  .contact-inner { position: relative; display: flex; flex-direction: column; gap: 2rem; padding-top: 4rem; padding-bottom: 4.5rem; }
  .contact-sec .sec-index { color: rgba(238,243,238,.6); }
  .contact-sec .dim, .contact-sec .dim::before, .contact-sec .dim::after { background: rgba(185,212,187,.6); }
  .contact-jp { margin-top: 1rem; font-size: 1.1rem; font-weight: 700; }
  .contact-note { margin-top: .7rem; max-width: 36rem; font-size: .84rem; line-height: 1.9; color: rgba(238,243,238,.65); }
  .contact-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
  .contact-sec .btn-fill { border-color: var(--green); }
  .contact-mail { font-family: var(--mono); font-size: .84rem; color: rgba(238,243,238,.75); text-decoration: underline; text-underline-offset: 4px; transition: color .2s; }
  .contact-mail:hover { color: #fff; }
  @media (min-width: 640px) { .contact-inner { padding-top: 5rem; padding-bottom: 5.5rem; } }
  @media (min-width: 1024px) { .contact-inner { flex-direction: row; align-items: flex-end; justify-content: space-between; } }

  /* ===== Footer ===== */
  .site-footer { background: var(--paper); padding: 3rem 0 2.5rem; }
  .footer-grid { display: grid; gap: 2.5rem; }
  .footer-co .site-logo { margin-bottom: 1rem; }
  .footer-co address { font-size: .84rem; line-height: 1.8; color: var(--ink-muted); font-style: normal; }
  .footer-co .mail { margin-top: .6rem; display: inline-block; font-family: var(--mono); font-size: .8rem; color: var(--ink-muted); text-decoration: underline; text-underline-offset: 4px; }
  .footer-co .mail:hover { color: var(--ink); }
  .footer-label { font-family: var(--mono); font-size: .66rem; font-weight: 500; letter-spacing: .28em; color: var(--ink-muted); text-transform: uppercase; }
  .footer-nav ul { margin-top: 1rem; display: grid; gap: .45rem; }
  .footer-nav a { font-size: .84rem; color: var(--ink-muted); }
  .footer-nav a:hover { color: var(--green-deep); }
  .footer-nav .desc { font-size: .72rem; color: var(--ink-muted); opacity: .8; }
  .footer-bottom { margin-top: 2.8rem; border-top: 1px solid var(--rule); padding-top: 1.4rem; }
  .footer-notes { display: grid; gap: .2rem; font-size: .72rem; color: var(--ink-muted); }
  .footer-lang { margin-top: .9rem; display: flex; flex-wrap: wrap; column-gap: 1rem; row-gap: .2rem; font-size: .8rem; color: var(--ink-muted); }
  .footer-lang .current { font-weight: 700; color: var(--ink); }
  .footer-copy { margin-top: 1.2rem; font-family: var(--mono); font-size: .7rem; color: var(--ink-muted); }
  @media (min-width: 640px) { .footer-grid { grid-template-columns: 1.2fr 1fr 1.2fr; } }

/* ===== 下層ページ共通 ===== */
.gnav a.active { color: var(--green-deep); font-weight: 700; }
.page-hero { padding: 3.5rem 0 3rem; border-bottom: 1px solid var(--rule); }
.page-hero .sec-head { margin-bottom: 0; }
.page-sec { padding: 4rem 0; border-bottom: 1px solid var(--rule); scroll-margin-top: 5.5rem; }
@media (min-width: 640px) { .page-hero { padding: 4.5rem 0 3.5rem; } .page-sec { padding: 5rem 0; } }
.page-cta { padding: 4rem 0; }
.page-cta .btns { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.6rem; }

/* 代表メッセージ */
.message-lead { font-size: 1.3rem; font-weight: 700; line-height: 1.9; max-width: 40rem; }
.message-lead .hl { padding: 0 .08em; }
.message-body { margin-top: 1.5rem; max-width: 40rem; font-size: .9rem; line-height: 2.1; color: var(--ink-muted); display: grid; gap: 1rem; }
.message-sign { margin-top: 2rem; font-weight: 700; font-size: .95rem; }
.message-sign .en { display: block; font-family: var(--mono); font-size: .68rem; letter-spacing: .2em; color: var(--ink-muted); margin-top: .2rem; }

/* 沿革タイムライン */
.timeline { margin-left: .4rem; border-left: 2px dashed var(--rule-strong); padding-left: 1.8rem; display: grid; gap: 1.5rem; max-width: 40rem; }
.timeline > div { position: relative; }
.timeline > div::before { content: ""; position: absolute; left: calc(-1.8rem - 8px); top: .35em; width: 12px; height: 12px; border-radius: 999px; background: var(--green); border: 3px solid var(--paper); }
.timeline dt { font-family: var(--mono); font-size: .8rem; color: var(--ink-muted); }
.timeline dd { font-size: .9rem; margin-top: .15rem; }

/* 事業紹介 */
.svc-key { display: flex; align-items: center; gap: .6rem; }
.svc-key .tick { width: 20px; height: 6px; border-radius: 999px; flex-shrink: 0; }
.svc-key .en { font-family: var(--mono); font-size: .7rem; font-weight: 500; letter-spacing: .2em; color: var(--ink-muted); text-transform: uppercase; }
.svc h2 { margin-top: .9rem; font-size: 1.6rem; font-weight: 700; }
.svc-desc { margin-top: 1.1rem; max-width: 46rem; font-size: .9rem; line-height: 2; color: var(--ink-muted); }
.svc h3 { margin-top: 2.4rem; font-size: 1.05rem; font-weight: 700; display: flex; align-items: center; gap: .6rem; }
.svc h3::before { content: ""; width: 12px; height: 4px; border-radius: 999px; background: var(--green); }
.svc h4 { margin-top: 1.4rem; font-family: var(--mono); font-size: .7rem; font-weight: 500; letter-spacing: .2em; color: var(--ink-muted); text-transform: uppercase; }
.svc .biz-detail { border-top: 0; padding-top: 0; margin-top: 1.4rem; max-width: 46rem; }
.svc-works { margin-top: .8rem; display: grid; gap: .5rem; max-width: 46rem; }
.svc-works li { position: relative; padding-left: 1.4rem; font-size: .85rem; line-height: 1.9; color: var(--ink-muted); }
.svc-works li::before { content: ""; position: absolute; left: 0; top: .62em; width: 12px; height: 4px; border-radius: 999px; background: var(--rule-strong); }
.svc .title-block { margin-top: 1.4rem; }

/* プレースホルダー枠（フォーム・動画・地図） */
.ph-box { margin-top: 1.4rem; border: 2px dashed var(--rule-strong); border-radius: 16px; background: #fff; padding: 2.6rem 2rem; text-align: center; color: var(--ink-muted); font-size: .85rem; line-height: 1.9; max-width: 46rem; }
.ph-box .en { display: block; font-family: var(--mono); font-size: .66rem; letter-spacing: .25em; text-transform: uppercase; margin-bottom: .5rem; }

/* お問い合わせ */
.contact-mail-big { display: inline-block; margin-top: 1rem; font-family: var(--mono); font-size: 1.05rem; font-weight: 600; color: var(--ink); text-decoration: underline; text-underline-offset: 6px; }
.contact-form-panel { margin-top: 1.4rem; display: grid; gap: 2rem; max-width: 58rem; border: 1px solid var(--rule-strong); background: #fff; padding: 2rem; }
.contact-form-copy .en, .contact-fallback .en { display: block; font-family: var(--mono); font-size: .66rem; letter-spacing: .25em; text-transform: uppercase; color: var(--ink-muted); }
.contact-form-copy h3 { margin-top: .65rem; font-size: 1.2rem; font-weight: 700; }
.contact-form-copy > p:not(.contact-form-status) { margin-top: .8rem; max-width: 38rem; font-size: .86rem; line-height: 1.9; color: var(--ink-muted); }
.contact-form-status { margin-top: 1.2rem; display: flex; align-items: flex-start; gap: .55rem; padding-top: .9rem; border-top: 1px solid var(--rule); font-size: .78rem; line-height: 1.8; color: var(--ink-muted); }
.status-dot { width: .55rem; height: .55rem; margin-top: .45rem; flex: 0 0 auto; border-radius: 50%; background: var(--c-fa); }
.status-dot.is-ready { background: var(--green); }
.contact-form-link { margin-top: 1.1rem; }
.contact-form-fields { border-top: 1px solid var(--rule); padding-top: 1.2rem; }
.contact-fields-label { font-family: var(--mono); font-size: .67rem; letter-spacing: .16em; color: var(--ink-muted); text-transform: uppercase; }
.contact-form-fields ul { margin-top: .7rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem 1.5rem; }
.contact-form-fields li { position: relative; padding-left: 1rem; font-size: .82rem; line-height: 1.6; }
.contact-form-fields li::before { content: ""; position: absolute; left: 0; top: .65em; width: 5px; height: 5px; background: var(--green); }
.contact-fallback { margin-top: 1rem; max-width: 58rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; border-left: 4px solid var(--green); background: var(--paper); padding: 1.2rem 1.4rem; }
.contact-fallback p { margin-top: .35rem; font-size: .84rem; line-height: 1.7; }
.contact-fallback .btn { margin: 0; }
@media (min-width: 640px) { .contact-form-panel { grid-template-columns: 1.15fr .85fr; padding: 2.5rem; } .contact-form-fields { border-top: 0; border-left: 1px solid var(--rule); padding-top: 0; padding-left: 2rem; } }
@media (max-width: 420px) { .contact-form-fields ul { grid-template-columns: 1fr; } }

/* フッターのSNSリンク */
.footer-sns { margin-top: .8rem; display: flex; flex-wrap: wrap; gap: .9rem; }
.footer-sns a { font-family: var(--mono); font-size: .8rem; color: var(--ink-muted); text-decoration: underline; text-underline-offset: 4px; }
.footer-sns a:hover { color: var(--green-deep); }

/* 代表メッセージの写真レイアウト */
.message-grid { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 1024px) { .message-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 4rem; } }
.message-photo { max-width: 380px; justify-self: start; }
@media (min-width: 1024px) { .message-photo { justify-self: end; } }
.message-photo img { width: 100%; height: auto; border-radius: 16px; border: 1px solid var(--rule-strong); }
.message-photo .cap { margin-top: .8rem; font-family: var(--mono); font-size: .65rem; letter-spacing: .2em; color: var(--ink-muted); text-transform: uppercase; }