/* ============================================================
   YLS株式会社 — サイト共通スタイル（ブランディング版）
   方針：紙（暖オフホワイト）＋ 木炭（ink）＋ 真鍮ゴールド（=ロゴ金）
   生ヘックスはこのファイルに集約（各HTMLでは色を直書きしない）
   トークン名は据置（--n-* / --accent-*）＝既存参照を壊さない
   ============================================================ */

/* ---------- design tokens ---------- */
:root{
  /* fonts */
  --font-sans:"Inter","Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,system-ui,sans-serif;
  --font-serif:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --font-mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;

  /* type scale (1.25) */
  --text-xs:.75rem; --text-sm:.875rem; --text-base:1rem; --text-lg:1.125rem;
  --text-xl:1.25rem; --text-2xl:1.5rem; --text-3xl:1.875rem; --text-4xl:2.25rem; --text-5xl:3rem; --text-6xl:3.75rem;
  --leading-tight:1.18; --leading-snug:1.4; --leading-normal:1.65; --leading-relaxed:1.85;
  --tracking-tight:-0.02em; --tracking-normal:0; --tracking-wide:.14em;
  --measure:64ch;

  /* spacing (4/8) */
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.5rem;
  --space-6:2rem; --space-8:3rem; --space-10:4rem; --space-12:6rem; --space-16:8rem; --space-20:10rem;

  /* radius（やや硬派に） */
  --radius-xs:2px; --radius-sm:4px; --radius-md:7px; --radius-lg:10px; --radius-xl:14px; --radius-2xl:18px; --radius-full:9999px;

  /* elevation（暖色グレー影） */
  --shadow-sm:0 1px 2px rgba(40,33,22,.06),0 1px 3px rgba(40,33,22,.09);
  --shadow-md:0 2px 6px rgba(40,33,22,.07),0 6px 16px rgba(40,33,22,.08);
  --shadow-lg:0 6px 14px rgba(40,33,22,.08),0 18px 40px rgba(40,33,22,.12);
  --shadow-xl:0 10px 20px rgba(40,33,22,.10),0 30px 60px rgba(40,33,22,.16);

  /* motion */
  --ease:cubic-bezier(.22,.61,.36,1); --ease-out:cubic-bezier(.16,1,.3,1);
  --dur-fast:120ms; --dur:220ms; --dur-slow:360ms;

  /* neutral 10-step（暖色グレー） */
  --n-50:#F7F4EE; --n-100:#EFEAE0; --n-200:#E4DDCF; --n-300:#D4CBB9; --n-400:#A8A091;
  --n-500:#827B6D; --n-600:#5B554B; --n-700:#3E3930; --n-800:#272320; --n-900:#1A1714;

  /* accent = 真鍮ゴールド（黄系を上質化） */
  --accent-50:#F6EEDC; --accent-100:#EEE1C2; --accent-200:#E0CB97;
  --accent-500:#C39A3C;   /* 署名の金：罫線・eyebrowバー・ring・小マーク */
  --accent-600:#BD8B2E;   /* CTA地（上に暗文字でAA） */
  --accent-700:#6E5417;   /* 明地の金文字：リンク・eyebrow（AA） */
  --accent-contrast:#1A1505; /* CTA上の文字 */
  --logo-gold:#C39A3C;

  /* ブランド役割色 */
  --gold:#C39A3C;
  --gold-bright:#D9B25A;   /* 暗地上の見出しハイライト */
  --gold-line:rgba(195,154,60,.55);
  --gold-line-soft:rgba(195,154,60,.30);
  --ink:#1A1714;           /* 木炭：ダーク地 */
  --ink-2:#23201A;         /* 段差 */
  --ink-3:#2E2A22;

  /* semantic */
  --success:#3F7A33; --warning:#9A6B16; --error:#B4321F;
  --error-fg:#8E2417; --error-bg:#FBF1EE; --error-border:#E7C3BB;

  /* role aliases */
  --bg:var(--n-50);
  --surface:#FFFDF9;
  --surface-2:var(--n-100);
  --surface-3:var(--n-200);
  --fg:var(--n-900);
  --fg-muted:var(--n-600);
  --fg-subtle:#6B6256;
  --fg-on-accent:var(--accent-contrast);
  --border:var(--n-200);
  --border-strong:var(--n-300);
  --ring:var(--accent-500);
}

/* ---------- base + a11y ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-wrap:break-word;overflow-x:clip;
}
:where(a){color:var(--accent-700);text-decoration:none;}
:where(a:hover){text-decoration:underline;}
:where(img,svg,video,canvas){max-width:100%;display:block;}
:where(button,input,select,textarea){font:inherit;color:inherit;}
:where(h1,h2,h3,h4){line-height:var(--leading-tight);font-weight:700;letter-spacing:var(--tracking-tight);margin:0;color:var(--fg);}
:where(p){margin:0;}
:where(ul,ol){margin:0;padding:0;}
*:focus-visible{outline:3px solid var(--ring);outline-offset:2px;border-radius:var(--radius-xs);}
:where(button,a,[role="button"]){cursor:pointer;}
::selection{background:var(--accent-200);color:var(--ink);}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--accent-600);color:var(--accent-contrast);padding:.6rem 1rem;font-weight:700;border-radius:0 0 var(--radius-md) 0;}
.skip-link:focus{left:0;}

/* ---------- layout helpers ---------- */
.container{width:100%;max-width:1180px;margin-inline:auto;padding-inline:var(--space-5);}
.container--narrow{max-width:780px;}
.stack>*+*{margin-top:var(--space-4);}
.cluster{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;}
.spread{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);}
.grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-5);}
.divider{height:1px;background:var(--border);border:0;margin:var(--space-6) 0;}
.text-center{text-align:center;}
.features>*,.services>*,.works>*,.split2>*,.form-grid>*,.contact-grid>*,.audience>*,.pillars>*{min-width:0;}

/* ---------- typography helpers ---------- */
.eyebrow{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.6em;font-size:var(--text-sm);font-weight:700;letter-spacing:var(--tracking-wide);color:var(--accent-700);text-transform:none;}
.eyebrow::before{content:"";width:1.7em;height:2px;background:var(--accent-500);}
.muted{color:var(--fg-muted);}
.subtle{color:var(--fg-subtle);}
.lead{font-size:var(--text-lg);color:var(--fg-muted);line-height:var(--leading-relaxed);max-width:var(--measure);}
.prose{max-width:var(--measure);line-height:var(--leading-relaxed);color:var(--fg-muted);}
.prose>*+*{margin-top:var(--space-4);}
.hl-mark{color:var(--accent-700);font-weight:700;}
.tag-sample{display:inline-block;font-size:var(--text-xs);font-weight:700;color:var(--warning);background:var(--accent-50);border:1px solid var(--accent-200);border-radius:var(--radius-full);padding:.05em .6em;vertical-align:middle;letter-spacing:.02em;}

/* ---------- button ---------- */
.btn{
  --_bg:var(--surface);--_fg:var(--fg);--_bd:var(--border-strong);
  display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
  height:2.875rem;padding:0 var(--space-5);border-radius:var(--radius-md);
  font-size:var(--text-sm);font-weight:700;line-height:1;white-space:nowrap;user-select:none;
  background:var(--_bg);color:var(--_fg);border:1px solid var(--_bd);
  transition:filter var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease);
}
.btn:hover{filter:brightness(.98);text-decoration:none;}
.btn:active{transform:translateY(1px);}
.btn svg{width:1.15em;height:1.15em;flex:none;}
.btn--primary{--_bg:var(--accent-600);--_fg:var(--accent-contrast);--_bd:transparent;box-shadow:0 1px 0 rgba(0,0,0,.04);}
.btn--primary:hover{filter:brightness(1.04);}
.btn--secondary{--_bg:var(--surface);--_fg:var(--fg);--_bd:var(--border-strong);}
.btn--ink{--_bg:var(--ink);--_fg:#fff;--_bd:var(--ink);}
.btn--ink:hover{filter:brightness(1.12);}
.btn--ghost{--_bg:transparent;--_fg:var(--fg);--_bd:transparent;}
.btn--ghost:hover{background:var(--surface-2);}
.btn--lg{height:3.35rem;padding:0 var(--space-6);font-size:var(--text-base);}
.btn--block{display:flex;width:100%;}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;filter:none!important;box-shadow:none;}
.btn--hero-ghost{--_bg:rgba(255,255,255,.06);--_fg:#fff;--_bd:rgba(255,255,255,.55);}
.btn--hero-ghost:hover{--_bg:rgba(255,255,255,.16);filter:none;}

/* ---------- card ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);}
.card__body{padding:var(--space-5);}
.card--hover{transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease);}
.card--hover:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--border-strong);}

/* ---------- form ---------- */
.field{display:flex;flex-direction:column;gap:var(--space-2);}
.field__label{font-size:var(--text-sm);font-weight:700;color:var(--fg);}
.field__label .req{color:var(--error);margin-left:.2em;font-size:.85em;}
.field__hint{font-size:var(--text-xs);color:var(--fg-subtle);}
.input,.select,.textarea{
  width:100%;height:2.95rem;padding:0 var(--space-3);
  background:#fff;color:var(--fg);
  border:1px solid var(--border-strong);border-radius:var(--radius-md);
  transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);
}
.textarea{height:auto;min-height:8.5rem;padding:var(--space-3);resize:vertical;line-height:var(--leading-normal);}
.input::placeholder,.textarea::placeholder{color:var(--fg-subtle);}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--accent-500);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent-500) 26%,transparent);}
.select{appearance:none;cursor:pointer;padding-right:2.25rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23827B6D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right var(--space-3) center;}

/* ---------- badge ---------- */
.badge{display:inline-flex;align-items:center;gap:.35em;padding:.3em .75em;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:700;line-height:1.5;background:var(--surface-2);color:var(--fg-muted);border:1px solid var(--border);}
.badge--accent{background:var(--accent-50);color:var(--accent-700);border-color:var(--accent-200);}
.badge--applying{background:var(--surface-2);color:var(--fg-muted);border-color:var(--border-strong);}

/* ---------- table ---------- */
.table-wrap{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:var(--surface);}
.spec-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);}
.spec-table th,.spec-table td{padding:var(--space-4) var(--space-5);text-align:left;border-bottom:1px solid var(--border);vertical-align:top;line-height:var(--leading-normal);}
.spec-table th{width:34%;font-weight:700;color:var(--fg);background:var(--surface-2);white-space:nowrap;}
.spec-table td{color:var(--fg-muted);}
.spec-table tr:last-child th,.spec-table tr:last-child td{border-bottom:0;}

/* ============================================================
   サイト固有
   ============================================================ */

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:40;background:color-mix(in oklab,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:4.5rem;gap:var(--space-4);}
.brand{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;}
.brand:hover{text-decoration:none;}
.brand__bar{width:4px;height:1.95rem;background:var(--gold);border-radius:1px;flex:none;}
.brand__mark{font-family:"Inter",var(--font-sans);font-weight:900;font-size:2rem;line-height:1;letter-spacing:-.05em;color:var(--ink);display:inline-flex;}
.brand__mark>span{color:var(--gold);}
.brand__name{font-family:var(--font-sans);font-weight:700;font-size:.9rem;color:var(--fg-muted);letter-spacing:.02em;}
.header__right{display:flex;align-items:center;gap:var(--space-5);}
.site-nav{display:flex;align-items:center;gap:var(--space-5);}
.site-nav a{font-size:var(--text-sm);font-weight:600;color:var(--fg-muted);transition:color var(--dur-fast) var(--ease);white-space:nowrap;}
.site-nav a:not(.site-nav__cta):hover{color:var(--fg);text-decoration:none;}
.site-nav a[aria-current="page"]:not(.site-nav__cta){color:var(--accent-700);}
.header__tel{display:inline-flex;flex-direction:column;align-items:flex-end;line-height:1.15;text-decoration:none;}
.header__tel:hover{text-decoration:none;}
.header__tel-num{font-family:var(--font-sans);font-weight:800;font-size:1.05rem;color:var(--ink);letter-spacing:.01em;display:inline-flex;align-items:center;gap:.35em;}
.header__tel-num svg{width:1em;height:1em;color:var(--accent-700);}
.header__tel-note{font-size:.68rem;color:var(--fg-subtle);letter-spacing:.02em;}
.site-nav__cta{display:inline-flex;align-items:center;height:2.55rem;padding:0 var(--space-5);border-radius:var(--radius-md);background:var(--accent-600);color:var(--accent-contrast);font-weight:700;}
.site-nav__cta:hover{filter:brightness(1.05);text-decoration:none;}
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:2.75rem;height:2.75rem;background:transparent;border:1px solid var(--border-strong);border-radius:var(--radius-md);}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--fg);margin-inline:auto;transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease);}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate;min-height:clamp(560px,calc(100svh - 12.5rem),820px);display:flex;align-items:flex-end;background:var(--ink);}
.hero__bg{position:absolute;inset:0;z-index:-3;display:block;}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:68% center;}
.hero__scrim{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(20,18,14,.55) 0%,rgba(20,18,14,.20) 32%,rgba(20,18,14,.45) 70%,rgba(20,18,14,.86) 100%);}
.hero__panel{position:absolute;inset:0 auto 0 0;width:min(680px,64%);z-index:-1;background:linear-gradient(96deg,rgba(20,18,14,.92) 0%,rgba(20,18,14,.74) 55%,rgba(20,18,14,0) 100%);}
.hero__inner{padding-block:var(--space-12);width:100%;}
.hero__copy{max-width:640px;}
.hero__rule{display:block;width:46px;height:3px;background:var(--gold);margin-bottom:var(--space-5);}
.hero .eyebrow{color:var(--gold-bright);}
.hero .eyebrow::before{background:var(--gold);}
.hero__title{font-size:clamp(2.05rem,5vw,3.5rem);line-height:1.18;margin:var(--space-5) 0 0;color:#fff;font-weight:800;letter-spacing:-.025em;}/* margin-top=eyebrowとの間に一行ぶんの余白(PC/SP共通) */
.hero__title .hl{color:var(--gold-bright);}
.hero__sub{margin-top:var(--space-5);font-size:var(--text-lg);color:rgba(255,255,255,.86);line-height:var(--leading-relaxed);max-width:46ch;}
.hero__cta{margin-top:var(--space-8);}
.hero__tertiary{margin-top:var(--space-5);font-size:var(--text-sm);color:rgba(255,255,255,.82);}
.hero__tertiary a{color:#fff;text-decoration:underline;text-underline-offset:3px;font-weight:600;}
.hero__badges{margin-top:var(--space-6);display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-3);}
.hero__badge{display:inline-flex;align-items:center;gap:.45em;font-size:var(--text-xs);font-weight:600;color:rgba(255,255,255,.9);border:1px solid rgba(195,154,60,.45);border-radius:var(--radius-full);padding:.35em .85em;background:rgba(20,18,14,.35);}
.hero__badge::before{content:"";width:.4em;height:.4em;border-radius:50%;background:var(--gold);}

/* ---------- trust band（FV直下・事実ベース） ---------- */
.trust{background:var(--ink);color:#fff;border-top:3px solid var(--gold);}
.trust__row{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-5);padding-block:var(--space-6);}
.trust__item{display:flex;flex-direction:column;gap:.25rem;padding-left:var(--space-4);border-left:1px solid rgba(195,154,60,.4);}
.trust__k{font-size:var(--text-xs);letter-spacing:.1em;color:var(--gold-bright);font-weight:700;}
.trust__v{font-size:var(--text-sm);color:rgba(255,255,255,.92);font-weight:600;line-height:1.55;}

/* ---------- section ---------- */
.section{padding:var(--space-12) 0;}
.section--alt{background:var(--surface);border-block:1px solid var(--border);}
.section--ink{background:var(--ink);color:#fff;border-block:1px solid rgba(195,154,60,.25);}
.section--ink .section__title,.section--ink h2,.section--ink h3{color:#fff;}
.section--ink .section__desc{color:rgba(255,255,255,.78);}
.section--ink .eyebrow{color:var(--gold-bright);}
.section__head{max-width:var(--measure);margin:0 auto var(--space-8);text-align:center;}
.section__head .eyebrow{justify-content:center;}
.section__head--left{margin-inline:0;text-align:left;}
.section__head--left .eyebrow{justify-content:flex-start;}
.section__head--center{margin-inline:auto;text-align:center;}
.section__title{font-size:clamp(1.65rem,3.2vw,2.35rem);margin-top:var(--space-3);font-weight:800;letter-spacing:-.025em;}
.section__desc{margin-top:var(--space-4);color:var(--fg-muted);line-height:var(--leading-relaxed);}
.section__foot{margin-top:var(--space-8);}

/* ---------- audience split（2ターゲット分岐＝背骨） ---------- */
.audience{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);}
.audience__card{position:relative;display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-8);border-radius:var(--radius-xl);overflow:hidden;border:1px solid rgba(195,154,60,.3);background:var(--ink);box-shadow:var(--shadow-md);transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease);text-decoration:none;color:#fff;min-height:320px;justify-content:flex-end;}
.audience__card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--gold),transparent 75%);z-index:3;}
.audience__card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(20,18,14,.28) 0%,rgba(20,18,14,.55) 45%,rgba(20,18,14,.92) 100%);}
.audience__card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl);text-decoration:none;}
.audience__bgimg{position:absolute;inset:0;z-index:0;opacity:.9;object-fit:cover;width:100%;height:100%;transition:transform var(--dur-slow) var(--ease);}
.audience__card:hover .audience__bgimg{transform:scale(1.04);}
.audience__card>*{position:relative;z-index:2;}
.audience__k{font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;color:var(--gold-bright);}
.audience__title{font-size:clamp(1.6rem,2.8vw,2.1rem);font-weight:800;letter-spacing:-.02em;color:#fff;}
.audience__desc{font-size:var(--text-sm);color:rgba(255,255,255,.88);line-height:var(--leading-relaxed);max-width:36ch;}
.audience__go{margin-top:var(--space-2);display:inline-flex;align-items:center;gap:.5em;font-weight:700;color:var(--gold-bright);}
.audience__go svg{width:1.1em;height:1.1em;transition:transform var(--dur) var(--ease);}
.audience__card:hover .audience__go svg{transform:translateX(4px);}

/* ---------- pillars（芯3本柱・編集的） ---------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8);}
.pillar{display:flex;flex-direction:column;}
.pillar__n{font-family:var(--font-serif);font-size:2.4rem;font-weight:600;color:var(--gold);line-height:1;}
.pillar__rule{width:2.4rem;height:1px;background:var(--gold-line);border:0;margin:var(--space-3) 0 var(--space-4);}
.pillar__title{font-size:var(--text-xl);font-weight:800;letter-spacing:-.02em;}
.pillar__desc{margin-top:var(--space-3);font-size:var(--text-sm);color:var(--fg-muted);line-height:var(--leading-relaxed);}
.section--ink .pillar__desc{color:rgba(255,255,255,.78);}
.section--ink .pillar__title{color:#fff;}

/* ---------- stance（仕事の姿勢：実写＋値リスト） ---------- */
.stance{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-10);align-items:center;}
.stance__media{aspect-ratio:4/3;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-2);position:relative;}
.stance__media img{width:100%;height:100%;object-fit:cover;}
.stance__list{display:flex;flex-direction:column;}
.stance__item{padding:var(--space-5) 0;border-top:1px solid var(--border);}
.stance__item:first-child{border-top:0;padding-top:0;}
.stance__item:last-child{padding-bottom:0;}
.stance__h{display:flex;align-items:baseline;gap:.7em;}
.stance__num{font-family:var(--font-serif);font-size:1.05rem;color:var(--accent-700);font-weight:600;}
.stance__t{font-size:var(--text-lg);font-weight:800;letter-spacing:-.01em;}
.stance__d{margin-top:var(--space-2);font-size:var(--text-sm);color:var(--fg-muted);line-height:var(--leading-relaxed);}

/* ---------- services（対応工事） ---------- */
.services{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);}
.service{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease);}
.service:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--border-strong);}
.service__media{aspect-ratio:16/10;background:var(--surface-2);overflow:hidden;position:relative;}
.service__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--dur-slow) var(--ease);}
.service:hover .service__media img{transform:scale(1.04);}
.service__media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,18,14,.34),transparent 52%);}
.service__num{display:none;}/* 番号バッジ非表示（工事カード・index/services 共通） */
.service__body{padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2);flex:1;}
.service__title{font-size:var(--text-lg);font-weight:800;letter-spacing:-.01em;}
.service__title .tag{display:inline-block;margin-left:.5em;font-size:var(--text-xs);font-weight:700;color:var(--accent-700);background:var(--accent-50);border:1px solid var(--accent-200);border-radius:var(--radius-full);padding:.1em .6em;vertical-align:middle;}
.service__desc{font-size:var(--text-sm);color:var(--fg-muted);line-height:var(--leading-normal);}
/* サービスは均一グリッド（特別扱いなし） */
/* ② index.html のみ：工事カードをスマホで横スクロール（縦積み→スワイプ／スナップ） */
@media(max-width:720px){
  .services--scroll{display:flex;gap:var(--space-3);overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-padding-left:var(--space-1);}
  .services--scroll::-webkit-scrollbar{display:none;}
  .services--scroll .service{flex:0 0 auto;width:clamp(240px,78vw,300px);scroll-snap-align:start;}
}

/* ---------- clients（主な取引先） ---------- */
.clients{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-3);}
.clients__item{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.25em;min-height:5rem;padding:var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);font-weight:700;color:var(--fg);font-size:var(--text-sm);line-height:1.45;}
.clients__item .cat{font-size:var(--text-xs);font-weight:600;color:var(--accent-700);letter-spacing:.04em;}

/* ---------- pill list（建物・エリア・取引先） ---------- */
.pills{display:flex;flex-wrap:wrap;gap:var(--space-3);}
.pill{display:inline-flex;align-items:center;gap:.5em;padding:.6em 1.1em;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;color:var(--fg);}
.pill::before{content:"";width:.45em;height:.45em;border-radius:50%;background:var(--accent-500);flex:none;}

/* 2カラム併置 */
.split2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8);}
.subhead{font-size:var(--text-sm);font-weight:700;letter-spacing:var(--tracking-wide);color:var(--fg-subtle);text-transform:uppercase;margin-bottom:var(--space-4);}

/* ---------- works（実績・物語） ---------- */
.works{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6);}
.work{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;}
.work__media{aspect-ratio:16/10;background:var(--surface-2);overflow:hidden;}
.work__media img{width:100%;height:100%;object-fit:cover;}
.work__body{padding:var(--space-5);}
.work__meta{display:flex;align-items:center;gap:.7em;margin-bottom:var(--space-3);flex-wrap:wrap;}
.work__year{font-family:var(--font-serif);color:var(--accent-700);font-size:var(--text-sm);font-weight:600;}
.work__tags{display:flex;flex-wrap:wrap;gap:var(--space-2);}
.work__title{font-size:var(--text-xl);font-weight:800;letter-spacing:-.01em;}
.work__desc{margin-top:var(--space-3);font-size:var(--text-sm);color:var(--fg-muted);line-height:var(--leading-relaxed);}

/* ---------- ba（施工前/後ギャラリー：実写真） ---------- */
.ba{display:grid;gap:var(--space-3);}
.ba--3{grid-template-columns:repeat(3,1fr);}
.ba--wide{grid-template-columns:repeat(2,1fr);}
.ba figure{position:relative;margin:0;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-2);}
.ba--3 figure{aspect-ratio:3/4;}
.ba--wide figure{aspect-ratio:16/10;}
.ba img{width:100%;height:100%;object-fit:cover;display:block;}
.ba figcaption{position:absolute;top:var(--space-3);left:var(--space-3);background:rgba(20,18,14,.72);color:#fff;font-size:var(--text-xs);font-weight:700;padding:.25em .85em;border-radius:var(--radius-full);backdrop-filter:blur(2px);}
/* スマホ＝大きめ＋横スクロール（スワイプ／スナップ） */
@media(max-width:760px){
  .ba{display:flex;gap:var(--space-2);overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .ba::-webkit-scrollbar{display:none;}
  .ba figure{flex:0 0 auto;aspect-ratio:auto;height:320px;scroll-snap-align:start;}
  .ba img{width:auto;}
  .ba figcaption{top:var(--space-2);left:var(--space-2);font-size:.7rem;padding:.2em .65em;}
}

/* ---------- leader（代表メッセージ） ---------- */
.leader{display:grid;grid-template-columns:.85fr 1.15fr;gap:var(--space-10);align-items:center;}
.leader--solo{grid-template-columns:1fr;max-width:760px;margin-inline:auto;}
.leader__photo{position:relative;aspect-ratio:4/5;max-width:330px;width:100%;border-radius:var(--radius-lg);overflow:hidden;background:var(--ink-2);border:1px solid rgba(195,154,60,.3);}
.leader__photo img{width:100%;height:100%;object-fit:cover;}
.leader__quote{font-family:var(--font-serif);font-size:clamp(1.35rem,2.5vw,1.9rem);font-weight:600;color:var(--gold-bright);line-height:1.5;margin:var(--space-4) 0;letter-spacing:.01em;}
.leader__text{color:rgba(255,255,255,.84);line-height:var(--leading-relaxed);}
.leader__text>*+*{margin-top:var(--space-3);}
.leader__sign{margin-top:var(--space-6);font-weight:700;color:#fff;}
.leader__role{font-size:var(--text-sm);color:rgba(255,255,255,.7);margin-right:.6em;font-weight:600;}
.leader__cta{margin-top:var(--space-6);}

/* ---------- credential panel（資格・許認可の証明枠） ---------- */
.cred{background:var(--ink);color:#fff;border-radius:var(--radius-lg);border:1px solid rgba(195,154,60,.3);padding:var(--space-6);align-self:start;}
.cred__label{font-size:var(--text-xs);letter-spacing:.12em;color:var(--gold-bright);font-weight:700;text-transform:uppercase;}
.cred__list{list-style:none;margin:var(--space-4) 0 0;display:flex;flex-direction:column;gap:var(--space-3);}
.cred__list li{padding-left:1.4em;position:relative;font-weight:700;color:#fff;}
.cred__list li::before{content:"";position:absolute;left:0;top:.55em;width:.5em;height:.5em;border-radius:50%;background:var(--gold);}
.cred__note{margin-top:var(--space-5);font-size:var(--text-xs);color:rgba(255,255,255,.6);}

/* ---------- CTA band ---------- */
.cta-band{background:var(--ink);color:#fff;border-radius:var(--radius-2xl);border:1px solid rgba(195,154,60,.35);padding:var(--space-10);text-align:center;position:relative;overflow:hidden;}
.cta-band__accent{position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,transparent,var(--gold),transparent);}
.cta-band__title{font-size:clamp(1.5rem,2.8vw,2.1rem);color:#fff;font-weight:800;letter-spacing:-.02em;}
.cta-band__sub{margin-top:var(--space-3);color:rgba(255,255,255,.8);max-width:50ch;margin-inline:auto;line-height:var(--leading-relaxed);}
.cta-band__actions{margin-top:var(--space-8);display:flex;flex-wrap:wrap;gap:var(--space-4);justify-content:center;}
.cta-band .btn--secondary{--_bg:transparent;--_fg:#fff;--_bd:rgba(255,255,255,.45);}
.cta-band .btn--secondary:hover{--_bg:rgba(255,255,255,.10);}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--space-10);align-items:start;}
.contact-cards{display:flex;flex-direction:column;gap:var(--space-4);}
.contact-card{position:relative;display:flex;gap:var(--space-4);padding:var(--space-5);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);}
.contact-card__icon{flex:none;width:2.75rem;height:2.75rem;display:grid;place-items:center;border-radius:var(--radius-md);background:var(--accent-50);color:var(--accent-700);}
.contact-card__icon svg{width:1.5rem;height:1.5rem;}
.contact-card__label{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--fg-subtle);}
.contact-card__value{font-size:var(--text-xl);font-weight:800;margin-top:.15rem;letter-spacing:-.01em;}
.contact-card__value a::after{content:"";position:absolute;inset:0;}/* カード全面をタップ領域に（電話/メール） */
.contact-card__note{font-size:var(--text-xs);color:var(--fg-subtle);margin-top:.15rem;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);}
.form-grid .field--full{grid-column:1 / -1;}
.form-status{margin-top:var(--space-4);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:700;line-height:var(--leading-normal);}
.form-status--success{background:#EEF7EA;color:#2F6325;border:1px solid #B9DCB0;}
.form-status--error{background:var(--error-bg);color:var(--error-fg);border:1px solid var(--error-border);}
.form-note{margin-top:var(--space-4);font-size:var(--text-sm);color:var(--fg-subtle);line-height:var(--leading-normal);}

/* ---------- info note（仮・準備中の上品な明示） ---------- */
.note{display:flex;gap:var(--space-3);padding:var(--space-4) var(--space-5);background:var(--accent-50);border:1px solid var(--accent-200);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--n-700);line-height:var(--leading-normal);}
.note svg{flex:none;width:1.2rem;height:1.2rem;color:var(--accent-700);margin-top:.1em;}

/* ---------- 採用：1日の流れ / 募集要項 ---------- */
.timeline{display:grid;gap:0;}
.timeline__item{display:grid;grid-template-columns:5.5rem 1fr;gap:var(--space-5);padding:var(--space-5) 0;border-top:1px solid var(--border);}
.timeline__item:first-child{border-top:0;}
.timeline__time{font-family:var(--font-serif);font-weight:600;color:var(--accent-700);font-size:var(--text-lg);}
.timeline__t{font-weight:800;}
.timeline__d{margin-top:.25rem;font-size:var(--text-sm);color:var(--fg-muted);line-height:var(--leading-relaxed);}

/* ---------- FAQ（採用・よくある質問） ---------- */
.faq{max-width:var(--measure);}
.faq__item{border-top:1px solid var(--border);padding:var(--space-5) 0;}
.faq__item:first-child{border-top:0;padding-top:0;}
.faq__item:last-child{padding-bottom:0;}
.faq__q{font-size:var(--text-lg);font-weight:800;letter-spacing:-.01em;display:flex;gap:.6em;align-items:baseline;}
.faq__q::before{content:"Q";font-family:var(--font-serif);color:var(--accent-700);font-weight:600;}
.faq__a{margin-top:var(--space-3);color:var(--fg-muted);font-size:var(--text-sm);line-height:var(--leading-relaxed);padding-left:1.5em;}

/* ---------- voice（社員・お客様の声＝サンプル） ---------- */
.voice{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-6);position:relative;}
.voice__q{font-family:var(--font-serif);font-size:var(--text-lg);font-weight:600;line-height:var(--leading-relaxed);color:var(--fg);}
.voice__by{margin-top:var(--space-4);font-size:var(--text-sm);color:var(--fg-subtle);font-weight:600;}

/* ---------- placeholder（写真差し替え枠 共通・上質化） ---------- */
.ph{position:relative;background:var(--surface-2);border:1px solid var(--border-strong);border-radius:var(--radius-lg);display:grid;place-items:center;text-align:center;color:var(--fg-subtle);overflow:hidden;aspect-ratio:4/3;
  background-image:repeating-linear-gradient(135deg,transparent,transparent 14px,rgba(195,154,60,.05) 14px,rgba(195,154,60,.05) 28px);}
.ph__inner{padding:var(--space-4);}
.ph__mark{font-size:var(--text-2xl);color:var(--accent-500);}
.ph__text{font-size:var(--text-xs);margin-top:var(--space-2);max-width:24ch;}

/* ---------- footer ---------- */
.site-footer{background:var(--ink);color:rgba(255,255,255,.8);border-top:3px solid var(--gold);}
.site-footer__inner{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.2fr;gap:var(--space-8);padding-block:var(--space-12) var(--space-10);}
.site-footer .brand__mark{color:#fff;}
.site-footer .brand__name{color:rgba(255,255,255,.6);}
.site-footer__brand .brand{margin-bottom:var(--space-4);}
.site-footer__brand p{font-size:var(--text-sm);color:rgba(255,255,255,.62);line-height:var(--leading-normal);}
.site-footer__brand p+p{margin-top:var(--space-2);}
.site-footer__col h3{font-size:var(--text-xs);font-weight:700;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--gold-bright);margin-bottom:var(--space-4);}
.site-footer__col a,.site-footer__col p{display:block;font-size:var(--text-sm);color:rgba(255,255,255,.72);margin-bottom:var(--space-2);}
.site-footer__col a:hover{color:#fff;}
.site-footer__bar{border-top:1px solid rgba(255,255,255,.12);}
.site-footer__bar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-2);padding-block:var(--space-4);}
.site-footer__bar small{font-size:var(--text-xs);color:rgba(255,255,255,.62);}

/* ---------- sticky mobile CTA ---------- */
.mobile-cta{display:none;}
@media (max-width:860px){
  .mobile-cta{display:grid;grid-template-columns:1fr 1fr;gap:1px;position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--ink);border-top:2px solid var(--gold);padding-bottom:env(safe-area-inset-bottom);}
  .mobile-cta a{display:flex;align-items:center;justify-content:center;gap:.5em;height:3.5rem;font-weight:800;font-size:var(--text-sm);text-decoration:none;}
  .mobile-cta a svg{width:1.2em;height:1.2em;}
  .mobile-cta__tel{background:var(--accent-600);color:var(--accent-contrast);}
  .mobile-cta__form{background:transparent;color:#fff;}
  body{padding-bottom:calc(3.5rem + env(safe-area-inset-bottom));}
}

/* ---------- breadcrumb / page header ---------- */
.page-hero{position:relative;background:var(--ink);color:#fff;border-bottom:3px solid var(--gold);padding:var(--space-12) 0 var(--space-10);overflow:hidden;}
.page-hero__bg{position:absolute;inset:0;z-index:0;opacity:.38;object-fit:cover;width:100%;height:100%;}
.page-hero::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(20,18,14,.80),rgba(20,18,14,.58));}
.page-hero .container{position:relative;z-index:1;}
.crumb{font-size:var(--text-xs);color:rgba(255,255,255,.6);margin-bottom:var(--space-4);}
.crumb ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:.45em;padding:0;margin:0;}
.crumb li{display:inline-flex;align-items:center;gap:.45em;}
.crumb li:not(:last-child)::after{content:"＞";color:rgba(255,255,255,.4);}
.crumb a{color:rgba(255,255,255,.6);}
.crumb a:hover{color:var(--gold-bright);}
.page-hero__title{font-size:clamp(1.9rem,3.6vw,2.7rem);font-weight:800;letter-spacing:-.025em;color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.6);}
.page-hero__sub{margin-top:var(--space-3);color:rgba(255,255,255,.9);max-width:var(--measure);line-height:var(--leading-relaxed);text-shadow:0 1px 10px rgba(0,0,0,.5);}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .site-nav{gap:var(--space-4);}
  .header__tel{display:none;}
}
@media (max-width:960px){
  .services{grid-template-columns:repeat(2,1fr);}
  .pillars{grid-template-columns:1fr;gap:var(--space-6);}
  .pillar{padding-bottom:var(--space-6);border-bottom:1px solid var(--border);}
  .section--ink .pillar{border-color:rgba(255,255,255,.12);}
  .pillar:last-child{border-bottom:0;padding-bottom:0;}
  .site-footer__inner{grid-template-columns:1fr 1fr;gap:var(--space-6);}
}
@media (max-width:860px){
  .nav-toggle{display:flex;margin-left:auto;}
  .header__right{gap:var(--space-3);}
  .site-nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--surface);border-bottom:1px solid var(--border);box-shadow:var(--shadow-lg);padding:var(--space-3) var(--space-5) var(--space-5);display:none;}
  .site-nav.is-open{display:flex;}
  .site-nav a{padding:var(--space-3) 0;border-bottom:1px solid var(--border);font-size:var(--text-base);}
  .site-nav__cta{justify-content:center;margin-top:var(--space-3);border-bottom:0;height:3rem;}
  .header__inner{position:relative;}
  .audience{grid-template-columns:1fr;}
  .trust__row{grid-template-columns:1fr 1fr;gap:var(--space-4) var(--space-5);}
  .site-footer__col a{padding-block:.4rem;}
}
@media (max-width:720px){
  .hero{min-height:auto;align-items:flex-end;}
  .hero__bg img{object-position:60% center;}
  .hero__panel{width:100%;background:linear-gradient(0deg,rgba(20,18,14,.92) 30%,rgba(20,18,14,.5) 100%);}
  .hero__inner{padding-block:var(--space-16) var(--space-8);}
  .hero .eyebrow__sep{display:none;}/* SP=エリアとサービスを改行（｜は非表示） */
  .hero .eyebrow__svc{flex-basis:100%;}
  .hero .eyebrow::before{display:none;}/* SP=先頭のアクセントバーは非表示 */
  .hero__tertiary-cta{display:block;}/* SP=「お問い合わせ／お電話 から。」を次行へ */
  .section{padding:var(--space-10) 0;}
  .services{grid-template-columns:1fr;}
  .works{grid-template-columns:1fr;}
  .split2{grid-template-columns:1fr;gap:var(--space-6);}
  .stance{grid-template-columns:1fr;gap:var(--space-6);}
  .stance__media{order:-1;}
  .leader{grid-template-columns:1fr;gap:var(--space-6);}
  .leader__photo{max-width:240px;}
  .contact-grid{grid-template-columns:1fr;gap:var(--space-8);}
  .form-grid{grid-template-columns:1fr;}
  .site-footer__inner{grid-template-columns:1fr 1fr;}
  .cta-band{padding:var(--space-8) var(--space-5);}
  .timeline__item{grid-template-columns:4.5rem 1fr;gap:var(--space-4);}
}
@media (max-width:560px){
  /* 仕様テーブルをスマホで縦積み（ラベル→値）＝潰れ/見切れ解消 */
  .spec-table,.spec-table tbody,.spec-table tr,.spec-table th,.spec-table td{display:block;width:auto;}
  .spec-table th{white-space:normal;background:transparent;border-bottom:0;padding:var(--space-4) var(--space-5) 0;}
  .spec-table td{padding-top:var(--space-1);}
}
@media (max-width:480px){
  .section__title--sp-nowrap{white-space:nowrap;overflow-wrap:normal;word-break:keep-all;font-size:1.34rem;letter-spacing:0;line-height:1.35;}
  .hero__cta{flex-direction:column;align-items:stretch;}
  .hero__cta .btn{width:100%;}
  .cta-band__actions{flex-direction:column;align-items:stretch;}
  .cta-band__actions .btn{width:100%;}
  .site-footer__inner{grid-template-columns:1fr;}
  .audience__card{padding:var(--space-5);}
}
@media (max-width:380px){
  .container{padding-inline:var(--space-4);}
}
@media (max-width:360px){
  .section__title--sp-nowrap{font-size:1.22rem;}
}
@media (max-width:340px){
  .section__title--sp-nowrap{font-size:1.1rem;}
}

/* === Theme Studio FV framing === */
.hero__bg img{object-position:78% 50%;}
@media (max-width:720px){.hero__bg img{object-position:50% 50%;transform:none;}}/* SP=縦長mv-05-sp（被写体センター） */