/*
Theme Name:  Labun Hang Limboo
Theme URI:   https://labunhanglimboo.com/
Author:      Labun Hang Limboo
Author URI:  https://labunhanglimboo.com/
Description: Personal portfolio theme for Labun Hang Limboo — Web Developer, WordPress Expert & SEO Specialist based in Yuksom, West Sikkim.
Version:     1.0.0
License:     GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: labunhang
Tags:        portfolio, one-page, responsive-layout, full-width-template, custom-logo
*/

/* ══════════════════════════════════════════════════════════════
   COLOR SYSTEM
   ══════════════════════════════════════════════════════════════ */
:root {
  --cream:        #FAF7F2;
  --cream-deep:   #F0EBE3;
  --warm-white:   #FFFDF9;
  --sand:         #E8DFD1;
  --teal:         #0D7377;
  --teal-dark:    #095455;
  --teal-glow:    #5EEAD4;
  --teal-light:   #E6F5F5;
  --coral:        #E85D4A;
  --coral-light:  #FFF0ED;
  --forest:       #1B5E20;
  --gold:         #C4912E;
  --purple:       #5B2E8F;
  --midnight:     #0F1A2E;
  --slate:        #1A1A2E;
  --text-dark:    #1C1C28;
  --text-body:    #3D3D50;
  --text-muted:   #6B6B80;
  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', monospace;
  --r-sm: 8px; --r-md: 16px; --r-lg: 24px; --r-xl: 32px;
}

/* ── Reset ── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font-family:var(--font-body);background:var(--cream);color:var(--text-body);line-height:1.78;font-size:17px;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:var(--teal);text-decoration:none;transition:color .3s}
a:hover{color:var(--coral)}

/* ── Skip Navigation Link ── */
.skip-link{position:absolute;top:-120px;left:16px;padding:12px 22px;background:var(--teal);color:#fff;border-radius:var(--r-sm);font-weight:600;font-size:.92rem;z-index:99999;transition:top .2s ease;text-decoration:none}
.skip-link:focus{top:16px;color:#fff;outline:3px solid var(--teal-dark);outline-offset:2px}

/* ── Keyboard Focus Indicator ── */
:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:4px}
:focus:not(:focus-visible){outline:none}

/* Lucide base */
.lucide{width:24px;height:24px;stroke-width:1.8}

/* ── Reveal Animations ── */
.rv{opacity:0;transform:translateY(50px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.rv.vis{opacity:1;transform:translateY(0)}
.rv-l{opacity:0;transform:translateX(-70px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.rv-l.vis{opacity:1;transform:translateX(0)}
.rv-r{opacity:0;transform:translateX(70px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.rv-r.vis{opacity:1;transform:translateX(0)}

/* ══════════════════════════════════════════════════════════════
   NAVIGATION
   ══════════════════════════════════════════════════════════════ */
.nav{position:fixed;top:0;left:0;width:100%;z-index:1000;padding:18px 48px;display:flex;justify-content:space-between;align-items:center;background:rgba(250,247,242,.85);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);border-bottom:1px solid rgba(0,0,0,.06);transition:all .4s}
.nav.scrolled{padding:12px 48px;box-shadow:0 4px 30px rgba(0,0,0,.06)}
.nav-logo{font-family:var(--font-display);font-size:1.5rem;color:var(--text-dark);display:flex;align-items:center;gap:8px}
.nav-logo span{color:var(--teal)}
.nav-logo .lucide{color:var(--teal);width:28px;height:28px}
.nav-links{display:flex;gap:32px;list-style:none}
.nav-links a{color:var(--text-muted);font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:1.5px;position:relative;transition:color .3s}
.nav-links a::after{content:'';position:absolute;bottom:-5px;left:0;width:0;height:2px;background:var(--coral);transition:width .3s}
.nav-links a:hover{color:var(--text-dark)}
.nav-links a:hover::after{width:100%}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:4px}
.nav-toggle .lucide{width:28px;height:28px;color:var(--text-dark)}

/* ── Shared Utilities ── */
.sec{position:relative;overflow:hidden}
.sec-inner{max-width:1200px;margin:0 auto;position:relative;z-index:2}
.sec-pad{padding:120px 48px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 36px;border-radius:999px;font-weight:600;font-size:.92rem;letter-spacing:.3px;border:none;cursor:pointer;transition:transform .3s,box-shadow .3s;text-transform:uppercase;text-decoration:none}
.btn:hover{transform:translateY(-3px)}
.btn .lucide{width:20px;height:20px}
.btn-teal{background:var(--teal);color:#fff;box-shadow:0 6px 30px rgba(13,115,119,.3)}
.btn-teal:hover{box-shadow:0 10px 40px rgba(13,115,119,.45);color:#fff}
.btn-outline{background:transparent;color:var(--text-dark);border:2px solid var(--sand);padding:14px 34px}
.btn-outline:hover{border-color:var(--teal);color:var(--teal)}

.badge{display:inline-flex;align-items:center;gap:8px;padding:7px 18px;border-radius:999px;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:2px;margin-bottom:18px}
.badge .lucide{width:16px;height:16px}
.badge-teal{background:var(--teal-light);color:var(--teal)}
.badge-coral{background:var(--coral-light);color:var(--coral)}
.sec-title{font-family:var(--font-display);font-weight:400;font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.15;color:var(--text-dark);margin-bottom:20px}
.sec-title em{font-style:italic;color:var(--teal)}

/* ══════════════════════════════════════════════════════════════
   HERO — LIGHT SPLIT
   ══════════════════════════════════════════════════════════════ */
.hero{min-height:100vh;display:flex;align-items:center;background:var(--cream);padding:120px 48px 100px;position:relative;}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.hero-pre{display:flex;align-items:center;gap:10px;font-size:.82rem;font-weight:600;text-transform:uppercase;letter-spacing:3px;color:var(--teal);margin-bottom:16px}
.hero-pre .lucide{width:18px;height:18px}
.hero-pre::after{content:'';flex:1;max-width:60px;height:2px;background:linear-gradient(90deg,var(--teal),transparent)}
.hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2.2rem,3vw,3.2rem);line-height:1.1;color:var(--text-dark);margin-bottom:12px}
.hero h1 em{font-style:italic;color:var(--teal)}
.hero-name{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.2rem);color:var(--teal);margin-bottom:28px;font-style:italic}
.hero-desc{font-size:1.15rem;color:var(--text-muted);max-width:500px;margin-bottom:40px;line-height:1.85}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;}
.hero-blob{position:absolute;top:-100px;right:-200px;width:600px;height:600px;background:radial-gradient(circle,rgba(13,115,119,.06) 0%,transparent 70%);border-radius:50%;z-index:0}
.hero-blob-2{position:absolute;bottom:-100px;left:-100px;width:400px;height:400px;background:radial-gradient(circle,rgba(232,93,74,.05) 0%,transparent 70%);border-radius:50%;z-index:0}
.hero-visual{position:relative;display:flex;justify-content:center;align-items:center;height:400px;}
.hero-visual-orb{width:380px;height:380px;border-radius:50%;position:relative;background:radial-gradient(circle at 30% 30%,rgba(13,115,119,0.08),rgba(232,93,74,0.05),rgba(91,46,143,0.05));border:1px solid rgba(13,115,119,0.15);display:flex;justify-content:center;align-items:center;animation:orbFloat 8s ease-in-out infinite;box-shadow:inset 0 0 40px rgba(255,255,255,0.5);will-change:transform;}
@keyframes orbFloat{0%,100%{transform:translateY(0) rotate(0deg)}33%{transform:translateY(-15px) rotate(2deg)}66%{transform:translateY(10px) rotate(-1deg)}}
.hero-visual-orb::before{content:'';position:absolute;inset:-2px;border-radius:50%;background:conic-gradient(from 0deg,var(--teal),var(--coral),var(--gold),var(--purple),var(--teal));z-index:-1;filter:blur(20px);opacity:0.25;animation:orbSpin 12s linear infinite;}
@keyframes orbSpin{to{transform:rotate(360deg)}}
.hero-avatar{width:260px;height:260px;border-radius:50%;background:linear-gradient(135deg,var(--teal-dark),var(--midnight));display:flex;justify-content:center;align-items:center;overflow:hidden;border:4px solid var(--cream);box-shadow:0 20px 40px rgba(0,0,0,0.15);}
.hero-avatar-placeholder{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(135deg,var(--teal-dark),var(--midnight));color:var(--warm-white);}
.float-badge{position:absolute;padding:10px 18px;border-radius:12px;background:rgba(255,255,255,0.95);border:1px solid rgba(0,0,0,0.05);box-shadow:0 10px 30px rgba(0,0,0,0.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:0.8rem;font-weight:600;color:var(--text-dark);display:flex;align-items:center;gap:8px;animation:floatBadge 6s ease-in-out infinite;white-space:nowrap;z-index:5;will-change:transform;}
.float-badge .lucide{width:18px;height:18px;}
.fb-1{top:5%;left:-20px;animation-delay:0s;color:var(--coral);}
.fb-2{top:12%;right:-25px;animation-delay:1s;color:#0073AA;}
.fb-3{top:45%;left:-40px;animation-delay:2s;color:var(--purple);}
.fb-4{top:50%;right:-35px;animation-delay:0.5s;color:var(--teal);}
.fb-5{bottom:8%;left:-10px;animation-delay:1.5s;color:var(--gold);}
.fb-6{bottom:15%;right:-20px;animation-delay:0.8s;color:#6C7EB7;}
@keyframes floatBadge{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* ══════════════════════════════════════════════════════════════
   SCROLLING SERVICES TICKER (New Banner)
   ══════════════════════════════════════════════════════════════ */
.scrolling-ticker {
  display: flex;
  overflow: hidden;
  background: linear-gradient(90deg, var(--teal-dark), var(--teal));
  padding: 18px 0;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  border-top: 1px solid rgba(255,255,255,0.08);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  position: relative;
  z-index: 15;
}

.ticker-content {
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex-shrink: 0;
  animation: scrollTicker 30s linear infinite;
}

.ticker-item {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 2.5vw, 1.8rem);
  color: var(--cream);
  padding-left: 40px;
}

.ticker-sep {
  color: var(--teal-glow);
  margin-left: 40px;
  font-size: 1.2rem;
  display: inline-block;
}

@keyframes scrollTicker {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

/* Optional: pause on hover */
.scrolling-ticker:hover .ticker-content {
  animation-play-state: paused;
}

/* ══════════════════════════════════════════════════════════════
   STATS — STANDALONE SECTION
   ══════════════════════════════════════════════════════════════ */
.stats-sec{background:var(--cream-deep);padding:80px 48px;position:relative;z-index:10;border-top:1px solid rgba(0,0,0,0.04);border-bottom:1px solid rgba(0,0,0,0.04);}
.stats-ribbon-wrapper{max-width:1200px;margin:0 auto;}
.stats-ribbon{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;}
.stat-box{flex:1 1 15%;min-width:160px;padding:40px 15px;display:flex;flex-direction:column;align-items:center;text-align:center;color:#fff;transition:transform 0.4s,box-shadow 0.4s;position:relative;border-radius:var(--r-md);box-shadow:0 15px 35px rgba(0,0,0,0.15);}
.stat-box:hover{transform:translateY(-8px);z-index:10;box-shadow:0 20px 45px rgba(0,0,0,0.3);}
.sb-blue{background:linear-gradient(160deg,#0052D4,#4364F7);}
.sb-orange{background:linear-gradient(160deg,#FF8008,#FFC837);}
.sb-purple{background:linear-gradient(160deg,#4776E6,#8E54E9);}
.sb-green{background:linear-gradient(160deg,#11998e,#38ef7d);}
.sb-pink{background:linear-gradient(160deg,#FF416C,#FF4B2B);}
.sb-dark{background:linear-gradient(160deg,#1A1A2E,#282846);}
.stat-icon-wrap{width:50px;height:50px;margin-bottom:24px;filter:drop-shadow(0px 6px 6px rgba(0,0,0,0.4));}
.stat-icon-wrap .lucide{width:100%;height:100%;}
.stat-number{font-family:var(--font-display);font-size:clamp(2.2rem,3.5vw,3rem);font-weight:700;margin-bottom:12px;line-height:1;}
.sb-dark .stat-number{color:#F5C842;font-size:clamp(1.6rem,2.5vw,2.2rem);padding-top:8px;}
.stat-label{font-size:0.85rem;line-height:1.5;opacity:0.95;font-weight:500;}

/* ══════════════════════════════════════════════════════════════
   ABOUT — WARM WHITE SPLIT
   ══════════════════════════════════════════════════════════════ */
.about-sec{background:var(--warm-white);position:relative;padding:60px 48px 120px;}
.about-sec::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--sand),transparent)}
.about-grid{display:grid;grid-template-columns:5fr 6fr;gap:80px;align-items:center}
.about-img-big{width:100%;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.08);position:relative}
.about-img-big img{width:100%;height:100%;object-fit:cover}
.about-img-small{position:absolute;bottom:-20px;right:-20px;width:180px;height:180px;border-radius:var(--r-md);overflow:hidden;border:5px solid var(--warm-white);box-shadow:0 10px 30px rgba(0,0,0,.1)}
.about-img-small img{width:100%;height:100%;object-fit:cover}
.about-location{position:absolute;top:20px;left:20px;z-index:2;padding:10px 18px;border-radius:var(--r-sm);background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:600;color:var(--text-dark);box-shadow:0 4px 15px rgba(0,0,0,.08)}
.about-location .lucide{width:16px;height:16px;color:var(--coral)}
.about-img-stack{position:relative}
.about-content p{margin-bottom:18px;color:var(--text-body);font-size:1.02rem}

/* ══════════════════════════════════════════════════════════════
   BACKGROUND / QUALIFICATION — DARK COSMIC
   ══════════════════════════════════════════════════════════════ */
.bg-sec{background:radial-gradient(ellipse 60% 50% at 20% 60%,rgba(0,212,255,0.06) 0%,transparent 60%),radial-gradient(ellipse 50% 40% at 80% 40%,rgba(255,107,157,0.05) 0%,transparent 60%),linear-gradient(180deg,#0F1A2E,#0a0e27);color:#e8eaf6;position:relative;z-index:10;}
.bg-orb{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0;}
.bg-orb-1{width:400px;height:400px;background:rgba(0,212,255,0.08);top:10%;left:-100px;}
.bg-orb-2{width:350px;height:350px;background:rgba(255,215,0,0.06);bottom:10%;right:-50px;}
.badge-cosmic{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.12);color:#00d4ff;}
.bg-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;}
.bg-text p{margin-bottom:20px;font-size:1.05rem;line-height:1.85;opacity:0.9;}
.bg-cert-wrap{position:relative;}
.cert-frame{position:relative;padding:16px;border-radius:var(--r-md);background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 20px 50px rgba(0,0,0,0.4);transition:transform 0.4s,border-color 0.4s;}
.cert-frame:hover{transform:translateY(-8px);border-color:rgba(255,215,0,0.3);}
.cert-frame::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:2px;background:linear-gradient(135deg,rgba(255,215,0,0.6),transparent,rgba(0,212,255,0.4));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0.6;}
.cert-img{border-radius:var(--r-sm);overflow:hidden;width:100%;display:block;}
.cert-img img{width:100%;height:auto;object-fit:cover;display:block;}
.champion-icon{position:absolute;top:-24px;right:-24px;width:64px;height:64px;background:linear-gradient(135deg,#FFD700,#F5A623);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 25px rgba(255,215,0,0.4);color:#fff;z-index:10;border:4px solid #0F1A2E;}
.champion-icon .lucide{width:32px;height:32px;}

/* ══════════════════════════════════════════════════════════════
   SKILLS — DEEP INDIGO CANVAS
   ══════════════════════════════════════════════════════════════ */
.skills-sec{position:relative;background:linear-gradient(145deg,#0c0a1e 0%,#14103a 45%,#0d1033 100%);padding:120px 48px;overflow:hidden;color:#94a3b8;}
.skills-grid-bg{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(167,139,250,0.18) 1px,transparent 1px);background-size:30px 30px;-webkit-mask-image:radial-gradient(ellipse at 65% 50%,black 5%,transparent 68%);mask-image:radial-gradient(ellipse at 65% 50%,black 5%,transparent 68%);z-index:1;}
.skills-beam{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(118deg,transparent 30%,rgba(139,92,246,0.04) 44%,rgba(167,139,250,0.07) 50%,rgba(139,92,246,0.04) 56%,transparent 70%);}
.skills-hex{position:absolute;pointer-events:none;z-index:1;fill:none;stroke:rgba(167,139,250,0.07);stroke-width:1.5;}
.skills-hex-1{width:520px;height:520px;top:-160px;right:-80px;stroke:rgba(167,139,250,0.06);}
.skills-hex-2{width:340px;height:340px;bottom:-100px;left:-60px;stroke:rgba(99,102,241,0.07);}
.skills-hex-3{width:200px;height:200px;top:60px;left:38%;stroke:rgba(167,139,250,0.05);}
.skills-orb{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:1;}
.skills-orb-1{width:400px;height:400px;background:rgba(109,40,217,0.12);top:-100px;right:5%;}
.skills-orb-2{width:300px;height:300px;background:rgba(79,70,229,0.10);bottom:-60px;left:8%;}
.skills-inner{max-width:1200px;margin:0 auto;position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.3fr;gap:80px;align-items:center;}
.skills-text h2{color:#f8fafc;font-family:var(--font-display);font-size:clamp(2.2rem,5vw,3.6rem);margin-bottom:24px;font-weight:400;line-height:1.15;}
.skills-text h2 em{color:#a78bfa;}
.skills-text p{font-size:1.15rem;line-height:1.9;margin-bottom:24px;color:#c4b5fd;opacity:0.9;}
.skills-visual{perspective:1200px;}
.skills-3d-box{position:relative;background:rgba(8,5,28,0.72);border:1px solid rgba(167,139,250,0.18);border-radius:20px;padding:40px 30px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transform-style:preserve-3d;transform:rotateY(-10deg) rotateX(5deg);box-shadow:4px 4px 0px rgba(109,40,217,0.35),8px 8px 0px rgba(109,40,217,0.28),12px 12px 0px rgba(79,70,229,0.22),16px 16px 0px rgba(79,70,229,0.16),20px 20px 0px rgba(99,102,241,0.10),30px 30px 40px rgba(0,0,0,0.6);transition:transform 0.6s cubic-bezier(0.16,1,0.3,1);}
.skills-3d-box:hover{transform:rotateY(-2deg) rotateX(2deg);}
.skill-item{position:relative;margin-bottom:18px;transform-style:preserve-3d;}
.skill-item:last-child{margin-bottom:0;}
.skill-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:8px;transform:translateZ(20px);}
.skill-name{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:0.85rem;color:#f8fafc;font-weight:600;letter-spacing:1px;}
.skill-name .lucide{width:16px;height:16px;color:currentColor;}
.skill-pct{font-family:var(--font-mono);font-size:1.1rem;font-weight:700;color:#fff;text-shadow:0 0 10px currentColor;min-width:45px;text-align:right;}
.skill-track{width:100%;height:12px;background:rgba(0,0,0,0.6);border-radius:20px;position:relative;border:1px solid rgba(255,255,255,0.05);box-shadow:inset 0 2px 4px rgba(0,0,0,0.8),0 2px 0 rgba(255,255,255,0.1);transform:translateZ(30px);}
.skill-fill{height:100%;width:0%;border-radius:20px;position:relative;transition:width 2s cubic-bezier(0.34,1.56,0.64,1);overflow:hidden;}
.fill-html{background:linear-gradient(90deg,#ff4136,#ff8c00);box-shadow:0 0 12px rgba(255,140,0,0.5);}
.fill-css{background:linear-gradient(90deg,#0052d4,#4364f7);box-shadow:0 0 12px rgba(67,100,247,0.5);}
.fill-js{background:linear-gradient(90deg,#f7df1e,#ffd000);box-shadow:0 0 12px rgba(247,223,30,0.5);}
.fill-php{background:linear-gradient(90deg,#8993be,#5a69a6);box-shadow:0 0 12px rgba(137,147,190,0.5);}
.fill-wp{background:linear-gradient(90deg,#0073aa,#00b4db);box-shadow:0 0 12px rgba(0,180,219,0.5);}
.fill-mysql{background:linear-gradient(90deg,#00618a,#f29111);box-shadow:0 0 12px rgba(242,145,17,0.5);}
.fill-asp{background:linear-gradient(90deg,#512bd4,#9d50bb);box-shadow:0 0 12px rgba(157,80,187,0.5);}
.fill-uiux{background:linear-gradient(90deg,#ff4b2b,#ff416c);box-shadow:0 0 12px rgba(255,65,108,0.5);}
.fill-seo{background:linear-gradient(90deg,#00b09b,#96c93d);box-shadow:0 0 12px rgba(150,201,61,0.5);}
.fill-cw{background:linear-gradient(90deg,#f2994a,#f2c94c);box-shadow:0 0 12px rgba(242,201,76,0.5);}
.fill-gfx{background:linear-gradient(90deg,#da22ff,#9733ee);box-shadow:0 0 12px rgba(151,51,238,0.5);}
.skill-fill::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.6),transparent);transform:translateX(-100%);animation:skillShimmer 2.5s infinite linear;border-radius:inherit;}
@keyframes skillShimmer{100%{transform:translateX(200%)}}

/* ══════════════════════════════════════════════════════════════
   SERVICES & EXPERTISE
   ══════════════════════════════════════════════════════════════ */
.svc-sec{background:var(--cream);padding:120px 48px 40px;position:relative;}
.svc-head{text-align:center;max-width:850px;margin:0 auto 80px;}
.svc-head p{color:var(--text-muted);font-size:1.1rem;margin-top:16px;line-height:1.85;}

/* ── Split-Image Service Cards (First Two) ── */
.svc-split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;max-width:1200px;margin:0 auto 80px;background:#fff;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,0.07);border:1px solid rgba(0,0,0,0.04);transition:transform 0.4s cubic-bezier(0.16,1,0.3,1),box-shadow 0.4s;}
.svc-split:hover{transform:translateY(-6px);box-shadow:0 30px 70px rgba(0,0,0,0.1);}
.svc-split-text{padding:50px 48px;}
.svc-split-icon{width:64px;height:64px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;margin-bottom:24px;color:#fff;}
.svc-split-icon .lucide{width:32px;height:32px;}
.svc-split-icon svg{color:#fff;}
.sh-1{background:#3b82f6;}
.sh-2{background:#f97316;}
.svc-split-text h3{font-family:var(--font-display);font-size:clamp(1.6rem,2.5vw,2rem);color:var(--text-dark);margin-bottom:18px;font-weight:700;line-height:1.25;}
.svc-split-text p{font-size:1.05rem;color:var(--text-muted);line-height:1.85;margin-bottom:14px;}
.svc-split-text p:last-child{margin-bottom:0;}
.svc-split-img{position:relative;overflow:hidden;height:100%;min-height:380px;}
.svc-split-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s cubic-bezier(0.16,1,0.3,1);}
.svc-split:hover .svc-split-img img{transform:scale(1.04);}
.svc-split-rev .svc-split-img img{object-position:35% center;}

/* ── SEO Split Card — warm gradient accent bar ── */
.svc-split-seo{border-top:5px solid transparent;border-image:linear-gradient(90deg,#ef4444,#f97316,#f59e0b) 1;}
.sh-seo{background:linear-gradient(135deg,#ef4444,#f97316);}
.svc-split-seo .svc-split-text h3{color:var(--text-dark);}

/* ── Editorial Split Card — quote watermark ── */
.svc-split-editorial{position:relative;}
.svc-split-editorial::after{content:'\201C';position:absolute;top:10px;right:52%;font-family:var(--font-display);font-size:10rem;line-height:1;color:var(--teal);opacity:0.05;pointer-events:none;z-index:0;}
.sh-editorial{background:linear-gradient(135deg,var(--teal),var(--teal-dark));}
.svc-split-rev{direction:rtl;}
.svc-split-rev > *{direction:ltr;}

/* ── Varied Service Cards Container ── */
.svc-varied{display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:1200px;margin:0 auto 80px;}

/* ── Base Varied Card ── */
.svc-v{border-radius:var(--r-lg);position:relative;overflow:hidden;transition:transform 0.4s cubic-bezier(0.16,1,0.3,1),box-shadow 0.4s;}
.svc-v:hover{transform:translateY(-6px);}
.svc-v-body{padding:44px 36px;}
.svc-v-icon-row{margin-bottom:20px;}
.svc-v-icon-row .lucide{width:36px;height:36px;}
.svc-v h3{font-family:var(--font-display);font-size:clamp(1.4rem,2vw,1.7rem);margin-bottom:16px;font-weight:700;line-height:1.3;}
.svc-v p{font-size:1.02rem;line-height:1.82;margin-bottom:12px;}
.svc-v p:last-child{margin-bottom:0;}

/* Card 3 — Web Applications: Terminal/Dark */
.svc-v-terminal{background:var(--midnight);color:#e2e8f0;box-shadow:0 20px 50px rgba(15,26,46,0.5);}
.svc-v-terminal:hover{box-shadow:0 28px 60px rgba(15,26,46,0.6);}
.svc-v-topbar{display:flex;gap:8px;padding:14px 20px;background:rgba(255,255,255,0.04);border-bottom:1px solid rgba(255,255,255,0.06);}
.svc-v-topbar span{width:12px;height:12px;border-radius:50%;display:block;}
.svc-v-topbar span:nth-child(1){background:#ff5f57;}
.svc-v-topbar span:nth-child(2){background:#febc2e;}
.svc-v-topbar span:nth-child(3){background:#28c840;}
.svc-v-terminal .svc-v-icon-row .lucide{color:#8b5cf6;}
.svc-v-terminal h3{color:#f8fafc;}
.svc-v-terminal p{color:#94a3b8;}

/* Card 4 — UI/UX Design: Blueprint Grid */
.svc-v-blueprint{background:#fff;border:1px solid rgba(0,0,0,0.06);border-left:5px solid var(--teal);box-shadow:0 16px 45px rgba(0,0,0,0.06);background-image:radial-gradient(circle,rgba(13,115,119,0.04) 1px,transparent 1px);background-size:22px 22px;}
.svc-v-blueprint:hover{box-shadow:0 24px 55px rgba(0,0,0,0.1);border-left-color:var(--coral);}
.svc-v-blueprint .svc-v-icon-row .lucide{color:var(--teal);}
.svc-v-blueprint h3{color:var(--text-dark);}
.svc-v-blueprint p{color:var(--text-muted);}

/* ══════════════════════════════════════════════════════════════
   GRAPHIC DESIGN — STANDALONE CREATIVE SHOWCASE
   ══════════════════════════════════════════════════════════════ */
@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes gfxFloat1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(12px,-18px) scale(1.08)}}
@keyframes gfxFloat2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-16px,14px) scale(1.05)}}
@keyframes gfxFloat3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(10px,10px) scale(1.1)}}
@keyframes gfxPenSpin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}

.svc-gfx-showcase{
  max-width:1200px;
  margin:0 auto 80px;
  border-radius:calc(var(--r-lg) + 4px);
  overflow:hidden;
  position:relative;
  display:grid;
  grid-template-columns:340px 1fr;
  min-height:460px;
  box-shadow:0 28px 70px rgba(121,40,202,0.14);
  transition:transform 0.5s cubic-bezier(0.16,1,0.3,1),box-shadow 0.5s;
  isolation:isolate;
}
.svc-gfx-showcase:hover{
  transform:translateY(-8px);
  box-shadow:0 36px 80px rgba(121,40,202,0.22);
}

/* Animated rainbow outer border */
.svc-gfx-showcase::before{
  content:'';
  position:absolute;
  inset:-3px;
  border-radius:inherit;
  padding:3px;
  background:linear-gradient(135deg,#ff007a,#7928ca,#00d4ff,#38ef7d,#f5c842,#ff007a);
  background-size:300% 300%;
  animation:gradientShift 5s ease infinite;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  z-index:-1;
}

/* ── Art Panel (left) ── */
.svc-gfx-art{
  position:relative;
  background:linear-gradient(160deg,#1a1a2e 0%,#0d0d1a 50%,#1a0a2e 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  padding:40px 30px;
}
/* Dot grid overlay */
.svc-gfx-art::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:radial-gradient(circle,rgba(255,255,255,0.06) 1px,transparent 1px);
  background-size:16px 16px;
  z-index:1;
}
/* Diagonal stripe accent */
.svc-gfx-art::after{
  content:'';
  position:absolute;
  top:-50%;
  right:-30%;
  width:200%;
  height:200%;
  background:repeating-linear-gradient(
    -45deg,
    transparent,
    transparent 18px,
    rgba(121,40,202,0.04) 18px,
    rgba(121,40,202,0.04) 20px
  );
  z-index:1;
  pointer-events:none;
}

/* Floating color blobs */
.gfx-blob{
  position:absolute;
  border-radius:50%;
  z-index:2;
  will-change:transform;
  mix-blend-mode:screen;
}
.gfx-blob-1{
  width:130px;height:130px;
  background:radial-gradient(circle,#ff007a 0%,rgba(255,0,122,0) 70%);
  top:8%;left:8%;
  animation:gfxFloat1 7s ease-in-out infinite;
}
.gfx-blob-2{
  width:110px;height:110px;
  background:radial-gradient(circle,#00d4ff 0%,rgba(0,212,255,0) 70%);
  top:45%;right:12%;
  animation:gfxFloat2 8s ease-in-out infinite;
}
.gfx-blob-3{
  width:100px;height:100px;
  background:radial-gradient(circle,#f5c842 0%,rgba(245,200,66,0) 70%);
  bottom:12%;left:20%;
  animation:gfxFloat3 9s ease-in-out infinite;
}
.gfx-blob-4{
  width:80px;height:80px;
  background:radial-gradient(circle,#38ef7d 0%,rgba(56,239,125,0) 70%);
  bottom:38%;right:5%;
  animation:gfxFloat1 6s ease-in-out infinite reverse;
}

/* Center icon badge */
.gfx-center-icon{
  position:relative;
  z-index:3;
  width:96px;height:96px;
  border-radius:28px;
  background:rgba(255,255,255,0.08);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,0.15);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  box-shadow:0 16px 40px rgba(0,0,0,0.35),inset 0 1px 0 rgba(255,255,255,0.1);
  transition:transform 0.5s cubic-bezier(0.16,1,0.3,1);
}
.gfx-center-icon .lucide{width:44px;height:44px;}
.svc-gfx-showcase:hover .gfx-center-icon{
  transform:rotate(12deg) scale(1.08);
}

/* Color palette swatches */
.gfx-palette{
  position:absolute;
  bottom:28px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:10px;
  z-index:3;
}
.gfx-swatch{
  width:26px;height:26px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,0.25);
  box-shadow:0 4px 12px rgba(0,0,0,0.35);
  transition:transform 0.3s,border-color 0.3s;
}
.gfx-swatch:hover{
  transform:scale(1.25);
  border-color:rgba(255,255,255,0.7);
}

/* Spinning pen orbit ring */
.gfx-orbit-ring{
  position:absolute;
  width:200px;height:200px;
  border:1px dashed rgba(255,255,255,0.1);
  border-radius:50%;
  z-index:2;
  animation:gfxPenSpin 20s linear infinite;
}
.gfx-orbit-dot{
  position:absolute;
  width:8px;height:8px;
  border-radius:50%;
  background:#7928ca;
  box-shadow:0 0 10px rgba(121,40,202,0.6);
  top:-4px;left:50%;
  margin-left:-4px;
}

/* ── Content Panel (right) ── */
.svc-gfx-content{
  padding:56px 52px;
  background:#fff;
  position:relative;
}
/* Top accent bar */
.svc-gfx-content::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:4px;
  background:linear-gradient(90deg,#ff007a,#7928ca,#00d4ff,#38ef7d,#f5c842);
}
.svc-gfx-content .svc-gfx-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 16px;
  border-radius:999px;
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:2px;
  margin-bottom:20px;
  background:linear-gradient(135deg,rgba(121,40,202,0.08),rgba(255,0,122,0.06));
  color:#6d28d9;
  border:1px solid rgba(121,40,202,0.15);
}
.svc-gfx-content .svc-gfx-badge .lucide{width:14px;height:14px;}
.svc-gfx-content h3{
  font-family:var(--font-display);
  font-size:clamp(1.7rem,2.8vw,2.3rem);
  color:var(--text-dark);
  margin-bottom:22px;
  font-weight:700;
  line-height:1.2;
}
.svc-gfx-content h3 em{
  font-style:italic;
  background:linear-gradient(135deg,#7928ca,#ff007a);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.svc-gfx-content p{
  font-size:1.05rem;
  color:var(--text-body);
  line-height:1.85;
  margin-bottom:16px;
}
.svc-gfx-content p:last-of-type{margin-bottom:0;}

/* Tool icons row */
.gfx-tools{
  display:flex;
  gap:12px;
  margin-top:28px;
  flex-wrap:wrap;
}
.gfx-tool-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 16px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:0.5px;
  border:1px solid rgba(0,0,0,0.08);
  color:var(--text-dark);
  background:#fff;
  transition:all 0.3s;
}
.gfx-tool-pill .lucide{width:14px;height:14px;}
.gfx-tool-pill:hover{
  border-color:#7928ca;
  color:#6d28d9;
  background:rgba(121,40,202,0.04);
}

/* ══════════════════════════════════════════════════════════════
   Featured Focus Cards — isolated spotlight treatment
   ══════════════════════════════════════════════════════════════ */
.svc-focus-stack{display:grid;gap:36px;max-width:1200px;margin:0 auto;}
.svc-focus-card{position:relative;overflow:hidden;border-radius:calc(var(--r-lg) + 4px);isolation:isolate;transition:transform 0.45s cubic-bezier(0.16,1,0.3,1),box-shadow 0.45s cubic-bezier(0.16,1,0.3,1);}
.svc-focus-card:hover{transform:translateY(-6px);}
.svc-focus-card__stage{display:grid;grid-template-columns:minmax(220px,280px) minmax(0,1fr);align-items:stretch;min-height:100%;}
.svc-focus-card__art{position:relative;display:flex;align-items:flex-end;justify-content:flex-start;padding:40px 32px;overflow:hidden;}
.svc-focus-card__content{position:relative;z-index:1;padding:48px 52px;}
.svc-focus-card h3{font-family:var(--font-display);font-size:clamp(1.85rem,2.8vw,2.5rem);line-height:1.12;margin-bottom:20px;}
.svc-focus-card p{font-size:1.04rem;line-height:1.88;margin-bottom:16px;}
.svc-focus-card p:last-child{margin-bottom:0;}
.svc-focus-card__icon{width:96px;height:96px;border-radius:28px;display:flex;align-items:center;justify-content:center;position:relative;z-index:2;}
.svc-focus-card__icon .lucide{width:46px;height:46px;}

.svc-focus-card--ghost{background:linear-gradient(140deg,#fdf8f0 0%,#f3eadc 52%,#ece0cc 100%);border:1px solid #d6c2a7;box-shadow:0 24px 60px rgba(85,60,28,0.14);}
.svc-focus-card--ghost::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 15% 22%,rgba(196,145,46,0.18),transparent 30%),radial-gradient(circle at 88% 80%,rgba(108,65,34,0.08),transparent 24%);}
.svc-focus-card--ghost::after{content:'';position:absolute;inset:22px;border:1px solid rgba(108,65,34,0.12);border-radius:28px;pointer-events:none;}
.svc-focus-card--ghost .svc-focus-card__art{background:linear-gradient(180deg,#5c3b1b 0%,#382518 100%);}
.svc-focus-card--ghost .svc-focus-card__art::before{content:'';position:absolute;inset:22px 18px;border-radius:24px;background:linear-gradient(180deg,rgba(255,245,221,0.12),transparent 34%,rgba(255,245,221,0.05));border:1px solid rgba(255,245,221,0.16);}
.svc-focus-card--ghost .svc-focus-card__content{background:linear-gradient(135deg,rgba(255,253,248,0.94),rgba(255,248,238,0.88));}
.svc-focus-card--ghost .svc-focus-card__icon{background:linear-gradient(135deg,#f6d28a,#c4912e);color:#2d1f0f;box-shadow:0 18px 40px rgba(0,0,0,0.2);}
.svc-focus-card--ghost h3{color:#26180f;}
.svc-focus-card--ghost p{color:#392d21;}
.svc-focus-card--ghost p:first-of-type::first-letter{float:left;font-family:var(--font-display);font-size:3.6rem;line-height:0.88;padding-right:10px;color:#7b4d17;}
.svc-focus-card__scribe-line{position:absolute;left:32px;right:32px;height:1px;background:linear-gradient(90deg,rgba(255,240,214,0),rgba(255,240,214,0.7),rgba(255,240,214,0));}
.svc-focus-card__scribe-line--1{top:76px;}
.svc-focus-card__scribe-line--2{top:126px;}
.svc-focus-card__scribe-line--3{top:176px;}

.svc-focus-card--care{background:linear-gradient(145deg,#081923 0%,#0c2831 50%,#103845 100%);border:1px solid rgba(94,234,212,0.18);box-shadow:0 28px 68px rgba(3,25,31,0.38);}
.svc-focus-card--care::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 84% 18%,rgba(94,234,212,0.16),transparent 26%),linear-gradient(90deg,rgba(255,255,255,0.03) 1px,transparent 1px);background-size:auto,24px 24px;}
.svc-focus-card--care::after{content:'';position:absolute;inset:18px;border:1px solid rgba(94,234,212,0.12);border-radius:30px;pointer-events:none;}
.svc-focus-card--care .svc-focus-card__art{background:linear-gradient(180deg,rgba(4,18,24,0.92),rgba(7,33,41,0.98));}
.svc-focus-card--care .svc-focus-card__art::before{content:'';position:absolute;inset:24px 20px;border-radius:24px;background:linear-gradient(180deg,rgba(86,208,194,0.08),rgba(86,208,194,0.02));border:1px solid rgba(86,208,194,0.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,0.02);}
.svc-focus-card--care .svc-focus-card__content{background:linear-gradient(135deg,rgba(7,25,33,0.86),rgba(8,30,39,0.74));-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);}
.svc-focus-card--care .svc-focus-card__icon{background:linear-gradient(135deg,#56d0c2,#147f79);color:#052421;box-shadow:0 18px 38px rgba(0,0,0,0.28);}
.svc-focus-card--care h3{color:#ffffff;}
.svc-focus-card--care p{color:#e9fbf8;}
.svc-focus-card--care p + p{padding-top:16px;border-top:1px solid rgba(94,234,212,0.16);}
.svc-focus-card__signal{position:absolute;left:36px;right:36px;border-radius:999px;background:linear-gradient(90deg,rgba(86,208,194,0.1),rgba(86,208,194,0.58));box-shadow:0 0 18px rgba(86,208,194,0.16);}
.svc-focus-card__signal--1{top:78px;height:10px;max-width:130px;}
.svc-focus-card__signal--2{top:114px;height:10px;max-width:175px;}
.svc-focus-card__signal--3{top:150px;height:10px;max-width:108px;}

/* ══════════════════════════════════════════════════════════════
   AI INTEGRATION — 3D BOX
   ══════════════════════════════════════════════════════════════ */
.ai-sec{background:var(--cream);padding:40px 48px 120px;position:relative;z-index:10;}
.ai-3d-box{background:var(--midnight);border-radius:var(--r-lg);padding:70px 60px;border:1px solid rgba(255,255,255,0.08);box-shadow:10px 10px 0px var(--teal),20px 20px 0px rgba(13,115,119,0.3),30px 30px 40px rgba(0,0,0,0.4);transform:rotateX(2deg) rotateY(-2deg);transform-style:preserve-3d;transition:transform 0.5s cubic-bezier(0.16,1,0.3,1),box-shadow 0.5s cubic-bezier(0.16,1,0.3,1);}
.ai-3d-box:hover{transform:rotateX(0deg) rotateY(0deg) translateY(-8px);box-shadow:14px 14px 0px var(--teal),28px 28px 0px rgba(13,115,119,0.2),35px 35px 50px rgba(0,0,0,0.5);}
.ai-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:70px;align-items:center;transform:translateZ(40px);}
.ai-visual-node{width:100%;height:440px;border:1px solid rgba(0,242,254,0.2);background:rgba(3,11,20,0.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:var(--r-md);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 0 50px rgba(0,242,254,0.1);}
.ai-visual-node::before{content:'';position:absolute;inset:0;background:linear-gradient(to top right,rgba(0,242,254,0.1),transparent);}
.ai-center-node{width:80px;height:80px;border-radius:50%;border:2px solid #00f2fe;display:flex;align-items:center;justify-content:center;background:#030b14;box-shadow:0 0 30px rgba(0,242,254,0.5);animation:aiPulse 2s infinite;z-index:10;}
.ai-center-node span{font-family:var(--font-display);font-weight:700;color:#00f2fe;font-size:1.8rem;}
.ai-orbit{position:absolute;inset:0;width:100%;height:100%;animation:aiSpin 30s linear infinite;}
@keyframes aiSpin{100%{transform:rotate(360deg)}}
@keyframes aiPulse{0%,100%{box-shadow:0 0 30px rgba(0,242,254,0.3)}50%{box-shadow:0 0 50px rgba(0,242,254,0.7)}}
.ai-content h2{font-family:var(--font-display);font-size:clamp(2.2rem,4vw,3rem);color:#fff;margin-bottom:24px;line-height:1.15;}
.ai-content h2 em{color:#00f2fe;font-style:normal;text-shadow:0 0 15px rgba(0,242,254,0.4);}
.ai-content p{color:rgba(255,255,255,0.85);font-size:1.05rem;line-height:1.85;margin-bottom:18px;}
.ai-content p:last-child{margin-bottom:0;}

/* ══════════════════════════════════════════════════════════════
   PROCESS — HOW I WORK
   ══════════════════════════════════════════════════════════════ */
.process-sec{background:#030b14;padding:120px 48px;position:relative;overflow:hidden;}
#process-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.process-sec .ambient-orb{position:absolute;border-radius:50%;filter:blur(100px);z-index:0;opacity:0.35;animation:float-orb 20s infinite alternate ease-in-out;pointer-events:none;will-change:transform;}
.process-sec .orb-1{width:400px;height:400px;background:#00f2fe;top:-10%;left:-10%;}
.process-sec .orb-2{width:500px;height:500px;background:#fe0979;bottom:10%;right:-10%;animation-delay:-5s;}
.process-sec .orb-3{width:300px;height:300px;background:#8b5cf6;top:40%;left:40%;animation-delay:-10s;}
@keyframes float-orb{0%{transform:translate(0,0) scale(1)}100%{transform:translate(50px,50px) scale(1.2)}}
.process-head{max-width:800px;margin:0 auto 80px;text-align:center;position:relative;z-index:10;}
.process-head h2{font-family:var(--font-display);font-size:clamp(2.5rem,5vw,3.6rem);color:#fff;margin-bottom:20px;}
.process-head p.subtitle{font-size:1.2rem;color:#00f2fe;margin-bottom:10px;}
.process-head p.desc{font-size:1.1rem;color:#94a3b8;}
.process-timeline{position:relative;max-width:1000px;margin:0 auto;z-index:10;}
.process-timeline::before{content:'';position:absolute;top:0;bottom:0;left:20px;width:2px;background:linear-gradient(to bottom,#00f2fe,#fe0979);z-index:0;}
.process-step{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:60px;position:relative;padding-left:60px;z-index:2;}
.process-orb{position:absolute;left:0;top:0;width:42px;height:42px;border-radius:50%;background:#030b14;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:1.2rem;z-index:5;}
.po-1{border:2px solid #00f2fe;color:#00f2fe;box-shadow:0 0 20px rgba(0,242,254,0.6);}
.po-2{border:2px solid #fe0979;color:#fe0979;box-shadow:0 0 20px rgba(254,9,121,0.6);}
.po-3{border:2px solid #00f2fe;color:#00f2fe;box-shadow:0 0 20px rgba(0,242,254,0.6);}
.po-4{border:2px solid #8b5cf6;color:#8b5cf6;box-shadow:0 0 20px rgba(139,92,246,0.6);}
.po-5{border:2px solid #ffffff;color:#ffffff;box-shadow:0 0 20px rgba(255,255,255,0.6);}
.process-content{width:100%;background:rgba(10,25,47,0.6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.2);border-radius:var(--r-md);padding:35px 40px;box-shadow:0 0 30px rgba(255,255,255,0.15),inset 0 0 20px rgba(255,255,255,0.05);transition:transform 0.3s ease,box-shadow 0.3s ease,border-color 0.3s ease;}
.process-content:hover{transform:translateY(-5px);box-shadow:0 0 45px rgba(255,255,255,0.25),inset 0 0 30px rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.4);}
.process-content h3{font-family:var(--font-display);font-size:1.4rem;color:#ffffff;margin-bottom:12px;line-height:1.35;}
.process-content p{font-size:1.15rem;color:#e2e8f0;line-height:1.8;}
@media(min-width:768px){
  .process-timeline::before{left:50%;transform:translateX(-50%);}
  .process-step{flex-direction:row;justify-content:space-between;align-items:center;padding-left:0;}
  .process-step:nth-child(odd){flex-direction:row-reverse;}
  .process-orb{left:50%;top:50%;transform:translate(-50%,-50%);}
  .process-content{width:calc(50% - 50px);}
}

/* ══════════════════════════════════════════════════════════════
   WHO I WORK WITH
   ══════════════════════════════════════════════════════════════ */
.cli-sec{background:var(--cream);position:relative;padding:120px 48px;}
.cli-sec::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--sand),transparent)}
.cli-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.cli-text p{margin-bottom:16px;color:var(--text-body);font-size:1.05rem;line-height:1.85;}
.cli-types{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.cli-type{padding:24px 16px;border-radius:var(--r-md);background:#fff;border:1px solid rgba(0,0,0,.05);text-align:center;transition:transform .3s,box-shadow .3s}
.cli-type:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.06)}
.cli-type .lucide{width:36px;height:36px;margin:0 auto 10px}
.cli-type span{display:block;font-size:.82rem;font-weight:600;color:var(--text-dark)}
.cli-type:nth-child(1) .lucide{color:var(--teal)}
.cli-type:nth-child(2) .lucide{color:var(--coral)}
.cli-type:nth-child(3) .lucide{color:var(--gold)}
.cli-type:nth-child(4) .lucide{color:var(--purple)}
.cli-type:nth-child(5) .lucide{color:var(--forest)}
.cli-type:nth-child(6) .lucide{color:#0EA5E9}
.cli-img-wrap{border-radius:var(--r-md);overflow:hidden;margin-top:24px;aspect-ratio:16/9;box-shadow:0 10px 30px rgba(0,0,0,.06)}
.cli-img-wrap img{width:100%;height:100%;object-fit:cover;object-position:top;}

/* ══════════════════════════════════════════════════════════════
   BUSINESSES I HAVE WORKED WITH — LOGO GRID
   ══════════════════════════════════════════════════════════════ */
.logos-sec{background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%);position:relative;padding:120px 48px;border-top:1px solid rgba(255,255,255,0.05);}
.logos-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(94,234,212,0.08),transparent 70%);pointer-events:none;}
.logos-head{text-align:center;margin-bottom:60px;position:relative;z-index:2;}
.logos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;max-width:1050px;margin:0 auto;position:relative;z-index:2;}
.logo-card{background:#ffffff;border-radius:var(--r-md);padding:35px 25px;display:flex;align-items:center;justify-content:center;aspect-ratio:3/2;box-shadow:0 10px 30px rgba(0,0,0,0.2);transition:transform 0.4s cubic-bezier(0.16,1,0.3,1),box-shadow 0.4s;position:relative;overflow:hidden;}
.logo-card::after{content:'';position:absolute;inset:0;border:1px solid rgba(0,0,0,0.05);border-radius:var(--r-md);pointer-events:none;}
.logo-card img{max-width:100%;max-height:100%;object-fit:contain;transition:transform 0.4s cubic-bezier(0.16,1,0.3,1);}
.logo-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(0,0,0,0.4);}
.logo-card:hover img{transform:scale(1.08);}

/* ══════════════════════════════════════════════════════════════
   BEYOND THE SCREEN — WARM ESPRESSO DARK
   ══════════════════════════════════════════════════════════════ */
.cre-sec{background:linear-gradient(135deg,#2C1810 0%,#1A0F08 100%);color:#E8E6E1;position:relative;padding:120px 48px;border-top:1px solid rgba(255,255,255,0.05);}
.cre-sec::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3z' fill='%23C4912E' fill-opacity='0.04'/%3E%3C/svg%3E");pointer-events:none;}
.cre-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;position:relative;z-index:2;}
.cre-text p{margin-bottom:18px;opacity:0.9;line-height:1.85;font-size:1.05rem;}
.cre-text p:last-child{margin-bottom:0;}
.plat-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.plat-card{display:flex;align-items:center;gap:14px;padding:16px 20px;border-radius:var(--r-md);background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);color:#fff;font-weight:600;text-decoration:none;transition:all 0.4s cubic-bezier(0.16,1,0.3,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);}
.plat-card svg{width:24px;height:24px;fill:currentColor;flex-shrink:0;transition:transform 0.4s;}
.plat-card .lucide{fill:none;stroke:currentColor;stroke-width:2;}
.plat-card.spotify:hover{background:rgba(29,185,84,0.12);border-color:#1DB954;color:#1DB954;transform:translateY(-4px);box-shadow:0 10px 25px rgba(29,185,84,0.15);}
.plat-card.amazon:hover{background:rgba(0,168,225,0.12);border-color:#00A8E1;color:#00A8E1;transform:translateY(-4px);box-shadow:0 10px 25px rgba(0,168,225,0.15);}
.plat-card.apple:hover{background:rgba(250,36,60,0.12);border-color:#FA243C;color:#FA243C;transform:translateY(-4px);box-shadow:0 10px 25px rgba(250,36,60,0.15);}
.plat-card.youtube:hover{background:rgba(255,0,0,0.12);border-color:#FF0000;color:#FF0000;transform:translateY(-4px);box-shadow:0 10px 25px rgba(255,0,0,0.15);}
.plat-card.shutter:hover{background:rgba(238,43,36,0.12);border-color:#EE2B24;color:#EE2B24;transform:translateY(-4px);box-shadow:0 10px 25px rgba(238,43,36,0.15);}
.plat-card.dreams:hover{background:rgba(135,185,75,0.12);border-color:#87B94B;color:#87B94B;transform:translateY(-4px);box-shadow:0 10px 25px rgba(135,185,75,0.15);}
.plat-card.unsplash:hover{background:rgba(255,255,255,0.12);border-color:#FFFFFF;color:#FFFFFF;transform:translateY(-4px);box-shadow:0 10px 25px rgba(255,255,255,0.15);}
.plat-card.pixabay:hover{background:rgba(2,179,136,0.12);border-color:#02b388;color:#02b388;transform:translateY(-4px);box-shadow:0 10px 25px rgba(2,179,136,0.15);}
.plat-card:hover svg{transform:scale(1.1);}

/* ══════════════════════════════════════════════════════════════
   LET'S WORK TOGETHER / CONTACT
   ══════════════════════════════════════════════════════════════ */
.cta-sec{background:var(--cream-deep);color:var(--text-body);position:relative;padding:120px 48px;border-top:1px solid rgba(0,0,0,0.05);}
.cta-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(13,115,119,.06),transparent 50%),radial-gradient(circle at 80% 50%,rgba(232,93,74,.05),transparent 50%);pointer-events:none;}
.cta-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center;position:relative;z-index:2;}
.cta-text p{margin-bottom:20px;color:var(--text-body);font-size:1.05rem;line-height:1.85;}
.cta-text p:last-child{margin-bottom:0;}
.cta-card{background:#ffffff;border-radius:var(--r-lg);padding:50px 40px;box-shadow:0 20px 60px rgba(0,0,0,0.08);border:1px solid rgba(0,0,0,0.05);}
.cta-contact-item{display:flex;align-items:center;gap:20px;margin-bottom:25px;padding-bottom:25px;border-bottom:1px solid rgba(0,0,0,0.05);text-decoration:none;transition:transform 0.3s ease;}
a.cta-contact-item:hover{transform:translateX(8px);}
.cta-contact-item.no-border{border-bottom:none;margin-bottom:10px;padding-bottom:0;}
.cta-icon-wrap{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.cta-icon-wrap.email{background:var(--teal-light);color:var(--teal);}
.cta-icon-wrap.wa{background:#E8F5E9;color:#25D366;}
.cta-info{flex:1;min-width:0;}
.cta-info h3{font-size:0.85rem;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:4px;}
.cta-info p{font-family:var(--font-display);font-size:1.35rem;color:var(--text-dark);margin:0;word-break:break-word;overflow-wrap:break-word;}
.cta-btn-wrap{margin-top:30px;}
.cta-btn-wrap .btn-teal{width:100%;justify-content:center;font-size:1.05rem;padding:18px;}
.cta-note{margin-top:30px;padding:20px 24px;border-radius:var(--r-sm);background:var(--cream);border-left:4px solid var(--coral);font-size:0.95rem;color:var(--text-muted);line-height:1.6;}

/* ══════════════════════════════════════════════════════════════
   SUBSCRIBE / NEWSLETTER SECTION
   ══════════════════════════════════════════════════════════════ */
.subscribe-sec{background:linear-gradient(to bottom, var(--cream-deep) 50%, var(--midnight) 50%);padding:0 48px;position:relative;z-index:20;}

/* UPDATED: Deep Space Navy to Rich Crimson Red gradient */
.subscribe-box{background:linear-gradient(135deg, #0f2027 0%, #203a43 50%, #8b0000 100%);border-radius:var(--r-lg);padding:60px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;box-shadow:0 25px 50px rgba(0,0,0,0.3);position:relative;overflow:hidden;}

/* UPDATED: Blue glow instead of teal behind the form */
.subscribe-box::before{content:'';position:absolute;top:-50%;right:-10%;width:400px;height:400px;background:radial-gradient(circle,rgba(59,130,246,0.15) 0%,transparent 60%);border-radius:50%;pointer-events:none;}

.subscribe-content{position:relative;z-index:2;}
.subscribe-content h2{font-family:var(--font-display);font-size:clamp(2rem,3vw,2.5rem);color:#fff;margin-bottom:16px;line-height:1.15;font-weight:400;}

/* UPDATED: Light reddish/pinkish italic accent */
.subscribe-content h2 em{color:#fca5a5;font-style:italic;}

.subscribe-content p{color:rgba(255,255,255,0.8);font-size:1.05rem;line-height:1.8;margin:0;}
.subscribe-form-wrap{position:relative;z-index:2;}

/* Override Jetpack's default styling */
.subscribe-form-wrap #subscribe-blog,
.subscribe-form-wrap .wp-block-jetpack-subscriptions{background:transparent!important;padding:0!important;border:none!important;box-shadow:none!important;margin:0!important;}
.subscribe-form-wrap form{display:flex;gap:12px;width:100%;align-items:center;margin:0;}
.subscribe-form-wrap form p{margin:0!important;padding:0!important;flex:1;}
.subscribe-form-wrap form p#subscribe-submit{flex:none;}
.subscribe-form-wrap input[type="email"]{width:100%;padding:16px 24px;border-radius:999px;border:1px solid rgba(255,255,255,0.2);background:rgba(255,255,255,0.05);color:#fff;font-family:var(--font-body);font-size:1rem;outline:none;transition:all 0.3s;box-shadow:inset 0 2px 4px rgba(0,0,0,0.1);}
.subscribe-form-wrap input[type="email"]::placeholder{color:rgba(255,255,255,0.5);}

/* UPDATED: Nice blue border glow on focus */
.subscribe-form-wrap input[type="email"]:focus{border-color:#60a5fa;background:rgba(255,255,255,0.1);}

/* UPDATED: Vibrant Red Button */
.subscribe-form-wrap input[type="submit"],
.subscribe-form-wrap button[type="submit"]{padding:16px 36px;border-radius:999px;background:#e11d48;color:#ffffff;font-weight:700;font-size:1rem;border:none;cursor:pointer;transition:all 0.3s;font-family:var(--font-body);text-transform:uppercase;letter-spacing:1px;white-space:nowrap;line-height:normal;}

/* UPDATED: Hover state flips to white with red text and red shadow */
.subscribe-form-wrap input[type="submit"]:hover,
.subscribe-form-wrap button[type="submit"]:hover{background:#ffffff;color:#e11d48;transform:translateY(-2px);box-shadow:0 10px 20px rgba(225,29,72,0.25);}

.subscribe-form-wrap label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.subscribe-form-wrap .success, .subscribe-form-wrap .error{color:#fff;font-size:0.9rem;margin-bottom:12px;padding:12px;border-radius:var(--r-sm);background:rgba(255,255,255,0.1);}

/* ══════════════════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════════════════ */
.footer{background:var(--midnight);color:#94a3b8;padding:100px 48px 30px;position:relative;z-index:10;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1.5fr;gap:60px;margin-bottom:60px;}
.footer-brand .nav-logo{color:#fff;margin-bottom:24px;}
.footer-info{font-size:0.95rem;line-height:1.8;margin-bottom:30px;max-width:450px;}
.social-links{display:flex;gap:14px;}
.social-links a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.05);color:#fff;transition:all 0.3s cubic-bezier(0.16,1,0.3,1);border:1px solid rgba(255,255,255,0.05);}
.social-links a:hover{background:var(--teal);border-color:var(--teal);transform:translateY(-4px);box-shadow:0 10px 20px rgba(13,115,119,0.3);}
.social-links svg{width:20px;height:20px;fill:currentColor;}
.footer-links h4{color:#fff;font-family:var(--font-display);font-size:1.3rem;margin-bottom:24px;font-weight:400;letter-spacing:0.5px;}
.footer-links ul{list-style:none;}
.footer-links li{margin-bottom:14px;}
.footer-links a{color:#94a3b8;text-decoration:none;font-size:0.95rem;transition:color 0.3s,padding-left 0.3s;display:inline-block;}
.footer-links a:hover{color:var(--teal-glow);padding-left:4px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.08);padding-top:30px;display:flex;justify-content:space-between;align-items:center;font-size:0.85rem;color:rgba(255,255,255,0.5);}

.kbh-footer{
  --kbh-paper:#f8f1e4;
  --kbh-paper-deep:#efe2c8;
  --kbh-ink:#5a462d;
  --kbh-ink-soft:#675540;
  --kbh-olive:#5d6f28;
  --kbh-olive-deep:#42511a;
  --kbh-olive-dark:#374413;
  --kbh-gold:#c19039;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at top right, rgba(193,145,57,0.12), transparent 18%),
    radial-gradient(circle at left center, rgba(93,111,40,0.1), transparent 22%),
    linear-gradient(180deg, var(--kbh-paper) 0%, #f6eddd 52%, var(--kbh-paper-deep) 100%);
  border-top:1px solid rgba(90,70,45,0.12);
}

.kbh-footer::before,
.kbh-footer::after{
  content:"";
  position:absolute;
  width:clamp(170px, 20vw, 260px);
  aspect-ratio:1;
  border-radius:50%;
  pointer-events:none;
  opacity:0.28;
  background:
    repeating-linear-gradient(45deg, rgba(193,145,57,0.28) 0 10px, rgba(193,145,57,0) 10px 20px),
    repeating-linear-gradient(-45deg, rgba(193,145,57,0.2) 0 10px, rgba(193,145,57,0) 10px 20px),
    radial-gradient(circle, rgba(255,246,227,0.9) 0 55%, rgba(255,246,227,0) 56%);
}

/* ══════════════════════════════════════════════════════════════
   BREADCRUMBS (SEO OPTIMIZED) - STYLING FIXES
   ══════════════════════════════════════════════════════════════ */
.breadcrumbs-wrapper {
  padding-top: 120px; /* Pushes the breadcrumbs down below the fixed header */
  padding-bottom: 20px;
  padding-left: 48px;
  padding-right: 48px;
  background: var(--cream);
  border-bottom: 1px solid rgba(0,0,0,0.04);
  position: relative;
  z-index: 10;
}

.breadcrumbs ol,
.breadcrumbs ul {
  list-style: none !important; /* Removes the 1. 2. 3. numbers */
  list-style-type: none !important; 
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin: 0 !important;
  padding: 0 !important;
}

.breadcrumbs li {
  list-style: none !important;
  list-style-type: none !important;
  display: flex;
  align-items: center;
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--text-muted);
  margin: 0 !important;
  padding: 0 !important;
}

.breadcrumbs li::before {
  display: none !important; /* Extra safety against theme bullets overriding */
}

.breadcrumbs li a {
  color: var(--teal);
  text-decoration: none;
  transition: color 0.3s;
  display: inline-flex;
  align-items: center;
}

.breadcrumbs li a:hover {
  color: var(--coral);
}

.breadcrumbs li[aria-current="page"] .current-item {
  color: var(--text-dark);
  font-weight: 600;
  background: var(--teal-light);
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 0.82rem;
  letter-spacing: 0.5px;
}

.bc-sep {
  color: var(--sand);
  display: flex;
  align-items: center;
}

.bc-sep .lucide {
  width: 16px;
  height: 16px;
}

/* ══════════════════════════════════════════════════════════════
   GLOBAL RESPONSIVE
   ══════════════════════════════════════════════════════════════ */
@media(max-width:1024px){
  .hero-grid{grid-template-columns:1fr;text-align:center;}
  .hero-text{order:2;display:flex;flex-direction:column;align-items:center;}
  .hero-pre{justify-content:center}
  .hero-pre::after{display:none;}
  .hero-visual{order:1;height:360px;margin-bottom:20px;}
  .hero-visual-orb{width:320px;height:320px;}
  .hero-avatar{width:220px;height:220px;}
  .hero-cta{justify-content:center}
  .stat-box{flex:1 1 calc(33.333% - 24px);}
  .stats-sec{padding:60px 24px;}
  .about-sec{padding-top:60px;padding-left:24px;padding-right:24px;}
  .about-grid{grid-template-columns:1fr;}
  .bg-grid{grid-template-columns:1fr;gap:50px;}
  .skills-inner{grid-template-columns:1fr;gap:60px;}
  .skills-sec{padding:80px 24px;}
  .skills-3d-box{transform:rotateY(0) rotateX(0);padding:30px 20px;box-shadow:6px 6px 0px rgba(109,40,217,0.4),12px 12px 0px rgba(79,70,229,0.25),20px 20px 30px rgba(0,0,0,0.5);}
  .skills-3d-box:hover{transform:none;}
  .svc-sec{padding:80px 24px 30px;}
  .svc-split{grid-template-columns:1fr;gap:0;margin-bottom:60px;}
  .svc-split-rev{direction:ltr;}
  .svc-split-img{min-height:300px;}
  .svc-split-text{padding:40px 32px;}
  .svc-split-editorial::after{display:none;}
  .svc-split-seo{border-image:none;border-top:5px solid #ef4444;}
  .svc-varied{grid-template-columns:1fr;gap:32px;margin-bottom:60px;}
  .svc-gfx-showcase{grid-template-columns:1fr;margin-bottom:60px;}
  .svc-gfx-art{min-height:280px;}
  .svc-gfx-content{padding:44px 32px;}
  
  /* UPDATED REVERSION FIX: Removed 60px bottom margin */
  .svc-focus-stack{gap:28px;margin-bottom:0;}
  
  .svc-focus-card__stage{grid-template-columns:1fr;}
  .svc-focus-card__art{min-height:210px;padding:32px 28px;}
  .svc-focus-card__content{padding:40px 32px;}
  .ai-grid{grid-template-columns:1fr;gap:50px;}
  .ai-3d-box{padding:50px 40px;}
  .process-sec{padding:80px 24px;}
  .cli-grid{grid-template-columns:1fr}
  .cli-sec{padding:80px 24px;}
  .logos-sec{padding:80px 24px;}
  .cre-grid{grid-template-columns:1fr;gap:50px;}
  .cre-sec{padding:80px 24px;}
  .cta-grid{grid-template-columns:1fr;gap:50px;}
  .cta-sec{padding:80px 24px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .footer-brand{grid-column:span 2;}
  
  /* Breadcrumbs wrapper */
  .breadcrumbs-wrapper { padding-left: 24px; padding-right: 24px; }
}

@media(max-width:768px){
  .subscribe-sec{padding:0 24px;}
  .subscribe-box{grid-template-columns:1fr;padding:40px 30px;gap:30px;}
  .subscribe-form-wrap form{flex-direction:column;}
  .subscribe-form-wrap form p{width:100%;}
  .subscribe-form-wrap input[type="submit"],
  .subscribe-form-wrap button[type="submit"]{width:100%;}
  .hero{padding:100px 24px 120px;min-height:auto;}
  .nav{padding:14px 24px}
  .nav-links{display:none}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(250,247,242,.97);backdrop-filter:blur(20px);padding:24px;gap:18px;border-bottom:1px solid rgba(0,0,0,.06)}
  .nav-toggle{display:block}
  .hero-visual{height:320px;}
  .hero-visual-orb{width:280px;height:280px;}
  .hero-avatar{width:190px;height:190px;}
  .float-badge{padding:8px 14px;font-size:0.75rem;}
  .fb-1{left:-10px;} .fb-2{right:-10px;} .fb-3{left:-20px;}
  .fb-4{right:-20px;} .fb-5{left:-5px;} .fb-6{right:-5px;}
  .stat-box{flex:1 1 calc(50% - 24px);min-width:200px;}
  .stats-sec{padding:50px 24px;}
  .about-sec{padding-top:60px;}
  .svc-split-text{padding:32px 24px;}
  .svc-v-body{padding:36px 24px;}
  .svc-v-parchment .svc-v-body{padding-left:52px;}
  .svc-v-parchment::before{left:28px;}
  .svc-v-parchment::after{left:32px;}
  .svc-gfx-art{min-height:240px;padding:32px 24px;}
  .svc-gfx-content{padding:36px 24px;}
  .svc-gfx-content h3{font-size:clamp(1.5rem,6vw,1.9rem);}
  .gfx-tools{gap:8px;}
  .gfx-tool-pill{padding:6px 12px;font-size:.72rem;}
  .svc-focus-card__art{min-height:180px;padding:28px 24px;}
  .svc-focus-card__content{padding:32px 24px;}
  .svc-focus-card__icon{width:82px;height:82px;border-radius:24px;}
  .svc-focus-card__icon .lucide{width:38px;height:38px;}
  .svc-focus-card h3{font-size:clamp(1.65rem,7vw,2rem);}
  .svc-focus-card p{font-size:1rem;line-height:1.8;}
  .svc-focus-card--ghost p:first-of-type::first-letter{font-size:3rem;padding-right:8px;}
  .svc-focus-card__scribe-line{left:24px;right:24px;}
  .svc-focus-card__scribe-line--1{top:68px;}
  .svc-focus-card__scribe-line--2{top:108px;}
  .svc-focus-card__scribe-line--3{top:148px;}
  .svc-focus-card__signal{left:24px;right:24px;}
  .svc-focus-card__signal--1{top:70px;}
  .svc-focus-card__signal--2{top:104px;}
  .svc-focus-card__signal--3{top:138px;}
  
  /* UPDATED REVERSION FIX: Removed extra 60px padding */
  .ai-sec{padding:30px 24px 60px;}
  
  .ai-3d-box{padding:40px 20px;box-shadow:6px 6px 0px var(--teal),12px 12px 0px rgba(13,115,119,0.3);transform:none;}
  .ai-3d-box:hover{transform:none;box-shadow:6px 6px 0px var(--teal),12px 12px 0px rgba(13,115,119,0.3);}
  .ai-grid{transform:none;}
  .ai-visual-node{height:320px;}
  .process-content{padding:25px 20px;}
  .process-content h3{font-size:1.25rem;}
  .process-step{padding-left:50px;margin-bottom:40px;}
  .process-timeline::before{left:18px;}
  .cli-types{grid-template-columns:1fr 1fr}
  .logos-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;}
  .logo-card{padding:25px 15px;}
  .plat-grid{gap:12px;}
  .cta-card{padding:40px 24px;}
  .footer{padding:60px 24px 30px;}
  .footer-grid{grid-template-columns:1fr;gap:40px;}
  .footer-brand{grid-column:span 1;}
  .footer-bottom{flex-direction:column;gap:15px;text-align:center;}

  /* Breadcrumbs wrapper */
  .breadcrumbs-wrapper { padding-top: 100px; padding-left: 24px; padding-right: 24px; }
}

@media(max-width:480px){
  .hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2rem,3.5vw,3.2rem);line-height:1.1;color:var(--text-dark);margin-bottom:12px}
  .hero-name{font-family:var(--font-display);font-size:clamp(1.1rem,1.5vw,1.4rem);color:var(--teal);margin-bottom:28px;font-style:italic}
  .btn{padding:13px 24px;font-size:.85rem}
  .hero-visual{height:280px;}
  .hero-visual-orb{width:240px;height:240px;}
  .hero-avatar{width:160px;height:160px;}
  .float-badge{padding:6px 10px;font-size:0.65rem;gap:4px;border-radius:8px;}
  .float-badge .lucide{width:14px;height:14px;}
  .fb-1{top:0;left:0;transform:none;} .fb-2{top:0;right:0;transform:none;}
  .fb-3{top:40%;left:-10px;} .fb-4{top:45%;right:-10px;}
  .fb-5{bottom:0;left:0;transform:none;} .fb-6{bottom:0;right:0;transform:none;}
  .stat-box{flex:1 1 100%;min-width:100%;}
  .stats-sec{padding:40px 24px;}
  .about-sec{padding-top:40px;}
  .svc-gfx-art{min-height:200px;}
  .gfx-center-icon{width:76px;height:76px;border-radius:22px;}
  .gfx-center-icon .lucide{width:36px;height:36px;}
  .gfx-orbit-ring{width:160px;height:160px;}
  .gfx-blob-1{width:100px;height:100px;}
  .gfx-blob-2{width:85px;height:85px;}
  .gfx-blob-3{width:75px;height:75px;}
  .gfx-blob-4{width:60px;height:60px;}
  .plat-grid{grid-template-columns:1fr;}
  .cta-card{padding:30px 20px;}
  .cta-contact-item{gap:15px;}
  .cta-info p{font-size:1.1rem;}
}

/* ══════════════════════════════════════════════════════════════
   REDUCED MOTION
   ══════════════════════════════════════════════════════════════ */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv,.rv-l,.rv-r{opacity:1!important;transform:none!important;transition:none!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ══════════════════════════════════════════════════════════════
   MEDIUM.COM EDITORIAL TYPOGRAPHY (For Pages & Blog Posts)
   ══════════════════════════════════════════════════════════════ */
.page-content {
  font-family: source-serif-pro, Georgia, Cambria, "Times New Roman", Times, serif !important;
  font-size: 21px !important;
  line-height: 1.58 !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  color: #242424 !important;
  -webkit-font-smoothing: antialiased;
}

.page-content p {
  margin-top: 0 !important;
  margin-bottom: 2em !important;
  letter-spacing: -0.003em !important;
}

.page-content h1,
.page-content h2,
.page-content h3,
.page-content h4 {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  color: #242424 !important;
  margin-top: 2.2em !important;
  margin-bottom: 0.8em !important;
  line-height: 1.2 !important;
}

.page-content h2 { font-size: 32px !important; letter-spacing: -0.015em !important; }
.page-content h3 { font-size: 26px !important; }

.page-content ul,
.page-content ol {
  margin-bottom: 2em !important;
  padding-left: 1.5em !important;
}

.page-content li {
  margin-bottom: 0.6em !important;
}

.page-content a {
  color: inherit !important;
  text-decoration: underline !important;
  text-decoration-color: var(--teal) !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 4px !important;
  transition: opacity 0.2s !important;
}

.page-content a:hover {
  opacity: 0.7 !important;
}