/* ============================================================
   299 LLC — Corporate site
   Shared stylesheet
   ============================================================ */

/* ---- Fonts ---- */
/* Zen Old Mincho (display) / Zen Kaku Gothic New (text/UI) */

/* ---- Tokens ---- */
:root{
  /* Warm paper neutrals */
  --bg:        #FAF6EF;
  --bg-alt:    #F2EADB;
  --surface:   #FFFFFF;
  --ink:       #38291E;   /* body text — deep warm brown */
  --ink-soft:  #6B5A4C;   /* secondary text */
  --ink-faint: #93826F;   /* captions / meta */

  /* Brand (from logo) */
  --brand:     #614D40;   /* logo outline brown */
  --brand-dk:  #4A3a30;
  --peach:     #E9B98C;
  --caramel:   #D89955;
  --cream:     #ECD196;
  --taupe:     #A98E7B;

  /* Functional accent (caramel, deepened for legibility) */
  --accent:    #B26A2A;
  --accent-dk: #935317;

  /* Lines & tints */
  --line:      #E7DCCB;
  --line-soft: #F0E8DA;
  --tint:      #F5ECDD;

  /* Type */
  --serif: "Zen Old Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --sans:  "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;

  /* Heading voice (driven by [data-heading]) */
  --head: var(--serif);
  --head-weight: 600;
  --head-spacing: .022em;

  /* Layout */
  --maxw: 1120px;
  --pad: clamp(20px, 5vw, 56px);
  --radius: 3px;

  /* Rhythm (driven by [data-rhythm]) */
  --section-y: clamp(72px, 11vw, 128px);
  --body-lh: 1.95;
}

/* ---- Reset ---- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:400;
  font-size:16px;
  line-height:var(--body-lh);
  letter-spacing:.03em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4,p,ul,ol,figure,dl,dd{ margin:0; }
ul,ol{ padding:0; list-style:none; }

::selection{ background:var(--peach); color:var(--brand-dk); }

/* ---- Layout helpers ---- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.wrap--narrow{ max-width:760px; }

.section{ padding-block:var(--section-y); }
.section--alt{ background:var(--bg-alt); }

/* Eyebrow label with brand numeral */
.eyebrow{
  display:flex; align-items:baseline; gap:.85em;
  font-size:.78rem; font-weight:500; letter-spacing:.18em;
  color:var(--ink-faint); text-transform:uppercase;
  margin-bottom:1.6em;
}
.eyebrow .num{
  font-family:var(--sans); font-weight:700; font-size:.92rem;
  color:var(--accent); letter-spacing:.05em;
}
.eyebrow .rule{ flex:1; height:1px; background:var(--line); align-self:center; }

/* Headings */
.h-display{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(1.9rem,4.4vw,3.1rem);
  line-height:1.5; letter-spacing:.02em; color:var(--brand-dk);
}
.h-section{
  font-family:var(--head); font-weight:var(--head-weight);
  font-size:clamp(1.55rem,3vw,2.2rem);
  line-height:1.55; letter-spacing:.02em; color:var(--brand-dk);
}
.lede{
  font-size:clamp(1rem,1.5vw,1.12rem);
  line-height:2.05; color:var(--ink-soft);
  max-width:46em; text-wrap:pretty;
}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; gap:.7em;
  font-family:var(--sans); font-weight:500; font-size:.95rem;
  letter-spacing:.04em; line-height:1;
  padding:.95em 1.6em; border-radius:var(--radius);
  border:1px solid transparent; cursor:pointer;
  transition:background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.btn--primary{ background:var(--brand); color:#FBF3E6; }
.btn--primary:hover{ background:var(--brand-dk); }
.btn--ghost{ background:transparent; color:var(--brand-dk); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--brand); background:var(--surface); }
.btn .arrow{ transition:transform .18s ease; }
.btn:hover .arrow{ transform:translateX(3px); }

/* Inline link */
.link{
  color:var(--accent-dk); font-weight:500;
  border-bottom:1px solid color-mix(in srgb, var(--accent) 40%, transparent);
  padding-bottom:1px; transition:border-color .18s ease;
}
.link:hover{ border-color:var(--accent); }

/* ============================================================
   Header
   ============================================================ */
.site-header{
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--bg) 86%, transparent);
  backdrop-filter:saturate(1.1) blur(10px);
  -webkit-backdrop-filter:saturate(1.1) blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .25s ease, background .25s ease;
}
.site-header.is-scrolled{ border-bottom-color:var(--line); }
.site-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  height:72px;
}
.brand{ display:flex; align-items:center; gap:.62em; }
.brand__mark{ width:38px; height:38px; object-fit:contain; }
.brand__type{ display:flex; flex-direction:column; line-height:1.05; }
.brand__name{ font-weight:700; font-size:1.02rem; letter-spacing:.06em; color:var(--brand-dk); white-space:nowrap; }
.brand__sub{ font-size:.62rem; letter-spacing:.22em; color:var(--ink-faint); text-transform:uppercase; }

.nav{ display:flex; align-items:center; gap:clamp(18px,2.4vw,34px); }
.nav__link{
  position:relative; font-size:.9rem; font-weight:500; color:var(--ink-soft);
  letter-spacing:.04em; transition:color .18s ease;
}
.nav__link::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:1.5px;
  background:var(--accent); transform:scaleX(0); transform-origin:left;
  transition:transform .22s ease;
}
.nav__link:hover{ color:var(--brand-dk); }
.nav__link:hover::after{ transform:scaleX(1); }
.nav__cta{
  font-size:.86rem; font-weight:500; color:#FBF3E6; background:var(--brand);
  padding:.6em 1.15em; border-radius:var(--radius); letter-spacing:.04em;
  transition:background .18s ease;
}
.nav__cta:hover{ background:var(--brand-dk); }

.nav-toggle{ display:none; }

/* ============================================================
   Hero
   ============================================================ */
.hero{ position:relative; overflow:hidden; }
.hero__inner{
  padding-block:clamp(72px,11vw,128px);
}
.hero__text{ max-width:38em; }
.hero__eyebrow{
  font-size:.78rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink-faint); margin-bottom:1.7em;
  display:flex; align-items:center; gap:.8em;
}
.hero__eyebrow::before{ content:""; width:26px; height:1.5px; background:var(--accent); }
.hero__title{
  font-family:var(--head); font-weight:var(--head-weight);
  font-size:clamp(1.95rem,4.2vw,2.95rem);
  line-height:1.6; letter-spacing:var(--head-spacing); color:var(--brand-dk);
  text-wrap:balance;
}
.hero__title .soft{ color:var(--caramel); }
.hero__copy{
  margin-top:1.9em; font-size:clamp(1rem,1.4vw,1.1rem);
  line-height:2.1; color:var(--ink-soft); max-width:30em; text-wrap:pretty;
}
.hero__actions{ margin-top:2.6em; display:flex; flex-wrap:wrap; gap:14px; }

/* Quiet meta row that grounds the hero in place of a big logo */
.hero__meta{
  margin-top:clamp(44px,6vw,72px); padding-top:clamp(22px,3vw,30px);
  border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:clamp(28px,6vw,72px);
}
.hero__meta li{ display:flex; flex-direction:column; gap:.35em; }
.hero__meta-k{ font-size:.72rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint); }
.hero__meta-v{ font-size:.98rem; color:var(--brand-dk); letter-spacing:.02em; }

/* Hero visual — cat mark in a soft warm field */
.hero__visual{ position:relative; display:flex; justify-content:center; align-items:center; }
.hero__disc{
  position:relative; z-index:1; width:min(86%,260px); aspect-ratio:1; border-radius:50%;
  background:
    radial-gradient(120% 120% at 60% 32%, color-mix(in srgb,var(--cream) 30%, var(--bg)) 0%, transparent 70%);
  display:flex; align-items:center; justify-content:center;
}
.hero__cat{ width:64%; opacity:.94; }
/* oversized brand numeral, very faint, anchored behind */
.hero__numeral{
  position:absolute; right:-1%; bottom:-4%;
  font-family:var(--sans); font-weight:700; font-size:clamp(4rem,8.5vw,7rem);
  line-height:.8; color:color-mix(in srgb,var(--caramel) 20%, transparent);
  letter-spacing:.01em; pointer-events:none; user-select:none; z-index:0;
}

/* ============================================================
   Services
   ============================================================ */
.services{ margin-top:clamp(40px,6vw,72px); }
.service-row{
  display:grid; grid-template-columns:auto 1fr; gap:clamp(20px,4vw,56px);
  padding-block:clamp(30px,4vw,44px);
  border-top:1px solid var(--line);
}
.service-row:last-child{ border-bottom:1px solid var(--line); }
.service-row__no{
  font-family:var(--sans); font-weight:700; font-size:1.05rem;
  color:var(--accent); letter-spacing:.05em; padding-top:.35em;
}
.service-row__body{ display:grid; grid-template-columns:minmax(0,18em) 1fr; gap:clamp(14px,3vw,48px); align-items:start; }
.service-row__title{
  font-family:var(--head); font-weight:var(--head-weight); font-size:clamp(1.25rem,2vw,1.55rem);
  line-height:1.6; color:var(--brand-dk);
}
.service-row__tags{ margin-top:1em; display:flex; flex-wrap:wrap; gap:8px; }
.tag{
  font-size:.74rem; font-weight:500; letter-spacing:.04em; color:var(--ink-soft);
  background:var(--surface); border:1px solid var(--line);
  padding:.34em .8em; border-radius:999px;
}
.service-row__desc{ font-size:.98rem; line-height:2.05; color:var(--ink-soft); text-wrap:pretty; }

/* ============================================================
   Approach
   ============================================================ */
.approach__grid{
  margin-top:clamp(40px,6vw,72px);
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line);
}
.principle{
  background:var(--bg-alt); padding:clamp(28px,3.4vw,40px);
  display:flex; flex-direction:column; gap:.9em;
}
.section--alt .principle{ background:var(--bg); }
.principle__no{
  font-family:var(--sans); font-weight:700; font-size:.82rem; letter-spacing:.1em;
  color:var(--accent);
}
.principle__title{
  font-family:var(--head); font-weight:var(--head-weight); font-size:1.22rem; line-height:1.55;
  color:var(--brand-dk);
}
.principle__desc{ font-size:.92rem; line-height:1.95; color:var(--ink-soft); text-wrap:pretty; }

/* ============================================================
   Work / Cases
   ============================================================ */
.work__grid{
  margin-top:clamp(40px,6vw,72px);
  display:grid; grid-template-columns:1fr 1fr; gap:1px;
  background:var(--line); border:1px solid var(--line);
}
.case{
  background:var(--bg); padding:clamp(26px,3.2vw,40px);
  display:flex; flex-direction:column; gap:.8em;
}
.section--alt .case{ background:var(--bg-alt); }
.case__cat{
  font-size:.72rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
}
.case__title{
  font-family:var(--head); font-weight:var(--head-weight); font-size:1.24rem; line-height:1.5;
  color:var(--brand-dk);
}
.case__desc{ font-size:.93rem; line-height:1.95; color:var(--ink-soft); text-wrap:pretty; }
.case__tags{ margin-top:.5em; display:flex; flex-wrap:wrap; gap:8px; }

/* ============================================================
   Company profile
   ============================================================ */
.profile{ margin-top:clamp(40px,6vw,64px); display:grid; grid-template-columns:1.4fr 1fr; gap:clamp(36px,6vw,80px); align-items:start; }
.profile__table{ width:100%; }
.profile__table dl{ display:grid; grid-template-columns:9.5em 1fr; }
.profile__row{ display:contents; }
.profile__table dt,
.profile__table dd{
  padding:1.05em 0; border-top:1px solid var(--line); align-self:start;
}
.profile__table dl > div:last-child dt,
.profile__table dl > div:last-child dd{ border-bottom:1px solid var(--line); }
.profile__table dt{ font-weight:500; color:var(--ink-faint); font-size:.86rem; letter-spacing:.05em; }
.profile__table dd{ color:var(--ink); font-size:.96rem; }
.profile__table dd a{ color:var(--accent-dk); border-bottom:1px solid color-mix(in srgb,var(--accent) 35%,transparent); }
.profile__table dd a:hover{ border-color:var(--accent); }

.profile__aside{ position:relative; }
.profile__card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(26px,3vw,36px); display:flex; flex-direction:column; gap:1.1em;
}
.profile__card .lockup{ width:130px; }
.profile__note{ font-size:.85rem; line-height:1.9; color:var(--ink-soft); }
.profile__map{
  margin-top:.4em; font-size:.8rem; color:var(--accent-dk); font-weight:500;
  display:inline-flex; align-items:center; gap:.4em;
}

/* ============================================================
   Contact
   ============================================================ */
.contact__inner{ display:grid; grid-template-columns:1fr auto; gap:clamp(28px,5vw,64px); align-items:center; }
.contact__title{ font-family:var(--head); font-weight:var(--head-weight); font-size:clamp(1.5rem,2.6vw,2rem); color:var(--brand-dk); line-height:1.55; }
.contact__copy{ margin-top:1.1em; font-size:1rem; line-height:2; color:var(--ink-soft); max-width:34em; text-wrap:pretty; }
.contact__mailbox{ display:flex; flex-direction:column; gap:1em; align-items:flex-start; }
.contact__mail{
  font-family:var(--sans); font-weight:500; font-size:clamp(1.05rem,2vw,1.3rem);
  color:var(--brand-dk); letter-spacing:.02em;
  border-bottom:1.5px solid var(--caramel); padding-bottom:.25em;
  transition:color .18s ease;
}
.contact__mail:hover{ color:var(--accent-dk); }

/* ============================================================
   Footer
   ============================================================ */
.site-footer{ background:var(--brand-dk); color:#E9DECF; }
.site-footer a{ color:#E9DECF; }
.site-footer__inner{
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:clamp(28px,5vw,64px);
  padding-block:clamp(48px,7vw,76px);
}
.footer-brand{ display:flex; flex-direction:column; gap:1.1em; max-width:24em; }
.footer-brand__top{ display:flex; align-items:center; gap:.6em; }
.footer-brand__mark{ width:40px; height:40px; }
.footer-brand__name{ font-weight:700; font-size:1.05rem; letter-spacing:.06em; color:#F6EEE1; white-space:nowrap; }
.footer-brand__sub{ font-size:.6rem; letter-spacing:.22em; color:#B7A695; text-transform:uppercase; }
.footer-brand__addr{ font-size:.84rem; line-height:1.95; color:#C6B7A5; }
.footer-col h4{ font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:#B7A695; margin-bottom:1.3em; }
.footer-col ul{ display:flex; flex-direction:column; gap:.85em; }
.footer-col a{ font-size:.9rem; color:#D8CABA; transition:color .18s ease; }
.footer-col a:hover{ color:#FFF; }
.site-footer__bar{ border-top:1px solid rgba(255,255,255,.1); }
.site-footer__bar .wrap{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding-block:20px; flex-wrap:wrap; }
.site-footer__copy{ font-size:.76rem; color:#A89786; letter-spacing:.04em; }
.site-footer__copy .num{ color:var(--peach); font-weight:700; }

/* ============================================================
   Legal pages
   ============================================================ */
.legal-hero{ border-bottom:1px solid var(--line); }
.legal-hero__inner{ padding-block:clamp(48px,7vw,84px); }
.breadcrumb{ font-size:.78rem; letter-spacing:.06em; color:var(--ink-faint); margin-bottom:1.6em; display:flex; gap:.6em; align-items:center; }
.breadcrumb a:hover{ color:var(--accent-dk); }
.breadcrumb .sep{ color:var(--line); }
.legal-hero__title{ font-family:var(--serif); font-weight:600; font-size:clamp(1.8rem,3.6vw,2.6rem); color:var(--brand-dk); line-height:1.5; }
.legal-hero__title .en{ display:block; font-family:var(--sans); font-weight:500; font-size:.8rem; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); margin-top:1em; }
.legal-hero__meta{ margin-top:1.8em; font-size:.84rem; color:var(--ink-soft); line-height:1.9; }

.legal-body{ padding-block:clamp(48px,7vw,88px); }
.legal-layout{ display:grid; grid-template-columns:220px 1fr; gap:clamp(40px,6vw,84px); align-items:start; }

.legal-toc{ position:sticky; top:96px; }
.legal-toc__label{ font-size:.7rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:1.2em; }
.legal-toc ol{ counter-reset:toc; display:flex; flex-direction:column; gap:.1em; }
.legal-toc a{
  display:flex; gap:.7em; font-size:.85rem; line-height:1.6; color:var(--ink-soft);
  padding:.5em 0; border-bottom:1px solid var(--line-soft);
  transition:color .18s ease;
}
.legal-toc a .n{ color:var(--accent); font-weight:700; font-size:.78rem; min-width:1.6em; }
.legal-toc a:hover{ color:var(--brand-dk); }

.legal-content{ max-width:42em; }
.legal-intro{ font-size:1rem; line-height:2.1; color:var(--ink-soft); margin-bottom:2.6em; text-wrap:pretty; }
.article{ padding-top:2.4em; margin-top:2.4em; border-top:1px solid var(--line); }
.article:first-of-type{ border-top:none; margin-top:0; padding-top:0; }
.article__head{ display:flex; align-items:baseline; gap:.9em; margin-bottom:1.1em; }
.article__no{ font-family:var(--sans); font-weight:700; font-size:.8rem; letter-spacing:.06em; color:var(--accent); white-space:nowrap; padding-top:.2em; }
.article__title{ font-family:var(--serif); font-weight:600; font-size:1.2rem; line-height:1.55; color:var(--brand-dk); }
.article p{ font-size:.96rem; line-height:2.05; color:var(--ink); margin-bottom:1em; text-wrap:pretty; }
.article p:last-child{ margin-bottom:0; }
.article ol.numbered{ counter-reset:item; display:flex; flex-direction:column; gap:.7em; margin:.4em 0 1em; }
.article ol.numbered > li{
  position:relative; padding-left:2.1em; font-size:.95rem; line-height:2; color:var(--ink); text-wrap:pretty;
}
.article ol.numbered > li::before{
  counter-increment:item; content:"("counter(item)")";
  position:absolute; left:0; top:0; color:var(--ink-faint); font-size:.84rem; font-variant-numeric:tabular-nums;
}
.article ul.bullets{ display:flex; flex-direction:column; gap:.55em; margin:.4em 0 1em; }
.article ul.bullets > li{ position:relative; padding-left:1.3em; font-size:.95rem; line-height:2; color:var(--ink); }
.article ul.bullets > li::before{ content:""; position:absolute; left:.1em; top:.95em; width:5px; height:5px; border-radius:50%; background:var(--caramel); }
.article .sub-label{ font-weight:500; color:var(--brand-dk); }

.legal-table{ width:100%; border-collapse:collapse; margin:.6em 0 1.2em; font-size:.92rem; }
.legal-table th,.legal-table td{ text-align:left; vertical-align:top; padding:.85em 1em; border:1px solid var(--line); line-height:1.85; }
.legal-table th{ background:var(--tint); font-weight:500; color:var(--brand-dk); white-space:nowrap; width:11em; }
.legal-table td{ color:var(--ink); }

.legal-foot{ margin-top:3em; padding-top:1.8em; border-top:1px solid var(--line); font-size:.85rem; color:var(--ink-faint); line-height:1.9; }

/* ============================================================
   Reveal on scroll
   ============================================================ */
@media (prefers-reduced-motion:no-preference){
  .reveal{ opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.is-in{ opacity:1; transform:none; }
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:920px){
  .hero__inner{ grid-template-columns:1fr; }
  .hero__disc{ width:min(64%,300px); }
  .profile{ grid-template-columns:1fr; }
  .legal-layout{ grid-template-columns:1fr; }
  .legal-toc{ position:static; }
  .legal-toc ol{ display:grid; grid-template-columns:1fr 1fr; gap:0 24px; }
  .approach__grid{ grid-template-columns:1fr 1fr; }
  .site-footer__inner{ grid-template-columns:1fr 1fr; }
  .footer-brand{ grid-column:1 / -1; }
}
@media (max-width:680px){
  body{ font-size:15.5px; }
  .nav{ display:none; }
  .nav.is-open{
    display:flex; flex-direction:column; align-items:flex-start; gap:0;
    position:absolute; left:0; right:0; top:72px;
    background:var(--bg); border-bottom:1px solid var(--line);
    padding:8px var(--pad) 20px;
  }
  .nav.is-open .nav__link{ width:100%; padding:.9em 0; border-bottom:1px solid var(--line-soft); }
  .nav.is-open .nav__link::after{ display:none; }
  .nav.is-open .nav__cta{ margin-top:14px; }
  .nav-toggle{
    display:inline-flex; flex-direction:column; gap:5px; background:none; border:none;
    cursor:pointer; padding:8px; margin-right:-8px;
  }
  .nav-toggle span{ width:22px; height:1.5px; background:var(--brand-dk); transition:transform .25s, opacity .2s; }
  .nav-toggle.is-open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
  .nav-toggle.is-open span:nth-child(2){ opacity:0; }
  .nav-toggle.is-open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

  .service-row{ grid-template-columns:1fr; gap:10px; }
  .service-row__no{ padding-top:0; }
  .service-row__body{ grid-template-columns:1fr; gap:14px; }
  .approach__grid{ grid-template-columns:1fr; }
  .work__grid{ grid-template-columns:1fr; }
  .contact__inner{ grid-template-columns:1fr; align-items:start; }
  .site-footer__inner{ grid-template-columns:1fr; }
  .legal-toc ol{ grid-template-columns:1fr; }
  .profile__table dl{ grid-template-columns:7.5em 1fr; }
  .legal-table th{ width:auto; white-space:normal; }
}

/* ============================================================
   TWEAKABLE THEMES  (set via [data-*] on <html> by the Tweaks panel)
   ============================================================ */

/* ---- 空気感 / Mood : palette temperature & contrast ---- */

/* 静けさ — quiet greige, cooler neutrals, softened accent */
:root[data-mood="calm"]{
  --bg:#F6F4F0;  --bg-alt:#ECE8E1;
  --ink:#33302B; --ink-soft:#615C54; --ink-faint:#8C857A;
  --brand:#4F4940; --brand-dk:#393530;
  --accent:#8A6A4E; --accent-dk:#6E5238;
  --peach:#D9C7B4; --caramel:#B79B7E; --cream:#E3DACB; --taupe:#A2978A;
  --line:#E3DDD3; --line-soft:#EDE8DF; --tint:#EEE9E1;
}

/* 凛 — brighter paper, deeper ink, terracotta accent, more contrast */
:root[data-mood="crisp"]{
  --bg:#FBFAF6;  --bg-alt:#F0EADD;
  --ink:#2A211A; --ink-soft:#574A3F; --ink-faint:#8A7B6B;
  --brand:#3A2C22; --brand-dk:#281D16;
  --accent:#BD5326; --accent-dk:#9C3F12;
  --peach:#EBB281; --caramel:#D98A45; --cream:#EBD09A; --taupe:#A98E7B;
  --line:#E7DECD; --line-soft:#F1E9DA; --tint:#F5ECDB;
}

/* ---- 見出しの声 / Heading voice ---- */
:root[data-heading="gothic"]{
  --head: var(--sans);
  --head-weight: 700;
  --head-spacing: .01em;
}

/* ---- 余白のリズム / Rhythm ---- */
:root[data-rhythm="airy"]{
  --section-y: clamp(100px, 15vw, 184px);
  --body-lh: 2.18;
}
:root[data-rhythm="airy"] .lede{ line-height:2.25; }
:root[data-rhythm="airy"] .hero__inner{ padding-block:clamp(84px,13vw,148px); }

:root[data-rhythm="compact"]{
  --section-y: clamp(48px, 7.5vw, 88px);
  --body-lh: 1.76;
}
:root[data-rhythm="compact"] .lede{ line-height:1.85; }
:root[data-rhythm="compact"] .service-row{ padding-block:clamp(22px,3vw,32px); }
:root[data-rhythm="compact"] .hero__inner{ padding-block:clamp(48px,8vw,84px); }