/* ==========================================================================
   ابریــ شم کلود — قالب نسخه‌ی دوم برای صفحات داخلی.
   بعد از site.css و theme.css لود می‌شود. سه کار می‌کند:
     ۱) پالت کرم قدیمی را در همه‌ی صفحات با پالت خنک صفحه‌ی نخست عوض می‌کند،
     ۲) سربرگ تازه‌ی صفحات (.ph) و گرافیک‌های متحرکش (.art-*) را تعریف می‌کند،
     ۳) اجزای مشترک قدیمی (کارت، جدول، FAQ، فرم، وبلاگ، فوتر) را هم‌شکل می‌کند.
   هیچ letter-spacing روی متن فارسی نیست؛ اتصال حروف را می‌شکند.
   ========================================================================== */
:root{
  --bg-2:#f5f6fb; --surface-2:#f5f6fb;
  --ink:#111730; --muted:#565d78; --faint:#8a90a8;
  --line:#e7e9f2; --line-2:#d6daea;
  --gold:#e0a416; --gold-2:#f2b632; --gold-deep:#8f6705;
  --navy:#111730; --navy-2:#27336b;
  --blue:#3657f5; --violet:#7a4cf0; --green:#1fae6b;
  --grad:linear-gradient(115deg,#e9a60f,#f2b632);
  --grad-navy:linear-gradient(120deg,#0d1228,#1b2550);
  --radius:24px;
  --shadow:0 30px 60px -32px rgba(17,23,48,.38);
  --shadow-sm:0 14px 30px -20px rgba(17,23,48,.32);
  --shadow-card:none;
}
.grad{background:linear-gradient(100deg,#c98a06,#f2b632 55%,#e0891b);-webkit-background-clip:text;background-clip:text;color:transparent}
.btn--gold{background:#f2b632;color:#1a1503;box-shadow:0 10px 24px -10px rgba(190,135,10,.75)}
.btn--gold:hover{background:#f6c24a;color:#1a1503}
.btn--preorder:hover{background:var(--ink);border-color:var(--ink);color:var(--gold-2)}

/* ===== Page hero (.ph) ================================================== */
.ph{position:relative;overflow:hidden;margin-top:-76px;padding:clamp(124px,13vw,160px) 0 clamp(36px,5vw,64px);border-bottom:1px solid var(--line);
  background:radial-gradient(60% 70% at 88% 0%,rgba(242,182,50,.17),transparent 70%),radial-gradient(55% 60% at 4% 30%,rgba(54,87,245,.10),transparent 70%),#fff}
.ph__silk{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;-webkit-mask-image:linear-gradient(#000 45%,transparent);mask-image:linear-gradient(#000 45%,transparent)}
.ph__grid{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,5vw,64px);align-items:center}
.ph--plain .ph__grid{grid-template-columns:1fr}
.ph__kicker{display:inline-flex;align-items:center;gap:9px;padding:7px 14px;border-radius:999px;font-size:.82rem;font-weight:500;color:#3d4460;
  background:rgba(255,255,255,.78);border:1px solid var(--line-2);animation:phUp .8s var(--ease) both}
.ph__kicker img{border-radius:3px;box-shadow:0 0 0 1px var(--line)}
.ph__title{font-size:clamp(1.85rem,4vw,3.15rem);line-height:1.42;margin:20px 0 14px;animation:phUp .9s var(--ease) .1s both}
.ph__lead{font-size:clamp(1rem,1.2vw,1.1rem);line-height:2.05;color:var(--muted);max-width:38rem;margin:0;animation:phUp .9s var(--ease) .22s both}
.ph__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;animation:phUp .9s var(--ease) .34s both}
.ph__note{display:inline-flex;align-items:center;gap:8px;margin:16px 0 0;font-size:.84rem;color:var(--muted);animation:phUp .9s var(--ease) .44s both}
.ph__note i{color:var(--gold-deep)}
.ph__art{position:relative;display:grid;place-items:center;min-height:260px;animation:phUp 1.1s var(--ease) .25s both;
  transform:perspective(1100px) rotateX(calc(var(--ry,0)*1deg)) rotateY(calc(var(--rx,0)*1deg));transition:transform .5s var(--ease)}
.ph__art svg{display:block;width:100%;max-width:400px;height:auto;overflow:visible;font-family:inherit}
@keyframes phUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* --- shared chips ------------------------------------------------------- */
.art-chip{position:absolute;display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:999px;font-size:.8rem;font-weight:600;white-space:nowrap;
  background:#fff;border:1px solid rgba(17,23,48,.08);box-shadow:var(--shadow-sm);z-index:2;animation:artFloat 6s ease-in-out -2s infinite}
.art-chip i{color:var(--blue)}
.art-chip--a{top:-6px;inset-inline-start:0}
.art-chip--b{bottom:-4px;inset-inline-end:2%;animation-duration:8s;animation-delay:-4s}
.art-chip--b i{color:var(--gold-deep)}

/* --- vps: server rack --------------------------------------------------- */
.art-rack{position:relative;width:min(100%,360px);display:grid;gap:14px;padding:26px 0}
.art-unit{display:grid;grid-template-columns:auto 1fr;gap:12px 16px;align-items:center;padding:16px 18px;border-radius:20px;background:rgba(255,255,255,.9);
  border:1px solid rgba(17,23,48,.08);box-shadow:0 26px 44px -30px rgba(17,23,48,.5);
  animation:artDrop .8s var(--ease) calc(var(--i)*.12s + .3s) both,artFloat 7s ease-in-out calc(var(--i)*-1.6s) infinite}
.art-unit__leds{display:flex;gap:6px}
.art-unit__leds i{width:8px;height:8px;border-radius:50%;background:#dfe3ef}
.art-unit__leds i.is-green{background:var(--green);animation:artBlink 1.1s ease-in-out infinite alternate}
.art-unit__leds i.is-gold{background:var(--gold-2);animation:artBlink .8s ease-in-out infinite alternate}
.art-unit__leds i.is-blue{background:var(--blue);animation:artBlink 1.5s ease-in-out infinite alternate}
.art-unit__slots{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}
.art-unit__slots i{height:16px;border-radius:5px;background:#eceef6;animation:artSlot 2.8s ease-in-out infinite}
.art-unit__slots i:nth-child(2){animation-delay:.25s}.art-unit__slots i:nth-child(3){animation-delay:.5s}
.art-unit__slots i:nth-child(4){animation-delay:.75s}.art-unit__slots i:nth-child(5){animation-delay:1s}.art-unit__slots i:nth-child(6){animation-delay:1.25s}
.art-unit__load{grid-column:1/-1;height:6px;border-radius:6px;background:#eceef6;overflow:hidden;direction:ltr}
.art-unit__load i{display:block;height:100%;width:var(--w);border-radius:6px;background:linear-gradient(90deg,var(--blue),var(--gold-2));transform-origin:left;animation:artLoad 3.4s ease-in-out infinite alternate}

/* --- dedicated: cpu ----------------------------------------------------- */
.art-cpu__traces path{fill:none;stroke:var(--blue);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:6 9;animation:artDash 2.4s linear infinite}
.art-cpu__pins rect{fill:#c9cee2}
.art-cpu__body{fill:var(--ink)}
.art-cpu__core{fill:var(--gold-2);transform-box:fill-box;transform-origin:center;animation:artPulse 2.2s ease-in-out infinite}
.art-cpu__nodes circle{fill:#fff;stroke:var(--blue);stroke-width:2.5;transform-box:fill-box;transform-origin:center;animation:artPulse 2.4s ease-in-out infinite}
.art-cpu__nodes circle:nth-child(2){animation-delay:.5s}.art-cpu__nodes circle:nth-child(3){animation-delay:1s}.art-cpu__nodes circle:nth-child(4){animation-delay:1.5s}
.art-cpu__labels text{font-size:14px;font-weight:600;fill:var(--ink)}

/* --- cdn graph (also used on the home page) ------------------------------ */
.hp-cdn__links path{fill:none;stroke:var(--blue);stroke-width:1.6;stroke-dasharray:4 8;stroke-linecap:round;animation:artDash 2.2s linear infinite}
.hp-cdn__edges circle{fill:#fff;stroke:var(--blue);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:artPulse 2.4s ease-in-out infinite}
.hp-cdn__edges circle:nth-child(2){animation-delay:.4s}.hp-cdn__edges circle:nth-child(3){animation-delay:.8s}
.hp-cdn__edges circle:nth-child(4){animation-delay:1.2s}.hp-cdn__edges circle:nth-child(5){animation-delay:1.6s}
.hp-cdn__core{fill:var(--gold-2)}
.hp-cdn__halo{fill:none;stroke:var(--gold-2);stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:artRing 2.6s ease-out infinite}

/* --- network map (shared with the home page) ----------------------------- */
.hp-map{border-radius:32px;border:1px solid var(--line);
  background:radial-gradient(70% 70% at 80% 75%,rgba(242,182,50,.14),transparent 70%),radial-gradient(60% 60% at 15% 20%,rgba(54,87,245,.10),transparent 70%),#fff}
.hp-map--hero{width:100%;box-shadow:var(--shadow)}
.hp-map svg{display:block;width:100%;max-width:none;height:auto;font-family:inherit}
.hp-map pattern circle{fill:#c5cbe0}
.hp-arc path{fill:none;stroke-linecap:round}
.hp-arc__base{stroke:#d8dcec;stroke-width:1.5}
.hp-arc__flow{stroke-width:2;stroke-dasharray:5 11;opacity:.55;animation:artDash 2.6s linear infinite;transition:opacity .3s,stroke-width .3s}
.hp-arc__dot{fill:var(--gold-2);stroke:#fff;stroke-width:1.5}
.hp-arc.is-on .hp-arc__flow{opacity:1;stroke-width:3.2}
.hp-node__core{fill:var(--ink);stroke:#fff;stroke-width:3;transform-box:fill-box;transform-origin:center;transition:fill .3s,transform .45s var(--ease-spring)}
.hp-node__ring{fill:none;stroke:var(--blue);stroke-width:1.5;transform-box:fill-box;transform-origin:center;opacity:0;animation:artRing 2.8s ease-out infinite}
.hp-node__ring--2{animation-delay:1.4s}
.hp-node text{font-size:15px;font-weight:600;fill:var(--ink);paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}
.hp-node.is-on .hp-node__core{fill:var(--gold-2);transform:scale(1.45)}
.hp-node.is-on .hp-node__ring{stroke:var(--gold-2)}

/* --- about: growth line -------------------------------------------------- */
.art-time__grid{fill:none;stroke:#e1e5f2;stroke-width:1;stroke-dasharray:3 7}
.art-time__area{fill:rgba(54,87,245,.08);opacity:0;animation:artFadeIn 1.2s ease 1.4s forwards}
.art-time__line{fill:none;stroke:var(--blue);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:420;stroke-dashoffset:420;animation:artDraw 2s var(--ease) .4s forwards}
.art-time__dots circle{fill:#fff;stroke:var(--ink);stroke-width:3;transform-box:fill-box;transform-origin:center;transform:scale(0);animation:artPop .5s var(--ease-spring) forwards}
.art-time__dots circle:nth-child(1){animation-delay:.5s}.art-time__dots circle:nth-child(2){animation-delay:1.1s}
.art-time__dots circle:nth-child(3){animation-delay:1.6s}
.art-time__dots circle:nth-child(4){animation-delay:2.1s;fill:var(--gold-2)}
.art-time__label{font-size:15px;font-weight:600;fill:var(--muted)}

/* --- contact: conversation ----------------------------------------------- */
.art-talk{position:relative;width:min(100%,340px);display:grid;gap:12px;padding:34px 0 10px}
.art-talk__b{padding:13px 18px;border-radius:20px;font-size:.92rem;font-weight:500;width:fit-content;box-shadow:var(--shadow-sm)}
.art-talk__b--q{background:#fff;border:1px solid var(--line);border-end-start-radius:6px;animation:phUp .7s var(--ease) .5s both}
.art-talk__b--typing{justify-self:end;display:inline-flex;gap:5px;align-items:center;min-height:46px;background:var(--ink);border-end-end-radius:6px;animation:artTyping 6s ease infinite}
.art-talk__b--typing i{width:7px;height:7px;border-radius:50%;background:var(--gold-2);animation:artDots 1.2s ease-in-out infinite}
.art-talk__b--typing i:nth-child(2){animation-delay:.15s}.art-talk__b--typing i:nth-child(3){animation-delay:.3s}
.art-talk__b--a{justify-self:end;background:var(--ink);color:#fff;border-end-end-radius:6px;animation:artAnswer 6s ease infinite}

/* --- blog: stacked articles ---------------------------------------------- */
.art-docs{position:relative;width:min(100%,300px);aspect-ratio:1/1.02}
.art-doc{position:absolute;inset:8% 6% 6%;border-radius:24px;background:#fff;border:1px solid rgba(17,23,48,.08);box-shadow:0 30px 50px -34px rgba(17,23,48,.55)}
.art-doc--3{transform:rotate(9deg) translate(-8%,2%);background:#eef1ff;animation:artSway3 7s ease-in-out infinite}
.art-doc--2{transform:rotate(-6deg) translate(6%,1%);background:#fff7e2;animation:artSway2 7s ease-in-out infinite}
.art-doc--1{display:grid;align-content:start;gap:12px;padding:18px;animation:artFloat 7s ease-in-out infinite}
.art-doc__img{height:92px;border-radius:14px;background:linear-gradient(120deg,#111730,#27336b 60%,#3657f5)}
.art-doc__ln{height:10px;width:var(--w);border-radius:10px;background:#e4e7f2}
.art-doc__ln--type{background:var(--gold-2);transform-origin:right;animation:artType 3.2s var(--ease) infinite}

/* --- legal page: sealed document ------------------------------------------ */
.art-seal{max-width:260px!important}
.art-seal__sheet{fill:#fff;stroke:var(--line-2);stroke-width:1.5}
.art-seal__lines path{fill:none;stroke:#dfe3ef;stroke-width:8;stroke-linecap:round;stroke-dasharray:110;stroke-dashoffset:110;animation:artDraw 1s var(--ease) forwards}
.art-seal__lines path:nth-child(1){animation-delay:.3s}.art-seal__lines path:nth-child(2){animation-delay:.5s}
.art-seal__lines path:nth-child(3){animation-delay:.7s}.art-seal__lines path:nth-child(4){animation-delay:.9s}
.art-seal__ring{fill:var(--ink);transform-box:fill-box;transform-origin:center;transform:scale(0);animation:artPop .6s var(--ease-spring) 1.3s forwards}
.art-seal__tick{fill:none;stroke:var(--gold-2);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:44;stroke-dashoffset:44;animation:artDraw .5s ease 1.8s forwards}

@keyframes artFloat{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes artDrop{from{opacity:0;transform:translateY(-26px) scale(.96)}to{opacity:1;transform:none}}
@keyframes artBlink{from{opacity:.3}to{opacity:1}}
@keyframes artSlot{0%,100%{background:#eceef6}12%{background:var(--blue)}24%{background:#eceef6}}
@keyframes artLoad{from{transform:scaleX(.45)}to{transform:scaleX(1)}}
@keyframes artDash{to{stroke-dashoffset:-60}}
@keyframes artPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@keyframes artRing{0%{transform:scale(.45);opacity:.75}100%{transform:scale(1.75);opacity:0}}
@keyframes artDraw{to{stroke-dashoffset:0}}
@keyframes artPop{to{transform:scale(1)}}
@keyframes artFadeIn{to{opacity:1}}
@keyframes artDots{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}
@keyframes artTyping{0%,12%{opacity:0;transform:translateY(8px);max-height:0;padding-block:0;margin-top:-12px}18%,48%{opacity:1;transform:none;max-height:60px;padding-block:13px;margin-top:0}54%,100%{opacity:0;max-height:0;padding-block:0;margin-top:-12px;min-height:0}}
@keyframes artAnswer{0%,52%{opacity:0;transform:translateY(10px)}60%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes artSway3{0%,100%{transform:rotate(9deg) translate(-8%,2%)}50%{transform:rotate(12deg) translate(-11%,0)}}
@keyframes artSway2{0%,100%{transform:rotate(-6deg) translate(6%,1%)}50%{transform:rotate(-9deg) translate(9%,-1%)}}
@keyframes artType{0%{transform:scaleX(0)}55%,85%{transform:scaleX(1)}100%{transform:scaleX(1);opacity:0}}

/* ===== MetaTrader page: same hero, palette and components as the rest ===== */
.ph--mt{isolation:isolate;border-bottom:0;padding-bottom:clamp(40px,6vw,76px)}
.ph__facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;padding:0;margin:22px 0 0;font-size:.86rem;color:var(--muted);animation:phUp .9s var(--ease) .44s both}
.ph__facts li{display:inline-flex;align-items:center;gap:7px}
.ph__facts i{color:var(--gold-deep);font-size:.75em}
.art-candles__grid{fill:none;stroke:#e1e5f2;stroke-width:1;stroke-dasharray:3 7}
.art-candles__line{fill:none;stroke:var(--ink);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;opacity:.5;stroke-dasharray:520;stroke-dashoffset:520;animation:artDraw 2.2s var(--ease) 1.1s forwards}
.amt-stage{margin-top:clamp(30px,5vw,60px)}
.amt-frame{border-radius:22px;border-color:rgba(17,23,48,.1)}
.amt-frame__bar{background:#0d1228}
.amt-chip{border-radius:999px;font-weight:600;box-shadow:var(--shadow-sm)}
.amt-vs{border-radius:24px}
.amt-vs__head{background:#0d1228;font-weight:600}
.amt-vs__row p:last-child{background:rgba(54,87,245,.045)}
.amt-vs__arrow{color:var(--gold-deep)}
.amt-ring__core{background:#0d1228;box-shadow:0 30px 60px -30px rgba(17,23,48,.6)}
.amt-ring__core b{font-weight:700}
.amt-ring__node b{font-weight:600}
.amt-ring__node.is-on span{border-color:var(--ink);background:var(--ink);color:var(--gold-2);box-shadow:0 0 0 7px rgba(17,23,48,.08)}
.amt-ring__node--4.is-on span{border-color:var(--green);background:var(--green);color:#fff;box-shadow:0 0 0 7px rgba(31,174,107,.16)}
.amt-feats{gap:18px}
.amt-feat{padding:26px;border:1px solid var(--line);border-radius:24px;background:var(--bg-2);transition:transform .45s var(--ease),box-shadow .45s var(--ease),background .3s}
.amt-feat:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);background:#fff}
.amt-feat::before{font-size:2rem;font-weight:700;background:none;color:#c5cbe0;-webkit-text-fill-color:#c5cbe0}
.amt-feat h3{font-weight:600}
.amt-feat h3 i{color:var(--gold-deep)}
.amt-tour__tabs{border-radius:999px}
.amt-tour__tab{border-radius:999px;font-weight:600}
.amt-tour__tab[aria-selected="true"]{background:var(--ink);color:var(--gold-2)}
.amt-promo{margin:0 0 28px;border-radius:20px;border-color:var(--gold-2);background:rgba(242,182,50,.09)}
.amt-promo p{font-weight:600}
.amt-promo p i{color:var(--gold-deep)}
.amt-code code{border-radius:12px;font-weight:700}
.amt-copy{border-radius:999px;background:var(--ink);font-weight:600}
.amt-plan{border-radius:24px}
.amt-plan--hot{border-color:var(--ink);box-shadow:0 30px 60px -40px rgba(17,23,48,.6)}
.amt-plan:hover{border-color:var(--ink)}
.amt-plan__badge{background:var(--ink);color:var(--gold-2);box-shadow:none;font-weight:600}
.amt-plan__terms{font-weight:700}
.amt-plan__name{letter-spacing:0;font-weight:600}
.amt-plan__price{font-weight:700;font-variant-numeric:normal}
.amt-plan__specs li{background:var(--bg-2)}
.amt-steps::before{inset-inline:0;height:2px;background:linear-gradient(270deg,var(--gold-2),var(--blue))}
.amt-steps li{text-align:start;padding:0}
.amt-steps__n{position:relative;margin:0 0 20px;border-radius:50%;background:var(--ink);color:var(--gold-2);box-shadow:none;transform:none;font-size:1.2rem;font-weight:700;transition:transform .5s var(--ease-spring)}
.amt-steps__n em{transform:none}
.amt-steps li:hover .amt-steps__n{transform:scale(1.1)}
.amt-steps h3{font-weight:600}
.amt-risk{border-radius:20px;border-inline-start-color:var(--gold-2);background:var(--bg-2)}
.amt-risk h3 i{color:var(--gold-deep)}
@media(max-width:900px){
  .amt-steps__n{margin:4px 0 0}
  .ph--mt .ph__art{display:none}
}

/* ===== Reveal (motion.js) + cursor spotlight ============================ */
.rv{opacity:0;transform:translateY(26px);transition:opacity .75s var(--ease) calc(var(--rv-i,0)*70ms),transform .75s var(--ease) calc(var(--rv-i,0)*70ms)!important}
.rv.rv-in{opacity:1;transform:none}
.spot{position:relative;overflow:hidden}
.spot>*{position:relative}
.spot::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(242,182,50,.17),transparent 65%)}
.spot:hover::after{opacity:1}

/* ===== Sections & headings ============================================== */
.section{padding:clamp(54px,7.5vw,100px) 0}
.sec-head:not(.sec-head--stack){text-align:start;max-width:680px;margin:0 0 clamp(26px,4vw,44px)}
.sec-head:not(.sec-head--stack) h2{display:block;padding-bottom:0;font-size:clamp(1.55rem,3vw,2.3rem);line-height:1.5}
.sec-head h2::after{display:none}
.sec-head .pill,.amt-loop__text .pill{background:none;border:0;border-radius:0;padding:0;margin-bottom:12px;font-size:.84rem;font-weight:600;color:var(--gold-deep);gap:10px}
.sec-head .pill::before,.amt-loop__text .pill::before{content:"";width:28px;height:2px;border-radius:2px;background:var(--gold-2)}
.sec-head--stack .pill{justify-content:center}
.pill{font-weight:600}
.pill--soft{background:rgba(54,87,245,.07);border-color:rgba(54,87,245,.2);color:var(--navy-2)}

/* ===== Cards ============================================================ */
.dc-card,.feature,.step,.contact-card,.card,.loc-card,.locinfra__intro,.legal-prose{border-radius:24px;border-color:var(--line);box-shadow:none;background:var(--bg-2);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),background .3s,border-color .3s}
.section--alt .dc-card,.section--alt .feature,.section--alt .step,.section--alt .contact-card,.section--alt .card,.card,.legal-prose{background:#fff}
.feature,.step,.dc-card{text-align:start}
.grid--4>.dc-card,.dc-card--loc{text-align:center}
.feature:hover,.dc-card:hover,a.dc-card:hover,.contact-card:hover,.step:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);background:#fff;border-color:var(--line-2)}
.feature h3,.dc-card h3,.step h3{font-weight:600}
.feature__icon,.contact-card__icon{width:48px;height:48px;border-radius:16px;background:var(--ink)!important;color:var(--gold-2)!important;font-size:1.05rem}
.feature__icon img{border-radius:3px}
.dc-card__flag{border-radius:8px;box-shadow:0 0 0 1px var(--line)}
.dc-card__code{font-weight:700}
.contact-card__link,.loc-card__more{color:var(--ink);font-weight:600}
.loc-card::before{display:none}
.step__num{background:var(--ink);color:var(--gold-2);box-shadow:none;font-weight:700}
.locinfra__facts .dc-card{border-radius:20px}

/* ===== VPS configurator & tables ======================================== */
.config__legend{font-weight:600}
.config__num{background:var(--ink);color:var(--gold-2);font-weight:700}
.type-card{border-width:1.5px;border-radius:24px;background:#fff;transition:border-color .25s,box-shadow .35s var(--ease),transform .35s var(--ease)}
.type-card:hover{border-color:var(--line-2);transform:translateY(-3px)}
.type-card.is-active{border-color:var(--ink);box-shadow:0 26px 50px -34px rgba(17,23,48,.6)}
.type-card h3{font-weight:600}
.type-card__flag{background:var(--ink);color:var(--gold-2);font-weight:600}
.type-card__tags span{background:var(--bg-2)}
.type-card__arch{letter-spacing:0}
.ptable{border-radius:24px}
.ptable__head{font-weight:600}
.ptable__row{transition:background .2s,box-shadow .2s}
.ptable__row.is-active{background:rgba(54,87,245,.05);box-shadow:inset -3px 0 0 var(--gold-2)}
.ptable__name{font-weight:700}
.ptable__mo{color:var(--ink);font-weight:700}
.ptable__h{color:var(--muted);font-weight:600}
.ptable__note--free{border-radius:14px}
.dtable__title{font-weight:700}
.dtable__row{border-radius:22px;transition:border-color .25s,box-shadow .4s var(--ease),transform .4s var(--ease)}
.dtable__row:hover{border-color:var(--ink);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.dtable__row.is-hot{border-color:var(--gold-2)}
.dtag{border-radius:999px;font-weight:600}
.dtag--promo{background:var(--ink);color:var(--gold-2)}
.dprice b{font-weight:700}
.dtable__switch button.is-active{background:var(--ink);color:var(--gold-2);box-shadow:none}

/* ===== FAQ: heading on one side, rows on the other ======================= */
.container--narrow:has(>.faq){max-width:var(--maxw);display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,5vw,72px);align-items:start}
.container--narrow:has(>.faq)>.sec-head{position:sticky;top:120px;margin:0;text-align:start}
.container--narrow:has(>.faq)>.sec-head h2{display:block;margin-inline:0}
.container--narrow:has(>.faq)>.sec-head .pill{justify-content:flex-start}
.faq,.contact-faq{gap:0;interpolate-size:allow-keywords}
.faq__item,.contact-faq details{background:none;border:0;border-bottom:1px solid var(--line-2);border-radius:0;box-shadow:none;padding:0}
.faq__item:first-child,.contact-faq details:first-child{border-top:1px solid var(--line-2)}
.faq__item summary,.contact-faq summary{padding:21px 0;font-weight:600;font-size:1.02rem;gap:18px}
.faq__item summary i{flex:none;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line-2);background:#fff;color:var(--ink);font-size:.7rem;
  transition:transform .45s var(--ease),background .3s,border-color .3s}
.faq__item[open] summary i{background:var(--gold-2);border-color:var(--gold-2);transform:rotate(180deg)}
.faq__item p,.contact-faq p{padding:0 0 22px;max-width:60ch}
.faq__item::details-content,.contact-faq details::details-content{block-size:0;overflow:clip;transition:block-size .45s var(--ease),content-visibility .45s allow-discrete}
.faq__item[open]::details-content,.contact-faq details[open]::details-content{block-size:auto}
.contact-faq{max-width:820px}

/* ===== CTA band → rounded dark panel ==================================== */
.cta{width:calc(100% - 44px);max-width:var(--maxw);margin:clamp(20px,4vw,44px) auto clamp(28px,5vw,60px);padding:clamp(52px,8vw,96px) 0;border-radius:36px;
  background:radial-gradient(70% 90% at 80% 0%,#27336b,transparent 70%),#0d1228}
.cta::before{display:none}
.cta>canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cta h2{font-size:clamp(1.6rem,3.4vw,2.6rem)}
.cta p{color:rgba(255,255,255,.72)}
.cta p a{color:var(--gold-2);text-decoration:underline;text-underline-offset:4px}

/* ===== Forms ============================================================ */
.form label{font-weight:600}
.form input,.form textarea,.form select{border-radius:14px;padding:12px 16px;background:var(--bg-2);border-color:transparent;transition:background .2s,border-color .2s,box-shadow .2s}
.form input:hover,.form textarea:hover,.form select:hover{border-color:var(--line-2)}
.form input:focus,.form textarea:focus,.form select:focus{background:#fff;border-color:var(--blue);box-shadow:0 0 0 4px rgba(54,87,245,.14)}
.contact-points i{color:var(--gold-deep)}
.alert{border-radius:16px}

/* ===== Blog ============================================================= */
.cat-pills{justify-content:flex-start}
.cat-pill{font-weight:500;transition:background .2s,color .2s,border-color .2s,transform .3s var(--ease)}
.cat-pill:hover{border-color:var(--ink);color:var(--ink);transform:translateY(-2px)}
.cat-pill.is-active{background:var(--ink);color:var(--gold-2)}
.post-card{border-radius:24px;box-shadow:none;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.post-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-sm)}
.post-card__cover{background:linear-gradient(135deg,#eef1ff,#fff7e2)}
.post-card__cover img{transition:transform .8s var(--ease)}
.post-card:hover .post-card__cover img{transform:scale(1.05)}
.post-card h3{font-weight:600;line-height:1.75}
.post-card__more{color:var(--ink);font-weight:600}
.post-card__more i{transition:transform .3s var(--ease)}
.post-card:hover .post-card__more i{transform:translateX(-4px)}
.post-card__cat{background:rgba(54,87,245,.08);font-weight:600}
/* the newest post leads the listing */
.blog-grid>.post-card:first-child{grid-column:1/-1;flex-direction:row;align-items:center}
.blog-grid>.post-card:first-child .post-card__cover{position:relative;flex:0 0 54%;aspect-ratio:1200/630;align-self:stretch;min-height:0}
.blog-grid>.post-card:first-child .post-card__cover picture,.blog-grid>.post-card:first-child .post-card__cover>img,
.blog-grid>.post-card:first-child .post-card__cover .post-card__placeholder{position:absolute;inset:0;width:100%;height:100%}
/* cover art carries its title on the right (RTL), so crop from the left when the card is taller */
.blog-grid>.post-card:first-child .post-card__cover img{width:100%;height:100%;object-fit:cover;object-position:100% 50%}
.blog-grid>.post-card:first-child .post-card__body{flex:1;min-width:0;justify-content:center;padding:clamp(22px,3.5vw,44px);gap:14px}
.blog-grid>.post-card:first-child h3{font-size:clamp(1.2rem,2.2vw,1.7rem)}
.blog-grid>.post-card:first-child p{flex:none;font-size:.98rem}
.pager__item{border-radius:50%;font-weight:600}
.pager__item:hover{border-color:var(--ink);color:var(--ink)}
.pager__item.is-active{background:var(--ink);color:var(--gold-2)}
.article>h1{font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1.6}
.article__cover{border-radius:28px}
.crumbs a{color:var(--gold-deep);font-weight:600}
.toc{border-radius:20px}
.prose pre,.prose .ql-code-block-container{border-radius:18px;background:#0d1228}
.prose blockquote{border-radius:0 14px 14px 0}
.prose .table-wrap{border-radius:16px}
.read-progress{position:fixed;top:0;inset-inline:0;height:3px;z-index:120;background:linear-gradient(270deg,var(--gold-2),var(--blue));transform-origin:right;transform:scaleX(0);pointer-events:none}
@supports (animation-timeline:scroll()){
  .read-progress{animation:readGrow linear both;animation-timeline:scroll(root)}
  @keyframes readGrow{to{transform:scaleX(1)}}
}
/* pages that start with plain content (article, 404) still need to clear the floating header */
main>.section:first-child,main>article.section:first-child{padding-top:clamp(40px,6vw,72px)}

/* ===== 404 ============================================================== */
.nf{position:relative;overflow:hidden;margin-top:-76px;padding:clamp(150px,18vw,220px) 0 clamp(70px,10vw,130px);text-align:center;
  background:radial-gradient(60% 70% at 85% 0%,rgba(242,182,50,.17),transparent 70%),radial-gradient(55% 60% at 5% 30%,rgba(54,87,245,.10),transparent 70%),#fff}
.nf>.container{position:relative}
.nf__num{display:flex;justify-content:center;gap:.08em;direction:ltr;font-size:clamp(5rem,18vw,11rem);font-weight:700;line-height:1.2}
.nf__num span{display:inline-block;background:linear-gradient(100deg,#c98a06,#f2b632 55%,#e0891b);-webkit-background-clip:text;background-clip:text;color:transparent;animation:artFloat 5s ease-in-out infinite}
.nf__num span:nth-child(2){animation-delay:-1.6s;background:linear-gradient(100deg,#111730,#3657f5);-webkit-background-clip:text;background-clip:text}
.nf__num span:nth-child(3){animation-delay:-3.2s}
.nf .lead{margin-inline:auto}

/* ===== Footer =========================================================== */
.site-footer{position:relative;background:#0d1228;border-radius:36px 36px 0 0;overflow:hidden}
.site-footer::before{content:"";position:absolute;top:0;inset-inline:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold-2),var(--blue),transparent);background-size:200% 100%;animation:footLine 7s linear infinite}
.site-footer h4{font-weight:600}
.site-footer ul a{display:inline-block;transition:color .2s,transform .3s var(--ease)}
.site-footer ul a:hover{transform:translateX(-4px)}
.pay-badge{border-radius:999px}
@keyframes footLine{to{background-position:-200% 0}}

/* ===== Responsive ======================================================= */
@media(max-width:1020px){
  .ph{margin-top:-70px}
  .ph__grid{grid-template-columns:1fr}
  .ph__art{min-height:0;max-width:420px;width:100%;margin-inline:auto}
  .ph--page .ph__art,.ph--blog .ph__art,.ph--about .ph__art{display:none}
  .nf{margin-top:-70px}
}
@media(max-width:900px){
  .container--narrow:has(>.faq){grid-template-columns:1fr}
  .container--narrow:has(>.faq)>.sec-head{position:static}
  .blog-grid>.post-card:first-child{flex-direction:column;align-items:stretch}
  .blog-grid>.post-card:first-child .post-card__cover{flex:none;width:100%}
}
@media(max-width:640px){
  .ph__actions .btn{flex:1 1 100%}
  .cta{width:calc(100% - 24px);border-radius:28px}
  .site-footer{border-radius:28px 28px 0 0}
  .hp-node text{font-size:19px}
}
@media(max-width:720px){
  .ptable__row{border-radius:20px}
  .ptable__row.is-active{box-shadow:0 14px 30px -20px rgba(17,23,48,.4);border-color:var(--ink)}
  .ptable__mo,.ptable__mo::before{color:var(--ink)}
}
@media(prefers-reduced-motion:reduce){
  .ph *,.ph *::before,.ph *::after,.nf *,.site-footer::before,.read-progress{animation:none!important;transition:none!important}
  .ph__art{transform:none}
  .art-time__line,.art-seal__lines path,.art-seal__tick{stroke-dashoffset:0}
  .art-time__dots circle,.art-seal__ring{transform:scale(1)}
  .art-time__area{opacity:1}
  .art-talk__b--typing{display:none}
  .rv{opacity:1;transform:none;transition:none!important}
}