/* =====================================================================
   Eramhost Modern — RTL-first design system
   Light & premium · cyan #00c2e5 -> blue #1f6fd6 signature
   ===================================================================== */

:root{
  /* brand */
  --cyan:#00c2e5;
  --cyan-600:#02a7c6;
  --blue:#1f6fd6;
  --blue-700:#1656ac;
  --ink:#0b1f3a;          /* deep navy for dark bands + headings */
  --ink-2:#13294b;
  --grad:linear-gradient(135deg,#00c2e5 0%,#1f6fd6 55%,#1656ac 100%);
  --grad-soft:linear-gradient(135deg,rgba(0,194,229,.14),rgba(31,111,214,.14));

  /* neutrals */
  --bg:#ffffff;
  --bg-soft:#f4f8fc;
  --bg-soft-2:#eef4fb;
  --line:#e4ebf3;
  --text:#15243a;
  --muted:#566379;
  --faint:#6b7a92;   /* was #8693a7 (3.1:1 on white) — darkened to pass WCAG AA 4.5:1 */
  --white:#ffffff;

  /* type */
  --font:'Vazirmatn',-apple-system,BlinkMacSystemFont,'Segoe UI',Tahoma,sans-serif;

  /* shape */
  --r-sm:10px; --r:16px; --r-lg:22px; --r-xl:30px; --r-pill:999px;
  --shadow-sm:0 2px 10px rgba(11,31,58,.06);
  --shadow:0 18px 40px -18px rgba(11,31,58,.22);
  --shadow-lg:0 30px 70px -28px rgba(13,42,80,.40);
  --shadow-cyan:0 18px 44px -16px rgba(0,150,200,.55);

  /* layout */
  --container:1200px;
  --gap:24px;
  --header-h:150px; /* topbar 54 + navbar 96 */
}

/* ----------------------------- reset/base ----------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{
  margin:0;font-family:var(--font);background:var(--bg);color:var(--text);
  font-size:16px;line-height:1.85;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:none;transition:color .2s}
a:hover{color:var(--blue-700)}   /* was --cyan-600 (2.9:1 on white) — WCAG AA fail */
ul{margin:0;padding:0;list-style:none}
button{font-family:inherit;cursor:pointer}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.4;font-weight:800;color:var(--ink);letter-spacing:-.01em}
h1{font-size:clamp(2rem,4.4vw,3.25rem);line-height:1.3}
h2{font-size:clamp(1.6rem,3vw,2.4rem)}
h3{font-size:1.25rem}
p{margin:0 0 1em}
:focus-visible{outline:3px solid rgba(31,111,214,.45);outline-offset:2px;border-radius:6px}
::selection{background:rgba(0,194,229,.25)}

/* skip-to-content: visually hidden until keyboard-focused (WCAG 2.4.1) */
.skip-link{position:absolute;inset-inline-start:-9999px;top:12px;z-index:3000;background:var(--ink);color:#fff;
  padding:12px 22px;border-radius:var(--r-pill);font-weight:700;font-size:.95rem;box-shadow:var(--shadow)}
.skip-link:focus{inset-inline-start:12px;color:#fff}

/* ----------------------------- layout --------------------------------- */
.container{max-width:var(--container);margin-inline:auto;padding-inline:22px;width:100%}
.section{padding-block:clamp(56px,8vw,104px)}
.section-soft{background:var(--bg-soft)}
.section-ink{background:var(--ink);color:#cdd7e6}
.section-ink h1,.section-ink h2,.section-ink h3{color:#fff}
.center{text-align:center}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;font-size:.82rem;font-weight:700;
  color:var(--blue);background:var(--grad-soft);padding:7px 16px;border-radius:var(--r-pill);
  margin-bottom:18px;letter-spacing:.01em;
}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px rgba(0,194,229,.2)}
.section-head{max-width:680px;margin-inline:auto;margin-bottom:46px}
.section-head.center{text-align:center}
.section-head p{color:var(--muted);font-size:1.05rem;margin:0}
.lead{font-size:1.12rem;color:var(--muted)}

/* ----------------------------- buttons -------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-weight:700;font-size:1rem;padding:13px 26px;border-radius:var(--r-pill);
  border:1.5px solid transparent;transition:transform .25s cubic-bezier(.2,.8,.3,1),box-shadow .25s,background .25s,color .2s;
  position:relative;overflow:hidden;white-space:nowrap;line-height:1;
}
.btn svg{width:19px;height:19px}
.btn-primary{background:var(--grad);color:#fff;box-shadow:var(--shadow-cyan)}
.btn-primary:hover{color:#fff;transform:translateY(-3px);box-shadow:0 26px 54px -16px rgba(0,150,200,.7)}
.btn-primary::after{ /* sheen */
  content:"";position:absolute;inset:0;transform:translateX(120%);
  background:linear-gradient(110deg,transparent,rgba(255,255,255,.45),transparent);
  transition:transform .7s;
}
.btn-primary:hover::after{transform:translateX(-120%)}
.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line);box-shadow:var(--shadow-sm)}
.btn-ghost:hover{color:var(--blue);border-color:var(--cyan);transform:translateY(-3px)}
.btn-light{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.32);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.btn-light:hover{background:rgba(255,255,255,.24);color:#fff;transform:translateY(-3px)}
.btn-lg{padding:16px 34px;font-size:1.06rem}
.btn-block{display:flex;width:100%}

/* ----------------------------- header --------------------------------- */
.site-header{position:fixed;inset-inline:0;top:0;z-index:100;transition:box-shadow .3s}
.site-header .container{display:flex;align-items:center;gap:14px;justify-content:space-between}

/* utility top bar */
.topbar{transition:max-height .35s ease,background .3s;font-size:.83rem;border-bottom:1px solid rgba(255,255,255,.14)}
.topbar .container{height:54px}
.tb-side{display:flex;align-items:center;gap:22px}
.topbar a{display:inline-flex;align-items:center;gap:7px;color:rgba(255,255,255,.82);font-weight:500}
.topbar a:hover{color:#fff}
.topbar svg{width:15px;height:15px;opacity:.9}
/* CTA buttons relocated into the utility bar */
.topbar .tb-left{gap:12px}
.topbar .btn-order{padding:8px 20px;font-size:.88rem;border-radius:999px;box-shadow:none;font-weight:600}
.topbar .btn-order svg{width:18px;height:18px;opacity:1}
.topbar .btn-primary.btn-order{color:#fff;box-shadow:0 10px 22px -12px rgba(0,150,200,.65)}
.topbar .btn-primary.btn-order:hover{color:#fff;transform:translateY(-2px)}
.topbar .btn-ghost.btn-order{background:#fff;color:var(--ink);border-color:transparent}
.topbar .btn-ghost.btn-order:hover{color:var(--blue);transform:translateY(-2px)}
.topbar .btn-note::before{width:16px;height:16px}

/* main navbar */
.navbar{transition:background .3s,box-shadow .3s}
.navbar .container{height:96px;transition:height .3s}
.brand{display:flex;align-items:center;flex:none}
.brand .logo{height:86px;width:auto;display:block}
.brand .logo-dark{display:none}

/* default = transparent over the hero/page-hero gradient */
body.has-hero .topbar{background:rgba(4,18,40,.22);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
body.has-hero .navbar{background:transparent}
body.has-hero .nav-menu>li>a{color:rgba(255,255,255,.94)}
body.has-hero .nav-toggle{color:#fff}
body:not(.has-hero) .site-header{position:fixed}
body:not(.has-hero) .topbar{background:var(--ink)}
body:not(.has-hero) .navbar{background:#fff;box-shadow:0 6px 24px -16px rgba(11,31,58,.25)}
body:not(.has-hero) .brand .logo-light{display:none}
body:not(.has-hero) .brand .logo-dark{display:block}
body:not(.has-hero) .nav-menu>li>a{color:var(--ink)}

/* scrolled = solid white, topbar tucks away */
.site-header.scrolled .topbar{background:var(--ink);border-color:transparent}
.site-header.scrolled .navbar{background:#fff;box-shadow:0 6px 26px -14px rgba(11,31,58,.30)}
.site-header.scrolled .navbar .container{height:80px}
.site-header.scrolled .brand .logo{height:72px}
.site-header.scrolled .brand .logo-light{display:none}
.site-header.scrolled .brand .logo-dark{display:block}
.site-header.scrolled .nav-menu>li>a{color:var(--ink)}
.site-header.scrolled .nav-toggle{color:var(--ink)}

/* nav */
.nav-wrap{display:flex;align-items:center;margin-inline:auto}
.nav-menu{display:flex;align-items:center;gap:6px}
.nav-menu>li{position:relative}
.nav-menu>li>a{display:flex;align-items:center;white-space:nowrap;padding:9px 14px;font-weight:600;font-size:.92rem;border-radius:10px;transition:color .2s,background .25s,transform .2s}
.nav-menu>li>a:hover{color:#fff;background:rgba(255,255,255,.16);transform:translateY(-1px)}
.site-header.scrolled .nav-menu>li>a:hover,body:not(.has-hero) .nav-menu>li>a:hover{background:var(--bg-soft);color:var(--blue)}
/* active page — soft pill, no underline */
.nav-menu .current-menu-item>a,.nav-menu .current_page_item>a,.nav-menu .current-menu-parent>a{color:#fff;background:rgba(255,255,255,.22);font-weight:700}
.site-header.scrolled .nav-menu .current-menu-item>a,.site-header.scrolled .nav-menu .current_page_item>a,.site-header.scrolled .nav-menu .current-menu-parent>a,body:not(.has-hero) .nav-menu .current-menu-item>a,body:not(.has-hero) .nav-menu .current_page_item>a,body:not(.has-hero) .nav-menu .current-menu-parent>a{color:var(--blue);background:var(--grad-soft)}
.nav-menu>li.menu-item-has-children>a::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-inline-start:7px;margin-top:-3px;opacity:.6;transition:transform .25s}
.nav-menu>li.menu-item-has-children:hover>a::after{transform:rotate(45deg) translate(2px,2px)}
.nav-menu .sub-menu{position:absolute;top:calc(100% + 12px);inset-inline-end:0;min-width:236px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:8px;opacity:0;visibility:hidden;transform:translateY(10px);transition:.22s;z-index:20}
.nav-menu .sub-menu::before{content:"";position:absolute;top:-12px;inset-inline:0;height:12px}
.nav-menu>li:hover>.sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-menu .sub-menu a{display:block;padding:10px 14px;border-radius:9px;color:var(--text)!important;font-size:.9rem;font-weight:500;white-space:nowrap;transition:background .2s,padding .2s}
.nav-menu .sub-menu a:hover{background:var(--bg-soft);color:var(--blue)!important;padding-inline-end:18px}

.header-cta{display:flex;align-items:center;gap:10px;flex:none}
.header-cta .btn-order{padding:11px 20px;font-size:.92rem}
.nav-toggle{display:none;background:none;border:0;width:44px;height:44px;border-radius:10px;color:var(--ink);flex-direction:column;align-items:center;justify-content:center}
.nav-toggle span{display:block;width:22px;height:2px;background:currentColor;margin:2.5px 0;border-radius:2px;transition:.3s}

/* mobile drawer */
.mobile-nav{position:fixed;inset:0;z-index:200;visibility:hidden;pointer-events:none}
.mobile-nav .scrim{position:absolute;inset:0;background:rgba(11,31,58,.5);opacity:0;transition:.3s}
.mobile-nav .panel{position:absolute;inset-block:0;inset-inline-end:0;width:min(86vw,340px);background:#fff;box-shadow:var(--shadow-lg);transform:translateX(100%);transition:transform .35s cubic-bezier(.2,.8,.3,1);padding:22px;overflow-y:auto}
.mobile-nav.open{visibility:visible;pointer-events:auto}
.mobile-nav.open .scrim{opacity:1}
.mobile-nav.open .panel{transform:translateX(0)}
.mobile-nav .panel .m-menu a,.mobile-nav .panel .sub-menu a{display:block;padding:13px 10px;border-radius:10px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--line)}
.mobile-nav .panel .m-menu a:hover{background:var(--bg-soft);color:var(--blue)}
.mobile-nav .panel .sub-menu{padding-inline-start:14px}
.mobile-nav .panel .sub-menu a{font-weight:500;font-size:.92rem;border-bottom:0;color:var(--muted)}
.mobile-nav .m-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.mobile-nav .m-head img{height:34px;width:auto}
.mobile-nav .m-close{background:none;border:0;font-size:1.9rem;color:var(--muted);line-height:1;
  min-width:44px;min-height:44px;display:grid;place-items:center}   /* ≥44px touch target */
.mobile-nav .m-contact{margin-top:16px;text-align:center}
.mobile-nav .m-contact a{display:inline-flex;gap:7px;align-items:center;color:var(--blue);font-weight:700}

/* ----------------------------- hero ----------------------------------- */
.hero{position:relative;background:var(--grad);color:#fff;overflow:hidden;padding-top:calc(var(--header-h) + 56px);padding-bottom:96px}
.hero .orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;pointer-events:none}
.hero .orb-1{width:420px;height:420px;background:#46e0ff;top:-120px;inset-inline-end:-80px;animation:float1 14s ease-in-out infinite}
.hero .orb-2{width:360px;height:360px;background:#1f6fd6;bottom:-140px;inset-inline-start:-60px;animation:float2 17s ease-in-out infinite}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 0,rgba(255,255,255,.18),transparent 45%);pointer-events:none}
.hero .grain{position:absolute;inset:0;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");pointer-events:none}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center}
.hero h1{color:#fff;margin-bottom:18px}
.hero h1 .hl{background:linear-gradient(90deg,#bff4ff,#fff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-sub{font-size:1.16rem;color:rgba(255,255,255,.9);max-width:560px;margin-bottom:30px;line-height:1.95}
.hero .eyebrow{background:rgba(255,255,255,.16);color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero .eyebrow::before{background:#bff4ff;box-shadow:0 0 0 4px rgba(255,255,255,.25)}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px}
.hero-meta{display:flex;gap:26px;flex-wrap:wrap}
.hero-meta .hm{display:flex;align-items:center;gap:9px;font-size:.95rem;color:rgba(255,255,255,.92)}
.hero-meta .hm svg{width:20px;height:20px;color:#bff4ff}

/* hero glass card */
.hero-card{position:relative;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);border-radius:var(--r-xl);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--shadow-lg);padding:26px}
.hero-card .hc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;color:#fff}
.hero-card .hc-dots{display:flex;gap:6px}
.hero-card .hc-dots i{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.4)}
.hero-card .hc-dots i:first-child{background:#ff6b6b}.hero-card .hc-dots i:nth-child(2){background:#ffd166}.hero-card .hc-dots i:nth-child(3){background:#69db7c}
.hc-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hc-stat{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);border-radius:var(--r);padding:16px}
.hc-stat .v{font-size:1.5rem;font-weight:800;color:#fff;display:flex;align-items:center;gap:7px}
.hc-stat .v svg{width:22px;height:22px;color:#bff4ff}
.hc-stat .l{font-size:.85rem;color:rgba(255,255,255,.78)}
.hc-bar{margin-top:14px;height:8px;border-radius:6px;background:rgba(255,255,255,.18);overflow:hidden}
.hc-bar i{display:block;height:100%;width:99.9%;background:linear-gradient(90deg,#bff4ff,#fff);border-radius:6px}
.float-badge{position:absolute;background:#fff;color:var(--ink);border-radius:14px;padding:11px 15px;box-shadow:var(--shadow);display:flex;align-items:center;gap:9px;font-weight:700;font-size:.86rem;z-index:5}
.float-badge svg{width:22px;height:22px;color:var(--cyan-600)}
.float-badge.fb1{top:-18px;inset-inline-start:-22px;animation:float1 6s ease-in-out infinite}
.float-badge.fb2{bottom:-16px;inset-inline-end:-18px;animation:float2 7s ease-in-out infinite}

/* hero wave divider */
.hero-wave{position:absolute;bottom:-1px;inset-inline:0;z-index:3;line-height:0}
.hero-wave svg{width:100%;height:70px;display:block}

/* ----------------------- domain search bar --------------------------- */
.domain-search{position:relative;z-index:4;margin-top:30px}
.domain-box{display:flex;flex-direction:row;gap:10px;background:#fff;border-radius:var(--r-pill);padding:8px;box-shadow:var(--shadow-lg);max-width:620px}
.domain-box input{flex:1;border:0;background:transparent;padding:0 20px;font-family:inherit;font-size:1.05rem;font-weight:700;text-align:center;color:var(--ink);outline:none;min-width:0}
.domain-box input::placeholder{color:var(--faint)}
.tld-row{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;color:rgba(255,255,255,.9);font-size:.92rem}
.tld-row b{color:#bff4ff}
/* ----------------------- TLD price filter --------------------------- */
.tld-filter{position:relative;max-width:520px;margin:0 auto 30px}
.tld-filter input{width:100%;box-sizing:border-box;padding:14px 18px 14px 52px;border:1.5px solid var(--line);border-radius:14px;background:#fff;font:inherit;font-size:1rem;font-weight:700;color:var(--ink);direction:ltr;text-align:center;transition:border-color .2s,box-shadow .2s}
.tld-filter input::placeholder{text-align:center;font-weight:400}
.tld-filter input::placeholder{color:var(--muted)}
.tld-filter input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 4px rgba(0,194,229,.15)}
.tld-filter svg{position:absolute;left:18px;right:auto;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--cyan);pointer-events:none}
#tldNoResult{margin-top:8px}
.tld-amt{direction:ltr;unicode-bidi:isolate;display:inline-block}
/* hero domain price chips + trust row */
.dom-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}
.dom-chip{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);color:#fff;padding:7px 15px;border-radius:var(--r-pill);font-size:.9rem;font-weight:600;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.dom-chip b{color:#bff4ff}
.dom-trust{display:flex;flex-wrap:wrap;gap:22px;justify-content:center;margin-top:18px;color:rgba(255,255,255,.92);font-size:.92rem}
.dom-trust span{display:inline-flex;align-items:center;gap:7px}
.dom-trust .eram-ic{width:17px;height:17px;color:#bff4ff}

/* ----------------------------- trust bar ------------------------------ */
.trust{padding-block:34px;border-bottom:1px solid var(--line);background:#fff}
.trust p{text-align:center;color:var(--faint);font-size:.86rem;margin-bottom:18px;font-weight:600;letter-spacing:.04em}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marquee-track{display:flex;gap:54px;align-items:center;width:max-content;animation:marquee 32s linear infinite}
.marquee-track span{color:var(--faint);font-weight:700;font-size:1.05rem;opacity:.7;white-space:nowrap;display:flex;align-items:center;gap:8px}
.marquee:hover .marquee-track{animation-play-state:paused}

/* ----------------------------- cards/grid ----------------------------- */
.grid{display:grid;gap:var(--gap)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-5{grid-template-columns:repeat(5,1fr)}
.grid-5 .plan{padding:18px}
.grid-5 .plan .price .num{font-size:1.35rem}
.grid-5 .plan .p-feats li{font-size:.86rem}
.coming-soon{max-width:680px;margin:0 auto;text-align:center;background:#fff;border:1px solid var(--line);border-radius:24px;padding:54px 40px;box-shadow:var(--shadow)}
.coming-soon .cs-badge{width:84px;height:84px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;box-shadow:var(--shadow-cyan)}
.coming-soon .cs-badge svg{width:38px;height:38px}
.coming-soon .cs-tag{display:inline-block;background:rgba(0,194,229,.12);color:var(--cyan-600);font-weight:800;font-size:.82rem;padding:5px 16px;border-radius:999px;margin-bottom:14px}
.coming-soon h2{font-size:1.6rem;margin:0 0 12px;color:var(--ink)}
.coming-soon p{color:var(--muted);font-size:1.05rem;line-height:2;margin:0 0 24px}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;transition:transform .3s,box-shadow .3s,border-color .3s;position:relative;overflow:hidden}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
.card .ic-wrap{width:56px;height:56px;border-radius:16px;background:var(--grad-soft);display:grid;place-items:center;color:var(--blue);margin-bottom:18px;transition:.3s}
.card .ic-wrap svg{width:28px;height:28px}
.card:hover .ic-wrap{background:var(--grad);color:#fff;box-shadow:var(--shadow-cyan)}
/* GCMS card: maple icon matches the other service icons (blue box, blue leaf, white on hover) */
.card h3{margin-bottom:8px;font-size:1.18rem}
.card p{color:var(--muted);font-size:.96rem;margin:0}
.card .card-link{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-weight:700;color:var(--blue);font-size:.92rem}
.card .card-link svg{width:16px;height:16px;transition:transform .25s}
.card:hover .card-link svg{transform:translateX(-4px)}

/* feature row (image + text) */
.feature-row{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center}
.feature-row.flip .feature-media{order:2}
.feature-media{position:relative;aspect-ratio:4/3}
.feature-media img{width:100%;height:100%;object-fit:cover;border-radius:var(--r-xl);box-shadow:var(--shadow-lg);position:relative;z-index:1}
.feature-media .fm-accent{position:absolute;z-index:0;width:48%;height:48%;border-radius:30px;background:var(--grad);opacity:.16;bottom:-20px;inset-inline-start:-20px}
.feature-list{margin-top:18px;display:grid;gap:13px}
.feature-list li{display:flex;gap:12px;align-items:flex-start;color:var(--text)}
.feature-list li svg{flex:none;width:24px;height:24px;color:#fff;background:var(--grad);border-radius:50%;padding:4px;margin-top:2px}
.feature-list li b{display:block;color:var(--ink)}
.feature-list li span{color:var(--muted);font-size:.94rem}

/* ----------------------------- pricing -------------------------------- */
.price-toggle{display:inline-flex;background:var(--bg-soft);border:1.5px solid var(--line);border-radius:var(--r-pill);padding:6px;margin:0 auto 36px;gap:5px;box-shadow:0 12px 30px -16px rgba(11,31,58,.3)}
.price-toggle button{border:0;background:none;padding:12px 28px;border-radius:var(--r-pill);font-weight:800;font-size:1.04rem;color:var(--ink);transition:.25s;cursor:pointer}
.price-toggle button:not(.active):hover{color:var(--blue)}
.price-toggle button.active{background:#fff;color:var(--blue);box-shadow:0 8px 20px -8px rgba(31,111,214,.4),0 0 0 1.5px rgba(27,201,236,.4)}
.price-toggle .save{font-size:.72rem;background:var(--grad);color:#fff;padding:2px 8px;border-radius:var(--r-pill);margin-inline-start:6px}

.plan{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s,border-color .3s;position:relative}
.plan:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.plan.featured{border-color:transparent;box-shadow:var(--shadow-lg);transform:scale(1.02)}
.plan.featured::before{content:"";position:absolute;inset:0;border-radius:var(--r-lg);padding:2px;background:var(--grad);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.plan .badge{position:absolute;top:-13px;inset-inline-start:50%;transform:translateX(50%);background:var(--grad);color:#fff;font-size:.78rem;font-weight:700;padding:5px 16px;border-radius:var(--r-pill);box-shadow:var(--shadow-cyan)}
.plan h3{font-size:1.15rem;margin-bottom:4px}
.plan .p-desc{color:var(--muted);font-size:.9rem;margin-bottom:18px;min-height:40px}
.plan .price{display:flex;align-items:baseline;gap:6px;margin-bottom:6px}
.plan .price .num{font-size:2.3rem;font-weight:800;color:var(--ink)}
.grid-4 .plan .price .num{font-size:1.6rem}
.grid-4 .plan{padding:24px}
.plan .price .unit{color:var(--faint);font-size:.9rem}
.plan .p-period{color:var(--faint);font-size:.85rem;margin-bottom:20px}
.plan .p-note{display:flex;gap:7px;align-items:flex-start;background:#fff7ed;border:1px solid #fed7aa;color:#b45309;border-radius:10px;padding:9px 11px;font-size:.8rem;line-height:1.7;margin:0 0 18px}
.plan .p-note svg{flex:none;width:16px;height:16px;color:#ea8a16;margin-top:2px}
.plan ul.p-feats{display:grid;gap:11px;margin:0 0 24px;flex:1}
.plan ul.p-feats li{display:flex;gap:10px;align-items:center;color:var(--text);font-size:.95rem}
.plan ul.p-feats li svg{flex:none;width:20px;height:20px;color:var(--cyan-600)}
.plan ul.p-feats li.off{color:var(--faint);text-decoration:line-through;opacity:.7}

/* ----------------------------- stats band ----------------------------- */
.stats-band{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.stats-band::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 20%,rgba(0,194,229,.22),transparent 40%),radial-gradient(circle at 85% 90%,rgba(31,111,214,.25),transparent 45%)}
.stats-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);text-align:center}
.stat .num{font-size:clamp(2.2rem,4vw,3.1rem);font-weight:800;background:linear-gradient(90deg,#bff4ff,#fff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1.1}
.stat .lbl{color:#9fb1c9;font-size:.98rem;margin-top:6px}

/* ----------------------------- steps ---------------------------------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);counter-reset:s}
.step{position:relative;padding:26px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);transition:.3s}
.step:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.step .n{width:46px;height:46px;border-radius:14px;background:var(--grad);color:#fff;display:grid;place-items:center;font-weight:800;font-size:1.2rem;margin-bottom:16px;box-shadow:var(--shadow-cyan)}
.step h3{font-size:1.08rem;margin-bottom:6px}
.step p{color:var(--muted);font-size:.93rem;margin:0}

/* ----------------------------- testimonials --------------------------- */
.t-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;transition:.3s}
.t-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.t-card .stars{color:#ffb020;margin-bottom:12px;letter-spacing:2px}
.t-card p{color:var(--text);font-size:1rem;line-height:1.95}
.t-card .who{display:flex;align-items:center;gap:12px;margin-top:18px}
.t-card .who .av{width:46px;height:46px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-weight:800}
.t-card .who b{display:block;color:var(--ink);font-size:.96rem}
.t-card .who span{color:var(--faint);font-size:.84rem}

/* ----------------------------- FAQ (animated accordion, icon at start) - */
.faq{max-width:860px;margin-inline:auto;display:grid;gap:14px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:box-shadow .3s,border-color .3s}
.faq-item.open{box-shadow:var(--shadow);border-color:transparent}
.faq-q{width:100%;background:none;border:0;padding:18px 22px;font-family:inherit;font-weight:700;color:var(--ink);cursor:pointer;display:flex;align-items:center;gap:16px;text-align:start;font-size:1.02rem}
.faq-q .faq-qt{flex:1}
.faq-q .pm{position:relative;flex:none;width:32px;height:32px;border-radius:50%;background:var(--grad-soft);transition:background .3s,transform .3s}
.faq-q .pm::before,.faq-q .pm::after{content:"";position:absolute;top:50%;left:50%;width:13px;height:2.5px;border-radius:2px;background:var(--blue);transform:translate(-50%,-50%);transition:transform .35s,background .3s}
.faq-q .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-item:hover .pm{background:var(--grad)}
.faq-item:hover .pm::before,.faq-item:hover .pm::after{background:#fff}
.faq-item.open .pm{background:var(--grad);transform:rotate(180deg)}
.faq-item.open .pm::before,.faq-item.open .pm::after{background:#fff}
.faq-item.open .pm::after{transform:translate(-50%,-50%) rotate(0)}
.faq-a-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.2,.8,.3,1)}
.faq-item.open .faq-a-wrap{grid-template-rows:1fr}
.faq-a{overflow:hidden;min-height:0;padding-inline:22px;color:var(--muted);line-height:1.95}
.faq-item.open .faq-a{padding-bottom:20px}

/* ----------------------------- CTA band ------------------------------- */
.cta-band{position:relative;background:var(--grad);color:#fff;border-radius:var(--r-xl);padding:clamp(38px,5vw,64px);overflow:hidden;text-align:center}
.cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.2),transparent 40%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.14),transparent 40%)}
.cta-band h2{color:#fff;position:relative}
.cta-band p{color:rgba(255,255,255,.92);position:relative;max-width:560px;margin-inline:auto;margin-bottom:28px}
.cta-band .hero-actions{position:relative;justify-content:center}

/* ----------------------------- footer --------------------------------- */
.site-footer{background:var(--ink);color:#9fb1c9;padding-top:70px;position:relative;overflow:hidden}
.site-footer::before{content:"";position:absolute;top:0;inset-inline:0;height:1px;background:var(--grad)}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:46px}
.footer-brand .brand{color:#fff;margin-bottom:14px}
.footer-brand p{color:#8295b0;font-size:.94rem;max-width:320px}
.footer-contact{display:grid;gap:10px;margin-top:16px}
.footer-contact a,.footer-contact span{display:flex;align-items:center;gap:9px;color:#9fb1c9;font-size:.92rem}
.footer-contact svg{width:18px;height:18px;color:var(--cyan)}
.site-footer h3{color:#fff;font-size:1rem;margin-bottom:18px}
.footer-links{display:grid;gap:10px}
.footer-links a{color:#9fb1c9;font-size:.93rem;transition:color .2s,padding .2s}
.footer-links a:hover{color:var(--cyan);padding-inline-start:5px}
.footer-social{display:flex;gap:10px;margin-top:8px}
.footer-social a{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.07);display:grid;place-items:center;color:#cdd7e6;transition:.25s}
.footer-social a:hover{background:var(--grad);color:#fff;transform:translateY(-3px)}
.footer-enamad{margin-top:20px}
.footer-enamad .fe-label{display:flex;align-items:center;gap:7px;font-size:.82rem;color:#9fb1c9;margin-bottom:10px}
.footer-enamad .fe-label svg{width:16px;height:16px;color:var(--cyan)}
.footer-enamad .fe-seal{display:inline-flex;background:#fff;border-radius:14px;padding:10px;box-shadow:0 10px 30px -16px rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.12)}
.footer-enamad .fe-seal img{max-width:96px;height:auto;border-radius:6px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-block:22px;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-size:.86rem;color:#7488a4}
.footer-watermark{position:absolute;top:50%;transform:translateY(-50%);font-size:8rem;font-weight:800;color:rgba(255,255,255,.03);line-height:1;pointer-events:none;white-space:nowrap}
.footer-watermark.fw-en{left:24px}
.footer-watermark.fw-fa{right:24px}

/* ----------------------------- page hero (inner) ---------------------- */
.page-hero{background:var(--grad);color:#fff;position:relative;overflow:hidden;padding-top:calc(var(--header-h) + 54px);padding-bottom:66px;text-align:center}
.page-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 0,rgba(255,255,255,.16),transparent 45%)}
.page-hero .orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.5}
.page-hero .orb-1{width:340px;height:340px;background:#46e0ff;top:-120px;inset-inline-end:-60px}
.page-hero h1{color:#fff;position:relative}
.page-hero p{color:rgba(255,255,255,.9);position:relative;max-width:620px;margin-inline:auto;margin-bottom:0}
.crumbs{position:relative;display:flex;gap:8px;justify-content:center;color:rgba(255,255,255,.75);font-size:.88rem;margin-bottom:16px}
.crumbs a{color:rgba(255,255,255,.85)}
.crumbs a:hover{color:#fff}

/* article/content */
.entry{max-width:820px;margin-inline:auto}
.entry h2,.entry h3{margin-top:1.4em}
.entry img{border-radius:var(--r);margin-block:1.2em}
.entry ul{list-style:disc;padding-inline-start:1.4em;margin-bottom:1em}
.entry ul li{margin-bottom:.4em}
.prose{color:var(--text);line-height:2}

/* blog cards */
.post-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:.3s;display:flex;flex-direction:column}
.post-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.post-card .thumb{aspect-ratio:16/9;overflow:hidden;background:var(--grad-soft)}
.post-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.post-card:hover .thumb img{transform:scale(1.05)}
.post-card .pc-body{padding:22px}
.post-card .pc-meta{font-size:.82rem;color:var(--faint);margin-bottom:8px}
.post-card h3{font-size:1.1rem;margin-bottom:8px}
.post-card h3 a{color:var(--ink)}
.post-card h3 a:hover{color:var(--blue)}

/* ----------------------------- reveal animations ---------------------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.8,.3,1),transform .7s cubic-bezier(.2,.8,.3,1)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}
/* Above-the-fold (hero / page-hero) reveals via pure-CSS load animation — never
   depends on JS, so the first paint is always visible (no flash of empty hero). */
.hero .reveal,.page-hero .reveal{animation:eramRise .7s cubic-bezier(.2,.8,.3,1) both}
.hero .reveal.d1,.page-hero .reveal.d1{animation-delay:.08s}
.hero .reveal.d2,.page-hero .reveal.d2{animation-delay:.16s}
.hero .reveal.d3,.page-hero .reveal.d3{animation-delay:.24s}
.hero .reveal.d4,.page-hero .reveal.d4{animation-delay:.34s}
@keyframes eramRise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *{animation:none!important}
  html{scroll-behavior:auto}
}

/* scroll progress */
.scroll-progress{position:fixed;top:0;inset-inline-start:0;height:3px;width:100%;transform:scaleX(0);transform-origin:right;background:var(--grad);z-index:300}

/* floating contact button */
/* (removed: .float-contact — unused; Chaty provides the floating contact button) */

/* ----------------------------- keyframes ------------------------------ */
@keyframes float1{0%,100%{transform:translateY(0)}50%{transform:translateY(-22px)}}
@keyframes float2{0%,100%{transform:translateY(0)}50%{transform:translateY(20px)}}
@keyframes marquee{to{transform:translateX(50%)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(0,194,229,.5)}70%{box-shadow:0 0 0 16px rgba(0,194,229,0)}100%{box-shadow:0 0 0 0 rgba(0,194,229,0)}}

/* ----------------------- WP content / prose --------------------------- */
.prose h1,.prose h2,.prose h3,.prose h4{margin-top:1.3em}
.prose a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.prose blockquote{border-inline-start:4px solid var(--cyan);background:var(--bg-soft);margin:1.4em 0;padding:14px 20px;border-radius:0 var(--r) var(--r) 0;color:var(--ink)}
.prose table{width:100%;border-collapse:collapse;margin:1.4em 0;font-size:.95rem}
.prose table th,.prose table td{border:1px solid var(--line);padding:11px 14px;text-align:start}
.prose table th{background:var(--bg-soft);font-weight:700;color:var(--ink)}
.prose ol{padding-inline-start:1.4em;margin-bottom:1em}
.prose ol li{margin-bottom:.4em}
.prose hr{border:0;border-top:1px solid var(--line);margin:2em 0}
.prose .wp-block-button__link,.prose .button{display:inline-flex;align-items:center;gap:8px;background:var(--grad);color:#fff!important;padding:12px 24px;border-radius:var(--r-pill);font-weight:700;text-decoration:none;box-shadow:var(--shadow-cyan)}

/* ----------------------- forms (Gravity Forms / generic) -------------- */
.prose input[type=text],.prose input[type=email],.prose input[type=tel],.prose input[type=number],.prose input[type=password],.prose input[type=url],.prose input[type=search],.prose select,.prose textarea,
.gform_wrapper input:not([type=submit]):not([type=radio]):not([type=checkbox]),.gform_wrapper select,.gform_wrapper textarea{
  width:100%;font-family:inherit;font-size:1rem;color:var(--ink);background:#fff;
  border:1.5px solid var(--line);border-radius:var(--r-sm);padding:12px 15px;transition:border-color .2s,box-shadow .2s;
}
.prose textarea,.gform_wrapper textarea{min-height:130px}
.prose input:focus,.prose select:focus,.prose textarea:focus,
.gform_wrapper input:focus,.gform_wrapper select:focus,.gform_wrapper textarea:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 4px rgba(0,194,229,.15)}
.gform_wrapper label,.gfield_label{font-weight:600;color:var(--ink);margin-bottom:6px;display:block}
.gform_wrapper .gfield{margin-bottom:18px}
.gform_wrapper .gform_footer input[type=submit],.gform_wrapper button[type=submit],
.prose input[type=submit],.prose button[type=submit]{
  background:var(--grad)!important;color:#fff!important;border:0!important;font-weight:700;font-family:inherit;
  padding:14px 32px!important;border-radius:var(--r-pill)!important;cursor:pointer;box-shadow:var(--shadow-cyan);
  transition:transform .25s,box-shadow .25s;font-size:1rem;
}
.gform_wrapper .gform_footer input[type=submit]:hover,.prose input[type=submit]:hover{transform:translateY(-2px)}
.gform_wrapper .gform_footer{margin-top:8px}
.gform_wrapper .gfield_required{color:#e5484d}
.gform_confirmation_message{background:#e9f9ee;border:1px solid #b6e7c4;color:#1c7a3e;padding:16px 20px;border-radius:var(--r)}
.gform_wrapper .validation_message,.gform_wrapper .gfield_error .gfield_label{color:#e5484d}

/* utility */
.mt-0{margin-top:0}.mb-0{margin-bottom:0}

/* ===================== WOW: hero card, go-top, chat, motion ========== */

/* --- live hero dashboard card --- */
.hero-card{transform-style:preserve-3d;transition:transform .25s cubic-bezier(.2,.8,.3,1);will-change:transform}
.hero-card .hc-inner{position:relative;z-index:2}
.hc-glow{position:absolute;inset:-30px;z-index:0;border-radius:50%;background:radial-gradient(50% 50% at 72% 6%,rgba(70,224,255,.55),transparent 70%);filter:blur(26px);animation:hcGlow 5.5s ease-in-out infinite;pointer-events:none}
@keyframes hcGlow{0%,100%{opacity:.45;transform:translate3d(0,0,0)}50%{opacity:.8;transform:translate3d(-6px,6px,0)}}
.hc-title{display:flex;align-items:center;gap:8px;font-weight:700;color:#fff;font-size:.96rem}
.hc-title svg{width:18px;height:18px;color:#bff4ff}
.hc-live{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;color:#bff4ff;font-weight:800}
.hc-live i{width:8px;height:8px;border-radius:50%;background:#3ef0a0;animation:hcLive 2s infinite}
@keyframes hcLive{0%{box-shadow:0 0 0 0 rgba(62,240,160,.7)}70%{box-shadow:0 0 0 8px rgba(62,240,160,0)}100%{box-shadow:0 0 0 0 rgba(62,240,160,0)}}
.hc-chart{margin:14px 0 16px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:12px 14px}
.hc-chart-head{display:flex;justify-content:space-between;align-items:center;color:#fff;font-size:.82rem;margin-bottom:4px}
.hc-chart-val{font-weight:800;font-size:1.02rem}.hc-chart-val small{font-size:.7rem;color:rgba(255,255,255,.72)}
.hc-spark{width:100%;height:54px;display:block}
.spark-line{stroke-dasharray:900;stroke-dashoffset:900;animation:sparkDraw 2.1s cubic-bezier(.4,0,.2,1) forwards .4s}
.spark-area{opacity:0;animation:sparkFade 1.1s ease forwards 1.5s}
@keyframes sparkDraw{to{stroke-dashoffset:0}}
@keyframes sparkFade{to{opacity:1}}
.hc-bars{margin-top:6px}
.hc-bar-row{display:flex;justify-content:space-between;color:#fff;font-size:.84rem;margin:10px 0 6px}
.hc-bar{position:relative;overflow:hidden}
.hc-bar i{width:0;transition:width 1.2s cubic-bezier(.2,.8,.3,1) .5s;position:relative}
.hc-bar i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);transform:translateX(-120%);animation:barShimmer 2.6s ease-in-out infinite 1.4s}
@keyframes barShimmer{to{transform:translateX(120%)}}
.hc-stat{transition:transform .25s,background .25s}
.hero-card:hover .hc-stat{background:rgba(255,255,255,.16)}

/* --- modern circular go-top button (scroll progress ring) --- */
/* chat button raised so go-top can sit centered beneath it */
#chaty-widget-0 .chaty-widget.right-position,.chaty-widget.right-position{bottom:86px!important;right:20px!important}
.go-top{position:fixed;bottom:22px;right:24px;left:auto;z-index:96;width:52px;height:52px;border:0;background:none;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(18px) scale(.8);transition:opacity .35s,transform .35s cubic-bezier(.2,.8,.3,1)}
.go-top.show{opacity:1;visibility:visible;transform:none}
.go-top::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--grad);box-shadow:var(--shadow-cyan);z-index:0;transition:transform .25s,box-shadow .25s}
.go-top:hover::before{transform:scale(1.07);box-shadow:0 20px 40px -12px rgba(0,150,200,.75)}
.gt-ring{position:absolute;inset:0;width:52px;height:52px;transform:rotate(-90deg);z-index:1}
.gt-ring circle{fill:none;stroke-width:3}
.gt-track{stroke:rgba(255,255,255,.28)}
.gt-prog{stroke:#fff;stroke-linecap:round;stroke-dasharray:131.95;stroke-dashoffset:131.95;transition:stroke-dashoffset .08s linear}
.gt-arrow{position:relative;z-index:2;width:21px;height:21px;color:#fff;display:block;margin:15.5px auto}

/* --- branded Chaty chat button --- */
#chaty-widget-0 .chaty-cta-button,.chaty-widget .chaty-cta-button{background:linear-gradient(135deg,#00c2e5,#1f6fd6)!important;box-shadow:0 16px 32px -12px rgba(0,150,200,.6)!important;transition:transform .25s,box-shadow .25s!important}
/* the visible circle is an unclassed <button> inside .chaty-cta-button — brand it cyan->blue */
.chaty-widget .open-chaty,.chaty-widget .chaty-cta-button button,.chaty-widget .chaty-cta-main>button{background:linear-gradient(135deg,#00c2e5,#1f6fd6)!important;background-color:#1f6fd6!important;box-shadow:0 14px 30px -12px rgba(0,150,200,.55)!important}
/* the close (X) toggle -> brand ink so it's distinct but on-brand; keep channel colors (whatsapp/telegram) untouched */
.chaty-widget .chaty-cta-close .open-chaty,.chaty-widget .chaty-cta-close,.chaty-widget .chaty-cta-close button{background:#0b1f3a!important;background-color:#0b1f3a!important;background-image:none!important}
#chaty-widget-0 .chaty-cta-main:hover .chaty-cta-button{transform:translateY(-3px) scale(1.06)!important}
#chaty-widget-0 .chaty-cta-main::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(0,194,229,.55);animation:chatyPulse 2.6s infinite;pointer-events:none}
@keyframes chatyPulse{0%{box-shadow:0 0 0 0 rgba(0,194,229,.5)}70%{box-shadow:0 0 0 16px rgba(0,194,229,0)}100%{box-shadow:0 0 0 0 rgba(0,194,229,0)}}

/* --- site-wide motion / WOW --- */
.hero,.page-hero{background-size:180% 180%;animation:eramGrad 18s ease infinite}
@keyframes eramGrad{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(45% 55% at 50% 0,rgba(0,194,229,.12),transparent 72%);opacity:0;transition:opacity .35s;pointer-events:none;z-index:0}
.card:hover::after{opacity:1}
.card>*{position:relative;z-index:1}
.btn:active{transform:translateY(-1px) scale(.985)}
.plan:hover .badge{transform:translateX(50%) translateY(-2px)}
/* reveal scale variant for cards/plans */
.reveal.pop{transform:translateY(20px) scale(.96)}
.reveal.pop.in{transform:none}

/* defensive: never let the OLD plugin float a seal (we use our own .enamad-float) */
.enamad-logo-wrapper,[class*="enamad-logo-wrapper"],.logo-samandehi-wrapper{display:none!important}

/* .com / latin TLDs: force left-to-right inside RTL text */
.tld,.tld-row b{direction:ltr;unicode-bidi:isolate;display:inline-block}

/* footer: real logo + organized columns */
.footer-logo{height:94px;width:auto;display:block;margin-bottom:20px}
.footer-col h3{position:relative;padding-bottom:11px;margin-bottom:16px}
.footer-col h3::after{content:"";position:absolute;bottom:0;inset-inline-start:0;width:28px;height:2px;background:var(--grad);border-radius:2px}
.fb-tech{color:#7fd8ee!important;font-weight:600}

/* floating eNamad — left side (dismissible) */
.enamad-float{position:fixed;bottom:20px;left:20px;z-index:90;background:#fff;border-radius:18px;padding:6px;box-shadow:0 2px 0 rgba(255,255,255,.6) inset,0 18px 44px -18px rgba(11,31,58,.5),0 4px 12px -6px rgba(11,31,58,.25);border:1px solid var(--line);animation:efIn .6s cubic-bezier(.2,.8,.3,1) .9s both;transition:transform .25s,box-shadow .25s,opacity .3s}
.enamad-float::before{content:"";position:absolute;top:0;inset-inline:14px;height:3px;border-radius:0 0 4px 4px;background:var(--grad);opacity:.9}
.enamad-float:hover{transform:translateY(-3px);box-shadow:0 26px 56px -18px rgba(11,31,58,.6),0 6px 16px -6px rgba(11,31,58,.3)}
.enamad-float .ef-seal{position:relative;min-width:0;line-height:0}
.enamad-float .ef-seal img,.enamad-float .ef-seal a img{display:block;width:96px;max-width:96px;height:auto;border-radius:12px}
.ef-fallback{display:none;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:84px;height:84px;text-decoration:none;text-align:center}
.ef-fallback svg{width:30px;height:30px;color:var(--cyan-600)}
.ef-fallback b{font-size:.82rem;color:var(--ink);font-weight:800}
.ef-fallback small{font-size:.66rem;color:var(--muted)}
.enamad-float.ef-broken .ef-real{display:none}
.enamad-float.ef-broken .ef-fallback{display:flex}
.enamad-float.hide{transform:translateY(20px) scale(.85);opacity:0;pointer-events:none}
.ef-close{position:absolute;top:-13px;inset-inline-end:-13px;width:32px;height:32px;border-radius:50%;border:0;background:var(--ink);color:#fff;font-size:17px;line-height:1;cursor:pointer;box-shadow:var(--shadow-sm);display:grid;place-items:center;opacity:0;transition:opacity .2s}
.enamad-float:hover .ef-close,.enamad-float:focus-within .ef-close{opacity:1}
@media(pointer:coarse){.ef-close{opacity:1}}   /* touch devices have no hover — keep it reachable */
.footer-enamad img,.ef-real img{width:110px;height:auto;aspect-ratio:125/124}   /* reserve space — no CLS */
@keyframes efIn{from{opacity:0;transform:translateY(24px) scale(.9)}to{opacity:1;transform:none}}

/* domain extensions always read with the dot on the LEFT (.com not com.) */
.tld,.extension,.dom-chip .tld,.tld-amt,.eram-ext,.featured-tld .price{direction:ltr;unicode-bidi:isolate}

/* red maple leaf beside the footer GCMS link */
.footer-links a .fl-maple{display:inline-flex;vertical-align:-2px;margin-inline-start:4px}
.footer-links a .fl-maple svg{width:15px;height:15px;color:#d52b1e}

/* Enamad seal embedded in the footer */
/* Enamad seal — sits in the پشتیبانی column, under «قوانین و مقررات» */
.footer-enamad{margin-top:20px;display:flex;justify-content:flex-start}
.footer-enamad a,.footer-enamad span{display:inline-block;background:#fff;border-radius:16px;padding:8px;box-shadow:0 18px 40px -18px rgba(0,0,0,.55);line-height:0}
.footer-enamad img{display:block;width:100px;max-width:100px;height:auto;border-radius:10px}

/* extra micro-motion */
.card:hover .ic-wrap{transform:translateY(-2px) rotate(-6deg)}
.step .n{transition:transform .3s}.step:hover .n{transform:scale(1.08) rotate(-4deg)}
.t-card .av{transition:transform .3s}.t-card:hover .av{transform:scale(1.08)}
.feature-media{transition:transform .4s}.feature-row:hover .feature-media{transform:translateY(-5px)}
.feature-media::after{content:"";position:absolute;inset:0;border-radius:var(--r-xl);background:linear-gradient(160deg,rgba(0,194,229,.05),rgba(11,31,58,.16));z-index:2;pointer-events:none}
.feature-list li svg{transition:transform .25s}.feature-list li:hover svg{transform:scale(1.12)}

/* ----------------------------- contact page --------------------------- */
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:36px;align-items:start}
.contact-info .eyebrow{margin-bottom:14px}
.ci-list{display:grid;gap:18px;margin:24px 0}
.ci-list li{display:flex;gap:14px;align-items:flex-start}
.ci-ic{flex:none;width:48px;height:48px;border-radius:14px;background:var(--grad-soft);color:var(--blue);display:grid;place-items:center;transition:.3s}
.ci-list li:hover .ci-ic{background:var(--grad);color:#fff;box-shadow:var(--shadow-cyan);transform:translateY(-2px)}
.ci-ic svg{width:22px;height:22px}
.ci-list b{display:block;color:var(--ink);font-size:.92rem;margin-bottom:2px}
.ci-list a,.ci-plain{color:var(--muted);font-size:.96rem}
.ci-list a:hover{color:var(--blue)}
.ci-social{margin-top:10px}
.contact-form-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:34px;position:relative;overflow:hidden}
.contact-form-card::before{content:"";position:absolute;top:0;inset-inline:0;height:4px;background:var(--grad)}
.cf-title{display:flex;align-items:center;gap:10px;font-size:1.2rem;margin-bottom:22px}
.cf-title svg{width:22px;height:22px;color:var(--blue)}
.contact-form-card .entry.prose{max-width:none}
.contact-form-card .gform_wrapper .gform_footer{text-align:center;display:flex;justify-content:center;margin-top:14px}
.contact-form-card .gform_wrapper .gform_footer input[type=submit],.contact-form-card .gform_wrapper button[type=submit]{width:auto;min-width:240px;max-width:100%;padding:15px 56px!important;display:inline-flex!important;align-items:center;justify-content:center;text-align:center!important}

/* ----------------------------- extra WOW ------------------------------ */
.eyebrow::before{animation:ebDot 2.6s ease-in-out infinite}
@keyframes ebDot{0%,100%{box-shadow:0 0 0 4px rgba(0,194,229,.18)}50%{box-shadow:0 0 0 7px rgba(0,194,229,.06)}}
.plan.featured{animation:planFloat 5s ease-in-out infinite}
@keyframes planFloat{0%,100%{transform:scale(1.02) translateY(0)}50%{transform:scale(1.02) translateY(-6px)}}
.card,.plan,.step,.t-card,.post-card{will-change:transform}
.btn-ghost:hover{box-shadow:var(--shadow)}

/* ---------- account area (UserPro: login / register / dashboard) ------ */
.up-account{max-width:1000px;margin-inline:auto}
/* turn the harsh red instruction line into a clean info banner (scoped, no misfire) */
.up-account .prose p:has(span[style*="ff0000"]),.up-account .prose p:has(span[style*="#ff0000"]){
  background:var(--grad-soft);border:1px solid var(--line);border-radius:14px;padding:15px 22px;max-width:760px;margin:0 auto 26px;text-align:center}
.up-account .prose span[style*="ff0000"]{color:var(--ink)!important;font-size:1rem!important;font-weight:600!important}
.userpro{max-width:540px!important;margin:0 auto!important;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg)!important;box-shadow:var(--shadow);overflow:hidden;font-family:inherit!important;float:none!important}
.userpro-head{background:var(--grad)!important;padding:18px 24px!important;border:0!important}
.userpro-head,.userpro-head *{color:#fff!important}
.userpro-head a{opacity:.92;text-decoration:underline}
.userpro-body{padding:26px 24px!important}
.userpro-field{margin-bottom:16px!important}
.userpro-label,.userpro label{font-weight:600!important;color:var(--ink)!important;margin-bottom:6px!important}
.userpro-input,.userpro input[type=text],.userpro input[type=email],.userpro input[type=password],.userpro input[type=tel],.userpro textarea,.userpro select{
  width:100%!important;border:1.5px solid var(--line)!important;border-radius:var(--r-sm)!important;padding:12px 14px!important;
  font-family:inherit!important;font-size:1rem!important;color:var(--ink)!important;background:#fff!important;box-shadow:none!important;transition:border-color .2s,box-shadow .2s!important;
}
.userpro-input:focus,.userpro input:focus,.userpro textarea:focus{border-color:var(--cyan)!important;box-shadow:0 0 0 4px rgba(0,194,229,.15)!important;outline:none!important}
.userpro-field-icon{background:var(--grad-soft)!important;color:var(--blue)!important;border:0!important}
.userpro-field-icon i,.userpro-icon-user,.userpro-icon-lock{color:var(--blue)!important}
/* buttons: submit = gradient primary; links = ghost (e.g. Create an Account) */
.userpro input[type=submit].userpro-button,.userpro button.userpro-button{
  background:var(--grad)!important;background-image:var(--grad)!important;color:#fff!important;border:0!important;border-radius:var(--r-pill)!important;
  font-weight:700!important;font-family:inherit!important;padding:12px 30px!important;cursor:pointer;box-shadow:var(--shadow-cyan)!important;text-shadow:none!important;transition:transform .2s,box-shadow .2s!important;
}
.userpro input[type=submit].userpro-button:hover,.userpro button.userpro-button:hover{transform:translateY(-2px)!important}
.userpro a.userpro-button,.userpro .userpro-button.secondary,.userpro input[type=button].userpro-button{
  background:#fff!important;background-image:none!important;color:var(--blue)!important;border:1.5px solid var(--cyan)!important;border-radius:var(--r-pill)!important;
  font-weight:700!important;padding:11px 26px!important;box-shadow:none!important;text-shadow:none!important;
}
.userpro a.userpro-button:hover,.userpro .userpro-button.secondary:hover,.userpro input[type=button].userpro-button:hover{background:var(--grad)!important;background-image:var(--grad)!important;color:#fff!important;border-color:transparent!important}
.userpro-checkbox{accent-color:var(--cyan)}
.up-account .userpro a{color:var(--blue)}
.userpro-menu a:hover,.userpro-tabs a:hover{color:var(--cyan)!important}

/* --- login/register form: compact & organized --- */
.userpro{max-width:480px!important}
.userpro-field-icon{display:none!important}                 /* drop the disconnected floating icons */
.userpro-body{padding:24px 26px 26px!important}
.userpro-field{margin-bottom:14px!important}
.userpro-label{display:block!important;text-align:start!important;font-size:.92rem!important}
.userpro-input,.userpro input[type=text],.userpro input[type=email],.userpro input[type=password]{background:#fafcff!important}
/* "remember me" row — remove the heavy box, make a simple inline row */
.userpro-field-compact .userpro-input{border:0!important;background:transparent!important;box-shadow:none!important;padding:2px 0!important;display:flex!important;align-items:center;gap:8px;flex-direction:row-reverse;justify-content:flex-end}
.userpro-field-compact{margin-bottom:8px!important}
.userpro-checkbox-wrap{display:flex;align-items:center;gap:8px}
/* submit row — balanced buttons, drop empty spacers */
.userpro-social-connect:empty{display:none!important}
.userpro-submit{display:flex!important;flex-wrap:wrap;align-items:center;gap:12px;margin-top:6px!important;border-top:1px solid var(--line);padding-top:18px!important}
.userpro-submit .userpro-button{margin:0!important}
.userpro-submit input[type=submit].userpro-button{padding:13px 40px!important;order:0}
.userpro-submit input[type=button].userpro-button{order:1}

/* --- modern split-panel auth (login / register) --- */
.auth-card{display:grid;grid-template-columns:1fr 1.05fr;max-width:940px;margin-inline:auto;background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-lg);animation:authIn .65s cubic-bezier(.2,.8,.3,1) both}
@keyframes authIn{from{opacity:0;transform:translateY(26px) scale(.98)}to{opacity:1;transform:none}}
.auth-aside{position:relative;background:linear-gradient(160deg,#1f6fd6 0%,#1656ac 52%,#0b1f3a 100%);color:#fff;padding:44px 36px;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.auth-aside::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 0,rgba(0,194,229,.28),transparent 50%);pointer-events:none}
.auth-aside .orb{position:absolute;width:240px;height:240px;border-radius:50%;background:rgba(0,194,229,.30);filter:blur(46px);top:-70px;inset-inline-start:-50px;animation:float1 9s ease-in-out infinite}
.auth-aside>*{position:relative;z-index:1}
.auth-aside .auth-logo{width:155px!important;height:auto!important;max-width:62%;align-self:flex-start;object-fit:contain;margin-bottom:24px;filter:drop-shadow(0 3px 10px rgba(0,0,0,.22))}
.auth-aside h2{color:#fff;font-size:1.55rem;margin-bottom:12px}
.auth-aside p{color:rgba(255,255,255,.92);font-size:.98rem;line-height:1.9}
.auth-aside p strong{color:#eafcff}
.auth-benefits{display:grid;gap:13px;margin-top:22px}
.auth-benefits li{display:flex;align-items:center;gap:10px;color:#fff;font-size:.95rem}
.auth-benefits li svg{flex:none;width:22px;height:22px;color:#fff;background:rgba(255,255,255,.18);border-radius:50%;padding:4px}
.auth-form{padding:40px 36px;display:flex;flex-direction:column;justify-content:center}
.auth-form .userpro{max-width:none!important;box-shadow:none!important;border:0!important;margin:0!important;background:transparent!important;overflow:visible!important}
.auth-form .userpro-body{padding:0!important;overflow:visible!important}
.auth-form .userpro-head{background:transparent!important;padding:2px 6px 14px!important;border-bottom:1px solid var(--line)!important;margin-bottom:22px!important;overflow:visible!important;line-height:1.9}
.auth-form .userpro-head>*{overflow:visible!important}
.auth-form .userpro-head,.auth-form .userpro-head *{color:var(--ink)!important}
.auth-form .userpro-head a{color:var(--blue)!important;font-size:.85rem;text-decoration:none}
.auth-form .userpro-head a:hover{color:var(--cyan)!important}
.userpro-close-popup{display:none!important}
/* balanced auth buttons (equal width, no underline) */
.auth-form .userpro-submit{display:flex!important;gap:12px;border-top:1px solid var(--line);padding-top:20px!important;margin-top:8px}
.auth-form .userpro-submit .userpro-social-connect,.auth-form .userpro-submit .userpro-clear{display:none!important}
.auth-form .userpro-submit input.userpro-button,.auth-form .userpro-submit a.userpro-button{flex:1 1 0!important;min-width:0!important;padding:14px 14px!important;text-align:center!important;text-decoration:none!important;white-space:nowrap;font-size:1rem!important;margin:0!important;-webkit-appearance:none!important;appearance:none!important;border-radius:var(--r-pill)!important;line-height:1.2!important}
/* secondary = clean soft solid button (not a thin link-like outline) */
.auth-form .userpro-submit input[type=button].userpro-button,.auth-form .userpro-submit input.secondary{background:var(--bg-soft)!important;background-image:none!important;border:1px solid var(--line)!important;color:var(--blue)!important;box-shadow:none!important}
.auth-form .userpro-submit input[type=button].userpro-button:hover,.auth-form .userpro-submit input.secondary:hover{background:var(--grad-soft)!important;border-color:var(--cyan)!important;color:var(--blue)!important;transform:translateY(-1px)}
.auth-switch{margin-top:20px;text-align:center;color:var(--muted);font-size:.92rem;border-top:1px solid var(--line);padding-top:18px}
.auth-switch a{color:var(--blue);font-weight:700}
.auth-switch a:hover{color:var(--cyan)}

/* register form: tame the grey collapsible section header + hide optional fields */
.auth-form .userpro-section{background:var(--grad-soft)!important;border:1px solid var(--line)!important;border-radius:var(--r-sm)!important;font-weight:700!important;padding:10px 14px!important;margin-bottom:16px!important}
.auth-form .userpro-section,.auth-form .userpro-section>*{color:var(--ink)!important}
.auth-form .userpro-section.userpro-collapsed-1{display:none!important}  /* optional: profile pic / gender / country */
.auth-form .userpro-field-hint,.auth-form .userpro-icon-info{color:var(--faint)!important}

/* exact red Canadian maple leaf beside the GCMS (نوت کانادا) menu item — with breathing room */
.menu-maple>a{gap:9px}
.menu-maple>a::before{
  content:"";display:inline-block;width:16px;height:16px;flex:none;
  background:url("../img/maple.svg") no-repeat center/contain;
}
/* GCMS note-request button — red maple leaf before the label */
.btn-note{gap:8px}
.btn-note::before{
  content:"";display:inline-block;width:17px;height:17px;flex:none;
  background:url("../img/maple.svg") no-repeat center/contain;
}

/* ----------------------------- responsive ----------------------------- */
@media (max-width:1024px){
  :root{--header-h:96px} /* topbar hidden, navbar only */
  .topbar{display:none}
  .nav-wrap{display:none}
  .nav-toggle{display:flex}
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .hero-card-wrap{max-width:520px}
  .feature-row{grid-template-columns:1fr;gap:32px}
  .feature-row.flip .feature-media{order:0}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-5{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .footer-enamad{position:static;margin-top:18px;justify-content:flex-start}
}
@media (max-width:860px){
  .tb-hide-sm{display:none}
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:30px}
  .header-cta .btn-order span,.header-cta .btn-order{font-size:.86rem}
  .contact-grid{grid-template-columns:1fr;gap:28px}
  .auth-card{grid-template-columns:1fr;max-width:480px}
  .auth-aside{padding:30px 28px}
  .auth-form{padding:30px 28px}
}
@media (max-width:680px){
  :root{--header-h:66px} /* topbar hidden on mobile */
  .navbar .container{height:70px}
  .brand .logo,.site-header.scrolled .brand .logo{height:64px}
  .footer-logo{height:78px}
  .header-cta .btn-order{display:none}
  .enamad-float{bottom:14px;left:12px}
  .enamad-float .ef-seal img{max-width:60px}
  .chaty-widget.right-position{bottom:78px!important}
  .go-top{bottom:20px;right:20px;width:44px;height:44px}
  .gt-ring{width:44px;height:44px}
  .gt-arrow{margin:12px auto}
  .grid-2,.grid-3,.grid-4,.grid-5{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .hero{padding-bottom:72px}
  .hero-actions .btn{flex:1}
  .float-badge{display:none}
  .domain-box{flex-direction:column;border-radius:var(--r-lg);background:#fff;padding:14px}
  .domain-box input{padding:10px 14px}
  .footer-bottom{justify-content:center;text-align:center}
  .footer-watermark{display:none}
}

/* ===================== FIFA World Cup 2026 festive banner ===================== */
:root{--wc-h:0px}

/* logged-in WordPress admin bar: push the fixed banner + header below it so the top isn't hidden */
body.admin-bar .site-header{top:32px}
body.admin-bar .scroll-progress{top:32px}
@media screen and (min-width:601px) and (max-width:782px){
  body.admin-bar .site-header{top:46px}
}

/* animated stage: shimmering «جام جهانی ۲۰۲۶» wordmark + a football dribbling across a mini pitch */
/* host-country flags (real SVGs) waving in a staggered ripple */
/* (removed: .hero-champ — the hero champion pill was dropped from front-page.php) */
/* domain «فروش ویژه» deal cards */
.card.is-special{position:relative;border:2px solid #ffd0bf;box-shadow:0 12px 30px rgba(226,84,40,.15)}
.card.is-special:hover{border-color:#ff7a3d;transform:translateY(-4px)}
.card.is-special .tld{display:block}
.tld-sale{display:block;width:-moz-fit-content;width:fit-content;margin:0 auto 10px;background:linear-gradient(90deg,#e2362f,#ff6a3d);color:#fff;
  font-weight:800;font-size:.7rem;letter-spacing:.3px;padding:3px 13px;border-radius:999px;
  box-shadow:0 3px 9px rgba(226,54,47,.32)}
.is-special .tld-price{display:flex;flex-direction:column;align-items:center;gap:1px;margin-top:2px}
.tld-now{font-weight:800;color:var(--ink);font-size:1.18rem;line-height:1.3}
.tld-now small{font-size:.72rem;color:var(--faint);font-weight:600}
.tld-was{text-decoration:line-through;color:var(--faint);font-size:.82rem;font-weight:600}
.tld-pct{display:inline-block;margin-top:8px;background:rgba(226,54,47,.1);color:#c92f28;
  font-weight:800;font-size:.74rem;padding:3px 11px;border-radius:999px}
/* inline «فروش ویژه» tag on sale TLDs inside the main price grid */
.tld-sale-sm{font-size:.62rem;padding:2px 10px;margin:0 auto 8px}
.card.has-sale{border-color:#ffd0bf}
.card.has-sale:hover{border-color:#ff8a3d}
/* renew/transfer tabs: the register-only promo styling is neutralized */
#tldGrid.hide-sale .card.has-sale,#tldGrid.hide-sale .card.has-sale:hover{border-color:var(--line)}
.tld-sale-info{display:flex;flex-direction:column;align-items:center;gap:3px;margin-top:5px}
.tld-sale-info .tld-pct{margin-top:2px}
/* stadium spotlight sweeping across the bar */
/* «LIVE / در حال برگزاری» pulsing badge */
/* live countdown to the final */
/* goal net + flash at the end of the dribble */


/* billing toggle + free-.ir gift band (pricing sections) */
.gift-band{display:flex;align-items:center;justify-content:center;gap:8px;width:-moz-fit-content;width:fit-content;margin:0 auto 14px;background:#fff;border:1px solid #e5ecf5;border-radius:999px;padding:10px 22px;font-weight:700;color:var(--ink);box-shadow:0 10px 24px -18px rgba(11,31,58,.4)}
.gift-band .ir-chip{background:linear-gradient(90deg,#e2362f,#ff6a3d);color:#fff;border-radius:999px;padding:3px 13px;font-weight:800;direction:rtl;unicode-bidi:isolate}
.bill-toggle{display:flex;gap:6px;width:-moz-fit-content;width:fit-content;margin:0 auto 28px;background:#eef4fb;border-radius:999px;padding:5px}
.bill-toggle button{border:0;background:transparent;padding:9px 28px;border-radius:999px;font-weight:800;font-size:.95rem;color:#5a6c86;cursor:pointer;font-family:inherit;transition:all .2s}
.bill-toggle button.on{background:linear-gradient(90deg,#00c2e5,#1f6fd6);color:#fff;box-shadow:0 8px 18px -8px rgba(0,150,200,.5)}

/* per-cycle discount chip on plan cards */
.plan{position:relative}
.plan .disc-chip{display:inline-block;margin:0 0 10px;background:#fdecec;color:#d63031;font-weight:800;font-size:.72rem;padding:4px 12px;border-radius:999px;line-height:1.6}

/* crossed-out monthly price above the per-month equivalent (yearly/3y views) */
.plan .price-was{display:block;text-align:center;color:#9aa7b8;text-decoration:line-through;font-weight:700;font-size:.88rem;margin-bottom:2px}
/* billing subline: one tidy line */
.plan .p-period{font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ═══════════ REDESIGN v2 — MOBILE LAYER ═══════════ */
@media (max-width: 680px){
  /* gift band: wraps cleanly, centered, never overflows */
  .gift-band{flex-wrap:wrap;max-width:calc(100% - 24px);text-align:center;font-size:.86rem;padding:10px 16px;line-height:2;row-gap:2px}
  .gift-band .ir-chip{padding:2px 11px;font-size:.82rem}
  /* billing toggle: full-width segmented control */
  .bill-toggle{width:calc(100% - 24px);max-width:340px}
  .bill-toggle button{flex:1;padding:9px 8px;font-size:.85rem}
  /* plan cards breathing room */
  .plan{padding-inline:18px}
  .plan .p-period{white-space:normal;font-size:.8rem}
  .plan .price .num{font-size:1.9rem}
  /* section rhythm tighter on phones */
  .section{padding-block:44px}
  .section-head h2{font-size:1.45rem}
  /* domain search hero pieces stack */
  .domain-box{flex-wrap:wrap}
  .domain-box .btn{width:100%;justify-content:center}
  .tld-row{gap:8px;font-size:.8rem;justify-content:center;flex-wrap:wrap}
  /* top-domains + specials grids: 2-up */
  #top-domains .grid-4{grid-template-columns:repeat(2,1fr);gap:12px}
  #top-domains .card{padding:16px 10px}
  /* tables/pricing never cause horizontal scroll */
  body{overflow-x:hidden}
}
@media (max-width: 400px){
  .bill-toggle button{font-size:.8rem;padding:8px 4px}
  .gift-band{font-size:.8rem}
}

/* ═══════════ REDESIGN v2 — ENERGY LAYER ═══════════ */
:root{--grad-hot:linear-gradient(120deg,#00d4f0 0%,#2f7ef6 55%,#7b5cf0 100%);}
/* eyebrows -> gradient pills */
.section-head .eyebrow{display:inline-block;background:linear-gradient(120deg,rgba(0,212,240,.14),rgba(123,92,240,.14));color:#1f6fd6;border:1px solid rgba(47,126,246,.18);border-radius:999px;padding:6px 18px;font-weight:800;}
/* primary buttons: hot gradient + sheen sweep */
.btn-primary{background:var(--grad-hot) !important;position:relative;overflow:hidden;}
@media (prefers-reduced-motion: no-preference){
  .btn-primary::after{content:"";position:absolute;top:0;bottom:0;width:44%;left:-60%;transform:skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transition:left .6s ease;}
  .btn-primary:hover::after{left:130%;}
  /* cards & plans: lift + gradient ring on hover */
  .card,.plan{transition:transform .28s ease,box-shadow .28s ease;}
  .card:hover,.plan:hover{transform:translateY(-6px);box-shadow:0 26px 52px -26px rgba(47,126,246,.4);}
  .plan.featured:hover{transform:translateY(-8px);}
  /* hero orbs: more color, gentle drift */
  @keyframes orbDrift{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(14px,-18px) scale(1.06);}}
  .orb{opacity:.5;filter:blur(60px);animation:orbDrift 11s ease-in-out infinite;}
  .orb-1{background:radial-gradient(circle,#00d4f0,transparent 70%);}
  .orb-2{background:radial-gradient(circle,#7b5cf0,transparent 70%);animation-delay:-5s;}
}
/* toggles + chips pick up the hot gradient */
.bill-toggle button.on,.eram-search-tabs .est-tab.on{background:var(--grad-hot);}
/* stats band: deep gradient with glow */
.stats-band{background:linear-gradient(135deg,#0b1f3a 0%,#12305e 60%,#251d54 100%);border-radius:26px;}
.stats-band .stat b,.stats-band .num{background:var(--grad-hot);-webkit-background-clip:text;background-clip:text;color:transparent;}
/* section heads: h2 keyword pop */
.section-head h2{letter-spacing:-.3px;}
/* footer link hovers */
footer a:hover,.footer a:hover{color:#00d4f0;}

/* ═══════════ REDESIGN v2.1 — PROFESSIONAL REFINEMENT (overrides energy-layer excess) ═══════════ */
/* buttons: no sweep gimmick — calm, precise, confident */
.btn-primary::after{content:none !important;}
.btn{border-radius:12px;font-weight:700;letter-spacing:.1px;transition:box-shadow .22s ease,transform .22s ease,background-color .22s ease,border-color .22s ease;}
.btn-primary{box-shadow:0 6px 16px -8px rgba(47,126,246,.45);}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 12px 26px -10px rgba(47,126,246,.55);filter:saturate(1.06);}
.btn-primary:active{transform:translateY(0);box-shadow:0 4px 12px -6px rgba(47,126,246,.5);}
.btn-ghost{border:1.6px solid rgba(47,126,246,.35);color:#1f6fd6;background:transparent;}
.btn-ghost:hover{background:rgba(47,126,246,.07);border-color:#2f7ef6;transform:translateY(-1px);}
.btn:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(0,212,240,.35);}
/* eyebrows: refined label + short gradient rule, no pill box */
.section-head .eyebrow{background:none;border:0;padding:0 0 12px;color:#2f7ef6;font-weight:800;font-size:.86rem;letter-spacing:1px;position:relative;}
.section-head .eyebrow::before{content:none !important;}
.section-head .eyebrow::after{content:"";position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:34px;height:3px;border-radius:3px;background:var(--grad-hot);}
/* card hover: composed, not bouncy */
.card:hover,.plan:hover{transform:translateY(-3px);box-shadow:0 18px 40px -24px rgba(31,64,112,.35);}
.plan.featured:hover{transform:translateY(-4px);}