@charset "utf-8";
/* ============================================================
   doze — pages.css  下層ページ共通コンポーネント
   ============================================================ */

/* prose */
.prose{ max-width:var(--readw) }
.prose p{ font-size:clamp(14.5px,1.2vw,16.5px); line-height:2.2; color:var(--on-mute); margin-top:1.5em }
.prose p:first-child{ margin-top:0 }
.prose .lead{ font-size:clamp(16px,1.5vw,19px); line-height:2.15; color:var(--on); margin-bottom:.4em }

.two{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,6vw,90px); align-items:center }
.two--rev .two__txt{ order:2 }
.two__fig{ position:relative; overflow:hidden; aspect-ratio:3/4; background:var(--night2) }
.two__fig img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease) }
.two__fig:hover img{ transform:scale(1.04) }
@media (max-width:860px){ .two{ grid-template-columns:1fr; gap:32px } .two--rev .two__txt{ order:0 } .two__fig{ aspect-ratio:4/3 } }

/* checklist（base.css .checks を利用） */

/* menu list（下層 menu） */
.p-menu{ border-top:1px solid var(--line) }
.p-menu__item{ display:grid; grid-template-columns:auto 1fr auto; gap:clamp(18px,3vw,50px);
  align-items:baseline; padding:clamp(26px,3.4vw,42px) 0; border-bottom:1px solid var(--line) }
.p-menu__en{ font-family:var(--latin); font-size:clamp(20px,2.6vw,30px); letter-spacing:.08em }
.p-menu__body h3{ font-size:clamp(17px,1.7vw,21px); font-weight:400; letter-spacing:.06em }
.p-menu__body p{ font-size:14px; line-height:1.9; color:var(--on-mute); margin-top:8px; max-width:34em }
.p-menu__meta{ text-align:right; white-space:nowrap }
.p-menu__time{ font-family:var(--sans); font-weight:300; font-size:13px; letter-spacing:.18em; color:var(--accent) }
.p-menu__price{ font-family:var(--latin); font-size:clamp(20px,2.4vw,28px); margin-top:6px }
.p-menu__price small{ font-family:var(--serif); font-size:.5em; margin-left:3px; color:var(--on-mute) }
@media (max-width:680px){
  .p-menu__item{ grid-template-columns:1fr auto; row-gap:10px }
  .p-menu__en{ grid-column:1/-1 } .p-menu__meta{ text-align:left }
}

/* mosaic */
.p-mosaic{ display:grid; grid-template-columns:repeat(6,1fr); gap:clamp(10px,1.4vw,18px); margin-top:clamp(34px,5vw,60px) }
.p-mosaic figure{ position:relative; overflow:hidden; background:var(--night2) }
.p-mosaic img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease) }
.p-mosaic figure:hover img{ transform:scale(1.05) }
.pm-a{ grid-column:span 4; aspect-ratio:16/9 }
.pm-b{ grid-column:span 2; aspect-ratio:3/4 }
.pm-c{ grid-column:span 2; aspect-ratio:1/1 }
.pm-d{ grid-column:span 2; aspect-ratio:1/1 }
.pm-e{ grid-column:span 2; aspect-ratio:1/1 }
@media (max-width:720px){
  .p-mosaic{ grid-template-columns:1fr 1fr }
  .pm-a{ grid-column:span 2 } .pm-b,.pm-c,.pm-d,.pm-e{ grid-column:span 1; aspect-ratio:1/1 }
}

/* who */
.p-who{ list-style:none; columns:2; column-gap:clamp(30px,5vw,70px); margin-top:clamp(30px,4vw,50px) }
.p-who li{ break-inside:avoid; padding:16px 0 16px 30px; position:relative; border-bottom:1px solid var(--line-soft);
  font-size:clamp(14.5px,1.2vw,16.5px); line-height:1.9 }
.p-who li::before{ content:"—"; position:absolute; left:0; color:var(--accent) }
@media (max-width:640px){ .p-who{ columns:1 } }

/* pull */
.p-pull{ font-family:var(--serif); font-size:clamp(22px,3.6vw,40px); line-height:1.9; letter-spacing:.08em; color:var(--on) }
.p-pull .glow{ color:var(--accent) }

/* info（access） */
.p-info{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,90px); align-items:start }
.p-info dl{ display:grid; grid-template-columns:8.5em 1fr }
.p-info dt{ padding:16px 0; border-top:1px solid var(--line-soft); font-size:13px; letter-spacing:.1em; color:var(--on-mute) }
.p-info dd{ padding:16px 0; border-top:1px solid var(--line-soft); font-size:14px; line-height:1.8 }
.p-info__fig{ position:relative; overflow:hidden; aspect-ratio:3/4; background:var(--night2); border:1px solid var(--line) }
.p-info__fig img{ width:100%; height:100%; object-fit:cover }
@media (max-width:860px){ .p-info{ grid-template-columns:1fr } .p-info dl{ grid-template-columns:7em 1fr } }

/* message */
.p-msg{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(36px,6vw,90px); align-items:start }
.p-msg__fig{ position:relative; overflow:hidden; aspect-ratio:4/5; background:var(--night2) }
.p-msg__fig img{ width:100%; height:100%; object-fit:cover }
.p-msg__q{ font-family:var(--serif); font-size:clamp(23px,3.4vw,38px); line-height:1.8; letter-spacing:.08em; color:var(--on) }
.p-msg__body p{ font-size:clamp(14.5px,1.15vw,16px); line-height:2.2; color:var(--on-mute); margin-top:1.5em }
.p-msg__sign{ margin-top:2em; font-size:14px; letter-spacing:.12em; color:var(--on) }
.p-msg__sign small{ display:block; font-family:var(--sans); font-weight:300; font-size:11px; letter-spacing:.2em; color:var(--on-mute); margin-bottom:6px }
@media (max-width:860px){ .p-msg{ grid-template-columns:1fr } .p-msg__fig{ aspect-ratio:4/3; max-height:70vh } }

/* ---------- form（reserve） ---------- */
.form{ display:grid; gap:clamp(20px,2.6vw,30px); max-width:680px }
.field label{ display:block; font-family:var(--sans); font-weight:300; font-size:12px; letter-spacing:.16em;
  color:var(--on-mute); margin-bottom:10px }
.field label .req{ color:var(--accent); margin-left:8px; letter-spacing:.1em }
.field input, .field select, .field textarea{
  width:100%; font-family:var(--serif); font-size:15px; color:var(--on); letter-spacing:.04em;
  background:color-mix(in oklab,var(--on) 4%, transparent);
  border:1px solid var(--line); padding:15px 16px; border-radius:0;
  transition:border-color .3s var(--ease), background-color .3s var(--ease); -webkit-appearance:none; appearance:none;
}
.field textarea{ min-height:130px; resize:vertical; line-height:1.9 }
.field 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 d='M1 1l5 5 5-5' fill='none' stroke='%23C8A177' stroke-width='1.2'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 18px center; padding-right:44px }
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--accent); background:color-mix(in oklab,var(--on) 6%, transparent) }
.field input::placeholder, .field textarea::placeholder{ color:var(--on-dim) }
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,2.6vw,30px) }
@media (max-width:600px){ .form__row{ grid-template-columns:1fr } }
.form__submit{ margin-top:10px }
.form__note{ font-size:12.5px; line-height:1.9; color:var(--on-dim); letter-spacing:.03em }
.form__ok{ display:none; padding:26px 24px; border:1px solid var(--accent);
  background:color-mix(in oklab,var(--accent) 8%, transparent); font-size:14.5px; line-height:1.9; letter-spacing:.05em }
.form.is-sent .form__ok{ display:block }
.form.is-sent .form__fields{ display:none }

/* reserve-side info card */
.res-side{ border:1px solid var(--line); padding:clamp(26px,3vw,40px); align-self:start }
.res-side h3{ font-size:16px; font-weight:400; letter-spacing:.08em; margin-bottom:18px }
.res-side dl{ display:grid; grid-template-columns:6em 1fr; row-gap:0 }
.res-side dt{ padding:12px 0; border-top:1px solid var(--line-soft); font-size:12px; color:var(--on-mute); letter-spacing:.08em }
.res-side dd{ padding:12px 0; border-top:1px solid var(--line-soft); font-size:13.5px; line-height:1.7 }
.res-side .tel-big{ font-family:var(--latin); font-size:26px; letter-spacing:.08em; color:var(--on); margin-top:20px; display:block }

.res-grid{ display:grid; grid-template-columns:1.5fr 1fr; gap:clamp(40px,6vw,80px); align-items:start }
@media (max-width:900px){ .res-grid{ grid-template-columns:1fr } }

/* CTA band（下層フッター前） */
.cta{ position:relative; overflow:hidden; text-align:center; color:var(--paper);
  padding-block:clamp(80px,12vw,150px); background:var(--night2) }
.cta img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; opacity:.42 }
.cta::after{ content:""; position:absolute; inset:0; background:rgba(15,12,10,.55); z-index:1 }
.cta__in{ position:relative; z-index:2; padding-inline:var(--pad) }
.cta__h{ font-family:var(--serif); font-size:clamp(24px,4.4vw,44px); line-height:1.5; letter-spacing:.1em; color:var(--paper) }
.cta__sub{ margin-top:1.2em; font-size:14px; line-height:2; color:color-mix(in oklab,var(--paper) 74%,transparent) }
.cta__actions{ margin-top:clamp(30px,4vw,50px); display:flex; gap:18px; justify-content:center; flex-wrap:wrap }
.cta .btn--ghost{ color:var(--paper); border-color:color-mix(in oklab,var(--paper) 30%,transparent) }
.cta .btn--ghost:hover{ color:var(--accent); border-color:var(--accent) }

/* section rhythm helper for sub pages */
.sub .sec + .sec{ padding-top:0 }