/* =====================================================
   Interbeing Studio — 共通スタイル（全ページ共通）
   色・文字・ヘッダー・フッター・写真の色調はここだけで決める。
   ===================================================== */
:root{
  --ink:#262e2d; --sub:#5c6564; --faint:#98a19f; --line:#ddd6ca;
  --paper:#f6f3ee; --paper2:#efeae2; --white:#fffdf9;
  --accent:#4f7479; --bubble:#9aa3a8;
  --min:"Zen Old Mincho","Yu Mincho","Hiragino Mincho ProN",serif;
  --sans:"Zen Kaku Gothic New","Yu Gothic","Hiragino Sans",sans-serif;
  --en:"Cormorant Garamond","Times New Roman",serif;
  --w:1080px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15.5px;line-height:2;letter-spacing:.04em;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
p{margin:0 0 1.2em}
.wrap{max-width:var(--w);margin:0 auto;padding:0 24px}
.narrow{max-width:680px;margin:0 auto;padding:0 24px}
.min{font-family:var(--min)}
.en{font-family:var(--en);letter-spacing:.2em}
.eyebrow{font-family:var(--en);font-size:12.5px;letter-spacing:.32em;color:var(--accent);text-transform:uppercase;margin:0 0 14px}
h1,h2,h3{font-family:var(--min);font-weight:400;letter-spacing:.08em;line-height:1.6;margin:0}
.sec{padding:clamp(72px,11vw,128px) 0}
.sec-head{margin-bottom:clamp(36px,6vw,56px)}
.sec-head h2{font-size:clamp(23px,3.2vw,30px)}
.sec-head p{color:var(--sub);margin:14px 0 0;max-width:620px}
.toned{filter:grayscale(.5) sepia(.26) saturate(.86) contrast(.95) brightness(1.03)}
.toned-soft{filter:grayscale(.3) sepia(.15) saturate(.92) contrast(.97)}

/* links */
.more{display:inline-block;font-size:14px;letter-spacing:.14em;color:var(--ink);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px;transition:color .2s}
.more::after{content:"　→"}
.more:hover{color:var(--accent)}
.btn{display:inline-block;padding:14px 30px;border-radius:40px;background:var(--ink);color:var(--white);text-decoration:none;font-size:14px;letter-spacing:.14em;transition:background .2s}
.btn:hover{background:var(--accent)}
.btn.light{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn.light:hover{background:var(--ink);color:var(--white)}

/* header */
.site-head{position:sticky;top:0;z-index:20;background:rgba(246,243,238,.92);backdrop-filter:blur(8px);border-bottom:1px solid transparent;transition:border-color .3s}
.site-head.on-photo{position:absolute;inset:0 0 auto 0;background:transparent;backdrop-filter:none;color:#fff}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;max-width:1200px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--en);font-size:17px;letter-spacing:.2em}
.brand svg{width:28px;height:28px;--bw:5.5}
.on-photo .brand svg{--accent:#fff;--bubble:#d9dfe0}
.gnav{display:flex;gap:26px;font-size:13px;letter-spacing:.12em}
.gnav a{text-decoration:none;opacity:.86}
.gnav a:hover,.gnav a[aria-current]{opacity:1;text-decoration:underline;text-underline-offset:6px}
.menu{display:none}
@media (max-width:820px){
  .gnav{display:none}
  .menu{display:block;position:relative}
  .menu summary{list-style:none;cursor:pointer;font-family:var(--en);font-size:13px;letter-spacing:.24em;padding:8px 0}
  .menu summary::-webkit-details-marker{display:none}
  .menu nav{position:absolute;right:-8px;top:40px;background:var(--white);color:var(--ink);border:1px solid var(--line);padding:14px 22px;display:flex;flex-direction:column;gap:6px;min-width:180px;font-size:14px;box-shadow:0 10px 30px rgba(40,50,50,.08)}
  .menu nav a{text-decoration:none;padding:4px 0}
}

/* footer */
.site-foot{background:var(--paper2);padding:56px 0 40px;font-size:13px;color:var(--sub)}
.site-foot .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:28px}
.site-foot .brand{color:var(--ink);margin-bottom:12px}
.site-foot ul{list-style:none;margin:0;padding:0;line-height:2.2}
.site-foot a{text-decoration:none}
.site-foot a:hover{color:var(--ink)}
.site-foot .copy{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px;font-size:12px;color:var(--faint)}
@media (max-width:700px){.site-foot .wrap{grid-template-columns:1fr 1fr}.site-foot .wrap>div:first-child{grid-column:1/-1}}

/* reveal */
.fade{opacity:0;transform:translateY(14px);transition:opacity .9s ease,transform .9s ease}
.fade.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.fade{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* print */
@media print{.fade{opacity:1;transform:none}.site-head{position:static}.menu{display:none}}