/* Retro arcade skin on the portfolio-2.0 layout by Tajmirul Islam (MIT), see LICENSE-portfolio-2.0.txt. Self-hosted fonts, no external requests. */
@font-face{font-family:'Press Start 2P';src:url('fonts/press-start-2p-latin.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'VT323';src:url('fonts/vt323-latin.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Roboto Flex';src:url('fonts/roboto-flex-latin.woff2') format('woff2');font-weight:100 800;font-style:normal;font-display:swap}

:root{
  --background:#140B2D;--background-light:#1E1245;--foreground:#F4E9FF;--card:#0C0620;
  --primary:#FF2E97;--primary-foreground:#140B2D;--secondary:#00E5FF;--accent:#FFD93D;
  --muted:#1B1040;--muted-foreground:#B7A6D9;--border:#3A2A75;
  --pixel:'Press Start 2P','Courier New',monospace;
  --vt:'VT323','Courier New',monospace;
  --flex:'Roboto Flex',system-ui,-apple-system,'Segoe UI',Roboto,'Noto Sans Bengali','Nirmala UI',sans-serif;
}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#FF2E97 #0C0620}
::-webkit-scrollbar{width:12px}
::-webkit-scrollbar-track{background:#0C0620}
::-webkit-scrollbar-thumb{background:#FF2E97;border:2px solid #0C0620}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
::selection{background:var(--primary);color:var(--primary-foreground)}

body.munna-portfolio{margin:0;background:var(--background);color:var(--foreground);font-family:var(--flex);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
.munna-portfolio *,.munna-portfolio *::before,.munna-portfolio *::after{box-sizing:border-box;border-color:var(--border)}
.munna-portfolio :where(h1,h2,h3,p,ul,ol,dl,dd,figure){margin:0;padding:0}
.munna-portfolio :where(ul,ol){list-style:none}
.munna-portfolio :where(a){color:inherit;text-decoration:none}
.munna-portfolio :focus-visible{outline:3px solid var(--secondary);outline-offset:3px}
.munna-portfolio .screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.munna-portfolio .skip-link{position:absolute;left:12px;top:-64px;z-index:100;background:var(--primary);color:var(--primary-foreground);padding:10px 14px;font-weight:700}
.munna-portfolio .skip-link:focus{top:12px}
.munna-portfolio .container{width:100%;max-width:1148px;margin-inline:auto;padding-inline:1rem}
.munna-portfolio [hidden]{display:none!important}
.munna-portfolio main,.munna-portfolio .site-footer{position:relative;z-index:1}
html.has-cursor,html.has-cursor *{cursor:none!important}

/* CRT scan lines */
.munna-portfolio .scanlines{position:fixed;inset:0;z-index:8;pointer-events:none;opacity:.5;mix-blend-mode:multiply;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0,rgba(0,0,0,.22) 1px,transparent 1px,transparent 3px)}

/* Preloader */
.munna-portfolio .preloader{position:fixed;inset:0;z-index:60;display:flex;animation:pl-failsafe .01s 8s forwards}
@keyframes pl-failsafe{to{visibility:hidden;opacity:0;pointer-events:none}}
.munna-portfolio .preloader-item{height:100%;width:10%;background:#0C0620;border-right:1px solid #1B1040;transition:transform .5s cubic-bezier(.45,0,.55,1) calc(var(--i)*100ms)}
.munna-portfolio .preloader.is-out .preloader-item{transform:translateY(100%)}
.munna-portfolio .preloader-stage{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem;padding:0 1rem}
.munna-portfolio .preloader-name{display:flex;flex-direction:column;align-items:center;gap:.5em;font-family:var(--pixel);font-size:11vw;line-height:1.2;text-align:center;white-space:nowrap;color:var(--secondary);text-shadow:3px 3px 0 var(--primary)}
@media (min-width:768px){.munna-portfolio .preloader-name{flex-direction:row;gap:.9em;font-size:min(5.2vw,64px)}}
.munna-portfolio .pn-word{display:flex;overflow:hidden;padding:.1em .08em .15em 0}
.munna-portfolio .pn-word .ch{display:inline-block;transform:translateY(120%);transition:transform .2s cubic-bezier(.45,0,.55,1) calc(var(--i)*50ms),opacity .3s ease}
.munna-portfolio .preloader.is-in .pn-word .ch{transform:none}
.munna-portfolio .preloader.is-out .pn-word .ch{opacity:0}
.munna-portfolio .preloader.is-done{visibility:hidden;opacity:0;pointer-events:none}
@media (prefers-reduced-motion:reduce){.munna-portfolio .preloader{display:none}}

/* Background stars, scroll progress, cursor */
.munna-portfolio .particles{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.munna-portfolio .scroll-progress{position:fixed;top:0;left:0;right:0;height:4px;z-index:7;pointer-events:none}
.munna-portfolio .scroll-progress span{display:block;height:100%;background:var(--primary);box-shadow:0 0 10px var(--primary);transform:scaleX(var(--p,0));transform-origin:left center}
.munna-portfolio .cursor{position:fixed;top:0;left:0;z-index:50;display:none;opacity:0;pointer-events:none;transition:opacity .2s}
.munna-portfolio .cursor path{fill:var(--primary);stroke:var(--secondary);stroke-width:1.5}
html.has-cursor .cursor{display:block}

/* Buttons */
.munna-portfolio .btn{display:inline-flex;align-items:center;justify-content:center;padding:1rem 1.6rem;font-family:var(--pixel);font-size:.78rem;line-height:1.3;text-transform:uppercase;transition:transform .12s,box-shadow .12s}
.munna-portfolio .btn-primary{background:var(--primary);color:var(--primary-foreground);border:3px solid var(--foreground);box-shadow:5px 5px 0 var(--secondary)}
.munna-portfolio .btn-primary:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--secondary)}

/* Banner: retro sun, grid floor, title */
.munna-portfolio .banner{position:relative;overflow:hidden}
.munna-portfolio .retro-sun{position:absolute;z-index:0;top:10%;right:max(3%,calc(50% - 540px));width:min(34vw,380px);aspect-ratio:1;border-radius:50%;pointer-events:none;background:linear-gradient(180deg,#FFD93D 0%,#FF8A3D 45%,#FF2E97 100%);opacity:.9;-webkit-mask-image:linear-gradient(#000,#000),repeating-linear-gradient(180deg,#000 0,#000 12px,transparent 12px,transparent 18px);mask-image:linear-gradient(#000,#000),repeating-linear-gradient(180deg,#000 0,#000 12px,transparent 12px,transparent 18px);-webkit-mask-size:100% 48%,100% 52%;mask-size:100% 48%,100% 52%;-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.munna-portfolio .retro-grid{position:absolute;z-index:0;left:-50%;right:-50%;bottom:0;height:42%;pointer-events:none;background-image:linear-gradient(rgba(0,229,255,.4) 1px,transparent 1px),linear-gradient(90deg,rgba(255,46,151,.4) 1px,transparent 1px);background-size:60px 60px;transform:perspective(300px) rotateX(58deg);transform-origin:center bottom;-webkit-mask-image:linear-gradient(to top,#000 10%,transparent 95%);mask-image:linear-gradient(to top,#000 10%,transparent 95%)}
.munna-portfolio .banner-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;height:100svh;min-height:560px}
.munna-portfolio .banner-copy{max-width:640px}
.munna-portfolio .banner-title{font-family:var(--pixel);font-weight:400;font-size:1.5rem;line-height:1.4;text-transform:uppercase;letter-spacing:normal}
@media (min-width:640px){.munna-portfolio .banner-title{font-size:min(5vw,3rem)}}
.munna-portfolio .banner-title .green{color:var(--primary);text-shadow:3px 3px 0 var(--secondary)}
.munna-portfolio .banner-title .indent{display:inline-block;margin-left:1rem;color:var(--foreground);text-shadow:3px 3px 0 rgba(255,46,151,.75)}
.munna-portfolio .banner-desc{margin-top:1.75rem;font-family:var(--vt);font-size:1.55rem;line-height:1.15;color:var(--muted-foreground)}
.munna-portfolio .banner-desc b{font-weight:400;color:var(--accent)}
.munna-portfolio .banner-btn{margin-top:2.25rem}
.munna-portfolio .banner-meta{display:flex;align-items:center;gap:.6rem;margin-top:1rem;font-family:var(--vt);font-size:1.3rem;color:var(--muted-foreground)}
.munna-portfolio .dot-white{display:block;flex:none;width:.7rem;height:.7rem;background:var(--secondary);box-shadow:0 0 8px var(--secondary)}
.munna-portfolio .banner-links{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;margin-top:2rem}
.munna-portfolio .banner-links-label{margin-bottom:.6rem;font-family:var(--vt);font-size:1.15rem;letter-spacing:.1em;color:var(--secondary)}
.munna-portfolio .banner-stats{position:absolute;right:4%;bottom:10%;display:flex;flex-direction:column;gap:2rem;text-align:right}
.munna-portfolio .stat strong{display:block;margin-bottom:.5rem;font-family:var(--pixel);font-weight:400;font-size:1.6rem;line-height:1.2;color:var(--accent);text-shadow:3px 3px 0 var(--primary)}
.munna-portfolio .stat span{font-family:var(--vt);font-size:1.3rem;color:var(--muted-foreground)}
@media (max-width:1100px){.munna-portfolio .retro-sun{opacity:.5}}
@media (max-width:767px){
  .munna-portfolio .retro-sun{display:none}
  .munna-portfolio .banner-inner{flex-direction:column;padding-bottom:2.5rem}
  .munna-portfolio .banner-copy{flex-grow:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
  .munna-portfolio .banner-stats{position:static;flex-direction:row;gap:2rem;text-align:center}
}
@media (prefers-reduced-motion:no-preference){
  .munna-portfolio .retro-grid{animation:grid-move 3s linear infinite}
}
@keyframes grid-move{to{background-position:0 60px,0 60px}}

/* Social icons: dark vector glyphs on light square badges */
.munna-portfolio .social-icons{display:flex;gap:14px}
.munna-portfolio .social-icon{display:inline-flex;flex:none;align-items:center;justify-content:center;width:44px;height:44px;background:var(--foreground);color:var(--background);box-shadow:3px 3px 0 var(--primary);transition:transform .12s,box-shadow .12s,background-color .2s}
.munna-portfolio a.social-icon:hover,.munna-portfolio a:hover>.social-icon{background:var(--secondary);transform:translate(2px,2px);box-shadow:1px 1px 0 var(--primary)}
.munna-portfolio .mail-link{display:inline-flex;align-items:center;gap:14px;font-family:var(--vt);font-size:1.45rem;color:var(--foreground);transition:color .2s}
.munna-portfolio .mail-link:hover span:last-child{color:var(--secondary);text-decoration:underline}

/* Sections */
.munna-portfolio .section{padding-bottom:clamp(96px,16vw,250px)}
.munna-portfolio .section-title{margin-bottom:clamp(32px,5vw,64px);font-family:var(--pixel);font-weight:400;font-size:clamp(1.1rem,3.2vw,2.25rem);line-height:1.4;text-transform:uppercase;color:var(--foreground);text-shadow:3px 3px 0 var(--primary)}
.munna-portfolio .section-title::before{content:'> ';color:var(--secondary)}

/* About */
.munna-portfolio .about-statement{max-width:22em;font-family:var(--vt);font-size:clamp(2rem,4.6vw,3.4rem);font-weight:400;line-height:1.08;letter-spacing:.01em}
.munna-portfolio .about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:25px 3rem;margin-top:clamp(56px,9vw,112px)}
.munna-portfolio .about-label{font-family:var(--vt);font-size:1.5rem;color:var(--secondary)}
.munna-portfolio .about-hi{margin-top:.75rem;font-family:var(--pixel);font-size:clamp(.9rem,1.8vw,1.3rem);line-height:1.6;text-transform:uppercase;color:var(--primary)}
.munna-portfolio .about-text{display:grid;gap:1.25rem;font-size:1.125rem;color:var(--muted-foreground)}
.munna-portfolio .about-text p{max-width:56ch}

/* Stack */
.munna-portfolio .stack-group{display:grid;grid-template-columns:minmax(0,.35fr) minmax(0,1fr);gap:25px;padding:1.75rem 0;border-top:2px solid var(--border)}
.munna-portfolio .stack-group:last-of-type{border-bottom:2px solid var(--border)}
.munna-portfolio .stack-label{font-family:var(--vt);font-size:1.5rem;color:var(--secondary);text-transform:lowercase}
.munna-portfolio .chips{display:flex;flex-wrap:wrap;gap:14px}
.munna-portfolio .chips li{display:inline-flex;align-items:center;gap:12px;padding:.5rem 1.2rem;border:2px solid var(--border);background:var(--muted);font-family:var(--vt);font-size:1.7rem;line-height:1.2;transition:border-color .15s,box-shadow .15s,transform .15s}
.munna-portfolio .chips li::before{content:'';width:10px;height:10px;background:var(--primary)}
.munna-portfolio .chips li:hover{border-color:var(--secondary);box-shadow:4px 4px 0 var(--secondary);transform:translate(-2px,-2px)}

/* How I work */
.munna-portfolio .how-row{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:25px;align-items:baseline;padding:2rem 0;border-top:2px solid var(--border)}
.munna-portfolio .how-row:last-child{border-bottom:2px solid var(--border)}
.munna-portfolio .how-name{font-family:var(--pixel);font-size:clamp(1rem,2.4vw,1.6rem);line-height:1.3;text-transform:uppercase;color:var(--accent);transition:color .2s}
.munna-portfolio .how-row:hover .how-name{color:var(--primary)}
.munna-portfolio .how-row p{max-width:48ch;font-size:1.125rem;color:var(--muted-foreground)}

/* Projects */
.munna-portfolio .projects-list{position:relative}
.munna-portfolio .project-rows{display:flex;flex-direction:column}
.munna-portfolio .project{display:flex;flex-direction:column;gap:.75rem;padding:2rem 0;border-top:2px solid var(--border);transition:opacity .3s}
.munna-portfolio .project-rows li:last-child .project{border-bottom:2px solid var(--border)}
.munna-portfolio .project-head{display:flex;align-items:baseline;gap:1rem}
.munna-portfolio .project-index{font-family:var(--vt);font-size:1.5rem;color:var(--secondary)}
.munna-portfolio .project-title{font-family:var(--pixel);font-size:clamp(1.4rem,4.4vw,2.9rem);line-height:1.2;text-transform:uppercase;transition:color .2s,transform .3s steps(6,end)}
.munna-portfolio .project-tags{font-family:var(--vt);font-size:1.35rem;color:var(--muted-foreground)}
.munna-portfolio .project-desc{max-width:46ch;color:var(--muted-foreground)}
.munna-portfolio .project-media{display:none;margin-top:.5rem;overflow:hidden;border:2px solid var(--border)}
.munna-portfolio .project-thumbs{display:none}
@media (min-width:768px){
  .munna-portfolio .project{padding-right:min(42%,400px)}
  .munna-portfolio .project:hover .project-title{color:var(--primary);transform:translateX(16px)}
  .munna-portfolio .projects-list:hover .project:not(:hover){opacity:.3}
  .munna-portfolio .project-thumbs{position:absolute;right:0;top:0;z-index:1;display:block;width:200px;aspect-ratio:3/4;overflow:hidden;pointer-events:none;opacity:0;border:3px solid var(--foreground);background:var(--card);box-shadow:8px 8px 0 var(--primary);transition:opacity .3s,transform 1s cubic-bezier(.25,.46,.45,.94)}
}
@media (min-width:1280px){.munna-portfolio .project-thumbs{width:350px}}
@media (max-width:767px){.munna-portfolio .project-media{display:block}}
.munna-portfolio .thumb{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:1rem;opacity:0;transition:opacity .5s}
.munna-portfolio .thumb.is-active{opacity:1}
.munna-portfolio .thumb-label{padding:0 1rem;font-family:var(--vt);font-size:1.2rem;color:var(--secondary)}

/* Contact */
.munna-portfolio .contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(32px,6vw,96px);align-items:start}
.munna-portfolio .contact-kicker{font-family:var(--vt);font-size:1.8rem;color:var(--secondary)}
.munna-portfolio .contact-email{display:inline-block;margin:1rem 0 2.25rem;font-family:var(--vt);font-size:clamp(2rem,4.6vw,2.9rem);line-height:1.05;overflow-wrap:anywhere;color:var(--foreground);text-shadow:2px 2px 0 var(--primary)}
.munna-portfolio .contact-email:hover{color:var(--accent);text-decoration:underline}
.munna-portfolio .contact-social{display:grid;gap:1rem}
.munna-portfolio .contact-social a{display:inline-flex;align-items:center;gap:14px;font-family:var(--vt);font-size:1.5rem;line-height:1.1;color:var(--foreground);transition:color .2s}
.munna-portfolio .contact-social a:hover span:last-child{color:var(--secondary)}
.munna-portfolio .contact-social small{display:block;font-size:1.15rem;color:var(--muted-foreground)}

/* Contact form (Jetpack). Its own stylesheet is not loaded on this page, so the needed rules live here. */
.munna-portfolio .portfolio-contact-form{min-width:0;align-self:start;background:var(--card);border:3px solid var(--foreground);box-shadow:8px 8px 0 var(--primary);padding:clamp(20px,3vw,32px)}
.munna-portfolio .portfolio-contact-form h3{margin-bottom:22px;font-family:var(--pixel);font-weight:400;font-size:1rem;line-height:1.5;text-transform:uppercase;color:var(--secondary)}
.munna-portfolio .portfolio-contact-form form{width:100%;max-width:100%}
.munna-portfolio .portfolio-contact-form .wp-block-jetpack-contact-form{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:18px!important;width:100%!important;max-width:100%;color:var(--foreground)}
.munna-portfolio .portfolio-contact-form .grunion-field-wrap{width:100%!important;max-width:100%!important;margin:0!important}
.munna-portfolio .portfolio-contact-form label,.munna-portfolio .portfolio-contact-form .grunion-field-label{display:block;margin-bottom:8px;font-family:var(--vt);font-size:1.3rem;font-weight:400;color:var(--foreground)}
.munna-portfolio .portfolio-contact-form .grunion-label-required{margin-left:.4em;font-size:1.1rem;font-weight:400;color:var(--muted-foreground)}
.munna-portfolio .portfolio-contact-form input[type=text],.munna-portfolio .portfolio-contact-form input[type=email],.munna-portfolio .portfolio-contact-form input[type=tel],.munna-portfolio .portfolio-contact-form input[type=url],.munna-portfolio .portfolio-contact-form textarea,.munna-portfolio .portfolio-contact-form select{display:block;width:100%!important;max-width:100%!important;min-height:46px;background:var(--background)!important;color:var(--foreground)!important;border:2px solid var(--border)!important;border-radius:0!important;padding:12px 14px!important;font:inherit!important}
.munna-portfolio .portfolio-contact-form textarea{height:140px!important;min-height:120px!important;max-height:320px;resize:vertical}
.munna-portfolio .portfolio-contact-form input:focus,.munna-portfolio .portfolio-contact-form textarea:focus,.munna-portfolio .portfolio-contact-form select:focus{outline:3px solid var(--secondary);outline-offset:0;border-color:var(--secondary)!important}
.munna-portfolio .portfolio-contact-form input[type=checkbox],.munna-portfolio .portfolio-contact-form input[type=radio]{width:auto;accent-color:var(--primary)}
.munna-portfolio .portfolio-contact-form .contact-form__input-error{display:flex;gap:.4em;margin:0;max-height:0;opacity:0;overflow:hidden;font-family:var(--vt);font-size:1.2rem;font-weight:400;color:var(--accent);transition:max-height .2s ease,opacity .2s ease,margin .2s ease}
.munna-portfolio .portfolio-contact-form .contact-form__input-error.has-errors{max-height:4em;margin-top:8px;opacity:1}
.munna-portfolio .portfolio-contact-form .contact-form__warning-icon{margin-top:.2em}
.munna-portfolio .portfolio-contact-form .contact-form__warning-icon svg{width:1em;height:1em;fill:currentColor}
.munna-portfolio .portfolio-contact-form .wp-block-button{width:100%;margin:6px 0 0}
.munna-portfolio .portfolio-contact-form input[type=submit],.munna-portfolio .portfolio-contact-form button[type=submit],.munna-portfolio .portfolio-contact-form .wp-block-button__link{display:flex;align-items:center;justify-content:center;width:100%;min-height:50px;background:var(--primary)!important;color:var(--primary-foreground)!important;border:3px solid var(--foreground)!important;border-radius:0!important;box-shadow:5px 5px 0 var(--secondary);padding:12px 20px!important;font-family:var(--pixel);font-size:.78rem;font-weight:400;line-height:1.3;text-align:center;text-transform:uppercase;cursor:pointer}
.munna-portfolio .portfolio-contact-form .wp-block-button__link:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--secondary)}
.munna-portfolio .portfolio-contact-form .contact-form-ajax-submission:not(.submission-success),.munna-portfolio .portfolio-contact-form .contact-form.submission-success{display:none}
.munna-portfolio .portfolio-contact-form .contact-form-submission,.munna-portfolio .portfolio-contact-form .form-error{color:var(--foreground);font-size:1rem}
.munna-portfolio .portfolio-contact-form .contact-form-submission h4{margin:0 0 12px;font-family:var(--vt);font-size:1.5rem;font-weight:400}
.munna-portfolio .portfolio-contact-form .go-back-message{margin-bottom:12px}
.munna-portfolio .portfolio-contact-form .go-back-message a{color:var(--secondary)}
html.has-cursor .portfolio-contact-form,html.has-cursor .portfolio-contact-form *{cursor:auto!important}
html.has-cursor .portfolio-contact-form input,html.has-cursor .portfolio-contact-form textarea{cursor:text!important}
html.has-cursor .portfolio-contact-form button,html.has-cursor .portfolio-contact-form .wp-block-button__link{cursor:pointer!important}

/* Footer and sticky email */
.munna-portfolio .site-footer{padding:1rem 0 1.5rem;text-align:center}
.munna-portfolio .copy{margin-top:1rem;font-family:var(--vt);font-size:1.25rem;color:var(--muted-foreground)}
.munna-portfolio .copy a:hover{color:var(--secondary);text-decoration:underline}
.munna-portfolio .sticky-email{position:fixed;left:24px;bottom:24px;z-index:5;display:none;writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--vt);font-size:1.2rem;letter-spacing:.05em;color:var(--muted-foreground);transition:color .2s}
.munna-portfolio .sticky-email:hover{color:var(--secondary)}
@media (min-width:1400px){.munna-portfolio .sticky-email{display:block}}

/* Legal page (privacy policy) */
.munna-portfolio .legal-header{padding:1.25rem 0;border-bottom:2px solid var(--border)}
.munna-portfolio .legal-brand{font-family:var(--pixel);font-size:.9rem;color:var(--secondary)}
.munna-portfolio .legal-main{padding:clamp(48px,8vw,96px) 0}
.munna-portfolio .legal-container{max-width:760px}
.munna-portfolio .legal-content h1{margin-bottom:14px;font-family:var(--pixel);font-weight:400;font-size:clamp(1.2rem,3vw,1.8rem);line-height:1.4;text-transform:uppercase;text-shadow:3px 3px 0 var(--primary)}
.munna-portfolio .legal-content h2{margin:40px 0 12px;font-family:var(--pixel);font-weight:400;font-size:.95rem;line-height:1.5;text-transform:uppercase;color:var(--secondary)}
.munna-portfolio .legal-content p{margin:0 0 16px;color:var(--muted-foreground)}
.munna-portfolio .legal-content ul{margin:0 0 16px;padding-left:22px;list-style:square;color:var(--muted-foreground)}
.munna-portfolio .legal-content li{margin-bottom:6px}
.munna-portfolio .legal-content a{color:var(--secondary);border-bottom:1px solid currentColor}
.munna-portfolio .legal-content .legal-updated{margin-bottom:32px;font-family:var(--vt);font-size:1.2rem}

/* Illustrations */
.munna-portfolio .ai-illustration,.munna-portfolio .rail{display:block;width:100%;height:auto}
.munna-portfolio .ai-illustration .ai-search{fill:var(--muted);stroke:var(--border);stroke-width:2}
.munna-portfolio .ai-illustration .ai-lens{fill:none;stroke:var(--muted-foreground);stroke-width:2.5;stroke-linecap:round}
.munna-portfolio .ai-illustration .ai-hint{stroke:var(--muted-foreground);stroke-width:4;stroke-linecap:round;opacity:.5}
.munna-portfolio .ai-illustration .ai-caret{stroke:var(--primary);stroke-width:2.5;stroke-linecap:round}
.munna-portfolio .ai-illustration .ai-tile rect{fill:var(--muted);stroke:var(--border);stroke-width:2}
.munna-portfolio .ai-illustration .ai-tile circle{fill:var(--muted-foreground);opacity:.7}
.munna-portfolio .ai-illustration .ai-tile line{stroke:var(--muted-foreground);stroke-width:3;stroke-linecap:round;opacity:.35}
.munna-portfolio .ai-illustration .ai-tile.is-active rect{stroke:var(--primary)}
.munna-portfolio .ai-illustration .ai-tile.is-active circle{fill:var(--primary);opacity:1}
.munna-portfolio .ai-illustration .ai-tile.is-active line{stroke:var(--foreground);opacity:.5}
.munna-portfolio .rail .horizon{stroke:var(--border);stroke-width:2}
.munna-portfolio .rail .rail-line{stroke:var(--secondary);stroke-width:3;stroke-linecap:round}
.munna-portfolio .rail .sleeper{stroke:var(--border);stroke-width:4;stroke-linecap:round}
.munna-portfolio .rail .signal{fill:var(--primary)}

/* Responsive */
@media (max-width:900px){
  .munna-portfolio .about-grid,.munna-portfolio .contact-grid,.munna-portfolio .stack-group,.munna-portfolio .how-row{grid-template-columns:minmax(0,1fr)}
}

/* Reveal on scroll */
.js .reveal{opacity:0;transform:translateY(40px)}
.js .reveal.is-visible{opacity:1;transform:none;transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:no-preference){
  .ai-illustration .ai-caret{animation:m-blink 1.1s steps(1) infinite}
  .ai-illustration .ai-tile.is-active circle{animation:m-pulse 2.4s ease-in-out infinite}
  .rail .signal{animation:m-pulse 2s ease-in-out infinite}
}
@keyframes m-pulse{50%{opacity:.35}}
@keyframes m-blink{50%{opacity:0}}
/* Preloader: arcade loading bar */
.munna-portfolio .preloader-bar{width:min(420px,72vw);font-family:var(--vt);font-size:1.5rem;color:var(--muted-foreground);transition:opacity .3s}
.munna-portfolio .pl-status{display:flex;justify-content:space-between;margin-bottom:.5rem;letter-spacing:.12em}
.munna-portfolio .pl-pct{color:var(--accent)}
.munna-portfolio .pl-track{height:24px;padding:3px;border:3px solid var(--foreground);background:var(--card)}
.munna-portfolio .pl-fill{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,var(--primary) 0,var(--primary) 12px,transparent 12px,transparent 16px)}
.munna-portfolio .preloader.is-ready .pl-label{color:var(--accent)}
.munna-portfolio .preloader.is-out .preloader-bar{opacity:0}
@media (prefers-reduced-motion:no-preference){
  .munna-portfolio .preloader.is-ready .pl-label{animation:m-blink .35s steps(1) 3}
}