/* =========================================================
   FRIEND theme — 統合スタイル（全ページ共通）
   ========================================================= */
:root{
  --ink:#191713;--ink-2:#211e18;--ivory:#f5f1ea;--paper:#faf7f1;
  --gold:#b0925f;--gold-hi:#c8ac7c;--text:#2c2823;--muted:#8b8377;
  --hair:rgba(176,146,95,.4);--hair-d:rgba(200,172,124,.28);
  --lat:"Cormorant Garamond",Georgia,serif;--serif:"Noto Serif JP",serif;--sans:"Noto Sans JP",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);font-weight:400;color:var(--text);background:var(--paper);line-height:2.05;font-size:15.5px;-webkit-font-smoothing:antialiased;letter-spacing:.01em}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1040px;margin:0 auto;padding:0 28px}
.narrow{max-width:760px}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.62;letter-spacing:.04em;word-break:auto-phrase}
.eyebrow{font-family:var(--lat);font-weight:500;font-size:.95rem;letter-spacing:.42em;text-transform:uppercase;color:var(--gold);margin:0 0 20px}
.eyebrow.d{color:var(--gold-hi)}

/* buttons */
.btn{display:inline-block;font-family:var(--sans);font-weight:500;font-size:.86rem;letter-spacing:.12em;padding:15px 34px;border-radius:1px;border:1px solid transparent;transition:.28s;cursor:pointer}
.btn-gold{background:var(--gold);color:#1b1408;border-color:var(--gold)}
.btn-gold:hover{background:var(--gold-hi);border-color:var(--gold-hi)}
.btn-line{background:transparent;border-color:rgba(255,255,255,.55);color:#fff}
.btn-line:hover{border-color:var(--gold-hi);color:var(--gold-hi)}
.btn-ink{background:transparent;border-color:var(--gold);color:var(--text)}
.btn-ink:hover{background:var(--gold);color:#1b1408}
.btn-lg{padding:18px 48px;font-size:.92rem}

/* util + header */
.util{background:var(--ink);color:#b7afa2;font-size:.7rem;letter-spacing:.14em}
.util .wrap{display:flex;justify-content:flex-end;gap:26px;padding:9px 28px}
.util a:hover{color:var(--gold-hi)}
.hd{position:sticky;top:0;z-index:50;background:rgba(25,23,19,.9);backdrop-filter:blur(10px);border-bottom:1px solid rgba(200,172,124,.16)}
.hd .wrap{display:flex;align-items:center;justify-content:space-between;padding:18px 28px}
.brand{display:flex;align-items:center}
.nav{display:flex;align-items:center;gap:30px}
.nav a{color:#e8e3d9;font-size:.82rem;letter-spacing:.08em}
.nav a:not(.btn){position:relative;padding:3px 0}
.nav a.current{color:var(--gold-hi)}
.nav a:not(.btn):hover{color:var(--gold-hi)}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-3px;height:1px;width:0;background:var(--gold);transition:width .3s}
.nav a:not(.btn):hover::after,.nav a.current::after{width:100%}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:6px;cursor:pointer;z-index:60}
.burger span{width:24px;height:1.5px;background:#fff}

/* hero (front) */
.hero{position:relative;background:var(--ink);color:#fff;overflow:hidden}
.hero .hvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero .hovl{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(25,23,19,.32),rgba(25,23,19,.8) 88%),radial-gradient(150% 100% at 72% 25%,rgba(0,0,0,0) 40%,rgba(25,23,19,.35))}
.hero .frame{position:absolute;inset:24px;border:1px solid var(--hair-d);pointer-events:none;z-index:2}
.hero .inner{position:relative;z-index:2;text-align:center;max-width:1040px;margin:0 auto;padding:140px 28px 118px}
.hero h1{font-size:clamp(2rem,4.6vw,3.5rem);line-height:1.7;margin:0 0 30px;font-weight:500;text-shadow:0 2px 30px rgba(0,0,0,.55)}
.hero .sub{font-family:var(--sans);font-weight:300;font-size:clamp(.98rem,1.6vw,1.14rem);color:#e6e0d5;max-width:600px;margin:0 auto 40px;text-shadow:0 1px 14px rgba(0,0,0,.4)}
.hero .cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

/* trust */
.trust{background:var(--ink-2);border-top:1px solid var(--hair-d)}
.trust .wrap{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;padding:0}
.trust .i{color:#d8d1c4;font-size:.76rem;letter-spacing:.14em;padding:20px 30px;border-right:1px solid rgba(255,255,255,.07)}
.trust .i:last-child{border-right:0}
.trust .i b{font-family:var(--lat);font-weight:500;color:var(--gold-hi);font-size:1.05rem;letter-spacing:.06em;margin-right:8px}

/* page hero (inner pages, dark) */
.phero{position:relative;background:linear-gradient(125deg,#14120e,#221d15 55%,#2b2419);color:#fff;overflow:hidden}
.phero.light{background:radial-gradient(120% 120% at 50% 0%,#fbf7ef,#f1ece1);color:var(--text);border-bottom:1px solid var(--hair)}
.phero .frame{position:absolute;inset:20px;border:1px solid var(--hair-d);pointer-events:none}
.phero.light .frame{border-color:var(--hair)}
.phero .inner{position:relative;text-align:center;padding:92px 28px 78px}
.phero h1{font-size:clamp(1.8rem,4vw,3rem);margin:0}
.phero .sub{font-weight:300;color:#d8d1c4;margin-top:16px;font-size:1.02rem;line-height:2.1}
.phero.light .sub{color:#4a453c}
.phero.light .sub b{font-weight:500;color:var(--text)}

/* sections */
.sec{padding:100px 0}
.sec-ivory{background:var(--ivory)}
.sec-dark{background:var(--ink);color:#ece7dc}
.shead{text-align:center;margin-bottom:52px}
.shead h2{font-size:clamp(1.4rem,2.7vw,2rem);margin:0}
.shead .r{width:38px;height:1px;background:var(--gold);margin:20px auto 0}
.lead{max-width:680px;margin:0 auto;text-align:center;font-weight:300;font-size:1.02rem;line-height:2.2;color:#4a453c}
.sec-dark .lead{color:#c8c1b4}
.block{max-width:720px;margin:0 auto;text-align:center;font-weight:300;font-size:1.02rem;line-height:2.15;color:#463f38}
.sec-dark .block{color:#cdc6b9}
.block b{font-weight:500;color:var(--text)}

/* split (photo + text) */
.split{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;border:1px solid var(--hair)}
.split .ph{min-height:470px;background-size:cover;background-position:center}
.split .tx{padding:66px 56px;display:flex;flex-direction:column;justify-content:center}
.split.rev .ph{order:2}
.split .tx h2{font-size:clamp(1.4rem,2.4vw,1.9rem);margin:0 0 4px}
.split .tx .r{width:34px;height:1px;background:var(--gold);margin:18px 0 26px}
.split .lead2{font-weight:300;color:#4a453c;line-height:2.15;margin:0}
.aud2 .row{display:flex;gap:16px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--hair)}
.aud2 .row:last-child{border-bottom:0}
.aud2 .row .n{font-family:var(--lat);color:var(--gold);font-size:1rem;min-width:22px}
.aud2 .row p{margin:0;font-size:.95rem;line-height:1.65}
.pts{list-style:none;margin:20px 0 0;padding:0}
.pts li{padding:12px 0;border-bottom:1px solid var(--hair);font-weight:300;font-size:.96rem}
.pts li:last-child{border-bottom:0}

/* flow (front / dating-club) */
.flow{display:grid;grid-template-columns:repeat(4,1fr)}
.flow .s{padding:8px 24px;border-left:1px solid var(--hair)}
.flow .s:first-child{border-left:0}
.flow .n{font-family:var(--lat);font-weight:500;font-size:2.6rem;color:var(--gold);line-height:1;margin-bottom:16px}
.flow h3{font-size:1.02rem;font-weight:500;margin:0 0 10px}
.flow p{margin:0;font-weight:300;font-size:.86rem;line-height:1.75;color:#57524a}

/* kodawari (dark) */
.kods{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;max-width:900px;margin:0 auto}
.kod{text-align:center}
.kod .m{font-family:var(--lat);font-weight:500;font-size:.85rem;letter-spacing:.3em;color:var(--gold-hi);text-transform:uppercase;margin-bottom:14px}
.kod h3{color:#fff;font-size:1.15rem;font-weight:500;margin:0 0 12px}
.kod p{margin:0;font-weight:300;font-size:.9rem;color:#c8c1b4;line-height:1.85}

/* dual CTA */
.dual{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--hair)}
.panel{padding:60px 44px;text-align:center}
.panel.m{background:var(--ink);color:#fff;border-right:1px solid var(--hair-d)}
.panel.f{background:var(--ivory)}
.panel .lbl{font-family:var(--lat);font-weight:500;letter-spacing:.34em;text-transform:uppercase;font-size:.8rem;margin-bottom:16px}
.panel.m .lbl{color:var(--gold-hi)}
.panel.f .lbl{color:var(--gold)}
.panel h3{font-size:1.35rem;font-weight:500;margin:0 0 14px}
.panel.m h3{color:#fff}
.panel p{font-weight:300;font-size:.9rem;margin:0 0 26px}
.panel.m p{color:#c8c1b4}
.panel.f p{color:#57524a}

/* timeline (dating-club) */
.tl{max-width:760px;margin:0 auto}
.tl .it{display:flex;gap:26px;align-items:baseline;padding:22px 4px;border-bottom:1px solid var(--hair)}
.tl .it:last-child{border-bottom:0}
.tl .it .num{font-family:var(--lat);font-weight:500;color:var(--gold);font-size:1.5rem;min-width:40px}
.tl h3{margin:0 0 3px;font-size:1.06rem;font-weight:500}
.tl p{margin:0;font-weight:300;font-size:.9rem;color:#57524a;line-height:1.7}

/* system: 特徴 / step / price summary / functions / charm / contact */
.feats{max-width:820px;margin:0 auto}
.feats .f{display:flex;gap:22px;align-items:baseline;padding:22px 4px;border-bottom:1px solid var(--hair)}
.feats .f:last-child{border-bottom:0}
.feats .f .n{font-family:var(--lat);font-weight:500;color:var(--gold);font-size:1.15rem;min-width:26px}
.feats .f h3{margin:0 0 3px;font-size:1.05rem;font-weight:500}
.feats .f p{margin:0;font-weight:300;font-size:.92rem;color:#57524a;line-height:1.7}
.steps{max-width:760px;margin:0 auto}
.step{padding:30px 0;border-bottom:1px solid var(--hair)}
.step:last-child{border-bottom:0}
.step .top{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.step .num{font-family:var(--lat);font-weight:600;color:var(--gold);font-size:1.5rem;line-height:1}
.step h3{margin:0;font-size:1.15rem;font-weight:500}
.step .fee{margin-left:auto;font-family:var(--sans);font-weight:500;font-size:.78rem;letter-spacing:.06em;color:#1b1408;background:var(--gold);padding:5px 14px;border-radius:999px}
.step ul{margin:0;padding-left:1.2em;font-weight:300;font-size:.94rem;color:#463f38}
.step ul li{margin:7px 0}
.note{margin-top:16px;border-left:2px solid var(--gold);background:rgba(176,146,95,.07);padding:14px 18px;font-size:.86rem;font-weight:300;color:#463f38;line-height:1.8}
.note b{font-weight:500;color:var(--text)}
.loginlinks{margin-top:14px;font-size:.86rem}
.loginlinks a{color:var(--gold);border-bottom:1px solid var(--hair);padding-bottom:1px;margin-right:18px}
.price{max-width:640px;margin:0 auto;border:1px solid var(--hair)}
.price .prow{display:flex;justify-content:space-between;align-items:baseline;padding:20px 26px;border-bottom:1px solid var(--hair)}
.price .prow:last-child{border-bottom:0}
.price .item{padding:34px;border-bottom:1px solid var(--hair);text-align:center}
.price .item:last-child{border-bottom:0}
.price .l{font-size:.98rem}
.price .v{font-family:var(--lat);font-weight:600;font-size:1.5rem;color:var(--text)}
.price .v small{font-family:var(--sans);font-weight:400;font-size:.72rem;color:var(--muted);margin-left:4px}
.price .lbl{font-family:var(--lat);letter-spacing:.24em;text-transform:uppercase;font-size:.72rem;color:var(--gold);margin-bottom:6px}
.price .name{font-family:var(--serif);font-weight:500;font-size:1.05rem;margin-bottom:10px}
.price .amt{font-family:var(--lat);font-weight:600;font-size:2.6rem;line-height:1;color:var(--text)}
.price .amt small{font-family:var(--sans);font-weight:400;font-size:.8rem;color:var(--muted);margin-left:6px}
.price .tax{display:inline-block;font-size:.7rem;letter-spacing:.08em;color:var(--muted);border:1px solid var(--hair);border-radius:999px;padding:2px 10px;margin-left:8px;vertical-align:middle}
.price .pnote{margin-top:10px;font-size:.78rem;font-weight:300;color:var(--muted)}
.price-cap{text-align:center;font-size:.82rem;font-weight:300;color:var(--muted);margin-top:20px}
.fn{display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:880px;margin:0 auto}
.fn h3{text-align:center;font-size:1.1rem;font-weight:500;margin:0 0 20px}
.fn .lbl{font-family:var(--lat);letter-spacing:.28em;text-transform:uppercase;font-size:.72rem;color:var(--gold);text-align:center;display:block;margin-bottom:6px}
.fn ul{list-style:none;margin:0;padding:0}
.fn li{padding:12px 0;border-bottom:1px solid var(--hair);font-size:.92rem;font-weight:300}
.fn li:last-child{border-bottom:0}
.charm{display:grid;grid-template-columns:1fr 1fr;gap:6px 44px;max-width:800px;margin:0 auto}
.charm .c{display:flex;gap:16px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--hair-d)}
.charm .c .n{font-family:var(--lat);color:var(--gold-hi);font-size:1.05rem;min-width:24px}
.charm .c p{margin:0;font-weight:300;color:#d3ccbf;font-size:.95rem}
.sec-ivory .charm .c{border-bottom-color:var(--hair)}
.sec-ivory .charm .c p{color:#4a453c}
.contact{text-align:center;font-weight:300}
.contact .row{font-size:1.02rem;margin:8px 0}
.contact .row b{font-family:var(--lat);letter-spacing:.16em;color:var(--gold);margin-right:12px;font-weight:600}
.related{max-width:560px;margin:0 auto;text-align:center}
.related a{display:inline-block;margin:6px 14px;color:var(--gold);border-bottom:1px solid var(--hair);padding-bottom:2px;font-size:.92rem}

/* recruit page */
.reassure{max-width:860px;margin:0 auto;display:grid;gap:20px}
.rc{border:1px solid var(--hair);background:var(--paper);border-radius:6px;padding:34px;text-align:center}
.rc .lbl{font-family:var(--lat);letter-spacing:.24em;text-transform:uppercase;font-size:.72rem;color:var(--gold);margin-bottom:8px}
.rc h3{font-size:1.15rem;font-weight:500;margin:0 0 14px}
.rc p{margin:0;font-weight:300;font-size:.96rem;color:#4a453c;line-height:2}
.free{max-width:620px;margin:0 auto;text-align:center}
.free ul{list-style:none;margin:0 0 28px;padding:0}
.free li{padding:14px 0;border-bottom:1px solid var(--hair);font-size:1rem}
.free li:last-child{border-bottom:0}
.spec{max-width:680px;margin:0 auto;border:1px solid var(--hair)}
.spec .row{display:flex;border-bottom:1px solid var(--hair)}
.spec .row:last-child{border-bottom:0}
.spec .k{flex:0 0 34%;background:rgba(176,146,95,.07);padding:20px 24px;font-weight:500;font-size:.92rem;border-right:1px solid var(--hair)}
.spec .v{flex:1;padding:20px 24px;font-weight:300;font-size:.98rem}
.spec .v .amt{font-family:var(--lat);font-weight:600;font-size:1.3rem;color:var(--text);margin-right:4px}
.contactbox{max-width:560px;margin:0 auto}
.contactbox .who{text-align:center;font-weight:300;color:#4a453c;margin-bottom:26px}
.contactbox .who b{font-weight:500;color:var(--text)}
.contactbox .row{display:flex;justify-content:space-between;align-items:baseline;padding:16px 4px;border-bottom:1px solid var(--hair)}
.contactbox .row:last-child{border-bottom:0}
.contactbox .row .k{font-family:var(--lat);letter-spacing:.14em;text-transform:uppercase;font-size:.74rem;color:var(--gold)}
.contactbox .row .v{font-size:1rem}
.contactbox .row .v a{color:var(--text);border-bottom:1px solid var(--hair)}

/* CTA band */
.ctab{background:var(--ink);color:#fff;text-align:center;padding:86px 0}
.ctab .eyebrow{color:var(--gold-hi)}
.ctab h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin:0 0 14px;color:#fff}
.ctab p{font-weight:300;color:#c8c1b4;max-width:540px;margin:0 auto 28px;line-height:2.1}
.ctab .contact{margin-top:22px;font-weight:300;color:#c8c1b4;font-size:.9rem}
.ctab .contact b{font-family:var(--lat);letter-spacing:.14em;color:var(--gold-hi);margin-right:10px}

/* FAQ accordion */
.faq{max-width:800px;margin:0 auto}
.faq .intro{text-align:center;font-weight:300;color:#4a453c;line-height:2.15;margin:0 auto 40px;max-width:760px}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{cursor:pointer;list-style:none;padding:24px 40px 24px 48px;font-family:var(--serif);font-weight:500;font-size:1.04rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary .q{position:absolute;left:0;top:23px;font-family:var(--lat);color:var(--gold);font-size:1.05rem;font-weight:600}
.faq summary::after{content:"+";position:absolute;right:6px;top:22px;color:var(--gold);font-size:1.4rem;font-family:var(--sans);transition:.2s}
.faq details[open] summary::after{content:"\2013"}
.faq .a{padding:0 6px 26px 48px;font-weight:300;color:#4a453c;font-size:.97rem;line-height:2}
.faq .a a{color:var(--gold);border-bottom:1px solid var(--hair)}

/* legal document (terms / privacy) */
.doc{max-width:760px;margin:0 auto;padding:80px 0 90px}
.doc .intro{font-weight:300;color:#463f38;font-size:1rem;line-height:2.2;margin:0 0 8px}
.doc section{padding:44px 0;border-bottom:1px solid var(--hair)}
.doc section:last-of-type{border-bottom:0}
.doc h2{font-size:1.26rem;margin:0 0 8px;position:relative;padding-left:20px}
.doc h2::before{content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;background:var(--gold);transform:rotate(45deg)}
.doc .rule{width:34px;height:1px;background:var(--gold);margin:0 0 22px 20px}
.doc p{font-weight:300;color:#3f3a33;margin:0 0 1em;line-height:2.15}
.doc p:last-child{margin-bottom:0}
.doc .note2{font-size:.9rem;color:#57524a;margin-top:14px}
.doc ul,.doc ol{margin:14px 0 0;padding-left:1.5em}
.doc li{font-weight:300;color:#3f3a33;margin:10px 0;line-height:1.9}
.doc ol li::marker{color:var(--gold);font-family:var(--lat);font-weight:600}
.doc strong{font-weight:500;color:var(--text)}
.doc .contact-box{margin-top:18px;border:1px solid var(--hair);padding:26px 28px}
.doc .contact-box .name{font-family:var(--serif);font-weight:500;font-size:1.05rem;margin:0 0 10px}
.doc .contact-box p{margin:6px 0;font-size:.96rem}
.doc .contact-box a{color:var(--text);border-bottom:1px solid var(--hair)}

/* footer */
.ft{background:var(--ink);color:#a49c8f;font-size:.84rem;padding:74px 0 30px}
.ft .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:34px;padding-bottom:46px;border-bottom:1px solid rgba(255,255,255,.08)}
.ft h4{font-family:var(--lat);font-weight:500;color:var(--gold-hi);font-size:.9rem;letter-spacing:.24em;text-transform:uppercase;margin:0 0 18px}
.ft ul{list-style:none;margin:0;padding:0}
.ft li{margin:11px 0}
.ft a:hover{color:#fff}
.ft .bb b{font-family:var(--lat);font-weight:600;color:#fff;font-size:1.5rem;letter-spacing:.24em;display:block;margin-bottom:14px}
.ft .bb p{margin:0;color:#8a8175;font-weight:300;font-size:.82rem;line-height:1.95}
.ft .listing{margin-top:18px;font-size:.72rem;color:#756c60}
.ft .listing a{color:var(--gold-hi)}
.ft .bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:26px;font-size:.72rem;color:#756c60;letter-spacing:.08em}
.ft .bot a{margin-left:18px}
.ft .bot a:hover{color:var(--gold-hi)}

/* reveal */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* responsive */
@media(max-width:860px){
  .nav{position:fixed;inset:0 0 0 auto;width:80%;max-width:330px;background:var(--ink);flex-direction:column;align-items:flex-start;gap:6px;padding:96px 30px;transform:translateX(100%);transition:transform .32s;box-shadow:-24px 0 70px rgba(0,0,0,.45)}
  .nav.open{transform:none}
  .nav a{width:100%;padding:12px 0;font-size:.98rem;border-bottom:1px solid rgba(255,255,255,.06)}
  .nav a:not(.btn)::after{display:none}
  .nav .btn{margin-top:18px}
  .burger{display:flex}
  .util .wrap{gap:14px;font-size:.66rem}
  .trust .i{flex-basis:50%;border-right:0;text-align:center;border-bottom:1px solid rgba(255,255,255,.07);padding:16px}
  .split{grid-template-columns:1fr;border-left:0;border-right:0}
  .split .ph{min-height:280px}
  .split.rev .ph{order:0}
  .split .tx{padding:44px 26px}
  .flow{grid-template-columns:1fr 1fr;gap:0}
  .flow .s{padding:22px;border-left:0;border-top:1px solid var(--hair)}
  .flow .s:nth-child(odd){border-right:1px solid var(--hair)}
  .kods{grid-template-columns:1fr;gap:40px}
  .dual{grid-template-columns:1fr}
  .panel.m{border-right:0;border-bottom:1px solid var(--hair-d)}
  .fn{grid-template-columns:1fr;gap:34px}
  .charm{grid-template-columns:1fr;gap:0}
  .aud2{grid-template-columns:1fr}
  .spec .k{flex-basis:42%}
  .ft .cols{grid-template-columns:1fr 1fr;gap:26px}
  .hero .inner{padding:96px 24px 74px}
  .sec{padding:64px 0}
  .doc{padding:52px 0 60px}
  .faq summary{padding-left:44px}
  .faq .a{padding-left:44px}
  .step .fee{margin-left:0}
}
@media(prefers-reduced-motion:reduce){.reveal{transition:none;opacity:1;transform:none}html{scroll-behavior:auto}}

/* ヘッダーの申込ボタン（男性＝ゴールド／女性＝ローズ） */
:root{ --rose:#a24b71; --rose-hi:#b85c84; }
.btn-sm{ padding:11px 20px; font-size:.8rem; letter-spacing:.08em; }
.btn-rose{ background:var(--rose); color:#fff; border-color:var(--rose); }
.btn-rose:hover{ background:var(--rose-hi); border-color:var(--rose-hi); }
.nav .entry-btns{ display:flex; align-items:center; gap:10px; }
.nav{ gap:24px; }
@media(max-width:1080px){ .nav{ gap:18px; } .nav a:not(.btn){ font-size:.78rem; } }
@media(max-width:860px){
  .nav .entry-btns{ flex-direction:column; align-items:stretch; width:100%; gap:10px; margin-top:14px; }
  .nav .entry-btns .btn{ width:100%; text-align:center; }
}

/* ===== スマホメニューの視認性修正（不透明化・前面化・スクロール対応） ===== */
@media(max-width:860px){
  .hd{ position:sticky; }
  .burger{ position:relative; z-index:120; }
  /* メニューを完全不透明・全画面に、最前面で表示 */
  .nav{
    position:fixed;
    inset:0;                     /* 画面全体を覆う */
    width:100%;
    max-width:none;
    background:#14120e;          /* 透けない濃い黒 */
    z-index:110;
    padding:96px 30px 40px;
    gap:2px;
    overflow-y:auto;             /* 項目が多くてもスクロール可 */
    transform:translateX(100%);
    box-shadow:none;
  }
  .nav.open{ transform:none; }
  .nav a:not(.btn){ font-size:1.05rem; padding:16px 0; }
  .nav .entry-btns{ margin-top:22px; }
  /* メニュー開放中は背面のスクロールを止める（任意） */
  body.nav-lock{ overflow:hidden; }
}

/* build: 1.0.2 20260902-1346 */

/* ===== スマホメニュー：下端まで確実に黒で覆う（1.0.2 追補） ===== */
@media(max-width:860px){
  .nav{
    top:0; left:0; right:0; bottom:0;
    height:100vh;
    height:100dvh;            /* 動的ビューポート対応（URLバー分を含めて画面いっぱい） */
    min-height:100vh;
    padding-bottom:120px;     /* 下端の余白を厚めに取り、途切れて見えないように */
    background:#14120e;
    -webkit-backdrop-filter:none; backdrop-filter:none;  /* 透過処理を無効化 */
  }
}

/* build: 1.0.2b 20260902-134715 */

/* ===== コラム（記事一覧・個別記事） ===== */
.col-list{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.col-card{border:1px solid var(--hair);background:var(--paper);display:flex;flex-direction:column;transition:.25s}
.col-card:hover{box-shadow:0 10px 30px rgba(25,23,19,.08);transform:translateY(-2px)}
.col-card .thumb{aspect-ratio:16/10;background:linear-gradient(135deg,#221d15,#2b2419);background-size:cover;background-position:center;position:relative}
.col-card .thumb .ph-mark{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--lat);font-size:2rem;color:var(--gold-hi);opacity:.5}
.col-card .body{padding:22px 22px 26px;display:flex;flex-direction:column;flex:1}
.col-card .meta{font-family:var(--lat);letter-spacing:.14em;text-transform:uppercase;font-size:.68rem;color:var(--gold);margin-bottom:10px}
.col-card h3{font-size:1.08rem;font-weight:500;line-height:1.6;margin:0 0 12px}
.col-card p{font-weight:300;font-size:.9rem;color:#57524a;line-height:1.75;margin:0 0 16px}
.col-card .more{margin-top:auto;font-family:var(--lat);letter-spacing:.1em;font-size:.82rem;color:var(--gold)}
.col-pagination{max-width:1040px;margin:48px auto 0;text-align:center;font-weight:300}
.col-pagination .page-numbers{display:inline-block;min-width:40px;padding:8px 12px;margin:0 3px;border:1px solid var(--hair);color:var(--text)}
.col-pagination .page-numbers.current{background:var(--gold);color:#1b1408;border-color:var(--gold)}
.col-pagination a.page-numbers:hover{border-color:var(--gold)}

/* 個別記事本文 */
.article{max-width:760px;margin:0 auto;padding:70px 0 80px}
.article .meta{font-family:var(--lat);letter-spacing:.16em;text-transform:uppercase;font-size:.74rem;color:var(--gold);text-align:center;margin-bottom:40px}
.article .thumb{width:100%;aspect-ratio:16/9;object-fit:cover;margin:0 0 44px}
.article h2{font-size:1.5rem;font-weight:500;margin:52px 0 18px;padding-bottom:14px;border-bottom:1px solid var(--hair)}
.article h3{font-size:1.2rem;font-weight:500;margin:38px 0 14px;position:relative;padding-left:18px}
.article h3::before{content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;background:var(--gold);transform:rotate(45deg)}
.article p{font-weight:300;line-height:2.15;color:#3f3a33;margin:0 0 1.5em}
.article ul,.article ol{margin:0 0 1.5em;padding-left:1.5em}
.article li{font-weight:300;line-height:1.95;color:#3f3a33;margin:8px 0}
.article ol li::marker{color:var(--gold);font-family:var(--lat);font-weight:600}
.article a{color:var(--gold);border-bottom:1px solid var(--hair)}
.article strong{font-weight:500;color:var(--text)}
.article blockquote{margin:0 0 1.5em;padding:18px 24px;border-left:3px solid var(--gold);background:var(--ivory);font-weight:300;color:#463f38}
.article img{max-width:100%;height:auto;margin:1.5em 0}
.article-back{max-width:760px;margin:0 auto 60px;text-align:center}
.article-back a{font-family:var(--lat);letter-spacing:.1em;color:var(--gold);border-bottom:1px solid var(--hair);padding-bottom:2px}

@media(max-width:860px){
  .col-list{grid-template-columns:1fr;gap:20px}
  .article{padding:48px 0 60px}
  .article h2{font-size:1.3rem}
}
