/* 新客室「おかととき」特設ページ
   サイトの下層ページ（privacy.html / news-list.html）と同じ文字・余白・ヘッダーに、
   桔梗の紫を差し色として足したもの。 */
:root{
  --bg:#f9f4ea; --bg-soft:#f1ece6; --paper:#fdf9f0;
  --ink:#1a1612; --ink-soft:#4a4137; --ink-quiet:#80776a;
  --kohaku:#ad8a4f; --line:#c9bfa9; --line-soft:#ddd2bb;
  --akabani:#9c3a3a;
  /* 桔梗 */
  --kikyo:#5b4b8a; --kikyo-deep:#3b3160; --kikyo-night:#262040;
  --kikyo-soft:#8e80b8; --kikyo-mist:#ebe7f2; --kikyo-line:#d6cfe4;
  --serif-jp-display:"Shippori Mincho B1","Noto Serif JP",serif;
  --serif-jp:"Noto Serif JP","Shippori Mincho B1",serif;
  --display-en:"Italiana","Cormorant Garamond",serif;
  --serif-en:"Cormorant Garamond","Italiana",serif;
  --max-w:1320px; --content-w:860px;
}
*,*::before,*::after{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:var(--serif-jp);font-weight:400;
  line-height:1.9;letter-spacing:.04em;overflow-x:hidden;}
img{max-width:100%;display:block;height:auto;}
a{color:inherit;}
.pc{display:none;}
@media(min-width:760px){ .pc{display:inline;} }

/* ---- header（下層ページと同じ） ---- */
.site-header{border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;}
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;
  background:rgba(249,244,234,.93);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
.site-header-inner{max-width:var(--max-w);margin:0 auto;padding:20px 32px;
  display:flex;justify-content:space-between;align-items:center;gap:24px;}
.site-logo{font-family:var(--serif-jp-display);font-weight:500;font-size:18px;letter-spacing:.25em;text-decoration:none;}
.site-logo small{display:block;font-family:var(--display-en);font-size:10px;letter-spacing:.4em;color:var(--ink-quiet);margin-top:4px;}
.site-back{font-size:13px;letter-spacing:.2em;color:var(--ink-soft);border:1px solid var(--line);padding:10px 20px;
  text-decoration:none;transition:.3s;white-space:nowrap;}
.site-back:hover{background:var(--kikyo);color:var(--paper);border-color:var(--kikyo);}

/* ---- hero ---- */
.hero{position:relative;overflow:hidden;color:#f4f1f8;text-align:center;
  background:
    radial-gradient(ellipse at 50% 120%, rgba(142,128,184,.35) 0%, transparent 60%),
    linear-gradient(170deg, var(--kikyo-night) 0%, var(--kikyo-deep) 55%, #4a3f72 100%);
  padding:clamp(80px,14vw,150px) 24px clamp(70px,11vw,120px);}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(173,138,79,.6);}
.hero-flower{position:absolute;fill:none;stroke:rgba(214,207,228,.22);stroke-width:1.1;}
.hero-flower.f1{width:min(70vw,520px);right:-12%;top:-18%;transform:rotate(12deg);}
.hero-flower.f2{width:min(44vw,300px);left:-9%;bottom:-16%;transform:rotate(-20deg);stroke:rgba(214,207,228,.14);}
.hero-inner{position:relative;z-index:2;max-width:760px;margin:0 auto;}
.eyebrow{font-family:var(--display-en);font-size:12px;letter-spacing:.42em;text-transform:uppercase;color:#cbbfe6;}
.hero-kicker{margin-top:30px;font-family:var(--serif-jp-display);font-size:15px;letter-spacing:.5em;padding-left:.5em;color:#ddd5ee;}
.hero-title{margin-top:12px;font-family:var(--serif-jp-display);font-weight:500;
  font-size:clamp(46px,11vw,96px);letter-spacing:.24em;padding-left:.24em;line-height:1.25;}
.hero-sub{margin-top:14px;font-family:var(--serif-jp-display);font-size:clamp(16px,2.4vw,20px);letter-spacing:.3em;padding-left:.3em;color:#e3dcf0;}
.hero-sub::before,.hero-sub::after{content:"";display:inline-block;width:28px;height:1px;background:var(--kohaku);vertical-align:middle;margin:0 14px;}
.hero-lead{margin:34px auto 0;max-width:40em;text-wrap:balance;font-size:clamp(14px,1.9vw,16px);line-height:2.1;color:#e8e3f1;}
.hero-down{display:inline-block;margin-top:40px;font-size:13px;letter-spacing:.24em;color:#f4f1f8;text-decoration:none;
  border:1px solid rgba(214,207,228,.5);padding:12px 30px;transition:.3s;}
.hero-down:hover{background:rgba(244,241,248,.1);}

/* ---- sections ---- */
.sec{padding:clamp(60px,9vw,110px) 22px;scroll-margin-top:60px;}
.sec.alt{background:var(--bg-soft);}
.wrap{max-width:var(--content-w);margin:0 auto;}
.sec-head{text-align:center;margin-bottom:clamp(36px,5vw,56px);}
.sec-head .en{font-family:var(--display-en);font-size:clamp(30px,5.5vw,44px);letter-spacing:.1em;color:var(--kikyo-soft);line-height:1;}
.sec-head h2{font-family:var(--serif-jp-display);font-weight:500;font-size:15px;letter-spacing:.4em;padding-left:.4em;margin-top:12px;}
.sec-head h2::after{content:"";display:block;width:40px;height:1px;background:var(--kikyo);margin:22px auto 0;}
.sec-head .sub{margin-top:18px;color:var(--ink-quiet);font-size:13px;letter-spacing:.1em;}

/* ---- 願い ---- */
.wish{max-width:40em;margin:0 auto;font-size:15.5px;color:var(--ink-soft);line-height:2.1;}
.wish p+p{margin-top:1.2em;}
.wish-lead{font-family:var(--serif-jp-display);font-size:clamp(20px,3.4vw,26px);color:var(--kikyo-deep);
  text-align:center;letter-spacing:.12em;line-height:1.7;margin-bottom:1.6em!important;}

/* ---- 計画している内容 ---- */
.plan{list-style:none;counter-reset:plan;background:var(--paper);border:1px solid var(--line-soft);padding:6px clamp(20px,4vw,36px);}
.plan li{counter-increment:plan;padding:22px 0;border-bottom:1px solid var(--line-soft);}
.plan li:last-child{border-bottom:0;}
@media(min-width:700px){
  .plan li{display:grid;grid-template-columns:230px 1fr;gap:28px;align-items:baseline;}
  .plan li p{margin-top:0!important;}
}
.plan h3{font-family:var(--serif-jp-display);font-weight:500;font-size:17px;letter-spacing:.06em;color:var(--kikyo-deep);line-height:1.6;}
.plan h3::before{content:counter(plan,decimal-leading-zero);display:block;font-family:var(--display-en);font-size:12px;letter-spacing:.3em;color:var(--kohaku);margin-bottom:6px;}
.plan p{margin-top:8px;font-size:14px;color:var(--ink-soft);line-height:1.95;}
.plan-note{margin-top:24px;font-size:12.5px;color:var(--ink-quiet);line-height:1.9;}

/* ---- 名の由来 ---- */
.origin{display:grid;grid-template-columns:200px 1fr;gap:clamp(28px,5vw,56px);align-items:start;}
.origin-mark svg{width:100%;fill:var(--kikyo);opacity:.92;}
.origin-mark circle{fill:var(--kohaku);}
.origin-body{font-size:15.5px;color:var(--ink-soft);}
.origin-body p{margin-bottom:1.1em;}
.origin-body strong{color:var(--kikyo-deep);font-weight:500;}
.origin-word{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:1.4em!important;
  padding-bottom:18px;border-bottom:1px solid var(--kikyo-line);}
.origin-word .kana{font-family:var(--serif-jp-display);font-size:30px;letter-spacing:.2em;color:var(--kikyo-deep);}
.origin-word .kan{font-family:var(--serif-jp-display);font-size:16px;letter-spacing:.3em;color:var(--ink-quiet);}
.origin-body .cite{margin-top:1.6em;font-size:12px;line-height:1.9;color:var(--ink-quiet);
  border-left:2px solid var(--kikyo-line);padding-left:12px;}
.origin-body .cite a{color:var(--kikyo);}
@media(max-width:640px){
  .origin{grid-template-columns:1fr;}
  .origin-mark{width:110px;margin:0 auto;}
  .origin-word{justify-content:center;}
}

/* ---- 工事日誌 ---- */
.timeline{list-style:none;position:relative;}
.timeline::before{content:"";position:absolute;left:7px;top:10px;bottom:10px;width:1px;background:var(--kikyo-line);}
.entry{position:relative;padding-left:36px;margin-bottom:46px;}
.entry:last-child{margin-bottom:0;}
.entry::before{content:"";position:absolute;left:0;top:9px;width:15px;height:15px;border-radius:50%;
  background:var(--bg-soft);border:1px solid var(--kikyo);}
.entry:first-child::before{background:var(--kikyo);box-shadow:0 0 0 4px rgba(91,75,138,.15);}
.entry-date{font-family:var(--serif-en);font-size:19px;letter-spacing:.12em;color:var(--kikyo-deep);line-height:1.6;}
.entry-date .wd{font-family:var(--serif-jp);font-size:12px;margin-left:8px;color:var(--ink-quiet);letter-spacing:0;}
.entry-date .new{display:inline-block;margin-left:10px;font-family:var(--display-en);font-size:10px;letter-spacing:.2em;
  color:#fff;background:var(--kikyo);padding:1px 8px;vertical-align:3px;}
.entry-card{margin-top:10px;background:var(--paper);border:1px solid var(--line-soft);padding:clamp(20px,4vw,32px);}
.entry-card h3{font-family:var(--serif-jp-display);font-weight:500;font-size:clamp(18px,2.6vw,21px);letter-spacing:.08em;line-height:1.6;}
.entry-body{margin-top:12px;font-size:15px;color:var(--ink-soft);line-height:2;}
.entry-body p+p{margin-top:.9em;}
.photos{margin-top:20px;display:grid;gap:8px;grid-template-columns:repeat(2,1fr);}
.photos.n1{grid-template-columns:1fr;}
.photos.n3 figure:first-child{grid-column:1 / -1;}
.photos figure{margin:0;}
.photos button{display:block;width:100%;border:0;padding:0;background:#e9e2d4;cursor:zoom-in;}
.photos img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.photos.n1 img{max-height:560px;object-fit:contain;background:#e9e2d4;}  /* 1枚のときは写真の縦横比のまま（story.js が style で入れる） */
.photos figcaption{font-size:12px;color:var(--ink-quiet);margin-top:4px;line-height:1.6;}
.timeline-empty{text-align:center;color:var(--ink-quiet);font-size:14px;}

/* ---- ご案内 ---- */
.info{background:var(--paper);border:1px solid var(--line-soft);padding:clamp(22px,4vw,40px);}
.info dl{display:grid;grid-template-columns:auto 1fr;}
.info dt{font-family:var(--serif-jp-display);font-size:15px;letter-spacing:.08em;padding:16px 28px 16px 0;
  border-bottom:1px solid var(--line-soft);white-space:nowrap;}
.info dd{font-size:15px;color:var(--ink-soft);padding:16px 0;border-bottom:1px solid var(--line-soft);line-height:1.95;}
.prep{display:inline-block;font-size:12px;letter-spacing:.2em;color:var(--kikyo);border:1px solid var(--kikyo-soft);
  padding:0 10px;margin-right:12px;vertical-align:1px;}
.info-note{margin-top:22px;font-size:13.5px;color:var(--ink-quiet);}
@media(max-width:560px){
  .info dl{grid-template-columns:1fr;}
  .info dt{padding:18px 0 4px;border-bottom:0;color:var(--kikyo-deep);}
  .info dd{padding:0 0 18px;}
  .prep{display:table;margin:0 0 6px;}
}

/* ---- footer（下層ページと同じ） ---- */
.site-footer{border-top:1px solid var(--line);padding:44px 24px;text-align:center;font-size:12px;letter-spacing:.1em;color:var(--ink-quiet);}
.site-footer .tel{font-family:var(--display-en);font-size:20px;letter-spacing:.15em;color:var(--ink);display:block;margin:8px 0;text-decoration:none;}
.site-footer .foot-links{margin-top:14px;}
.site-footer .foot-links a{text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:2px;}
.site-footer .copy{margin-top:20px;font-size:11px;color:var(--line);}

/* ---- 写真の拡大 ---- */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(20,16,30,.94);display:flex;align-items:center;justify-content:center;}
.lightbox[hidden]{display:none;}
.lightbox figure{margin:0;max-width:94vw;text-align:center;}
.lightbox img{max-width:94vw;max-height:82vh;width:auto;margin:0 auto;}
.lightbox figcaption{color:#ddd5ee;font-size:13px;margin-top:10px;}
.lightbox button{position:absolute;background:none;border:0;color:#fff;font-size:34px;line-height:1;cursor:pointer;padding:14px;}
.lb-close{top:6px;right:8px;}
.lb-prev{left:2px;top:50%;transform:translateY(-50%);}
.lb-next{right:2px;top:50%;transform:translateY(-50%);}

@media(max-width:720px){
  .eyebrow{font-size:10px;letter-spacing:.22em;}
  .wish-lead{font-size:18px;letter-spacing:.04em;}
  .site-header-inner{padding:14px 18px;} .site-logo{font-size:15px;} .site-back{font-size:11px;padding:8px 14px;}
  .entry{padding-left:30px;}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important;}}

/* ---- 言語切替・英語ページ ---- */
.hdr-right{display:flex;align-items:center;gap:10px;}
.lang{font-size:12px;letter-spacing:.12em;color:var(--ink-soft);display:flex;gap:2px;}
.lang a,.lang span{padding:8px 8px;text-decoration:none;}
.lang span{color:var(--kikyo-deep);border-bottom:1px solid var(--kikyo);}
.ja-only{font-size:14px;color:var(--ink-quiet);margin-top:10px;}
.ja-only a{color:var(--kikyo);}
html[lang="en"] body{letter-spacing:.01em;}
html[lang="en"] .entry-body,html[lang="en"] .wish,html[lang="en"] .plan p,html[lang="en"] .origin-body,html[lang="en"] .info dd{
  font-family:var(--serif-en),var(--serif-jp);font-size:17px;line-height:1.75;}
html[lang="en"] .plan h3,html[lang="en"] .entry-card h3,html[lang="en"] .info dt{font-family:var(--serif-en),var(--serif-jp-display);font-size:20px;letter-spacing:.02em;font-weight:500;}
html[lang="en"] .sec-head h2{letter-spacing:.2em;}
html[lang="en"] .hero-sub,html[lang="en"] .hero-kicker{letter-spacing:.18em;}
html[lang="en"] .hero-lead{font-family:var(--serif-en),var(--serif-jp);font-size:clamp(17px,2.2vw,19px);line-height:1.7;}
html[lang="en"] .wish-lead{font-family:var(--serif-en);font-style:italic;letter-spacing:.02em;}
.link-card{margin-top:22px;display:block;background:var(--kikyo-mist);border:1px solid var(--kikyo-line);padding:16px 18px;text-decoration:none;font-size:14px;color:var(--kikyo-deep);}
.link-card b{font-weight:500;}
.subsidy{margin-top:22px;font-size:13px;color:var(--ink-quiet);border-top:1px solid var(--line-soft);padding-top:16px;line-height:1.9;}
@media(max-width:720px){ .lang a,.lang span{padding:8px 5px;} .hdr-right{gap:4px;} }

/* ---- 漢字名 ---- */
.hero-title{letter-spacing:.3em;padding-left:.3em;}
.hero-yomi{margin-top:4px;font-family:var(--serif-jp-display);font-size:clamp(14px,2vw,17px);letter-spacing:.6em;padding-left:.6em;color:#cbbfe6;}
html[lang="en"] .hero-yomi{letter-spacing:.3em;padding-left:.3em;font-family:var(--serif-en);font-style:italic;}
.hero-date{margin-top:22px;font-size:13px;letter-spacing:.16em;color:#ddd5ee;}
.origin-word .kan-big{font-family:var(--serif-jp-display);font-size:34px;letter-spacing:.2em;color:var(--kikyo-deep);}
@media(max-width:720px){ .hero-date{font-size:12px;letter-spacing:.06em;} }
.origin-word .kan-big + .kana{font-size:16px;letter-spacing:.3em;color:var(--ink-quiet);}

/* ---- 英語ページの詰め ---- */
.lang a,.lang span{white-space:nowrap;}
.hero-date span{display:inline-block;}
html[lang="en"] .site-logo{letter-spacing:.06em;white-space:nowrap;}
html[lang="en"] .site-back{letter-spacing:.08em;}
html[lang="en"] .hero-kicker{letter-spacing:.08em;padding-left:0;}
html[lang="en"] .hero-sub{letter-spacing:.06em;padding-left:0;}
html[lang="en"] .hero-down{letter-spacing:.08em;}
html[lang="en"] .hero-date{letter-spacing:.04em;}
@media(max-width:720px){
  html[lang="en"] .hero-sub::before,html[lang="en"] .hero-sub::after{display:none;}
  html[lang="en"] .site-logo{font-size:14px;}
  .hero-date span{display:block;}
  .hero-date .sep{display:none;}
}
.link-card[hidden]{display:none;}
.info dl > :nth-last-child(-n+2){border-bottom:0;}
