/* IzzyByte Studios website v2.1 — no third-party dependencies */
:root{color-scheme:dark;--bg:#04101f;--panel:#071a30;--cyan:#00e5f2;--blue:#007cff;--text:#f5faff;--muted:#b4c8d9;--line:#1c739e}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;font-family:Inter,Montserrat,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:radial-gradient(ellipse at 85% 18%,#07487c7d,transparent 35%),radial-gradient(ellipse at 18% 68%,#075b8c52,transparent 38%),linear-gradient(155deg,#030c19,#061b33 57%,#030d1a);min-height:100vh}body:before{content:"";position:absolute;top:180px;right:0;width:52%;height:480px;pointer-events:none;background:repeating-linear-gradient(147deg,transparent 0 65px,#0e81cf17 68px,#0bb8f51a 70px,transparent 73px 140px);mask-image:linear-gradient(90deg,transparent,#000);z-index:-1}a{color:inherit;text-decoration:none}button{font:inherit}.container{width:min(1360px,calc(100% - 64px));margin-inline:auto}.skip{position:absolute;top:-60px;left:12px;background:var(--cyan);color:#00131c;padding:12px;z-index:100}.skip:focus{top:8px}.site-header{position:relative;z-index:5;border-bottom:1px solid #1c5b85a8;background:#030d1bd9;backdrop-filter:blur(16px)}.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.home-link{display:flex;align-items:center}.header-name{font-size:1.4rem;font-weight:900;font-style:italic;letter-spacing:-.05em}.header-name span,.cyan{color:var(--cyan)}.header-name small{font-size:.54rem;letter-spacing:.28em;margin-left:8px;font-style:normal}.nav{display:flex;align-items:center;gap:clamp(20px,3.6vw,58px)}.nav a{position:relative;font-weight:650;padding:25px 0;color:#e4f2ff}.nav a:hover,.nav a:focus-visible,.nav a.active{color:var(--cyan)}.nav a.active:after{content:"";position:absolute;bottom:14px;left:0;right:0;height:3px;background:var(--cyan);box-shadow:0 0 15px var(--cyan)}.menu-toggle{display:none}.hero{display:grid;grid-template-columns:minmax(270px,.92fr) minmax(420px,1.15fr);align-items:center;gap:clamp(32px,5vw,100px);min-height:470px;padding-top:38px;padding-bottom:42px}.hero-logo{display:flex;align-items:center;justify-content:center;min-height:330px}.hero-logo img{width:min(100%,440px);height:auto;filter:drop-shadow(0 0 24px #008dff3d)}.eyebrow{font-size:.75rem;letter-spacing:.19em;color:#6cecff;font-weight:800;margin:0 0 18px}.hero h1{font-size:clamp(3.1rem,5.5vw,6rem);line-height:1.01;letter-spacing:-.055em;margin:0}.hero h1 em{font-style:italic;color:var(--cyan);text-shadow:0 0 30px #00ddff3a}.hero-sub{font-size:clamp(1.2rem,2vw,1.65rem);font-weight:700;margin:20px 0 8px}.hero-detail{color:var(--muted);font-size:1rem;margin:0 0 26px}.hero-actions{display:flex;flex-wrap:wrap;gap:16px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:14px;min-height:51px;padding:0 25px;border-radius:999px;font-weight:800;transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px)}.btn:focus-visible,.nav a:focus-visible,.text-link:focus-visible,.menu-toggle:focus-visible{outline:3px solid white;outline-offset:4px}.btn-primary{background:linear-gradient(110deg,#00e5f2,#00b9ee);color:#001622;box-shadow:0 0 22px #00e5f23a}.btn-outline{border:2px solid #c9f8ff;background:#03111c7a}.section-heading{margin-bottom:20px}.section-heading h2,.info-panel h2,.contact h2{font-size:clamp(1.8rem,3vw,2.7rem);letter-spacing:-.04em;margin:0}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.project-card{overflow:hidden;border:2px solid #02d5f6;border-radius:23px;background:linear-gradient(160deg,#07253c,#020d1a 80%);box-shadow:0 0 0 1px #023e68,0 12px 28px #0009,0 0 28px #00b4ff19;transition:transform .2s,box-shadow .2s}.project-card:hover{transform:translateY(-5px);box-shadow:0 15px 35px #000b,0 0 28px #00c8ff4a}.card-image{height:210px;position:relative;overflow:hidden}.card-image:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#03101f)}.card-image img{display:block;width:100%;height:100%;object-fit:cover}.card-body{display:flex;gap:16px;padding:8px 22px 25px;min-height:205px}.card-icon{color:#00edff;font-size:2.6rem;line-height:1;flex:0 0 48px;text-align:center;text-shadow:0 0 13px #00c8ff}.card-copy{min-width:0}.card-category{color:#76b9d6;letter-spacing:.12em;font-size:.66rem;font-weight:800;margin:0 0 8px}.card-copy h3{font-size:clamp(1.25rem,2vw,1.9rem);letter-spacing:-.045em;margin:0 0 9px}.card-copy h3 span{color:var(--cyan)}.card-copy>p:not(.card-category){font-size:.94rem;line-height:1.55;color:#d6e6f2;margin:0 0 14px}.status{display:inline-block;font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;font-weight:750;color:#8feef4;border:1px solid #267d99;border-radius:30px;padding:6px 10px}.info-section{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding-top:90px}.info-panel{padding:36px;border:1px solid #20658a;border-radius:20px;background:#061a2ec7}.info-panel p:not(.eyebrow),.contact p:not(.eyebrow){color:var(--muted);line-height:1.8;max-width:60ch}.text-link{color:var(--cyan);font-weight:750}.contact{text-align:center;padding-top:90px;padding-bottom:100px}.contact p{margin-inline:auto}.site-footer{border-top:1px solid #1c5b85;background:#030c18}.footer-inner{display:flex;justify-content:space-between;gap:20px;padding-block:25px;color:#a6c1d3;font-size:.84rem}@media(max-width:900px){.container{width:min(100% - 36px,700px)}.hero{grid-template-columns:1fr;gap:15px;padding-top:25px;text-align:center}.hero-logo{min-height:0;border-right:0}.hero-logo img{max-width:320px}.hero-actions{justify-content:center}.project-grid{grid-template-columns:1fr}.card-image{height:240px}.card-body{min-height:0}.info-section{grid-template-columns:1fr}.header-name{font-size:1.15rem}.nav{gap:17px}.nav a{font-size:.86rem}}@media(max-width:620px){.header-inner{min-height:68px}.menu-toggle{display:flex;width:44px;height:44px;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid #237a9d;border-radius:10px;background:#071b30;cursor:pointer}.menu-toggle span{width:21px;height:2px;background:#9ff6ff}.nav{display:none;position:absolute;left:0;right:0;top:68px;flex-direction:column;align-items:stretch;gap:0;background:#041426;border-bottom:1px solid #22789e;padding:10px 24px 20px}.nav.open{display:flex}.nav a{padding:13px}.nav a.active:after{bottom:4px;right:auto;width:40px}.hero h1{font-size:clamp(2.75rem,12vw,4.4rem)}.hero-logo img{max-width:270px}.hero-sub{font-size:1.15rem}.hero-detail{font-size:.95rem}.hero-actions{flex-direction:column}.btn{width:100%}.card-image{height:180px}.card-body{padding:10px 17px 22px;gap:10px}.card-icon{flex-basis:35px;font-size:2rem}.info-panel{padding:24px}.info-section{padding-top:60px}.contact{padding-top:65px;padding-bottom:70px}.footer-inner{flex-direction:column;text-align:center;gap:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* v2.2: approved hero + energetic three-card composition */
.site-header{background:#020c19f2;border-top:2px solid #00c8ef55}
.header-logo{display:block;width:clamp(165px,20vw,245px);height:auto;max-height:66px;object-fit:contain;object-position:left center}
.home-link{flex-shrink:0}
main{position:relative;isolation:isolate;overflow:hidden}
.light-streaks{position:absolute;z-index:-1;pointer-events:none;top:10px;right:-20%;width:75%;height:680px;opacity:.7;transform:rotate(-27deg);background:repeating-linear-gradient(90deg,transparent 0 74px,#0064ff13 78px,#00dcff78 81px,#0072ee21 84px,transparent 92px 160px);filter:blur(2px);mask-image:linear-gradient(0deg,transparent,#000 35%,#000 75%,transparent)}
.hero{min-height:410px;padding-top:26px;padding-bottom:24px;grid-template-columns:minmax(280px,.88fr) minmax(420px,1.12fr);gap:clamp(28px,4vw,75px)}
.hero-logo{min-height:300px}.hero-logo img{max-width:430px}
.hero h1{font-size:clamp(3.3rem,5.4vw,6.1rem)}
.hero-sub{font-size:clamp(1.18rem,1.9vw,1.55rem)}
.projects{position:relative;padding-top:10px}.section-heading{margin-bottom:18px}
.project-card{border-color:#00cdeb;border-radius:22px;box-shadow:0 10px 30px #000b,0 0 20px #009aff28}
.card-image{height:205px}.card-body{padding-top:8px}
@media(min-width:901px){.nav{margin-right:auto;margin-left:auto}.header-inner:after{content:'';width:100px;flex-shrink:2}.hero-copy{padding-left:4px}}
@media(max-width:900px){.hero{grid-template-columns:1fr;min-height:0;gap:12px}.hero-logo{min-height:0}.light-streaks{top:180px;right:-70%;width:140%;opacity:.4}.header-logo{width:180px}.header-inner:after{display:none}}
@media(max-width:620px){.header-logo{width:165px}.hero-logo img{max-width:300px}.hero{padding-top:18px}.projects{padding-top:30px}.card-image{height:200px}}

/* v2.2.1: centered navigation with no secondary header logo */
.header-inner{justify-content:center}
@media(min-width:901px){.nav{margin:0 auto}.header-inner:after{display:none}}
@media(max-width:620px){.header-inner{justify-content:flex-end}}

/* v2.2.3 — remove divider rules, elevate official logo, contact link */
.site-header{border-top:0!important;border-bottom:0!important;box-shadow:none!important}
.site-header::before,.site-header::after,.hero-logo::before,.hero-logo::after,.hero-copy::before,.hero-copy::after{content:none!important;display:none!important}
.hero-logo,.hero-copy{border:0!important;border-left:0!important;border-right:0!important;box-shadow:none!important}
.hero-logo{position:relative;isolation:isolate}
.hero-logo::selection{background:transparent}
.hero-logo img{position:relative;z-index:1;max-width:460px;filter:drop-shadow(0 12px 18px rgba(0,0,0,.75)) drop-shadow(0 0 22px rgba(0,190,255,.55)) drop-shadow(0 0 45px rgba(0,95,255,.25));transform:translateZ(0);transition:transform .3s ease,filter .3s ease}
@media(hover:hover){.hero-logo img:hover{transform:translateY(-4px) scale(1.025);filter:drop-shadow(0 18px 23px rgba(0,0,0,.8)) drop-shadow(0 0 30px rgba(0,220,255,.7))}}
.contact-email{color:#5af2ff;font-weight:800;text-decoration:underline;text-decoration-color:#2acde8;text-underline-offset:5px;overflow-wrap:anywhere}
.contact-email:hover,.site-footer a:hover{color:#fff}
@media(max-width:900px){.hero-logo img{max-width:350px}}
@media(max-width:620px){.hero-logo img{max-width:300px}}
@media(prefers-reduced-motion:reduce){.hero-logo img:hover{transform:none}}
