/*
Theme Name: Afzal Construction & Trade
Theme URI: https://afzalshabbirsabqipvtltd.com/
Author: Afzal Shabbir Sabqi Pvt Ltd
Description: Professional construction and import-export business theme with subtle 3D motion.
Version: 1.1.0
Text Domain: afzal-construction
*/
:root{--navy:#0b1f3a;--orange:#f47b20;--slate:#526274;--light:#f5f7fa;--white:#fff;--ink:#142033}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.7;background:#fff}a{color:var(--navy);text-decoration:none}a:hover{color:var(--orange)}.site-header{background:var(--navy);color:#fff;border-bottom:4px solid var(--orange);position:relative;z-index:5}.wrap{width:min(1120px,92%);margin:auto}.branding{display:flex;align-items:center;gap:18px;padding:18px 0}.branding img{width:64px;height:64px;object-fit:contain}.site-title{color:#fff;font-weight:800;font-size:1.35rem;line-height:1.15}.site-tagline{color:#ced8e6;font-size:.82rem}.main-nav{display:flex;flex-wrap:wrap;gap:22px;padding:0 0 18px}.main-nav a{color:#fff;font-weight:700;font-size:.95rem}.hero{background:radial-gradient(circle at 80% 20%,rgba(244,123,32,.28),transparent 25%),linear-gradient(120deg,#07172d 0%,#173b66 65%,#f47b20 180%);color:#fff;padding:86px 0;position:relative;overflow:hidden;isolation:isolate}.hero:before,.hero:after{content:"";position:absolute;z-index:-1;border:1px solid rgba(255,255,255,.16);transform:rotate(24deg);border-radius:24px;animation:float3d 8s ease-in-out infinite}.hero:before{width:190px;height:190px;right:12%;top:18%;box-shadow:30px 30px 0 rgba(244,123,32,.14),60px 60px 0 rgba(255,255,255,.08)}.hero:after{width:90px;height:90px;right:30%;bottom:-20px;animation-delay:-3s;background:rgba(255,255,255,.06)}.hero:marker{content:""}.hero .wrap:after{content:"";position:absolute;right:5%;bottom:8%;width:260px;height:110px;border-top:3px solid rgba(244,123,32,.6);border-left:3px solid rgba(244,123,32,.35);background:repeating-linear-gradient(90deg,transparent 0 24px,rgba(255,255,255,.08) 25px 26px),repeating-linear-gradient(0deg,transparent 0 24px,rgba(255,255,255,.08) 25px 26px);transform:skewY(-8deg) perspective(600px) rotateY(-18deg);animation:blueprintDrift 7s ease-in-out infinite;pointer-events:none}.hero h1{font-size:clamp(2.2rem,5vw,4.3rem);line-height:1.08;max-width:760px;margin:0 0 20px;animation:heroIn .8s ease both}.hero p{font-size:1.2rem;max-width:680px;color:#e8edf5}.button{display:inline-block;background:var(--orange);color:#fff;padding:12px 22px;border-radius:4px;font-weight:800;margin:12px 8px 0 0;box-shadow:0 10px 18px rgba(244,123,32,.22);transition:transform .25s ease,box-shadow .25s ease}.button:hover{color:#fff;transform:translateY(-3px);box-shadow:0 16px 28px rgba(244,123,32,.3)}.button.alt{background:transparent;border:1px solid #fff}.section{padding:64px 0}.section h2{font-size:2rem;color:var(--navy);margin-top:0}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{border:1px solid #e4e9ef;border-radius:8px;padding:25px;background:#fff;box-shadow:0 8px 24px rgba(11,31,58,.06);transform:perspective(900px) rotateX(0) translateY(0);transition:transform .35s ease,box-shadow .35s ease}.card:hover{transform:perspective(900px) rotateX(3deg) translateY(-8px);box-shadow:0 20px 40px rgba(11,31,58,.14)}.card h3{margin-top:0;color:var(--navy)}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--orange);font-weight:800;font-size:.8rem}.article-list{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.article-card{padding:22px;border-left:4px solid var(--orange);background:var(--light);transition:transform .3s ease,box-shadow .3s ease}.article-card:hover{transform:translateY(-5px);box-shadow:0 14px 28px rgba(11,31,58,.1)}.article-card h2{font-size:1.35rem;margin:0 0 8px}.content{max-width:820px;margin:54px auto}.content h1{font-size:2.7rem;line-height:1.15;color:var(--navy)}.content h2,.content h3{color:var(--navy);margin-top:2.2em}.meta{color:var(--slate);font-size:.9rem}.about-feature,.trust-feature{display:grid;grid-template-columns:280px 1fr;gap:38px;align-items:center}.about-feature img{width:50%;justify-self:center;aspect-ratio:4/5;object-fit:cover;border-radius:8px;box-shadow:0 14px 30px rgba(11,31,58,.16)}.trust-feature{grid-template-columns:1.15fr 1fr;background:var(--light);padding:30px;border-radius:12px}.trust-feature img{width:100%;border-radius:8px;box-shadow:0 16px 30px rgba(11,31,58,.16);transition:transform .45s ease}.trust-feature img:hover{transform:perspective(900px) rotateY(-4deg) rotateX(2deg) scale(1.015)}.location-chip{display:inline-block;color:var(--navy);background:#eef3f8;border:1px solid #dbe5ef;border-radius:999px;padding:7px 14px;font-size:.9rem;margin-top:10px}.site-footer{background:#08172c;color:#d5dfec;padding:42px 0;margin-top:60px}.site-footer a{color:#fff}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}.construction-scene{position:absolute;right:4%;top:12%;width:min(430px,42vw);height:330px;perspective:900px;transform:rotateY(-8deg);filter:drop-shadow(0 22px 28px rgba(0,0,0,.24));pointer-events:none}.scene-skyline{position:absolute;right:8%;bottom:47px;width:210px;height:190px;transform:skewY(-4deg) rotateY(-10deg);transform-style:preserve-3d}.tower{position:absolute;bottom:0;background:linear-gradient(90deg,#9eafc0,#dbe5ed 48%,#71879a);border:2px solid rgba(255,255,255,.5);box-shadow:14px 15px 0 rgba(4,17,34,.18);padding:12px;display:grid;grid-template-columns:repeat(2,1fr);gap:9px;align-content:space-around}.tower:after{content:"";position:absolute;right:-16px;top:8px;width:15px;height:100%;background:linear-gradient(#879cad,#4e6475);transform:skewY(-22deg);transform-origin:left top}.tower-back{left:0;width:106px;height:132px;opacity:.74}.tower-front{right:0;width:126px;height:184px;animation:buildingRise 8s ease-in-out infinite}.tower i{display:block;height:12px;background:linear-gradient(90deg,#f9cc75,#fff4bf);border:1px solid rgba(11,31,58,.35);box-shadow:inset 0 -3px rgba(11,31,58,.12)}.scene-crane{position:absolute;left:4%;top:24px;width:290px;height:230px;transform:rotateY(14deg);transform-style:preserve-3d}.crane-mast{position:absolute;left:38px;bottom:10px;width:16px;height:205px;background:repeating-linear-gradient(0deg,#f47b20 0 8px,#173b66 8px 12px);border:2px solid #ffd08a;box-shadow:8px 8px 0 rgba(4,17,34,.18)}.crane-arm{position:absolute;left:44px;top:0;width:234px;height:13px;background:linear-gradient(#ffbd5d,#f47b20);border:2px solid #ffe0a8;transform-origin:left center;animation:craneSwing 9s ease-in-out infinite}.crane-arm:before{content:"";position:absolute;inset:-6px 0;border-top:2px solid rgba(255,255,255,.5);border-bottom:2px solid rgba(11,31,58,.4);clip-path:polygon(0 45%,100% 0,100% 100%)}.crane-cable{position:absolute;left:210px;top:10px;width:2px;height:118px;background:#f5f7fa;animation:loadMove 9s ease-in-out infinite}.crane-hook{position:absolute;left:203px;top:124px;width:15px;height:22px;border:3px solid #f47b20;border-top:0;border-radius:0 0 14px 14px;animation:loadMove 9s ease-in-out infinite}.crane-counterweight{position:absolute;left:5px;top:4px;width:35px;height:26px;background:#526274;border:2px solid #aab8c5}.scene-lift{position:absolute;right:23%;bottom:49px;width:22px;height:110px;border:3px solid #f47b20;animation:liftUp 6s ease-in-out infinite}.scene-lift span{position:absolute;left:-8px;bottom:0;width:34px;height:18px;background:#f47b20;box-shadow:0 4px 0 #173b66}.scene-ground{position:absolute;left:0;right:0;bottom:18px;height:28px;background:linear-gradient(#6b7c88,#334653);border-radius:50%;transform:rotateX(60deg);box-shadow:0 16px 0 rgba(0,0,0,.18)}.scene-block{position:absolute;bottom:20px;width:34px;height:18px;background:#d5b48a;border:2px solid #977453;box-shadow:4px 4px 0 rgba(0,0,0,.2)}.block-one{left:20%}.block-two{left:29%;bottom:32px;animation:blockPlace 6s ease-in-out infinite}.scene-cone{position:absolute;right:15%;bottom:20px;width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-bottom:34px solid #f47b20}.scene-status{position:absolute;left:7%;bottom:-14px;background:rgba(7,23,45,.86);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:7px 12px;font-size:.76rem;letter-spacing:.02em;box-shadow:0 8px 18px rgba(0,0,0,.22)}.scene-status b{color:#ffbf61;margin-left:8px}.status-dot{display:inline-block;width:8px;height:8px;background:#53dd91;border-radius:50%;margin-right:7px;box-shadow:0 0 0 4px rgba(83,221,145,.16);animation:statusPulse 1.8s infinite}@keyframes buildingRise{0%,18%{transform:translateY(30px);opacity:.35}35%,100%{transform:translateY(0);opacity:1}}@keyframes craneSwing{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(5deg)}}@keyframes loadMove{0%,100%{transform:translateX(0)}50%{transform:translateX(-35px)}}@keyframes liftUp{0%,100%{transform:translateY(5px)}50%{transform:translateY(-48px)}}@keyframes blockPlace{0%,25%{transform:translate(70px,-100px);opacity:.3}45%,100%{transform:translate(0,0);opacity:1}}@keyframes statusPulse{0%,100%{opacity:1}50%{opacity:.45}}.screen-reader-text{position:absolute;left:-9999px}@keyframes blueprintDrift{0%,100%{transform:skewY(-8deg) perspective(600px) rotateY(-18deg) translate3d(0,0,0);opacity:.65}50%{transform:skewY(-8deg) perspective(600px) rotateY(-12deg) translate3d(-12px,-8px,0);opacity:1}}@keyframes float3d{0%,100%{transform:rotate(24deg) translate3d(0,0,0)}50%{transform:rotate(31deg) translate3d(-18px,-16px,0)}}@keyframes heroIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(max-width:900px){.construction-scene{opacity:.38;right:-7%;transform:scale(.78) rotateY(-8deg)}}@media(max-width:760px){.construction-scene{position:relative;top:auto;right:auto;width:100%;max-width:360px;height:260px;margin:28px auto 0;transform:none;opacity:.95}.hero{min-height:650px}}@media(max-width:760px){.grid,.article-list,.footer-grid,.about-feature,.trust-feature{grid-template-columns:1fr}.hero{padding:58px 0}.main-nav{gap:13px}.content h1{font-size:2.1rem}}