/* layouts/pho72 — 版式接入层的补充样式（多版式管线 + store.json 数据结构需要的部分）。
   🔒 配色固定：这里一律只用 main.css :root 里已有的颜色变量（var(--green) 等），不写任何颜色字面值。
   品牌色与底稿一致；2026-10-03 起 :root 另有三个「浅底文字色」（--gold-ink / --gold-text / --muted，同色相加深，只为 WCAG AA）。 */

.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.langsw a{text-decoration:none;display:inline-block}
.drawer .langsw{gap:8px}
.drawer .langsw a{border-bottom:0;font-family:var(--f-body)}

/* 店名做字标：长店名不撑破顶栏 */
.nav .wordmark{min-width:0;overflow:hidden;text-overflow:ellipsis}
.nav .wordmark span{overflow:hidden;text-overflow:ellipsis}
@media (max-width:620px){ .nav .wordmark{font-size:1.32rem} .nav .nav-cta{display:none} }
@media (min-width:901px) and (max-width:1120px){ .nav-links{gap:20px} .nav .wrap{gap:18px} }

/* 首屏：循环视频叠在底图上（本店 images.heroVideo，没有就是版式共享的 hero-pho.mp4）。
   两张底图各管一种宽度：手机 = 本店 hero 图（.hero-photo），桌面 = 视频海报（.hero-poster）。不显示的那张 display:none +
   loading="lazy" = 不下载；切宽度时只是显示 / 隐藏，没有任何 src 被替换，所以不会有被中断的请求（真店反馈 #11）。
   视频由 main.js 在桌面宽度打开页面时才挂上；挂上之后窄屏也照常显示（隐藏会让浏览器暂停、掐断下载）。 */
.hero-bg>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%;z-index:0}
.hero-poster{display:none}
@media (min-width:768px){ .hero-photo{display:none} .hero-poster{display:block} }
.only-desktop{display:none}
@media (min-width:768px){ .only-mobile{display:none} .only-desktop{display:block} }
@media (max-width:767px){
  /* 手机首屏：底图是本店照片，原来的 .93 → .65 渐变把照片压得几乎看不见（真店反馈 #14）；减轻，文字靠阴影托住 */
  .hero-bg::after{background:linear-gradient(180deg,rgba(29,47,26,.58) 0%,rgba(29,47,26,.7) 45%,rgba(29,47,26,.8) 100%)}
  .hero h1,.hero-sub,.hero-kicker{text-shadow:0 1px 14px rgba(0,0,0,.55)}
  /* 顶部小标题：字距 .19em 在 375 / 390 宽上会折成两行；收紧字号和字距，真放不下时两行均衡 */
  .hero-kicker{font-size:.7rem;letter-spacing:.11em;text-wrap:balance}
}
.hero-kicker{color:var(--gold);margin-bottom:18px}
.hero-sub{color:var(--cream);opacity:.9;margin:0;max-width:52ch}
.hero-sub br{display:none}
@media (min-width:900px){ .hero-sub br{display:inline} }

/* 段落间距（底稿写在行内 style 里的） */
.story-p{margin-top:18px}
.story-p+.story-p{margin-top:14px}
.story-sign{font-size:1.5rem;margin:14px 0 0;line-height:1.3}
.story-btn,.section-btn{margin-top:28px}
.section-p{margin-top:20px}
.section-caption{margin-top:18px}
.align-end{text-align:right}
.align-end .lede{margin-left:auto}
.align-end .hero-cta{justify-content:flex-end;margin-top:28px}
@media (max-width:900px){
  .align-end{text-align:left}
  .align-end .lede{margin-left:0}
  .align-end .hero-cta{justify-content:flex-start}
}

/* À table 段：底稿的循环视频框。视频（版式共享 famille-table.mp4）只在桌面宽度打开页面时由 main.js 挂上，没有海报属性（透明），
   起播前 / 减少动态效果时露出下面的图：桌面 = 视频海报（.only-desktop），手机 = 本店 evening.image（.only-mobile；没有就是海报） */
.media-photo{margin:0}
.media-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* 口号 + 画廊第一张做横幅 */
.statement-title{text-align:center;position:relative;z-index:2}
.statement-quote{margin:0;font-size:clamp(2.2rem,5.6vw,4.2rem)}
.band-wrap{margin-top:44px;position:relative;z-index:2}
.band-photo img{aspect-ratio:11/5;object-fit:cover;object-position:center 35%}
@media (max-width:620px){ .band-photo img{aspect-ratio:4/3} }

/* 订餐横幅：插画带压在文字下面，不再盖住标题（审计：标题压插画看不清） */
.cityband{padding-bottom:clamp(170px,24vw,360px)}
.cityband-copy{text-align:center;position:relative;z-index:2}
.cityband-text{margin:18px auto 0}
.cityband-cta{justify-content:center;margin-top:26px}
.cityband .deco-band{height:clamp(170px,24vw,360px);object-fit:cover;object-position:center bottom;opacity:.3}

/* 找店 */
.contact-call{margin-top:26px}
.contact-call+.open-badge,#openBadge{margin-top:22px}
.contact-address{margin-top:14px}
.hours-title{margin-top:30px;font-size:1.15rem}
@media (max-width:620px){ .hours-table th{width:32%} .hours-table th,.hours-table td{font-size:.88rem} }
.hours-fallback>div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--cream);font-size:.94rem}
.hours-fallback strong{color:var(--green);font-weight:600}
.map-wrap{position:relative}
.map-wrap iframe:not([src]){display:none}
.map-wrap.is-allowed .map-gate{display:none}
.map-direct{font-size:.8rem}

/* FAQ（底稿的 .faq-item 样式）：单栏，不配插画（厨师插画只在「En cuisine」段出现一次） */
.faq-grid>.reveal{max-width:820px}

/* 首页招牌菜卡：store.json courses[].label 小标签（有才出） */
.dish-label{font-family:var(--f-body);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--green-lt);margin:0 0 6px}

/* 画廊图说：label / title / description（有才出） */
.gstrip-cap{display:flex;flex-direction:column;gap:2px;margin-top:12px;color:var(--cream)}
.gstrip-label{font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.gstrip-title{font-family:var(--f-title);font-weight:600;font-size:1rem;line-height:1.25}
.gstrip-desc{font-size:.8rem;line-height:1.45;opacity:.85;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* 菜单 */
.mrow-name .mtag{font-size:.62rem}
/* 菜名 · 引导点 · 价格：网格三栏。长菜名在第一栏里折行，价格永远不换行、贴在菜名最后一行右侧
   （底稿是 flex-wrap，菜名一长就把价格挤到下一行——真店反馈 #8，手机上最明显） */
.mrow{display:grid;grid-template-columns:minmax(0,auto) minmax(18px,1fr) auto;align-items:last baseline;column-gap:8px}
.mrow-name{min-width:0;overflow-wrap:anywhere}
.mrow-dots{align-self:end}
.mrow-price{white-space:nowrap}
.mrow-desc{grid-column:1/-1}
.menu-foot-note p{margin:0}
.menu-foot-note p+p{margin-top:6px}

/* 自助价格（通用模板的 buffet / buffet-strip 结构，换成本版式的样子） */
.buffet-band{padding-block:clamp(48px,7vw,96px)}
.buffet{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}
.buffet-head h2,.buffet-strip-head h2{font-family:var(--f-title);font-weight:700;color:var(--green);font-size:clamp(2rem,4.4vw,3rem);line-height:1.05;margin:0}
.buffet-head p{color:var(--ink);opacity:.8;max-width:56ch;margin:14px 0 0}
.buffet .eyebrow,.buffet-strip .eyebrow{display:block}
.buffet-tiers{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(var(--tiers-md,2),minmax(0,1fr));gap:18px}
@media (min-width:1000px){ .buffet-tiers{grid-template-columns:repeat(var(--tiers,3),minmax(0,1fr))} }
@media (max-width:620px){ .buffet-tiers{grid-template-columns:1fr} }
.buffet-tier{background:var(--cream);border-radius:var(--r-md);padding:22px 48px 20px 22px;position:relative}
.buffet-index{position:absolute;right:18px;top:14px;font-family:var(--f-hand);color:var(--gold-ink);font-size:1.5rem}
.buffet-tier h3{font-family:var(--f-title);color:var(--green);font-size:1.1rem;margin:4px 0 0}
.buffet-price{margin:10px 0 0;font-family:var(--f-title);color:var(--gold-text)}
.buffet-price b{font-size:2.2rem;font-weight:800}
.buffet-price small{font-size:1rem;margin-left:4px}
.buffet-note{font-size:.86rem;margin:6px 0 0;opacity:.8}
.buffet-extras{margin-top:28px}
.buffet-extras ul,.buffet-strip-list{list-style:none;margin:10px 0 0;padding:0}
.buffet-extras li,.buffet-strip-list li{display:flex;align-items:baseline;gap:10px;padding:9px 0;border-bottom:1px solid var(--cream)}
.buffet-extras li i{flex:1 1 auto}
.buffet-extras small,.buffet-strip-list small{display:block;font-size:.82rem;opacity:.75}
.buffet-extra-price b,.buffet-strip-list strong b{font-family:var(--f-title);color:var(--gold-text)}
.buffet-strip-list li span{flex:1 1 auto}
.buffet-foot,.buffet-strip-foot{font-size:.86rem;opacity:.8;margin:14px 0 0}
.buffet-wrap{padding-top:clamp(32px,5vw,56px)}
.buffet-strip{background:var(--paper);border-radius:var(--r-md);padding:22px 24px}

/* Cookie 条：接受 / 拒绝两个按钮同等分量（CNIL）；手机上收紧，不占半屏（审计） */
.cookie-actions{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:620px){
  .cookiebar{left:10px;right:10px;padding:12px 14px;gap:10px}
  .cookiebar p{font-size:.76rem;line-height:1.45;flex-basis:100%}
  .cookiebar .btn{padding:9px 16px;font-size:.72rem}
}
.cookiebar p a{color:var(--green);font-weight:600}

/* 法律页 */
.legal-body h2{font-family:var(--f-title);font-weight:700;font-size:1.22rem;color:var(--green);margin:38px 0 12px}
.legal-body ul{padding-left:1.2em;color:var(--ink)}
.legal-nav{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:28px;font-size:.92rem}
.legal-nav a[aria-current="page"]{font-weight:700;text-decoration:none}
.err404-text{margin:20px auto 0}
.err404-cta{justify-content:center;margin-top:32px}

.footer-about,.footer-address{font-size:.92rem;margin:0 0 10px}
.footer-tel{margin:6px 0 0;font-size:.92rem}
.footer-follow{margin-top:26px}

/* 通用法律页正文的结构（.legal-facts / .legal-table / 同意状态 / 「Modifier mon choix」按钮），按底稿 .legal-dl 的样子 */
.legal-facts{margin:0 0 8px;border-top:1px solid var(--cream)}
.legal-facts>div{display:grid;grid-template-columns:minmax(160px,34%) 1fr;border-bottom:1px solid var(--cream)}
.legal-facts dt{font-weight:600;color:var(--green);padding:11px 14px 11px 0;font-size:.94rem}
.legal-facts dd{margin:0;padding:11px 0;font-size:.94rem;color:var(--ink)}
@media (max-width:620px){ .legal-facts>div{grid-template-columns:1fr} .legal-facts dt{padding-bottom:0} .legal-facts dd{padding-top:2px} }
.legal-table-wrap{overflow-x:auto;margin:10px 0 18px}
.legal-table{width:100%;border-collapse:collapse;font-size:.88rem}
.legal-table caption{text-align:left;font-weight:600;color:var(--green);padding-bottom:8px}
.legal-table th,.legal-table td{text-align:left;vertical-align:top;padding:9px 10px 9px 0;border-bottom:1px solid var(--cream)}
.legal-table th{color:var(--green)}
.legal-table code{font-size:.82rem;word-break:break-all}
.consent-status{font-weight:600;color:var(--green)}
.legal-body .button{display:inline-flex;align-items:center;font-family:var(--f-body);font-size:.82rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:12px 22px;border:0;border-radius:var(--r-sm);background:var(--green);color:var(--cream);margin-top:6px}
.legal-body .button[hidden]{display:none}

/* 404：底稿用 .legal 外框，会把按钮文字染成链接绿（看不见）；单独给外框 */
.page404{padding-top:calc(var(--nav-h) + clamp(36px,6vw,72px));padding-bottom:clamp(56px,8vw,110px);background:var(--paper)}
.page404 .btn{text-decoration:none}
/* 菜单页首屏是绿底：订位按钮用描边款，不用同色的绿按钮 */
.menu-hero .btn-ghost{box-shadow:inset 0 0 0 2px var(--gold)}
