@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=Noto+Sans+KR:wght@300;400;500;600;700&display=swap');
:root{--navy:#101e30;--deep:#0b1522;--gold:#c5a16a;--cream:#f5f3ef;--ink:#202b36;--muted:#77808a;--line:#deded9;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans','Noto Sans KR',sans-serif;line-height:1.75}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}img{display:block;width:100%;height:100%;object-fit:cover}::selection{background:var(--gold);color:#101e30}
.skip{position:absolute;top:-100px;left:12px;z-index:50;background:#fff;padding:10px}.skip:focus{top:12px}
.nav{position:fixed;z-index:40;top:0;left:0;right:0;padding:21px 5.5%;display:flex;align-items:center;justify-content:space-between;color:#fff;transition:.4s;background:linear-gradient(#07101aa8,transparent)}.nav.scrolled{background:#101e30ed;backdrop-filter:blur(18px);padding-top:14px;padding-bottom:14px;border-bottom:1px solid #ffffff17}.brand{font-family:Manrope,sans-serif;font-size:21px;font-weight:800;letter-spacing:.08em;white-space:nowrap}.brand b{color:var(--gold)}.navlinks{display:flex;align-items:center;gap:35px}.navlinks a{font-size:11px;letter-spacing:.16em;font-weight:700}.navlinks a:hover,.navlinks a:focus-visible{color:var(--gold)}.navlinks .outline{border:1px solid #ffffff6a;padding:13px 19px}.menu{display:none;background:none;color:#fff;border:0;font-size:27px}
.hero{min-height:800px;height:100svh;max-height:1100px;position:relative;color:white;background:var(--deep);display:flex;align-items:center;overflow:hidden}.hero-bg{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(8,17,29,.88) 0%,rgba(8,17,29,.44) 65%,rgba(8,17,29,.25)),url('https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=2200&q=85');background-size:cover;background-position:center;transform:scale(1.04);animation:heroZoom 14s ease-out forwards}@keyframes heroZoom{to{transform:scale(1)}}.hero-content{position:relative;z-index:1;margin:70px 8% 0;max-width:900px}.eyebrow{color:var(--gold);font-size:11px;letter-spacing:.3em;font-weight:700;text-transform:uppercase}.hero h1{font-size:clamp(50px,7.3vw,112px);line-height:1.17;letter-spacing:-.065em;font-weight:500;margin:24px 0 30px}.hero h1 em{font-weight:400;font-style:normal;color:#d9b982}.hero p{max-width:560px;color:#d7dce1;font-size:15px;line-height:2}.hero-bottom{position:absolute;bottom:38px;left:8%;right:8%;display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.17em;color:#e7e6e3}.line{display:inline-block;width:50px;height:1px;background:var(--gold);vertical-align:middle;margin-right:15px}
.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:45px;padding:17px 24px;border:1px solid var(--gold);color:var(--gold);font-size:11px;font-weight:700;letter-spacing:.13em;transition:.3s}.btn:hover{background:var(--gold);color:var(--deep)}.btn.fill{background:var(--gold);color:var(--deep)}.btn.fill:hover{background:#e1c394}.hero .btn{margin-top:28px}
.section{padding:130px 8%}.section.dark{background:var(--navy);color:#fff}.section-head{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:55px}.section h2,.contact h2{font-size:clamp(34px,4vw,65px);letter-spacing:-.055em;line-height:1.35;font-weight:500;margin:18px 0}.section-head p{max-width:360px;color:var(--muted);font-size:14px}.dark .section-head p{color:#b3bbc4}
.about-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:10%;align-items:center}.about-image{height:560px;position:relative}.about-image:after{content:'PLAN B LAB / 01';position:absolute;bottom:0;left:0;background:var(--gold);color:var(--deep);font-size:11px;letter-spacing:.15em;padding:18px 25px}.about-copy p{color:#69747d;font-size:15px;line-height:2.15}.stats{display:flex;gap:45px;border-top:1px solid var(--line);padding-top:25px;margin-top:35px}.stat{font-size:13px;color:var(--muted)}.stat strong{display:block;color:var(--navy);font-size:24px;letter-spacing:-.04em}
.projects{display:grid;grid-template-columns:1fr 1fr;gap:45px 24px}.project{min-width:0}.project .photo{height:430px;overflow:hidden;position:relative;background:#263441}.project:nth-child(2) .photo{height:520px}.project:nth-child(3) .photo{height:520px}.project img{transition:transform .9s var(--ease)}.project:hover img{transform:scale(1.06)}.project .meta{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid #ffffff30;padding:19px 0}.project h3{font-size:21px;font-weight:500;margin:0}.project small{color:var(--gold);font-size:10px;letter-spacing:.15em}.project .tag{position:absolute;left:20px;top:20px;background:#101e30c9;padding:7px 13px;font-size:10px;letter-spacing:.1em;color:#fff}
.services{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.service{padding:36px 28px 45px;border-right:1px solid var(--line);transition:background .3s}.service:first-child{padding-left:0}.service:last-child{border-right:0}.service:hover{background:#eeeae3}.service .num{color:#a88a5d;font-size:12px}.service h3{font-size:24px;font-weight:500;margin:44px 0 15px}.service p{font-size:13px;color:#717981;line-height:2}.service .arr{display:block;margin-top:30px;color:#a88a5d;font-size:23px}
.quote{padding:125px 8%;text-align:center;background:#eae6df}.quote h2{font-weight:400;font-size:clamp(28px,4vw,56px);line-height:1.55;letter-spacing:-.04em}.process{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.step{border-top:1px solid #b9b1a3;padding-top:20px}.step b{color:#ad8a55;font-size:12px}.step h3{font-size:21px;font-weight:500;margin:36px 0 10px}.step p{font-size:13px;color:#77808a}
.contact{background:var(--deep);color:white;padding:120px 8%;display:grid;grid-template-columns:1fr 1fr;gap:10%}.contact p{color:#aab4be;font-size:14px;line-height:2}.contact-details{margin-top:40px}.contact-details a{display:block;color:#e7e4dd;font-size:15px;margin:9px 0}.form{display:grid;gap:17px}.form label{display:grid;gap:7px;color:#c4cbd1;font-size:12px}.form input,.form textarea,.form select{background:#ffffff09;color:white;border:1px solid #ffffff30;border-radius:0;padding:14px;outline:0;width:100%}.form select option{color:#111}.form input:focus,.form textarea:focus,.form select:focus{border-color:var(--gold)}.form textarea{min-height:130px;resize:vertical}.form button{width:100%;justify-content:center}.note{font-size:11px!important;color:#88939f!important}
.footer{background:#080f19;color:#fff;padding:55px 8% 25px}.footer-grid{display:flex;justify-content:space-between;gap:30px}.footer p{font-size:12px;line-height:2;color:#9ca7b2}.footer-bottom{border-top:1px solid #ffffff24;margin-top:50px;padding-top:20px;display:flex;justify-content:space-between;color:#7e8a97;font-size:10px;letter-spacing:.09em}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s,transform .8s var(--ease)}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.section{padding:85px 6%}.about-layout,.contact{grid-template-columns:1fr;gap:40px}.about-image{height:400px}.project .photo,.project:nth-child(2) .photo,.project:nth-child(3) .photo{height:330px}.services{grid-template-columns:1fr}.service,.service:first-child{border-right:0;border-bottom:1px solid var(--line);padding:30px 0}.service h3{margin:15px 0}.process{grid-template-columns:1fr 1fr}.contact{padding:85px 6%}}
@media(max-width:640px){.nav{padding:16px 6%}.brand{font-size:18px}.menu{display:block}.navlinks{display:none;position:absolute;top:100%;left:0;right:0;background:var(--navy);padding:26px 6%;flex-direction:column;align-items:stretch;gap:22px}.navlinks.open{display:flex}.hero{min-height:690px;height:92svh}.hero-content{margin:40px 6% 0}.hero h1{font-size:clamp(45px,12vw,70px)}.hero p{font-size:13px}.hero-bottom{left:6%;right:6%}.section-head{display:block}.projects{grid-template-columns:1fr}.project .photo,.project:nth-child(2) .photo,.project:nth-child(3) .photo{height:370px}.section h2,.contact h2{font-size:37px}.quote{padding:75px 6%}.process{grid-template-columns:1fr 1fr;gap:30px 15px}.footer-grid,.footer-bottom{flex-direction:column;gap:10px}.stats{gap:25px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}