/* ============================================================
   iraqbus.ir — سیستمِ طراحیِ ۱۴۰۵
   ------------------------------------------------------------
   روی HTMLِ موجود سوار می‌شود؛ هیچ صفحه‌ای تغییر نمی‌کند.
   بعد از style.css بارگذاری می‌شود، پس همین‌جا شکلِ نهایی تعیین می‌شود.

   قواعد:
     • دو زبانه: فارسی با Vazirmatn، عربی با Cairo
     • حالتِ شب خودکار (prefers-color-scheme)
     • احترام به prefers-reduced-motion
     • هدفِ لمس ۴۴px، تمرکزِ صفحه‌کلیدِ دیدنی، کنتراستِ ۴.۵:۱
     • بدونِ !important مگر جایی که سبکِ درون‌خطیِ قدیمی را باید غلبه کنیم
   ============================================================ */

:root{
  /* رنگ‌های برند — همان‌ها، فقط منظم‌تر */
  --g-900:#1b1b1b; --g-800:#8a6d16; --g-700:#3d3d3d; --g-600:#c9a227;
  --g-100:#eef0ef; --g-050:#f6f6f7;
  --gold-700:#8a7328; --gold-600:#a8871f; --gold:#c9a227; --gold-400:#e6c866; --gold-100:#faf3dd;

  --ink:#16211c; --ink-2:#3d4a44; --muted:#6b7873; --line:#e3ddcd;
  --paper:#fdfcf9; --paper-2:#f7f4ec; --white:#fff;

  --ok:#c9a227; --warn:#a5621a; --err:#c0392b; --info:#1a5f8a;

  /* ارتفاعِ سایه — پنج پله، نه بیشتر */
  --e1:0 1px 2px rgba(11,61,46,.06), 0 1px 3px rgba(11,61,46,.08);
  --e2:0 4px 8px -2px rgba(11,61,46,.08), 0 2px 4px -2px rgba(11,61,46,.06);
  --e3:0 12px 20px -6px rgba(11,61,46,.12), 0 4px 8px -4px rgba(11,61,46,.08);
  --e4:0 24px 40px -12px rgba(11,61,46,.18), 0 8px 16px -8px rgba(11,61,46,.10);
  --e5:0 40px 72px -20px rgba(7,40,30,.28);

  --r-xs:8px; --r-sm:12px; --r:16px; --r-lg:22px; --r-xl:30px; --r-full:999px;

  /* مقیاسِ فاصله — همه مضربِ ۴ */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px;
  --s8:32px; --s10:40px; --s12:48px; --s16:64px; --s20:80px; --s24:96px;

  --wrap:1180px;
  --font:'Vazirmatn','Segoe UI',Tahoma,sans-serif;
  --font-ar:'Cairo','Tajawal','Vazirmatn',sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
  --t:.22s var(--ease);
}

html[lang="ar"]{ --font:var(--font-ar); }

/* ───────── حالتِ شب ───────── */
@media (prefers-color-scheme: dark){
  :root{
    --ink:#eaf1ed; --ink-2:#c3d1ca; --muted:#93a49c; --line:#25352d;
    --paper:#171717; --paper-2:#1a1a1a; --white:#1c1c1c;
    --g-100:#333333; --g-050:#171717; --gold-100:#2a2416;
  }
}
:root[data-theme="dark"]{
  --ink:#eaf1ed; --ink-2:#c3d1ca; --muted:#93a49c; --line:#25352d;
  --paper:#171717; --paper-2:#1a1a1a; --white:#1c1c1c;
  --g-100:#333333; --g-050:#171717; --gold-100:#2a2416;
}
:root[data-theme="light"]{
  --ink:#16211c; --ink-2:#3d4a44; --muted:#6b7873; --line:#e3ddcd;
  --paper:#fdfcf9; --paper-2:#f7f4ec; --white:#fff;
  --g-100:#eef0ef; --g-050:#f6f6f7; --gold-100:#faf3dd;
}

/* ───────── پایه ───────── */
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

body{
  font-family:var(--font);
  background:var(--paper);
  color:var(--ink);
  line-height:1.85;
  font-size:16px;
  text-rendering:optimizeLegibility;
}

/* تمرکزِ صفحه‌کلید — بدونِ این، سایت برای کاربرِ صفحه‌کلید غیرقابل‌استفاده است */
:focus-visible{
  outline:3px solid var(--gold);
  outline-offset:2px;
  border-radius:var(--r-xs);
}
:focus:not(:focus-visible){ outline:none; }

/* پرشِ مستقیم به محتوا — برای صفحه‌خوان و صفحه‌کلید */
.kg-skip{
  position:absolute; inset-inline-start:var(--s4); top:-100px; z-index:9999;
  background:var(--g-800); color:#fff; padding:var(--s3) var(--s6);
  border-radius:0 0 var(--r) var(--r); font-weight:800; text-decoration:none;
  transition:top var(--t);
}
.kg-skip:focus{ top:0; }

::selection{ background:var(--gold-400); color:var(--g-900); }

/* ───────── تایپوگرافی ───────── */
h1,h2,h3,h4,h5{ font-family:var(--font); color:var(--ink); line-height:1.4; text-wrap:balance; }
h1{ font-size:clamp(27px,4.4vw,44px); font-weight:900; letter-spacing:-.4px; }
h2{ font-size:clamp(22px,3.1vw,33px); font-weight:800; letter-spacing:-.2px; }
h3{ font-size:clamp(18px,2.2vw,23px); font-weight:800; }
h4{ font-size:17px; font-weight:800; }
p{ color:var(--ink-2); text-wrap:pretty; }

.container,.kg-wrap{ max-width:var(--wrap); margin-inline:auto; padding-inline:var(--s6); }
@media (max-width:640px){ .container,.kg-wrap{ padding-inline:var(--s4); } }

.section{ padding-block:clamp(var(--s12),7vw,var(--s24)); }
.section-head{ text-align:center; max-width:680px; margin-inline:auto; margin-block-end:var(--s12); }
.section-head h2{ margin-block-end:var(--s3); }
.section-head p{ font-size:17px; color:var(--muted); }

.eyebrow{
  display:inline-flex; align-items:center; gap:var(--s2);
  font-size:13px; font-weight:800; letter-spacing:.2px;
  color:var(--g-600); background:var(--g-100);
  padding:var(--s2) var(--s5); border-radius:var(--r-full);
  margin-block-end:var(--s4);
}

/* ───────── دکمه ───────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
  min-height:48px; padding:var(--s3) var(--s8);
  border-radius:var(--r-sm); border:2px solid transparent;
  font-family:inherit; font-size:15.5px; font-weight:800; line-height:1.2;
  cursor:pointer; text-decoration:none; white-space:nowrap;
  transition:transform var(--t), box-shadow var(--t), background var(--t), border-color var(--t);
}
.btn:active{ transform:translateY(1px); }

.btn-gold{
  background:linear-gradient(135deg,var(--gold),var(--gold-400));
  color:var(--g-900); box-shadow:var(--e2);
}
.btn-gold:hover{ box-shadow:var(--e4); transform:translateY(-2px); }

.btn-primary,.btn-green{
  background:linear-gradient(135deg,var(--g-600),var(--g-800));
  color:#fff; box-shadow:var(--e2);
}
.btn-primary:hover,.btn-green:hover{ box-shadow:var(--e4); transform:translateY(-2px); }

.btn-outline{
  background:transparent; border-color:currentColor; color:var(--g-700);
}
.btn-outline:hover{ background:var(--g-050); }

.btn-lg{ min-height:56px; padding-inline:var(--s10); font-size:17px; }
.btn-block{ width:100%; }

/* ───────── سربرگ و ناوبری ───────── */
header{
  position:sticky; top:0; z-index:900;
  background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:saturate(1.6) blur(14px);
  -webkit-backdrop-filter:saturate(1.6) blur(14px);
  border-block-end:1px solid var(--line);
  transition:box-shadow var(--t);
}
header.kg-stuck{ box-shadow:var(--e3); }

header nav{
  max-width:var(--wrap); margin-inline:auto;
  padding:var(--s3) var(--s6);
  display:flex; align-items:center; gap:var(--s5);
}
@media (max-width:640px){ header nav{ padding-inline:var(--s4); } }

header .logo{
  display:flex; align-items:center; gap:var(--s2);
  font-weight:900; font-size:16.5px; color:var(--g-800);
  white-space:nowrap;
}
header .logo img{ width:36px; height:36px; }

header nav > ul{
  display:flex; align-items:center; gap:var(--s1);
  margin-inline-start:auto; list-style:none;
}
header nav > ul > li > a{
  display:inline-flex; align-items:center; min-height:44px;
  padding:var(--s2) var(--s4); border-radius:var(--r-sm);
  font-size:14.5px; font-weight:700; color:var(--ink-2);
  text-decoration:none; transition:background var(--t), color var(--t);
}
header nav > ul > li > a:hover,
header nav > ul > li > a.active{ background:var(--g-050); color:var(--g-800); }

.submenu{
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--e4); padding:var(--s2);
  min-width:230px;
}
.submenu a{
  display:block; padding:var(--s2) var(--s4); border-radius:var(--r-xs);
  font-size:14px; color:var(--ink-2); text-decoration:none;
}
.submenu a:hover{ background:var(--g-050); color:var(--g-800); }

.nav-cta > a,a.nav-cta{
  background:linear-gradient(135deg,var(--gold),var(--gold-400)) !important;
  color:var(--g-900) !important; font-weight:800;
}
.nav-toggle{
  min-width:44px; min-height:44px; border:1.5px solid var(--line);
  border-radius:var(--r-sm); background:var(--white); color:var(--g-800);
  font-size:20px; cursor:pointer;
}

/* ───────── کارت ───────── */
.card,.service-card,.step-card,.kg-card{
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:var(--s6);
  box-shadow:var(--e1);
  transition:transform var(--t), box-shadow var(--t), border-color var(--t);
}
.card:hover,.service-card:hover,.kg-card:hover{
  transform:translateY(-3px); box-shadow:var(--e3); border-color:var(--gold-400);
}
.kg-grid{ display:grid; gap:var(--s5); grid-template-columns:repeat(auto-fit,minmax(258px,1fr)); }

/* ───────── فرم ───────── */
input,select,textarea{
  font-family:inherit; font-size:16px;      /* زیر ۱۶ باعث زومِ خودکارِ iOS می‌شود */
  min-height:48px; width:100%;
  padding:var(--s3) var(--s4);
  background:var(--white); color:var(--ink);
  border:1.5px solid var(--line); border-radius:var(--r-sm);
  transition:border-color var(--t), box-shadow var(--t);
}
textarea{ min-height:96px; line-height:1.8; }
input:focus,select:focus,textarea:focus{
  border-color:var(--g-600);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--g-600) 16%, transparent);
  outline:none;
}
input[aria-invalid="true"],.kg-invalid{
  border-color:var(--err);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--err) 14%, transparent);
}
label{ display:block; font-size:14px; font-weight:700; color:var(--ink-2); margin-block-end:var(--s2); }

/* ───────── بلوکِ صفحاتِ مرتبط ───────── */
.kg-related{
  display:block; margin-block:var(--s16) var(--s10);
  padding-block:var(--s10);
  border-block-start:1px solid var(--line);
}
.kg-related-in{ max-width:var(--wrap); margin-inline:auto; padding-inline:var(--s6); }
.kg-related-h{ font-size:clamp(20px,2.6vw,26px); margin:0 0 var(--s2); }
.kg-related-sub{ color:var(--muted); font-size:15px; margin:0 0 var(--s6); }
.kg-related-grid{
  display:grid; gap:var(--s3); list-style:none; padding:0; margin:0;
  grid-template-columns:repeat(auto-fit,minmax(238px,1fr));
}
.kg-related-grid a{
  display:flex; flex-direction:column; gap:var(--s1);
  min-height:64px; height:100%; padding:var(--s4) var(--s5);
  background:var(--white); border:1px solid var(--line);
  border-inline-start:3px solid var(--gold);
  border-radius:var(--r-sm); text-decoration:none;
  transition:transform var(--t), box-shadow var(--t), border-color var(--t);
}
.kg-related-grid a:hover{
  transform:translateX(-4px); box-shadow:var(--e2);
  border-color:var(--gold); background:var(--gold-100);
}
html[dir="ltr"] .kg-related-grid a:hover{ transform:translateX(4px); }
.kg-related-t{ font-weight:800; font-size:14.5px; color:var(--g-800); line-height:1.55; }
.kg-related-c{ font-size:11.5px; color:var(--muted); font-weight:600; }

/* ───────── فوتر ───────── */
.kg-footer{
  display:block !important;                 /* فوترِ قدیمی display:none بود */
  margin-block-start:var(--s16);
  padding-block:var(--s16) var(--s6);
  background:linear-gradient(180deg,var(--g-900),#04180f);
  color:#cfe0d6;
}
.kg-footer .container{ max-width:var(--wrap); }
.kg-footer-grid{
  display:grid; gap:var(--s8);
  grid-template-columns:1.5fr repeat(auto-fit,minmax(158px,1fr));
}
@media (max-width:900px){ .kg-footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .kg-footer-grid{ grid-template-columns:1fr; gap:var(--s6); } }

.kg-footer-logo{
  display:flex; align-items:center; gap:var(--s2);
  font-weight:900; font-size:16px; color:#fff; margin-block-end:var(--s3);
}
.kg-footer-logo img{ width:40px; height:40px; }
.kg-footer-brand p{ color:#a9c4b6; font-size:14px; line-height:2; margin:0 0 var(--s4); }

.kg-footer-tel{ list-style:none; padding:0; margin:0; display:grid; gap:var(--s1); }
.kg-footer-tel a{
  display:inline-flex; align-items:center; gap:var(--s2);
  min-height:40px; color:var(--gold-400); font-weight:700; font-size:14.5px;
  text-decoration:none; direction:ltr;
}
.kg-footer-tel a:hover{ color:#fff; }

.kg-footer-col h4{ color:#fff; font-size:14.5px; margin:0 0 var(--s4); font-weight:800; }
.kg-footer-col ul{ list-style:none; padding:0; margin:0; display:grid; gap:2px; }
.kg-footer-col a{
  display:block; min-height:36px; padding-block:var(--s1);
  color:#a9c4b6; font-size:13.5px; text-decoration:none; line-height:1.75;
  transition:color var(--t), padding-inline-start var(--t);
}
.kg-footer-col a:hover{ color:var(--gold-400); padding-inline-start:var(--s2); }

.kg-footer-bottom{
  margin-block-start:var(--s10); padding-block-start:var(--s5);
  border-block-start:1px solid rgba(255,255,255,.09);
  color:#7e9a8c; font-size:12.5px; text-align:center;
}

/* ───────── نوارِ اقدامِ موبایل ───────── */
.kg-sticky-cta{
  position:fixed; inset-inline:0; bottom:0; z-index:880;
  display:none; gap:var(--s2); padding:var(--s2) var(--s3);
  padding-bottom:calc(var(--s2) + env(safe-area-inset-bottom));
  background:color-mix(in srgb, var(--paper) 94%, transparent);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-block-start:1px solid var(--line); box-shadow:0 -8px 24px -12px rgba(0,0,0,.22);
}
.kg-sticky-cta .btn{ flex:1; min-height:50px; font-size:15px; padding-inline:var(--s4); }
@media (max-width:820px){
  .kg-sticky-cta{ display:flex; }
  body{ padding-bottom:76px; }
}

/* ───────── ریزه‌کاری ───────── */
.kg-badge{
  display:inline-flex; align-items:center; gap:var(--s1);
  padding:var(--s1) var(--s3); border-radius:var(--r-full);
  font-size:12px; font-weight:800;
  background:var(--g-100); color:var(--g-700);
}
.kg-badge-gold{ background:var(--gold-100); color:var(--gold-700); }

img{ max-width:100%; height:auto; }
table{ border-collapse:collapse; width:100%; }
.kg-scroll-x,.admin-table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* هرگز اسکرولِ افقیِ کلِ صفحه */
html,body{ overflow-x:clip; }

/* چاپ: فقط محتوا */
@media print{
  header,.kg-sticky-cta,.kg-related,.kg-footer,.nav-toggle{ display:none !important; }
  body{ background:#fff; color:#000; }
}

/* ============================================================
   بخش‌های صفحهٔ اصلی
   ============================================================ */

/* ── نوارِ رزروِ سریع ── */
.hm-quick{
  margin-block-start:calc(var(--s10) * -1);
  position:relative; z-index:5;
  padding-block:var(--s10);
}
.hm-quick > .container{
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:var(--s8) var(--s6);
  box-shadow:var(--e5); text-align:center;
}
.hm-quick-h{ font-size:clamp(21px,3vw,29px); margin:0 0 var(--s2); }
.hm-quick-s{ color:var(--muted); font-size:15px; margin:0 0 var(--s6); }
.hm-quick-grid{
  display:grid; gap:var(--s3);
  grid-template-columns:repeat(auto-fit,minmax(126px,1fr));
  margin-block-end:var(--s6);
}
.hm-quick-b{
  display:flex; flex-direction:column; align-items:center; gap:var(--s2);
  min-height:104px; padding:var(--s4) var(--s2);
  background:var(--paper-2); border:2px solid transparent;
  border-radius:var(--r); text-decoration:none; transition:var(--t);
}
.hm-quick-b:hover{
  background:var(--white); border-color:var(--gold);
  transform:translateY(-4px); box-shadow:var(--e3);
}
.hm-quick-i{ font-size:30px; line-height:1; }
.hm-quick-t{ font-size:13px; font-weight:800; color:var(--g-800); line-height:1.6; }
.hm-quick-cta{ min-width:270px; }

/* ── خدمات ── */
.hm-svc-grid{ display:grid; gap:var(--s5); grid-template-columns:repeat(auto-fit,minmax(288px,1fr)); }
.hm-svc-card{
  display:flex; flex-direction:column; gap:var(--s2);
  padding:var(--s6); background:var(--white);
  border:1px solid var(--line); border-radius:var(--r-lg);
  text-decoration:none; box-shadow:var(--e1); transition:var(--t);
}
.hm-svc-card:hover{ transform:translateY(-5px); box-shadow:var(--e4); border-color:var(--gold-400); }
.hm-svc-i{ font-size:34px; line-height:1.1; }
.hm-svc-card h3{ font-size:18.5px; margin:0; }
.hm-svc-card p{ font-size:14px; line-height:1.95; margin:0; flex:1; }
.hm-svc-spec{ list-style:none; padding:0; margin:var(--s2) 0 0; display:grid; gap:var(--s1); }
.hm-svc-spec li{ font-size:12.5px; color:var(--muted); font-weight:600; }
.hm-svc-go{ font-size:13.5px; font-weight:800; color:var(--g-600); margin-block-start:var(--s3); }

/* ── مسیرها ── */
.hm-routes{ background:var(--paper-2); }
.hm-rt-grid{ display:grid; gap:var(--s3); grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
.hm-rt{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s4);
  min-height:74px; padding:var(--s4) var(--s5);
  background:var(--white); border:1px solid var(--line);
  border-inline-start:4px solid var(--gold);
  border-radius:var(--r-sm); text-decoration:none; transition:var(--t);
}
.hm-rt:hover{ transform:translateX(-4px); box-shadow:var(--e3); border-color:var(--gold); }
html[dir="ltr"] .hm-rt:hover{ transform:translateX(4px); }
.hm-rt-l{ font-size:14px; font-weight:700; color:var(--ink); line-height:1.75; }
.hm-rt-p{ font-size:21px; font-weight:900; color:var(--g-700); white-space:nowrap; direction:ltr; }
.hm-rt-p small{ font-size:11.5px; font-weight:700; color:var(--muted); }
.hm-rt-note{ margin:var(--s6) 0 0; font-size:13px; color:var(--muted); text-align:center; }

/* ── مراحل ── */
.hm-step-grid{
  display:grid; gap:var(--s5); list-style:none; padding:0; margin:0; counter-reset:none;
  grid-template-columns:repeat(auto-fit,minmax(196px,1fr));
}
.hm-step-grid li{ position:relative; padding-block-start:var(--s8); text-align:center; }
.hm-step-n{
  position:absolute; inset-block-start:0; inset-inline-start:50%; transform:translateX(50%);
  width:48px; height:48px; border-radius:50%;
  background:linear-gradient(135deg,var(--g-600),var(--g-800)); color:#fff;
  display:grid; place-items:center; font:900 20px inherit;
  box-shadow:var(--e2);
}
html[dir="ltr"] .hm-step-n{ transform:translateX(-50%); }
.hm-step-grid h3{ font-size:16px; margin:var(--s4) 0 var(--s1); }
.hm-step-grid p{ font-size:13.5px; color:var(--muted); margin:0; line-height:1.9; }

/* ── اعتماد ── */
.hm-trust{ background:var(--g-900); }
.hm-trust .section-head h2{ color:#fff; }
.hm-trust-grid{ display:grid; gap:var(--s5); grid-template-columns:repeat(auto-fit,minmax(212px,1fr)); }
.hm-trust-c{
  padding:var(--s6); background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1); border-radius:var(--r);
  text-align:center; transition:var(--t);
}
.hm-trust-c:hover{ background:rgba(255,255,255,.08); border-color:var(--gold); }
.hm-trust-c span{ font-size:32px; line-height:1.2; }
.hm-trust-c h3{ color:#fff; font-size:16.5px; margin:var(--s3) 0 var(--s1); }
.hm-trust-c p{ color:#9fbfae; font-size:13px; margin:0; line-height:1.85; }

/* ── پرداختِ پلکانی ── */
.hm-pay-grid{ display:grid; gap:var(--s5); grid-template-columns:repeat(auto-fit,minmax(226px,1fr)); }
.hm-pay-c{
  padding:var(--s8) var(--s5); background:var(--white);
  border:2px solid var(--line); border-radius:var(--r-lg); text-align:center;
  transition:var(--t);
}
.hm-pay-c:hover{ border-color:var(--gold); box-shadow:var(--e3); }
.hm-pay-c b{
  display:block; font-size:40px; font-weight:900;
  color:var(--gold-600); line-height:1; direction:ltr;
}
.hm-pay-c h3{ font-size:16px; margin:var(--s3) 0 var(--s1); }
.hm-pay-c p{ font-size:13px; color:var(--muted); margin:0; }

/* ── مقصدها ── */
.hm-dest{ background:var(--paper-2); }
.hm-dest-grid{ display:grid; gap:var(--s5); grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); }
.hm-dest-c{
  display:block; padding:var(--s6); background:var(--white);
  border:1px solid var(--line); border-radius:var(--r-lg);
  text-decoration:none; box-shadow:var(--e1); transition:var(--t);
  position:relative; overflow:hidden;
}
.hm-dest-c::before{
  content:''; position:absolute; inset-block-start:0; inset-inline-end:0;
  width:88px; height:88px; border-radius:50%;
  background:radial-gradient(circle,rgba(201,162,39,.14),transparent 70%);
  transform:translate(30%,-30%);
}
.hm-dest-c:hover{ transform:translateY(-5px); box-shadow:var(--e4); border-color:var(--gold-400); }
.hm-dest-c h3{ font-size:21px; margin:0 0 var(--s2); position:relative; }
.hm-dest-c p{ font-size:13.5px; margin:0 0 var(--s4); line-height:1.9; }
.hm-dest-c span{ font-size:13px; font-weight:800; color:var(--g-600); }

/* ── فراخوانِ پایانی ── */
.hm-cta{
  padding-block:var(--s20);
  background:linear-gradient(140deg,var(--g-800),var(--g-600) 60%,var(--g-900));
  color:#fff; text-align:center;
}
.hm-cta h2{ color:#fff; margin:0 0 var(--s3); }
.hm-cta p{ color:#cfe0d6; font-size:17px; margin:0 auto var(--s8); max-width:520px; }
.hm-cta-b{ display:flex; gap:var(--s3); justify-content:center; flex-wrap:wrap; }
.hm-cta-tel{ color:#fff; border-color:rgba(255,255,255,.4); direction:ltr; }
.hm-cta-tel:hover{ background:rgba(255,255,255,.1); }

/* ============================================================
   صفحاتِ داخلی — چیدمانِ بیزینسی
   بدونِ تغییرِ HTML؛ فقط با CSS روی همان نشانه‌گذاریِ موجود.
   ============================================================ */

/* ── سربندِ صفحه: اولین h1 داخلِ main ── */
main > .container > h1:first-child,
main > section:first-of-type h1,
main .page-head h1{ margin-block-end:var(--s4); }

/* هر h1 که مستقیم زیرِ main یا اولین section است، یک نوارِ سرصفحه بگیرد */
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed){
  background:linear-gradient(155deg,var(--g-900) 0%,var(--g-700) 62%,var(--g-800) 100%);
  color:#fff; padding-block:var(--s16) var(--s12);
  position:relative; overflow:hidden;
}
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed)::before{
  content:''; position:absolute; inset-block-start:-130px; inset-inline-start:-100px;
  width:320px; height:320px; border-radius:50%;
  background:radial-gradient(circle,rgba(201,162,39,.2),transparent 68%);
}
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) > *{ position:relative; }
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) h1{ color:#fff; }
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) h2,
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) h3{ color:#f6f6f7; }
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) p{ color:#cfe0d6; }
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) a:not(.btn){ color:var(--gold-400); }

/* ── ریتمِ بخش‌ها: یکی‌درمیان پس‌زمینه ── */
main > section:nth-of-type(even):not(:first-of-type):not(.hm-trust):not(.hm-cta){
  background:var(--paper-2);
}
main > section{ padding-block:clamp(var(--s10),5.5vw,var(--s16)); }

/* ── ستونِ خواندنی: متنِ بلند نباید تمام‌عرض باشد ── */
main > section p,
main > section > .container > p,
main > section li{ max-width:74ch; }
main > section > .container > p,
main > section > .container > ul,
main > section > .container > ol{ margin-inline:auto; }

main p{ margin-block:0 var(--s4); font-size:16px; line-height:2.05; }
main h2{ margin-block:var(--s10) var(--s4); }
main h3{ margin-block:var(--s6) var(--s3); }
main ul:not(.kg-related-grid):not(.hm-quick-grid):not(.hm-svc-spec):not(.rz-trust):not(.svc-spec-grid):not(.kg-footer-tel):not(.kg-footer-col ul){
  padding-inline-start:var(--s5); margin-block:0 var(--s5);
}
main ul:not([class]) li,
main ol:not([class]) li{ margin-block-end:var(--s2); line-height:2; }
main ul:not([class]){ list-style:none; padding-inline-start:0; }
main ul:not([class]) li{ position:relative; padding-inline-start:var(--s6); }
main ul:not([class]) li::before{
  content:'▪'; position:absolute; inset-inline-start:0; color:var(--gold);
  font-size:17px; line-height:1.6;
}

/* ── جدول ── */
main table{
  margin-block:var(--s5); background:var(--white);
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden;
  font-size:14.5px; box-shadow:var(--e1);
}
main table th{
  background:var(--g-800); color:#fff; font-weight:800;
  padding:var(--s3) var(--s4); text-align:start; font-size:13.5px;
}
main table td{ padding:var(--s3) var(--s4); border-block-start:1px solid var(--line); }
main table tr:nth-child(even) td{ background:var(--paper-2); }

/* ── تصویر ── */
main img:not([class]){ border-radius:var(--r); box-shadow:var(--e2); }

/* ── نقلِ قول و کادرِ تأکید ── */
main blockquote{
  margin:var(--s6) 0; padding:var(--s5) var(--s6);
  background:var(--gold-100); border-inline-start:4px solid var(--gold);
  border-radius:var(--r-sm); font-size:15.5px; line-height:2;
}

/* ── پرسش‌های پرتکرار ── */
.faq-item{
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--r); margin-block-end:var(--s3); overflow:hidden;
  transition:var(--t);
}
.faq-item:hover{ border-color:var(--gold-400); box-shadow:var(--e2); }
.faq-q{
  padding:var(--s4) var(--s5); font-weight:800; font-size:15.5px;
  color:var(--g-800); cursor:pointer; display:flex; align-items:center;
  justify-content:space-between; gap:var(--s3); min-height:56px;
}
.faq-a{ padding:0 var(--s5) var(--s4); font-size:14.5px; line-height:2; color:var(--ink-2); }

/* ── کارت‌های خدمات و مراحلِ قالبِ قدیمی ── */
.services-grid,.steps-grid,.cards-grid{
  display:grid; gap:var(--s5);
  grid-template-columns:repeat(auto-fit,minmax(258px,1fr));
}
.stat-strip{
  display:grid; gap:var(--s4);
  grid-template-columns:repeat(auto-fit,minmax(146px,1fr));
  padding-block:var(--s8);
}
.stat-card,.stat{
  padding:var(--s5); background:var(--white);
  border:1px solid var(--line); border-radius:var(--r);
  text-align:center; box-shadow:var(--e1);
}
.stat .num,.stat-card .num{
  display:block; font-size:32px; font-weight:900; color:var(--g-700); line-height:1.2;
}
.stat .lbl,.stat-card .lbl{ font-size:13px; color:var(--muted); font-weight:700; }

/* ── هیروِ قدیمی: کمی مدرن‌تر ── */
.hero{ border-radius:0 0 var(--r-xl) var(--r-xl); overflow:hidden; }
.hero-caption h1,.hero-inner h1{ text-shadow:0 2px 18px rgba(0,0,0,.45); }
.cta-row{ display:flex; gap:var(--s3); flex-wrap:wrap; justify-content:center; margin-block:var(--s6); }

/* ── نوارِ اقدامِ چسبانِ موبایل ── */
.kg-bar{
  position:fixed; inset-inline:0; bottom:0; z-index:880;
  display:none; gap:var(--s2); padding:var(--s2) var(--s3);
  padding-bottom:calc(var(--s2) + env(safe-area-inset-bottom));
  background:color-mix(in srgb, var(--paper) 95%, transparent);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-block-start:1px solid var(--line);
  box-shadow:0 -10px 28px -14px rgba(0,0,0,.26);
}
.kg-bar a{
  flex:1; display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
  min-height:50px; border-radius:var(--r-sm);
  font-size:14.5px; font-weight:800; text-decoration:none; white-space:nowrap;
}
.kg-bar .kg-bar-1{ background:linear-gradient(135deg,var(--gold),var(--gold-400)); color:var(--g-900); }
.kg-bar .kg-bar-2{ background:var(--g-800); color:#fff; direction:ltr; }
@media (max-width:820px){
  .kg-bar{ display:flex; }
  body{ padding-bottom:74px; }
  .kg-bale-fab,.kgc-fab{ bottom:86px !important; }
}

/* ============================================================
   لایهٔ شرکتی — بازنویسیِ رنگ، هندسه و بافت
   بعد از همهٔ قواعدِ قبلی می‌آید، پس همین حاکم است.
   ============================================================ */
:root{
  /* پالتِ محدودتر و عمیق‌تر — رنگِ کمتر، اعتمادِ بیشتر */
  --g-900:#04211a; --g-800:#2a2a2a; --g-700:#3a3a3a; --g-600:#a9861c;
  --g-100:#e8f1ec; --g-050:#f4f9f6;
  --gold-700:#7c6620; --gold-600:#9a7d24; --gold:#b8952b; --gold-400:#d4b755; --gold-100:#f7f1dd;

  --ink:#101a16; --ink-2:#39443f; --muted:#6a7570; --line:#dfe4e1;
  --paper:#fbfcfb; --paper-2:#f3f6f4; --white:#fff;

  /* هندسهٔ شرکتی: گوشه‌های کم، سایه‌های تخت‌تر */
  --r-xs:4px; --r-sm:6px; --r:10px; --r-lg:14px; --r-xl:18px;
  --e1:0 1px 2px rgba(4,33,26,.05);
  --e2:0 2px 6px -1px rgba(4,33,26,.07), 0 1px 3px rgba(4,33,26,.05);
  --e3:0 8px 18px -6px rgba(4,33,26,.10), 0 2px 6px -2px rgba(4,33,26,.06);
  --e4:0 18px 34px -12px rgba(4,33,26,.14), 0 6px 12px -6px rgba(4,33,26,.08);
  --e5:0 32px 60px -20px rgba(4,33,26,.20);
}
@media (prefers-color-scheme: dark){
  :root{
    --ink:#e9efec; --ink-2:#bcc9c3; --muted:#8b9a93; --line:#20302a;
    --paper:#1a1a1a; --paper-2:#101c17; --white:#14211c;
    --g-100:#14291f; --g-050:#0f1f18; --gold-100:#241f13;
  }
}

/* آیکنِ واقعی به‌جای ایموجی */
.kg-ico{
  width:34px; height:34px; display:block;
  object-fit:contain;
}
.hm-quick-i .kg-ico{ width:30px; height:30px; }
.hm-svc-i .kg-ico{ width:38px; height:38px; }

/* ── سربرگ: نوارِ تیرهٔ شرکتی، نه شیشه‌ای ── */
header{
  background:var(--g-900);
  border-block-end:1px solid rgba(255,255,255,.07);
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
header .logo{ color:#fff; }
header nav > ul > li > a{ color:#c2d3ca; font-weight:600; }
header nav > ul > li > a:hover,
header nav > ul > li > a.active{ background:rgba(255,255,255,.08); color:#fff; }
.nav-toggle{ background:transparent; border-color:rgba(255,255,255,.22); color:#fff; }
.submenu{ background:var(--white); border-color:var(--line); }

/* ── دکمه: تخت و جدی، بدونِ گرادیانِ براق ── */
.btn{ border-radius:var(--r-sm); font-weight:700; letter-spacing:-.1px; }
.btn-gold{ background:var(--gold); color:#0b1a14; box-shadow:none; border-color:var(--gold); }
.btn-gold:hover{ background:var(--gold-600); transform:none; box-shadow:var(--e2); }
.btn-primary,.btn-green{ background:var(--g-800); box-shadow:none; }
.btn-primary:hover,.btn-green:hover{ background:var(--g-700); transform:none; box-shadow:var(--e2); }
.btn-outline{ border-width:1.5px; }

/* ── eyebrow: بدونِ حباب، فقط خطِ بالا ── */
.eyebrow{
  background:transparent; padding:0; border-radius:0;
  color:var(--gold-600); font-size:12px; font-weight:800;
  letter-spacing:1.4px; text-transform:none;
  border-block-start:2px solid var(--gold); padding-block-start:var(--s2);
}

/* ── کارت: مرزِ نازک، بدونِ بالا‌پریدن ── */
.card,.service-card,.kg-card,.hm-svc-card,.svc-spec-grid li,.hm-pay-c,.hm-dest-c{
  border-radius:var(--r); box-shadow:none; border:1px solid var(--line);
}
.card:hover,.service-card:hover,.kg-card:hover,.hm-svc-card:hover,
.svc-spec-grid li:hover,.hm-pay-c:hover,.hm-dest-c:hover{
  transform:none; box-shadow:var(--e3); border-color:var(--g-600);
}

/* ── نوارِ رزروِ سریع: تختِ شرکتی ── */
.hm-quick > .container{ border-radius:var(--r-lg); box-shadow:var(--e4); }
.hm-quick-b{ border-radius:var(--r-sm); border-color:var(--line); background:var(--white); }
.hm-quick-b:hover{ transform:none; border-color:var(--g-600); background:var(--g-050); box-shadow:none; }

/* ── مقصدها با عکسِ واقعی ── */
.hm-dest-c{ padding:0; overflow:hidden; }
.hm-dest-c::before{ display:none; }
.hm-dest-img{
  display:block; position:relative; aspect-ratio:16/10;
  background:var(--g-900); overflow:hidden;
}
.hm-dest-img img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter:saturate(.92) contrast(1.04);
  transition:transform .5s var(--ease);
}
.hm-dest-c:hover .hm-dest-img img{ transform:scale(1.05); }
.hm-dest-img::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top,rgba(4,33,26,.62),rgba(4,33,26,0) 58%);
}
.hm-dest-c h3{ padding:var(--s5) var(--s5) 0; font-size:19px; }
.hm-dest-c p{ padding-inline:var(--s5); font-size:13.5px; }
.hm-dest-c span{ display:block; padding:0 var(--s5) var(--s5); }

/* ── مسیرها: ردیفِ داده‌ای، نه کارتِ رنگی ── */
.hm-rt{ border-radius:var(--r-sm); border-inline-start-width:3px; }
.hm-rt:hover{ transform:none; box-shadow:var(--e2); background:var(--g-050); }
.hm-rt-p{ font-size:19px; color:var(--g-700); }

/* ── پرداختِ پلکانی ── */
.hm-pay-c b{ color:var(--g-700); font-size:36px; }
.hm-pay-c{ border-width:1px; }

/* ── اعتماد: تیره و آرام ── */
.hm-trust{ background:var(--g-900); }
.hm-trust-c{ border-radius:var(--r); background:rgba(255,255,255,.04); }
.hm-trust-c .kg-ico{ filter:brightness(0) invert(1) opacity(.85); margin-inline:auto; }

/* ── فراخوان: تختِ تیره ── */
.hm-cta{ background:var(--g-900); }

/* ── هیرو: بدونِ گوشهٔ گرد ── */
.hero{ border-radius:0; }

/* ── فوتر ── */
.kg-footer{ background:var(--g-900); }
.kg-footer-col a{ color:#a5bcb2; }

/* ── بخش‌های تیره: بدونِ دایرهٔ تزئینی ── */
.svc-hero::before,
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed)::before{ display:none; }
.svc-hero{ background:var(--g-900); }
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed){ background:var(--g-900); }

/* ── موتورِ رزرو: تختِ شرکتی ── */
#kgReserve{ border-radius:var(--r-lg); box-shadow:var(--e4); }
.rz-head{ background:var(--g-900); }
.rz-card{ border-radius:var(--r-sm); background:var(--white); border-color:var(--line); }
.rz-card:hover{ transform:none; border-color:var(--g-600); box-shadow:var(--e2); }
.rz-quote{ background:var(--g-900); border-radius:var(--r); }

/* ── تقویمِ شمسی ── */
.kgd-pop{
  position:absolute; z-index:960; inset-block-start:calc(100% + 6px); inset-inline-start:0;
  min-width:266px; padding:var(--s3);
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--e4);
}
.kgd-head{ display:flex; align-items:center; justify-content:space-between; margin-block-end:var(--s2); }
.kgd-ttl{ font-weight:800; font-size:14.5px; color:var(--g-800); }
.kgd-nav{
  width:32px; height:32px; border:1px solid var(--line); border-radius:var(--r-sm);
  background:var(--white); color:var(--g-700); cursor:pointer; font-size:17px; line-height:1;
}
.kgd-nav:hover{ background:var(--g-050); }
.kgd-dows{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; margin-block-end:var(--s1); }
.kgd-dows i{ font-style:normal; font-size:11px; color:var(--muted); text-align:center; font-weight:700; }
.kgd-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.kgd-d{
  min-height:34px; border:none; border-radius:var(--r-xs);
  background:transparent; color:var(--ink); font:600 13.5px inherit; cursor:pointer;
}
.kgd-d:hover{ background:var(--g-050); }
.kgd-d.on{ background:var(--g-800); color:#fff; font-weight:800; }
.kgd-foot{ display:flex; gap:var(--s2); margin-block-start:var(--s3); padding-block-start:var(--s2);
  border-block-start:1px solid var(--line); }
.kgd-foot button{
  flex:1; min-height:34px; border:1px solid var(--line); border-radius:var(--r-sm);
  background:var(--white); font:700 12.5px inherit; color:var(--g-700); cursor:pointer;
}
.kgd-foot button:hover{ background:var(--g-050); }

/* ── نوارِ جست‌وجوی نقطه‌به‌نقطه ── */
#kgSearch{ position:relative; }
.sb-row{
  display:grid; gap:var(--s2); align-items:end;
  grid-template-columns:1fr 44px 1fr 1fr .7fr auto;
}
@media (max-width:980px){ .sb-row{ grid-template-columns:1fr 1fr; } .sb-swap{ display:none; } }
@media (max-width:560px){ .sb-row{ grid-template-columns:1fr; } }
.sb-f{ position:relative; text-align:start; }
.sb-f label{
  display:block; font-size:11.5px; font-weight:800; letter-spacing:.4px;
  color:var(--muted); margin-block-end:var(--s1);
}
.sb-f input{
  min-height:52px; border-radius:var(--r-sm); border:1.5px solid var(--line);
  font-size:15px; font-weight:600; background:var(--white);
}
.sb-swap{
  width:44px; height:52px; align-self:end; cursor:pointer;
  border:1.5px solid var(--line); border-radius:var(--r-sm);
  background:var(--white); color:var(--g-700); font-size:19px;
}
.sb-swap:hover{ background:var(--g-050); border-color:var(--g-600); }
.sb-go{
  min-height:52px; padding-inline:var(--s8); cursor:pointer;
  border:none; border-radius:var(--r-sm);
  background:var(--gold); color:#0b1a14;
  font:800 15.5px inherit; white-space:nowrap;
}
.sb-go:hover{ background:var(--gold-600); }

.sb-sug{
  position:absolute; z-index:940; inset-inline:0; inset-block-start:calc(100% + 4px);
  max-height:290px; overflow-y:auto; list-style:none; margin:0; padding:var(--s1);
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-sm); box-shadow:var(--e4);
}
.sb-sug li{
  display:flex; align-items:center; gap:var(--s3);
  min-height:44px; padding:var(--s2) var(--s3);
  border-radius:var(--r-xs); cursor:pointer; font-size:14.5px;
}
.sb-sug li:hover,.sb-sug li.on{ background:var(--g-050); }
.sb-sug li b{ font-size:15px; opacity:.75; }
.sb-none{ color:var(--muted); cursor:default; font-size:13.5px; }

.sb-res{
  margin-block-start:var(--s5); padding:var(--s5);
  background:var(--g-900); border-radius:var(--r); color:#dbeae2; text-align:start;
}
.sb-head{ display:flex; align-items:center; gap:var(--s3); font-size:16px; margin-block-end:var(--s3); }
.sb-head b{ color:#fff; font-weight:800; }
.sb-head i{ font-style:normal; color:var(--gold-400); }
.sb-price{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--s3); }
.sb-price span{ font-size:13px; color:#9fbfae; font-weight:700; }
.sb-price b{ font-size:25px; font-weight:900; color:var(--gold-400); direction:ltr; }
.sb-price small{ font-size:13px; }
.sb-note{ font-size:13.5px; color:#bcd3c7; line-height:1.95; margin:0; }
.sb-opts{ list-style:none; padding:0; margin:var(--s4) 0 0; display:grid; gap:var(--s1); }
.sb-opts li{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s3);
  padding:var(--s2) var(--s3); background:rgba(255,255,255,.05);
  border-radius:var(--r-xs); font-size:13px;
}
.sb-o-l{ color:#cfe0d6; }
.sb-o-p{ color:#fff; font-weight:800; direction:ltr; white-space:nowrap; }
.sb-book{ display:inline-flex; margin-block-start:var(--s4); }
.sb-msg{ margin:0; font-size:14px; color:#f3c9c4; font-weight:700; }
.hm-quick-or{ margin:var(--s6) 0 var(--s4); font-size:12.5px; color:var(--muted); font-weight:700; }

/* ── نوعِ سفر در باکسِ جست‌وجو ── */
.sb-kinds{
  display:grid; gap:var(--s2); margin-block-end:var(--s4);
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.sb-kinds button{
  display:flex; flex-direction:column; gap:2px; align-items:flex-start;
  min-height:58px; padding:var(--s3) var(--s4); cursor:pointer;
  background:var(--white); border:1.5px solid var(--line);
  border-radius:var(--r-sm); font-family:inherit; text-align:start; transition:.15s;
}
.sb-kinds button:hover{ border-color:var(--gold); }
.sb-kinds button.on{
  background:var(--g-800); border-color:var(--g-800);
}
.sb-kinds b{ font-size:14.5px; font-weight:800; color:var(--g-800); }
.sb-kinds span{ font-size:11.5px; color:var(--muted); font-weight:600; line-height:1.6; }
.sb-kinds button.on b{ color:#fff; }
.sb-kinds button.on span{ color:#9fbfae; }
.sb-kind-tag{
  margin-inline-start:auto; padding:3px 11px; border-radius:var(--r-full);
  background:rgba(201,162,39,.18); color:var(--gold-400);
  font-size:11.5px; font-weight:800; white-space:nowrap;
}

/* ── تاریخ اربعین ── */
.kg-arb-date{
  margin:var(--s6) 0; padding:var(--s6);
  background:linear-gradient(140deg,var(--g-900),var(--g-700));
  border-radius:var(--r); text-align:center; color:#fff;
}
.kg-arb-big{ font-size:clamp(23px,3.6vw,33px); font-weight:900; color:var(--gold-400); line-height:1.4; }
.kg-arb-alt{ font-size:14px; color:#9fbfae; margin-block-start:var(--s2); }
.kg-arbaeen-cd{
  margin-block-start:var(--s4); font-size:15.5px; font-weight:800; color:#fff;
  padding-block-start:var(--s4); border-block-start:1px solid rgba(255,255,255,.14);
}

/* ── جعبهٔ رزروِ متناسبِ صفحه ── */
.kg-cta-box{
  display:block; margin-block:var(--s12) var(--s8);
  background:linear-gradient(140deg,var(--g-900),var(--g-700));
  color:#fff;
}
.kg-cta-in{
  max-width:var(--wrap); margin-inline:auto; padding:var(--s10) var(--s6);
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--s8); flex-wrap:wrap;
}
.kg-cta-txt{ flex:1 1 300px; }
.kg-cta-box h2{ color:#fff; font-size:clamp(19px,2.7vw,26px); margin:0 0 var(--s2); }
.kg-cta-box p{ color:#a9c4b6; font-size:14.5px; margin:0; max-width:52ch; }
.kg-cta-btns{ display:flex; gap:var(--s3); flex-wrap:wrap; }
.kg-cta-btns .btn-outline{ color:#fff; border-color:rgba(255,255,255,.34); }
.kg-cta-btns .btn-outline:hover{ background:rgba(255,255,255,.1); }
@media (max-width:640px){
  .kg-cta-in{ padding-block:var(--s8); }
  .kg-cta-btns{ width:100%; }
  .kg-cta-btns .btn{ flex:1; }
}

/* ── فوتر: کمتر دیده شود، ولی لینک‌ها سرِ جایشان بمانند ──
   حذفِ لینک از فوتر یعنی حذفش از هر ۹۹ صفحه و یتیم‌شدنِ آن صفحه.
   پس حجمِ دیداری با فشرده‌سازی کم می‌شود، نه با کم‌کردنِ لینک. */
.kg-footer{ padding-block:var(--s10) var(--s5); margin-block-start:var(--s10); }
.kg-footer-grid{ gap:var(--s5) var(--s6); }
.kg-footer-col h4{ font-size:13px; margin-block-end:var(--s2); opacity:.92; }
.kg-footer-col a{ font-size:12.5px; min-height:0; padding-block:1px; line-height:1.95; }
.kg-footer-col ul{ gap:0; }
.kg-footer-brand p{ font-size:13px; line-height:1.9; margin-block-end:var(--s3); }
.kg-footer-brand{ max-width:340px; }
.kg-footer-tel a{ min-height:32px; font-size:13.5px; }
.kg-footer-bottom{ margin-block-start:var(--s6); padding-block-start:var(--s4); font-size:12px; }

/* موبایل: هر ستون یک آکاردئون — فوتر از دیوارِ متن به چند سطرِ تمیز تبدیل می‌شود */
@media (max-width:720px){
  .kg-footer-grid{ grid-template-columns:1fr; gap:0; }
  .kg-footer-brand{ max-width:none; margin-block-end:var(--s5); }
  .kg-footer-col{ border-block-start:1px solid rgba(255,255,255,.09); }
  .kg-footer-col h4{
    display:flex; align-items:center; justify-content:space-between;
    margin:0; padding-block:var(--s4); cursor:pointer; font-size:14px;
  }
  .kg-footer-col h4::after{ content:'＋'; font-size:15px; opacity:.6; transition:transform var(--t); }
  .kg-footer-col.open h4::after{ content:'－'; }
  .kg-footer-col ul{
    max-height:0; overflow:hidden; transition:max-height .28s var(--ease);
  }
  .kg-footer-col.open ul{ max-height:440px; padding-block-end:var(--s3); }
  .kg-footer-col a{ font-size:13.5px; padding-block:var(--s1); }
}

/* ============================================================
   منو — خوانایی و کنترل از پنل
   ------------------------------------------------------------
   رنگ‌ها با متغیر تعریف می‌شوند تا از «ویرایش بصری ← منو» قابلِ
   تغییر باشند. مقدارِ پیش‌فرض کنتراستِ حداقل ۷:۱ دارد.
   ============================================================ */
:root{
  --nav-bg:#04211a;          /* پس‌زمینهٔ نوار */
  --nav-fg:#eaf3ee;          /* متنِ آیتم */
  --nav-fg-hover:#ffffff;
  --nav-hover-bg:rgba(255,255,255,.12);
  --nav-active:#e4c766;      /* آیتمِ فعال */
  --nav-border:rgba(255,255,255,.10);

  --sub-bg:#0a2b21;          /* پس‌زمینهٔ زیرمنو */
  --sub-fg:#eaf3ee;
  --sub-fg-hover:#04211a;
  --sub-hover-bg:#e4c766;
  --sub-border:rgba(228,199,102,.28);

  --nav-size:14.5px;
  --sub-size:13.8px;
  --nav-weight:700;
  --nav-radius:8px;
}

/* نوارِ اصلی — انتخابگرها عمداً بلندند تا بر style.css غلبه کنند */
header{ background:var(--nav-bg); border-block-end:1px solid var(--nav-border); }
header nav ul li a,
header nav > ul > li > a{
  color:var(--nav-fg);
  font-size:var(--nav-size);
  font-weight:var(--nav-weight);
  border-radius:var(--nav-radius);
}
header nav ul li a:hover,
header nav > ul > li > a:hover{ color:var(--nav-fg-hover); background:var(--nav-hover-bg); }
header nav ul li a.active,
header nav > ul > li > a.active{ color:var(--nav-active); background:var(--nav-hover-bg); }
header .logo{ color:var(--nav-fg); }
header nav ul li.has-sub > a .sub-caret{ opacity:.9; color:var(--nav-active); }

/* زیرمنو — بیشترین ایرادِ خوانایی این‌جا بود */
header nav ul ul.submenu,
header .submenu{
  background:var(--sub-bg) !important;
  border:1px solid var(--sub-border) !important;
  border-radius:12px;
  box-shadow:0 18px 44px -14px rgba(0,0,0,.6);
  padding:7px;
}
header nav ul ul.submenu li a,
header .submenu a{
  color:var(--sub-fg) !important;
  font-size:var(--sub-size);
  font-weight:600;
  padding:9px 13px;
  border-radius:7px;
  line-height:1.75;
}
header nav ul ul.submenu li a:hover,
header .submenu a:hover{
  background:var(--sub-hover-bg) !important;
  color:var(--sub-fg-hover) !important;
  font-weight:800;
}

/* منوی موبایل — همان رنگ‌ها، بدونِ شفافیتِ گمراه‌کننده */
@media(max-width:1250px){
  header nav > ul{ background:var(--nav-bg); }
  header nav ul li a{ color:var(--nav-fg); }
  header nav ul ul.submenu{ background:rgba(255,255,255,.05) !important; border:none !important; }
}

/* ── حالتِ ویرایشگر: قابِ ویرایش همیشه باریک‌تر از ۱۲۵۰px است، پس منوی
   موبایل روشن می‌شد و کاربر فقط یک همبرگر می‌دید. با این کلاس روی <html>
   داخلِ قاب، چیدمانِ دسکتاپ برمی‌گردد و منو قابلِ استایل‌دهی می‌شود. ── */
html.kg-edit-desktop header nav > ul{
  display:flex !important; flex-direction:row !important;
  position:static !important; inset:auto !important;
  width:auto !important; max-height:none !important;
  background:transparent !important; padding:0 !important;
  transform:none !important; opacity:1 !important; visibility:visible !important;
  box-shadow:none !important; overflow:visible !important;
}
html.kg-edit-desktop header nav > ul > li{ width:auto !important; border:none !important; }
html.kg-edit-desktop .nav-toggle{ display:none !important; }
/* داخلِ ویرایشگر زیرمنو هرگز با hover باز نمی‌شود.
   نسخهٔ قبلی با هر حرکتِ موس یک زیرمنوی ۷۰vh را روی محتوا می‌انداخت و
   عملاً هیچ کلیکی به صفحه نمی‌رسید — ویرایشگر فلج می‌شد.
   بازشدن فقط با کلیدِ «بازنگه‌داشتنِ زیرمنوها» (kg-open) است، آن هم
   به‌صورتِ درجا (static) زیرِ همان آیتم، نه شناور روی محتوا. */
html.kg-edit-desktop header nav > ul{ flex-wrap:wrap !important; }
html.kg-edit-desktop nav ul li.has-sub::after{ content:none !important; }
html.kg-edit-desktop nav ul ul.submenu{ display:none !important; }
html.kg-edit-desktop nav ul li.has-sub:hover > ul.submenu{ display:none !important; }
html.kg-edit-desktop nav ul li.has-sub.kg-open > ul.submenu{
  display:flex !important; position:static !important;
  flex-direction:column !important; inset:auto !important;
  min-width:0 !important; max-height:none !important;
  box-shadow:none !important; width:100% !important;
}

/* ============================================================
   عکس با کپشن — <figure> استانداردِ HTML
   همهٔ تنظیمات با متغیر، تا از ویرایشگر قابلِ کنترل باشد.
   ============================================================ */
.kg-fig{
  --fig-ratio:16/10; --fig-fit:cover; --fig-radius:10px;
  --fig-shadow:1; --fig-cap-size:14px; --fig-cap-align:start;
  margin:var(--s6) 0; padding:0;
}
.kg-fig-link{ display:block; text-decoration:none; color:inherit; }
.kg-fig-media{
  display:block; position:relative; overflow:hidden;
  border-radius:var(--fig-radius); background:var(--paper-2);
  aspect-ratio:var(--fig-ratio);
}
.kg-fig-media img{
  width:100%; height:100%; display:block;
  object-fit:var(--fig-fit);
  transition:transform .5s var(--ease), filter .3s var(--ease);
}
.kg-fig-cap{
  display:block; padding-block-start:var(--s3);
  text-align:var(--fig-cap-align); font-size:var(--fig-cap-size);
}
.kg-fig-t{ display:block; font-weight:800; color:var(--g-800); line-height:1.55; font-size:1.08em; }
.kg-fig-d{ display:block; color:var(--muted); line-height:1.9; margin-block-start:2px; font-size:.94em; }
.kg-fig-go{ display:inline-block; margin-block-start:var(--s2); font-weight:800; color:var(--g-600); font-size:.9em; }
.kg-fig-btn{
  display:inline-flex; align-items:center; min-height:40px;
  margin-block-start:var(--s3); padding:0 var(--s5);
  background:var(--g-800); color:#fff; border-radius:var(--r-sm);
  font-weight:800; font-size:.92em; text-decoration:none;
}
.kg-fig-btn:hover{ background:var(--g-700); }

/* عمقِ سایه — پنج پله */
.kg-fig[style*="--fig-shadow:1"] .kg-fig-media{ box-shadow:var(--e1); }
.kg-fig[style*="--fig-shadow:2"] .kg-fig-media{ box-shadow:var(--e2); }
.kg-fig[style*="--fig-shadow:3"] .kg-fig-media{ box-shadow:var(--e3); }
.kg-fig[style*="--fig-shadow:4"] .kg-fig-media{ box-shadow:var(--e4); }
.kg-fig[style*="--fig-shadow:5"] .kg-fig-media{ box-shadow:var(--e5); }

/* جای کپشن */
.kg-fig.cap-over .kg-fig-link,.kg-fig.cap-over{ position:relative; }
.kg-fig.cap-over .kg-fig-cap{
  position:absolute; inset-inline:0; inset-block-end:0; z-index:2;
  padding:var(--s8) var(--s5) var(--s5);
  background:linear-gradient(to top,rgba(4,33,26,.88),rgba(4,33,26,0));
  color:#fff; border-end-start-radius:var(--fig-radius); border-end-end-radius:var(--fig-radius);
}
.kg-fig.cap-over .kg-fig-t{ color:#fff; }
.kg-fig.cap-over .kg-fig-d{ color:#c9dbd1; }
.kg-fig.cap-side .kg-fig-link,.kg-fig.cap-side{
  display:grid; grid-template-columns:minmax(180px,40%) 1fr; gap:var(--s6); align-items:center;
}
.kg-fig.cap-side .kg-fig-cap{ padding-block-start:0; }
@media (max-width:640px){
  .kg-fig.cap-side .kg-fig-link,.kg-fig.cap-side{ grid-template-columns:1fr; gap:var(--s4); }
}

/* افکتِ هاور */
.kg-fig.fx-zoom:hover .kg-fig-media img{ transform:scale(1.06); }
.kg-fig.fx-lift{ transition:transform var(--t), box-shadow var(--t); }
.kg-fig.fx-lift:hover{ transform:translateY(-4px); }
.kg-fig.fx-dim:hover .kg-fig-media img{ filter:brightness(.72); }
.kg-fig.fx-none:hover .kg-fig-media img{ transform:none; filter:none; }

/* چیدمان‌های آماده */
.kg-fig-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  padding:var(--s3); transition:border-color var(--t), box-shadow var(--t); }
.kg-fig-card:hover{ border-color:var(--gold); box-shadow:var(--e2); }
.kg-fig-card .kg-fig-cap{ padding:var(--s3) var(--s2) var(--s2); }

.kg-fig-overlay{ --fig-ratio:4/3; }
.kg-fig-overlay .kg-fig-cap{ position:absolute; inset-inline:0; inset-block-end:0;
  padding:var(--s10) var(--s5) var(--s5);
  background:linear-gradient(to top,rgba(4,33,26,.9),rgba(4,33,26,0)); color:#fff; }
.kg-fig-overlay .kg-fig-link{ position:relative; display:block; }
.kg-fig-overlay .kg-fig-t{ color:#fff; font-size:1.25em; }
.kg-fig-overlay .kg-fig-d{ color:#c9dbd1; }

.kg-fig-side{ display:grid; grid-template-columns:minmax(200px,42%) 1fr; gap:var(--s6); align-items:center; }
.kg-fig-side .kg-fig-cap{ padding-block-start:0; }
@media (max-width:700px){ .kg-fig-side{ grid-template-columns:1fr; } }

.kg-fig-wide{ --fig-ratio:21/9; }
.kg-fig-wide .kg-fig-cap{ text-align:center; color:var(--muted); font-size:13px; }

.kg-fig-quote{ --fig-ratio:1/1; display:grid; grid-template-columns:132px 1fr;
  gap:var(--s5); align-items:center; padding:var(--s5);
  background:var(--paper-2); border-inline-start:3px solid var(--gold); border-radius:var(--r); }
.kg-fig-quote .kg-fig-media{ border-radius:50%; }
.kg-fig-quote .kg-fig-q{ display:block; font-size:16px; line-height:2; color:var(--ink); }
.kg-fig-quote .kg-fig-cap{ padding-block-start:0; }
@media (max-width:600px){ .kg-fig-quote{ grid-template-columns:1fr; text-align:center; }
  .kg-fig-quote .kg-fig-media{ width:120px; margin-inline:auto; } }

.kg-fig-grid{ display:grid; gap:var(--s4);
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); margin:var(--s6) 0; }
.kg-fig-grid .kg-fig{ margin:0; }

/* ============================================================
   فوتر — ستون‌بندیِ صریح
   ------------------------------------------------------------
   ایرادِ قبلی: grid-template-columns:1.5fr repeat(auto-fit,minmax(158px,1fr))
   ــ auto-fit وقتی کنارِ یک ستونِ ثابت می‌آید، عرضِ باقی‌مانده را درست
   حساب نمی‌کند و همهٔ ستون‌ها زیرِ هم می‌افتند. با شمارشِ صریحِ ستون‌ها
   در هر اندازهٔ صفحه، این اتفاق نمی‌افتد.
   ============================================================ */
.kg-footer-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr 1fr 1fr 1fr;
  gap:var(--s5) var(--s5);
  align-items:start;
}
@media (max-width:1180px){ .kg-footer-grid{ grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; } }
@media (max-width:940px) { .kg-footer-grid{ grid-template-columns:1fr 1fr 1fr 1fr; } }
@media (max-width:760px) { .kg-footer-grid{ grid-template-columns:1fr 1fr 1fr; } }

/* ستونِ برند در صفحهٔ کوچک، تمامِ عرض */
@media (max-width:940px){
  .kg-footer-brand{ grid-column:1 / -1; max-width:none; }
}

/* موبایل: یک ستون + آکاردئون */
@media (max-width:720px){
  .kg-footer-grid{ grid-template-columns:1fr; gap:0; }
  .kg-footer-brand{ grid-column:auto; margin-block-end:var(--s5); }
}

/* لینک‌ها فشرده‌تر تا ستون بلند نشود */
.kg-footer-col ul{ display:grid; gap:0; }
.kg-footer-col li{ margin:0; }
.kg-footer-col a{ display:block; padding-block:2px; line-height:1.85; }

/* ============================================================
   فوتر — بازچینشِ نهایی
   ------------------------------------------------------------
   ایرادِ قبلی: ۷ ستون در عرضِ ۱۱۸۰px یعنی هر ستون ~۱۴۰px. برچسبِ فارسی
   مثلِ «خرید بلیط با انتخاب صندلی» در ۱۴۰px سه خط می‌شود و فوتر به هم
   می‌ریزد.
   راه‌حل: ستونِ برند به ردیفِ خودش می‌رود (افقی، کنارِ هم)، و ستون‌های
   لینک زیرش با عرضِ ~۲۷۰px می‌نشینند — یعنی هر برچسب یک خط.
   ============================================================ */
.kg-footer-grid{
  display:block;                    /* گریدِ قبلی خنثی می‌شود */
}

/* ── ردیفِ برند: لوگو و معرفی و تلفن‌ها، افقی ── */
.kg-footer-brand{
  display:grid;
  grid-template-columns:minmax(240px,1.4fr) minmax(200px,auto);
  gap:var(--s5) var(--s10);
  align-items:start;
  max-width:none;
  padding-block-end:var(--s6);
  margin-block-end:var(--s6);
  border-block-end:1px solid rgba(255,255,255,.09);
}
.kg-footer-brand p{ grid-column:1; margin:0; max-width:56ch; }
.kg-footer-logo{ grid-column:1; }
.kg-footer-tel{
  grid-column:2; grid-row:1 / span 2;
  display:flex; flex-wrap:wrap; gap:var(--s2) var(--s5);
  align-content:start;
}
.kg-footer-tel a{ white-space:nowrap; }
@media (max-width:820px){
  .kg-footer-brand{ grid-template-columns:1fr; gap:var(--s4); }
  .kg-footer-brand p{ max-width:none; }
  .kg-footer-tel{ grid-column:1; grid-row:auto; }
}

/* ── ستون‌های لینک: چهارتایی، عرضِ کافی برای یک‌خطی‌بودن ── */
.kg-footer .container > .kg-footer-grid{ display:block; }
.kg-footer-cols{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--s6) var(--s8);
}
@media (max-width:1000px){ .kg-footer-cols{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) { .kg-footer-cols{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px) { .kg-footer-cols{ grid-template-columns:1fr; gap:0; } }

.kg-footer-col{ min-width:0; }
.kg-footer-col h4{
  font-size:13.5px; font-weight:800; color:#fff;
  margin:0 0 var(--s3); padding-block-end:var(--s2);
  border-block-end:1px solid rgba(255,255,255,.12);
}
.kg-footer-col ul{ display:grid; gap:0; list-style:none; padding:0; margin:0; }
.kg-footer-col a{
  display:block; padding-block:3px;
  font-size:13px; line-height:1.75; color:#a9c4b6;
  /* برچسبِ بلند به‌جای شکستنِ بد، با سه‌نقطه کوتاه می‌شود */
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.kg-footer-col a:hover{ color:var(--gold-400); padding-inline-start:0; }

/* موبایل: آکاردئون — برچسب کامل دیده شود، بدونِ سه‌نقطه */
@media (max-width:520px){
  .kg-footer-col{ border-block-start:1px solid rgba(255,255,255,.09); }
  .kg-footer-col h4{
    display:flex; align-items:center; justify-content:space-between;
    margin:0; padding-block:var(--s4); cursor:pointer;
    border-block-end:none; font-size:14px;
  }
  .kg-footer-col h4::after{ content:'＋'; font-size:15px; opacity:.6; }
  .kg-footer-col.open h4::after{ content:'－'; }
  .kg-footer-col ul{ max-height:0; overflow:hidden; transition:max-height .28s var(--ease); }
  .kg-footer-col.open ul{ max-height:520px; padding-block-end:var(--s3); }
  .kg-footer-col a{ white-space:normal; overflow:visible; font-size:13.5px; padding-block:var(--s1); }
}

/* شش ستون در گریدِ چهارتایی نامتوازن می‌شود (۴ + ۲).
   سه‌تایی: دو ردیفِ کاملِ ۳تایی، هر ستون ~۳۶۰px — یعنی هر برچسبِ فارسی
   در یک خط جا می‌شود و دیگر نیازی به کوتاه‌کردن با سه‌نقطه نیست. */
.kg-footer-cols{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s8) var(--s10); }
@media (max-width:900px){ .kg-footer-cols{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s6); } }
@media (max-width:560px){ .kg-footer-cols{ grid-template-columns:1fr; gap:0; } }

/* با عرضِ کافی، متن کامل نوشته می‌شود نه با سه‌نقطه */
.kg-footer-col a{
  white-space:normal; overflow:visible; text-overflow:clip;
  font-size:13.2px; line-height:1.9; padding-block:2.5px;
}
.kg-footer-col h4{ font-size:14px; margin-block-end:var(--s3); }

/* آکاردئونِ موبایل — همان نقطهٔ شکستِ گرید */
@media (max-width:560px){
  .kg-footer-col{ border-block-start:1px solid rgba(255,255,255,.09); }
  .kg-footer-col h4{
    display:flex; align-items:center; justify-content:space-between;
    margin:0; padding-block:var(--s4); cursor:pointer; border-block-end:none;
  }
  .kg-footer-col h4::after{ content:'＋'; font-size:15px; opacity:.6; }
  .kg-footer-col.open h4::after{ content:'－'; }
  .kg-footer-col ul{ max-height:0; overflow:hidden; transition:max-height .28s var(--ease); }
  .kg-footer-col.open ul{ max-height:560px; padding-block-end:var(--s3); }
}
@media (min-width:561px){
  /* روی دسکتاپ آکاردئون نباشد — همه باز */
  .kg-footer-col ul{ max-height:none !important; overflow:visible !important; }
  .kg-footer-col h4{ cursor:default; }
  .kg-footer-col h4::after{ content:none; }
}

/* عمقِ سایهٔ عکس — با کلاس، تا از پنل قابلِ کنترل باشد
   (انتخابگرِ قبلی به فاصلهٔ داخلِ style حساس بود و هرگز نمی‌خورد) */
.kg-fig.sh-0 .kg-fig-media{ box-shadow:none; }
.kg-fig.sh-1 .kg-fig-media{ box-shadow:var(--e1); }
.kg-fig.sh-2 .kg-fig-media{ box-shadow:var(--e2); }
.kg-fig.sh-3 .kg-fig-media{ box-shadow:var(--e3); }
.kg-fig.sh-4 .kg-fig-media{ box-shadow:var(--e4); }
.kg-fig.sh-5 .kg-fig-media{ box-shadow:var(--e5); }


/* ═══════════════════════════════════════════════════════════════════
   ویجتِ «سفرِ من» — رزروِ چندمسیرهٔ عتبات روی صفحهٔ اصلی  (js/trip-builder.js)

   چرا این‌جا: ظرفِ ویجت (#kgSearch) داخلِ کارتِ سفیدِ .hm-quick است، پس
   این بلوک هیچ کارتِ سفیدِ تازه‌ای روی کارتِ سفید نمی‌گذارد. عمق با
   --paper-2 و --g-050 ساخته می‌شود تا در حالتِ شب هم درست بماند.
   هیچ رنگِ سفت‌نوشته‌ای نیست جز متنِ روی سبزِ تیره، که در هر دو تم تیره است.
   ═══════════════════════════════════════════════════════════════════ */

.tb{
  text-align:start;                 /* کارتِ والد وسط‌چین است؛ فرم نباید وسط‌چین باشد */
  direction:rtl;
  color:var(--ink);
  font-size:14.5px;
  line-height:1.9;
}
.tb *{ box-sizing:border-box; }

/* ── متنِ سبزِ تأکیدی ──
   پالتِ سایت --g-600..--g-900 را در حالتِ شب روشن نمی‌کند (فقط --ink و
   --paper و --white عوض می‌شوند). یعنی «سبزِ تیره روی زمینهٔ تیره» ⇒ نامرئی.
   پس این ویجت متنِ تأکیدی‌اش را از یک توکنِ محلی می‌گیرد که در شب روشن
   می‌شود. زمینه‌ها همچنان از --g-800 می‌آیند، چون آن‌ها باید تیره بمانند. */
.tb{ --tb-h:var(--g-800); --tb-h2:var(--g-700); --tb-gold-t:var(--gold-700); }
@media (prefers-color-scheme: dark){
  .tb{ --tb-h:#dcc986; --tb-h2:#d1ba6f; --tb-gold-t:var(--gold-400); }
}
:root[data-theme="dark"] .tb{ --tb-h:#dcc986; --tb-h2:#d1ba6f; --tb-gold-t:var(--gold-400); }
:root[data-theme="light"] .tb{ --tb-h:var(--g-800); --tb-h2:var(--g-700); --tb-gold-t:var(--gold-700); }
/* هر عنصری که display دارد، [hidden] را می‌بلعد. این یک خط جلوی آن را می‌گیرد. */
.tb [hidden]{ display:none !important; }
.tb :focus-visible{ outline:2px solid var(--gold-600); outline-offset:2px; border-radius:var(--r-xs); }

.tb-load,
.tb-fail{
  padding:var(--s10) var(--s4);
  text-align:center;
  color:var(--muted);
  font-weight:700;
}
.tb-fail p{ margin:0 0 var(--s4); color:var(--ink); }

/* ───────── چیدمان: ستونِ اصلی + فاکتورِ چسبنده ───────── */
.tb-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:var(--s6);
  align-items:start;
}
.tb-main{ min-width:0; }

/* ───────── بخش‌های شماره‌دار ───────── */
.tb-sec{
  padding-block:var(--s6);
  border-block-start:1px solid var(--line);
}
.tb-sec:first-child{ border-block-start:none; padding-block-start:0; }
.tb-sec-h{
  display:flex; align-items:flex-start; gap:var(--s3);
  margin-block-end:var(--s4);
}
.tb-n{
  flex:none;
  width:30px; height:30px; border-radius:var(--r-full);
  background:var(--g-800); color:var(--gold-400);
  display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:800; line-height:1;
  margin-block-start:3px;
}
.tb-sec-t{
  margin:0;
  font-size:clamp(17px,2.2vw,20px);
  font-weight:800; color:var(--tb-h); line-height:1.6;
}
.tb-sec-s{ margin:2px 0 0; font-size:12.8px; color:var(--muted); line-height:1.8; }

/* ───────── گامِ ۱ — وسیله ───────── */
.tb-veh{
  display:grid; gap:var(--s3);
  grid-template-columns:repeat(auto-fit,minmax(132px,1fr));
}
.tb-v{
  position:relative;
  display:flex; flex-direction:column; align-items:center; gap:6px;
  min-height:112px; padding:var(--s4) var(--s2);
  background:var(--paper-2);
  border:2px solid transparent;
  border-radius:var(--r);
  cursor:pointer; font-family:inherit; color:inherit;
  transition:var(--t);
}
.tb-v:hover{ background:var(--white); border-color:var(--line); transform:translateY(-2px); box-shadow:var(--e2); }
.tb-v.on{
  background:var(--gold-100);
  border-color:var(--gold);
  box-shadow:var(--e2);
}
.tb-v.on::after{
  content:'✓';
  position:absolute; inset-block-start:6px; inset-inline-end:8px;
  width:19px; height:19px; border-radius:var(--r-full);
  background:var(--gold); color:var(--g-900);
  font-size:11px; font-weight:900; line-height:19px; text-align:center;
}
.tb-v-i{ width:30px; height:30px; object-fit:contain; display:block; }
.tb-v-t{ font-size:13px; font-weight:800; color:var(--tb-h); line-height:1.5; text-align:center; }
.tb-v-s{ font-size:11.5px; color:var(--muted); font-weight:700; }

/* ───────── گامِ ۲ — مسیرها ───────── */
.tb-modes{
  display:grid; gap:var(--s3);
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  margin-block-end:var(--s4);
}
.tb-m{
  display:flex; flex-direction:column; align-items:flex-start; gap:2px;
  padding:var(--s3) var(--s4);
  background:var(--paper-2);
  border:2px solid transparent; border-radius:var(--r);
  cursor:pointer; font-family:inherit; color:inherit; text-align:start;
  transition:var(--t);
}
.tb-m:hover{ background:var(--white); border-color:var(--line); }
.tb-m b{ font-size:14px; font-weight:800; color:var(--tb-h); line-height:1.6; }
.tb-m span{ font-size:11.8px; color:var(--muted); line-height:1.7; }
.tb-m.on{ background:var(--g-050); border-color:var(--g-600); }
.tb-m-all.on{ background:var(--gold-100); border-color:var(--gold); }

.tb-tools{
  display:flex; align-items:center; gap:var(--s3); flex-wrap:wrap;
  margin-block-end:var(--s3);
}
.tb-srch{ flex:1 1 220px; min-width:0; display:block; margin:0; }
.tb-vh{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.tb-srch input{
  width:100%; min-height:42px;
  padding:0 var(--s4);
  background:var(--white);
  border:1.5px solid var(--line); border-radius:var(--r-sm);
  font-family:inherit; font-size:13.5px; color:var(--ink);
}
.tb-bulk{ display:flex; gap:var(--s2); }
.tb-mini{
  min-height:42px; padding:0 var(--s4);
  background:transparent;
  border:1.5px solid var(--line); border-radius:var(--r-sm);
  font-family:inherit; font-size:12.5px; font-weight:800; color:var(--ink-2);
  cursor:pointer; transition:var(--t); white-space:nowrap;
}
.tb-mini:hover{ border-color:var(--g-600); color:var(--tb-h2); }

.tb-routes{
  display:grid; gap:var(--s2);
  grid-template-columns:repeat(auto-fill,minmax(252px,1fr));
  align-content:start;
  max-height:360px; overflow-y:auto;
  padding:var(--s3);
  background:var(--paper);
  border:1px solid var(--line); border-radius:var(--r-sm);
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
.tb-routes::-webkit-scrollbar{ width:9px; }
.tb-routes::-webkit-scrollbar-thumb{ background:var(--g-100); border-radius:var(--r-full); }
.tb-routes::-webkit-scrollbar-thumb:hover{ background:var(--g-600); }
.tb-rt{
  position:relative; margin:0;
  display:flex; align-items:center; gap:var(--s3);
  padding:var(--s3);
  background:var(--paper-2);
  border:1.5px solid transparent; border-radius:var(--r-sm);
  cursor:pointer; transition:var(--t);
}
.tb-rt[hidden]{ display:none; }
.tb-rt:hover{ background:var(--white); border-color:var(--line); }
.tb-rt.on{ background:var(--g-050); border-color:var(--g-600); }
.tb-rt-cb{
  position:absolute; width:1px; height:1px; opacity:0; margin:0;
}
.tb-rt-b{
  flex:none;
  width:21px; height:21px; border-radius:var(--r-xs);
  border:2px solid var(--line);
  background:var(--white);
  position:relative; transition:var(--t);
}
.tb-rt.on .tb-rt-b{ background:var(--g-700); border-color:var(--g-700); }
.tb-rt.on .tb-rt-b::after{
  content:''; position:absolute;
  inset-block-start:2px; inset-inline-start:6px;
  width:5px; height:10px;
  border:solid #fff; border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.tb-rt-cb:focus-visible + .tb-rt-b{ outline:2px solid var(--gold-600); outline-offset:2px; }
.tb-rt-x{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.tb-rt-t{
  font-size:13.4px; font-weight:800; color:var(--ink); line-height:1.6;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.tb-rt-m{ font-size:11.4px; color:var(--muted); line-height:1.6; }
.tb-rt-p{
  flex:none; font-size:13px; font-weight:800; color:var(--tb-h2);
  font-variant-numeric:tabular-nums;
}
.tb-rt.on .tb-rt-p{ color:var(--tb-h); }
.tb-none{ margin:var(--s3) 0 0; font-size:13px; color:var(--muted); }

/* سبدِ مسیرها */
.tb-bask-w{ margin-block-start:var(--s4); }
.tb-bask-h{
  display:block; font-size:12px; font-weight:800;
  color:var(--muted); margin-block-end:var(--s2);
}
.tb-bask{ display:flex; flex-wrap:wrap; gap:var(--s2); }
.tb-bask-e{ margin:0; font-size:12.8px; color:var(--muted); }
.tb-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 6px 5px 4px;
  background:var(--g-800); color:#fff;
  border-radius:var(--r-full);
  font-size:12.6px; font-weight:700;
  max-width:100%;
}
.tb-chip-n{
  flex:none; width:18px; height:18px; border-radius:var(--r-full);
  background:rgba(255,255,255,.16); color:var(--gold-400);
  font-size:10.5px; font-style:normal; font-weight:800;
  display:flex; align-items:center; justify-content:center;
}
.tb-chip-t{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tb-chip-x{
  flex:none; width:20px; height:20px; border-radius:var(--r-full);
  border:none; background:rgba(255,255,255,.14); color:#fff;
  font-size:11px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  font-family:inherit; transition:var(--t);
}
.tb-chip-x:hover{ background:var(--err); }

/* ───────── گامِ ۳ — تاریخ و نفرات ───────── */
.tb-when{ display:grid; gap:var(--s4); grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.tb-f{ display:block; min-width:0; position:relative; margin:0; }
.tb-f > label,
.tb-f > span:first-child{
  display:block; font-size:12.5px; font-weight:800;
  color:var(--ink-2); margin-block-end:6px;
}
.tb-f input,
.tb-f select,
.tb-f textarea{
  width:100%; min-height:46px;
  padding:10px var(--s4);
  background:var(--white);
  border:1.5px solid var(--line); border-radius:var(--r-sm);
  font-family:inherit; font-size:14px; color:var(--ink);
  transition:var(--t);
}
.tb-f textarea{ min-height:70px; resize:vertical; line-height:1.9; }
.tb-f input:hover,
.tb-f select:hover,
.tb-f textarea:hover{ border-color:var(--g-100); }
.tb-f input[aria-invalid="true"]{ border-color:var(--err); }
.tb-g{ display:block; font-size:11.5px; color:var(--muted); margin-block-start:5px; min-height:17px; }
.tb-g-warn{ color:var(--warn); font-weight:700; }

.tb-step-n{ display:flex; align-items:stretch; gap:var(--s2); }
.tb-step-n input{ text-align:center; font-weight:800; -moz-appearance:textfield; }
.tb-step-n input::-webkit-outer-spin-button,
.tb-step-n input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tb-pm{
  flex:none; width:46px; min-height:46px;
  background:var(--paper-2); border:1.5px solid var(--line);
  border-radius:var(--r-sm);
  font-family:inherit; font-size:19px; font-weight:800; color:var(--tb-h);
  cursor:pointer; transition:var(--t);
}
.tb-pm:hover{ background:var(--g-050); border-color:var(--g-600); }

/* ───────── گامِ ۴ — تأیید و رزرو ───────── */
.tb-form{ display:grid; gap:var(--s4); grid-template-columns:1fr 1fr; }
.tb-f-2{ grid-column:1 / -1; }
.tb-dial{ display:flex; align-items:stretch; }
.tb-dial > span{
  flex:none; display:flex; align-items:center;
  padding-inline:var(--s3);
  background:var(--paper-2);
  border:1.5px solid var(--line);
  border-start-start-radius:var(--r-sm); border-end-start-radius:var(--r-sm);
  border-inline-end:none;
  font-size:13px; font-weight:800; color:var(--ink-2);
}
.tb-dial input{
  border-start-start-radius:0; border-end-start-radius:0;
}

.tb-gate{
  margin-block-start:var(--s4);
  padding:var(--s3) var(--s4);
  background:var(--gold-100);
  border:1px solid var(--gold-400);
  border-radius:var(--r-sm);
  font-size:12.6px;
}
.tb-gate-h{ display:block; font-weight:800; color:var(--tb-gold-t); margin-block-end:2px; }
.tb-gate-l{ display:flex; flex-direction:column; gap:2px; color:var(--ink-2); }
.tb-gate-i{ position:relative; padding-inline-start:var(--s4); line-height:1.9; }
.tb-gate-i::before{
  content:'•'; position:absolute; inset-inline-start:2px;
  color:var(--gold-700); font-weight:900;
}

.tb-err{
  margin:var(--s3) 0 0;
  padding:var(--s3) var(--s4);
  background:var(--paper-2);
  background:color-mix(in srgb, var(--err) 10%, transparent);
  border:1px solid var(--err);
  border-radius:var(--r-sm);
  color:var(--err); font-size:13px; font-weight:700;
}

.tb-submit{
  width:100%; min-height:54px;
  margin-block-start:var(--s4);
  background:var(--gold); color:#0b1a14;
  border:none; border-radius:var(--r-sm);
  font-family:inherit; font-size:16px; font-weight:800;
  cursor:pointer; transition:var(--t);
}
.tb-submit:hover:not(:disabled){ background:var(--gold-600); box-shadow:var(--e2); }
.tb-submit:disabled{ opacity:.45; cursor:not-allowed; }

.tb-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:46px; padding:0 var(--s5);
  border-radius:var(--r-sm); border:1.5px solid transparent;
  font-family:inherit; font-size:14px; font-weight:800;
  cursor:pointer; text-decoration:none; transition:var(--t);
}
.tb-btn-g{ background:var(--gold); color:#0b1a14; }
.tb-btn-g:hover{ background:var(--gold-600); }
.tb-btn-g:disabled{ opacity:.45; cursor:not-allowed; }
.tb-btn-o{ background:transparent; border-color:var(--line); color:var(--ink-2); }
.tb-btn-o:hover:not(:disabled){ border-color:var(--g-600); color:var(--g-700); }
.tb-btn-o:disabled{ opacity:.5; cursor:not-allowed; }

/* کدِ پیامکی */
.tb-otp{
  margin-block-start:var(--s4);
  padding:var(--s5);
  background:var(--g-050);
  border:1.5px solid var(--g-100);
  border-radius:var(--r);
}
.tb-otp-h{ display:flex; align-items:flex-start; gap:var(--s3); margin-block-end:var(--s4); }
.tb-otp-h > span{ font-size:22px; line-height:1.2; }
.tb-otp-h b{ display:block; font-size:15px; font-weight:800; color:var(--tb-h); }
.tb-otp-h > div > span{ display:block; font-size:12.5px; color:var(--muted); line-height:1.8; }
.tb-otp-m{
  margin:0 0 var(--s3);
  padding:var(--s2) var(--s3);
  border-radius:var(--r-xs);
  font-size:12.8px; font-weight:700;
  background:var(--paper-2); color:var(--ink-2);
}
.tb-otp-ok{ color:var(--ok); background:color-mix(in srgb, var(--ok) 12%, transparent); }
.tb-otp-err{ color:var(--err); background:color-mix(in srgb, var(--err) 10%, transparent); }
.tb-otp-info{ color:var(--info); background:color-mix(in srgb, var(--info) 10%, transparent); }
.tb-otp-link{ font-weight:800; text-decoration:underline; }
.tb-otp-a{ display:flex; align-items:flex-end; gap:var(--s3); flex-wrap:wrap; }
.tb-f-otp{ flex:1 1 170px; }
.tb-f-otp input{ letter-spacing:.32em; font-size:17px; font-weight:800; text-align:center; }

/* پایانِ خوش */
.tb-done{ text-align:center; padding:var(--s6) var(--s4); }
.tb-done-i{
  display:inline-flex; align-items:center; justify-content:center;
  width:56px; height:56px; border-radius:var(--r-full);
  background:var(--ok); color:#fff; font-size:27px; font-weight:900;
  margin-block-end:var(--s3);
}
.tb-done-h{ margin:0 0 var(--s3); font-size:20px; font-weight:800; color:var(--tb-h); }
.tb-done-c{
  display:inline-flex; align-items:center; gap:var(--s3);
  padding:var(--s3) var(--s5);
  background:var(--gold-100); border:1px dashed var(--gold);
  border-radius:var(--r-sm); margin-block-end:var(--s3);
}
.tb-done-c span{ font-size:12.5px; color:var(--tb-gold-t); font-weight:700; }
.tb-done-c b{ font-size:19px; font-weight:900; color:var(--tb-h); letter-spacing:.05em; }
.tb-done-p{ margin:0 0 var(--s5); font-size:13.5px; color:var(--ink-2); }
.tb-done-b{ display:flex; gap:var(--s3); justify-content:center; flex-wrap:wrap; }

/* دعوتِ محترمانه به اتوبوسِ دربستی */
.tb-bus{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--s4); flex-wrap:wrap;
  margin-block-start:var(--s6);
  padding:var(--s4) var(--s5);
  background:var(--paper-2);
  border:1px dashed var(--line);
  border-radius:var(--r);
}
.tb-bus b{ display:block; font-size:14px; font-weight:800; color:var(--tb-h); }
.tb-bus span{ display:block; font-size:12.5px; color:var(--muted); line-height:1.8; }
.tb-bus-a{
  flex:none;
  font-size:13.2px; font-weight:800; color:var(--tb-h2);
  text-decoration:none; padding:8px var(--s4);
  border:1.5px solid var(--g-600); border-radius:var(--r-sm);
  transition:var(--t);
}
.tb-bus-a:hover{ background:var(--g-800); border-color:var(--g-800); color:#fff; }

/* ───────── فاکتورِ زنده ───────── */
.tb-sum{
  /* ۷۶px ≈ بلندیِ سربرگِ چسبندهٔ سایت + کمی فاصله. با کمتر از این،
     سرِ فاکتور زیرِ سربرگ می‌رود. */
  position:sticky; top:76px;
  max-height:calc(100vh - 96px); overflow-y:auto;
  align-self:start;
  background:var(--g-050);
  border:1.5px solid var(--g-100);
  border-radius:var(--r);
  overflow:hidden;
}
.tb-sum-tog{ display:none; }
.tb-sum-body{ padding:var(--s5); }
.tb-sum-h{
  margin:0 0 var(--s4);
  font-size:14.5px; font-weight:800; color:var(--tb-h);
  padding-block-end:var(--s3); border-block-end:1px solid var(--g-100);
}
.tb-sum-empty{ margin:0; font-size:12.8px; color:var(--muted); line-height:1.9; }
.tb-sum-veh{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s2);
  margin-block-end:var(--s3);
  font-size:12.8px;
}
.tb-sum-veh span{ color:var(--muted); }
.tb-sum-veh b{ color:var(--tb-h); font-weight:800; }
.tb-sum-lh{ display:block; font-size:11.6px; font-weight:800; color:var(--muted); margin-block-end:6px; }
.tb-sum-lh i{ font-style:normal; color:var(--tb-h2); }
.tb-sum-ul{ margin:0 0 var(--s4); padding:0; }
.tb-sum-li{
  display:flex; align-items:baseline; justify-content:space-between; gap:var(--s2);
  padding-block:5px;
  border-block-end:1px dotted var(--g-100);
  font-size:12.6px;
}
.tb-sum-li span{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink-2); }
.tb-sum-li b{ flex:none; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums; }
.tb-sum-rows{ margin-block-end:var(--s3); }
.tb-sum-r{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s2);
  font-size:13px; padding-block:3px;
}
.tb-sum-r span{ color:var(--ink-2); }
.tb-sum-r b{ font-weight:800; font-variant-numeric:tabular-nums; }
.tb-sum-off b,
.tb-sum-off span{ color:var(--ok); }
.tb-sum-note{ font-size:11.5px; color:var(--muted); font-weight:700; }
.tb-sum-tot{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s2);
  padding:var(--s3) var(--s4);
  background:var(--g-800); color:#fff;
  border-radius:var(--r-sm);
}
.tb-sum-tot span{ font-size:12.5px; opacity:.85; }
.tb-sum-tot b{ font-size:19px; font-weight:900; color:var(--gold-400); font-variant-numeric:tabular-nums; }
.tb-sum-tot small{ font-size:11.5px; font-weight:700; opacity:.9; }
.tb-sum-meta{
  display:flex; flex-wrap:wrap; gap:var(--s2) var(--s4);
  margin-block-start:var(--s3);
  font-size:11.8px; color:var(--muted);
}
.tb-sum-meta b{ color:var(--ink-2); font-weight:800; }
.tb-sum-go{
  width:100%; min-height:44px; margin-block-start:var(--s4);
  background:transparent; border:1.5px solid var(--g-600);
  border-radius:var(--r-sm);
  font-family:inherit; font-size:13.2px; font-weight:800; color:var(--tb-h2);
  cursor:pointer; transition:var(--t);
}
.tb-sum-go:hover{ background:var(--g-800); border-color:var(--g-800); color:#fff; }

/* ───────── موبایل ───────── */
@media (max-width:900px){
  .tb-grid{ grid-template-columns:1fr; gap:var(--s4); }
  /* فاکتور بالای فرم و چسبنده می‌شود؛ روی موبایل نوارِ ثابتِ پایینِ سایت
     (.kg-bar) و دکمه‌های شناور جا دارند، پس این‌جا بالا می‌چسبد نه پایین. */
  .tb-sum{
    order:-1;
    /* ۶۰px ≈ بلندیِ سربرگِ چسبندهٔ سایت، تا زیرش گم نشود.
       z-index از سربرگ (۹۰۰) کمتر است، پس سربرگ همیشه رو می‌ماند. */
    position:sticky; top:60px; z-index:12;
    box-shadow:var(--e3);
  }
  .tb-sum-tog{
    display:flex; align-items:center; gap:var(--s2);
    width:100%; min-height:52px; padding:0 var(--s4);
    background:var(--g-800); border:none;
    font-family:inherit; color:#fff; cursor:pointer; text-align:start;
  }
  .tb-sum-tog-l{ font-size:12.5px; opacity:.85; }
  .tb-sum-tog-v{
    flex:1 1 auto; font-size:16px; font-weight:900; color:var(--gold-400);
    direction:ltr; text-align:start; font-variant-numeric:tabular-nums;
  }
  .tb-sum-tog-c{ flex:none; font-size:12px; font-weight:800; opacity:.9; text-decoration:underline; }
  .tb-sum-body{ display:none; }
  .tb-sum.open .tb-sum-body{ display:block; max-height:62vh; overflow-y:auto; }
  .tb-form{ grid-template-columns:1fr; }
  .tb-routes{ max-height:none; }
}
@media (max-width:560px){
  .tb-veh{ grid-template-columns:repeat(auto-fit,minmax(104px,1fr)); }
  .tb-v{ min-height:100px; }
  .tb-routes{ grid-template-columns:1fr; }
  .tb-sec-t{ font-size:16.5px; }
  .tb-bus{ flex-direction:column; align-items:stretch; text-align:center; }
  .tb-bus-a{ text-align:center; }
}

/* ───────── ورودِ نرمِ بخش‌ها ───────── */
@media (prefers-reduced-motion: no-preference){
  .tb-sec{ animation:tb-in .34s var(--ease) both; }
  .tb-sec:nth-child(2){ animation-delay:.04s; }
  .tb-sec:nth-child(3){ animation-delay:.08s; }
  .tb-sec:nth-child(4){ animation-delay:.12s; }
  @keyframes tb-in{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
}
@media (prefers-reduced-motion: reduce){
  .tb *,
  .tb *::before,
  .tb *::after{ animation:none !important; transition:none !important; }
  .tb-v:hover{ transform:none; }
}


/* ============================================================
   تابلوی آویز — افزونهٔ بلوکیِ ویرایشگرِ بصری
   ------------------------------------------------------------
   چرا این‌طور نوشته شده:

   نسخهٔ قبلی تابلو را با position:absolute زیرِ یک دکمهٔ مشخص می‌چسباند.
   نتیجه این شد که هر جدّی با overflow:hidden (مثلِ .hero) کارتِ عکس را
   می‌بُرید و فقط گره و طناب دیده می‌شد — همان «آویزِ خالی».

   این نسخه هیچ absolute ندارد: تابلو یک بلوکِ درون‌جریان است، پس جای
   خودش را می‌گیرد و هیچ‌وقت بریده نمی‌شود. برای همان حسِ «آویزان از
   چیزِ بالایی»، به‌جای absolute از --h-tuck استفاده می‌شود که تابلو را
   به‌اندازهٔ دلخواه بالا می‌کشد.

   همهٔ اندازه‌ها متغیرِ CSS‌اند تا پنلِ ویرایشگر بتواند زنده تغییرشان دهد.
   ============================================================ */

.kg-hang-block {
  --h-w: 220px;      /* عرضِ تابلو */
  --h-rope: 26px;    /* طولِ طناب */
  --h-tuck: 0px;     /* چقدر بالا کشیده شود */
  --h-radius: 14px;  /* گردیِ گوشهٔ تابلو */
  --h-swing: 3.8s;   /* دورهٔ نوسان */
  --h-gold: #c9a227;

  display: flex;
  flex-direction: column;
  align-items: center;
  width: max-content;
  max-width: 100%;
  margin-block: calc(-1 * var(--h-tuck)) 0;
  margin-inline: auto;
  position: relative;
  z-index: 5;
}

/* لایهٔ حرکت — عمداً جدا از خودِ بلوک.
 *
 * چرا: «جایگذاریِ آزاد»ِ ویرایشگر عنصر را با style.transform = translate(x,y)
 * جابه‌جا می‌کند. انیمیشنِ CSS در آبشار بر استایلِ درون‌خطی غلبه دارد، پس اگر
 * نوسان روی خودِ بلوک باشد، جابه‌جایی کاملاً بلعیده می‌شود: نه در ویرایشگر
 * تکان می‌خورد و نه — چون data-kg-free و transform در HTML ذخیره می‌شوند —
 * روی سایتِ زنده سرِ جای درست می‌نشیند.
 * با یک لایهٔ داخلی، transform بیرونی برای جابه‌جایی آزاد می‌ماند و transform
 * درونی فقط می‌چرخد. */
.kg-hang-block .kg-hang-sway {
  display: flex;
  flex-direction: column;
  align-items: center;
  transform-origin: 50% 7px;   /* لولا وسطِ گره تا نوسان طبیعی به‌نظر برسد */
  animation: kgHangSwing var(--h-swing) ease-in-out infinite;
  will-change: transform;
}

/* تراز — در RTL «شروع» یعنی راست */
.kg-hang-block.al-start  { margin-inline: 0 auto; }
.kg-hang-block.al-center { margin-inline: auto; }
.kg-hang-block.al-end    { margin-inline: auto 0; }

/* عنصرِ جای‌گذاری‌شدهٔ آزاد خودش موقعیت دارد؛ حاشیهٔ خودکار با آن می‌جنگد */
.kg-hang-block[data-kg-free="1"] { margin-inline: 0; }

/* سرعتِ نوسان */
.kg-hang-block.sw-0 .kg-hang-sway { animation: none; }
.kg-hang-block.sw-1 { --h-swing: 5.2s; }
.kg-hang-block.sw-2 { --h-swing: 3.8s; }
.kg-hang-block.sw-3 { --h-swing: 2.4s; }

.kg-hang-block .kg-hang-knot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fffdf5, var(--h-gold) 68%, #8a6d14);
  box-shadow: 0 1px 4px rgba(0, 0, 0, .4);
  flex: none;
}

.kg-hang-block .kg-hang-rope {
  width: 3px;
  height: var(--h-rope);
  margin-top: -3px;
  border-radius: 3px;
  background: linear-gradient(#e0c072, #9a7a34);
  flex: none;
}

.kg-hang-block .kg-hang-card {
  display: block;
  border-radius: var(--h-radius);
  overflow: hidden;
  background: #fff;
  border: 3px solid #fff;
  box-shadow: 0 18px 42px -12px rgba(11, 61, 46, .55), 0 4px 10px rgba(0, 0, 0, .18);
  transition: transform .2s ease;
  text-decoration: none;
  max-width: 100%;
}

.kg-hang-block .kg-hang-card:hover,
.kg-hang-block .kg-hang-card:focus-visible { transform: scale(1.03); }

.kg-hang-block .kg-hang-card img {
  display: block;
  width: var(--h-w);
  max-width: 100%;
  height: auto;
}

/* متنِ اختیاری روی تابلو — وقتی کاربر به‌جای عکس متن می‌خواهد */
.kg-hang-block .kg-hang-text {
  display: block;
  width: var(--h-w);
  max-width: 100%;
  box-sizing: border-box;
  padding: 16px 18px;
  text-align: center;
  font-weight: 800;
  line-height: 1.9;
  color: #8a6d16;
  background: linear-gradient(160deg, #fdf9ee, #fff);
}

.kg-hang-block .kg-hang-text small {
  display: block;
  margin-top: 4px;
  font-weight: 600;
  font-size: .82em;
  color: #5c6b62;
}

@keyframes kgHangSwing {
  0%, 100% { transform: rotate(-4deg); }
  50%      { transform: rotate(4deg); }
}

@media (max-width: 560px) {
  .kg-hang-block { --h-w: min(var(--h-w), 62vw); }
}

@media (prefers-reduced-motion: reduce) {
  .kg-hang-block .kg-hang-sway { animation: none; }
  .kg-hang-block .kg-hang-card { transition: none; }
}

/* ============================================================
   برنامه‌ریزِ سفرِ روزبه‌روز — خانوادهٔ tp-
   ------------------------------------------------------------
   واحدِ ذهنیِ کاربر «روز» است، نه «مسیر». پس واحدِ بصری هم
   کارتِ روز است: یک بلیط با شمارهٔ روز، تاریخِ شمسیِ درشت،
   میلادیِ ریز زیرش، و حرکت‌ها روی یک خطِ زمانیِ عمودی.

   سلسله‌مراتبِ چشم — عمداً و به‌ترتیب:
     ۱) نشانِ روز + تاریخِ شمسی  (پررنگ‌ترین جرمِ بصری در ستونِ راست)
     ۲) ساعتِ هر حرکت           (چیپِ رنگِ تأکید، عددِ جدولی)
     ۳) نامِ مسیر               (متنِ اصلی، وزنِ ۷۰۰)
     ۴) قیمت و تاریخِ میلادی    (خاکستریِ آرام، عددِ جدولی)
     ۵) جمعِ نهاییِ فاکتور       (تنها عددی که از تاریخِ روز درشت‌تر است)

   قواعدِ رنگ که این‌جا رعایت شده — همه اندازه‌گیری شده، نه حدسی:
     · --muted فقط روی --white/--paper می‌نشیند (۴.۷۸ / ۴.۶۵).
       روی سطحِ ته‌رنگ‌دار به ۴.۳۹ می‌افتد، پس آن‌جا --ink-2 (۹.۳۱).
     · --g-700 در حالتِ شب روی زمینهٔ تیره ۱.۵۴ می‌شود — فاجعه.
       برای همین رنگِ تأکید در شب به --gold-400 می‌چرخد (۸.۴۷).
     · --gold-600 روی سفید ۳.۹۴ است؛ برای متنِ ریز از --gold-700 (۵.۵۶).
     · --err/--ok در شب ۳.۰۵/۳.۱۱ می‌شوند؛ با آمیختن با --ink به ۶.۱۴/۶.۵۹.
   هیچ رنگِ خامِ تازه‌ای نوشته نشده؛ تنها استثنا --tp-on-dark که همان
   قراردادِ موجودِ فایل است (.kg-bar-2، .kg-footer، header .logo).
   ============================================================ */

/* ───────── ۱) توکن‌های محدودهٔ مؤلفه ───────── */
.tp-wrap{
  /* سطح‌ها: صفحه فرورفته، کارت برجسته — عمق از اختلافِ روشنایی می‌آید نه از سایه */
  --tp-page:var(--paper-2);
  --tp-surface:var(--white);
  --tp-sunk:var(--g-050);
  --tp-soft:var(--g-100);

  /* خط‌ها: --tp-line تزئینی است، --tp-line-2 مرزِ تعاملی و ≥۳:۱ */
  --tp-line:var(--line);
  --tp-line-2:color-mix(in srgb, var(--muted) 82%, var(--paper));
  --tp-perf:color-mix(in srgb, var(--muted) 45%, var(--paper));

  /* رنگِ تأکید — در شب می‌چرخد، پایین‌ترِ همین فایل */
  --tp-acc:var(--g-700);
  --tp-acc-2:var(--g-600);
  --tp-acc-on:var(--paper);
  --tp-acc-soft:var(--g-100);
  --tp-acc-ring:color-mix(in srgb, var(--g-600) 22%, transparent);

  /* متن */
  --tp-ink:var(--ink);
  --tp-dim:var(--ink-2);
  --tp-faint:var(--muted);
  --tp-on-dark:#fff;          /* همان قراردادِ .kg-bar-2 و .kg-footer */

  --tp-ok:var(--ok);
  --tp-err:var(--err);
  --tp-err-bg:color-mix(in srgb, var(--err) 8%, var(--white));
  --tp-ok-bg:color-mix(in srgb, var(--ok) 9%, var(--white));

  /* هندسه */
  --tp-rail:28px;             /* فاصلهٔ خطِ زمانی از لبهٔ حرکت‌ها */
  --tp-dot:11px;
  --tp-notch:9px;             /* شعاعِ سوراخِ پرفراژِ بلیط */
  --tp-top:88px;              /* زیرِ سربرگِ چسبانِ سایت (z-index 900) */
  --tp-aside:380px;
  --tp-bar:92px;              /* بلندیِ نوارِ پایینِ موبایل */

  position:relative;
  box-sizing:border-box;
  max-width:min(100%,1420px);
  margin-inline:auto;
  padding:clamp(var(--s4),3vw,var(--s10));
  background:var(--tp-page);
  border:1px solid var(--tp-line);
  border-radius:var(--r-xl);
  color:var(--tp-ink);
  font-family:var(--font);
  text-align:start;
  /* عمداً container-type نمی‌گذاریم: containment، عنصرِ position:fixed را
     به همین کادر قفل می‌کند و نوارِ پایینِ موبایل از کار می‌افتد. */
}
.tp-wrap *,
.tp-wrap *::before,
.tp-wrap *::after{ box-sizing:border-box; }
.tp-wrap [hidden]{ display:none !important; }

/* چرخشِ شب — سه بلوک چون تعویض‌گرِ سایت data-theme را روی ریشه می‌گذارد
   و باید در هر دو جهت بر media-query غلبه کند (همان الگوی خطِ ۵۶ تا ۶۵) */
@media (prefers-color-scheme: dark){
  .tp-wrap{
    --tp-page:var(--paper);
    --tp-acc:var(--gold-400);
    --tp-acc-2:var(--gold);
    --tp-acc-soft:var(--gold-100);
    --tp-acc-ring:color-mix(in srgb, var(--gold-400) 26%, transparent);
    --tp-err:color-mix(in srgb, var(--err) 55%, var(--ink));
    --tp-ok:color-mix(in srgb, var(--ok) 55%, var(--ink));
    --tp-err-bg:color-mix(in srgb, var(--err) 22%, var(--white));
    --tp-ok-bg:color-mix(in srgb, var(--ok) 22%, var(--white));
  }
}
:root[data-theme="dark"] .tp-wrap{
  --tp-page:var(--paper);
  --tp-acc:var(--gold-400);
  --tp-acc-2:var(--gold);
  --tp-acc-soft:var(--gold-100);
  --tp-acc-ring:color-mix(in srgb, var(--gold-400) 26%, transparent);
  --tp-err:color-mix(in srgb, var(--err) 55%, var(--ink));
  --tp-ok:color-mix(in srgb, var(--ok) 55%, var(--ink));
  --tp-err-bg:color-mix(in srgb, var(--err) 22%, var(--white));
  --tp-ok-bg:color-mix(in srgb, var(--ok) 22%, var(--white));
}
:root[data-theme="light"] .tp-wrap{
  --tp-page:var(--paper-2);
  --tp-acc:var(--g-700);
  --tp-acc-2:var(--g-600);
  --tp-acc-soft:var(--g-100);
  --tp-acc-ring:color-mix(in srgb, var(--g-600) 22%, transparent);
  --tp-err:var(--err);
  --tp-ok:var(--ok);
  --tp-err-bg:color-mix(in srgb, var(--err) 8%, var(--white));
  --tp-ok-bg:color-mix(in srgb, var(--ok) 9%, var(--white));
}

/* ───────── ۲) چیدمانِ کلی: برنامه | فاکتور ───────── */
.tp-wrap{
  display:grid;
  gap:clamp(var(--s5),2.4vw,var(--s10));
  grid-template-columns:minmax(0,1fr) var(--tp-aside);
  align-items:start;
}
/* سربرگ و هر چیزی که خودش را ستون نکرده، تمامِ عرض */
.tp-head,
.tp-search,
.tp-veh,
.tp-empty{ grid-column:1 / -1; }
.tp-main,.tp-body,.tp-left{ grid-column:1; min-width:0; }
.tp-days,.tp-add-day{ grid-column:1; min-width:0; }
.tp-cart{ grid-column:2; }
@media (max-width:1023px){
  .tp-wrap{ grid-template-columns:minmax(0,1fr); }
  .tp-main,.tp-body,.tp-left,.tp-days,.tp-add-day,.tp-cart{ grid-column:1 / -1; }
}

/* ───────── ۳) سربرگ ───────── */
.tp-head{
  position:relative;
  overflow:hidden;
  padding:clamp(var(--s6),3.4vw,var(--s10)) clamp(var(--s5),3vw,var(--s10));
  background:var(--g-900);
  border-radius:var(--r-lg);
  color:var(--tp-on-dark);
}
/* بافتِ آرامِ زمینه — نه شلوغ، فقط عمق */
.tp-head::before{
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--gold) 16%, transparent), transparent 58%),
    radial-gradient(90% 120% at 0% 100%, color-mix(in srgb, var(--g-600) 42%, transparent), transparent 62%);
  pointer-events:none;
}
.tp-head > *{ position:relative; }
.tp-head h1,
.tp-head h2,
.tp-head h3,
.tp-head .tp-h{
  margin:0 0 var(--s2);
  color:var(--tp-on-dark);
  font-size:clamp(21px,3.2vw,31px);
  font-weight:900;
  line-height:1.45;
  letter-spacing:-.3px;
}
.tp-head p,
.tp-head .tp-sub{
  margin:0;
  max-width:58ch;
  color:color-mix(in srgb, var(--tp-on-dark) 82%, transparent);
  font-size:clamp(13.5px,1.5vw,15.5px);
  line-height:1.95;
}
.tp-head small,
.tp-head .tp-eyebrow{
  display:inline-block;
  margin-block-end:var(--s3);
  padding-block-start:var(--s2);
  border-block-start:2px solid var(--gold);
  color:var(--gold-400);
  font-size:12px; font-weight:800; letter-spacing:1.4px;
}

/* ───────── ۴) جست‌وجو — تنها دروازهٔ ورودِ مسیر ───────── */
/* ‏۸۹۶: بالای نوارِ فاکتورِ موبایل (۸۹۵) ولی زیرِ سربرگِ چسبانِ سایت (۹۰۰) */
.tp-search{
  position:relative;
  z-index:896;
  isolation:isolate;
}
.tp-search-input,
.tp-search > input[type="text"],
.tp-search > input[type="search"]{
  width:100%;
  min-height:60px;
  padding:var(--s3) var(--s5);
  background:var(--tp-surface);
  border:2px solid var(--tp-line-2);
  border-radius:var(--r-lg);
  color:var(--tp-ink);
  font-family:inherit; font-size:17px; font-weight:700;
  box-shadow:var(--e1);
  transition:border-color var(--t), box-shadow var(--t), background var(--t);
  -webkit-appearance:none; appearance:none;
}
/* جا برای ذره‌بین فقط وقتی ورودی فرزندِ کادر است (اگر خودِ کادر input باشد، بی‌اثر) */
.tp-search .tp-search-input,
.tp-search > input[type="text"],
.tp-search > input[type="search"]{ padding-inline-start:calc(var(--s6) + 26px); }
.tp-search-input::placeholder{ color:var(--tp-faint); font-weight:600; }
.tp-search-input:hover{ border-color:color-mix(in srgb, var(--tp-acc) 45%, var(--tp-line-2)); }
.tp-search-input:focus,
.tp-search-input:focus-visible{
  outline:none;
  border-color:var(--tp-acc);
  box-shadow:0 0 0 5px var(--tp-acc-ring), var(--e2);
  background:var(--tp-surface);
}
.tp-search-input:disabled,
.tp-search-input[aria-disabled="true"]{
  background:var(--tp-sunk);
  color:var(--tp-faint);
  border-color:var(--tp-line);
  cursor:not-allowed;
  box-shadow:none;
}
/* ذره‌بینِ CSSی — بدونِ ایموجی، بدونِ فایلِ بیرونی */
.tp-search::before{
  content:'';
  position:absolute; z-index:2;
  inset-inline-start:calc(var(--s5) + 1px);
  inset-block-start:19px;
  width:15px; height:15px;
  border:2px solid var(--tp-faint);
  border-radius:50%;
  pointer-events:none;
  transition:border-color var(--t);
}
.tp-search::after{
  content:'';
  position:absolute; z-index:2;
  inset-inline-start:calc(var(--s5) + 13px);
  inset-block-start:33px;
  width:2px; height:8px;
  background:var(--tp-faint);
  border-radius:2px;
  transform:rotate(-40deg);
  transform-origin:top center;
  pointer-events:none;
  transition:background var(--t);
}
.tp-search:focus-within::before{ border-color:var(--tp-acc); }
.tp-search:focus-within::after{ background:var(--tp-acc); }
/* حالتِ بارگذاری: ذره‌بین جای خود را به حلقهٔ چرخان می‌دهد */
.tp-search.is-loading::before,
.tp-search[data-loading]::before,
.tp-search[aria-busy="true"]::before{
  border-color:var(--tp-line-2);
  border-block-start-color:var(--tp-acc);
  animation:tpSpin .7s linear infinite;
}
.tp-search.is-loading::after,
.tp-search[data-loading]::after,
.tp-search[aria-busy="true"]::after{ opacity:0; }

/* پیشنهادها */
.tp-sug{
  position:absolute; z-index:950;
  inset-inline:0;
  inset-block-start:calc(100% + var(--s2));
  max-height:min(52vh,380px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  margin:0; padding:var(--s2);
  list-style:none;
  background:var(--tp-surface);
  border:1px solid var(--tp-line);
  border-radius:var(--r);
  box-shadow:var(--e4);
  animation:tpDrop .18s var(--ease) both;
}
.tp-sug:empty{ display:none; }
.tp-sug-item{
  display:flex; align-items:center; gap:var(--s3);
  min-height:50px;
  margin:0; padding:var(--s2) var(--s3);
  border:0; width:100%;
  background:transparent;
  border-radius:var(--r-sm);
  color:var(--tp-ink);
  font-family:inherit; font-size:15px; font-weight:700; line-height:1.6;
  text-align:start; text-decoration:none;
  cursor:pointer;
  transition:background var(--t), color var(--t);
}
/* نقطهٔ راهنمای سمتِ شروع — کمک می‌کند فهرست «مکان» خوانده شود نه «متن» */
.tp-sug-item::before{
  content:'';
  flex:none;
  width:8px; height:8px;
  border-radius:50%;
  background:var(--tp-line-2);
  transition:background var(--t), box-shadow var(--t);
}
.tp-sug-item small,
.tp-sug-item .tp-sug-hint{
  margin-inline-start:auto;
  color:var(--tp-faint);
  font-size:12.5px; font-weight:600;
  white-space:nowrap;
}
.tp-sug-item mark{
  background:var(--gold-100);
  color:var(--tp-ink);
  border-radius:3px;
  padding-inline:2px;
  font-weight:900;
}
.tp-sug-item:hover,
.tp-sug-item:focus-visible,
.tp-sug-item.on,
.tp-sug-item.is-active,
.tp-sug-item.tp-on,
.tp-sug-item[aria-selected="true"],
.tp-sug-item[data-on]{
  background:var(--tp-acc-soft);
  outline:none;
}
.tp-sug-item:hover::before,
.tp-sug-item:focus-visible::before,
.tp-sug-item.on::before,
.tp-sug-item.is-active::before,
.tp-sug-item[aria-selected="true"]::before{
  background:var(--tp-acc);
  box-shadow:0 0 0 4px var(--tp-acc-ring);
}
.tp-sug-item:active{ background:color-mix(in srgb, var(--tp-acc) 18%, var(--tp-surface)); }
.tp-sug-item[disabled],
.tp-sug-item[aria-disabled="true"]{ opacity:.45; cursor:not-allowed; }

/* ───────── ۵) وسیله ───────── */
.tp-veh{
  display:grid;
  gap:var(--s3);
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  margin:0; padding:0;
  list-style:none;
}
.tp-veh-card{
  position:relative;
  display:flex; flex-direction:column; align-items:flex-start; gap:var(--s1);
  min-height:88px;
  padding:var(--s4) var(--s5);
  background:var(--tp-surface);
  border:1.5px solid var(--tp-line);
  border-radius:var(--r);
  color:var(--tp-ink);
  font-family:inherit; font-size:15px; font-weight:800; line-height:1.6;
  text-align:start; text-decoration:none;
  cursor:pointer;
  transition:border-color var(--t), background var(--t), box-shadow var(--t), transform var(--t);
}
.tp-veh-card small,
.tp-veh-card .tp-seats{
  color:var(--tp-faint);
  font-size:12.5px; font-weight:600;
  font-variant-numeric:tabular-nums;
}
.tp-veh-card img,
.tp-veh-card svg{ width:30px; height:30px; object-fit:contain; }
.tp-veh-card input{ position:absolute; opacity:0; width:1px; height:1px; margin:0; }
.tp-veh-card:hover{ border-color:var(--tp-acc-2); box-shadow:var(--e2); }
.tp-veh-card:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.tp-veh-card:active{ transform:translateY(1px); }
.tp-veh-card.on,
.tp-veh-card.is-on,
.tp-veh-card.tp-on,
.tp-veh-card.sel,
.tp-veh-card[aria-pressed="true"],
.tp-veh-card[aria-checked="true"],
.tp-veh-card[aria-selected="true"],
.tp-veh-card[data-on],
.tp-veh-card:has(input:checked){
  background:var(--tp-acc-soft);
  border-color:var(--tp-acc);
  box-shadow:0 0 0 1px var(--tp-acc) inset;
}
.tp-veh-card.on small,
.tp-veh-card.is-on small,
.tp-veh-card[aria-checked="true"] small,
.tp-veh-card[aria-pressed="true"] small,
.tp-veh-card:has(input:checked) small{ color:var(--tp-dim); }
/* تیکِ انتخاب */
.tp-veh-card.on::after,
.tp-veh-card.is-on::after,
.tp-veh-card.tp-on::after,
.tp-veh-card.sel::after,
.tp-veh-card[aria-pressed="true"]::after,
.tp-veh-card[aria-checked="true"]::after,
.tp-veh-card[aria-selected="true"]::after,
.tp-veh-card[data-on]::after,
.tp-veh-card:has(input:checked)::after{
  content:'';
  position:absolute;
  inset-block-start:var(--s3);
  inset-inline-end:var(--s3);
  width:9px; height:16px;
  border:solid var(--tp-acc);
  border-width:0 2.5px 2.5px 0;
  transform:rotate(40deg);
}
.tp-veh-card[disabled],
.tp-veh-card[aria-disabled="true"]{
  opacity:.5; cursor:not-allowed;
  background:var(--tp-sunk); border-color:var(--tp-line);
  box-shadow:none; transform:none;
}
/* روی موبایل: ردیفِ افقیِ چفت‌شونده به‌جای شبکه‌ای که ارتفاع می‌خورد */
@media (max-width:560px){
  .tp-veh{
    display:flex;
    gap:var(--s2);
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-block-end:var(--s1);
    margin-inline:calc(var(--s4) * -1);
    padding-inline:var(--s4);
  }
  .tp-veh::-webkit-scrollbar{ display:none; }
  .tp-veh-card{ flex:0 0 min(64vw,190px); scroll-snap-align:start; }
}

/* ───────── ۶) روزها — کارتِ بلیط ───────── */
.tp-days{
  display:grid;
  gap:var(--s5);
  margin:0; padding:0;
  list-style:none;
}
/* نوارِ رنگیِ لبه با «مرز» ساخته شده، نه با شبه‌عنصر:
   مرز بیرونِ جعبهٔ درونی است، پس هیچ فرزندی رویش نمی‌افتد و
   به هیچ z-index و stacking context نیاز نداریم — که اگر می‌داشتیم،
   تقویمِ بازشونده داخلِ کارت زیرِ نوارِ پایینِ موبایل گیر می‌کرد. */
.tp-day{
  position:relative;
  background:var(--tp-surface);
  border:1px solid var(--tp-line);
  border-inline-start:4px solid var(--tp-acc);
  border-radius:var(--r-lg);
  box-shadow:var(--e2);
  transition:box-shadow var(--t), border-color var(--t);
  /* ‏backwards نه both: انیمیشنِ transform اگر پس از پایان هم «در حالِ پرکردن»
     بماند، روی کارت stacking context می‌سازد و تقویمِ بازشونده داخلش
     زیرِ نوارِ پایینِ موبایل حبس می‌شود. */
  animation:tpIn .3s var(--ease) backwards;
}
.tp-day:hover{ box-shadow:var(--e3); }
.tp-day:focus-within{
  border-block-color:var(--tp-acc);
  border-inline-end-color:var(--tp-acc);
  box-shadow:var(--e3);
}

/* سرِ بلیط: نشانِ روز، تاریخِ شمسیِ درشت، میلادیِ ریز */
.tp-day-head{
  position:relative;
  display:flex; align-items:center; flex-wrap:wrap;
  gap:var(--s3) var(--s5);
  padding:var(--s5) clamp(var(--s5),2.4vw,var(--s8));
  background:linear-gradient(to bottom, var(--tp-sunk), var(--tp-surface));
  border-block-end:2px dashed var(--tp-perf);
  border-start-start-radius:var(--r-lg);
  border-start-end-radius:var(--r-lg);
}
/* سوراخِ پرفراژ — دو نیم‌دایره دقیقاً روی مرزِ سر و تن، هر چقدر هم سر بلند باشد.
   با گوشه‌های منطقی نوشته شده تا در RTL و LTR هر دو درست بیفتد. */
.tp-day-head::before,
.tp-day-head::after{
  content:'';
  position:absolute;
  inset-block-end:calc(var(--tp-notch) * -1);
  width:var(--tp-notch);
  height:calc(var(--tp-notch) * 2);
  background:var(--tp-page);
  border:1px solid var(--tp-line);
  pointer-events:none;
}
.tp-day-head::before{
  inset-inline-start:0;
  border-inline-start:0;
  border-start-end-radius:var(--tp-notch);
  border-end-end-radius:var(--tp-notch);
}
.tp-day-head::after{
  inset-inline-end:0;
  border-inline-end:0;
  border-start-start-radius:var(--tp-notch);
  border-end-start-radius:var(--tp-notch);
}

/* ۱) نخستین توقفِ چشم */
.tp-day-badge{
  flex:none;
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s1);
  min-width:64px; min-height:38px;
  padding-inline:var(--s4);
  background:var(--tp-acc);
  color:var(--tp-acc-on);
  border-radius:var(--r-full);
  font-size:14px; font-weight:900; letter-spacing:.2px;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  box-shadow:var(--e1);
}
.tp-day-date{
  flex:1 1 240px;
  min-width:0;
  color:var(--tp-ink);
  font-size:clamp(17px,2.2vw,22px);
  font-weight:900;
  line-height:1.5;
  letter-spacing:-.2px;
  text-wrap:balance;
}
/* ۴) میلادی: زیرِ شمسی، ریزتر، آرام‌تر — نه رقیبِ آن */
.tp-day-greg{
  flex:0 0 auto;
  display:block;
  color:var(--tp-dim);
  font-size:13px; font-weight:600;
  line-height:1.7;
  font-variant-numeric:tabular-nums;
  unicode-bidi:isolate;
}
/* اگر میلادی فرزندِ خودِ تاریخ باشد، همان‌جا زیرش بنشیند */
.tp-day-date .tp-day-greg{ margin-block-start:2px; }
.tp-day-head .tp-day-greg{ margin-inline-start:auto; }
.tp-day-date + .tp-day-greg{ margin-inline-start:0; }
/* ابزارِ سرِ کارت (حذفِ روز، تغییرِ تاریخ) — کم‌رنگ تا وزنِ تاریخ را نگیرد */
.tp-day-head .tp-btn-ghost{ margin-inline-start:auto; }
.tp-day.is-out,
.tp-day.tp-out,
.tp-day[data-out]{ animation:tpOut .24s var(--ease) both; }

/* ───────── ۷) حرکت‌ها روی خطِ زمانی ───────── */
.tp-moves{
  position:relative;
  display:grid;
  gap:var(--s2);
  margin:0;
  padding:var(--s5) clamp(var(--s5),2.4vw,var(--s8));
  padding-inline-start:calc(clamp(var(--s5),2.4vw,var(--s8)) + var(--tp-rail));
  list-style:none;
}
/* ریلِ عمودی — مرکزِ ریل روی نصفِ --tp-rail می‌نشیند؛ منهای ۱px چون خودش ۲px است */
.tp-moves::before{
  content:'';
  position:absolute;
  inset-block:calc(var(--s5) + 26px) calc(var(--s5) + 26px);
  inset-inline-start:calc(clamp(var(--s5),2.4vw,var(--s8)) + var(--tp-rail) / 2 - 1px);
  width:2px;
  background:linear-gradient(to bottom,
    color-mix(in srgb, var(--tp-acc) 55%, transparent),
    color-mix(in srgb, var(--tp-acc) 22%, transparent));
  border-radius:2px;
}
.tp-moves:empty{ display:none; }

.tp-move{
  position:relative;
  display:flex; align-items:center; flex-wrap:wrap;
  gap:var(--s2) var(--s4);
  min-height:56px;
  padding:var(--s3) var(--s4);
  background:var(--tp-surface);
  border:1px solid transparent;
  border-radius:var(--r);
  transition:background var(--t), border-color var(--t), box-shadow var(--t);
  animation:tpIn .28s var(--ease) backwards;
}
/* نقطهٔ ایستگاه — مرکزش دقیقاً روی مرکزِ ریل.
   فرمول مستقل از padding است، پس در هر بریک‌پوینتی درست می‌ماند:
   ‏−(rail + dot)/2 − ۱px برای مرزِ ۱pxیِ خودِ حرکت. */
.tp-move::before{
  content:'';
  position:absolute;
  inset-block-start:calc(50% - var(--tp-dot) / 2);
  inset-inline-start:calc((var(--tp-rail) + var(--tp-dot)) / -2 - 1px);
  width:var(--tp-dot); height:var(--tp-dot);
  border-radius:50%;
  background:var(--tp-surface);
  border:2.5px solid var(--tp-acc);
  transition:background var(--t), box-shadow var(--t);
}
.tp-move:last-child::before{ background:var(--tp-acc); }
.tp-move:hover{
  background:var(--tp-sunk);
  border-color:var(--tp-line);
}
.tp-move:hover::before{ box-shadow:0 0 0 4px var(--tp-acc-ring); }
.tp-move:focus-within{
  background:var(--tp-sunk);
  border-color:var(--tp-acc);
  box-shadow:0 0 0 3px var(--tp-acc-ring);
}
.tp-move.is-out,
.tp-move.tp-out,
.tp-move[data-out]{ animation:tpOut .22s var(--ease) both; }
.tp-move.is-err,
.tp-move[data-err],
.tp-move[aria-invalid="true"]{
  background:var(--tp-err-bg);
  border-color:color-mix(in srgb, var(--tp-err) 45%, transparent);
}

/* ۲) ساعت — چیپِ عددیِ جدولی، پررنگ‌ترین عنصرِ سطرِ حرکت */
.tp-move-time{
  flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  min-width:76px; min-height:36px;
  padding-inline:var(--s3);
  background:var(--tp-acc-soft);
  color:var(--tp-acc);
  border-radius:var(--r-sm);
  font-size:16px; font-weight:900;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  letter-spacing:.4px;
  unicode-bidi:isolate;
  white-space:nowrap;
}
/* ۳) مسیر */
.tp-move-route{
  flex:1 1 190px;
  min-width:0;
  color:var(--tp-ink);
  font-size:15.5px; font-weight:700; line-height:1.7;
  overflow-wrap:anywhere;
}
.tp-move-route small{
  display:block;
  color:var(--tp-faint);
  font-size:12.5px; font-weight:600;
  font-variant-numeric:tabular-nums;
}
/* ۴) قیمت — همیشه از سرور؛ این‌جا فقط ظرفِ آن است */
.tp-move-price{
  flex:none;
  margin-inline-start:auto;
  color:var(--tp-dim);
  font-size:14.5px; font-weight:800;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  text-align:end;
  white-space:nowrap;
  unicode-bidi:isolate;
}
/* حذف — روی اشاره‌گر پنهانِ آرام، روی لمس و صفحه‌کلید همیشه پیدا */
.tp-move-del{
  flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px;
  padding:0;
  background:transparent;
  border:1px solid transparent;
  border-radius:50%;
  color:var(--tp-faint);
  font-family:inherit; font-size:18px; line-height:1;
  cursor:pointer;
  opacity:.45;
  transition:opacity var(--t), background var(--t), color var(--t), border-color var(--t);
}
.tp-move:hover .tp-move-del,
.tp-move:focus-within .tp-move-del{ opacity:1; }
.tp-move-del:hover{
  background:var(--tp-err-bg);
  border-color:color-mix(in srgb, var(--tp-err) 35%, transparent);
  color:var(--tp-err);
  opacity:1;
}
.tp-move-del:focus-visible{ opacity:1; outline:3px solid var(--gold); outline-offset:2px; }
.tp-move-del:active{ transform:scale(.92); }
/* ضربدرِ CSSی فقط اگر دکمه خالی باشد */
.tp-move-del:empty{ position:relative; }
.tp-move-del:empty::before,
.tp-move-del:empty::after{
  content:'';
  position:absolute;
  inset-block-start:calc(50% - 1px);
  inset-inline-start:calc(50% - 7.5px);
  width:15px; height:2px;
  background:currentColor;
  border-radius:2px;
}
.tp-move-del:empty::before{ transform:rotate(45deg); }
.tp-move-del:empty::after{ transform:rotate(-45deg); }
@media (hover:none){
  .tp-move-del{ opacity:.8; }
}

/* ───────── ۸) افزودنِ روز / افزودنِ حرکت ───────── */
.tp-add-day{
  display:flex; align-items:center; justify-content:center; gap:var(--s3);
  width:100%;
  min-height:64px;
  padding:var(--s4) var(--s6);
  background:transparent;
  border:2px dashed var(--tp-line-2);
  border-radius:var(--r-lg);
  color:var(--tp-acc);
  font-family:inherit; font-size:15.5px; font-weight:800;
  cursor:pointer;
  transition:border-color var(--t), background var(--t), color var(--t), transform var(--t);
}
.tp-add-day:not(:has(svg)):not(:has(img)):not(:has(i))::before{
  content:'';
  flex:none;
  width:20px; height:20px;
  background:
    linear-gradient(currentColor,currentColor) center/2.5px 100% no-repeat,
    linear-gradient(currentColor,currentColor) center/100% 2.5px no-repeat;
}
.tp-add-day:hover{
  background:var(--tp-acc-soft);
  border-color:var(--tp-acc);
  border-style:solid;
}
.tp-add-day:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; }
.tp-add-day:active{ transform:translateY(1px); }
.tp-add-day[disabled],
.tp-add-day[aria-disabled="true"]{
  opacity:.45; cursor:not-allowed;
  background:transparent; border-color:var(--tp-line); color:var(--tp-faint);
  transform:none;
}
/* دکمهٔ افزودنِ حرکت داخلِ کارتِ روز: کوچک‌تر، تویِ ریل */
.tp-day .tp-add-day{
  min-height:48px;
  margin:0 clamp(var(--s5),2.4vw,var(--s8)) var(--s5);
  width:auto;
  border-radius:var(--r);
  font-size:14px;
}
.tp-day .tp-moves + .tp-add-day{ margin-block-start:calc(var(--s5) * -1 + var(--s2)); }

/* ───────── ۹) حالتِ خالی — خودش راهنماست ───────── */
.tp-empty{
  display:flex; flex-direction:column; align-items:center;
  gap:var(--s3);
  padding:clamp(var(--s8),6vw,var(--s16)) var(--s6);
  background:var(--tp-surface);
  border:2px dashed var(--tp-line-2);
  border-radius:var(--r-lg);
  text-align:center;
}
/* نقشهٔ کوچکِ CSSی: دو ایستگاه و یک مسیرِ نقطه‌چین بینشان */
.tp-empty::before{
  content:'';
  width:min(190px,70%);
  height:34px;
  margin-block-end:var(--s3);
  background:
    radial-gradient(circle 7px at 7px 17px, var(--tp-acc) 98%, transparent 100%) no-repeat,
    radial-gradient(circle 7px at calc(100% - 7px) 17px, var(--tp-acc) 98%, transparent 100%) no-repeat,
    radial-gradient(circle 5px at 50% 17px, var(--tp-acc-2) 98%, transparent 100%) no-repeat,
    repeating-linear-gradient(to right,
      color-mix(in srgb, var(--tp-acc) 55%, transparent) 0 7px,
      transparent 7px 14px) no-repeat;
  background-size:100% 100%, 100% 100%, 100% 100%, 100% 2px;
  background-position:0 0, 0 0, 0 0, 0 16px;
}
.tp-empty h3,
.tp-empty h4,
.tp-empty strong,
.tp-empty b{
  margin:0;
  color:var(--tp-ink);
  font-size:clamp(17px,2.2vw,21px);
  font-weight:900;
  line-height:1.6;
}
.tp-empty p,
.tp-empty small{
  margin:0;
  max-width:46ch;
  color:var(--tp-dim);
  font-size:14.5px;
  line-height:2;
}
.tp-empty ol,
.tp-empty ul{
  margin:var(--s3) 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:var(--s2);
  text-align:start;
  counter-reset:tpstep;
}
.tp-empty ol li{
  position:relative;
  display:flex; align-items:center; gap:var(--s3);
  color:var(--tp-dim);
  font-size:14px; font-weight:700;
}
.tp-empty ol li::before{
  counter-increment:tpstep;
  content:counter(tpstep);
  flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px;
  background:var(--tp-acc-soft);
  color:var(--tp-acc);
  border-radius:50%;
  font-size:12.5px; font-weight:900;
}
.tp-empty .tp-btn,
.tp-empty .tp-go{ margin-block-start:var(--s4); }

/* ───────── ۱۰) فاکتورِ زنده ───────── */
.tp-cart{
  position:sticky;
  inset-block-start:var(--tp-top);
  display:flex; flex-direction:column;
  gap:var(--s1);
  padding:clamp(var(--s5),2.2vw,var(--s6));
  background:var(--tp-surface);
  border:1px solid var(--tp-line);
  border-radius:var(--r-lg);
  box-shadow:var(--e3);
  max-height:calc(100vh - var(--tp-top) - var(--s6));
  overflow-y:auto;
  overscroll-behavior:contain;
}
.tp-cart > h3,
.tp-cart > h4,
.tp-cart > .tp-cart-h{
  margin:0 0 var(--s3);
  padding-block-end:var(--s3);
  border-block-end:1px solid var(--tp-line);
  color:var(--tp-ink);
  font-size:15px; font-weight:900;
}
.tp-cart-line{
  display:flex; align-items:baseline; gap:var(--s3);
  padding-block:var(--s2);
  border-block-end:1px dashed var(--tp-perf);
  color:var(--tp-dim);
  font-size:13.5px; font-weight:700;
  line-height:1.8;
  animation:tpIn .22s var(--ease) backwards;
}
.tp-cart-line:last-of-type{ border-block-end:0; }
.tp-cart-line > :last-child,
.tp-cart-line b,
.tp-cart-line strong,
.tp-cart-line .tp-num{
  margin-inline-start:auto;
  color:var(--tp-ink);
  font-weight:800;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  white-space:nowrap;
  unicode-bidi:isolate;
}
.tp-cart-line small{
  color:var(--tp-faint);
  font-size:12px; font-weight:600;
}
.tp-cart-disc{
  display:flex; align-items:baseline; gap:var(--s3);
  margin-block:var(--s2);
  padding:var(--s2) var(--s3);
  background:var(--tp-ok-bg);
  border-radius:var(--r-sm);
  color:var(--tp-ok);
  font-size:13.5px; font-weight:800;
}
.tp-cart-disc > :last-child,
.tp-cart-disc b,
.tp-cart-disc strong{
  margin-inline-start:auto;
  font-variant-numeric:tabular-nums;
  unicode-bidi:isolate;
  white-space:nowrap;
}
/* ۵) درشت‌ترین عددِ صفحه */
.tp-cart-total{
  display:flex; align-items:center; gap:var(--s3);
  margin-block-start:var(--s3);
  padding-block-start:var(--s4);
  border-block-start:2px solid var(--tp-line);
  color:var(--tp-ink);
  font-size:15px; font-weight:800;
}
.tp-cart-total > :last-child,
.tp-cart-total b,
.tp-cart-total strong,
.tp-cart-total .tp-num{
  margin-inline-start:auto;
  color:var(--tp-acc);
  font-size:clamp(22px,3.4vw,28px);
  font-weight:900;
  line-height:1.3;
  letter-spacing:-.5px;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  unicode-bidi:isolate;
  white-space:nowrap;
}
.tp-cart.is-loading,
.tp-cart[aria-busy="true"],
.tp-cart[data-loading]{ position:relative; }
.tp-cart.is-loading .tp-cart-total > :last-child,
.tp-cart[aria-busy="true"] .tp-cart-total > :last-child,
.tp-cart[data-loading] .tp-cart-total > :last-child{
  color:transparent;
  border-radius:var(--r-xs);
  background:linear-gradient(90deg,
    var(--tp-sunk) 25%,
    color-mix(in srgb, var(--tp-acc) 12%, var(--tp-sunk)) 50%,
    var(--tp-sunk) 75%) 0 0/220% 100%;
  animation:tpShimmer 1.1s linear infinite;
}
.tp-cart-empty,
.tp-cart .tp-empty{
  padding:var(--s6) var(--s4);
  border:0; background:transparent;
}

/* دکمهٔ ادامه — تنها اقدامِ طلاییِ صفحه */
.tp-go{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
  width:100%;
  min-height:56px;
  margin-block-start:var(--s4);
  padding:var(--s3) var(--s6);
  background:linear-gradient(135deg,var(--gold),var(--gold-400));
  border:2px solid transparent;
  border-radius:var(--r-sm);
  color:var(--g-900);
  font-family:inherit; font-size:16.5px; font-weight:900; line-height:1.2;
  text-decoration:none; white-space:nowrap;
  cursor:pointer;
  box-shadow:var(--e2);
  transition:box-shadow var(--t), transform var(--t), filter var(--t);
}
.tp-go:hover{ box-shadow:var(--e4); transform:translateY(-2px); }
.tp-go:focus-visible{ outline:3px solid var(--tp-acc); outline-offset:3px; }
.tp-go:active{ transform:translateY(1px); box-shadow:var(--e1); }
.tp-go[disabled],
.tp-go[aria-disabled="true"]{
  background:var(--tp-sunk);
  color:var(--tp-faint);
  border-color:var(--tp-line);
  box-shadow:none; transform:none;
  cursor:not-allowed;
}
.tp-go.is-loading,
.tp-go[aria-busy="true"],
.tp-go[data-loading]{
  color:transparent; pointer-events:none; transform:none;
}
.tp-go.is-loading::after,
.tp-go[aria-busy="true"]::after,
.tp-go[data-loading]::after{
  content:'';
  position:absolute; inset-block-start:calc(50% - 11px); inset-inline-start:calc(50% - 11px);
  width:22px; height:22px;
  border:2.5px solid color-mix(in srgb, var(--g-900) 30%, transparent);
  border-block-start-color:var(--g-900);
  border-radius:50%;
  animation:tpSpin .7s linear infinite;
}

/* ───────── ۱۱) کنترل‌های مشترک ───────── */
.tp-btn,
.tp-btn-ghost{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
  min-height:44px;
  padding:var(--s2) var(--s5);
  border-radius:var(--r-sm);
  border:1.5px solid transparent;
  font-family:inherit; font-size:14.5px; font-weight:800; line-height:1.2;
  text-decoration:none; white-space:nowrap;
  cursor:pointer;
  transition:background var(--t), border-color var(--t), color var(--t), box-shadow var(--t), transform var(--t);
}
.tp-btn{
  background:var(--tp-acc);
  color:var(--tp-acc-on);
  box-shadow:var(--e1);
}
.tp-btn:hover{ background:var(--tp-acc-2); box-shadow:var(--e2); }
.tp-btn:active{ transform:translateY(1px); box-shadow:none; }
.tp-btn:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.tp-btn[disabled],
.tp-btn[aria-disabled="true"]{
  background:var(--tp-sunk); color:var(--tp-faint);
  border-color:var(--tp-line); box-shadow:none; transform:none; cursor:not-allowed;
}
.tp-btn-ghost{
  background:transparent;
  border-color:var(--tp-line-2);
  color:var(--tp-dim);
}
.tp-btn-ghost:hover{
  background:var(--tp-sunk);
  border-color:var(--tp-acc);
  color:var(--tp-acc);
}
.tp-btn-ghost:active{ transform:translateY(1px); }
.tp-btn-ghost:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.tp-btn-ghost[disabled],
.tp-btn-ghost[aria-disabled="true"]{
  opacity:.45; cursor:not-allowed; transform:none;
  background:transparent; border-color:var(--tp-line); color:var(--tp-faint);
}
.tp-btn.is-loading,
.tp-btn[aria-busy="true"],
.tp-btn-ghost.is-loading,
.tp-btn-ghost[aria-busy="true"]{ position:relative; color:transparent; pointer-events:none; }
.tp-btn.is-loading::after,
.tp-btn[aria-busy="true"]::after,
.tp-btn-ghost.is-loading::after,
.tp-btn-ghost[aria-busy="true"]::after{
  content:'';
  position:absolute; inset-block-start:calc(50% - 9px); inset-inline-start:calc(50% - 9px);
  width:18px; height:18px;
  border:2px solid color-mix(in srgb, var(--tp-acc) 30%, transparent);
  border-block-start-color:var(--tp-acc);
  border-radius:50%;
  animation:tpSpin .7s linear infinite;
}

/* چیپ — برچسبِ کوچکِ اطلاعاتی یا فیلترِ برداشتنی */
.tp-chip{
  display:inline-flex; align-items:center; gap:var(--s2);
  min-height:32px;
  padding:0 var(--s3);
  background:var(--tp-soft);
  border:1px solid transparent;
  border-radius:var(--r-full);
  color:var(--tp-dim);
  font-family:inherit; font-size:12.5px; font-weight:800;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  text-decoration:none;
}
.tp-chip.on,
.tp-chip.is-on,
.tp-chip[aria-pressed="true"],
.tp-chip[data-on]{
  background:var(--tp-acc);
  color:var(--tp-acc-on);
}
button.tp-chip,
a.tp-chip{ cursor:pointer; transition:background var(--t), color var(--t), border-color var(--t); }
button.tp-chip:hover,
a.tp-chip:hover{ border-color:var(--tp-acc); color:var(--tp-acc); }
button.tp-chip:focus-visible,
a.tp-chip:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.tp-chip.tp-chip-gold{ background:var(--gold-100); color:var(--gold-700); }
.tp-chip.tp-chip-ok{ background:var(--tp-ok-bg); color:var(--tp-ok); }
.tp-chip.tp-chip-err{ background:var(--tp-err-bg); color:var(--tp-err); }

/* شمارندهٔ نفرات */
.tp-pax{
  display:inline-flex; align-items:center; gap:var(--s1);
  padding:4px;
  background:var(--tp-surface);
  border:1.5px solid var(--tp-line-2);
  border-radius:var(--r-full);
}
.tp-pax button{
  flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px;
  padding:0;
  background:var(--tp-sunk);
  border:0; border-radius:50%;
  color:var(--tp-acc);
  font-family:inherit; font-size:19px; font-weight:900; line-height:1;
  cursor:pointer;
  transition:background var(--t), color var(--t), transform var(--t);
}
.tp-pax button:hover{ background:var(--tp-acc); color:var(--tp-acc-on); }
.tp-pax button:active{ transform:scale(.92); }
.tp-pax button:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.tp-pax button[disabled],
.tp-pax button[aria-disabled="true"]{
  opacity:.4; cursor:not-allowed; background:var(--tp-sunk); color:var(--tp-faint); transform:none;
}
.tp-pax input,
.tp-pax output,
.tp-pax .tp-num{
  width:60px; min-width:60px; min-height:40px;
  padding:0;
  background:transparent;
  border:0;
  color:var(--tp-ink);
  font-family:inherit; font-size:16px; font-weight:900;
  font-variant-numeric:tabular-nums;
  text-align:center;
  display:inline-flex; align-items:center; justify-content:center;
}
.tp-pax input:focus{ outline:none; box-shadow:none; }
.tp-pax:focus-within{ border-color:var(--tp-acc); box-shadow:0 0 0 4px var(--tp-acc-ring); }
.tp-pax input::-webkit-outer-spin-button,
.tp-pax input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tp-pax input[type="number"]{ -moz-appearance:textfield; appearance:textfield; }

/* ساعت — چه input[type=time] باشد، چه select، چه دکمه */
.tp-time{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s1);
  width:auto; min-width:96px; min-height:44px;
  padding:0 var(--s3);
  background:var(--tp-surface);
  border:1.5px solid var(--tp-line-2);
  border-radius:var(--r-sm);
  color:var(--tp-ink);
  font-family:inherit; font-size:15px; font-weight:800;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  text-align:center;
  cursor:pointer;
  unicode-bidi:isolate;
  transition:border-color var(--t), box-shadow var(--t), background var(--t);
}
select.tp-time{ padding-inline:var(--s3) var(--s5); }
.tp-time:hover{ border-color:var(--tp-acc); background:var(--tp-sunk); }
.tp-time:focus,
.tp-time:focus-visible{
  outline:none;
  border-color:var(--tp-acc);
  box-shadow:0 0 0 4px var(--tp-acc-ring);
}
.tp-time[disabled],
.tp-time[aria-disabled="true"]{
  background:var(--tp-sunk); color:var(--tp-faint);
  border-color:var(--tp-line); cursor:not-allowed;
}
.tp-time::-webkit-calendar-picker-indicator{ opacity:.55; cursor:pointer; }
.tp-time::-webkit-calendar-picker-indicator:hover{ opacity:1; }

/* ───────── ۱۲) تقویم ───────── */
.tp-cal{
  position:absolute; z-index:970;
  inset-block-start:calc(100% + var(--s2));
  inset-inline-start:0;
  min-width:280px;
  padding:var(--s3);
  background:var(--tp-surface);
  border:1px solid var(--tp-line);
  border-radius:var(--r);
  box-shadow:var(--e4);
  animation:tpDrop .18s var(--ease) both;
}
.tp-cal.tp-cal-static,
.tp-cal[data-static]{ position:static; box-shadow:none; animation:none; }
.tp-cal-head,
.tp-cal > header{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s2);
  margin-block-end:var(--s3);
}
.tp-cal-head b,
.tp-cal-head strong,
.tp-cal-title{
  color:var(--tp-ink);
  font-size:15px; font-weight:900;
  font-variant-numeric:tabular-nums;
}
.tp-cal-head button,
.tp-cal-nav{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; min-height:36px;
  padding:0;
  background:var(--tp-surface);
  border:1px solid var(--tp-line-2);
  border-radius:var(--r-sm);
  color:var(--tp-acc);
  font-family:inherit; font-size:18px; line-height:1;
  cursor:pointer;
  transition:background var(--t), border-color var(--t);
}
.tp-cal-head button:hover,
.tp-cal-nav:hover{ background:var(--tp-acc-soft); border-color:var(--tp-acc); }
.tp-cal-head button:focus-visible,
.tp-cal-nav:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.tp-cal-dows{
  display:grid; grid-template-columns:repeat(7,1fr); gap:2px;
  margin-block-end:var(--s2);
}
.tp-cal-dows > *{
  color:var(--tp-dim);
  font-size:11.5px; font-weight:800; font-style:normal;
  text-align:center;
}
.tp-cal-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:3px;
}
.tp-cal-cell{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:40px; min-width:0;
  padding:0;
  background:transparent;
  border:1px solid transparent;
  border-radius:var(--r-xs);
  color:var(--tp-ink);
  font-family:inherit; font-size:14px; font-weight:700;
  font-variant-numeric:tabular-nums;
  cursor:pointer;
  transition:background var(--t), color var(--t), border-color var(--t);
}
.tp-cal-cell:hover{ background:var(--tp-acc-soft); }
.tp-cal-cell:focus-visible{ outline:3px solid var(--gold); outline-offset:-1px; }
.tp-cal-cell.today,
.tp-cal-cell.is-today,
.tp-cal-cell[data-today]{ border-color:var(--tp-acc); font-weight:900; }
.tp-cal-cell.on,
.tp-cal-cell.is-on,
.tp-cal-cell.sel,
.tp-cal-cell[aria-selected="true"],
.tp-cal-cell[data-on]{
  background:var(--tp-acc);
  color:var(--tp-acc-on);
  border-color:var(--tp-acc);
  font-weight:900;
}
/* روزی که قبلاً در برنامه هست — نقطهٔ طلایی زیرش */
.tp-cal-cell.has,
.tp-cal-cell.is-used,
.tp-cal-cell[data-used]{ position:relative; font-weight:900; }
.tp-cal-cell.has::after,
.tp-cal-cell.is-used::after,
.tp-cal-cell[data-used]::after{
  content:'';
  position:absolute; inset-block-end:5px; inset-inline-start:calc(50% - 2.5px);
  width:5px; height:5px; border-radius:50%;
  background:var(--gold);
}
.tp-cal-cell.out,
.tp-cal-cell.is-out,
.tp-cal-cell.muted{ color:var(--tp-faint); font-weight:600; }
.tp-cal-cell[disabled],
.tp-cal-cell[aria-disabled="true"]{
  color:var(--tp-faint); opacity:.4; cursor:not-allowed; background:transparent;
}
.tp-cal-foot{
  display:flex; gap:var(--s2);
  margin-block-start:var(--s3);
  padding-block-start:var(--s3);
  border-block-start:1px solid var(--tp-line);
}
.tp-cal-foot button{ flex:1; min-height:38px; }

/* تقویمِ آمادهٔ سایت (KGDate) وقتی داخلِ برنامه‌ریز باز می‌شود:
   همان هندسه و همان هدفِ لمسِ ۴۰px — بدونِ دست‌زدن به jdate.js */
.tp-wrap .kgd-pop{
  z-index:970;
  min-width:284px;
  border-radius:var(--r);
  box-shadow:var(--e4);
}
.tp-wrap .kgd-d{ min-height:40px; border-radius:var(--r-xs); }
.tp-wrap .kgd-d:hover{ background:var(--tp-acc-soft); }
.tp-wrap .kgd-d.on{ background:var(--tp-acc); color:var(--tp-acc-on); }
.tp-wrap .kgd-nav{ min-height:36px; border-color:var(--tp-line-2); color:var(--tp-acc); }
.tp-wrap .kgd-nav:hover{ background:var(--tp-acc-soft); }
.tp-wrap .kgd-foot button{ min-height:38px; border-color:var(--tp-line-2); color:var(--tp-acc); }

/* ───────── ۱۳) پیام‌ها و اسکلتِ بارگذاری ───────── */
.tp-wrap .tp-msg,
.tp-wrap .tp-err{
  display:flex; align-items:flex-start; gap:var(--s2);
  padding:var(--s3) var(--s4);
  border-radius:var(--r-sm);
  font-size:14px; font-weight:700; line-height:1.9;
}
.tp-wrap .tp-err{ background:var(--tp-err-bg); color:var(--tp-err); }
.tp-wrap .tp-ok{ background:var(--tp-ok-bg); color:var(--tp-ok); }
.tp-skel{
  min-height:14px;
  border-radius:var(--r-xs);
  background:linear-gradient(90deg,
    var(--tp-sunk) 25%,
    color-mix(in srgb, var(--tp-acc) 10%, var(--tp-sunk)) 50%,
    var(--tp-sunk) 75%) 0 0/220% 100%;
  animation:tpShimmer 1.1s linear infinite;
  color:transparent; user-select:none;
}
.tp-wrap.is-loading,
.tp-wrap[aria-busy="true"]{ cursor:progress; }

/* ───────── ۱۴) حرکت ───────── */
@keyframes tpIn{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:none; }
}
@keyframes tpOut{
  from{ opacity:1; transform:none; }
  to{ opacity:0; transform:translateY(-4px) scale(.985); }
}
@keyframes tpDrop{
  from{ opacity:0; transform:translateY(-8px); }
  to{ opacity:1; transform:none; }
}
@keyframes tpSpin{ to{ transform:rotate(360deg); } }
@keyframes tpShimmer{ to{ background-position:-220% 0; } }
@keyframes tpUp{
  from{ opacity:0; transform:translateY(100%); }
  to{ opacity:1; transform:none; }
}

@media (prefers-reduced-motion: reduce){
  .tp-day,
  .tp-move,
  .tp-cart-line,
  .tp-sug,
  .tp-cal{ animation:none !important; }
  .tp-day.is-out,
  .tp-move.is-out,
  .tp-move[data-out],
  .tp-day[data-out]{ animation:none !important; opacity:0; }
  .tp-skel,
  .tp-cart.is-loading .tp-cart-total > :last-child{ animation:none !important; }
  .tp-go:hover,
  .tp-btn:active,
  .tp-btn-ghost:active,
  .tp-add-day:active,
  .tp-move-del:active,
  .tp-pax button:active{ transform:none; }
}

/* ───────── ۱۵) پاسخ‌گویی ───────── */

/* ‏≥۱۴۴۰px — ستونِ فاکتور پهن‌تر، هوای بیشتر */
@media (min-width:1440px){
  .tp-wrap{ --tp-aside:412px; }
}

/* ۱۰۲۴ تا ۱۲۸۰ — ستونِ فاکتور جمع‌تر */
@media (max-width:1280px){
  .tp-wrap{ --tp-aside:330px; }
}

/* زیر ۱۰۲۴ — فاکتور از ستونِ کناری به نوارِ پایین تبدیل می‌شود */
@media (max-width:1023px){
  .tp-cart{
    position:fixed;
    inset-inline:0;
    inset-block-end:0;
    inset-block-start:auto;
    z-index:895;                 /* بالای نوارِ .kg-bar سایت (۸۸۰) */
    max-height:none;
    overflow:visible;
    gap:0;
    padding:var(--s3) clamp(var(--s3),4vw,var(--s6));
    padding-block-end:calc(var(--s3) + env(safe-area-inset-bottom));
    border:0;
    border-block-start:1px solid var(--tp-line);
    border-radius:var(--r-lg) var(--r-lg) 0 0;
    box-shadow:0 -14px 34px -16px color-mix(in srgb, var(--g-900) 36%, transparent);
    animation:tpUp .26s var(--ease) both;
  }
  /* دستگیرهٔ کشیدن — می‌گوید این نوار باز می‌شود */
  .tp-cart::before{
    content:'';
    display:block;
    width:44px; height:4px;
    margin:0 auto var(--s2);
    border-radius:var(--r-full);
    background:var(--tp-line-2);
    opacity:.7;
  }
  /* جمعِ نهایی و دکمه بالا می‌آیند؛ ریزه‌کاری زیرشان */
  .tp-cart > h3,
  .tp-cart > h4,
  .tp-cart > .tp-cart-h{ display:none; }
  .tp-cart-total{
    order:-2;
    margin:0; padding:0; border:0;
    font-size:13.5px;
  }
  .tp-cart-total > :last-child,
  .tp-cart-total b,
  .tp-cart-total strong{ font-size:clamp(20px,5.4vw,24px); }
  .tp-go{ order:-1; margin-block-start:var(--s2); min-height:52px; }
  /* ریزفاکتور پیش‌فرض بسته است — نوار نباید نصفِ صفحه را بخورد */
  .tp-cart-line,
  .tp-cart-disc,
  .tp-cart .tp-empty{ display:none; }
  .tp-cart.is-open,
  .tp-cart.tp-open,
  .tp-cart[data-open],
  .tp-cart[open]{
    max-height:min(74vh,560px);
    overflow-y:auto;
    overscroll-behavior:contain;
    gap:var(--s1);
    padding-block-start:var(--s4);
  }
  .tp-cart.is-open .tp-cart-line,
  .tp-cart.tp-open .tp-cart-line,
  .tp-cart[data-open] .tp-cart-line,
  .tp-cart[open] .tp-cart-line{ display:flex; }
  .tp-cart.is-open .tp-cart-disc,
  .tp-cart.tp-open .tp-cart-disc,
  .tp-cart[data-open] .tp-cart-disc,
  .tp-cart[open] .tp-cart-disc{ display:flex; }
  .tp-cart.is-open .tp-cart-total,
  .tp-cart.tp-open .tp-cart-total,
  .tp-cart[data-open] .tp-cart-total,
  .tp-cart[open] .tp-cart-total{
    margin-block-start:var(--s3);
    padding-block-start:var(--s3);
    border-block-start:2px solid var(--tp-line);
  }
  /* دو نوارِ چسبان روی هم نمی‌نشیند */
  body:has(.tp-cart) .kg-bar{ display:none; }
  body:has(.tp-cart){ padding-block-end:calc(var(--tp-bar) + env(safe-area-inset-bottom)); }
  .tp-wrap{ padding-block-end:var(--s6); }
}

/* ≤۶۴۰px — کارتِ روز جمع‌وجورتر */
@media (max-width:640px){
  .tp-wrap{
    --tp-rail:22px;
    padding:var(--s4);
    border-radius:var(--r-lg);
  }
  .tp-day-head{ gap:var(--s2) var(--s3); padding:var(--s4); }
  .tp-day-date{ flex:1 1 100%; font-size:18px; }
  .tp-day-head .tp-day-greg{ margin-inline-start:0; }
  .tp-moves{
    padding:var(--s4);
    padding-inline-start:calc(var(--s4) + var(--tp-rail));
    gap:var(--s1);
  }
  .tp-moves::before{
    inset-block:calc(var(--s4) + 26px) calc(var(--s4) + 26px);
    inset-inline-start:calc(var(--s4) + var(--tp-rail) / 2 - 1px);
  }
  /* .tp-move::before فرمولش مستقل از padding است و همین‌جا هم درست می‌ماند */
  .tp-move{ padding:var(--s2) var(--s3); gap:var(--s2) var(--s3); }
  .tp-move-route{ flex:1 1 100%; order:2; }
  .tp-move-time{ order:1; min-width:70px; }
  .tp-move-del{ order:1; margin-inline-start:auto; }
  .tp-move-price{ order:3; margin-inline-start:auto; }
  .tp-day .tp-add-day{ margin-inline:var(--s4); }
  .tp-search-input,
  .tp-search > input[type="text"],
  .tp-search > input[type="search"]{ min-height:54px; font-size:16px; }
  .tp-search::before{ inset-block-start:16px; }
  .tp-search::after{ inset-block-start:30px; }
}

/* ≤۳۶۰px — گوشی‌های باریک، هیچ چیزی نباید سرریز کند */
@media (max-width:360px){
  .tp-wrap{ --tp-notch:7px; padding:var(--s3); }
  .tp-day-badge{ min-width:56px; min-height:34px; padding-inline:var(--s3); font-size:13px; }
  .tp-day-date{ font-size:16.5px; }
  .tp-move-time{ min-width:64px; font-size:15px; }
  .tp-move-route{ font-size:14.5px; }
  .tp-pax input,
  .tp-pax output,
  .tp-pax .tp-num{ width:48px; min-width:48px; }
  .tp-cal-cell{ min-height:36px; font-size:13px; }
}

/* ≤۴۴۰px — کارت‌های وسیله باریک‌تر */
@media (max-width:440px){
  .tp-veh{ grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); }
}

/* ───────── ۱۶) چاپِ برنامه — زائر کاغذش را می‌خواهد ───────── */
@media print{
  .tp-wrap{
    --tp-page:#fff; --tp-surface:#fff;
    display:block;
    max-width:none; padding:0;
    background:#fff; border:0; box-shadow:none;
  }
  .tp-search,.tp-sug,.tp-veh,.tp-add-day,.tp-go,.tp-move-del,.tp-cal,.tp-wrap .kgd-pop{ display:none !important; }
  .tp-head{ background:#fff; color:#000; padding:0 0 12pt; border-block-end:1pt solid #000; }
  .tp-head::before{ display:none; }
  .tp-head h1,.tp-head h2,.tp-head h3,.tp-head p{ color:#000; }
  .tp-day{ break-inside:avoid; box-shadow:none; border:1pt solid #000; margin-block-end:10pt; animation:none; }
  .tp-day-head{ background:#fff; }
  .tp-day-head::before,.tp-day-head::after{ display:none; }
  .tp-cart{ position:static; max-height:none; box-shadow:none; border:1pt solid #000; }
  .tp-move{ animation:none; }
}

/* ───────── ۱۷) حالتِ کنتراستِ اجباریِ ویندوز ───────── */
@media (forced-colors: active){
  .tp-day,
  .tp-move,
  .tp-cart,
  .tp-sug,
  .tp-cal,
  .tp-veh-card,
  .tp-empty{ border:1px solid CanvasText; }
  .tp-day::before,
  .tp-moves::before,
  .tp-empty::before{ forced-color-adjust:none; background:CanvasText; }
  .tp-day-badge,
  .tp-move-time,
  .tp-chip.on,
  .tp-btn{ border:1px solid CanvasText; }
  .tp-veh-card.on,
  .tp-veh-card[aria-checked="true"],
  .tp-veh-card:has(input:checked),
  .tp-cal-cell.on,
  .tp-cal-cell[aria-selected="true"]{ border:2px solid Highlight; }
  .tp-move-del{ opacity:1; }
}

/* ============================================================
   تکملهٔ برنامه‌ریزِ tp- — سخت‌سازی و نام‌های هم‌خانواده
   ------------------------------------------------------------
   سیستمِ اصلیِ tp- بالاتر است و دست نخورده مانده. این تکمله
   فقط چهار کار می‌کند:
     ۱) رفعِ یک نقصِ واقعی: --tp-bar در body مصرف می‌شد ولی فقط
        روی .tp-wrap تعریف شده بود؛ متغیرِ حل‌نشده یعنی جاگذاریِ
        زیرِ نوارِ ثابتِ موبایل صفر می‌شد و انتهای صفحه پشتِ
        فاکتورِ چسبیده پنهان می‌ماند.
     ۲) پوششِ نام‌هایی که سازندهٔ JS ممکن است به‌جای نام‌های
        اصلی به کار ببرد: tp-add-move/tp-move-add/tp-day-add،
        tp-day-del، tp-search-clear، tp-sug-empty/tp-sug-h،
        tp-cart-day/tp-cart-sub.
     ۳) سخت‌سازیِ عنصر-به-عنصر: تاریخِ روز اگر دکمه رندر شد،
        آیکنِ وسیله اگر خالی ماند، فونتِ فرم‌ها در همهٔ مرورگرها.
     ۴) ریزحالت‌های جامانده: activeِ سلولِ تقویم، disabledِ چیپ،
        نقطهٔ راهنمای گونهٔ tp-on در پیشنهادها.
   همهٔ رنگ‌ها از توکن‌های خودِ tp- می‌آیند؛ رنگِ خامِ تازه: صفر.
   ============================================================ */

/* ── فونتِ فرم‌ها: هیچ کنترلی با فونتِ سیستمی رندر نشود ── */
.tp-wrap button,
.tp-wrap input,
.tp-wrap select,
.tp-wrap textarea,
.tp-wrap output{ font-family:inherit; }

/* ── تاریخِ روز اگر دکمه بود (بازکنندهٔ تقویم) — همان ظاهرِ متن،
      فقط با نشانهٔ تعامل ── */
button.tp-day-date,
button.tp-day-greg{
  background:transparent;
  border:0; padding:0; margin:0;
  font-family:inherit;
  text-align:start;
  cursor:pointer;
  border-radius:var(--r-xs);
  transition:color var(--t);
}
button.tp-day-date:hover,
button.tp-day-greg:hover{ color:var(--tp-acc); }
button.tp-day-date:focus-visible,
button.tp-day-greg:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; }

/* ── آیکنِ خالی هرگز به‌شکلِ حفرهٔ سفید رندر نشود ── */
.tp-veh-card .tp-veh-i:empty,
.tp-veh-card .tp-ico:empty,
.tp-move .tp-ico:empty{ display:none; }

/* ── «افزودنِ حرکت» با هر نامی — همان گرامرِ خط‌چینِ tp-add-day ── */
.tp-add-move,
.tp-move-add,
.tp-day-add{
  display:flex; align-items:center; justify-content:center; gap:var(--s2);
  width:auto; min-height:48px;
  padding:var(--s2) var(--s5);
  background:transparent;
  border:2px dashed var(--tp-line-2);
  border-radius:var(--r);
  color:var(--tp-acc);
  font-family:inherit; font-size:14px; font-weight:800; line-height:1.2;
  cursor:pointer;
  transition:border-color var(--t), background var(--t), color var(--t), transform var(--t);
}
.tp-add-move:not(:has(svg)):not(:has(img)):not(:has(i))::before,
.tp-move-add:not(:has(svg)):not(:has(img)):not(:has(i))::before,
.tp-day-add:not(:has(svg)):not(:has(img)):not(:has(i))::before{
  content:'';
  flex:none;
  width:18px; height:18px;
  background:
    linear-gradient(currentColor,currentColor) center/2.5px 100% no-repeat,
    linear-gradient(currentColor,currentColor) center/100% 2.5px no-repeat;
}
.tp-add-move:hover,
.tp-move-add:hover,
.tp-day-add:hover{
  background:var(--tp-acc-soft);
  border-color:var(--tp-acc);
  border-style:solid;
}
.tp-add-move:focus-visible,
.tp-move-add:focus-visible,
.tp-day-add:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; }
.tp-add-move:active,
.tp-move-add:active,
.tp-day-add:active{ transform:translateY(1px); }
.tp-add-move[disabled],
.tp-move-add[disabled],
.tp-day-add[disabled],
.tp-add-move[aria-disabled="true"],
.tp-move-add[aria-disabled="true"],
.tp-day-add[aria-disabled="true"]{
  opacity:.45; cursor:not-allowed;
  background:transparent; border-color:var(--tp-line); color:var(--tp-faint);
  transform:none;
}
/* داخلِ کارتِ روز: همان جای دکمهٔ اصلی */
.tp-day .tp-add-move,
.tp-day .tp-move-add{ margin:0 clamp(var(--s5),2.4vw,var(--s8)) var(--s5); }
.tp-day .tp-moves + .tp-add-move,
.tp-day .tp-moves + .tp-move-add{ margin-block-start:calc(var(--s5) * -1 + var(--s2)); }
/* در سطحِ برنامه: هم‌قدِ tp-add-day */
.tp-wrap > .tp-day-add,
.tp-days + .tp-day-add{
  grid-column:1;
  width:100%; min-height:64px;
  border-radius:var(--r-lg);
  font-size:15.5px;
}

/* ── حذفِ روز / پاک‌کردنِ جست‌وجو — همان گرامرِ دایره‌ایِ tp-move-del ── */
.tp-day-del,
.tp-search-clear,
.tp-search .tp-clear{
  flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px;
  padding:0;
  background:transparent;
  border:1px solid transparent;
  border-radius:50%;
  color:var(--tp-faint);
  font-family:inherit; font-size:18px; line-height:1;
  cursor:pointer;
  transition:background var(--t), color var(--t), border-color var(--t), transform var(--t);
}
.tp-day-head .tp-day-del{ margin-inline-start:auto; }
.tp-day-del:hover,
.tp-search-clear:hover,
.tp-search .tp-clear:hover{
  background:var(--tp-err-bg);
  border-color:color-mix(in srgb, var(--tp-err) 35%, transparent);
  color:var(--tp-err);
}
.tp-day-del:focus-visible,
.tp-search-clear:focus-visible,
.tp-search .tp-clear:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.tp-day-del:active,
.tp-search-clear:active,
.tp-search .tp-clear:active{ transform:scale(.92); }
.tp-day-del:empty,
.tp-search-clear:empty,
.tp-search .tp-clear:empty{ position:relative; }
.tp-day-del:empty::before,
.tp-day-del:empty::after,
.tp-search-clear:empty::before,
.tp-search-clear:empty::after,
.tp-search .tp-clear:empty::before,
.tp-search .tp-clear:empty::after{
  content:'';
  position:absolute;
  inset-block-start:calc(50% - 1px);
  inset-inline-start:calc(50% - 7.5px);
  width:15px; height:2px;
  background:currentColor;
  border-radius:2px;
}
.tp-day-del:empty::before,
.tp-search-clear:empty::before,
.tp-search .tp-clear:empty::before{ transform:rotate(45deg); }
.tp-day-del:empty::after,
.tp-search-clear:empty::after,
.tp-search .tp-clear:empty::after{ transform:rotate(-45deg); }
/* پاک‌کن داخلِ کادرِ جست‌وجو: وسطِ ارتفاعِ ۶۰px، سمتِ پایانی */
.tp-search-clear,
.tp-search .tp-clear{
  position:absolute; z-index:2;
  inset-inline-end:var(--s3);
  inset-block-start:11px;
}
.tp-search:has(.tp-search-clear) .tp-search-input,
.tp-search:has(.tp-clear) .tp-search-input{ padding-inline-end:calc(var(--s4) + 40px); }

/* ── پیشنهادها: سطرِ «چیزی پیدا نشد» و سرگروه ── */
.tp-sug-empty,
.tp-sug-none,
.tp-sug-item.is-empty,
.tp-sug-item[data-empty]{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--s1);
  min-height:64px;
  padding:var(--s4);
  color:var(--tp-dim);
  font-size:14px; font-weight:700; line-height:1.9;
  text-align:center;
  cursor:default;
}
.tp-sug-item.is-empty::before,
.tp-sug-item[data-empty]::before{ content:none; }
.tp-sug-item.is-empty:hover,
.tp-sug-item[data-empty]:hover{ background:transparent; }
.tp-sug-empty small,
.tp-sug-none small{ color:var(--tp-faint); font-size:12.5px; font-weight:600; }
.tp-sug-h{
  margin:0;
  padding:var(--s2) var(--s3) 0;
  color:var(--tp-faint);
  font-size:11.5px; font-weight:800; letter-spacing:.5px;
}

/* ── فاکتور: سرگروهِ روز و سطرِ جمعِ میانی ── */
.tp-cart-day{
  display:flex; align-items:center; gap:var(--s2);
  margin-block-start:var(--s3);
  color:var(--tp-ink);
  font-size:12.5px; font-weight:900; letter-spacing:.3px;
  font-variant-numeric:tabular-nums;
}
.tp-cart-day::after{ content:''; flex:1; height:1px; background:var(--tp-line); }
.tp-cart-day:first-of-type{ margin-block-start:0; }
.tp-cart-sub{
  display:flex; align-items:baseline; gap:var(--s3);
  margin-block-start:var(--s2);
  padding-block:var(--s2);
  border-block-start:1px solid var(--tp-line);
  color:var(--tp-dim);
  font-size:13.5px; font-weight:800;
  line-height:1.8;
}
.tp-cart-sub > :last-child,
.tp-cart-sub b,
.tp-cart-sub strong{
  margin-inline-start:auto;
  color:var(--tp-ink);
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  white-space:nowrap;
  unicode-bidi:isolate;
}

/* ── ریزحالت‌های جامانده ── */
.tp-cal-cell:not([disabled]):not([aria-disabled="true"]):active{
  background:color-mix(in srgb, var(--tp-acc) 24%, var(--tp-surface));
}
.tp-chip[disabled],
.tp-chip[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; }
.tp-sug-item.tp-on::before,
.tp-sug-item[data-on]::before{
  background:var(--tp-acc);
  box-shadow:0 0 0 4px var(--tp-acc-ring);
}
/* عددی که در حالِ تازه‌شدن است — JS فقط کلاس می‌گذارد و برمی‌دارد */
.tp-cart-total > :last-child,
.tp-move-price{ transition:opacity var(--t); }
.tp-wrap .is-updating{ opacity:.4; }

/* ── موبایل ── */
@media (max-width:1023px){
  /* رفعِ نقص: متغیر روی خودِ body تعریف می‌شود تا حل شود.
     ۱۲۸px = دستگیره + سطرِ جمع + دکمهٔ ادامه + پدینگ‌های نوارِ بسته */
  body:has(.tp-cart){ --tp-bar:128px; }
  .tp-wrap > .tp-day-add{ grid-column:1 / -1; }
  /* در نوارِ بستهٔ پایین فقط جمع و دکمه؛ ریزه‌کاری با بازشدن می‌آید */
  .tp-cart-day,
  .tp-cart-sub{ display:none; }
  .tp-cart.is-open .tp-cart-day,
  .tp-cart.tp-open .tp-cart-day,
  .tp-cart[data-open] .tp-cart-day,
  .tp-cart[open] .tp-cart-day{ display:flex; }
  .tp-cart.is-open .tp-cart-sub,
  .tp-cart.tp-open .tp-cart-sub,
  .tp-cart[data-open] .tp-cart-sub,
  .tp-cart[open] .tp-cart-sub{ display:flex; }
}
@media (max-width:640px){
  .tp-search-clear,
  .tp-search .tp-clear{ inset-block-start:8px; }
  .tp-day .tp-add-move,
  .tp-day .tp-move-add{ margin-inline:var(--s4); }
}

/* ── حرکت، چاپ، کنتراستِ اجباری ── */
@media (prefers-reduced-motion: reduce){
  .tp-day-del:active,
  .tp-search-clear:active,
  .tp-search .tp-clear:active,
  .tp-add-move:active,
  .tp-move-add:active,
  .tp-day-add:active{ transform:none; }
}
@media print{
  .tp-add-move,.tp-move-add,.tp-day-add,
  .tp-day-del,.tp-search-clear,.tp-search .tp-clear{ display:none !important; }
}
@media (forced-colors: active){
  .tp-add-move,.tp-move-add,.tp-day-add,
  .tp-day-del,.tp-search-clear{ border:1px solid CanvasText; }
  .tp-cart-day::after{ background:CanvasText; }
}

/* ════════════════════════════════════════════════════════════
   برنامه‌ریزِ سفر — لایهٔ تکمیلی برای کلاس‌هایی که JSِ نهایی می‌سازد
   ------------------------------------------------------------
   چرا این لایه هست: استایلِ پایهٔ tp- پیش از قطعی‌شدنِ مارک‌آپِ نهاییِ
   ویجت نوشته شده بود و ~۴۵ کلاسِ واقعیِ خروجی را نداشت؛ از جمله
   .tp-aside که فرزندِ مستقیمِ گرید است (استایلِ قدیمی .tp-cart را
   مستقیم در گرید فرض می‌کرد و ستون‌بندی می‌شکست). همه‌چیز فقط با
   توکن‌های خودِ tp-wrap — هیچ رنگِ خامی این‌جا نیست.
   ════════════════════════════════════════════════════════════ */

/* ── ریشه و حالت‌های آغاز ── */
.tp{ position:relative; }
.tp-boot,
.tp-fail{
  display:flex; align-items:center; justify-content:center; gap:var(--s3);
  min-height:180px; padding:var(--s6);
  background:var(--paper-2); border:1px solid var(--line); border-radius:var(--r-xl);
  color:var(--ink-2); font-weight:700;
}
.tp-boot::before{
  content:""; width:22px; height:22px; border-radius:50%;
  border:3px solid var(--line); border-top-color:var(--g-600);
  animation:tpSpin 0.9s linear infinite;
}
@keyframes tpSpin{ to{ transform:rotate(360deg); } }
.tp-fail{ color:var(--err); }

/* پیامِ زندهٔ صفحه‌خوان — دیده نمی‌شود ولی خوانده می‌شود */
.tp-live{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ── گام‌ها ── */
.tp-sec{ margin-block-end:clamp(var(--s6),4vw,var(--s8)); }
.tp-sec:last-child{ margin-block-end:0; }
.tp-sec-h{
  display:flex; align-items:flex-start; gap:var(--s3);
  margin-block-end:var(--s4);
}
.tp-sec-t{ margin:0; font-size:clamp(17px,2vw,20px); font-weight:800; color:var(--tp-ink); }
.tp-sec-s{ margin:4px 0 0; font-size:13.5px; line-height:1.9; color:var(--tp-faint); }

/* ── ستونِ فاکتور — فرزندِ واقعیِ گرید ── */
.tp-aside{ grid-column:2; min-width:0; }
.tp-aside .tp-cart{
  position:sticky; top:var(--tp-top);
  grid-column:auto;              /* قاعدهٔ قدیمیِ grid-column:2 دیگر معنا ندارد */
}
@media (max-width:1023px){
  .tp-aside{ grid-column:1 / -1; }
  .tp-aside .tp-cart{ position:static; }
}

/* ── وسیله: آیکن و نام ── */
.tp-veh-ic{
  display:block; width:34px; height:34px; margin-inline:auto; object-fit:contain;
}
span.tp-veh-ic:empty{ display:none; }
.tp-veh-t{ display:block; font-weight:800; font-size:14px; color:var(--tp-ink); }

/* ── جست‌وجو: نشانه و چیپِ مبدأ ── */
.tp-target{
  position:absolute; inset-inline-start:14px; inset-block-start:50%;
  translate:0 -50%;
  width:10px; height:10px; border-radius:50%;
  background:var(--tp-acc); box-shadow:0 0 0 4px var(--tp-acc-soft);
  pointer-events:none;
}
.tp-orig{ display:inline-flex; align-items:center; }
.tp-orig:empty{ display:none; }
.tp-orig-chip{
  display:inline-flex; align-items:center; gap:6px;
  margin-inline-start:var(--s7);
  max-width:46%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.tp-orig-x{
  display:inline-flex; align-items:center; justify-content:center;
  width:20px; height:20px; border:none; border-radius:50%;
  background:color-mix(in srgb, var(--tp-ink) 12%, transparent);
  color:inherit; font-size:12px; line-height:1; cursor:pointer;
}
.tp-orig-x:hover{ background:color-mix(in srgb, var(--tp-ink) 22%, transparent); }
.tp-orig-x:focus-visible{ outline:2px solid var(--tp-acc); outline-offset:2px; }

/* پیشنهادها: عنوان/متا/قیمتِ هر گزینه */
.tp-sug-t{ display:block; font-weight:700; font-size:14px; color:var(--tp-ink); }
.tp-sug-m{ display:block; font-size:12px; color:var(--tp-faint); margin-top:2px; }
.tp-sug-p{
  margin-inline-start:auto; font-weight:800; font-size:13.5px;
  color:var(--tp-acc); font-variant-numeric:tabular-nums; direction:ltr;
}

/* ── روز: ظرفِ تاریخ (لنگرِ تقویمِ شمسی) و متای حرکت ── */
.tp-day-when{ position:relative; display:inline-flex; flex-direction:column; gap:2px; min-width:0; }
.tp-move-meta{ font-size:12px; color:var(--tp-faint); }
.tp-dup{
  background:var(--tp-soft); color:var(--tp-dim);
  border:1px dashed var(--tp-line-2);
}

/* ── فاکتور: جزئیات ── */
.tp-cart-veh{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s2);
  width:100%; margin-block:var(--s2) var(--s3); padding:10px 14px;
  background:var(--tp-sunk); border:1px solid var(--tp-line); border-radius:var(--r);
  font-family:inherit; font-size:13.5px; color:var(--tp-ink); cursor:pointer;
  transition:border-color .15s ease;
}
.tp-cart-veh:hover{ border-color:var(--tp-acc); }
.tp-cart-veh:focus-visible{ outline:2px solid var(--tp-acc); outline-offset:2px; }
.tp-cart-veh b{ font-weight:800; }
.tp-cart-veh span{ color:var(--tp-faint); font-size:12px; }

.tp-cart-meta{ margin:0 0 var(--s3); font-size:12.5px; color:var(--tp-faint); }

.tp-cart-days{ display:grid; gap:var(--s3); margin-block-end:var(--s4); }
.tp-cart-day-t{
  font-size:12px; font-weight:800; color:var(--tp-dim);
  padding-block-end:4px; border-bottom:1px dashed var(--tp-perf);
}
.tp-cart-time{
  font-variant-numeric:tabular-nums; direction:ltr;
  font-size:12.5px; font-weight:800; color:var(--tp-acc);
  background:var(--tp-acc-soft); border-radius:6px; padding:1px 7px;
  flex:none;
}
.tp-cart-route{ flex:1; min-width:0; font-size:13px; color:var(--tp-ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tp-cart-p{
  font-variant-numeric:tabular-nums; direction:ltr; flex:none;
  font-size:13px; font-weight:700; color:var(--tp-dim);
}

.tp-cart-hint{ margin:var(--s2) 0 0; font-size:12px; line-height:1.9; color:var(--tp-faint); }
.tp-cart-note{
  margin:var(--s3) 0 0; padding:9px 12px; font-size:12.5px; line-height:1.9;
  background:var(--tp-ok-bg); color:var(--tp-ink);
  border:1px dashed color-mix(in srgb, var(--tp-ok) 45%, var(--tp-line));
  border-radius:var(--r);
}

.tp-cart-rows{ margin-block-start:var(--s4); border-top:1px solid var(--tp-line); padding-block-start:var(--s3); }
.tp-cart-row{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s2);
  font-size:13.5px; color:var(--tp-dim); padding-block:4px;
}
.tp-cart-row b, .tp-cart-row [dir=ltr]{ font-variant-numeric:tabular-nums; }
.tp-cart-rows.tp-busy{ opacity:.55; transition:opacity .15s ease; }

/* اسکلتِ به‌روزرسانیِ جمع */
.tp-skel-row{ position:relative; }
.tp-busy .tp-skel-row::after{
  content:""; position:absolute; inset:0; border-radius:var(--r);
  background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--tp-ink) 6%, transparent), transparent);
  background-size:200% 100%; animation:tpShimmer 1.1s linear infinite;
}
@keyframes tpShimmer{ from{ background-position:200% 0; } to{ background-position:-200% 0; } }

/* نفرات */
.tp-cart-pax{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--s2);
  margin-block-start:var(--s4); padding:10px 12px;
  background:var(--tp-sunk); border:1px solid var(--tp-line); border-radius:var(--r);
}
.tp-cart-pax-l{ font-size:13px; font-weight:700; color:var(--tp-ink); }
.tp-cart-paxhint{ flex-basis:100%; margin:6px 0 0; font-size:11.5px; color:var(--tp-faint); }
.tp-pax-b{
  width:32px; height:32px; border:1px solid var(--tp-line-2); border-radius:8px;
  background:var(--tp-surface); color:var(--tp-ink);
  font-family:inherit; font-size:17px; font-weight:800; line-height:1; cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.tp-pax-b:hover{ border-color:var(--tp-acc); background:var(--tp-acc-soft); }
.tp-pax-b:focus-visible{ outline:2px solid var(--tp-acc); outline-offset:2px; }
.tp-pax-b:disabled{ opacity:.4; cursor:not-allowed; }
.tp-pax-i{
  min-width:40px; text-align:center; font-weight:800; font-size:15px;
  font-variant-numeric:tabular-nums; color:var(--tp-ink);
}

.tp-go-s{ margin:var(--s2) 0 0; text-align:center; font-size:11.5px; color:var(--tp-faint); }

/* ── نوارِ پایینِ موبایل ── */
.tp-bar{
  position:fixed; inset-inline:0; inset-block-end:0; z-index:950;
  display:none; align-items:center; justify-content:space-between; gap:var(--s3);
  padding:12px clamp(var(--s3),4vw,var(--s6));
  padding-block-end:calc(12px + env(safe-area-inset-bottom, 0px));
  background:var(--tp-surface);
  border-top:1px solid var(--tp-line);
  box-shadow:0 -12px 30px -18px color-mix(in srgb, var(--tp-ink) 45%, transparent);
}
@media (max-width:1023px){
  .tp-bar:not([hidden]){ display:flex; }
  body:has(.tp-bar:not([hidden])){ padding-block-end:var(--tp-bar, 92px); }
}
.tp-bar-info{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.tp-bar-tot{ font-size:19px; font-weight:800; color:var(--tp-ink); font-variant-numeric:tabular-nums; }
.tp-bar-meta{ font-size:11.5px; color:var(--tp-faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tp-bar-go{ flex:none; margin:0; width:auto; padding:13px 26px; }

@media (prefers-reduced-motion: reduce){
  .tp-boot::before, .tp-busy .tp-skel-row::after{ animation:none; }
}

/* ════════════════════════════════════════════════════════════
   جعبهٔ جست‌وجوی صفحهٔ اصلی (js/hero-search.js)
   الگوی سایت‌های بزرگِ حمل‌ونقل: زبانه‌های خدمت + یک ردیفِ فرم + یک دکمه.
   هیچ رنگِ خامی — همه از متغیرهای سایت.
   ════════════════════════════════════════════════════════════ */

.hs-host{
  position:relative; z-index:20;
  max-width:1060px; margin-inline:auto;
  padding-inline:16px;
  margin-block-start:-58px;      /* روی لبهٔ پایینِ هیرو می‌نشیند */
}
@media(max-width:900px){ .hs-host{ margin-block-start:-28px; } }

.hs-boot{ height:96px; }

/* ── زبانه‌ها ── */
.hs-tabs{
  display:flex; gap:2px; overflow-x:auto; scrollbar-width:none;
  padding-inline:6px;
}
.hs-tabs::-webkit-scrollbar{ display:none; }
.hs-tab{
  display:inline-flex; align-items:center; gap:7px;
  flex:none; padding:11px 17px; border:none; cursor:pointer;
  border-radius:12px 12px 0 0;
  background:rgba(255,255,255,.82); color:#3d463f;
  font-family:inherit; font-size:13.5px; font-weight:700; white-space:nowrap;
  transition:background .18s, color .18s;
}
.hs-tab img{ opacity:.68; transition:opacity .18s; }
.hs-tab:hover{ background:rgba(255,255,255,.95); }
.hs-tab.on{ background:#fff; color:var(--green-deep,#8a6d16); }
.hs-tab.on img{ opacity:1; }
.hs-tab:focus-visible{ outline:2px solid var(--gold,#c9a227); outline-offset:-2px; }

/* ── کارتِ فرم ── */
.hs-card{
  background:#fff;
  border-radius:0 16px 16px 16px;
  box-shadow:0 22px 50px -24px rgba(11,61,46,.42), 0 2px 8px rgba(0,0,0,.06);
  padding:14px;
}
.hs-row{
  display:grid; gap:10px; align-items:end;
  grid-template-columns:1fr 38px 1fr 150px 92px 168px;
}
@media(max-width:1023px){
  .hs-row{ grid-template-columns:1fr 38px 1fr; }
  .hs-row .hs-date{ grid-column:1 / 3; }
  .hs-row .hs-pax{ grid-column:3; }
  .hs-row .hs-go{ grid-column:1 / -1; }
}
@media(max-width:560px){
  .hs-row{ grid-template-columns:1fr 1fr; }
  .hs-row .hs-pt{ grid-column:1 / -1; }
  .hs-swap{ display:none; }
  .hs-row .hs-date{ grid-column:1; }
  .hs-row .hs-pax{ grid-column:2; }
}

.hs-fld{ position:relative; display:flex; flex-direction:column; gap:5px; min-width:0; }
.hs-fld > span{ font-size:11.5px; font-weight:700; color:#6b6459; padding-inline-start:3px; }
.hs-fld input{
  width:100%; box-sizing:border-box;
  padding:12px 13px; border:1.5px solid #e4dcc4; border-radius:11px;
  background:#fdfcf8; color:#1b211d;
  font-family:inherit; font-size:14.5px; font-weight:600;
}
.hs-fld input::placeholder{ color:#a8a293; font-weight:500; }
.hs-fld input:focus{
  outline:none; border-color:var(--green-mid,#c9a227);
  background:#fff; box-shadow:0 0 0 3px rgba(201,162,39,.10);
}

.hs-swap{
  align-self:end; margin-block-end:5px;
  width:38px; height:44px; border:1.5px solid #e4dcc4; border-radius:11px;
  background:#fff; color:var(--green-mid,#c9a227);
  cursor:pointer; font-size:16px; line-height:1;
  transition:border-color .15s, background .15s;
}
.hs-swap:hover{ border-color:var(--green-mid,#c9a227); background:#f3f9f5; }
.hs-swap:focus-visible{ outline:2px solid var(--gold,#c9a227); outline-offset:2px; }

.hs-go{
  padding:13px 18px; border:none; border-radius:11px; cursor:pointer;
  background:linear-gradient(135deg,var(--gold,#c9a227),var(--gold-soft,#e6c866));
  color:#1b211d; font-family:inherit; font-weight:800; font-size:14.5px;
  transition:transform .15s, box-shadow .15s;
}
.hs-go:hover{ transform:translateY(-1px); box-shadow:0 10px 22px -10px rgba(201,162,39,.6); }
.hs-go:focus-visible{ outline:2px solid var(--green-deep,#8a6d16); outline-offset:2px; }

/* ── پیشنهادها ── */
.hs-sug{
  position:absolute; inset-inline:0; top:calc(100% + 6px); z-index:40;
  background:#fff; border:1px solid #e4dcc4; border-radius:12px;
  box-shadow:0 16px 36px -16px rgba(11,61,46,.35);
  overflow:hidden; max-height:262px; overflow-y:auto;
}
.hs-sug-i{
  display:block; width:100%; text-align:start;
  padding:11px 14px; border:none; background:#fff; cursor:pointer;
  font-family:inherit; font-size:14px; color:#1b211d;
  border-bottom:1px solid #f2eee2;
}
.hs-sug-i:last-child{ border-bottom:none; }
.hs-sug-i:hover, .hs-sug-i:focus-visible{ background:#f3f9f5; outline:none; }
.hs-sug-x{ padding:13px 14px; font-size:13px; color:#8a8371; }

/* ── نتیجه ── */
.hs-out{ min-height:0; }
.hs-hint{ display:block; padding:10px 4px 2px; font-size:12.5px; color:#8a8371; }
.hs-res{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin-block-start:12px; padding:13px 15px;
  background:#f3f9f5; border:1px solid #cfe6d8; border-radius:12px;
}
.hs-res-t{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:14.5px; color:#1b211d; }
.hs-res-t b{ font-weight:800; color:var(--green-deep,#8a6d16); }
.hs-res-m{ font-size:11.5px; color:#6b6459; background:#fff; border-radius:6px; padding:2px 8px; }
.hs-res-p{ display:flex; align-items:baseline; gap:7px; margin-inline-start:auto; }
.hs-res-p span{ font-size:11.5px; color:#6b6459; }
.hs-res-p b{ font-size:21px; font-weight:800; color:var(--green-deep,#8a6d16); font-variant-numeric:tabular-nums; }
.hs-book{
  padding:11px 20px; border:none; border-radius:10px; cursor:pointer;
  background:linear-gradient(135deg,var(--green-mid,#c9a227),var(--green-deep,#8a6d16));
  color:#fff; font-family:inherit; font-weight:800; font-size:13.5px;
}
.hs-book:hover{ filter:brightness(1.08); }
.hs-book:focus-visible{ outline:2px solid var(--gold,#c9a227); outline-offset:2px; }

/* ── لینکِ برنامه‌ریزِ کامل ── */
.hs-plan{
  display:block; margin-block-start:11px; text-align:center;
  font-size:13px; font-weight:700; color:#fff; text-decoration:none;
  text-shadow:0 1px 6px rgba(0,0,0,.5);
}
.hs-plan:hover{ color:var(--gold-soft,#e6c866); }
@media(max-width:900px){ .hs-plan{ color:var(--green-deep,#8a6d16); text-shadow:none; } }

/* ════════════════════════════════════════════════════════════
   صحنهٔ زندهٔ هیرو — الگوی علی‌بابا
   ------------------------------------------------------------
   یک SVG واحد (hero-scene.svg) که js/hero-search.js داخلِ .hero تزریق
   می‌کند. همهٔ خودروها خاکستری‌اند؛ با انتخابِ هر خدمت، data-hs-veh روی
   .hero عوض می‌شود و فقط خودروی همان خدمت رنگی و پیدا می‌شود.
   کاملاً با CSS — بدونِ جاوااسکریپت برای رنگ.
   ════════════════════════════════════════════════════════════ */
.kg-hero-scene{
  position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden;
}
.kg-hero-scene svg{ position:absolute; inset:0; width:100%; height:100%; }

/* پردهٔ سبز فقط وقتی صحنه واقعاً بار شده (has-scene).
   ⚠ قبلاً روی [data-hs-veh] هم بود؛ چون آن ویژگی حتی بدونِ صحنه ست می‌شود،
   وقتی فایلِ صحنه هنوز آپلود نشده بود، هیرو یک پردهٔ سبزِ تیره روی هیچ
   می‌گذاشت و صفحه سبزِ خالی می‌شد. حالا بدونِ صحنه هیچ پرده‌ای نیست. */
.hero.has-scene::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg,
    color-mix(in srgb, var(--g-900) 26%, transparent) 0%,
    color-mix(in srgb, var(--g-900) 50%, transparent) 58%,
    color-mix(in srgb, var(--g-900) 70%, transparent) 100%);
}
.hero .hero-inner, .hero .container{ position:relative; z-index:3; }

/* خودروها: غیرفعال محو، فعال طلایی و پیدا */
.kg-hero-scene .kg-veh{
  color:#aeb8b1; opacity:0;
  transition:color .5s ease, opacity .5s ease;
}
.hero[data-hs-veh="taxi"]     .kg-hero-scene #kg-taxi,
.hero[data-hs-veh="transfer"] .kg-hero-scene #kg-transfer,
.hero[data-hs-veh="van"]      .kg-hero-scene #kg-van,
.hero[data-hs-veh="minibus"]  .kg-hero-scene #kg-minibus,
.hero[data-hs-veh="bus"]      .kg-hero-scene #kg-bus{ color:var(--gold) !important; opacity:1 !important; animation:kgFade .5s ease both; }
/* بارگذاریِ اول: اتوبوس دیده شود تا صحنه خالی نباشد */
.hero:not([data-hs-veh]) .kg-hero-scene #kg-bus{ color:var(--gold); opacity:1; }

@media (prefers-reduced-motion: reduce){
  .hs-go, .hs-swap, .hs-tab, .hero[data-hs-veh]::after{ transition:none; }
  .hs-go:hover{ transform:none; }
}

/* عنوانِ فقط-برای-صفحه‌خوان — از سئو و دسترس‌پذیری کم نمی‌کند، فضا هم نمی‌گیرد */
.sr-only{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* ─── فوتر: جمع‌وجورتر ───
   ۱۶ واحد فاصلهٔ بالا و پایین، فوتر را بی‌قواره بلند می‌کرد.
   auto-fit کنارِ ستونِ ثابت هم عرضِ ستون‌ها را نامتوازن می‌کرد. */
.kg-footer{ margin-block-start:var(--s10); padding-block:var(--s8) var(--s4); }
.kg-footer-grid{ gap:var(--s6) var(--s8); grid-template-columns:1.6fr 1fr 1fr 1fr; }
@media(max-width:1023px){ .kg-footer-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .kg-footer-grid{ grid-template-columns:1fr; gap:var(--s5); } }
.kg-footer-col h4{ margin-block-end:var(--s3); font-size:13.5px; }
.kg-footer-col a{ font-size:13px; line-height:1.95; }

/* ════════════════════════════════════════════════════════════
   نوارِ منو در لپ‌تاپ (۱۲۵۱ تا ۱۶۲۰px) — «همهٔ تیترها معلوم باشند»
   ------------------------------------------------------------
   مسئله: لوگوی متنی + ۹ سرمنو + ورود + دکمهٔ رزرو + کلیدِ زبان روی‌هم
   ~۱۴۰۰px می‌خواهند، ولی نمایشگرِ رایج ۱۳۶۶px است. نتیجه: آیتم‌ها به هم
   فرو می‌رفتند و کلیدِ زبان زیرِ دکمهٔ طلایی بریده می‌شد.
   راهِ قبلی «ریزکردنِ فونت» بود که خواندن را سخت‌تر می‌کرد. راهِ درست
   آزادکردنِ فضاست: نامِ متنیِ لوگو در این بازه جمع می‌شود (نشانِ تصویری
   می‌ماند) و ~۱۸۰px آزاد می‌کند، پس هر تیتر اندازهٔ خوانای خودش را دارد.
   این بلوک باید در همین فایل باشد چون redesign.css پس از style.css بار
   می‌شود و قاعده‌های لوگو/منو را بازنویسی می‌کند.
   ════════════════════════════════════════════════════════════ */
@media (min-width:1251px) and (max-width:1620px){
  header nav{ gap:var(--s3); padding-inline:var(--s4); }
  /* font-size:0 فقط گرهِ متنیِ داخلِ لوگو را جمع می‌کند؛ تصویر دست‌نخورده */
  header .logo{ font-size:0; gap:0; }
  header .logo img{ width:34px; height:34px; }
  header nav > ul{ gap:0; }
  header nav > ul > li > a{ font-size:13.5px; padding-inline:var(--s2); }
}

/* کلیدِ زبان: هرگز فشرده یا بریده نشود، همیشه انتهای چپِ نوار */
header .kg-lang-switch{ flex:0 0 auto; margin-inline-start:var(--s2); }
@media (min-width:1251px) and (max-width:1620px){
  header .kg-lang-switch{ padding:7px 10px; font-size:12.5px; }
  header .kg-lang-switch span{ display:none; }   /* فقط پرچم */
}

/* ── متنِ مخصوصِ هر خدمت، زیرِ جعبهٔ جست‌وجو ── */
#kgSvcIntro:empty{ display:none; }
.hs-intro{
  max-width:1060px; margin:var(--s7) auto 0; padding-inline:16px;
  text-align:center;
}
.hs-intro-t{ margin:0 0 var(--s2); font-size:clamp(20px,2.4vw,26px); font-weight:800; color:var(--g-800); }
.hs-intro-l{ margin:0 auto; max-width:640px; font-size:15px; line-height:2; color:var(--ink-2); }
.hs-intro-p{
  list-style:none; padding:0; margin:var(--s5) 0 0;
  display:grid; gap:var(--s2) var(--s5);
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  text-align:start;
}
.hs-intro-p li{
  position:relative; padding-inline-start:var(--s5);
  font-size:13.5px; line-height:1.95; color:var(--ink-2);
}
.hs-intro-p li::before{
  content:"✓"; position:absolute; inset-inline-start:0;
  color:var(--g-600); font-weight:900;
}

/* ── رفت / رفت‌وبرگشت — انتخابگرِ ریز، نه دو دکمهٔ بزرگ ── */
.hs-way{
  display:inline-flex; gap:2px; padding:2px;
  background:#f2eee2; border-radius:8px; margin-block-end:5px;
}
.hs-way-b{
  border:none; background:transparent; cursor:pointer;
  padding:4px 11px; border-radius:6px;
  font-family:inherit; font-size:11.5px; font-weight:700; color:#6b6459;
  transition:background .15s, color .15s;
}
.hs-way-b:hover{ color:#1b211d; }
.hs-way-b.on{ background:#fff; color:var(--green-deep,#8a6d16); box-shadow:0 1px 3px rgba(0,0,0,.08); }
.hs-way-b:focus-visible{ outline:2px solid var(--gold,#c9a227); outline-offset:1px; }

.hs-note{
  margin:8px 4px 0; min-height:0; font-size:12px; font-weight:700; color:#8a6d12;
}
.hs-note:empty{ display:none; }

.hs-warn{
  flex-basis:100%; margin:8px 0 0; font-size:12px; line-height:1.9; color:#8a6d12;
}
.hs-res-rt{ background:#f2f2f2; color:var(--green-deep,#8a6d16); font-weight:700; }

/* ردیفِ فرم با فیلدِ برگشت — ستونِ تازه بدونِ به‌هم‌ریختنِ تناسب */
@media(min-width:1024px){
  .hs-row:has(.hs-back){ grid-template-columns:1fr 38px 1fr 138px 138px 84px 150px; }
}
@media(max-width:1023px){
  .hs-row .hs-back{ grid-column:3; }
  .hs-row:has(.hs-back) .hs-date:not(.hs-back){ grid-column:1 / 3; }
}
@media(max-width:560px){
  .hs-row .hs-back{ grid-column:1 / -1; }
}

/* ── نوارِ منو: از راست شروع شود و دکمه‌ها ته چپ ──
   خواستهٔ صریح: «منو رفته سمت چپ، باید از راست شروع بشه».
   علت: header nav > ul قاعدهٔ margin-inline-start:auto داشت که در RTL کلِ
   فهرست را به لبهٔ چپ هُل می‌داد. حالا فهرست بلافاصله کنارِ لوگو (سمتِ راست)
   می‌نشیند و فقط دکمهٔ ورود/رزرو و کلیدِ زبان ته چپ می‌روند. */
header nav > ul{ margin-inline-start:var(--s4); margin-inline-end:auto; }
header nav > ul > li.nav-cta-wrap,
header .nav-cta{ margin-inline-start:auto; }

/* ════════════════════════════════════════════════════════════
   فونتِ اصلی: ایران‌سنس
   ------------------------------------------------------------
   ایران‌سنس روی گوگل‌فونت نیست (فونتِ تجاری است)، پس دو راه دارد و هر دو
   این‌جا پوشش داده شده:
     ۱) فایل‌های فونت را در پوشهٔ /fonts/ آپلود کنید (نام‌های زیر) — همین
        @font-face خودش برشان می‌دارد. سریع‌ترین و مطمئن‌ترین راه.
     ۲) اگر فایلی نباشد، مرورگر بی‌صدا به وزیرمتن برمی‌گردد که متریکِ
        نزدیکی دارد و صفحه هرگز بی‌فونت نمی‌ماند.
   font-display:swap یعنی متن بلافاصله دیده می‌شود، نه بعد از دانلودِ فونت.
   ════════════════════════════════════════════════════════════ */
@font-face{
  font-family:'IRANSans';
  src:url('/fonts/IRANSansX-Regular.woff2') format('woff2'),
      url('/fonts/IRANSans-Regular.woff2') format('woff2');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'IRANSans';
  src:url('/fonts/IRANSansX-Medium.woff2') format('woff2'),
      url('/fonts/IRANSans-Medium.woff2') format('woff2');
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'IRANSans';
  src:url('/fonts/IRANSansX-Bold.woff2') format('woff2'),
      url('/fonts/IRANSans-Bold.woff2') format('woff2');
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'IRANSans';
  src:url('/fonts/IRANSansX-Black.woff2') format('woff2'),
      url('/fonts/IRANSans-Black.woff2') format('woff2');
  font-weight:800 900; font-style:normal; font-display:swap;
}

:root{ --font:'IRANSans','Vazirmatn','Segoe UI',Tahoma,sans-serif; }
html[lang="ar"]{ --font:'IRANSans','Cairo','Tajawal','Vazirmatn',sans-serif; }
body{ font-family:var(--font); }

/* ── دو حالتِ برنامه: مسیرِ دلخواه / زیارتِ کامل ── */
.tp-mode{ margin-block-end:var(--s4); }
.tp-mode:empty{ display:none; }
.tp-mode-sw{
  display:inline-flex; gap:2px; padding:3px;
  background:var(--tp-sunk); border:1px solid var(--tp-line); border-radius:10px;
}
.tp-mode-b{
  border:none; background:transparent; cursor:pointer;
  padding:7px 16px; border-radius:8px;
  font-family:inherit; font-size:13px; font-weight:700; color:var(--tp-faint);
  transition:background .15s, color .15s;
}
.tp-mode-b:hover{ color:var(--tp-ink); }
.tp-mode-b.tp-on{
  background:var(--tp-surface); color:var(--tp-acc);
  box-shadow:0 1px 4px color-mix(in srgb, var(--tp-ink) 14%, transparent);
}
.tp-mode-b:focus-visible{ outline:2px solid var(--tp-acc); outline-offset:2px; }

/* کارتِ معرفیِ بسته — جمع‌وجور، نه بلوکِ غول‌پیکر */
.tp-pkg-card{
  margin-block-start:var(--s3);
  padding:14px 16px;
  background:var(--tp-surface); border:1px dashed var(--tp-line-2);
  border-radius:var(--r-lg);
}
.tp-pkg-h{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.tp-pkg-h b{ font-size:14.5px; color:var(--tp-ink); }
.tp-pkg-h span{ font-size:12px; color:var(--tp-faint); font-weight:700; }
.tp-pkg-list{
  margin:9px 0 0; padding:0; list-style:none;
  display:flex; flex-wrap:wrap; gap:6px;
}
.tp-pkg-list li{
  font-size:12px; font-weight:600; color:var(--tp-dim);
  background:var(--tp-sunk); border-radius:999px; padding:4px 11px;
}
.tp-pkg-note{ margin:10px 0 0; font-size:11.5px; line-height:1.9; color:var(--tp-faint); }
.tp-pkg-pick{
  margin-block-start:10px;
  border:none; border-radius:9px; cursor:pointer;
  padding:9px 20px; font-family:inherit; font-weight:800; font-size:13px;
  color:var(--tp-acc-on); background:var(--tp-acc);
  transition:transform .15s, box-shadow .15s;
}
.tp-pkg-pick:hover{ transform:translateY(-1px); box-shadow:0 8px 18px -8px color-mix(in srgb, var(--tp-acc) 60%, transparent); }
.tp-pkg-pick:focus-visible{ outline:2px solid var(--tp-acc); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){
  .tp-pkg-pick{ transition:none; } .tp-pkg-pick:hover{ transform:none; }
}

/* ── فیلدِ تاریخِ روز: مهارِ «جعبهٔ غول‌پیکر» ──
   استایلِ پایهٔ .tp-day-date برای «متنِ نمایشی» نوشته شده بود (فونتِ ۲۲px،
   flex:1 1 240px) ولی JS همان کلاس را روی <input> می‌گذارد؛ نتیجه یک کادرِ
   سفیدِ عظیم وسطِ کارتِ روز بود. این‌جا ورودی به اندازهٔ واقعی‌اش برمی‌گردد:
   یک فیلدِ جمع‌وجورِ کلیک‌شدنی که تقویم را باز می‌کند. */
input.tp-day-date{
  flex:0 1 168px;
  width:168px;
  font-size:15px;
  font-weight:800;
  letter-spacing:0;
  line-height:1.4;
  padding:8px 12px;
  border:1.5px solid var(--tp-line);
  border-radius:9px;
  background:var(--tp-surface);
  color:var(--tp-ink);
  font-family:inherit;
  cursor:pointer;
  text-align:center;
}
input.tp-day-date:hover{ border-color:var(--tp-acc); }
input.tp-day-date:focus-visible{ outline:2px solid var(--tp-acc); outline-offset:2px; }
input.tp-day-date::placeholder{ color:var(--tp-faint); font-weight:600; }

/* ════════════════════════════════════════════════════════════
   جعبهٔ جست‌وجو — رفعِ سرریزِ موبایل
   ------------------------------------------------------------
   دو علتِ واقعی که با اسکرین‌شات پیدا شد:
     ۱) ستون‌ها با «1fr» تعریف شده بودند. 1fr یعنی minmax(auto,1fr) و
        هرگز کوچک‌تر از محتوای درونش نمی‌شود؛ ورودی با placeholderِ بلند
        گرید را پهن‌تر از صفحه می‌کرد. minmax(0,1fr) این قفل را باز می‌کند.
     ۲) قاعدهٔ «.hs-back{grid-column:3}» در بریک‌پوینتِ ۱۰۲۳ نوشته شده بود
        ولی زیرِ ۵۶۰ گرید فقط دو ستون دارد؛ ستونِ سومِ خیالی ساخته می‌شد و
        کلِ کارت را بیرون می‌برد.
   ════════════════════════════════════════════════════════════ */
.hs-host{ width:100%; box-sizing:border-box; overflow-x:clip; }
.hs-card{ box-sizing:border-box; max-width:100%; }
.hs-row{ grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr) 150px 92px 168px; }

@media(max-width:1023px){
  .hs-row{ grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr); }
}
@media(max-width:560px){
  .hs-row{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:9px; }
  /* هر چیزی که در بریک‌پوینتِ بزرگ‌تر ستونِ ۳ گرفته بود، این‌جا تمام‌عرض */
  .hs-row .hs-back,
  .hs-row .hs-pt{ grid-column:1 / -1; }
  .hs-row .hs-date:not(.hs-back){ grid-column:1; }
  .hs-row .hs-pax{ grid-column:2; }
  .hs-row .hs-go{ grid-column:1 / -1; }
  .hs-card{ padding:12px; border-radius:14px; }
  .hs-fld input{ font-size:14px; }
}

/* زبانه‌ها: به‌جای بیرون‌زدن، افقی اسکرول شوند */
.hs-tabs{ max-width:100%; overflow-x:auto; scrollbar-width:none; }
.hs-tab{ flex:0 0 auto; }

/* روی موبایل کارت گوشهٔ چپِ بالا هم گرد باشد، چون زبانه‌ها کامل بالایش نیستند */
@media(max-width:560px){ .hs-card{ border-radius:14px; } }

/* ════════════════════════════════════════════════════════════
   هیرو در موبایل — مهارِ استایل‌های درون‌خطیِ ویرایشگر
   ------------------------------------------------------------
   اندازه‌گیریِ واقعی (۳۹۰px): هیرو ۶۲۸px پهنا داشت و ۱۴۷px بیرونِ صفحه بود.
   دو علت، هر دو استایلِ درون‌خطی که از ویرایشگرِ بصری روی عناصر نشسته‌اند:
     ۱) hero style="height:353px"  ⇒ ارتفاعِ قفل‌شده، محتوا بریده می‌شد
     ۲) .cta-row style="grid-template-columns:repeat(3,1fr)" با سه دکمهٔ
        white-space:nowrap ⇒ حداقلِ عرضِ ۵۹۶px، که کلِ صفحه را پهن می‌کرد
   استایلِ درون‌خطی را فقط با !important می‌توان در بریک‌پوینت مهار کرد.
   روی دسکتاپ دست‌نخورده می‌ماند تا چیدمانی که خودتان ساخته‌اید حفظ شود.
   ════════════════════════════════════════════════════════════ */
@media (max-width:760px){
  .hero{
    height:auto !important;
    min-height:auto !important;
    max-width:100% !important;
    padding-block:var(--s8) var(--s10);
  }
  .hero .hero-inner,
  .hero .container{ max-width:100% !important; }

  .hero .cta-row{
    display:flex !important;
    grid-template-columns:none !important;
    flex-wrap:wrap !important;
    gap:10px !important;
    justify-content:stretch;
  }
  .hero .cta-row > a,
  .hero .cta-row > .btn{
    flex:1 1 100%;
    min-width:0;
    white-space:normal;
    text-align:center;
  }

  .hero h1{ font-size:clamp(21px,6.2vw,30px); line-height:1.5; }
  .hero .hero-lead,
  .hero p{ font-size:14.5px; line-height:1.95; }
}

/* سدِ آخر: هیچ چیز نباید سطح را افقی بکشد */
html, body{ max-width:100%; overflow-x:clip; }

/* زبانه‌های خدمت در موبایل: اسکرولِ افقیِ نرم با لبهٔ محوشونده،
   به‌جای بیرون‌زدن از کادر. زبانهٔ فعال همیشه اول است تا دیده شود. */
@media (max-width:760px){
  .hs-tabs{
    display:flex; flex-wrap:nowrap;
    overflow-x:auto; overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
    padding-inline:2px; gap:6px;
    mask-image:linear-gradient(to left, transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%);
  }
  .hs-tab{ scroll-snap-align:start; flex:0 0 auto; font-size:12.5px; padding:9px 13px; }
  .hs-tab img{ width:20px; height:20px; }
}

/* ── اسلایدِ ویترینِ خدمت ──
   تصویرهای خدمت تصویرسازیِ روشن‌اند، نه عکسِ تیره. بدونِ پرده، متنِ هیرو
   رویشان خوانده نمی‌شود. این پرده تصویر را نگه می‌دارد ولی متن را برمی‌گرداند
   جلو. سمتِ راست (شروعِ خواندن در RTL) تیره‌تر است تا تیتر جا داشته باشد. */
.hero-slide.hs-art{
  background-size:cover; background-position:center 60%;
}
.hero-slide.hs-art::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to left, rgba(7,41,31,.90) 0%, rgba(7,41,31,.72) 42%, rgba(7,41,31,.46) 100%),
    linear-gradient(to top, rgba(7,41,31,.85) 0%, rgba(7,41,31,0) 55%);
  pointer-events:none;
}
@media (max-width:760px){
  .hero-slide.hs-art{ background-position:center 70%; }
  .hero-slide.hs-art::after{
    background:linear-gradient(to top, rgba(7,41,31,.92) 0%, rgba(7,41,31,.70) 60%, rgba(7,41,31,.55) 100%);
  }
}

/* ── ردیفِ فرم: قدِ یکسان در هر دو حالت ──
   مشکل: فیلدِ «تاریخ رفت» بالایش انتخابگرِ یک‌طرفه/رفت‌وبرگشت دارد و فیلدِ
   «تاریخ برگشت» یک برچسبِ ساده؛ چون هر ستون قدِ محتوای خودش را می‌گیرد،
   با تعویضِ حالت ورودی‌ها بالا و پایین می‌پریدند و هم‌تراز نبودند.
   راهِ درست: سرِ همهٔ فیلدها یک ارتفاعِ ثابت بگیرد و ورودی‌ها ته ستون
   بچسبند — آن‌وقت هر تعداد ستون که باشد، همه در یک خط می‌مانند. */
.hs-row{ align-items:stretch; }
.hs-fld{ justify-content:flex-end; }
.hs-fld > span,
.hs-fld .hs-way{
  min-height:22px;
  display:flex; align-items:center;
  margin-block-end:5px;
}
.hs-fld .hs-way{ width:max-content; }
.hs-fld input{ height:46px; box-sizing:border-box; }
.hs-go{ height:46px; align-self:end; }
.hs-swap{ align-self:end; height:46px; }

/* دکمهٔ جست‌وجو هم‌قدِ ورودی‌ها بماند، نه کشیده به کلِ ستون */
.hs-row > .hs-go{ margin-block-start:auto; }

@media(max-width:560px){
  .hs-fld > span, .hs-fld .hs-way{ min-height:20px; }
  .hs-fld input, .hs-go{ height:44px; }
}

/* وقتی صحنهٔ تازه بار شد، اسلایدر/تصویرِ قدیمیِ هیرو پنهان شود تا دولا نشود */

.hero.has-scene .hero-slides,
.hero.has-scene .hero-slide,
.hero.has-scene .hero-bg{ display:none !important; }
.hero.has-scene{ background:linear-gradient(165deg,var(--g-900),var(--g-700) 62%,var(--g-600)) !important; }

/* ════════════════════════════════════════════════════════════
   انیمیشنِ صحنهٔ هیرو — زندگی، نه پرش
   ------------------------------------------------------------
   خواستهٔ صاحبِ سایت: خودروها فقط عوض نشوند، حرکت داشته باشند.
   سه لایهٔ حرکت:
     ۱) خودروی فعال از راست وارد می‌شود و آرام «شناور» می‌ماند (جادهٔ ناهموار)
     ۲) چرخ‌ها می‌چرخند
     ۳) ابرها آرام از چپ به راست می‌روند و پرتوهای نور نفس می‌کشند
   همه سبک‌اند و prefers-reduced-motion را احترام می‌گذارند.
   ════════════════════════════════════════════════════════════ */

/* ظاهرشدنِ نرمِ خودرو — فقط opacity تا موقعیتِ SVG دست‌نخورده بماند */
@keyframes kgFade{ from{ opacity:0; } to{ opacity:1; } }
.hero[data-hs-veh] .kg-hero-scene .kg-veh{ animation:none; }
.hero[data-hs-veh="taxi"]     .kg-hero-scene #kg-taxi,
.hero[data-hs-veh="transfer"] .kg-hero-scene #kg-transfer,
.hero[data-hs-veh="van"]      .kg-hero-scene #kg-van,
.hero[data-hs-veh="minibus"]  .kg-hero-scene #kg-minibus,
.hero[data-hs-veh="bus"]      .kg-hero-scene #kg-bus{ color:var(--gold) !important; opacity:1 !important; animation:kgFade .5s ease both; }

/* خودروها ثابت در انتهای چپ می‌مانند (از طریقِ translateِ خودِ SVG)؛ حسِ حرکت
   را چرخ‌های چرخان می‌رسانند. درایوِ افقیِ CSS حذف شد چون در حالتِ تزریقِ
   innerHTML شکننده بود و موقعیت را به‌هم می‌زد. */

/* چرخ‌ها می‌چرخند — گروهِ چرخ داخلِ هر خودرو */
@keyframes kgSpin{ to{ transform:rotate(360deg); } }
/* ⚠️ چرخشِ چرخ حالا کاملاً با SMIL داخلِ خودِ SVG است (هم‌زمان با حرکت).
   قاعدهٔ CSS با transform-box:fill-box با آن تداخل داشت و لاستیک را از
   خودرو جدا می‌کرد؛ ضمناً CSS در حالتِ «کاهشِ انیمیشن» خاموش می‌شود و
   آن‌وقت خودرو حرکت می‌کرد ولی چرخ ثابت می‌مانْد. */
.kg-veh[style*="opacity:0"] .kg-wheel,
.kg-hero-scene .kg-veh:not(#kg-bus) .kg-wheel{ /* فقط چرخِ خودروی دیده‌شده بچرخد */ }

/* ابرها: رانشِ افقیِ آرام و بی‌پایان */
@keyframes kgDrift{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(46px); }
}
.kg-hero-scene .kg-cloud{
  transform-box:fill-box;
  animation:kgDrift 14s ease-in-out infinite alternate;
}
.kg-hero-scene .kg-cloud.c2{ animation-duration:19s; }
.kg-hero-scene .kg-cloud.c3{ animation-duration:23s; }

/* پرتوهای نور: نفسِ ملایمِ روشنایی */
@keyframes kgRays{ 0%,100%{ opacity:.4; } 50%{ opacity:.62; } }
.kg-hero-scene .kg-rays{ animation:kgRays 7s ease-in-out infinite; }

@media (prefers-reduced-motion: reduce){
  .kg-hero-scene .kg-veh,
  .kg-hero-scene .kg-wheel,
  .kg-hero-scene .kg-cloud,
  .kg-hero-scene .kg-rays{ animation:none !important; }
}

/* ════════════════════════════════════════════════════════════
   اندازهٔ صحنه — الگوی علی‌بابا: نوارِ باریکِ پایین، نه پوششِ کامل
   ------------------------------------------------------------
   در علی‌بابا تصویرسازی یک نوارِ افقیِ باریک پایینِ هیروست، نه پس‌زمینهٔ
   تمام‌قد. صحنه را به همان نسبت می‌بریم: چسبیده به کفِ هیرو، ارتفاعِ کم،
   و لبهٔ بالایش نرم در سبزِ هیرو محو می‌شود تا وصله به‌نظر نرسد.
   ════════════════════════════════════════════════════════════ */
/* صحنهٔ کامل — کلِ هیرو را پر می‌کند */
.kg-hero-scene{ inset:0; }
.kg-hero-scene svg{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.hero.has-scene::after{
  inset:0;
  background:linear-gradient(180deg,
    color-mix(in srgb, var(--g-900) 20%, transparent) 0%,
    color-mix(in srgb, var(--g-900) 30%, transparent) 45%,
    color-mix(in srgb, var(--g-900) 48%, transparent) 100%);
}

/* هیرو با صحنه: ارتفاعِ منطقی، نه ۷۶۸ پیکسلِ نسبتِ ۱۶:۹ */
/* ═══ ارتفاعِ هدر — از پنل ═══
   admin/hero-scene.php دو عدد می‌نویسد (دسکتاپ/موبایل) و js/hero-search.js
   آن‌ها را روی <html> به‌صورتِ متغیرِ CSS می‌گذارد. مقدارِ پیش‌فرضِ داخلِ
   var() تضمین می‌کند که اگر جاوااسکریپت هم نرسید، هدر ارتفاعِ درست داشته
   باشد و صفحه نپرد. */
@media(min-width:761px){
  .hero.has-scene{
    aspect-ratio:auto !important;
    height:var(--kg-hero-h, clamp(300px,32vw,410px)) !important;
    min-height:0 !important;
  }
}
@media(max-width:760px){
  .hero.has-scene{
    aspect-ratio:auto !important; height:auto !important;
    min-height:var(--kg-hero-h-m, 280px) !important;
  }
}

/* ═══ صحنه خاموش است ⇒ اسلایدرِ عکس ═══
   وقتی مدیر صحنه را خاموش کند، هدر باید همان اسلایدرِ همیشگی باشد. */
.hero.no-scene .hero-slides,
.hero.no-scene .hero-slide,
.hero.no-scene .hero-bg{ display:block !important; }
@media(min-width:761px){ .hero.no-scene{ height:var(--kg-hero-h, 420px) !important; min-height:0 !important; } }
@media(max-width:760px){ .hero.no-scene{ min-height:var(--kg-hero-h-m, 300px) !important; } }

/* ═══ تا وقتی تکلیفِ هدر روشن نشده، هیچ‌چیز سوسو نزند ═══
   قبلاً کاربر پشتِ‌سرِ هم اسلایدر، بعد صحنه، بعد ویجت را می‌دید («چند لایه
   از تغییراتِ گذشته»). حالا هدر تا رسیدنِ تنظیمات فقط زمینهٔ ساده است. */
.hero.hero-wait .hero-slides,
.hero.hero-wait .hero-slide,
.hero.hero-wait .hero-arrow,
.hero.hero-wait .hero-dots{ visibility:hidden !important; }

/* ════════════════════════════════════════════════════════════
   جعبهٔ جست‌وجو — بازطراحیِ تمیز مثلِ علی‌بابا
   ------------------------------------------------------------
   · دراپ‌داونِ نوعِ سفر گوشهٔ بالا، پیش‌فرض بسته
   · همهٔ فیلدها هم‌قد و در یک خط (grid با ارتفاعِ یکسان)
   · تاریخِ برگشت در حالتِ یک‌طرفه غیرفعال و کم‌رنگ
   ════════════════════════════════════════════════════════════ */

/* نوارِ بالا: دراپ‌داون در گوشه */
.hs-cardtop{ display:flex; justify-content:flex-start; margin-block-end:12px; }
.hs-trip{ position:relative; }
.hs-trip-btn{
  display:inline-flex; align-items:center; gap:7px;
  background:var(--g-050,#f6f6f7); border:1.5px solid var(--line,#e3ddcd);
  border-radius:9px; padding:8px 14px; cursor:pointer;
  font-family:inherit; font-size:13px; font-weight:700; color:var(--g-800,#8a6d16);
}
.hs-trip-btn:hover{ border-color:var(--gold,#c9a227); }
.hs-trip-car{ font-size:10px; transition:transform .2s; }
.hs-trip[data-open="1"] .hs-trip-car{ transform:rotate(180deg); }

/* منو — پیش‌فرض بسته؛ فقط وقتی data-open=1 دیده می‌شود */
.hs-trip-menu{
  position:absolute; inset-block-start:calc(100% + 6px); inset-inline-start:0;
  min-width:160px; z-index:30;
  background:#fff; border:1.5px solid var(--line,#e3ddcd); border-radius:11px;
  box-shadow:0 14px 34px -14px rgba(11,61,46,.4);
  padding:5px; display:none;
}
.hs-trip[data-open="1"] .hs-trip-menu{ display:block; }
.hs-trip-menu button{
  display:block; width:100%; text-align:start;
  background:transparent; border:none; border-radius:8px;
  padding:9px 12px; cursor:pointer;
  font-family:inherit; font-size:13.5px; font-weight:600; color:var(--ink,#16211c);
}
.hs-trip-menu button:hover{ background:var(--g-050,#f6f6f7); }
.hs-trip-menu button[aria-checked="true"]{
  background:var(--g-050,#f6f6f7); color:var(--g-800,#8a6d16); font-weight:800;
}
.hs-trip-menu button[aria-checked="true"]::before{ content:"✓ "; color:var(--gold,#c9a227); }

/* ردیفِ فیلدها — همه هم‌قد، در یک خط.
   ستون‌ها: مبدأ | swap | مقصد | تاریخ‌رفت | تاریخ‌برگشت | نفرات | دکمه */
.hs-row{
  display:grid; gap:10px; align-items:end;
  grid-template-columns:minmax(0,1.3fr) 40px minmax(0,1.3fr) 128px 128px 78px 130px;
}
.hs-fld{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.hs-fld > span{
  font-size:12px; font-weight:700; color:var(--muted,#6b7873);
  height:16px; line-height:16px; padding-inline-start:2px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.hs-fld input{
  height:46px; box-sizing:border-box; width:100%;
  border:1.5px solid var(--line,#e3ddcd); border-radius:10px;
  padding:0 13px; font-family:inherit; font-size:14px; background:#fff;
  color:var(--ink,#16211c);
}
.hs-fld input:focus{ outline:none; border-color:var(--gold,#c9a227); box-shadow:0 0 0 3px rgba(201,162,39,.14); }
.hs-fld input::placeholder{ color:#a8a293; }

/* دکمهٔ جابه‌جایی هم‌قدِ ورودی‌ها، پایین‌چین */
.hs-swap{
  align-self:end; height:46px; width:40px;
  border:1.5px solid var(--line,#e3ddcd); border-radius:10px;
  background:#fff; cursor:pointer; color:var(--g-700,#3d3d3d); font-size:17px;
}
.hs-swap:hover{ border-color:var(--gold,#c9a227); color:var(--gold,#c9a227); }

/* تاریخِ برگشت غیرفعال در یک‌طرفه */
.hs-fld.is-off input,
.hs-fld input:disabled{
  background:var(--paper-2,#f7f4ec); color:#b3aea1; cursor:not-allowed; border-style:dashed;
}
.hs-fld.is-off > span{ opacity:.6; }

/* دکمهٔ جست‌وجو — هم‌قدِ ردیف، طلایی */
.hs-go{
  align-self:end; height:46px; border:none; border-radius:10px; cursor:pointer;
  font-family:inherit; font-weight:800; font-size:14.5px; color:#1b211d;
  background:linear-gradient(135deg,var(--gold,#c9a227),var(--gold-400,#e6c866));
  white-space:nowrap; padding-inline:8px;
}
.hs-go:hover{ filter:brightness(1.04); }

/* موبایل: فیلدها زیرِ هم، دو ستونه */
@media(max-width:820px){
  .hs-row{ grid-template-columns:1fr 1fr; }
  .hs-swap{ display:none; }
  .hs-fld.hs-pt{ grid-column:1 / -1; }
  .hs-go{ grid-column:1 / -1; }
}

/* ════════════════════════════════════════════════════════════
   جعبهٔ جست‌وجو — تراز نهاییِ قاطع
   ------------------------------------------------------------
   چند بلوکِ قدیمیِ .hs-fld در فایل با هم تناقض داشتند و فیلدها را
   بالا-پایین می‌کردند. این بلوک با پیشوندِ .hs (اولویتِ بالاتر) و در
   انتهای فایل، همه را یک‌بار برای همیشه هم‌تراز می‌کند.
   ════════════════════════════════════════════════════════════ */
.hs .hs-row{
  display:grid; align-items:end; gap:10px;
  grid-template-columns:minmax(0,1.25fr) 40px minmax(0,1.25fr) 122px 122px 74px 128px;
}
.hs .hs-fld{
  display:flex; flex-direction:column; justify-content:flex-end;
  gap:6px; min-width:0; margin:0;
}
.hs .hs-fld > span{
  display:block; height:17px; line-height:17px; margin:0;
  font-size:12px; font-weight:700; color:var(--muted,#6b7873);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.hs .hs-fld input{
  height:48px; box-sizing:border-box; width:100%; margin:0;
  border:1.5px solid var(--line,#e3ddcd); border-radius:10px;
  padding:0 13px; font-family:inherit; font-size:14px; background:#fff;
}
.hs .hs-swap{ align-self:end; height:48px; margin:0; }
.hs .hs-go{ align-self:end; height:48px; margin:0; }
/* برچسبِ swap ندارد ولی باید هم‌ردیفِ ورودی‌ها بایستد؛ فضای برچسب را می‌گیرد */
.hs .hs-row > .hs-swap::before{ content:none; }

@media(max-width:820px){
  .hs .hs-row{ grid-template-columns:1fr 1fr; }
  .hs .hs-row > .hs-swap{ display:none; }
  .hs .hs-fld.hs-pt{ grid-column:1 / -1; }
  .hs .hs-go{ grid-column:1 / -1; }
}

/* وقتی صحنهٔ تازه بار شده، هیچ عنصرِ تزئینیِ قدیمیِ هیرو دیده نشود
   (دایره/گرادیانِ رادیالِ نسخهٔ قبل که گاهی به‌صورتِ نیم‌دایرهٔ خاکستری می‌ماند) */
.hero.has-scene::before{ display:none !important; }
.hero.has-scene > *:not(.kg-hero-scene):not(.hero-inner):not(.container):not(.hero-arrow):not(.hero-dots){ }
.hero.has-scene .hero-caption,
.hero.has-scene .hero-bg,
.hero.has-scene [style*="border-radius:50%"],
.hero.has-scene [style*="radial-gradient"]{ display:none !important; }

/* ══════════════════════════════════════════════════════════════════════
   تمِ روشن — سفید / فونتِ سیاه / کادرِ خاکستری   (۱۴۰۵/۰۵ — غلبهٔ نهایی)
   آخرین چیزِ فایلِ آخر است، پس بر همهٔ رنگ‌های سبزِ پیشین غلبه می‌کند.
   هیروِ صفحهٔ اصلی (صحنهٔ مذهبی) دست‌نخورده می‌ماند؛ بقیهٔ صفحه سفید می‌شود.
   ══════════════════════════════════════════════════════════════════════ */
:root,
:root[data-theme="light"],
:root[data-theme="dark"]{
  color-scheme: light;
  --ink:#1b1b1b; --ink-2:#4a4a4a; --muted:#7a7a7a; --line:#e5e5e5;
  --paper:#ffffff; --paper-2:#f6f6f7; --white:#ffffff;
  --g-050:#f6f6f7; --g-100:#eef0ef;
  --nav-bg:#ffffff; --nav-border:#e6e6e6;
  --shadow-sm:0 6px 18px -8px rgba(0,0,0,.12);
}

/* بدنهٔ سفیدِ ساده به‌جای مِشِ کرم/سبز */
html, body{ background:#ffffff !important; }
body{ color:var(--ink) !important; }
main > section.section:nth-of-type(2n){ background:#fafafa !important; }
main > section.section:nth-of-type(2n)::before{ display:none !important; }

/* ── هدرِ سفید، متنِ سیاه، مرزِ خاکستری ── */
header{ background:#ffffff !important; border-bottom:1px solid var(--line) !important;
  box-shadow:0 1px 3px rgba(0,0,0,.05) !important; }
header .logo, header .logo *{ color:#1b1b1b !important; }
.nav-toggle{ color:#333 !important; }
header nav > ul > li > a{ color:#333 !important; }
header nav > ul > li > a:hover,
header nav > ul > li > a.active{ background:#f2f2f2 !important; color:#000 !important; }
.submenu{ background:#ffffff !important; border:1px solid var(--line) !important; }
.submenu a{ color:#333 !important; }
.submenu a:hover{ background:#f4f4f4 !important; color:#000 !important; }
/* منوی کشوییِ موبایل: سفید و روی همه‌چیز */
@media(max-width:1250px){
  nav ul{ background:#ffffff !important; border-bottom:1px solid var(--line) !important;
    box-shadow:0 24px 48px -24px rgba(0,0,0,.35) !important; z-index:1200 !important; }
  nav ul li a{ color:#222 !important; }
  nav ul li a:hover{ background:#f4f4f4 !important; }
}

/* ── سرتیترها و متن → سیاه ── */
h1,h2,h3,h4,h5,h6{ color:var(--ink) !important; }
main .container h3{ color:var(--ink) !important; }
main .container h3::before{ color:var(--gold) !important; }
main .container p{ color:#333333 !important; }
.stat-card .num, .stat .num, .s-num,
.hm-quick-t, .kg-related-t, .kgd-ttl, .sb-kinds b, .kg-fig-t,
.hm-pay-c b, .hm-rt-p, .hm-rt-p b{ color:var(--ink) !important; }
/* لینک‌های محتوایی → طلاییِ تیره (روی سفید خوانا) */
main .container p a:not(.btn), main li a:not(.btn),
main .container > .container{ color:#8a6d16 !important; font-weight:700; }

/* ── هیروِ صفحهٔ اصلی: صحنه می‌ماند، تیترش سفید ── */
.hero h1, .hero .hero-title, .hero.has-scene h1,
.hero [class*="title"]{ color:#ffffff !important; }

/* ── page-hero (نوارِ سبزِ صفحاتِ داخلی) → خاکستریِ روشن ── */
.page-hero{ background:#f4f4f5 !important; border-bottom:1px solid var(--line) !important; }
.page-hero::before, .page-hero::after{ display:none !important; }
.page-hero h1{ color:var(--ink) !important; text-shadow:none !important; }
.page-hero h1::after{ background:linear-gradient(90deg,transparent,var(--gold),transparent) !important;
  box-shadow:none !important; }
.page-hero p{ color:#555555 !important; }

/* ── نوارهای تیرهٔ سبز → خاکستریِ روشن با متنِ سیاه ── */
.hm-trust, .hm-cta, .rz-head, .rz-quote, .kg-footer{
  background:#f5f5f6 !important; color:var(--ink) !important; }
.hm-trust *, .hm-cta *, .rz-head *, .rz-quote *, .kg-footer *{
  color:#333333 !important; border-color:var(--line) !important; }
.kg-footer{ border-top:1px solid var(--line) !important; }
.kg-footer a:hover{ color:#8a6d16 !important; }

/* ── دکمه‌های سبز → طلایی (CTA اصلی) ── */
.btn-primary, .btn-green{
  background:linear-gradient(135deg,var(--gold),var(--gold-400)) !important;
  color:#1b1508 !important; border:1px solid var(--gold-600) !important; }
.btn-primary:hover, .btn-green:hover{ filter:brightness(1.04); }

/* ── کارت‌ها: سفید با کادرِ خاکستری ── */
.stat-card, .kg-card, .kg-fig, .hm-card{
  background:#ffffff !important; border:1px solid var(--line) !important; }

/* ══════════════════════════════════════════════════════════════════════
   فرمِ رزروِ صفحهٔ اصلی — رفعِ سرریزِ موبایل + مودالِ تأیید (۱۴۰۵/۰۵)
   ══════════════════════════════════════════════════════════════════════ */
/* موبایل: هر فیلد یک ردیفِ کامل، بی‌سرریز؛ برچسب‌ها بریده نشوند */
@media(max-width:820px){
  .hs .hs-row{
    display:grid !important; grid-template-columns:1fr 1fr !important;
    gap:10px !important; align-items:end !important;
  }
  .hs .hs-fld{ min-width:0 !important; }
  .hs .hs-fld input{ width:100% !important; box-sizing:border-box !important; }
  .hs .hs-pt{ grid-column:1 / -1 !important; }          /* مبدأ/مقصد تمام‌عرض */
  .hs .hs-swap{ display:none !important; }               /* دکمهٔ جابه‌جایی در موبایل حذف */
  .hs .hs-date{ grid-column:span 1 !important; }
  .hs .hs-pax{ grid-column:span 1 !important; }
  .hs .hs-go{ grid-column:1 / -1 !important; width:100% !important; }
}
@media(max-width:460px){
  .hs .hs-row{ grid-template-columns:1fr !important; }
  .hs .hs-date, .hs .hs-pax{ grid-column:1 / -1 !important; }
}
.hs-hint-err{ color:#c0392b !important; font-weight:700; }

/* ── مودالِ تأیید و ثبت ── */
:root.hs-modal-open{ overflow:hidden; }
.hs-modal{ position:fixed; inset:0; z-index:4000; display:flex; align-items:center; justify-content:center;
  padding:16px; }
.hs-m-back{ position:absolute; inset:0; background:rgba(15,20,18,.55); backdrop-filter:blur(2px); }
.hs-m-box{ position:relative; z-index:1; width:100%; max-width:440px; background:#fff; border:1px solid var(--line);
  border-radius:18px; box-shadow:0 40px 80px -24px rgba(0,0,0,.5); padding:22px 22px 24px;
  max-height:92vh; overflow:auto; opacity:1; animation:hsMIn .22s ease; }
@keyframes hsMIn{ from{ opacity:0; transform:translateY(14px) scale(.98) } to{ opacity:1; transform:none } }
.hs-m-x{ position:absolute; inset-inline-end:14px; top:12px; width:34px; height:34px; border:none;
  background:#f2f2f2; border-radius:50%; font-size:22px; line-height:1; color:#555; cursor:pointer; }
.hs-m-x:hover{ background:#e6e6e6; color:#000; }
.hs-m-t{ font-size:19px !important; font-weight:900; margin:2px 30px 16px 0; color:#1b1b1b !important; }
.hs-m-sum{ background:#f6f6f7; border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin-bottom:16px; }
.hs-m-sum-h{ display:block; font-size:12px; color:#888; font-weight:700; margin-bottom:6px; }
.hs-m-sum-b{ display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; font-size:14px; color:#333; }
.hs-m-sum-b b{ color:#1b1b1b; font-weight:800; }
.hs-m-f{ display:block; margin-bottom:13px; }
.hs-m-f > span{ display:block; font-size:13px; font-weight:700; color:#444; margin-bottom:6px; }
.hs-m-f input{ width:100%; box-sizing:border-box; height:48px; border:1px solid var(--line); border-radius:12px;
  padding:0 14px; font-size:15px; font-family:inherit; background:#fff; color:#1b1b1b; transition:border-color .15s; }
.hs-m-f input:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,162,39,.15); }
.hs-m-info{ font-size:14px; color:#444; margin:0 0 12px; }
.hs-m-info b{ color:#1b1b1b; }
.hs-m-err{ min-height:18px; color:#c0392b; font-size:13px; font-weight:700; margin:2px 0 10px; }
.hs-m-go{ display:block; width:100%; box-sizing:border-box; text-align:center; height:50px; line-height:50px;
  border:none; border-radius:12px; font-family:inherit; font-size:16px; font-weight:800; cursor:pointer;
  color:#1b1508; text-decoration:none;
  background:linear-gradient(135deg,var(--gold),var(--gold-400)); transition:filter .15s; }
.hs-m-go:hover{ filter:brightness(1.05); }
.hs-m-go:disabled{ opacity:.6; cursor:default; }
.hs-m-row2{ display:flex; justify-content:space-between; margin-top:12px; }
.hs-m-link{ background:none; border:none; color:#8a6d16; font-family:inherit; font-size:13.5px; font-weight:700;
  cursor:pointer; padding:4px; }
.hs-m-link:hover{ text-decoration:underline; }
.hs-m-done{ text-align:center; padding:6px 0 2px; }
.hs-m-check{ width:64px; height:64px; margin:4px auto 14px; border-radius:50%; background:#faf6e8;
  color:#c9a227; font-size:34px; line-height:64px; font-weight:900; }
.hs-m-code{ display:inline-flex; align-items:center; gap:10px; background:#f6f6f7; border:1px dashed var(--gold);
  border-radius:12px; padding:12px 18px; margin:6px 0 14px; }
.hs-m-code span{ font-size:13px; color:#777; font-weight:700; }
.hs-m-code b{ font-size:22px; font-weight:900; color:#1b1b1b; letter-spacing:1px; }
.hs-m-done p{ color:#555; font-size:14px; margin:0 0 18px; line-height:1.8; }

/* ── واپسین ردِ سبز: عنوانک‌ها و دایره‌های شمارهٔ گام → طلایی/خنثی ── */
.eyebrow{ color:#5c470e !important; background:rgba(201,162,39,.18) !important;
  border:1px solid rgba(201,162,39,.5) !important; font-weight:800 !important; }
.hm-step-n{ background:linear-gradient(135deg,var(--gold),var(--gold-600)) !important; color:#1b1508 !important; }

/* ══════════════════════════════════════════════════════════════════════
   حذفِ کاملِ سبز از کلِ سایت + هیروِ روشن  (۱۴۰۵/۰۵ — غلبهٔ نهاییِ نهایی)
   کلِ مقیاسِ سبز به خاکستری/مشکیِ خنثی نگاشته می‌شود؛ طلایی و قرمز می‌مانند.
   ══════════════════════════════════════════════════════════════════════ */
:root,
:root[data-theme="light"],
:root[data-theme="dark"]{
  /* مقیاسِ «سبز» → خاکستری/مشکیِ خنثی (هیچ ته‌رنگِ سبزی نمی‌ماند) */
  --g-900:#1b1b1b; --g-800:#2a2a2a; --g-700:#3d3d3d; --g-600:#5c5c5c;
  --g-100:#eef0ef; --g-050:#f6f6f7;
  /* توکن‌های سبزِ قدیمیِ style.css */
  --green-deep:#1c1c1c; --green-mid:#454545; --green-soft:#f3f3f3;
  --bg-deep:#ffffff; --bg-deep-2:#f5f5f5;
}

/* ── هیروِ روشن: صحنه دیگر سبز نیست، پس پس‌زمینه و پوششِ تیره هم روشن می‌شوند ── */
.hero.has-scene{ background:linear-gradient(180deg,#eef2f4,#f6f3ec) !important; }
.hero.has-scene::after{ background:linear-gradient(180deg,
    rgba(0,0,0,0) 0%, rgba(0,0,0,0) 55%, rgba(20,20,20,.06) 100%) !important; }
/* متنِ هیرو روی صحنهٔ روشن → تیره و خوانا (نه سفید) */
.hero.has-scene h1,
.hero.has-scene .hero-title,
.hero.has-scene [class*="title"],
.hero.has-scene p{ color:#1b1b1b !important; text-shadow:none !important; }

/* ── دکمه‌های شناورِ تماس (FAB) و نوارِ چسبانِ پایین: سبز → طلایی/خنثی ── */
.kg-call-fab, .kg-bale-fab, .kgc-fab{
  background:linear-gradient(135deg,var(--gold),var(--gold-600)) !important;
  color:#1b1508 !important; box-shadow:0 8px 24px rgba(0,0,0,.28) !important; }
.kg-bar .kg-bar-2{ background:#2a2a2a !important; color:#fff !important; }
.kg-bar .kg-bar-1{ background:linear-gradient(135deg,var(--gold),var(--gold-400)) !important; color:#1b1508 !important; }

/* پس‌زمینهٔ پایهٔ هیرو (پیش از بارگذاریِ صحنه) روشن بماند — بدونِ فلَشِ سبز */
.hero{ background:linear-gradient(180deg,#eef2f4,#f6f3ec) !important; }
.hero *{ } /* جای‌نگه‌دار */

/* ویجتِ گفتگو (تزریقیِ chat-widget.js) — سرآیند/دکمه‌های سبز → طلایی */
[class*="chat"] [style*="155c41" i],
[class*="chat"] [style*="0b3d2e" i]{ background:var(--gold) !important; }

/* ═══ بنرِ «رزرو دربستِ اتوبوس عراق» در صفحهٔ اصلی — تیترِ سفید روی نوارِ تیره ═══ */
.hm-charter h2{ color:#fff !important; }

/* ═══ خوانایی (۱۴۰۵/۰۵/۰۹): تیترِ ستون‌های فوتر پررنگ و مشکی، جدا از لینک‌ها ═══ */
.kg-footer-col h4{ color:#1b1b1b !important; font-size:14.5px !important; font-weight:900 !important; opacity:1 !important; }
/* لینک‌های داخل متنِ مقالات: طلاییِ تیره‌تر تا روی زمینهٔ روشن خوانا باشد */
main p a, main li a, .section p a{ color:#8a6d16 !important; text-decoration-color:rgba(138,109,22,.45); }

/* ═══════════════════════════════════════════════════════════════
   صحنهٔ هدر — انیمیشن فقط و فقط با SMIL (داخلِ خودِ images/hero-scene.svg)
   ═══════════════════════════════════════════════════════════════
   ⚠️ این‌جا هیچ @keyframes یا animation برای صحنه نگذارید.

   چرا: حرکتِ خودرو، چرخشِ چرخ‌ها و سوارشدنِ مسافران هر سه با SMIL
   (<animateTransform> و <animate>) داخلِ خودِ SVG انجام می‌شوند. اگر CSS
   هم روی همان عنصرها transform بگذارد، **CSS بر صفتِ transform مقدم است**
   و صفت را باطل می‌کند؛ نتیجه‌اش همان چیزی است که روی موبایل دیده شد:
   چرخ‌ها از خودرو جدا می‌شوند و وسطِ تصویر می‌چرخند.

   روی دسکتاپِ ما این باگ پنهان می‌ماند، چون مرورگر اغلب
   prefers-reduced-motion: reduce دارد و CSS اجرا نمی‌شود — ولی گوشیِ زائر
   چنین چیزی ندارد و هر دو موتور با هم می‌دوند.

   بلوکِ قبلی علاوه بر این تداخل، **آکولادهای ناموازن** هم داشت (بازماندهٔ
   یک ویرایشِ قدیمی) و پارسرِ CSS از همان‌جا به بعد قاعده‌ها را می‌بلعید —
   دلیلِ «در موبایل CSS به‌درستی کار نمی‌کند».
   ═══════════════════════════════════════════════════════════════ */

/* هدرِ نقاشی: هیچ ردّی از اسلایدر نماند — فلش‌ها، نقطه‌ها، کپشن و خطِ زیرش */
.hero.has-scene .hero-arrow,
.hero.has-scene .hero-dots,
.hero.has-scene .hero-caption,
.hero.has-scene [style*="height:2px"]{ display:none !important; }

/* ═══ تب‌های ویجتِ رزرو: گزینهٔ انتخاب‌شده کاملاً مشخص باشد ═══ */
.hs .hs-tab{ transition:background .2s ease, color .2s ease, box-shadow .2s ease, transform .12s ease; }
.hs .hs-tab:active{ transform:scale(.96); }
.hs .hs-tab.on,
.hs .hs-tab[aria-selected="true"]{
  background:linear-gradient(135deg,#f0d685,#c9a227) !important;
  color:#1b1508 !important;
  font-weight:800 !important;
  box-shadow:0 10px 22px -10px rgba(201,162,39,.65), inset 0 1px 0 rgba(255,255,255,.4) !important;
  border-color:transparent !important;
}
.hs .hs-tab.on img, .hs .hs-tab[aria-selected="true"] img{ filter:brightness(.2); }

/* ═══ صحنهٔ هدر: هرچه وسیلهٔ انتخابی بزرگ‌تر، زائران و پرچم‌های بیشتری «روشن» می‌شوند ═══
   رده‌ها: تاکسی=۱، خودروی شخصی=۲، ون=۳، مینی‌بوس=۴، اتوبوس=۵ — تعویضِ وسیله، روشناییِ قبلی را خودکار برمی‌گرداند */
.kg-hero-scene .kg-person{ transition:fill .45s ease; }
.kg-hero-scene .kg-flag{ opacity:.4; filter:saturate(.25); transition:opacity .45s ease, filter .45s ease; }
.hero[data-hs-veh="taxi"]     .kg-hero-scene .kg-person:is(.kg-t1),
.hero[data-hs-veh="transfer"] .kg-hero-scene .kg-person:is(.kg-t1,.kg-t2),
.hero[data-hs-veh="van"]      .kg-hero-scene .kg-person:is(.kg-t1,.kg-t2,.kg-t3),
.hero[data-hs-veh="minibus"]  .kg-hero-scene .kg-person:is(.kg-t1,.kg-t2,.kg-t3,.kg-t4),
.hero[data-hs-veh="bus"]      .kg-hero-scene .kg-person:is(.kg-t1,.kg-t2,.kg-t3,.kg-t4,.kg-t5){ fill:#b5892f; }
.hero[data-hs-veh="taxi"]     .kg-hero-scene .kg-flag:is(.kg-t1),
.hero[data-hs-veh="transfer"] .kg-hero-scene .kg-flag:is(.kg-t1,.kg-t2),
.hero[data-hs-veh="van"]      .kg-hero-scene .kg-flag:is(.kg-t1,.kg-t2,.kg-t3),
.hero[data-hs-veh="minibus"]  .kg-hero-scene .kg-flag:is(.kg-t1,.kg-t2,.kg-t3,.kg-t4),
.hero[data-hs-veh="bus"]      .kg-hero-scene .kg-flag:is(.kg-t1,.kg-t2,.kg-t3,.kg-t4,.kg-t5){ opacity:1; filter:saturate(1); }

/* ═══════════════════════════════════════════════════════════════
   لایهٔ پرداختِ طراحی (۱۴۰۵/۰۵/۰۹) — خروجیِ ادغام‌شدهٔ منتقدانِ طراحی
   تایپوگرافی فارسی، مقیاسِ یکدستِ تیترها، ریتمِ عمودی، ترازِ اعداد
   ═══════════════════════════════════════════════════════════════ */
h1, h2, h3, h4, h5 { letter-spacing: 0 !important; }

.eyebrow, .section-head .eyebrow {
  letter-spacing: 0 !important;
  padding: 5px 16px;
  border-radius: 999px;
  margin-block-end: 0;
}

.page-hero h1 {
  font-size: clamp(30px, 4.6vw, 46px) !important;
  line-height: 1.45 !important;
}
.page-hero h1::after { margin-top: 18px !important; }
.page-hero p {
  font-size: clamp(15px, 1.8vw, 17.5px) !important;
  text-wrap: balance;
  line-height: 2;
}

.hm-quick-h { font-size: clamp(22px, 3.1vw, 33px); }
.hm-quick-s { font-size: 17px; }

.hm-step-grid h3, .hm-pay-c h3, .hm-trust-c h3 { font-size: 17px; }
.hm-svc-card h3, .hm-dest-c h3 { font-size: 18px; }

.hm-pay-c b { font-size: 34px; }
.stat .num, .stat-card .num, .hm-pay-c b { font-variant-numeric: tabular-nums; }

main p { font-size: 16.5px; line-height: 2; }
.hm-svc-card p { font-size: 14.5px; }
.hm-step-grid p, .hm-dest-c p { font-size: 14px; }

.kg-footer-col a { font-size: 13.5px; }
.kg-footer-brand p { font-size: 13.5px; }
.kg-footer-bottom { font-size: 12.5px; }
.kg-footer .kg-footer-col {
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 0;
  margin: 0;
  max-width: none;
}

.stat-strip { margin-block-start: 0; }
.section, main .section { padding-block: clamp(var(--s10), 5vw, var(--s16)); }

@media (min-width: 720px) {
  .hm-dest-c p { min-height: 52px; }
}

/* ═══════════════════════════════════════════════════════════════
   برنامه‌ریزِ سفر و صفحاتِ خدمات (svc) — نظم و خوانایی (۱۴۰۵/۰۵/۱۰)
   ═══════════════════════════════════════════════════════════════ */
/* هدرِ خدمات: روشن و هماهنگ با تمِ سفید — متنِ تیرهٔ خوانا */
.svc-hero{ background:linear-gradient(180deg,#f7f5ef,#eee8d8) !important; }
.svc-hero h1{ color:#1b1b1b !important; text-shadow:none !important; }
.svc-hero .svc-lead{ color:#5c5c5c !important; }
.svc-hero .svc-crumb, .svc-hero .svc-crumb a{ color:#8a7a55 !important; }
.svc-hero .svc-crumb b{ color:#1b1b1b !important; }

/* نوارِ CTA تیره: متنش روشن بماند (قانونِ سراسریِ تیترِ تیره اینجا غلط بود) */
.kg-cta-box h2{ color:#fff !important; }
.kg-cta-box p{ color:#d8d5cc !important; }

/* کارت‌های وسیله: پنج‌تاییِ منظم روی دسکتاپ، محتوا وسط‌چین */
@media(min-width:960px){ .tp-veh{ grid-template-columns:repeat(5,1fr) !important; } }
.tp-veh-card{ align-items:center !important; text-align:center !important; }

/* کارتِ روز: قاب و سربرگِ منظم — نشانِ روز | تاریخ | دکمهٔ حذف در یک ردیف */
.tp-day{ border:1.5px solid #e7e0cd !important; border-radius:16px !important; background:#fff !important;
  box-shadow:0 12px 30px -22px rgba(0,0,0,.3) !important; overflow:hidden; }
.tp-day-head{ display:flex !important; align-items:center !important; gap:12px !important; flex-wrap:wrap;
  padding:12px 16px !important; background:#faf7ef !important; border-bottom:1px solid #eee5cf !important; position:static !important; }
.tp-day-badge{ position:static !important; transform:none !important; order:0;
  display:inline-flex !important; align-items:center; gap:6px;
  background:linear-gradient(135deg,#f0d685,#c9a227) !important; color:#1b1508 !important;
  border-radius:999px !important; padding:7px 16px !important; font-weight:800 !important; font-size:14px !important;
  box-shadow:0 6px 14px -6px rgba(201,162,39,.5); }
.tp-day-when{ order:1; display:inline-flex !important; align-items:center !important; gap:10px !important; flex:1; flex-wrap:wrap; }
input.tp-day-date{ width:150px !important; font-size:16px !important; font-weight:800 !important;
  padding:9px 12px !important; margin:0 !important; border-radius:10px !important; }
.tp-day-greg{ display:inline-block !important; font-size:12px !important; color:#8a8474 !important; margin:0 !important; }
.tp-day-del{ order:2; margin-inline-start:auto !important; width:36px !important; height:36px !important;
  border-radius:10px !important; border:1px solid #eee !important; background:#fff !important;
  color:#a13a3a !important; font-size:16px !important; cursor:pointer; position:static !important; transform:none !important; }
.tp-day-del:hover{ background:#a13a3a !important; color:#fff !important; }

/* حالتِ خالیِ روز: پیامِ تمیز به‌جای نقطه‌های سرگردان */
.tp-empty{ border:1.5px dashed #dccfa8 !important; background:#fbf8f0 !important; border-radius:12px !important;
  padding:20px !important; color:#8a8474 !important; text-align:center !important; }

/* کارت‌های «خدمات مرتبط»: آیکون و تیتر در یک خط، متنِ کامل */
.kg-related-t{ display:flex !important; align-items:center; gap:8px; }
.kg-related-t .kg-ico{ flex:0 0 20px; }
/* فیلد تاریخ روز: جمع‌وجور و هم‌قد ردیف */
input.tp-day-date{ height:46px !important; }
.tp-day-when{ flex-direction:row !important; }

/* ═══════════════════════════════════════════════════════════════
   ویجتِ رزروِ صفحهٔ اصلی — نسخهٔ چندمسیره (۱۴۰۵/۰۵/۱۰)
   هر مسیر یک کارتِ مستقلِ مرزدار است، شمارندهٔ وسیله یک کنترلِ
   پیل‌شکل با آیکونِ همان وسیله، و برآوردِ قیمت کارتِ جدا با نوارِ طلایی.
   ═══════════════════════════════════════════════════════════════ */

/* ── کارتِ هر مسیر: مرزِ پررنگ و کاملاً مشخص ── */
.hs .hs-legs{ display:flex; flex-direction:column; gap:14px; }
.hs .hs-leg{
  background:#fcfaf5; border:2px solid #cfc4a8; border-radius:14px;
  padding:13px 14px 14px; position:relative;
  box-shadow:0 1px 0 #fff inset, 0 2px 8px rgba(60,50,20,.06);
  transition:border-color .18s ease, box-shadow .18s ease;
}
.hs .hs-leg:focus-within{ border-color:#c9a227; box-shadow:0 0 0 3px rgba(201,162,39,.18); }
/* در حالتِ یک‌طرفه، کارتِ تکی قابِ اضافه نگیرد (کارتِ بیرونی کافی است) */
.hs .hs-legs:has(> .hs-leg:only-child) > .hs-leg{
  background:transparent; border:0; padding:0; box-shadow:none;
}
.hs .hs-leg-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:8px; margin:0 0 11px; padding-bottom:9px;
  border-bottom:2px solid #e2d8bf;
}
.hs .hs-leg-n{
  font-size:12.5px; font-weight:900; color:#5f4a0c; letter-spacing:0;
  background:linear-gradient(135deg,#f3e3ae,#e8d190);
  border:1.5px solid #c9a227; border-radius:999px; padding:4px 13px;
}

/* ── فیلدهای داخلِ هر بلوک: کادرِ مشخص، نه لبهٔ محو ── */
.hs .hs-fld > input,
.hs .hs-fld input[type="text"],
.hs .hs-fld input[type="time"]{
  border:1.5px solid #cfc4a8 !important;
  background:#fff !important;
  border-radius:10px !important;
}
.hs .hs-fld > input:focus,
.hs .hs-fld input:focus{
  border-color:#c9a227 !important;
  box-shadow:0 0 0 3px rgba(201,162,39,.15) !important;
  outline:none !important;
}
.hs .hs-fld > span{ color:#5b5449; font-weight:800; }
.hs .hs-swap{
  border:1.5px solid #cfc4a8 !important; background:#fff !important;
  color:#8a6d16 !important; border-radius:10px !important;
}
.hs .hs-swap:hover{ background:#c9a227 !important; color:#fff !important; border-color:#c9a227 !important; }
/* خودِ کارتِ ویجت هم مرزِ روشن‌تری بگیرد */
.hs .hs-card{ border:2px solid #d5cbb3 !important; }
.hs .hs-trip-btn{ border:1.5px solid #cfc4a8 !important; background:#fff !important; border-radius:10px !important; }
.hs .hs-leg-x{
  width:28px; height:28px; border-radius:9px; cursor:pointer;
  border:1.5px solid #eddcdc; background:#fdf6f6; color:#a33;
  font-size:14px; font-weight:800; line-height:1; transition:.15s;
}
.hs .hs-leg-x:hover{ background:#a33; border-color:#a33; color:#fff; }

/* ── ساعتِ هر مسیر ── */
.hs .hs-time input{
  font-variant-numeric:tabular-nums; letter-spacing:.5px;
}

/* ── دکمهٔ افزودنِ مسیر ── */
.hs .hs-addleg{
  display:block; width:100%; margin-top:12px; cursor:pointer;
  padding:12px 16px; border-radius:13px;
  border:1.5px dashed #d8c98a; background:#fdfaf2;
  color:#8a6d16; font-family:inherit; font-weight:800; font-size:13.5px;
  transition:background .16s ease, border-color .16s ease, color .16s ease;
}
.hs .hs-addleg:hover{ background:#f7edcf; border-color:#c9a227; color:#6b5410; }
.hs .hs-addleg:active{ transform:scale(.99); }

/* ── نوارِ پایین: شمارندهٔ وسیله + دکمهٔ ثبت ── */
.hs .hs-foot{
  display:flex; align-items:flex-end; gap:14px; flex-wrap:wrap;
  margin-top:14px; padding-top:14px; border-top:1.5px solid #efe9db;
}

/* شمارندهٔ وسیله — برچسب کنارِ خودِ کنترل، جمع‌وجور و هم‌ردیفِ دکمهٔ ثبت */
.hs .hs-units{
  display:inline-flex; align-items:center; gap:9px; flex-wrap:nowrap;
  background:#fcfaf5; border:2px solid #cfc4a8; border-radius:13px;
  padding:6px 12px 6px 6px; height:52px; box-sizing:border-box;
}
.hs .hs-units-l{
  font-size:13px; font-weight:800; color:#4a443a; white-space:nowrap;
}
.hs .hs-step{
  display:inline-flex; align-items:stretch; height:38px;
  background:#fff; border:1.5px solid #cfc4a8; border-radius:10px;
  overflow:hidden;
}
.hs .hs-step-b{
  width:34px; border:0; cursor:pointer; background:#f6f1e4; color:#8a6d16;
  font:900 18px/1 inherit; transition:background .14s ease, color .14s ease;
}
.hs .hs-step-b:hover:not(:disabled){ background:#c9a227; color:#fff; }
.hs .hs-step-b:disabled{ opacity:.35; cursor:default; }
.hs .hs-step-v{
  display:flex; align-items:center; gap:5px; padding:0 8px;
  border-inline:1.5px solid #e2d8bf; justify-content:center;
}
.hs .hs-step-v img{ width:19px; height:19px; opacity:.85; flex:none; }
.hs .hs-step-v input{
  width:26px; border:0; background:transparent; text-align:center; padding:0;
  font:900 17px/1 inherit; color:#1b1b1b; font-variant-numeric:tabular-nums;
}
.hs .hs-step-v input:focus{ outline:none; }
.hs .hs-step-v.is-bump{ animation:hsBump .26s ease; }
@keyframes hsBump{ 0%{transform:scale(1)} 45%{transform:scale(1.11)} 100%{transform:scale(1)} }
.hs .hs-foot .hs-go{ flex:1; min-width:180px; height:52px; }

/* ── کارتِ برآوردِ قیمت ── */
.hs .hs-quote.is-on{ margin-top:12px; }
.hs .hs-q{
  background:linear-gradient(180deg,#fffdf7,#fbf6e8);
  border:1.5px solid #e4d3a0; border-radius:15px;
  padding:13px 15px 14px; box-shadow:0 3px 14px rgba(201,162,39,.10);
}
.hs .hs-q-h{
  font-size:12.5px; font-weight:900; color:#8a6d16;
  padding-bottom:9px; margin-bottom:4px; border-bottom:1px dashed #e4d3a0;
}
.hs .hs-q-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:8px 0; border-bottom:1px solid rgba(228,211,160,.42);
  font-size:13px; color:#3b3416;
}
.hs .hs-q-row:last-of-type{ border-bottom:0; }
.hs .hs-q-leg{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; min-width:0; }
.hs .hs-q-leg b{
  width:20px; height:20px; border-radius:50%; flex:none;
  background:#c9a227; color:#fff; font-size:11px; font-weight:900;
  display:inline-flex; align-items:center; justify-content:center;
}
.hs .hs-q-when{ font-style:normal; font-size:11.5px; color:#8a7c4e; }
.hs .hs-q-p{ font-weight:800; white-space:nowrap; font-variant-numeric:tabular-nums; }
.hs .hs-q-p u{ text-decoration:none; font-size:11.5px; font-weight:700; opacity:.75; }
.hs .hs-q-p em{ font-style:normal; font-size:12px; font-weight:700; color:#8a7c4e; }
.hs .hs-q-mul{ color:#8a7c4e; font-size:12.5px; }
.hs .hs-q-sum{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-top:10px; padding-top:11px; border-top:1.5px solid #e4d3a0;
  font-size:13.5px; font-weight:800; color:#3b3416;
}
.hs .hs-q-sum b{ font-size:22px; color:#a9821c; font-variant-numeric:tabular-nums; }

/* خلاصهٔ مودال: جمعِ کل برجسته */
.hs-m-sum .hs-m-tot{ color:#8a6d16; font-weight:800; }
.hs-m-sum .hs-m-tot b{ font-size:16px; color:#a9821c; }

/* ── موبایل ── */
@media(max-width:640px){
  .hs .hs-foot{ gap:11px; }
  .hs .hs-units{ width:100%; justify-content:space-between; height:50px; }
  .hs .hs-foot .hs-go{ width:100%; min-width:0; height:50px; }
  .hs .hs-leg{ padding:12px 11px 12px; }
}

/* ═══ انتخابِ مدلِ وسیله — کارتِ عکس‌دار با قیمتِ همان مدل ═══
   جای فهرستِ کشویی را گرفت: زائر خودِ خودرو را می‌بیند و قیمتِ همان مدل
   برای همان برنامهٔ سفر روی کارت نوشته است. عکس‌ها و قیمت از CMS می‌آیند. */
/* ═══ انتخابِ مدلِ وسیله — یک «گزینهٔ فرم»، نه یک گالری ═══
   قبلاً کارت‌های بزرگِ عکس‌دار بودند و بخشِ اصلیِ فرم را می‌بلعیدند. حالا یک
   ردیفِ فشرده‌ی چیپ‌مانند است: عکسِ کوچک + نام + قیمت. خواندنی می‌مانَد،
   معلوم است که «انتخاب‌کردنی» است، ولی صفحه را شلوغ نمی‌کند.
   روی صفحهٔ باریک به‌جای شکستن، افقی اسکرول می‌شود. */
.hs .hs-models{ margin:4px 0 0; }
.hs .hs-models-h{
  font-size:12px; font-weight:800; color:#7a7364; margin:0 2px 7px;
}
.hs .hs-models-g{
  display:flex; gap:8px; overflow-x:auto; padding:2px 2px 6px;
  scrollbar-width:thin; scroll-snap-type:x proximity;
}
.hs .hs-models-g::-webkit-scrollbar{ height:6px; }
.hs .hs-models-g::-webkit-scrollbar-thumb{ background:#ddd5c0; border-radius:6px; }
.hs .hs-car{
  flex:0 0 auto; scroll-snap-align:start;
  display:flex; align-items:center; gap:9px; text-align:start; cursor:pointer;
  padding:7px 12px 7px 8px; background:#fff; border:1.5px solid #e3ddcd; border-radius:12px;
  font-family:inherit; transition:border-color .16s, box-shadow .16s, background .16s;
  max-width:250px;
}
.hs .hs-car:hover{ border-color:#c9a227; background:#fffdf6; }
.hs .hs-car.on{
  border-color:#c9a227; background:#fdf8ea;
  box-shadow:0 0 0 2px rgba(201,162,39,.22);
}
.hs .hs-car-i{
  position:relative; flex:none; width:54px; height:40px; border-radius:8px;
  overflow:hidden; background:#f4f1e8; display:flex; align-items:center; justify-content:center;
}
.hs .hs-car-i img{ width:100%; height:100%; object-fit:cover; display:block; }
.hs .hs-car-noi{ font-size:18px; color:#c2b998; }
.hs .hs-car-noi img{ width:22px; height:22px; object-fit:contain; opacity:.5; }
/* دکمهٔ «دیدنِ عکس‌ها» — ریز و گوشهٔ خودِ بندانگشتی */
.hs .hs-car-n{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.45); color:#fff; font-size:13px; font-style:normal;
  opacity:0; transition:opacity .16s; cursor:zoom-in;
}
.hs .hs-car-n b{ display:none; }
.hs .hs-car-i:hover .hs-car-n{ opacity:1; }
.hs .hs-car-b{ display:block; min-width:0; }
.hs .hs-car-t{
  display:block; font-size:12.5px; font-weight:800; color:#1b1b1b; line-height:1.5;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:150px;
}
.hs .hs-car-s{
  display:inline-block; font-style:normal; font-size:10.5px; font-weight:700;
  color:#8a8371; margin-top:1px;
}
/* توضیحِ بلندِ مدل در حالتِ فشرده جا ندارد — روی هاور در تیتر می‌آید */
.hs .hs-car-d{ display:none; }
.hs .hs-car-p{
  display:block; margin-top:2px; font-size:13px; font-weight:900; color:#8a6d0c;
  direction:ltr; text-align:start;
}
.hs .hs-car-p u{ text-decoration:none; font-size:10px; font-weight:800; color:#a89a6a; }
.hs .hs-car-p em{ font-style:normal; font-size:10.5px; font-weight:700; color:#a09781; }
.hs .hs-q-car{
  font-style:normal; font-size:11.5px; font-weight:800; color:#8a6d0c;
  background:#faf4e2; border-radius:20px; padding:2px 9px; margin-inline-start:8px;
}
@media(max-width:640px){
  .hs .hs-car{ padding:6px 10px 6px 7px; max-width:210px; }
  .hs .hs-car-i{ width:46px; height:34px; }
  .hs .hs-car-t{ max-width:120px; font-size:12px; }
  /* روی لمسی هاور نیست: دکمهٔ عکس همیشه کم‌رنگ دیده شود */
  .hs .hs-car-n{ opacity:.85; background:rgba(0,0,0,.3); font-size:11px; }
}

/* ═══ بیمهٔ مسافرتی در گامِ تأییدِ سفارش ═══ */
.hs-m-insw{ margin:12px 0 4px; }
.hs-m-ins{
  display:flex; align-items:flex-start; gap:10px; cursor:pointer;
  padding:12px 13px; border:1.5px solid #e3ddcd; border-radius:13px; background:#fbf9f3;
  transition:border-color .18s, background .18s;
}
.hs-m-ins:hover{ border-color:#c9a227; }
.hs-m-ins.on{ border-color:#c9a227; background:#fdf8ea; }
.hs-m-ins input{ width:19px; height:19px; margin-top:2px; accent-color:#c9a227; flex:none; }
.hs-m-ins-b{ flex:1; min-width:0; }
.hs-m-ins-b b{ display:block; font-size:13.5px; font-weight:800; color:#1b1b1b; }
.hs-m-ins-b i{ display:block; font-style:normal; font-size:11.5px; color:#7a7364; line-height:1.8; margin-top:3px; }
.hs-m-ins-p{
  flex:none; font-size:12px; font-weight:800; color:#8a6d0c;
  background:#f4ecd6; border-radius:20px; padding:4px 10px; white-space:nowrap;
}
.hs-m-insr{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin-top:9px; padding:10px 13px; border-radius:12px; background:#f4f1e8;
}
.hs-m-insr > span{ font-size:12.5px; font-weight:800; color:#5c564a; }
.hs-m-insr .hs-step{
  display:flex; align-items:center; background:#fff; border:1.5px solid #cfc4a8; border-radius:10px;
  overflow:hidden; height:38px;
}
.hs-m-insr .hs-step-b{
  width:34px; height:100%; border:none; background:transparent; cursor:pointer;
  font-size:17px; font-weight:800; color:#5c564a;
}
.hs-m-insr .hs-step-b:disabled{ opacity:.35; cursor:default; }
.hs-m-insr .hs-step-v{ display:flex; align-items:center; padding:0 4px; }
.hs-m-insr .hs-step-v input{
  width:46px; border:none; text-align:center; font-family:inherit;
  font-size:14px; font-weight:800; background:transparent; color:#1b1b1b;
}
.hs-m-insr .hs-step-v input:focus{ outline:none; }
.hs-m-inssum{
  margin-inline-start:auto; font-size:14.5px; font-weight:900; color:#8a6d0c; direction:ltr;
}

/* ═══════════════════════════════════════════════════════════════
   لایهٔ «مرزبندی و تمایزِ بخش‌ها» (۱۴۰۵/۰۵/۱۰)
   ایراد: همهٔ بخش‌های صفحه روی یک زمینهٔ سفیدِ یکنواخت بودند و چشم
   نمی‌فهمید کجا یک موضوع تمام و موضوعِ بعد شروع می‌شود.
   راهکار: (۱) زمینهٔ یک‌درمیانِ ملایم، (۲) خطِ جداکنندهٔ طلاییِ نازک،
   (۳) قابِ روشن برای کارت‌ها، (۴) تیترِ هر بخش با نشانِ طلایی.
   همه فقط روی صفحهٔ اصلی و بخش‌های استانداردِ سایت — بی‌خطر برای
   صفحاتی که ادیتور دست‌کاری‌شان کرده.
   ═══════════════════════════════════════════════════════════════ */

/* ── ۱) زمینهٔ یک‌درمیان: بخش‌های زوج کرمِ ملایم می‌گیرند ── */
main > .section:nth-of-type(even),
main > section.section:nth-of-type(even){
  background:#faf7ef;
}
main > .section{
  position:relative;
  padding-block:clamp(38px, 5vw, 62px);
}

/* ── ۲) خطِ جداکنندهٔ ظریفِ طلایی بینِ بخش‌ها ── */
main > .section + .section::before{
  content:""; position:absolute; inset-inline:0; top:0; height:1px;
  background:linear-gradient(90deg,
    rgba(201,162,39,0) 0%,
    rgba(201,162,39,.38) 22%,
    rgba(201,162,39,.38) 78%,
    rgba(201,162,39,0) 100%);
}

/* ── ۳) تیترِ هر بخش: نشانِ طلاییِ کوتاه بالای عنوان ── */
.section-head{ position:relative; }
.section-head::before{
  content:""; display:block; width:44px; height:3px; border-radius:2px;
  background:linear-gradient(90deg,#c9a227,#f0d685);
  margin:0 auto 14px;
}
.section-head[style*="text-align:right"]::before,
.section-head[style*="text-align: right"]::before{ margin-inline:0 auto; }

/* ── ۴) کارت‌ها: قابِ روشن به‌جای شناوریِ بی‌مرز ── */
.hm-dest-c, .hm-pay-c, .hm-rt, .hm-quick-b, .stat-card,
.svc-card, .kg-related-c, .hm-step, .card{
  border:1.5px solid #e2dac8;
  border-radius:16px;
  background:#fff;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.hm-dest-c:hover, .hm-pay-c:hover, .hm-rt:hover, .hm-quick-b:hover,
.svc-card:hover, .kg-related-c:hover{
  border-color:#c9a227;
  box-shadow:0 8px 22px -12px rgba(201,162,39,.45);
  transform:translateY(-2px);
}
/* روی زمینهٔ کرمِ بخش‌های زوج، کارت سفید بماند تا جدا دیده شود */
main > .section:nth-of-type(even) .hm-dest-c,
main > .section:nth-of-type(even) .hm-pay-c,
main > .section:nth-of-type(even) .hm-rt,
main > .section:nth-of-type(even) .stat-card{ background:#fff; }

/* ── ۵) نوارِ آمار: جداکنندهٔ عمودی بینِ خانه‌ها ── */
.stat-strip{
  border:1.5px solid #e2dac8; border-radius:18px; overflow:hidden; background:#fff;
}
.stat-strip .stat-card{ border:0; border-radius:0; }
.stat-strip .stat-card + .stat-card{ border-inline-start:1.5px solid #eee7d7; }

/* ── ۶) فوتر: مرزِ بالا و ستون‌های جدا ── */
.kg-footer{ border-top:2px solid #e2dac8; }

/* لینکِ «برنامهٔ چندروزه» زیرِ ویجت: قبلاً سفید بود (برای زمینهٔ تیرهٔ هیرو) و
   حالا که کارت پایین‌تر از هیرو می‌نشیند، روی زمینهٔ روشن ناخوانا و چسبیده به
   تیترِ بعدی می‌افتاد. حالا یک دکمهٔ کوچکِ مرزدار است با فاصلهٔ کافی. */
.hs .hs-plan{
  display:inline-flex; align-items:center; gap:6px;
  margin:16px auto 4px; padding:9px 18px;
  background:#fff; border:1.5px solid #d8c98a; border-radius:999px;
  color:#8a6d16 !important; text-shadow:none !important;
  font-size:13px; font-weight:800;
  box-shadow:0 2px 8px rgba(0,0,0,.05);
  transition:background .16s ease, border-color .16s ease;
}
.hs{ display:flex; flex-direction:column; align-items:stretch; }
.hs .hs-plan{ align-self:center; }
.hs .hs-plan:hover{ background:#f7edcf; border-color:#c9a227; color:#6b5410 !important; }
.hs-host{ padding-bottom:18px; }

/* ── ساعتِ حرکت (فقط ساعتِ کامل، ۲۴ساعته) ── */
.hs .hs-time-s{
  height:46px; border:1.5px solid #cfc4a8; border-radius:10px; background:#fff;
  font-family:inherit; font-size:13px; font-weight:700; color:#1b1b1b;
  padding:0 8px; width:100%; box-sizing:border-box; cursor:pointer;
}
.hs .hs-time-s:focus{ outline:none; border-color:#c9a227; box-shadow:0 0 0 3px rgba(201,162,39,.15); }

/* ── جملهٔ خوانا زیرِ هر مسیر: «پنجشنبه ۲۵ شهریور ۱۴۰۵ — ساعتِ ۳ عصر» ── */
.hs .hs-when{
  margin-top:11px; padding:9px 12px; border-radius:10px;
  background:#f7f2e2; border:1px dashed #dcc98f;
  font-size:12.5px; font-weight:700; color:#6b5410; line-height:1.9;
}

/* ── مسیرِ ایرادکرده هنگامِ ثبت ── */
.hs .hs-leg.is-bad{
  border-color:#c0392b !important;
  box-shadow:0 0 0 3px rgba(192,57,43,.14) !important;
  animation:hsShake .32s ease;
}
@keyframes hsShake{ 0%,100%{transform:translateX(0)} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }

/* ── گامِ «تأییدِ برنامه» در پنجرهٔ ثبت ── */
.hs-m-note{
  margin:12px 0 4px; padding:11px 13px; border-radius:11px;
  background:#faf7ef; border:1px solid #e2dac8;
  font-size:12.5px; line-height:2; color:#4a443a;
}
.hs-m-spin{
  width:26px; height:26px; margin:12px auto 0; border-radius:50%;
  border:3px solid #eee3c4; border-top-color:#c9a227;
  animation:hsSpin .8s linear infinite;
}
@keyframes hsSpin{ to{ transform:rotate(360deg) } }

/* ═══════════════════════════════════════════════════════════════
   صفحهٔ پیگیری و پرداختِ رزرو (pages/track-reservation.html)
   ایراد: کاملاً سفید و بی‌قاب بود؛ برای صفحه‌ای که زائر مبلغِ چندده‌میلیونی
   را در آن می‌بیند، اعتمادبرانگیز نبود. حالا کارتِ مرزدار با سربرگِ تیره،
   فیلدهای درشت، و بلوکِ نتیجهٔ جداشده.
   ═══════════════════════════════════════════════════════════════ */
body .wrap{ max-width:900px; margin-inline:auto; padding:0 16px 40px; }

body .wrap > .card{
  background:#fff;
  border:2px solid #d5cbb3;
  border-radius:20px;
  box-shadow:0 14px 40px -22px rgba(60,50,20,.35);
  overflow:hidden;
  margin-top:-46px;               /* روی لبهٔ پایینِ هدر می‌نشیند */
  position:relative; z-index:5;
}
body .wrap > .card > .card-inner{ padding:26px 26px 28px; }
@media(max-width:640px){
  body .wrap > .card > .card-inner{ padding:20px 16px 22px; }
  body .wrap > .card{ margin-top:-26px; }
}

/* سربرگِ کارت */
body .wrap > .card > .card-inner::before{
  content:"🔎 استعلامِ وضعیتِ رزرو";
  display:block; margin:-26px -26px 20px; padding:14px 22px;
  background:linear-gradient(135deg,#2f2f2f,#191919);
  color:#f0d685; font-weight:900; font-size:14.5px; letter-spacing:0;
}
@media(max-width:640px){
  body .wrap > .card > .card-inner::before{ margin:-20px -16px 16px; padding:12px 16px; }
}

/* فیلدها */
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media(max-width:640px){ .field-row{ grid-template-columns:1fr; } }
.field-label{
  display:block; font-size:12.5px; font-weight:800; color:#5b5449; margin-bottom:7px;
}
#trackForm input{
  width:100%; box-sizing:border-box; height:52px; padding:0 14px;
  border:1.5px solid #cfc4a8; border-radius:12px; background:#fff;
  font-family:inherit; font-size:15px; font-weight:700; color:#1b1b1b;
  transition:border-color .16s ease, box-shadow .16s ease;
}
#trackForm input:focus{
  outline:none; border-color:#c9a227; box-shadow:0 0 0 3px rgba(201,162,39,.15);
}
.track-btn{
  width:100%; margin-top:16px; height:54px; cursor:pointer;
  border:0; border-radius:13px; font-family:inherit; font-weight:900; font-size:15.5px;
  background:linear-gradient(135deg,#f0d685,#c9a227 55%,#a9861c); color:#1b1508;
  box-shadow:0 10px 24px -10px rgba(201,162,39,.6), inset 0 1px 0 rgba(255,255,255,.45);
  transition:filter .15s ease, transform .1s ease;
}
.track-btn:hover{ filter:brightness(1.05); }
.track-btn:active{ transform:scale(.99); }
.track-btn:disabled{ opacity:.6; cursor:default; }

.track-error{
  display:none; margin-top:12px; padding:11px 14px; border-radius:11px;
  background:#fdeaea; border:1.5px solid #e0a0a0; color:#a23030;
  font-size:13px; font-weight:700; line-height:1.9;
}
.track-error.show{ display:block; }

/* بلوکِ نتیجه — با خطِ جداکننده از فرم */
#trackResult{ display:none; }
#trackResult.show{
  display:block; margin-top:22px; padding-top:22px;
  border-top:2px dashed #e2dac8;
}

/* راهنمای پایینِ صفحه: هم‌سبک با بقیهٔ سایت */
body .wrap ~ section > div[style*="border-radius:18px"]{
  border:1.5px solid #e2dac8 !important;
}

/* هدرِ صفحاتِ داخلی: متنِ سفیدِ قدیمی (برای زمینهٔ سبزِ تیره) روی زمینهٔ روشنِ
   تمِ جدید ناخوانا بود. صحنهٔ صفحهٔ اصلی کلاسِ has-scene می‌گیرد، پس فقط
   هدرِ صفحاتِ داخلی تیره می‌شود و صفحهٔ اصلی دست‌نخورده می‌ماند. */
.hero:not(.has-scene) h1{ color:#1b1b1b !important; text-shadow:none !important; }
.hero:not(.has-scene) .sub,
.hero:not(.has-scene) p{ color:#4a443a !important; text-shadow:none !important; }
.hero:not(.has-scene) .eyebrow-ar{ color:#8a6d16 !important; text-shadow:none !important; }
.hero:not(.has-scene) .divider-line{ opacity:.75; }

/* خلاصهٔ برنامه در پنجرهٔ تأیید: هر سطر جدا، جمعِ کل برجسته */
.hs-m-sum .hs-m-sum-b{ display:flex; flex-direction:column; gap:6px; align-items:stretch; }
.hs-m-sum .hs-m-sum-b > span{ display:block; font-size:13px; line-height:1.95; color:#3b3416; }
.hs-m-sum .hs-m-sum-b > b{ font-size:14px; color:#8a6d16; }
.hs-m-sum .hs-m-tot{
  margin-top:6px; padding-top:8px; border-top:1px dashed #e0cf8f;
  font-size:13.5px !important;
}

/* ── زیرگزینهٔ اتوبوس: دربستِ عراق / کاپوتاژ ── */
.hs .hs-kinds{ display:flex; gap:9px; flex-wrap:wrap; margin:0 0 9px; }
.hs .hs-kind{
  flex:1; min-width:180px; cursor:pointer; padding:11px 14px; border-radius:12px;
  border:1.8px solid #cfc4a8; background:#fff; color:#3b3416;
  font-family:inherit; font-weight:800; font-size:13.5px;
  display:flex; align-items:center; justify-content:center; gap:8px;
  transition:background .16s ease, border-color .16s ease, color .16s ease, transform .1s ease;
}
.hs .hs-kind:hover{ border-color:#c9a227; }
.hs .hs-kind:active{ transform:scale(.99); }
.hs .hs-kind.on{
  background:linear-gradient(135deg,#f0d685,#c9a227);
  border-color:#a9861c; color:#1b1508;
  box-shadow:0 6px 16px -8px rgba(201,162,39,.65);
}
.hs .hs-kind-note{
  margin:0 0 13px; padding:10px 13px; border-radius:11px;
  background:#faf7ef; border:1px solid #e2dac8;
  font-size:12.5px; line-height:2; color:#4a443a;
}

/* ── پرچمِ روی سقفِ اتوبوسِ صحنه ── */
.kg-hero-scene .kg-bflag{ display:none; }
.hero[data-hs-veh="bus"] .kg-hero-scene .kg-bflag-iq{ display:block; }
.hero[data-hs-veh="bus"][data-hs-kind="cabotage"] .kg-hero-scene .kg-bflag-ir{ display:block; }

/* ═══ صفحاتِ داخلی: مشخصاتِ ناوگان به‌جای فرمِ رزرو ═══
   رزرو فقط از فرمِ صفحهٔ اصلی انجام می‌شود؛ این‌جا فقط معرفیِ خودروها
   و یک دعوتِ روشن به همان فرم. */
.kgf{ max-width:960px; margin-inline:auto; }
.kgf-t{ font-size:clamp(20px,3vw,27px); margin:0 0 6px; color:#1b1b1b; }
.kgf-lead{ margin:0 0 20px; color:#4a443a; font-size:14px; line-height:2; }
.kgf-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(255px,1fr)); gap:14px; }
.kgf-card{
  background:#fff; border:1.5px solid #e2dac8; border-radius:16px; padding:15px 16px 16px;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.kgf-card:hover{
  border-color:#c9a227; transform:translateY(-2px);
  box-shadow:0 8px 22px -12px rgba(201,162,39,.45);
}
.kgf-head{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; padding-bottom:10px; border-bottom:1.5px solid #efe9db; }
.kgf-head h3{ margin:0; font-size:15.5px; color:#1b1b1b; }
.kgf-seats{
  margin-inline-start:auto; font-size:11.5px; font-weight:800; color:#8a6d16;
  background:#f7edcf; border:1px solid #e4d3a0; border-radius:999px; padding:3px 10px; white-space:nowrap;
}
.kgf-models{ list-style:none; margin:11px 0 0; padding:0; display:flex; flex-direction:column; gap:9px; }
.kgf-models li{ font-size:13px; color:#3b3416; line-height:1.9; }
.kgf-models li b{ font-weight:800; }
.kgf-models li i{
  font-style:normal; font-size:11px; font-weight:800; color:#8a6d16;
  background:#faf7ef; border:1px solid #e2dac8; border-radius:6px; padding:1px 7px; margin-inline-start:5px;
}
.kgf-models li span{ display:block; font-size:12px; color:#6b6459; }
.kgf-cta{
  margin-top:22px; padding:20px 22px; border-radius:18px; text-align:center;
  background:linear-gradient(135deg,#232323,#121212); border:1.5px solid #c9a227;
}
.kgf-cta p{ margin:0 0 14px; color:#e8e4da; font-size:13.5px; line-height:2; }
.kgf-btn{
  display:inline-block; padding:13px 30px; border-radius:14px; text-decoration:none;
  background:linear-gradient(135deg,#f0d685,#c9a227 55%,#a9861c); color:#1b1508;
  font-weight:900; font-size:15px;
  box-shadow:0 10px 24px -8px rgba(201,162,39,.55), inset 0 1px 0 rgba(255,255,255,.45);
}
.kgf-btn:hover{ filter:brightness(1.05); }

/* ═══ ماژولِ رزرو در صفحاتِ دیگر (بلوکِ «📅 فرم رزرو») ═══
   ویجت برای هدرِ صفحهٔ اصلی طراحی شده؛ این‌جا داخلِ یک قابِ روشن می‌نشیند
   تا در متنِ صفحه هم درست دیده شود. */
.kg-reserve-embed{
  max-width:1060px; margin-inline:auto; padding:22px 20px 24px;
  background:linear-gradient(180deg,#f6f2e6,#efe9d8);
  border:1.5px solid #ddd3b8; border-radius:22px;
  box-shadow:0 14px 40px -24px rgba(60,50,20,.4);
}
@media(max-width:640px){ .kg-reserve-embed{ padding:16px 12px 18px; border-radius:18px; } }
.kg-reserve-embed .hs-plan{ margin-bottom:0; }

/* جای‌نمایِ داخلِ ویرایشگر — روی خودِ سایت با فرمِ واقعی جایگزین می‌شود */
.kg-reserve-ph{
  display:flex; flex-direction:column; align-items:center; gap:6px;
  padding:34px 18px; border:2px dashed #cbbd93; border-radius:16px;
  background:#fffdf6; color:#6b5410; font-weight:900; font-size:15px; text-align:center;
}
.kg-reserve-ph span{ font-weight:600; font-size:12.5px; color:#8a7c5f; line-height:1.9; }
.kg-reserve-embed .hs ~ .kg-reserve-ph,
.kg-reserve-embed:has(.hs) .kg-reserve-ph{ display:none; }

/* ماژولِ رزروِ جاسازی‌شده: قابِ مخصوصِ هدر (منفیِ margin و پس‌زمینهٔ تیره)
   نباید داخلِ متنِ صفحه اعمال شود. */
.kg-reserve-embed.hs-host{
  margin-block-start:0; padding-inline:20px;
  background:linear-gradient(180deg,#f6f2e6,#efe9d8);
}
@media(max-width:900px){ .kg-reserve-embed.hs-host{ margin-block-start:0; } }
@media(max-width:640px){ .kg-reserve-embed.hs-host{ padding-inline:12px; } }

/* ═══════════════════════════════════════════════════════════════
   ممیزیِ ۹۶ صفحه (۱۴۰۵/۰۵/۱۰) — رفعِ دو بدفرمیِ سراسری
   ═══════════════════════════════════════════════════════════════ */

/* ۱) نوارِ سرصفحهٔ صفحاتِ داخلی: پس‌زمینه تیرهٔ ارثیِ تمِ سبز بود ولی قانونِ
      تمِ روشن همهٔ h1..h6 را سیاه می‌کرد ⇒ «عنوانِ سیاه روی زمینهٔ سیاه»
      و در ده‌ها صفحه تیترِ اصلی اصلاً دیده نمی‌شد. حالا نوار روشن است. */
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed){
  background:linear-gradient(160deg,#faf7ef 0%,#f2ece0 60%,#efe8da 100%);
  color:#1b1b1b;
  border-block-end:1px solid #e6ddc9;
}
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed)::before{
  background:radial-gradient(circle,rgba(201,162,39,.14),transparent 68%);
}
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) h1{
  color:#1b1b1b !important; text-shadow:none;
}
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) h2,
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) h3{
  color:#2a2a2a !important;
}
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) p{
  color:#4a443a !important;
}
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) .eyebrow,
main > section:first-of-type:not(.hero):not(.hm-quick):not(.svc-hero):not(.kg-reserve-embed) .eyebrow-ar{
  color:#8a6d16 !important;
}

/* ۲) آکاردئونِ پرسش‌ها: حالتِ بسته padding پایین داشت و چون overflow تا لبهٔ
      padding می‌بُرد، سطرِ اولِ پاسخ از کارت بیرون می‌زد و روی کارتِ بعدی
      می‌افتاد. حالا در حالتِ بسته هیچ فضای پایینی نیست. */
.faq-item .faq-a{
  max-height:0; overflow:hidden;
  padding-block-start:0; padding-block-end:0;
  transition:max-height .35s ease, padding .35s ease;
}
.faq-item.open .faq-a{
  max-height:1400px; padding-block-end:var(--s4);
}

/* کارتِ پرسش: تیترِ h2 مارجینِ ارثیِ سرتیتر داشت و کارت را بی‌دلیل بلند
   می‌کرد؛ ضمناً هیچ نشانه‌ای برای «باز می‌شود» نداشت. */
.faq-item .faq-q{ margin:0 !important; font-size:15.5px !important; }
.faq-item .faq-q::before{ content:none !important; }
.faq-item .faq-q::after{
  content:'▾'; margin-inline-start:auto; color:#a9861c; font-size:15px;
  transition:transform .28s ease; flex:0 0 auto;
}
.faq-item.open .faq-q::after{ transform:rotate(180deg); }
.faq-item.open{ border-color:#e0cf8f; box-shadow:0 8px 22px -14px rgba(201,162,39,.5); }
.faq-item .faq-a{ color:#4a443a; }

/* ۳) ورودیِ مخفیِ داخلِ کارت‌های انتخابی: absolute بود ولی کارت relative
      نبود، پس نسبت به صفحه جا می‌گرفت و با width:100% کلِ چیدمانِ صفحه را
      ۷۰۰ پیکسل جابه‌جا می‌کرد (صفحهٔ «اتوبوس داخل ایران» کاملاً دفرم بود). */
.type-card, .veh-card, .kg-pick-card{ position:relative; }
.type-card input[type="radio"], .type-card input[type="checkbox"],
.veh-card input[type="radio"], .veh-card input[type="checkbox"]{
  position:absolute; inset-block-start:0; inset-inline-start:0;
  width:1px !important; height:1px !important; opacity:0; pointer-events:none; margin:0;
}

/* ۴) آخرین سبزهای باقی‌مانده در استایلِ داخلیِ صفحات (تمِ سایت سبز ندارد) */
.ir-hero{
  background:radial-gradient(120% 130% at 50% 0%, #2f2f2f, #101010) !important;
}
.price-box{
  background:linear-gradient(135deg,#faf7ef,#f3ede0) !important;
  border-color:#d9cfae !important;
}

/* ۵) نوارهای عمداً تیره: قانونِ سراسریِ «همهٔ تیترها سیاه» متنشان را
      نامرئی می‌کرد. این‌جا صریحاً روشن می‌شوند. */
.ir-hero h1, .ir-hero h2, .ir-hero h3, .ir-hero .eyebrow, .ir-hero .eyebrow-ar,
.kg-cta-box h1, .kg-cta-box h2, .kg-cta-box h3,
.kgf-cta h1, .kgf-cta h2, .kgf-cta h3,
.hm-charter h1, .hm-charter h2, .hm-charter h3,
.kg-footer h1, .kg-footer h2, .kg-footer h3{ color:#f7f2e7 !important; text-shadow:none; }
.ir-hero p, .kgf-cta p, .hm-charter p{ color:#ded9cd !important; }
.ir-hero .eyebrow, .hm-charter .eyebrow{ color:#f0d685 !important; }

/* دکمهٔ «رزرو از صفحهٔ اصلی»: رنگِ لینکِ عمومیِ طلایی رویش می‌نشست و
   طلایی‌روی‌طلایی می‌شد. متنش همیشه تیره بماند. */
.kgf-btn, .kgf-cta .kgf-btn{ color:#1b1508 !important; }

/* ۶) پاک‌سازیِ محتوایِ چسبانده‌شده از Word (کلاسِ MsoNormal):
      فونتِ Calibri/Times و رنگ‌های inline (طلاییِ کم‌کنتراست) با متنِ سایت
      نمی‌خواند و صفحه را غیرحرفه‌ای نشان می‌داد. */
main .container .MsoNormal,
main .container .MsoNormal *:not(a){
  font-family:inherit !important;
  color:inherit !important;
  background-color:transparent !important;
}
main .container .MsoNormal{ color:#333 !important; }
main .container .MsoNormal a{ color:#8a6d16 !important; }
main .container .MsoNormal b, main .container .MsoNormal strong{ color:#1b1b1b !important; }

/* ═══ ویجتِ معرفیِ خودرو (بلوکِ «🚘 معرفی خودرو») ═══ */
.kg-carw{ display:flex; flex-direction:column; gap:18px; margin:24px 0; }
.kg-carw-item{
  display:grid; grid-template-columns:minmax(0,42%) minmax(0,1fr); gap:22px;
  align-items:center; background:#fff;
  border:1.5px solid #e2dac8; border-radius:20px; padding:18px;
  box-shadow:0 12px 34px -22px rgba(60,50,20,.45);
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.kg-carw-item:hover{
  border-color:#c9a227; transform:translateY(-2px);
  box-shadow:0 16px 40px -20px rgba(201,162,39,.45);
}
@media(max-width:760px){
  .kg-carw-item{ grid-template-columns:1fr; gap:14px; padding:14px; }
}
.kg-carw-img{ border-radius:15px; overflow:hidden; background:#f4f0e4; aspect-ratio:16/10; }
.kg-carw-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.kg-carw-t{ margin:0 0 10px !important; font-size:19px !important; color:#1b1b1b !important; }
.kg-carw-t::before{ content:none !important; }
.kg-carw-specs{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:11px; }
.kg-carw-specs span{
  font-size:12.5px; font-weight:800; color:#6b5410;
  background:#f9f4e4; border:1px solid #e4d3a0; border-radius:999px; padding:5px 12px;
}
.kg-carw-d{ margin:0 0 14px !important; font-size:14px !important; line-height:2 !important; color:#4a443a !important; }
.kg-carw-btn{
  display:inline-block; padding:11px 24px; border-radius:12px; text-decoration:none;
  background:linear-gradient(135deg,#f0d685,#c9a227 55%,#a9861c); color:#1b1508 !important;
  font-weight:900; font-size:14px;
  box-shadow:0 8px 20px -8px rgba(201,162,39,.55), inset 0 1px 0 rgba(255,255,255,.45);
}
.kg-carw-btn:hover{ filter:brightness(1.05); }

/* کارت‌های ناوگان قابلِ کلیک‌اند و به فرمِ رزرو وصل می‌شوند */
.kgf-head{ text-decoration:none; color:inherit; cursor:pointer; }
.kgf-model{
  display:block; text-decoration:none; color:inherit; cursor:pointer;
  border-radius:10px; padding:7px 9px; margin:-7px -9px;
  transition:background .15s ease;
}
.kgf-model:hover{ background:#faf7ef; }
.kgf-go{
  display:block; font-style:normal; font-size:11.5px; font-weight:800;
  color:#8a6d16; margin-top:3px; opacity:0; transition:opacity .15s ease;
}
.kgf-model:hover .kgf-go{ opacity:1; }
.kgf-cardbtn{
  display:block; margin-top:13px; text-align:center; text-decoration:none;
  padding:10px 14px; border-radius:11px; font-weight:900; font-size:13px;
  background:#faf7ef; border:1.5px solid #e0cf8f; color:#8a6d16 !important;
  transition:background .16s ease, border-color .16s ease;
}
.kgf-cardbtn:hover{ background:#f7edcf; border-color:#c9a227; }

/* برجسته‌شدنِ ویجت وقتی کاربر از صفحهٔ معرفیِ خودرو می‌آید */
.hs-host.is-picked .hs-card{
  box-shadow:0 0 0 3px rgba(201,162,39,.55), 0 18px 40px -18px rgba(201,162,39,.5);
  transition:box-shadow .3s ease;
}

/* کادرِ توضیحِ هر مسیر در فرمِ رزرو */
.hs .hs-note{ display:block; margin-top:10px; }
.hs .hs-note > span{
  display:block; font-size:11.5px; font-weight:800; color:#6b5410; margin-bottom:5px;
}
.hs .hs-note textarea{
  width:100%; box-sizing:border-box; resize:vertical; min-height:44px;
  padding:9px 12px; border:1.5px solid #cfc4a8; border-radius:10px;
  font-family:inherit; font-size:13px; line-height:1.9; color:#1b1b1b; background:#fff;
}
.hs .hs-note textarea:focus{
  outline:none; border-color:#c9a227; box-shadow:0 0 0 3px rgba(201,162,39,.15);
}
.hs .hs-note textarea::placeholder{ color:#a89f88; font-size:12px; }

/* نشانهٔ فیلدِ الزامی در فرمِ رزرو */
.hs .hs-req{ color:#c0392b; font-style:normal; font-weight:900; margin-inline-start:2px; }

/* ═══ زیارتِ کامل: مرزها و بسته‌ها ═══ */
.hs .hs-ziy{ margin:0 0 12px; }
.hs .hs-ziy-row{ display:flex; align-items:end; gap:10px; flex-wrap:wrap; }
.hs .hs-brd{ flex:1; min-width:190px; }
.hs .hs-brd select{
  width:100%; height:46px; box-sizing:border-box; padding:0 10px;
  border:1.5px solid #cfc4a8; border-radius:10px; background:#fff;
  font-family:inherit; font-size:13.5px; font-weight:700; color:#1b1b1b; cursor:pointer;
}
.hs .hs-brd select:focus{ outline:none; border-color:#c9a227; box-shadow:0 0 0 3px rgba(201,162,39,.15); }
.hs .hs-ziy-arrow{ padding-bottom:12px; color:#c9a227; font-weight:900; font-size:18px; }
.hs .hs-ziy-hint{
  margin:10px 0 0; padding:10px 13px; border-radius:11px;
  background:#faf7ef; border:1px dashed #dcc98f; color:#6b5410;
  font-size:12.5px; line-height:2;
}
.hs .hs-pkgs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:10px; margin-top:12px; }
.hs .hs-pkg{
  display:flex; flex-direction:column; gap:6px; text-align:start; cursor:pointer;
  padding:13px 15px; border-radius:14px; border:1.8px solid #cfc4a8; background:#fff;
  font-family:inherit; transition:border-color .16s ease, background .16s ease, transform .1s ease;
}
.hs .hs-pkg:hover{ border-color:#c9a227; }
.hs .hs-pkg:active{ transform:scale(.995); }
.hs .hs-pkg.on{
  border-color:#a9861c; background:linear-gradient(135deg,#fdf6e2,#f7ecc9);
  box-shadow:0 6px 16px -8px rgba(201,162,39,.6);
}
.hs .hs-pkg-t{ font-weight:900; font-size:13.5px; color:#1b1b1b; }
.hs .hs-pkg-s{ font-size:11.5px; color:#5b5449; line-height:1.95; }
.hs .hs-pkg-s b{ color:#c9a227; }
.hs .hs-pkg-d{ font-size:11.5px; color:#6b6459; line-height:1.95; }
.hs .hs-pkg-p{ margin-top:2px; font-weight:900; font-size:14px; color:#8a6d16; }
.hs .hs-pkg-p i{ font-style:normal; font-size:10.5px; font-weight:700; color:#8a8371; }

/* ═══ دراپ‌داونِ نوعِ سفر: با طراحی بفهماند که بازشدنی است (بدونِ هیچ متنِ راهنما) ═══ */
.hs .hs-trip{ position:relative; }
.hs .hs-trip-btn{
  display:flex; align-items:center; gap:9px; cursor:pointer;
  padding:9px 14px 9px 12px; border-radius:999px;
  border:1.8px solid #cfc4a8; background:linear-gradient(180deg,#fff,#faf7ef);
  font-family:inherit; font-weight:800; font-size:13.5px; color:#1b1b1b;
  box-shadow:0 2px 8px -4px rgba(60,50,20,.35);
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.hs .hs-trip-btn:hover{
  border-color:#c9a227; background:linear-gradient(180deg,#fffdf6,#f7f1de);
  box-shadow:0 4px 14px -6px rgba(201,162,39,.55);
}
.hs .hs-trip-btn:focus-visible{ outline:none; border-color:#c9a227; box-shadow:0 0 0 3px rgba(201,162,39,.2); }
/* فلشِ رو به پایین در یک قرصِ طلایی — نشانهٔ بصریِ «باز می‌شود» */
.hs .hs-trip-car{
  display:inline-flex; align-items:center; justify-content:center;
  width:22px; height:22px; border-radius:50%; font-size:11px; line-height:1;
  background:linear-gradient(135deg,#f0d685,#c9a227); color:#1b1508;
  transition:transform .2s ease;
}
.hs .hs-trip[data-open="1"] .hs-trip-car{ transform:rotate(180deg); }
.hs .hs-trip[data-open="1"] .hs-trip-btn{ border-color:#a9861c; }
.hs .hs-trip-menu{
  position:absolute; inset-inline-start:0; top:calc(100% + 7px); z-index:40;
  min-width:200px; padding:6px; border-radius:14px;
  background:#fff; border:1.5px solid #e2dac8;
  box-shadow:0 18px 40px -18px rgba(60,50,20,.5);
  display:none; flex-direction:column; gap:3px;
}
.hs .hs-trip[data-open="1"] .hs-trip-menu{ display:flex; }
.hs .hs-trip-menu button{
  text-align:start; cursor:pointer; padding:10px 13px; border-radius:10px;
  border:none; background:none; font-family:inherit; font-weight:700; font-size:13.5px; color:#3b3416;
  transition:background .14s ease;
}
.hs .hs-trip-menu button:hover{ background:#faf7ef; }
.hs .hs-trip-menu button[aria-checked="true"]{
  background:linear-gradient(135deg,#f0d685,#c9a227); color:#1b1508; font-weight:900;
}

/* ═══ کلاسِ اتوبوس — زیرمجموعهٔ نوعِ اتوبوس، نه گزینهٔ هم‌ردیف ═══
   قابِ مشترک، تورفتگی، و افکتِ انتخابِ متفاوت (زیرخطِ طلایی به‌جای پرشدنِ
   کامل) تا کاربر در یک نگاه بفهمد این‌ها زیرشاخه‌اند. */
.hs .hs-kindwrap{
  border:1.8px solid #e2dac8; border-radius:16px; padding:11px 11px 9px;
  background:linear-gradient(180deg,#fdfcf7,#faf7ef); margin:0 0 12px;
}
.hs .hs-kindwrap .hs-kinds{ margin:0; }
.hs .hs-cls{
  display:flex; gap:7px; flex-wrap:wrap; align-items:center;
  margin:10px 6px 0; padding:9px 10px 3px;
  border-top:1.5px dashed #e2dac8;
}
/* خطِ اتصالِ کوچک — نشانهٔ «زیرمجموعه بودن» */
.hs .hs-cls::before{
  content:''; width:14px; height:14px; margin-inline-end:2px; flex:none;
  border-inline-start:2px solid #dcc98f; border-block-end:2px solid #dcc98f;
  border-end-start-radius:6px; transform:translateY(-4px);
}
.hs .hs-clsb{
  cursor:pointer; display:inline-flex; align-items:center; gap:7px;
  padding:6px 13px; border-radius:999px; background:none;
  border:1.5px solid transparent; font-family:inherit; font-weight:700;
  font-size:12.5px; color:#6b6459;
  transition:color .15s ease, border-color .15s ease, background .15s ease;
}
.hs .hs-clsb:hover{ color:#1b1b1b; background:rgba(201,162,39,.08); }
/* انتخاب‌شده: زیرخط و متنِ طلاییِ تیره — عمداً شبیهِ کارت‌های بالا نیست */
.hs .hs-clsb.on{
  color:#8a6d16; background:#fff; border-color:#e0cf8f;
  box-shadow:inset 0 -2.5px 0 #c9a227;
}
.hs .hs-clsb-p{
  font-size:11px; font-weight:800; padding:1px 7px; border-radius:999px;
  background:rgba(201,162,39,.16); color:#8a6d16;
}

/* ═══ هر نوعِ اتوبوس یک کارت؛ کلاسش داخلِ خودش ═══ */
.hs .hs-kinds-col{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 12px; align-items:start; }
@media(max-width:640px){ .hs .hs-kinds-col{ grid-template-columns:1fr; } }
.hs .hs-kindcard{
  border:1.8px solid #cfc4a8; border-radius:14px; overflow:hidden; background:#fff;
  transition:border-color .16s ease, box-shadow .16s ease;
}
.hs .hs-kindcard:hover{ border-color:#c9a227; }
.hs .hs-kindcard.on{ border-color:#a9861c; box-shadow:0 6px 18px -10px rgba(201,162,39,.65); }
.hs .hs-kindcard .hs-kind{
  width:100%; border:none; border-radius:0; background:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 14px; font-family:inherit; font-weight:800; font-size:13.5px; color:#3b3416;
}
.hs .hs-kindcard.on .hs-kind{ background:linear-gradient(135deg,#f0d685,#c9a227); color:#1b1508; }
/* کلاس‌ها داخلِ کارت: زمینهٔ کرم و تورفتگی تا زیرمجموعه بودنشان پیدا باشد */
.hs .hs-kindcard .hs-cls{
  margin:0; padding:9px 12px 10px; border-top:1.5px dashed #e2dac8;
  background:#fdfcf7; justify-content:center;
}
.hs .hs-kindcard .hs-cls::before{ display:none; }

/* ═══════════════════════════════════════════════════════════════
   معرفیِ وسیلهٔ انتخاب‌شده: متن + گالریِ عکس
   با هر بار زدنِ زبانهٔ اتوبوس/ون/شخصی، متن و عکس‌های همان وسیله
   نشان داده می‌شود (محتوایش از پنل ← «ویترین خدمات» می‌آید).
   ═══════════════════════════════════════════════════════════════ */
#kgSvcIntro{ max-width:1060px; margin-inline:auto; padding:0 16px; }
.hs-intro{
  margin:26px 0 6px; padding:24px 26px;
  background:linear-gradient(180deg,#fdfcf7,#f8f4e9);
  border:1.5px solid #e2dac8; border-radius:20px;
  box-shadow:0 10px 30px -22px rgba(60,50,20,.45);
}
@media(max-width:640px){ .hs-intro{ padding:18px 15px; border-radius:16px; } }
.hs-intro-t{
  margin:0 0 8px; font-size:clamp(19px,2.6vw,25px); font-weight:900; color:#1b1b1b;
}
.hs-intro-l{ margin:0 0 14px; font-size:14.5px; line-height:2.1; color:#4a443a; }
.hs-intro-p{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:8px 18px;
}
.hs-intro-p li{
  position:relative; padding-inline-start:22px;
  font-size:13.5px; line-height:2; color:#3b3416;
}
.hs-intro-p li::before{
  content:'✓'; position:absolute; inset-inline-start:0; top:.05em;
  color:#c9a227; font-weight:900;
}

/* ── گالریِ عکسِ همان وسیله ── */
.hs-gal{
  margin-top:18px; padding-top:16px; border-top:1.5px dashed #e2dac8;
  display:grid; grid-template-columns:repeat(auto-fill,minmax(158px,1fr)); gap:10px;
}
.hs-gal-i{
  margin:0; cursor:zoom-in; border-radius:13px; overflow:hidden;
  background:#fff; border:1.5px solid #e2dac8;
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.hs-gal-i:hover{
  border-color:#c9a227; transform:translateY(-2px);
  box-shadow:0 10px 24px -14px rgba(201,162,39,.6);
}
.hs-gal-i img{ display:block; width:100%; height:112px; object-fit:cover; }
.hs-gal-i figcaption{
  padding:7px 10px; font-size:11.5px; line-height:1.85; color:#6b6459;
  border-top:1px solid #efe9db; text-align:center;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* ── نمایشِ بزرگِ عکس (بدونِ کتابخانهٔ بیرونی) ── */
.hs-gal-lb{
  position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center;
  padding:28px; background:rgba(16,14,8,.86); backdrop-filter:blur(3px);
}
.hs-gal-lb figure{ margin:0; max-width:min(1000px,92vw); max-height:88vh; text-align:center; }
.hs-gal-lb img{
  max-width:100%; max-height:78vh; border-radius:14px; display:block; margin-inline:auto;
  box-shadow:0 30px 70px -25px rgba(0,0,0,.8);
}
.hs-gal-lb figcaption{ margin-top:12px; color:#f0e9d8; font-size:14px; font-weight:700; }
.hs-gal-x{
  position:absolute; top:18px; inset-inline-end:20px; width:42px; height:42px;
  border-radius:50%; border:none; cursor:pointer; font-size:24px; line-height:1;
  background:rgba(255,255,255,.14); color:#fff;
}
.hs-gal-x:hover{ background:rgba(255,255,255,.26); }
.hs-gal-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:48px; height:48px; border-radius:50%; border:none; cursor:pointer;
  font-size:30px; line-height:1; background:rgba(255,255,255,.14); color:#fff;
}
.hs-gal-nav:hover{ background:rgba(255,255,255,.26); }
.hs-gal-prev{ inset-inline-start:18px; }
.hs-gal-next{ inset-inline-end:18px; }
@media(max-width:640px){
  .hs-gal{ grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); }
  .hs-gal-i img{ height:92px; }
  .hs-gal-nav{ width:40px; height:40px; font-size:24px; }
}

/* ═══ تاریخِ حرکتِ بستهٔ زیارتی + برچسبِ بازهٔ فصلی ═══
   بدونِ تاریخ نه سفارش معنا دارد نه قیمتِ فصلی؛ پس در حالتِ بستهٔ آماده هم
   یک ردیفِ تاریخ/ساعت درست زیرِ انتخابِ مرزها می‌آید. */
/* ردیفِ «ورود/خروج» چهار فیلد دارد و نباید از شبکهٔ ۷ستونیِ مسیرها ارث ببرد —
   وگرنه سلکتِ ساعت داخلِ ستونِ ۴۰پیکسلیِ دکمهٔ جابه‌جایی می‌افتد و له می‌شود. */
.hs .hs-row.hs-ziy-when{
  margin-top:10px;
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr) !important;
}
@media(max-width:820px){
  .hs .hs-row.hs-ziy-when{ grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) !important; }
}
@media(max-width:460px){
  .hs .hs-row.hs-ziy-when{ grid-template-columns:minmax(0,1fr) !important; }
}
.hs .hs-pkg-se{
  display:inline-block; font-style:normal; font-size:10.5px; font-weight:800;
  background:#c9a227; color:#1b1508; border-radius:20px; padding:2px 8px;
  margin-inline-start:7px; vertical-align:middle;
}

/* ═══ فیلدِ اجباریِ خالی — کاربر باید ببیند کجا را پر نکرده ═══ */
.hs .hs-fld.is-miss > span{ color:#c0392b; }
.hs .hs-fld.is-miss input,
.hs .hs-fld.is-miss select{
  border-color:#c0392b !important;
  background:#fff6f5 !important;
  box-shadow:0 0 0 3px rgba(192,57,43,.13) !important;
}
.hs .hs-fld.is-miss .hs-req{ color:#c0392b; }

/* ═══ تقویم: روزهای گذشته واقعاً غیرفعال ═══
   دکمه disabled است، پس کلیک هیچ رویدادی نمی‌سازد؛ این‌ها فقط ظاهرش را
   هم «غیرقابلِ انتخاب» نشان می‌دهند تا کاربر بی‌خود تلاش نکند. */
.kgd-d.kgd-off,
.kgd-d:disabled{
  color:#c9c4ba !important; background:transparent !important;
  cursor:not-allowed !important; opacity:.55; text-decoration:line-through;
}
.kgd-d.kgd-off:hover,
.kgd-d:disabled:hover{ background:transparent !important; }
.kgd-nav:disabled{ opacity:.3; cursor:not-allowed; }

/* ═══ انتخابِ نوعِ اتوبوس — فهرستِ دو گزینه‌ای با توضیحِ یک‌خطی ═══
   قبلاً دو کارتِ بزرگِ بی‌توضیح بود و زائر نمی‌دانست فرقشان چیست. */
.hs .hs-kinds-h{ font-size:12px; font-weight:800; color:#7a7364; margin:0 2px 7px; }
.hs .hs-kinds-col{ display:grid; gap:8px; margin-bottom:4px; }
.hs .hs-kindcard{ border:1.5px solid #e3ddcd; border-radius:12px; background:#fff; overflow:hidden; }
.hs .hs-kindcard.on{ border-color:#c9a227; background:#fdf8ea; box-shadow:0 0 0 2px rgba(201,162,39,.18); }
.hs .hs-kind{
  display:flex; align-items:flex-start; gap:10px; width:100%; text-align:start;
  padding:11px 13px; border:none; background:none; cursor:pointer; font-family:inherit;
}
.hs .hs-kind-dot{
  flex:none; width:17px; height:17px; margin-top:2px; border-radius:50%;
  border:2px solid #c6bda3; background:#fff; position:relative;
}
.hs .hs-kind.on .hs-kind-dot{ border-color:#c9a227; }
.hs .hs-kind.on .hs-kind-dot::after{
  content:''; position:absolute; inset:3px; border-radius:50%; background:#c9a227;
}
.hs .hs-kind-b{ min-width:0; }
.hs .hs-kind-b b{ display:block; font-size:13.5px; font-weight:800; color:#1b1b1b; line-height:1.7; }
.hs .hs-kind-b i{ display:block; font-style:normal; font-size:11.5px; color:#7a7364; line-height:1.9; margin-top:2px; }

/* ═══ پنجرهٔ انتخابِ زبان ═══
   فقط برای بازدیدکننده‌ای باز می‌شود که مرورگر/کشورش زبانِ دیگری را نشان
   می‌دهد. فارسی همیشه گزینهٔ برجسته و پیش‌فرض است. */
.kg-langpop{
  position:fixed; inset:0; z-index:9800; display:flex; align-items:center; justify-content:center;
  background:rgba(20,18,14,.62); backdrop-filter:blur(4px); padding:20px;
}
.kg-langpop-b{
  background:#fff; border-radius:20px; padding:26px 24px; width:min(400px,100%);
  text-align:center; box-shadow:0 30px 70px -20px rgba(0,0,0,.5);
  font-family:Vazirmatn,system-ui,sans-serif;
}
.kg-langpop-h{ font-size:34px; line-height:1; margin-bottom:10px; }
.kg-langpop-t{ margin:0; font-size:14px; color:#8a8371; font-weight:700; }
.kg-langpop-t2{ margin:2px 0 18px; font-size:15px; color:#1b1b1b; font-weight:800; }
.kg-langpop-o{ display:grid; gap:10px; }
.kg-langb{
  padding:14px 18px; border-radius:13px; border:2px solid #e3ddcd; background:#fff;
  font-family:inherit; font-size:15.5px; font-weight:800; color:#1b1b1b; cursor:pointer;
  transition:border-color .15s, transform .15s;
}
.kg-langb:hover{ border-color:#c9a227; transform:translateY(-2px); }
.kg-langb.on{ background:linear-gradient(135deg,#e2c463,#c9a227); border-color:#c9a227; color:#1b1508; }
.kg-langpop-more{ display:flex; gap:7px; flex-wrap:wrap; justify-content:center; margin-top:16px;
  padding-top:14px; border-top:1px solid #efe9d8; }
.kg-langmini{
  padding:7px 14px; border-radius:20px; border:1.5px solid #e3ddcd; background:#fbf9f3;
  font-family:inherit; font-size:12.5px; font-weight:700; color:#5c5646; cursor:pointer;
}
.kg-langmini:hover{ border-color:#c9a227; background:#fdf8ea; }
/* زبان‌های چپ‌به‌راست: ویجت باید جهتش را عوض کند */
html[dir="ltr"] .hs{ direction:ltr; }
html[dir="ltr"] .hs-q-p, html[dir="ltr"] .hs-car-p{ text-align:start; }

/* ═══ کلیدِ زبان در نوارِ بالا ═══ */
.kg-langsw{ position:relative; list-style:none; }
.kg-langsw-b{
  display:inline-flex; align-items:center; gap:5px; padding:7px 13px;
  border:1.5px solid rgba(201,162,39,.5); border-radius:20px; background:transparent;
  font-family:inherit; font-size:13px; font-weight:700; color:inherit; cursor:pointer;
}
.kg-langsw-b:hover{ border-color:#c9a227; background:rgba(201,162,39,.1); }
.kg-langsw-b i{ font-style:normal; font-size:10px; opacity:.7; }
.kg-langsw-m{
  display:none; position:absolute; inset-block-start:calc(100% + 6px); inset-inline-end:0;
  min-width:150px; background:#fff; border:1.5px solid #e3ddcd; border-radius:12px;
  box-shadow:0 16px 34px -12px rgba(0,0,0,.28); padding:6px; z-index:900;
}
.kg-langsw[data-open="1"] .kg-langsw-m{ display:block; }
.kg-langsw-m button{
  display:block; width:100%; text-align:start; padding:9px 12px; border:none;
  background:none; border-radius:8px; font-family:inherit; font-size:13.5px;
  font-weight:700; color:#1b1b1b; cursor:pointer;
}
.kg-langsw-m button:hover{ background:#faf6e9; }
.kg-langsw-m button.on{ background:linear-gradient(135deg,#e2c463,#c9a227); color:#1b1508; }
@media(max-width:900px){
  .kg-langsw-m{ inset-inline:0; inset-inline-end:auto; }
}

/* ═══ «یکی از این دو» — انتخابِ کاپوتاژ یا دربستِ عراق ═══
   مشکلی که صاحبِ سایت دید: دو کارت کنارِ هم (یکی راست، یکی چپ) به‌نظر
   می‌آمد دو بخشِ مکمّلِ یک فرم‌اند و باید هر دو پر شوند. حالا زیرِ هم‌اند،
   با جداکنندهٔ «یا» در میان و گزینهٔ انتخاب‌نشده کم‌رنگ — یعنی از یک نگاه
   پیداست که فقط یکی انتخاب می‌شود. */
.hs .hs-kinds-pick{ grid-template-columns:1fr !important; gap:0; }
.hs .hs-kinds-hint{
  font-weight:700; font-size:11px; color:#a2571f; background:#fdf1e3;
  border:1px solid #f0d9bd; border-radius:999px; padding:2px 9px;
  margin-inline-start:6px; white-space:nowrap;
}
.hs .hs-kinds-or{
  display:flex; align-items:center; gap:9px; margin:8px 2px;
  color:#9c9481; font-size:11.5px; font-weight:800;
}
.hs .hs-kinds-or::before, .hs .hs-kinds-or::after{
  content:''; flex:1; height:1px; background:#e6e0cf;
}
.hs .hs-kinds-pick .hs-kindcard.off{ background:#fbfaf6; opacity:.72; }
.hs .hs-kinds-pick .hs-kindcard.off:hover{ opacity:1; border-color:#c9a227; }
.hs .hs-kinds-pick .hs-kindcard.on{ border-width:2px; }
@media(max-width:640px){
  .hs .hs-kinds-hint{ display:block; margin:5px 0 0; width:fit-content; }
}

/* دکمهٔ بستنِ پنجرهٔ انتخابِ زبان — بدونِ آن، پنجره تمامِ صفحه را می‌گیرد
   و کاربری که نمی‌خواهد زبان عوض کند حتی نمی‌تواند منوی موبایل را باز کند. */
.kg-langpop-b{ position:relative; }
.kg-langpop-x{
  position:absolute; inset-block-start:10px; inset-inline-end:12px;
  width:30px; height:30px; border-radius:50%; border:none; cursor:pointer;
  background:#f2efe6; color:#6b6455; font-size:15px; line-height:1;
  font-family:inherit;
}
.kg-langpop-x:hover{ background:#e6e0cf; color:#1b1b1b; }

/* ═══ شمارهٔ تلفن با پیش‌شمارهٔ کشور ═══
   زائرِ عراقی «۰۷۸۰…» می‌نویسد و زائرِ ترک «۰۵۳۲…» — هیچ‌کدام کدِ کشور را
   نمی‌زنند. کشور از روی IP خودش انتخاب می‌شود و کنارِ کادر می‌نشیند. */
.hs-tel{ display:flex; gap:8px; align-items:stretch; }
.hs-tel-cc{
  flex:0 0 auto; max-width:46%; padding:11px 10px; border:1.5px solid #e3ddcd;
  border-radius:10px; background:#fbf9f3; font-family:inherit; font-size:13px;
  font-weight:700; color:#2a2620; cursor:pointer;
}
.hs-tel-cc:focus{ outline:none; border-color:#c9a227; }
.hs-tel-n{ flex:1 1 auto; min-width:0; }
.hs-tel-hint{
  display:block; margin-top:5px; font-style:normal; font-size:11.5px;
  color:#8d866f; letter-spacing:.2px;
}
@media(max-width:420px){
  .hs-tel{ flex-direction:column; }
  .hs-tel-cc{ max-width:none; }
}

/* «از کدام کشور هستید؟» در پنجرهٔ زبان — پرچمِ صحنه از همین می‌آید، نه از
   IP؛ چون بسیاری از زائران با فیلترشکن وصل می‌شوند و IP کشورِ دیگری را
   نشان می‌دهد و پرچمِ اشتباه بالای صفحه می‌نشیند. */
.kg-langpop-c{ margin:14px 0 4px; text-align:start; }
.kg-langpop-c label{ display:block; font-size:12px; font-weight:700; color:#6b6455; margin-bottom:6px; }
.kg-langpop-c select{
  width:100%; padding:10px 12px; border:1.5px solid #e3ddcd; border-radius:10px;
  background:#fbf9f3; font-family:inherit; font-size:13.5px; font-weight:700; color:#2a2620;
}
.kg-langpop-c select:focus{ outline:none; border-color:#c9a227; }

/* پرچمِ کنارِ نامِ هر زبان — «العربية» و «پښتو» برای کسی که آن خط را
   نمی‌شناسد ناخواناست؛ پرچم در یک نگاه می‌گوید کدام گزینه مالِ اوست. */
.kg-lf{
  width:22px; height:15px; object-fit:cover; border-radius:3px;
  border:1px solid rgba(0,0,0,.12); flex:none; vertical-align:middle;
}
.kg-langb, .kg-langmini, .kg-langsw-b, .kg-langsw-m button{
  display:inline-flex; align-items:center; gap:8px; justify-content:center;
}
.kg-langsw-m button{ justify-content:flex-start; }
.kg-langb{ justify-content:center; }
.kg-lf-g{ font-size:15px; line-height:1; flex:none; }

/* کادرِ ساعت — دستی و ۲۴ساعته، به‌جای فهرستِ کشویی.
   فهرستِ قبلی ۲۴ گزینهٔ «۳ عصر/۸ صبح» داشت که هم واژه‌اش به زبان‌های
   دیگر نشت می‌کرد، هم ساعتِ دقیق (۱۶:۳۰) در آن نبود. */
.hs .hs-time-i{
  width:100%; box-sizing:border-box; text-align:center; letter-spacing:.5px;
  font-variant-numeric:tabular-nums;
}
.hs .hs-when-t{ color:#8a7a3c; font-weight:800; }

/* ═══ انتخابِ کشور در پنجرهٔ زبان — جست‌وجوشدنی و اجباری ═══
   فهرست ۱۰۴ کشور دارد؛ در فهرستِ کشویی روی گوشی پیدا کردنِ یک کشور
   عذاب است. پس کادرِ جست‌وجو + فهرستِ فیلترشونده. */
.kg-langpop-c label{ display:block; font-size:12px; font-weight:700; color:#6b6455; margin-bottom:6px; }
.kg-langpop-c .kg-req{ color:#b3261e; }
.kg-langpop-c input#kgCountryQ{
  width:100%; box-sizing:border-box; padding:11px 13px; border:1.5px solid #e3ddcd;
  border-radius:10px; background:#fff; font-family:inherit; font-size:14px; color:#2a2620;
}
.kg-langpop-c input#kgCountryQ:focus{ outline:none; border-color:#c9a227; }
.kg-langpop-c.need input#kgCountryQ{ border-color:#b3261e; background:#fdf5f5; }
.kg-langpop-c.need label{ color:#b3261e; }

.kg-cty-list{
  max-height:190px; overflow-y:auto; margin-top:7px; border:1px solid #eee;
  border-radius:10px; background:#fff; -webkit-overflow-scrolling:touch;
}
.kg-cty{
  display:flex; align-items:center; gap:9px; width:100%; padding:9px 11px;
  border:none; border-bottom:1px solid #f2f0ea; background:none; cursor:pointer;
  font-family:inherit; font-size:13.5px; color:#2a2620; text-align:start;
}
.kg-cty:last-child{ border-bottom:none; }
.kg-cty:hover{ background:#faf6e9; }
.kg-cty span{ flex:1; }
.kg-cty i{ font-style:normal; font-size:12px; color:#8d866f; }
.kg-cty-none{ padding:12px; text-align:center; color:#8d866f; font-size:13px; margin:0; }

.kg-cty-picked{
  display:flex; align-items:center; gap:9px; margin-top:7px; padding:10px 12px;
  border:1.5px solid #c9a227; border-radius:10px; background:#fdf8ea;
  font-size:14px; font-weight:700; color:#2a2620;
}
.kg-cty-picked b{ flex:1; font-weight:700; }
.kg-cty-clear{
  border:none; background:none; cursor:pointer; font-size:14px; color:#8a7a3c;
  padding:2px 6px; border-radius:6px; font-family:inherit;
}
.kg-cty-clear:hover{ background:rgba(201,162,39,.15); }

/* در موبایل دو حبابِ چت روی هم می‌افتاد: یکی در نوارِ شناور و یکی خودِ
   ویجتِ گفتگو. حبابِ ویجت پنهان می‌شود و همان دکمهٔ نوار بازش می‌کند. */
body.kg-onechat .kgc-fab{ display:none !important; }

/* ظرفیتِ وسیله در ویجتِ رزرو — سفر دربستی است و «چند نفرید؟» پرسیده
   نمی‌شود؛ این متن از پنلِ «ناوگانِ راننده‌دار» می‌آید. */
.hs-cap-note{
  margin-top:8px; font-size:12.5px; line-height:1.9; color:#7a6a3a;
  background:rgba(201,162,39,.10); border:1px dashed rgba(201,162,39,.42);
  border-radius:10px; padding:7px 11px;
}

/* پیامِ «هم‌اکنون در عراقم» — کنارِ راه‌های تماس */
.kg-iraq-note{
  margin:10px 0 0; padding:9px 13px; font-size:12.8px; line-height:1.95;
  color:#7a6a3a; background:rgba(201,162,39,.10);
  border:1px dashed rgba(201,162,39,.45); border-radius:10px;
}

/* دکمهٔ «تأیید» پنجرهٔ کشور — پنجره با همین بسته می‌شود، نه با کلیک روی زبان */
.kg-langpop-ok{
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; margin-top:16px; padding:14px 18px; border:none; border-radius:14px;
  font-family:inherit; font-size:16px; font-weight:800; cursor:pointer;
  background:linear-gradient(135deg,#e8ce7c,#c9a227); color:#1b1508;
  box-shadow:0 10px 24px -12px rgba(201,162,39,.7); transition:.18s;
}
.kg-langpop-ok i{ font-style:normal; font-size:14px; opacity:.75; }
.kg-langpop-ok:disabled{
  background:#eceadf; color:#9a9382; box-shadow:none; cursor:not-allowed;
}
.kg-langpop-ok:not(:disabled):hover{ transform:translateY(-1px); }
.kg-langpop-note{
  margin:10px 0 0; font-size:13px; font-weight:700; color:#8a7328; min-height:18px; text-align:center;
}

/* ═══ کلیدِ زبان — گوشهٔ سربرگ، بیرون از منوی همبرگری ═══
   پیش از این داخلِ <ul> منو بود و روی موبایل پشتِ همبرگر پنهان می‌شد؛
   زائرِ خارجی برای عوض‌کردنِ زبان باید اول منو را باز می‌کرد. */
header{ position:relative; }
.kg-langsw{
  position:absolute; inset-inline-end:64px; top:50%; transform:translateY(-50%);
  z-index:60; list-style:none;
}
.kg-langsw-b{
  display:inline-flex; align-items:center; gap:7px;
  background:rgba(255,255,255,.10); color:inherit;
  border:1.5px solid rgba(201,162,39,.55); border-radius:999px;
  padding:7px 13px; font-family:inherit; font-size:13.5px; font-weight:700;
  cursor:pointer; white-space:nowrap; transition:.16s;
}
.kg-langsw-b:hover{ border-color:var(--gold,#c9a227); background:rgba(201,162,39,.16); }
.kg-langsw-b img{ width:20px; height:14px; object-fit:cover; border-radius:3px; }
.kg-langsw-m{
  display:none; position:absolute; inset-inline-end:0; top:calc(100% + 8px);
  min-width:180px; max-height:60vh; overflow:auto;
  background:#fff; color:#16211c; border:1.5px solid var(--line,#e3ddcd);
  border-radius:14px; box-shadow:0 18px 40px -18px rgba(0,0,0,.45); padding:6px;
}
.kg-langsw[data-open="1"] .kg-langsw-m{ display:block; }
.kg-langsw-m button{
  display:flex; align-items:center; gap:9px; width:100%;
  background:none; border:none; border-radius:10px; padding:9px 11px;
  font-family:inherit; font-size:14px; cursor:pointer; text-align:start; color:inherit;
}
.kg-langsw-m button:hover{ background:#f6f2e6; }
.kg-langsw-m button.on{ background:var(--gold,#c9a227); color:#1b1508; font-weight:800; }
.kg-langsw-m img{ width:22px; height:15px; object-fit:cover; border-radius:3px; }

/* موبایل: کنارِ دکمهٔ همبرگر، کوچک‌تر ولی همیشه دیدنی */
@media(max-width:900px){
  .kg-langsw{ inset-inline-end:72px; }
  .kg-langsw-b span{ display:none; }        /* فقط پرچم و فلش */
  .kg-langsw-b{ padding:7px 10px; }
}
@media(max-width:380px){
  .kg-langsw{ inset-inline-end:66px; }
  .kg-langsw-b{ padding:6px 8px; }
}

/* ═══ خطوطِ مرزِ بلوک‌ها پررنگ‌تر ═══
   رنگِ --line خیلی کم‌رنگ بود (#e3ddcd روی زمینهٔ سفید تقریباً دیده نمی‌شد)
   و مرزِ کارت‌ها، جدول‌ها و کادرها گم می‌شد. تیره‌تر و کمی ضخیم‌تر شد تا
   هر بلوک لبهٔ روشنی داشته باشد — بدونِ اینکه ظاهر شلوغ شود. */
:root{
  --line:#cfc6ab;          /* پیش از این #e3ddcd */
  --line-soft:#e2dbc7;     /* برای جداکننده‌های داخلی که نباید داد بزنند */
}
html[data-theme="dark"], .kg-dark{
  --line:#3a4d43;          /* پیش از این #25352d */
  --line-soft:#2c3b33;
}

/* لبهٔ کارت‌ها و کادرها: از ۱ به ۱٫۵ پیکسل */
.card, .box, .panel, .kg-card, .svc-card, .hs-card,
section > .container > .card,
.reserve-card, .price-card, .info-card, .faq-item, .kg-box{
  border-width:1.5px;
}

/* جدول‌ها: خطِ جداکنندهٔ ردیف‌ها دیده شود */
table th, table td{ border-color:var(--line); }
table thead th{ border-bottom-width:2px; }

/* کادرهای ورودی: مرزشان باید از زمینه جدا باشد */
input:not([type="checkbox"]):not([type="radio"]), select, textarea{
  border-color:var(--line);
}
input:focus, select:focus, textarea:focus{ border-color:var(--gold,#c9a227); }