@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght9..40,400;9..40,500;9..40,700&family=Playfair+Display:ital,wght@0,500;1,500&display=swap');

:root{--ink:#121212;--paper:#fafaf7;--muted:#777;--line:#deded8;--teal:#8cc9bf;--pink:#ff5ec6}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:"DM Sans",Arial,sans-serif;cursor:none}
/* Lucide Icons Standardization */
.lucide, svg.lucide {
  display: inline-block;
  vertical-align: -0.15em;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2px;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.25s ease, stroke 0.25s ease;
}
.round-link svg.lucide {
  margin-top: 6px;
}.wrap{width:min(1220px,calc(100% - 64px));margin:auto}.nav{height:86px;display:flex;align-items:center;justify-content:space-between;font-size:14px;position:relative;z-index:2}.wordmark{font-size:22px;font-weight:700;letter-spacing:-.5px;text-decoration:none;color:inherit}.wordmark span{color:#26c8cf}.nav nav{display:flex;gap:30px;margin-left:90px}.nav a{color:inherit;text-decoration:none}.nav-hello{border-bottom:1px solid var(--ink);padding-bottom:3px}.hero{min-height:calc(100vh - 86px);padding:9vh 0 46px;position:relative}.eyebrow{font:11px "DM Mono",monospace;text-transform:uppercase;letter-spacing:1.5px;color:#777;margin:0 0 28px}.hero-title{font-size:clamp(58px,9.6vw,142px);line-height:.88;letter-spacing:-.03em;font-weight:500;margin:0}.hero-title em{font-family:"Playfair Display",serif;font-weight:500;letter-spacing:-.02em}.hero-bottom{margin-top:clamp(58px,11vh,140px);display:flex;justify-content:space-between;align-items:end}.round-link{border:1px solid #222;border-radius:50%;width:142px;height:142px;text-decoration:none;color:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:16px;font-size:14px;line-height:1.25;transition:.35s}.round-link span{display:block;text-align:center}.round-link:hover{background:#111;color:#fff;transform:rotate(-10deg)}.round-link b{font-size:22px;align-self:center;margin-top:6px;line-height:1}.uiux-card{width:360px;background:#1e1e1e;color:#fff;padding:18px 22px;border-radius:12px;box-shadow:16px 16px 0 #e9e9e4;transform:rotate(-2deg);border:1px solid #333}.uiux-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;border-bottom:1px solid #2e2e2e;padding-bottom:10px}.canvas-tag{font:10px "DM Mono",monospace;color:#8cc9bf;letter-spacing:.5px}.uiux-body{display:flex;flex-direction:column;gap:12px}.uiux-badge{background:rgba(255,94,198,.15);border:1px solid #ff5ec6;color:#ff5ec6;padding:4px 10px;border-radius:4px;font:10px "DM Mono",monospace;width:fit-content;letter-spacing:1px}.uiux-spec{margin:0;font-size:13px;display:flex;justify-content:space-between;align-items:center}.uiux-spec strong{font-weight:500;color:#fff}.uiux-spec span{font:11px "DM Mono",monospace;color:#888}.uiux-palette{display:flex;gap:8px;margin:2px 0}.uiux-palette i{width:20px;height:20px;border-radius:50%;border:1px solid rgba(255,255,255,.2)}.uiux-footer{display:flex;justify-content:space-between;border-top:1px solid #2e2e2e;padding-top:10px;font:11px "DM Mono",monospace;color:#aaa}.uiux-footer b{color:#26c8cf}.dots{display:flex;gap:5px;margin-bottom:0}.dots i{width:7px;height:7px;border-radius:50%;background:#ff756b}.dots i:nth-child(2){background:#f8c74d}.dots i:nth-child(3){background:#66cf79}.scroll-note{position:absolute;bottom:22px;left:50%;font:10px "DM Mono";letter-spacing:1px;text-transform:uppercase;color:#888;transform:translateX(-50%)}.scroll-note span{font-size:17px;vertical-align:middle;margin-left:7px}.statement{min-height:100vh;padding:20vh 0 16vh;position:relative}.statement h2{font-size:clamp(35px,5vw,70px);line-height:.97;letter-spacing:-.025em;font-weight:500;max-width:990px;margin:0}.portrait-orb{width:185px;height:185px;border-radius:50%;background:linear-gradient(140deg,#bea7ef,#fd8fca 52%,#6ec8be);position:absolute;right:9%;bottom:18%;display:grid;place-items:center;box-shadow:13px 15px 0 #e2e1dc;animation:float 5s ease-in-out infinite}.portrait-orb span{font-size:75px;color:#fff}.text-link{color:inherit;text-decoration:none;border-bottom:1px solid #222;font-size:16px;padding-bottom:5px;position:absolute;bottom:9%;left:0}.text-link span{margin-left:12px}.work{padding:100px 0 180px}.section-heading{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:66px}.section-heading .eyebrow{margin:0}.section-heading span{font:12px "DM Mono"}.projects{display:grid;grid-template-columns:1fr 1fr;gap:120px 9%;align-items:start}.project.large{grid-column:1}.project.offset{grid-column:2;margin-top:190px}.project:nth-child(3){margin-top:0}.project-image{height:clamp(270px,38vw,480px);border-radius:7px;position:relative;display:block;overflow:hidden;color:#fff;text-decoration:none;isolation:isolate;transition:border-radius .25s,transform .35s}.project-image:hover{border-radius:70px 7px 70px 7px;transform:scale(.985)}.project-number{position:absolute;top:18px;left:19px;font:11px "DM Mono";z-index:2}.flower{background:linear-gradient(135deg,#e5dbcc 0 38%,#96944e 38% 61%,#f17eb5 61%)}.art-title{position:absolute;left:9%;bottom:8%;font-family:"Playfair Display";font-size:clamp(38px,5vw,75px);line-height:.75;color:#fff}.flower-shape{position:absolute;color:#fae740;font-size:clamp(160px,24vw,340px);right:-4%;top:10%;line-height:1;transform:rotate(18deg);text-shadow:4px 5px 0 #e4679d}.finance{background:linear-gradient(160deg,#847fe9,#4332a0);display:grid;place-items:center}.phone-ui{width:46%;min-width:180px;height:76%;border:5px solid #1d1746;border-radius:29px;background:#f6f5ff;color:#1e1a3e;padding:30px 18px;display:flex;flex-direction:column;gap:13px;box-shadow:10px 14px 24px #28205c}.phone-ui small{color:#827f9a}.phone-ui b{font-size:clamp(16px,2vw,28px)}.chart{height:31%;border-radius:10px;background:linear-gradient(160deg,#e1ddff,#bcb3ff);position:relative;overflow:hidden}.chart:after{content:"";position:absolute;width:130%;height:70%;border-top:4px solid #ff62bd;border-radius:50%;bottom:-39%;left:-14%;transform:rotate(-8deg)}.mini-row{height:12px;border-radius:8px;background:#dedaf6}.mini-row.short{width:65%}.docs{background:#ebe8df;display:grid;place-items:center;color:#1e1e1c}.doc-card{background:#fffdf6;width:72%;height:72%;padding:8%;box-shadow:10px 12px 0 #cbc6b9;transform:rotate(-5deg);display:flex;flex-direction:column;align-items:start}.doc-card b{font:14px "DM Mono"}.doc-card hr{width:100%;border:0;border-top:1px solid #ddd;margin:24px 0}.doc-card strong{font-size:clamp(24px,3.5vw,54px);line-height:.9;letter-spacing:-.025em}.doc-card p{font-size:12px;margin-top:auto}.project-copy{display:flex;justify-content:space-between;gap:12px;padding-top:14px}.project h3{font-size:16px;margin:0 0 5px}.project p{margin:0;color:#686868;font-size:13px}.project ul{list-style:none;margin:0;padding:0;display:flex;gap:5px;flex-wrap:wrap;justify-content:end}.project li{border:1px solid #d4d4ce;padding:5px 7px;border-radius:3px;font:10px "DM Mono";white-space:nowrap}.contact{background:#171717;color:#f9f9f4;padding:145px 0}.contact .eyebrow{color:#aaa}.contact h2{font-size:clamp(52px,9vw,125px);line-height:.88;letter-spacing:-.03em;font-weight:500;margin:0 0 65px}.contact a{font-size:clamp(18px,2.4vw,31px);color:#fff;text-decoration:none;border-bottom:1px solid #777;padding-bottom:9px}.contact a span{margin-left:22px;color:var(--teal)}footer{height:95px;display:flex;align-items:center;justify-content:space-between;font:11px "DM Mono";color:#777}footer div{display:flex;gap:20px}footer a{color:inherit;text-decoration:none}.cursor-dot{position:fixed;width:10px;height:10px;background:var(--pink);border-radius:50%;pointer-events:none;z-index:20;transform:translate(-50%,-50%);mix-blend-mode:multiply}.award{position:fixed;right:0;top:47%;background:#59bcb3;color:#fff;padding:10px 7px;font:9px/1.15 Arial;text-align:center;z-index:5;letter-spacing:1px}.reveal{opacity:0;transform:translateY(25px);transition:.8s cubic-bezier(.2,.75,.3,1)}.reveal.shown{opacity:1;transform:none}@keyframes float{50%{transform:translateY(-18px) rotate(6deg)}}
.case{padding-top:62px}.case-icon{text-align:center;font-size:108px;height:138px;line-height:1}.flora-icon{color:#f0b526;text-shadow:4px 4px #dc72a4}.track-icon{color:#4d3aaf}.docs-icon{color:#333}.case-intro{display:grid;grid-template-columns:1.4fr .6fr;gap:80px;align-items:end;margin:45px 0 82px}.case h1{font-size:clamp(54px,7vw,104px);line-height:.88;letter-spacing:-.025em;font-weight:500;margin:0}.lead{font-size:clamp(17px,2vw,24px);line-height:1.18;max-width:700px;margin:31px 0 0}.case dl{margin:0;display:grid;gap:24px}.case dl div{border-top:1px solid var(--line);padding-top:11px}.case dt{font:11px "DM Mono";text-transform:uppercase;color:#888;margin-bottom:11px}.case dd{font-size:14px;line-height:1.5;margin:0}.case-hero{height:min(52vw,630px);min-height:360px;border-radius:8px;overflow:hidden;position:relative;display:grid;place-items:center}.case-hero .art-title{z-index:1}.hero-phone{height:86%;width:280px;border:7px solid #211950;border-radius:36px;padding:42px 22px;background:#f8f7ff;color:#241d51;display:flex;flex-direction:column;gap:15px;box-shadow:20px 25px 35px #342877}.hero-phone small{font:10px "DM Mono"}.hero-phone b{font-size:28px}.hero-phone p{font-size:12px;margin:0}.hero-doc{background:#fffdf7;width:70%;height:70%;padding:7%;box-shadow:15px 19px #cec8ba;transform:rotate(-4deg);display:flex;flex-direction:column}.hero-doc b{font:14px "DM Mono"}.hero-doc hr{width:100%;border:0;border-top:1px solid #ddd;margin:30px 0}.hero-doc strong{font-size:clamp(28px,5vw,64px);line-height:.92;letter-spacing:-.02em}.hero-doc p{font-size:13px;margin-top:auto}.case-text{display:grid;grid-template-columns:.6fr 1.4fr;gap:55px;border-top:1px solid var(--line);padding:30px 0 80px;margin-top:95px}.case-text .eyebrow{margin:0}.case-text div{max-width:720px}.case-text p:not(.eyebrow){font-size:18px;line-height:1.5;margin:0 0 20px}.screens{display:grid;gap:30px}.screen{height:min(54vw,620px);border-radius:9px}.floral-screen{position:relative;overflow:hidden;padding:10%;font-family:"Playfair Display";font-size:clamp(38px,6vw,88px);line-height:.82;color:#fff}.floral-screen:after{content:"✿";position:absolute;font-family:"DM Sans";font-size:clamp(260px,46vw,550px);right:-4%;bottom:-33%;color:#fae445;text-shadow:7px 8px #dc6ca5;line-height:1}.floral-screen span{position:relative;z-index:1}.floral-screen.one{background:linear-gradient(135deg,#a19a57,#ed9ec6)}.floral-screen.two{background:linear-gradient(135deg,#ed809f,#6ca69d);text-align:right}.floral-screen.three{background:linear-gradient(135deg,#a48ee4,#fac964)}.phone-screens{background:#5a4cba;border-radius:9px;padding:75px 8%;display:flex;justify-content:center;gap:7%;overflow:hidden}.mobile-screen{background:#f8f7ff;color:#251f52;border:5px solid #211950;border-radius:29px;width:27%;min-width:175px;min-height:395px;padding:30px 17px;display:flex;flex-direction:column;gap:14px;box-shadow:10px 16px 18px #3d337e}.mobile-screen small{font:10px "DM Mono"}.mobile-screen b{font-size:19px}.mobile-screen p{font-size:11px;margin-top:auto}.ring{width:100px;height:100px;border-radius:50%;border:13px solid #e3defe;border-top-color:#f45dc0;border-right-color:#f45dc0;display:grid;place-items:center;font-size:17px;margin:20px auto}.docs-screens{display:grid;grid-template-columns:1fr 1fr;gap:30px}.doc-screen{min-height:420px;background:#eeece5;display:grid;grid-template-columns:32% 68%;font-size:12px}.doc-screen aside{padding:24px;background:#e0ddd3;line-height:1.8}.doc-screen article{padding:58px 10%;background:#fffef9}.doc-screen article h3{font-size:clamp(25px,3.5vw,48px);line-height:.95;letter-spacing:-.02em;margin:21px 0}.doc-screen article p{color:#777;line-height:1.5}.more{border-top:1px solid var(--line);margin-top:120px;padding:27px 0 110px}.more>div{display:grid;grid-template-columns:1fr 1fr;gap:20px}.more a{color:inherit;text-decoration:none;border-bottom:1px solid var(--line);padding:18px 0;display:flex;gap:18px;font:12px "DM Mono"}.more a strong{font:500 20px "DM Sans";letter-spacing:-.02em}.more a span{margin-left:auto;font-size:20px}
.resume{padding:70px 0 100px}.resume-hero{min-height:590px}.resume-hero h1{font-size:clamp(70px,12vw,170px);font-weight:500;line-height:.88;letter-spacing:-.03em;margin:0}.resume-contact{display:flex;gap:21px;flex-wrap:wrap;margin-top:42px;font:12px "DM Mono"}.resume-contact a{color:inherit;text-decoration:none;border-bottom:1px solid #999;padding-bottom:4px}.resume-summary{font-size:clamp(20px,2.8vw,39px);line-height:1.15;letter-spacing:-.015em;max-width:800px;margin:100px 0 0}.availability{font:11px "DM Mono";text-transform:uppercase;letter-spacing:.5px;margin-top:46px}.availability span{display:inline-block;width:8px;height:8px;border-radius:50%;background:#71c6a8;margin-right:8px;animation:pulse 1.8s infinite}.resume-section{display:grid;grid-template-columns:25% 1fr;border-top:1px solid var(--line);padding:30px 0 95px;gap:50px}.resume-label{display:flex;justify-content:space-between}.resume-label .eyebrow{margin:0}.resume-label span{font:11px "DM Mono"}.resume-content h2{font-size:clamp(35px,5vw,67px);letter-spacing:-.025em;font-weight:500;line-height:.95;margin:0 0 58px}.skill-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.skill-columns h3{font-size:15px;margin:0 0 14px}.skill-columns p{font-size:14px;line-height:1.8;margin:0;color:#575757}.resume-item{display:grid;grid-template-columns:155px 1fr;gap:30px;border-top:1px solid var(--line);padding:22px 0 32px}.resume-date{font:11px "DM Mono";color:#777}.resume-item h3{font-size:21px;letter-spacing:-.02em;margin:0 0 13px}.resume-item h3 em{font-style:normal;font-weight:400;color:#777}.resume-item p,.resume-note .resume-content>p{font-size:15px;line-height:1.55;color:#5e5e5e;max-width:640px;margin:0}.resume-note{padding-bottom:30px}.static-link{display:inline-block;position:static;margin-top:45px}@keyframes pulse{50%{opacity:.25;transform:scale(.7)}}
@media (pointer:fine){
  body, body *{cursor:none!important}
  .custom-cursor{display:block!important;position:fixed;top:0;left:0;width:22px;height:22px;pointer-events:none;z-index:10000;mix-blend-mode:difference;transform:translate(-100px,-100px);will-change:transform}
  .custom-cursor svg{width:22px;height:22px;fill:#ffffff;display:block}
}
@media (pointer:coarse){body{cursor:auto!important}.custom-cursor{display:none!important}}
@media (pointer:fine){body:not(.has-custom-cursor),body:not(.has-custom-cursor) *{cursor:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24"%3E%3Cpath fill="%23fff" d="M4.5.79v22.42l6.56-6.57h9.29L4.5.79z"/%3E%3C/svg%3E') 4 1,auto!important}}

/* Contact Page Styles */
.contact-page{padding:70px 0 100px}.contact-hero{margin-bottom:80px}.contact-title{font-size:clamp(52px,8.5vw,120px);line-height:.9;letter-spacing:-.03em;font-weight:500;margin:0 0 25px}.contact-title em{font-family:"Playfair Display",serif;font-weight:500;letter-spacing:-.02em}.contact-summary{font-size:clamp(18px,2.2vw,28px);line-height:1.25;color:#555;max-width:780px;margin:0 0 35px;letter-spacing:-.015em}.contact-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:70px;border-top:1px solid var(--line);padding-top:60px;margin-bottom:110px}.contact-form-container h2{font-size:32px;letter-spacing:-.025em;font-weight:500;margin:0 0 32px}.contact-form{display:flex;flex-direction:column;gap:26px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-group{display:flex;flex-direction:column;gap:9px}.form-group label{font:11px "DM Mono",monospace;text-transform:uppercase;letter-spacing:1px;color:#666}.form-group input[type="text"],.form-group input[type="email"],.form-group select,.form-group textarea{width:100%;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:6px;font:14px "DM Sans",sans-serif;color:var(--ink);outline:0;transition:border-color .25s,box-shadow .25s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#121212;box-shadow:0 0 0 3px rgba(0,0,0,.06)}.pill-options{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}.pill-checkbox input{display:none}.pill-checkbox span{display:inline-block;padding:8px 16px;border:1px solid var(--line);border-radius:20px;font:12px "DM Mono",monospace;cursor:pointer;background:#fff;transition:all .2s ease;user-select:none}.pill-checkbox input:checked+span{background:var(--ink);color:#fff;border-color:var(--ink)}.pill-checkbox span:hover{border-color:var(--ink)}.submit-btn{align-self:flex-start;padding:16px 36px;background:var(--ink);color:#fff;border:none;border-radius:40px;font:14px "DM Sans",sans-serif;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:10px;transition:background .3s,transform .2s;margin-top:10px}.submit-btn:hover{background:#333;transform:translateY(-2px)}.submit-btn span{font-size:16px}.contact-info-card{display:flex;flex-direction:column;gap:40px;background:#f3f3ee;padding:42px;border-radius:12px;height:fit-content}.info-block .eyebrow{margin:0 0 10px}.info-block h3{margin:0;font-size:22px;letter-spacing:-.02em}.email-link{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:3px}.info-block p{margin:0;font-size:15px;color:#555;line-height:1.5}.social-links{display:flex;flex-direction:column;gap:10px}.social-links a{color:var(--ink);text-decoration:none;font:12px "DM Mono",monospace;border-bottom:1px solid #ddd;padding-bottom:4px;width:fit-content;transition:border-color .2s}.social-links a:hover{border-color:var(--ink)}.contact-faq{border-top:1px solid var(--line);padding-top:60px;margin-bottom:60px}.faq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.faq-item h3{font-size:18px;letter-spacing:-.02em;margin:0 0 12px;font-weight:500}.faq-item p{font-size:14px;color:#666;line-height:1.6;margin:0}.contact-banner{background:linear-gradient(135deg,#171717 0%,#282828 100%);color:#f9f9f4;padding:55px 60px;border-radius:16px;display:flex;justify-content:space-between;align-items:center;gap:40px;margin-bottom:80px;position:relative;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.12)}.contact-banner:after{content:"✦";position:absolute;right:-20px;bottom:-40px;font-size:180px;color:rgba(255,255,255,.04);pointer-events:none;line-height:1}.banner-content .eyebrow{color:#aaa;margin-bottom:14px}.banner-content h2{font-size:clamp(26px,3.5vw,42px);line-height:1.08;letter-spacing:-.02em;font-weight:500;margin:0 0 12px}.banner-content p{font-size:15px;color:#ccc;margin:0;max-width:540px;line-height:1.5}.banner-action{flex-shrink:0}.banner-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 28px;background:#fff;color:#121212;text-decoration:none;border-radius:40px;font:14px "DM Sans",sans-serif;font-weight:500;transition:transform .25s,background .25s,color .25s}.banner-btn:hover{background:#26c8cf;color:#000;transform:translateY(-2px)}.banner-btn span{font-size:16px}/* Work Page Styles */
.work-page{padding:70px 0 100px}.work-hero{margin-bottom:70px}.work-title{font-size:clamp(52px,8.5vw,120px);line-height:.9;letter-spacing:-.03em;font-weight:500;margin:0 0 25px}.work-title em{font-family:"Playfair Display",serif;font-weight:500;letter-spacing:-.02em}.work-summary{font-size:clamp(18px,2.2vw,28px);line-height:1.25;color:#555;max-width:780px;margin:0 0 40px;letter-spacing:-.015em}.filter-bar{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px;border-bottom:1px solid var(--line);padding-bottom:25px}.filter-btn{background:transparent;border:1px solid var(--line);padding:8px 18px;border-radius:20px;font:12px "DM Mono",monospace;cursor:pointer;transition:all .25s;color:var(--ink)}.filter-btn.active,.filter-btn:hover{background:var(--ink);color:#fff;border-color:var(--ink)}.archive-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px 6%;margin-bottom:120px}.archive-card{transition:opacity .3s ease,transform .3s ease}.card-image{height:clamp(280px,34vw,440px);border-radius:8px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;text-decoration:none;transition:transform .35s ease,border-radius .3s ease}.card-image:hover{transform:scale(.985);border-radius:40px 8px 40px 8px}.nova{background:linear-gradient(135deg,#0d0f1a,#2a1b4e);color:#fff}.nova-graphic{display:flex;flex-direction:column;align-items:center;gap:15px}.nova-orb{width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,#00f2fe 0%,#4facfe 100%);box-shadow:0 0 30px rgba(0,242,254,.4);animation:float 4s ease-in-out infinite}.nova-graphic span{font:24px "DM Mono",monospace;letter-spacing:6px;font-weight:500}.pulse{background:linear-gradient(135deg,#111e2e,#0e3047);color:#7ce5d3}.pulse-ui{display:flex;flex-direction:column;gap:10px;width:65%;background:rgba(255,255,255,.05);padding:25px;border-radius:12px;border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(10px)}.pulse-bar{height:8px;border-radius:4px;background:#26c8cf}.pulse-bar.bar-1{width:85%}.pulse-bar.bar-2{width:60%;background:#ff5ec6}.pulse-bar.bar-3{width:95%;background:#8cc9bf}.pulse-ui b{font:11px "DM Mono",monospace;letter-spacing:1px;color:#fff;margin-top:5px}.kroma{background:linear-gradient(135deg,#f7eee4,#e8d7c3);color:#222}.kroma-cover{width:60%;height:75%;background:#fff;padding:30px;box-shadow:12px 16px 0 rgba(0,0,0,.08);display:flex;flex-direction:column;justify-content:space-between;transform:rotate(-3deg)}.kroma-cover em{font-family:"Playfair Display",serif;font-size:38px;font-style:italic}.kroma-cover small{font:11px "DM Mono",monospace;color:#888}.card-copy{padding-top:18px}.card-meta h2{font-size:22px;letter-spacing:-.02em;margin:6px 0 8px;font-weight:500}.card-meta h2 a{color:var(--ink);text-decoration:none}.card-meta p{color:#666;font-size:14px;margin:0 0 14px;line-height:1.5;max-width:480px}.tag-list{list-style:none;padding:0;margin:0;display:flex;gap:6px;flex-wrap:wrap}.tag-list li{border:1px solid #d4d4ce;padding:4px 9px;border-radius:4px;font:10px "DM Mono",monospace;color:#555}.work-philosophy{border-top:1px solid var(--line);padding-top:70px;margin-bottom:110px}.philosophy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.philosophy-card{padding:30px;background:#f7f7f4;border-radius:12px;border:1px solid #ededf6}.ph-number{font:12px "DM Mono",monospace;color:#888;display:block;margin-bottom:14px}.philosophy-card h3{font-size:20px;letter-spacing:-.02em;margin:0 0 10px;font-weight:500}.philosophy-card p{font-size:14px;color:#666;line-height:1.6;margin:0}/* Figma UI/UX Design System Elements */
/* Dedicated About Me Section Styles */
.about-me-section{padding:90px 0 110px;border-top:1px solid var(--line);margin-bottom:70px}.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center}.about-image-column{position:relative}.about-image-frame{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 20px 45px rgba(0,0,0,.15);border:1px solid rgba(0,0,0,.08);aspect-ratio:3/4;background:#181818}.portrait-img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;transition:transform .6s cubic-bezier(.25,1,.5,1)}.about-image-frame:hover .portrait-img{transform:scale(1.04)}.about-image-badge{position:absolute;top:16px;left:16px;background:rgba(18,18,18,.85);color:#fff;padding:6px 14px;border-radius:30px;font:11px "DM Mono",monospace;display:inline-flex;align-items:center;gap:8px;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.15)}.about-image-badge .badge-icon{color:#0d99ff}.canvas-dimensions-tag{position:absolute;bottom:14px;right:14px;background:rgba(13,153,255,.9);color:#fff;padding:4px 10px;border-radius:4px;font:10px "DM Mono",monospace;letter-spacing:.5px}.about-heading{font-size:clamp(32px,4vw,54px);line-height:1.12;letter-spacing:-.02em;font-weight:500;margin:0 0 22px;color:var(--ink)}.about-bio{font-size:clamp(16px,1.4vw,20px);line-height:1.5;color:#555;margin:0 0 35px;letter-spacing:-.01em}.about-specs-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:24px;background:#f5f5f0;border-radius:12px;border:1px solid var(--line);margin-bottom:30px}.spec-item small{display:block;font:10px "DM Mono",monospace;text-transform:uppercase;color:#777;letter-spacing:.5px;margin-bottom:4px}.spec-item strong{font-size:15px;color:var(--ink);font-weight:500}.about-actions{display:flex;align-items:center;gap:16px;margin-top:35px}.about-btn-primary{padding:14px 28px;background:var(--ink);color:#fff;text-decoration:none;border-radius:30px;font:14px "DM Sans",sans-serif;font-weight:500;display:inline-flex;align-items:center;gap:8px;transition:transform .25s ease,background .25s ease}.about-btn-primary:hover{background:#333;transform:translateY(-2px)}.about-btn-secondary{padding:14px 24px;border:1px solid var(--line);color:var(--ink);text-decoration:none;border-radius:30px;font:14px "DM Sans",sans-serif;font-weight:500;display:inline-flex;align-items:center;gap:8px;transition:border-color .25s ease,background .25s ease}.about-btn-secondary:hover{border-color:var(--ink);background:#fff}@media(max-width:768px){.about-grid{grid-template-columns:1fr;gap:40px}.about-specs-grid{grid-template-columns:1fr;gap:16px}.about-actions{flex-direction:column;align-items:stretch}.about-btn-primary,.about-btn-secondary{justify-content:center}}

/* Figma Discovery Canvas Banner (as seen in screenshot 1) */
.figma-discovery-section{position:relative;background:#0f080a;color:#fff;min-height:480px;padding:90px 40px;margin:90px auto 130px;border-radius:18px;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 25px 60px rgba(0,0,0,.25)}.canvas-grid-bg{position:absolute;inset:0;display:grid;grid-template-columns:repeat(12,1fr);pointer-events:none}.canvas-grid-bg div{border-right:1px solid rgba(255,255,255,.05);height:100%}.discovery-content{position:relative;z-index:2;width:100%;max-width:1000px;display:flex;flex-direction:column;align-items:center;justify-content:center}.wireframe-corner{position:absolute;top:-50px;left:-10px;width:110px;height:110px;border-right:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2);transform:rotate(45deg)}.wireframe-card{position:absolute;top:-35px;right:60px;width:170px;height:100px;border:1px solid rgba(255,255,255,.15);border-radius:8px;background:rgba(255,255,255,.02)}.wireframe-card-header{height:28px;border-bottom:1px solid rgba(255,255,255,.12)}.wireframe-pill-btn{position:absolute;bottom:-40px;left:70px;width:160px;height:42px;border:1px solid rgba(255,255,255,.2);border-radius:30px;background:rgba(255,255,255,.02)}.wireframe-controls{position:absolute;bottom:-55px;right:130px;display:flex;flex-direction:column;gap:14px}.control-row{display:flex;gap:16px;align-items:center}.wf-radio{width:22px;height:22px;border-radius:50%;border:2px solid rgba(255,255,255,.35);display:grid;place-items:center}.wf-radio.active{border-color:rgba(255,255,255,.7)}.wf-radio.active i{width:8px;height:8px;border-radius:50%;background:#fff}.wf-checkbox{width:22px;height:22px;border-radius:4px;border:2px solid rgba(255,255,255,.35);display:grid;place-items:center}.wf-checkbox.active{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.1);color:#fff}.wf-checkbox svg{width:14px;height:14px}.figma-text-box{position:relative;border:1.5px solid rgba(255,255,255,.5);padding:24px 44px;background:rgba(0,0,0,.2);backdrop-filter:blur(4px)}.figma-text-box .handle{position:absolute;width:7px;height:7px;background:#fff;border:1px solid #0d99ff}.handle-tl{top:-4px;left:-4px}.handle-tr{top:-4px;right:-4px}.handle-bl{bottom:-4px;left:-4px}.handle-br{bottom:-4px;right:-4px}.discovery-text{font-family:"DM Sans",Arial,sans-serif;font-size:clamp(34px,5.5vw,68px);font-weight:700;color:#fff;line-height:1.15;letter-spacing:-.015em;margin:0;text-align:center}.nominee-badge{position:absolute;right:0;top:50%;transform:translateY(-50%);background:#3bb4a7;color:#fff;padding:16px 9px;display:flex;flex-direction:column;align-items:center;gap:12px;font:11px "DM Mono",monospace;letter-spacing:1px;border-radius:4px 0 0 4px}.w-logo{font:700 16px "DM Sans",sans-serif}.nominee-text{writing-mode:vertical-rl;transform:rotate(180deg);text-transform:uppercase}@media(max-width:768px){.figma-discovery-section{padding:70px 20px;min-height:360px}.figma-text-box{padding:18px 20px}.wireframe-card,.wireframe-pill-btn,.wireframe-controls{display:none}.nominee-badge{padding:10px 5px}}

/* Design to Code Building Section (as seen in screenshot 2) */
.building-section{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 20px 100px;margin-bottom:90px}.glow-pill-widget{background:#181818;border:1px solid rgba(13,153,255,.3);padding:6px 10px;border-radius:20px;display:inline-flex;align-items:center;gap:8px;box-shadow:0 0 35px rgba(13,153,255,.4),0 0 10px rgba(13,153,255,.2);margin-bottom:30px}.pill-tab{background:transparent;border:none;padding:10px 16px;border-radius:12px;color:#888;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .25s ease}.pill-tab.active{background:#101010;color:#0d99ff;border:1px solid rgba(13,153,255,.35);box-shadow:inset 0 0 8px rgba(13,153,255,.15)}.pill-tab:hover:not(.active){color:#fff}.code-symbol{font-family:"DM Mono",monospace;font-size:15px;font-weight:700;letter-spacing:-1px}.building-text{font-family:"DM Sans",Arial,sans-serif;font-size:clamp(38px,5.8vw,72px);font-weight:700;color:var(--ink);line-height:1.12;letter-spacing:-.02em;margin:0;transition:opacity .3s ease,transform .3s ease}.building-text.fade-out{opacity:0;transform:translateY(10px)}

/* Section Animations */
@keyframes floatSlow{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-12px) rotate(1deg)}}@keyframes floatReverse{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(10px) rotate(-1deg)}}@keyframes handlePulse{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(13,153,255,.6)}50%{transform:scale(1.35);box-shadow:0 0 0 5px rgba(13,153,255,0)}}@keyframes textGlowPulse{0%,100%{border-color:rgba(255,255,255,.4);box-shadow:0 0 20px rgba(13,153,255,.15)}50%{border-color:rgba(13,153,255,.85);box-shadow:0 0 35px rgba(13,153,255,.4)}}@keyframes pillGlowPulse{0%,100%{box-shadow:0 0 30px rgba(13,153,255,.35),0 0 8px rgba(13,153,255,.2)}50%{box-shadow:0 0 55px rgba(13,153,255,.65),0 0 16px rgba(13,153,255,.4)}}@keyframes nomineeShimmer{0%,100%{background:#3bb4a7}50%{background:#26c8cf;box-shadow:0 0 20px rgba(38,200,207,.5)}}.wireframe-card{animation:floatSlow 6s ease-in-out infinite}.wireframe-pill-btn{animation:floatReverse 7s ease-in-out infinite}.wireframe-controls{animation:floatSlow 5s ease-in-out infinite}.figma-text-box{animation:textGlowPulse 4s ease-in-out infinite;transition:transform .3s ease}.figma-text-box:hover{transform:scale(1.02)}.figma-text-box .handle{animation:handlePulse 3s ease-in-out infinite}.handle-tr{animation-delay:.5s}.handle-bl{animation-delay:1s}.handle-br{animation-delay:1.5s}.nominee-badge{animation:nomineeShimmer 4s ease-in-out infinite}.glow-pill-widget{animation:pillGlowPulse 3.5s ease-in-out infinite;transition:all .35s ease}.glow-pill-widget.theme-wireframe{box-shadow:0 0 45px rgba(255,170,0,.6),0 0 12px rgba(255,170,0,.3);border-color:rgba(255,170,0,.5)}.glow-pill-widget.theme-figma{box-shadow:0 0 45px rgba(13,153,255,.65),0 0 12px rgba(13,153,255,.3);border-color:rgba(13,153,255,.5)}.glow-pill-widget.theme-code{box-shadow:0 0 45px rgba(42,220,160,.6),0 0 12px rgba(42,220,160,.3);border-color:rgba(42,220,160,.5)}

/* Figma Multiplayer Cursors Background Animation */
.figma-cursors-bg{position:absolute;inset:0;pointer-events:none;background:transparent;z-index:1;overflow:hidden}.figma-cursor-item{position:absolute;will-change:transform;transition:transform .3s cubic-bezier(.25,1,.5,1)}.figma-cursor-wrapper{position:relative;display:inline-flex;align-items:center}.cursor-glow{position:absolute;width:40px;height:40px;border-radius:9999px;filter:blur(16px);opacity:.6;pointer-events:none;top:-8px;left:-8px}.cursor-arrow{position:absolute;top:-16px;left:-10px;filter:drop-shadow(0px 2px 6px rgba(0,0,0,.15))}.cursor-label{padding:3px 10px;font-size:13px;font-family:"DM Sans",sans-serif;font-weight:500;color:#fff;border-radius:20px;white-space:nowrap;position:relative;z-index:10;box-shadow:0 2px 8px rgba(0,0,0,.2);letter-spacing:.2px}@keyframes glideEmilian{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-15px,12px,0)}}@keyframes glideYou{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(12px,-15px,0)}}@keyframes glideJoschi{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-12px,-12px,0)}}.cursor-emilian{animation:glideEmilian 12s ease-in-out infinite}.cursor-you{animation:glideYou 13s ease-in-out infinite}.cursor-joschi{animation:glideJoschi 16s ease-in-out infinite}.section-heading,.projects{position:relative;z-index:5}@media(max-width:768px){.cursor-joschi{display:none}}

/* Prominent & High-Impact Scroll Animation System */
html {
  scroll-behavior: smooth;
}

body.js-loaded section {
  opacity: 0;
  transform: translate3d(0, 85px, 0) scale(0.94);
  filter: blur(8px);
  will-change: opacity, transform, filter;
  transition: opacity 1.1s cubic-bezier(0.19, 1, 0.22, 1),
              transform 1.1s cubic-bezier(0.19, 1, 0.22, 1),
              filter 1.1s cubic-bezier(0.19, 1, 0.22, 1);
}

section.section-active, section.shown {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  filter: blur(0px) !important;
}

/* Prominent Vertical Slide & Scale Reveal */
body.js-loaded .reveal, body.js-loaded .scroll-reveal {
  opacity: 0;
  transform: translate3d(0, 75px, 0) scale(0.92);
  filter: blur(8px);
  will-change: opacity, transform, filter;
  transition: opacity 1.0s cubic-bezier(0.19, 1, 0.22, 1),
              transform 1.0s cubic-bezier(0.19, 1, 0.22, 1),
              filter 1.0s cubic-bezier(0.19, 1, 0.22, 1);
}

.reveal.shown, .scroll-reveal.shown, section.section-active .reveal, section.section-active .scroll-reveal {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  filter: blur(0px) !important;
}

/* Slide in from Left (Prominent) */
body.js-loaded .reveal-left {
  opacity: 0;
  transform: translate3d(-90px, 50px, 0) scale(0.92) rotate(-2deg);
  filter: blur(8px);
  will-change: opacity, transform, filter;
  transition: opacity 1.05s cubic-bezier(0.19, 1, 0.22, 1),
              transform 1.05s cubic-bezier(0.19, 1, 0.22, 1),
              filter 1.05s cubic-bezier(0.19, 1, 0.22, 1);
}

.reveal-left.shown, section.section-active .reveal-left {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) rotate(0deg) !important;
  filter: blur(0px) !important;
}

/* Slide in from Right (Prominent) */
body.js-loaded .reveal-right {
  opacity: 0;
  transform: translate3d(90px, 50px, 0) scale(0.92) rotate(2deg);
  filter: blur(8px);
  will-change: opacity, transform, filter;
  transition: opacity 1.05s cubic-bezier(0.19, 1, 0.22, 1),
              transform 1.05s cubic-bezier(0.19, 1, 0.22, 1),
              filter 1.05s cubic-bezier(0.19, 1, 0.22, 1);
}

.reveal-right.shown, section.section-active .reveal-right {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) rotate(0deg) !important;
  filter: blur(0px) !important;
}

/* Prominent Scale Pop (Cards & Highlights) */
body.js-loaded .reveal-pop {
  opacity: 0;
  transform: translate3d(0, 70px, 0) scale(0.86);
  filter: blur(10px);
  will-change: opacity, transform, filter;
  transition: opacity 1.1s cubic-bezier(0.19, 1, 0.22, 1),
              transform 1.1s cubic-bezier(0.19, 1, 0.22, 1),
              filter 1.1s cubic-bezier(0.19, 1, 0.22, 1);
}

.reveal-pop.shown, section.section-active .reveal-pop {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  filter: blur(0px) !important;
}

/* Staggered Children Animations inside active sections */
body.js-loaded .scroll-stagger-item {
  opacity: 0;
  transform: translate3d(0, 60px, 0) scale(0.93);
  filter: blur(6px);
  will-change: opacity, transform, filter;
  transition: opacity 0.95s cubic-bezier(0.19, 1, 0.22, 1),
              transform 0.95s cubic-bezier(0.19, 1, 0.22, 1),
              filter 0.95s cubic-bezier(0.19, 1, 0.22, 1);
}

.scroll-stagger-item.shown, section.section-active .scroll-stagger-item {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
  filter: blur(0px) !important;
}

/* Glowing Top Scroll Progress Bar */
.scroll-progress-bar {
  position: fixed;
  top: 0;
  left: 0;
  height: 4px;
  background: linear-gradient(90deg, #0d99ff 0%, #26c8cf 35%, #ff5ec6 70%, #bea7ef 100%);
  box-shadow: 0 0 12px rgba(38,200,207,0.8), 0 0 4px rgba(255,94,198,0.6);
  width: 0%;
  z-index: 99999;
  transition: width 0.12s ease-out;
  pointer-events: none;
}

/* ==========================================================================
   Comprehensive Mobile & Tablet Responsive Media Queries
   ========================================================================== */

/* Tablets & Small Laptops (max-width: 992px) */
@media (max-width: 992px) {
  .wrap {
    width: min(100% - 48px, 1220px);
  }
  .about-grid {
    grid-template-columns: 1fr;
    gap: 50px;
  }
  .about-image-frame {
    max-width: 440px;
    margin: 0 auto;
  }
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 50px;
  }
  .archive-grid {
    grid-template-columns: 1fr;
    gap: 60px;
  }
  .philosophy-grid {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
  .projects {
    grid-template-columns: 1fr;
    gap: 60px;
  }
  .project.large, .project.offset {
    grid-column: 1;
    margin-top: 0 !important;
  }
  .figma-cursors-bg {
    display: none !important;
  }
}

/* Mobile Devices & Mobile Browsers (max-width: 768px) */
@media (max-width: 768px) {
  body {
    cursor: auto !important;
  }
  .custom-cursor, .cursor-dot {
    display: none !important;
  }
  .wrap {
    width: min(100% - 32px, 1220px);
  }
  
  /* Mobile Navigation Header */
  .nav {
    height: 72px;
    flex-wrap: wrap;
  }
  .wordmark {
    font-size: 20px;
  }
  .nav nav {
    margin-left: 0;
    gap: 16px;
  }
  .nav nav a {
    font-size: 13px;
    font-family: "DM Mono", monospace;
  }
  .nav-hello {
    font-size: 13px;
  }

  /* Hero Section on Mobile */
  .hero {
    min-height: auto;
    padding: 30px 0 40px;
  }
  .eyebrow {
    font-size: 10px;
    letter-spacing: 1px;
    margin-bottom: 20px;
    line-height: 1.4;
  }
  .hero-title {
    font-size: clamp(38px, 10vw, 76px);
    line-height: 0.95;
  }
  .hero-bottom {
    margin-top: 40px;
    flex-direction: column;
    align-items: stretch;
    gap: 30px;
  }
  .round-link {
    width: 120px;
    height: 120px;
    padding: 16px;
    font-size: 13px;
    align-self: flex-start;
  }
  .uiux-card {
    width: 100%;
    max-width: 360px;
    transform: rotate(0deg);
    box-shadow: 10px 10px 0 #e9e9e4;
  }
  .scroll-note {
    display: none;
  }

  /* About Me Section on Mobile */
  .about-me-section {
    padding: 60px 0 70px;
    margin-bottom: 40px;
  }
  .about-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .about-image-frame {
    max-width: 100%;
  }
  .about-heading {
    font-size: clamp(26px, 6.5vw, 42px);
    line-height: 1.15;
    margin-bottom: 16px;
  }
  .about-bio {
    font-size: 15px;
    line-height: 1.55;
    margin-bottom: 24px;
  }
  .about-specs-grid {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 18px;
    margin-bottom: 24px;
  }
  .ux-process-pills {
    gap: 8px;
  }
  .ux-pill {
    font-size: 10px;
    padding: 6px 12px;
  }
  .about-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-top: 24px;
  }
  .about-btn-primary, .about-btn-secondary {
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
  }

  /* Figma Canvas Banner on Mobile */
  .figma-discovery-section {
    padding: 50px 18px;
    margin: 60px auto;
    min-height: 300px;
    border-radius: 14px;
  }
  .figma-text-box {
    padding: 18px 20px;
    width: 100%;
  }
  .discovery-text {
    font-size: clamp(22px, 5.5vw, 36px);
    line-height: 1.25;
  }
  .wireframe-card, .wireframe-pill-btn, .wireframe-controls, .wireframe-corner {
    display: none;
  }

  /* Building / Design to Code Section on Mobile */
  .building-section {
    padding: 50px 16px;
    margin-bottom: 50px;
  }
  .building-text {
    font-size: clamp(28px, 6.5vw, 48px);
  }
  .glow-pill-widget {
    margin-bottom: 20px;
  }

  /* Featured Projects Section on Mobile */
  .work {
    padding: 60px 0 90px;
  }
  .section-heading {
    margin-bottom: 36px;
  }
  .projects {
    gap: 45px;
  }
  .project-image {
    height: clamp(240px, 62vw, 380px);
    border-radius: 12px;
  }
  .art-title {
    font-size: clamp(32px, 8vw, 54px);
  }
  .flower-shape {
    font-size: 180px;
  }
  .phone-ui {
    width: 70%;
    min-width: 170px;
    padding: 20px 14px;
  }
  .doc-card {
    width: 85%;
    height: 80%;
    padding: 6%;
  }
  .doc-card strong {
    font-size: 24px;
  }
  .project-copy {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .project ul {
    justify-content: flex-start;
    margin-top: 6px;
  }

  /* Work Archive Page on Mobile */
  .work-page {
    padding: 40px 0 70px;
  }
  .work-hero {
    margin-bottom: 36px;
  }
  .work-title {
    font-size: clamp(38px, 9.5vw, 75px);
  }
  .work-summary {
    font-size: 16px;
    margin-bottom: 24px;
  }
  .filter-bar {
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 16px;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .filter-btn {
    white-space: nowrap;
    flex-shrink: 0;
  }
  .archive-grid {
    gap: 40px;
    margin-bottom: 70px;
  }
  .card-image {
    height: clamp(230px, 58vw, 360px);
  }
  .philosophy-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  /* Resume Page on Mobile */
  .resume {
    padding: 40px 0 70px;
  }
  .resume-hero {
    min-height: auto;
  }
  .resume-hero h1 {
    font-size: clamp(38px, 10vw, 85px);
  }
  .resume-location {
    font-size: 14px;
  }
  .resume-contact {
    flex-direction: column;
    gap: 10px;
    margin-top: 24px;
  }
  .resume-summary {
    font-size: clamp(16px, 4.5vw, 24px);
    margin-top: 36px;
  }
  .resume-section {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 24px 0 45px;
  }
  .resume-label {
    margin-bottom: 10px;
  }
  .resume-content h2 {
    font-size: clamp(28px, 6vw, 42px);
    margin-bottom: 30px;
  }
  .skill-columns {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .resume-item {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 16px 0 24px;
  }
  .resume-date {
    font-size: 11px;
  }
  .resume-item h3 {
    font-size: 17px;
  }
  .resume-item p {
    font-size: 14px;
  }

  /* Contact Page on Mobile */
  .contact-page {
    padding: 40px 0 70px;
  }
  .contact-hero {
    margin-bottom: 40px;
  }
  .contact-title {
    font-size: clamp(38px, 9vw, 75px);
  }
  .contact-summary {
    font-size: 16px;
    margin-bottom: 24px;
  }
  .contact-grid {
    gap: 40px;
    padding-top: 30px;
    margin-bottom: 60px;
  }
  .form-row {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .contact-info-card {
    padding: 24px;
    gap: 24px;
  }
  .contact-banner {
    flex-direction: column;
    align-items: stretch;
    text-align: left;
    padding: 36px 24px;
    gap: 24px;
  }
  .banner-btn {
    width: 100%;
    justify-content: center;
  }
  .contact {
    padding: 70px 0;
  }
  .contact h2 {
    font-size: clamp(34px, 8.5vw, 68px);
    margin-bottom: 40px;
  }
  .contact a {
    font-size: 18px;
  }

  /* Case Study Pages on Mobile */
  .case {
    padding-top: 30px;
  }
  .case-icon {
    font-size: 70px;
    height: 90px;
  }
  .case-intro {
    grid-template-columns: 1fr;
    gap: 30px;
    margin: 24px 0 45px;
  }
  .case h1 {
    font-size: clamp(36px, 9vw, 72px);
  }
  .lead {
    font-size: 16px;
    margin-top: 18px;
  }
  .case-hero {
    height: clamp(250px, 60vw, 420px);
    min-height: 240px;
  }
  .case-hero .art-title {
    font-size: clamp(32px, 8vw, 56px);
  }
  .case-text {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 24px 0 40px;
    margin-top: 40px;
  }
  .case-text p:not(.eyebrow) {
    font-size: 15px;
  }
  .phone-screens {
    padding: 36px 16px;
    gap: 16px;
    justify-content: flex-start;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .mobile-screen {
    min-width: 210px;
    min-height: 360px;
  }
  .screens {
    gap: 20px;
  }
  .screen {
    height: clamp(240px, 60vw, 400px);
  }
  .floral-screen {
    font-size: clamp(28px, 6vw, 48px);
    padding: 8%;
  }
  .docs-screens {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .doc-screen {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .doc-screen aside {
    padding: 16px;
    border-bottom: 1px solid #d0c8b8;
  }
  .doc-screen article {
    padding: 24px 18px;
  }
  .more {
    margin-top: 60px;
    padding-bottom: 50px;
  }
  .more > div {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  /* Footer on Mobile */
  footer {
    height: auto;
    padding: 30px 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  footer div {
    flex-wrap: wrap;
    gap: 12px 18px;
  }
}

/* Extra Small Phones (max-width: 480px) */
@media (max-width: 480px) {
  .wrap {
    width: min(100% - 24px, 1220px);
  }
  .hero-title {
    font-size: clamp(34px, 11vw, 56px);
  }
  .round-link {
    width: 105px;
    height: 105px;
    font-size: 12px;
    padding: 14px;
  }
  .uiux-card {
    padding: 14px 16px;
  }
  .about-specs-grid {
    padding: 14px;
  }
  .about-btn-primary, .about-btn-secondary {
    font-size: 13px;
    padding: 12px 16px;
  }
  .submit-btn {
    width: 100%;
    justify-content: center;
  }
}