*{margin:0;padding:0;box-sizing:border-box;}
:root{
  /* Refined theme: deep charcoal + emerald, with a warm accent for depth */
  --bg:#0a0a0a;
  --bg2:#131313;
  --bg3:#1a1a1a;
  --emerald:#02C172;
  --emerald-dim:#019354;
  --emerald-soft:rgba(2,193,114,0.12);
  --amber:#E8A33D;
  --white:#ffffff;
  --gray:#8a8a8a;
  --gray-light:#b4b4b4;
  --border:#262626;
  --gold:#02C172;     /* legacy var kept so existing inline refs still work */
  --gold2:#019354;
  --green:#02C172;
}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--white);overflow-x:hidden;}
a{text-decoration:none;}

/* ============ NAV ============ */
nav{position:fixed;top:0;left:0;right:0;z-index:200;padding:0 48px;height:64px;display:flex;align-items:center;justify-content:space-between;background:rgba(10,10,10,0.85);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);transition:background .3s,border-color .3s;}
nav.scrolled{background:rgba(10,10,10,0.97);}
.nav-logo{font-family:'Sora',sans-serif;font-size:18px;font-weight:700;color:var(--white);letter-spacing:0.5px;}
.nav-logo span{color:var(--emerald);}
.nav-links{display:flex;gap:30px;list-style:none;}
.nav-links a{font-size:12px;font-weight:500;color:var(--gray);letter-spacing:1px;text-transform:uppercase;transition:color .25s;position:relative;padding:4px 0;}
.nav-links a::after{content:'';position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--emerald);transition:width .25s ease;}
.nav-links a:hover{color:var(--white);}
.nav-links a:hover::after{width:100%;}
.nav-links a.active{color:var(--emerald);}
.nav-links a.active::after{width:100%;}
.nav-cta{font-size:12px;font-weight:600;color:#fff;background:var(--emerald);padding:10px 22px;border-radius:3px;letter-spacing:1px;text-transform:uppercase;transition:all .25s;box-shadow:0 0 0 0 rgba(2,193,114,0.5);}
.nav-cta:hover{background:var(--emerald-dim);box-shadow:0 4px 18px rgba(2,193,114,0.35);transform:translateY(-1px);}
.nav-burger{display:none;flex-direction:column;gap:5px;cursor:pointer;z-index:201;}
.nav-burger span{width:24px;height:2px;background:var(--white);border-radius:2px;transition:all .3s;}
.nav-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-burger.open span:nth-child(2){opacity:0;}
.nav-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* mobile nav drawer */
@media(max-width:880px){
  .nav-links{position:fixed;top:64px;left:0;right:0;background:rgba(10,10,10,0.98);flex-direction:column;align-items:center;gap:0;max-height:0;overflow:hidden;transition:max-height .35s ease;border-bottom:1px solid var(--border);}
  .nav-links.open{max-height:600px;}
  .nav-links li{width:100%;}
  .nav-links a{width:100%;text-align:center;padding:22px 0;border-bottom:1px solid var(--border);display:block;font-size:15px;letter-spacing:1.5px;min-height:60px;display:flex;align-items:center;justify-content:center;}
  .nav-cta{display:none;}
  .nav-burger{display:flex;}
}

/* ============ PAGE HERO BANNER (for sub-pages) ============ */
.page-hero{min-height:46vh;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:140px 64px 60px;position:relative;background:
  radial-gradient(circle at 85% 20%, rgba(2,193,114,0.10), transparent 55%),
  linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%);
  border-bottom:1px solid var(--border);overflow:hidden;}
.page-hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px);background-size:48px 48px;opacity:.15;pointer-events:none;}
.page-eyebrow{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--emerald);margin-bottom:18px;position:relative;z-index:1;opacity:0;animation:fadeUp .7s ease forwards;animation-delay:.05s;}
.page-title{font-family:'Sora',sans-serif;font-size:clamp(40px,6vw,68px);font-weight:800;letter-spacing:-1.5px;line-height:1.02;color:var(--white);max-width:760px;position:relative;z-index:1;opacity:0;animation:fadeUp .7s ease forwards;animation-delay:.15s;}
.page-title em{font-style:normal;color:var(--emerald);}
.page-sub{font-size:15px;color:var(--gray);line-height:1.8;max-width:520px;margin-top:18px;position:relative;z-index:1;opacity:0;animation:fadeUp .7s ease forwards;animation-delay:.25s;}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}

/* ============ HERO (home page) ============ */
.hero{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;padding-top:64px;position:relative;}
.hero-left{display:flex;flex-direction:column;justify-content:center;padding:80px 64px;border-right:1px solid var(--border);position:relative;z-index:1;}
.hero-tag{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--emerald);margin-bottom:24px;opacity:0;animation:fadeUp .6s ease forwards;}
.hero-name{font-family:'Sora',sans-serif;font-size:clamp(40px,6.5vw,68px);font-weight:900;line-height:1.0;letter-spacing:-1px;margin-bottom:20px;color:var(--white);opacity:0;animation:fadeUp .6s ease forwards;animation-delay:.1s;}
.hero-name em{font-style:normal;font-weight:700;color:var(--emerald);}
.hero-role{font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--gray);margin-bottom:32px;border-left:2px solid var(--emerald);padding-left:14px;opacity:0;animation:fadeUp .6s ease forwards;animation-delay:.2s;}
.hero-desc{font-size:15px;line-height:1.9;color:var(--gray);max-width:420px;margin-bottom:40px;opacity:0;animation:fadeUp .6s ease forwards;animation-delay:.3s;}
.hero-btns{display:flex;gap:12px;margin-bottom:56px;opacity:0;animation:fadeUp .6s ease forwards;animation-delay:.4s;}
.btn-gold{background:var(--emerald);color:#fff;font-size:12px;font-weight:600;padding:14px 28px;letter-spacing:1.5px;text-transform:uppercase;transition:all .25s;border-radius:3px;display:inline-block;position:relative;overflow:hidden;}
.btn-gold::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:rgba(255,255,255,0.15);transition:left .4s ease;}
.btn-gold:hover::before{left:100%;}
.btn-gold:hover{background:var(--emerald-dim);transform:translateY(-2px);box-shadow:0 8px 24px rgba(2,193,114,0.3);}
.btn-line{border:1px solid var(--border);color:var(--white);font-size:12px;padding:14px 28px;letter-spacing:1.5px;text-transform:uppercase;transition:all .25s;border-radius:3px;display:inline-block;}
.btn-line:hover{border-color:var(--emerald);color:var(--emerald);transform:translateY(-2px);}
.hero-stats{display:flex;gap:40px;padding-top:40px;border-top:1px solid var(--border);opacity:0;animation:fadeUp .6s ease forwards;animation-delay:.5s;}
.stat-n{font-family:'Sora',sans-serif;font-size:36px;font-weight:700;color:var(--white);line-height:1;}
.stat-n span{color:var(--emerald);}
.stat-l{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gray);margin-top:4px;}

.hero-right{position:relative;background:var(--bg2);display:flex;align-items:center;justify-content:center;padding:60px;overflow:hidden;}
.hero-right::before{content:'';position:absolute;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle, rgba(2,193,114,0.16), transparent 70%);animation:pulseGlow 5s ease-in-out infinite;}
@keyframes pulseGlow{0%,100%{transform:scale(1);opacity:.7;}50%{transform:scale(1.15);opacity:1;}}
.hero-photo{width:300px;height:300px;object-fit:cover;object-position:center top;display:block;border-radius:50%;border:3px solid var(--emerald);position:relative;z-index:1;box-shadow:0 0 0 8px rgba(2,193,114,0.08);animation:floatSlow 6s ease-in-out infinite;}
@keyframes floatSlow{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
.hero-badge{position:absolute;background:var(--bg);border:1px solid var(--border);padding:14px 18px;border-radius:4px;z-index:2;animation:floatSlow 5s ease-in-out infinite;}
.hero-badge-bl{bottom:32px;left:32px;}
.hero-badge-tr{top:32px;right:32px;animation-delay:.6s;}
.badge-n{font-family:'Sora',sans-serif;font-size:24px;font-weight:700;color:var(--emerald);}
.badge-l{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--gray);margin-top:2px;}

/* ============ MARQUEE ============ */
.marquee{background:var(--emerald);padding:13px 0;overflow:hidden;white-space:nowrap;position:relative;}
.marquee-track{display:inline-flex;animation:scrollMarquee 22s linear infinite;}
.marquee-item{font-size:11px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:#ffffff;padding:0 28px;}
.marquee-sep{color:rgba(0,0,0,0.3);}
@keyframes scrollMarquee{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ============ SECTION BASE ============ */
section{padding:100px 0;}
.wrap{max-width:1100px;margin:0 auto;padding:0 64px;}
.s-eye{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--emerald);margin-bottom:10px;}
.s-title{font-family:'Sora',sans-serif;font-size:clamp(32px,4.5vw,52px);font-weight:900;letter-spacing:-1px;line-height:1.05;margin-bottom:18px;color:var(--white);}
.s-title em{font-style:normal;font-weight:800;color:var(--emerald);}
.s-sub{font-size:14px;color:var(--gray);line-height:1.8;max-width:540px;}
.divider{width:60px;height:2px;background:var(--emerald);margin:24px 0;position:relative;overflow:hidden;}
.divider::after{content:'';position:absolute;inset:0;background:var(--white);transform:translateX(-100%);animation:sweepLine 2.4s ease-in-out infinite;}
@keyframes sweepLine{0%{transform:translateX(-100%);}50%{transform:translateX(100%);}100%{transform:translateX(100%);}}

/* fade-in on scroll */
.fade{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease;}
.fade.show{opacity:1;transform:translateY(0);}
.fade-img{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease;}
.fade-img.show{opacity:1;transform:translateY(0);}
.fade-left{opacity:0;transform:translateX(-32px);transition:opacity .7s ease,transform .7s ease;}
.fade-left.show{opacity:1;transform:translateX(0);}
.fade-right{opacity:0;transform:translateX(32px);transition:opacity .7s ease,transform .7s ease;}
.fade-right.show{opacity:1;transform:translateX(0);}
.fade-scale{opacity:0;transform:scale(.92);transition:opacity .6s ease,transform .6s ease;}
.fade-scale.show{opacity:1;transform:scale(1);}

/* ============ ABOUT ============ */
.about{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:56px;align-items:start;}
.about-text p{font-size:14px;line-height:1.95;color:var(--gray);margin-bottom:18px;}
.about-text p strong{color:var(--white);font-weight:500;}
.about-hl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:28px;}
.hl-item{border:1px solid var(--border);padding:12px 16px;border-radius:3px;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--gray);transition:all .25s;}
.hl-item:hover{border-color:var(--emerald);color:var(--emerald);background:var(--emerald-soft);transform:translateX(4px);}
.info-box{border:1px solid var(--border);padding:28px;margin-bottom:16px;border-radius:4px;transition:border-color .3s;}
.info-box:hover{border-color:var(--emerald);}
.info-box h4{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--emerald);margin-bottom:20px;}
.info-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border);font-size:13px;}
.info-row:last-child{border-bottom:none;}
.info-l{color:var(--gray);}
.info-v{color:var(--white);font-weight:500;}
.info-v.g{color:var(--emerald);}
.tools{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;}
.tool{font-size:11px;padding:5px 12px;border:1px solid var(--border);color:var(--gray);letter-spacing:0.5px;border-radius:3px;transition:all .2s;}
.tool:hover{border-color:var(--emerald);color:var(--emerald);}

/* ============ SKILLS ============ */
.skills{background:var(--bg);}
.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--border);margin-top:56px;}
.sk-item{padding:32px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);transition:background .3s;}
.sk-item:hover{background:var(--bg2);}
.sk-item:nth-child(3n){border-right:none;}
.sk-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px;}
.sk-icon{font-size:22px;}
.sk-pct{font-family:'Sora',sans-serif;font-size:32px;font-weight:700;color:var(--emerald);line-height:1;}
.sk-name{font-size:14px;font-weight:500;color:var(--white);margin-bottom:6px;letter-spacing:0.3px;}
.sk-desc{font-size:12px;color:var(--gray);line-height:1.65;margin-bottom:16px;}
.bar-bg{height:3px;background:var(--border);border-radius:2px;overflow:hidden;}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--emerald-dim),var(--emerald));border-radius:2px;width:0;transition:width 1.4s cubic-bezier(.16,1,.3,1);}
.sk-item.show .bar-fill{width:var(--target-width);}

/* ============ PORTFOLIO / MY SKILLS GRID ============ */
.myskills{background:var(--bg2);}
.myskills-big{font-family:'Sora',sans-serif;font-size:clamp(56px,9vw,112px);font-weight:900;letter-spacing:-5px;line-height:0.85;margin-bottom:56px;color:var(--white);}
.myskills-big em{font-style:normal;font-weight:800;color:var(--emerald);display:block;}
.port-category{margin-bottom:64px;}
.port-cat-label{font-family:"Sora",sans-serif;font-size:32px;font-weight:500;color:var(--white);margin-bottom:32px;padding-bottom:20px;border-bottom:1px solid var(--border);}
.port-items{display:flex;flex-direction:column;gap:24px;}
.port-item{overflow:hidden;border-radius:4px;position:relative;}
.port-img{width:100%;display:block;border-radius:4px;transition:transform .6s cubic-bezier(.25,.46,.45,.94),filter .6s ease;}
.port-item:hover .port-img{transform:scale(1.03);filter:brightness(0.82);}
.port-caption{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gray);margin-top:10px;}

/* niche tabs */
.niche-graphics{background:var(--bg);border-top:1px solid var(--border);}
.niche-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:48px;border-bottom:1px solid var(--border);}
.niche-tab{background:transparent;border:none;color:var(--gray);font-family:'Sora',sans-serif;font-size:13px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;padding:12px 4px;cursor:pointer;position:relative;transition:color .25s;margin-right:24px;}
.niche-tab::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--emerald);transform:scaleX(0);transition:transform .25s;}
.niche-tab:hover{color:var(--white);}
.niche-tab.active{color:var(--emerald);}
.niche-tab.active::after{transform:scaleX(1);}
.niche-panel{animation:nicheIn .4s ease;}
@keyframes nicheIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

/* ============ FACEBOOK ADS / PHONE MOCKUPS ============ */
.fb-ads{background:var(--bg2);border-top:1px solid var(--border);padding:100px 0;}
.phones-col{display:flex;flex-direction:column;gap:80px;}
.phone-row-item{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.phone-row-item.reverse{direction:rtl;}
.phone-row-item.reverse > *{direction:ltr;}
.phone-device{display:flex;justify-content:center;position:relative;}
.phone-inner{width:220px;background:#1a1a1a;border-radius:36px;border:8px solid #2a2a2a;box-shadow:0 0 0 1px #333,0 32px 64px rgba(0,0,0,0.6),inset 0 0 0 1px #111;overflow:hidden;position:relative;transition:transform .4s ease;}
.phone-device:hover .phone-inner{transform:translateY(-6px);}
.phone-side-btn{position:absolute;background:#2a2a2a;border-radius:3px;}
.left-btn{left:-10px;top:80px;width:3px;height:60px;}
.right-btn1{right:-10px;top:70px;width:3px;height:36px;}
.right-btn2{right:-10px;top:114px;width:3px;height:56px;}
.phone-notch-bar{background:#111;padding:8px 0 4px;display:flex;justify-content:center;}
.phone-notch-pill{width:80px;height:20px;background:#000;border-radius:10px;}
.phone-screen-area{width:100%;overflow:hidden;}
.phone-screen-img{width:100%;display:block;transition:transform .6s ease;}
.phone-device:hover .phone-screen-img{transform:scale(1.03);}
.phone-home-bar{background:#111;padding:8px 0;display:flex;justify-content:center;}
.phone-home-bar::after{content:'';width:80px;height:4px;background:#333;border-radius:2px;}
.phone-stats{padding:8px 0;}
.ps-title{font-family:"Sora",sans-serif;font-size:22px;font-weight:700;color:var(--white);margin-bottom:24px;}
.ps-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.ps-item{border:1px solid var(--border);padding:16px;border-radius:4px;transition:all .3s;}
.ps-item:hover{border-color:var(--emerald);transform:translateY(-3px);background:var(--emerald-soft);}
.ps-num{font-family:"Sora",sans-serif;font-size:22px;font-weight:700;color:var(--emerald);line-height:1;margin-bottom:4px;}
.ps-lbl{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--gray);}
.cm-empty{font-size:13px;color:var(--gray);font-style:italic;padding:8px 0;}

/* ============ SERVICES ============ */
.services{background:var(--bg);border-top:1px solid var(--border);}
.svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);margin-top:56px;border:1px solid var(--border);}
.svc-item{background:var(--bg);padding:36px;transition:all .3s;position:relative;}
.svc-item:hover{background:var(--bg2);}
.svc-item::before{content:'';position:absolute;left:0;top:0;bottom:0;width:0;background:var(--emerald);transition:width .3s ease;}
.svc-item:hover::before{width:3px;}
.svc-num{font-family:'Sora',sans-serif;font-size:48px;font-weight:700;color:rgba(2,193,114,0.12);line-height:1;margin-bottom:16px;}
.svc-title{font-size:16px;font-weight:500;color:var(--white);margin-bottom:10px;letter-spacing:0.3px;}
.svc-desc{font-size:13px;color:var(--gray);line-height:1.75;margin-bottom:16px;}
.svc-tags{display:flex;flex-wrap:wrap;gap:6px;}
.svc-tag{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--emerald);border:1px solid rgba(2,193,114,0.3);padding:3px 10px;border-radius:3px;}

/* ============ TESTIMONIAL ============ */
.testimonial-sec{background:var(--bg2);border-top:1px solid var(--border);}
.testimonial-wrap{display:grid;grid-template-columns:320px 1fr;gap:56px;align-items:center;}
.testimonial-video-box{width:100%;max-width:320px;aspect-ratio:9/16;background:#000;border-radius:12px;overflow:hidden;border:1px solid var(--border);box-shadow:0 20px 50px rgba(0,0,0,0.4);transition:transform .4s ease;position:relative;}
.testimonial-video-box:hover{transform:translateY(-4px);}
.testimonial-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block;}
.quote-mark{font-family:'Sora',sans-serif;font-size:64px;font-weight:800;color:var(--emerald);line-height:1;margin-bottom:8px;}
.quote-text{font-size:18px;color:var(--white);line-height:1.7;margin-bottom:24px;max-width:440px;}
.quote-name{font-size:15px;font-weight:600;color:var(--white);}
.quote-role{font-size:12px;color:var(--gray);margin-top:2px;letter-spacing:1px;text-transform:uppercase;}

/* ============ CONTACT ============ */
.contact{background:var(--bg2);border-top:1px solid var(--border);}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:56px;}
.contact-left h3{font-family:'Sora',sans-serif;font-size:28px;font-weight:700;color:var(--white);margin-bottom:12px;}
.contact-left p{font-size:14px;color:var(--gray);line-height:1.85;margin-bottom:32px;}
.c-item{display:flex;align-items:center;gap:16px;margin-bottom:24px;transition:transform .25s;}
.c-item:hover{transform:translateX(4px);}
.c-icon{width:44px;height:44px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;border-radius:4px;transition:border-color .25s;}
.c-item:hover .c-icon{border-color:var(--emerald);}
.c-lbl{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--gray);margin-bottom:3px;}
.c-val{font-size:14px;color:var(--white);font-weight:500;}
.cf{background:var(--bg);border:1px solid var(--border);padding:36px;border-radius:6px;}
.fg{margin-bottom:20px;}
.fg label{display:block;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gray);margin-bottom:8px;}
.fg input,.fg textarea{width:100%;padding:12px 16px;background:var(--bg2);border:1px solid var(--border);font-family:'Inter',sans-serif;font-size:14px;color:var(--white);outline:none;transition:border .25s,box-shadow .25s;border-radius:4px;}
.fg input:focus,.fg textarea:focus{border-color:var(--emerald);box-shadow:0 0 0 3px rgba(2,193,114,0.12);}
.fg input::placeholder,.fg textarea::placeholder{color:var(--gray);}
.fg textarea{height:120px;resize:none;}
.form-btn{width:100%;background:var(--emerald);color:#fff;font-size:12px;font-weight:600;padding:14px;border:none;cursor:pointer;font-family:'Inter',sans-serif;letter-spacing:2px;text-transform:uppercase;transition:all .25s;border-radius:4px;}
.form-btn:hover{background:var(--emerald-dim);transform:translateY(-2px);box-shadow:0 8px 20px rgba(2,193,114,0.3);}
.form-btn:disabled{opacity:.7;cursor:not-allowed;}

/* ============ FOOTER ============ */
footer{background:var(--bg);border-top:1px solid var(--border);padding:48px 64px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;}
.f-logo{font-family:'Sora',sans-serif;font-size:22px;font-weight:700;color:var(--white);}
.f-logo span{color:var(--emerald);}
.f-links{display:flex;gap:28px;flex-wrap:wrap;}
.f-links a{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gray);transition:color .25s;}
.f-links a:hover{color:var(--emerald);}
.f-copy{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--gray);}

/* ============ PAGE-LEVEL ENTRANCE TRANSITION ============ */
body{animation:pageIn .5s ease;}
@keyframes pageIn{from{opacity:0;}to{opacity:1;}}

/* ============ BACK TO TOP ============ */
.back-top{position:fixed;bottom:28px;right:28px;width:46px;height:46px;border-radius:50%;background:var(--emerald);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:150;box-shadow:0 8px 24px rgba(2,193,114,0.35);}
.back-top.visible{opacity:1;pointer-events:auto;}
.back-top:hover{transform:translateY(-3px);}

/* ============ RESPONSIVE ============ */
@media(max-width:900px){
  .hero{grid-template-columns:1fr;}
  .hero-left{padding:60px 32px;border-right:none;}
  .hero-right{height:360px;}
  .about-grid,.contact-grid{grid-template-columns:1fr;gap:40px;}
  .skills-grid{grid-template-columns:1fr 1fr;}
  .svc-grid{grid-template-columns:1fr;}
  .wrap{padding:0 32px;}
  .myskills-big{font-size:56px;letter-spacing:-3px;}
  nav{padding:0 24px;}
  .phone-row-item{grid-template-columns:1fr;gap:32px;}
  .phone-row-item.reverse{direction:ltr;}
  .page-hero{padding:120px 32px 48px;}
  .testimonial-wrap{grid-template-columns:1fr;gap:32px;}
  .testimonial-video-box{margin:0 auto;}
}
@media(max-width:540px){
  .skills-grid{grid-template-columns:1fr;}
  footer{flex-direction:column;text-align:center;padding:36px 24px;}
}