/* Shared look of the site's own pages (services, 404). The homepage keeps its copy inline in index.html for a fast first paint:
   when the palettes, header or footer change there, change them here too. */
/* Palettes: 60% base · 30% surface · 10% one accent (CTA, active state, links only). Text pairs pass WCAG AA. */
:root,:root[data-theme="sumi"]{
  color-scheme:dark; /* 墨 sumi: warm charcoal, not pure black; muted gold used sparingly */
  --paper:#16171A; --panel:#22252A; --glass:rgba(34,37,42,.96); --scrim:rgba(22,23,26,.84);
  --head:#F4EFE6; --ink:#E6E1D7; --body2:#C7C2B8; --mute:#9C978D; --dim:#8D887E;
  --line:#2C2F35; --line2:#3B3F46; --gold:#C9A063; --on-accent:#16171A;
  --board:#1D1F23; --glow:rgba(201,160,99,.10); --glow2:rgba(201,160,99,.03);
  --shadow:rgba(0,0,0,.6); --lift:rgba(0,0,0,.42);
  --map-bg:#1D1F23; --map-ink:#E6E1D7; --map-accent:#C9A063; --map-city:#B9B3A7; --map-land:#2A2E33; --map-line:rgba(230,225,215,.14);
  --indigo:var(--ink); --indigo-soft:var(--mute); --seal:var(--gold); --card:var(--panel);
  --max:1328px;
}
:root[data-theme="washi"]{
  color-scheme:light; /* 生成り kinari cream + charcoal text + 朱 akane accent */
  --paper:#F5F0E6; --panel:#FBF8F1; --glass:rgba(251,248,241,.96); --scrim:rgba(251,248,241,.9);
  --head:#1E1D1B; --ink:#2A2927; --body2:#3E3C38; --mute:#5F5B53; --dim:#6A655C;
  --line:#E0D8C8; --line2:#CDC3B0; --gold:#9E3B26; --on-accent:#FBF8F1;
  --board:#EBE3D3; --glow:rgba(158,59,38,.06); --glow2:rgba(158,59,38,.02);
  --shadow:rgba(60,40,20,.3); --lift:rgba(60,40,20,.12);
  --map-bg:#F1EBDF; --map-ink:#2A2927; --map-accent:#9E3B26; --map-city:#4A4740; --map-land:#E2DAC8; --map-line:rgba(42,41,39,.16);
}
:root[data-theme="aizome"]{
  color-scheme:light; /* 藍染 aizome: same cream, 藍 indigo as the single accent — calmer, more "service" */
  --paper:#F5F0E6; --panel:#FBF8F1; --glass:rgba(251,248,241,.96); --scrim:rgba(251,248,241,.9);
  --head:#1E1D1B; --ink:#2A2927; --body2:#3E3C38; --mute:#5F5B53; --dim:#6A655C;
  --line:#E0D8C8; --line2:#CDC3B0; --gold:#244D74; --on-accent:#FBF8F1;
  --board:#EBE3D3; --glow:rgba(36,77,116,.06); --glow2:rgba(36,77,116,.02);
  --shadow:rgba(30,40,60,.28); --lift:rgba(30,40,60,.12);
  --map-bg:#F1EBDF; --map-ink:#2A2927; --map-accent:#244D74; --map-city:#4A4740; --map-land:#E2DAC8; --map-line:rgba(42,41,39,.16);
}
:root[data-theme="ai"]{
  color-scheme:dark; /* 紺 kon: deep night indigo + muted gold */
  --paper:#14203A; --panel:#20304F; --glass:rgba(32,48,79,.96); --scrim:rgba(20,32,58,.86);
  --head:#F6F1E6; --ink:#E9E3D5; --body2:#CBC5B7; --mute:#A29D8F; --dim:#958F80;
  --line:#26355A; --line2:#34446A; --gold:#D7A84F; --on-accent:#14203A;
  --board:#1A2846; --glow:rgba(215,168,79,.10); --glow2:rgba(215,168,79,.03);
  --shadow:rgba(0,0,0,.55); --lift:rgba(0,0,0,.38);
  --map-bg:#1A2846; --map-ink:#E9E3D5; --map-accent:#D7A84F; --map-city:#BDB6A6; --map-land:#26324E; --map-line:rgba(233,227,213,.14);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{font-family:'Golos Text',system-ui,sans-serif;background:var(--paper);transition:background .4s ease,color .4s ease;color:var(--ink);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--max);margin:0 auto;padding:0 56px}
@media(max-width:760px){.wrap{padding:0 16px}}
.mono{font-family:'Golos Text',sans-serif;font-size:13px;letter-spacing:0;text-transform:none;color:var(--mute)}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:400;color:var(--head);line-height:1.1}
a{color:var(--ink)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
.btn{display:inline-flex;align-items:center;min-height:52px;padding:0 26px;border:1px solid var(--ink);border-radius:999px;font-size:16px;text-decoration:none;color:var(--ink);background:transparent;font-family:inherit;cursor:pointer}
.btn.solid{background:var(--gold);border-color:var(--gold);color:var(--on-accent)}
.btn:hover{border-color:var(--head);color:var(--head)}
.btn.solid:hover{background:color-mix(in srgb,var(--gold) 82%,var(--head));border-color:transparent;color:var(--on-accent)}

/* theme switcher */
.themes{display:flex;gap:6px;align-items:center}
.themes button{width:26px;height:26px;border-radius:50%;border:1px solid var(--line2);cursor:pointer;padding:0;position:relative;background:linear-gradient(135deg,var(--sw) 56%,var(--sa) 56%)}
.themes button[aria-pressed="true"]{outline:1.5px solid var(--ink);outline-offset:2px}
.themes .lbl{font-size:13px;color:var(--dim);margin-right:4px}
/* header */
header.top{display:flex;align-items:baseline;justify-content:space-between;gap:32px;padding:28px 56px 0;flex-wrap:wrap;font-size:15px}
header.top .logo{display:inline-flex;align-items:baseline;gap:8px;font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:500;text-decoration:none;color:var(--ink)}
header.top .logo svg{align-self:center;position:relative;top:2px;width:18px;height:30px;color:var(--gold)}
header.top nav{display:flex;gap:28px;flex-wrap:wrap}
header.top nav a{text-decoration:none;color:var(--ink)}
@media(max-width:760px){header.top{padding:20px 16px 0}}
header.top nav a[aria-current="page"]{color:var(--gold)}
footer{padding:36px 56px 40px;display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;font-size:13px;color:var(--dim);border-top:1px solid var(--line)}
@media(max-width:760px){footer{padding:28px 16px}}