/* Il Matto — переиспользуемые компоненты: состояния наведения/фокуса, мелкая полировка.
   Мобильная геометрия — в base.css, десктопные раскладки — в desktop.css. */

/* --- фокус с клавиатуры: одно кольцо на всё --- */
:focus{outline:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
.btn:focus-visible,.btn-cream:focus-visible,.btn-ghost:focus-visible,.ico:focus-visible,.quick__toggle:focus-visible{outline-offset:2px;border-radius:var(--radius-sm)}
.hall:focus-visible{outline-offset:-2px;border-radius:var(--radius)}

/* --- выделение текста в цвет бренда --- */
::selection{background:rgba(var(--gold-rgb),.32);color:var(--ink)}

/* --- иконки-кнопки в шапке --- */
.ico{transition:background .3s var(--ease-soft),border-color .3s var(--ease-soft),transform .25s var(--ease-soft)}
.ico:active{transform:scale(.94)}
.ico svg{transition:transform .3s var(--ease-soft)}

/* --- кнопки: наведение только там, где есть мышь --- */
@media (hover:hover){
  .btn:hover{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 16px 34px -10px rgba(196,71,43,.55),inset 0 1px 0 rgba(255,255,255,.2)}
  .btn-cream:hover{transform:translateY(-1px);box-shadow:0 14px 30px -10px rgba(var(--shadow-rgb),.6)}
  .btn-ghost:hover{border-color:rgba(var(--gold-rgb),.6);background:rgba(var(--gold-rgb),.06)}
  .ico:hover{background:rgba(var(--ink-rgb),.1);border-color:rgba(var(--ink-rgb),.3)}
  .quick__toggle:hover{border-color:rgba(var(--gold-rgb),.6);background:rgba(var(--gold-rgb),.1)}
  .quick__item:hover{background:rgba(var(--ink-rgb),.1)}
  .menu__head:hover{color:var(--gold-2)}
  .menu__head:hover .menu__sign{border-color:rgba(var(--gold-rgb),.5)}
  .map__link:hover{border-color:rgba(var(--gold-rgb),.5)}
  .contacts__soc a:hover,.nav__row a:hover{border-color:rgba(var(--gold-rgb),.55);background:rgba(var(--gold-rgb),.06)}
  .footer__links a:hover{color:var(--ink)}
  .wine__link:hover{color:var(--gold-2)}
  .wine__link:hover svg,.hall__more svg,.btn-ghost svg{transition:transform .3s var(--ease-soft)}
  .wine__link:hover svg{transform:translateX(3px)}
}
.btn:active,.btn-cream:active{transform:scale(.97)}

/* --- ссылки в тексте: подчёркивание золотом --- */
.prose a,.contacts a:not(.contacts__phone):not(.contacts__soc a),.done__text a{
  text-decoration:underline;text-decoration-color:rgba(var(--gold-rgb),.45);text-underline-offset:4px;text-decoration-thickness:1px;
  transition:text-decoration-color .3s var(--ease-soft),color .3s var(--ease-soft);
}
@media (hover:hover){
  .prose a:hover,.contacts a:hover,.done__text a:hover{text-decoration-color:var(--gold);color:var(--gold-2)}
}

/* --- быстрые действия: аккуратные пункты --- */
.quick__item{transition:background .25s var(--ease-soft)}
.quick__item svg{flex:none}

/* --- аккордеон меню: плавная стрелка и разделители --- */
.menu__sign{transition:transform .4s var(--ease),border-color .3s var(--ease-soft),background .3s var(--ease-soft)}
.menu__head[aria-expanded="true"] .menu__sign{background:rgba(var(--gold-rgb),.12);border-color:rgba(var(--gold-rgb),.45)}

/* --- карточки залов/фото: мягкое приближение фото при наведении --- */
.hall__img,.dish__img img,.shot__img{transition:transform 1.1s var(--ease-soft)}
@media (hover:hover){
  .hall:hover .hall__img,.dish:hover .dish__img img,.shot:hover .shot__img{transform:scale(1.045)}
  .hall{transition:border-color .4s var(--ease-soft)}
  .hall:hover{border-color:rgba(var(--gold-rgb),.45)}
  .hall__more svg{transition:transform .3s var(--ease-soft)}
  .hall:hover .hall__more svg{transform:translateX(3px)}
}

/* --- тонкие детали --- */
.pill svg{opacity:.9}
.eyebrow{text-wrap:balance}
.fact b{letter-spacing:-.01em}
.row b{font-variant-numeric:tabular-nums}
.wine__num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.contacts__phone{font-variant-numeric:tabular-nums;letter-spacing:.01em}

/* --- курсор --- */
.hall,.menu__head,.quick__toggle,[data-book],[data-nav-open],[data-nav-close]{cursor:pointer}

/* --- reduced motion: без параллакса и «шайна» --- */
@media (prefers-reduced-motion:reduce){
  .btn::after{animation:none;display:none}
  .grain{animation:none}
  .region__bg{transform:none!important}
}
