/* KURA site — 墨 × 金 × 明朝 */
:root{
  --ink:#12161A; --ink2:#1A2027; --ink3:#0D1013; --bubble:#2A3038;
  --paper:#F4EFE4; --paper-line:#D9D0BE;
  --gold:#C9A45C; --gold-hi:#E2C68A; --gold-deep:#7A5B1E;
  --on-ink:#EDE7DA; --on-ink-strong:#F6F1E6; --on-ink-soft:#CFC8BA; --on-ink-mute:#A9A293;
  --text:#1E2226; --text-soft:#4B4C4A; --text-mute:#6A665E;
  --serif:'Shippori Mincho B1','Hiragino Mincho ProN','Yu Mincho',serif;
  --sans:'Zen Kaku Gothic New','Hiragino Sans','Yu Gothic',sans-serif;
  --latin:'Cormorant Garamond','Shippori Mincho B1',serif;
  --pad-sec:clamp(72px,9vw,120px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--on-ink);font-family:var(--sans);line-height:1.85;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:var(--gold)}a:hover{color:var(--gold-hi)}
h1,h2,h3,p,li{text-wrap:pretty}
.wrap{max-width:1200px;margin:0 auto;padding-inline:28px}
.narrow{max-width:900px;margin:0 auto;padding-inline:28px}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:99;background:var(--gold);color:var(--ink);padding:8px 14px}

/* 地の柄 */
.bg-ink{background:var(--ink);background-image:repeating-linear-gradient(45deg,rgba(237,231,218,.035) 0 1px,transparent 1px 34px),repeating-linear-gradient(-45deg,rgba(237,231,218,.035) 0 1px,transparent 1px 34px)}
.bg-ink2{background:var(--ink2);background-image:repeating-linear-gradient(45deg,rgba(237,231,218,.025) 0 1px,transparent 1px 34px),repeating-linear-gradient(-45deg,rgba(237,231,218,.025) 0 1px,transparent 1px 34px)}
.bg-paper{background:var(--paper);color:var(--text)}
.glow{background-image:radial-gradient(ellipse 70% 60% at 78% 30%,rgba(201,164,92,.16),transparent 70%),repeating-linear-gradient(45deg,rgba(237,231,218,.035) 0 1px,transparent 1px 34px),repeating-linear-gradient(-45deg,rgba(237,231,218,.035) 0 1px,transparent 1px 34px)}
.sec{padding-block:var(--pad-sec)}
.rel{position:relative;overflow:hidden}
.watermark{position:absolute;right:-80px;top:40px;font-family:var(--serif);font-weight:800;font-size:clamp(320px,44vw,620px);line-height:1;color:rgba(201,164,92,.07);pointer-events:none;user-select:none}

/* ヘッダー */
.site-header{position:relative;z-index:5}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--on-ink)}
.brand-mark{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--gold);font-family:var(--serif);font-weight:800;font-size:24px;color:var(--gold)}
.brand-name{font-family:var(--serif);font-size:24px;font-weight:700;letter-spacing:.22em}
html[lang=en] .brand-name{font-family:var(--latin);font-size:28px;font-weight:600}
.nav{display:flex;align-items:center;gap:8px 28px;font-size:15px}
.nav a{text-decoration:none;color:var(--on-ink-soft)}
.nav a:hover,.nav a[aria-current=page]{color:var(--gold)}
.nav a[aria-current=page]{text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:1px}
.btn-line{display:inline-flex;align-items:center;min-height:44px;padding:0 22px;border:1px solid rgba(201,164,92,.6);color:var(--gold)!important;letter-spacing:.08em;text-decoration:none}
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;border:1px solid rgba(237,231,218,.3);color:var(--on-ink)}
.menu summary::-webkit-details-marker{display:none}
.menu[open] .menu-panel{display:flex}
.menu-panel{display:none;position:absolute;right:0;top:54px;min-width:220px;flex-direction:column;background:var(--ink3);border:1px solid rgba(201,164,92,.35);padding:8px 0;box-shadow:0 20px 50px rgba(0,0,0,.5)}
.menu-panel a{padding:12px 20px;color:var(--on-ink);text-decoration:none}
.menu-panel a:hover{background:rgba(201,164,92,.1);color:var(--gold)}
@media (max-width:860px){.nav{display:none}.menu{display:block}}

/* 文字 */
.eyebrow{margin:0;display:flex;align-items:center;gap:14px;font-size:14px;font-weight:700;letter-spacing:.3em;color:var(--gold)}
.eyebrow.line::before{content:"";display:inline-block;width:40px;height:1px;background:currentColor}
.bg-paper .eyebrow{color:var(--gold-deep)}
.h-display{margin:0;font-family:var(--serif);font-weight:800;font-size:clamp(38px,4.6vw,66px);line-height:1.38;letter-spacing:.02em;color:var(--on-ink-strong)}
.h-page{margin:0;font-family:var(--serif);font-weight:800;font-size:clamp(34px,4.2vw,58px);line-height:1.4;color:var(--on-ink-strong)}
.h2{margin:0;font-family:var(--serif);font-weight:800;font-size:clamp(28px,3.4vw,46px);line-height:1.5;color:var(--on-ink-strong)}
.bg-paper .h2{color:var(--text)}
.h3{margin:0;font-family:var(--serif);font-weight:700;font-size:clamp(21px,2vw,28px);line-height:1.5}
html[lang=en] .h-display{font-family:var(--latin);font-weight:600;font-size:clamp(44px,5.4vw,80px);line-height:1.08;letter-spacing:-.005em}
html[lang=en] .h-page{font-family:var(--latin);font-weight:600;font-size:clamp(42px,5vw,72px);line-height:1.08}
html[lang=en] .h2{font-family:var(--latin);font-weight:600;font-size:clamp(36px,4.2vw,60px);line-height:1.12}
html[lang=en] .h3{font-family:var(--latin);font-weight:600;font-size:clamp(24px,2.4vw,32px);line-height:1.25}
.gold{color:var(--gold)}.bg-paper .gold{color:var(--gold-deep)}
.lead{margin:0;font-size:18px;color:var(--on-ink-soft);max-width:620px}
.bg-paper .lead{color:var(--text-soft)}
.soft{color:var(--on-ink-soft)}.bg-paper .soft{color:var(--text-soft)}
.mute{color:var(--on-ink-mute);font-size:14px}.bg-paper .mute{color:var(--text-mute)}
.stack{display:flex;flex-direction:column;gap:18px}
.stack-lg{display:flex;flex-direction:column;gap:56px}
.center{text-align:center;align-items:center}
p{margin:0}
.ph{background:rgba(201,164,92,.18);padding:0 4px;border-bottom:1px dashed var(--gold)}

/* ボタン */
.btns{display:flex;flex-wrap:wrap;gap:16px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:58px;padding:0 32px;text-decoration:none;font-weight:700;font-size:17px;letter-spacing:.05em;transition:transform .2s ease,box-shadow .2s ease}
.btn-gold{background:var(--gold);color:var(--ink)!important}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(201,164,92,.35)}
.btn-ghost{border:1px solid rgba(237,231,218,.35);color:var(--on-ink)!important;font-weight:500;font-size:16px}
.btn-ghost:hover{border-color:var(--gold)}
.btn-dark{background:var(--ink);color:var(--paper)!important}
.btn-dark:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.3)}
.btn-outline-gold{border:1px solid var(--gold);color:var(--gold)!important}
.arrow{width:18px;height:18px}

/* ヒーロー */
.hero-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(460px,100%),1fr));gap:64px;align-items:center;padding-block:clamp(40px,5vw,72px) clamp(80px,9vw,128px);position:relative}
.page-hero{padding-block:clamp(48px,6vw,88px) clamp(64px,8vw,112px);position:relative}

/* 会話の例 */
.chat{display:flex;flex-direction:column;gap:14px}
.chat-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.chat-head p{font-size:12px;letter-spacing:.2em;color:#9C9586}
.dots{display:flex;gap:2px}
.dots button{width:32px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:0;padding:0;background:transparent;cursor:pointer}
.dots span{display:block;width:6px;height:6px;border-radius:3px;background:rgba(237,231,218,.3);transition:width .3s ease,background .3s ease}
.dots button[aria-pressed=true] span{width:22px;background:var(--gold)}
.chat-body{display:flex;flex-direction:column;gap:14px;min-height:440px;transition:opacity .45s ease,transform .45s ease}
.chat-body.out{opacity:0;transform:translateY(8px)}
.b-me{align-self:flex-end;max-width:380px;padding:16px 20px;background:var(--bubble);color:var(--on-ink);font-size:15px;border-radius:18px 18px 4px 18px}
.b-kura{align-self:flex-start;max-width:400px;padding:18px 22px;background:var(--paper);color:var(--text);font-size:15px;border-radius:18px 18px 18px 4px;display:flex;flex-direction:column;gap:10px}
.b-kura strong{color:var(--gold-deep)}
.saved{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--gold-deep);letter-spacing:.08em}

/* 今まで／これから */
.ba{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));gap:2px;background:var(--paper-line)}
.ba > div{background:var(--paper);padding:clamp(28px,4vw,40px) clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:14px}
.ba .k{font-size:13px;font-weight:700;letter-spacing:.2em;color:#8A8478}
.ba .k.now{color:var(--gold-deep);margin-top:10px}
.ba .before{font-size:18px;color:var(--text-mute);text-decoration:line-through;text-decoration-color:rgba(122,91,30,.5)}
.ba .after{font-family:var(--serif);font-size:22px;font-weight:700}
html[lang=en] .ba .after{font-family:var(--latin);font-size:26px;font-weight:600}

/* 壱弐参 */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:32px}
.step{display:flex;flex-direction:column;gap:16px;padding-top:28px;border-top:1px solid rgba(201,164,92,.5)}
.numeral{display:flex;align-items:baseline;gap:14px}
.numeral b{font-family:var(--serif);font-size:clamp(48px,5vw,64px);font-weight:800;line-height:1;color:var(--gold)}
.numeral span{font-size:12px;letter-spacing:.25em;color:#9C9586}
.step h3{color:var(--on-ink-strong)}
.step p{font-size:15px;color:var(--on-ink-soft)}

/* 枠 */
.panel{padding:clamp(24px,3vw,36px);border:1px solid rgba(237,231,218,.15);background:rgba(18,22,26,.6)}
.panel-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px 40px}
.panel-row > p:last-child{flex:1 1 360px}
.bg-paper .panel{border-color:var(--paper-line);background:rgba(255,255,255,.35)}

/* 料金 */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(400px,100%),1fr));gap:28px;max-width:1100px;width:100%;margin:0 auto}
.plan{position:relative;padding:clamp(36px,5vw,48px) clamp(24px,4vw,44px);display:flex;flex-direction:column;gap:24px}
.plan-light{background:var(--paper);color:var(--text);box-shadow:0 30px 80px rgba(0,0,0,.45)}
.plan-dark{background:var(--ink2);border:1px solid rgba(201,164,92,.45)}
.ribbon{position:absolute;top:-14px;left:clamp(24px,4vw,44px);background:var(--gold);color:var(--ink);font-size:13px;font-weight:700;letter-spacing:.12em;padding:4px 14px}
.plan .kind{font-size:14px;font-weight:700;letter-spacing:.2em;color:var(--gold-deep)}
.plan-dark .kind{color:var(--gold)}
.plan .name{margin:0;font-family:var(--serif);font-size:32px;font-weight:800}
html[lang=en] .plan .name{font-family:var(--latin);font-size:40px;font-weight:600}
.plan-dark .name{color:var(--on-ink-strong)}
.price{display:flex;flex-direction:column;gap:6px;padding:20px 0;border-top:1px solid var(--paper-line);border-bottom:1px solid var(--paper-line);font-size:16px;color:var(--text-soft)}
.plan-dark .price{border-color:rgba(237,231,218,.15);color:var(--on-ink-soft)}
.price .first{font-family:var(--serif);font-size:30px;font-weight:800;color:var(--gold-deep)}
.price .main{font-family:var(--serif);font-size:52px;font-weight:800;color:var(--text);letter-spacing:.01em}
.price .quote{font-family:var(--serif);font-size:44px;font-weight:800;color:var(--on-ink-strong)}
html[lang=en] .price .first,html[lang=en] .price .main,html[lang=en] .price .quote{font-family:var(--latin);font-weight:700}
.ticks{margin:0;padding:0;list-style:none;font-size:15px;display:flex;flex-direction:column;gap:10px}
.ticks li{display:flex;gap:10px}
.ticks li::before{content:"―";color:var(--gold-deep)}
.plan-dark .ticks{color:var(--on-ink-soft)}.plan-dark .ticks li::before,.bg-ink .ticks li::before,.bg-ink2 .ticks li::before{color:var(--gold)}
.plan .btn{margin-top:auto}

/* 表 */
.table-box{overflow-x:auto;border-top:1px solid currentColor}
table{width:100%;border-collapse:collapse;font-size:15px;min-width:560px}
th,td{text-align:left;vertical-align:top;padding:18px 16px;border-bottom:1px solid var(--paper-line)}
.bg-ink table th,.bg-ink table td,.bg-ink2 table th,.bg-ink2 table td{border-color:rgba(237,231,218,.15)}
thead th{font-size:13px;letter-spacing:.15em;font-weight:700;color:var(--gold-deep)}
.bg-ink thead th,.bg-ink2 thead th{color:var(--gold)}
tbody th{font-weight:700;white-space:nowrap;width:24%}
.dl{display:grid;grid-template-columns:minmax(0,1fr);border-top:1px solid var(--text)}
.dl > div{display:grid;grid-template-columns:minmax(120px,220px) minmax(0,1fr);gap:8px 24px;padding:20px 0;border-bottom:1px solid var(--paper-line)}
.dl dt{font-weight:700;color:var(--gold-deep);font-size:14px;letter-spacing:.1em}
.dl dd{margin:0}
@media (max-width:560px){.dl > div{grid-template-columns:minmax(0,1fr)}}

/* よくある質問 */
.faq-group{display:flex;flex-direction:column;gap:20px}
.faq{border-top:1px solid var(--text)}
.faq details{border-bottom:1px solid var(--paper-line)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:44px minmax(0,1fr) 24px;align-items:center;gap:12px;padding:22px 0;font-size:18px;font-weight:700}
.faq summary::-webkit-details-marker{display:none}
.faq summary .q{font-family:var(--serif);font-size:24px;font-weight:800;color:var(--gold-deep)}
.faq summary .pm{font-size:22px;color:var(--gold-deep);transition:transform .2s}
.faq details[open] .pm{transform:rotate(45deg)}
.faq .a{padding:0 0 24px 56px;font-size:15px;color:var(--text-soft);display:flex;flex-direction:column;gap:10px}
.faq-nav{display:flex;flex-wrap:wrap;gap:10px}
.faq-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--paper-line);color:var(--text);text-decoration:none;font-size:14px}
.faq-nav a:hover{border-color:var(--gold-deep);color:var(--gold-deep)}

/* 流れの図 */
.flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:0;align-items:stretch}
.flow-box{position:relative;padding:28px 24px;border:1px solid rgba(201,164,92,.45);background:rgba(18,22,26,.55);display:flex;flex-direction:column;gap:8px;text-align:center;align-items:center}
.flow-box + .flow-box{border-left:0}
.flow-box b{font-family:var(--serif);font-size:22px;color:var(--on-ink-strong)}
html[lang=en] .flow-box b{font-family:var(--latin);font-size:26px;font-weight:600}
.flow-box span{font-size:14px;color:var(--on-ink-soft)}
.flow-box .ic{width:40px;height:40px;color:var(--gold)}
.flow-box.kura{background:rgba(201,164,92,.12);border-color:var(--gold)}
@media (max-width:700px){.flow-box + .flow-box{border-left:1px solid rgba(201,164,92,.45);border-top:0}}

/* カード並び */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:24px}
.card{padding:clamp(24px,3vw,32px);border:1px solid rgba(237,231,218,.15);background:rgba(18,22,26,.5);display:flex;flex-direction:column;gap:12px}
.card h3{color:var(--on-ink-strong);font-size:22px}
.card p{font-size:15px;color:var(--on-ink-soft)}
.bg-paper .card{border-color:var(--paper-line);background:rgba(255,255,255,.4)}
.bg-paper .card h3{color:var(--text)}.bg-paper .card p{color:var(--text-soft)}

/* 締め */
.cta{background:var(--ink);background-image:radial-gradient(ellipse 60% 80% at 50% 120%,rgba(201,164,92,.22),transparent 70%)}

/* フッター */
.site-footer{background:var(--ink3);border-top:1px solid rgba(237,231,218,.08);font-size:13px;color:var(--on-ink-mute)}
.site-footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:32px;padding-block:48px 28px}
.site-footer h4{margin:0 0 12px;font-size:12px;letter-spacing:.2em;color:var(--gold);font-weight:700}
.site-footer ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.site-footer a{color:var(--on-ink-soft);text-decoration:none}.site-footer a:hover{color:var(--gold)}
.copy{border-top:1px solid rgba(237,231,218,.08)}
.copy .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;padding-block:20px;grid-template-columns:none}

/* 動き */
.rise{opacity:0;transform:translateY(18px);animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards}
.d1{animation-delay:.1s}.d2{animation-delay:.3s}.d3{animation-delay:.5s}.d4{animation-delay:.8s}.d5{animation-delay:1.2s}
@keyframes rise{to{opacity:1;transform:none}}
.breathe{animation:breathe 6s ease-in-out infinite alternate}
@keyframes breathe{from{opacity:.55}to{opacity:.9}}
@media (prefers-reduced-motion:reduce){.rise{animation:none;opacity:1;transform:none}.breathe{animation:none}.btn,.chat-body,.dots span{transition:none}html{scroll-behavior:auto}}
.cards.four{grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}
/* 障害・緊急メンテナンスの帯 */
.notice{background:#9E3324;color:#FFF5EE;font-size:15px;position:relative;z-index:10}
.notice .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding-block:12px}
.notice p{flex:1 1 280px;font-weight:700}
.notice a{color:#FFF5EE;font-weight:700;text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}
.notice a:hover{color:#fff}
.notice-dot{width:10px;height:10px;border-radius:50%;background:#FFD7C9;box-shadow:0 0 0 4px rgba(255,215,201,.25);animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.35}}
.notice-text{color:#9E3324!important}
@media (prefers-reduced-motion:reduce){.notice-dot{animation:none}}