:root{--bg: #f8f7f1;--black: #0a0a0a;--body: #333333;--muted: #777777;--border: #dddddd;--border-img: #d9d8d5;--white: #ffffff;--blue: #1838a7;--accent: #343ec8;--web-bg: #eaf4ed;--web-text: #2a5a3a;--deck-bg: #eeeaf6;--deck-text: #3a2a6a;--brand-bg: #f5ede4;--brand-text: #7a3a18;--font: "Ubuntu Sans", sans-serif;--f-sm: 13px;--f-base: 18px;--f-label: 32px;--w-reg: 400;--w-semi: 600;--w-bold: 700;--container: 1200px;--pad: 40px;--section-gap: 80px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 24px;--r-card: 14px;--r-pill: 24px;--r-tag: 4px;--gap: 16px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font);background:var(--bg);color:var(--black);font-size:var(--f-base);font-weight:var(--w-reg);line-height:1.6;-webkit-font-smoothing:antialiased}nav{position:fixed;top:0;left:0;right:0;margin:0 auto;z-index:100;background:#ffffff26;backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);border:1px solid rgba(255,255,255,.1);border-top:none;border-radius:0;padding:0 40px;height:64px;display:flex;align-items:center;justify-content:space-between;width:100%;max-width:var(--container);transition:all .7s cubic-bezier(.16,1,.3,1)}nav.scrolled{top:24px;width:calc(100% - 48px);max-width:640px;background:#ffffff40;border:1px solid rgba(255,255,255,.6);border-radius:100px;box-shadow:0 16px 48px #00000014,0 4px 12px #0000000a;padding:0 40px}.nav-logo{font-size:var(--f-sm);font-weight:var(--w-bold);letter-spacing:.08em;text-transform:uppercase;color:var(--black);text-decoration:none}.nav-links{display:flex;gap:28px;align-items:center}.nav-links a{font-size:var(--f-sm);color:var(--muted);text-decoration:none;letter-spacing:.04em;transition:color .2s}.nav-links a:hover{color:var(--black)}.nav-back{font-weight:var(--w-bold);color:var(--black)!important}.nav-cta{font-size:var(--f-sm);font-weight:var(--w-semi);color:var(--black)!important;border-bottom:1px solid rgba(0,0,0,.3);padding-bottom:1px;transition:border-color .2s}.nav-cta:hover{border-color:var(--black)}footer{border-top:.5px solid var(--border);padding:28px var(--pad)}.foot-inner{max-width:var(--container);margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.foot-inner span,.foot-inner a{font-size:var(--f-sm);color:var(--body);text-decoration:none;transition:color .2s}.foot-inner a:hover{color:var(--black)}.foot-links{display:flex;gap:24px}.img-card{background:var(--white);border:.5px solid var(--border);border-radius:20px;padding:14px}.img-card.sand{background:#e6e4d7}.img-inner{border:.5px solid var(--border-img);border-radius:12px;overflow:hidden;width:100%}.img-inner img{display:block;width:100%;height:auto}.case-section{display:flex;flex-direction:column;gap:40px}.case-wrap{display:flex;align-items:flex-start;justify-content:space-between;gap:40px}.case-label{font-size:var(--f-label);font-weight:var(--w-bold);letter-spacing:3px;color:var(--black);white-space:nowrap;flex-shrink:0;line-height:1.2}.case-body{width:540px;flex-shrink:0}.case-body p{font-size:var(--f-base);color:var(--body);line-height:1.65;margin-bottom:16px}.case-body p:last-child{margin-bottom:0}.case-body strong{font-weight:var(--w-semi);color:var(--black)}.divider{width:100%;height:.5px;background:var(--border);flex-shrink:0}.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--pad)}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.home-hero{padding:120px 0 80px;position:relative;overflow:hidden}.hero-intro{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:64px}.hero-eyebrow{font-size:13px;font-weight:400;color:var(--muted);letter-spacing:.06em;margin-bottom:16px;opacity:0;animation:fadeUp .6s ease .1s forwards}.hero-name{font-size:clamp(64px,9vw,108px);font-weight:800;line-height:.95;letter-spacing:-.03em;margin-bottom:32px;color:#666;opacity:0;animation:fadeUp .6s ease .2s forwards}@supports (-webkit-background-clip: text) or (background-clip: text){.hero-name{background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50' width='100' height='50'%3E%3Crect width='100' height='50' fill='%23ffffff'/%3E%3Cg fill='none' stroke='%23666666' stroke-width='1.6'%3E%3Cpath d='M0,0 Q25,12 50,0 T100,0'/%3E%3Cpath d='M0,5 Q25,17 50,5 T100,5'/%3E%3Cpath d='M0,10 Q25,22 50,10 T100,10'/%3E%3Cpath d='M0,15 Q25,27 50,15 T100,15'/%3E%3Cpath d='M0,20 Q25,32 50,20 T100,20'/%3E%3Cpath d='M0,25 Q25,37 50,25 T100,25'/%3E%3Cpath d='M0,30 Q25,42 50,30 T100,30'/%3E%3Cpath d='M0,35 Q25,47 50,35 T100,35'/%3E%3Cpath d='M0,40 Q25,52 50,40 T100,40'/%3E%3Cpath d='M0,45 Q25,57 50,45 T100,45'/%3E%3Cpath d='M0,-5 Q25,7 50,-5 T100,-5'/%3E%3Cpath d='M0,-10 Q25,2 50,-10 T100,-10'/%3E%3Cpath d='M0,50 Q25,62 50,50 T100,50'/%3E%3Cpath d='M0,55 Q25,67 50,55 T100,55'/%3E%3C/g%3E%3C/svg%3E");background-size:80px 40px;background-repeat:repeat;background-position:0px 0px;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:fadeUp .6s ease .2s forwards,driftContours 120s linear infinite}}@keyframes driftContours{0%{background-position:0px 0px}to{background-position:800px 400px}}.hero-tagline{display:inline-block;font-size:18px;font-weight:500;color:var(--black);border:.5px solid var(--border);border-radius:40px;padding:14px 28px;background:#fff9;opacity:0;animation:fadeUp .6s ease .3s forwards}.what{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;border:.5px solid var(--border);border-radius:var(--radius-lg);padding:64px;cursor:default;background:#ffffff14;backdrop-filter:blur(18px) saturate(160%) brightness(1.04);-webkit-backdrop-filter:blur(18px) saturate(160%) brightness(1.04);opacity:0;animation:fadeUp .6s ease .4s forwards;transition:box-shadow .4s ease,border-color .4s ease}.what:hover{box-shadow:0 16px 48px #0000000a;border-color:#0000001f}.what-photo{width:100%;aspect-ratio:4/5;background:#e8e6de;border-radius:var(--radius-md);overflow:hidden;position:relative;transition:transform .6s cubic-bezier(.16,1,.3,1),box-shadow .6s ease,filter .6s ease;filter:grayscale(100%)}.what-photo:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 24px 48px #0000001a;filter:grayscale(0%)}.what-photo img{width:100%;height:100%;object-fit:cover;opacity:.85;transition:transform .8s cubic-bezier(.16,1,.3,1),opacity .6s ease}.what-photo:hover img{transform:scale(1.06);opacity:1}.what-photo-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--muted);letter-spacing:.06em;transition:color .4s ease,transform .6s cubic-bezier(.16,1,.3,1)}.what-photo:hover .what-photo-placeholder{color:var(--black);transform:scale(1.1)}.what-text{display:flex;flex-direction:column;justify-content:center;gap:24px}.what-text p{font-size:18px;line-height:1.75;color:#0a0a0ab3}.what-text p strong{color:var(--black);font-weight:600}.section-divider{max-width:var(--container);margin:80px auto 48px;padding:0 40px;display:flex;align-items:center;gap:20px}.divider-label{font-size:18px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--body);white-space:nowrap}.divider-line{flex:1;height:.5px;background:var(--border)}.work-grid{max-width:var(--container);margin:0 auto;padding:0 40px 120px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.work-card{background:var(--white);border:.5px solid var(--border);border-radius:var(--radius-md);overflow:hidden;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;text-decoration:none;color:inherit;display:flex;flex-direction:column}.work-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px #00000014}.work-card .card-thumb{width:100%;aspect-ratio:16/10;background:#e8e6de;position:relative;overflow:hidden}.work-card .card-thumb img{width:100%;height:100%;object-fit:cover}.card-thumb-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--muted);letter-spacing:.06em}.card-1 .card-thumb{background:#e8edf5}.card-2 .card-thumb{background:#e8f0ec}.card-3 .card-thumb{background:#f0ebe3}.work-card .card-body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}.card-badge{display:inline-block;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);background:#1838a70f;border-radius:4px;padding:3px 8px;width:fit-content;margin-bottom:8px}.work-card .card-title{font-size:20px;font-weight:700;color:var(--black);line-height:1.2}.work-card .card-desc{font-size:16px;color:var(--body);line-height:1.65;flex:1}.card-cta{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--black);margin-top:8px;letter-spacing:.02em}.card-cta svg{transition:transform .2s}.work-card:hover .card-cta svg{transform:translate(4px)}.hero-section{padding:160px 0 120px}.hero-inner{display:flex;flex-direction:column;gap:var(--section-gap)}.hero-badge{display:inline-block;font-size:var(--f-sm);font-weight:var(--w-bold);letter-spacing:.1em;text-transform:uppercase;color:var(--blue);background:#1838a70f;border:.5px solid rgba(24,56,167,.2);border-radius:6px;padding:8px 16px}.hero-title{font-size:clamp(40px,5vw,56px);font-weight:var(--w-bold);line-height:1;letter-spacing:-.02em;color:var(--black);margin-top:24px}.hero-sub{font-size:clamp(20px,2.5vw,32px);font-weight:var(--w-reg);line-height:1.4;color:var(--black);margin-top:40px;max-width:860px}.flow-section{padding-bottom:120px}.flow-inner{display:flex;flex-direction:column;gap:var(--section-gap)}.brief-row{display:flex;gap:80px;align-items:flex-start}.brief-img{flex-shrink:0}.brief-img .img-card{width:580px}.brief-text{flex:1;display:flex;flex-direction:column;gap:40px}.vc-hero{max-width:var(--container);margin:0 auto;padding:160px var(--pad) 80px;border-bottom:.5px solid var(--border)}.vc-badge{display:inline-block;font-size:var(--f-sm);font-weight:var(--w-bold);letter-spacing:.1em;text-transform:uppercase;color:var(--blue);background:#1838a70f;border:.5px solid rgba(24,56,167,.2);border-radius:var(--r-tag);padding:5px 12px;margin-bottom:24px}.vc-title{font-size:clamp(48px,7vw,80px);font-weight:var(--w-bold);line-height:.95;letter-spacing:-.03em;color:var(--black);margin-bottom:40px}.vc-sub{font-size:16px;color:var(--body);line-height:1.65;max-width:520px}.tabs-wrap{max-width:var(--container);margin:0 auto;padding:36px var(--pad) 0}.tabs{display:inline-flex;background:#0000000d;border-radius:var(--r-pill);padding:4px;gap:0;position:relative}.tab-slider{position:absolute;top:4px;left:0;height:calc(100% - 8px);background:var(--white);border-radius:calc(var(--r-pill) - 4px);box-shadow:0 1px 4px #0000001f;transition:transform .22s cubic-bezier(.4,0,.2,1),width .22s cubic-bezier(.4,0,.2,1);pointer-events:none;z-index:0}.tab{font-family:var(--font);font-size:var(--f-sm);font-weight:var(--w-bold);padding:8px 22px;border-radius:calc(var(--r-pill) - 4px);border:none;background:transparent;color:var(--muted);cursor:pointer;position:relative;z-index:1;transition:color .2s;white-space:nowrap;-webkit-user-select:none;user-select:none}.tab.active{color:var(--black)}.tab:not(.active):hover{color:var(--black)}.grid-wrap{max-width:var(--container);margin:0 auto;padding:36px var(--pad) 120px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}.grid-empty{grid-column:1 / -1;text-align:center;padding:60px;color:var(--muted);font-size:var(--f-base)}.vc-card{background:var(--white);border:.5px solid var(--border);border-radius:var(--r-card);overflow:hidden;cursor:pointer;display:flex;flex-direction:column;transition:border-color .25s,box-shadow .25s}.vc-card:hover{border-color:#bbb;box-shadow:0 4px 20px #00000014}.vc-card .card-thumb{width:100%;aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.vc-card .card-thumb img{width:100%;height:100%;object-fit:cover}.thumb-ph{width:82%;height:72%;border-radius:6px;background:#ffffff80;border:.5px solid rgba(0,0,0,.07);display:flex;align-items:center;justify-content:center;font-size:var(--f-sm);color:#00000038;font-weight:var(--w-reg)}.tw{background:var(--web-bg)}.td{background:var(--deck-bg)}.tb{background:var(--brand-bg)}.vc-card .card-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}.card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap;overflow:hidden;margin-bottom:8px}.cat-tag{font-size:10px;font-weight:var(--w-bold);letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:var(--r-tag);white-space:nowrap;flex-shrink:0}.ct-w{background:var(--web-bg);color:var(--web-text)}.ct-d{background:var(--deck-bg);color:var(--deck-text)}.ct-b{background:var(--brand-bg);color:var(--brand-text)}.card-co{font-size:var(--f-sm);color:var(--muted);font-weight:var(--w-reg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vc-card .card-title{font-size:var(--f-base);font-weight:var(--w-bold);color:var(--black);line-height:1.25}.vc-card .card-desc{font-size:16px;font-weight:var(--w-reg);color:var(--body);line-height:1.65;flex:1}.card-foot{display:flex;align-items:center;justify-content:flex-end;margin-top:8px;padding-top:10px;border-top:.5px solid #eeede7}.view-btn{font-family:var(--font);font-size:var(--f-sm);font-weight:var(--w-bold);color:var(--black);background:none;border:.5px solid var(--border);border-radius:6px;padding:5px 12px;cursor:pointer;display:flex;align-items:center;gap:4px;transition:background .2s,border-color .2s}.view-btn:hover{background:#f4f3ed;border-color:#aaa}.overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#00000080;align-items:center;justify-content:center;padding:32px}.overlay.open{display:flex}.modal{background:var(--white);border-radius:20px;width:100%;max-width:var(--container);height:90vh;max-height:90vh;overflow:hidden;display:flex;flex-direction:column}.modal-hdr{padding:20px 24px 16px;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:.5px solid var(--border);flex-shrink:0}.modal-title{font-size:var(--f-base);font-weight:var(--w-bold);color:var(--black)}.modal-sub{font-size:var(--f-sm);color:var(--body);margin-top:2px}.modal-x{background:#f0efe9;border:none;border-radius:50%;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:var(--f-base);color:var(--body);flex-shrink:0;font-family:inherit;transition:background .2s}.modal-x:hover{background:#e4e3dc}.modal-body{flex:1;overflow:auto;display:flex;flex-direction:column;background:var(--bg);min-height:460px}.bento-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-auto-rows:280px;grid-auto-flow:dense;gap:24px;padding:32px;width:100%}.bento-item{border-radius:12px;overflow:hidden;background:var(--white);border:.5px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:var(--f-sm);position:relative;transition:border-color .3s ease}.bento-item:hover{border-color:#00000029}.bento-item.feature{grid-column:span 2;grid-row:span 2}.bento-item.wide{grid-column:span 2}.bento-item.tall{grid-row:span 2}.bento-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}.bento-item:hover img{transform:scale(1.02)}.modal-ph{display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--muted);font-size:var(--f-sm);text-align:center;padding:48px}.modal-ph-icon{width:44px;height:44px;border-radius:10px;background:#e8e6de;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:var(--w-bold);color:var(--muted)}@media (max-width: 900px){:root{--f-label: 24px}.work-grid{grid-template-columns:1fr 1fr}.what{grid-template-columns:1fr;gap:48px;padding:48px}.case-wrap{flex-direction:column}.case-body{width:100%}.brief-row{flex-direction:column}.brief-img .img-card{width:100%}.hero-section{padding:100px 0 60px}.flow-section{padding-bottom:60px}.grid-wrap{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 600px){:root{--pad: 20px}.home-hero{padding:80px 20px 60px}.work-grid{grid-template-columns:1fr;padding:0 20px 80px}.section-divider{padding:0 20px}.what{padding:32px;gap:32px}.hero-title{font-size:36px}.grid-wrap{grid-template-columns:1fr;padding-bottom:80px}.vc-title{font-size:40px}}