/* Four self-contained, inert portfolio art compositions. Parent: .portfolio-art. */
.mka-tile{position:relative;isolation:isolate;width:100%;height:100%;min-height:440px;overflow:hidden;container-type:inline-size;container-name:mka;font-family:Arial,Helvetica,sans-serif;text-align:left;line-height:1.2;color:#15202b}
.mka-tile *{box-sizing:border-box}.mka-tile img{display:block;max-width:none}.mka-tile p,.mka-tile h3{margin:0}.mka-brand{position:absolute;z-index:5;left:30px;top:27px;object-fit:contain;object-position:left center}.mka-heading{position:absolute;z-index:5;left:30px;top:82px;font-size:clamp(23px,4.4cqw,29px);font-weight:700;letter-spacing:-1.1px;line-height:1.08}.mka-eyebrow{position:absolute;z-index:5;font-size:9px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase}.mka-caption{font-size:9px;letter-spacing:.3px}.mka-dot{display:inline-block;width:5px;height:5px;border-radius:50%;flex:none}.mka-window-dots{display:flex;gap:4px;align-items:center}.mka-window-dots i{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.3}.mka-browser-bar{display:flex;align-items:center;gap:12px;min-height:27px;padding:0 11px;font-size:7px;letter-spacing:.2px}.mka-browser-url{flex:1;text-align:center;padding-right:22px;opacity:.65}.mka-concept{position:absolute;font-size:8px;letter-spacing:.4px;white-space:nowrap;z-index:8}.mka-screen-lines{display:grid;gap:5px}.mka-screen-lines i{display:block;height:3px;border-radius:4px;background:currentColor;opacity:.12}.mka-screen-lines i:last-child{width:65%}

/* WeedMachine — light grazing across the hardware, with generous black space. */
.mka-weed{background:#071008;color:#f4f7f1}.mka-weed:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 76% 65%,#294619 0,transparent 52%),linear-gradient(110deg,#040705 12%,#0e1d0c 100%)}.mka-weed:after{content:"";position:absolute;width:490px;height:490px;border:1px solid #9af01c16;border-radius:50%;right:-80px;top:42px;box-shadow:0 0 0 47px #9af01c05,0 0 0 94px #9af01c03;z-index:0}.mka-weed .mka-brand{width:172px;height:29px}.mka-weed .mka-heading{top:119px;width:255px;font-size:clamp(26px,5.2cqw,34px);line-height:1.06;letter-spacing:-1.4px}.mka-weed .mka-heading span{color:#9af01c}.mka-weed .mka-eyebrow{left:31px;top:94px;color:#8d9b88;letter-spacing:1.35px;font-size:8px}.mka-weed-product{position:absolute;z-index:3;height:370px;width:auto;right:8px;bottom:-20px;transform:rotate(-5deg);filter:drop-shadow(-21px 16px 22px #0009)}.mka-weed-plinth{position:absolute;width:302px;height:43px;right:-4px;bottom:-19px;background:#13230e;border-radius:50%;border:1px solid #b4ff6120;box-shadow:0 -10px 30px #9af01c10}.mka-weed-notes{position:absolute;left:31px;bottom:49px;z-index:4;display:grid;gap:11px;color:#a4b49b;font-size:10px;letter-spacing:.15px}.mka-weed-notes span{display:flex;gap:8px;align-items:center}.mka-weed-notes .mka-dot{background:#9af01c;box-shadow:0 0 8px #9af01c66}.mka-weed-bottom{position:absolute;left:31px;right:31px;bottom:20px;display:flex;justify-content:space-between;color:#6f8268;font-size:8px;letter-spacing:1.3px;text-transform:uppercase;z-index:6}.mka-weed-bottom span:last-child{color:#9af01c}

/* GMap Caller — a map canvas and two connected interface studies. */
.mka-gmap{background:#031528;color:#f5f9ff}.mka-gmap:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 76% 22%,#07536c60,transparent 62%),linear-gradient(130deg,#031528 10%,#041c30 100%)}.mka-gmap .mka-brand{width:173px;height:35px}.mka-gmap .mka-heading{top:83px;font-size:clamp(23px,4.6cqw,29px);max-width:330px}.mka-gmap .mka-heading span{color:#20e4df}.mka-gmap-orbit{position:absolute;width:330px;height:330px;right:-100px;top:-75px;border:1px solid #20e4df14;border-radius:50%;box-shadow:0 0 0 32px #20e4df05,0 0 0 64px #20e4df04}.mka-gmap-browser{position:absolute;z-index:2;left:29px;top:178px;width:78%;height:224px;border:1px solid #2e5c7390;border-radius:10px;overflow:hidden;background:#071d32;transform:rotate(-3deg);box-shadow:0 19px 33px #0005}.mka-gmap-browser .mka-browser-bar{background:#0d293e;color:#b0cee0;border-bottom:1px solid #2b5066}.mka-gmap-workspace{display:flex;height:197px}.mka-gmap-map{position:relative;width:58%;overflow:hidden;background:#0b263e}.mka-gmap-map>img{position:absolute;height:100%;width:100%;object-fit:cover;opacity:.56}.mka-map-search{position:absolute;left:11px;right:11px;top:12px;display:flex;gap:7px;align-items:center;background:#072035e8;padding:8px;border:1px solid #4a7c913d;border-radius:5px;font-size:8px;color:#d9f2fa}.mka-map-search svg{width:10px;height:10px;flex:none}.mka-map-pin{position:absolute;width:15px;height:15px;border-radius:50% 50% 50% 0;background:#20e4df;transform:rotate(-45deg);box-shadow:0 0 0 6px #20e4df16,0 4px 10px #0004}.mka-map-pin:after{content:"";position:absolute;inset:5px;background:#052a3b;border-radius:50%}.mka-map-pin.mka-pin-one{left:28%;top:49%}.mka-map-pin.mka-pin-two{left:64%;top:39%}.mka-map-pin.mka-pin-three{left:55%;top:72%;background:#168cff}.mka-gmap-list{width:42%;padding:13px 11px;border-left:1px solid #36546755}.mka-mini-title{font-size:9px;font-weight:700;letter-spacing:.1px}.mka-gmap-list .mka-mini-title{color:#e4f6fc}.mka-gmap-row{padding:12px 0;border-bottom:1px solid #36546744;display:flex;gap:7px;align-items:center}.mka-gmap-row>i{width:19px;height:21px;border:1px solid #4c9aab4d;background:#20e4df0f;border-radius:4px;flex:none}.mka-gmap-row>div{flex:1;display:grid;gap:5px}.mka-gmap-row strong{font-size:7px;font-weight:500;color:#bed3e0}.mka-gmap-row .mka-screen-lines{color:#bfdae7}.mka-gmap-phone{position:absolute;z-index:4;right:22px;top:148px;width:129px;height:254px;padding:7px;background:#06121e;border:1px solid #477085;border-radius:24px;transform:rotate(6deg);box-shadow:-7px 14px 28px #0005}.mka-gmap-phone-screen{position:relative;height:100%;border-radius:17px;overflow:hidden;background:linear-gradient(#092a3e,#041a2d)}.mka-phone-island{height:11px;width:47px;background:#06121e;border-radius:0 0 10px 10px;margin:0 auto}.mka-gmap-phone .mka-mini-title{text-align:center;font-size:8px;margin-top:16px;color:#d3ebf6}.mka-call-icon{display:grid;place-items:center;width:51px;height:51px;margin:18px auto 14px;border:1px solid #20e4df5e;border-radius:50%;background:#20e4df0d;box-shadow:0 0 0 8px #20e4df06;color:#20e4df}.mka-call-icon svg{width:22px;height:22px}.mka-call-label{text-align:center;color:#d6edf4;font-size:9px;font-weight:600}.mka-wave{height:25px;display:flex;justify-content:center;align-items:center;gap:3px;margin:11px 0}.mka-wave i{display:block;width:2px;background:#20e4df;border-radius:3px;height:8px;opacity:.8}.mka-wave i:nth-child(3n){height:18px}.mka-wave i:nth-child(4n){height:12px}.mka-wave i:nth-child(5n){height:23px}.mka-call-chip{display:flex;align-items:center;justify-content:center;gap:5px;margin:0 9px;padding:7px 2px;border:1px solid #20e4df27;border-radius:5px;color:#97dacf;font-size:7px}.mka-call-chip .mka-dot{width:4px;height:4px;background:#19e79b}.mka-gmap .mka-concept{left:31px;bottom:17px;color:#759cb4}

/* Spectosoft — a clean printed-paper treatment around actual product UI. */
.mka-specto{background:#f1f0ee;color:#272727}.mka-specto:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 85% 3%,#fff 0,transparent 70%),linear-gradient(0deg,#e8e8e5,transparent 55%)}.mka-specto .mka-brand{width:155px;height:38px}.mka-specto .mka-heading{top:91px;max-width:310px;font-size:clamp(25px,4.7cqw,31px)}.mka-specto .mka-heading span{color:#d42729}.mka-specto .mka-eyebrow{right:28px;top:35px;left:auto;font-size:8px;color:#8d8d89;text-align:right;line-height:1.7;letter-spacing:1px}.mka-specto-accent{position:absolute;width:177px;height:177px;border-radius:50%;background:#d42729;right:-47px;top:175px;box-shadow:inset 0 0 0 34px #be1e21,inset 0 0 0 35px #df585850}.mka-specto-frame-back{position:absolute;left:16%;top:159px;width:69%;height:238px;background:#e7e7e3;border:1px solid #d6d6d1;border-radius:10px;transform:rotate(7deg)}.mka-specto-browser{position:absolute;left:8%;top:172px;width:77%;height:246px;overflow:hidden;border-radius:10px;background:#fff;border:1px solid #d5d5d0;box-shadow:0 18px 34px #2727271a;transform:rotate(-3deg)}.mka-specto-browser .mka-browser-bar{background:#fafaf8;color:#a0a09b;border-bottom:1px solid #e8e8e4;min-height:26px}.mka-specto-app{display:flex;height:220px}.mka-specto-sidebar{width:37px;padding:13px 9px;border-right:1px solid #eee;background:#fafaf9;flex:none;display:flex;flex-direction:column;gap:14px;align-items:center}.mka-specto-sidebar>i{display:block;width:12px;height:12px;border-radius:3px;border:1px solid #c5c8ca}.mka-specto-sidebar>i:first-child{border-color:#d42729;background:#d427290d;box-shadow:0 0 0 4px #d4272909}.mka-specto-app-main{padding:15px 13px;flex:1;min-width:0}.mka-specto-app-heading{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:11px}.mka-specto-app-heading strong{font-size:10px}.mka-specto-app-heading span{font-size:6px;padding:4px 5px;border:1px solid #e1e1dc;border-radius:3px;color:#777}.mka-specto-image{width:100%;height:auto;border:1px solid #f0f0ed;border-radius:6px}.mka-specto-tab{position:absolute;right:24px;bottom:31px;z-index:4;background:#fff;border:1px solid #e4e4e0;border-radius:9px;padding:13px 16px;box-shadow:0 8px 21px #27272712;transform:rotate(4deg);display:flex;align-items:center;gap:9px;font-size:9px;font-weight:600;color:#272727}.mka-specto-tab>span{display:block;width:21px;height:21px;border-radius:6px;background:#d4272910;color:#d42729;text-align:center;line-height:21px;font-size:13px;font-weight:400}.mka-specto .mka-concept{left:30px;bottom:10px;color:#91918c;font-size:7px}

/* Interview Screener — blue glass, paired devices, actual platform screenshot. */
.mka-interview{background:#eaf2ff;color:#202b3b}.mka-interview:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 20% 12%,#fff 0,transparent 53%),radial-gradient(ellipse at 95% 89%,#b0ccff,transparent 58%)}.mka-interview:after{content:"";position:absolute;left:-43px;right:-110px;bottom:-195px;height:370px;border:1px solid #fff9;border-radius:50%;transform:rotate(-13deg);box-shadow:0 0 0 36px #ffffff20,0 0 0 73px #ffffff17}.mka-interview .mka-brand{width:162px;height:37px}.mka-interview .mka-heading{top:86px;width:350px;font-size:clamp(24px,4.8cqw,31px)}.mka-interview .mka-heading span{color:#2879ef}.mka-interview-star{position:absolute;right:37px;top:43px;color:#3388ff;opacity:.8}.mka-interview-star svg{height:42px;width:42px}.mka-interview-browser{position:absolute;z-index:2;left:27px;top:182px;width:79%;height:203px;background:#fff;border:1px solid #b7cdee;border-radius:9px;overflow:hidden;transform:rotate(-4deg);box-shadow:0 21px 36px #2d72bc24}.mka-interview-browser .mka-browser-bar{min-height:26px;background:#f8fbff;color:#7b94b2;border-bottom:1px solid #e1e9f3}.mka-interview-image{height:auto;width:115%;position:relative;left:-1px;top:4px}.mka-interview-device-foot{position:absolute;width:56%;height:13px;left:10%;top:378px;z-index:1;border-radius:2px 2px 15px 15px;background:linear-gradient(#d2e0f2,#aec7e7);transform:rotate(-4deg);box-shadow:0 13px 19px #2d72bc16}.mka-interview-phone{position:absolute;z-index:4;width:130px;height:259px;right:24px;top:154px;border:1px solid #9fbae0;border-radius:25px;padding:7px;background:#f9fbff;transform:rotate(7deg);box-shadow:-9px 17px 28px #2164aa2b}.mka-interview-phone-screen{height:100%;border:1px solid #e0e8f3;background:#fff;border-radius:18px;overflow:hidden;position:relative}.mka-interview-phone .mka-phone-island{background:#f9fbff;width:47px;height:10px;border:1px solid #e0e8f3;border-top:0}.mka-interview-phone-logo{width:75px;height:auto;margin:14px auto 16px}.mka-interview-phone-title{font-size:9px;font-weight:700;text-align:center;color:#252525}.mka-interview-voice{display:grid;place-items:center;width:50px;height:50px;margin:15px auto 12px;border-radius:50%;background:linear-gradient(135deg,#77afff,#2879ef);color:#fff;box-shadow:0 0 0 7px #3388ff0a}.mka-interview-voice svg{width:21px;height:21px}.mka-interview-phone .mka-wave{margin:8px 0 10px;height:23px;gap:3px}.mka-interview-phone .mka-wave i{background:#3388ff}.mka-interview-phone-line{display:block;font-size:7px;text-align:center;color:#8190a4}.mka-interview-phone-bottom{position:absolute;left:13px;right:13px;bottom:12px;border-top:1px solid #eaf0f8;padding-top:9px;display:flex;gap:5px;align-items:center;justify-content:center;font-size:6px;color:#8497ac}.mka-interview-phone-bottom .mka-dot{background:#3388ff;width:4px;height:4px}.mka-interview .mka-concept{left:30px;bottom:17px;color:#8297b4}

/* Container queries also adapt when the outer portfolio grid changes columns. */
@container mka (max-width:430px){
 .mka-brand{left:23px;top:25px}.mka-heading{left:23px;letter-spacing:-.8px}.mka-weed .mka-brand{width:155px}.mka-weed .mka-heading{top:108px;width:204px;font-size:28px;z-index:5}.mka-weed .mka-eyebrow{left:24px;top:84px;font-size:7px}.mka-weed-product{height:302px;right:-24px;bottom:-20px;transform:rotate(-5deg)}.mka-weed-notes{left:24px;bottom:55px;font-size:8px;gap:10px}.mka-weed-bottom{left:24px;right:22px;font-size:7px}.mka-weed-bottom span:last-child{display:none}.mka-weed-plinth{right:-60px;width:280px}.mka-weed:after{right:-190px;top:95px}
 .mka-gmap .mka-brand{width:157px}.mka-gmap .mka-heading{left:23px;top:83px;font-size:27px;max-width:285px}.mka-gmap-browser{left:19px;top:192px;width:85%;height:203px}.mka-gmap-workspace{height:176px}.mka-gmap-map{width:58%}.mka-gmap-list{padding:12px 8px}.mka-gmap-row{padding:11px 0}.mka-gmap-phone{right:14px;top:171px;width:110px;height:232px}.mka-gmap-phone .mka-mini-title{font-size:7px;margin-top:13px}.mka-call-icon{width:42px;height:42px;margin:16px auto 12px}.mka-gmap-phone .mka-wave{margin:8px 0}.mka-call-chip{font-size:6px;margin:0 5px}.mka-gmap .mka-concept{left:23px;bottom:16px}.mka-map-search{font-size:6px;left:8px;right:7px;padding:7px;gap:5px}.mka-gmap-row strong{font-size:6px}.mka-gmap-row>i{width:14px;height:17px}.mka-gmap-list .mka-mini-title{font-size:8px}
 .mka-specto .mka-brand{width:142px}.mka-specto .mka-heading{top:87px;width:268px;font-size:28px}.mka-specto .mka-eyebrow{right:22px;top:29px;font-size:6px}.mka-specto-browser{left:18px;top:183px;width:89%;height:224px}.mka-specto-frame-back{left:32px;top:173px;width:88%;height:223px}.mka-specto-sidebar{width:30px;padding-left:7px;padding-right:7px}.mka-specto-app-main{padding:13px 9px}.mka-specto-app-heading{margin-bottom:10px}.mka-specto-app-heading strong{font-size:9px}.mka-specto-app-heading span{font-size:5px}.mka-specto-tab{right:15px;bottom:32px;padding:10px 12px;font-size:8px}.mka-specto .mka-concept{left:23px;bottom:11px}.mka-specto-accent{right:-71px;top:165px}
 .mka-interview .mka-brand{width:150px}.mka-interview .mka-heading{top:87px;font-size:28px;width:280px}.mka-interview-star{right:20px;top:36px}.mka-interview-star svg{width:33px;height:33px}.mka-interview-browser{left:19px;top:193px;width:87%;height:179px}.mka-interview-image{width:144%;top:8px}.mka-interview-device-foot{left:29px;top:365px;width:71%}.mka-interview-phone{right:14px;top:178px;width:112px;height:230px}.mka-interview-phone-logo{width:65px;margin:12px auto 13px}.mka-interview-phone-title{font-size:8px}.mka-interview-voice{width:41px;height:41px;margin:13px auto 10px}.mka-interview-phone .mka-wave{margin:6px 0 8px}.mka-interview .mka-concept{left:23px;bottom:17px}
}
@container mka (max-width:320px){.mka-interview .mka-heading{font-size:23px;width:calc(100% - 46px)}.mka-specto .mka-heading{width:calc(100% - 46px)}.mka-gmap .mka-heading{font-size:25px;max-width:calc(100% - 46px)}}
@media(prefers-reduced-motion:reduce){.mka-tile *{animation:none!important;transition:none!important}}
