:root { --ink:#153d3c; --ink-2:#0d2c2c; --cream:#f2eadc; --paper:#fbf8f1; --sand:#d8c4a4; --copper:#b66a43; --sage:#769384; --line:rgba(21,61,60,.18); color-scheme:light; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scrollbar-width:none; }
html::-webkit-scrollbar { width:0; height:0; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,Arial,sans-serif; }
button,input,select,textarea { font:inherit; }
a { color:inherit; }
[hidden] { display:none!important; }
.guest-skip { position:fixed; left:1rem; top:-5rem; z-index:100; padding:.7rem 1rem; background:#fff; }
.guest-skip:focus { top:1rem; }
.guest-header { position:sticky; top:0; z-index:30; min-height:78px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:2rem; padding:0 clamp(1.2rem,4vw,4rem); border-bottom:1px solid rgba(255,255,255,.16); background:rgba(13,44,44,.96); color:#fff; backdrop-filter:blur(18px); }
.guest-brand { display:inline-flex; flex-direction:column; text-decoration:none; line-height:1; }
.guest-brand b { font:400 1.65rem/1 Georgia,serif; letter-spacing:.09em; }
.guest-brand span { margin-top:.28rem; color:#c9d9d3; font-size:.52rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.guest-nav { display:flex; justify-content:center; gap:clamp(1.2rem,3vw,3rem); }
.guest-nav a { position:relative; padding:.75rem 0; color:#dbe5e2; font-size:.7rem; font-weight:800; letter-spacing:.12em; text-decoration:none; text-transform:uppercase; }
.guest-nav a::after { content:""; position:absolute; left:0; right:100%; bottom:.3rem; height:2px; background:var(--copper); transition:right .2s ease; }
.guest-nav a:hover::after,.guest-nav a[aria-current="page"]::after { right:0; }
.guest-book { padding:.8rem 1rem; border:1px solid rgba(255,255,255,.45); color:#fff; font-size:.67rem; font-weight:900; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }
.guest-menu-toggle { display:none; }

.guest-home-hero { position:relative; min-height:calc(100vh - 78px); display:flex; align-items:flex-end; overflow:hidden; background:var(--ink); }
.guest-home-hero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.guest-home-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,27,27,.82) 0%,rgba(7,27,27,.35) 56%,rgba(7,27,27,.08)),linear-gradient(0deg,rgba(7,27,27,.65),transparent 48%); }
.guest-home-copy { position:relative; z-index:1; max-width:720px; padding:clamp(3rem,8vw,8rem) clamp(1.5rem,7vw,7rem); color:#fff; }
.guest-home-copy > span,.guest-page-hero > span { color:#e0b88f; font-size:.65rem; font-weight:900; letter-spacing:.18em; text-transform:uppercase; }
.guest-home-copy h1,.guest-page-hero h1 { max-width:700px; margin:.65rem 0 1rem; color:#fff; font:400 clamp(3.4rem,8vw,7.8rem)/.9 Georgia,serif; }
.guest-home-copy p { max-width:560px; margin:0 0 1.6rem; color:#edf3f0; font-size:clamp(.92rem,1.5vw,1.15rem); line-height:1.65; }
.guest-home-copy a { display:inline-flex; align-items:center; gap:2.5rem; padding:1rem 1.2rem; background:var(--copper); color:#fff; font-size:.75rem; font-weight:900; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }
.guest-home-intro { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,7vw,8rem); padding:clamp(3rem,8vw,7rem); background:var(--cream); }
.guest-home-intro p { margin:0; color:#546e68; line-height:1.75; }
.guest-home-intro p:first-child span { display:block; margin-bottom:.6rem; color:var(--copper); font-size:.65rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.guest-home-intro p:first-child strong { display:block; color:var(--ink); font:400 clamp(2rem,4vw,4rem)/1 Georgia,serif; }
.guest-home-cards { display:grid; grid-template-columns:repeat(3,1fr); }
.guest-home-cards article { position:relative; min-height:330px; padding:clamp(1.5rem,4vw,3.5rem); border-right:1px solid var(--line); background:#fff; }
.guest-home-cards article:last-child { border-right:0; }
.guest-home-cards span { color:var(--copper); font:400 1.4rem Georgia,serif; }
.guest-home-cards h2 { margin:3rem 0 1rem; font:400 clamp(1.8rem,3vw,3rem)/1 Georgia,serif; }
.guest-home-cards p { max-width:360px; color:#5c726d; line-height:1.65; }
.guest-home-cards a { display:inline-block; margin-top:1rem; font-size:.72rem; font-weight:900; text-transform:uppercase; }
.guest-terrace-card { overflow:hidden; background:linear-gradient(rgba(12,45,44,.8),rgba(12,45,44,.8)),url("assets/restaurant-mise-terrace-v1.png") center/cover!important; color:#fff; }
.guest-terrace-card p { color:#dce8e4; }

.guest-page-hero { padding:clamp(3.5rem,8vw,8rem) clamp(1.3rem,7vw,7rem); background:var(--ink); color:#fff; }
.guest-page-hero h1 { margin-bottom:1rem; }
.guest-page-hero p { max-width:700px; margin:0; color:#ceddda; line-height:1.65; }
.guest-menu-hero { background:linear-gradient(90deg,rgba(12,45,44,.94),rgba(12,45,44,.55)),url("assets/restaurant-mise-terrace-v1.png") center/cover; }
.guest-menu-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); }
.guest-menu-grid > section { padding:clamp(1.5rem,4vw,3.5rem); background:var(--paper); }
.guest-menu-grid > section > span { color:var(--copper); font-size:.65rem; font-weight:900; letter-spacing:.15em; text-transform:uppercase; }
.guest-menu-grid article { display:grid; grid-template-columns:1fr auto; gap:1rem; padding:1.4rem 0; border-bottom:1px solid var(--line); }
.guest-menu-grid h2 { margin:0; font:400 1.25rem Georgia,serif; }
.guest-menu-grid p { margin:.35rem 0 0; color:#687c77; font-size:.72rem; line-height:1.5; }
.guest-menu-grid article > b { color:var(--copper); font:400 1.15rem Georgia,serif; }
.guest-menu-cta { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:2rem clamp(1.5rem,7vw,7rem); background:var(--cream); }
.guest-menu-cta p { margin:0; }
.guest-menu-cta span { display:block; color:var(--copper); font-size:.6rem; font-weight:900; text-transform:uppercase; }
.guest-menu-cta strong { display:block; margin-top:.35rem; font:400 1.8rem Georgia,serif; }
.guest-menu-cta a { padding:1rem 1.2rem; background:var(--ink); color:#fff; font-size:.72rem; font-weight:900; text-decoration:none; text-transform:uppercase; }

.guest-reservation-hero { padding-bottom:clamp(2rem,5vw,4rem); background:linear-gradient(90deg,rgba(12,45,44,.96),rgba(12,45,44,.72)),url("assets/restaurant-mise-hero-v1.png") center 45%/cover; }
.guest-reservation-hero h1 { font-size:clamp(3rem,6vw,6rem); }
.guest-reservation-shell { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.5fr); margin:clamp(1rem,3vw,2.5rem); scroll-margin-top:88px; border:1px solid var(--line); background:#fff; box-shadow:0 24px 70px rgba(20,46,44,.13); }
.reservation-flow { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--line); background:#f6f0e5; }
.reservation-flow button { min-width:0; min-height:78px; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:.7rem; align-content:center; padding:.8rem 1rem; border:0; border-right:1px solid var(--line); background:transparent; color:var(--ink); text-align:left; cursor:pointer; }
.reservation-flow button:last-child { border-right:0; }
.reservation-flow button span { grid-row:1/3; align-self:center; color:var(--copper); font:400 1.45rem Georgia,serif; }
.reservation-flow button b { align-self:end; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; }
.reservation-flow button small { align-self:start; margin-top:.12rem; color:#71817d; font-size:.55rem; }
.reservation-flow button[aria-current="step"] { background:var(--ink); color:#fff; box-shadow:inset 0 -3px var(--copper); }
.reservation-flow button[aria-current="step"] small { color:#bad0ca; }
.reservation-flow button[data-complete="true"] span::after { content:"✓"; margin-left:.35rem; color:var(--sage); font:900 .66rem system-ui,sans-serif; }
.reservation-flow button:disabled { cursor:not-allowed; opacity:.42; }
.reservation-form { min-width:0; }
.reservation-step[hidden] { display:none; }
.reservation-step { margin:0; padding:clamp(1.25rem,3vw,2.5rem); border:0; border-bottom:1px solid var(--line); }
.reservation-step legend { width:100%; padding:0; }
.reservation-step legend span { color:var(--copper); font:400 1rem Georgia,serif; }
.reservation-step legend b { display:block; margin:.45rem 0 1.2rem; font:400 clamp(1.6rem,3vw,2.6rem)/1 Georgia,serif; }
.reservation-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.reservation-fields label > span,.reservation-zone > legend { display:block; margin-bottom:.4rem; color:#667c76; font-size:.61rem; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }
.reservation-fields input,.reservation-fields select,.reservation-fields textarea { width:100%; min-height:3rem; padding:.75rem .8rem; border:1px solid var(--line); border-radius:0; background:#fbfaf6; color:var(--ink); }
.reservation-fields textarea { min-height:5rem; resize:vertical; }
.reservation-fields input:focus,.reservation-fields select:focus,.reservation-fields textarea:focus { outline:2px solid rgba(182,106,67,.45); border-color:var(--copper); }
.reservation-field-wide { grid-column:1/-1; }
.reservation-zone { display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; margin:1rem 0 0; padding:0; border:0; }
.reservation-zone > legend { grid-column:1/-1; }
.reservation-zone label { position:relative; cursor:pointer; }
.reservation-zone input { position:absolute; opacity:0; }
.reservation-zone label > span { min-height:4.2rem; display:flex; flex-direction:column; justify-content:center; padding:.65rem .8rem; border:1px solid var(--line); font-size:.78rem; font-weight:900; }
.reservation-zone small { margin-top:.15rem; color:#6c7f7a; font-size:.58rem; font-weight:600; }
.reservation-zone input:checked + span { background:var(--ink); color:#fff; box-shadow:inset 0 -3px var(--copper); }
.reservation-zone input:checked + span small { color:#c8d8d4; }
.reservation-search,.reservation-submit { width:100%; display:flex; justify-content:space-between; margin-top:1rem; padding:.9rem 1rem; border:0; background:var(--copper); color:#fff; font-weight:900; cursor:pointer; }
.reservation-back { margin:-.4rem 0 1rem; padding:.4rem 0; border:0; border-bottom:1px solid currentColor; background:transparent; color:#6b7c77; font-size:.62rem; font-weight:900; letter-spacing:.05em; cursor:pointer; text-transform:uppercase; }
.reservation-times { background:#f7f3eb; }
.reservation-status { margin:-.5rem 0 1rem; color:#687c77; font-size:.78rem; line-height:1.5; }
.reservation-status.is-warning { color:#a54736; font-weight:800; }
.reservation-slots { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.45rem; }
.reservation-slot { min-height:4rem; padding:.5rem .25rem; border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer; }
.reservation-slot b,.reservation-slot small { display:block; }
.reservation-slot b { font:400 1.05rem Georgia,serif; }
.reservation-slot small { margin-top:.25rem; color:#73847f; font-size:.5rem; }
.reservation-slot.is-selected { background:var(--ink); color:#fff; box-shadow:inset 0 -3px var(--copper); }
.reservation-slot.is-selected small { color:#c5d7d2; }
.reservation-slot:disabled { opacity:.35; cursor:not-allowed; }
.reservation-details[disabled] { opacity:.48; }
.reservation-choice { margin:-.4rem 0 1rem; padding:.75rem .85rem; border-left:3px solid var(--copper); background:#f4ede2; font-size:.76rem; font-weight:800; }
.reservation-consent { display:grid; grid-template-columns:auto 1fr; gap:.55rem; margin-top:.8rem; color:#657a74; font-size:.7rem; line-height:1.5; }
.reservation-consent input { accent-color:var(--copper); }
.reservation-aside { border-left:1px solid var(--line); background:var(--cream); }
.reservation-proof,.reservation-mine { padding:clamp(1.2rem,3vw,2rem); }
.reservation-proof { border-bottom:1px solid var(--line); }
.reservation-proof > span,.reservation-mine-head span { color:var(--copper); font-size:.6rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.reservation-proof h2 { margin:.5rem 0 1rem; font:400 clamp(1.6rem,3vw,2.4rem)/1 Georgia,serif; }
.reservation-proof dl { margin:0; }
.reservation-proof dl > div { display:flex; justify-content:space-between; gap:.6rem; padding:.55rem 0; border-top:1px solid var(--line); font-size:.7rem; }
.reservation-proof dd { margin:0; text-align:right; font-weight:900; }
.reservation-proof p { color:#687c77; font-size:.64rem; line-height:1.55; }
.reservation-proof.is-passed { box-shadow:inset 3px 0 var(--sage); }
.reservation-proof.is-blocked { box-shadow:inset 3px 0 var(--copper); }
.reservation-mine-head { display:flex; justify-content:space-between; gap:.6rem; align-items:end; }
.reservation-mine-head b { font-size:.66rem; }
.reservation-empty { color:#74847f; font-size:.7rem; }
.reservation-card { margin-top:.6rem; padding:.75rem; border:1px solid var(--line); background:#fff; }
.reservation-card-head { display:flex; justify-content:space-between; gap:.5rem; }
.reservation-card-head b { font:400 .95rem Georgia,serif; }
.reservation-card-head span { color:var(--copper); font-size:.48rem; font-weight:900; text-transform:uppercase; }
.reservation-card p { margin:.4rem 0; font-size:.66rem; }
.reservation-card small { color:#71827d; font-size:.55rem; }
.reservation-card button { display:block; margin-top:.55rem; padding:.35rem .5rem; border:1px solid var(--line); background:transparent; color:var(--ink); font-size:.52rem; font-weight:900; text-transform:uppercase; }
.reservation-confirmation { margin:0 clamp(1rem,3vw,2.5rem) 2rem; padding:clamp(1.4rem,3vw,2.5rem); background:var(--ink); color:#fff; }
.reservation-confirmation > div:first-child { display:flex; justify-content:space-between; gap:1rem; align-items:baseline; }
.reservation-confirmation span { color:#e0b88f; font-size:.6rem; font-weight:900; text-transform:uppercase; }
.reservation-confirmation h2 { margin:0; font:400 2rem Georgia,serif; }
.reservation-confirmation dl { display:grid; grid-template-columns:repeat(4,1fr); margin:1.4rem 0; border:1px solid rgba(255,255,255,.2); }
.reservation-confirmation dl > div { padding:.8rem; border-right:1px solid rgba(255,255,255,.2); }
.reservation-confirmation dt { color:#aac1bb; font-size:.55rem; font-weight:900; text-transform:uppercase; }
.reservation-confirmation dd { margin:.3rem 0 0; font:400 1rem Georgia,serif; }
.reservation-confirmation-actions { display:flex; justify-content:space-between; gap:1rem; align-items:center; }
.reservation-confirmation-actions a { color:#fff; font-size:.7rem; font-weight:900; }
.reservation-confirmation-actions button { padding:.65rem .75rem; border:1px solid rgba(255,255,255,.35); background:transparent; color:#fff; font-weight:800; }
.toast { position:fixed; right:1rem; bottom:1rem; z-index:50; max-width:320px; padding:.8rem 1rem; background:var(--ink); color:#fff; font-size:.7rem; opacity:0; transform:translateY(1rem); pointer-events:none; transition:.2s; }
.toast.is-visible { opacity:1; transform:none; }
.guest-footer { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:2rem; padding:2.2rem clamp(1.2rem,5vw,5rem); background:var(--ink-2); color:#fff; }
.guest-footer p { justify-self:center; margin:0; color:#a8bfba; font-size:.63rem; line-height:1.55; text-align:center; }
.guest-footer > a:last-child { font-size:.7rem; font-weight:900; }

@media (max-width:900px) {
  .guest-header { grid-template-columns:auto 1fr auto; min-height:68px; }
  .guest-nav { gap:1.2rem; }
  .guest-book { display:none; }
  .guest-home-hero { min-height:620px; }
  .guest-home-intro { grid-template-columns:1fr; }
  .guest-home-cards,.guest-menu-grid { grid-template-columns:1fr; }
  .guest-home-cards article { min-height:240px; border-right:0; border-bottom:1px solid var(--line); }
  .guest-reservation-shell { grid-template-columns:1fr; }
  .reservation-aside { border-top:1px solid var(--line); border-left:0; }
}
@media (max-width:600px) {
  .guest-header { grid-template-columns:1fr auto; padding:0 1rem; }
  .guest-menu-toggle { width:40px; height:40px; display:grid; align-content:center; gap:6px; border:1px solid rgba(255,255,255,.28); background:transparent; }
  .guest-menu-toggle span { width:18px; height:1px; margin:auto; background:#fff; }
  .guest-nav { position:absolute; top:68px; left:0; right:0; display:none; flex-direction:column; gap:0; padding:.5rem 1rem 1rem; background:var(--ink-2); }
  .guest-nav.is-open { display:flex; }
  .guest-nav a { border-bottom:1px solid rgba(255,255,255,.12); }
  .guest-home-hero { min-height:calc(100vh - 68px); }
  .guest-home-copy { padding:3rem 1.2rem; }
  .guest-home-copy h1 { font-size:3.6rem; }
  .guest-home-intro { padding:2.5rem 1.2rem; }
  .guest-page-hero { padding:3rem 1.2rem; }
  .guest-page-hero h1 { font-size:3rem; }
  .guest-menu-grid > section { padding:1.4rem 1.2rem; }
  .guest-menu-cta { align-items:flex-start; flex-direction:column; padding:1.5rem 1.2rem; }
  .guest-reservation-shell { margin:.7rem; }
  .reservation-flow button { min-height:62px; grid-template-columns:auto 1fr; padding:.65rem .55rem; column-gap:.4rem; }
  .reservation-flow button span { font-size:1.05rem; }
  .reservation-flow button b { font-size:.57rem; }
  .reservation-flow button small { display:none; }
  .reservation-step { padding:1rem; }
  .reservation-fields,.reservation-zone { grid-template-columns:1fr; }
  .reservation-slots { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .reservation-confirmation { margin:.7rem; }
  .reservation-confirmation > div:first-child,.reservation-confirmation-actions { align-items:flex-start; flex-direction:column; }
  .reservation-confirmation dl { grid-template-columns:repeat(2,1fr); }
  .guest-footer { grid-template-columns:1fr; justify-items:start; gap:1rem; }
  .guest-footer p { justify-self:start; text-align:left; }
}
@media (max-width:390px) {
  .reservation-slots { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .reservation-confirmation dl { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }
