@font-face{font-family:"Vazirmatn";src:url("/static/admin/fonts/Vazirmatn-FD-Regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("/static/admin/fonts/Vazirmatn-FD-Medium.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("/static/admin/fonts/Vazirmatn-FD-SemiBold.woff2") format("woff2");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("/static/admin/fonts/Vazirmatn-FD-Bold.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("/static/admin/fonts/Vazirmatn-FD-ExtraBold.woff2") format("woff2");font-style:normal;font-weight:800;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url("/static/admin/fonts/Vazirmatn-FD-Black.woff2") format("woff2");font-style:normal;font-weight:900;font-display:swap}
:root{
    --olive-950:#121108;
    --olive-900:#1b1a12;
    --olive-800:#242219;
    --olive-700:#3e3c31;
    --olive-line: rgba(224,225,224,0.10);
    --madder:#9a2033;
    --madder-bright:#c22a40;
    --green:#4db85e;
    --green-dim:#359b47;
    --platinum:#e0e1e0;
    --platinum-dim: rgba(224,225,224,0.56);
    --platinum-faint: rgba(224,225,224,0.30);
    --ff-fa: 'Vazirmatn', sans-serif;
    --ff-en: 'Switzer', sans-serif;
  }

  *{ margin:0; padding:0; box-sizing:border-box; border-radius:0 !important; }

  html, body{ height:100%; }

  body{
    background:var(--olive-950);
    color:var(--platinum);
    font-family:var(--ff-fa);
    overflow:hidden;
    position:relative;
    display:flex;
    flex-direction:column;
  }

  ::selection{ background:var(--madder); color:var(--platinum); }

  a{ color:inherit; text-decoration:none; }
  button{ font-family:inherit; cursor:pointer; }

  /* ---------- full-page brand pattern + gradient wash ---------- */
  .gradient-wash{
    position:fixed; inset:0; z-index:0; pointer-events:none;
    background:
      radial-gradient(120% 55% at 50% 0%, rgba(154,32,51,0.26) 0%, rgba(154,32,51,0.10) 38%, transparent 72%),
      radial-gradient(90% 50% at 50% 100%, rgba(53,155,71,0.12) 0%, transparent 62%);
  }

  .mesh-bg{
    position:fixed; inset:0; z-index:0; pointer-events:none;
    opacity:.22;
    background-image: url("/static/landing/mesh-bg.png");
    background-repeat: repeat;
    background-size: 310px 218px;
    -webkit-mask-image: linear-gradient(to bottom, black 0%, black 35%, transparent 92%);
    mask-image: linear-gradient(to bottom, black 0%, black 35%, transparent 92%);
  }

  .grain{
    position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.035; mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  .wrap{ position:relative; z-index:2; max-width:1240px; margin:0 auto; width:100%; padding:0 48px; }

  /* ---------- top bar ---------- */
  header{
    flex:0 0 auto;
    position:relative; z-index:50;
    background:var(--olive-900);
    border-bottom:1px solid var(--olive-line);
  }
  .header-inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:clamp(8px,1.6vh,16px) 48px; max-width:1240px; margin:0 auto;
  }
  .brand-logo{ height:clamp(22px,3.4vh,30px); width:auto; display:block; }

  .util-nav{ display:flex; align-items:center; gap:26px; }
  .util-nav a{
    display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--platinum-dim);
    font-family: var(--ff-en); letter-spacing:.2px;
    transition:color .25s ease;
  }
  .util-nav a:hover{ color:var(--green); }
  .util-nav svg{ width:14px; height:14px; opacity:.9; }

  /* ---------- hero ---------- */
  .hero{
    flex:0 0 auto;
    position:relative; z-index:2;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center;
    padding:clamp(10px,2.2vh,18px) 24px clamp(4px,1vh,8px);
  }

  .hero-logo-link{
    display:inline-block;
    opacity:0; animation: heroLogoIn 1s cubic-bezier(.22,1,.36,1) .1s forwards;
  }
  .hero-logo{
    width:clamp(120px,17vh,190px); height:auto; display:block; margin:0 auto;
    filter:drop-shadow(0 0 40px rgba(154,32,51,0.22));
    transition: transform .3s ease, filter .3s ease;
  }
  .hero-logo-link:hover .hero-logo{ transform:translateY(-2px); filter:drop-shadow(0 0 52px rgba(154,32,51,0.32)); }
  @keyframes heroLogoIn{ from{ opacity:0; transform:scale(.92) translateY(10px); } to{ opacity:1; transform:scale(1) translateY(0); } }

  .eyebrow{
    font-family: var(--ff-en); font-size:11px; letter-spacing:3.5px; text-transform:uppercase;
    color: var(--green);
    margin:clamp(6px,1.4vh,12px) 0 clamp(4px,1vh,8px);
    display:flex; align-items:center; gap:10px;
    opacity:0; animation: rise .8s ease .95s forwards;
  }
  .eyebrow::before, .eyebrow::after{ content:""; width:28px; height:1px; background:var(--olive-line); }

  .hero h1{
    font-size: clamp(28px, 5.6vh, 52px);
    font-weight:900;
    line-height:1;
    color:var(--platinum);
    letter-spacing:-1px;
    opacity:0; animation: rise .9s ease 1.15s forwards;
    display:inline-flex; align-items:baseline;
  }
  .hero h1 .dots{ display:inline-flex; margin-inline-start:4px; }
  .hero h1 .dots i{
    font-style:normal; color:var(--madder);
    opacity:0;
    animation: dotBlink 1.4s ease-in-out infinite;
  }
  .hero h1 .dots i:nth-child(1){ animation-delay: 0s; }
  .hero h1 .dots i:nth-child(2){ animation-delay: .2s; }
  .hero h1 .dots i:nth-child(3){ animation-delay: .4s; }
  @keyframes dotBlink{
    0%, 100%{ opacity:0; }
    25%, 55%{ opacity:1; }
  }

  @keyframes rise{ from{ opacity:0; transform:translateY(12px);} to{ opacity:1; transform:translateY(0);} }

  .bottom-note{
    text-align:center; max-width:720px; margin:0 auto;
    font-size:clamp(11px,1.3vh,13px); line-height:1.75; color:var(--platinum-dim);
  }

  /* ---------- main sections ---------- */
  main{
    flex:1 1 auto;
    min-height:0;
    position:relative; z-index:2;
    display:flex; flex-direction:column; justify-content:center;
    gap:clamp(8px,1.6vh,16px);
    padding:clamp(8px,1.6vh,16px) 0;
    overflow:hidden;
  }

  .section-tag{
    font-family:var(--ff-en); font-size:10.5px; letter-spacing:2.5px; text-transform:uppercase;
    color:var(--green); margin-bottom:0; text-align:center;
    display:flex; align-items:center; justify-content:center; gap:14px;
  }
  .section-tag::before, .section-tag::after{ content:""; width:48px; height:1px; background:var(--olive-line); }

  .grid{
    display:grid;
    grid-template-columns: 1.55fr 1fr;
    gap:1px;
    background:var(--olive-line);
    border:1px solid var(--olive-line);
  }

  .card{
    background:var(--olive-900);
    padding:clamp(14px,2.6vh,26px) clamp(18px,2.4vw,32px);
    position:relative;
    transition: background .35s ease;
  }
  .card:hover{ background:var(--olive-800); }

  .card h2{
    font-size:clamp(16px,2.6vh,21px); font-weight:800; color:var(--platinum); margin-bottom:clamp(4px,1vh,8px);
  }

  .card p.desc{
    color:var(--platinum-dim); font-size:clamp(11px,1.3vh,13px); line-height:1.6; max-width:440px; margin-bottom:clamp(8px,1.6vh,16px);
  }

  /* booking card */
  .booking-card{ display:flex; flex-direction:column; justify-content:space-between; }
  .booking-card h2{ margin-top:clamp(10px,1.8vh,16px); }
  .booking-visual{
    display:flex; align-items:center; gap:14px; margin:clamp(4px,1vh,10px) 0 clamp(6px,1.2vh,12px);
  }
  .booking-visual svg{ width:36px; height:34px; opacity:.9; }
  .booking-visual svg path{ stroke:var(--madder); }
  .status-chip{
    display:inline-flex; align-items:center; gap:8px;
    border:1px solid var(--madder); color:var(--madder);
    font-family:var(--ff-en); font-size:10.5px; letter-spacing:1.3px; text-transform:uppercase;
    padding:6px 14px; width:fit-content;
  }
  .status-chip .dot{ width:6px; height:6px; background:var(--madder); animation:blink 1.6s ease-in-out infinite; }
  @keyframes blink{ 0%,100%{opacity:1;} 50%{opacity:.25;} }

  .cta-disabled{
    margin-top:clamp(6px,1.2vh,12px);
    border:1px solid var(--olive-line);
    color:var(--platinum-faint);
    background:transparent;
    padding:clamp(9px,1.6vh,14px) 22px;
    font-size:12.5px; font-weight:600;
    display:flex; align-items:center; justify-content:space-between;
    width:100%; max-width:380px;
    cursor:not-allowed;
    letter-spacing:.2px;
  }
  .cta-disabled svg{ width:14px; height:14px; opacity:.6; }

  /* bots card (inside grid) — centered, minimal single-line links */
  .bots-card{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; gap:0;
  }
  .bots-card h2{ margin-bottom:clamp(8px,1.6vh,14px); }
  .bot-link{
    display:flex; align-items:center; justify-content:center; gap:12px;
    width:100%;
    padding:clamp(10px,1.8vh,15px) 0;
    border-top:1px solid var(--olive-line);
    font-weight:700; font-size:clamp(14px,1.9vh,17px); color:var(--platinum);
    transition: color .25s ease, transform .25s ease;
  }
  .bot-link:first-of-type{ border-top:none; }
  .bot-link:hover{ color:var(--green); transform:translateY(-2px); }
  .bot-link .icon{
    width:30px; height:30px; flex:none;
    display:flex; align-items:center; justify-content:center;
    border:1px solid var(--olive-line);
    color:var(--green);
    transition: border-color .25s ease, background .25s ease;
  }
  .bot-link .icon svg{ width:14px; height:14px; }
  .bot-link:hover .icon{ border-color:var(--green); background:rgba(77,184,94,0.08); }

  /* bottom: two separate boxes, each rendered as a bar */
  .bottom-grid{
    display:grid;
    grid-template-columns: 1.7fr 1fr;
    gap:1px;
    background:var(--olive-line);
    border:1px solid var(--olive-line);
  }
  .bar-box{
    background:var(--olive-900);
    padding:clamp(12px,2vh,18px) clamp(18px,2.2vw,28px);
    transition:background .3s ease;
    display:flex; flex-direction:column; align-items:center; text-align:center;
  }
  .bar-box:hover{ background:var(--olive-800); }
  .bar-head{
    display:flex; align-items:baseline; justify-content:center;
    margin-bottom:clamp(8px,1.4vh,14px);
  }
  .bar-head h3{ font-size:clamp(13px,1.9vh,16px); font-weight:800; color:var(--platinum); }

  .bar-items{ display:flex; align-items:center; justify-content:center; gap:clamp(10px,1.6vw,20px); flex-wrap:wrap; }
  .bar-box--wide .bar-items{ flex-wrap:nowrap; gap:clamp(8px,1.3vw,18px); }
  .bar-box--wide .strip-item{ font-size:clamp(11px,1.2vw,12.5px); }
  .strip-item{
    display:flex; align-items:center; gap:8px;
    font-family:var(--ff-en); font-size:12.5px; font-weight:600; color:var(--platinum-dim);
    transition:color .25s ease;
    direction:ltr;
    white-space:nowrap;
  }
  .strip-item svg{ width:15px; height:15px; opacity:.85; flex:none; }
  .strip-item:hover{ color:var(--green); }
  .strip-item:hover svg{ opacity:1; }
  .strip-sep{ width:1px; height:14px; background:var(--olive-line); }
  /* ---------- footer ---------- */
  footer{ flex:0 0 auto; position:relative; z-index:2; }
  .footer-inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:clamp(8px,1.4vh,14px) 0; border-top:1px solid var(--olive-line);
    font-size:11.5px; color:var(--platinum-faint);
  }
  .footer-inner .f-brand{ display:flex; align-items:center; gap:9px; }
  .f-brand-logo{ height:16px; width:auto; display:block; }
  .footer-inner .f-note{ font-family:var(--ff-en); direction:ltr; }
  .brand{ display:flex; align-items:center; transition:opacity .25s ease; opacity:0; animation: logoFadeIn .8s ease .05s forwards; }
  .brand:hover{ opacity:.82; }
  .f-brand-link{ display:flex; align-items:center; gap:9px; transition:opacity .25s ease; }
  .f-brand-link:hover{ opacity:.8; }
  @keyframes logoFadeIn{ from{ opacity:0; transform:scale(.94) translateY(6px); } to{ opacity:1; transform:scale(1) translateY(0); } }

  @media (max-width: 880px){
    html, body{ height:auto; }
    body{ display:block; overflow:visible; }

    header{ position:relative; }
    .header-inner{ padding:14px 20px; }

    .hero{ padding:34px 22px 18px; }

    main{
      flex:none; overflow:visible;
      justify-content:flex-start;
      gap:22px;
      padding:22px 0 8px;
    }

    .wrap, .header-inner{ padding-left:20px; padding-right:20px; }

    .grid{ grid-template-columns:1fr; }
    .booking-card{ min-height:0; }
    .cta-disabled{ max-width:none; }

    .bottom-grid{ grid-template-columns:1fr; }
    .bar-box--wide .bar-items{ flex-wrap:wrap; }
    .bar-box--wide .strip-item{ font-size:12.5px; }

    .util-nav{ display:none; }

    .footer-inner{ flex-direction:column; align-items:flex-start; gap:10px; padding:20px 0; }
  }

  @media (max-width: 520px){
    .hero{ padding:30px 18px 16px; }
    .hero-logo{ width:clamp(100px,40vw,150px); }
    .eyebrow{ font-size:10px; letter-spacing:2.5px; }
    .hero h1{ font-size:clamp(30px,12vw,42px); }
    .card, .bar-box{ padding:18px 18px; }
    .card h2{ font-size:18px; }
    .bar-head h3{ font-size:15px; }
    .booking-visual svg{ width:32px; height:30px; }
    .section-tag{ font-size:10px; }
    .section-tag::before, .section-tag::after{ width:32px; }
  }