/* Fisal Hassan Portfolio — design tokens and responsive layout */
:root{--navy:#0b1220;--navy-2:#111d31;--blue:#3b82f6;--blue-2:#60a5fa;--ink:#1f2937;--muted:#667085;--line:#e5eaf1;--white:#fff;--soft:#f5f7fb;--card:#fff;--shadow:0 18px 50px rgba(15,23,42,.07);--radius:20px;--font-body:"DM Sans",sans-serif;--font-head:"Manrope",sans-serif}
html[data-theme="dark"]{--ink:#e8edf5;--muted:#a5b1c3;--line:#273449;--white:#101827;--soft:#0d1523;--card:#131e2f;--shadow:0 18px 50px rgba(0,0,0,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:84px}body{margin:0;background:var(--white);color:var(--ink);font-family:var(--font-body);line-height:1.65;font-size:15px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}.container{width:min(1160px,calc(100% - 48px));margin-inline:auto}.skip-link{position:absolute;left:-999px;top:8px;background:#fff;color:#111;padding:10px 14px;z-index:100}.skip-link:focus{left:12px}.site-header{position:absolute;z-index:20;top:0;left:0;right:0;color:#eaf1ff;border-bottom:1px solid rgba(255,255,255,.08)}.nav{height:82px;display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;align-items:center;gap:11px;font-family:var(--font-head);font-weight:800;letter-spacing:-.4px;font-size:17px}.brand-mark{width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(96,165,250,.65);border-radius:11px;color:#a9ccff;font-size:12px;letter-spacing:0;background:rgba(59,130,246,.12)}.brand-dot,.hero-period{color:var(--blue-2)}.nav-links{display:flex;align-items:center;gap:30px;font-size:13px;color:#c3ccdc}.nav-links>a{transition:color .2s}.nav-links>a:hover{color:#fff}.theme-toggle{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;cursor:pointer;font-size:19px}.menu-toggle{display:none}
.hero{position:relative;overflow:hidden;min-height:690px;background:radial-gradient(ellipse at 78% 42%,rgba(31,81,151,.26),transparent 36%),linear-gradient(120deg,#09111f 0%,#0b1425 56%,#0d1a30 100%);color:#f6f8fc;padding:150px 0 82px}.hero:before{content:"";position:absolute;inset:0;opacity:.15;background-image:linear-gradient(rgba(148,163,184,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.15) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(90deg,transparent,black 50%,black)}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:42px}.eyebrow,.section-label,.project-type,.art-label{font-size:10px;font-weight:700;letter-spacing:1.6px}.eyebrow{display:flex;align-items:center;gap:10px;color:#a8bad4;margin-bottom:28px}.status-dot,.pulse-small{width:7px;height:7px;border-radius:50%;background:#60d9a8;box-shadow:0 0 0 4px rgba(96,217,168,.12)}.hero-kicker{font-size:17px;color:#b7c3d6;margin:0 0 -8px}.hero h1{font:800 clamp(48px,6.1vw,76px)/1.1 var(--font-head);letter-spacing:-4px;margin:12px 0}.hero h2{font:600 clamp(21px,2.4vw,29px)/1.45 var(--font-head);letter-spacing:-.7px;margin:0 0 22px;color:#e8edf6}.gradient-text{background:linear-gradient(90deg,#72aaff,#b1c8ff);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-intro{max-width:555px;color:#aebbd0;font-size:16px;line-height:1.9}.hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin:30px 0 25px}.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;padding:13px 19px;border-radius:10px;font-size:13px;font-weight:700;transition:transform .2s,background .2s,border-color .2s}.button:hover{transform:translateY(-2px)}.button-primary{background:var(--blue);color:#fff;box-shadow:0 9px 25px rgba(59,130,246,.25)}.button-primary:hover{background:#2563eb}.button-ghost{border:1px solid rgba(226,232,240,.23);color:#e4eaf4}.button-ghost:hover{border-color:#75a8ff;background:rgba(255,255,255,.05)}.hero-meta{display:flex;align-items:center;gap:15px;color:#8494ad;font-size:11px}.meta-divider{height:4px;width:4px;border-radius:50%;background:#5278b1}.hero-visual{height:390px;position:relative;display:grid;place-items:center}.visual-glow{position:absolute;width:300px;height:300px;background:#1d4f94;filter:blur(100px);opacity:.24;border-radius:50%}.orbit{position:absolute;border:1px solid rgba(96,165,250,.15);border-radius:50%;transform:rotate(-20deg)}.orbit-one{width:390px;height:280px}.orbit-two{width:320px;height:390px;transform:rotate(38deg)}.code-window{position:relative;width:min(430px,100%);border:1px solid rgba(148,163,184,.27);border-radius:15px;overflow:hidden;background:rgba(12,22,39,.94);box-shadow:0 35px 80px rgba(0,0,0,.28);transform:rotate(1.5deg)}.window-top{height:43px;background:#162237;border-bottom:1px solid rgba(148,163,184,.15);display:flex;align-items:center;gap:6px;padding:0 14px}.window-top>span{width:7px;height:7px;border-radius:50%;background:#53637a}.window-top>span:first-child{background:#f87171}.window-top>span:nth-child(2){background:#fbbf24}.window-top>span:nth-child(3){background:#34d399}.window-top label{font-size:10px;color:#93a4bc;margin-left:10px}.code-body{padding:22px 20px 16px;font:11px/2.1 ui-monospace,SFMono-Regular,Consolas,monospace;color:#d7e3f6}.code-body p{margin:0;white-space:nowrap}.code-muted{color:#52647e;display:inline-block;width:23px}.code-purple{color:#c4a5ff}.code-blue{color:#77c8ff}.code-yellow{color:#f5d58a}.code-green{color:#77d7a8}.window-footer{display:flex;align-items:center;gap:10px;border-top:1px solid rgba(148,163,184,.12);padding:11px 17px;color:#9aabc2;font-size:10px}.pulse-small{width:6px;height:6px}.float-chip{position:absolute;z-index:3;display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid rgba(148,163,184,.24);border-radius:11px;background:rgba(19,33,55,.94);box-shadow:0 15px 35px rgba(0,0,0,.18);font-size:11px;color:#d9e4f5}.float-chip span{color:#7eb4ff;font-size:18px}.chip-api{top:54px;right:-2px}.chip-cloud{bottom:54px;left:-12px}.visual-caption{position:absolute;right:0;bottom:2px;display:flex;align-items:center;gap:9px;font-size:10px;color:#8093af}.caption-line{height:1px;width:25px;background:#4f8fe8}.scroll-cue{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;color:#73849e;font-size:10px;letter-spacing:.5px}.scroll-mouse{width:15px;height:23px;border:1px solid #526681;border-radius:10px;position:relative}.scroll-mouse:after{content:"";position:absolute;width:2px;height:5px;background:#8eb9f5;top:4px;left:5px;border-radius:2px}
.trust-strip{background:#101b2c;color:#e4eaf5;border-top:1px solid rgba(255,255,255,.07);border-bottom:1px solid rgba(255,255,255,.07)}.trust-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}.trust-inner>span{font-size:9px;letter-spacing:1.5px;color:#72839e;font-weight:700}.trust-inner b{font-size:12px;font-weight:600;color:#c1ccdc}.trust-inner i{height:4px;width:4px;border-radius:50%;background:#3d5e8d}
.section{padding:105px 0}.section-light{background:var(--white)}.section-soft{background:var(--soft)}.split-layout{display:grid;grid-template-columns:.88fr 1.12fr;gap:100px}.section-label{color:var(--blue);margin:0 0 20px}.section-heading h2{font:700 clamp(30px,4vw,43px)/1.25 var(--font-head);letter-spacing:-1.5px;margin:0;max-width:550px}.text-accent{color:var(--blue)}.about-content p{color:var(--muted);margin:0 0 18px;line-height:1.9}.about-content p.lead{font-size:18px;line-height:1.75;color:var(--ink);font-weight:500}.about-highlights{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border-top:1px solid var(--line);padding-top:24px;margin-top:28px}.about-highlights div{display:flex;flex-direction:column;gap:5px}.about-highlights strong{font:800 22px var(--font-head);color:var(--ink);letter-spacing:-.7px}.about-highlights span{font-size:11px;color:var(--muted);line-height:1.5}
.centered{text-align:center;margin:0 auto 46px}.centered .section-label{margin-bottom:15px}.centered h2{max-width:none}.section-subtitle{color:var(--muted);max-width:620px;line-height:1.8;margin:17px 0 0}.centered .section-subtitle{margin:17px auto 0}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.skill-card{padding:27px 25px 24px;background:var(--card);border:1px solid var(--line);border-radius:16px;transition:transform .25s,border-color .25s,box-shadow .25s}.skill-card:hover{transform:translateY(-4px);border-color:rgba(59,130,246,.4);box-shadow:var(--shadow)}.skill-icon{width:42px;height:42px;border-radius:12px;background:rgba(59,130,246,.1);color:var(--blue);display:grid;place-items:center;font-size:21px;margin-bottom:20px}.skill-card h3{font:700 16px var(--font-head);margin:0 0 10px}.skill-card p{font-size:12px;line-height:1.9;color:var(--muted);margin:0}.skills-note{text-align:center;font-size:11px;color:var(--muted);margin:24px 0 0}
.project-filters{display:flex;gap:8px;flex-wrap:wrap;margin:32px 0 27px}.filter-button{border:1px solid var(--line);background:var(--card);color:var(--muted);padding:9px 14px;border-radius:30px;font-size:11px;cursor:pointer;transition:all .2s}.filter-button:hover,.filter-button.active{background:var(--navy);border-color:var(--navy);color:#fff}.projects-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.project-card{border:1px solid var(--line);background:var(--card);border-radius:17px;overflow:hidden;transition:transform .25s,box-shadow .25s,border-color .25s;min-width:0}.project-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:rgba(59,130,246,.35)}.project-card.is-hidden{display:none}.project-art{height:178px;position:relative;overflow:hidden;background:#101c31;color:#dce9ff}.art-label{position:absolute;top:17px;left:18px;color:#9bb2d2;font-size:8px;letter-spacing:1.25px}.project-info{padding:22px 21px 23px}.project-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.project-type{color:var(--blue);font-size:8px;letter-spacing:1.3px}.project-status{font-size:9px;color:#16865c;background:rgba(22,163,74,.1);border-radius:30px;padding:4px 8px}.status-muted{color:#a16a16;background:rgba(217,153,39,.12)}.project-info h3{font:700 17px/1.4 var(--font-head);letter-spacing:-.3px;margin:0 0 10px}.project-info p{color:var(--muted);font-size:12px;line-height:1.85;margin:0 0 17px;min-height:67px}.tag-list{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 18px}.tag-list span{font-size:9px;color:#64748b;background:#f0f4f9;padding:5px 8px;border-radius:5px}.text-link{display:inline-flex;gap:8px;align-items:center;color:var(--blue);font-size:11px;font-weight:700}.text-link span{transition:transform .2s}.text-link:hover span{transform:translate(3px,-3px)}.text-link-static{color:var(--muted);font-weight:500}.project-disclaimer{font-size:11px;color:var(--muted);margin:26px 0 0;line-height:1.8}
.art-portfolio{background:linear-gradient(135deg,#101b2f,#1a3762)}.mini-browser{position:absolute;left:24%;top:40px;width:55%;height:110px;border:1px solid rgba(147,197,253,.35);border-radius:8px;background:#0c1627;transform:rotate(-5deg);box-shadow:0 15px 30px #08101d}.mini-browser-bar{height:17px;border-bottom:1px solid #273852;background:#18263b;border-radius:8px 8px 0 0}.mini-lines{padding:14px;display:flex;flex-direction:column;gap:7px}.mini-lines b{width:55%;height:6px;background:#5b9aff;border-radius:4px}.mini-lines i{width:83%;height:4px;background:#536780;border-radius:4px}.mini-lines em{width:37%;height:8px;background:#326bd1;border-radius:4px}.art-orb{position:absolute;width:90px;height:90px;border:1px solid #4b8ff5;border-radius:50%;right:10%;bottom:-35px;box-shadow:0 0 35px rgba(59,130,246,.3)}
.art-fintech{background:linear-gradient(135deg,#0e1b30,#122b4a)}.art-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(100,149,237,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(100,149,237,.08) 1px,transparent 1px);background-size:25px 25px}.node{position:absolute;z-index:2;width:66px;height:45px;border:1px solid #5c8ecb;border-radius:9px;background:#152b49;display:grid;place-items:center;font-size:11px;font-weight:700;color:#b9d7ff}.node-a{left:15%;top:72px}.node-b{right:16%;top:72px}.node-c{left:43%;bottom:19px;width:80px;height:38px}.node-line{position:absolute;height:1px;background:#5b95e9;transform-origin:left}.line-a{left:34%;top:95px;width:44%;}.line-b{left:48%;top:104px;width:35%;transform:rotate(45deg)}
.art-security{background:radial-gradient(circle at center,#1a4476,#0d1b30 70%)}.shield{position:absolute;z-index:2;left:calc(50% - 35px);top:57px;width:70px;height:78px;display:grid;place-items:center;clip-path:polygon(50% 0,92% 15%,86% 66%,50% 100%,14% 66%,8% 15%);background:linear-gradient(140deg,#60a5fa,#1e4b88);color:#fff;font-size:29px;filter:drop-shadow(0 0 20px #3b82f6)}.security-ring{position:absolute;border:1px solid rgba(96,165,250,.3);border-radius:50%;left:calc(50% - 85px);top:37px;width:170px;height:120px}.ring-b{left:calc(50% - 115px);top:20px;width:230px;height:155px;transform:rotate(-25deg)}
.art-postal{background:linear-gradient(135deg,#13243b,#254567)}.postal-box{position:absolute;top:49px;left:33%;width:130px;height:100px;border:1px solid #7099c8;border-radius:9px;background:#152b46;padding:15px;transform:rotate(4deg);box-shadow:0 15px 35px rgba(0,0,0,.2)}.postal-box span{display:block;color:#8bc0ff;font-size:21px}.postal-box b{display:block;font-size:10px;margin:3px 0 8px}.postal-box i{display:block;height:3px;border-radius:3px;background:#4a6789;margin-top:5px;width:80%}.postal-box i:last-child{width:55%}.postal-orbit{position:absolute;right:13%;top:49px;width:85px;height:85px;border:1px dashed #5c92d4;border-radius:50%}
.art-timesheet{background:linear-gradient(135deg,#172a45,#203c5c)}.chart-card{position:absolute;left:25%;top:48px;width:55%;height:105px;border:1px solid #426a96;border-radius:8px;background:#13253d;padding:16px}.chart-bars{height:63px;display:flex;align-items:flex-end;gap:8px}.chart-bars i{flex:1;background:linear-gradient(#76b2ff,#3b82f6);border-radius:3px 3px 0 0;height:40%}.chart-bars i:nth-child(2){height:65%}.chart-bars i:nth-child(3){height:48%}.chart-bars i:nth-child(4){height:80%}.chart-bars i:nth-child(5){height:55%}.chart-bars i:nth-child(6){height:90%}.chart-bars i:nth-child(7){height:72%}.chart-line{position:absolute;left:15px;right:15px;top:48px;height:1px;background:rgba(170,205,255,.28)}
.art-supply{background:linear-gradient(135deg,#0f2334,#1c4355)}.supply-flow{position:absolute;top:75px;left:8%;right:8%;display:flex;align-items:center;justify-content:space-between;gap:7px}.supply-flow span{background:#183e51;border:1px solid #4d8997;border-radius:7px;padding:9px 7px;font-size:9px;z-index:1}.supply-flow b{color:#7dd3c7;font-size:16px}.supply-base{position:absolute;bottom:27px;left:18%;right:18%;height:1px;background:#4f8792}
.art-wealth{background:linear-gradient(135deg,#1a2342,#3b356b)}.wealth-shape{position:absolute;top:54px;left:29%;height:95px;display:flex;align-items:flex-end;gap:7px;transform:skewY(-13deg)}.wealth-shape i{width:17px;background:linear-gradient(#b7a7ff,#6e69d8);border-radius:4px 4px 0 0;height:40%}.wealth-shape i:nth-child(2){height:65%}.wealth-shape i:nth-child(3){height:51%}.wealth-shape i:nth-child(4){height:78%}.wealth-shape i:nth-child(5){height:100%}.wealth-base{position:absolute;bottom:29px;left:23%;width:60%;height:1px;background:#8277db}
.art-commerce{background:linear-gradient(135deg,#152b43,#28526c)}.commerce-window{position:absolute;top:46px;left:28%;width:45%;height:112px;background:#122238;border:1px solid #5e91ad;border-radius:8px;padding:14px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.commerce-window div{height:25px;background:#254a66;border-radius:4px}.commerce-window b{grid-column:1/4;font-size:10px;line-height:1.3;color:#d8edff;margin-top:4px}
.art-web{background:linear-gradient(135deg,#10233c,#263d6b)}.cms-card{position:absolute;left:28%;top:45px;width:45%;height:115px;background:#152945;border:1px solid #5278a7;border-radius:8px;padding:13px;transform:rotate(-3deg)}.cms-card span{font-size:12px;color:#92c3ff;font-weight:800;display:block;margin-bottom:9px}.cms-card i{display:block;height:4px;background:#4b6487;border-radius:3px;margin:7px 0;width:85%}.cms-card i:last-child{width:60%}.cms-spark{position:absolute;right:17%;bottom:35px;font-size:30px;color:#9cbbff}
.art-mosque{background:linear-gradient(135deg,#172d3b,#22554f)}.arch-shape{position:absolute;left:calc(50% - 37px);top:43px;width:74px;height:90px;border:1px solid #74c4b4;border-radius:40px 40px 7px 7px;background:linear-gradient(#286c65,#173d43);display:grid;place-items:center;color:#a6e7d7;font-size:26px}.arch-base{position:absolute;left:27%;right:27%;bottom:31px;height:15px;border:1px solid #5d9e92;border-radius:4px;background:#183d43}
.art-notes{background:linear-gradient(135deg,#2c2444,#4b3a6c)}.note-stack{position:absolute;left:36%;top:43px;width:90px;height:110px}.note-stack i{position:absolute;width:76px;height:87px;border:1px solid #9b8ac8;border-radius:7px;background:#312a4b;transform:rotate(-10deg)}.note-stack i:nth-child(2){transform:rotate(5deg);left:8px;top:5px;background:#3a3157}.note-stack i:nth-child(3){transform:rotate(13deg);left:12px;top:9px;background:#4a3c6a}.note-pencil{position:absolute;right:24%;top:66px;font-size:42px;color:#d5c8ff;transform:rotate(25deg)}
.art-rnd{background:linear-gradient(135deg,#282d3b,#414f67)}.rnd-gear{position:absolute;left:calc(50% - 38px);top:45px;font-size:72px;color:#9cb4d3}.rnd-path{position:absolute;left:20%;right:20%;bottom:34px;height:1px;background:#6e88a9}
.section-dark{background:#0d1727;color:#f0f4fb}.section-label-light{color:#75aaff}.experience-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:95px}.section-dark .section-subtitle{color:#9eacc2}.experience-list{border-left:1px solid #2b3a51;padding-left:28px}.experience-item{position:relative;padding:0 0 38px}.experience-item:last-child{padding-bottom:0}.experience-marker{position:absolute;left:-34px;top:5px;width:11px;height:11px;border-radius:50%;background:#3b82f6;border:3px solid #0d1727;box-shadow:0 0 0 1px #3b82f6}.experience-date{font-size:9px;letter-spacing:1.4px;color:#83a0c6;font-weight:700;margin-bottom:10px}.experience-main h3{font:700 20px var(--font-head);margin:0 0 5px}.experience-company{color:#9eb2ce;font-size:12px;margin:0 0 15px}.experience-main>p:not(.experience-company){color:#a7b3c6;font-size:12px;line-height:1.9;margin:0 0 16px}.tag-list-dark span{color:#afc0d7;background:#1b2a40;border:1px solid #2a3d59}
.approach-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.approach-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.approach-item{border-top:1px solid var(--line);padding-top:19px}.approach-item>span{font:700 11px var(--font-head);color:var(--blue)}.approach-item h3{font:700 15px/1.45 var(--font-head);margin:15px 0 9px}.approach-item p{color:var(--muted);font-size:11px;line-height:1.9;margin:0}
.contact-section{padding:15px 0 80px;background:var(--soft)}.contact-card{position:relative;overflow:hidden;background:linear-gradient(115deg,#10213b,#153d6e);color:#fff;padding:54px 60px;border-radius:22px;display:flex;align-items:center;justify-content:space-between;gap:40px}.contact-card>div:first-child{position:relative;z-index:1;max-width:610px}.contact-card h2{font:700 clamp(27px,3.5vw,39px)/1.25 var(--font-head);letter-spacing:-1px;margin:0 0 13px}.contact-card p:not(.section-label){color:#b8c8df;line-height:1.85;margin:0;max-width:570px;font-size:13px}.contact-actions{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:15px;min-width:190px}.button-light{background:#fff;color:#15335d}.button-light:hover{background:#eaf2ff}.contact-email{font-size:11px;color:#b8c8df}.contact-decoration{position:absolute;width:280px;height:280px;border:1px solid rgba(142,186,255,.2);border-radius:50%;right:12%;top:-135px;box-shadow:0 0 0 35px rgba(142,186,255,.035),0 0 0 70px rgba(142,186,255,.025)}
.site-footer{background:var(--navy);color:#8b9bb2}.footer-inner{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand-footer{color:#e7edf7;font-size:14px}.brand-footer .brand-mark{width:30px;height:30px}.footer-inner p,.footer-inner>span{font-size:10px;margin:0}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .65s ease,transform .65s ease}.reveal.is-visible{opacity:1;transform:translateY(0)}
/* Case study pages */
.case-hero{padding:145px 0 68px;background:linear-gradient(125deg,#0b1220,#13294a);color:#fff}.case-hero .container{max-width:900px}.back-link{display:inline-flex;gap:8px;color:#9eb9df;font-size:12px;margin-bottom:28px}.case-hero h1{font:800 clamp(35px,5vw,58px)/1.15 var(--font-head);letter-spacing:-2px;margin:16px 0}.case-hero p{max-width:760px;color:#b6c4d9;line-height:1.9;font-size:16px}.case-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}.case-meta span{font-size:10px;color:#d3e0f4;border:1px solid #344b6c;border-radius:6px;padding:7px 10px}.case-content{padding:70px 0 100px}.case-content-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(220px,1fr);gap:60px}.case-main h2{font:700 26px var(--font-head);letter-spacing:-.8px;margin:0 0 15px}.case-main h2:not(:first-child){margin-top:45px}.case-main p,.case-main li{color:var(--muted);line-height:1.9;font-size:14px}.case-main ul{padding-left:22px}.case-note{border-left:3px solid var(--blue);background:var(--soft);padding:18px 20px;color:var(--muted);font-size:12px;line-height:1.8;margin-top:25px}.case-sidebar{border:1px solid var(--line);border-radius:14px;padding:24px;height:max-content;background:var(--card)}.case-sidebar h3{font:700 14px var(--font-head);margin:0 0 15px}.case-sidebar h3:not(:first-child){margin-top:25px}.case-sidebar p{font-size:12px;line-height:1.8;color:var(--muted);margin:0}.case-sidebar .tag-list{margin-bottom:0}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr 0.9fr;gap:20px}.hero h1{letter-spacing:-2.5px}.hero-visual{transform:scale(.9)}.split-layout,.experience-layout{gap:50px}.projects-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.approach-layout{grid-template-columns:1fr;gap:35px}.contact-card{padding:45px}.trust-inner{gap:13px}.trust-inner b{font-size:10px}}
@media(max-width:720px){.container{width:min(100% - 34px,560px)}.nav{height:72px}.menu-toggle{display:flex;flex-direction:column;gap:5px;background:transparent;border:0;padding:9px;cursor:pointer}.menu-toggle span{width:22px;height:2px;background:#e6eef9;border-radius:2px}.nav-links{display:none;position:absolute;top:70px;left:17px;right:17px;background:#111e32;border:1px solid #293a53;border-radius:13px;padding:17px;flex-direction:column;align-items:stretch;gap:0;box-shadow:0 20px 45px rgba(0,0,0,.25)}.nav-links.open{display:flex}.nav-links>a{padding:12px 7px;border-bottom:1px solid rgba(255,255,255,.07)}.theme-toggle{margin-top:12px}.hero{padding:120px 0 70px;min-height:0}.hero-grid{grid-template-columns:1fr;gap:18px}.hero-copy{padding-top:10px}.hero h1{font-size:54px}.hero h2{font-size:22px}.hero-intro{font-size:14px}.hero-visual{height:310px;transform:none;margin-top:4px}.code-window{width:min(410px,94%)}.code-body{font-size:9px;padding:16px 12px}.chip-api{right:0;top:22px}.chip-cloud{left:0;bottom:25px}.visual-caption{bottom:-5px}.scroll-cue{display:none}.trust-inner{padding:18px 0;justify-content:center;flex-wrap:wrap;gap:10px 13px}.trust-inner>span{width:100%;text-align:center;margin-bottom:4px}.trust-inner i{display:none}.trust-inner b{border:1px solid rgba(255,255,255,.1);padding:5px 8px;border-radius:5px}.section{padding:72px 0}.split-layout,.experience-layout{grid-template-columns:1fr;gap:28px}.section-heading h2{font-size:32px}.about-highlights{gap:12px}.about-highlights strong{font-size:19px}.about-highlights span{font-size:10px}.skills-grid{grid-template-columns:1fr 1fr;gap:12px}.skill-card{padding:20px 17px}.skill-card h3{font-size:14px}.skill-card p{font-size:11px}.centered{margin-bottom:32px}.projects-grid{grid-template-columns:1fr}.project-art{height:190px}.project-info p{min-height:0}.project-filters{gap:7px}.filter-button{padding:8px 11px}.experience-list{margin-left:4px}.approach-grid{grid-template-columns:1fr;gap:25px}.approach-item{padding-top:15px}.approach-item h3{margin-top:8px}.contact-section{padding:0 0 55px}.contact-card{padding:32px 25px;display:block}.contact-card h2{font-size:30px}.contact-actions{margin-top:25px}.footer-inner{padding:23px 0;flex-wrap:wrap;justify-content:center;text-align:center}.footer-inner p{width:100%;order:3}.case-hero{padding:115px 0 55px}.case-hero h1{font-size:37px}.case-hero p{font-size:14px}.case-content{padding:50px 0 70px}.case-content-grid{grid-template-columns:1fr;gap:30px}.case-main h2{font-size:23px}}
@media(max-width:390px){.hero h1{font-size:46px}.hero-meta{font-size:9px;gap:9px}.skills-grid{grid-template-columns:1fr}.about-highlights{grid-template-columns:1fr}.about-highlights div{flex-direction:row;align-items:center;gap:12px}.about-highlights strong{min-width:90px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.reveal{opacity:1;transform:none}}

/* Number motif used by the complete project collection */
.generic-art-mark{position:absolute;right:22px;bottom:-24px;font:800 104px/1 var(--font-head);letter-spacing:-8px;color:rgba(153,190,244,.12);user-select:none}
.project-card .project-art:after{content:"";position:absolute;inset:auto 0 0;height:1px;background:linear-gradient(90deg,transparent,rgba(128,174,242,.5),transparent)}
.project-card .project-art .art-label{z-index:2}
html[data-theme="dark"] .tag-list span{color:#c0cfe4;background:#1e2b3f}
