/* Mashoor Marketers — Final Theme with Animated Banner */
:root{
  --or:#ff6b35;--re:#c41208;
  --bg1:#0a0d18;--bg2:#0d1020;--bgm:#111525;
  --grad:linear-gradient(135deg,#c41208,#ff6b35);
  --grad2:linear-gradient(90deg,#ff6b35,#ffb347,#ff6b35);
  --silver:#c8cfe0;--gray:#8a92a6;--white:#f0f4ff;
  --font-h:'Barlow Condensed',sans-serif;--font-b:'Barlow',sans-serif;
  --nav-h:72px;--r:8px;--tr:all .25s ease;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-b);background:var(--bg1);color:var(--white);overflow-x:hidden;line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;transition:var(--tr)}

/* Utils */
.container{max-width:1280px;margin:0 auto;padding:0 2rem}
.mm-sec{padding:5rem 2rem}
.bg1{background:var(--bg1)}.bg2{background:var(--bg2)}.bg-mid{background:var(--bgm)}
.tc{text-align:center}.mt4{margin-top:3rem}.mt3d{margin-top:1.5rem;display:inline-block}
.lbl{display:block;font-family:var(--font-h);font-size:12px;font-weight:700;letter-spacing:.3em;color:var(--or);text-transform:uppercase;margin-bottom:.6rem}
h1,h2{font-family:var(--font-h);font-weight:900;text-transform:uppercase;line-height:1}
h2{font-size:clamp(2rem,3.5vw,3.2rem);margin-bottom:.9rem}
h2 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
h3{font-family:var(--font-h);font-weight:700;font-size:1.3rem;text-transform:uppercase;margin-bottom:.6rem}
h4{font-family:var(--font-h);font-weight:700;font-size:1.05rem;text-transform:uppercase;margin-bottom:.4rem}
p{color:var(--silver);font-size:.95rem;line-height:1.7}
.sec-h{margin-bottom:3rem}.sec-h.centered{text-align:center}.sec-h.centered p{max-width:560px;margin:0 auto}
.more{display:inline-block;margin-top:.9rem;font-size:13px;font-weight:600;color:var(--or);letter-spacing:.05em;text-transform:uppercase}
.more:hover{letter-spacing:.12em;color:var(--or)}

/* Buttons */
.btn-p{display:inline-flex;align-items:center;gap:.6rem;background:var(--grad);color:#fff;font-family:var(--font-h);font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.85rem 1.9rem;border-radius:var(--r);box-shadow:0 4px 24px rgba(255,107,53,.4);transition:all .3s;border:none;cursor:pointer}
.btn-p:hover{transform:translateY(-3px);box-shadow:0 12px 36px rgba(255,107,53,.55);color:#fff}
.btn-s{display:inline-flex;align-items:center;gap:.6rem;border:1.5px solid rgba(255,107,53,.5);color:var(--or);font-family:var(--font-h);font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.85rem 1.9rem;border-radius:var(--r);background:transparent;transition:all .3s}
.btn-s:hover{background:rgba(255,107,53,.12);border-color:var(--or);transform:translateY(-2px)}
.btn-xl{padding:1.1rem 2.8rem;font-size:17px}

/* TOP BAR */
.topbar{background:linear-gradient(90deg,#070a14,#0e1120,#070a14);border-bottom:1px solid rgba(255,107,53,.18);padding:.55rem 2rem}
.tb-in{max-width:1280px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.tb-txt{font-size:12px;color:var(--gray);font-family:var(--font-h);letter-spacing:.05em}
.tb-links{display:flex;gap:1.5rem}
.tb-links a{font-size:12px;color:var(--silver);font-weight:500}
.tb-links a:hover{color:var(--or)}

/* NAV */
.mm-nav{position:fixed;top:0;left:0;width:100%;z-index:1000;background:rgba(10,13,24,.95);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,107,53,.12);transition:all .3s}
.mm-nav.scrolled{background:rgba(10,13,24,.99);box-shadow:0 4px 30px rgba(0,0,0,.5)}
body.topbar-active .mm-nav{top:34px}
.nav-in{max-width:1280px;margin:0 auto;height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;padding:0 2rem;gap:1rem}
.nav-logo img,.nav-logo .custom-logo{height:65px;width:auto;display:block}
.nav-ul{display:flex;list-style:none;height:var(--nav-h)}
.nav-ul>li{position:relative}
.nav-ul>li>a{display:flex;align-items:center;gap:.3rem;height:var(--nav-h);padding:0 .85rem;font-family:var(--font-h);font-size:13px;font-weight:600;letter-spacing:.07em;color:var(--gray);text-transform:uppercase;transition:color .2s}
.nav-ul>li>a:hover,.nav-ul>li.act>a,.nav-ul>li.current-menu-item>a,.nav-ul>li.current-menu-ancestor>a{color:var(--or)}
.arr{font-size:10px;opacity:.7}
.dd{display:none;position:absolute;top:var(--nav-h);left:0;background:#0d1020;border:1px solid rgba(255,107,53,.2);border-top:2px solid var(--or);min-width:210px;z-index:200;box-shadow:0 16px 50px rgba(0,0,0,.7);list-style:none;border-radius:0 0 var(--r) var(--r)}
.hdd:hover .dd{display:block}
.dd li a{display:block;padding:.65rem 1.2rem;font-size:13px;color:var(--gray);border-bottom:1px solid rgba(255,255,255,.05);transition:all .2s}
.dd li a:hover{color:var(--or);background:rgba(255,107,53,.07);padding-left:1.6rem}
.nav-r{display:flex;align-items:center;gap:.75rem;flex-shrink:0}
.nav-cta{background:var(--grad);color:#fff;font-family:var(--font-h);font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.55rem 1.3rem;border-radius:var(--r);box-shadow:0 2px 12px rgba(255,107,53,.35);transition:all .2s}
.nav-cta:hover{opacity:.88;transform:translateY(-1px);color:#fff}
.burger{display:none;flex-direction:column;gap:5px;padding:6px;background:none;border:none;cursor:pointer}
.burger span{display:block;width:22px;height:2px;background:var(--gray);transition:var(--tr)}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mob-nav{display:none;position:fixed;top:var(--nav-h);left:0;width:100%;background:#0a0d18;border-top:1px solid rgba(255,107,53,.15);z-index:999;max-height:calc(100vh - var(--nav-h));overflow-y:auto}
.mob-nav.open{display:block}
.mob-ul,.mob-ul *{list-style:none}
.mob-ul a{display:block;padding:.85rem 2rem;color:var(--gray);font-size:14px;border-bottom:1px solid rgba(255,255,255,.05)}
.mob-ul .sub-menu a{padding-left:3rem;font-size:13px}
.mob-ul a:hover{color:var(--or);background:rgba(255,107,53,.05)}
.mob-cta{display:block;padding:1rem 2rem;color:var(--or);font-weight:700;font-family:var(--font-h);letter-spacing:.08em;border-top:1px solid rgba(255,107,53,.2)}

/* PAGE BANNER (inner pages) */
.page-banner{padding:calc(var(--nav-h) + 3.5rem) 2rem 3rem;background:linear-gradient(135deg,#0a0d18,#120d1e,#0d1020);position:relative;overflow:hidden}
.page-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 20% 60%,rgba(196,18,8,.2) 0%,transparent 55%),radial-gradient(ellipse 40% 40% at 80% 30%,rgba(255,107,53,.1) 0%,transparent 50%)}
.page-banner::after{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,107,53,.12) 1px,transparent 1px);background-size:40px 40px;animation:pgd 20s linear infinite}
@keyframes pgd{from{background-position:0 0}to{background-position:40px 40px}}
.page-banner .container{position:relative;z-index:2}
.page-banner h1{font-size:clamp(2.5rem,5vw,4.5rem);margin-bottom:.75rem;animation:slideUp .6s ease both}
.page-banner p{color:var(--silver);max-width:580px;font-size:1.05rem;animation:slideUp .6s .15s ease both}
@keyframes slideUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}

/* ════════════════════════════════════════════
   HERO — ANIMATED BANNER
════════════════════════════════════════════ */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden}

/* Animated background mesh */
.hero-mesh{position:absolute;inset:0;animation:meshP 10s ease-in-out infinite alternate}
@keyframes meshP{
  0%{background:radial-gradient(ellipse 80% 60% at 10% 50%,rgba(196,18,8,.28) 0%,transparent 55%),radial-gradient(ellipse 60% 50% at 90% 20%,rgba(255,107,53,.18) 0%,transparent 50%),var(--bg1)}
  100%{background:radial-gradient(ellipse 90% 70% at 20% 60%,rgba(196,18,8,.38) 0%,transparent 60%),radial-gradient(ellipse 70% 60% at 80% 30%,rgba(255,107,53,.25) 0%,transparent 55%),#0b0e1a}}

/* Animated dot grid */
.hero-dots{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,107,53,.14) 1px,transparent 1px);background-size:40px 40px;animation:dgS 22s linear infinite;mask-image:radial-gradient(ellipse 80% 80% at center,black 30%,transparent 100%)}
@keyframes dgS{from{background-position:0 0}to{background-position:40px 40px}}

/* Canvas */
#hero-cv{position:absolute;inset:0;pointer-events:none;z-index:1}

/* Glowing orbs */
.orb{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
.orb1{width:600px;height:600px;top:-20%;left:-15%;background:radial-gradient(circle,rgba(196,18,8,.32) 0%,transparent 70%);animation:ob1 8s ease-in-out infinite alternate}
.orb2{width:500px;height:500px;bottom:-10%;right:-10%;background:radial-gradient(circle,rgba(255,107,53,.22) 0%,transparent 70%);animation:ob2 10s ease-in-out infinite alternate}
.orb3{width:320px;height:320px;top:35%;right:22%;background:radial-gradient(circle,rgba(255,150,50,.1) 0%,transparent 70%);animation:ob3 7s ease-in-out infinite alternate}
@keyframes ob1{to{transform:translate(40px,-40px) scale(1.2)}}
@keyframes ob2{to{transform:translate(-30px,30px) scale(1.15)}}
@keyframes ob3{to{transform:translate(-20px,-30px)}}

/* Light beams */
.beam{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(255,107,53,.3),transparent)}
.b1{width:60%;top:28%;left:20%;animation:bm 4s ease-in-out infinite}
.b2{width:40%;top:65%;left:35%;animation:bm 6s ease-in-out infinite reverse}
@keyframes bm{0%,100%{opacity:0;transform:scaleX(0)}50%{opacity:1;transform:scaleX(1)}}

/* Hero inner layout */
.hero-wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:4rem;align-items:center;padding:calc(var(--nav-h) + 4.5rem) 2rem 4rem;position:relative;z-index:10;max-width:1280px;margin:0 auto;width:100%}
body.topbar-active .hero-wrap{padding-top:calc(var(--nav-h) + 34px + 4.5rem)}

/* ── LEFT ── */
.hl{animation:sil .8s cubic-bezier(.16,1,.3,1) both}
@keyframes sil{from{opacity:0;transform:translateX(-50px)}to{opacity:1;transform:translateX(0)}}

/* Eyebrow */
.eyb{display:inline-flex;align-items:center;gap:.6rem;background:rgba(255,107,53,.1);border:1px solid rgba(255,107,53,.3);border-radius:99px;padding:.4rem 1.1rem;font-size:12px;font-weight:600;letter-spacing:.2em;color:var(--or);text-transform:uppercase;margin-bottom:1.8rem;animation:pop .5s cubic-bezier(.16,1,.3,1) .3s both}
@keyframes pop{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
.eyd{width:8px;height:8px;border-radius:50%;background:var(--or);box-shadow:0 0 10px var(--or);animation:dp 1.5s ease-in-out infinite}
@keyframes dp{0%,100%{box-shadow:0 0 6px var(--or)}50%{box-shadow:0 0 20px var(--or),0 0 40px rgba(255,107,53,.4)}}

/* Headline with line reveal */
.h1{font-family:var(--font-h);font-weight:900;text-transform:uppercase;line-height:.92;margin-bottom:1.5rem}
.h1l{display:block;font-size:clamp(3.5rem,7vw,7rem);overflow:hidden}
.h1l s{display:block;text-decoration:none;color:#fff;animation:lr .7s cubic-bezier(.16,1,.3,1) both}
.h1l:nth-child(1) s{animation-delay:.4s}
.h1l:nth-child(2) s{animation-delay:.55s}
.h1l:nth-child(3) s{animation-delay:.7s}
@keyframes lr{from{transform:translateY(110%)}to{transform:translateY(0)}}
/* Orange shine text */
.gor{background:var(--grad2) !important;background-size:200% auto !important;-webkit-background-clip:text !important;-webkit-text-fill-color:transparent !important;background-clip:text !important;animation:shine 3s linear infinite}
@keyframes shine{to{background-position:200% center}}

/* Typing row */
.typo-row{font-family:var(--font-h);font-size:clamp(1.4rem,2.5vw,2rem);font-weight:700;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:1.4rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;animation:fu .6s ease .9s both}
#ty-text{color:var(--or);min-width:150px}
.ty-cur{display:inline-block;width:3px;height:1em;background:var(--or);margin-left:2px;animation:bl .7s infinite;vertical-align:middle}
@keyframes bl{0%,100%{opacity:1}50%{opacity:0}}
@keyframes fu{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* Subtext */
.h-sub{font-size:1.05rem;color:rgba(200,210,230,.8);line-height:1.75;max-width:480px;margin-bottom:2.2rem;animation:fu .6s ease 1s both}

/* Buttons */
.h-btns{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2.8rem;animation:fu .6s ease 1.1s both}

/* Stats */
/* ── STATS ROW — Horizontal, number top, label bottom ── */
.h-stats{
  display:flex;
  flex-direction:row;
  align-items:stretch;
  animation:fu .6s ease 1.2s both;
  padding-top:2rem;
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,107,53,.18);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 4px 30px rgba(0,0,0,.3),0 0 20px rgba(255,107,53,.06);
}
.stat-div{
  display:block!important;
  width:1px;
  flex-shrink:0;
  background:linear-gradient(to bottom,transparent,rgba(255,107,53,.3),transparent);
  margin:1.2rem 0;
}
.stat-box{
  flex:1;
  padding:1.8rem 1rem;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  position:relative;
  overflow:hidden;
  transition:all .3s;
  cursor:default;
}
.stat-box::after{
  content:'';
  position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(255,107,53,.08),transparent 70%);
  pointer-events:none;
  opacity:0;
  transition:opacity .3s;
}
.stat-box:hover{ background:rgba(255,107,53,.06); }
.stat-box:hover::after{ opacity:1; }
.stat-n{
  display:block;
  font-family:var(--font-h);
  font-size:3.5rem;
  font-weight:900;
  line-height:1;
  background:var(--grad2);
  background-size:200% auto;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  animation:shine 3s linear infinite;
  filter:drop-shadow(0 0 10px rgba(255,107,53,.3));
}
.stat-l{
  display:block;
  font-size:11px;
  color:rgba(180,195,220,.7);
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:600;
  line-height:1.4;
}

/* ── RIGHT ── */
.hr2{display:flex;justify-content:center;align-items:center;animation:sir .8s cubic-bezier(.16,1,.3,1) .2s both}
@keyframes sir{from{opacity:0;transform:translateX(50px)}to{opacity:1;transform:translateX(0)}}
.hcard{position:relative;width:100%;max-width:430px}
.hc-ring{position:absolute;inset:-20px;border:1px solid rgba(255,107,53,.08);border-radius:24px;animation:rp 3s ease-in-out infinite;z-index:1}
@keyframes rp{0%,100%{border-color:rgba(255,107,53,.06);transform:scale(1)}50%{border-color:rgba(255,107,53,.2);transform:scale(1.02)}}
.hc-main{background:linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,107,53,.25);border-radius:20px;padding:2.5rem;text-align:center;backdrop-filter:blur(20px);position:relative;overflow:hidden;z-index:2;animation:cg 4s ease-in-out infinite alternate}
.hc-main::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,107,53,.06),transparent 60%);pointer-events:none}
@keyframes cg{0%{box-shadow:0 0 60px rgba(255,107,53,.1)}100%{box-shadow:0 0 100px rgba(255,107,53,.25),0 0 40px rgba(196,18,8,.1)}}
.hc-main img,.hc-main .custom-logo{width:230px;max-width:100%;margin:0 auto 1.5rem;filter:drop-shadow(0 0 24px rgba(255,107,53,.4))}
.hc-badges{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}
.hcb{background:rgba(255,107,53,.12);border:1px solid rgba(255,107,53,.28);border-radius:99px;padding:.28rem .85rem;font-size:11px;font-weight:700;color:var(--or);letter-spacing:.06em;text-transform:uppercase;animation:bp2 2.5s ease-in-out infinite alternate}
.hcb:nth-child(2){animation-delay:.5s}.hcb:nth-child(3){animation-delay:1s}
@keyframes bp2{from{border-color:rgba(255,107,53,.25);background:rgba(255,107,53,.08)}to{border-color:rgba(255,107,53,.6);background:rgba(255,107,53,.2)}}

/* Floating cards */
.fc{position:absolute;background:rgba(9,12,22,.93);border:1px solid rgba(255,107,53,.28);border-radius:12px;padding:.75rem 1rem;display:flex;align-items:center;gap:.7rem;backdrop-filter:blur(16px);box-shadow:0 8px 32px rgba(0,0,0,.5);white-space:nowrap;z-index:5}
.fc>span{font-size:1.4rem}
.fc strong{display:block;font-size:.95rem;font-weight:700;color:#fff;font-family:var(--font-h);line-height:1}
.fc small{font-size:.72rem;color:rgba(170,180,200,.7);text-transform:uppercase;letter-spacing:.05em}
.fc1{top:-18px;left:-25px;animation:f1 3s ease-in-out infinite alternate}
.fc2{bottom:-14px;right:-22px;animation:f2 3.5s ease-in-out infinite alternate}
.fc3{top:42%;right:-32px;animation:f3 4s ease-in-out infinite alternate}
@keyframes f1{from{transform:rotate(-2deg)}to{transform:translate(-6px,-10px) rotate(1deg)}}
@keyframes f2{from{transform:rotate(2deg)}to{transform:translate(6px,-8px) rotate(-1deg)}}
@keyframes f3{to{transform:translate(8px,-6px)}}

/* Scroll indicator */
.scroll-ind{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;z-index:20;animation:fu 1s ease 2s both}
.scroll-ind span{font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:rgba(170,180,200,.5)}
.sc-line{width:1px;height:40px;background:linear-gradient(to bottom,var(--or),transparent);animation:scl 1.5s ease-in-out infinite}
@keyframes scl{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* TRUST MARQUEE */
.trust-bar{background:linear-gradient(90deg,#07090f,#0d1020,#07090f);border-top:1px solid rgba(255,107,53,.14);border-bottom:1px solid rgba(255,107,53,.14);overflow:hidden;position:relative}
.trust-bar::before,.trust-bar::after{content:'';position:absolute;top:0;bottom:0;width:120px;z-index:2}
.trust-bar::before{left:0;background:linear-gradient(90deg,#07090f,transparent)}
.trust-bar::after{right:0;background:linear-gradient(-90deg,#07090f,transparent)}
.trust-track{display:flex;gap:3rem;align-items:center;animation:mq 28s linear infinite;width:max-content;padding:.9rem 1.5rem}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tch{display:flex;align-items:center;gap:.5rem;white-space:nowrap;font-size:13px;font-weight:600;color:rgba(200,210,230,.8)}
.td{width:20px;height:20px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff;flex-shrink:0}

/* SERVICES */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.svc-card{background:linear-gradient(135deg,rgba(255,255,255,.04),transparent);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:1.75rem;transition:all .3s;position:relative;overflow:hidden}
.svc-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.svc-card:hover{border-color:rgba(255,107,53,.35);transform:translateY(-6px);background:linear-gradient(135deg,rgba(255,107,53,.07),transparent);box-shadow:0 16px 40px rgba(0,0,0,.3)}
.svc-card:hover::after{transform:scaleX(1)}
.svc-i{width:50px;height:65px;background:var(--grad);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:1rem;box-shadow:0 4px 16px rgba(255,107,53,.3);transition:transform .3s}
.svc-card:hover .svc-i{transform:scale(1.1) rotate(-5deg)}
.svc-card h3{color:var(--white);margin-bottom:.6rem}
.svc-card p{font-size:.88rem;color:var(--gray)}

/* SECTORS */
.sec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.75rem}
.sec-card{border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:2rem;background:linear-gradient(135deg,#111525,#0d1020);transition:all .3s;position:relative}
.sec-card:hover{border-color:rgba(255,107,53,.4);transform:translateY(-8px);box-shadow:0 20px 50px rgba(0,0,0,.4)}
.sc-badge{position:absolute;top:1.1rem;right:1.1rem;background:var(--grad);border-radius:99px;padding:.25rem .9rem;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 2px 10px rgba(255,107,53,.4)}
.sc-ico{font-size:3rem;display:block;margin-bottom:.9rem;transition:transform .3s}
.sec-card:hover .sc-ico{transform:scale(1.15)}
.sec-card p{font-size:.87rem;color:var(--gray);line-height:1.55}

/* PROCESS */
.proc-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;align-items:start;position:relative}
.proc-step{text-align:center;position:relative;z-index:1;padding:0 1rem}
.proc-n{width:70px;height:70px;border-radius:50%;background:var(--grad);font-family:var(--font-h);font-size:1.6rem;font-weight:900;display:flex;align-items:center;justify-content:center;margin:0 auto 1.2rem;color:#fff;box-shadow:0 4px 20px rgba(255,107,53,.4);transition:transform .3s;position:relative;z-index:2}
.proc-step:hover .proc-n{transform:scale(1.1)}
.proc-line{position:absolute;top:35px;left:50%;right:-50%;height:2px;background:rgba(255,107,53,.2);z-index:0}
.pl-fill{height:100%;background:var(--grad);width:0;animation:pla 1s ease .5s forwards}
@keyframes pla{to{width:100%}}
.proc-step p{font-size:.85rem;color:var(--gray)}

/* TESTIMONIALS */
.testi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.tc-card{background:linear-gradient(135deg,rgba(255,255,255,.04),transparent);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:1.75rem;transition:all .3s;position:relative}
.tc-q{position:absolute;top:.5rem;right:1.5rem;font-size:5rem;font-family:Georgia,serif;color:rgba(255,107,53,.1);line-height:1}
.tc-card:hover{border-color:rgba(255,107,53,.3);box-shadow:0 12px 40px rgba(0,0,0,.3);transform:translateY(-4px)}
.stars{color:var(--or);font-size:14px;letter-spacing:2px;margin-bottom:.9rem}
.tc-card blockquote{font-size:.88rem;color:var(--silver);line-height:1.7;font-style:italic;margin-bottom:1.2rem}
.tc-au{display:flex;align-items:center;gap:.75rem}
.av{width:40px;height:40px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;font-family:var(--font-h);font-weight:700;font-size:15px;color:#fff;flex-shrink:0;box-shadow:0 2px 10px rgba(255,107,53,.3)}
.tc-au strong{display:block;font-size:.9rem;color:var(--white)}
.tc-au span{font-size:.8rem;color:var(--gray)}

/* ABOUT */
.ab-flex{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.ab-txt h2{margin-bottom:1.25rem}
.ab-txt p{margin-bottom:1.1rem}
.vals-box{background:linear-gradient(135deg,rgba(255,107,53,.08),rgba(196,18,8,.05));border:1px solid rgba(255,107,53,.2);border-radius:16px;padding:2.5rem;position:relative;box-shadow:0 0 40px rgba(255,107,53,.08)}
.vtag{position:absolute;top:-14px;left:1.5rem;background:var(--grad);border-radius:99px;padding:.28rem 1rem;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.vi{display:flex;align-items:flex-start;gap:.9rem;margin-top:1.2rem}
.v-ico{font-size:1.8rem;flex-shrink:0}
.vi strong{display:block;font-size:.9rem;color:var(--white);margin-bottom:.2rem}
.vi p{font-size:.82rem;color:var(--gray);margin:0}

/* CTA SECTION */
.cta-sec{position:relative;overflow:hidden;padding:6rem 2rem;text-align:center;background:linear-gradient(135deg,#0c0e1e,#0a1020)}
.cta-orbs{position:absolute;inset:0;pointer-events:none}
.co{position:absolute;border-radius:50%;filter:blur(80px)}
.co1{width:500px;height:500px;top:-30%;left:-10%;background:radial-gradient(circle,rgba(196,18,8,.2) 0%,transparent 70%);animation:co1a 8s ease-in-out infinite alternate}
.co2{width:400px;height:400px;bottom:-20%;right:-5%;background:radial-gradient(circle,rgba(255,107,53,.15) 0%,transparent 70%);animation:co2a 10s ease-in-out infinite alternate}
@keyframes co1a{to{transform:translate(30px,-30px) scale(1.15)}}
@keyframes co2a{to{transform:translate(-25px,25px) scale(1.1)}}
.cta-in{position:relative;z-index:1;max-width:760px;margin:0 auto}
.cta-in h2{font-size:clamp(2.2rem,4vw,3.5rem);margin-bottom:1rem}
.cta-in>p{margin-bottom:2.5rem;font-size:1.05rem}
.cta-btns{display:flex;flex-direction:column;align-items:center;gap:1.25rem}
.cta-info{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center}
.cta-info span{font-size:.9rem;color:var(--gray)}

/* CONTACT PAGE */
.contact-wrap{display:grid;grid-template-columns:1fr 360px;gap:4rem;align-items:start}
.cf-wrap h2{margin-bottom:.5rem}
.cf-wrap>p{color:var(--gray);margin-bottom:2rem}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}
.field{margin-bottom:1rem}
.field label{display:block;font-size:.85rem;font-weight:600;color:var(--silver);margin-bottom:.4rem}
.field input,.field select,.field textarea{width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);padding:.8rem 1.1rem;color:var(--white);font-family:var(--font-b);font-size:.93rem;outline:none;transition:all .2s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--or);background:rgba(255,107,53,.05);box-shadow:0 0 0 3px rgba(255,107,53,.1)}
.field input::placeholder,.field textarea::placeholder{color:var(--gray)}
.field select option{background:#0d1020}
.field textarea{resize:vertical;min-height:110px}
.form-msg{margin-top:1rem;font-size:.9rem;padding:.6rem;border-radius:var(--r);text-align:center}
.form-msg.ok{background:rgba(29,158,117,.12);color:#5DCAA5;border:1px solid rgba(29,158,117,.2)}
.form-msg.err{background:rgba(255,107,53,.1);color:#ffaa77;border:1px solid rgba(255,107,53,.2)}
.info-list{display:grid;gap:.75rem;margin-bottom:1.5rem}
.info-row{display:flex;align-items:center;gap:1rem;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:var(--r);padding:1rem 1.2rem;transition:border-color .2s}
.info-row:hover{border-color:rgba(255,107,53,.25)}
.info-row>span{font-size:1.4rem;flex-shrink:0}
.info-row strong{display:block;font-size:.85rem;color:var(--silver);margin-bottom:.2rem}
.info-row a,.info-row em{font-size:.9rem;color:var(--gray);font-style:normal}
.info-row a:hover{color:var(--or)}
.side-box{background:linear-gradient(135deg,rgba(255,255,255,.04),transparent);border:1px solid rgba(255,255,255,.08);border-radius:var(--r);padding:1.25rem 1.4rem;margin-bottom:1rem}
.side-box.orange{border-color:rgba(255,107,53,.22);background:linear-gradient(135deg,rgba(255,107,53,.07),rgba(196,18,8,.04))}
.side-box h4{color:var(--or);margin-bottom:.4rem}
.side-box p{font-size:.85rem;color:var(--gray)}

/* FAQ */
.faq-wrap{display:grid;grid-template-columns:1fr 320px;gap:4rem;align-items:start}
.faq-list{display:grid;gap:.9rem}
.faq-item{background:linear-gradient(135deg,rgba(255,255,255,.03),transparent);border:1px solid rgba(255,255,255,.07);border-radius:12px;overflow:hidden;transition:border-color .25s}
.faq-item.open{border-color:rgba(255,107,53,.25)}
.faq-btn{width:100%;padding:1.2rem 1.4rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;background:none;color:var(--white);font-size:.95rem;font-weight:600;cursor:pointer;text-align:left;transition:color .2s}
.faq-btn:hover{color:var(--or)}
.faq-ic{font-size:20px;color:var(--or);transition:transform .3s;flex-shrink:0}
.faq-item.open .faq-ic{transform:rotate(45deg)}
.faq-ans{padding:.2rem 1.4rem 1.2rem;border-top:1px solid rgba(255,255,255,.06)}
.faq-ans p{font-size:.88rem;color:var(--gray);line-height:1.65}
.faq-side .side-box h3{font-size:1.4rem;margin-bottom:.6rem}
.faq-side .side-box p{margin-bottom:1.25rem}
.big-phone{display:block;font-family:var(--font-h);font-size:1.5rem;font-weight:700;color:var(--or);margin:.5rem 0}

/* ABOUT PAGE */
.about-story{display:grid;grid-template-columns:1.2fr .8fr;gap:5rem;align-items:start}
.story-text p{margin-bottom:1rem}
.story-stats{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.bstat{background:linear-gradient(135deg,rgba(255,255,255,.04),transparent);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:1.75rem;text-align:center;font-size:.85rem;color:var(--gray);text-transform:uppercase;letter-spacing:.06em;transition:all .3s}
.bstat:hover{border-color:rgba(255,107,53,.3)}
.bstat span{display:block;font-family:var(--font-h);font-size:2.8rem;font-weight:900;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.3rem}
.vals-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.75rem}
.val-card{background:linear-gradient(135deg,rgba(255,255,255,.04),transparent);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:2rem;transition:all .3s}
.val-card:hover{border-color:rgba(255,107,53,.3);transform:translateY(-4px)}
.vi-big{font-size:2.2rem;display:block;margin-bottom:.9rem}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.why-card{display:flex;gap:1rem;align-items:flex-start;background:linear-gradient(135deg,rgba(255,255,255,.03),transparent);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:1.5rem;transition:all .3s}
.why-card:hover{border-color:rgba(255,107,53,.28)}
.why-chk{width:32px;height:32px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0;margin-top:.1rem;box-shadow:0 2px 10px rgba(255,107,53,.35)}
.why-card h4{margin-bottom:.35rem;font-size:1rem}
.why-card p{font-size:.85rem;color:var(--gray)}

/* BLOG */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}
.blog-card{background:linear-gradient(135deg,rgba(255,255,255,.04),transparent);border:1px solid rgba(255,255,255,.07);border-radius:14px;overflow:hidden;transition:all .3s}
.blog-card:hover{border-color:rgba(255,107,53,.28);transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
.blog-card img{width:100%;height:200px;object-fit:cover;transition:transform .3s}
.blog-card:hover img{transform:scale(1.04)}
.blog-body{padding:1.5rem}
.blog-date{font-size:.8rem;color:var(--or);font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.blog-body h3{font-size:1.2rem;margin:.5rem 0}
.blog-body h3 a{color:var(--white)}
.blog-body h3 a:hover{color:var(--or)}
.blog-body p{font-size:.875rem;color:var(--gray)}
.pagination{margin-top:3rem;display:flex;justify-content:center;gap:.5rem}
.pagination .page-numbers{padding:.5rem .9rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);color:var(--silver);font-size:.9rem}
.pagination .current{background:var(--grad);color:#fff;border-color:transparent}

/* FOOTER */
.mm-footer{background:linear-gradient(180deg,#0a0c18,#070912);border-top:1px solid rgba(255,255,255,.06)}
.f-top{max-width:1280px;margin:0 auto;padding:4rem 2rem 2rem;display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1.1fr;gap:3rem}
.f-logo img,.f-logo .custom-logo{height:60px;width:auto;margin-bottom:1.2rem}
.f-brand p{font-size:.85rem;color:var(--gray);max-width:260px;line-height:1.65}
.f-soc{display:flex;gap:.6rem;margin-top:1.4rem}
.soc{width:36px;height:36px;border:1px solid rgba(255,255,255,.12);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--gray);transition:all .2s}
.soc:hover{border-color:var(--or);color:var(--or);background:rgba(255,107,53,.1);transform:translateY(-2px)}
.f-col h4{font-family:var(--font-h);font-size:12px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--silver);margin-bottom:1.1rem}
.f-ul{list-style:none}
.f-ul li,.f-ul li a,.f-col a{display:block;font-size:.85rem;color:var(--gray);margin-bottom:.55rem;transition:color .2s}
.f-ul li a:hover,.f-col a:hover{color:var(--or)}
.f-bot{border-top:1px solid rgba(255,255,255,.05);padding:1.4rem 2rem}
.f-bot>div,.f-bot{max-width:1280px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.75rem}
.f-bot p{font-size:.8rem;color:var(--gray)}
.f-bot span{color:var(--or)}

/* Standard page content */
.std-main,.mm-page{padding-top:var(--nav-h)}
.page-content{max-width:860px;padding:4rem 2rem}
.page-content p,.page-content li{color:var(--silver);margin-bottom:.9rem;font-size:.95rem}
.page-content h2,.page-content h3{color:var(--white);margin:2rem 0 .8rem;font-family:var(--font-h);font-weight:900;text-transform:uppercase}
.page-content a{color:var(--or)}
.post-img img{width:100%;max-height:480px;object-fit:cover;border-radius:14px;margin-bottom:2rem}

/* Reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* RESPONSIVE */
@media(max-width:1200px){.f-top{grid-template-columns:1fr 1fr 1fr}.f-brand{grid-column:1/-1}.why-grid{grid-template-columns:1fr 1fr}.svc-grid{grid-template-columns:1fr 1fr}}
@media(max-width:1024px){.sec-grid,.testi-row{grid-template-columns:1fr 1fr}.proc-row{grid-template-columns:1fr 1fr;gap:2.5rem}.proc-line{display:none}.about-story{grid-template-columns:1fr}.story-stats{grid-template-columns:repeat(4,1fr)}.faq-wrap,.contact-wrap{grid-template-columns:1fr}.faq-side{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}}
@media(max-width:900px){.nav-ul,.nav-r .nav-cta{display:none}.burger{display:flex}.hero-wrap{grid-template-columns:1fr;padding-top:calc(var(--nav-h)+3rem);text-align:center}.h-btns{justify-content:center}.h-sub{margin:0 auto 2rem}.eyb{margin:0 auto 1.8rem}.h1l{text-align:center}.typo-row{justify-content:center}.hr2{display:none}.ab-flex{grid-template-columns:1fr;gap:2rem}.vals-grid{grid-template-columns:1fr}.why-grid{grid-template-columns:1fr}}
@media(max-width:768px){.mm-sec{padding:3.5rem 1.5rem}.svc-grid,.sec-grid,.testi-row{grid-template-columns:1fr}.f-row{grid-template-columns:1fr}.f-top{grid-template-columns:1fr 1fr;padding:3rem 1.5rem 1.5rem}.f-brand{grid-column:1/-1}.proc-row{grid-template-columns:1fr 1fr}.tb-txt{display:none}}
@media(max-width:480px){.stat-n{font-size:1.8rem}.proc-row{grid-template-columns:1fr}.f-top{grid-template-columns:1fr}.h-btns{flex-direction:column;align-items:center}.story-stats{grid-template-columns:1fr 1fr}.faq-side{display:block;margin-top:2rem}}

/* ── SERVICE DETAIL PAGES ────────────────────────── */
.svc-detail-wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:4rem;align-items:start}
.svc-detail-text h2{margin-bottom:1rem}
.svc-detail-text p{margin-bottom:1rem}
.svc-detail-side .detail-card{background:linear-gradient(135deg,rgba(255,107,53,.08),rgba(255,255,255,.02));border:1px solid rgba(255,107,53,.2);border-radius:14px;padding:2rem;position:sticky;top:100px}
.svc-detail-side .detail-card h4{color:var(--or);font-size:1.1rem;margin-bottom:1.2rem}
.check-list{list-style:none;display:grid;gap:.65rem}
.check-list li{display:flex;align-items:center;gap:.65rem;font-size:.9rem;color:var(--silver)}
.check-list li::before{content:'✓';width:20px;height:20px;background:var(--grad);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff;flex-shrink:0}

/* Results grid */
.results-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
.result-card{background:linear-gradient(135deg,rgba(255,255,255,.04),transparent);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:2rem;transition:all .3s;text-align:center}
.result-card:hover{border-color:rgba(255,107,53,.3);transform:translateY(-4px)}
.r-ico{font-size:2.5rem;display:block;margin-bottom:1rem}
.result-card h3{margin-bottom:.6rem}
.result-card p{font-size:.88rem;color:var(--gray)}

/* Keywords grid */
.kw-grid{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;max-width:800px;margin:0 auto}
.kw-tag{background:rgba(255,107,53,.1);border:1px solid rgba(255,107,53,.25);border-radius:99px;padding:.5rem 1.2rem;font-size:13px;font-weight:600;color:var(--or);letter-spacing:.04em;transition:all .2s}
.kw-tag:hover{background:rgba(255,107,53,.2);border-color:rgba(255,107,53,.5)}

/* ── OUR WORK PAGE ───────────────────────────────── */
.work-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.work-stat{background:linear-gradient(135deg,rgba(255,107,53,.08),rgba(255,255,255,.02));border:1px solid rgba(255,107,53,.2);border-radius:14px;padding:2rem;text-align:center;transition:all .3s}
.work-stat:hover{border-color:rgba(255,107,53,.4);transform:translateY(-4px)}
.ws-n{display:block;font-family:var(--font-h);font-size:3rem;font-weight:900;background:var(--grad2);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shine 3s linear infinite;line-height:1;margin-bottom:.4rem}
.ws-l{font-size:11px;color:rgba(180,195,220,.7);letter-spacing:.1em;text-transform:uppercase;font-weight:600}

.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.75rem}
.case-card{background:linear-gradient(135deg,rgba(255,255,255,.04),transparent);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:2rem;transition:all .3s;position:relative;overflow:hidden}
.case-card:hover{border-color:rgba(255,107,53,.3);transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,.3)}
.case-sector{font-size:13px;font-weight:700;color:var(--or);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.75rem}
.case-card h3{font-size:1.2rem;margin-bottom:1rem}
.case-challenge{font-size:.875rem;color:var(--gray);margin-bottom:1.25rem;line-height:1.6}
.case-results{display:flex;gap:1rem;margin-bottom:1.25rem;padding:1rem;background:rgba(255,107,53,.06);border-radius:var(--r)}
.cr-item{flex:1;text-align:center}
.cr-item span{display:block;font-family:var(--font-h);font-size:1.5rem;font-weight:900;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;margin-bottom:.2rem}
.cr-item small{font-size:10px;color:var(--gray);text-transform:uppercase;letter-spacing:.06em}
.case-quote{font-size:.85rem;color:var(--silver);font-style:italic;line-height:1.65;border-left:2px solid var(--or);padding-left:.9rem}

/* ── RESPONSIVE ──────────────────────────────────── */
@media(max-width:1024px){.svc-detail-wrap{grid-template-columns:1fr}.svc-detail-side .detail-card{position:static}.work-stats{grid-template-columns:1fr 1fr}.case-grid{grid-template-columns:1fr 1fr}.results-grid{grid-template-columns:1fr 1fr}}
@media(max-width:768px){.work-stats{grid-template-columns:1fr 1fr}.case-grid{grid-template-columns:1fr}.results-grid{grid-template-columns:1fr}}
@media(max-width:480px){.work-stats{grid-template-columns:1fr}}

/* ── HERO CUSTOM IMAGE ───────────────────────────── */
.hero-img-wrap{
  position:relative;
  width:100%;max-width:480px;
}
.hero-custom-img{
  width:100%;
  border-radius:16px;
  border:1px solid rgba(255,107,53,.25);
  box-shadow:0 0 80px rgba(255,107,53,.15),0 20px 60px rgba(0,0,0,.5);
  animation:imgGlow 4s ease-in-out infinite alternate;
  display:block;
}
@keyframes imgGlow{
  0%{box-shadow:0 0 40px rgba(255,107,53,.1),0 20px 60px rgba(0,0,0,.4)}
  100%{box-shadow:0 0 80px rgba(255,107,53,.25),0 20px 60px rgba(0,0,0,.5)}
}
.hero-img-wrap .hc-ring{
  position:absolute;inset:-15px;
  border:1px solid rgba(255,107,53,.1);
  border-radius:22px;
  animation:rp 3s ease-in-out infinite;
  z-index:-1;
}

/* ── NAV DROPDOWN FIX ──────────────────────────── */
.nav-ul > li.has-dd { position:relative; }
.nav-ul > li .dd {
  display:none;
  position:absolute;
  top:72px; left:0;
  background:#0d1020;
  border:1px solid rgba(255,107,53,.2);
  border-top:2px solid var(--or);
  min-width:220px;
  z-index:9999;
  list-style:none;
  border-radius:0 0 10px 10px;
  box-shadow:0 16px 40px rgba(0,0,0,.6);
}
.nav-ul > li.has-dd:hover .dd { display:block; }
.nav-ul > li .dd li a {
  display:block;
  padding:.7rem 1.2rem;
  font-size:13px;
  color:rgba(200,210,230,.85);
  border-bottom:1px solid rgba(255,255,255,.05);
  font-weight:500;
  transition:all .2s;
}
.nav-ul > li .dd li:last-child a { border-bottom:none; }
.nav-ul > li .dd li a:hover {
  color:var(--or);
  background:rgba(255,107,53,.07);
  padding-left:1.6rem;
}
.arr { font-size:10px; opacity:.6; margin-left:2px; transition:transform .3s; }
.has-dd:hover .arr { transform:rotate(180deg); }

/* ── CASE STUDIES ─────────────────────────────── */
.cs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.75rem;
}
.cs-card {
  background: linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 2rem;
  transition: all .3s;
  position: relative;
  overflow: hidden;
}
.cs-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--grad);
  border-radius: 3px 3px 0 0;
}
.cs-card:hover {
  border-color: rgba(255,107,53,.35);
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,.4), 0 0 30px rgba(255,107,53,.08);
}
.cs-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.cs-icon {
  font-size: 2.5rem;
  flex-shrink: 0;
}
.cs-sector {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--or);
  margin-bottom: .2rem;
}
.cs-card h3 {
  font-size: 1.1rem;
  color: var(--white);
  margin-bottom: .2rem;
  font-family: var(--font-h);
  text-transform: uppercase;
}
.cs-location {
  font-size: 12px;
  color: var(--gray);
}
.cs-challenge {
  font-size: .85rem;
  color: var(--gray);
  line-height: 1.6;
  padding: .9rem 1rem;
  background: rgba(255,255,255,.03);
  border-radius: var(--r);
  margin-bottom: 1.25rem;
  border-left: 2px solid rgba(255,107,53,.3);
}
.cs-challenge strong {
  color: var(--silver);
}
.cs-results {
  display: flex;
  gap: .75rem;
  margin-bottom: 1.25rem;
  padding: 1rem;
  background: rgba(255,107,53,.06);
  border-radius: var(--r);
  border: 1px solid rgba(255,107,53,.12);
}
.cs-stat {
  flex: 1;
  text-align: center;
}
.cs-stat span {
  display: block;
  font-family: var(--font-h);
  font-size: 1.4rem;
  font-weight: 900;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: .25rem;
}
.cs-stat small {
  font-size: 10px;
  color: var(--gray);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.cs-quote {
  font-size: .85rem;
  color: var(--silver);
  font-style: italic;
  line-height: 1.65;
  margin-bottom: 1.25rem;
  padding-left: 1rem;
  border-left: 2px solid var(--or);
}
.cs-author {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.cs-av {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--grad);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-h);
  font-weight: 700;
  font-size: 14px;
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 2px 10px rgba(255,107,53,.3);
}
.cs-author strong {
  display: block;
  font-size: .88rem;
  color: var(--white);
}
.cs-author span {
  font-size: .78rem;
  color: var(--gray);
}

@media(max-width:1024px) { .cs-grid { grid-template-columns: 1fr 1fr; } }
@media(max-width:768px)  { .cs-grid { grid-template-columns: 1fr; } }

/* ════════════════════════════════════════════
   BLOG PAGE
════════════════════════════════════════════ */

/* Featured Post */
.blog-featured {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 3rem;
  align-items: center;
  background: linear-gradient(135deg, rgba(255,107,53,.06), rgba(255,255,255,.02));
  border: 1px solid rgba(255,107,53,.2);
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: 4rem;
}
.bf-img-wrap {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16/10;
}
.bf-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s;
}
.blog-featured:hover .bf-img { transform: scale(1.04); }
.bf-no-img {
  background: linear-gradient(135deg, #151820, #1a1e2a);
  display: flex;
  align-items: center;
  justify-content: center;
}
.bf-placeholder { font-size: 5rem; opacity: .3; }
.bf-category {
  position: absolute;
  top: 1rem; left: 1rem;
  background: var(--grad);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .3rem .9rem;
  border-radius: 99px;
}
.bf-content { padding: 2.5rem 2.5rem 2.5rem 0; }
.bf-meta {
  display: flex;
  gap: 1rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}
.bf-meta span { font-size: 12px; color: var(--gray); }
.bf-content h2 {
  font-family: var(--font-h);
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 900;
  text-transform: uppercase;
  line-height: 1.1;
  margin-bottom: 1rem;
}
.bf-content h2 a { color: var(--white); transition: color .2s; }
.bf-content h2 a:hover { color: var(--or); }
.bf-content p { color: var(--gray); font-size: .95rem; line-height: 1.7; margin-bottom: 1.5rem; }

/* Blog Grid */
.blog-grid-wrap { margin-bottom: 3rem; }
.blog-grid-title {
  font-family: var(--font-h);
  font-size: 1.8rem;
  font-weight: 900;
  text-transform: uppercase;
  margin-bottom: 2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.blog-grid-title em { font-style: normal; background: var(--grad); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.blog-main-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.75rem;
}
.blog-card-new {
  background: linear-gradient(135deg, rgba(255,255,255,.04), transparent);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  overflow: hidden;
  transition: all .3s;
}
.blog-card-new:hover {
  border-color: rgba(255,107,53,.3);
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
}
.bcn-img-wrap {
  display: block;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: #151820;
}
.bcn-img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.blog-card-new:hover .bcn-img { transform: scale(1.06); }
.bcn-no-img {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  opacity: .3;
}
.bcn-body { padding: 1.5rem; }
.bcn-meta {
  display: flex;
  justify-content: space-between;
  margin-bottom: .75rem;
  flex-wrap: wrap;
  gap: .4rem;
}
.bcn-meta span { font-size: 11px; color: var(--or); font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.bcn-meta span:last-child { color: var(--gray); }
.bcn-body h3 { font-size: 1.1rem; margin-bottom: .6rem; }
.bcn-body h3 a { color: var(--white); transition: color .2s; }
.bcn-body h3 a:hover { color: var(--or); }
.bcn-body p { font-size: .85rem; color: var(--gray); line-height: 1.6; margin-bottom: 1rem; }
.bcn-link { font-size: 12px; font-weight: 700; color: var(--or); letter-spacing: .05em; text-transform: uppercase; transition: letter-spacing .2s; }
.bcn-link:hover { letter-spacing: .1em; color: var(--or); }

/* Pagination */
.blog-pagination { text-align: center; margin-top: 3rem; }
.blog-pagination .nav-links { display: flex; justify-content: center; gap: .5rem; flex-wrap: wrap; }
.blog-pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--r);
  color: var(--silver);
  font-size: .9rem;
  font-weight: 600;
  transition: all .2s;
}
.blog-pagination .page-numbers.current { background: var(--grad); color: #fff; border-color: transparent; }
.blog-pagination .page-numbers:hover:not(.current) { border-color: var(--or); color: var(--or); }
.blog-pagination .prev,.blog-pagination .next { width: auto; padding: 0 1.2rem; font-family: var(--font-h); letter-spacing: .08em; font-size: 13px; }

/* No Posts */
.no-posts {
  text-align: center;
  padding: 5rem 2rem;
}
.no-posts-icon { font-size: 4rem; display: block; margin-bottom: 1.5rem; }
.no-posts h2 { font-family: var(--font-h); font-size: 2.5rem; text-transform: uppercase; margin-bottom: 1rem; }
.no-posts p  { color: var(--gray); margin-bottom: 2rem; }

/* Blog CTA Bar */
.blog-cta-bar {
  background: linear-gradient(90deg, rgba(196,18,8,.15), rgba(255,107,53,.1));
  border-top: 1px solid rgba(255,107,53,.2);
  border-bottom: 1px solid rgba(255,107,53,.1);
  padding: 2.5rem 2rem;
}
.blog-cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
}
.bcta-text h3 {
  font-family: var(--font-h);
  font-size: 1.6rem;
  font-weight: 900;
  text-transform: uppercase;
  margin-bottom: .3rem;
}
.bcta-text h3 em { font-style: normal; background: var(--grad); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.bcta-text p { color: var(--gray); font-size: .9rem; }

/* ════════════════════════════════════════════
   SINGLE POST PAGE
════════════════════════════════════════════ */
.article-banner { padding-bottom: 3.5rem; }
.article-meta-top {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}
.article-cat {
  background: var(--grad);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .28rem .9rem;
  border-radius: 99px;
}
.article-meta-top span { font-size: 13px; color: var(--gray); }
.article-banner h1 { font-size: clamp(2rem, 4vw, 3.5rem); margin-bottom: .9rem; }
.article-excerpt { color: var(--silver); font-size: 1.05rem; max-width: 700px; }

/* Article Layout */
.article-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 4rem;
  align-items: start;
}
.article-thumb {
  margin-bottom: 2.5rem;
  border-radius: 16px;
  overflow: hidden;
}
.article-thumb img { width: 100%; max-height: 480px; object-fit: cover; }
.article-body { color: var(--silver); line-height: 1.8; }
.article-body h2,.article-body h3 { font-family: var(--font-h); font-weight: 900; text-transform: uppercase; color: var(--white); margin: 2rem 0 .9rem; }
.article-body h2 { font-size: 1.9rem; }
.article-body h3 { font-size: 1.4rem; }
.article-body p  { margin-bottom: 1.1rem; color: var(--silver); }
.article-body ul,.article-body ol { padding-left: 1.5rem; margin-bottom: 1.1rem; }
.article-body li { margin-bottom: .5rem; color: var(--silver); }
.article-body a  { color: var(--or); }
.article-body blockquote { border-left: 3px solid var(--or); padding: 1rem 1.5rem; background: rgba(255,107,53,.06); border-radius: 0 var(--r) var(--r) 0; margin: 1.5rem 0; font-style: italic; color: var(--silver); }
.article-body img { border-radius: var(--r); max-width: 100%; }

/* Tags */
.article-tags { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin: 2rem 0; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.07); }
.article-tags span:first-child { color: var(--gray); font-size: .9rem; }
.atag { background: rgba(255,107,53,.1); border: 1px solid rgba(255,107,53,.2); border-radius: 99px; padding: .25rem .8rem; font-size: 12px; color: var(--or); font-weight: 600; }

/* Author Box */
.author-box { display: flex; align-items: center; gap: 1.25rem; background: linear-gradient(135deg, rgba(255,107,53,.07), rgba(255,255,255,.02)); border: 1px solid rgba(255,107,53,.18); border-radius: 14px; padding: 1.5rem; margin: 2rem 0; }
.author-avatar { width: 54px; height: 54px; border-radius: 50%; background: var(--grad); display: flex; align-items: center; justify-content: center; font-family: var(--font-h); font-size: 18px; font-weight: 700; color: #fff; flex-shrink: 0; }
.author-info strong { display: block; font-size: 1rem; color: var(--white); margin-bottom: .3rem; }
.author-info p { font-size: .85rem; color: var(--gray); margin: 0; }

/* Post Nav */
.post-nav-links { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.07); }
.pnl-card { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.08); border-radius: var(--r); padding: 1.25rem; transition: all .25s; }
.pnl-card:hover { border-color: rgba(255,107,53,.3); background: rgba(255,107,53,.06); }
.pnl-card span { display: block; font-size: 11px; color: var(--or); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: .4rem; }
.pnl-card strong { display: block; font-size: .9rem; color: var(--white); line-height: 1.4; }
.pnl-next { text-align: right; }

/* Sidebar */
.article-sidebar { position: sticky; top: 90px; }
.sidebar-cta { background: linear-gradient(135deg, #1a1030, #0d1525); border: 1px solid rgba(255,107,53,.25); border-radius: 14px; padding: 2rem; position: relative; margin-bottom: 1.5rem; }
.sc-badge { display: inline-block; background: rgba(29,200,120,.15); border: 1px solid rgba(29,200,120,.3); border-radius: 99px; padding: .22rem .8rem; font-size: 11px; font-weight: 700; color: #1dc878; margin-bottom: 1rem; }
.sidebar-cta h4 { font-family: var(--font-h); font-size: 1.4rem; font-weight: 900; text-transform: uppercase; margin-bottom: .6rem; }
.sidebar-cta h4 em { font-style: normal; background: var(--grad); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.sidebar-cta p { font-size: .85rem; color: var(--gray); margin-bottom: 1.25rem; }
.sidebar-widget { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.07); border-radius: 14px; padding: 1.5rem; margin-bottom: 1.5rem; }
.sw-title { font-family: var(--font-h); font-size: 1.2rem; font-weight: 900; text-transform: uppercase; color: var(--white); margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: 1px solid rgba(255,255,255,.07); }
.sw-title em { font-style: normal; background: var(--grad); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.recent-post { display: flex; align-items: center; gap: .75rem; padding: .75rem 0; border-bottom: 1px solid rgba(255,255,255,.05); transition: var(--tr); }
.recent-post:last-child { border-bottom: none; padding-bottom: 0; }
.recent-post:hover { opacity: .8; }
.rp-thumb { width: 56px; height: 44px; border-radius: 6px; overflow: hidden; flex-shrink: 0; background: #151820; }
.rp-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rp-no-img { display: flex; align-items: center; justify-content: center; font-size: 1.2rem; opacity: .4; }
.recent-post strong { display: block; font-size: .82rem; color: var(--white); line-height: 1.4; margin-bottom: .2rem; }
.recent-post span { font-size: .75rem; color: var(--gray); }
.sw-links { list-style: none; }
.sw-links li { border-bottom: 1px solid rgba(255,255,255,.05); }
.sw-links li:last-child { border-bottom: none; }
.sw-links a { display: block; padding: .65rem 0; font-size: .875rem; color: var(--gray); transition: all .2s; }
.sw-links a:hover { color: var(--or); padding-left: .5rem; }

/* Responsive Blog */
@media(max-width:1024px) {
  .article-layout { grid-template-columns: 1fr; }
  .article-sidebar { position: static; }
  .post-nav-links { grid-template-columns: 1fr; }
}
@media(max-width:900px) {
  .blog-featured { grid-template-columns: 1fr; }
  .bf-content { padding: 2rem; }
  .blog-main-grid { grid-template-columns: 1fr 1fr; }
  .blog-cta-inner { flex-direction: column; text-align: center; }
}
@media(max-width:600px) {
  .blog-main-grid { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════
   OUR WORK PAGE
════════════════════════════════════════════ */

/* Hero Stats */
.ow-banner { padding-bottom: 4rem; }
.ow-hero-stats {
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 2.5rem;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,107,53,.2);
  border-radius: 14px;
  overflow: hidden;
  max-width: 700px;
}
.owhs-item {
  flex: 1;
  padding: 1.4rem 1rem;
  text-align: center;
  transition: background .25s;
}
.owhs-item:hover { background: rgba(255,107,53,.07); }
.owhs-sep {
  width: 1px;
  height: 50px;
  background: linear-gradient(to bottom, transparent, rgba(255,107,53,.3), transparent);
  flex-shrink: 0;
}
.owhs-n {
  display: block;
  font-family: var(--font-h);
  font-size: 2.4rem;
  font-weight: 900;
  background: var(--grad2);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  animation: shine 3s linear infinite;
}
.owhs-l {
  font-size: 10px;
  color: rgba(180,195,215,.65);
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 600;
  margin-top: .3rem;
  display: block;
}

/* Full Case Study */
.cs-full {
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 3rem;
  align-items: start;
  margin-bottom: 5rem;
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.cs-full:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.cs-full-reverse { grid-template-columns: 1fr 380px; }
.cs-full-reverse .csf-img { order: 2; }
.cs-full-reverse .csf-content { order: 1; }

/* Case study image side */
.csf-img { display: flex; flex-direction: column; gap: 1rem; }
.csf-img-inner {
  background: linear-gradient(135deg, #151820, #1a1030);
  border: 1px solid rgba(255,107,53,.2);
  border-radius: 16px;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.csf-removals { background: linear-gradient(135deg, #151820, #0d1a15); border-color: rgba(53,200,107,.2); }
.csf-funerals { background: linear-gradient(135deg, #151820, #1a1525); border-color: rgba(150,107,255,.2); }
.csf-sector-icon { font-size: 5rem; opacity: .35; }
.csf-overlay {
  position: absolute;
  bottom: 1rem; left: 1rem;
}
.csf-sector-tag {
  background: var(--grad);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .28rem .9rem;
  border-radius: 99px;
}

/* Results side panel */
.csf-results-side {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
}
.csf-result {
  background: linear-gradient(135deg, rgba(255,107,53,.08), rgba(255,255,255,.02));
  border: 1px solid rgba(255,107,53,.15);
  border-radius: 10px;
  padding: 1rem;
  text-align: center;
  transition: all .25s;
}
.csf-result:hover { border-color: rgba(255,107,53,.35); transform: translateY(-2px); }
.csf-result span {
  display: block;
  font-family: var(--font-h);
  font-size: 1.5rem;
  font-weight: 900;
  background: var(--grad);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: .3rem;
}
.csf-result small {
  font-size: 10px;
  color: var(--gray);
  text-transform: uppercase;
  letter-spacing: .08em;
}

/* Case study content */
.csf-top { margin-bottom: 1.5rem; }
.csf-tag {
  display: inline-block;
  background: var(--grad);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .28rem .9rem;
  border-radius: 99px;
  margin-bottom: .75rem;
}
.csf-tag-removals { background: linear-gradient(135deg, #0d6e3f, #1dc878); }
.csf-tag-funerals { background: linear-gradient(135deg, #4a1d8c, #9b59f5); }
.csf-top h3 {
  font-family: var(--font-h);
  font-size: 1.8rem;
  font-weight: 900;
  text-transform: uppercase;
  color: var(--white);
  line-height: 1.1;
}
.csf-block { margin-bottom: 1.4rem; }
.csf-block h4 {
  font-family: var(--font-h);
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--silver);
  margin-bottom: .65rem;
}
.csf-block p { font-size: .9rem; color: var(--gray); line-height: 1.7; }
.csf-list { list-style: none; display: grid; gap: .5rem; }
.csf-list li {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  font-size: .88rem;
  color: var(--gray);
  line-height: 1.5;
}
.csf-list li::before {
  content: '✓';
  width: 18px; height: 18px;
  background: var(--grad);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 800;
  color: #fff;
  flex-shrink: 0;
  margin-top: 1px;
}
.csf-quote {
  background: linear-gradient(135deg, rgba(255,107,53,.08), rgba(255,255,255,.02));
  border: 1px solid rgba(255,107,53,.2);
  border-left: 3px solid var(--or);
  border-radius: 0 10px 10px 0;
  padding: 1.25rem 1.5rem;
  font-style: italic;
  font-size: .9rem;
  color: var(--silver);
  line-height: 1.7;
  margin-top: 1.5rem;
}
.csf-quote cite {
  display: block;
  margin-top: .6rem;
  font-size: .82rem;
  color: var(--or);
  font-style: normal;
  font-weight: 600;
}

/* Responsive */
@media(max-width:1024px) {
  .cs-full,
  .cs-full-reverse { grid-template-columns: 1fr; gap: 2rem; }
  .cs-full-reverse .csf-img,
  .cs-full-reverse .csf-content { order: unset; }
  .ow-hero-stats { max-width: 100%; }
}
@media(max-width:600px) {
  .owhs-item { padding: 1rem .5rem; }
  .owhs-n { font-size: 1.8rem; }
  .csf-results-side { grid-template-columns: 1fr 1fr; }
}

/* ── PROJECT IMAGE IN CASE STUDY ──────────── */
.csf-img-inner {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
}
.csf-project-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.cs-full:hover .csf-project-img {
  transform: scale(1.04);
}
/* ================================================
   OUR TEAM SECTION — Mashoor Marketers
   About Us Page
   ================================================ */

/* ---------- Section Wrapper ---------- */
.mm-team-section {
    background-color: #0a0a0a;
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}

/* Subtle background pattern */
.mm-team-section::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-image: radial-gradient(circle at 20% 50%, rgba(255, 87, 34, 0.06) 0%, transparent 50%),
                      radial-gradient(circle at 80% 20%, rgba(255, 87, 34, 0.04) 0%, transparent 40%);
    pointer-events: none;
}

/* ---------- Container ---------- */
.mm-team-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 30px;
    position: relative;
    z-index: 1;
}

/* ---------- Section Heading ---------- */
.mm-team-heading {
    text-align: center;
    margin-bottom: 70px;
}

.mm-team-label {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #ff5722;
    margin-bottom: 16px;
}

.mm-team-title {
    font-size: clamp(32px, 5vw, 52px);
    font-weight: 700;
    color: #ffffff;
    line-height: 1.15;
    margin: 0 0 20px 0;
    letter-spacing: -1px;
}

.mm-team-title-accent {
    color: #ff5722;
}

.mm-team-subtitle {
    font-size: 17px;
    color: #888888;
    max-width: 560px;
    margin: 0 auto;
    line-height: 1.7;
}

/* ---------- Team Grid ---------- */
.mm-team-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
}

/* ---------- Team Card ---------- */
.mm-team-card {
    background: #141414;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #1e1e1e;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
    cursor: pointer;
}

.mm-team-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 24px 48px rgba(255, 87, 34, 0.15);
    border-color: rgba(255, 87, 34, 0.3);
}

/* ---------- Card Image Wrapper ---------- */
.mm-team-card-img-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 3.5;
    overflow: hidden;
}

.mm-team-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    transition: transform 0.5s ease;
    display: block;
}

.mm-team-card:hover .mm-team-card-img {
    transform: scale(1.06);
}

/* Subtle gradient overlay at bottom of image */
.mm-team-card-overlay {
    position: absolute;
    bottom: 0; left: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(to top, rgba(20, 20, 20, 0.85), transparent);
    pointer-events: none;
}

/* ---------- Card Info ---------- */
.mm-team-card-info {
    padding: 20px 22px 22px;
    border-top: 2px solid transparent;
    transition: border-color 0.35s ease;
}

.mm-team-card:hover .mm-team-card-info {
    border-top-color: #ff5722;
}

.mm-team-card-name {
    font-size: 17px;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 6px 0;
    letter-spacing: -0.3px;
    transition: color 0.3s ease;
}

.mm-team-card:hover .mm-team-card-name {
    color: #ff5722;
}

.mm-team-card-designation {
    font-size: 13px;
    color: #888888;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-weight: 500;
}

/* ================================================
   RESPONSIVE — Tablet (max 1024px)
   ================================================ */
@media (max-width: 1024px) {
    .mm-team-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 22px;
    }
}

/* ================================================
   RESPONSIVE — Small Tablet (max 768px)
   ================================================ */
@media (max-width: 768px) {
    .mm-team-section {
        padding: 70px 0;
    }

    .mm-team-heading {
        margin-bottom: 50px;
    }

    .mm-team-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }
}

/* ================================================
   RESPONSIVE — Mobile (max 480px)
   ================================================ */
@media (max-width: 480px) {
    .mm-team-section {
        padding: 60px 0;
    }

    .mm-team-container {
        padding: 0 18px;
    }

    .mm-team-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    .mm-team-card-info {
        padding: 14px 16px 16px;
    }

    .mm-team-card-name {
        font-size: 15px;
    }

    .mm-team-card-designation {
        font-size: 11px;
    }
}

/* ================================================
   FOOTER — Serving Countries Text
   Yeh apne footer ke CSS mein paste karein
   ================================================ */

.mm-footer-countries {
    text-align: center;
    padding: 14px 0;
    border-top: 1px solid #1e1e1e;
    margin-top: 30px;
}

.mm-footer-countries p {
    font-size: 13px;
    color: #555555;
    margin: 0;
    letter-spacing: 0.5px;
}

.mm-footer-countries span {
    color: #ff5722;
    font-weight: 600;
}

/* ================================================
   FOOTER CONTACT COLUMN FIX — Mashoor Marketers
   Yeh CSS main.css ke end mein paste karein
   ================================================ */

/* Contact column ko bara karo */
.f-top {
    grid-template-columns: 1.8fr 1fr 1fr 1fr 1.6fr;
}

/* Email aur links properly wrap hon */
.f-col .f-ul li a,
.f-col .f-ul li {
    white-space: normal;
    word-break: break-word;
    font-size: .85rem;
    line-height: 1.6;
}

/* Contact items thoda spacing */
.f-col .f-ul li {
    margin-bottom: .75rem;
}

/* Responsive fix - tablet */
@media (max-width: 1200px) {
    .f-top {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

/* Responsive fix - mobile */
@media (max-width: 768px) {
    .f-top {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 480px) {
    .f-top {
        grid-template-columns: 1fr;
    }
}
/* ================================================
   TEAM SECTION MOBILE FIX — 1 Column
   ================================================ */

@media (max-width: 600px) {
    .mm-team-grid {
        grid-template-columns: 1fr !important;
        gap: 16px;
    }

    .mm-team-card-img-wrap {
        aspect-ratio: 4 / 3;
        max-height: 260px;
    }

    .mm-team-card-img {
        object-position: center top;
    }

    .mm-team-card-info {
        padding: 14px 16px 16px;
    }

    .mm-team-card-name {
        font-size: 16px;
    }

    .mm-team-card-designation {
        font-size: 12px;
    }

    .mm-team-section {
        padding: 50px 0;
    }

    .mm-team-container {
        padding: 0 16px;
    }
}
/* ================================================
   Portfolio System CSS — Mashoor Marketers
   File: assets/css/portfolio.css
   ================================================ */

/* ── GLOBAL ── */
.hidden { display: none !important; }

.mm-pf-wrap,
.mm-pf-public-wrap,
.mm-pf-login-wrap {
    max-width: 1100px;
    margin: 0 auto;
    padding: 2rem 1.5rem 4rem;
}

.mm-pf-card {
    background: #141414;
    border: 1px solid #1e1e1e;
    border-radius: 14px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1rem;
}

/* ── BUTTONS ── */
.mm-pf-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid #2a2a2a;
    background: transparent;
    color: #ccc;
    font-size: 13px;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s;
    font-family: inherit;
}
.mm-pf-btn:hover { background: #1e1e1e; color: #fff; }
.mm-pf-btn-primary { background: #ff5722; color: #fff; border-color: #ff5722; }
.mm-pf-btn-primary:hover { background: #e64a19; border-color: #e64a19; color: #fff; }
.mm-pf-btn-sm { padding: 5px 12px; font-size: 12px; }
.mm-pf-btn-danger { color: #e53935; border-color: #b71c1c; }
.mm-pf-btn-danger:hover { background: rgba(229,57,53,0.1); }
.mm-pf-btn-full { width: 100%; justify-content: center; }

/* ── FORMS ── */
.mm-pf-field { margin-bottom: 14px; }
.mm-pf-field label { display: block; font-size: 12px; color: #888; margin-bottom: 5px; }
.mm-pf-field input,
.mm-pf-field textarea,
.mm-pf-field select {
    width: 100%;
    padding: 9px 13px;
    background: #0d0d0d;
    border: 1px solid #2a2a2a;
    border-radius: 8px;
    color: #eee;
    font-size: 13px;
    font-family: inherit;
    transition: border-color 0.2s;
}
.mm-pf-field input:focus,
.mm-pf-field textarea:focus { outline: none; border-color: #ff5722; }
.mm-pf-field textarea { resize: vertical; min-height: 80px; }
.mm-pf-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mm-pf-section-label { font-size: 11px; text-transform: uppercase; letter-spacing: 1.5px; color: #666; font-weight: 500; margin-bottom: 14px; }

/* ── AVATAR ── */
.mm-pf-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: #2a1a10;
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
}
.mm-pf-avatar-lg { width: 90px; height: 90px; }

/* ── TOPBAR ── */
.mm-pf-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 1.25rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #1e1e1e;
}
.mm-pf-topbar-left { display: flex; align-items: center; gap: 12px; }
.mm-pf-topbar-name { font-size: 15px; font-weight: 500; color: #fff; }
.mm-pf-topbar-role { font-size: 12px; color: #888; margin-top: 2px; }
.mm-pf-topbar-right { display: flex; gap: 8px; flex-wrap: wrap; }

/* ── TABS ── */
.mm-pf-tabs {
    display: flex;
    border-bottom: 1px solid #1e1e1e;
    margin-bottom: 1.25rem;
    overflow-x: auto;
    gap: 0;
}
.mm-pf-tab {
    padding: 9px 16px;
    font-size: 13px;
    color: #888;
    cursor: pointer;
    border: none;
    background: transparent;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    white-space: nowrap;
    font-family: inherit;
    transition: color 0.2s;
}
.mm-pf-tab:hover { color: #ccc; }
.mm-pf-tab.active { color: #ff5722; border-bottom-color: #ff5722; }

/* ── NOTIFY ── */
.mm-pf-notify {
    position: fixed;
    top: 16px;
    right: 16px;
    padding: 10px 18px;
    border-radius: 8px;
    font-size: 13px;
    z-index: 9999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s;
}
.mm-pf-notify.show { opacity: 1; }
.mm-pf-notify-success { background: #ff5722; color: #fff; }
.mm-pf-notify-error   { background: #c62828; color: #fff; }

/* ── PHOTO UPLOAD ── */
.mm-pf-photo-row { display: flex; align-items: center; gap: 16px; margin-bottom: 1rem; }
.mm-pf-upload-box {
    border: 1.5px dashed #2a2a2a;
    border-radius: 10px;
    padding: 1.25rem;
    text-align: center;
    cursor: pointer;
    color: #666;
    font-size: 13px;
    flex: 1;
    transition: border-color 0.2s, background 0.2s;
    position: relative;
}
.mm-pf-upload-box:hover { border-color: #ff5722; background: #1a0e08; color: #ccc; }
.mm-pf-upload-box input[type=file] { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.mm-pf-upload-icon { font-size: 26px; margin-bottom: 6px; }
.mm-pf-upload-sub { font-size: 11px; color: #555; margin-top: 3px; }
.mm-pf-proj-img-preview { width: 100%; max-height: 180px; object-fit: cover; border-radius: 8px; margin-bottom: 8px; display: block; }

/* ── SKILLS ── */
.mm-pf-skill-add-row { display: flex; gap: 8px; margin-bottom: 14px; }
.mm-pf-skill-add-row input { flex: 1; padding: 9px 13px; background: #0d0d0d; border: 1px solid #2a2a2a; border-radius: 8px; color: #eee; font-size: 13px; }
.mm-pf-skill-add-row select { width: 130px; padding: 9px 10px; background: #0d0d0d; border: 1px solid #2a2a2a; border-radius: 8px; color: #eee; font-size: 13px; }
.mm-pf-skills-list { display: flex; flex-wrap: wrap; gap: 6px; }
.mm-pf-skill-badge { display: inline-flex; align-items: center; gap: 5px; padding: 5px 12px; border-radius: 20px; font-size: 12px; font-weight: 500; }
.mm-pf-skill-badge small { opacity: 0.7; font-size: 10px; }
.mm-pf-skill-expert  { background: #2a1208; color: #ff7043; border: 1px solid #ff572244; }
.mm-pf-skill-advanced{ background: #0d1a2e; color: #64b5f6; border: 1px solid #1565c066; }
.mm-pf-skill-other   { background: #1a1a1a; color: #aaa;    border: 1px solid #2a2a2a; }
.mm-pf-skill-remove  { cursor: pointer; color: #666; margin-left: 2px; }
.mm-pf-skill-remove:hover { color: #e53935; }

/* ── PROJECTS GRID ── */
.mm-pf-proj-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mm-pf-proj-card { background: #141414; border: 1px solid #1e1e1e; border-radius: 12px; overflow: hidden; }
.mm-pf-proj-card-img { width: 100%; height: 150px; object-fit: cover; display: block; }
.mm-pf-proj-card-placeholder { width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; background: #0d0d0d; color: #444; font-size: 32px; }
.mm-pf-proj-card-body { padding: 12px 14px; }

/* ── EXPERIENCE / EDUCATION ITEMS ── */
.mm-pf-pub-item { background: #141414; border: 1px solid #1e1e1e; border-radius: 10px; padding: 12px 16px; margin-bottom: 10px; }
.mm-pf-pub-item-title { font-size: 14px; font-weight: 500; color: #fff; }
.mm-pf-pub-item-meta { font-size: 12px; color: #888; margin-top: 3px; }
.mm-pf-pub-item-desc { font-size: 12px; color: #999; margin-top: 8px; line-height: 1.6; }
.mm-pf-proj-link { font-size: 12px; color: #ff5722; display: inline-block; margin-top: 6px; text-decoration: none; }
.mm-pf-proj-link:hover { text-decoration: underline; }

/* ── ALERT ── */
.mm-pf-alert { padding: 10px 14px; border-radius: 8px; font-size: 13px; margin-bottom: 14px; }
.mm-pf-alert-error { background: rgba(198,40,40,0.15); border: 1px solid #c62828; color: #ef9a9a; }

/* ── LOGIN PAGE ── */
.mm-pf-login-wrap { display: flex; align-items: center; justify-content: center; min-height: 70vh; color: #FFFFFF;  }
.mm-pf-login-box { width: 100%; max-width: 380px; }
.mm-pf-login-logo { text-align: center; margin-bottom: 1.5rem; }
.mm-pf-logo-text { font-size: 20px; font-weight: 700; color: #ff5722; }
.mm-pf-login-title { font-size: 24px; font-weight: 600; color: #fff; text-align: center; margin-bottom: 6px; }
.mm-pf-login-sub { font-size: 13px; color: #888; text-align: center; margin-bottom: 1.5rem; }
.mm-pf-login-form { background: #141414; border: 1px solid #1e1e1e; border-radius: 14px; padding: 1.5rem; }
.mm-pf-remember { font-size: 13px; color: #888; margin-bottom: 14px; }
.mm-pf-remember label { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.mm-pf-login-footer { text-align: center; margin-top: 14px; font-size: 13px; }
.mm-pf-login-footer a { color: #ff5722; text-decoration: none; }

/* ── PUBLIC PORTFOLIO ── */
.mm-pf-share-bar { display: flex; align-items: center; justify-content: space-between; background: #141414; border: 1px solid #1e1e1e; border-radius: 10px; padding: 10px 16px; margin-bottom: 1.25rem; }
.mm-pf-share-url { font-size: 12px; color: #888; font-family: monospace; }

.mm-pf-pub-header { display: flex; gap: 1.5rem; align-items: flex-start; background: #141414; border: 1px solid #1e1e1e; border-radius: 14px; padding: 1.5rem; margin-bottom: 1.25rem; }
.mm-pf-pub-avatar { width: 100px; height: 100px; border-radius: 50%; background-size: cover; background-position: center; background-color: #2a1a10; flex-shrink: 0; }
.mm-pf-pub-name { font-size: 24px; font-weight: 600; color: #fff; margin-bottom: 4px; }
.mm-pf-pub-title { font-size: 15px; color: #ff5722; margin-bottom: 4px; }
.mm-pf-pub-tagline { font-size: 13px; color: #aaa; margin-bottom: 8px; }
.mm-pf-pub-label { font-size: 12px; text-transform: uppercase; letter-spacing: 1.5px; color: #ff5722; font-weight: 500; display: block; margin-bottom: 6px; }
.mm-pf-pub-meta { display: flex; gap: 16px; font-size: 13px; color: #888; margin-bottom: 10px; flex-wrap: wrap; }
.mm-pf-pub-meta a { color: #888; text-decoration: none; }
.mm-pf-pub-meta a:hover { color: #ff5722; }
.mm-pf-pub-social { display: flex; flex-wrap: wrap; gap: 8px; }
.mm-pf-social-btn { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 6px; background: #1a1a1a; border: 1px solid #2a2a2a; color: #ccc; font-size: 12px; text-decoration: none; }
.mm-pf-social-btn:hover { border-color: #ff5722; color: #ff5722; }

.mm-pf-pub-about { background: #141414; border: 1px solid #1e1e1e; border-radius: 12px; padding: 1.25rem; margin-bottom: 1.25rem; font-size: 14px; color: #aaa; line-height: 1.8; }

.mm-pf-pub-section { margin-bottom: 1.5rem; }
.mm-pf-pub-section-title { font-size: 18px; font-weight: 500; color: #fff; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid #1e1e1e; }
.mm-pf-pub-skills { display: flex; flex-wrap: wrap; gap: 8px; }

.mm-pf-pub-proj-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mm-pf-pub-proj-card { background: #141414; border: 1px solid #1e1e1e; border-radius: 12px; overflow: hidden; transition: transform 0.2s, box-shadow 0.2s; }
.mm-pf-pub-proj-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(255,87,34,0.12); }
.mm-pf-pub-proj-img { width: 100%; height: 170px; object-fit: cover; display: block; }
.mm-pf-pub-proj-img-placeholder { width: 100%; height: 170px; display: flex; align-items: center; justify-content: center; background: #0d0d0d; color: #333; font-size: 36px; }
.mm-pf-pub-proj-body { padding: 14px; }
.mm-pf-pub-proj-title { font-size: 14px; font-weight: 500; color: #fff; }
.mm-pf-pub-proj-meta { font-size: 12px; color: #888; margin-top: 3px; }
.mm-pf-pub-proj-desc { font-size: 12px; color: #999; margin-top: 8px; line-height: 1.6; }

.mm-pf-pub-certs { display: flex; flex-direction: column; gap: 10px; }
.mm-pf-pub-cert { display: flex; align-items: center; gap: 12px; background: #141414; border: 1px solid #1e1e1e; border-radius: 10px; padding: 12px 16px; }
.mm-pf-pub-cert-icon { font-size: 24px; flex-shrink: 0; }

/* ── TEAM GRID (all portfolios) ── */
.mm-pf-team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.mm-pf-team-card { background: #141414; border: 1px solid #1e1e1e; border-radius: 14px; overflow: hidden; text-decoration: none; transition: transform 0.2s, box-shadow 0.2s; }
.mm-pf-team-card:hover { transform: translateY(-6px); box-shadow: 0 16px 40px rgba(255,87,34,0.15); border-color: rgba(255,87,34,0.3); }
.mm-pf-team-card-img { width: 100%; height: 200px; background-size: cover; background-position: center top; background-color: #1a1a1a; }
.mm-pf-team-card-body { padding: 14px; }
.mm-pf-team-card-name { font-size: 15px; font-weight: 500; color: #fff; margin-bottom: 4px; }
.mm-pf-team-card-role { font-size: 12px; color: #ff5722; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
    .mm-pf-form-row { grid-template-columns: 1fr; }
    .mm-pf-proj-grid { grid-template-columns: 1fr; }
    .mm-pf-pub-proj-grid { grid-template-columns: 1fr; }
    .mm-pf-team-grid { grid-template-columns: repeat(2, 1fr); }
    .mm-pf-pub-header { flex-direction: column; align-items: center; text-align: center; }
    .mm-pf-topbar { flex-direction: column; gap: 12px; align-items: flex-start; }
    .mm-pf-photo-row { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 480px) {
    .mm-pf-team-grid { grid-template-columns: 1fr 1fr; }
    .mm-pf-pub-meta { flex-direction: column; gap: 6px; }
}
/* ================================================
   PORTFOLIO WHITE THEME
   ================================================ */

.mm-pf-wrap,
.mm-pf-public-wrap,
.mm-pf-login-wrap {
    background: #ffffff;
}

.mm-pf-card {
    background: #f8f8f8;
    border-color: #e0e0e0;
}

.mm-pf-topbar {
    border-bottom-color: #e0e0e0;
}

.mm-pf-topbar-name { color: #111111; }
.mm-pf-topbar-role { color: #555555; }

.mm-pf-tabs {
    border-bottom-color: #e0e0e0;
}

.mm-pf-tab { color: #555555; }
.mm-pf-tab:hover { color: #111; }
.mm-pf-tab.active { color: #ff5722; border-bottom-color: #ff5722; }

.mm-pf-section-label { color: #888888; }

.mm-pf-field label { color: #555555; }

.mm-pf-field input,
.mm-pf-field textarea,
.mm-pf-field select {
    background: #ffffff;
    border-color: #d0d0d0;
    color: #111111;
}

.mm-pf-field input:focus,
.mm-pf-field textarea:focus {
    border-color: #ff5722;
}

.mm-pf-btn {
    border-color: #d0d0d0;
    color: #333333;
    background: #ffffff;
}
.mm-pf-btn:hover { background: #f0f0f0; color: #111; }

.mm-pf-skill-add-row input,
.mm-pf-skill-add-row select {
    background: #ffffff;
    border-color: #d0d0d0;
    color: #111111;
}

.mm-pf-skill-other {
    background: #f0f0f0;
    color: #333;
    border-color: #d0d0d0;
}

.mm-pf-pub-item {
    background: #f8f8f8;
    border-color: #e0e0e0;
}
.mm-pf-pub-item-title { color: #111111; }
.mm-pf-pub-item-meta  { color: #666666; }
.mm-pf-pub-item-desc  { color: #555555; }

.mm-pf-proj-card {
    background: #f8f8f8;
    border-color: #e0e0e0;
}
.mm-pf-proj-card-placeholder {
    background: #eeeeee;
    color: #aaaaaa;
}

.mm-pf-pub-header {
    background: #f8f8f8;
    border-color: #e0e0e0;
}
.mm-pf-pub-name    { color: #111111; }
.mm-pf-pub-tagline { color: #555555; }
.mm-pf-pub-about {
    background: #f8f8f8;
    border-color: #e0e0e0;
    color: #444444;
}

.mm-pf-pub-section-title {
    color: #111111;
    border-bottom-color: #e0e0e0;
}

.mm-pf-pub-proj-card {
    background: #f8f8f8;
    border-color: #e0e0e0;
}
.mm-pf-pub-proj-title { color: #111111; }
.mm-pf-pub-proj-meta  { color: #666666; }
.mm-pf-pub-proj-desc  { color: #555555; }
.mm-pf-pub-proj-img-placeholder {
    background: #eeeeee;
    color: #aaaaaa;
}

.mm-pf-pub-cert {
    background: #f8f8f8;
    border-color: #e0e0e0;
}

.mm-pf-share-bar {
    background: #f8f8f8;
    border-color: #e0e0e0;
}
.mm-pf-share-url { color: #555555; }

.mm-pf-social-btn {
    background: #f0f0f0;
    border-color: #d0d0d0;
    color: #333333;
}

.mm-pf-login-form {
    background: #f8f8f8;
    border-color: #e0e0e0;
}
.mm-pf-login-title { color: #111111; }
.mm-pf-login-sub   { color: #666666; }
.mm-pf-remember    { color: #666666; }

.mm-pf-team-card {
    background: #f8f8f8;
    border-color: #e0e0e0;
}
.mm-pf-team-card-name { color: #111111; }