/* =========================================================
   Masfofat sitewide theme = homepage Hostinger model
   Applies to hm/dm/tw/woo + Elementor pages
   ========================================================= */
:root{
  --mf-p:#673de6;
  --mf-b:#0c90cc;
  --mf-g:#18a848;
  --mf-r:#e41824;
  --mf-y:#fcc00c;
  --mf-wa:#25d366;
  --mf-ink:#0f172a;
  --mf-muted:#64748b;
  --mf-line:#e8eef6;
  --mf-bg:#f5f7fb;
  --mf-soft:#eef2ff;
  --mf-surface:#fff;
  --mf-max:1320px;
  --mf-radius:16px;
  --mf-radius-lg:18px;
  --mf-shadow:0 8px 22px rgba(15,23,42,.04);
}

html{scroll-behavior:smooth}
body.page,
body.home,
body.elementor-page,
body.blog,
body.single{
  background:var(--mf-bg)!important;
  color:var(--mf-ink);
  font-family:"Cairo",Tahoma,Arial,sans-serif;
}

/* Full-bleed custom pages */
body.page #mh-main-area:has(.hm-wrap),
body.page #mh-main-area:has(.dm-wrap),
body.page #mh-main-area:has(.tw-wrap),
body.page #mh-main-area:has(.woo-page){
  padding:0!important;margin:0!important;max-width:none!important;width:100%!important;
}
body.page #mh-main-area:has(.hm-wrap) > article,
body.page #mh-main-area:has(.hm-wrap) .entry-content,
body.page #mh-main-area:has(.dm-wrap) > article,
body.page #mh-main-area:has(.dm-wrap) .entry-content,
body.page #mh-main-area:has(.tw-wrap) > article,
body.page #mh-main-area:has(.tw-wrap) .entry-content,
body.page #mh-main-area:has(.woo-page) > article,
body.page #mh-main-area:has(.woo-page) .entry-content{
  margin:0!important;padding:0!important;max-width:none!important;width:100%!important;
}
body.page #mh-main-area:has(.hm-wrap) .entry-title,
body.page #mh-main-area:has(.dm-wrap) .entry-title,
body.page #mh-main-area:has(.tw-wrap) .entry-title,
body.page #mh-main-area:has(.woo-page) .entry-title,
body.page #mh-main-area:has(.hm-wrap) .post-meta,
body.page #mh-main-area:has(.dm-wrap) .post-meta,
body.page #mh-main-area:has(.tw-wrap) .post-meta{display:none!important}

/* ===== Shared wrap tokens (homepage) ===== */
.hm-wrap,.dm-wrap,.tw-wrap,.woo-page{
  --p:var(--mf-p)!important;
  --b:var(--mf-b)!important;
  --g:var(--mf-g)!important;
  --r:var(--mf-r)!important;
  --y:var(--mf-y)!important;
  --ink:var(--mf-ink)!important;
  --muted:var(--mf-muted)!important;
  --line:var(--mf-line)!important;
  --bg:var(--mf-bg)!important;
  max-width:none!important;width:100%!important;margin:0!important;padding:0!important;
  font-family:"Cairo",Tahoma,Arial,sans-serif!important;
  color:var(--mf-ink)!important;
  background:var(--mf-bg)!important;
  direction:rtl;text-align:right;line-height:1.7;
}
.hm-wrap *,.dm-wrap *,.tw-wrap *,.woo-page *{
  font-family:"Cairo",Tahoma,Arial,sans-serif!important;
  box-sizing:border-box;
}
.hm-wrap img,.dm-wrap img,.tw-wrap img,.woo-page img{max-width:100%;height:auto}

/* ===== Hero = homepage model ===== */
.hm-hero,.dm-hero,.tw-hero,.woo-hero{
  background:linear-gradient(160deg,#ffffff 0%,#eef2ff 45%,#f5f7fb 100%)!important;
  color:var(--mf-ink)!important;
  padding:34px 20px 28px!important;
  overflow:hidden;position:relative;
}
.dm-hero::before,.tw-hero::before{opacity:.45!important}
.hm-hero-inner,.dm-hero-inner,.tw-hero-inner{
  max-width:var(--mf-max)!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:1.2fr .8fr!important;
  gap:32px!important;
  align-items:center!important;
}
.hm-badge,.dm-kicker,.tw-badge{
  display:inline-flex!important;align-items:center;gap:8px;
  background:#ede9fe!important;color:#5b21b6!important;
  border:0!important;border-radius:999px!important;
  font-weight:800!important;font-size:.8rem!important;
  padding:6px 12px!important;margin:0 0 12px!important;
}
.hm-hero h1,.dm-hero h1,.tw-hero h1,.woo-hero h1{
  color:var(--mf-ink)!important;font-weight:900!important;
  font-size:clamp(1.75rem,3.8vw,2.65rem)!important;
  line-height:1.28!important;margin:0 0 12px!important;
}
.hm-lead,.dm-hero .lead,.tw-hero .lead,.tw-hero p.lead,.woo-hero p,
.dm-hero p:not(.dm-kicker){
  color:var(--mf-muted)!important;font-size:1.05rem!important;max-width:40rem;
}
.tw-proof{color:var(--mf-muted)!important;font-size:.95rem!important;margin:0 0 16px!important}

/* Points / meta → homepage checklist feel */
.hm-points,.dm-hero-points{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px}
.hm-points li,.dm-hero-points li{
  display:flex;align-items:flex-start;gap:8px;color:#334155!important;font-weight:600!important;
  background:transparent!important;border:0!important;padding:0!important;border-radius:0!important;
}
.tw-meta{display:grid!important;gap:8px!important;margin:14px 0 0!important;padding:0!important}
.tw-meta span{
  display:flex!important;align-items:flex-start;gap:8px;
  background:transparent!important;border:0!important;padding:0!important;
  color:#334155!important;font-weight:600!important;font-size:.95rem!important;
  border-radius:0!important;
}
.tw-meta span::before,
.hm-points li::before,
.dm-hero-points li::before{
  content:""!important;width:18px;height:18px;border-radius:50%;
  background:var(--mf-p)!important;flex:0 0 18px;margin-top:3px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='white' d='M6.2 11.4 2.8 8l1.1-1.1 2.3 2.3 5-5L12.3 5z'/%3E%3C/svg%3E")!important;
  background-size:12px!important;background-repeat:no-repeat!important;background-position:center!important;
  color:transparent!important;
}

/* Actions / buttons = homepage pills */
.hm-actions,.dm-actions,.tw-actions{display:flex;flex-wrap:wrap;gap:10px!important;margin:0 0 8px}
.hm-hero .hm-actions,.dm-hero .dm-actions,.tw-hero .tw-actions{
  display:grid!important;grid-auto-flow:column;grid-auto-columns:1fr;
  width:max-content;max-width:100%;gap:10px!important;
}
.hm-btn,.dm-btn,.tw-btn{
  display:inline-flex!important;align-items:center;justify-content:center;gap:8px;
  padding:12px 20px!important;border-radius:999px!important;font-weight:800!important;
  text-decoration:none!important;font-size:.95rem!important;border:0!important;cursor:pointer;
  box-sizing:border-box;text-align:center;white-space:nowrap;
}
.hm-hero .hm-btn,.dm-hero .dm-btn,.tw-hero .tw-btn{width:100%}
.hm-btn-primary,.dm-btn-primary{
  background:var(--mf-p)!important;color:#fff!important;
  box-shadow:0 10px 24px rgba(103,61,230,.22)!important;
}
.hm-btn-ghost,.dm-btn-ghost,.dm-btn-outline,.tw-btn-outline{
  background:#fff!important;color:var(--mf-ink)!important;
  border:1.5px solid var(--mf-line)!important;
}
.hm-btn-wa,.dm-btn-wa,.tw-btn-green{
  background:var(--mf-wa)!important;color:#fff!important;
  box-shadow:0 10px 24px rgba(37,211,102,.2)!important;
}

/* Hero media */
.hm-hero-media,.dm-hero-media,.mf-hero-media,.tw-hero .mf-hero-media{
  display:flex!important;justify-content:center;align-items:center;
}
.hm-hero-media img,.dm-hero-media img,.mf-hero-media img,.tw-hero img{
  width:min(100%,500px)!important;
  filter:drop-shadow(0 22px 40px rgba(103,61,230,.18))!important;
}

/* ===== Sections = homepage model ===== */
.hm-sec,.dm-section,.tw-section{
  max-width:var(--mf-max)!important;margin:0 auto!important;padding:48px 20px!important;
}
.hm-sec-soft,
.tw-section[style*="background"],
.dm-section:nth-of-type(even){
  background:var(--mf-soft)!important;
}
.tw-section[style*="background"]{
  max-width:none!important;padding:48px 20px!important;
}
.tw-section[style*="background"] > h2,
.tw-section[style*="background"] > .sub,
.tw-section[style*="background"] > .tw-grid-3,
.tw-section[style*="background"] > .tw-steps,
.tw-section[style*="background"] > .tw-faq{
  max-width:var(--mf-max);margin-left:auto;margin-right:auto;
}
.hm-sec-head,.dm-section-head{
  text-align:center!important;margin:0 auto 26px!important;max-width:720px!important;
  display:block!important;
}
.dm-section-head{align-items:center!important;justify-content:center!important}
.tw-section > h2{
  text-align:center!important;margin:0 auto 8px!important;
  font-size:clamp(1.4rem,2.5vw,1.9rem)!important;font-weight:900!important;color:var(--mf-ink)!important;
}
.tw-section > .sub{
  text-align:center!important;margin:0 auto 26px!important;max-width:720px!important;
  color:var(--mf-muted)!important;font-size:1.02rem!important;
}
.hm-sec-head h2,.dm-section-head h2{
  margin:0 0 8px!important;font-size:clamp(1.4rem,2.5vw,1.9rem)!important;
  font-weight:900!important;color:var(--mf-ink)!important;line-height:1.3!important;
}
.hm-sec-head p,.dm-section-head p{margin:0!important;color:var(--mf-muted)!important;font-size:1.02rem!important}

/* Cards / grids */
.hm-feats,.hm-why,.hm-plans,.hm-svc-grid,
.dm-grid,.tw-grid-3,.tw-steps{
  display:grid!important;gap:14px!important;
}
.dm-grid,.tw-grid-3,.hm-svc-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.hm-feats,.hm-why{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.tw-steps{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.hm-feat,.hm-why-card,.hm-svc,.hm-plan,
.dm-card,.tw-card,.tw-step,.tw-panel,.tw-faq details{
  background:#fff!important;border:1px solid var(--mf-line)!important;
  border-radius:var(--mf-radius-lg)!important;box-shadow:var(--mf-shadow)!important;
}
.dm-card{overflow:hidden}
.dm-card-body,.tw-card,.tw-step,.tw-panel{padding:20px 18px!important}
.dm-card h3,.tw-card h3,.tw-step h3,.tw-panel h3,
.hm-feat h3,.hm-why-card h3,.hm-svc h3{
  margin:0 0 8px!important;font-weight:800!important;color:var(--mf-ink)!important;
}
.dm-card p,.tw-card p,.tw-step p,.tw-panel p,
.hm-feat p,.hm-why-card p,.hm-svc p{margin:0!important;color:var(--mf-muted)!important}
.dm-tag,.tw-panel .tag,.hm-plan .tag{
  background:var(--mf-p)!important;color:#fff!important;border-radius:999px!important;font-weight:800!important;
}
.dm-card .dm-tag{background:#ede9fe!important;color:#5b21b6!important}
.dm-price,.tw-panel .price,.tw-price-pill,.hm-price{color:var(--mf-p)!important;font-weight:900!important}
.tw-step-num{
  background:var(--mf-p)!important;color:#fff!important;border-radius:999px!important;
  width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;font-weight:900;
}
.tw-list{list-style:none;padding:0;margin:0 auto;max-width:720px;display:grid;gap:10px}
.tw-list li{
  background:#fff;border:1px solid var(--mf-line);border-radius:14px;padding:14px 16px;
  color:#334155;font-weight:600;position:relative;padding-right:42px;
}
.tw-list li::before{
  content:"✓";position:absolute;right:16px;color:var(--mf-p);font-weight:900;
}

/* CTA = homepage gradient */
.hm-cta,.dm-cta-box,.tw-cta{
  background:linear-gradient(135deg,#4c1d95,#673de6 55%,#0c90cc)!important;
  color:#fff!important;border-radius:20px!important;
  padding:34px 24px!important;box-shadow:none!important;
}
.dm-cta{max-width:var(--mf-max)!important;margin:0 auto 48px!important;padding:0 20px!important}
.hm-cta h2,.dm-cta-box h2,.tw-cta h2,
.hm-cta p,.dm-cta-box p,.tw-cta p{color:#fff!important}
.dm-cta-box .dm-btn-ghost,.tw-cta .tw-btn-outline{
  background:rgba(255,255,255,.14)!important;color:#fff!important;
  border-color:rgba(255,255,255,.35)!important;
}

/* Guarantee-like block for FAQ soft area */
.tw-faq{max-width:900px;margin:0 auto;display:grid;gap:12px}
.tw-faq details{
  padding:16px 18px!important;
}
.tw-faq summary{font-weight:800;color:var(--mf-ink);cursor:pointer}

/* Legal */
.mf-page:not(.hm-wrap):not(.dm-wrap){
  font-family:"Cairo",Tahoma,Arial,sans-serif!important;
  color:var(--mf-ink)!important;line-height:1.8!important;
  max-width:860px;margin:0 auto;padding:36px 20px 56px!important;
  background:var(--mf-surface);
}

/* ===== Elementor pages — homepage Hostinger feel ===== */
.elementor-invisible,
.elementor-element.elementor-invisible{visibility:visible!important;opacity:1!important}

body.elementor-page .elementor-heading-title,
body.elementor-page .elementor-widget-heading .elementor-heading-title{
  font-family:"Cairo",Tahoma,sans-serif!important;
  font-weight:800!important;
  color:var(--mf-ink);
}
body.elementor-page .elementor-widget-text-editor,
body.elementor-page .elementor-icon-box-description,
body.elementor-page .elementor-icon-box-title{
  font-family:"Cairo",Tahoma,sans-serif!important;
}
body.elementor-page .elementor-button-link .elementor-button,
body.elementor-page a.elementor-button{
  border-radius:999px!important;
  font-family:"Cairo",Tahoma,sans-serif!important;
  font-weight:800!important;
  padding:12px 22px!important;
}
body.elementor-page .elementor-widget-image-box .elementor-image-box-wrapper,
body.elementor-page .elementor-widget-icon-box .elementor-icon-box-wrapper{
  background:#fff;
  border:1px solid var(--mf-line);
  border-radius:var(--mf-radius-lg);
  box-shadow:var(--mf-shadow);
  padding:18px;
}

/* Soft page canvas behind Elementor content */
body.elementor-page #mh-main-area,
body.elementor-page .elementor{
  background:transparent;
}

@media (max-width:980px){
  .hm-hero-inner,.dm-hero-inner,.tw-hero-inner{grid-template-columns:1fr!important;gap:18px!important}
  .hm-hero-media,.dm-hero-media,.mf-hero-media{order:2}
  .dm-grid,.tw-grid-3,.tw-steps,.hm-svc-grid,.hm-feats,.hm-why,.hm-plans{grid-template-columns:1fr 1fr!important}
}
@media (max-width:640px){
  .hm-hero,.dm-hero,.tw-hero,.woo-hero{padding:22px 14px 18px!important}
  .hm-sec,.dm-section,.tw-section,.tw-section[style*="background"]{padding:32px 14px!important}
  .dm-grid,.tw-grid-3,.tw-steps,.hm-svc-grid,.hm-feats,.hm-why,.hm-plans,.hm-feats-6{grid-template-columns:1fr!important}
  .hm-hero .hm-actions,.dm-hero .dm-actions,.tw-hero .tw-actions{display:flex!important;flex-direction:column;width:100%}
  .hm-hero .hm-btn,.dm-hero .dm-btn,.tw-hero .tw-btn{width:100%!important;white-space:normal!important}
}

/* Elementor: force Hostinger homepage canvas */
body.mf-home-theme.elementor-page{
  background:var(--mf-bg)!important;
}
body.mf-home-theme.elementor-page .elementor-widget-heading .elementor-heading-title{
  letter-spacing:0!important;
}
body.mf-home-theme.elementor-page .elementor-button{
  transition:transform .15s ease,box-shadow .15s ease;
}
body.mf-home-theme.elementor-page .elementor-button:hover{
  transform:translateY(-1px);
}
/* Soften common dark marketing heroes toward light homepage when text is already dark */
body.mf-home-theme.elementor-page .elementor-section.elementor-section-boxed > .elementor-container{
  max-width:1320px;
}