/* C1 — ARCHITECT STUDIO: Sidebar + Cinematic + Masonry */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:#F5F0EB;color:#2C1810;overflow-x:hidden}
a{color:inherit;text-decoration:none}img{display:block;width:100%}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:.65rem;letter-spacing:.3em;text-transform:uppercase;color:#C0392B}
em{font-family:'Playfair Display',serif;font-style:italic;color:#C0392B}

/* SIDEBAR */
.sidebar{position:fixed;top:0;left:0;width:80px;height:100vh;background:#2C1810;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:2rem 0;z-index:100}
.sidebar-logo{font-family:'Playfair Display',serif;font-size:1.5rem;font-weight:700;color:#fff}
.sidebar-logo span{color:#C0392B}
.sidebar-links{display:flex;flex-direction:column;gap:1.5rem;writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg)}
.sidebar-links a{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.4);transition:color .3s}
.sidebar-links a:hover{color:#C0392B}
.sidebar-social{display:flex;flex-direction:column;gap:1rem}
.sidebar-social a{font-size:.55rem;letter-spacing:.15em;color:rgba(255,255,255,.3);transition:color .3s}
.sidebar-social a:hover{color:#fff}

/* HERO */
.hero{position:relative;height:100vh;margin-left:80px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.hero-img{position:absolute;top:0;left:0;width:100%;height:120%;background-size:cover;background-position:center}
.hero-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,rgba(44,24,16,.3),rgba(44,24,16,.7))}
.hero-content{position:relative;z-index:2;text-align:center;color:#fff}
.hero-content h1{font-family:'Playfair Display',serif;font-size:clamp(5rem,12vw,12rem);line-height:.85;font-weight:700}
.hero-content h1 em{color:#C0392B;-webkit-text-stroke:1px #C0392B;-webkit-text-fill-color:transparent;font-size:1.1em}
.hero-eyebrow{font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.5em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:2rem}
.hero-sub{font-size:1.1rem;margin-top:1.5rem;font-weight:300;color:rgba(255,255,255,.7)}
.hero-scroll-hint{position:absolute;bottom:3rem;left:50%;transform:translateX(-50%);font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.2em;color:rgba(255,255,255,.4);animation:bounce 2s ease infinite;z-index:2}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(8px)}}

/* ABOUT */
.about{margin-left:80px;display:grid;grid-template-columns:1fr 1fr;min-height:80vh;align-items:center}
.about-image{overflow:hidden;height:100%}
.about-image img{width:100%;height:100%;object-fit:cover}
.about-text{padding:6rem 5rem}
.about-text h2{font-family:'Playfair Display',serif;font-size:clamp(2rem,4vw,3.5rem);line-height:1.2;margin:1.5rem 0}
.about-text p{font-size:.95rem;line-height:1.9;color:#6B5344;margin-bottom:2rem}
.about-stats{display:flex;gap:3rem}
.astat{text-align:center}
.astat strong{font-family:'Playfair Display',serif;font-size:2.5rem;color:#C0392B;display:block}
.astat span{font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:#A89888}

/* PROJECTS */
.projects{margin-left:80px;padding:8rem 4rem}
.projects-head{margin-bottom:4rem}
.projects-head h2{font-family:'Playfair Display',serif;font-size:clamp(2.5rem,5vw,4rem);line-height:1.1;margin-top:1rem}
.masonry{columns:3;column-gap:1.5rem}
.masonry-item{break-inside:avoid;margin-bottom:1.5rem;position:relative;overflow:hidden;border-radius:8px;cursor:pointer}
.masonry-item.tall{aspect-ratio:auto}
.masonry-item.tall img{min-height:500px;object-fit:cover}
.masonry-item img{width:100%;display:block;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.masonry-item:hover img{transform:scale(1.06)}
.mi-info{position:absolute;bottom:0;left:0;right:0;padding:1.5rem;background:linear-gradient(to top,rgba(44,24,16,.8),transparent);color:#fff;transform:translateY(100%);transition:transform .5s cubic-bezier(.16,1,.3,1)}
.masonry-item:hover .mi-info{transform:translateY(0)}
.mi-info span{font-family:'JetBrains Mono',monospace;font-size:.55rem;letter-spacing:.2em;color:#E67E22}
.mi-info h3{font-family:'Playfair Display',serif;font-size:1.3rem;margin-top:.3rem}

/* SERVICES */
.services{margin-left:80px;padding:8rem 4rem;background:#FFF9F4}
.services h2{font-family:'Playfair Display',serif;font-size:clamp(2.5rem,5vw,4rem);margin:1rem 0 3rem}
.service-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(44,24,16,.06)}
.scard{background:#FFF9F4;padding:3rem 2.5rem;transition:background .5s}
.scard:hover{background:#F5F0EB}
.scard-num{font-family:'Playfair Display',serif;font-size:3.5rem;font-weight:700;-webkit-text-stroke:1px #A89888;-webkit-text-fill-color:transparent;margin-bottom:1.5rem;transition:-webkit-text-stroke-color .3s}
.scard:hover .scard-num{-webkit-text-stroke-color:#C0392B}
.scard h3{font-family:'Playfair Display',serif;font-size:1.2rem;margin-bottom:.8rem}
.scard p{font-size:.82rem;line-height:1.8;color:#6B5344}

/* CONTACT */
.contact{margin-left:80px;display:grid;grid-template-columns:1fr 1fr;min-height:60vh;background:#2C1810;color:#fff}
.contact-left{padding:6rem 5rem;display:flex;flex-direction:column;justify-content:center}
.contact-left .eyebrow{color:#E67E22}
.contact-left h2{font-family:'Playfair Display',serif;font-size:clamp(2rem,4vw,3.5rem);margin:1rem 0 2rem;line-height:1.2}
.contact-left em{color:#E67E22}
.contact-info p{font-size:.85rem;line-height:1.8;color:rgba(255,255,255,.5);margin-bottom:1rem}
.contact-info strong{color:rgba(255,255,255,.8);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;display:block;margin-bottom:.3rem}
.contact-form{padding:6rem 5rem;display:flex;flex-direction:column;gap:1.5rem;justify-content:center;background:rgba(255,255,255,.03)}
.contact-form input,.contact-form textarea{background:none;border:none;border-bottom:1px solid rgba(255,255,255,.15);color:#fff;font-family:'Inter',sans-serif;font-size:.9rem;padding:1rem 0;outline:none;transition:border-color .3s}
.contact-form input:focus,.contact-form textarea:focus{border-color:#C0392B}
.contact-form textarea{min-height:100px;resize:none}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:rgba(255,255,255,.25)}
.contact-form button{align-self:flex-start;background:none;border:1px solid #C0392B;color:#C0392B;padding:1rem 2.5rem;font-family:'JetBrains Mono',monospace;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;transition:background .3s,color .3s}
.contact-form button:hover{background:#C0392B;color:#fff}

footer{margin-left:80px;padding:2rem 4rem;text-align:center;font-size:.7rem;color:#A89888;border-top:1px solid rgba(44,24,16,.06)}

@media(max-width:1024px){.service-cards{grid-template-columns:1fr 1fr}.masonry{columns:2}}
@media(max-width:768px){.sidebar{display:none}.hero,.about,.projects,.services,.contact,footer{margin-left:0}.about,.contact{grid-template-columns:1fr}.about-text{padding:4rem 1.5rem}.masonry{columns:1}.service-cards{grid-template-columns:1fr}.projects{padding:4rem 1.5rem}.services{padding:4rem 1.5rem}.contact-left,.contact-form{padding:3rem 1.5rem}footer{padding:2rem 1.5rem}}