:root{
  --swan:#fbfbf8;--mist:#e9edf0;--mist2:#d5dde3;--fog:#7b8b98;--navy:#26324a;--ink:#2d3340;--sub:#6f7783;--line:#dde2e6;--moat:#6f8a6e;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--swan);color:var(--ink);font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;font-size:14px;line-height:2.05;letter-spacing:.07em;padding-bottom:56px}
a{color:inherit}
h1,h2,h3,h4,p{margin:0}
.hina{font-family:"Hina Mincho",serif}
.en{font-family:"Cormorant Garamond",serif;letter-spacing:.26em}
.wrap{max-width:900px;margin:0 auto;padding:0 20px}


.head{position:sticky;top:0;z-index:10;background:rgba(251,251,248,.97);border-bottom:1px solid var(--line)}
.head .wrap{display:flex;align-items:center;justify-content:space-between;height:60px}
.logo{text-decoration:none;line-height:1.25}
.logo small{display:block;font-family:"Cormorant Garamond",serif;font-size:11px;letter-spacing:.3em;color:var(--sub)}
.logo b{font-family:"Hina Mincho",serif;font-weight:400;font-size:18px;letter-spacing:.14em}
.nav{display:none;gap:22px;font-size:12.5px}
.nav a{text-decoration:none}
.head .cta{font-size:12px;text-decoration:none;background:var(--navy);color:#fff;padding:8px 13px;letter-spacing:.1em;white-space:nowrap}
@media(min-width:900px){.nav{display:flex}}

/* FV：霧の面に、白鳥の線 */
.fv{background:var(--mist);text-align:center;padding:64px 20px 60px}
.fv svg{width:120px;display:block;margin:0 auto 20px}
.fv .k{font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.4em;color:var(--fog)}
.fv h1{font-family:"Hina Mincho",serif;font-weight:400;font-size:clamp(27px,7.6vw,42px);line-height:1.75;letter-spacing:.18em;margin-top:12px;color:var(--navy)}
.fv p.sub{margin:18px auto 0;font-size:13.5px;color:var(--sub);max-width:480px}
.fv .btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:440px;margin:30px auto 0}
.btn{display:block;text-decoration:none;text-align:center;padding:13px 8px;font-size:14px;letter-spacing:.1em;line-height:1.5}
.btn small{display:block;font-size:11px;letter-spacing:.02em;opacity:.85}
.btn.navy{background:var(--navy);color:#fff}
.btn.ghost{border:1px solid var(--navy);color:var(--navy);background:var(--swan)}

section{padding:84px 0 0}
.ttl{text-align:center;margin-bottom:34px}
.ttl .en{display:block;font-size:15px;color:var(--fog)}
.ttl h2{font-family:"Hina Mincho",serif;font-weight:400;font-size:clamp(22px,6vw,28px);letter-spacing:.2em;margin-top:2px;color:var(--navy)}
.ttl::after{content:"";display:block;width:1px;height:26px;background:var(--fog);margin:16px auto 0}
.lead{max-width:600px;margin:0 auto;text-align:center;color:var(--sub);font-size:13.5px}

/* はじめての方へ：3つの段取り */
.steps{display:grid;gap:0;max-width:640px;margin:0 auto;counter-reset:s}
.steps div{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.steps i{font-style:normal;font-family:"Cormorant Garamond",serif;font-size:34px;line-height:1;color:var(--fog);text-align:center}
.steps h4{font-family:"Hina Mincho",serif;font-weight:400;font-size:18px;letter-spacing:.1em}
.steps p{font-size:13px;color:var(--sub);margin-top:2px}

/* 受け方の選び方 */
.ways{display:grid;gap:12px}
@media(min-width:760px){.ways{grid-template-columns:1fr 1fr}}
.way{background:#fff;border:1px solid var(--line);padding:22px 22px 18px;position:relative}
.way .q{font-size:12px;color:var(--fog);letter-spacing:.1em}
.way h3{font-family:"Hina Mincho",serif;font-weight:400;font-size:20px;letter-spacing:.1em;margin-top:4px;color:var(--navy)}
.way .price{font-family:"Cormorant Garamond",serif;font-size:28px;line-height:1.2;margin-top:10px;color:var(--navy)}
.way .price small{font-family:"Noto Sans JP",sans-serif;font-size:12px;color:var(--sub);margin-left:6px;letter-spacing:.04em}
.way ul{margin:10px 0 0;padding-left:1.2em;font-size:13px;color:var(--sub)}
.way.kan{background:var(--mist)}
.tbd{color:#a0702e}
.time{max-width:640px;margin:22px auto 0;font-size:13px;color:var(--sub);text-align:center}

/* 相談の本棚 */
.shelves{display:grid;gap:26px}
.shelf h3{font-family:"Hina Mincho",serif;font-weight:400;font-size:19px;letter-spacing:.14em;color:var(--navy);border-bottom:1px solid var(--navy);padding-bottom:6px}
.shelf h3 small{font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.24em;color:var(--fog);margin-left:10px}
.books{list-style:none;margin:0;padding:0}
.books li{border-bottom:1px dotted var(--line)}
.books a{display:grid;grid-template-columns:1fr auto;gap:12px;padding:12px 2px;text-decoration:none;align-items:center}
.books b{font-weight:500;font-size:14px}
.books span{display:block;font-size:12px;color:var(--sub)}
.books em{font-style:normal;font-size:11px;color:var(--moat);border:1px solid var(--moat);padding:0 8px;white-space:nowrap}
.more{text-align:center;margin-top:20px;font-size:13px}
.more a{color:var(--navy)}
.ig-row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 0 10px;margin-top:30px}
.ig-cell{flex:0 0 min(290px,82%);scroll-snap-align:start}
.instagram-media{border-radius:0!important;box-shadow:none!important;border:1px solid #e3e6e9!important}
.scroll-note{text-align:center;font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.3em;color:var(--sub)}

/* 高福うららのこと */
.about{background:var(--mist);padding:80px 0;margin-top:84px}
.pair{display:grid;gap:28px;align-items:center}
@media(min-width:820px){.pair{grid-template-columns:1fr 320px;gap:48px}}
.pair h3{font-family:"Hina Mincho",serif;font-weight:400;font-size:24px;letter-spacing:.16em;color:var(--navy)}
.pair h3 small{display:block;font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.3em;color:var(--fog)}
.pair p{margin-top:12px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px;padding:0;list-style:none}
.tags li{font-size:12px;border:1px solid var(--navy);color:var(--navy);padding:0 10px;background:var(--swan)}
.ig-one{max-width:320px;width:100%;margin:0 auto}

/* 声 */
.voices{display:grid;gap:12px}
@media(min-width:760px){.voices{grid-template-columns:repeat(3,1fr)}}
.voices div{background:#fff;border:1px solid var(--line);padding:20px 18px}
.voices p{font-family:"Hina Mincho",serif;font-size:15px;letter-spacing:.08em}
.voices span{display:block;font-size:11.5px;color:var(--sub);margin-top:10px}
.voices .empty{background:transparent;border-style:dashed;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--sub);font-size:12.5px}

.faq{max-width:700px;margin:0 auto}
.faq details{border-bottom:1px solid var(--line);padding:15px 0}
.faq summary{cursor:pointer;font-weight:500;list-style:none;padding-right:24px;position:relative}
.faq summary::after{content:"+";position:absolute;right:0;top:0;color:var(--fog)}
.faq details[open] summary::after{content:"−"}
.faq p{font-size:13px;color:var(--sub);margin-top:8px}

/* 申込み */
.apply{max-width:560px;margin:0 auto}
.apply .dm{display:block;text-decoration:none;text-align:center;background:var(--navy);color:#fff;padding:16px;letter-spacing:.1em}
.apply .dm small{display:block;font-size:11.5px;opacity:.85}
.form{margin-top:18px;background:#fff;border:1px solid var(--line);padding:22px 20px}
.form p.h{font-size:12.5px;color:var(--sub);text-align:center;margin-bottom:12px}
.form label{display:block;margin-bottom:12px;font-size:13px}
.form input,.form select,.form textarea{display:block;width:100%;margin-top:4px;padding:10px 12px;border:1px solid var(--line);background:var(--swan);font:inherit;font-size:14px;color:var(--ink)}
.form button{width:100%;padding:13px;border:0;background:var(--fog);color:#fff;font:inherit;letter-spacing:.1em;cursor:not-allowed}

footer{border-top:1px solid var(--line);text-align:center;font-size:12px;color:var(--sub);padding:28px 20px 40px;line-height:1.9;margin-top:84px}
footer b{display:block;font-family:"Hina Mincho",serif;font-weight:400;font-size:18px;color:var(--navy);letter-spacing:.16em}

.bar{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1fr;z-index:20}
.bar a{text-align:center;text-decoration:none;padding:15px 0;font-size:13.5px;letter-spacing:.1em}
.bar a:first-child{background:var(--navy);color:#fff}
.bar a:last-child{background:var(--mist2);color:var(--navy)}
@media(min-width:900px){.bar{display:none}body{padding-bottom:0}}

/* 下書きの帯（公開前に外す） */
.draft-band{background:#a0702e;color:#fff;font-size:11.5px;letter-spacing:.04em;text-align:center;padding:8px 14px;line-height:1.7}
.crumb{font-size:12px;color:var(--sub);padding-top:28px}
.crumb a{color:var(--navy)}

/* 2026-11-04 面談を受けて足したもの */
.subs{list-style:none;margin:14px 0 4px;padding:0;border-top:1px solid var(--line)}
.subs li{padding:11px 0;border-bottom:1px dotted var(--line);font-size:13px}
.subs b{display:block;font-weight:500;font-size:14.5px;color:var(--navy)}
.subs span{display:block;color:var(--sub)}
.know{display:grid;gap:12px;max-width:760px;margin:30px auto 0}
@media(min-width:760px){.know{grid-template-columns:1fr 1fr}}
.know div{background:#fff;border:1px solid var(--line);padding:20px 18px}
.know h4{font-family:"Hina Mincho",serif;font-weight:400;font-size:18px;letter-spacing:.12em;color:var(--navy)}
.know p,.know li{font-size:13px;color:var(--sub)}
.know ul{margin:8px 0 0;padding-left:1.2em}
.note{max-width:640px;margin:20px auto 0;font-size:13px;color:var(--sub);text-align:center}
.line-box{max-width:640px;margin:0 auto;background:var(--mist);padding:26px 22px}
.line-box ul{margin:10px 0 0;padding-left:1.2em;font-size:13.5px}
.line-box li{margin-bottom:6px}
.genres{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;list-style:none;padding:0;margin:14px 0 0}
.genres li{border:1px solid var(--navy);color:var(--navy);background:#fff;padding:2px 14px;font-size:13px}
.dm.line{background:#2f6f4f}
.page-head{background:var(--mist);text-align:center;padding:48px 20px 44px}
.page-head .k{font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.4em;color:var(--fog)}
.page-head h1{font-family:"Hina Mincho",serif;font-weight:400;font-size:clamp(24px,6.4vw,34px);letter-spacing:.16em;color:var(--navy);margin-top:8px}
.page-head p{margin:12px auto 0;font-size:13.5px;color:var(--sub);max-width:520px}
.sample{max-width:700px;margin:0 auto;background:#fff;border:1px solid var(--line);padding:24px 20px;font-size:13.5px}
.sample .who{font-size:12px;color:var(--fog);letter-spacing:.08em}
.caution{max-width:700px;margin:0 auto}
.caution li{font-size:13.5px;margin-bottom:8px}

.sample-body p{margin-top:12px;line-height:2}
.more-read{margin-top:8px}
.more-read summary{cursor:pointer;list-style:none;text-align:center;color:var(--navy);border:1px solid var(--navy);padding:10px;margin-top:14px;font-size:13.5px;letter-spacing:.1em}
.more-read summary::-webkit-details-marker{display:none}
.more-read[open] summary{display:none}

/* 2026-11-04 サービスのページ */
.kari{font-size:.5em;letter-spacing:.06em;color:var(--fog);margin-left:6px;vertical-align:middle;font-family:"Noto Sans JP",sans-serif}
.whofor{list-style:none;max-width:640px;margin:0 auto;padding:0}
.whofor li{border-bottom:1px solid var(--line);padding:12px 4px 12px 26px;position:relative;font-size:14px}
.whofor li::before{content:"";position:absolute;left:4px;top:22px;width:10px;height:1px;background:var(--navy)}
.svc{display:grid;gap:14px}
@media(min-width:900px){.svc{grid-template-columns:repeat(3,1fr)}}
.svc-card{display:flex;flex-direction:column;text-decoration:none;background:#fff;border:1px solid var(--line);padding:24px 20px 20px}
.svc-card:hover{border-color:var(--navy)}
.svc-card .en{font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.3em;color:var(--fog)}
.svc-card h3{font-family:"Hina Mincho",serif;font-weight:400;font-size:21px;letter-spacing:.12em;color:var(--navy);margin-top:4px}
.svc-card dl{margin:14px 0 0;display:grid;grid-template-columns:5em 1fr;gap:8px 10px;font-size:13px}
.svc-card dt{color:var(--fog)}
.svc-card dd{margin:0}
.svc-card dd.price{font-family:"Cormorant Garamond",serif;font-size:20px;color:var(--navy);line-height:1.4}
.svc-card dd.price small{font-family:"Noto Sans JP",sans-serif;font-size:11.5px;color:var(--sub)}
.svc-card .go{margin-top:auto;padding-top:16px;text-align:right;font-size:13px;color:var(--navy)}
.plan2{display:grid;gap:0;max-width:760px;margin:20px auto 0;border-top:1px solid var(--line)}
.plan2 div{display:grid;grid-template-columns:6.5em 1fr;gap:12px;padding:12px 4px;border-bottom:1px solid var(--line);font-size:13.5px}
.plan2 b{font-weight:500;color:var(--navy)}
.others{list-style:none;padding:0;margin:0 auto;max-width:640px;display:grid;gap:8px}
.others a{display:flex;justify-content:space-between;gap:10px;text-decoration:none;border:1px solid var(--line);background:#fff;padding:12px 16px;font-size:13.5px}
.others b{font-weight:500;color:var(--navy)}
.others span{color:var(--sub);font-size:12.5px}

/* 2026-11-05 柱2つ＋別枠 */
@media(min-width:760px){.svc.two-col{grid-template-columns:1fr 1fr}}
.svc-card .sub2{font-size:12.5px;color:var(--sub);margin-top:2px;letter-spacing:.08em}
.h1sub{display:block;font-family:"Noto Sans JP",sans-serif;font-size:13px;letter-spacing:.2em;color:var(--fog);margin-top:6px}
.plus{max-width:760px;margin:34px auto 0}
.plus-h{font-size:12.5px;color:var(--fog);letter-spacing:.14em;text-align:center;margin-bottom:10px}
.plus-card{display:flex;justify-content:space-between;align-items:center;gap:12px;text-decoration:none;background:var(--mist);padding:14px 18px}
.plus-card b{display:block;font-weight:500;color:var(--navy);font-size:14.5px}
.plus-card span{display:block;font-size:12.5px;color:var(--sub)}
.plus-card i{font-style:normal;font-size:13px;color:var(--navy);white-space:nowrap}

/* スマホのメニュー（900px未満・assets/menu.js が作る） */
.head .cta{margin-left:auto}
.menu-btn{display:flex;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:0 9px;margin-left:8px;background:none;border:1px solid var(--line);cursor:pointer}
.menu-btn span{display:block;height:1.5px;background:var(--navy);transition:transform .25s,opacity .25s}
.menu-btn:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.sp-nav{position:fixed;top:61px;left:0;right:0;bottom:0;z-index:30;background:rgba(38,50,74,.98);padding:8px max(24px,env(safe-area-inset-left,0px)) 80px;overflow-y:auto}
.sp-nav a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:17px 4px;border-bottom:1px solid rgba(251,251,248,.15);color:var(--swan);text-decoration:none;font-family:"Hina Mincho",serif;font-size:17px;letter-spacing:.14em}
.sp-nav a small{font-family:"Cormorant Garamond",serif;font-size:12px;letter-spacing:.3em;color:#aebccb;white-space:nowrap}
.sp-nav .sp-line{margin-top:26px;justify-content:center;background:#2f6f4f;border:0;font-family:"Noto Sans JP",sans-serif;font-size:15px;letter-spacing:.1em}
@media(min-width:1100px){.menu-btn,.sp-nav{display:none!important}.head .cta{margin-left:0}}
/* 横並びのメニューは7項目あるので、1100px以上だけ出す */
@media(max-width:1099px){.nav{display:none!important}}
.nav a{white-space:nowrap}
@media(prefers-reduced-motion:reduce){.menu-btn span{transition:none}}
main [id],section[id]{scroll-margin-top:64px}
/* ヘッダーだけ横幅を広げる（7項目のメニューとロゴが1行に収まるように） */
.head .wrap{max-width:1160px}
.logo b,.logo small{white-space:nowrap}
.nav{gap:18px}

/* 公開用（deploy.mjs が足す）：下書きの注記を見せない */
.draft-band,.tbd,.kari,.voices .empty,.faq details:has(> p.tbd),.note.tbd{display:none!important}