@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+200C-200E,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+2190-21FF}
:root{color-scheme:light only;color:#0b2b45;background:#f8fcfd;font-family:"Vazirmatn",Tahoma,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--teal:#0baaa3;--teal-dark:#079891;--navy:#0a2a44;--muted:#60758a;--line:#e4edf1}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden;background:#fff}button,input,textarea,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{border:0}.container{width:min(1225px,calc(100% - 56px));margin-inline:auto}
.site-header{position:relative;z-index:20;background:rgba(255,255,255,.96);box-shadow:0 1px 0 rgba(13,53,79,.03)}.topbar{height:82px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}.quick-links{justify-self:start;display:flex;align-items:center;gap:28px;color:#29465d;font-size:13px}.quick-links a{display:inline-flex;align-items:center;gap:7px;transition:color .2s}.quick-links a:hover{color:var(--teal)}.brand{justify-self:center;display:inline-flex;align-items:center;gap:10px;color:var(--teal)}.brand strong{font-size:31px;line-height:1;font-weight:850;letter-spacing:-.04em}.brand-mark{position:relative;display:block;width:48px;height:48px;overflow:hidden;border-radius:50%;transform:rotate(-14deg);background:linear-gradient(140deg,#11bdb6 0 48%,#078f9a 49%)}.brand-mark:after{content:"";position:absolute;inset:8px;border:5px solid #fff;border-top-color:transparent;border-radius:50%;transform:rotate(10deg)}.brand-mark i{position:absolute;z-index:2;top:5px;width:8px;height:39px;background:#fff;border-radius:10px;transform:rotate(-32deg)}.brand-mark i:first-child{right:12px}.brand-mark i:last-child{right:25px;opacity:.9}.phone-pill{direction:ltr;justify-self:end;min-width:151px;height:42px;padding:0 19px;display:inline-flex;align-items:center;justify-content:center;gap:10px;color:#fff;font-size:14px;font-weight:500;border-radius:28px;background:linear-gradient(90deg,#08a39d,#18b5ad);box-shadow:0 10px 26px rgba(3,161,154,.2)}.menu-toggle{display:none;color:var(--navy);background:transparent;cursor:pointer}.main-nav{border-top:1px solid #f5f7f8}.nav-row{height:64px;display:flex;align-items:stretch;justify-content:space-between;gap:4px}.nav-row a{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 8px;white-space:nowrap;color:#1d3c55;font-size:13.5px;font-weight:550;transition:color .2s}.nav-row a:after{content:"";position:absolute;right:9px;bottom:12px;left:9px;height:2px;border-radius:2px;background:var(--teal);transform:scaleX(0);transition:transform .2s}.nav-row a:hover,.nav-row a.active{color:var(--teal)}.nav-row a:hover:after,.nav-row a.active:after{transform:scaleX(1)}
.hero{position:relative;min-height:525px;overflow:hidden;background:radial-gradient(circle at 83% 18%,rgba(155,224,226,.32),transparent 25%),linear-gradient(106deg,#f9fdfe,#f3fbfc 52%,#f7fcfd)}.hero:before{content:"";position:absolute;width:350px;height:350px;top:-150px;right:-80px;border-radius:50%;background:radial-gradient(circle,rgba(122,215,220,.16),transparent 68%)}.background-ribbon{position:absolute;z-index:0;width:860px;height:208px;top:92px;right:-250px;border-radius:48% 0 0 48%;background:linear-gradient(100deg,rgba(202,241,242,.08),rgba(103,203,207,.4));transform:rotate(-8deg)}.dot-grid{position:absolute;right:58px;bottom:22px;width:90px;height:58px;opacity:.6;background-image:radial-gradient(#abdfe2 2.5px,transparent 2.5px);background-size:15px 15px}.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.02fr .98fr;min-height:525px;align-items:center}.hero-copy{padding:44px 0 82px}.eyebrow{width:fit-content;margin-bottom:15px;padding:8px 16px;display:flex;align-items:center;gap:9px;color:var(--teal-dark);background:rgba(11,170,163,.09);border-radius:30px;font-size:14px;font-weight:600}h1{margin:0;color:var(--navy);font-size:clamp(36px,3.3vw,50px);font-weight:850;line-height:1.25;letter-spacing:-.04em}h1 em{direction:ltr;display:inline-block;color:var(--teal);font-style:normal;font-weight:800}.hero-copy>p{max-width:610px;margin:20px 0 0;color:#64798b;font-size:16px;font-weight:430;line-height:2.05;text-align:justify}.benefits{max-width:610px;margin-top:26px;display:grid;grid-template-columns:repeat(3,1fr)}.benefit{min-height:57px;padding:0 19px;display:flex;align-items:center;gap:12px;border-left:1px solid #dcecef}.benefit:first-child{padding-right:0}.benefit:last-child{border-left:0}.benefit>span{flex:0 0 auto;width:53px;height:53px;display:grid;place-items:center;color:var(--teal);border-radius:50%;background:linear-gradient(135deg,#ecfafa,#dff6f5)}.benefit strong{display:block;color:#183851;font-size:14px;font-weight:750;white-space:nowrap}.benefit small{display:block;margin-top:5px;color:#7890a0;font-size:11px;white-space:nowrap}.hero-actions{margin-top:34px;display:flex;gap:18px}.primary-button,.secondary-button{height:50px;display:inline-flex;align-items:center;justify-content:center;gap:11px;border-radius:26px;font-size:14px;font-weight:650;cursor:pointer;transition:transform .2s,box-shadow .2s}.primary-button{min-width:215px;color:#fff;background:linear-gradient(90deg,#0cb4aa,#069b96);box-shadow:0 12px 28px rgba(9,165,158,.25)}.secondary-button{min-width:174px;color:#324e64;border:1px solid #bdd1da;background:rgba(255,255,255,.55)}.primary-button:hover,.secondary-button:hover{transform:translateY(-2px)}.primary-button:hover{box-shadow:0 15px 32px rgba(9,165,158,.33)}.slider-dots{position:absolute;z-index:3;right:calc((100% - min(1225px,calc(100% - 56px)))/2);bottom:37px;display:flex;gap:9px;direction:ltr}.slider-dots i{width:24px;height:4px;border-radius:5px;background:#d8e9ed}.slider-dots .selected{background:var(--teal)}
.server-art{position:relative;height:430px;margin-top:18px;perspective:1000px}.art-frame{position:absolute;top:35px;right:42px;width:405px;height:345px;border:1.5px solid rgba(255,255,255,.9);border-radius:18px 110px 18px 18px;box-shadow:inset 0 0 80px rgba(255,255,255,.2)}.art-wave{position:absolute;left:-45px;bottom:24px;width:290px;height:190px;border-top:1px solid rgba(27,178,177,.36);border-radius:70% 0 0;transform:rotate(-15deg)}.platform{position:absolute;z-index:2;right:58px;bottom:38px;width:410px;height:92px;border-radius:10px 10px 30px 30px;background:linear-gradient(160deg,#fff 10%,#dceef0 80%);transform:skewY(-5deg);box-shadow:0 28px 38px rgba(18,83,96,.18)}.rack{position:absolute;z-index:4;right:92px;top:73px;width:238px;filter:drop-shadow(0 22px 16px rgba(8,55,74,.3))}.rack-top{position:relative;z-index:2;height:48px;margin-bottom:-11px;border-radius:11px 11px 7px 7px;background:linear-gradient(150deg,#8cabba,#33566a 66%,#173c51);transform:perspective(260px) rotateX(27deg);border:1px solid rgba(213,239,244,.45)}.rack-top:after{content:"";position:absolute;inset:8px 18px;border-radius:8px;background:linear-gradient(145deg,rgba(255,255,255,.2),rgba(7,36,53,.15))}.rack-unit{height:51px;position:relative;margin-top:-2px;padding:17px;border:1px solid #21495b;border-radius:3px 3px 9px 9px;background:linear-gradient(180deg,#16394c,#092b3d 52%,#0a3041);box-shadow:inset 0 3px 6px rgba(92,153,166,.15),0 6px 0 #061f2e}.rack-unit span{display:inline-block;width:7px;height:7px;margin-left:6px;border-radius:50%;background:#16e0d6;box-shadow:0 0 7px #11d9d0;animation:rack-flicker-slow 4.2s ease-in-out infinite}.rack-unit i{float:left;width:34px;height:3px;margin:5px 0 0 5px;border-radius:2px;background:#12c9c3;box-shadow:0 0 6px rgba(18,201,195,.7);animation:rack-flicker 3.4s ease-in-out infinite}
.rack-unit span.is-orange{background:#ff9f2e;box-shadow:0 0 8px #ff9f2e}
@keyframes rack-flicker{0%,100%{opacity:1}42%{opacity:1}46%{opacity:.15}50%{opacity:1}72%{opacity:1}75%{opacity:.2}79%{opacity:.9}88%{opacity:.35}92%{opacity:1}}
@keyframes rack-flicker-slow{0%,100%{opacity:1}48%{opacity:1}54%{opacity:.2}60%{opacity:1}82%{opacity:1}87%{opacity:.3}94%{opacity:.9}}.rack-base{width:215px;height:23px;margin:2px auto 0;border-radius:0 0 38px 38px;background:linear-gradient(90deg,#134a57,#12a49f,#0b5860)}.vps-badge{position:absolute;z-index:8;top:100px;right:277px;width:128px;height:106px;display:grid;place-items:center;color:#fff;border:1px solid rgba(128,255,247,.75);border-radius:14px;background:linear-gradient(145deg,rgba(59,233,221,.87),rgba(3,132,146,.82));box-shadow:0 15px 30px rgba(0,144,151,.2),inset 0 0 22px rgba(255,255,255,.22);font-family:Arial,sans-serif;font-size:41px;font-weight:750;transform:rotateY(-10deg);text-shadow:0 3px 7px rgba(0,86,95,.25);backdrop-filter:blur(4px)}.laptop{position:absolute;z-index:7;right:300px;bottom:49px;width:160px;transform:rotate(-5deg)}.laptop-screen{height:99px;padding:19px 14px;display:flex;flex-direction:column;gap:8px;color:#1dd8cf;border:7px solid #aec8d0;border-bottom-width:9px;border-radius:7px;background:#073040;box-shadow:5px 10px 16px rgba(6,55,68,.25);font:8px/1.2 monospace}.laptop-base{width:185px;height:13px;margin-right:-13px;border-radius:3px 3px 18px 18px;background:linear-gradient(#e9f2f4,#abc5cc);transform:skewX(-20deg)}.plant{position:absolute;z-index:6;right:447px;bottom:77px;width:75px;height:135px}.plant b{position:absolute;bottom:0;right:22px;width:43px;height:48px;border-radius:4px 4px 15px 15px;background:linear-gradient(90deg,#d3e7e9,#fff 50%,#b8d2d7);box-shadow:0 10px 15px rgba(9,73,84,.16)}.plant i{position:absolute;right:42px;bottom:41px;width:3px;height:69px;background:#147f6d;transform:rotate(-3deg)}.leaf{position:absolute;z-index:1;width:28px;height:53px;border-radius:100% 0 100% 0;background:linear-gradient(135deg,#49cf9c,#087b67);box-shadow:inset 7px 0 rgba(255,255,255,.1)}.leaf.one{right:12px;bottom:65px;transform:rotate(27deg)}.leaf.two{right:43px;bottom:59px;transform:rotate(-54deg)}.leaf.three{right:30px;bottom:91px;transform:rotate(-9deg)}.art-glow{position:absolute;right:70px;bottom:20px;width:410px;height:100px;background:radial-gradient(ellipse,rgba(15,184,177,.23),transparent 68%);filter:blur(12px)}
.finder-wrap{position:relative;z-index:10;height:0}.finder-card{position:absolute;top:-56px;right:50%;transform:translateX(50%);min-height:178px;padding:19px 23px 24px;border:1px solid rgba(205,220,225,.9);border-radius:25px;background:rgba(255,255,255,.96);box-shadow:0 21px 28px rgba(11,38,51,.27),0 4px 9px rgba(11,38,51,.12);backdrop-filter:blur(14px)}.product-tabs{display:flex;gap:4px;direction:rtl}.product-tabs button{min-width:120px;height:35px;padding:0 18px;color:#324b61;border:1px solid #e5ebef;border-radius:20px;background:#fff;font-size:12px;font-weight:600;cursor:pointer;box-shadow:0 3px 9px rgba(33,70,90,.05)}.product-tabs .selected{color:#fff;border-color:var(--teal);background:linear-gradient(90deg,#0ab3aa,#079a96);box-shadow:0 8px 18px rgba(7,161,155,.2)}.filter-row{margin-top:24px;display:grid;grid-template-columns:180px repeat(5,1fr);align-items:end;gap:20px}.filter{min-width:0}.filter>span{height:24px;margin:0 5px 7px;display:flex;align-items:center;gap:8px;color:#53697c;font-size:11px;font-weight:600;white-space:nowrap}.filter>span svg{color:#0e4165}.filter select{width:100%;height:47px;padding:0 15px;color:#163b58;border:1px solid #dfe9ed;outline:0;border-radius:9px;background:#fff;font-size:12px;font-weight:600;box-shadow:0 4px 13px rgba(27,65,82,.05);cursor:pointer}.filter select:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(11,170,163,.12)}.search-button{height:53px;display:flex;align-items:center;justify-content:center;gap:10px;color:#fff;border-radius:28px;background:linear-gradient(90deg,#08a29c,#0db7ad);box-shadow:0 10px 25px rgba(4,156,151,.24);font-size:14px;font-weight:700;cursor:pointer;transition:transform .2s,box-shadow .2s}.search-button:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(4,156,151,.3)}
.intro{min-height:430px;padding:129px 0 80px;overflow:hidden;background:radial-gradient(circle at -4% 94%,rgba(152,221,226,.35) 0 10%,transparent 10.2%),#fff;text-align:center}.intro>p{color:#7b8d9a;font-size:14px}.plan-preview{width:min(1200px,calc(100% - 64px));height:150px;margin:55px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;opacity:.38}.plan-preview i{border:1px solid #e3ebef;border-radius:13px;background:linear-gradient(#fff,#fbfdfe);box-shadow:0 8px 20px rgba(26,69,88,.04)}.toast{position:fixed;z-index:100;left:28px;bottom:28px;padding:13px 19px;display:flex;align-items:center;gap:10px;color:#fff;border-radius:13px;background:#0c3d50;box-shadow:0 15px 38px rgba(5,42,58,.28);animation:toast-in .3s ease both}.toast span{width:25px;height:25px;display:grid;place-items:center;color:#0c3d50;border-radius:50%;background:#7fe5d9;font-weight:900}@keyframes toast-in{from{opacity:0;transform:translateY(12px)}}:focus-visible{outline:3px solid rgba(11,170,163,.35);outline-offset:3px}
@media(max-width:1100px){.container{width:min(960px,calc(100% - 40px))}.nav-row{overflow-x:auto;justify-content:flex-start;scrollbar-width:none}.nav-row::-webkit-scrollbar{display:none}.nav-row a{padding-inline:14px}.hero-inner{grid-template-columns:1.08fr .92fr}.server-art{transform:scale(.87);transform-origin:center right}.benefit{padding-inline:9px;gap:8px}.benefit>span{width:44px;height:44px}.finder-card{width:calc(100% - 40px)}.filter-row{gap:10px;grid-template-columns:160px repeat(5,1fr)}}
@media(max-width:820px){.topbar{height:72px;grid-template-columns:1fr auto 1fr}.quick-links{display:none}.brand{grid-column:2}.brand strong{font-size:26px}.brand-mark{width:41px;height:41px}.phone-pill{grid-column:1;grid-row:1;justify-self:start;min-width:auto;width:43px;padding:0}.phone-pill span{display:none}.menu-toggle{grid-column:3;grid-row:1;display:grid;place-items:center;justify-self:end}.main-nav{position:absolute;top:72px;right:0;left:0;max-height:0;overflow:hidden;background:rgba(255,255,255,.98);box-shadow:0 18px 35px rgba(12,52,69,.12);transition:max-height .3s}.main-nav.open{max-height:570px}.nav-row{height:auto;padding:14px 20px 20px;display:grid;grid-template-columns:1fr 1fr;overflow:visible}.nav-row a{height:42px;justify-content:flex-start;padding:0 10px}.nav-row a:after{bottom:3px}.hero{min-height:auto}.hero-inner{display:block;min-height:auto}.hero-copy{padding:52px 0 235px;text-align:center}.eyebrow{margin-inline:auto}.hero-copy>p{margin-inline:auto;text-align:right}.benefits{margin-inline:auto}.hero-actions{justify-content:center}.server-art{position:absolute;right:50%;bottom:-29px;width:530px;height:300px;margin:0;transform:translateX(50%) scale(.62);transform-origin:bottom center;opacity:.95}.slider-dots{display:none}.finder-wrap{height:auto;padding:22px 0;background:#f6fbfc}.finder-card{position:static;transform:none;padding:18px;width:calc(100% - 40px)}.product-tabs{overflow-x:auto;padding-bottom:4px}.filter-row{grid-template-columns:1fr 1fr}.search-button{grid-column:1/-1;grid-row:4}.intro{padding-top:50px;min-height:300px}}
@media(max-width:540px){.container{width:calc(100% - 28px)}.brand strong{font-size:24px}.hero-copy{padding-top:40px;padding-bottom:215px}h1{font-size:36px}.hero-copy>p{font-size:14px;line-height:2}.benefits{margin-top:22px;grid-template-columns:1fr;gap:12px}.benefit{padding:0;border-left:0;justify-content:center}.benefit>div{min-width:130px;text-align:right}.hero-actions{flex-direction:column;align-items:stretch;gap:10px}.primary-button,.secondary-button{width:100%}.server-art{transform:translateX(50%) scale(.54);bottom:-40px}.finder-card{width:calc(100% - 28px);border-radius:19px}.filter-row{grid-template-columns:1fr}.search-button{grid-column:auto;grid-row:auto;margin-top:4px}.product-tabs button{min-width:104px}.plan-preview{width:calc(100% - 28px);grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

.hero-copy,
.server-art {
  direction: rtl;
}

.finder-card {
  width: min(1080px, calc(100% - 56px));
}

.eyebrow {
  margin-right: auto;
}

.hero-actions {
  direction: ltr;
}

.primary-button,
.secondary-button {
  direction: rtl;
}

@media (min-width: 1101px) {
  .hero-inner {
    grid-template-columns: 560px 1fr;
    column-gap: 45px;
  }

  h1 {
    font-size: 56px;
  }
}

@media (max-width: 1100px) {
  .finder-card {
    width: calc(100% - 40px);
  }
}

@media (max-width: 820px) {
  .hero-inner {
    direction: rtl;
  }

  .eyebrow {
    margin-right: auto;
    margin-left: auto;
  }
}

@media (max-width: 540px) {
  .finder-card {
    width: calc(100% - 28px);
  }
}

/* ===== اصلاحات: هدر جمع‌وجورتر، کادر انتخاب بالاتر، بج بالای کادر ===== */

/* هدر: متن و تصویر کوچکتر */
.hero{min-height:345px}
.hero-inner{min-height:345px}
.hero-copy{padding:22px 0 34px}
h1{font-size:clamp(28px,2.6vw,40px);line-height:1.35}
.hero-copy>p{max-width:560px;margin-top:14px;font-size:14.5px;line-height:1.85}
.benefits{max-width:560px;margin-top:16px}
.benefit{min-height:50px;padding-inline:15px}
.benefit>span{width:45px;height:45px}
.benefit>span svg{width:22px;height:22px}
.benefit strong{font-size:13px}
.slider-dots{bottom:14px;right:auto;left:calc((100% - min(1225px,calc(100% - 56px)))/2)}
.dot-grid{bottom:auto;top:150px}

@media (min-width:1101px){
  .hero-inner{grid-template-columns:540px 1fr;column-gap:40px}
  h1{font-size:40px}
  .server-art{height:340px;margin-top:0;transform:scale(.76);transform-origin:center right}
}
@media (min-width:821px) and (max-width:1100px){
  .server-art{height:350px;margin-top:0;transform:scale(.72);transform-origin:center right}
}

/* کادر انتخاب پلن بالاتر + بج بالای آن، سمت راست */
.finder-shell{position:absolute;top:-58px;right:50%;transform:translateX(50%);width:min(1080px,calc(100% - 56px))}
.finder-card{position:static;transform:none;width:100%}
.finder-shell .eyebrow{margin:0 4px 12px auto;box-shadow:0 6px 16px rgba(11,170,163,.12)}
.intro{padding-top:196px}

@media (max-width:1100px){
  .finder-shell{width:calc(100% - 40px)}
}
@media (max-width:820px){
  .finder-shell{position:static;transform:none;width:100%;padding-inline:20px}
  .finder-shell .eyebrow{margin-inline:0 auto}
  .finder-card{width:100%}
  .hero-copy{padding:44px 0 215px}
  .intro{padding-top:50px}
}
@media (max-width:540px){
  .finder-shell{padding-inline:14px}
  .finder-card{width:100%}
}

/* ===== هدر شیک: کارت شناور سفید + نوار ناوبری تیره با گودی لوگو ===== */
.site-header{position:relative;z-index:20;padding:16px 0 0;background:linear-gradient(180deg,#eef8f9 0%,#f6fcfd 55%,#fff 100%);box-shadow:none}
.site-header:before{content:"";position:absolute;top:0;right:0;left:0;height:4px;background:linear-gradient(90deg,#0ab3aa,#5fe3d8 45%,#0a7f9a)}

.topbar{position:relative;z-index:3;height:76px;padding-inline:26px;border-radius:30px;background:#fff;box-shadow:0 14px 34px rgba(11,58,74,.10),0 2px 6px rgba(11,58,74,.05)}

/* لوگو وسط، با گودی سفید که روی نوار تیره می‌افتد */
.brand{position:relative;z-index:5;align-self:stretch;margin-bottom:-34px;padding:12px 30px 16px;gap:11px;border-radius:0 0 42px 42px;background:#fff;box-shadow:0 16px 24px rgba(10,60,76,.09)}
.brand strong{font-size:28px}
.brand-mark{width:44px;height:44px}
.brand-mark i{top:4px;height:36px}

/* نوار ناوبری تیره و تودار */
.main-nav{position:relative;z-index:2;width:min(1195px,calc(100% - 80px));margin:-30px auto 0;padding-top:30px;border-top:0;border-radius:0 0 30px 30px;background:linear-gradient(95deg,#0c3a4e,#12505f 55%,#0b3547);box-shadow:0 18px 30px rgba(10,48,62,.18)}
.nav-row{width:auto;height:56px;padding-inline:18px;gap:0}
.nav-row a{color:#d7e8ec;font-size:13px;font-weight:550}
.nav-row a:hover,.nav-row a.active{color:#63e6da}
.nav-row a:after{bottom:10px;height:2.5px;background:linear-gradient(90deg,#3fd8cd,#0ab3aa)}

/* لینک‌های بالا و دکمه تماس */
.quick-links{gap:22px;font-size:12.5px}
.quick-links a{padding:8px 13px;border-radius:22px;border:1px solid transparent;transition:color .2s,background .2s,border-color .2s}
.quick-links a:hover{color:var(--teal);border-color:rgba(11,170,163,.25);background:rgba(11,170,163,.07)}
.phone-pill{height:44px;border-radius:26px;box-shadow:0 12px 24px rgba(3,161,154,.28);transition:transform .2s,box-shadow .2s}
.phone-pill:hover{transform:translateY(-2px);box-shadow:0 16px 28px rgba(3,161,154,.34)}

/* هماهنگی هیرو با هدر جدید */
.hero{margin-top:-24px;padding-top:24px;border-radius:0}

@media (max-width:1100px){
  .main-nav{width:calc(100% - 80px)}
  .nav-row{padding-inline:16px}
}

@media (max-width:820px){
  .site-header{padding-top:12px}
  .topbar{height:70px;padding-inline:16px;border-radius:24px}
  .brand{align-self:center;margin-bottom:0;padding:0;border-radius:0;background:transparent;box-shadow:none}
  .brand strong{font-size:24px}
  .main-nav{position:absolute;top:96px;right:14px;left:14px;width:auto;margin:0;padding-top:0;max-height:0;border-radius:22px;background:linear-gradient(160deg,#0c3a4e,#12505f);box-shadow:0 22px 40px rgba(8,42,56,.28)}
  .main-nav.open{max-height:600px}
  .nav-row{padding:12px 14px 16px}
  .nav-row a{color:#dceaee}
  .nav-row a.active{color:#63e6da}
  .menu-toggle{width:42px;height:42px;border-radius:14px;background:rgba(11,170,163,.09);color:#0b3a4e}
  .hero{margin-top:-16px;padding-top:16px}
}

@media (max-width:540px){
  .topbar{padding-inline:12px}
  .main-nav{top:90px;right:10px;left:10px}
}

.nav-notch{flex:0 0 auto;width:196px}
@media (max-width:1100px){.nav-notch{width:190px}}
@media (max-width:820px){.nav-notch{display:none}}

@media (min-width:1101px) and (max-width:1300px){
  .main-nav{width:calc(100% - 56px)}
  .nav-row{padding-inline:12px}
  .nav-row a{padding:0 6px;font-size:12.5px}
  .nav-notch{width:176px}
}
@media (min-width:1101px) and (max-width:1160px){.nav-notch{width:158px}.nav-row a{padding:0 5px}}

.nav-row{justify-content:center}
.nav-side{flex:1 1 0;min-width:0;display:flex;align-items:stretch;justify-content:space-evenly}
@media (max-width:820px){
  .nav-row{display:block;padding:12px 14px 16px}
  .nav-side{display:grid;grid-template-columns:1fr 1fr;width:100%}
}

@media (max-width:820px){
  .nav-row{height:auto}
  .nav-side{gap:2px}
  .nav-row a{height:44px;justify-content:flex-start;padding:0 12px;border-radius:12px}
  .nav-row a:hover{background:rgba(255,255,255,.06)}
  .nav-row a:after{right:12px;left:auto;width:22px;bottom:7px}
  .nav-row a.active:after,.nav-row a:hover:after{transform:scaleX(1)}
}
@media (max-width:820px){
  .nav-row{display:grid;grid-template-columns:1fr 1fr;gap:2px}
  .nav-side{display:contents}
}

/* ===== منو: یک ردیف، وسط و زیر لوگو، داخل نوار تیره هدر (فقط دسکتاپ) ===== */
@media (min-width:821px){
  .main-nav{padding-top:62px}
  .nav-row{height:52px;justify-content:center;gap:2px;overflow:visible}
  .nav-notch{display:none}
  .nav-side{display:contents}
  .nav-row a{padding:0 10px}
}
@media (min-width:821px) and (max-width:1100px){
  .nav-row{gap:0;padding-inline:8px;justify-content:safe center;overflow-x:auto}
  .nav-row a{padding:0 5px;font-size:11.5px;gap:3px}
}

/* ===== وسط‌چین کردن متن و تصویر هیرو (دسکتاپ) ===== */
@media (min-width:1101px){
  .hero-inner{grid-template-columns:540px 397px;justify-content:center}
  .server-art{width:522px;justify-self:start}
}

/* ===== خط پایین هیرو از وسط کادر انتخاب پلن رد می‌شود (دسکتاپ و تبلت) ===== */
@media (min-width:821px){
  .hero{padding-bottom:121px}
  .finder-shell{top:-141px}
  .intro{padding-top:113px}
  .slider-dots{bottom:97px}
}

/* ===== لوگوی وسط هدر (تصویر) ===== */
.brand-logo{display:block;height:auto;width:auto;max-width:100%}

/* ===== حذف ۳ خط اسلایدر ===== */
.slider-dots{display:none!important}

/* ===== پس‌زمینه‌ی هیرو با عکس، کم‌رنگ ===== */
.hero:after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:url("hero-bg.png") center bottom/cover no-repeat;opacity:.12}


/* ===== فونت وزیر برای کل صفحه ===== */
@font-face{font-family:"Vazir";src:url("../fonts/Vazir-Light.woff2") format("woff2");font-weight:100 350;font-style:normal;font-display:swap}
@font-face{font-family:"Vazir";src:url("../fonts/Vazir-Regular.woff2") format("woff2");font-weight:351 480;font-style:normal;font-display:swap}
@font-face{font-family:"Vazir";src:url("../fonts/Vazir-Medium.woff2") format("woff2");font-weight:481 620;font-style:normal;font-display:swap}
@font-face{font-family:"Vazir";src:url("../fonts/Vazir-Bold.woff2") format("woff2");font-weight:621 800;font-style:normal;font-display:swap}
@font-face{font-family:"Vazir";src:url("../fonts/Vazir-Black.woff2") format("woff2");font-weight:801 900;font-style:normal;font-display:swap}
:root,body,button,input,select,textarea{font-family:"Vazir",Tahoma,sans-serif}

/* ===== کادر جستجو: خالی با همان اندازه، و بج «خرید سریع و آسان» بالا وسط ===== */
.finder-card{height:182px;min-height:182px}
.finder-shell .eyebrow{position:relative;z-index:2;margin:0 auto -19px;background:#e6f6f5;border:1px solid rgba(11,170,163,.14)}
@media (min-width:821px){
  .finder-shell{top:-113px}
}

/* ===== متن و تصویر سرور کمی به چپ (دسکتاپ) ===== */
@media (min-width:1101px){
  .hero-inner{position:relative;right:30px}
}

/* ===== محو شدن نرم لبه‌ی بالا و پایین هیرو (دسکتاپ و تبلت) ===== */
@media (min-width:821px){
  .hero{
    -webkit-mask-image:linear-gradient(to bottom,transparent 24px,#000 70px,#000 calc(100% - 100px),transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 24px,#000 70px,#000 calc(100% - 100px),transparent 100%);
  }
}

/* ===== محتوای کادر: انتخاب منابع سرور (اسلایدرها) ===== */
.finder-card{padding:26px 14px 14px}
.res-grid{height:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.res-card{min-width:0;padding:10px 18px 8px;display:flex;flex-direction:column;align-items:stretch;border:1px solid #e8eff5;border-radius:18px;background:#f6fafd}
.res-head{display:flex;align-items:center;gap:10px;color:#0e3a5f;font-size:13.5px;font-weight:500}
.res-head svg{flex:0 0 auto;color:#12395c}
.res-value{align-self:center;margin-top:2px;min-width:104px;padding:0 18px;height:34px;display:inline-flex;align-items:center;justify-content:center;direction:ltr;color:#0d3358;font-size:18px;font-weight:700;border:1px solid #e6eef4;border-radius:20px;background:#eef6fa}
.res-range{--p:40%;-webkit-appearance:none;appearance:none;width:100%;height:20px;margin:8px 0 0;padding:0;background:transparent;cursor:pointer;outline:0}
.res-range::-webkit-slider-runnable-track{height:7px;border-radius:7px;background:linear-gradient(90deg,#3dbfae 0,#1f8a92 var(--p),#dde5f0 var(--p),#e4eaf3 100%)}
.res-range::-moz-range-track{height:7px;border-radius:7px;background:#dde5f0}
.res-range::-moz-range-progress{height:7px;border-radius:7px;background:linear-gradient(90deg,#3dbfae,#1f8a92)}
.res-range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-5.5px;border:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#2fb3a5,#137a86 70%);box-shadow:0 2px 6px rgba(10,90,100,.4)}
.res-range::-moz-range-thumb{width:18px;height:18px;border:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#2fb3a5,#137a86 70%);box-shadow:0 2px 6px rgba(10,90,100,.4)}
.res-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px rgba(11,170,163,.25)}
.res-scale{margin-top:4px;display:flex;justify-content:space-between;color:#4c6a8f;font-size:11.5px;font-weight:400}
@media (max-width:820px){
  .finder-card{height:auto;min-height:182px}
}
@media (max-width:700px){
  .res-grid{grid-template-columns:1fr}
}

/* ===== کادر انتخاب منابع: متن راهنما، دکمه جستجو و انتخاب منطقه (ایران / اروپا) ===== */
.finder-card{height:auto;min-height:0;padding:26px 14px 16px}
.finder-hint{margin:6px 0 12px;text-align:center;color:#0e3a5f;font-size:14px;font-weight:500;transition:opacity .22s ease,transform .22s ease}
.finder-hint.is-swapping{opacity:0;transform:translateY(-5px)}
.finder-stage{position:relative}
.finder-actions{margin-top:12px;display:flex;align-items:center;justify-content:center;gap:30px;transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s}
.finder-go{min-width:200px;height:44px;padding:0 34px;border:0;font-family:inherit}
.price-mode-toggle{display:inline-flex;align-items:center;gap:7px;padding:7px 2px;border:0;background:transparent;color:#293943;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:color .2s ease}
.price-mode-toggle svg{transition:transform .25s ease}
.price-mode-toggle:hover{color:var(--teal-dark)}
.finder-card.is-price-mode .price-mode-toggle svg{transform:rotate(180deg)}
@media(min-width:821px){.finder-wrap.price-mode-active{height:72px}}
.price-search-panel{display:none;grid-template-columns:1fr;gap:18px;max-width:820px;margin:0 auto;transition:opacity .35s ease,visibility 0s linear .35s}
.finder-card.is-price-mode .price-search-panel{display:grid}
.finder-card.is-price-mode .res-grid{display:none}
.finder-card.is-collapsed .price-search-panel{opacity:0;visibility:hidden;pointer-events:none}
.price-periods{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.price-period{position:relative;cursor:pointer}
.price-period input{position:absolute;opacity:0;pointer-events:none}
.price-period span{height:43px;display:flex;align-items:center;justify-content:center;border:1px solid #dce9ee;border-radius:13px;background:#f8fbfd;color:#496477;font-size:13px;font-weight:700;transition:.2s ease}
.price-period input:checked+span{border-color:var(--teal);background:linear-gradient(180deg,#fff,#e8f9f7);color:var(--teal-dark);box-shadow:0 7px 16px rgba(11,170,163,.12)}
.price-period input:focus-visible+span{outline:3px solid rgba(11,170,163,.2);outline-offset:2px}
.budget-range{padding:16px 20px 13px;border:1px solid #e0ebef;border-radius:18px;background:#fbfdfd}
.budget-values{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px;color:#607b88;font-size:12px}
.budget-values span{display:flex;align-items:baseline;gap:6px}
.budget-values strong{direction:ltr;color:#0d3358;font-size:15px}
.budget-slider{position:relative;height:22px}
.budget-track{position:absolute;top:8px;right:0;left:0;height:7px;border-radius:9px;background:linear-gradient(90deg,#dfe7ed 0,#dfe7ed var(--from),#1f9d99 var(--from),#37bea9 var(--to),#dfe7ed var(--to),#dfe7ed 100%)}
.budget-slider input{position:absolute;inset:0;width:100%;height:22px;margin:0;-webkit-appearance:none;appearance:none;background:transparent;pointer-events:none;outline:0}
.budget-slider input::-webkit-slider-runnable-track{height:7px;background:transparent}
.budget-slider input::-moz-range-track{height:7px;background:transparent}
.budget-slider input::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;margin-top:-6.5px;border:2px solid #fff;border-radius:50%;background:linear-gradient(145deg,#35c4b2,#137f8a);box-shadow:0 2px 8px rgba(10,90,100,.35);pointer-events:auto;cursor:grab}
.budget-slider input::-moz-range-thumb{width:18px;height:18px;border:2px solid #fff;border-radius:50%;background:linear-gradient(145deg,#35c4b2,#137f8a);box-shadow:0 2px 8px rgba(10,90,100,.35);pointer-events:auto;cursor:grab}
.budget-slider input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px rgba(11,170,163,.23)}
.budget-scale{display:flex;justify-content:space-between;margin-top:5px;color:#8ba0aa;font-size:10.5px}
.finder-restart{position:absolute;z-index:20;top:50%;right:50%;display:flex;align-items:center;justify-content:center;gap:9px;min-width:174px;height:46px;padding:0 24px;border:0;border-radius:24px;background:linear-gradient(90deg,#08a29c,#0db7ad);color:#fff;font-family:inherit;font-size:13.5px;font-weight:800;box-shadow:0 12px 28px rgba(4,156,151,.3);opacity:0;visibility:hidden;pointer-events:none;transform:translate(50%,-40%) scale(.94);transition:opacity .25s ease,transform .3s ease,visibility 0s linear .3s;cursor:pointer}
.finder-restart:hover{transform:translate(50%,-50%) scale(1.03)}
.finder-card.is-search-complete .finder-hint,.finder-card.is-search-complete .finder-stage{filter:blur(5px);opacity:.42;pointer-events:none;user-select:none;transition:filter .35s ease,opacity .35s ease}
.finder-card.is-search-complete .finder-restart{opacity:1;visibility:visible;pointer-events:auto;transform:translate(50%,-50%) scale(1);transition-delay:.08s}
.price-sel-summary{position:absolute;top:0;left:0;right:0;z-index:2;display:none;align-items:center;justify-content:center;padding:0 10px;color:#0d3358;font-size:12px;font-weight:700;line-height:1.5;text-align:center;direction:rtl}
.finder-card.is-price-mode.is-collapsed .sel-summary{display:none}
.finder-card.is-price-mode.is-collapsed .price-sel-summary{display:flex;animation:sel-in .5s cubic-bezier(.2,.9,.3,1.15) .55s both}
@media(max-width:700px){.finder-actions{flex-direction:column;gap:10px}.price-periods{grid-template-columns:repeat(2,1fr)}.budget-values{align-items:stretch;flex-direction:column;gap:5px}.budget-values span{justify-content:space-between}.price-search-panel{gap:12px}}

/* جمع شدن سه کادر به مرکز */
.res-card{transition:transform .65s cubic-bezier(.65,0,.25,1),opacity .45s ease .15s,filter .5s ease}
.finder-card.is-collapsed .res-grid{pointer-events:none;visibility:hidden;transition:visibility 0s linear .7s}
.finder-card.is-collapsed .res-card{opacity:0;filter:blur(6px)}
.finder-card.is-collapsed .res-card:nth-child(1){transform:translateX(calc(-100% - 14px)) scale(.12)}
.finder-card.is-collapsed .res-card:nth-child(2){transform:scale(.12)}
.finder-card.is-collapsed .res-card:nth-child(3){transform:translateX(calc(100% + 14px)) scale(.12)}
.finder-card.is-collapsed .finder-actions{opacity:0;transform:translateY(10px) scale(.9);pointer-events:none;visibility:hidden}

/* دو دکمه انتخاب منطقه */
.region-pick{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;visibility:hidden}
.region-pick-row{display:flex;align-items:center;justify-content:center;gap:18px}
.region-pick:before{content:"";position:absolute;top:50%;left:50%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:radial-gradient(circle,rgba(11,170,163,.42),rgba(11,170,163,0) 68%);opacity:0;transform:scale(0);pointer-events:none}
.finder-card.is-collapsed .region-pick{visibility:visible}
.finder-card.is-collapsed .region-pick:before{animation:finder-burst .9s ease-out .3s both}
.region-btn{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;flex:0 1 250px;min-width:0;height:78px;padding:0 22px;color:#0d3358;border:1px solid #dbe8ee;border-radius:18px;background:#f6fafd;font-size:18px;font-weight:700;cursor:pointer;box-shadow:0 8px 20px rgba(27,65,82,.07);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease}
.region-btn img{flex:0 0 auto;width:54px;height:40px;border-radius:7px;object-fit:cover;box-shadow:0 3px 9px rgba(10,40,60,.25)}
.region-btn:hover{transform:translateY(-3px);border-color:var(--teal);background:#fff;box-shadow:0 14px 26px rgba(9,165,158,.2)}
.region-btn:active{transform:translateY(-1px) scale(.98)}
.finder-card.is-collapsed .region-btn{animation:region-in .6s cubic-bezier(.2,.9,.3,1.15) .55s backwards}
.finder-card.is-collapsed .region-btn:nth-child(2){animation-delay:.68s}
@keyframes region-in{from{opacity:0;transform:translateY(16px) scale(.8)}}
@keyframes finder-burst{0%{opacity:0;transform:scale(0)}35%{opacity:1}100%{opacity:0;transform:scale(2.6)}}

/* لینک بازگشت زیر دکمه‌های منطقه */
.region-back{display:inline-flex;align-items:center;gap:6px;background:none;border:1px solid transparent;border-radius:10px;padding:5px 12px;color:var(--teal);font-size:14px;font-weight:600;cursor:pointer;opacity:0;transition:border-color .2s ease}
.region-back svg{transition:transform .2s ease}
.region-back:hover{border-color:var(--teal)}
.region-back:hover svg{transform:translateX(4px)}
.finder-card.is-collapsed .region-back{opacity:1;animation:region-back-in .5s cubic-bezier(.2,.9,.3,1.15) .8s backwards}
@keyframes region-back-in{from{opacity:0;transform:translateY(16px) scale(.8)}to{opacity:1;transform:none}}

/* جای بیشتر برای متن راهنما و دکمه (دسکتاپ و تبلت) */
@media (min-width:821px){
  .finder-shell{top:-152px}
  .hero{padding-bottom:160px}
  .intro{padding-top:165px}
}
@media (max-width:700px){
  .finder-stage{transition:height .5s cubic-bezier(.65,0,.25,1) .45s}
  .finder-card.is-collapsed .finder-stage{overflow:hidden}
  .finder-card.is-collapsed .region-btn{animation-delay:.95s}
  .finder-card.is-collapsed .region-btn:nth-child(2){animation-delay:1.05s}
  .finder-card.is-collapsed .res-card:nth-child(1){transform:translateY(calc(100% + 14px)) scale(.12)}
  .finder-card.is-collapsed .res-card:nth-child(2){transform:scale(.12)}
  .finder-card.is-collapsed .res-card:nth-child(3){transform:translateY(calc(-100% - 14px)) scale(.12)}
}
@media (max-width:540px){
  .region-pick{gap:10px;padding:0 4px}
  .region-pick-row{width:100%}
  .region-btn{flex:1 1 0;height:70px;padding:0 10px;gap:9px;font-size:16px}
  .region-btn img{width:44px;height:33px}
}

/* ===== خلاصه انتخاب کاربر (بالای پرچم‌ها) ===== */
.sel-summary{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:10px;direction:ltr;visibility:hidden;pointer-events:none}
.sel-chip{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 13px 0 10px;color:#0d3358;border:1px solid #e2ecf1;border-radius:20px;background:#fff;font-size:12.5px;font-weight:600;box-shadow:0 3px 10px rgba(27,65,82,.06);opacity:0}
.sel-chip svg{flex:0 0 auto;width:15px;height:15px;color:#1b2b3a}
.finder-card.is-collapsed .sel-summary{visibility:visible}
.finder-card.is-collapsed .sel-chip{animation:sel-in .5s cubic-bezier(.2,.9,.3,1.15) .55s both}
.finder-card.is-collapsed .sel-chip:nth-child(2){animation-delay:.63s}
.finder-card.is-collapsed .sel-chip:nth-child(3){animation-delay:.71s}
@keyframes sel-in{from{opacity:0;transform:translateY(-8px) scale(.85)}to{opacity:1;transform:none}}
.region-pick{padding-top:38px}
@media (max-width:700px){
  .finder-card.is-collapsed .sel-chip{animation-delay:.95s}
  .finder-card.is-collapsed .sel-chip:nth-child(2){animation-delay:1.03s}
  .finder-card.is-collapsed .sel-chip:nth-child(3){animation-delay:1.11s}
}
@media (max-width:540px){
  .sel-summary{gap:6px}
  .sel-chip{height:28px;padding:0 9px 0 7px;gap:5px;font-size:11.5px}
  .sel-chip svg{width:14px;height:14px}
  .region-pick{padding-top:34px}
}

/* ===== ماسکات سمت چپ رک: دست ماسکات روی سقف رک ===== */
.server-art{width:522px;height:340px}
.server-art .art-glow{right:auto;left:50%;margin-left:-205px;bottom:6px;width:410px;height:90px}
.platform{right:auto;left:50%;margin-left:-215px;bottom:22px;width:430px;height:70px}
.art-frame{right:auto;left:50%;margin-left:-215px}
.rack{right:auto;left:50%;margin-left:-141px;top:167px;width:196px;transform-origin:top center}
.rack .rack-unit{height:42px;padding:13px 14px}
.rack .rack-top{height:38px}
.rack .rack-base{width:176px;height:19px}
.mascot{position:absolute;z-index:6;display:block;width:auto;height:300px;left:50%;top:30px;margin-left:-255px;filter:drop-shadow(0 12px 14px rgba(8,60,78,.16));pointer-events:none}

/* پای ماسکات روی سکو */
.platform{bottom:16px}
.art-glow{bottom:0}

/* موبایل و تبلت: کادر کامل‌تر و بدون بریدگی */
@media (max-width:820px){
  .server-art{width:522px;height:340px;transform:translateX(50%) scale(.6);transform-origin:bottom center;bottom:-2px}
}
@media (max-width:540px){
  .server-art{transform:translateX(50%) scale(.56);bottom:0}
  .hero-copy{padding-bottom:240px}
}

/* ===== کادر پشت رک: برعکس شد تا سمت گرد بزرگ کادر سمت ماسکات (چپ) باشد ===== */
.art-frame{border-radius:110px 18px 18px 18px}

/* جمع شدن المان‌های انتخاب منطقه به نقطه‌ی مرکز (بردار هر المان تا مرکز را JS در --dx/--dy می‌گذارد) */
.finder-card.is-picked .region-pick{visibility:visible}
.finder-card.is-collapsed.is-picked .region-btn:nth-child(n),
.finder-card.is-collapsed.is-picked .region-back,
.finder-card.is-collapsed.is-picked .sel-chip:nth-child(n){
  pointer-events:none;
  animation:fs-suck .45s cubic-bezier(.65,0,.25,1) both;
}
@keyframes fs-suck{
  from{opacity:1;transform:none;filter:blur(0)}
  to{opacity:0;transform:translate(var(--dx,0px),var(--dy,0px)) scale(.06);filter:blur(5px)}
}
.finder-card.is-picked .finder-hint{opacity:0;transform:translateY(-5px)}

/* ===== کادر پشت ماسکات: کل ماسکات (سر تا پا) داخل کادر باشد ===== */
.art-frame{
  margin-left:-267px;   /* لبه‌ی چپ کادر کمی چپ‌تر از پای ماسکات */
  width:458px;          /* لبه‌ی راست سر جای قبلی می‌ماند */
  top:12px;
  height:369px;
  border-radius:110px 18px 18px 18px; /* گردی بزرگ سمت ماسکات */
}
/* خط منحنی تزئینی هم داخل کادر بیفتد */
.art-wave{left:6px;bottom:52px;width:250px;height:170px}

/* ===== سکو و سایه‌ی زیرش کامل داخل کادر (نه بیرون‌زده از سمت راست) ===== */
.platform{margin-left:-251px;width:430px}      /* 10 .. 440 در حالی که کادر -6 .. 452 است */
.server-art .art-glow{margin-left:-239px;width:410px}

/* ============================================================
   پنل «در حال جست‌وجو» بعد از انتخاب لوکیشن (فقط ظاهر جستجو)
   ============================================================ */
.scan-stage{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center;visibility:hidden;opacity:0;transform:translateY(8px) scale(.98);pointer-events:none;transition:opacity .45s ease,transform .5s cubic-bezier(.2,.75,.25,1),visibility 0s linear .5s}
.finder-card.is-scanning .scan-stage{visibility:visible;opacity:1;transform:none;transition-delay:0s}
.finder-card.is-scanning .finder-stage{min-height:190px}

.scan-orb{position:relative;width:70px;height:70px;display:grid;place-items:center;margin-bottom:4px}
.scan-ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(11,170,163,.34);opacity:0;transform:scale(.55);animation:scan-pulse 2.6s cubic-bezier(.25,.6,.3,1) infinite}
.scan-ring.r2{animation-delay:.85s}
.scan-ring.r3{animation-delay:1.7s}
@keyframes scan-pulse{0%{opacity:0;transform:scale(.55)}18%{opacity:.9}100%{opacity:0;transform:scale(1.55)}}
.scan-core{position:relative;width:52px;height:52px;display:grid;place-items:center;color:#fff;border-radius:50%;background:linear-gradient(145deg,#17bdb4,#0b738b);box-shadow:0 10px 22px rgba(10,124,139,.28),inset 0 0 0 4px rgba(255,255,255,.14);animation:scan-float 2.6s ease-in-out infinite}
.scan-core:before{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px dashed rgba(11,170,163,.4);animation:scan-spin 9s linear infinite}
.scan-core svg{position:relative;animation:scan-sweep 2.6s ease-in-out infinite}
@keyframes scan-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes scan-spin{to{transform:rotate(360deg)}}
@keyframes scan-sweep{0%,100%{transform:translate(-1.5px,1px) rotate(-6deg)}50%{transform:translate(1.5px,-1px) rotate(6deg)}}

.scan-title{display:inline-flex;align-items:center;gap:6px;color:#0d3358;font-size:15.5px;font-weight:800;direction:rtl}
.scan-dots{display:inline-flex;gap:3px;direction:ltr}
.scan-dots i{width:5px;height:5px;border-radius:50%;background:var(--teal);animation:scan-dot 1.2s ease-in-out infinite}
.scan-dots i:nth-child(2){animation-delay:.18s}
.scan-dots i:nth-child(3){animation-delay:.36s}
@keyframes scan-dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.scan-sub{color:#63798d;font-size:12.5px;font-weight:400}
.scan-loc{color:var(--teal-dark);font-weight:700}
.scan-bar{position:relative;width:150px;height:4px;margin-top:7px;overflow:hidden;border-radius:4px;background:#e2eef1}
.scan-bar i{position:absolute;top:0;bottom:0;width:42%;border-radius:4px;background:linear-gradient(90deg,transparent,#22c6b9,#0b8e9c,transparent);animation:scan-bar 1.5s cubic-bezier(.45,0,.3,1) infinite}
@keyframes scan-bar{0%{left:-45%}100%{left:105%}}
@media (max-width:700px){.finder-card.is-scanning .finder-stage{min-height:200px}.scan-title{font-size:14px}}


/* ============================================================
   کانتینر پایین صفحه: عنوان + زیرعنوان + ۳ دسته‌بندی
   ============================================================ */
.intro{min-height:0;padding-bottom:84px}
.intro-line{margin:0 0 34px;color:#7b8d9a;font-size:14px}

.showcase{position:relative;isolation:isolate;overflow:hidden;padding:54px 44px 46px;border:1px solid #dcebee;border-radius:34px;background:linear-gradient(160deg,#f3fbfb 0%,#ffffff 46%,#eef8f9 100%);box-shadow:0 26px 60px rgba(11,58,74,.08),0 2px 6px rgba(11,58,74,.04);width:min(1080px,calc(100% - 56px))}
.showcase-orb{position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
.showcase-orb.o1{width:340px;height:340px;top:-150px;right:-90px;background:radial-gradient(circle,rgba(34,198,185,.2),transparent 68%)}
.showcase-orb.o2{width:300px;height:300px;bottom:-140px;left:-80px;background:radial-gradient(circle,rgba(255,182,72,.16),transparent 68%)}
.showcase-grid{position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:.5;background-image:radial-gradient(#b9e2e5 1.4px,transparent 1.4px);background-size:22px 22px;-webkit-mask-image:radial-gradient(ellipse at 50% 0,#000 0,transparent 62%);mask-image:radial-gradient(ellipse at 50% 0,#000 0,transparent 62%)}

.showcase-head{max-width:640px;margin:0 auto 38px;text-align:center}
.showcase-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 15px;color:var(--teal-dark);border:1px solid rgba(11,170,163,.18);border-radius:24px;background:rgba(11,170,163,.08);font-size:12px;font-weight:700}
.showcase-badge i{width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px rgba(11,170,163,.16)}
.showcase-head h2{margin:14px 0 10px;color:var(--navy);font-size:clamp(23px,2.4vw,31px);font-weight:850;line-height:1.5;letter-spacing:-.02em}
.showcase-head p{margin:0;color:#64798b;font-size:14px;line-height:2}

.cat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cat-card{--tone:#0baaa3;--tone-soft:rgba(11,170,163,.1);position:relative;display:flex;flex-direction:column;overflow:hidden;border:1px solid #e1edf0;border-radius:24px;background:#fff;box-shadow:0 10px 26px rgba(18,76,94,.06);transition:transform .3s cubic-bezier(.2,.75,.25,1),box-shadow .3s ease,border-color .3s ease}
.cat-card[data-tone="navy"]{--tone:#12507a;--tone-soft:rgba(18,80,122,.09)}
.cat-card[data-tone="amber"]{--tone:#ef7d1f;--tone-soft:rgba(239,125,31,.1)}
.cat-card:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--tone) 45%,#fff);box-shadow:0 22px 40px rgba(18,76,94,.13)}
.cat-media{position:relative;height:158px;display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,var(--tone-soft),transparent 72%),linear-gradient(180deg,#f7fcfc,#fff)}
.cat-media:after{content:"";position:absolute;right:0;bottom:0;left:0;height:1px;background:linear-gradient(90deg,transparent,#e1edf0 20%,#e1edf0 80%,transparent)}
.cat-media svg{width:78%;max-width:210px;height:auto;transition:transform .45s cubic-bezier(.2,.75,.25,1)}
.cat-card:hover .cat-media svg{transform:translateY(-4px) scale(1.05)}
.cat-body{display:flex;flex-direction:column;gap:6px;padding:18px 22px 20px;text-align:right}
.cat-body strong{color:#0a2f4d;font-size:16.5px;font-weight:850}
.cat-body small{color:#6b8091;font-size:12.5px;line-height:1.8}
.cat-go{position:absolute;bottom:18px;left:18px;width:36px;height:36px;display:grid;place-items:center;color:var(--tone);border-radius:50%;background:var(--tone-soft);transition:transform .3s ease,background .3s ease,color .3s ease}
.cat-go svg{transition:transform .3s ease}
.cat-card:hover .cat-go{color:#fff;background:var(--tone)}
.cat-card:hover .cat-go svg{transform:translateX(-3px)}
.cat-card.is-active{border-color:color-mix(in srgb,var(--tone) 55%,#fff);box-shadow:0 18px 34px rgba(18,76,94,.14)}
.cat-card.is-active .cat-go{color:#fff;background:var(--tone)}

.featured-plans{margin-top:36px}
.featured-title{margin:0 0 20px;text-align:center;color:var(--navy);font-size:clamp(19px,2vw,23px);font-weight:850;letter-spacing:-.01em}

@media (max-width:1100px){.showcase{width:calc(100% - 40px)}}
@media (max-width:820px){
  .intro{padding-bottom:56px}
  .showcase{padding:40px 22px 30px;border-radius:26px}
  .cat-row{grid-template-columns:1fr;gap:14px}
  .cat-card{flex-direction:row;align-items:center}
  .cat-media{flex:0 0 132px;height:118px;border-bottom:0}
  .cat-media:after{display:none}
  .cat-body{flex:1;padding:14px 16px 14px 56px}
}
@media (max-width:540px){
  .showcase{width:calc(100% - 28px);padding:34px 16px 22px}
  .cat-media{flex-basis:108px;height:104px}
  .cat-body strong{font-size:15px}
}

/* ===== ۳ باکس شناور بالای رک سرور (VPS / ماشین مجازی / منابع ایزوله) — برگردانده‌شده از نسخه‌ی قبلی ===== */
.vps-stack{position:absolute;z-index:6;top:2px;left:50%;margin-left:-10px;width:230px;height:190px}
.vps-card{position:absolute;display:flex;align-items:center;gap:9px;padding:8px 12px;border-radius:12px;background:#fff;box-shadow:0 10px 22px rgba(6,58,74,.14),inset 0 0 0 1px rgba(15,158,161,.1)}
.vps-card-1{top:0;right:0}
.vps-card-2{top:64px;left:0}
.vps-card-3{top:128px;right:0}
.vps-card-icon{flex:0 0 auto;width:28px;height:28px;display:grid;place-items:center;color:#fff;border-radius:8px;background:linear-gradient(150deg,#12c4ba,#087a86)}
.vps-card-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.vps-card-text b{color:var(--navy);font-size:13px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vps-card-text i{display:flex;align-items:center;gap:5px;color:#0b2b45;font-style:normal;font-size:10.5px;font-weight:600;direction:ltr;white-space:nowrap}
.vps-badge-dot{width:6px;height:6px;border-radius:50%;background:#39c95c;animation:vps-dot-pulse 2.4s ease-in-out infinite}
@keyframes vps-dot-pulse{0%,100%{opacity:1}50%{opacity:.35}}
.vps-stack{top:0;margin-left:-6px;width:206px;height:170px}
.vps-card-2{top:58px}
.vps-card-3{top:114px}
.vps-card{padding:7px 10px;gap:7px}
.vps-card-icon{width:24px;height:24px}
.vps-card-icon svg{width:14px;height:14px}
.vps-card-text b{font-size:11.5px}
.vps-card-text i{font-size:9.5px}

/* ============================================================
   انتخاب لوکیشن سرور — نوار کپسولی مینیمال با هایلایت لغزنده
   ============================================================ */
.loc-picker{margin:0 auto 32px;display:flex;flex-direction:column;align-items:center;gap:12px}
.loc-label{display:inline-flex;align-items:center;gap:10px;color:#7b8fa0;font-size:12px;font-weight:600}
.loc-label:before,.loc-label:after{content:"";width:30px;height:1px;background:linear-gradient(90deg,transparent,#cfe3e6)}
.loc-label:after{background:linear-gradient(270deg,transparent,#cfe3e6)}

.loc-seg{--x:0px;--w:0px;position:relative;display:inline-flex;align-items:center;gap:2px;padding:4px;border:1px solid #dcebee;border-radius:40px;background:rgba(255,255,255,.85);box-shadow:0 8px 22px rgba(18,76,94,.07);backdrop-filter:blur(8px)}
.loc-thumb{position:absolute;z-index:0;top:4px;bottom:4px;left:0;width:var(--w);border-radius:34px;background:linear-gradient(135deg,#19bfb5,#0b8e9c);box-shadow:0 8px 16px rgba(11,142,156,.3),inset 0 1px 0 rgba(255,255,255,.28);transform:translateX(var(--x));opacity:0}
.loc-seg.is-ready .loc-thumb{opacity:1;transition:transform .5s cubic-bezier(.3,1.25,.4,1),width .5s cubic-bezier(.3,1.25,.4,1),opacity .2s ease}

.loc-opt{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;padding:6px 16px 6px 14px;border:0;border-radius:34px;background:none;cursor:pointer;font-family:inherit;white-space:nowrap;-webkit-tap-highlight-color:transparent;transition:filter .35s ease,opacity .35s ease}
.loc-flag{flex:0 0 auto;display:block;width:26px;height:26px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1.5px rgba(255,255,255,.95),0 2px 6px rgba(10,50,70,.22);transition:transform .35s cubic-bezier(.2,.9,.3,1.3)}
.loc-flag img,.loc-flag>svg{display:block;width:100%;height:100%;object-fit:cover}
.loc-name{color:#425b70;font-size:13px;font-weight:650;transition:color .3s ease}

/* انتخاب‌شده */
.loc-opt.is-active .loc-name{color:#fff;font-weight:800}
.loc-opt.is-active .loc-flag{transform:scale(1.08)}
/* بقیه: مات و کمی بلور، با هاور برمی‌گردند */
.loc-seg:has(.is-active) .loc-opt:not(.is-active){filter:blur(.5px);opacity:.75}
@media (hover:hover){
  .loc-seg:has(.is-active) .loc-opt:not(.is-active):hover{filter:none;opacity:1}
}
.loc-opt:not(.is-active):active{filter:none;opacity:1}
.loc-opt:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(11,170,163,.35)}

/* لوکیشن‌های غیرفعال: وضعیت سرویس بدون ایجاد انتظار کلیک */
.loc-status-row{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.loc-status-chip{display:inline-flex;align-items:center;gap:7px;padding:4px 10px 4px 5px;color:#718795;border:1px dashed #cbdce2;border-radius:22px;background:rgba(255,255,255,.72);font-size:11.5px;font-weight:650;cursor:default;user-select:none}
.loc-status-chip .loc-flag{width:19px;height:19px;opacity:.88;box-shadow:0 0 0 1px #c9d9e0}
.loc-status-chip em{padding:2px 8px 1px;font-style:normal;font-size:9.5px;font-weight:800;line-height:1.5;border-radius:10px}
.loc-status-chip.is-soon em{color:#a96218;background:rgba(255,182,72,.16)}
.loc-status-chip.is-full em{color:#a34a52;background:rgba(211,78,92,.11)}

@media (max-width:540px){
  .loc-picker{margin-bottom:24px;gap:11px}
  .loc-opt{padding:6px 12px 6px 10px;gap:6px}
  .loc-flag{width:22px;height:22px}
  .loc-name{font-size:12.5px}
  .loc-status-row{gap:6px}
  .loc-status-chip{gap:5px;padding-right:8px;font-size:10.5px}
  .loc-status-chip .loc-flag{width:17px;height:17px}
  .loc-status-chip em{padding-inline:6px;font-size:9px}
}

/* ============================================================
   لوگوی هدر: فایل لوکال + باکس لوگو کوتاه‌تر (فقط دسکتاپ/تبلت)
   ============================================================ */
.brand-logo{width:auto;height:39px;max-width:none}
@media (min-width:821px){
  .brand{margin-bottom:-14px;padding:0 18px 14px}
  .quick-links a{white-space:nowrap}
}

/* ===== بعد از حذف بج و متن میانی: تنظیم فاصله‌ها ===== */
.showcase-head h2{margin-top:0}
@media (min-width:821px){
  .showcase{margin-top:42px}
}


/* ============================================================
   ⚡ بهینه‌سازی عملکرد
   ------------------------------------------------------------
   فقط «هزینه‌ی رندر» کم می‌شود؛ طرح، رنگ و ساختار عوض نمی‌شود.
   هر زیربخش مستقل است: برای برگرداندن، همان زیربخش را پاک کنید.
   (هر مورد با اندازه‌گیری روی CPU کندشده تست شده؛ مواردی که سود
    نداشتند یا ظاهر را تغییر می‌دادند عمداً در این فایل نیستند.)
   ============================================================ */

/* [1] انیمیشن‌های بی‌پایانِ «در حال جست‌وجو» تا قبل از کلیک روی جستجو اجرا نشوند.
       قبلاً این ۹ انیمیشن از لحظه‌ی لود، حتی وقتی کاملاً پنهان بودند، دائم اجرا می‌شدند. */
.finder-card:not(.is-scanning) .scan-ring,
.finder-card:not(.is-scanning) .scan-core,
.finder-card:not(.is-scanning) .scan-core:before,
.finder-card:not(.is-scanning) .scan-core svg,
.finder-card:not(.is-scanning) .scan-dots i,
.finder-card:not(.is-scanning) .scan-bar i{animation:none}
.scan-stage{contain:layout paint}
.finder-card.is-scanning .scan-ring,
.finder-card.is-scanning .scan-core,
.finder-card.is-scanning .scan-core:before,
.finder-card.is-scanning .scan-bar i{will-change:transform,opacity}

/* [2] تاری ۰٫۵px روی گزینه‌های غیرفعال لوکیشن (با هر انتخاب دوباره رسم می‌شود).
       همان کم‌رنگی می‌ماند و فقط filter حذف می‌شود. */
.loc-seg:has(.is-active) .loc-opt:not(.is-active){filter:none;opacity:.72}

/* [3] موبایل: فیلتر blur() در انیمیشن «جمع شدن کارت‌ها» و تعویض متن گران است.
       همان حرکت و محو‌شدن می‌ماند، فقط بدون تاری. */
@media (max-width:820px){
  .res-card{transition:transform .65s cubic-bezier(.65,0,.25,1),opacity .45s ease .15s}
  .finder-card.is-collapsed .res-card{filter:none}
  @keyframes fs-suck{
    from{opacity:1;transform:none}
    to{opacity:0;transform:translate(var(--dx,0px),var(--dy,0px)) scale(.06)}
  }
  #eyebrowLabel.is-swapping{filter:none}
  .finder-card.is-collapsed .res-card,
  .finder-card.is-picked .region-btn,
  .finder-card.is-picked .sel-chip,
  .finder-card.is-picked .region-back{will-change:transform,opacity}
}

/* [4] اسلایدرها: کشیدن افقی انگشت اسکرول ناخواسته‌ی صفحه نسازد؛ ایزوله‌سازی هر کارت */
.res-range{touch-action:pan-y}
.res-card{contain:layout style}

/* [5] «کاهش حرکت» (اغلب گوشی‌های ضعیف با Battery Saver): انیمیشن‌های بی‌پایان خاموش */
@media (prefers-reduced-motion:reduce){
  .rack-unit span,.rack-unit i,.vps-badge-dot,
  .scan-ring,.scan-core,.scan-core:before,.scan-core svg,.scan-dots i,.scan-bar i{animation:none!important}
}

/* ============================================================
   حالت «در حال جست‌وجو»: کادر فشرده‌تر + آیکون کوچک‌تر
   (فقط وقتی is-scanning فعال است اعمال می‌شود؛ بقیه‌ی حالت‌ها دست‌نخورده)
   ============================================================ */
.finder-card.is-scanning{padding-top:20px;padding-bottom:6px}
.finder-card.is-scanning .finder-hint{display:none}
.finder-card.is-scanning .finder-stage{min-height:112px}
.finder-card.is-scanning .scan-stage{gap:4px}
.finder-card.is-scanning .scan-orb{width:46px;height:46px;margin-bottom:0}
.finder-card.is-scanning .scan-core{width:34px;height:34px}
.finder-card.is-scanning .scan-core:before{inset:-4px}
.finder-card.is-scanning .scan-core svg{width:17px;height:17px}
.finder-card.is-scanning .scan-title{font-size:13.5px}
.finder-card.is-scanning .scan-sub{font-size:11.5px}
.finder-card.is-scanning .scan-bar{margin-top:4px;width:130px}
@media (max-width:700px){
  .finder-card.is-scanning .finder-stage{min-height:112px}
  .finder-card.is-scanning .scan-title{font-size:13px}
}

/* ============================================================
   نوار «ویندوز و لینوکس» بین کادر جستجو و دسته‌بندی‌ها
   عکس سمت راست (کوچک، بیرون‌زده از یک پنل رنگی) — متن سمت چپ
   ============================================================ */
.os-band{position:relative;background:#fff;padding:36px 0 8px}
.os-band-inner{width:min(940px,calc(100% - 56px));margin-inline:auto;display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);justify-content:center;align-items:center;gap:52px}

/* عکس: پنل گرادیانی نرم + نقطه‌چین، و خود عکس کمی از بالای پنل بیرون می‌زند */
.os-art{position:relative;padding-top:38px}
.os-art:before{content:"";position:absolute;inset:66px 0 0;border-radius:30px;border:1px solid #d9eceb;
  background:radial-gradient(circle at 78% 18%,rgba(255,182,72,.22),transparent 46%),radial-gradient(circle at 18% 88%,rgba(34,198,185,.26),transparent 52%),linear-gradient(160deg,#eefafa,#fff 62%)}
.os-art:after{content:"";position:absolute;inset:66px 0 0;border-radius:30px;pointer-events:none;opacity:.55;
  background-image:radial-gradient(#b9e2e5 1.3px,transparent 1.3px);background-size:18px 18px;
  -webkit-mask-image:linear-gradient(200deg,#000,transparent 60%);mask-image:linear-gradient(200deg,#000,transparent 60%)}
.os-art img{position:relative;z-index:1;display:block;width:100%;height:auto;margin-bottom:14px;-webkit-user-drag:none;user-select:none;transition:transform .45s cubic-bezier(.2,.75,.25,1)}
@media (hover:hover){.os-art:hover img{transform:translateY(-5px) scale(1.03)}}

.os-copy{text-align:right}
.os-kicker{display:inline-flex;align-items:center;gap:7px;padding:4px 13px;color:var(--teal-dark);border:1px solid rgba(11,170,163,.18);border-radius:24px;background:rgba(11,170,163,.08);font-size:11.5px;font-weight:700}
.os-kicker i{width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px rgba(11,170,163,.16)}
.os-copy h2{margin:12px 0 10px;color:var(--navy);font-size:clamp(21px,2.1vw,27px);font-weight:850;line-height:1.5;letter-spacing:-.02em}
.os-copy p{margin:0;color:#64798b;font-size:13.5px;line-height:2;text-align:justify}
.os-points{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.os-points li{display:flex;align-items:center;gap:10px;color:#0f3a57;font-size:13px;font-weight:600}
.os-points li svg{flex:0 0 auto;width:21px;height:21px;padding:4px;color:#fff;border-radius:50%;background:linear-gradient(135deg,#19bfb5,#0b8e9c)}

/* دسکتاپ/تبلت: کادر جستجو absolute است؛ فاصله‌ی زیرش را همین نوار نگه می‌دارد */
@media (min-width:821px){
  .os-band{padding-top:196px;padding-bottom:0}
  .intro{padding-top:20px}
}
@media (max-width:820px){
  .os-band{padding:30px 0 0}
  .os-band-inner{grid-template-columns:1fr;gap:6px;width:calc(100% - 28px)}
  .os-art{width:min(270px,80%);margin-inline:auto}
  .os-art:before,.os-art:after{inset:56px 0 0}
  .os-art{padding-top:28px}
  .os-copy p{text-align:right}
  .os-copy h2{font-size:20px}
}

/* ---------- کارت «پیشنهاد ما» در دسته‌بندی‌ها ---------- */
.cat-card.is-featured{border-color:color-mix(in srgb,var(--tone) 38%,#fff);box-shadow:0 14px 32px rgba(18,80,122,.13)}
.cat-badge{position:absolute;z-index:2;top:12px;left:12px;padding:3px 11px 2px;color:#fff;font-size:11px;font-weight:800;line-height:1.9;border-radius:14px;background:linear-gradient(135deg,#ffb648,#ef7d1f);box-shadow:0 4px 10px rgba(239,125,31,.32)}

/* ============================================================
   زیرمنوی هدر — پنل روشن روی نوار تیره با نشان CSS فراسو
   ============================================================ */
.nav-item{position:relative;display:flex;align-items:stretch;min-width:0}
.nav-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:5px;height:100%;padding:0 10px;color:#d7e8ec;background:transparent;white-space:nowrap;font-family:inherit;font-size:13px;font-weight:550;cursor:pointer;transition:color .2s ease}
.nav-trigger:after{content:"";position:absolute;right:9px;bottom:10px;left:9px;height:2.5px;border-radius:2px;background:linear-gradient(90deg,#3fd8cd,#0ab3aa);transform:scaleX(0);transition:transform .2s ease}
.nav-trigger>svg{flex:0 0 auto;transition:transform .24s ease}
.nav-item:hover>.nav-trigger,.nav-item:focus-within>.nav-trigger,.nav-item.is-open>.nav-trigger{color:#63e6da}
.nav-item:hover>.nav-trigger:after,.nav-item:focus-within>.nav-trigger:after,.nav-item.is-open>.nav-trigger:after{transform:scaleX(1)}
.nav-item:hover>.nav-trigger>svg,.nav-item:focus-within>.nav-trigger>svg,.nav-item.is-open>.nav-trigger>svg{transform:rotate(180deg)}

.submenu{position:absolute;z-index:30;top:calc(100% - 2px);right:50%;width:218px;padding:8px;display:grid;gap:2px;border:1px solid rgba(207,226,229,.95);border-radius:15px;background:rgba(255,255,255,.98);box-shadow:0 18px 38px rgba(8,42,56,.18),0 3px 9px rgba(8,42,56,.07);opacity:0;visibility:hidden;pointer-events:none;transform:translate(50%,9px);transition:opacity .18s ease,transform .22s cubic-bezier(.2,.8,.3,1),visibility 0s linear .22s}
.submenu:before{content:"";position:absolute;right:50%;top:-6px;width:11px;height:11px;border-top:1px solid #cfe2e5;border-right:1px solid #cfe2e5;background:#fff;transform:translateX(50%) rotate(-45deg)}
.nav-item:hover>.submenu,.nav-item:focus-within>.submenu,.nav-item.is-open>.submenu{opacity:1;visibility:visible;pointer-events:auto;transform:translate(50%,0);transition-delay:0s}
.nav-row .submenu a{height:40px;padding:0 11px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-radius:10px;color:#29485a;font-size:12px;font-weight:650;text-align:right;transition:color .18s ease,background .18s ease,padding .18s ease}
.nav-row .submenu a:after{display:none}
.nav-row .submenu a:hover,.nav-row .submenu a:focus-visible{padding-right:14px;color:#087f83;background:linear-gradient(90deg,#f7fbfc,#ebf8f7)}
.submenu-logo.eyebrow-logo{--teal:#0f9ea1;--orange:#ff9d00;--paper:#fff;position:relative;display:inline-flex;width:18px;height:18px;flex:0 0 18px;overflow:hidden;border-radius:50%;background:var(--teal);isolation:isolate;opacity:0;transform:scale(.45) rotate(-10deg);transition:opacity .16s ease,transform .22s cubic-bezier(.2,.9,.3,1.3)}
.submenu-logo:before,.submenu-logo:after{content:"";position:absolute;inset:0;z-index:1;background:var(--paper)}
.submenu-logo:before{clip-path:polygon(37.5% 1.6%,68.3% 28%,72.5% 32.5%,75.5% 38%,77% 44%,77.5% 50%,76% 57.5%,72% 64%,61.8% 75.8%,59.4% 72.8%,58.3% 69.5%,58% 67%,58.6% 64%,60% 61.5%,63.5% 57.2%,66% 53.5%,67% 49.5%,67% 46%,66% 42%,64% 38.5%,61% 35.5%,25.8% 6.2%)}
.submenu-logo:after{clip-path:polygon(38.2% 24.3%,40.3% 26.8%,41.5% 29.4%,42% 32.2%,41.4% 35.2%,40% 37.5%,36.8% 41.6%,34.7% 44.4%,33.4% 47.4%,32.8% 50.5%,32.9% 54%,34% 57.6%,36% 61%,39% 64%,74.2% 93.8%,62.8% 98.5%,30.5% 70.8%,27.7% 68%,25.5% 64.8%,23.8% 60.8%,22.8% 56.5%,22.5% 52.2%,22.7% 48.2%,23.8% 44.2%,25.5% 40%,27.5% 36.8%)}
.submenu-logo .fs-flame{position:absolute;z-index:2;inset:0;background:var(--orange);opacity:1;clip-path:polygon(54.2% 37.8%,55.2% 38.6%,56.3% 40.2%,57.1% 42.6%,57.8% 45%,57.9% 47%,57.4% 49.2%,56.4% 51.4%,54% 54.2%,51.8% 56.8%,49.8% 59%,48% 60.1%,46% 60.5%,44.1% 60.1%,42.7% 59%,41.7% 57.5%,41% 55.7%,41.1% 54.1%,41.8% 52.4%)}
.submenu a:hover .submenu-logo,.submenu a:focus-visible .submenu-logo{opacity:1;transform:scale(1) rotate(0)}

@media (min-width:821px) and (max-width:1100px){
  .nav-row{overflow:visible}
  .nav-trigger{padding-inline:5px;font-size:11.5px;gap:3px}
  .submenu{width:202px}
}

@media (max-width:820px){
  .main-nav.open{max-height:calc(100vh - 108px);overflow-y:auto}
  .nav-row{display:block;padding:12px 14px 16px}
  .nav-side{display:block;width:100%}
  .nav-item{display:block;width:100%}
  .nav-trigger{width:100%;height:44px;justify-content:flex-start;padding:0 12px;border-radius:12px;color:#dceaee;font-size:13px}
  .nav-trigger:hover,.nav-item.is-open>.nav-trigger{background:rgba(255,255,255,.06)}
  .nav-trigger:after{right:12px;left:auto;width:22px;bottom:7px}
  .submenu{position:static;width:auto;max-height:0;margin:0 8px;padding:0 7px;gap:1px;overflow:hidden;border:0;border-radius:12px;background:rgba(255,255,255,.055);box-shadow:none;opacity:1;visibility:visible;pointer-events:none;transform:none;transition:max-height .28s ease,padding .28s ease,margin .28s ease}
  .submenu:before{display:none}
  .nav-item:hover>.submenu,.nav-item:focus-within>.submenu{max-height:0;padding-block:0;pointer-events:none;transform:none}
  .nav-item.is-open>.submenu{max-height:240px;margin-block:2px 8px;padding-block:6px;pointer-events:auto}
  .nav-row .submenu a{height:37px;color:#d7e8ec;font-size:11.5px}
  .nav-row .submenu a:hover,.nav-row .submenu a:focus-visible{padding-right:14px;color:#fff;background:rgba(255,255,255,.08)}
  .submenu-logo.eyebrow-logo{width:17px;height:17px;flex-basis:17px}
}