/* ===== شركة فرنك - صيانة أفران الغاز | WHITE & BLUE & ORANGE THEME ===== */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;900&family=Tajawal:wght@400;700;900&display=swap');

:root{
  --blue1:#1a56db;
  --orange1:#dc2626;
  --orange2:#ff6b35;
  --blue2:#1e40af;
  --blue3:#2563eb;
  --blue4:#3b82f6;
  --blue5:#60a5fa;
  --blue6:#bfdbfe;
  --blue7:#dbeafe;
  --white:#ffffff;
  --gray1:#f8fafc;
  --gray2:#f1f5f9;
  --gray3:#e2e8f0;
  --gray4:#cbd5e1;
  --gray5:#94a3b8;
  --gray6:#64748b;
  --gray7:#334155;
  --gray8:#1e293b;
  --gray9:#0f172a;
  --green:#16a34a;
  --green-light:#22c55e;
  --radius:14px;
  --radius-sm:10px;
  --shadow-sm:0 1px 3px rgba(0,0,0,.07),0 1px 2px rgba(0,0,0,.05);
  --shadow-md:0 4px 16px rgba(30,64,175,.09);
  --shadow-lg:0 8px 28px rgba(30,64,175,.11);
  --shadow-blue:0 0 32px rgba(37,99,235,0.10);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--gray1);color:var(--gray7);font-family:'Cairo',sans-serif;direction:rtl;line-height:1.6;font-size:13px;overflow-x:hidden;}
a{text-decoration:none;color:inherit}
img,video{max-width:100%;display:block}

.pgbar{position:fixed;top:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue2),var(--blue4),var(--blue5));z-index:9999;transition:width .1s;width:0;box-shadow:0 0 8px rgba(37,99,235,0.35)}

.waf{position:fixed;bottom:20px;left:16px;z-index:1000;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.wdot{width:8px;height:8px;background:var(--green-light);border-radius:50%;animation:wdotPulse 2s infinite;margin-right:2px}
@keyframes wdotPulse{0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.6)}50%{box-shadow:0 0 0 7px rgba(34,197,94,0)}}
.wafb{display:flex;align-items:center;gap:7px;background:linear-gradient(135deg,var(--green-light),var(--green));color:#fff;font-weight:800;font-size:12px;padding:9px 15px;border-radius:50px;font-family:'Cairo',sans-serif;box-shadow:0 5px 20px rgba(22,163,74,.3);transition:.3s}
.wafb:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 8px 26px rgba(22,163,74,.45)}

.stt{position:fixed;bottom:20px;right:16px;z-index:999;background:linear-gradient(135deg,var(--blue1),var(--blue3));color:#fff;border:none;border-radius:50%;width:34px;height:34px;font-size:13px;cursor:pointer;display:none;font-weight:900;box-shadow:var(--shadow-md);transition:.3s}
.stt.show{display:block}
.stt:hover{transform:translateY(-2px) scale(1.08);box-shadow:var(--shadow-lg)}

nav#mainnav{position:fixed;top:0;right:0;left:0;z-index:900;display:flex;align-items:center;justify-content:space-between;padding:0 5%;height:66px;transition:.4s;background:rgba(255,255,255,0.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--gray3);box-shadow:0 2px 12px rgba(30,64,175,.07);}
nav#mainnav.scrolled{background:#fff;backdrop-filter:blur(20px);box-shadow:0 2px 18px rgba(30,64,175,.12);border-bottom:1px solid var(--gray3);}
.nlogo{display:flex;align-items:center;gap:10px}
.nlogo-icon{font-size:24px}
.nlogo-txt strong{display:block;font-size:16px;font-weight:900;color:var(--blue2);letter-spacing:-.4px}
.nlogo-txt span{display:block;font-size:11px;color:var(--gray5);letter-spacing:.05em;margin-top:1px}
.nlinks{display:flex;align-items:center;gap:2px}
.nbtn{padding:6px 11px;border-radius:8px;font-size:11px;font-weight:700;color:var(--gray6);transition:.25s;font-family:'Cairo',sans-serif}
.nbtn:hover,.nbtn.an{color:var(--blue1);background:var(--blue7)}
.ncta{background:linear-gradient(135deg,var(--blue1),var(--blue2));color:#fff!important;font-weight:900;border-radius:10px;padding:7px 16px;box-shadow:var(--shadow-md)}
.ncta:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.mob{display:none;background:none;border:1px solid var(--gray3);color:var(--gray7);padding:6px 10px;border-radius:9px;font-size:16px;cursor:pointer}

.mmenu{display:none;position:fixed;top:58px;right:0;left:0;background:rgba(255,255,255,0.98);backdrop-filter:blur(20px);z-index:800;padding:14px 5%;border-bottom:1px solid var(--gray3);box-shadow:0 8px 24px rgba(30,64,175,.07)}
.mmenu a{display:block;padding:11px 0;border-bottom:1px solid var(--gray3);color:var(--gray6);font-weight:700;font-size:13px}
.mmenu a:last-child{border:none}
.mmenu .mcta{color:var(--blue1)!important;font-weight:900}

.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding-top:58px;background:linear-gradient(160deg,#eef4ff 0%,#ffffff 50%,#f8fafc 100%)}
.hbg{position:absolute;inset:0}
.hgrid{position:absolute;inset:0;background-image:linear-gradient(rgba(37,99,235,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.04) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse at center,black 30%,transparent 75%)}
.hero-bg-img{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-bg-img img{width:100%;height:100%;object-fit:cover;opacity:.05;filter:blur(2px)}
.hero-bg-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(238,244,255,.97) 0%,rgba(255,255,255,.93) 100%)}
.hin{position:relative;z-index:2;width:92%;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.15fr 0.85fr;gap:36px;align-items:center;padding:36px 0 52px}
.hero-text-col{display:flex;flex-direction:column;align-items:flex-start}
.htag{display:inline-flex;align-items:center;gap:7px;background:var(--blue7);border:1px solid var(--blue6);border-radius:50px;padding:5px 14px;font-size:10px;color:var(--blue2);font-weight:800;margin-bottom:15px;letter-spacing:.03em}
.htag-dot{width:6px;height:6px;background:var(--blue3);border-radius:50%;animation:pulse 2s infinite;flex-shrink:0}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(0.8)}}
.hh1{font-size:clamp(20px,2.8vw,36px);font-weight:900;line-height:1.15;margin-bottom:12px;font-family:'Cairo',sans-serif;letter-spacing:-.4px;color:var(--gray8)}
.hh1 .acc{color:var(--blue1);position:relative;display:inline-block}
.hh1 .acc::after{content:'';position:absolute;bottom:-3px;right:0;left:0;height:2px;background:linear-gradient(90deg,var(--blue1),var(--blue4),transparent);border-radius:2px}
.hp{font-size:12px;color:var(--gray6);margin-bottom:18px;line-height:1.8;max-width:480px}
.hbtns{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.hero-call-btn{display:inline-flex;align-items:center;gap:7px;background:#dc2626;color:#fff;font-weight:900;font-size:12px;padding:11px 20px;border-radius:10px;font-family:'Cairo',sans-serif;box-shadow:0 4px 16px rgba(220,38,38,.3);transition:.3s;text-decoration:none}
.hero-call-btn:hover{transform:translateY(-2px);box-shadow:0 7px 24px rgba(220,38,38,.42)}
.hero-wa-btn{display:inline-flex;align-items:center;gap:7px;background:#25D366;color:#fff;font-weight:900;font-size:12px;padding:11px 18px;border-radius:10px;font-family:'Cairo',sans-serif;box-shadow:0 4px 16px rgba(37,211,102,.27);transition:.3s;text-decoration:none}
.hero-wa-btn:hover{transform:translateY(-2px);box-shadow:0 7px 24px rgba(37,211,102,.4)}
.bow{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--blue4);color:var(--blue1);font-weight:700;font-size:12px;padding:9px 16px;border-radius:10px;transition:.3s;font-family:'Cairo',sans-serif;background:var(--blue7);text-decoration:none}
.bow:hover{background:var(--blue6);border-color:var(--blue2);transform:translateY(-2px)}
.hstats{display:flex;gap:18px;flex-wrap:wrap}
.hs{display:flex;flex-direction:column}
.hsn{font-size:16px;font-weight:900;color:var(--blue1);line-height:1}
.hsl{font-size:10px;color:var(--gray5);margin-top:2px;font-weight:600}

.hvis{position:relative;padding-bottom:24px}
.himg-wrap{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 18px 54px rgba(30,64,175,.13),0 0 0 1px var(--blue6)}
.himg-wrap img{width:100%;height:320px;object-fit:cover;display:block}
.himg-overlay{position:absolute;top:0;right:0;left:0;padding:14px 18px;background:linear-gradient(rgba(15,23,42,.75),transparent)}
.himg-overlay span{display:block;font-size:12px;font-weight:900;color:#fff;margin-bottom:3px}
.himg-overlay p{font-size:10px;color:rgba(255,255,255,.8)}
.hbadge{position:absolute;bottom:4px;left:0;background:var(--white);border:1px solid var(--blue6);border-radius:12px;padding:10px 14px;display:flex;align-items:center;gap:9px;box-shadow:var(--shadow-lg)}
.hbadge-icon{font-size:16px}
.hbadge-txt strong{display:block;font-size:11px;font-weight:900;color:var(--blue1)}
.hbadge-txt span{font-size:10px;color:var(--gray7);font-weight:600}

.urgency-bar{background:linear-gradient(135deg,var(--blue2),var(--blue1),var(--blue3));padding:9px 5%;text-align:center;position:relative;overflow:hidden}
.breadcrumb{padding:12px 5%;background:var(--gray2);border-bottom:1px solid var(--gray3);font-size:11px;color:var(--gray5);margin-top:58px}
.urgency-bar::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);animation:shimmer 3s ease-in-out infinite}
@keyframes shimmer{0%,100%{transform:translateX(-100%)}50%{transform:translateX(100%)}}

.band{background:linear-gradient(90deg,var(--gray2),var(--white),var(--gray2));border-top:1px solid var(--gray3);border-bottom:1px solid var(--gray3);padding:18px 5%}
.bandin{max-width:1100px;margin:0 auto;display:flex;justify-content:space-around;flex-wrap:wrap;gap:12px}
.bstat{text-align:center}
.bn{font-size:16px;font-weight:900;color:var(--blue1);display:block;line-height:1}
.bl2{font-size:10px;color:var(--gray5);margin-top:3px;font-weight:700}

.sec{padding:28px 5%;background:var(--white)}
.sec.alt{background:var(--gray2)}
.sec-inner{max-width:1240px;margin:0 auto}
.sh{margin-bottom:22px}
.sh.c{text-align:center}
.sl{display:inline-block;background:var(--blue7);border:1px solid var(--blue6);color:var(--blue2);font-size:9px;font-weight:800;padding:3px 12px;border-radius:50px;margin-bottom:9px;letter-spacing:.08em;text-transform:uppercase}
.st{font-size:clamp(14px,1.8vw,20px);font-weight:900;line-height:1.18;margin-bottom:10px;font-family:'Cairo',sans-serif;color:var(--gray8)}
.sd{font-size:12px;color:var(--gray6);max-width:540px;margin:0 auto;line-height:1.7}
.sh.c .sd{margin:0 auto}

.sgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.sc{background:var(--white);border:1px solid var(--gray3);border-radius:var(--radius);overflow:hidden;transition:.35s;position:relative;box-shadow:var(--shadow-sm)}
.sc::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(37,99,235,0) 0%,rgba(37,99,235,.02) 100%);opacity:0;transition:.3s;pointer-events:none}
.sc:hover{border-color:var(--blue4);transform:translateY(-4px);box-shadow:var(--shadow-lg),var(--shadow-blue)}
.sc:hover::before{opacity:1}
.sc-img{width:100%;height:180px;object-fit:cover;transition:.5s}
.sc:hover .sc-img{transform:scale(1.04)}
.sc-body{padding:12px}
.sc-icon{font-size:18px;margin-bottom:6px}
.sc-title{font-size:13px;font-weight:900;color:var(--gray8);margin-bottom:5px}
.sc-text{font-size:11px;color:var(--gray6);line-height:1.65;margin-bottom:10px}
.sc-tag{background:var(--blue7);color:var(--blue2);font-size:9px;font-weight:800;padding:3px 10px;border-radius:50px;border:1px solid var(--blue6);display:inline-block}

/* Service card images */
.sc-photo{height:160px;overflow:hidden;border-radius:12px 12px 0 0;position:relative}
.sc-photo img{width:100%;height:100%;object-fit:cover;transition:.4s}
.sc:hover .sc-photo img{transform:scale(1.05)}

.types-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.tcard{background:var(--white);border:1px solid var(--gray3);border-radius:var(--radius);padding:16px 13px;text-align:center;transition:.3s;cursor:default;box-shadow:var(--shadow-sm)}
.tcard:hover{border-color:var(--blue4);background:var(--blue7);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.tcard-icon{font-size:16px;margin-bottom:6px;display:block}
.tcard-title{font-size:12px;font-weight:900;color:var(--blue2);margin-bottom:5px}
.tcard-text{font-size:10px;color:var(--gray6);line-height:1.5}

/* Video gallery – portrait videos */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.gcard{position:relative;border-radius:12px;overflow:hidden;background:var(--gray3)}
.gcard img{width:100%;height:100%;object-fit:cover;transition:.4s}
.gcard:hover img{transform:scale(1.06)}
.gcard-label{position:absolute;bottom:0;right:0;left:0;padding:12px;background:linear-gradient(transparent,rgba(15,23,42,.82));font-size:11px;font-weight:800;color:#fff}
/* Portrait video wrapper – original ratio 9:16 */
.gcard-video{aspect-ratio:9/16;max-width:280px;margin:0 auto}
.gcard-video video{width:100%;height:100%;object-fit:contain;background:#000;display:block}
.vid-sound-btn{background:rgba(0,0,0,0.65);color:#fff;border-radius:50px;min-width:36px;height:36px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer;z-index:10;transition:.2s;user-select:none;-webkit-user-select:none;border:2px solid rgba(255,255,255,0.4);box-shadow:0 2px 8px rgba(0,0,0,0.4);touch-action:manipulation}
.vid-sound-btn:hover{background:rgba(0,0,0,0.88);transform:scale(1.08);border-color:rgba(255,255,255,0.7)}
/* Gallery row – 2 portrait videos + 4 images */
.gallery-wrap{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
.gallery-videos{display:flex;gap:14px;justify-content:center}
.gallery-images{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gallery-images .gcard{aspect-ratio:4/3}

.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.step{background:var(--white);border:1px solid var(--gray3);border-radius:var(--radius);padding:20px 16px;text-align:center;transition:.3s;box-shadow:var(--shadow-sm)}
.step:hover{border-color:var(--blue4);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.step-n{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--blue1),var(--blue3));color:#fff;font-size:13px;font-weight:900;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;box-shadow:0 4px 14px rgba(37,99,235,.27)}
.step-title{font-size:13px;font-weight:900;margin-bottom:6px;color:var(--gray8)}
.step-text{font-size:11px;color:var(--gray6);line-height:1.65}

.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.wcard{background:var(--white);border:1px solid var(--gray3);border-radius:var(--radius);padding:18px 16px;transition:.3s;box-shadow:var(--shadow-sm)}
.wcard:hover{border-color:var(--blue4);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.wcard-icon{font-size:16px;margin-bottom:8px;display:block}
.wcard-title{font-size:13px;font-weight:900;color:var(--blue2);margin-bottom:8px}
.wcard-text{font-size:11px;color:var(--gray6);line-height:1.65}

.testimonials-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.testi-card{background:var(--white);border:1px solid var(--gray3);border-radius:var(--radius);padding:22px;transition:.3s;box-shadow:var(--shadow-sm)}
.testi-card:hover{border-color:var(--blue4);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.testi-stars{color:#f59e0b;font-size:12px;margin-bottom:10px;letter-spacing:2px}
.testi-text{font-size:12px;color:var(--gray6);line-height:1.75;margin-bottom:12px;font-style:italic}
.testi-name{font-size:12px;font-weight:900;color:var(--gray8)}
.testi-role{font-size:10px;color:var(--gray5);margin-top:2px}

.cta-box{background:linear-gradient(135deg,var(--blue2),var(--blue1),var(--blue3));border:none;border-radius:18px;padding:40px 28px;text-align:center;position:relative;overflow:hidden}
.cta-box::before{content:'';position:absolute;top:-80px;left:50%;transform:translateX(-50%);width:500px;height:240px;background:radial-gradient(ellipse,rgba(255,255,255,.07) 0%,transparent 70%);pointer-events:none}
.cta-box h2{font-size:clamp(15px,1.8vw,22px);font-weight:900;margin-bottom:10px;position:relative;color:#fff}
.cta-box p{font-size:12px;color:rgba(255,255,255,.82);margin-bottom:18px;max-width:460px;margin-left:auto;margin-right:auto;line-height:1.75}
.phone-big{display:block;font-size:clamp(14px,2.2vw,24px);font-weight:900;color:#fff;margin-bottom:22px;direction:ltr}
.cta-btn{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--blue1);font-weight:900;font-size:13px;padding:12px 24px;border-radius:12px;font-family:'Cairo',sans-serif;box-shadow:0 6px 22px rgba(0,0,0,.14);transition:.3s}
.cta-btn:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(0,0,0,.18)}

/* Map iframe */
.map-iframe-wrap{border-radius:16px;overflow:hidden;box-shadow:0 10px 40px rgba(30,64,175,.16);border:2px solid var(--blue6)}
.map-iframe-wrap iframe{display:block;width:100%;height:340px;border:none}

.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:14px}
.citem{display:flex;align-items:flex-start;gap:14px;background:var(--white);border:1px solid var(--gray3);border-radius:12px;padding:16px;transition:.3s;box-shadow:var(--shadow-sm)}
.citem:hover{border-color:var(--blue4);box-shadow:var(--shadow-md)}
.citem-icon{font-size:20px;min-width:34px;margin-top:2px}
.citem-title{font-size:10px;color:var(--gray5);margin-bottom:3px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.citem-val{font-size:13px;font-weight:800;color:var(--gray8)}
.citem-val a{color:var(--blue1);transition:.2s}
.citem-val a:hover{color:var(--blue2)}

.breadcrumb a{color:var(--blue1);font-weight:700}
.breadcrumb span{margin:0 6px}

.phero{background:radial-gradient(ellipse 70% 50% at 50% 0%,rgba(37,99,235,.06) 0%,transparent 60%),linear-gradient(160deg,var(--blue7) 0%,var(--white) 100%);padding:100px 5% 48px;border-bottom:1px solid var(--gray3);position:relative;overflow:hidden}
.phero .phero-inner{max-width:760px;margin:0 auto;text-align:center;position:relative;z-index:1}
.phero h1{font-size:clamp(19px,2.6vw,32px);font-weight:900;margin-bottom:14px;line-height:1.22;color:var(--gray8)}
.phero p{font-size:13px;color:var(--gray6);max-width:500px;margin:0 auto;line-height:1.8}

.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.blog-card{background:var(--white);border:1px solid var(--gray3);border-radius:var(--radius);overflow:hidden;transition:.3s;box-shadow:var(--shadow-sm)}
.blog-card:hover{border-color:var(--blue4);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.blog-card-img{width:100%;height:145px;object-fit:cover;transition:.4s}
.blog-card:hover .blog-card-img{transform:scale(1.04)}
.blog-card-body{padding:13px}
.blog-cat{display:inline-block;background:var(--blue7);color:var(--blue2);font-size:9px;font-weight:800;padding:3px 11px;border-radius:50px;border:1px solid var(--blue6);margin-bottom:9px}
.blog-card-body h3{font-size:13px;font-weight:900;margin-bottom:7px;color:var(--gray8);line-height:1.4}
.blog-card-body p{font-size:11px;color:var(--gray6);line-height:1.65;margin-bottom:9px}
.blog-meta{font-size:10px;color:var(--gray5);display:flex;align-items:center;gap:7px}
.blog-read-more{display:inline-flex;align-items:center;gap:5px;color:var(--blue1);font-weight:800;font-size:11px;margin-top:10px;transition:.2s}
.blog-read-more:hover{color:var(--blue2)}
.blog-card-title{font-size:13px;font-weight:900;color:var(--gray8);margin-bottom:7px;line-height:1.4}
.blog-card-title a{color:inherit;text-decoration:none}
.blog-card-title a:hover{color:var(--blue1)}
.blog-card-text{font-size:11px;color:var(--gray6);line-height:1.7;margin-bottom:10px}
.blog-card-meta{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--gray5)}

.article-body{max-width:780px;margin:0 auto;padding:20px 5% 48px}
.article-header{padding:14px 0 20px;border-bottom:2px solid var(--gray3);margin-bottom:24px}
.article-header h1{font-size:clamp(17px,2.2vw,26px);font-weight:900;color:var(--gray8);margin:8px 0 12px;line-height:1.3}
.article-meta{display:flex;gap:13px;flex-wrap:wrap;font-size:10px;color:var(--gray5);font-weight:600}
.article-content h2{font-size:15px;font-weight:900;color:var(--blue2);margin:22px 0 9px}
.article-content h3{font-size:13px;font-weight:800;color:var(--gray8);margin:16px 0 6px}
.article-content p{color:var(--gray6);line-height:1.82;margin-bottom:13px;font-size:12px}
.article-img{width:100%;border-radius:14px;margin-bottom:28px;object-fit:cover;max-height:360px}
.article-cta{background:linear-gradient(135deg,var(--blue2),var(--blue1));border:none;border-radius:16px;padding:28px;text-align:center;margin-top:44px}
.article-cta h3{font-size:19px;font-weight:900;margin-bottom:10px;color:#fff}
.article-cta p{font-size:12px;color:rgba(255,255,255,.82);margin-bottom:18px}

.price-table{width:100%;border-collapse:collapse;margin-bottom:28px;border-radius:12px;overflow:hidden;box-shadow:var(--shadow-sm)}
.price-table th{background:var(--blue7);color:var(--blue2);font-size:12px;font-weight:900;padding:13px 16px;text-align:right;border-bottom:1px solid var(--blue6)}
.price-table td{padding:12px 16px;border-bottom:1px solid var(--gray3);font-size:12px;color:var(--gray6);background:var(--white)}
.price-table tr:hover td{background:var(--gray1)}
.price-note{background:var(--blue7);border:1px solid var(--blue6);border-radius:12px;padding:16px;font-size:12px;color:var(--gray6);line-height:1.75}
.price-note strong{color:var(--blue2)}

.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.about-img-stack{position:relative}
.about-img-stack img{border-radius:16px;width:100%;object-fit:cover;height:360px;box-shadow:var(--shadow-lg)}
.about-badge-overlay{position:absolute;bottom:-14px;left:-14px;background:var(--white);border:1px solid var(--blue6);border-radius:14px;padding:14px 18px;box-shadow:var(--shadow-md)}
.about-badge-overlay strong{display:block;font-size:22px;font-weight:900;color:var(--blue1)}
.about-badge-overlay span{font-size:11px;color:var(--gray5)}
.about-text h2{font-size:26px;font-weight:900;margin-bottom:14px;color:var(--gray8)}
.about-text p{font-size:13px;color:var(--gray6);line-height:1.82;margin-bottom:14px}
.about-list{list-style:none;margin-bottom:22px}
.about-list li{padding:10px 0;border-bottom:1px solid var(--gray3);font-size:13px;color:var(--gray6);display:flex;align-items:center;gap:10px}
.about-list li::before{content:'✅';font-size:13px;flex-shrink:0}

footer{background:var(--gray8);padding:32px 5% 20px;text-align:center}
.footer-inner{max-width:1100px;margin:0 auto}
.footer-logo{font-size:22px;margin-bottom:7px}
.footer-brand{font-size:13px;font-weight:900;color:var(--blue5);margin-bottom:4px}
.footer-tagline{font-size:10px;color:var(--gray5);margin-bottom:22px}
.footer-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-bottom:18px}
.footer-nav a{font-size:11px;color:var(--gray4);transition:.2s;font-weight:700}
.footer-nav a:hover{color:var(--blue5)}
.footer-social{display:flex;justify-content:center;gap:10px;margin-bottom:18px}
.footer-social a{width:32px;height:32px;border-radius:50%;background:var(--gray7);border:1px solid var(--gray6);display:flex;align-items:center;justify-content:center;font-size:13px;transition:.3s;color:var(--gray3)}
.footer-social a:hover{background:var(--blue1);border-color:var(--blue1);color:#fff;transform:translateY(-2px)}
.footer-divider{width:44px;height:2px;background:linear-gradient(90deg,transparent,var(--blue4),transparent);margin:0 auto 18px}
.footer-copy{font-size:10px;color:var(--gray5)}
.footer-copy a{color:var(--blue4);font-weight:700}

.fi{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.fi.vis{opacity:1;transform:none}

@keyframes particleFloat{0%,100%{transform:translateY(0) scale(1);opacity:.3}33%{transform:translateY(-20px) scale(1.2);opacity:.6}66%{transform:translateY(10px) scale(.8);opacity:.2}}

.page-hero{padding:90px 5% 40px;background:radial-gradient(ellipse 80% 60% at 50% 40%,rgba(37,99,235,0.07) 0%,transparent 65%),linear-gradient(160deg,#eef4ff 0%,#ffffff 50%,#f8fafc 100%);text-align:center}

.svc-intro{background:var(--white);border:1px solid var(--gray3);border-radius:18px;padding:26px;margin-bottom:40px;display:grid;grid-template-columns:1fr 1fr;gap:20px;box-shadow:var(--shadow-sm)}
.svc-half{padding:18px;border-radius:12px}
.svc-half.sell{background:linear-gradient(135deg,rgba(22,163,74,.06),rgba(34,197,94,.03));border:1px solid rgba(22,163,74,.2)}
.svc-half.buy{background:var(--blue7);border:1px solid var(--blue6)}
.svc-half h3{font-size:16px;font-weight:900;margin-bottom:7px}
.svc-half.sell h3{color:var(--green)}
.svc-half.buy h3{color:var(--blue1)}
.svc-half p{font-size:12px;color:var(--gray6);line-height:1.75}

/* Contact page cards – smaller */
.contact-card{background:linear-gradient(135deg,#dc2626,#ff6b35);border-radius:16px;padding:22px;text-align:center;color:#fff}
.contact-card .cc-icon{font-size:36px;margin-bottom:10px}
.contact-card h3{font-size:16px;margin-bottom:7px}
.contact-card p{opacity:.9;margin-bottom:14px;font-size:13px}
.contact-card a.cc-btn{background:#fff;color:#dc2626;padding:10px 22px;border-radius:50px;font-weight:900;text-decoration:none;font-size:14px;display:inline-block}

@media(max-width:960px){
  .hin{grid-template-columns:1fr;gap:0;padding:22px 0 36px}
  .hvis{order:-1;margin-bottom:20px;padding-bottom:16px}
  .himg-wrap img{height:210px}
  .hbadge{left:6px;bottom:-2px}
  .hstats{gap:13px}
  .contact-grid{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
  .svc-intro{grid-template-columns:1fr}
  .gallery-wrap{grid-template-columns:1fr}
}
@media(max-width:720px){
  .nlinks{display:none}
  .mob{display:block}
  nav#mainnav{background:#fff!important;height:62px;padding:0 4%}
  .nlogo-txt strong{font-size:15px}
  .nlogo-txt span{display:block;font-size:10px}
  .hero{padding-top:56px;min-height:auto}
  .hin{width:96%;padding:18px 0 32px}
  .htag{font-size:9px;padding:4px 11px;margin-bottom:10px}
  .hh1{font-size:clamp(18px,5vw,26px);margin-bottom:10px}
  .hp{font-size:11px;margin-bottom:15px}
  .hbtns{gap:8px;margin-bottom:18px}
  .hero-call-btn,.hero-wa-btn{font-size:11px;padding:9px 15px}
  .hstats{gap:12px}
  .hsn{font-size:13px}
  .hvis{margin-bottom:14px}
  .himg-wrap img{height:180px}
  .hbadge{padding:8px 12px;gap:7px}
  .hbadge-txt strong{font-size:10px}
  .cta-box{padding:26px 16px}
  .urgency-bar{padding:8px 4%}
  .breadcrumb{margin-top:56px}
  .urgency-bar div{font-size:11px!important;gap:7px!important}
  .sec{padding:24px 4%}
  .gallery-videos{flex-direction:column;align-items:center}
  .gcard-video{max-width:220px}
}

/* Discount Badge */
.discount-badge{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,#ff3b30,#ff6b35);color:#fff;border-radius:12px;padding:10px 18px;margin:10px 0 14px;box-shadow:0 4px 16px rgba(255,59,48,.35);animation:pulse-badge 2s infinite}
.discount-pct{font-size:clamp(17px,3.5vw,22px);font-weight:900;letter-spacing:.5px}
.discount-sub{font-size:clamp(11px,2vw,14px);font-weight:600;opacity:.93}
@keyframes pulse-badge{0%,100%{box-shadow:0 4px 16px rgba(255,59,48,.35)}50%{box-shadow:0 4px 26px rgba(255,59,48,.65)}}
@media(max-width:480px){.discount-badge{flex-direction:column;gap:3px;text-align:center;padding:8px 14px}}

/* Why/Trust Cards */
.why-card,.trust-card{background:#fff;border-radius:18px;padding:18px;text-align:center;box-shadow:0 4px 20px rgba(0,0,0,.08)}
.why-card{border-top:4px solid #ccc}
.wc-red{border-top-color:#dc2626}
.wc-blue{border-top-color:#1a56db}
.wc-green{border-top-color:#16a34a}
.wc-purple{border-top-color:#7c3aed}
.trust-card{padding:16px}