/*
Theme Name: AfaghCloud
Theme URI: https://afaghcloud.com/
Author: Global Web (گلوبال وب)
Author URI: https://globalweb.example/
Description: Modern RTL/Persian WordPress theme for the AfaghCloud (ابر آفاق) hosting website.
Version: 5.10.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: afaghcloud
Designed & developed by: Global Web (گلوبال وب) — این قالب توسط گلوبال وب طراحی و اجرا شده است.
Tags: rtl-language-support, blog, custom-menu, featured-images, threaded-comments, translation-ready, full-width-template
*/

/* Theme header + WordPress helper classes.
   Component styles live in assets/afagh-ds.css and assets/style.css. */

/* Minimal helpers for dynamic WP bits that reuse the original look. */
.afagh-pagination { margin-top: 2.5rem; }
.afagh-pagination .page-numbers {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 2.5rem; height: 2.5rem; padding: 0 .5rem; margin: 0 .15rem;
    border-radius: .75rem; background: rgba(15,23,42,.5);
    border: 1px solid #1e293b; color: #cbd5e1; font-weight: 700;
    text-decoration: none; transition: all .2s ease;
}
.afagh-pagination .page-numbers:hover,
.afagh-pagination .page-numbers.current { background: #2563eb; color: #fff; border-color: #2563eb; }

/* WordPress core helper classes (alignment / captions / screen-reader). */
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.alignleft  { float: left;  margin: 0 1.5rem 1rem 0; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: .8rem; opacity: .8; text-align: center; }
.sticky, .gallery-caption, .bypostauthor { }
.screen-reader-text {
    border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
    height: 1px; width: 1px; margin: -1px; overflow: hidden;
    padding: 0; position: absolute !important; word-wrap: normal !important;
}
.screen-reader-text:focus {
    background-color: #eee; clip: auto !important; clip-path: none;
    color: #444; display: block; font-size: 1em; height: auto;
    left: 5px; line-height: normal; padding: 15px 23px 14px;
    text-decoration: none; top: 5px; width: auto; z-index: 100000;
}

/* Comparison tables & pricing helpers. */

/* Comparison tables: continuous, consistently-rounded recommended column.
 * Works with border-separate + border-spacing-0 so side borders join cleanly. */
.afagh-cmp{ border-collapse:separate; border-spacing:0; }
.afagh-cmp .afagh-rec{
	background:rgba(37,99,235,.08);
	border-left:2px solid rgba(37,99,235,.55);
	border-right:2px solid rgba(37,99,235,.55);
}
.afagh-cmp thead .afagh-rec{
	border-top:2px solid rgba(37,99,235,.85);
	border-top-left-radius:18px;
	border-top-right-radius:18px;
}
.afagh-cmp tbody tr:last-child .afagh-rec{
	border-bottom:2px solid rgba(37,99,235,.85);
	border-bottom-left-radius:18px;
	border-bottom-right-radius:18px;
}

/* Premium scrollbar for the horizontally-scrolling tables. */
.custom-scrollbar{ scrollbar-width:thin; scrollbar-color:rgba(37,99,235,.5) transparent; }
.custom-scrollbar::-webkit-scrollbar{ height:8px; }
.custom-scrollbar::-webkit-scrollbar-track{ background:rgba(255,255,255,.03); border-radius:8px; }
.custom-scrollbar::-webkit-scrollbar-thumb{
	background:linear-gradient(90deg,#2563eb,#1d4ed8); border-radius:8px;
}

/* Domain extension chips/cells: stronger contrast, no hover required to read. */
.afagh-tld{ color:#fff !important; font-weight:800; }
.afagh-tld-price{ color:#34d399 !important; font-weight:800; }     /* emerald-400 */
.afagh-tld-card{
	background:rgba(15,23,42,.6); border:1px solid rgba(37,99,235,.25);
}
.afagh-tld-card:hover{ border-color:rgba(37,99,235,.7); transform:translateY(-3px); }

/* Pricing emphasis: make yearly-cost figures read as the conversion focus. */
.afagh-price-strong{ color:#fff !important; }
.afagh-price-accent{ color:#60a5fa !important; }                  /* blue-400 */

/* Subtle premium depth on glass cards (additive, safe). */
.price-value, .pricing-value{ transition:opacity .18s ease; }

/* Interaction & focus states. */

html{ scroll-behavior:smooth; }

/* Brand text selection. */
::selection{ background:rgba(37,99,235,.35); color:#fff; }

/* Premium, accessible focus ring on interactive elements. */
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible{
	outline:none;
	box-shadow:0 0 0 3px rgba(37,99,235,.45);
	border-radius:10px;
}

/* Recommended pricing cards: unified premium highlight (matches the markup
 * classes we standardized) - consistent ring + soft glow + lift. */
.ring-1.ring-blue-500\/40,
.ring-1.ring-indigo-500\/40{
	box-shadow:0 18px 50px -12px rgba(79,70,229,.45);
}

/* Comparison recommended band: deliberate, premium, NOT broken corners. */
.afagh-cmp .afagh-rec{
	background:linear-gradient(180deg,rgba(37,99,235,.14),rgba(37,99,235,.06));
	border-left:2px solid rgba(59,130,246,.6);
	border-right:2px solid rgba(59,130,246,.6);
}
.afagh-cmp thead .afagh-rec{
	border-top:2px solid rgba(59,130,246,.8);
	border-top-left-radius:20px; border-top-right-radius:20px;
}
.afagh-cmp tbody tr:last-child .afagh-rec{
	border-bottom:2px solid rgba(59,130,246,.8);
	border-bottom-left-radius:20px; border-bottom-right-radius:20px;
}

/* Domain extension chips: guaranteed legibility regardless of utility cascade. */
.afagh-tld-card{ background:rgba(30,41,59,.7); border:1px solid rgba(37,99,235,.3); color:#e2e8f0; }
.afagh-tld-card:hover{ border-color:rgba(59,130,246,.8); transform:translateY(-3px); transition:all .2s ease; }
.afagh-tld-price{ color:#6ee7b7; font-weight:800; font-size:.95rem; }

/* Skeleton loader & UI components. */




/* ---------- Component-level skeletons (no fullscreen) ---------- */
@keyframes afagh-shimmer{ 0%{ background-position:200% 0; } 100%{ background-position:-200% 0; } }
.afagh-skel > *{ transition:opacity .4s ease; }
body.afagh-loading .afagh-skel > *{ position:relative; }
body.afagh-loading .afagh-skel > * *{ opacity:0 !important; transition:none; }
body.afagh-loading .afagh-skel > *::after{
	content:""; position:absolute; inset:0; z-index:5; border-radius:inherit;
	background:linear-gradient(100deg,#e9eef5 28%,#f4f7fb 50%,#e9eef5 72%);
	background-size:200% 100%; animation:afagh-shimmer 1.5s ease-in-out infinite;
	box-shadow:inset 0 0 0 1px rgba(16,33,71,.04);
}
/* table rows: round the shimmer a touch */
body.afagh-loading tbody.afagh-skel > tr::after{ border-radius:10px; }
@media (prefers-reduced-motion:reduce){
	body.afagh-loading .afagh-skel > *::after{ animation:none; }
}

/* ---------- Notification bar ---------- */
.afagh-notibar{
	position:relative; z-index:60; background:var(--nb-bg,#2563eb); color:var(--nb-fg,#fff);
	display:flex; align-items:center; justify-content:center; gap:14px;
	padding:11px 44px; font-size:14px; font-weight:700; direction:rtl;
	box-shadow:0 2px 14px rgba(0,0,0,.18);
}
.afagh-notibar-in{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; justify-content:center; }
.afagh-notibar-cta{
	background:rgba(255,255,255,.18); color:inherit; padding:5px 16px; border-radius:999px;
	font-weight:800; text-decoration:none; border:1px solid rgba(255,255,255,.35);
	transition:background .18s ease, transform .18s ease;
}
.afagh-notibar-cta:hover{ background:rgba(255,255,255,.30); transform:translateY(-1px); }
.afagh-notibar-x{
	position:absolute; left:14px; top:50%; transform:translateY(-50%);
	background:none; border:none; color:inherit; font-size:22px; line-height:1; cursor:pointer; opacity:.8;
}
.afagh-notibar-x:hover{ opacity:1; }

/* ---------- Popup ---------- */
.afagh-popup{ position:fixed; inset:0; z-index:99995; direction:rtl; }
.afagh-popup[hidden]{ display:none; }
.afagh-popup-backdrop{
	position:absolute; inset:0; background:rgba(2,6,23,.72); backdrop-filter:blur(6px);
	opacity:0; transition:opacity .3s ease;
}
.afagh-popup.is-open .afagh-popup-backdrop{ opacity:1; }
.afagh-popup-card{
	position:relative; width:min(460px,92vw); margin:0 auto; top:50%;
	transform:translateY(-46%) scale(.96); opacity:0;
	transition:transform .32s cubic-bezier(.22,1,.36,1), opacity .32s ease;
	background:#ffffff; border:1px solid #e5e9f1; border-radius:26px;
	box-shadow:0 30px 80px -24px rgba(16,33,71,.30); overflow:hidden;
}
.afagh-popup.is-open .afagh-popup-card{ transform:translateY(-50%) scale(1); opacity:1; }
.afagh-popup-x{
	position:absolute; left:16px; top:14px; z-index:2; width:34px; height:34px; border-radius:50%;
	background:#f1f5f9; border:1px solid #e5e9f1; color:#475569;
	font-size:20px; line-height:1; cursor:pointer; transition:background .18s ease, color .18s ease;
}
.afagh-popup-x:hover{ background:#e2e8f0; color:#0f172a; }
.afagh-popup-media img{ width:100%; height:170px; object-fit:cover; display:block; }
.afagh-popup-body{ padding:26px 26px 28px; text-align:right; }
.afagh-popup-badge{
	display:inline-block; font-size:11px; font-weight:800; padding:5px 14px; border-radius:999px;
	background:#eff6ff; color:#2563eb; margin-bottom:12px;
}
.afagh-popup--promotion .afagh-popup-badge{ background:#ecfdf5; color:#059669; }
.afagh-popup--maintenance .afagh-popup-badge{ background:#fffbeb; color:#b45309; }
.afagh-popup--alert .afagh-popup-badge{ background:#fef2f2; color:#dc2626; }
.afagh-popup--marketing .afagh-popup-badge{ background:#eff6ff; color:#2563eb; }
.afagh-popup-title{ color:#0f172a; font-size:21px; font-weight:800; margin:0 0 10px; }
.afagh-popup-text{ color:#64748b; font-size:14px; line-height:1.9; }
.afagh-popup-btn{
	display:inline-block; margin-top:20px; background:linear-gradient(120deg,#2563eb,#1d4ed8);
	color:#fff; font-weight:800; padding:12px 28px; border-radius:14px; text-decoration:none;
	box-shadow:0 12px 28px -10px rgba(37,99,235,.45); transition:transform .18s ease, box-shadow .18s ease;
}
.afagh-popup-btn:hover{ transform:translateY(-2px); box-shadow:0 18px 36px -12px rgba(37,99,235,.55); }

/* ---------- Premium micro-interactions (safe, additive) ---------- */
.afagh-popup-card, .afagh-notibar{ will-change:transform, opacity; }

/* ============================================================
 * v2.0.0 — AfaghCloud design system (Global Web)
 * Distinctive visual language: tokens, aurora backdrop, premium
 * panels, fluid display type, signature motion. Custom, not template.
 * ============================================================ */
:root{
	--afg-bg:#080d1a;
	--afg-ink:#e6ecf7;
	--afg-blue:#3b82f6;
	--afg-indigo:#3b82f6;
	--afg-violet:#3b82f6;
	--afg-cyan:#3b82f6;
	--afg-radius:26px;
	--afg-elev-1:0 1px 0 rgba(255,255,255,.04) inset, 0 10px 30px -12px rgba(2,6,23,.7);
	--afg-elev-2:0 1px 0 rgba(255,255,255,.06) inset, 0 30px 60px -20px rgba(37,99,235,.35);
}

/* Layered aurora + dot-grid backdrop (the brand signature) */
.afagh-hero-bg{
	position:relative; background:var(--afg-bg);
	background-image:
		radial-gradient(60% 50% at 82% 8%, rgba(59,130,246,.20), transparent 60%),
		radial-gradient(45% 45% at 12% 22%, rgba(59,130,246,.16), transparent 60%),
		radial-gradient(55% 60% at 50% 110%, rgba(34,211,238,.10), transparent 60%);
}
.afagh-hero-bg::before{
	content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
	background-image:
		linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
	background-size:46px 46px;
	-webkit-mask-image:radial-gradient(circle at 50% 30%, #000 0%, transparent 75%);
	mask-image:radial-gradient(circle at 50% 30%, #000 0%, transparent 75%);
}
.afagh-hero-bg::after{
	content:""; position:absolute; top:-30%; right:-10%; width:60%; height:80%;
	pointer-events:none; filter:blur(60px); opacity:.5;
	background:conic-gradient(from 120deg at 50% 50%, rgba(59,130,246,.0), rgba(37,99,235,.35), rgba(34,211,238,.0));
	animation:afg-drift 16s ease-in-out infinite alternate;
}
@keyframes afg-drift{ 0%{ transform:translate(0,0) rotate(0deg); } 100%{ transform:translate(-4%,4%) rotate(12deg); } }

/* Eyebrow / kicker */
.afagh-kicker{
	display:inline-flex; align-items:center; gap:9px; padding:7px 16px; border-radius:999px;
	font-size:12.5px; font-weight:800; letter-spacing:.2px; color:#c7d2fe;
	background:linear-gradient(120deg, rgba(37,99,235,.16), rgba(34,211,238,.10));
	border:1px solid rgba(59,130,246,.28); box-shadow:var(--afg-elev-1);
}
.afagh-kicker .dot{ width:8px; height:8px; border-radius:50%; background:#34d399; box-shadow:0 0 0 4px rgba(52,211,153,.18); animation:afg-pulse 2s ease-in-out infinite; }
@keyframes afg-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.45; } }

/* Fluid display heading + gradient keyword */
.afagh-display{ font-weight:900; line-height:1.12; letter-spacing:-.01em; font-size:clamp(2.4rem,5.2vw,4.6rem); }
.afagh-grad-key{
	background:linear-gradient(100deg,#60a5fa 0%,#60a5fa 45%,#3b82f6 100%);
	-webkit-background-clip:text; background-clip:text; color:transparent;
}

/* Premium glass panel (hero infrastructure visual) */
.afagh-panel{
	position:relative; border-radius:var(--afg-radius); padding:22px;
	background:linear-gradient(180deg, rgba(20,29,51,.92), rgba(12,18,34,.92));
	border:1px solid rgba(255,255,255,.08); box-shadow:var(--afg-elev-2);
	backdrop-filter:blur(12px);
}
.afagh-panel::before{
	content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
	background:linear-gradient(140deg, rgba(37,99,235,.5), transparent 40%, transparent 60%, rgba(34,211,238,.4));
	-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite:xor; mask-composite:exclude;
}
.afagh-metric{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; }
.afagh-bar{ height:8px; border-radius:999px; background:rgba(255,255,255,.06); overflow:hidden; flex:1; }
.afagh-bar > span{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,#3b82f6,#3b82f6); width:0; animation:afg-grow 1.6s cubic-bezier(.22,1,.36,1) forwards; }
@keyframes afg-grow{ to{ width:var(--w,70%); } }
.afagh-float{ animation:afg-float 6s ease-in-out infinite; }
@keyframes afg-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-10px); } }

/* Trust strip */
.afagh-trust-strip{ display:flex; flex-wrap:wrap; gap:10px 22px; color:#94a3b8; font-size:13px; font-weight:600; }
.afagh-trust-strip b{ color:#e2e8f0; font-weight:800; }

/* Premium CTA sheen */
.afagh-cta{ position:relative; overflow:hidden; }
.afagh-cta::after{
	content:""; position:absolute; top:0; left:-120%; width:60%; height:100%; transform:skewX(-20deg);
	background:linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
	transition:left .6s ease;
}
.afagh-cta:hover::after{ left:140%; }

@media (prefers-reduced-motion:reduce){
	.afagh-hero-bg::after,.afagh-kicker .dot,.afagh-bar>span,.afagh-float{ animation:none; }
}

/* ---------- v2.0 section system (applied across homepage) ---------- */
.afagh-sec-bg{
	position:relative; background:#0a1120;
	background-image:
		radial-gradient(48% 55% at 86% 0%, rgba(59,130,246,.10), transparent 60%),
		radial-gradient(42% 48% at 8% 100%, rgba(59,130,246,.09), transparent 60%);
}
.afagh-sec-head{ max-width:46rem; }
.afagh-sec-head .afagh-display{ font-size:clamp(1.9rem,3.6vw,3rem); }
/* premium card elevation (opt-in via .afagh-card) */
.afagh-card{ transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, border-color .35s ease; }
.afagh-card:hover{ transform:translateY(-6px); box-shadow:0 26px 50px -22px rgba(37,99,235,.45); }
/* bento feature card */
.afagh-bento-feature{ position:relative; overflow:hidden; }
.afagh-bento-feature::after{
	content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
	background:radial-gradient(60% 80% at 90% 0%, rgba(59,130,246,.18), transparent 60%);
}

/* ============================================================
 * v3.0.0 — AfaghCloud Design System 2.0 (Light-First Hybrid)
 * Bright & premium overall; dark used strategically (hero / infra
 * showcase / stats). New visual identity — Global Web.
 * ============================================================ */
:root{
	--afg-l-bg:#eef3fb;          /* page light base */
	--afg-l-surface:#ffffff;     /* cards */
	--afg-l-ink:#0b1733;         /* primary text */
	--afg-l-muted:#5a6b8c;       /* secondary text */
	--afg-l-line:#e3e9f4;        /* hairlines */
	--afg-brand:#2563eb;
	--afg-brand-2:#3b82f6;
	--afg-accent:#2563eb;
	--afg-l-shadow:0 1px 2px rgba(16,33,71,.04), 0 18px 40px -24px rgba(37,99,235,.30);
}

/* ---- Light hero (bright, subtle aurora + grid, NOT flat) ---- */
.afagh-hero-light{
	position:relative; color:var(--afg-l-ink);
	background:
		radial-gradient(60% 60% at 88% 6%, rgba(37,99,235,.12), transparent 60%),
		radial-gradient(46% 50% at 6% 18%, rgba(37,99,235,.10), transparent 60%),
		linear-gradient(180deg,#f3f7ff 0%,#eaf1fb 100%);
}
.afagh-hero-light::before{
	content:""; position:absolute; inset:0; pointer-events:none; opacity:.6;
	background-image:
		linear-gradient(rgba(37,99,235,.06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(37,99,235,.06) 1px, transparent 1px);
	background-size:42px 42px;
	-webkit-mask-image:radial-gradient(circle at 70% 35%, #000, transparent 72%);
	mask-image:radial-gradient(circle at 70% 35%, #000, transparent 72%);
}

/* ---- Light section skin: add .afagh-light to flip a dark section ---- */
.afagh-light{ background:var(--afg-l-bg); color:var(--afg-l-ink); }
.afagh-light .text-white{ color:var(--afg-l-ink); }
.afagh-light .text-slate-300{ color:#3a4a68; }
.afagh-light .text-slate-400{ color:var(--afg-l-muted); }
.afagh-light .text-slate-200{ color:#3a4a68; }
.afagh-light [class*="bg-slate-900"],
.afagh-light [class*="bg-slate-800"],
.afagh-light [class*="bg-white/[0.0"]{ background-color:var(--afg-l-surface) !important; }
.afagh-light [class*="border-slate-800"],
.afagh-light [class*="border-slate-700"],
.afagh-light [class*="border-white/"]{ border-color:var(--afg-l-line) !important; }
.afagh-light [class*="backdrop-blur"]{ -webkit-backdrop-filter:none; backdrop-filter:none; }
/* premium light card look for the glass cards inside a light section */
.afagh-light .afagh-card,
.afagh-light [class*="rounded-[2"]{ box-shadow:var(--afg-l-shadow); }

/* ---- Premium light surface + bento ---- */
.afagh-surface{ background:var(--afg-l-surface); border:1px solid var(--afg-l-line); border-radius:24px; box-shadow:var(--afg-l-shadow); }
.afagh-bento{ display:grid; grid-template-columns:repeat(6,1fr); gap:18px; }
.afagh-bento > *{ grid-column:span 2; }
.afagh-bento > .b-wide{ grid-column:span 4; }
.afagh-bento > .b-tall{ grid-row:span 2; }
.afagh-bento > .b-full{ grid-column:span 6; }
@media (max-width:900px){ .afagh-bento{ grid-template-columns:1fr 1fr; } .afagh-bento > *,.afagh-bento > .b-wide,.afagh-bento > .b-full{ grid-column:span 2; } }
@media (max-width:560px){ .afagh-bento{ grid-template-columns:1fr; } .afagh-bento > *{ grid-column:span 1; } }

/* ---- Strategic dark showcase (stats / infra) ---- */
.afagh-dark-showcase{
	position:relative; color:#e8eefc; background:#0a1124;
	background-image:
		radial-gradient(50% 60% at 85% 0%, rgba(37,99,235,.25), transparent 60%),
		radial-gradient(45% 50% at 8% 100%, rgba(37,99,235,.2), transparent 60%);
}

/* ---- Datacenter network-topology visual (hero accent) ---- */
.afg-topo .node{ transform-box:fill-box; transform-origin:center; animation:afg-nodepulse 3s ease-in-out infinite; }
.afg-topo .node:nth-child(2){ animation-delay:.4s } .afg-topo .node:nth-child(3){ animation-delay:.8s }
.afg-topo .node:nth-child(4){ animation-delay:1.2s } .afg-topo .node:nth-child(5){ animation-delay:1.6s }
@keyframes afg-nodepulse{ 0%,100%{ opacity:.55 } 50%{ opacity:1 } }
.afg-topo .link{ stroke-dasharray:5 7; animation:afg-flow 1.6s linear infinite; }
@keyframes afg-flow{ to{ stroke-dashoffset:-24 } }

/* ---- Premium scroll-reveal motion ---- */
.afagh-reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); will-change:opacity,transform; }
.afagh-reveal.is-visible{ opacity:1; transform:none; }
.afagh-reveal.d1{ transition-delay:.08s } .afagh-reveal.d2{ transition-delay:.16s } .afagh-reveal.d3{ transition-delay:.24s } .afagh-reveal.d4{ transition-delay:.32s }
@media (prefers-reduced-motion:reduce){ .afagh-reveal{ opacity:1 !important; transform:none !important; } .afg-topo .node,.afg-topo .link{ animation:none } }

/* trust strip + tld price inside the light hero */
.afagh-hero-light .afagh-trust-strip{ color:var(--afg-l-muted); }
.afagh-hero-light .afagh-trust-strip b{ color:var(--afg-l-ink); }
.afagh-hero-light .afagh-trust-strip .text-slate-700{ color:#cbd5e1; }

/* light-section contrast variants */
.afagh-light .afagh-kicker{ color:#1e40af; background:#fff; border-color:#dfe3f3; box-shadow:0 1px 2px rgba(16,33,71,.05); }
.afagh-light .afagh-grad-key{ background:linear-gradient(100deg,#2563eb 0%,#3b82f6 55%,#1d4ed8 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.afagh-light .text-blue-400{ color:#2563eb; } .afagh-light .text-purple-400{ color:#2563eb; }
.afagh-light .text-amber-400{ color:#d97706; } .afagh-light .text-cyan-400{ color:#1d4ed8; }
.afagh-light .text-emerald-400,.afagh-light .text-green-400{ color:#059669; } .afagh-light .text-rose-400{ color:#e11d48; }
.afagh-light .text-slate-500{ color:#64748b; } .afagh-light .text-slate-600{ color:#475569; }
/* bento helpers */
.afagh-bento > .b-half{ grid-column:span 3; }
@media (max-width:900px){ .afagh-bento > .b-half{ grid-column:span 2; } }
@media (max-width:560px){ .afagh-bento > .b-half{ grid-column:span 1; } }
.afagh-bento > .b-full.afagh-card{ display:flex; align-items:center; gap:1.75rem; flex-wrap:wrap; }
.afagh-bento > .b-full.afagh-card > div:first-child,
.afagh-bento > .b-full.afagh-card > h3,
.afagh-bento > .b-full.afagh-card > p{ margin-bottom:0; }
.afagh-bento > .b-full.afagh-card > h3{ flex:0 0 auto; }
.afagh-bento > .b-full.afagh-card > p{ flex:1 1 340px; }

/* Preserve white text ONLY on SOLID colored fills inside light sections
   (~= matches exact tokens, so translucent bg-blue-600/20 cards are NOT caught) */
.afagh-light [class~="bg-blue-500"].text-white,
.afagh-light [class~="bg-blue-600"].text-white,
.afagh-light [class~="bg-blue-700"].text-white,
.afagh-light [class~="bg-indigo-500"].text-white,
.afagh-light [class~="bg-indigo-600"].text-white,
.afagh-light [class~="bg-gradient-to-tr"].text-white,
.afagh-light [class~="bg-blue-500"] .text-white,
.afagh-light [class~="bg-blue-600"] .text-white,
.afagh-light [class~="bg-gradient-to-tr"] .text-white{ color:#fff !important; }

/* ---- v3.0.0 Bento tiles: variety + strategic dark accent ---- */
.afagh-tile{ background:var(--afg-l-surface); border:1px solid var(--afg-l-line); border-radius:28px; box-shadow:var(--afg-l-shadow); transition:transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s, border-color .4s; }
.afagh-tile:hover{ transform:translateY(-6px); box-shadow:0 28px 60px -28px rgba(37,99,235,.4); }
/* strategic dark tile INSIDE a light section (skin must not flip it) */
.afagh-light .afagh-tile-dark, .afagh-tile-dark{
	background:linear-gradient(155deg,#0d1730 0%,#101c3a 100%) !important;
	border:1px solid rgba(255,255,255,.08) !important; border-radius:28px;
	box-shadow:0 28px 60px -30px rgba(8,15,40,.9); position:relative; overflow:hidden;
}
.afagh-tile-dark::after{ content:""; position:absolute; inset:0; background:radial-gradient(60% 80% at 80% 0%, rgba(37,99,235,.35), transparent 60%); pointer-events:none; }
.afagh-light .afagh-tile-dark h3, .afagh-light .afagh-tile-dark .t-ink{ color:#fff !important; }
.afagh-light .afagh-tile-dark p, .afagh-light .afagh-tile-dark .t-mut{ color:#9fb2d4 !important; }
.afagh-light .afagh-tile-dark [class*="border-slate-800"]{ border-color:rgba(255,255,255,.1) !important; }
/* feature tile inner metric band */
.afagh-feat-band{ display:flex; gap:14px; flex-wrap:wrap; margin-top:22px; }
.afagh-feat-band .m{ flex:1; min-width:96px; background:linear-gradient(180deg,#f4f8ff,#eaf1fc); border:1px solid var(--afg-l-line); border-radius:18px; padding:14px 16px; }
.afagh-feat-band .m b{ display:block; font-size:1.55rem; font-weight:900; color:var(--afg-brand); line-height:1; }
.afagh-feat-band .m span{ font-size:.72rem; color:var(--afg-l-muted); }

/* ---- v3.0.0 Featured pricing plan = strategic dark card on light row ---- */
.afagh-light .afagh-price-feature{
	background:linear-gradient(160deg,#0d1934 0%,#101e40 100%) !important;
	border-color:rgba(96,165,250,.45) !important;
	box-shadow:0 34px 70px -30px rgba(13,25,52,.85);
}
.afagh-light .afagh-price-feature::before{ content:""; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(70% 60% at 50% 0%, rgba(37,99,235,.35), transparent 65%); pointer-events:none; }
.afagh-light .afagh-price-feature > *{ position:relative; z-index:1; }
.afagh-light .afagh-price-feature .text-white{ color:#fff !important; }
.afagh-light .afagh-price-feature .text-blue-400{ color:#93c5fd !important; }
.afagh-light .afagh-price-feature [class*="text-slate-200"]{ color:#d3def4 !important; }
.afagh-light .afagh-price-feature [class*="bg-blue-500/10"]{ background:rgba(59,130,246,.16) !important; }
.afagh-light .afagh-price-feature [class*="border-blue-400"]{ border-color:rgba(96,165,250,.3) !important; }

/* light-section: darken weak blue secondary text (feature dark card keeps its own override) */
.afagh-light .text-blue-400{ color:#2563eb; }

/* neutral-dark BUTTONS in light sections -> visible brand fill (scoped to a/button
   so bg-slate cards stay white surfaces) */
.afagh-light a[class~="bg-slate-800"], .afagh-light button[class~="bg-slate-800"],
.afagh-light a[class~="bg-slate-900"], .afagh-light button[class~="bg-slate-900"]{
	background:var(--afg-brand) !important; color:#fff !important; border-color:transparent !important;
}
.afagh-light a[class~="bg-slate-800"]:hover, .afagh-light button[class~="bg-slate-800"]:hover{ background:#1d4ed8 !important; }

/* ============================================================
 * v3.1.0 — Clean Technical pass (Cloudflare/Hetzner/DO/Vultr feel)
 * Restraint over effects: no aurora, minimal glow, flat bordered
 * cards, solid accents, calm motion. Content & hierarchy first.
 * These rules come last and intentionally override the v3.0 effects.
 * ============================================================ */

/* hero: calm, near-flat light — no aurora, no grid mask */
.afagh-hero-light{ background:#fbfcfe; }
.afagh-hero-light::before{ display:none !important; }

/* flatten surfaces: hairline borders, whisper shadow, sane radius */
:root{ --afg-l-line:#e5e9f1; }
.afagh-surface{ border-radius:14px; box-shadow:0 1px 2px rgba(16,33,71,.05); }

/* tame oversized pill radii + remove colored glows inside light sections */
.afagh-light [class*="rounded-[2.5rem]"],
.afagh-light [class*="rounded-[2rem]"],
.afagh-light [class*="rounded-[1.7"],
.afagh-light [class*="rounded-[1.6"]{ border-radius:16px !important; }
.afagh-light [class*="shadow-[0_20px_40px"],
.afagh-light [class*="shadow-[0_20px_50px"],
.afagh-light [class*="shadow-2xl"],
.afagh-light [class*="shadow-xl"],
.afagh-light [class*="shadow-blue-"],
.afagh-light [class*="shadow-blue-900"]{ box-shadow:0 1px 2px rgba(16,33,71,.05) !important; }
.afagh-light .afagh-card{ box-shadow:0 1px 2px rgba(16,33,71,.05); border-color:var(--afg-l-line); transition:box-shadow .2s ease, border-color .2s ease; }
.afagh-light .afagh-card:hover{ box-shadow:0 6px 18px rgba(16,33,71,.08); transform:none !important; border-color:#cfd8e8; }
/* kill backdrop blur (glassmorphism) site-wide in light context */
.afagh-light [class*="backdrop-blur"]{ -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }

/* solid accent headings — drop gradient-text trend everywhere */
.afagh-grad-key{ background:none !important; -webkit-background-clip:border-box !important; background-clip:border-box !important; color:#2563eb !important; -webkit-text-fill-color:#2563eb !important; }

/* simpler kicker: flat bordered chip, static dot */
.afagh-kicker{ background:#fff; color:#475569; border:1px solid #e5e9f1; box-shadow:none; font-weight:700; }
.afagh-kicker .dot{ background:#2563eb; box-shadow:none; animation:none; }
.afagh-light .afagh-kicker{ color:#475569; }

/* calm motion: gentle fade, minimal slide, no stagger drama */
.afagh-reveal{ transform:translateY(8px); transition:opacity .5s ease, transform .5s ease; }
.afagh-reveal.d1,.afagh-reveal.d2,.afagh-reveal.d3,.afagh-reveal.d4{ transition-delay:0s; }

/* strategic dark band: flat, professional (no radial drama) */
.afagh-dark-showcase{ background:#0b1220; background-image:none; }

/* hero search card: flat, not glowing */
.afagh-hero-light .group .absolute.-inset-\[2px\]{ display:none; }

/* remove ambient glow blobs (the blurred color circles) in light sections */
.afagh-light [class*="blur-[120px]"],
.afagh-light [class*="blur-[100px]"],
.afagh-light [class*="blur-[150px]"],
.afagh-hero-light [class*="blur-[120px]"],
.afagh-hero-light [class*="blur-[100px]"]{ display:none !important; }

/* ============================================================
 * v3.2.0 — Evolution refinement: professional typography, calmer
 * scale & spacing, last decorative gradients removed. Restrained.
 * ============================================================ */
.afagh-display{ font-weight:800; font-size:clamp(1.85rem,3.2vw,2.7rem); line-height:1.2; letter-spacing:-.012em; color:#0f172a; }
.afagh-light .afagh-display{ color:#0f172a; }
/* calmer section rhythm */
.afagh-light.py-24{ padding-top:5rem; padding-bottom:5rem; }
/* readable body copy */
.afagh-light p{ line-height:1.8; }
/* quieter kicker */
.afagh-kicker{ font-size:12px; padding:6px 14px; letter-spacing:0; }
/* flatten remaining decorative gradient bars in light sections -> solid accent */
.afagh-light [class~="bg-gradient-to-r"]{ background-image:none !important; background-color:#2563eb !important; }

/* ============================================================
 * v3.3.0 — Unified canvas: ONE consistent light background.
 * Eliminates white-vs-gray section mismatch. body + hero + all
 * light sections share #f8fafc; all cards are #ffffff.
 * ============================================================ */
:root{ --afg-l-bg:#f8fafc; }
.afagh-hero-light{ background:#f8fafc; }
.afagh-light{ background:#f8fafc; }
body.bg-slate-50{ background-color:#f8fafc !important; }

/* ============================================================
 * v3.4.0 — Site-wide light consistency: comprehensive accent remaps
 * (so -200/-300 light accents stay readable on white) + white-text
 * preserved on ALL solid colored fills. Fixes flipped sub-pages and
 * the JS-injected domain table automatically.
 * ============================================================ */
.afagh-light .text-blue-200, .afagh-light .text-blue-300{ color:#2563eb; }
.afagh-light .text-indigo-200, .afagh-light .text-indigo-300{ color:#1d4ed8; }
.afagh-light .text-sky-200, .afagh-light .text-sky-300{ color:#1d4ed8; }
.afagh-light .text-cyan-200, .afagh-light .text-cyan-300{ color:#1d4ed8; }
.afagh-light .text-teal-200, .afagh-light .text-teal-300{ color:#1d4ed8; }
.afagh-light .text-emerald-200, .afagh-light .text-emerald-300{ color:#059669; }
.afagh-light .text-green-200, .afagh-light .text-green-300{ color:#059669; }
.afagh-light .text-purple-200, .afagh-light .text-purple-300{ color:#2563eb; }
.afagh-light .text-violet-200, .afagh-light .text-violet-300{ color:#1d4ed8; }
.afagh-light .text-fuchsia-200, .afagh-light .text-fuchsia-300{ color:#1d4ed8; }
.afagh-light .text-amber-200, .afagh-light .text-amber-300{ color:#b45309; }
.afagh-light .text-orange-200, .afagh-light .text-orange-300{ color:#c2410c; }
.afagh-light .text-yellow-200, .afagh-light .text-yellow-300{ color:#b45309; }
.afagh-light .text-red-200, .afagh-light .text-red-300{ color:#dc2626; }
.afagh-light .text-rose-200, .afagh-light .text-rose-300{ color:#e11d48; }
.afagh-light .text-pink-200, .afagh-light .text-pink-300{ color:#db2777; }
.afagh-light .text-slate-200, .afagh-light .text-slate-300{ color:#475569; }
.afagh-light .text-slate-100{ color:#334155; }
.afagh-light [class~="bg-blue-500"].text-white,
.afagh-light [class~="bg-blue-500"] .text-white,
.afagh-light [class~="bg-blue-600"].text-white,
.afagh-light [class~="bg-blue-600"] .text-white,
.afagh-light [class~="bg-blue-700"].text-white,
.afagh-light [class~="bg-blue-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-indigo-500"].text-white,
.afagh-light [class~="bg-indigo-500"] .text-white,
.afagh-light [class~="bg-indigo-600"].text-white,
.afagh-light [class~="bg-indigo-600"] .text-white,
.afagh-light [class~="bg-indigo-700"].text-white,
.afagh-light [class~="bg-indigo-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-sky-500"].text-white,
.afagh-light [class~="bg-sky-500"] .text-white,
.afagh-light [class~="bg-sky-600"].text-white,
.afagh-light [class~="bg-sky-600"] .text-white,
.afagh-light [class~="bg-sky-700"].text-white,
.afagh-light [class~="bg-sky-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-cyan-500"].text-white,
.afagh-light [class~="bg-cyan-500"] .text-white,
.afagh-light [class~="bg-cyan-600"].text-white,
.afagh-light [class~="bg-cyan-600"] .text-white,
.afagh-light [class~="bg-cyan-700"].text-white,
.afagh-light [class~="bg-cyan-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-teal-500"].text-white,
.afagh-light [class~="bg-teal-500"] .text-white,
.afagh-light [class~="bg-teal-600"].text-white,
.afagh-light [class~="bg-teal-600"] .text-white,
.afagh-light [class~="bg-teal-700"].text-white,
.afagh-light [class~="bg-teal-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-emerald-500"].text-white,
.afagh-light [class~="bg-emerald-500"] .text-white,
.afagh-light [class~="bg-emerald-600"].text-white,
.afagh-light [class~="bg-emerald-600"] .text-white,
.afagh-light [class~="bg-emerald-700"].text-white,
.afagh-light [class~="bg-emerald-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-green-500"].text-white,
.afagh-light [class~="bg-green-500"] .text-white,
.afagh-light [class~="bg-green-600"].text-white,
.afagh-light [class~="bg-green-600"] .text-white,
.afagh-light [class~="bg-green-700"].text-white,
.afagh-light [class~="bg-green-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-purple-500"].text-white,
.afagh-light [class~="bg-purple-500"] .text-white,
.afagh-light [class~="bg-purple-600"].text-white,
.afagh-light [class~="bg-purple-600"] .text-white,
.afagh-light [class~="bg-purple-700"].text-white,
.afagh-light [class~="bg-purple-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-violet-500"].text-white,
.afagh-light [class~="bg-violet-500"] .text-white,
.afagh-light [class~="bg-violet-600"].text-white,
.afagh-light [class~="bg-violet-600"] .text-white,
.afagh-light [class~="bg-violet-700"].text-white,
.afagh-light [class~="bg-violet-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-fuchsia-500"].text-white,
.afagh-light [class~="bg-fuchsia-500"] .text-white,
.afagh-light [class~="bg-fuchsia-600"].text-white,
.afagh-light [class~="bg-fuchsia-600"] .text-white,
.afagh-light [class~="bg-fuchsia-700"].text-white,
.afagh-light [class~="bg-fuchsia-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-amber-500"].text-white,
.afagh-light [class~="bg-amber-500"] .text-white,
.afagh-light [class~="bg-amber-600"].text-white,
.afagh-light [class~="bg-amber-600"] .text-white,
.afagh-light [class~="bg-amber-700"].text-white,
.afagh-light [class~="bg-amber-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-orange-500"].text-white,
.afagh-light [class~="bg-orange-500"] .text-white,
.afagh-light [class~="bg-orange-600"].text-white,
.afagh-light [class~="bg-orange-600"] .text-white,
.afagh-light [class~="bg-orange-700"].text-white,
.afagh-light [class~="bg-orange-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-yellow-500"].text-white,
.afagh-light [class~="bg-yellow-500"] .text-white,
.afagh-light [class~="bg-yellow-600"].text-white,
.afagh-light [class~="bg-yellow-600"] .text-white,
.afagh-light [class~="bg-yellow-700"].text-white,
.afagh-light [class~="bg-yellow-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-red-500"].text-white,
.afagh-light [class~="bg-red-500"] .text-white,
.afagh-light [class~="bg-red-600"].text-white,
.afagh-light [class~="bg-red-600"] .text-white,
.afagh-light [class~="bg-red-700"].text-white,
.afagh-light [class~="bg-red-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-rose-500"].text-white,
.afagh-light [class~="bg-rose-500"] .text-white,
.afagh-light [class~="bg-rose-600"].text-white,
.afagh-light [class~="bg-rose-600"] .text-white,
.afagh-light [class~="bg-rose-700"].text-white,
.afagh-light [class~="bg-rose-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-pink-500"].text-white,
.afagh-light [class~="bg-pink-500"] .text-white,
.afagh-light [class~="bg-pink-600"].text-white,
.afagh-light [class~="bg-pink-600"] .text-white,
.afagh-light [class~="bg-pink-700"].text-white,
.afagh-light [class~="bg-pink-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-slate-500"].text-white,
.afagh-light [class~="bg-slate-500"] .text-white,
.afagh-light [class~="bg-slate-600"].text-white,
.afagh-light [class~="bg-slate-600"] .text-white,
.afagh-light [class~="bg-slate-700"].text-white,
.afagh-light [class~="bg-slate-700"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-gradient-to-r"].text-white,
.afagh-light [class~="bg-gradient-to-r"] .text-white,
.afagh-light [class~="bg-gradient-to-l"].text-white,
.afagh-light [class~="bg-gradient-to-l"] .text-white,
.afagh-light [class~="bg-gradient-to-tr"].text-white,
.afagh-light [class~="bg-gradient-to-tr"] .text-white{ color:#fff !important; }
.afagh-light [class~="bg-gradient-to-tl"].text-white,
.afagh-light [class~="bg-gradient-to-tl"] .text-white,
.afagh-light [class~="bg-gradient-to-br"].text-white,
.afagh-light [class~="bg-gradient-to-br"] .text-white,
.afagh-light [class~="bg-gradient-to-bl"].text-white,
.afagh-light [class~="bg-gradient-to-bl"] .text-white{ color:#fff !important; }

/* ============================================================
 * v3.4.0 — Light header (consistent with the light site).
 * Self-contained skin; handles megamenu + mobile overlay.
 * ============================================================ */
.afagh-hdr{ background:rgba(255,255,255,.92) !important; border-color:#e5e9f1 !important; -webkit-backdrop-filter:saturate(180%) blur(8px); backdrop-filter:saturate(180%) blur(8px); }
.afagh-hdr .text-white, .afagh-hdr .text-slate-300, .afagh-hdr .text-slate-400, .afagh-hdr .text-slate-200{ color:#334155; }
.afagh-hdr [class*="bg-slate-900"], .afagh-hdr [class*="bg-slate-800"], .afagh-hdr [class*="bg-[#0f172a]"], .afagh-hdr [class*="bg-[#0b1120]"]{ background-color:#ffffff !important; }
.afagh-hdr #mobile-menu-full{ background:rgba(255,255,255,.98) !important; }
.afagh-hdr [class*="border-slate-800"], .afagh-hdr [class*="border-slate-700"], .afagh-hdr [class*="border-white/"]{ border-color:#e5e9f1 !important; }
.afagh-hdr [class*="bg-slate-800"]:hover, .afagh-hdr [class*="bg-slate-700"]:hover{ background-color:#eef2f8 !important; }
/* keep white text on solid blue CTAs/buttons in the header */
.afagh-hdr [class~="bg-blue-600"], .afagh-hdr [class~="bg-blue-500"], .afagh-hdr [class~="bg-blue-600"] *, .afagh-hdr [class~="bg-blue-500"] *{ color:#fff !important; }
/* mega/quick menu cards readable */
.afagh-hdr a:hover{ }

/* ============================================================
 * v3.5.0 — Global light system + final QA layer.
 * body now carries .afagh-light, so EVERY template (blog, archives,
 * search, single, etc.) inherits the light remap — no per-section
 * flipping needed. Plus arbitrary dark-hex remap, controlled
 * container width, unified hover/focus, lighter skeleton.
 * ============================================================ */

/* remap ANY arbitrary dark hex background (bg-[#0f172a], bg-[#0b1120]...) */
.afagh-light [class*="bg-[#0"]{ background-color:#ffffff !important; }
.afagh-light [class*="bg-[#1"]{ background-color:#ffffff !important; }
/* but keep the hero canvas + body itself light-neutral, not pure white */
body.afagh-light{ background:#f8fafc !important; }

/* controlled max-width on ultra-wide displays */
.container{ max-width:1320px !important; }

/* unified interaction: neutralize stray blue hover borders -> subtle slate */
.afagh-light [class*="hover:border-blue"]:hover,
.afagh-light [class*="hover:border-indigo"]:hover,
.afagh-light [class*="hover:border-cyan"]:hover{ border-color:#cbd5e1 !important; }
/* card hover = gentle lift via shadow only, consistent everywhere */
.afagh-light .afagh-card:hover,
.afagh-light article:hover{ border-color:#cfd8e8 !important; }

/* ============================================================
 * v3.5.0 — Footer: clean light surface, premium hierarchy.
 * ============================================================ */
.afagh-ftr{ background:#ffffff; color:#5a6b8c; }
.afagh-ftr h5, .afagh-ftr h6, .afagh-ftr .text-white{ color:#0f172a !important; }
.afagh-ftr [class~="bg-slate-800"], .afagh-ftr [class~="bg-slate-700"]{ background:#eef2f8 !important; }
.afagh-ftr [class*="bg-white/5"], .afagh-ftr [class*="bg-white/10"]{ background:#f6f8fb !important; }
.afagh-ftr [class*="bg-slate-900"]{ background:#f6f8fb !important; }
.afagh-ftr [class*="border-white/"], .afagh-ftr [class*="border-slate-8"], .afagh-ftr [class*="border-slate-7"]{ border-color:#e5e9f1 !important; }
.afagh-ftr [class*="border-[#0f172a]"]{ border-color:#ffffff !important; }
.afagh-ftr [class*="shadow-black"], .afagh-ftr [class*="shadow-lg"]{ box-shadow:0 1px 2px rgba(16,33,71,.05) !important; }
.afagh-ftr input{ background:#ffffff !important; border-color:#e5e9f1 !important; color:#0f172a !important; }
.afagh-ftr input::placeholder{ color:#94a3b8 !important; }
.afagh-ftr a{ transition:color .15s ease; }
.afagh-ftr a:hover, .afagh-ftr .hover\:text-white:hover{ color:#2563eb !important; }
.afagh-ftr .text-slate-400, .afagh-ftr .text-slate-500{ color:#64748b; }
.afagh-ftr .text-slate-600{ color:#94a3b8; }
/* footer headings: clean accent rule */
.afagh-ftr h6{ font-size:13px; letter-spacing:0; }

/* dark CTA buttons stay dark+white on light pages (don't get blanked by the
   hex remap). A dark primary button on light is intentional & professional. */
.afagh-light a[class*="bg-[#0f172a]"], .afagh-light button[class*="bg-[#0f172a]"],
.afagh-light a[class*="bg-[#0f172a]"] *, .afagh-light button[class*="bg-[#0f172a]"] *{ background-color:#0f172a !important; color:#ffffff !important; }
.afagh-light a[class*="bg-[#0f172a]"]:hover, .afagh-light button[class*="bg-[#0f172a]"]:hover{ background-color:#1e293b !important; }

/* Light theme consistency layer — surfaces, borders, focus/hover states,
   skeleton. Loaded last. */
:root{
	--afg-line:#e5e9f1;          /* hairline / borders */
	--afg-line-soft:#eef2f8;     /* dividers */
	--afg-surface:#ffffff;       /* cards */
	--afg-hover:#f1f5f9;         /* subtle row/cell hover */
	--afg-ink:#0f172a;           /* primary text */
	--afg-mut:#64748b;           /* secondary text */
	--afg-brand:#2563eb;
	--afg-focus:0 0 0 3px rgba(37,99,235,.28); /* ONE consistent focus ring */
}

/* ---- 1. Ungapped slate borders (700/800 were remapped; 300–600 leaked dark) ---- */
.afagh-light [class*="border-slate-600"],
.afagh-light [class*="border-slate-500"],
.afagh-light [class*="border-slate-400"],
.afagh-light [class*="border-slate-300"],
.afagh-light [class*="border-gray-600"],
.afagh-light [class*="border-gray-700"],
.afagh-light [class*="border-gray-800"]{ border-color:var(--afg-line) !important; }
/* Tailwind divide-* paints borders on child elements */
.afagh-light [class*="divide-slate-6"] > :not([hidden]) ~ :not([hidden]),
.afagh-light [class*="divide-slate-7"] > :not([hidden]) ~ :not([hidden]),
.afagh-light [class*="divide-slate-8"] > :not([hidden]) ~ :not([hidden]),
.afagh-light [class*="divide-white/"] > :not([hidden]) ~ :not([hidden]){ border-color:var(--afg-line-soft) !important; }

/* ---- 2. ONE unified, accessible focus ring (kills stray indigo/blue glows) ---- */
.afagh-light a:focus-visible,
.afagh-light button:focus-visible,
.afagh-light input:focus-visible,
.afagh-light textarea:focus-visible,
.afagh-light select:focus-visible,
.afagh-light [tabindex]:focus-visible{ outline:none; box-shadow:var(--afg-focus); border-radius:10px; }
/* mouse focus (non-keyboard) should not paint a ring at all */
.afagh-light a:focus:not(:focus-visible),
.afagh-light button:focus:not(:focus-visible){ box-shadow:none; outline:none; }

/* ---- 3. Neutralize stray COLOURED hover borders -> consistent subtle slate ---- */
.afagh-light [class*="hover:border-blue"]:hover,
.afagh-light [class*="hover:border-indigo"]:hover,
.afagh-light [class*="hover:border-sky"]:hover,
.afagh-light [class*="hover:border-cyan"]:hover,
.afagh-light [class*="hover:border-violet"]:hover,
.afagh-light [class*="hover:border-purple"]:hover{ border-color:#cbd5e1 !important; }

/* ---- 4. Restore a real, consistent hover on cells/rows whose dark hover bg
 *        was killed by the always-on bg-slate-800/900 -> white remap ---- */
.afagh-light [class*="hover:bg-slate-7"]:hover,
.afagh-light [class*="hover:bg-slate-8"]:hover,
.afagh-light [class*="hover:bg-slate-9"]:hover,
.afagh-light [class*="hover:bg-white/5"]:hover,
.afagh-light [class*="hover:bg-white/10"]:hover{ background-color:var(--afg-hover) !important; }

/* ---- 5. Custom dark component chips on the domain hero -> clean light chips ---- */
.afagh-tld-card{
	background:var(--afg-surface) !important; border:1px solid var(--afg-line) !important;
	color:#334155 !important; box-shadow:0 1px 2px rgba(16,33,71,.05);
	transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.afagh-tld-card:hover{ border-color:#bfdbfe !important; transform:translateY(-2px); box-shadow:0 6px 16px -8px rgba(37,99,235,.35); }
.afagh-tld-card:hover .afagh-tld-price{ color:#1d4ed8 !important; }
/* tld extension (.ir/.com/.net) = ink, price = brand blue — one consistent system, no stray green/black */
.afagh-tld-card .text-white, .afagh-tld-card span:first-child{ color:var(--afg-ink) !important; }
.afagh-tld-price{ color:#2563eb !important; font-weight:800; }
/* domain price table: brand-blue prices instead of mixed emerald */
.afagh-light table .text-emerald-600{ color:#2563eb !important; }

/* ---- 6. Ghost translucent-white SURFACES that read as invisible on white
 *        get a real hairline card; scoped to exact tokens so /50,/70 are safe ---- */
.afagh-light [class~="bg-white/5"],
.afagh-light [class~="bg-white/10"]{ background-color:var(--afg-surface) !important; border-color:var(--afg-line) !important; }

/* ---- 7. Unified skeleton: light, neutral, brand-agnostic shimmer ---- */
body.afagh-loading .afagh-skel > *::after{
	background:linear-gradient(100deg,#eaeef4 28%,#f4f7fb 50%,#eaeef4 72%) !important;
	background-size:200% 100% !important;
	box-shadow:inset 0 0 0 1px rgba(16,33,71,.05) !important;
}

/* ---- 8. Typography rhythm: professional, calm, readable (hosting-grade) ---- */
.afagh-light h1,.afagh-light h2,.afagh-light h3,.afagh-light h4{ letter-spacing:-.011em; }
.afagh-light h1{ line-height:1.18; }
.afagh-light h2,.afagh-light h3{ line-height:1.28; }
.afagh-light p{ line-height:1.85; }
.afagh-light .text-slate-400{ color:var(--afg-mut); }   /* lift weak muted text to AA on white */

/* ---- 9. Inputs: one consistent field style across the whole site ---- */
.afagh-light input:not([type=checkbox]):not([type=radio]):not([type=range]):focus,
.afagh-light textarea:focus,
.afagh-light select:focus{ border-color:var(--afg-brand) !important; box-shadow:0 0 0 3px rgba(37,99,235,.12) !important; outline:none; }

/* ============================================================
 * v3.7.0 — Global heading scale (Global Web)
 * One consistent type hierarchy across every page. Overrides the
 * mixed inline text-4xl…text-7xl utilities (element+class beats the
 * single-class utilities, incl. responsive variants) so H1/H2 are
 * uniform site-wide. Mobile-fluid via clamp.
 * ============================================================ */
.afagh-light h1{ font-size:clamp(2rem, 1.4rem + 2.6vw, 3rem) !important; line-height:1.25 !important; font-weight:900; }
.afagh-light h2{ font-size:clamp(1.6rem, 1.2rem + 1.8vw, 2.25rem) !important; line-height:1.3 !important; font-weight:800; }
.afagh-light h3{ font-size:clamp(1.15rem, 1rem + .5vw, 1.35rem) !important; line-height:1.4 !important; }
/* keep gradient-clip spans inside headings inheriting the same size */
.afagh-light h1 span, .afagh-light h2 span{ font-size:inherit !important; line-height:inherit !important; }
/* the preloader brand is not a document heading — leave it alone */

/* ============================================================
 * v3.7.0 — ONE global comparison-table system (Global Web)
 * Every page's pricing/feature table now shares the same skin:
 * consistent padding, hairline row dividers, bold ink headers,
 * unified hover, and a single brand "recommended" column. Blog
 * post tables (.afagh-prose) are intentionally excluded.
 * ============================================================ */
.afagh-light section table{ border-collapse:separate !important; border-spacing:0 !important; width:100%; }
.afagh-prose table{ border-collapse:collapse !important; }
.afagh-light section thead th{
	font-weight:800 !important; color:#0f172a !important;
	padding:1.25rem 1.25rem !important; vertical-align:middle;
}
.afagh-light section tbody td,
.afagh-light section tbody th{
	padding:1rem 1.25rem !important;
	border-top:1px solid #eef2f8 !important;
	color:#334155;
}
.afagh-light section tbody tr:hover td{ background:#f8fafc; }
/* the recommended/featured column: one consistent brand band everywhere */
.afagh-light section td.afagh-rec,
.afagh-light section th.afagh-rec,
.afagh-light section [class*="bg-blue-600/10"]{ background:rgba(37,99,235,.06) !important; }
/* check (included) marks unified to one brand green */
.afagh-light section table .text-emerald-500,
.afagh-light section table .text-green-500{ color:#059669 !important; }

/* ============================================================
 * v3.8.0 — Remove decorative eyebrow labels (Global Web)
 * The small pill/kicker labels above section titles are dropped
 * site-wide; the section titles themselves remain.
 * ============================================================ */
.afagh-kicker{ display:none !important; }

/* v3.8.0 — enforce the heading scale on the custom display class too */
.afagh-light .afagh-display{ font-size:clamp(1.6rem, 1.2rem + 1.8vw, 2.25rem) !important; line-height:1.3 !important; }
