/* =============================================================
   Lien（リアン）— 女性専用オイルリラクゼーション＆恋愛・人生相談
   三軒茶屋・太子堂 / 昭和女子大近く
   Design system : luxe blush × champagne gold × warm ivory
   ============================================================= */

/* ---------- Tokens ---------- */
:root{
  /* palette */
  --ivory:        #FBF7F2;
  --ivory-2:      #F6ECE3;
  --ivory-3:      #F1E2D9;
  --blush:        #E3AAB4;   /* dusty rose – primary */
  --blush-soft:   #F4DCE0;   /* fills */
  --blush-veil:   #FAEDEF;   /* faint wash */
  --rose-deep:    #C07C88;   /* hover / strong accent */
  --rose-ink:     #9E5E6B;   /* deep text accent */
  --gold:         #BFA06A;   /* champagne gold – lines / icons */
  --gold-soft:    #DDC79A;
  --gold-deep:    #9C7F4E;
  --ink:          #4E423C;   /* body text (warm charcoal) */
  --ink-soft:     #897B72;   /* muted */
  --line:         #E7D7CA;   /* hairlines */
  --white:        #ffffff;

  /* type */
  --f-script: 'Parisienne', cursive;
  --f-en:     'Cormorant Garamond', 'Shippori Mincho', serif;
  --f-jp:     'Shippori Mincho', serif;
  --f-body:   'Zen Kaku Gothic New', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif;

  /* scale */
  --w-max: 1180px;
  --w-read: 760px;
  --r-sm: 6px;
  --r-md: 14px;
  --r-lg: 24px;
  --shadow-s: 0 10px 30px -18px rgba(120,86,80,.45);
  --shadow-m: 0 26px 60px -34px rgba(120,86,80,.55);
  --shadow-soft: 0 14px 44px -26px rgba(158,94,107,.40);
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--f-body);
  color:var(--ink);
  background:var(--ivory);
  line-height:1.95;
  font-weight:400;
  letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none;transition:color .3s var(--ease)}
button{font-family:inherit;cursor:pointer}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{margin:0;font-weight:500;line-height:1.45}
p{margin:0 0 1.2em}
p:last-child{margin-bottom:0}

/* ---------- Background atmosphere ---------- */
body{
  background-image:
    radial-gradient(120% 70% at 100% 0%, var(--blush-veil) 0%, transparent 42%),
    radial-gradient(110% 60% at 0% 100%, var(--ivory-2) 0%, transparent 46%);
  background-attachment:fixed;
}

/* ---------- Layout ---------- */
.wrap{width:min(100% - 44px,var(--w-max));margin-inline:auto}
.wrap--read{width:min(100% - 44px,var(--w-read));margin-inline:auto}
.section{padding:clamp(64px,9vw,124px) 0}
.section--tint{background:var(--ivory-2)}
.section--blush{background:linear-gradient(180deg,var(--blush-veil),var(--ivory))}
.section--rose{
  background:
    radial-gradient(130% 90% at 50% -10%, var(--blush-soft), transparent 60%),
    var(--ivory-2);
}
.center{text-align:center}

/* ---------- Eyebrow / headings ---------- */
.eyebrow{
  font-family:var(--f-en);
  font-size:.92rem;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:var(--gold-deep);
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:.7em;
  margin:0 0 1.1em;
}
.eyebrow::before,.eyebrow.is-line::after{
  content:"";width:30px;height:1px;background:var(--gold);opacity:.7;display:inline-block;
}
.eyebrow.center{justify-content:center}

.script{
  font-family:var(--f-script);
  color:var(--blush);
  font-size:clamp(1.6rem,4.4vw,2.6rem);
  line-height:1;
  letter-spacing:.01em;
}

.h-lead{
  font-family:var(--f-jp);
  font-weight:600;
  font-size:clamp(1.6rem,3.9vw,2.7rem);
  line-height:1.7;
  letter-spacing:.06em;
  color:var(--ink);
}
.h-lead em{font-style:normal;color:var(--rose-ink)}
.h-sec{
  font-family:var(--f-jp);
  font-weight:600;
  font-size:clamp(1.45rem,3.3vw,2.2rem);
  letter-spacing:.07em;
  line-height:1.7;
}
.h-sec .en{
  display:block;font-family:var(--f-en);font-weight:500;font-style:italic;
  font-size:.5em;letter-spacing:.18em;color:var(--gold-deep);margin-top:.4em;
  text-transform:none;
}
.lead-txt{color:var(--ink-soft);font-size:1.02rem;line-height:2.1;max-width:46em;margin-inline:auto}

/* ---------- Gold rosette divider (signature) ---------- */
.divider{display:flex;align-items:center;justify-content:center;gap:18px;margin:0 auto 2.4em;color:var(--gold)}
.divider::before,.divider::after{content:"";height:1px;width:min(120px,18vw);background:linear-gradient(90deg,transparent,var(--gold))}
.divider::after{background:linear-gradient(90deg,var(--gold),transparent)}
.divider .mark{
  width:13px;height:13px;transform:rotate(45deg);
  border:1px solid var(--gold);position:relative;flex:none;
}
.divider .mark::after{content:"";position:absolute;inset:3px;background:var(--blush);border-radius:1px}

/* ---------- Buttons ---------- */
.btn{
  --pad-y:1.02em; --pad-x:2.3em;
  display:inline-flex;align-items:center;justify-content:center;gap:.7em;
  font-family:var(--f-body);font-weight:500;font-size:.98rem;letter-spacing:.12em;
  padding:var(--pad-y) var(--pad-x);
  border-radius:999px;border:1px solid transparent;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease),color .35s var(--ease);
  position:relative;
}
.btn .ar{transition:transform .35s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}
.btn--primary{
  background:linear-gradient(135deg,var(--blush),var(--rose-deep));
  color:#fff;box-shadow:var(--shadow-soft);
}
.btn--primary:hover{transform:translateY(-3px);box-shadow:0 22px 46px -22px rgba(158,94,107,.6);color:#fff}
.btn--line{background:#06C755;color:#fff;box-shadow:0 14px 30px -18px rgba(6,199,85,.6)}
.btn--line:hover{transform:translateY(-3px)}
.btn--ghost{
  background:transparent;color:var(--rose-ink);border-color:var(--blush);
}
.btn--ghost:hover{background:var(--blush-soft);transform:translateY(-3px)}
.btn--gold{background:transparent;border-color:var(--gold);color:var(--gold-deep)}
.btn--gold:hover{background:var(--gold);color:#fff;transform:translateY(-3px)}
.btn--lg{--pad-y:1.18em;--pad-x:2.8em;font-size:1.04rem}
.btn--block{display:flex;width:100%}

/* ---------- Header ---------- */
.site-header{
  position:fixed;inset:0 0 auto 0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px clamp(20px,4vw,46px);
  transition:background .4s var(--ease),padding .4s var(--ease),box-shadow .4s var(--ease);
}
.site-header.is-stuck{
  background:rgba(251,247,242,.86);backdrop-filter:blur(14px);
  box-shadow:0 1px 0 var(--line),0 18px 40px -34px rgba(120,86,80,.5);
  padding-top:12px;padding-bottom:12px;
}
.brand{display:flex;flex-direction:column;line-height:1;gap:3px}
.brand .name{font-family:var(--f-en);font-size:1.62rem;font-weight:600;letter-spacing:.16em;color:var(--ink)}
.brand .name b{color:var(--blush);font-weight:600}
.brand .sub{font-size:.6rem;letter-spacing:.32em;color:var(--ink-soft);text-transform:uppercase}
.site-header.on-dark:not(.is-stuck) .brand .name{color:#fff}
.site-header.on-dark:not(.is-stuck) .brand .sub{color:rgba(255,255,255,.8)}

.nav{display:flex;align-items:center;gap:clamp(16px,2vw,30px)}
.nav a.link{font-size:.92rem;letter-spacing:.08em;color:var(--ink);position:relative;padding:.3em 0}
.site-header.on-dark:not(.is-stuck) .nav a.link{color:rgba(255,255,255,.92)}
.nav a.link::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--blush);transition:width .35s var(--ease)}
.nav a.link:hover{color:var(--rose-ink)}
.nav a.link:hover::after{width:100%}
.site-header.on-dark:not(.is-stuck) .nav a.link:hover{color:#fff}

.nav-cta{display:inline-flex;align-items:center}
.menu-btn,.menu-close{display:none}

/* mobile nav */
@media (max-width:920px){
  .nav{
    position:fixed;inset:0;flex-direction:column;justify-content:center;gap:26px;
    background:linear-gradient(160deg,var(--ivory),var(--blush-veil));
    transform:translateX(100%);transition:transform .5s var(--ease);
    padding:80px 30px;z-index:70;
  }
  .nav.open{transform:translateX(0)}
  .nav a.link{font-family:var(--f-jp);font-size:1.25rem;color:var(--ink)!important}
  .nav a.link::after{display:none}
  .menu-btn{
    display:inline-flex;flex-direction:column;gap:5px;background:none;border:0;z-index:80;
    padding:8px;
  }
  .menu-btn span{width:26px;height:1.5px;background:var(--ink);display:block;transition:.3s}
  .site-header.on-dark:not(.is-stuck) .menu-btn span{background:#fff}
  .menu-close{
    display:block;position:absolute;top:22px;right:24px;background:none;border:0;
    font-family:var(--f-en);font-size:2rem;color:var(--rose-ink);line-height:1;
  }
  .menu-open{overflow:hidden}
}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.hero__bg::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(54,38,40,.5) 0%,rgba(54,38,40,.18) 42%,transparent 70%),
    linear-gradient(180deg,rgba(54,38,40,.34),rgba(54,38,40,.12) 30%,rgba(40,28,30,.5));
}
.hero__inner{position:relative;z-index:2;color:#fff;padding-top:90px;max-width:660px}
.hero .eyebrow{color:#fff}
.hero .eyebrow::before{background:rgba(255,255,255,.85)}
.hero__script{font-family:var(--f-script);font-size:clamp(2rem,6vw,3.2rem);color:#fff;line-height:1;margin-bottom:.1em;text-shadow:0 2px 24px rgba(80,40,46,.5)}
.hero__title{
  font-family:var(--f-jp);font-weight:600;
  font-size:clamp(2.05rem,5.4vw,3.5rem);line-height:1.6;letter-spacing:.05em;
  text-shadow:0 2px 30px rgba(60,34,38,.55);margin:.1em 0 .55em;
}
.hero__title em{font-style:normal;color:var(--blush-soft)}
.hero__lead{font-size:1.04rem;line-height:2.05;max-width:30em;color:rgba(255,255,255,.94);text-shadow:0 1px 16px rgba(60,34,38,.5);margin-bottom:2em}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px}
.hero__loc{
  position:absolute;right:clamp(20px,4vw,46px);bottom:34px;z-index:3;
  text-align:right;color:rgba(255,255,255,.92);font-size:.8rem;letter-spacing:.14em;line-height:1.9;
  text-shadow:0 1px 14px rgba(60,34,38,.6);
}
.hero__loc b{font-family:var(--f-en);font-size:1.05rem;letter-spacing:.18em}
.scrollcue{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:3;color:#fff;font-family:var(--f-en);font-size:.72rem;letter-spacing:.3em;text-align:center}
.scrollcue::after{content:"";display:block;width:1px;height:42px;margin:8px auto 0;background:linear-gradient(#fff,transparent);animation:cue 2.2s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* page hero (inner pages) */
.phero{position:relative;min-height:72svh;display:flex;align-items:flex-end;overflow:hidden}
.phero__bg{position:absolute;inset:0}
.phero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 32%}
.phero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(50,34,36,.28),rgba(50,34,36,.1) 40%,rgba(40,26,28,.62))}
.phero__inner{position:relative;z-index:2;color:#fff;padding:0 0 clamp(46px,6vw,84px)}
.phero .eyebrow{color:#fff}.phero .eyebrow::before{background:rgba(255,255,255,.85)}
.phero__title{font-family:var(--f-jp);font-weight:600;font-size:clamp(1.9rem,4.6vw,3rem);line-height:1.55;letter-spacing:.05em;text-shadow:0 2px 26px rgba(60,34,38,.5)}
.phero__title em{font-style:normal;color:var(--blush-soft)}
.phero__lead{margin-top:.8em;max-width:34em;color:rgba(255,255,255,.93);text-shadow:0 1px 14px rgba(60,34,38,.5)}

/* breadcrumb */
.crumb{font-size:.78rem;letter-spacing:.08em;color:var(--ink-soft);padding:18px 0 0}
.crumb a:hover{color:var(--rose-ink)}
.crumb span{margin:0 .5em;color:var(--gold)}

/* ---------- Arched frame (signature) ---------- */
.arch{
  border-radius:50% 50% var(--r-md) var(--r-md) / 26% 26% 4% 4%;
  overflow:hidden;position:relative;box-shadow:var(--shadow-m);
}
.arch img{width:100%;height:100%;object-fit:cover}
.arch-frame{
  position:relative;padding:12px;
  border-radius:50% 50% calc(var(--r-md) + 8px) calc(var(--r-md) + 8px) / 24% 24% 5% 5%;
  background:linear-gradient(160deg,var(--blush-soft),var(--ivory));
  box-shadow:var(--shadow-soft);
}
.arch-frame::before{
  content:"";position:absolute;inset:6px;border:1px solid var(--gold-soft);
  border-radius:50% 50% var(--r-md) var(--r-md) / 24% 24% 5% 5%;z-index:3;pointer-events:none;opacity:.85;
}
.softimg{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-m)}
.softimg img{width:100%;height:100%;object-fit:cover}

/* ---------- Concept split ---------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(34px,6vw,80px);align-items:center}
.split--rev .split__media{order:2}
.split__media{position:relative}
.split__media .tag{
  position:absolute;background:#fff;color:var(--rose-ink);font-family:var(--f-en);font-style:italic;
  font-size:1.05rem;letter-spacing:.06em;padding:.5em 1.3em;border-radius:999px;box-shadow:var(--shadow-s);
  bottom:18px;left:-14px;border:1px solid var(--blush-soft);z-index:5;
}
@media (max-width:820px){
  .split{grid-template-columns:1fr;gap:36px}
  .split--rev .split__media{order:0}
}

/* ---------- Service cards ---------- */
.services{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,3.6vw,40px)}
.svc{
  background:#fff;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-m);
  border:1px solid var(--line);display:flex;flex-direction:column;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease);
}
.svc:hover{transform:translateY(-8px);box-shadow:0 40px 70px -38px rgba(120,86,80,.6)}
.svc__img{aspect-ratio:16/11;overflow:hidden;position:relative}
.svc__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.svc:hover .svc__img img{transform:scale(1.06)}
.svc__no{position:absolute;top:14px;left:16px;font-family:var(--f-en);font-style:italic;font-size:1.5rem;color:#fff;letter-spacing:.1em;text-shadow:0 2px 14px rgba(60,34,38,.5);z-index:2}
.svc__body{padding:clamp(24px,3vw,38px);display:flex;flex-direction:column;gap:.6em;flex:1}
.svc__en{font-family:var(--f-en);font-style:italic;letter-spacing:.14em;color:var(--gold-deep);font-size:1rem}
.svc__ttl{font-family:var(--f-jp);font-weight:600;font-size:1.5rem;letter-spacing:.05em}
.svc__txt{color:var(--ink-soft);font-size:.98rem;line-height:2;margin-bottom:.4em}
.svc__more{margin-top:auto;color:var(--rose-ink);font-size:.92rem;letter-spacing:.1em;display:inline-flex;align-items:center;gap:.5em}
.svc:hover .svc__more{color:var(--rose-deep)}
@media (max-width:760px){.services{grid-template-columns:1fr}}

/* ---------- Feature trio ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,36px)}
.feat{text-align:center;padding:8px}
.feat__ic{
  width:78px;height:78px;margin:0 auto 20px;border-radius:50%;
  display:grid;place-items:center;background:var(--blush-veil);
  border:1px solid var(--blush-soft);color:var(--rose-deep);
}
.feat__ic svg{width:34px;height:34px}
.feat__no{font-family:var(--f-en);font-style:italic;color:var(--gold);letter-spacing:.16em;font-size:1rem;margin-bottom:.3em}
.feat__ttl{font-family:var(--f-jp);font-weight:600;font-size:1.22rem;margin-bottom:.5em;letter-spacing:.04em}
.feat__txt{color:var(--ink-soft);font-size:.94rem;line-height:1.95;text-align:left}
@media (max-width:760px){.trio{grid-template-columns:1fr;gap:30px}.feat__txt{text-align:center}}

/* ---------- Steps ---------- */
.steps{display:grid;gap:18px;max-width:840px;margin-inline:auto}
.step{
  display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:start;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:26px 30px;
  box-shadow:var(--shadow-s);
}
.step__no{
  font-family:var(--f-en);font-style:italic;font-size:2.1rem;line-height:1;color:var(--blush);
  min-width:54px;border-right:1px solid var(--line);padding-right:22px;
}
.step__ttl{font-family:var(--f-jp);font-weight:600;font-size:1.16rem;margin-bottom:.35em;letter-spacing:.04em}
.step__txt{color:var(--ink-soft);font-size:.95rem;line-height:1.9}
@media (max-width:600px){.step{grid-template-columns:1fr;gap:8px}.step__no{border-right:0;padding-right:0;font-size:1.7rem}}

/* ---------- Pricing ---------- */
.price-note{
  text-align:center;max-width:680px;margin:0 auto 2.6em;background:var(--blush-veil);
  border:1px dashed var(--blush);border-radius:var(--r-md);padding:22px 26px;
}
.price-note .big{font-family:var(--f-jp);font-weight:700;font-size:1.35rem;color:var(--rose-ink);letter-spacing:.04em}
.price-note .big b{color:var(--rose-deep);font-size:1.15em}
.price-note .sub{color:var(--ink-soft);font-size:.9rem;margin-top:.4em}

.price-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,32px);align-items:start}
.pcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-m)}
.pcard__head{padding:22px 26px;background:linear-gradient(135deg,var(--blush-soft),var(--ivory-2));border-bottom:1px solid var(--line)}
.pcard__en{font-family:var(--f-en);font-style:italic;color:var(--gold-deep);letter-spacing:.12em}
.pcard__ttl{font-family:var(--f-jp);font-weight:600;font-size:1.4rem;letter-spacing:.05em}
.pcard__rows{padding:8px 26px 24px}
.prow{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.prow:last-child{border-bottom:0}
.prow .min{font-family:var(--f-jp);font-weight:600;font-size:1.08rem}
.prow .min small{font-size:.7em;color:var(--ink-soft);font-weight:400;margin-left:.2em}
.prow .yen{text-align:right;line-height:1.3}
.prow .reg{color:var(--ink-soft);font-size:.92rem;text-decoration:line-through;text-decoration-color:var(--blush)}
.prow .now{font-family:var(--f-jp);font-weight:700;color:var(--rose-deep);font-size:1.05rem}
.price-foot{text-align:center;color:var(--ink-soft);font-size:.86rem;margin-top:2em;line-height:1.9}
@media (max-width:760px){.price-grid{grid-template-columns:1fr}}

/* monitor banner */
.monitor{
  position:relative;overflow:hidden;border-radius:var(--r-lg);
  background:linear-gradient(135deg,var(--rose-deep),var(--blush));color:#fff;
  padding:clamp(34px,5vw,58px);text-align:center;box-shadow:var(--shadow-m);
}
.monitor::before,.monitor::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.12)}
.monitor::before{width:240px;height:240px;top:-90px;right:-60px}
.monitor::after{width:160px;height:160px;bottom:-70px;left:-30px}
.monitor__tag{font-family:var(--f-en);font-style:italic;letter-spacing:.2em;opacity:.95;position:relative}
.monitor__ttl{font-family:var(--f-jp);font-weight:700;font-size:clamp(1.6rem,4vw,2.4rem);letter-spacing:.04em;margin:.25em 0 .4em;position:relative}
.monitor__ttl b{font-size:1.2em;border-bottom:3px solid rgba(255,255,255,.5);padding-bottom:.05em}
.monitor__txt{position:relative;max-width:36em;margin:0 auto 1.6em;color:rgba(255,255,255,.95)}
.monitor .btn--ghost{background:#fff;border-color:#fff;color:var(--rose-ink);position:relative}
.monitor .btn--ghost:hover{background:var(--blush-veil)}

/* ---------- Voices ---------- */
.voices{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.6vw,28px)}
.voice{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:30px 28px;box-shadow:var(--shadow-s);position:relative}
.voice::before{content:"\201C";position:absolute;top:6px;left:18px;font-family:var(--f-en);font-size:3.4rem;color:var(--blush-soft);line-height:1}
.voice__stars{color:var(--gold);letter-spacing:.2em;margin-bottom:.6em;font-size:.9rem}
.voice__txt{color:var(--ink);font-size:.95rem;line-height:1.95;margin-bottom:1em}
.voice__who{color:var(--ink-soft);font-size:.84rem;letter-spacing:.05em;border-top:1px solid var(--line);padding-top:.9em}
@media (max-width:880px){.voices{grid-template-columns:1fr}}

/* ---------- Column / article cards ---------- */
.col-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.8vw,30px)}
.col-grid--2{grid-template-columns:repeat(2,1fr)}
.post{
  display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-s);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease);height:100%;
}
.post:hover{transform:translateY(-6px);box-shadow:var(--shadow-m)}
.post__img{aspect-ratio:16/10;overflow:hidden}
.post__img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.post:hover .post__img img{transform:scale(1.05)}
.post__img.ph{background:linear-gradient(135deg,var(--blush-soft),var(--ivory-3));display:grid;place-items:center}
.post__img.ph span{font-family:var(--f-script);font-size:2rem;color:var(--blush)}
.post__b{padding:20px 22px 24px;display:flex;flex-direction:column;gap:.5em;flex:1}
.cat{align-self:flex-start;font-size:.72rem;letter-spacing:.12em;color:var(--rose-ink);background:var(--blush-veil);border:1px solid var(--blush-soft);padding:.3em 1em;border-radius:999px}
.post__t{font-family:var(--f-jp);font-weight:600;font-size:1.06rem;line-height:1.65;letter-spacing:.02em}
.post:hover .post__t{color:var(--rose-ink)}
.post__x{color:var(--ink-soft);font-size:.86rem;line-height:1.8}
.post__more{margin-top:auto;color:var(--gold-deep);font-size:.8rem;letter-spacing:.1em}
@media (max-width:880px){.col-grid,.col-grid--2{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.col-grid,.col-grid--2{grid-template-columns:1fr}}

/* category chips row */
.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:2.6em}
.chip{font-size:.84rem;letter-spacing:.06em;color:var(--ink-soft);border:1px solid var(--line);background:#fff;padding:.55em 1.3em;border-radius:999px;transition:.3s}
.chip:hover,.chip.active{background:var(--blush);color:#fff;border-color:var(--blush)}

/* ---------- FAQ ---------- */
.faq{max-width:820px;margin-inline:auto;display:grid;gap:14px}
.qa{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-s)}
.qa summary{
  list-style:none;cursor:pointer;padding:22px 56px 22px 26px;position:relative;
  font-family:var(--f-jp);font-weight:600;font-size:1.04rem;letter-spacing:.03em;color:var(--ink);
  display:flex;gap:.7em;align-items:flex-start;
}
.qa summary::-webkit-details-marker{display:none}
.qa summary::before{content:"Q";font-family:var(--f-en);font-style:italic;color:var(--blush);font-size:1.3rem;line-height:1.1;flex:none}
.qa summary::after{content:"";position:absolute;right:26px;top:28px;width:11px;height:11px;border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:rotate(45deg);transition:transform .35s var(--ease)}
.qa[open] summary::after{transform:rotate(-135deg)}
.qa__a{padding:0 26px 24px 56px;color:var(--ink-soft);font-size:.95rem;line-height:1.95}

/* ---------- Access ---------- */
.access{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,4vw,52px);align-items:center}
.access__map{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-m);aspect-ratio:4/3;border:1px solid var(--line)}
.access__map iframe{width:100%;height:100%;border:0;display:block}
.info-row{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.info-row:last-child{border-bottom:0}
.info-row .k{min-width:84px;font-family:var(--f-jp);font-weight:600;color:var(--rose-ink);font-size:.95rem}
.info-row .v{color:var(--ink);font-size:.95rem;line-height:1.85}
.info-row .v small{color:var(--ink-soft)}
@media (max-width:820px){.access{grid-template-columns:1fr}}

/* ---------- CTA band ---------- */
.cta-band{position:relative;overflow:hidden;text-align:center;color:#fff}
.cta-band__bg{position:absolute;inset:0}
.cta-band__bg img{width:100%;height:100%;object-fit:cover;object-position:center 35%}
.cta-band__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(60,38,42,.66),rgba(50,30,34,.74))}
.cta-band__in{position:relative;z-index:2;padding:clamp(70px,10vw,120px) 0}
.cta-band .script{color:var(--blush-soft)}
.cta-band__ttl{font-family:var(--f-jp);font-weight:600;font-size:clamp(1.7rem,4vw,2.6rem);letter-spacing:.05em;margin:.2em 0 .6em;text-shadow:0 2px 24px rgba(40,24,28,.5)}
.cta-band__txt{max-width:34em;margin:0 auto 2em;color:rgba(255,255,255,.94)}
.cta-band__btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}

/* ---------- Article body ---------- */
.article{padding:clamp(40px,6vw,72px) 0 clamp(60px,9vw,110px)}
.article__head{text-align:center;max-width:780px;margin:0 auto clamp(34px,5vw,56px)}
.article__cat{display:inline-block;font-size:.78rem;letter-spacing:.12em;color:var(--rose-ink);background:var(--blush-veil);border:1px solid var(--blush-soft);padding:.4em 1.2em;border-radius:999px;margin-bottom:1.2em}
.article__title{font-family:var(--f-jp);font-weight:600;font-size:clamp(1.5rem,3.6vw,2.3rem);line-height:1.6;letter-spacing:.04em}
.article__meta{color:var(--ink-soft);font-size:.84rem;letter-spacing:.06em;margin-top:1em}
.article__hero{margin:0 0 clamp(30px,5vw,50px);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-m)}
.prose{font-size:1.03rem;line-height:2.15;color:var(--ink)}
.prose>*+*{margin-top:1.25em}
.prose h2{
  font-family:var(--f-jp);font-weight:600;font-size:clamp(1.3rem,2.8vw,1.7rem);letter-spacing:.04em;
  margin-top:2.4em;padding:0 0 .5em;border-bottom:1px solid var(--line);position:relative;line-height:1.6;
}
.prose h2::before{content:"";position:absolute;left:0;bottom:-1px;width:64px;height:2px;background:var(--blush)}
.prose h3{font-family:var(--f-jp);font-weight:600;font-size:clamp(1.12rem,2.2vw,1.34rem);letter-spacing:.03em;margin-top:1.9em;color:var(--rose-ink);line-height:1.65}
.prose p{margin:0}
.prose strong{color:var(--rose-ink);font-weight:700}
.prose ul.dot{margin:0;padding:0;display:grid;gap:.7em}
.prose ul.dot li{position:relative;padding-left:1.5em;line-height:1.95}
.prose ul.dot li::before{content:"";position:absolute;left:.2em;top:.85em;width:7px;height:7px;background:var(--blush);border-radius:50%;transform:rotate(45deg)}
.prose .note{background:var(--blush-veil);border-left:3px solid var(--blush);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:20px 24px;color:var(--ink)}
.prose .note .lab{font-family:var(--f-jp);font-weight:700;color:var(--rose-ink);display:block;margin-bottom:.3em;letter-spacing:.04em}
.prose figure{margin:0}
.prose figure img{border-radius:var(--r-md);box-shadow:var(--shadow-s)}
.prose figcaption{text-align:center;color:var(--ink-soft);font-size:.82rem;margin-top:.7em}
.toc{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:24px 28px;box-shadow:var(--shadow-s);margin:0 0 2.4em}
.toc__h{font-family:var(--f-jp);font-weight:700;color:var(--rose-ink);letter-spacing:.06em;margin-bottom:.7em;display:flex;align-items:center;gap:.5em}
.toc__h::before{content:"";width:18px;height:1px;background:var(--gold)}
.toc ol{margin:0;padding-left:1.4em;display:grid;gap:.5em}
.toc ol li{color:var(--ink-soft);font-size:.95rem}
.toc ol li::marker{color:var(--blush);font-family:var(--f-en);font-style:italic}
.toc a:hover{color:var(--rose-ink)}

.cta-inline{
  margin:clamp(40px,6vw,64px) 0 0;background:linear-gradient(135deg,var(--blush-soft),var(--ivory-2));
  border:1px solid var(--blush-soft);border-radius:var(--r-lg);padding:clamp(28px,4vw,44px);text-align:center;
}
.cta-inline h3{font-family:var(--f-jp);font-weight:600;font-size:1.35rem;letter-spacing:.04em;margin-bottom:.5em}
.cta-inline p{color:var(--ink-soft);font-size:.95rem;max-width:34em;margin:0 auto 1.4em}
.cta-inline .btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.author{display:flex;gap:18px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:22px 24px;margin-top:2.4em;box-shadow:var(--shadow-s)}
.author__av{width:62px;height:62px;border-radius:50%;background:var(--blush-soft);display:grid;place-items:center;font-family:var(--f-en);font-style:italic;color:var(--rose-deep);font-size:1.3rem;flex:none}
.author__n{font-family:var(--f-jp);font-weight:600;letter-spacing:.04em}
.author__x{color:var(--ink-soft);font-size:.85rem;line-height:1.8}

.relnav{display:flex;justify-content:center;margin-top:3em}

/* ---------- Footer ---------- */
.footer{background:linear-gradient(180deg,var(--ivory-2),var(--ivory-3));border-top:1px solid var(--line);padding:clamp(54px,7vw,84px) 0 30px}
.footer__top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(28px,4vw,56px)}
.footer .brand .name{color:var(--ink)}
.footer__lede{color:var(--ink-soft);font-size:.92rem;line-height:1.95;margin:1.2em 0 1.4em;max-width:28em}
.footer__sns{display:flex;gap:12px}
.footer__sns a{width:42px;height:42px;border-radius:50%;border:1px solid var(--gold-soft);display:grid;place-items:center;color:var(--gold-deep);transition:.3s}
.footer__sns a:hover{background:var(--blush);border-color:var(--blush);color:#fff;transform:translateY(-3px)}
.footer__sns svg{width:20px;height:20px}
.fcol h4{font-family:var(--f-jp);font-weight:600;font-size:1rem;letter-spacing:.06em;margin-bottom:1em;color:var(--rose-ink)}
.fcol ul{display:grid;gap:.7em}
.fcol a{color:var(--ink);font-size:.9rem}
.fcol a:hover{color:var(--rose-ink)}
.fcol .addr{color:var(--ink-soft);font-size:.88rem;line-height:1.9;font-style:normal}
.footer__bottom{margin-top:clamp(36px,5vw,56px);padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;color:var(--ink-soft);font-size:.78rem;letter-spacing:.05em}
.footer__bottom .en{font-family:var(--f-en);font-style:italic;letter-spacing:.14em}
@media (max-width:820px){.footer__top{grid-template-columns:1fr 1fr}.footer .brand{grid-column:1/-1}}
@media (max-width:520px){.footer__top{grid-template-columns:1fr}}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.1s}.reveal.d2{transition-delay:.2s}.reveal.d3{transition-delay:.3s}.reveal.d4{transition-delay:.4s}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}

/* ---------- A11y ---------- */
:focus-visible{outline:2px solid var(--rose-deep);outline-offset:3px;border-radius:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* small helpers */
.mt-cta{margin-top:clamp(36px,5vw,56px);display:flex;justify-content:center;flex-wrap:wrap;gap:14px}
.maxr{max-width:var(--w-read);margin-inline:auto}
.tac{text-align:center}