:root{
  --bg:#fbf6ee; --paper:#fffdf9; --ink:#3b2a1e; --ink2:#6b5847; --mute:#9a8775;
  --gold:#b8935a; --gold2:#d9bf8c; --rose:#e8b9b0; --rose2:#f6e3de; --leaf:#8fa77a;
  --line:#eadfcf; --shadow:0 10px 30px rgba(92,64,38,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:"Zen Kaku Gothic New",system-ui,sans-serif;line-height:1.85;font-size:16px;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
.min{font-family:"Shippori Mincho",serif}
.wrap{max-width:1040px;margin:0 auto;padding:0 18px}

/* header */
header.top{position:sticky;top:0;z-index:50;background:rgba(251,246,238,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:58px}
.logo{font-family:"Shippori Mincho",serif;font-weight:700;font-size:19px;text-decoration:none;letter-spacing:.04em;display:flex;align-items:center;gap:8px}
.logo small{display:block;font-size:10px;color:var(--gold);letter-spacing:.2em;font-weight:500;line-height:1}
.logo .mark{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,var(--rose2) 60%,var(--rose));display:grid;place-items:center;font-size:15px;color:var(--gold);border:1px solid var(--gold2)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;cursor:pointer;font:inherit;font-weight:700;text-decoration:none;border-radius:999px;transition:transform .15s,box-shadow .15s}
.btn:active{transform:scale(.97)}
.btn-gold{background:linear-gradient(135deg,#c9a46a,#a87f45);color:#fff;padding:14px 26px;box-shadow:0 8px 20px rgba(168,127,69,.28)}
.btn-line{background:#06c755;color:#fff;padding:14px 26px;box-shadow:0 8px 20px rgba(6,199,85,.22)}
.btn-ghost{background:#fff;color:var(--ink);border:1px solid var(--gold2);padding:13px 24px}
.btn-sm{padding:8px 16px;font-size:13px}

/* hero */
.hero{position:relative}
.hero img{width:100%;height:auto;aspect-ratio:1672/941;object-fit:cover}
.hero-under{background:var(--paper);border-bottom:1px solid var(--line);padding:26px 0 30px;text-align:center}
.hero-under p.lead{font-family:"Shippori Mincho",serif;font-size:clamp(20px,5.2vw,30px);font-weight:700;line-height:1.6}
.hero-under p.lead em{font-style:normal;color:var(--gold)}
.hero-under p.sub{color:var(--ink2);margin:10px 0 20px;font-size:15px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

/* sections */
section{padding:64px 0}
.eyebrow{display:flex;align-items:center;gap:10px;color:var(--gold);font-size:13px;letter-spacing:.25em;font-weight:500;margin-bottom:10px}
.eyebrow:before{content:"";width:34px;height:1px;background:var(--gold)}
h2{font-family:"Shippori Mincho",serif;font-size:clamp(24px,6vw,36px);line-height:1.5;font-weight:700;margin-bottom:18px}
.center{text-align:center}
.center .eyebrow{justify-content:center}
.center .eyebrow:after{content:"";width:34px;height:1px;background:var(--gold)}
p.note{color:var(--ink2)}

.feature-img{border-radius:18px;overflow:hidden;box-shadow:var(--shadow);margin:6px 0 26px}
.grid3{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:760px){.grid3{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:22px 20px;box-shadow:var(--shadow)}
.card h3{font-family:"Shippori Mincho",serif;font-size:19px;margin-bottom:6px;display:flex;gap:10px;align-items:center}
.card .num{width:30px;height:30px;border-radius:50%;background:var(--rose2);color:var(--gold);display:grid;place-items:center;font-size:14px;font-weight:700;flex:none}
.card p{color:var(--ink2);font-size:15px}

/* AI diagnosis */
#ai{background:linear-gradient(180deg,var(--bg),#f7eee2)}
.ai-box{background:var(--paper);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);overflow:hidden;max-width:680px;margin:0 auto}
.ai-head{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line);background:#fffaf2}
.ai-avatar{width:42px;height:42px;border-radius:50%;flex:none;background:radial-gradient(circle at 35% 30%,#fff,var(--rose2) 55%,var(--gold2));display:grid;place-items:center;font-size:20px;border:1px solid var(--gold2)}
.ai-head b{display:block;font-family:"Shippori Mincho",serif}
.ai-head span{font-size:12px;color:var(--mute)}
.progress{height:4px;background:var(--line)}
.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--rose),var(--gold));transition:width .35s}
.chat{padding:18px;min-height:340px;max-height:460px;overflow-y:auto;display:flex;flex-direction:column;gap:12px}
.bubble{max-width:88%;padding:12px 15px;border-radius:16px;font-size:15px;line-height:1.75;animation:pop .3s ease}
.bubble.ai{background:#f8efe3;border-top-left-radius:4px;align-self:flex-start}
.bubble.me{background:var(--ink);color:#fff;border-top-right-radius:4px;align-self:flex-end}
.typing{align-self:flex-start;background:#f8efe3;border-radius:16px;padding:12px 16px;display:flex;gap:5px}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--gold);animation:blink 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes pop{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.choices{display:grid;gap:9px;padding:0 18px 20px}
.choice{background:#fff;border:1px solid var(--gold2);border-radius:14px;padding:13px 15px;text-align:left;font:inherit;font-size:15px;color:var(--ink);cursor:pointer;transition:background .15s}
.choice:hover,.choice:focus-visible{background:var(--rose2);outline:none}
.ai-start{padding:0 18px 22px;display:flex;justify-content:center}

/* result */
.result{padding:4px 18px 24px;animation:pop .4s ease}
.r-type{text-align:center;padding:22px 16px;border-radius:18px;background:linear-gradient(160deg,#fff7ec,var(--rose2));border:1px solid var(--gold2);margin-bottom:16px}
.r-type small{color:var(--gold);letter-spacing:.2em;font-size:12px}
.r-type h3{font-family:"Shippori Mincho",serif;font-size:24px;margin:4px 0 6px}
.r-type p{color:var(--ink2);font-size:14px}
.r-sec{margin:18px 0}
.r-sec h4{font-family:"Shippori Mincho",serif;font-size:17px;margin-bottom:8px;display:flex;align-items:center;gap:8px}
.r-sec h4:before{content:"";width:6px;height:18px;border-radius:3px;background:var(--gold)}
.axis{display:grid;gap:10px}
.axis div{font-size:13px;color:var(--ink2)}
.axis .bar{display:flex;justify-content:space-between;font-size:12px;color:var(--mute);margin-bottom:3px}
.axis .track{height:8px;border-radius:5px;background:var(--line);position:relative}
.axis .dot{position:absolute;top:50%;width:16px;height:16px;border-radius:50%;background:var(--gold);border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.2);transform:translate(-50%,-50%)}
.partners{display:grid;gap:10px}
.partner{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px}
.partner .pic{width:46px;height:46px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:22px;background:var(--rose2)}
.partner b{display:block;font-family:"Shippori Mincho",serif}
.partner .match{font-size:12px;color:var(--gold);font-weight:700}
.partner p{font-size:13.5px;color:var(--ink2);line-height:1.7}
ul.tips{list-style:none;display:grid;gap:8px}
ul.tips li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 13px;font-size:14.5px;color:var(--ink2)}
ul.tips li b{color:var(--ink)}
.disclaimer{font-size:12px;color:var(--mute);margin-top:14px}

/* steps */
.steps{display:grid;gap:14px;counter-reset:s}
@media(min-width:760px){.steps{grid-template-columns:repeat(4,1fr)}}
.step{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:18px;position:relative}
.step:before{counter-increment:s;content:"STEP " counter(s);font-size:11px;letter-spacing:.2em;color:var(--gold);font-weight:700}
.step h3{font-family:"Shippori Mincho",serif;font-size:17px;margin:4px 0}
.step p{font-size:14px;color:var(--ink2)}

/* contract */
.contract{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:22px 20px}
.contract dl{display:grid;gap:12px}
.contract dt{font-weight:700;font-size:15px}
.contract dd{color:var(--ink2);font-size:14.5px;padding-left:2px}

/* faq */
details{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:4px 16px;margin-bottom:10px}
summary{cursor:pointer;padding:12px 0;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:10px}
summary::-webkit-details-marker{display:none}
summary:after{content:"＋";color:var(--gold)}
details[open] summary:after{content:"－"}
details p{color:var(--ink2);font-size:14.5px;padding-bottom:14px}

/* form */
#contact{background:linear-gradient(180deg,#f7eee2,var(--bg))}
form.f{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:22px 18px;max-width:640px;margin:0 auto;box-shadow:var(--shadow);display:grid;gap:14px}
.f label{display:grid;gap:5px;font-size:14px;font-weight:700}
.f label span.req{color:#c0675a;font-size:11px;margin-left:6px}
.f input,.f select,.f textarea{font:inherit;font-size:16px;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);width:100%}
.f textarea{min-height:110px;resize:vertical}
.f .row2{display:grid;gap:14px;grid-template-columns:1fr 1fr}
.f .attach{font-size:13px;color:var(--ink2);background:#fff7ec;border:1px dashed var(--gold2);border-radius:12px;padding:10px 12px;display:none}
.f .hp{position:absolute;left:-9999px}
.msg{font-size:14px;text-align:center;min-height:1.5em}
.msg.ok{color:#2f7a4d}.msg.ng{color:#c0675a}

footer{background:#3b2a1e;color:#e9dccb;padding:36px 0 110px;font-size:13px}
footer .min{font-size:18px;color:#fff;margin-bottom:6px}
footer a{color:#e9dccb}
.floating{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,253,249,.95);border-top:1px solid var(--line);display:flex;gap:10px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.floating .btn{flex:1;padding:13px 10px;font-size:14px}
@media(min-width:760px){.floating{display:none}footer{padding-bottom:40px}}
.fade{opacity:0;transform:translateY(16px);transition:opacity .7s,transform .7s}
.fade.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.fade{opacity:1;transform:none;transition:none}.bubble,.result{animation:none}}
