/* ═══════════════════════════════════════════════════════════
   はつ旅 共通UI ── site.css
   ・左：アクティビティ空き状況ドック（常駐）
   ・右：AIコンシェルジュ（常駐）
   ・上：ヘアラインのヘッダー
   影を使わず、罫線・余白・書体で構成する。
   ═══════════════════════════════════════════════════════════ */

:root{
  --hd-h: 66px;
  --ok:#2F6F52;
  --few:#9A7A22;
  --full:#9E3838;
  --none:#A29B8D;
  --dock-w: 400px;
}

/* ── Header ───────────────────────────────────────────── */
.site-hd{
  position:fixed;top:0;left:0;right:0;z-index:900;height:var(--hd-h);
  display:flex;align-items:center;background:transparent;
  border-bottom:1px solid transparent;
  transition:background .4s ease, border-color .4s ease;
}
.site-hd.solid{background:rgba(20,17,13,.9);backdrop-filter:blur(12px);
  border-bottom-color:rgba(240,234,222,.16);}
.site-hd .inner{max-width:1240px;margin:0 auto;padding:0 32px;width:100%;
  display:flex;align-items:center;justify-content:space-between;gap:20px;}
.site-hd .brand{font-family:"Cormorant Garamond",serif;font-size:23px;letter-spacing:.01em;
  color:#F4F0E7;text-decoration:none;white-space:nowrap;line-height:1.1;}
.site-hd .brand small{display:block;font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.34em;
  text-transform:uppercase;color:#A9A296;margin-top:3px;font-weight:500;}
.site-hd nav{display:flex;align-items:center;gap:30px;}
.site-hd nav a{font-family:"Inter",sans-serif;font-size:14px;font-weight:500;letter-spacing:.09em;
  color:#DDD7CA;text-decoration:none;white-space:nowrap;transition:color .2s ease;}
.site-hd nav a:hover{color:#D9B25A;}
.site-hd .cta-sm{padding:0 0 3px;border:0;border-bottom:1px solid #D9B25A;
  font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#D9B25A;}
.site-hd .cta-sm:hover{color:#F4F0E7;border-bottom-color:#F4F0E7;}
.site-hd .lang{font-size:12.5px;letter-spacing:.12em;color:#A9A296;text-decoration:none;
  padding-left:24px;border-left:1px solid rgba(240,234,222,.2);}
.site-hd .lang:hover{color:#D9B25A;}
.site-hd .burger{display:none;background:none;border:0;cursor:pointer;padding:6px;}
.site-hd .burger span{display:block;width:22px;height:1px;background:#F4F0E7;margin:6px 0;transition:.3s;}
@media (max-width:1080px){
  .site-hd nav{position:fixed;inset:var(--hd-h) 0 auto 0;flex-direction:column;align-items:flex-start;
    gap:0;background:rgba(20,17,13,.98);backdrop-filter:blur(12px);padding:0 32px;
    max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease;}
  .site-hd nav.open{max-height:80vh;padding:12px 32px 28px;}
  .site-hd nav a,.site-hd .cta-sm,.site-hd .lang{width:100%;padding:16px 0;border:0;
    border-bottom:1px solid rgba(240,234,222,.12);text-align:left;}
  .site-hd .burger{display:block;}
  .site-hd .burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .site-hd .burger.open span:nth-child(2){opacity:0;}
  .site-hd .burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
}

/* ═══ 背景スクリム（各ドック共通） ════════════════════ */
.dock-scrim{
  position:fixed;inset:0;z-index:944;background:rgba(20,16,10,.42);
  opacity:0;pointer-events:none;transition:opacity .4s ease;
}
.dock-scrim.on{opacity:1;pointer-events:auto;}

@media (max-width:520px){
  .ai-fab{padding:24px 13px;}
  .v-lb .ch{font-size:15.5px;}
}

/* ═══ 右：AIコンシェルジュ ══════════════════════════════ */
.ai-fab{
  position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:940;
  display:flex;flex-direction:column;align-items:center;gap:16px;
  padding:32px 16px;border:0;cursor:pointer;
  background:#20190F;color:#F4F0E7;font:inherit;
  transition:background .25s ease,padding .25s ease;
}
.ai-fab:hover{background:#C4632B;padding-right:22px;}
.ai-fab:focus-visible{outline:2px solid #D9B25A;outline-offset:2px;}
.ai-fab .dot{width:9px;height:9px;border-radius:50%;background:#7FD3A3;
  box-shadow:0 0 0 0 rgba(127,211,163,.7);animation:dockPulse 2.6s infinite;flex-shrink:0;}
.ai-fab.hidden{opacity:0;pointer-events:none;}

.ai-panel{
  position:fixed;right:0;top:0;bottom:0;z-index:945;
  width:var(--dock-w);max-width:92vw;
  display:flex;flex-direction:column;background:#FBF9F4;
  border-left:1px solid rgba(32,25,15,.14);
  transform:translateX(100%);transition:transform .42s cubic-bezier(.4,0,.2,1);
}
.ai-panel.open{transform:none;}
.ai-panel .hd{display:flex;align-items:center;gap:12px;padding:22px 24px;
  background:#20190F;color:#F4F0E7;flex-shrink:0;}
.ai-panel .hd .av{width:32px;height:32px;border-radius:50%;background:#C4632B;
  display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.ai-panel .hd .t{flex:1;min-width:0;}
.ai-panel .hd .t b{display:block;font-size:15.5px;font-weight:500;letter-spacing:.02em;}
.ai-panel .hd .t small{font-size:12px;color:#A9A296;display:flex;align-items:center;gap:6px;letter-spacing:.03em;}
.ai-panel .hd .t small::before{content:"";width:5px;height:5px;border-radius:50%;background:#7FD3A3;}
.ai-panel .hd button{background:none;border:0;color:#A9A296;cursor:pointer;padding:6px;font-size:23px;line-height:1;}
.ai-panel .hd button:hover{color:#FFF;}

.ai-log{flex:1;overflow-y:auto;padding:24px 24px;background:#FBF9F4;}
.ai-msg{display:flex;margin-bottom:13px;}
.ai-msg .bub{max-width:83%;padding:12px 15px;font-size:15.5px;line-height:1.7;
  white-space:pre-wrap;word-break:break-word;}
.ai-msg.bot .bub{background:#FFF;color:#20190F;border:1px solid rgba(32,25,15,.1);}
.ai-msg.me{justify-content:flex-end;}
.ai-msg.me .bub{background:#20190F;color:#F4F0E7;}
.ai-typing{display:flex;gap:5px;padding:14px 16px;}
.ai-typing i{width:6px;height:6px;border-radius:50%;background:#C4BDB0;animation:aiBlink 1.3s infinite;}
.ai-typing i:nth-child(2){animation-delay:.18s;} .ai-typing i:nth-child(3){animation-delay:.36s;}
@keyframes aiBlink{0%,60%,100%{opacity:.3;}30%{opacity:1;}}

.ai-chips{display:flex;flex-wrap:wrap;gap:7px;padding:0 24px 16px;background:#FBF9F4;}
.ai-chips button{padding:9px 13px;border:1px solid rgba(32,25,15,.14);background:#FFF;
  cursor:pointer;font:inherit;font-size:13px;color:#4A453C;transition:all .2s ease;text-align:left;}
.ai-chips button:hover{border-color:#C4632B;color:#C4632B;}

.ai-in{display:flex;gap:10px;padding:16px 22px;border-top:1px solid rgba(32,25,15,.1);background:#FFF;flex-shrink:0;}
.ai-in input{flex:1;min-width:0;padding:11px 14px;border:1px solid rgba(32,25,15,.16);
  font:inherit;font-size:15.5px;color:#20190F;background:#FBF9F4;}
.ai-in input:focus{outline:none;border-color:#C4632B;background:#FFF;}
.ai-in button{width:42px;height:42px;flex-shrink:0;border:0;cursor:pointer;
  background:#C4632B;color:#FFF;font-size:18.5px;display:flex;align-items:center;justify-content:center;}
.ai-in button:disabled{opacity:.4;cursor:default;}
.ai-note{padding:0 22px 16px;font-size:11.5px;color:#9A9385;text-align:center;background:#FFF;line-height:1.5;}

@media (max-width:520px){
  .ai-panel{width:100vw;max-width:100vw;border-left:0;}
  .ai-fab{padding:24px 13px;}
}
@media (prefers-reduced-motion:reduce){
  .ai-fab .dot,.ai-typing i{animation:none;}
  .site-hd,.ai-fab,.dock-scrim{transition:none;}
}

/* ═══════════════════════════════════════════════════════════
   追加：上＝パッケージプラン ／ 下＝宿泊施設の空き状況
   左＝アクティビティ空き状況、右＝AIコンシェルジュ と合わせて
   画面の四辺に「旅程を組む要素」を常駐させる。
   ═══════════════════════════════════════════════════════════ */

/* ── 上：パッケージプラン ─────────────────────────────── */
.pk-tab{
  position:fixed;top:var(--hd-h);left:50%;transform:translateX(-50%);z-index:930;
  display:flex;align-items:center;gap:11px;
  padding:16px 34px;border:0;cursor:pointer;
  background:#20190F;color:#F4F0E7;font:inherit;
  font-size:17px;font-weight:500;letter-spacing:.22em;white-space:nowrap;
  transition:background .25s ease,padding .25s ease;
}
.pk-tab:hover{background:#C4632B;padding-bottom:22px;}
.pk-tab:focus-visible{outline:2px solid #D9B25A;outline-offset:2px;}
.pk-tab .live{width:9px;height:9px;border-radius:50%;background:#D9B25A;flex-shrink:0;}
.pk-tab.hidden{opacity:0;pointer-events:none;}

.pk{
  position:fixed;top:0;left:0;right:0;z-index:935;
  background:#FBF9F4;border-bottom:1px solid rgba(32,25,15,.16);
  transform:translateY(-100%);transition:transform .44s cubic-bezier(.4,0,.2,1);
  max-height:100svh;overflow-y:auto;
}
.pk.open{transform:none;}
.pk .inner{max-width:1240px;margin:0 auto;padding:34px 32px 38px;}
.pk .hd{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  padding-bottom:24px;border-bottom:1px solid rgba(32,25,15,.12);margin-bottom:30px;}
.pk .hd .lbl{font-family:"Inter",sans-serif;font-size:11px;font-weight:600;letter-spacing:.3em;
  text-transform:uppercase;color:#9E7B3C;}
.pk .hd h2{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:34px;
  line-height:1.2;color:#20190F;margin:9px 0 0;letter-spacing:-.012em;}
.pk .hd .sub{font-size:14.5px;color:#8A8478;margin-top:8px;line-height:1.7;max-width:44em;}
.pk .hd button{background:none;border:0;color:#8A8478;cursor:pointer;font-size:26px;
  line-height:1;padding:4px 6px;flex-shrink:0;}
.pk .hd button:hover{color:#20190F;}

.pk .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
.pk .card{display:flex;flex-direction:column;}
.pk .card .img{height:170px;overflow:hidden;margin-bottom:20px;background:#EAE3D4;}
.pk .card .img img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.92);transition:filter .5s ease,transform .7s ease;}
.pk .card:hover .img img{filter:saturate(1);transform:scale(1.03);}
.pk .card .meta{display:flex;align-items:center;gap:12px;
  font-family:"Inter",sans-serif;font-size:11px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:#C4632B;margin-bottom:10px;}
.pk .card .meta .nights{color:#8A8478;letter-spacing:.14em;}
.pk .card h3{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:26px;
  line-height:1.3;color:#20190F;margin:0 0 12px;letter-spacing:-.01em;}
.pk .card p{font-size:15.5px;color:#6B6558;line-height:1.85;margin:0 0 18px;flex:1;}
.pk .card .rail{display:flex;flex-direction:column;gap:7px;margin-bottom:20px;
  padding-top:16px;border-top:1px solid rgba(32,25,15,.1);}
.pk .card .rail span{display:flex;align-items:baseline;gap:10px;font-size:14px;color:#5A554A;line-height:1.6;}
.pk .card .rail span b{font-family:"Inter",sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;
  color:#9E7B3C;min-width:44px;flex-shrink:0;text-transform:uppercase;}
.pk .card .go{
  font-family:"Inter",sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:#C4632B;text-decoration:none;border-bottom:1px solid rgba(196,99,43,.4);
  padding-bottom:3px;align-self:flex-start;transition:border-color .2s ease;
}
.pk .card .go:hover{border-bottom-color:#C4632B;}
.pk .ft{margin-top:32px;padding-top:20px;border-top:1px solid rgba(32,25,15,.1);
  font-size:13px;color:#8A8478;line-height:1.75;}

@media (max-width:900px){ .pk .grid{grid-template-columns:1fr;gap:34px;} .pk .card .img{height:190px;} }

/* ── 下：宿泊施設の空き状況 ───────────────────────────── */
.st-tab{
  position:fixed;left:50%;bottom:0;transform:translateX(-50%);z-index:930;
  display:flex;align-items:center;gap:11px;
  padding:18px 34px;border:0;cursor:pointer;
  background:#20190F;color:#F4F0E7;font:inherit;
  font-size:17px;font-weight:500;letter-spacing:.22em;white-space:nowrap;
  transition:background .25s ease,padding .25s ease;
}
.st-tab:hover{background:#C4632B;padding-top:25px;}
.st-tab:focus-visible{outline:2px solid #D9B25A;outline-offset:2px;}
.st-tab .live{width:9px;height:9px;border-radius:50%;background:#7FD3A3;
  box-shadow:0 0 0 0 rgba(127,211,163,.7);animation:dockPulse 2.6s infinite;flex-shrink:0;}
.st-tab.hidden{opacity:0;pointer-events:none;}

.stay-dock{
  position:fixed;left:0;right:0;bottom:0;z-index:945;
  background:#FBF9F4;border-top:1px solid rgba(32,25,15,.16);
  transform:translateY(100%);transition:transform .44s cubic-bezier(.4,0,.2,1);
  max-height:82svh;display:flex;flex-direction:column;
}
.stay-dock.open{transform:none;}
.stay-dock .hd{max-width:1240px;margin:0 auto;width:100%;padding:26px 32px 18px;
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-shrink:0;}
.stay-dock .hd .lbl{font-family:"Inter",sans-serif;font-size:11px;font-weight:600;letter-spacing:.3em;
  text-transform:uppercase;color:#9E7B3C;}
.stay-dock .hd h2{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:32px;
  line-height:1.2;color:#20190F;margin:9px 0 0;letter-spacing:-.012em;}
.stay-dock .hd .sub{font-size:14.5px;color:#7A3232;margin-top:9px;line-height:1.65;max-width:46em;}
.stay-dock .hd .sub strong{font-weight:600;}
.stay-dock .hd button{background:none;border:0;color:#8A8478;cursor:pointer;font-size:26px;
  line-height:1;padding:4px 6px;flex-shrink:0;}
.stay-dock .hd button:hover{color:#20190F;}

.stay-dock .body{flex:1;overflow-y:auto;}
.stay-dock .inner{max-width:1240px;margin:0 auto;padding:0 32px 8px;}
.stay-dock .area{margin-bottom:8px;}
.stay-dock .area > h3{
  font-family:"Inter",sans-serif;font-size:11px;font-weight:600;letter-spacing:.26em;
  text-transform:uppercase;color:#9E7B3C;padding:16px 0 10px;
  border-bottom:1px solid rgba(32,25,15,.12);margin:0 0 4px;
}
.stay-dock table{width:100%;border-collapse:collapse;}
.stay-dock th,.stay-dock td{padding:13px 8px;font-size:15px;border-bottom:1px solid rgba(32,25,15,.07);}
.stay-dock thead th{font-family:"Inter",sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.02em;
  color:#8A8478;text-align:center;padding:10px 8px;}
.stay-dock thead th b{display:block;font-size:14.5px;font-weight:500;color:#20190F;}
.stay-dock thead th.sat b{color:#3A6B8A;} .stay-dock thead th.sun b{color:#9E3838;}
.stay-dock thead th:first-child{text-align:left;}
.stay-dock tbody th{text-align:left;font-weight:500;color:#20190F;min-width:210px;}
.stay-dock tbody th a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(196,99,43,.3);}
.stay-dock tbody th a:hover{color:#C4632B;}
.stay-dock tbody th .op{display:block;font-size:12px;color:#9A9385;font-weight:400;margin-top:3px;}
.stay-dock td{text-align:center;}
.stay-dock .st{display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;font-size:16px;font-weight:600;}
.stay-dock .st.ok{color:var(--ok);background:rgba(47,111,82,.08);}
.stay-dock .st.few{color:var(--few);background:rgba(154,122,34,.1);}
.stay-dock .st.full{color:var(--full);background:rgba(158,56,56,.07);}
.stay-dock .st.none{color:var(--none);}
.stay-dock .direct{
  font-family:"Inter",sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:#C4632B;text-decoration:none;border-bottom:1px solid rgba(196,99,43,.4);
  padding-bottom:2px;white-space:nowrap;}
.stay-dock .direct:hover{border-bottom-color:#C4632B;}
.stay-dock .ft{background:#F5F2EA;border-top:1px solid rgba(32,25,15,.12);flex-shrink:0;}
.stay-dock .ft .inner{padding:16px 32px;}
.stay-dock .legend{display:flex;flex-wrap:wrap;gap:14px 20px;margin-bottom:10px;font-size:12.5px;color:#6B6558;}
.stay-dock .legend span{display:inline-flex;align-items:center;gap:6px;}
.stay-dock .legend i{font-style:normal;font-weight:600;font-size:14.5px;}
.stay-dock .notes{font-size:12.5px;color:#8A8478;line-height:1.7;}
.stay-dock .notes strong{font-weight:600;color:#5A554A;}
.stay-dock .scroll{overflow-x:auto;}

@media (max-width:760px){
  .stay-dock table{min-width:640px;}
  .st-tab,.pk-tab{font-size:15px;letter-spacing:.14em;padding-left:22px;padding-right:22px;}
}

/* ═══════════════════════════════════════════════════════════
   中央モーダル：旅行会社の方へ（B2B問い合わせ）
   四辺の常駐UIとは別に、CTAから開くフォーカスされた導線。
   影は使わず、罫線・余白・書体で構成する（他UIと同じ原則）。
   ═══════════════════════════════════════════════════════════ */
.ct-modal{
  position:fixed;inset:0;z-index:950;
  display:flex;align-items:flex-start;justify-content:center;
  padding:calc(var(--hd-h) + 26px) 20px 44px;
  overflow-y:auto;opacity:0;pointer-events:none;
  transition:opacity .34s ease;
}
.ct-modal.open{opacity:1;pointer-events:auto;}
.ct-card{
  position:relative;width:100%;max-width:600px;margin:auto;
  background:#FBF9F4;border:1px solid rgba(32,25,15,.16);
  padding:46px 46px 40px;
  transform:translateY(14px);transition:transform .34s cubic-bezier(.4,0,.2,1);
}
.ct-modal.open .ct-card{transform:none;}
.ct-x{position:absolute;top:18px;right:20px;background:none;border:0;
  color:#8A8478;cursor:pointer;font-size:30px;line-height:1;padding:4px 6px;}
.ct-x:hover{color:#20190F;}

.ct-hd{margin-bottom:28px;padding-right:26px;}
.ct-hd .lbl{font-family:"Inter",sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.3em;text-transform:uppercase;color:#9E7B3C;}
.ct-hd h2{font-family:"Cormorant Garamond",serif;font-weight:600;
  font-size:clamp(28px,4.6vw,37px);line-height:1.24;color:#20190F;
  margin:10px 0 13px;letter-spacing:-.012em;}
.ct-hd .sub{font-size:15.5px;color:#6B6558;line-height:1.85;max-width:44em;}

.ct-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px;}
.ct-grid .f{display:flex;flex-direction:column;gap:7px;}
.ct-grid .f.full{grid-column:1 / -1;}
.ct-grid .f > span{font-family:"Inter",sans-serif;font-size:12.5px;font-weight:600;
  letter-spacing:.08em;color:#5A554A;text-transform:uppercase;
  display:flex;align-items:center;gap:8px;}
.ct-grid .f > span i{font-style:normal;font-size:10.5px;font-weight:600;letter-spacing:.06em;
  color:#C4632B;background:rgba(196,99,43,.08);padding:2px 7px;text-transform:none;}
.ct-grid input,.ct-grid select,.ct-grid textarea{
  font:inherit;font-size:16px;color:#20190F;background:#FFF;
  border:1px solid rgba(32,25,15,.18);padding:12px 14px;width:100%;
  border-radius:0;-webkit-appearance:none;appearance:none;
  transition:border-color .2s ease;
}
.ct-grid select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%238A8478' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;cursor:pointer;}
.ct-grid textarea{resize:vertical;min-height:96px;line-height:1.7;}
.ct-grid input:focus,.ct-grid select:focus,.ct-grid textarea:focus{
  outline:none;border-color:#C4632B;}

.ct-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.ct-consent{font-size:12.5px;color:#8A8478;line-height:1.75;margin:16px 0 0;}
.ct-error{font-size:14.5px;color:#9E3838;line-height:1.7;margin:14px 0 0;
  background:rgba(158,56,56,.06);padding:11px 14px;border-left:2px solid #9E3838;}
.ct-error a{color:#9E3838;font-weight:600;}

.ct-send{margin-top:22px;width:100%;padding:15px 20px;border:0;cursor:pointer;
  background:#20190F;color:#F4F0E7;font:inherit;font-size:14.5px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;transition:background .25s ease;}
.ct-send:hover{background:#C4632B;}
.ct-send:disabled{opacity:.5;cursor:default;}

.ct-ok{text-align:center;padding:28px 10px 16px;}
.ct-ok .tick{width:54px;height:54px;margin:0 auto 20px;border-radius:50%;
  background:rgba(47,111,82,.1);color:var(--ok);display:flex;
  align-items:center;justify-content:center;font-size:29px;}
.ct-ok h3{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:30px;
  color:#20190F;margin:0 0 12px;}
.ct-ok p{font-size:16px;color:#6B6558;line-height:1.85;max-width:34em;margin:0 auto;}

@media (max-width:560px){
  .ct-card{padding:38px 22px 32px;}
  .ct-grid{grid-template-columns:1fr;}
  .ct-modal{padding:calc(var(--hd-h) + 14px) 12px 28px;}
}
@media (prefers-reduced-motion:reduce){
  .ct-modal,.ct-card{transition:none;}
}

/* ═══════════════════════════════════════════════════════════
   新仕様（v2）：四辺タブ廃止 → 下部集約バー + AIマスコットバッジ
   全ページ共通。既存定義より後に置くことで上書きする。
   ═══════════════════════════════════════════════════════════ */

/* ── Info docks & stay picks ── */
.stay-dock .st-picks{margin-bottom:26px;}
.stay-dock .pick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.stay-dock .pick{display:flex;flex-direction:column;gap:7px;padding:16px 18px;border:1px solid #E4DCC9;
  border-radius:8px;background:#FCFAF4;text-decoration:none;color:#20190F;transition:border-color .2s;}
.stay-dock .pick:hover{border-color:#B8912E;}
.stay-dock .pick .k{font-family:"Inter",sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.24em;
  text-transform:uppercase;color:#B8912E;}
.stay-dock .pick strong{font-family:"Cormorant Garamond","Shippori Mincho B1",serif;font-size:21px;font-weight:600;line-height:1.3;}
html[lang="ja"] .stay-dock .pick strong{font-family:"Shippori Mincho B1",serif;font-size:18.5px;}
.stay-dock .pick p{margin:0;font-size:14px;line-height:1.85;color:#5A5344;}
@media (max-width:860px){.stay-dock .pick-grid{grid-template-columns:1fr;}}

/* ═══ 全デバイス共通：四辺タブ→下部集約バー + AI単独バッジ ═══ */
/* 旧・四辺固定タブは全幅で廃止 */
.pk-tab,.st-tab{display:none !important;}

/* Packages / Experiences / Where to stay を
   すべて「下から出るボトムシート」に統一 */
.pk{
  left:0;right:0;top:auto;bottom:0;width:100%;max-width:100vw;
  max-height:86svh;border-right:0;border-bottom:0;
  border-top:1px solid rgba(32,25,15,.16);
  border-radius:16px 16px 0 0;overflow:hidden;
  transform:translateY(100%);
  /* ボトムシート化に伴い、下部バー(940)とスクリム(944)より前面に出す。
     935のままだと画面下部で下部バーがシートの上に重なり、
     その範囲のタップがバー側に吸われて誤動作する（iPhone Safariで顕著）。 */
  z-index:945;
}
.pk.open{transform:none;}
.pk{overflow-y:auto;}
.stay-dock{
  left:0;right:0;top:auto;bottom:0;width:100%;max-width:100vw;
  max-height:86svh;border-left:0;border-top:1px solid rgba(32,25,15,.16);
  border-radius:16px 16px 0 0;transform:translateY(100%);
}
.stay-dock.open{transform:none;}

/* AIコンシェルジュ：下部バーの上に独立配置 */
.ai-fab{
  top:auto;bottom:96px;right:22px;transform:none;
  width:132px;height:154px;padding:0;border-radius:20px;
  background:#FBF9F4;border:3px solid var(--gold-soft,#D9B25A);
  box-shadow:0 8px 22px rgba(0,0,0,.32);
  flex-direction:row;gap:0;overflow:visible;
}
.ai-fab:hover{transform:scale(1.04);}
.ai-fab .mascot{width:100%;height:100%;object-fit:contain;padding:8px;display:block;}
.ai-fab .live{position:absolute;top:10px;right:10px;width:11px;height:11px;border-radius:50%;
  background:#7FD3A3;box-shadow:0 0 0 0 rgba(127,211,163,.7);animation:dockPulse 2.6s infinite;}

/* 下部集約バー */
.quick-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:940;
  display:flex;background:#20190F;border-top:1px solid rgba(240,234,222,.14);
  padding-bottom:env(safe-area-inset-bottom,0);
}
.quick-bar button{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:14px 6px 16px;border:0;background:none;color:#F4F0E7;font:inherit;
  font-size:14px;font-weight:600;letter-spacing:.06em;cursor:pointer;
  border-right:1px solid rgba(240,234,222,.1);transition:background .2s ease;
}
.quick-bar button:last-child{border-right:0;}
.quick-bar button:hover{background:rgba(240,234,222,.07);}
.quick-bar button .dot{width:8px;height:8px;border-radius:50%;background:#7FD3A3;}
.quick-bar button.qb-pk .dot{background:#D9B25A;}
body.nav-open .ai-fab,body.nav-open .quick-bar{opacity:0;pointer-events:none;}

@media (max-width:1080px){
  .ai-fab{bottom:150px;right:14px;width:118px;height:136px;border-radius:18px;
    box-shadow:0 6px 18px rgba(0,0,0,.28);}
  .ai-fab:hover{transform:none;}
  .ai-fab .mascot{padding:6px;}
  .quick-bar button{padding:11px 4px 13px;font-size:12px;letter-spacing:.03em;gap:4px;}
}
@media (max-width:380px){
  .quick-bar button{font-size:11px;padding:10px 2px 12px;}
}

/* ═══════════════════════════════════════════════════════════
   v2.1：下部バー強調 ／ イベントドック ／ About セクション
   ═══════════════════════════════════════════════════════════ */

/* ── 下部集約バー：文字を大きく、アイコン付きで目立たせる ── */
.quick-bar button{
  flex-direction:column;gap:7px;padding:16px 8px 18px;
  font-size:16px;font-weight:600;letter-spacing:.05em;
}
.quick-bar button .ico{display:block;width:26px;height:26px;color:var(--gold-soft,#D9B25A);}
.quick-bar button .ico svg{width:100%;height:100%;display:block;}
.quick-bar button .lb{display:block;line-height:1.3;}
.quick-bar button:hover .ico{color:#F0CC7A;}
.quick-bar button.qb-pk .ico{color:#E8B96A;}
@media (max-width:1080px){
  .quick-bar button{padding:12px 5px 14px;font-size:14px;gap:5px;}
  .quick-bar button .ico{width:22px;height:22px;}
}
@media (max-width:380px){
  .quick-bar button{font-size:12px;padding:10px 3px 12px;gap:4px;}
  .quick-bar button .ico{width:19px;height:19px;}
}

/* ── イベントドック ── */
.stay-dock .ev-list{display:flex;flex-direction:column;gap:2px;}
.stay-dock .ev{
  display:grid;grid-template-columns:8.5em 1fr;gap:18px;align-items:start;
  padding:18px 4px;border-bottom:1px solid #E4DCC9;text-decoration:none;color:#20190F;
  transition:background .2s ease;
}
.stay-dock a.ev:hover{background:#FCFAF4;}
.stay-dock .ev-date{
  font-family:"Inter",sans-serif;font-size:13px;font-weight:600;letter-spacing:.12em;
  color:#B8912E;padding-top:3px;
}
.stay-dock .ev-body strong{
  display:block;font-family:"Cormorant Garamond","Shippori Mincho B1",serif;
  font-size:21px;font-weight:600;line-height:1.4;margin-bottom:4px;
}
html[lang="ja"] .stay-dock .ev-body strong{font-family:"Shippori Mincho B1",serif;font-size:18.5px;}
.stay-dock .ev-place{
  display:inline-block;font-size:12.5px;color:#8A8478;letter-spacing:.04em;margin-bottom:6px;
}
.stay-dock .ev-body p{margin:0;font-size:14.5px;line-height:1.85;color:#5A5344;}
@media (max-width:640px){
  .stay-dock .ev{grid-template-columns:1fr;gap:6px;}
}

/* ── About セクション（フッター直前） ── */
.about-sec{
  padding:clamp(52px,8vh,86px) 0;
  background:#141d33;color:#EDE7DA;
  border-top:1px solid rgba(217,178,90,.22);
}
body.mountain .about-sec,.about-sec.mountain{background:#1E3A2E;}
.about-sec .wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,40px);}
.about-sec .ab-lbl{
  font-family:"Inter",sans-serif;font-size:12px;font-weight:600;letter-spacing:.3em;
  text-transform:uppercase;color:var(--gold-soft,#D9B25A);margin-bottom:14px;
}
.about-sec h2{
  font-family:"Cormorant Garamond","Shippori Mincho B1",serif;font-weight:500;
  font-size:clamp(25px,3.22vw,37px);line-height:1.5;margin-bottom:14px;color:#F4EFE4;
}
html[lang="ja"] .about-sec h2{font-family:"Shippori Mincho B1",serif;}
.about-sec .ab-lead{
  font-size:16px;line-height:2;color:#A9B0C2;max-width:40em;margin-bottom:32px;
}
.ab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;}
.ab-card{
  position:relative;display:flex;flex-direction:column;gap:8px;
  padding:20px 20px 44px;text-decoration:none;
  background:rgba(255,255,255,.035);border:1px solid rgba(237,231,218,.13);
  border-radius:4px;transition:border-color .25s ease,background .25s ease;
}
.ab-card:hover{border-color:rgba(217,178,90,.5);background:rgba(255,255,255,.06);}
.ab-kind{
  align-self:flex-start;font-family:"Inter",sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;padding:3px 9px;border-radius:3px;
  background:rgba(217,178,90,.16);color:var(--gold-soft,#D9B25A);
}
.ab-kind.youtube{background:rgba(224,64,64,.16);color:#F08A8A;}
.ab-kind.instagram{background:rgba(200,80,150,.16);color:#E6A0CC;}
.ab-card strong{
  font-family:"Cormorant Garamond","Shippori Mincho B1",serif;font-size:22px;font-weight:600;
  color:#F4EFE4;line-height:1.4;
}
html[lang="ja"] .ab-card strong{font-family:"Shippori Mincho B1",serif;font-size:19px;}
.ab-card p{margin:0;font-size:14.5px;line-height:1.85;color:#A9B0C2;}
.ab-go{
  position:absolute;right:20px;bottom:16px;color:var(--gold-soft,#D9B25A);
  font-size:18.5px;transition:transform .25s ease;
}
.ab-card:hover .ab-go{transform:translateX(5px);}
.about-sec .ab-note{margin-top:26px;font-size:13px;color:#7C8496;line-height:1.9;}

/* ═══════════════════════════════════════════════════════════
   v2.2：厳島神社の写真は、社殿・鳥居に文字を重ねない
   ─────────────────────────────────────────────────────────
   ・写真の被写体（社殿・鳥居）を画面の上半分に寄せる
   ・見出し・本文は下半分の「水面」エリアにのみ配置する
   ・下部の階調を強め、白文字の可読性を担保する
   ═══════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────
   v28：写真と文字の領域を分ける
   これまでは object-position で被写体を上へ逃がし、階調を重ねて
   文字を読ませていた。しかし社殿・鳥居・人物は画面の縦方向に
   大きく広がるため、画面比が変わると必ずどこかで文字が乗る。
   逃がし方を調整し続けるのをやめ、重ならない構造にする。

   ヒーローを縦2段のフレックスにする。
   ・下段（文字）が必要な高さを先に取る
   ・上段（写真）が残りをすべて使う
   写真の高さを％で決め打ちしないので、文字量や画面比が変わっても
   文字が写真に食い込むことがない。
   写真の下端は地色へ溶かし、継ぎ目が出ないようにしている。
   ─────────────────────────────────────────────────────────── */

header.hero{
  /* .hero photo の photo が画像プレースホルダ枠(.photo)を拾うことがあるため、
     枠・余白・中央揃えをここで打ち消しておく */
  padding:0 !important;
  border:0 !important;
  text-align:left !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-end !important;
  min-height:100svh;
  background-color:var(--hero-ground,#0A1024);
}

/* 上段：写真。残りの高さをすべて使う */
header.hero .hero-media,
header.hero > .bg{
  position:relative !important;
  inset:auto !important;
  flex:1 1 auto !important;
  min-height:26vh;
  width:100%;
  overflow:hidden;
}

/* 被写体は素直に中央基準へ。もう上へ逃がす必要がない */
header.hero .hero-media img,
header.hero .hero-media .layer,
header.hero > .bg img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;
  object-position:center 44% !important;
}

/* 階調は最小限に。上はヘッダーの可読性、下は地色への接続だけ。
   下端を地色と同じ値で閉じるので、写真と文字面の境目が見えない */
header.hero .hero-media::after,
header.hero > .bg::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,
    rgba(8,11,22,.60) 0%,
    rgba(8,11,22,.18) 20%,
    rgba(8,11,22,.04) 46%,
    rgba(8,11,22,.34) 82%,
    var(--hero-ground,#0A1024) 100%) !important;
}

/* 下段：文字。無地の上に置く */
header.hero > .wrap{
  position:relative;z-index:2;
  flex:0 0 auto !important;
  width:100%;
  padding-top:clamp(26px,3.6vh,44px) !important;
  padding-bottom:clamp(104px,13vh,148px) !important;
  margin-top:0 !important;
}
header.hero > .wrap h1,
header.hero > .wrap p.lead,
header.hero > .wrap .eyebrow,
header.hero > .wrap .scroll-cue{
  text-align:left !important;margin-left:0 !important;margin-right:auto !important;
}

/* 無地の上に置くので、影で読ませる必要がなくなった */
header.hero > .wrap h1{
  font-size:clamp(30px,4.02vw,53px) !important;
  line-height:1.34 !important;
  margin:14px 0 16px !important;
  max-width:20em !important;
  text-shadow:none !important;
}
header.hero > .wrap p.lead{
  max-width:34em !important;
  line-height:1.95 !important;
  text-shadow:none !important;
}
header.hero > .wrap .scroll-cue{margin-top:clamp(18px,2.6vh,32px) !important;}

/* 時刻ラベルは写真の中に置く（下部バーとの衝突を避ける） */
header.hero .hero-chrono-label{
  position:absolute !important;
  top:auto !important;bottom:22px !important;right:24px !important;
  z-index:3;
}

/* Sea to Summit は地色が茶系。写真の閉じ色を合わせる */
header.hero:has(> .bg){ --hero-ground:#2A2118; }

/* ── 縦長・小画面 ────────────────────────────────────── */
@media (max-width:820px){
  header.hero .hero-media,
  header.hero > .bg{min-height:30vh;}
  header.hero > .wrap h1{
    max-width:none !important;
    font-size:clamp(24px,6.21vw,32px) !important;
    line-height:1.44 !important;
  }
  header.hero > .wrap p.lead{font-size:15.5px !important;line-height:1.9 !important;}
  header.hero > .wrap{padding-bottom:clamp(100px,13vh,130px) !important;}
}

/* 横に広く縦が短い画面は、文字を締めて写真の面積を残す */
@media (min-width:821px) and (max-height:820px){
  header.hero > .wrap h1{font-size:clamp(26px,3.1vw,39px) !important;margin:10px 0 12px !important;}
  header.hero > .wrap p.lead{font-size:16px !important;line-height:1.85 !important;}
  header.hero > .wrap{
    padding-top:clamp(18px,2.4vh,30px) !important;
    padding-bottom:clamp(92px,11vh,112px) !important;
  }
  header.hero > .wrap .scroll-cue{margin-top:16px !important;}
}

@media (max-width:430px){
  header.hero > .wrap h1{font-size:clamp(22px,5.98vw,28px) !important;}
  header.hero > .wrap p.lead{font-size:14.5px !important;}
}

/* ── ゲートウェイ（2分割入口）も同じ構造にする ──────────
   写真を上段、文字を下段の無地に置く。左は藍、右は森の色で閉じる。
   ────────────────────────────────────────────────────────── */
.half{
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-end !important;
  align-items:stretch !important;
}
.half.sea{ --half-ground:#0B1426; --half-scrim:11,20,38; }
.half.mtn{ --half-ground:#141F19; --half-scrim:20,31,25; }
.half{background-color:var(--half-ground);}

.half .bg{
  position:relative !important;
  inset:auto !important;
  height:auto !important;
  min-height:0 !important;
  z-index:0 !important;
  flex:1 1 auto !important;
  width:100% !important;
  object-fit:cover !important;
  object-position:center 42% !important;
  filter:brightness(.74) saturate(.96) !important;
  /* 下端を透過させ、地色へ溶かす */
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 72%,rgba(0,0,0,.45) 90%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 72%,rgba(0,0,0,.45) 90%,transparent 100%);
}
/* 海側だけ：鳥居が画角に収まるよう上寄りを見せる（山側は42%のまま） */
.half.sea .bg{ object-position:center 24% !important; }

/* 上部バーの可読性ぶんだけ、写真の上端を沈める */
.half::before{
  inset:0 0 auto 0 !important;
  height:clamp(120px,18vh,210px) !important;
  z-index:1 !important;
  background:linear-gradient(180deg,
    rgba(var(--half-scrim),.74) 0%,
    rgba(var(--half-scrim),.30) 55%,
    rgba(var(--half-scrim),0) 100%) !important;
}
.half::after{ display:none !important; }

.half .inner{
  position:relative;z-index:2;
  flex:0 0 auto;
  padding-top:clamp(24px,3.4vh,40px) !important;
  padding-bottom:clamp(44px,7vh,80px) !important;
}
.half h2{text-shadow:none !important;}

/* 中央の紋は写真の帯の中に置く（文字面に落とさない） */
.badge{top:34% !important;}

@media (max-width:820px){
  .half .bg{min-height:22vh;}
  .half .inner{padding-bottom:clamp(34px,5vh,56px) !important;}
  .badge{top:50% !important;}
}
.half::before{
  background:linear-gradient(to top,
    rgba(8,11,22,.95) 0%,
    rgba(8,11,22,.78) 26%,
    rgba(8,11,22,.16) 56%,
    rgba(8,11,22,.48) 100%) !important;
}

/* ═══════════════════════════════════════════════════════════
   v2.3：宿を「軸」で選ぶ（立地／食／もてなし）
   ═══════════════════════════════════════════════════════════ */
.stay-dock .st-picks{margin-bottom:34px;}
.stay-dock .st-picks h3{
  font-family:"Inter",sans-serif;font-size:12px;font-weight:600;letter-spacing:.28em;
  text-transform:uppercase;color:#B8912E;margin-bottom:16px;
}
html[lang="ja"] .stay-dock .st-picks h3{
  font-family:"Zen Kaku Gothic New",sans-serif;font-size:14px;letter-spacing:.14em;text-transform:none;
}

/* 軸タブ */
.stay-dock .axis-tabs{display:flex;gap:0;border-bottom:1px solid #E4DCC9;margin-bottom:22px;flex-wrap:wrap;}
.stay-dock .axis-tab{
  display:flex;flex-direction:column;gap:3px;align-items:flex-start;
  padding:12px 22px 13px;border:0;background:none;cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px;transition:border-color .2s ease;
}
.stay-dock .axis-tab .en{
  font-family:"Inter",sans-serif;font-size:11px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:#A8A296;transition:color .2s ease;
}
.stay-dock .axis-tab .ja{
  font-family:"Shippori Mincho B1","Cormorant Garamond",serif;font-size:18.5px;font-weight:600;
  color:#6B6459;transition:color .2s ease;
}
.stay-dock .axis-tab:hover .ja{color:#20190F;}
.stay-dock .axis-tab.on{border-bottom-color:#B8912E;}
.stay-dock .axis-tab.on .en{color:#B8912E;}
.stay-dock .axis-tab.on .ja{color:#20190F;}

/* 軸ごとのパネル */
.stay-dock .axis-pane{display:none;margin:0 !important;padding:0 !important;min-height:0 !important;}
/* 軸パネル内のカードは枚数に応じて自動調整（1枚なら大きく見せる） */
.stay-dock .axis-pane .pick-grid{
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr)) !important;
}
.stay-dock .axis-pane .pick{padding:22px 24px;}
.stay-dock .axis-pane .pick p{font-size:15px;line-height:1.95;}
.stay-dock .axis-pane.on{display:block;animation:axisIn .35s ease;}
.stay-dock .axis-tabs{margin-bottom:18px !important;}
@keyframes axisIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.stay-dock .axis-copy{
  font-size:16px;line-height:1.95;color:#5A5344;margin:0 0 18px;max-width:44em;
}
html[lang="ja"] .stay-dock .axis-copy{font-size:15.5px;}

@media (max-width:640px){
  .stay-dock .axis-tab{padding:10px 15px 11px;flex:1;align-items:center;}
  .stay-dock .axis-tab .ja{font-size:16px;}
  .stay-dock .axis-copy{font-size:15px;}
}

/* ═══ v2.4：施設カード（写真）＋月間カレンダー（○×） ═══ */

/* ── 施設カード ── */
.stay-dock .axis-pane .pick-grid{
  grid-template-columns:1fr !important;gap:26px !important;
}
.pick-card{
  display:grid;grid-template-columns:minmax(240px,34%) 1fr;gap:0;align-items:stretch;
  background:#FCFAF4;border:1px solid #E4DCC9;border-radius:6px;overflow:hidden;
}
/* 写真列はカードの高さに合わせて切り抜き表示 */
.pc-shots{position:relative;background:#E4DCC9;overflow:hidden;min-height:220px;}
.pc-shots img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.pc-shots img.sub{display:none;}
/* 自動クロスフェード：srcの差し替えに合わせて静かに明滅させる
   （JS側の SHOT_FADE と同じ .9s に揃えている） */
.pc-shots img{transition:opacity .9s ease;}
.pc-shots img.fading{opacity:0;}
@media (prefers-reduced-motion:reduce){
  .pc-shots img{transition:none;}
  .pc-shots img.fading{opacity:1;}
}
.pc-body{padding:22px 24px 24px;}
.pc-body .k{
  display:block;font-family:"Inter",sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:#B8912E;margin-bottom:7px;
}
.pc-body h4{
  margin:0 0 10px;font-family:"Cormorant Garamond","Shippori Mincho B1",serif;
  font-size:25px;font-weight:600;color:#20190F;line-height:1.35;
}
html[lang="ja"] .pc-body h4{font-family:"Shippori Mincho B1",serif;font-size:22px;}
.pc-body > p{margin:0 0 16px;font-size:14.5px;line-height:1.9;color:#5A5344;}
.pc-note{margin:10px 0 0;font-size:13px;line-height:1.8;color:#8A8478;}
.pc-go{
  display:inline-block;margin-top:14px;font-family:"Inter",sans-serif;
  font-size:13px;font-weight:600;letter-spacing:.1em;color:#B8912E;text-decoration:none;
  border-bottom:1px solid rgba(184,145,46,.4);padding-bottom:3px;
}
.pc-go:hover{color:#C4632B;border-bottom-color:#C4632B;}
.pc-review{
  display:block;margin-top:8px;font-family:"Inter",sans-serif;
  font-size:14px;color:#8A8478;text-decoration:none;
}
.pc-review:hover{color:#5A5344;}
.pc-review-n{color:#A9A290;}

/* ── 月間カレンダー ── */
.cal{border-top:1px solid #E8E1D2;padding-top:14px;}
.cal-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.cal-month{
  font-family:"Inter",sans-serif;font-size:14.5px;font-weight:600;letter-spacing:.08em;color:#3F3A30;
}
html[lang="ja"] .cal-month{font-family:"Zen Kaku Gothic New",sans-serif;}
.cal-nav{
  width:26px;height:26px;border:1px solid #DDD5C4;background:#fff;border-radius:4px;
  color:#8A8478;font-size:17px;line-height:1;cursor:pointer;transition:all .18s ease;
}
.cal-nav:hover:not(:disabled){border-color:#B8912E;color:#B8912E;}
.cal-nav:disabled{opacity:.32;cursor:default;}
.cal-wd,.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.cal-wd{margin-bottom:3px;}
.cal-wd span{
  text-align:center;font-family:"Inter",sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.08em;color:#A8A296;padding:2px 0;
}
.cal-wd span.sun{color:#C4632B;}
.cal-wd span.sat{color:#5B7CA8;}
.cal-cell{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;
  height:34px;border-radius:3px;background:#F6F3EC;text-decoration:none;
  transition:background .18s ease,transform .18s ease;
}
.cal-cell b{font-family:"Inter",sans-serif;font-size:11.5px;font-weight:500;color:#8A8478;line-height:1;}
.cal-cell i{font-style:normal;font-size:14px;line-height:1;}
.cal-cell.empty{background:transparent;}
.cal-cell.past{background:#F2F0EA;opacity:.42;}
.cal-cell.ok{background:#EFF5EF;}
.cal-cell.ok i{color:#3E7F52;}
a.cal-cell.ok:hover{background:#DFEDE2;transform:translateY(-1px);}
.cal-cell.full{background:#FAF0EE;}
.cal-cell.full i{color:#B5503E;}
.cal-cell.none i{color:#C4BFB2;}
.cal-cell.sun b{color:#C4632B;}
.cal-cell.sat b{color:#5B7CA8;}

@media (max-width:760px){
  .pick-card{grid-template-columns:1fr;}
  .pc-shots{min-height:210px;max-height:240px;}
  .pc-body{padding:20px 20px 22px;}
  .cal-cell i{font-size:12.5px;}
  .cal-cell b{font-size:10.5px;}
}


/* ── 体験ドック：カードの補足情報 ── */
.pc-meta{
  margin:0 0 10px;font-family:"Inter",sans-serif;font-size:12.5px;font-weight:500;
  letter-spacing:.06em;color:#8A8478;
}
.exp-grid{grid-template-columns:1fr !important;gap:26px !important;}
/* 2枚目以降の写真を小さく並べる（広い画面のみ） */
@media (min-width:1000px){
  .pc-shots{display:grid;grid-template-rows:1.6fr 1fr;gap:2px;}
  .pc-shots img{position:relative;inset:auto;}
  .pc-shots img.sub{display:block;}
  .pc-shots img:nth-child(n+3){display:none;}
  /* 体験は写真の縦横がまちまちなため、積み上げず一定の高さに切り抜く
     （縦長写真で枠が伸びる崩れの防止。宿・食事と同じ見え方に揃える） */
  .exp-grid .pc-shots{display:block;height:280px;}
  .exp-grid .pc-shots img{position:absolute;inset:0;height:100%;}
  .exp-grid .pc-shots img.sub{display:none;}
}

/* ═══════════════════════════════════════════════════════════
   v26：体験ドックへの統合（旧「アクティビティ空き状況」を廃止）
   ・カレンダーの月ジャンプ（今月＋6か月先＝7か月）
   ・体験ドック内の凡例と喚起文
   ═══════════════════════════════════════════════════════════ */

/* ── 月ジャンプのチップ ── */
.cal-months{
  display:flex;flex-wrap:wrap;gap:4px;margin:0 0 10px;
}.cal-chip{
  flex:1 1 auto;min-width:38px;padding:5px 6px;
  border:1px solid #E3DCCB;border-radius:3px;background:#FCFAF5;
  font-family:"Inter",sans-serif;font-size:12.5px;font-weight:500;letter-spacing:.04em;
  color:#8A8478;cursor:pointer;line-height:1.2;
  transition:border-color .18s ease,color .18s ease,background .18s ease;
}
html[lang="ja"] .cal-chip{font-family:"Zen Kaku Gothic New",sans-serif;}
.cal-chip:hover{border-color:#B8912E;color:#8A6B1E;background:#FBF6E9;}
.cal-chip:focus-visible{outline:2px solid #D9B25A;outline-offset:1px;}
.cal-chip.on{
  border-color:#20190F;background:#20190F;color:#F4F0E7;font-weight:600;
}
.cal-chip.on:hover{border-color:#20190F;background:#20190F;color:#F4F0E7;}

/* ── 体験ドック内の凡例 ── */
.info-dock .cal-legend{
  display:flex;flex-wrap:wrap;gap:12px 20px;margin:0 0 20px;
  font-size:13px;color:#6B6558;
}
.info-dock .cal-legend span{display:inline-flex;align-items:center;gap:6px;}
.info-dock .cal-legend i{font-style:normal;font-weight:600;font-size:15px;}

/* ── 体験ドック内の予約喚起 ── */
.info-dock .urgency{
  margin:0 0 14px;padding:12px 15px;border-left:2px solid #C4632B;
  background:rgba(196,99,43,.05);font-size:14.5px;line-height:1.85;color:#5A554A;
}
.info-dock .urgency strong{font-weight:600;color:#20190F;}

@media (max-width:760px){
  .cal-chip{min-width:0;padding:6px 4px;font-size:12px;}
  .info-dock .urgency{font-size:14px;padding:11px 13px;}
}

/* ═══════════════════════════════════════════════════════════
   v28：カレンダーの比率調整 ／ ドックヘッダーのメディア枠
   ═══════════════════════════════════════════════════════════ */

/* ── カレンダーが横に伸びすぎるのを抑える ──
   カード本文の幅いっぱいに7列を割ると1マスが横130px×高34pxになり、
   日付グリッドに見えなくなる。上限幅を決めてマスを正方形寄りに戻す。 */
.pc-body .cal{max-width:452px;}
.cal-wd,.cal-grid{gap:3px;}
.cal-cell{height:46px;gap:3px;}
.cal-cell b{font-size:12.5px;}
.cal-cell i{font-size:15px;}
.cal-wd span{padding-bottom:2px;}

@media (max-width:760px){
  .pc-body .cal{max-width:none;}
  .cal-cell{height:40px;}
  .cal-cell i{font-size:13px;}
  .cal-cell b{font-size:11px;}
}

/* ── ドックヘッダー右のメディア枠（動画・口コミ） ── */
.hd-media{
  flex:0 0 auto;width:min(38%,420px);margin-left:auto;
  display:flex;flex-direction:column;gap:9px;
}
.stay-dock .hd{align-items:flex-start;}
.stay-dock .hd > div:first-child{flex:1 1 auto;min-width:0;}

.hd-media .hm-video{
  position:relative;width:100%;aspect-ratio:16/9;border-radius:6px;overflow:hidden;
  background:#20190F;border:1px solid rgba(32,25,15,.14);
}
.hd-media .hm-video iframe,
.hd-media .hm-video video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
.hd-media .hm-cap{
  font-size:12.5px;line-height:1.7;color:#8A8478;margin:0;
}

.hd-media .hm-reviews{display:flex;flex-direction:column;gap:8px;}
.hd-media .hm-rv{
  background:#FCFAF4;border:1px solid #E4DCC9;border-radius:6px;padding:12px 14px;
}
.hd-media .hm-rv p{
  margin:0 0 7px;font-size:14px;line-height:1.8;color:#3E3A32;
}
html[lang="ja"] .hd-media .hm-rv p{font-size:14.5px;}
.hd-media .hm-meta{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-family:"Inter",sans-serif;font-size:12px;color:#8A8478;letter-spacing:.03em;
}
.hd-media .hm-stars{color:#B8912E;letter-spacing:.08em;font-size:12.5px;}
.hd-media .hm-src{color:#9E7B3C;text-decoration:none;border-bottom:1px solid rgba(158,123,60,.35);}
.hd-media .hm-src:hover{color:#C4632B;border-bottom-color:#C4632B;}

/* 狭い画面ではヘッダー下に回す */
@media (max-width:900px){
  .stay-dock .hd{flex-wrap:wrap;}
  .hd-media{width:100%;margin-left:0;order:3;}
  .hd-media .hm-reviews{flex-direction:row;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .hd-media .hm-rv{flex:0 0 78%;}
}