/* Afaq overrides on top of the recoloured reference stylesheet */
.af-js .af-reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
.af-js .af-reveal.af-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.af-js .af-reveal{opacity:1;transform:none;transition:none}}
/* heading highlight: charcoal text on an amber marker */
.after\:bg-blue-100::after{background:rgba(255,177,0,.45)!important}
/* Elementor wrappers must not add spacing around coded sections */
.af-page.e-con{--padding-top:0;--padding-bottom:0;--padding-left:0;--padding-right:0;--gap:0;--row-gap:0;--column-gap:0}
.af-page.e-con.wrapper{--padding-left:calc(var(--spacing)*4);--padding-right:calc(var(--spacing)*4)}
.af-page>.elementor-widget,.af-page>.e-con-inner>.elementor-widget{width:100%;max-width:100%;margin:0}
.elementor-widget-html .elementor-widget-container{margin:0;padding:0}

/* ---- header: desktop dropdowns ---- */
.af-dd:not(.af-open) .af-dd-panel{display:none}
.af-dd.af-open .af-dd-btn svg{transform:rotate(180deg)}
/* ---- header: mobile drawer ---- */
.af-drawer{transform:translateX(100%);visibility:hidden;transition:transform .35s cubic-bezier(.22,.61,.36,1),visibility 0s .35s}
html.af-drawer-open .af-drawer{transform:none;visibility:visible;transition:transform .35s cubic-bezier(.22,.61,.36,1)}
html.af-drawer-open{overflow:hidden}
.af-acc-panel{display:none}
.af-acc-btn.af-acc-open+.af-acc-panel{display:block}
.af-acc-btn.af-acc-open svg{transform:rotate(180deg)}
/* ---- marquee strip ---- */
.af-marquee{animation:af-marquee 28s linear infinite;will-change:transform}
@keyframes af-marquee{from{transform:translateX(0)}to{transform:translateX(50%)}}
/* ---- captured Swiper carousels become native swipeable scrollers ---- */
.swiper .swiper-wrapper{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;transform:none!important;-webkit-overflow-scrolling:touch}
.swiper .swiper-wrapper::-webkit-scrollbar{display:none}
.swiper .swiper-slide{scroll-snap-align:start}
@media (prefers-reduced-motion:reduce){.af-marquee{animation:none}}
/* ---- captured accordions (FAQ, footer link groups) ---- */
.af-acc-body.af-open.max-h-0{max-height:1200px;opacity:1}
.af-acc-body.af-open.grid-rows-\[0fr\]{grid-template-rows:1fr}
.af-acc-toggle.af-open svg{transform:rotate(180deg)}
.af-acc-toggle svg{transition:transform .25s}

/* ===== Brand emphasis (user feedback 2026-09-29): smaller logo, amber primary actions ===== */
:root{--af-amber:#FFB100;--af-amber-hover:#F0A300;--af-ink:#1D1B20;--af-cream:#FFF4DC}
/* logo: keep aspect ratio, clear the header edges */
header .af-logo{height:48px!important;width:auto!important;max-width:none;object-fit:contain}
@media (max-width:1023px){header .af-logo{height:34px!important}}
.af-drawer .af-logo{height:30px!important}
/* primary conversion buttons -> amber with near-black text */
a.bg-primary-600.text-white,button.bg-primary-600.text-white,
a.bg-primary-500.text-white,button.bg-primary-500.text-white,
a.bg-blue-500.text-white,button.bg-blue-500.text-white,
a.from-primary-500.text-white,a.from-primary-600.text-white{
  background:var(--af-amber)!important;color:var(--af-ink)!important;box-shadow:0 10px 24px -10px rgba(255,177,0,.65)}
a.bg-primary-600.text-white:hover,button.bg-primary-600.text-white:hover,
a.bg-primary-500.text-white:hover,button.bg-primary-500.text-white:hover,
a.bg-blue-500.text-white:hover,button.bg-blue-500.text-white:hover,
a.from-primary-500.text-white:hover,a.from-primary-600.text-white:hover{background:var(--af-amber-hover)!important}
/* selected hero tab */
[role=tablist] [aria-selected=true]{color:var(--af-ink)!important}
[role=tablist] [aria-selected=true]>.bg-primary-600{background:var(--af-amber)!important;box-shadow:0 6px 16px -6px rgba(255,177,0,.7)}
/* section icon tiles and small accents */
.bg-primary-50>svg,.bg-primary-50 svg.text-primary-600,.bg-primary-50 svg.text-primary-500{color:#E89F00!important}
.bg-primary-50{background-color:var(--af-cream)!important}
.text-primary-300,.text-primary-400{color:var(--af-amber)!important}
/* card hover borders */
.group.border:hover,.group.rounded-3xl:hover{border-color:rgba(255,177,0,.55)!important}
/* pill labels (section kickers) */
span.bg-primary-600.text-white.rounded-full,div.bg-primary-600.text-white.rounded-full{background:var(--af-amber)!important;color:var(--af-ink)!important}
.af-dd.af-open .af-dd-btn{background:var(--af-cream);color:var(--af-ink)}

/* ---- merged 6+6 SEO offer (replaces the reference 6+6 banner slot; text is real HTML) ---- */
.af-seo-slot{padding-inline:0}
.afaq-seo-offer{position:relative;isolation:isolate;max-width:1320px;margin:auto;border-radius:28px;overflow:hidden;
  background:#252329 url('https://afaaq-saudi.com/wp-content/uploads/2026/09/afaq-seo-background-v2.png') left center/cover no-repeat;
  color:#fff;min-height:390px;display:flex;align-items:center;font-family:Tajawal,sans-serif}
.afaq-seo-copy{box-sizing:border-box;width:61%;padding:38px 44px 38px 24px}
.afaq-seo-copy h2{font-size:clamp(27px,3vw,46px);line-height:1.5;margin:8px 0 14px;font-weight:800;color:#fff}
.afaq-seo-copy h2 span{color:#FFB100}
.afaq-seo-label{font-size:20px;color:#FFCF66;margin:0;font-weight:700}
.afaq-seo-description{font-size:19px;line-height:1.8;color:#EEE9E1;margin:0 0 18px}
.afaq-seo-price{font-size:25px;margin:0 0 20px;font-weight:700}
.afaq-seo-price bdi{color:#FFB100;font-size:34px;white-space:nowrap}
.afaq-seo-cta{display:inline-block;padding:13px 30px;background:#FFB100;color:#1D1B20!important;border-radius:40px;font-size:21px;font-weight:700;text-decoration:none;transition:background .2s}
.afaq-seo-cta:hover{background:#F0A300}
.afaq-seo-cta:focus-visible{outline:3px solid #fff;outline-offset:4px}
@media(max-width:1023px){
  .afaq-seo-offer{background-size:auto 235px;background-position:left bottom;padding-bottom:240px;min-height:0;border-radius:22px}
  .afaq-seo-copy{width:100%;padding:28px 22px;background:linear-gradient(#252329 85%,transparent)}
  .afaq-seo-copy h2{font-size:30px}.afaq-seo-description{font-size:17px}
  .afaq-seo-price{font-size:21px}.afaq-seo-price bdi{font-size:30px}}
/* freelancer CTA removed: remaining drawer CTA spans the full row */
.af-drawer .grid>*:only-child{grid-column:1/-1}
/* mobile hero: tagline under the character image; RTL-correct platform logo strip */
.af-hero-tagline{margin:14px auto 0;max-width:320px;text-align:center;font-size:20px;line-height:1.5;font-weight:800;color:#2B292F}
.af-hero-tagline::after{content:"";display:block;width:56px;height:4px;border-radius:4px;background:#FFB100;margin:10px auto 0}

/* platforms card: static, centred, never clips a logo mid-way (replaces the edge-cropping marquee) */
.hero-logo-marquee{animation:none!important;transform:none!important;width:100%!important;justify-content:center}
.hero-logo-marquee>div:nth-child(n+2){display:none!important}
.hero-logo-marquee>div:first-child{flex-wrap:wrap;justify-content:center;column-gap:18px;row-gap:12px;width:100%}
.hero-logo-marquee>div:first-child>div{height:26px!important;width:58px!important}

/* ---- responsive hardening (audit 2026-09-29) ---- */
/* decorative blurred blobs and scrollers must never widen the page */
main,footer{overflow-x:clip}
/* 1024-1279px: desktop nav + CTA must fit inside the header bar */
@media (min-width:1024px) and (max-width:1279px){
  .header-desktop-row{gap:.75rem!important;padding-inline:1rem!important}
  .header-desktop-row nav{gap:.1rem!important}
  .header-desktop-row nav>a,.header-desktop-row nav .af-dd-btn{padding-inline:.6rem!important;font-size:13px!important}
  .header-desktop-row>a:last-child,.header-desktop-row .bg-primary-500{padding-inline:.9rem!important}
}
/* 768-1023px: header is still the two-row mobile header (offers strip + bar); reserve the same space as mobile */
@media (min-width:768px) and (max-width:1023px){.flex-grow.pt-\[160px\]{padding-top:160px!important}}
/* goal picker: 2 columns on narrow phones so Arabic labels don't break word-per-line */
@media (max-width:419px){.af-goals-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.75rem!important}}

/* ---- home: "فريقك الخاص" section (dedicated brand team positioning) ---- */
.af-team{padding:56px 0}
.af-team-inner{max-width:1232px;margin:0 auto;display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:center;
  background:linear-gradient(135deg,#2B292F 0%,#47444B 100%);border-radius:28px;padding:48px;color:#fff;position:relative;overflow:hidden}
.af-team-inner::before{content:"";position:absolute;inset:auto auto -120px -120px;width:320px;height:320px;border-radius:50%;background:radial-gradient(rgba(255,177,0,.28),transparent 70%)}
.af-team-copy{position:relative}
.af-team-kicker{display:inline-block;background:#FFB100;color:#1D1B20;font-weight:800;font-size:13px;border-radius:999px;padding:6px 14px}
.af-team-copy h2{margin:16px 0 12px;font-size:clamp(28px,3.2vw,42px);line-height:1.35;font-weight:800;color:#fff}
.af-team-copy h2 span{color:#FFB100;display:block}
.af-team-copy>p{color:rgba(255,255,255,.82);font-size:17px;line-height:1.85;margin:0 0 24px}
.af-team-cta{display:inline-flex;align-items:center;gap:8px;background:#FFB100;color:#1D1B20!important;font-weight:800;border-radius:999px;padding:12px 26px;text-decoration:none;box-shadow:0 10px 24px -10px rgba(255,177,0,.7)}
.af-team-cta:hover{background:#F0A300}
.af-team-points{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.af-team-points li{display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:18px;transition:border-color .25s}
.af-team-points li:hover{border-color:rgba(255,177,0,.6)}
.af-team-ico{flex:0 0 42px;height:42px;border-radius:12px;background:rgba(255,177,0,.14);color:#FFB100;display:grid;place-items:center}
.af-team-ico svg{width:22px;height:22px}
.af-team-points h3{margin:0 0 4px;font-size:16px;font-weight:800;color:#fff}
.af-team-points p{margin:0;font-size:14px;line-height:1.7;color:rgba(255,255,255,.72)}
@media (max-width:1023px){.af-team-inner{grid-template-columns:1fr;padding:36px 28px;gap:28px}}
@media (max-width:640px){.af-team{padding:32px 0}.af-team-inner{border-radius:22px;padding:28px 18px}.af-team-points{grid-template-columns:1fr}.af-team-copy{text-align:center}}

/* Codex responsive refinement 2026-09-30: anchored content clears fixed header. */
main section[id],main [id].afaq-seo-offer,.afaq-seo-offer{scroll-margin-top:160px}
@media(min-width:1024px){main section[id],main [id].afaq-seo-offer,.afaq-seo-offer{scroll-margin-top:112px}}
@media(max-width:1023px){
 .afaq-seo-copy{padding:28px 20px 24px}
 .afaq-seo-copy h2{font-size:clamp(25px,7.2vw,30px);line-height:1.55}
 .afaq-seo-copy h2 span{display:block}
 .afaq-seo-label{font-size:clamp(16px,4.6vw,20px);line-height:1.6}
 .afaq-seo-price{line-height:1.6}
 .afaq-seo-cta{max-width:100%;box-sizing:border-box;text-align:center}
}


/* Codex services catalogue: readable RTL search and explicit filter states. */
.af-service-hidden{display:none!important}
.af-service-catalogue input[type=search]{padding-inline-start:44px!important;padding-inline-end:16px!important;min-height:48px}
.af-service-catalogue button[aria-pressed]{min-height:44px;border:1px solid #e5e7eb;background:#fff!important;color:#48454c!important;box-shadow:none!important}
.af-service-catalogue button[aria-pressed=true]{background:#ffb300!important;color:#211f24!important;border-color:#ffb300;box-shadow:0 5px 16px #ffb30026!important}
.af-service-catalogue :is(button,input,a):focus-visible{outline:3px solid #b77900;outline-offset:3px}
.af-services-empty{padding:28px 16px;text-align:center;background:#fff7e4;border-radius:18px;color:#48454c;line-height:1.8}
.af-services-empty[hidden]{display:none}
@media(max-width:1023px){.af-service-catalogue a p.truncate{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.6}}


/* ---- blog single post ---- */
body.single-post main{max-width:820px;margin:0 auto;padding:24px 20px 72px;color:var(--af-ink);font-size:18px;line-height:1.95}
body.single-post main .page-header{margin:8px 0 28px}
body.single-post main .entry-title{font-family:Alexandria,Tajawal,sans-serif;font-weight:800;font-size:clamp(28px,4.2vw,44px);line-height:1.35;color:var(--af-ink)}
body.single-post main .page-content>*+*{margin-top:1.1em}
body.single-post main .page-content h2{font-family:Alexandria,Tajawal,sans-serif;font-weight:800;font-size:clamp(22px,2.8vw,30px);line-height:1.45;margin-top:2em;padding-inline-start:14px;border-inline-start:5px solid var(--af-amber)}
body.single-post main .page-content h3{font-weight:800;font-size:clamp(19px,2.2vw,23px);margin-top:1.6em}
body.single-post main .page-content p{margin-top:.9em}
body.single-post main .page-content ul,body.single-post main .page-content ol{padding-inline-start:1.4em;margin-top:.8em}
body.single-post main .page-content ul{list-style:disc}
body.single-post main .page-content ol{list-style:decimal}
body.single-post main .page-content li{margin-top:.4em}
body.single-post main .page-content li::marker{color:var(--af-amber-hover)}
body.single-post main .page-content a{color:#b36b00;text-decoration:underline;text-underline-offset:3px}
body.single-post main .page-content a:hover{color:var(--af-ink)}
body.single-post main .page-content strong{font-weight:800}
body.single-post main .page-content figure{margin:1.6em 0}
body.single-post main .page-content figure img{width:100%;height:auto;border-radius:18px;display:block}
body.single-post main .page-content figure.afaq-cover{margin-top:0}
body.single-post main .page-content table{width:100%;border-collapse:collapse;margin-top:1.2em;font-size:16px;display:block;overflow-x:auto}
body.single-post main .page-content th,body.single-post main .page-content td{border:1px solid #eadfc8;padding:10px 12px;text-align:start;vertical-align:top}
body.single-post main .page-content th{background:var(--af-cream);font-weight:800}
body.single-post main .page-content hr{border:0;border-top:1px solid #eadfc8;margin:2.4em 0}
@media (max-width:640px){body.single-post main{font-size:17px;padding:16px 16px 56px}}

/* ---- home: white header strip + white footer (scoped to front page) ---- */
body.home .site-header .af-marquee{color:#1D1B20}
body.home .site-header .lg\:hidden.h-11{background:#fff;border:1px solid #eadfc8;box-shadow:0 6px 18px rgba(29,27,32,.06)}
body.home .site-header .lg\:hidden.h-11 > div{background:#fff!important;background-image:none!important}
body.home .site-header .lg\:hidden.h-11 .text-white{color:#1D1B20!important}
body.home .site-header .lg\:hidden.h-11 .bg-white\/50{background:#FFB100!important}
body.home footer.bg-\[\#053585\]{background:#fff!important;color:#1D1B20;border-top:1px solid #eadfc8}
body.home footer.bg-\[\#053585\] :where(h1,h2,h3,h4,h5,p,span,li,a,button,label,summary){color:#1D1B20}
body.home footer.bg-\[\#053585\] [class*="text-white"],body.home footer.bg-\[\#053585\] [class*="text-gray"],body.home footer.bg-\[\#053585\] [class*="text-slate"]{color:#3d3a42!important}
body.home footer.bg-\[\#053585\] [class*="text-primary"]{color:#b36b00!important}
body.home footer.bg-\[\#053585\] a:hover{color:#b36b00!important}
body.home footer.bg-\[\#053585\] [class*="border-white"]{border-color:#eadfc8!important}
body.home footer.bg-\[\#053585\] [class*="bg-white\/"]{background:#faf7f1!important}
body.home footer.bg-\[\#053585\] a.bg-white,body.home footer.bg-\[\#053585\] button.bg-white{background:#FFB100!important;color:#1D1B20!important;border:0}
body.home footer.bg-\[\#053585\] input{background:#fff!important;color:#1D1B20!important;border-color:#d9cdb5!important}
body.home footer.bg-\[\#053585\] input::placeholder{color:#7a746c}
body.home footer.bg-\[\#053585\] .bg-\[\#1f5bb7\]{background:#FFB100!important;color:#1D1B20!important}
body.home footer.bg-\[\#053585\] svg{color:currentColor}
body.home footer.bg-\[\#053585\] img[src*="afaq-logo"]{filter:none!important;opacity:1!important}
