/* ====================================================================
   Restaurant Impérial — Component styles
   Class-level styling for the components exported from components/*.jsx.
   Imported by the root styles.css; consuming projects get it for free.
   ==================================================================== */

/* ==================== Button ==================== */
.imp-btn{display:inline-flex;align-items:center;justify-content:center;font:500 12px/1 var(--font-sans);letter-spacing:var(--ls-button);text-transform:uppercase;padding:16px 28px;border:0;border-radius:var(--r-0);cursor:pointer;text-decoration:none;transition:all var(--dur-base) var(--ease-out)}
.imp-btn--primary{background:var(--ink-900);color:var(--paper)}
.imp-btn--primary:hover{background:var(--gold-600)}
.imp-btn--primary:active{background:var(--gold-800)}
.imp-btn--secondary{background:transparent;color:var(--ink-900);border:1px solid var(--ink-900)}
.imp-btn--secondary:hover{background:var(--ink-900);color:var(--paper)}
.imp-btn--primary-light{background:var(--paper);color:var(--ink-900)}
.imp-btn--primary-light:hover{background:var(--gold-600);color:var(--paper)}
.imp-btn--ghost{background:transparent;color:var(--gold-700);padding:14px 8px;position:relative}
.imp-btn--ghost::after{content:'';position:absolute;left:8px;right:8px;bottom:8px;height:1px;background:currentColor;transform-origin:left;transform:scaleX(0);transition:transform 280ms var(--ease-out)}
.imp-btn--ghost:hover::after{transform:scaleX(1)}
.imp-btn--ghost-light{background:transparent;color:var(--paper);padding:14px 8px;position:relative;border:0}
.imp-btn--ghost-light::after{content:'';position:absolute;left:8px;right:8px;bottom:8px;height:1px;background:currentColor;transform-origin:left;transform:scaleX(0);transition:transform 280ms var(--ease-out)}
.imp-btn--ghost-light:hover::after{transform:scaleX(1)}

/* ==================== Eyebrow ==================== */
.imp-eyebrow{font:500 11px/1 var(--font-sans);letter-spacing:0.28em;text-transform:uppercase}
.imp-eyebrow--gold{color:var(--gold-700)}
.imp-eyebrow--cream{color:var(--gold-300)}
.imp-eyebrow--ink{color:var(--ink-800)}

/* ==================== SealDivider ==================== */
.imp-divider{display:flex;align-items:center;gap:18px}
.imp-divider__line{flex:1;height:1px;background:var(--gold-600)}
.imp-divider__seal{width:32px;height:32px;object-fit:contain}

/* ==================== Ornament ==================== */
.imp-ornament{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.imp-ornament__eb{font:500 11px/1 var(--font-sans);letter-spacing:0.28em;text-transform:uppercase;color:var(--gold-700)}
.imp-ornament__rule{width:56px;height:1px;background:var(--gold-600)}
.imp-ornament__title{font:400 56px/1.05 var(--font-display);color:var(--ink-900);letter-spacing:-0.01em;margin:0}
.imp-ornament__cn{font:500 17px/1 var(--font-cn);color:var(--gold-700);letter-spacing:0.1em}

/* ==================== LangSwitch ==================== */
.imp-lang{display:flex;gap:6px;align-items:center;font:500 11px/1 var(--font-sans);letter-spacing:0.18em}
.imp-lang__btn{background:none;border:0;padding:4px 2px;color:var(--fg-mute);cursor:pointer;font:inherit}
.imp-lang__btn.is-active{color:var(--ink-900)}
.imp-lang__sep{color:var(--fg-mute)}

/* ==================== DishPlaceholder ==================== */
.imp-photo{position:relative;overflow:hidden;width:100%}
.imp-photo__seal{position:absolute;right:14px;bottom:14px;width:36px;height:36px;opacity:0.5;filter:brightness(0) invert(1)}
.imp-photo__label{position:absolute;left:14px;top:14px;font:500 9px/1 var(--font-sans);letter-spacing:0.24em;text-transform:uppercase;color:rgba(255,240,210,0.85)}

/* ==================== MenuSection ==================== */
.menu-sec{margin-bottom:56px}
.menu-sec__head{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;margin-bottom:28px}
.menu-sec__titles{display:flex;align-items:baseline;gap:16px}
.menu-sec__fr{font:400 38px/1 var(--font-display);color:var(--ink-900);letter-spacing:-0.005em;margin:0}
.menu-sec__cn{font:500 22px/1 var(--font-cn);color:var(--gold-700);letter-spacing:0.08em}
.menu-sec__rule{width:40px;height:1px;background:var(--gold-600);margin-top:4px}
.menu-sec__en{font:500 10px/1 var(--font-sans);letter-spacing:0.32em;text-transform:uppercase;color:var(--gold-700)}
.menu-sec__note{text-align:center;font:400 italic 13px/1.5 var(--font-serif);color:var(--fg-soft);margin:-14px 0 18px}
.menu-sec__list{list-style:none;margin:0;padding:0}

/* ==================== MenuItem ==================== */
.menu-item{padding:18px 0;border-bottom:1px solid var(--line-soft)}
.menu-item:last-child{border-bottom:0}
.menu-item__row{display:flex;align-items:flex-end;gap:12px;width:100%}
.menu-item__fr{flex:0 0 auto;font:500 19px/1.25 var(--font-serif);color:var(--ink-900);white-space:nowrap}
.menu-item__fr .menu-tag{margin-left:10px;vertical-align:2px}
.menu-item__leader{flex:1 1 auto;min-width:24px;border-bottom:1.5px dotted var(--gold-400);margin-bottom:8px}
.menu-item__price{flex:0 0 auto;font:400 22px/1 var(--font-display);color:var(--ink-900);white-space:nowrap}
.menu-item__cn{font:500 13px/1 var(--font-cn);color:var(--gold-700);letter-spacing:0.06em;margin-top:4px}
.menu-item__desc{font:400 italic 14px/1.55 var(--font-serif);color:var(--fg-soft);margin-top:4px;max-width:560px}
.menu-tag{display:inline-block;font:500 10px/1 var(--font-sans);letter-spacing:0.18em;text-transform:uppercase;padding:3px 8px;border-radius:999px}
.menu-tag--spice{color:var(--red-700);background:var(--red-100)}
.menu-tag--veg{color:var(--jade-700);background:var(--jade-100)}
.menu-tag--sig{color:var(--gold-800);background:var(--gold-100);border:1px solid var(--gold-400)}