:root{
    --paper:#FFFFFF;
    --ink:#262420;
    --ink-soft:#6E6A63;
    --accent:#E5563B;        /* 朱赤 */
    --accent-d:#C8442B;
    --sub:#5C7186;           /* 藍鼠 */
    --sub-d:#465A6C;
    --line:#E7E4DD;
    --card:#FFFFFF;
    --shadow:0 2px 16px rgba(38,36,32,.06);
    --radius:12px;
    --side:280px;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    background:var(--paper);color:var(--ink);
    font-family:"Noto Sans JP",sans-serif;font-weight:400;
    line-height:1.85;letter-spacing:.02em;
    -webkit-font-smoothing:antialiased;
  }
  .zen{font-family:"Zen Kaku Gothic New",sans-serif;}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}

  /* ===== layout ===== */
  .shell{display:flex;align-items:flex-start;}
  /* ---- sidebar ---- */
  .side{
    width:var(--side);flex:0 0 var(--side);
    position:sticky;top:0;height:100vh;
    padding:26px 22px;display:flex;flex-direction:column;gap:18px;
    overflow-y:auto;
  }
  .logo{
    border:1.5px solid var(--ink);border-radius:var(--radius);
    padding:14px 20px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;
  }
  .logo .mark{
    font-family:"Zen Kaku Gothic New";font-weight:900;font-size:1.24rem;
    line-height:1.2;letter-spacing:.08em;
  }
  .logo .sub{
    font-size:.62rem;letter-spacing:.04em;color:var(--ink-soft);line-height:1.6;
    padding-top:2px;width:100%;white-space:nowrap;
  }
  /* 屋号のみのロゴ（未使用・区切り線を消す） */
  .logo-solo .sub{border-top:none;padding-top:0;}
  .navlist{display:flex;flex-direction:column;}
  .navlist a{
    display:flex;align-items:center;gap:14px;
    padding:16px 8px 16px 16px;position:relative;
    border-bottom:1px solid var(--line);transition:padding .3s;
  }
  .navlist a:first-child{border-top:1px solid var(--line);}
  /* left accent bar grows on hover */
  .navlist a::before{
    content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
    width:3px;height:0;background:var(--accent);transition:height .3s ease;border-radius:2px;
  }
  .navlist a:hover::before{height:60%;}
  .navlist a:hover{padding-left:22px;}
  .navlist .num{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.66rem;color:var(--sub);letter-spacing:.1em;flex:0 0 auto;width:1.4em;}
  .navlist .txt{flex:1 1 auto;}
  .navlist .en{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:1.12rem;letter-spacing:.06em;display:block;line-height:1.1;transition:color .3s;}
  .navlist a:hover .en{color:var(--accent);}
  .navlist .ja{font-size:.66rem;color:var(--ink-soft);display:block;margin-top:3px;letter-spacing:.12em;}
  .navlist .arr{font-size:.8rem;color:var(--line);transition:color .3s,transform .3s;flex:0 0 auto;}
  .navlist a:hover .arr{color:var(--accent);transform:translateX(3px);}
  .side-cta{
    border:1.5px solid var(--ink);border-radius:999px;
    padding:15px 20px;display:flex;align-items:center;justify-content:center;gap:12px;
    font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.9rem;letter-spacing:.06em;
    transition:background .3s,color .3s;margin-top:18px;
  }
  .side-cta:hover{background:var(--accent);color:#fff;border-color:var(--accent);}
  .side-cta .arr{width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;border:none;display:grid;place-items:center;font-size:.72rem;transition:background .3s;}
  .side-cta:hover .arr{background:#fff;color:var(--accent);}




  /* ---- main ---- */
  .main{flex:1 1 auto;min-width:0;padding:26px 34px 60px 8px;}

  /* hero — mosaic of photos */
  .hero{margin-bottom:22px;}
  .hero-mosaic{display:grid;gap:12px;grid-template-columns:1.55fr 1fr;}
  .hcell{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#EEEBE3;position:relative;}
  .hcell img{width:100%;height:100%;object-fit:cover;transition:transform .8s;}
  .hcell:hover img{transform:scale(1.04);}
  .hcell.placeholder{display:grid;place-items:center;color:#B6B1A6;font-size:.72rem;letter-spacing:.12em;min-height:120px;
    background:repeating-linear-gradient(45deg,#F2EFE8,#F2EFE8 12px,#EDEAE2 12px,#EDEAE2 24px);}
  .hero-right{display:grid;gap:12px;grid-template-rows:1fr 1fr;}
  .hcell.lead-cell{aspect-ratio:auto;}
  .hcell.lead-cell::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.52) 100%);}
  .hero-copy{position:absolute;left:0;bottom:0;z-index:2;color:#fff;padding:34px 34px;max-width:94%;}
  .hero-eyebrow{display:inline-block;background:var(--accent);color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.14em;padding:6px 14px;border-radius:999px;margin-bottom:16px;}
  .hero-copy h1{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(1.4rem,2.8vw,2.1rem);line-height:1.5;letter-spacing:.04em;text-shadow:0 2px 20px rgba(0,0,0,.3);}
  .hero-copy p{font-size:clamp(.82rem,1.5vw,.96rem);font-weight:500;margin-top:12px;line-height:1.9;text-shadow:0 2px 14px rgba(0,0,0,.34);}
  .hero-copy .ac{color:#FFC9BD;}

  /* ===== CONCEPT ===== */
  .concept{margin:46px 0 10px;}
  .concept .jp-tagline{
    font-family:"Zen Kaku Gothic New";font-weight:900;
    font-size:clamp(1.8rem,4.4vw,3rem);line-height:1.4;letter-spacing:.04em;
    color:var(--ink);
  }
  .concept .jp-tagline .ac{color:var(--accent);}
  .concept .lead{
    font-family:"Zen Kaku Gothic New";font-weight:700;
    font-size:clamp(1.15rem,2.4vw,1.55rem);line-height:1.95;letter-spacing:.05em;
    margin-top:30px;max-width:24em;
  }
  .concept .lead .ac{color:var(--accent-d);}
  .concept .desc{font-size:.88rem;color:var(--ink-soft);line-height:2.3;margin-top:18px;max-width:42em;}

  /* section title */
  .stitle{margin:48px 2px 18px;}
  .stitle .row{display:flex;align-items:center;gap:14px;}
  /* 襠（マチ）マーク：あいだが開く2本の縦線 */
  .machi-mark{
    display:inline-flex;align-items:center;justify-content:center;
    width:0;height:1.5em;position:relative;margin-right:0;
    transition:width .9s cubic-bezier(.22,1,.36,1), margin-right .9s cubic-bezier(.22,1,.36,1);
    vertical-align:middle;flex:0 0 auto;overflow:visible;
  }
  .machi-mark::before,.machi-mark::after{
    content:"";position:absolute;top:0;bottom:0;width:2px;
    background:var(--accent);border-radius:2px;
    left:50%;transform:translateX(-50%);
    transition:left .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1), height .9s ease;
  }
  /* reveal で開く：2本が左右に離れ、あいだ（余白）が生まれる */
  .stitle.in .machi-mark, .page-head.in .machi-mark, .block-head.in .machi-mark{width:18px;margin-right:14px;}
  .stitle.in .machi-mark::before, .page-head.in .machi-mark::before, .block-head.in .machi-mark::before{left:0;transform:translateX(0);}
  .stitle.in .machi-mark::after, .page-head.in .machi-mark::after, .block-head.in .machi-mark::after{left:100%;transform:translateX(-100%);}
  .stitle .ja-main{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(1.5rem,3.2vw,2.1rem);letter-spacing:.06em;line-height:1.2;}
  .stitle .badge{background:var(--accent);color:#fff;font-size:.62rem;font-weight:700;letter-spacing:.1em;padding:5px 12px;border-radius:999px;white-space:nowrap;}
  .stitle .en{font-family:"Zen Kaku Gothic New";font-weight:500;font-size:.78rem;letter-spacing:.18em;color:var(--sub);margin-top:8px;}
  .stitle .ja{display:none;}

  /* service cards */
  .svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
  .svc{
    background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);
    padding:26px 24px;box-shadow:var(--shadow);transition:transform .3s,border-color .3s;
  }
  .svc:hover{transform:translateY(-4px);border-color:var(--accent);}
  .svc .no{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:.9rem;color:var(--accent);letter-spacing:.1em;}
  .svc h3{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:1.12rem;letter-spacing:.04em;margin:12px 0 12px;line-height:1.6;}
  .svc p{font-size:.82rem;color:var(--ink-soft);line-height:2;}

  /* works grid (the signature: dense photo+text mosaic) */
  .works-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:270px;gap:12px;}
  .work{
    background:var(--card);border-radius:var(--radius);overflow:hidden;
    box-shadow:var(--shadow);transition:transform .3s;display:flex;flex-direction:column;
  }
  .work:hover{transform:translateY(-4px);}
  .work .ph{flex:1 1 auto;overflow:hidden;background:#EEEBE3;position:relative;min-height:0;}
  .work .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s;}
  .work:hover .ph img{transform:scale(1.05);}
  .work .ph.placeholder{display:grid;place-items:center;color:#B6B1A6;font-size:.72rem;letter-spacing:.1em;
    background:repeating-linear-gradient(45deg,#F4F2EC,#F4F2EC 12px,#EFEDE5 12px,#EFEDE5 24px);}
  /* corner label on photo, like reference site */
  .work .ph-label{
    position:absolute;left:12px;top:12px;z-index:2;
    background:#fff;border:1.5px solid var(--ink);
    font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.66rem;letter-spacing:.06em;
    padding:6px 11px;line-height:1.3;border-radius:8px;
  }
  .work .meta{padding:14px 16px 16px;flex:0 0 auto;}
  .work .tag{display:inline-block;background:#FBEEEA;color:var(--accent-d);font-size:.62rem;font-weight:700;letter-spacing:.06em;padding:3px 9px;border-radius:999px;margin-bottom:7px;}
  .work h3{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.96rem;line-height:1.5;letter-spacing:.03em;}
  .work .role{font-size:.72rem;color:var(--ink-soft);margin-top:4px;}
  /* mosaic spans */
  .work.big{grid-column:span 2;grid-row:span 2;}
  .work.wide{grid-column:span 2;}
  .work.tall{grid-row:span 2;}
  .work.big h3{font-size:1.2rem;}
  .more-row{margin:28px 0 0;display:flex;justify-content:center;}
  .more-link{
    position:relative;display:inline-flex;align-items:center;gap:16px;
    font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.96rem;letter-spacing:.04em;
    background:var(--card);border:1.5px solid var(--ink);border-radius:999px;
    padding:15px 24px 15px 32px;transition:background .3s,color .3s;
  }
  .more-link:hover{background:var(--ink);color:var(--paper);}
  /* round arrow, same as side-cta */
  .more-link .tab{
    width:24px;height:24px;border-radius:50%;
    border:none;background:var(--accent);
    display:grid;place-items:center;color:#fff;font-size:.62rem;
    transition:transform .3s,background .3s;flex:0 0 auto;
  }
  .more-link:hover .tab{transform:translateX(3px);background:#fff;color:var(--accent);}

  /* about */
  .about{
    display:grid;grid-template-columns:0.85fr 1.15fr;gap:18px;align-items:stretch;
    margin-top:14px;
  }
  .about .ph{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#EEEBE3;min-height:300px;}
  .about .ph.placeholder{display:grid;place-items:center;color:#B6B1A6;font-size:.74rem;letter-spacing:.1em;
    background:repeating-linear-gradient(45deg,#F2EFE8,#F2EFE8 12px,#EDEAE2 12px,#EDEAE2 24px);}
  .about .ph img{width:100%;height:100%;object-fit:cover;}
  .about .body{
    background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);
    padding:34px 36px;box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:center;
  }
  .about .body h2{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(1.3rem,2.6vw,1.7rem);line-height:1.6;letter-spacing:.05em;margin-bottom:18px;}
  .about .body p{font-size:.86rem;color:var(--ink-soft);line-height:2.2;margin-bottom:22px;max-width:34em;}
  .about .name{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:1.05rem;letter-spacing:.1em;}
  .about .name small{display:block;font-weight:400;font-size:.66rem;color:var(--accent-d);letter-spacing:.2em;margin-top:5px;font-family:"Noto Sans JP";}

  /* contact */
  .contact{
    background:#7A736A;color:#fff;border-radius:var(--radius);
    padding:54px 44px;margin-top:14px;text-align:center;position:relative;overflow:hidden;
  }
  .contact::before{content:"";position:absolute;top:-40%;right:-10%;width:300px;height:300px;border-radius:50%;background:var(--accent);opacity:.22;}
  .contact h2{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(1.4rem,3vw,2rem);letter-spacing:.06em;line-height:1.6;margin-bottom:14px;position:relative;}
  .contact p{font-size:.84rem;color:#F4F2EF;max-width:32em;margin:0 auto 28px;line-height:2.1;position:relative;}
  .contact .btn{position:relative;display:inline-flex;align-items:center;gap:14px;background:var(--accent);color:#fff;font-weight:700;font-size:.88rem;padding:15px 34px;border-radius:999px;transition:background .3s,gap .3s;}
  .contact .btn:hover{background:var(--accent-d);gap:20px;}

  /* footer */
  footer{
    margin-top:40px;padding:46px 44px 40px;border-radius:var(--radius);
    background:#4A453F;color:#EDEAE3;
    display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:18px;
  }
  footer .fl .fn{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:1.15rem;letter-spacing:.06em;color:#fff;}
  footer .fl .loc{font-size:.72rem;color:#A8A39A;margin-top:8px;}
  footer .fnav{display:flex;gap:22px;font-size:.78rem;color:#C8C3BA;}
  footer .fnav a{transition:color .3s;}
  footer .fnav a:hover{color:var(--accent);}
  footer .cp{font-size:.66rem;color:#8A857C;letter-spacing:.08em;}

  /* reveal */
  .rv{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s ease;}
  .rv.in{opacity:1;transform:none;}

  /* ===== mobile ===== */
  .mtop{display:none;}
  .menu-toggle{display:none;}
  @media(max-width:900px){
    .shell{flex-direction:column;}
    /* 1段目：ロゴのヘッダー（上部固定） */
    .side{
      position:sticky;top:0;z-index:100;
      width:100%;height:auto;min-height:0;max-height:none;flex:0 0 auto;
      flex-direction:row;align-items:center;justify-content:space-between;
      gap:12px;padding:8px 14px;
      background:rgba(255,255,255,.95);backdrop-filter:saturate(120%) blur(8px);
      border-bottom:1.5px solid var(--line);overflow:visible;
    }
    .logo{flex:0 0 auto;padding:7px 14px;gap:5px;border-radius:var(--radius);}
    .logo .mark{font-size:.98rem;}
    .logo .sub{display:block;font-size:.5rem;line-height:1.4;letter-spacing:.03em;padding-top:5px;}
    .navlist{display:none;}
    /* お問い合わせはメニュー内に含めるのでヘッダーからは隠す */
    .side-cta{display:none;}
    .main{padding:0 16px 50px;width:100%;}
    .hero-mosaic{grid-template-columns:1fr;}
    .hero-right{grid-template-columns:1fr 1fr;grid-template-rows:none;}
    .hcell.lead-cell{aspect-ratio:4/3;}
    .hcell.r1,.hcell.r2{aspect-ratio:1/1;}
    .svc-grid{grid-template-columns:1fr;}
    .works-grid{grid-template-columns:1fr 1fr;grid-auto-rows:auto;}
    .work{display:flex;flex-direction:column;}
    .work .ph{aspect-ratio:3/2;flex:0 0 auto;}
    .work.big,.work.wide,.work.tall{grid-column:auto;grid-row:auto;}
    .work.big h3{font-size:1rem;}
    .about{grid-template-columns:1fr;}
    /* ロゴ右の三本線トグル（モバイルのみ表示） */
    .menu-toggle{
      display:flex;flex-direction:column;justify-content:center;gap:5px;
      width:44px;height:44px;flex:0 0 auto;padding:0 10px;
      background:none;border:none;cursor:pointer;border-radius:var(--radius);
    }
    .mt-line{display:block;height:2.5px;width:100%;background:var(--accent);border-radius:2px;
      transition:transform .35s cubic-bezier(.5,0,.2,1), opacity .25s, width .35s;}
    /* 開いたとき：上下が中央に寄って×、真ん中は「あいだ」に消える */
    .menu-toggle[aria-expanded="true"] .mt-line:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
    .menu-toggle[aria-expanded="true"] .mt-line:nth-child(2){opacity:0;width:0;margin:0 auto;}
    .menu-toggle[aria-expanded="true"] .mt-line:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}
    /* 開閉式ドロップダウンメニュー（旧mtop） */
    .mtop{
      display:flex;flex-direction:column;gap:2px;
      position:fixed;top:59px;left:0;right:0;z-index:98;
      margin:0;padding:12px 16px 16px;
      background:rgba(255,255,255,.98);backdrop-filter:saturate(120%) blur(10px);
      border-bottom:1.5px solid var(--line);box-shadow:0 12px 24px rgba(0,0,0,.06);
      transform:translateY(-12px);opacity:0;pointer-events:none;
      transition:transform .3s cubic-bezier(.22,1,.36,1), opacity .3s;
    }
    .mtop.is-open{transform:translateY(0);opacity:1;pointer-events:auto;}
    .mtop a{
      font-size:.98rem;font-weight:700;font-family:"Zen Kaku Gothic New";
      padding:15px 8px;border-bottom:1px solid var(--line);color:var(--ink);
      display:flex;align-items:center;gap:12px;transition:color .2s,padding .2s;
    }
    .mtop a:last-child{border-bottom:none;}
    .mtop a::before{content:"";width:14px;height:2px;background:var(--accent);border-radius:2px;transition:width .25s;flex:0 0 auto;}
    .mtop a:hover,.mtop a[aria-current="page"]{color:var(--accent);}
    .mtop a:hover::before,.mtop a[aria-current="page"]::before{width:22px;}
  }
  @media(max-width:560px){
    .works-grid{grid-template-columns:1fr;}
    .hero-copy{padding:24px 22px;}
    /* 狭い画面：お問い合わせはアイコンのみ、ロゴのサブは残す */
    .side-cta .cta-txt{display:none;}
    .side-cta{padding:9px;}
  }
/* ===== sub pages ===== */
.page-head{margin:14px 2px 36px;}
.page-head .crumb{font-size:.74rem;color:var(--ink-soft);letter-spacing:.08em;margin-bottom:18px;}
.page-head .crumb a:hover{color:var(--accent-d);}
.page-head .row{display:flex;align-items:center;gap:14px;}
.page-head .ja-main{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:.06em;line-height:1.2;}
.page-head .badge{background:var(--accent);color:#fff;font-size:.64rem;font-weight:700;letter-spacing:.1em;padding:5px 12px;border-radius:999px;white-space:nowrap;}
.page-head .en{font-family:"Zen Kaku Gothic New";font-weight:500;font-size:.8rem;letter-spacing:.18em;color:var(--sub);margin-top:12px;}
.page-head .desc{font-size:.9rem;color:var(--ink-soft);line-height:2.2;margin-top:20px;max-width:42em;}

/* works list (even grid) */
.works-list{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.wcard{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .3s,border-color .3s;display:flex;flex-direction:column;}
.wcard:hover{transform:translateY(-4px);border-color:var(--accent);}
.wcard .ph{aspect-ratio:3/2;overflow:hidden;background:#EEEBE3;position:relative;}
.wcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s;}
.wcard:hover .ph img{transform:scale(1.05);}
.wcard .ph.placeholder{display:grid;place-items:center;color:#B6B1A6;font-size:.72rem;letter-spacing:.1em;
  background:repeating-linear-gradient(45deg,#F4F2EC,#F4F2EC 12px,#EFEDE5 12px,#EFEDE5 24px);}
.wcard .meta{padding:20px 20px 24px;display:flex;flex-direction:column;flex:1 1 auto;}
.wcard .tag{display:inline-block;align-self:flex-start;background:#FBEEEA;color:var(--accent-d);font-size:.64rem;font-weight:700;letter-spacing:.06em;padding:4px 11px;border-radius:999px;margin-bottom:12px;}
.wcard h3{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:1.12rem;line-height:1.5;letter-spacing:.03em;}
.wcard .role{font-size:.76rem;color:var(--sub);margin-top:6px;font-weight:500;}
.wcard .note{font-size:.82rem;color:var(--ink-soft);line-height:2;margin-top:14px;}

@media(max-width:900px){
  .works-list{grid-template-columns:1fr 1fr;}
}
@media(max-width:560px){
  .works-list{grid-template-columns:1fr;}
}

/* current page in nav */
.navlist a[aria-current="page"]{position:relative;}
.navlist a[aria-current="page"]::before{height:60%;}
.navlist a[aria-current="page"] .en{color:var(--accent);}
.mtop a[aria-current="page"]{background:var(--accent);color:#fff;border-color:var(--accent);}

/* ===== about page ===== */
.about-hero{display:grid;grid-template-columns:0.85fr 1.15fr;gap:24px;align-items:stretch;margin-bottom:24px;}
.about-hero.no-photo{grid-template-columns:1fr;}
.about-hero .ph{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#EEEBE3;min-height:360px;}
.about-hero .ph.placeholder{display:grid;place-items:center;color:#B6B1A6;font-size:.76rem;letter-spacing:.1em;
  background:repeating-linear-gradient(45deg,#F4F2EC,#F4F2EC 12px,#EFEDE5 12px,#EFEDE5 24px);}
.about-hero .ph img{width:100%;height:100%;object-fit:cover;}
.about-hero .intro{display:flex;flex-direction:column;justify-content:center;padding:8px 4px;}
.about-hero .intro .lead-q{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(1.4rem,3vw,2rem);line-height:1.7;letter-spacing:.05em;margin-bottom:20px;}
.about-hero .intro .lead-q .ac{color:var(--accent);}
.about-hero .intro p{font-size:.9rem;color:var(--ink-soft);line-height:2.3;max-width:30em;}
.about-hero .intro .name{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:1.1rem;letter-spacing:.12em;margin-top:24px;}
.about-hero .intro .name small{display:block;font-family:"Noto Sans JP";font-weight:400;font-size:.68rem;color:var(--sub);letter-spacing:.2em;margin-top:6px;}

/* block heading inside page */
.block-head{margin:52px 2px 22px;}
.block-head .row{display:flex;align-items:center;gap:13px;}
.block-head .ja{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:clamp(1.3rem,2.6vw,1.7rem);letter-spacing:.05em;}
.block-head .badge{background:var(--accent);color:#fff;font-size:.6rem;font-weight:700;letter-spacing:.1em;padding:4px 11px;border-radius:999px;}

/* timeline */
.timeline{border-left:2px solid var(--line);margin-left:6px;padding-left:0;}
.timeline .item{position:relative;padding:0 0 26px 28px;}
.timeline .item::before{content:"";position:absolute;left:-7px;top:7px;width:12px;height:12px;border-radius:50%;background:var(--accent);border:2px solid var(--paper);}
.timeline .item:last-child{padding-bottom:0;}
.timeline .place{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:1rem;letter-spacing:.03em;}
.timeline .txt{font-size:.86rem;color:var(--ink-soft);line-height:2;margin-top:5px;max-width:40em;}

/* company info table */
.info-table{border-top:1.5px solid var(--line);max-width:640px;}
.info-table .tr{display:grid;grid-template-columns:9rem 1fr;gap:18px;padding:15px 4px;border-bottom:1.5px solid var(--line);}
.info-table .th{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.82rem;letter-spacing:.06em;color:var(--ink);}
.info-table .td{font-size:.86rem;color:var(--ink-soft);line-height:1.9;}
.info-table .td.tbd{color:#B6B1A6;font-style:normal;}

@media(max-width:900px){
  .about-hero{grid-template-columns:1fr;}
  .about-hero .ph{min-height:260px;aspect-ratio:3/2;}
}
@media(max-width:560px){
  .info-table .tr{grid-template-columns:1fr;gap:4px;}
}

/* ===== contact page ===== */
.contact-wrap{display:grid;grid-template-columns:0.8fr 1.2fr;gap:40px;align-items:start;}
.contact-side .lead{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:clamp(1.1rem,2.4vw,1.4rem);line-height:1.9;letter-spacing:.05em;margin-bottom:20px;}
.contact-side p{font-size:.86rem;color:var(--ink-soft);line-height:2.2;max-width:26em;margin-bottom:24px;}
.contact-side .alt{border-top:1.5px solid var(--line);padding-top:20px;margin-top:4px;}
.contact-side .alt .k{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.74rem;letter-spacing:.08em;color:var(--ink);margin-bottom:6px;}
.contact-side .alt .v{font-size:.84rem;color:var(--ink-soft);margin-bottom:16px;}
.contact-side .alt .v.tbd{color:#B6B1A6;}

.form{display:flex;flex-direction:column;gap:22px;}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.84rem;letter-spacing:.04em;display:flex;align-items:center;gap:10px;}
.field .req{background:var(--accent);color:#fff;font-size:.58rem;font-weight:700;letter-spacing:.06em;padding:2px 8px;border-radius:999px;}
.field .opt{background:var(--paper-2,#F4F2EC);color:var(--ink-soft);font-size:.58rem;font-weight:700;letter-spacing:.06em;padding:2px 8px;border-radius:999px;border:1px solid var(--line);}
.field input,.field select,.field textarea{
  font-family:"Noto Sans JP",sans-serif;font-size:.9rem;color:var(--ink);
  background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);
  padding:13px 15px;transition:border-color .25s,box-shadow .25s;width:100%;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(229,86,59,.12);
}
.field textarea{resize:vertical;min-height:150px;line-height:1.9;}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236E6A63' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px;}
.form-note{font-size:.76rem;color:var(--ink-soft);line-height:1.9;}
.form-note a{color:var(--accent-d);text-decoration:underline;}
.submit-btn{
  align-self:flex-start;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.94rem;letter-spacing:.06em;
  background:var(--accent);color:#fff;border:none;border-radius:999px;padding:15px 44px;cursor:pointer;
  display:inline-flex;align-items:center;gap:12px;transition:background .3s,gap .3s;
}
.submit-btn:hover{background:var(--accent-d);gap:18px;}
.submit-btn:disabled{background:#CFCAC1;cursor:not-allowed;gap:12px;}
.submit-btn:disabled:hover{background:#CFCAC1;gap:12px;}
.cf-turnstile{margin:4px 0 4px;}

@media(max-width:900px){
  .contact-wrap{grid-template-columns:1fr;gap:28px;}
}

.side-cta[aria-current="page"]{background:var(--accent);color:#fff;border-color:var(--accent);}
.mtop a.side-cta[aria-current],.mtop a[aria-current="page"]{}

/* ===== news (home) ===== */
.news-list{display:flex;flex-direction:column;border-top:1.5px solid var(--line);}
.news-item{display:flex;align-items:center;gap:18px;padding:18px 6px;border-bottom:1.5px solid var(--line);position:relative;}
.news-item.is-link{transition:background .25s,padding .25s;cursor:pointer;}
.news-item.is-link:hover{background:#FBF6F4;padding-left:14px;}
.news-row .n-date,.news-item .news-head .news-date{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.78rem;color:var(--sub);letter-spacing:.06em;flex:0 0 auto;}
.news-row,.news-item{}
.news-row{display:flex;align-items:center;gap:18px;padding:18px 6px;border-bottom:1.5px solid var(--line);text-decoration:none;color:inherit;transition:background .25s,padding .25s;}
.news-row:hover{background:#FBF6F4;padding-left:14px;}
.news-row .n-date{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.78rem;color:var(--sub);letter-spacing:.06em;flex:0 0 auto;width:6.5em;}
.news-row .n-cat{font-size:.64rem;font-weight:700;letter-spacing:.06em;color:var(--accent-d);background:#FBEEEA;padding:4px 11px;border-radius:999px;flex:0 0 auto;}
.news-row .n-title{font-size:.9rem;color:var(--ink);line-height:1.7;flex:1 1 auto;}
.news-row .n-arr{color:var(--accent);font-size:.85rem;flex:0 0 auto;transition:transform .25s;}
.news-row:hover .n-arr{transform:translateX(4px);}
.news-empty{color:var(--ink-soft);font-size:.88rem;padding:24px 6px;}

/* ===== news (list page) ===== */
.news-page-list{display:flex;flex-direction:column;gap:0;border-top:1.5px solid var(--line);}
.nl-item{padding:26px 6px;border-bottom:1.5px solid var(--line);}
.nl-head{display:flex;align-items:center;gap:14px;margin-bottom:12px;}
.nl-head .n-date{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.82rem;color:var(--sub);letter-spacing:.06em;}
.nl-head .n-cat{font-size:.64rem;font-weight:700;letter-spacing:.06em;color:var(--accent-d);background:#FBEEEA;padding:4px 11px;border-radius:999px;}
.nl-title{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:1.12rem;line-height:1.6;letter-spacing:.03em;}
.nl-body{font-size:.86rem;color:var(--ink-soft);line-height:2.1;margin-top:10px;max-width:44em;}
.nl-link{display:inline-block;margin-top:14px;font-size:.82rem;font-weight:700;color:var(--accent-d);border-bottom:1.5px solid var(--accent);padding-bottom:3px;}
.nl-link:hover{color:var(--accent);}

@media(max-width:560px){
  .news-row{flex-wrap:wrap;gap:8px 12px;}
  .news-row .n-title{flex-basis:100%;}
}

.info-note{font-size:.68rem;color:#A8A39A;line-height:1.85;margin-top:16px;max-width:640px;}

.svc-note{font-size:.82rem;color:var(--ink-soft);margin-top:18px;letter-spacing:.02em;padding-left:2px;}

/* =====================================================================
   追加機能：実績モーダル・仕事の流れ（PROCESS）・カードのボタン化
   ===================================================================== */

/* 実績カードをボタン化したことによるリセット */
button.work, button.wcard{
  border:none;background:var(--card);text-align:left;cursor:pointer;
  font-family:inherit;color:inherit;width:100%;padding:0;
}
button.wcard{display:flex;flex-direction:column;overflow:hidden;
  border:1.5px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  transition:transform .3s,border-color .3s;}
button.wcard:hover{transform:translateY(-4px);border-color:var(--accent);}
button.work{display:flex;flex-direction:column;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .3s;}
button.work:hover{transform:translateY(-4px);}

/* ---- 実績モーダル ---- */
.modal-overlay{
  position:fixed;inset:0;background:rgba(38,36,32,.6);backdrop-filter:blur(4px);
  z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;
  opacity:0;pointer-events:none;transition:opacity .4s ease;
}
.modal-overlay.is-active{opacity:1;pointer-events:auto;}
.modal-window{
  background:var(--paper);border:1.5px solid var(--ink);border-radius:var(--radius);
  width:100%;max-width:660px;max-height:90vh;overflow-y:auto;position:relative;
  box-shadow:0 10px 40px rgba(0,0,0,.18);
  transform:translateY(20px);transition:transform .4s cubic-bezier(.25,1,.5,1);
}
.modal-overlay.is-active .modal-window{transform:translateY(0);}
.modal-close{
  position:absolute;top:14px;right:18px;background:none;border:none;
  font-size:1.9rem;line-height:1;color:var(--ink-soft);cursor:pointer;transition:color .2s;z-index:10;
}
.modal-close:hover{color:var(--accent);}
.modal-content{padding:40px 36px;}
.modal-tag{display:inline-block;background:#FBEEEA;color:var(--accent-d);font-size:.68rem;font-weight:700;letter-spacing:.06em;padding:4px 12px;border-radius:999px;margin-bottom:12px;}
.modal-content h3{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:1.5rem;line-height:1.4;margin-bottom:6px;letter-spacing:.03em;}
.modal-role{font-size:.8rem;color:var(--sub);font-weight:500;margin-bottom:24px;}
.modal-img{border-radius:var(--radius);overflow:hidden;aspect-ratio:16/9;background:#EEEBE3;margin-bottom:28px;border:1px solid var(--line);}
.modal-img img{width:100%;height:100%;object-fit:cover;}
.modal-img.placeholder{display:grid;place-items:center;color:#B6B1A6;font-size:.8rem;letter-spacing:.1em;
  background:repeating-linear-gradient(45deg,#F4F2EC,#F4F2EC 12px,#EFEDE5 12px,#EFEDE5 24px);}
.modal-story{display:flex;flex-direction:column;gap:20px;border-top:1.5px solid var(--line);padding-top:24px;}
.story-block h4{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.9rem;color:var(--accent-d);margin-bottom:6px;display:flex;align-items:center;gap:8px;}
.story-block h4::before{content:"";width:3px;height:1.2em;background:var(--accent);display:inline-block;border-radius:2px;}
.story-block p{font-size:.88rem;color:var(--ink-soft);line-height:2;}
.modal-note-fallback{font-size:.9rem;line-height:2;color:var(--ink-soft);}
.modal-action{margin-top:32px;text-align:center;border-top:1px solid var(--line);padding-top:24px;}
.modal-cta-btn{display:inline-block;font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.88rem;background:var(--ink);color:var(--paper);padding:14px 28px;border-radius:999px;transition:background .3s,transform .2s;}
.modal-cta-btn:hover{background:var(--accent);color:#fff;transform:translateY(-2px);}

/* ---- 仕事の流れ（PROCESS） ---- */
.process-wrap{display:flex;flex-direction:column;gap:0;position:relative;margin-top:24px;}
.process-wrap::before{content:"";position:absolute;left:24px;top:20px;bottom:20px;width:2px;background:var(--line);z-index:1;}
.process-item{display:flex;gap:24px;position:relative;z-index:2;padding-bottom:28px;}
.process-item:last-child{padding-bottom:0;}
.p-num-wrap{flex:0 0 50px;height:50px;border-radius:50%;background:var(--paper);border:2px solid var(--ink);display:grid;place-items:center;box-shadow:var(--shadow);transition:background .3s,border-color .3s;}
.p-num{font-family:"Zen Kaku Gothic New";font-weight:900;font-size:.6rem;color:var(--accent-d);letter-spacing:.04em;transition:color .3s;}
.process-item:hover .p-num-wrap{background:var(--accent);border-color:var(--accent);}
.process-item:hover .p-num{color:#fff;}
.p-text{flex:1;background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);padding:20px 24px;box-shadow:var(--shadow);transition:border-color .3s,transform .3s;}
.process-item:hover .p-text{border-color:var(--ink);transform:translateX(4px);}
.p-text h3{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:1.05rem;margin-bottom:8px;color:var(--ink);letter-spacing:.03em;}
.p-text p{font-size:.84rem;color:var(--ink-soft);line-height:1.95;}

@media(max-width:600px){
  .modal-content{padding:32px 20px;}
  .modal-content h3{font-size:1.3rem;}
  .process-wrap::before{left:18px;}
  .p-num-wrap{flex:0 0 38px;height:38px;}
  .p-num{font-size:.5rem;}
  .process-item{gap:14px;}
  .p-text{padding:16px 18px;}
}

/* 下線（ヒーローの「あいだ」など） */
.hand-underline{
  position:relative;
  color:inherit;
  white-space:nowrap;
  padding:0 .04em;
}
.hand-underline::after{
  content:"";
  position:absolute;
  left:0;right:0;
  bottom:-.1em;
  height:3px;
  background:var(--accent);
  border-radius:2px;
  pointer-events:none;
}

/* モーダル内の写真スライド（カルーセル） */
.modal-carousel{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:16/9;background:#EEEBE3;margin-bottom:28px;border:1px solid var(--line);}
.carousel-track{width:100%;height:100%;position:relative;}
.carousel-slide{position:absolute;inset:0;opacity:0;transition:opacity .4s ease;}
.carousel-slide.is-active{opacity:1;}
.carousel-slide img{width:100%;height:100%;object-fit:cover;}
.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:none;background:rgba(255,255,255,.9);color:var(--ink);font-size:1.3rem;line-height:1;cursor:pointer;display:grid;place-items:center;transition:background .2s;box-shadow:0 2px 8px rgba(0,0,0,.12);z-index:2;}
.carousel-arrow:hover{background:#fff;}
.carousel-arrow.prev{left:12px;}
.carousel-arrow.next{right:12px;}
.carousel-dots{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:7px;z-index:2;}
.carousel-dot{width:8px;height:8px;border-radius:50%;border:none;background:rgba(255,255,255,.6);cursor:pointer;padding:0;transition:background .2s,transform .2s;}
.carousel-dot.is-active{background:var(--accent);transform:scale(1.2);}

/* フッターのSNS・サイトリンク */
.sns-links{display:flex;gap:10px;margin-top:16px;}
.sns-icon{
  width:38px;height:38px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.35);color:#EDEAE3;
  display:grid;place-items:center;
  transition:background .25s,border-color .25s,color .25s,transform .2s;
}
.sns-icon:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px);}

/* モーダル内のSNSアイコン（明るい背景用） */
.modal-sns{justify-content:center;margin-top:18px;}
.modal-links-wrap{margin-top:24px;text-align:center;}
.modal-links-label{font-size:.78rem;color:var(--ink-soft);letter-spacing:.08em;margin-bottom:2px;}
.modal-links-wrap .modal-sns{margin-top:8px;}
.modal-sns .sns-icon{border-color:var(--line);color:var(--ink-soft);}
.modal-sns .sns-icon:hover{background:var(--accent);border-color:var(--accent);color:#fff;}

/* ===== まちの風景ギャラリー ===== */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:200px;
  grid-auto-flow:dense;
  gap:28px;
  margin-top:24px;
}
.g-item{
  position:relative;overflow:hidden;border-radius:var(--radius);
  margin:0;background:#EEEBE3;box-shadow:var(--shadow);
}
.g-item img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1);}
.g-item:hover img{transform:scale(1.06);}
.g-cap{
  position:absolute;left:0;right:0;bottom:0;
  padding:22px 14px 12px;color:#fff;font-size:.78rem;font-weight:500;letter-spacing:.03em;
  background:linear-gradient(to top, rgba(30,28,25,.72), transparent);
  opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s;
}
.g-item:hover .g-cap{opacity:1;transform:translateY(0);}
/* サイズバリエーション：横長は使わず、正方形・縦長・大の3種 */
.g-item.g-s{grid-column:span 1;grid-row:span 1;}   /* 正方形 */
.g-item.g-t{grid-column:span 1;grid-row:span 2;}   /* 縦長 */
.g-item.g-l{grid-column:span 2;grid-row:span 2;}   /* 大きめ正方形 */
@media(max-width:900px){
  .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:170px;gap:18px;}
  .g-item.g-l{grid-column:span 2;grid-row:span 2;}
  .g-cap{opacity:1;transform:none;font-size:.72rem;}
}
@media(max-width:560px){
  .gallery-grid{gap:14px;grid-auto-rows:150px;}
  .g-item.g-l{grid-column:span 2;}
}

/* ---------- 法務ページ（プライバシーポリシー・利用規約） ---------- */
.legal{max-width:760px;margin-top:8px;}
.legal .legal-lead{font-size:.95rem;color:var(--ink-soft);line-height:1.9;margin-bottom:36px;}
.legal section{margin-bottom:34px;}
.legal h2{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:1.12rem;letter-spacing:.03em;color:var(--ink);margin-bottom:12px;padding-left:14px;border-left:3px solid var(--accent);}
.legal h3{font-family:"Zen Kaku Gothic New";font-weight:700;font-size:.98rem;color:var(--sub-d);margin:18px 0 8px;}
.legal p{font-size:.92rem;line-height:1.95;color:var(--ink);margin-bottom:12px;}
.legal ul,.legal ol{margin:8px 0 14px 1.4em;}
.legal li{font-size:.92rem;line-height:1.9;margin-bottom:6px;}
.legal .legal-date{font-size:.86rem;color:var(--ink-soft);margin-top:40px;padding-top:20px;border-top:1px solid var(--line);}
.legal a{color:var(--sub);text-decoration:underline;text-underline-offset:2px;}
.legal a:hover{color:var(--accent);}