/* =========================================================
   ゆかりの守りびと  LP  —  stylesheet
   Concept: 老舗旅館のような、静けさと温もり
   ========================================================= */

:root{
  /* brand */
  --paper:        #F5F1E9;  /* 白練 */
  --paper-2:      #EFEAE0;
  --paper-3:      #FBF8F2;
  --sumi:         #493F50;  /* 深紫 */
  --sumi-soft:    #5C5364;
  --sumi-70:      #6E6577;
  --fuji:         #8C8191;  /* 藤鼠 */
  --kin:          #A99A7C;  /* 鈍金 */

  --line:         rgba(169,154,124,.42);
  --line-soft:    rgba(73,63,80,.12);
  --line-hair:    rgba(73,63,80,.07);

  /* type */
  --mincho: "Zen Old Mincho", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  --gothic: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --en:     "Cormorant Garamond", "Times New Roman", serif;

  --fs-body: 17px;
  --lh-body: 2.05;

  --ease: cubic-bezier(.22,.61,.36,1);
  --dur: 1.05s;

  --header-h: 92px;
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--paper);
  color:var(--sumi-soft);
  font-family:var(--gothic);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  letter-spacing:.045em;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
h1,h2,h3,h4,p,ul,ol,figure,blockquote{ margin:0; }
ul,ol{ list-style:none; padding:0; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
::selection{ background:rgba(169,154,124,.28); }

/* film grain — very faint */
body::after{
  content:"";
  position:fixed; inset:0; z-index:9998; pointer-events:none;
  opacity:.032;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}

/* ---------- layout ---------- */
.wrap{ width:min(1160px, 100% - 96px); margin-inline:auto; }
.wrap-narrow{ width:min(760px, 100% - 96px); margin-inline:auto; }
.sec{ position:relative; padding:clamp(76px, 9.2vw, 140px) 0; }
.sec--paper2{ background:var(--paper-2); }
.sec--tight{ padding-block:clamp(60px, 7.4vw, 108px); }

section[id]{ scroll-margin-top:calc(var(--header-h) + 16px); }

/* ---------- shared type ---------- */
.en-label{
  font-family:var(--en);
  font-size:12.5px;
  font-weight:400;
  letter-spacing:.38em;
  text-transform:uppercase;
  color:var(--kin);
  line-height:1;
}
.sec-head{ display:flex; flex-direction:column; gap:clamp(16px,2vw,24px); margin-bottom:clamp(38px,4.6vw,64px); }
.sec-head .head-line{ display:flex; align-items:center; }
.sec-head .head-line .hl{
  display:block; height:1px; width:44px; flex:0 0 44px;
  background:var(--kin); opacity:.6;
}
.sec-head .head-line[style*="center"]{ justify-content:center; }
.sec-head .head-line{ margin-bottom:2px; }

h2{
  font-family:var(--mincho);
  font-weight:500;
  font-size:clamp(23px, 2.75vw, 35px);
  line-height:1.8;
  letter-spacing:.1em;
  color:var(--sumi);
  text-wrap:pretty;
  font-feature-settings:"palt" 1;
  line-break:strict;
  word-break:auto-phrase;
}
h3{
  font-family:var(--mincho);
  font-weight:500;
  font-size:clamp(19px, 1.9vw, 24px);
  line-height:1.8;
  letter-spacing:.09em;
  color:var(--sumi);
  font-feature-settings:"palt" 1;
}
.lead{ font-size:clamp(16px, 1.3vw, 17.5px); line-height:2.3; color:var(--sumi-soft); letter-spacing:.05em; max-width:34em; text-wrap:pretty; }
.body-copy{ font-size:16.5px; line-height:2.28; letter-spacing:.045em; color:var(--sumi-70); text-wrap:pretty; max-width:33em; }
.body-copy + .body-copy{ margin-top:1.5em; }
.tiny{ font-size:13px; line-height:2.05; letter-spacing:.05em; color:var(--fuji); }
.nw{ white-space:nowrap; }

/* ---------- reveal ----------
   Hidden states only apply once JS has confirmed the observer is running
   (html.reveal-ready). Without it, every section renders normally. */
html.reveal-ready [data-reveal]{
  opacity:0;
  transform:translateY(10px);
  transition:opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
  transition-delay:var(--d, 0ms);
  will-change:opacity, transform;
}
html.reveal-ready [data-reveal="img"]{ transform:translateY(10px); }
html.reveal-ready [data-reveal].is-in{
  opacity:1; transform:none; will-change:auto;
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  html.reveal-ready [data-reveal]{ opacity:1 !important; transform:none !important; transition:none !important; }
  .hero-media img, .hero-copy > *{ animation:none !important; opacity:1 !important; }
  .scroll-cue i{ animation:none !important; }
}

/* =========================================================
   header
   ========================================================= */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:600;
  transition:background .7s var(--ease), border-color .7s var(--ease), backdrop-filter .7s;
  border-bottom:1px solid transparent;
}
.site-header.is-scrolled{
  background:rgba(245,241,233,.93);
  -webkit-backdrop-filter:blur(16px) saturate(1.1);
  backdrop-filter:blur(16px) saturate(1.1);
  border-bottom-color:var(--line-hair);
}
.header-inner{
  width:min(1400px, 100% - 80px); margin-inline:auto;
  height:var(--header-h);
  display:flex; align-items:center; justify-content:space-between; gap:32px;
}
.brand{ display:flex; flex-direction:column; gap:4px; flex:none; }
.brand-mark{
  font-family:var(--mincho); font-size:17px; font-weight:500;
  letter-spacing:.2em; color:var(--sumi); line-height:1.3; white-space:nowrap;
}
.brand-sub{
  font-family:var(--en); font-size:9.5px; letter-spacing:.32em;
  text-transform:uppercase; color:var(--fuji); line-height:1; white-space:nowrap;
}
.nav{ display:flex; align-items:center; gap:clamp(20px, 2.4vw, 38px); }
.nav a{
  font-size:13px; letter-spacing:.11em; color:var(--sumi-70);
  padding:6px 0; position:relative; transition:color .6s var(--ease);
}
.nav a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:var(--kin); transform:scaleX(0); transform-origin:left;
  transition:transform .7s var(--ease);
}
.nav a:hover{ color:var(--sumi); }
.nav a:hover::after{ transform:scaleX(1); }
.nav a.btn-header{
  font-family:var(--mincho); font-size:13.5px; font-weight:500; letter-spacing:.12em;
  color:var(--sumi); background:var(--paper);
  border:1px solid rgba(169,154,124,.55);
  padding:12px 25px; line-height:1;
  transition:background .7s var(--ease), color .7s var(--ease),
             border-color .7s var(--ease), letter-spacing .7s var(--ease);
}
.nav a.btn-header::after{ content:none; }
.nav a.btn-header:hover{
  color:var(--paper); background:var(--sumi); border-color:var(--sumi);
  letter-spacing:.17em;
}
/* once the header sits on a solid paper bar, the light button can invert too */
.site-header.is-scrolled .nav a.btn-header{
  color:var(--paper); background:var(--sumi); border-color:var(--sumi);
}
.site-header.is-scrolled .nav a.btn-header:hover{
  background:#3B3243; border-color:#3B3243; letter-spacing:.17em;
}

.burger{
  display:none; width:44px; height:44px; margin-right:-10px;
  position:relative;
}
.burger span{
  position:absolute; left:11px; right:11px; height:1px; background:var(--sumi);
  transition:transform .6s var(--ease), opacity .4s;
}
.burger span:nth-child(1){ top:18px; }
.burger span:nth-child(2){ top:26px; }
body.menu-open .burger span:nth-child(1){ transform:translateY(4px) rotate(38deg); }
body.menu-open .burger span:nth-child(2){ transform:translateY(-4px) rotate(-38deg); }

/* mobile menu */
.menu-panel{
  position:fixed; inset:0; z-index:590;
  background:var(--paper);
  padding:calc(var(--header-h) + 40px) 32px 40px;
  display:flex; flex-direction:column; justify-content:space-between;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .6s var(--ease), transform .6s var(--ease), visibility .6s;
}
body.menu-open .menu-panel{ opacity:1; visibility:visible; transform:none; }
.menu-panel ul{ display:flex; flex-direction:column; }
.menu-panel li{ border-bottom:1px solid var(--line-hair); }
.menu-panel a{
  display:flex; align-items:baseline; gap:16px; padding:22px 4px;
  font-family:var(--mincho); font-size:19px; letter-spacing:.13em; color:var(--sumi);
}
.menu-panel a i{
  font-family:var(--en); font-style:normal; font-size:11px;
  letter-spacing:.2em; color:var(--kin);
}
.menu-foot{ display:flex; flex-direction:column; gap:20px; }
.menu-foot .brand-mark{ font-size:15px; }


/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:space-between; gap:22px;
  font-family:var(--mincho); font-size:14.5px; font-weight:500; letter-spacing:.15em;
  color:var(--paper); background:var(--sumi);
  padding:18px 30px 18px 34px; line-height:1;
  border:1px solid var(--sumi);
  transition:background .7s var(--ease), border-color .7s var(--ease),
             letter-spacing .7s var(--ease), color .7s var(--ease);
}
.btn .arw{
  position:relative; width:24px; height:1px; flex:none;
  background:rgba(245,241,233,.5);
  transition:width .7s var(--ease), background .7s var(--ease);
}
.btn .arw::after{
  content:""; position:absolute; right:0; top:-3px; width:7px; height:7px;
  border-top:1px solid rgba(245,241,233,.5); border-right:1px solid rgba(245,241,233,.5);
  transform:rotate(45deg);
  transition:border-color .7s var(--ease);
}
.btn:hover{ background:#3B3243; border-color:#3B3243; letter-spacing:.18em; }
.btn:hover .arw{ width:32px; background:rgba(245,241,233,.85); }
.btn:hover .arw::after{ border-color:rgba(245,241,233,.85); }

.btn--ghost{
  background:transparent; color:var(--sumi); border-color:var(--line);
}
.btn--ghost .arw{ background:var(--kin); }
.btn--ghost .arw::after{ border-color:var(--kin); }
.btn--ghost:hover{ background:rgba(73,63,80,.05); border-color:var(--sumi); }

/* ---------- scroll cue (on paper, under the copy) ---------- */
.scroll-cue span{
  font-family:var(--en); font-size:10px; letter-spacing:.34em; color:var(--kin);
  writing-mode:vertical-rl; line-height:1;
}
.scroll-cue i{
  display:block; width:1px; height:64px; background:var(--line);
  position:relative; overflow:hidden;
}
.scroll-cue i::after{
  content:""; position:absolute; left:0; top:-30%; width:1px; height:30%;
  background:var(--sumi); animation:cue 2.8s var(--ease) infinite;
}
@keyframes cue{ 0%{ top:-32%; } 60%,100%{ top:104%; } }

/* =========================================================
   hero
   —— photograph kept intact: the copy lives on paper below it
   ========================================================= */
.hero{
  position:relative; background:var(--paper);
  display:grid; grid-template-columns:1fr; gap:0;
  padding-top:var(--header-h);
}
.hero-figure{
  position:relative; width:100%;
  height:clamp(300px, 46vh, 480px);
  overflow:hidden;
}
.hero-media{ position:absolute; inset:0; overflow:hidden; }
.hero-media img{
  width:100%; height:100%; object-fit:cover; object-position:56% 52%;
  opacity:0; transform:scale(1.035);
  animation:heroIn 1.7s var(--ease) .08s forwards, heroZoom 30s ease-out .08s forwards;
  will-change:transform, opacity;
}
@keyframes heroIn{ to{ opacity:1; } }
@keyframes heroZoom{ to{ transform:scale(1); } }

/* the image melts into the paper along one edge only — no veil over the subject */
.hero-scrim{ position:absolute; inset:0; pointer-events:none; }
.hero-scrim::before{
  content:""; position:absolute; left:0; right:0; bottom:0; height:34%;
  background:linear-gradient(to top, var(--paper) 0%, rgba(245,241,233,.86) 18%, rgba(245,241,233,.42) 52%, rgba(245,241,233,0) 100%);
}
.hero-scrim::after{
  content:""; position:absolute; left:0; top:0; right:0; height:var(--header-h);
  background:linear-gradient(to bottom, rgba(245,241,233,.9) 0%, rgba(245,241,233,.5) 45%, rgba(245,241,233,0) 100%);
}

.hero-inner{
  position:relative; z-index:2;
  width:min(1160px, 100% - 96px); margin-inline:auto;
  display:grid; grid-template-columns:minmax(0,1fr) auto;
  align-items:end; gap:clamp(32px,5vw,72px);
  padding:clamp(34px,5vw,58px) 84px clamp(56px,6.5vw,80px) 0;
}
.hero-copy > *{ opacity:0; animation:copyIn 1.35s var(--ease) forwards; }
@keyframes copyIn{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }

.hero-mark{
  font-family:var(--mincho); font-size:12.5px; letter-spacing:.36em;
  color:var(--fuji); margin-bottom:clamp(14px,1.8vw,20px); animation-delay:.45s;
}
.hero h1{
  font-family:var(--mincho); font-weight:500;
  font-size:clamp(29px, 3.7vw, 50px);
  line-height:1.66; letter-spacing:.085em; color:var(--sumi);
  animation-delay:.62s;
  font-feature-settings:"palt" 1;
  text-wrap:pretty;
}
.hero-sub{
  font-family:var(--mincho); font-size:clamp(13.5px, 1.15vw, 16px);
  letter-spacing:.24em; color:var(--sumi-70);
  margin-top:clamp(16px,1.8vw,22px); animation-delay:.82s;
}

.hero-aside{
  display:flex; flex-direction:column; align-items:flex-start;
  gap:clamp(16px,1.8vw,22px);
  padding-bottom:6px;
  opacity:0; animation:copyIn 1.35s var(--ease) 1s forwards;
}
.hero-aside .hero-supp{
  font-size:12.5px; letter-spacing:.13em; color:var(--fuji);
  line-height:2; max-width:15em;
}
.hero-aside::before{
  content:""; display:block; width:44px; height:1px; background:var(--kin);
  margin-bottom:2px;
}

.hero-inner .scroll-cue{
  position:absolute; right:6px; bottom:clamp(22px,2.6vw,32px);
  display:flex; flex-direction:column; align-items:center; gap:10px;
}


/* ---- Japanese line breaking: break at phrase boundaries, never leave orphans ---- */
h1, h2, h3, h4,
.body-copy, .lead, .tiny, .promise p, .svc-card .cap, .season .date,
.faq-a p, .flow-step p, .person-body p, .voices li, .contact-intro p,
.area-note p, .price-notes p, .detail-block .note, .disclaimer,
.thought-lead, .thought-seal p, .figcap{
  line-break:strict;
  word-break:auto-phrase;
  overflow-wrap:break-word;
}
/* keep a closing punctuation + particle from being stranded on its own line */
h1, h2, h3, .thought-lead, .thought-seal p{
  text-wrap:balance;
}
.thought-lead, .thought-seal p, .hero h1{ text-wrap:pretty; }

/* =========================================================
   02  counsel
   ========================================================= */
.split{
  display:grid; grid-template-columns:1.06fr .94fr;
  gap:clamp(40px, 6vw, 92px); align-items:start;
}
.split .col-text{ display:flex; flex-direction:column; gap:clamp(26px,3vw,40px); }
.figure{ position:relative; overflow:hidden; background:var(--paper-2); }
.figure img{ width:100%; height:100%; object-fit:cover; display:block; }
.figure--45{ aspect-ratio:4/5; }
.figure--34{ aspect-ratio:3/4; }
.figure--169{ aspect-ratio:16/9; }
.figure--off{ margin-top:clamp(0px, 5vw, 76px); }
.figcap{
  display:flex; gap:14px; align-items:baseline;
  margin-top:14px; font-size:12px; letter-spacing:.1em; color:var(--fuji);
}
.figcap::before{ content:""; width:22px; height:1px; background:var(--line); flex:none; transform:translateY(-3px); }

.voices{
  margin-top:clamp(48px, 6vw, 84px);
  padding-top:clamp(32px, 4vw, 48px);
  border-top:1px solid var(--line-hair);
  max-width:700px;
}
.voices li{
  font-family:var(--mincho); font-size:clamp(16px, 1.45vw, 19px);
  line-height:2.5; letter-spacing:.085em; color:var(--sumi);
  padding:4px 0;
}
.voices li + li{ border-top:1px solid var(--line-hair); }
.voices li::before{
  content:"—"; color:var(--kin); margin-right:16px; font-family:var(--gothic);
  font-size:13px; letter-spacing:0;
}
.closing{ margin-top:clamp(36px, 4.4vw, 56px); max-width:700px; }

/* お客様の声（感謝・安心のトーン）— ブランドの色・書体・余白はそのまま、
   問いかけの一覧（.voices）と区別するため、合図を柔らかい菱形に、
   行間をゆったりめに調整するのみ */
.voices.voices--grateful li{
  line-height:1.95;
}
.voices.voices--grateful li::before{
  content:""; width:6px; height:6px; flex:none; margin-right:18px;
  background:var(--kin); opacity:.82;
  transform:translateY(-3px) rotate(45deg);
  display:inline-block;
}
.voices-message{
  margin-top:clamp(30px, 3.6vw, 44px);
  padding-top:clamp(26px, 3.2vw, 36px);
  border-top:1px solid var(--line-hair);
  max-width:700px;
  font-family:var(--mincho); font-weight:400;
  font-size:clamp(16px, 1.32vw, 17.5px);
  line-height:2.15; letter-spacing:.07em; color:var(--sumi-soft);
  text-wrap:pretty;
}

/* =========================================================
   03  thought
   ========================================================= */
.thought{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); align-items:center; }
.thought .col-text{ display:flex; flex-direction:column; gap:clamp(24px,2.6vw,34px); }
/* the recalled line from the hero, restated quietly inside the section */
.thought-lead{
  font-family:var(--mincho); font-weight:400;
  font-size:clamp(18px, 1.82vw, 23px);
  line-height:2.05; letter-spacing:.14em;
  color:var(--sumi);
  text-wrap:pretty;
  margin-bottom:clamp(22px,2.6vw,34px);
  padding-bottom:clamp(22px,2.6vw,32px);
  border-bottom:1px solid var(--line-hair);
  text-wrap:pretty;
}
@media (min-width: 901px){
  .thought-lead{ text-wrap:nowrap; }
}
.thought-figure{ position:relative; }
.thought-figure .figure{ aspect-ratio:4/5; }
.v-rule{
  position:absolute; top:-26px; left:-26px; width:1px; height:96px; background:var(--line);
}
.thought-seal{
  display:flex; flex-direction:column; gap:18px;
  margin-top:clamp(56px, 7vw, 96px);
  padding-top:clamp(40px, 5vw, 60px);
  border-top:1px solid var(--line);
  align-items:center; text-align:center;
}
.thought-seal p{
  font-family:var(--mincho); font-weight:400;
  font-size:clamp(21px, 2.7vw, 34px);
  letter-spacing:.28em; line-height:2.1; color:var(--sumi);
  text-indent:.28em;
}

/* =========================================================
   04  promise
   ========================================================= */
.promises{ max-width:880px; margin-inline:auto; }
.promise{
  display:grid; grid-template-columns:84px 1fr; gap:clamp(16px,2.6vw,40px);
  padding:clamp(28px,3.1vw,40px) 0;
  border-top:1px solid var(--line-hair);
}
.promise:last-child{ border-bottom:1px solid var(--line-hair); }
.promise .num{
  font-family:var(--en); font-size:clamp(26px,2.4vw,32px); font-weight:300;
  letter-spacing:.06em; color:var(--kin); line-height:1.1;
}
.promise .num::after{
  content:""; display:block; width:22px; height:1px; background:var(--line); margin-top:16px;
}
.promise h3{ margin-bottom:14px; }
.promise p{ font-size:15.8px; line-height:2.2; letter-spacing:.04em; color:var(--sumi-70); max-width:32em; }

/* =========================================================
   05  service
   ========================================================= */
.svc + .svc{ margin-top:clamp(72px, 9vw, 128px); }
.svc-head{ display:flex; flex-direction:column; gap:22px; max-width:720px; margin-bottom:clamp(34px,4vw,52px); }
.svc-index{ display:flex; align-items:center; gap:16px; }
.svc-index .n{
  font-family:var(--en); font-size:17px; font-weight:400;
  letter-spacing:.2em; color:var(--kin); line-height:1;
}
.svc-index .bar{ width:56px; height:1px; flex:none; background:var(--kin); opacity:.62; }

.svc-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(14px,1.7vw,24px);
}
.svc-card{ display:flex; flex-direction:column; }
.svc-card .figure{ aspect-ratio:3/4; }
.svc-card .body{ display:flex; flex-direction:column; gap:0; }
.svc-card h4{
  font-family:var(--mincho); font-size:15.5px; font-weight:500;
  letter-spacing:.06em; line-height:1.85; color:var(--sumi);
  margin-top:16px;
  min-height:3.7em;
}
.svc-card .cap{ font-size:12.5px; line-height:1.95; letter-spacing:.03em; color:var(--fuji); margin-top:5px; }

.detail-block{
  margin-top:clamp(40px,4.6vw,58px);
  padding-top:clamp(26px,2.8vw,34px);
  border-top:1px solid var(--line-hair);
  display:grid; grid-template-columns:minmax(150px,180px) 1fr; gap:clamp(20px,3vw,44px);
}
.detail-block .dh{
  font-family:var(--mincho); font-size:14px; letter-spacing:.14em; color:var(--sumi);
  line-height:1.9; white-space:nowrap;
}
.detail-block ul li{
  font-size:15px; line-height:2.2; letter-spacing:.04em; color:var(--sumi-70);
  padding:3px 0;
}
.detail-block ul li::before{ content:"・"; color:var(--kin); }
.detail-block .note{ margin-top:16px; font-size:13px; line-height:2.05; color:var(--fuji); }

.svc-two{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(36px,5.4vw,80px); align-items:start; }
.svc-list{ border-top:1px solid var(--line-hair); }
.svc-list li{
  display:flex; gap:18px; align-items:baseline;
  padding:16px 0; border-bottom:1px solid var(--line-hair);
  font-size:15.5px; line-height:1.95; letter-spacing:.045em; color:var(--sumi-soft);
}
.svc-list li::before{
  content:""; width:5px; height:5px; flex:none; transform:translateY(-4px) rotate(45deg);
  border:1px solid var(--kin);
}
.disclaimer{
  margin-top:26px; padding-top:20px; border-top:1px solid var(--line);
  font-size:13px; line-height:2.1; letter-spacing:.04em; color:var(--fuji);
}

/* =========================================================
   06  seasons
   ========================================================= */
.seasons{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.6vw,22px); }
.season .figure{ aspect-ratio:4/5; }
.season .meta{
  display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
  margin-top:18px; padding-top:14px; border-top:1px solid var(--line-hair);
}
.season .nm{ display:flex; align-items:baseline; gap:10px; }
.season .nm b{
  font-family:var(--mincho); font-weight:500; font-size:19px;
  letter-spacing:.1em; color:var(--sumi);
}
.season .nm small{ font-size:12.5px; letter-spacing:.08em; color:var(--fuji); }
.season .meta{ align-items:center; }
.season .date{ font-size:12.5px; letter-spacing:.06em; color:var(--sumi-70); margin-top:8px; line-height:1.9; }

/* =========================================================
   07  price
   ========================================================= */
.price-head{ display:flex; flex-direction:column; align-items:center; gap:20px; text-align:center; }
.price-head .en{ font-family:var(--en); font-size:12px; letter-spacing:.36em; text-transform:uppercase; color:var(--kin); }
.price-head h2{ font-size:clamp(26px,3.2vw,40px); letter-spacing:.18em; text-indent:.18em; }
.price-head h2 .h2-sub{
  display:inline-block; margin-left:clamp(14px,1.8vw,26px);
  font-size:.62em; letter-spacing:.16em; color:var(--fuji); vertical-align:.12em;
}
.price-head h2 .h2-sub::before{
  content:"／"; margin-right:clamp(10px,1.2vw,16px); color:var(--fuji); opacity:.85;
}
.price-head .sub{
  font-family:var(--mincho); font-size:15px; letter-spacing:.16em; color:var(--fuji);
}
.price-grid{
  display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(16px,2.4vw,28px);
  margin-top:clamp(44px,5.4vw,68px);
}
.price-card{
  border:1px solid var(--line); background:var(--paper-3);
  padding:clamp(30px,3.6vw,48px);
  display:flex; flex-direction:column;
}
.price-card--main{ border-color:rgba(169,154,124,.62); }
.price-card .pc-label{
  display:flex; align-items:baseline; gap:12px;
  font-family:var(--mincho); font-size:16px; letter-spacing:.14em; color:var(--sumi);
}
.price-card .pc-label small{ font-size:12px; letter-spacing:.1em; color:var(--fuji); }
.price-card .pc-freq{
  font-size:13.5px; letter-spacing:.08em; color:var(--fuji); margin-top:12px;
}
.price-num{
  display:flex; align-items:baseline; gap:6px;
  margin:clamp(22px,2.6vw,32px) 0 6px;
}
.price-num .fig{
  font-family:var(--en); font-size:clamp(48px,6vw,72px); font-weight:300;
  letter-spacing:.02em; line-height:.95; color:var(--sumi);
}
.price-num .unit{ font-family:var(--mincho); font-size:16px; letter-spacing:.08em; color:var(--sumi); }
.price-tax{ font-size:12.5px; letter-spacing:.04em; color:var(--fuji); line-height:2; line-break:strict; word-break:auto-phrase; text-wrap:pretty; }
.price-card .pc-note{ margin-top:auto; padding-top:22px; font-size:12.5px; line-height:2; color:var(--fuji); line-break:strict; word-break:auto-phrase; text-wrap:pretty; }
.price-card .pc-note--bordered{ border-top:1px solid var(--line-hair); }

.includes{
  margin-top:clamp(40px,5vw,64px);
  padding-top:clamp(28px,3vw,40px);
  border-top:1px solid var(--line);
}
.includes .ih{
  font-family:var(--mincho); font-size:14px; letter-spacing:.16em; color:var(--sumi);
  margin-bottom:24px;
}
.includes ul{
  display:grid; grid-template-columns:repeat(3,1fr); gap:2px 32px;
}
.includes li{
  font-size:14.5px; line-height:2.2; letter-spacing:.04em; color:var(--sumi-70);
  display:flex; gap:12px; align-items:baseline;
}
.includes li::before{ content:""; width:14px; height:1px; background:var(--line); flex:none; transform:translateY(-5px); }

.price-notes{
  margin-top:clamp(36px,4vw,52px);
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,3vw,48px);
  padding-top:clamp(24px,3vw,32px);
  border-top:1px solid var(--line-hair);
}
.price-notes p{ font-size:12.5px; line-height:2.05; color:var(--fuji); letter-spacing:.03em; line-break:strict; word-break:auto-phrase; text-wrap:pretty; }
.stop-note{
  margin-top:clamp(32px,4vw,44px);
  border:1px solid var(--line);
  padding:22px 28px;
  display:flex; align-items:center; gap:16px;
  font-size:14px; letter-spacing:.06em; color:var(--sumi);
}
.stop-note::before{
  content:""; width:7px; height:7px; flex:none; border:1px solid var(--kin); transform:rotate(45deg);
}

/* =========================================================
   08  area
   ========================================================= */
.area{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,6vw,88px); align-items:center; }
.area-box{ border:1px solid var(--line); padding:clamp(30px,3.6vw,48px); background:var(--paper-3); }
.area-row{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding:16px 0; }
.area-row + .area-row{ border-top:1px solid var(--line-hair); }
.area-row dt{
  font-family:var(--mincho); font-size:17px; letter-spacing:.1em; color:var(--sumi);
}
.area-row dd{ font-size:14.5px; letter-spacing:.05em; color:var(--sumi-70); text-align:right; }
.area-note{
  margin-top:22px; padding-top:20px; border-top:1px solid var(--line-hair);
  display:flex; flex-direction:column; gap:10px;
}
.area-note p{
  font-size:12.5px; line-height:2.05; letter-spacing:.035em; color:var(--fuji);
  text-wrap:pretty; line-break:strict; word-break:auto-phrase;
}

/* =========================================================
   09  person
   ========================================================= */
.person{ display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(32px,5vw,80px); align-items:center; }
.portrait{
  position:relative; aspect-ratio:4/5; background:var(--paper-3);
  border:1px solid var(--line-hair);
  overflow:hidden;
}
.portrait img{
  width:100%; height:100%; object-fit:cover; object-position:50% 42%;
  filter:saturate(.94);
}
.person-name{ display:flex; flex-direction:column; gap:6px; }
.person-name .furigana{ font-size:12px; letter-spacing:.2em; color:var(--fuji); }
.person-name h3{ font-size:clamp(24px,2.6vw,32px); letter-spacing:.14em; }
.person-role{ font-size:13px; letter-spacing:.1em; color:var(--fuji); margin-top:10px; }
.person-body{ margin-top:clamp(24px,3vw,34px); padding-top:clamp(24px,3vw,34px); border-top:1px solid var(--line-hair); display:flex; flex-direction:column; gap:1.2em; }
.person-body p{ font-size:15.5px; line-height:2.2; letter-spacing:.045em; color:var(--sumi-70); }

/* =========================================================
   10  flow
   ========================================================= */
.flow{ max-width:820px; margin-inline:auto; border-top:1px solid var(--line-hair); }
.flow-step{
  display:grid; grid-template-columns:84px 1fr; gap:clamp(14px,2.6vw,34px);
  padding:clamp(22px,2.6vw,32px) 0;
  border-bottom:1px solid var(--line-hair);
}
.flow-step .fs-n{
  font-family:var(--en); font-size:13px; font-weight:400;
  letter-spacing:.16em; color:var(--kin); padding-top:4px;
  filter:brightness(.92);
}
.flow-step h3{ font-size:17.5px; letter-spacing:.08em; }
.flow-step p{ margin-top:7px; font-size:14px; line-height:2.05; color:var(--fuji); letter-spacing:.035em; }

/* =========================================================
   11  faq
   ========================================================= */
.faq{ max-width:880px; margin-inline:auto; }
.faq-cat{ margin-top:clamp(40px,5vw,64px); }
.faq-cat:first-of-type{ margin-top:0; }
.faq-cat > h3{
  display:flex; align-items:center; gap:16px;
  font-size:15px; letter-spacing:.14em; color:var(--sumi);
  padding-bottom:14px;
}
.faq-cat > h3::after{ content:""; flex:1; height:1px; background:var(--line); }
.faq-item{ border-bottom:1px solid var(--line-hair); }
.faq-q{
  width:100%; display:flex; gap:18px; align-items:flex-start;
  padding:22px 44px 22px 0; text-align:left; position:relative;
  font-family:var(--gothic); font-size:15.5px; line-height:1.85;
  letter-spacing:.04em; color:var(--sumi-soft);
  transition:color .6s var(--ease);
}
.faq-q .qn{
  font-family:var(--en); font-size:13px; letter-spacing:.06em; color:var(--kin);
  padding-top:3px; flex:none; min-width:26px;
}
.faq-q:hover{ color:var(--sumi); }
.faq-q:focus-visible{ outline:1px solid var(--kin); outline-offset:5px; }
.faq-icon{
  position:absolute; right:6px; top:50%; width:13px; height:13px;
  transform:translateY(-50%);
}
.faq-icon::before,.faq-icon::after{
  content:""; position:absolute; background:var(--fuji); transition:transform .6s var(--ease), opacity .6s;
}
.faq-icon::before{ left:0; right:0; top:6px; height:1px; }
.faq-icon::after{ top:0; bottom:0; left:6px; width:1px; }
.faq-q[aria-expanded="true"] .faq-icon::after{ transform:scaleY(0); }
.faq-a{
  overflow:hidden; height:0;
  transition:height .62s var(--ease);
}
.faq-a-inner{
  padding:0 44px 28px 44px; opacity:0; transform:translateY(-4px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.faq-item.is-open .faq-a-inner{ opacity:1; transform:none; }
.faq-a p{
  font-size:15px; line-height:2.15; letter-spacing:.04em; color:var(--sumi-70);
}
.faq-a p + p{ margin-top:.9em; }

/* =========================================================
   12  contact
   ========================================================= */
.contact{ background:var(--paper-2); }
.contact-head{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,76px); align-items:end; }
.contact-head h2{ font-size:clamp(24px,2.8vw,36px); line-height:1.85; }
.contact-intro{ display:flex; flex-direction:column; gap:1.1em; }
.contact-intro p{ font-size:15px; line-height:2.2; letter-spacing:.045em; color:var(--sumi-70); }
.contact-intro .privacy-line{
  display:flex; gap:12px; align-items:flex-start;
  padding-top:14px; margin-top:6px; border-top:1px solid var(--line);
  font-size:13px; line-height:2; color:var(--fuji);
}

.form-wrap{ margin-top:clamp(44px,5.4vw,72px); display:grid; grid-template-columns:1fr; }
.form-notice{
  display:flex; gap:14px; align-items:flex-start;
  border:1px solid var(--line); background:var(--paper-3);
  padding:16px 20px; margin-bottom:clamp(28px,3.4vw,40px);
  font-size:13px; line-height:1.95; color:var(--sumi-soft); letter-spacing:.03em;
}
.form-notice .dot{
  width:7px; height:7px; flex:none; margin-top:8px; border-radius:50%;
  background:var(--kin);
}
.form-notice strong{ font-weight:500; color:var(--sumi); }
form#contact-form{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(26px,3.2vw,40px) clamp(24px,3.6vw,52px); }
.field{ display:flex; flex-direction:column; gap:10px; }
.field--full{ grid-column:1/-1; }
.field label{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  font-size:14px; letter-spacing:.07em; color:var(--sumi); line-height:1.6;
}
.req{
  font-size:10.5px; letter-spacing:.12em; color:var(--paper); background:var(--fuji);
  padding:3px 7px; line-height:1; flex:none;
}
.opt{
  font-size:10.5px; letter-spacing:.12em; color:var(--fuji);
  border:1px solid var(--line); padding:2px 7px; line-height:1; flex:none;
}
.field input[type=text],
.field input[type=email],
.field input[type=tel],
.field select,
.field textarea{
  width:100%; font-family:var(--gothic); font-size:16px;
  color:var(--sumi); background:rgba(251,248,242,.7);
  border:1px solid rgba(73,63,80,.16);
  padding:15px 16px; line-height:1.7; letter-spacing:.03em;
  transition:border-color .5s var(--ease), background .5s var(--ease), box-shadow .5s var(--ease);
  border-radius:0; -webkit-appearance:none; appearance:none;
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238C8191' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 18px center;
  padding-right:44px;
}
.field textarea{ min-height:148px; resize:vertical; }
.field input:focus-visible,
.field select:focus-visible,
.field textarea:focus-visible{
  outline:none; border-color:var(--kin);
  background:#fff; box-shadow:0 0 0 3px rgba(169,154,124,.14);
}
.field input::placeholder,.field textarea::placeholder{ color:rgba(140,129,145,.75); letter-spacing:.03em; }
.field-hint{ font-size:12px; line-height:1.95; color:var(--fuji); letter-spacing:.02em; }

.radios{ display:flex; gap:clamp(24px,3vw,34px); flex-wrap:wrap; padding-top:2px; }
.radios label{
  display:inline-flex; align-items:center; gap:11px; font-size:15px;
  letter-spacing:.06em; color:var(--sumi-soft); cursor:pointer;
  flex:0 0 auto; white-space:nowrap; line-height:1.5;
  padding:10px 0; min-height:44px; position:relative;
}
.radios input{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.radios .rb{
  width:16px; height:16px; border:1px solid var(--line); border-radius:50%;
  display:grid; place-items:center; flex:none; transition:border-color .4s;
}
.radios .rb::after{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--sumi);
  transform:scale(0); transition:transform .4s var(--ease);
}
.radios input:checked + .rb{ border-color:var(--sumi); }
.radios input:checked + .rb::after{ transform:scale(1); }
.radios input:focus-visible + .rb{ outline:1px solid var(--kin); outline-offset:4px; }

.check{
  display:flex; gap:12px; align-items:flex-start; cursor:pointer;
  font-size:14.5px; line-height:1.85; letter-spacing:.04em; color:var(--sumi-soft);
  flex-wrap:nowrap; padding:8px 0; min-height:44px; position:relative;
}
.check > span:last-child{ flex:1 1 auto; }
.check .req{ vertical-align:middle; }
.check input{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.check .cb{
  width:16px; height:16px; border:1px solid var(--line); flex:none; margin-top:5px;
  position:relative; transition:border-color .4s, background .4s;
}
.check .cb::after{
  content:""; position:absolute; left:4px; top:1px; width:5px; height:9px;
  border-right:1px solid var(--paper); border-bottom:1px solid var(--paper);
  transform:rotate(40deg) scale(0); transition:transform .35s var(--ease);
}
.check input:checked + .cb{ background:var(--sumi); border-color:var(--sumi); }
.check input:checked + .cb::after{ transform:rotate(40deg) scale(1); }
.check input:focus-visible + .cb{ outline:1px solid var(--kin); outline-offset:4px; }
.check a{ border-bottom:1px solid var(--line); padding-bottom:1px; }

.form-actions{
  grid-column:1/-1; display:flex; align-items:center; gap:28px; flex-wrap:wrap;
  margin-top:6px; padding-top:clamp(22px,2.6vw,30px); border-top:1px solid var(--line-hair);
}
.form-actions .btn{ padding:20px 40px 20px 46px; font-size:15px; }
.form-actions .btn[aria-busy="true"]{ opacity:.72; pointer-events:none; }
.form-actions .aside{ font-size:12.5px; line-height:1.9; color:var(--fuji); letter-spacing:.03em; }

.form-status{
  grid-column:1/-1; border:1px solid var(--line); padding:18px 22px;
  font-size:13.5px; line-height:2; color:var(--sumi-soft); display:none;
}
.form-status.is-visible{ display:block; }
.form-status.is-error{ border-color:rgba(140,110,110,.5); }
.form-status.is-success{ border-color:rgba(169,154,124,.6); background:var(--paper-3); }
.form-status strong{ display:block; font-weight:500; color:var(--sumi); margin-bottom:4px; }

[data-field="turnstile"]{ gap:6px; }
.cf-turnstile{ display:flex; }
[data-field="turnstile"].has-error .cf-turnstile{ outline:1px solid rgba(150,105,105,.6); outline-offset:6px; }
.field.has-error input,.field.has-error select,.field.has-error textarea{ border-color:rgba(150,105,105,.6); }
.field .err{
  font-size:12px; color:#8C6363; letter-spacing:.03em; display:none;
}
.field.has-error .err{ display:block; }

/* =========================================================
   footer
   ========================================================= */
.site-footer{ background:var(--paper); padding:clamp(56px,7vw,88px) 0 40px; border-top:1px solid var(--line-hair); }
.foot-top{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(32px,5vw,72px); }
.foot-brand .brand-mark{ font-size:19px; letter-spacing:.22em; }
.foot-brand .brand-sub{ margin-top:8px; font-family:var(--gothic); font-size:11.5px; letter-spacing:.14em; color:var(--fuji); text-transform:none; }.foot-brand .foot-note{ margin-top:26px; font-size:12.5px; line-height:2.05; color:var(--fuji); max-width:360px; }
.foot-links{ display:grid; grid-template-columns:1fr 1fr; gap:8px 32px; align-content:start; }
.foot-links button{
  text-align:left; font-size:13px; letter-spacing:.05em; color:var(--sumi-70);
  padding:9px 0; border-bottom:1px solid var(--line-hair);
  transition:color .5s var(--ease);
}
.foot-links button:hover{ color:var(--sumi); }
.foot-bottom{
  margin-top:clamp(40px,5vw,60px); padding-top:22px; border-top:1px solid var(--line-hair);
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.foot-bottom p{ font-size:11.5px; letter-spacing:.06em; color:var(--fuji); white-space:nowrap; }
.foot-bottom .en{ font-family:var(--en); letter-spacing:.2em; font-size:10px; text-transform:uppercase; white-space:nowrap; }

/* mobile fixed cta */
.mobile-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:560;
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:rgba(245,241,233,.95);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-top:1px solid var(--line-hair);
  transform:translateY(110%); transition:transform .7s var(--ease);
  display:none;
}
.mobile-cta.is-visible{ transform:none; }
.mobile-cta a{
  display:flex; align-items:center; justify-content:center; gap:14px;
  background:var(--sumi); color:var(--paper);
  font-family:var(--mincho); font-size:14.5px; letter-spacing:.15em;
  padding:16px; line-height:1;
}

/* =========================================================
   dialogs
   ========================================================= */
dialog{
  border:0; padding:0; background:transparent; max-width:min(720px, 92vw); width:100%;
  margin:auto;
}
dialog::backdrop{ background:rgba(42,37,48,.44); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.dlg-inner{
  background:var(--paper); border:1px solid var(--line);
  padding:clamp(30px,4vw,52px); max-height:82vh; overflow:auto;
}
.dlg-inner h3{ margin-bottom:8px; }
.dlg-inner .dlg-en{ font-family:var(--en); font-size:11px; letter-spacing:.3em; color:var(--kin); text-transform:uppercase; }
.dlg-body{ margin-top:26px; display:flex; flex-direction:column; gap:18px; }
.dlg-body p{ font-size:14.5px; line-height:2.15; color:var(--sumi-70); letter-spacing:.04em; }
.dlg-body dl{ display:grid; grid-template-columns:150px 1fr; gap:12px 20px; font-size:14px; }
.dlg-body dt{ color:var(--sumi); font-family:var(--mincho); letter-spacing:.08em; }
.dlg-body dd{ color:var(--fuji); line-height:1.95; line-break:strict; word-break:auto-phrase; overflow-wrap:break-word; }
.dlg-body dd a{ color:var(--sumi-soft); border-bottom:1px solid var(--line); padding-bottom:1px; transition:color .4s var(--ease), border-color .4s var(--ease); }
.dlg-body dd a:hover{ color:var(--sumi); border-color:var(--sumi); }
.dlg-body dd.addr{ line-height:1.9; }
.dlg-body dd .dd-note{ display:inline-block; margin-top:6px; font-size:12px; color:var(--fuji); line-height:1.8; }
.dlg-body .pending{
  border:1px dashed var(--line); padding:12px 16px; font-size:12.5px;
  color:var(--fuji); line-height:1.95;
}
.dlg-article{ display:flex; flex-direction:column; gap:12px; }
.dlg-article + .dlg-article{ margin-top:4px; padding-top:22px; border-top:1px solid var(--line-hair); }
.dlg-article h4{
  font-family:var(--mincho); font-weight:500; font-size:15.5px; letter-spacing:.09em;
  color:var(--sumi); line-height:1.7;
}
.dlg-list{ display:flex; flex-direction:column; gap:4px; }
.dlg-list li{ font-size:14.5px; line-height:2; color:var(--sumi-70); letter-spacing:.04em; padding-left:1.2em; position:relative; }
.dlg-list li::before{ content:"・"; position:absolute; left:0; color:var(--kin); }
.dlg-list--num{ counter-reset:dlg-num; }
.dlg-list--num li{ padding-left:1.6em; }
.dlg-list--num li::before{ content:counter(dlg-num) "."; counter-increment:dlg-num; font-family:var(--en); color:var(--kin); }
.dlg-close{
  position:absolute; top:14px; right:14px; width:40px; height:40px;
  display:grid; place-items:center;
}
.dlg-close::before,.dlg-close::after{
  content:""; position:absolute; width:15px; height:1px; background:var(--fuji);
}
.dlg-close::before{ transform:rotate(45deg); }
.dlg-close::after{ transform:rotate(-45deg); }

/* =========================================================
   responsive
   ========================================================= */
@media (max-width: 1080px){
  .svc-grid{ grid-template-columns:repeat(2,1fr); gap:clamp(18px,2.6vw,28px); }
  .seasons{ grid-template-columns:repeat(2,1fr); gap:clamp(16px,2.4vw,26px); }
  .includes ul{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 1000px){
  .hero-inner{
    grid-template-columns:1fr; align-items:start;
    gap:clamp(24px,3.4vw,34px);
    padding:clamp(28px,4vw,40px) 0 clamp(52px,6vw,70px);
  }
  .hero-figure{ height:clamp(240px, 34vh, 360px); }
  .hero-aside{ flex-direction:row; align-items:center; flex-wrap:wrap; gap:20px 28px; padding-bottom:0; }
  .hero-aside::before{ display:none; }
  .hero-aside .hero-supp{ max-width:none; }
  .hero-inner .scroll-cue{ display:none; }
}

@media (max-width: 900px){
  :root{ --header-h:76px; --fs-body:16.5px; }
  .wrap,.wrap-narrow{ width:calc(100% - 64px); }
  .header-inner{ width:calc(100% - 56px); }
  .hero-inner{ width:calc(100% - 56px); }
  .nav{ display:none; }
  .nav a.btn-header{ display:none; }
  .burger{ display:block; }
  .split{ grid-template-columns:1fr; gap:36px; }
  .split .figure{ max-width:520px; }
  .figure--off{ margin-top:0; }
  .thought{ grid-template-columns:1fr; gap:40px; }
  .thought-figure{ order:-1; }
  .thought-figure .figure{ aspect-ratio:4/3; }
  .thought .col-text{ order:1; }
  .v-rule{ display:none; }
  .svc-two{ grid-template-columns:1fr; }
  .price-grid{ grid-template-columns:1fr; }
  .area{ grid-template-columns:1fr; }
  .person{ grid-template-columns:1fr; gap:32px; }
  .portrait{ max-width:360px; }
  .detail-block{ grid-template-columns:1fr; gap:14px; }
  .contact-head{ grid-template-columns:1fr; gap:28px; }
  form#contact-form{ grid-template-columns:1fr; }
  .foot-top{ grid-template-columns:1fr; }
  .mobile-cta{ display:block; }
  .scroll-cue{ display:none; }
  .flow-step{ grid-template-columns:64px 1fr; gap:18px; }
  .promise{ grid-template-columns:64px 1fr; }
  .price-notes{ grid-template-columns:1fr; }
}

@media (max-width: 620px){
  /* ファーストビュー：スマートフォン専用の組み */
  .hero-figure{ height:clamp(232px, 32vh, 320px); }
  .hero-media img{ object-position:62% 50%; }
  .hero-inner{
    width:calc(100% - 40px);
    padding:26px 0 40px; gap:24px;
  }
  .hero-mark{ font-size:11.5px; letter-spacing:.28em; margin-bottom:14px; }
  .hero h1{ font-size:clamp(25px, 7.1vw, 32px); line-height:1.72; letter-spacing:.055em; }
  .hero-sub{ font-size:12.5px; letter-spacing:.16em; margin-top:14px; }
  .hero-aside{ flex-direction:column; align-items:stretch; gap:18px; }
  .hero-aside .hero-supp{ font-size:12px; line-height:1.95; letter-spacing:.09em; }
  .wrap,.wrap-narrow{ width:calc(100% - 40px); }
  .header-inner{ width:calc(100% - 40px); }
  .sec{ padding:72px 0; }
  .btn{ width:100%; justify-content:space-between; padding:18px 24px; }
  .svc-grid{ grid-template-columns:1fr; }
  .svc-card{ display:grid; grid-template-columns:104px 1fr; gap:18px; align-items:center; }
  .svc-card .figure{ aspect-ratio:1/1; }
  .svc-card h4{ margin-top:0; }
  .svc-card .body{ display:flex; flex-direction:column; justify-content:center; }
  .seasons{ grid-template-columns:1fr 1fr; gap:14px; }
  .season .nm b{ font-size:17px; }
  .season .nm small{ font-size:11px; }
  .season .date{ font-size:11px; }
  .includes ul{ grid-template-columns:1fr; }
  .price-num .fig{ font-size:56px; }
  .foot-links{ grid-template-columns:1fr; }
  .faq-q{ padding-right:36px; padding-left:0; font-size:15px; }
  .faq-a-inner{ padding:0 10px 24px 44px; }
  .dlg-body dl{ grid-template-columns:1fr; gap:4px 0; }
  .dlg-body dt{ margin-top:10px; }
  .dlg-article h4{ font-size:14.5px; }
  .dlg-list li{ font-size:14px; }
  .promise{ grid-template-columns:1fr; gap:12px; }
  .promise .num::after{ margin-top:10px; }
  .flow-step{ grid-template-columns:1fr; gap:8px; }
  .thought-seal p{ letter-spacing:.18em; text-indent:.18em; font-size:20px; line-height:2.2; }
  .area-row{ flex-direction:column; align-items:flex-start; gap:4px; }
  .area-row dd{ text-align:left; }
  .stop-note{ align-items:flex-start; padding:18px 20px; font-size:13px; line-height:1.95; }
  .form-actions .btn{ width:100%; }
  body{ padding-bottom:0; }
}
