@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{color:#111;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#fff;font-family:Inter,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:#111;background:#fff;min-width:320px;margin:0;font-family:Inter,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.portfolio-page{background:#fff;min-height:100vh}.portfolio-header{border-bottom:1px solid #eee;justify-content:space-between;align-items:center;width:min(1440px,100% - 80px);height:82px;margin:0 auto;display:flex}.sn-brand{letter-spacing:-1.2px;align-items:center;font-size:24px;font-weight:800;display:inline-flex}.sn-super{color:#111}.sn-noctis{color:#ff6a00}.contact-button{color:#fff;background:#ff6a00;border:1px solid #ff6a00;border-radius:999px;padding:11px 22px;font-size:13px;font-weight:700;transition:transform .2s,box-shadow .2s,background .2s}.contact-button:hover{background:#e95f00;transform:translateY(-2px);box-shadow:0 8px 20px #ff6a0038}.portfolio-hero{text-align:center;width:min(1440px,100% - 80px);margin:0 auto;padding:65px 0 48px}.portfolio-hero h1{letter-spacing:-4px;margin:0;font-size:clamp(52px,6vw,78px);font-weight:800;line-height:1}.portfolio-hero h1 span{color:#ff6a00}.portfolio-controls{border-bottom:1px solid #eee;width:min(1440px,100% - 80px);margin:0 auto;padding-bottom:40px}.category-list{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.category-pill{color:#404040;background:#f5f5f7;border:1px solid #eee;border-radius:100px;padding:11px 20px;font-size:13px;font-weight:600;transition:background .2s,color .2s,transform .2s,box-shadow .2s}.category-pill:hover{background:#eee;transform:translateY(-2px)}.category-pill.active{color:#fff;background:#ff6a00;border-color:#ff6a00;box-shadow:0 7px 18px #ff6a0038}.projects-container{width:min(1280px,100% - 100px);margin:0 auto;padding:45px 0 100px}.projects-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;display:grid}.portfolio-card{perspective:1000px;display:block}.portfolio-card-visual{background:radial-gradient(circle at 85% 10%, color-mix(in srgb, var(--accent) 17%, white), transparent 38%), linear-gradient(145deg, #fff 0%, #fafafa 55%, #f1f1f1 100%);border:1px solid #e6e6e6;border-radius:18px;flex-direction:column;min-height:340px;padding:20px;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s;display:flex;position:relative;overflow:hidden;box-shadow:0 2px 3px #00000008,0 10px 28px #0000000e}.portfolio-card:hover .portfolio-card-visual{border-color:#d8d8d8;transform:translateY(-7px)rotateX(1deg)rotateY(-1deg);box-shadow:0 4px 10px #0000000a,0 20px 45px #0000001c}.card-top{justify-content:space-between;align-items:center;display:flex}.card-category{color:#fff;background:#242424;border-radius:100px;align-items:center;padding:7px 12px;font-size:10px;font-weight:700;display:inline-flex}.card-arrow{background:#fff;border:1px solid #e4e4e4;border-radius:50%;place-items:center;width:34px;height:34px;font-size:16px;transition:transform .25s,background .25s,color .25s;display:grid}.portfolio-card:hover .card-arrow{color:#fff;background:#111;transform:rotate(45deg)}.project-brand{flex:1;justify-content:center;align-items:center;padding:30px 15px;display:flex}.project-brand img{object-fit:contain;filter:drop-shadow(0 12px 18px #00000017);border-radius:23px;width:100px;height:100px}.logo-placeholder{background:var(--accent);color:#fff;width:100px;height:100px;box-shadow:0 18px 35px color-mix(in srgb, var(--accent) 25%, transparent);border-radius:23px;place-items:center;font-size:42px;font-weight:800;display:grid}.card-bottom{justify-content:space-between;align-items:flex-end;gap:20px;display:flex}.empty-projects{text-align:center;color:#888;padding:80px 20px}.portfolio-footer{color:#888;border-top:1px solid #eee;justify-content:space-between;align-items:center;width:min(1280px,100% - 100px);margin:0 auto;padding:28px 0 40px;font-size:11px;display:flex}.contact-overlay{z-index:1000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0a0a0a94;justify-content:center;align-items:center;padding:25px;display:flex;position:fixed;inset:0}.contact-modal{background:#fff;border-radius:24px;width:min(620px,100%);max-height:calc(100vh - 50px);padding:42px;position:relative;overflow-y:auto;box-shadow:0 30px 100px #00000040}.contact-close{color:#555;background:#fff;border:1px solid #e5e5e5;border-radius:50%;width:38px;height:38px;font-size:25px;line-height:1;position:absolute;top:20px;right:20px}.contact-header span{color:#ff6a00;letter-spacing:1.5px;font-size:11px;font-weight:800}.contact-header h2{letter-spacing:-2.5px;margin:14px 0 12px;font-size:44px;line-height:1.05}.contact-header h2 strong{color:#ff6a00}.contact-header p{color:#777;max-width:480px;margin:0 0 30px;font-size:14px;line-height:1.6}.contact-form{flex-direction:column;gap:18px;display:flex}.form-row{grid-template-columns:1fr 1fr;gap:15px;display:grid}.form-field{flex-direction:column;gap:7px;display:flex}.form-field label{color:#333;font-size:11px;font-weight:700}.form-field input,.form-field textarea{color:#111;resize:vertical;background:#fafafa;border:1px solid #ddd;border-radius:10px;outline:none;width:100%;padding:13px 14px;font-size:13px;transition:border-color .2s,background .2s,box-shadow .2s}.form-field input:focus,.form-field textarea:focus{background:#fff;border-color:#ff6a00;box-shadow:0 0 0 3px #ff6a001a}.submit-button{color:#fff;background:#111;border:none;border-radius:11px;justify-content:space-between;align-items:center;width:100%;margin-top:5px;padding:15px 18px;font-size:13px;font-weight:700;transition:background .2s,transform .2s;display:flex}.submit-button span{font-size:18px}.submit-button:hover{background:#ff6a00;transform:translateY(-2px)}@media (width<=1050px){.projects-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=700px){.portfolio-header,.portfolio-hero,.portfolio-controls,.projects-container,.portfolio-footer{width:calc(100% - 32px)}.portfolio-header{height:72px}.sn-brand{font-size:21px}.contact-button{padding:9px 16px;font-size:12px}.portfolio-hero{padding:50px 0 38px}.portfolio-hero h1{letter-spacing:-3px;font-size:48px}.category-list{justify-content:flex-start}.category-pill{padding:10px 15px;font-size:12px}.projects-container{padding-top:30px}.projects-grid{grid-template-columns:1fr;gap:18px}.portfolio-card-visual{min-height:330px}.contact-modal{border-radius:20px;padding:30px 22px}.contact-header h2{letter-spacing:-1.8px;font-size:36px}.form-row{grid-template-columns:1fr}.portfolio-footer{flex-direction:column;align-items:flex-start;gap:18px}}.project-detail-page{background:#fff;min-height:100vh}.detail-back{color:#555;font-size:12px;font-weight:700;transition:color .2s,transform .2s}.detail-back:hover{color:#ff6a00}.project-detail-hero{background:radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--accent) 12%, white), transparent 42%), #fff;border-bottom:1px solid #eee;position:relative;overflow:hidden}.detail-hero-inner{text-align:center;flex-direction:column;align-items:center;width:min(1000px,100% - 50px);margin:0 auto;padding:75px 0 85px;display:flex}.detail-category{color:#fff;background:#242424;border-radius:100px;padding:8px 14px;font-size:11px;font-weight:700}.detail-logo{margin-top:30px}.detail-logo img,.detail-logo-placeholder{object-fit:contain;filter:drop-shadow(0 18px 30px #0000001c);border-radius:25px;width:105px;height:105px}.detail-logo-placeholder{background:var(--accent);color:#fff;place-items:center;font-size:42px;font-weight:800;display:grid}.detail-hero-inner h1{letter-spacing:-5px;margin:28px 0 0;font-size:clamp(58px,8vw,100px);font-weight:800;line-height:.95}.detail-short-description{color:#777;max-width:680px;margin:25px 0 20px;font-size:17px;line-height:1.6}.detail-status{color:#555;align-items:center;gap:7px;font-size:12px;font-weight:600;display:inline-flex}.status-dot{background:#aaa;border-radius:50%;width:7px;height:7px}.status-dot.live{background:#44b44c;box-shadow:0 0 0 4px #44b44c1f}.project-information{width:min(1100px,100% - 50px);margin:0 auto;padding:90px 0}.project-info-grid{grid-template-columns:minmax(0,1.6fr) minmax(260px,.7fr);gap:90px;display:grid}.section-label{color:#ff6a00;letter-spacing:1.5px;font-size:10px;font-weight:800}.project-info-main h2{letter-spacing:-2px;max-width:650px;margin:15px 0 20px;font-size:44px;font-weight:800;line-height:1.05}.project-description{color:#666;max-width:650px;margin:0;font-size:16px;line-height:1.8}.project-tags{flex-wrap:wrap;gap:8px;margin-top:30px;display:flex}.project-tags span{color:#444;background:#fafafa;border:1px solid #e8e8e8;border-radius:100px;padding:8px 12px;font-size:11px;font-weight:600}.project-meta{border-top:1px solid #eee}.meta-item{border-bottom:1px solid #eee;flex-direction:column;gap:7px;padding:18px 0;display:flex}.meta-item span{color:#999;text-transform:uppercase;letter-spacing:.8px;font-size:10px;font-weight:700}.meta-item strong{color:#111;font-size:14px;line-height:1.4}.project-highlights{width:min(1100px,100% - 50px);margin:0 auto;padding:0 0 90px}.highlights-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px;display:grid}.highlight-card{background:linear-gradient(145deg,#fff,#f8f8f8);border:1px solid #e8e8e8;border-radius:17px;min-height:180px;padding:22px;transition:transform .25s,box-shadow .25s}.highlight-card:hover{transform:translateY(-5px);box-shadow:0 15px 35px #00000012}.highlight-card span{color:#ff6a00;font-size:10px;font-weight:800}.highlight-card h3{letter-spacing:-.4px;margin:45px 0 0;font-size:17px;line-height:1.25}.project-links-section{width:min(1100px,100% - 50px);margin:0 auto;padding:0 0 90px}.project-links{flex-wrap:wrap;gap:10px;margin-top:22px;display:flex}.project-link{color:#222;border:1px solid #ddd;border-radius:11px;justify-content:space-between;align-items:center;gap:35px;min-width:170px;padding:14px 16px;font-size:12px;font-weight:700;transition:transform .2s,background .2s,color .2s,border-color .2s;display:inline-flex}.project-link span{font-size:16px}.project-link:hover{color:#fff;background:#111;border-color:#111;transform:translateY(-2px)}.project-link.primary{color:#fff;background:#ff6a00;border-color:#ff6a00}.project-link.primary:hover{background:#111;border-color:#111}.project-back-section{width:min(1100px,100% - 50px);margin:0 auto;padding:0 0 100px}.large-back-link{letter-spacing:-.4px;align-items:center;gap:14px;font-size:18px;font-weight:700;transition:gap .25s,color .25s;display:inline-flex}.large-back-link span{color:#ff6a00}.large-back-link:hover{color:#ff6a00;gap:20px}.project-not-found{text-align:center;place-items:center;min-height:100vh;padding:30px;display:grid}.not-found-code{color:#ff6a00;letter-spacing:-5px;font-size:90px;font-weight:800;line-height:1;display:block}.project-not-found h1{letter-spacing:-1.5px;margin:20px 0 10px;font-size:38px}.project-not-found p{color:#777;margin:0 0 25px}.back-button{color:#fff;background:#111;border-radius:10px;padding:13px 18px;font-size:12px;font-weight:700;display:inline-flex}@media (width<=800px){.detail-hero-inner{padding:55px 0 65px}.detail-hero-inner h1{letter-spacing:-3.5px;font-size:62px}.detail-short-description{font-size:15px}.project-information{padding:65px 0}.project-info-grid{grid-template-columns:1fr;gap:50px}.project-info-main h2{font-size:38px}.highlights-grid{grid-template-columns:1fr 1fr}}@media (width<=550px){.detail-back{font-size:11px}.detail-logo img,.detail-logo-placeholder{border-radius:20px;width:85px;height:85px}.detail-hero-inner h1{letter-spacing:-3px;font-size:52px}.detail-short-description{font-size:14px}.project-information,.project-highlights,.project-links-section,.project-back-section{width:calc(100% - 32px)}.project-info-main h2{font-size:34px}.project-description{font-size:15px}.highlights-grid{grid-template-columns:1fr}.highlight-card{min-height:140px}.highlight-card h3{margin-top:35px}.project-links{flex-direction:column}.project-link{width:100%}}.portfolio-card-visual{flex-direction:column;min-height:340px;padding:36px 32px 30px;display:flex;position:relative;overflow:hidden}.project-brand{z-index:2;flex:1;justify-content:center;align-items:center;min-height:210px;padding:40px 20px 20px;display:flex;position:relative}.project-brand img{object-fit:contain;width:auto;max-width:220px;height:auto;max-height:160px;transition:transform .35s,filter .35s;display:block;transform:scale(1)}.card-bottom{z-index:3;padding-top:10px;position:relative}.card-category,.card-arrow{z-index:4;position:relative}@media (width<=700px){.portfolio-card-visual{min-height:320px;padding:28px 24px 26px}.project-brand{min-height:190px;padding:30px 10px 15px}.project-brand img{max-width:190px;max-height:145px}.portfolio-card:first-child .project-brand img{max-width:205px;max-height:115px}.portfolio-card:nth-child(2) .project-brand img{max-width:170px;max-height:155px}.portfolio-card:nth-child(3) .project-brand img{max-width:160px;max-height:160px}.card-bottom h2{font-size:27px}}.portfolio-card-visual{min-height:340px;padding:32px 32px 28px}.card-category{display:none!important}.project-brand{flex:1;justify-content:center;align-items:center;min-height:230px;padding:20px;display:flex}.project-brand img{object-fit:contain;width:auto;max-width:280px;height:auto;max-height:210px;transition:transform .35s;display:block}.portfolio-card:hover .project-brand img{transform:scale(1.06)}.portfolio-card:first-child .project-brand img{mix-blend-mode:multiply;max-width:300px;max-height:150px}.portfolio-card:nth-child(2) .project-brand img{max-width:235px;max-height:215px}.portfolio-card:nth-child(3) .project-brand img{max-width:220px;max-height:220px}.card-bottom{padding-top:12px}.card-bottom h2{letter-spacing:-1.2px;margin:0;font-size:30px;font-weight:700;line-height:1.1}@media (width<=700px){.portfolio-card-visual{min-height:320px;padding:28px 24px 25px}.project-brand{min-height:215px;padding:15px}.project-brand img{max-width:235px;max-height:180px}.portfolio-card:first-child .project-brand img{max-width:250px;max-height:125px}.portfolio-card:nth-child(2) .project-brand img{max-width:200px;max-height:190px}.portfolio-card:nth-child(3) .project-brand img{max-width:190px;max-height:190px}.card-bottom h2{font-size:27px}}.portfolio-footer{justify-content:flex-end}.footer-copyright{color:#777;margin-left:auto;font-size:14px;font-weight:500}
