/*
Theme Name: Noor Corp V5 (Signature Enterprise Edition)
Theme URI: https://noorconstructions.co.uk
Author: Noor Constructions
Description: Enterprise-grade tender & residential theme with mega-menu, lightbox gallery, loader, and favicon.
Version: 5.0.0
License: GPLv2 or later
Text Domain: noor-corp-v5
*/
:root{
  --cream:#F6F3EE; --porcelain:#FBFAF8; --ink:#121417; --charcoal:#2A2F36;
  --sage:#E8EEE6; --sage-line:#D7DFD3; --accent:#B89C67; --muted:#6F7785;
  --maxw:1240px; --radius:14px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:var(--porcelain);color:var(--ink);
     font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}

/* Loader */
#noor-loader{position:fixed;inset:0;background:var(--cream);display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity .4s ease}
#noor-loader .n{width:56px;height:56px;border-radius:12px;background:var(--accent);display:flex;align-items:center;justify-content:center;color:#fff;
  font-weight:900;font-size:28px;box-shadow:0 8px 28px rgba(184,156,103,.35);animation:spin 1.2s ease 1}
@keyframes spin{0%{transform:rotate(0deg);opacity:.2}50%{transform:rotate(180deg);opacity:1}100%{transform:rotate(360deg);}}

/* Header + Mega-menu */
.header{position:sticky;top:0;z-index:1000;background:rgba(251,250,248,.92);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--sage-line)}
.header .row{display:flex;align-items:center;justify-content:space-between;height:72px;max-width:var(--maxw);margin:0 auto;padding:0 22px}
.brand{font-weight:900;letter-spacing:.08em;color:var(--charcoal)}
.brand a{color:var(--charcoal);text-decoration:none}
.nav{display:flex;gap:26px;align-items:center}
.nav > .item{position:relative}
.nav > .item > a{color:var(--charcoal);font-weight:700;text-decoration:none;padding:10px 6px;display:inline-block}
.nav > .item:hover > .dropdown{opacity:1;pointer-events:auto;transform:translateY(0)}
.dropdown{position:absolute;left:0;top:100%;background:#fff;border:1px solid var(--sage-line);border-radius:12px;box-shadow:0 10px 30px rgba(23,28,35,.08);
  padding:16px;display:grid;grid-template-columns:1fr 1fr;gap:12px;min-width:380px;opacity:0;pointer-events:none;transform:translateY(6px);transition:all .18s ease}
.dropdown a{color:#222;font-weight:600;text-decoration:none;padding:8px 10px;border-radius:8px}
.dropdown a:hover{background:var(--sage)}
.menu-toggle{display:none;border:1px solid var(--sage-line);padding:8px 10px;border-radius:10px;background:#fff}
@media (max-width:980px){
  .nav{display:none;position:absolute;left:0;right:0;top:72px;background:#fff;border-bottom:1px solid var(--sage-line);padding:12px 16px;flex-direction:column}
  .nav .item{width:100%}
  .dropdown{position:relative;top:0;left:0;box-shadow:none;border:none;border-top:1px solid var(--sage-line);opacity:1;pointer-events:auto;transform:none;grid-template-columns:1fr;min-width:auto;padding:8px 0}
  .menu-toggle{display:inline-block}
}
/* Hero */
.section{padding:86px 0}
.hero{min-height:86vh;display:flex;align-items:center;position:relative;background:linear-gradient(180deg,var(--cream),var(--sage));overflow:hidden}
.hero .bg{position:absolute;inset:-2%;background:url('./assets/img/hero.jpg') center/cover no-repeat;mix-blend-mode:multiply;opacity:.28}
.hero .grain{position:absolute;inset:0;background-image:radial-gradient(rgba(0,0,0,.05) 1px, transparent 1px);background-size:4px 4px;opacity:.2}
.hero .inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:0 22px}
.hero h1{font-family:'DM Sans',Inter,system-ui;font-size: clamp(36px, 6.2vw, 66px);line-height:1.05;margin:0 0 10px;opacity:0;transform:translateY(16px);animation:fadeUp .9s .2s forwards}
.hero p{max-width:880px;color:#3a3f46;font-size: clamp(16px,1.4vw,20px);opacity:0;animation:fade .9s .35s forwards}
.hero .cta{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap;opacity:0;animation:fade .9s .6s forwards}
@keyframes fadeUp{to{opacity:1;transform:translateY(0)}} @keyframes fade{to{opacity:1}}
/* Buttons + grids */
.button{display:inline-block;background:var(--accent);color:white;padding:13px 20px;border-radius:10px;font-weight:800;border:0;cursor:pointer;box-shadow:0 6px 18px rgba(184,156,103,.24)}
.button.ghost{background:transparent;border:1px solid var(--sage-line);color:var(--charcoal)}
.container{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.card{background:white;border:1px solid var(--sage-line);border-radius:var(--radius);padding:24px;min-height:170px;box-shadow:0 6px 22px rgba(23,28,35,.04)}
.card h3{margin-top:0} .card p{color:#4b535d}
.section.light{background:var(--porcelain)} .section.cream{background:var(--cream)} .section.sage{background:var(--sage)}
.kicker{letter-spacing:.22em;text-transform:uppercase;font-weight:800;color:var(--muted);font-size:.78rem;margin-bottom:8px}
/* Stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.stat{background:white;border:1px solid var(--sage-line);padding:26px;border-radius:var(--radius);text-align:center;box-shadow:0 6px 22px rgba(23,28,35,.04)}
.stat b{display:block;font-size:2rem;background:linear-gradient(180deg,var(--accent),#CEB17A);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{color:#4b535d}
/* Case + gallery */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.case{border-radius:var(--radius);overflow:hidden;border:1px solid var(--sage-line);background:white;box-shadow:0 6px 22px rgba(23,28,35,.04)}
.case img{width:100%;height:230px;object-fit:cover;display:block}
.case .pad{padding:16px} .badge{position:absolute;top:12px;left:12px;background:rgba(255,255,255,.85);color:#111;border:1px solid var(--sage-line);padding:6px 10px;border-radius:999px;font-size:.75rem}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gallery img{width:100%;height:260px;object-fit:cover;border-radius:12px;cursor:pointer;border:1px solid var(--sage-line)}
#lightbox{position:fixed;inset:0;background:rgba(0,0,0,.7);display:none;align-items:center;justify-content:center;z-index:2000}
#lightbox img{max-width:90%;max-height:85%;border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.5);animation:zoom .25s ease}
@keyframes zoom{from{transform:scale(.92);opacity:.6}to{transform:scale(1);opacity:1}}
/* Contact / Footer */
.contact{display:grid;grid-template-columns:1.2fr .8fr;gap:24px} form .field{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
input, textarea{background:#fff;border:1px solid var(--sage-line);color:#111;border-radius:10px;padding:12px 14px} textarea{min-height:130px;resize:vertical}
.footer{border-top:1px solid var(--sage-line);padding:28px 0;color:#55606c;font-size:.95rem;background:var(--porcelain)} .footer a{color:#3a3f46} .footer a:hover{color:#000}
@media (max-width:560px){.grid,.stats,.case-grid,.gallery{grid-template-columns:1fr}}