/* ═══════════════════════════════════════
   رستوران آرمانی — لندینگ منوی دیجیتال
   ساده، با آیکون · موبایل‌فرست
   ═══════════════════════════════════════ */

:root{
  --bg:       #0C0C0B;
  --card:     #131211;
  --card-2:   #171614;
  --line:     rgba(255,255,255,.08);
  --line-hi:  rgba(201,166,106,.38);
  --gold:     #C9A66A;
  --gold-dim: rgba(201,166,106,.14);
  --txt:      #EDE9E2;
  --dim:      rgba(237,233,226,.56);
  --faint:    rgba(237,233,226,.34);
  --ease:     cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:
    radial-gradient(120% 60% at 50% -10%, rgba(201,166,106,.07), transparent 60%),
    var(--bg);
  background-attachment:fixed;
  color:var(--txt);
  font-family:"Vazirmatn","Segoe UI",Tahoma,sans-serif;
  font-size:16px;
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; -webkit-tap-highlight-color:transparent; }
svg{ width:1em; height:1em; fill:none; stroke:currentColor;
     stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.sprite{ position:absolute; width:0; height:0; overflow:hidden; }
::selection{ background:var(--gold); color:#141210; }
:focus-visible{ outline:1px solid var(--gold); outline-offset:3px; border-radius:8px; }

/* ─────────── چیدمان ─────────── */
.page{
  max-width:680px;
  margin-inline:auto;
  padding:clamp(44px,11vw,76px) clamp(18px,5vw,28px)
          max(28px, env(safe-area-inset-bottom));
  min-height:100svh;
  display:flex; flex-direction:column;
}

/* ─────────── سربرگ ─────────── */
.head{ text-align:center; }

.head__logo img{
  width:clamp(70px,19vw,92px);
  margin-inline:auto;
  opacity:.94;
}

.head__title{
  margin:clamp(18px,4.5vw,24px) 0 0;
  font-size:clamp(1.45rem,5.8vw,1.95rem);
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.5;
}

.head__sub{
  display:inline-flex; align-items:center; gap:9px;
  margin:10px 0 0;
  font-size:clamp(.82rem,3.3vw,.92rem);
  color:var(--dim);
}
.dot{
  width:6px; height:6px; border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 0 rgba(201,166,106,.5);
  animation:ping 2.4s var(--ease) infinite;
}
@keyframes ping{
  60%{ box-shadow:0 0 0 8px rgba(201,166,106,0); }
  100%{ box-shadow:0 0 0 0 rgba(201,166,106,0); }
}

/* ─────────── کارت‌های شعبه ─────────── */
.branches{
  margin-top:clamp(30px,7vw,44px);
  display:grid;
  gap:12px;
}

.b{
  position:relative;
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(165deg,var(--card-2),var(--card));
  overflow:hidden;
  transition:border-color .4s ease, transform .4s var(--ease);
}

.b__main{
  display:flex; align-items:center; gap:14px;
  padding:16px 16px 12px;
}

/* کاشیِ آیکون */
.b__icon{
  flex:none;
  display:grid; place-items:center;
  width:46px; height:46px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--gold-dim);
  color:var(--gold);
  font-size:1.32rem;
  transition:background .4s ease, border-color .4s ease, transform .5s var(--ease);
}

.b__text{ display:flex; flex-direction:column; gap:1px; min-width:0; flex:1; }

.b__name{
  font-size:clamp(1rem,4vw,1.1rem);
  font-weight:600;
  line-height:1.55;
}
.b__addr{
  font-size:clamp(.78rem,3.1vw,.85rem);
  color:var(--dim);
  line-height:1.6;
}

.b__arrow{
  flex:none;
  display:grid; place-items:center;
  width:34px; height:34px;
  border-radius:50%;
  font-size:.95rem;
  color:var(--gold);
  transition:transform .45s var(--ease), background .35s ease;
}

/* ردیفِ مسیریابی */
.b__map{
  display:flex; align-items:center; gap:7px;
  padding:11px 16px 13px;
  margin-top:2px;
  border-top:1px solid var(--line);
  font-size:.8rem;
  color:var(--faint);
  transition:color .3s ease, background .3s ease;
}
.b__map svg{ font-size:1.05rem; color:var(--gold); opacity:.75; }

@media (hover:hover){
  .b:hover{ border-color:var(--line-hi); transform:translateY(-2px); }
  .b:hover .b__icon{ background:rgba(201,166,106,.22); border-color:var(--line-hi); transform:scale(1.04); }
  .b:hover .b__arrow{ transform:translateX(-4px); }
  .b__map:hover{ color:var(--gold); background:rgba(201,166,106,.05); }
}
.b__main:active{ background:rgba(255,255,255,.02); }

/* ─────────── تماس مشترک ─────────── */
.call{
  display:flex; align-items:center; gap:10px;
  margin-top:16px;
  padding:15px 18px;
  border:1px solid var(--line-hi);
  border-radius:16px;
  background:var(--gold-dim);
  color:var(--gold);
  font-size:.92rem;
  transition:background .35s ease, transform .35s var(--ease);
}
.call svg{ font-size:1.15rem; fill:currentColor; stroke:none; }
.call__label{ font-weight:600; }
.call__num{
  margin-inline-start:auto;
  font-weight:700;
  letter-spacing:.02em;
}
@media (hover:hover){
  .call:hover{ background:rgba(201,166,106,.22); transform:translateY(-2px); }
}
.call:active{ transform:scale(.99); }

/* ─────────── پانویس ─────────── */
.foot{
  margin-top:auto;
  padding-top:clamp(34px,8vw,52px);
  text-align:center;
}

.foot__hours{
  display:inline-flex; align-items:center; gap:8px;
  margin:0;
  font-size:clamp(.76rem,3vw,.83rem);
  color:var(--dim);
}
.foot__hours svg{ font-size:1.05rem; color:var(--gold); opacity:.7; flex:none; }

.foot__social{ display:flex; justify-content:center; gap:10px; margin:18px 0 0; }
.foot__social a{
  display:grid; place-items:center;
  width:42px; height:42px;
  border:1px solid var(--line);
  border-radius:50%;
  color:var(--dim);
  font-size:1.1rem;
  transition:color .3s ease, border-color .3s ease, background .3s ease;
}
@media (hover:hover){
  .foot__social a:hover{ color:var(--gold); border-color:var(--line-hi); background:var(--gold-dim); }
}

.foot__copy{ margin:18px 0 0; font-size:.71rem; color:var(--faint); }

/* ─────────── ورودِ نرم ─────────── */
[data-fade]{
  opacity:0; transform:translateY(14px);
  transition:opacity .65s var(--ease), transform .65s var(--ease);
  transition-delay:calc(var(--d,0) * 85ms);
}
[data-fade].in{ opacity:1; transform:none; }

/* ─────────── دسکتاپ ─────────── */
@media (min-width:760px){
  .page{ max-width:1000px; }
  .branches{ grid-template-columns:repeat(3,1fr); gap:14px; }
  .b{ display:flex; flex-direction:column; }
  .b__main{ flex-direction:column; align-items:flex-start; gap:14px; padding:22px 20px 16px; flex:1; }
  .b__icon{ width:50px; height:50px; font-size:1.42rem; }
  .b__arrow{ position:absolute; top:22px; inset-inline-start:18px; }
  .b__text{ flex:none; }
  .call{ max-width:420px; margin-inline:auto; margin-top:22px; }
}

/* ─────────── صفحه‌های خیلی باریک ─────────── */
@media (max-width:350px){
  .b__main{ gap:11px; padding:14px 13px 11px; }
  .b__icon{ width:42px; height:42px; font-size:1.2rem; }
  .b__arrow{ width:28px; height:28px; }
  .b__map{ padding-inline:13px; }
  .call{ padding:14px; font-size:.86rem; }
}

/* ─────────── کاهش حرکت ─────────── */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
  [data-fade]{ opacity:1 !important; transform:none !important; }
}