/* Portfolio styles are embedded/maintained from the approved mobile-first layout. */
:root{--bg:#06101a;--ink:#edf7ff;--muted:#8aa3b7;--cyan:#4cc9ff;--line:rgba(126,205,255,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#06101a;color:var(--ink);font-family:Inter,system-ui,sans-serif;overflow-x:hidden}a{text-decoration:none;color:inherit}img{display:block;max-width:100%}.topbar{position:fixed;inset:0 0 auto;height:76px;padding:0 5vw;display:flex;align-items:center;gap:32px;background:rgba(6,16,26,.8);backdrop-filter:blur(18px);z-index:100}.brand{margin-right:auto;font-weight:700}.brand-mark,.section-kicker{color:var(--cyan);font-family:"JetBrains Mono",monospace}.topbar nav{display:flex;gap:22px}.menu-btn{display:none}.hero{min-height:165vh;padding:120px 5vw 80px;position:relative}.hero-content{position:sticky;top:76px;min-height:calc(100vh - 76px);width:min(1220px,100%);margin:auto;display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}.hero h1{font-size:clamp(3rem,6vw,6.7rem);line-height:.95;letter-spacing:-.06em}.gradient-text{background:linear-gradient(105deg,#fff,var(--cyan),#7e8dff);background-clip:text;-webkit-background-clip:text;color:transparent}.hero-lead,p{color:#a9bfd0;line-height:1.7}.hero-actions,.project-tags,.contact-actions{display:flex;gap:12px;flex-wrap:wrap}.btn{padding:14px 20px;border-radius:12px;font-weight:700}.btn-primary{background:linear-gradient(135deg,var(--cyan),#6b78ff);color:#03111c}.btn-secondary{border:1px solid var(--line)}.btn-whatsapp{background:#25D366;color:#03120a}.hero-visual{min-height:650px;position:relative;display:grid;place-items:center}.portrait-shell{width:min(440px,84vw);aspect-ratio:4/5;z-index:7}.portrait-card{width:100%;height:100%;overflow:hidden;border-radius:30px;border:1px solid var(--line);position:relative;box-shadow:0 40px 90px rgba(0,0,0,.45)}.portrait-card img{width:100%;height:100%;object-fit:cover;object-position:50% 27%}.portrait-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(4,15,24,.9),transparent 45%)}.portrait-label{position:absolute;left:20px;right:20px;bottom:18px;display:flex;justify-content:space-between;font:12px "JetBrains Mono"}.career-timeline{position:absolute;z-index:10;width:340px;right:-4px;bottom:64px;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:rgba(6,22,34,.96);opacity:0;transform:translate3d(0,54px,70px) scale(.94)}.code-head{padding:12px;border-bottom:1px solid var(--line)}.career-code{padding:17px;font:11px/1.8 "JetBrains Mono"}.career-code p{margin:0}.section{padding:110px 5vw}.section>*,.about-grid,.skill-grid,.project-feature,.client-project,.services-grid{max-width:1200px;margin-left:auto;margin-right:auto}.about-grid,.project-feature,.client-project,.services-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}.skill-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.skill-card,.service-item,.contact-card{border:1px solid var(--line);border-radius:20px;padding:26px;background:rgba(11,31,48,.55)}h2{font-size:clamp(2.4rem,5vw,5rem);letter-spacing:-.05em}.project-screen,.client-browser{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#07131f}.screen-content,.client-site-preview{min-height:390px;padding:0;display:flex;align-items:center;justify-content:center;background:#06101a}.project-real-image{width:100%;height:100%;min-height:390px;max-height:560px;object-fit:contain;object-position:center;background:#06101a}.client-browser .project-real-image{object-fit:cover;object-position:top center}.repo-strip,.contact-card{margin-top:60px}.portfolio-carousel{max-width:980px;margin:auto;display:grid;grid-template-columns:50px 1fr 50px;align-items:center}.carousel-viewport{overflow:hidden}.carousel-track{display:flex;transition:transform .6s ease}.carousel-slide{flex:0 0 100%;margin:0;text-align:center}.slide-frame{width:min(430px,76vw);height:min(660px,72vh);margin:auto;border-radius:28px;overflow:hidden;border:1px solid var(--line)}.slide-frame img{width:100%;height:100%;object-fit:cover;object-position:top}.carousel-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#091926;color:white}.carousel-dots{grid-column:1/-1;text-align:center}.demo-modal{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.82);display:none;padding:18px}.demo-modal.open{display:grid;place-items:center}.demo-shell{width:min(1400px,100%);height:92vh;background:#0a1118}.demo-shell iframe{width:100%;height:calc(100% - 52px);border:0;background:white}.demo-toolbar{height:52px;display:flex;align-items:center;padding:0 16px}.demo-toolbar button{margin-left:auto}@media(max-width:900px){.topbar nav{display:none}.menu-btn{display:block}.hero-content,.about-grid,.project-feature,.client-project,.services-grid{grid-template-columns:1fr}.hero-visual{min-height:560px}.skill-grid{grid-template-columns:1fr 1fr}.project-real-image{max-height:520px}}@media(max-width:600px){.hero{min-height:175vh}.hero h1{font-size:3.25rem}.section{padding:85px 6vw}.skill-grid{grid-template-columns:1fr}.career-timeline{width:min(77vw,330px);right:-8px}.portfolio-carousel{grid-template-columns:34px 1fr 34px}.slide-frame{width:79vw;height:65vh}.screen-content,.client-site-preview,.project-real-image{min-height:260px}.project-real-image{max-height:420px}}
