*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fafaf8;color:#2b2a28;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;font-weight:300;letter-spacing:.02em}
body.lightbox-open{overflow:hidden;overscroll-behavior:none}
a{color:inherit}
.site-header{position:sticky;top:0;z-index:20;height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:rgba(250,250,248,.96);border-bottom:1px solid #dedbd5}
.brand{color:#2b2a28;text-decoration:none;font-size:15px;letter-spacing:.045em;white-space:nowrap}
.menu-check{position:absolute;opacity:0;pointer-events:none}
.menu-toggle{border:0;background:none;color:#2b2a28;padding:8px;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center}
.menu-toggle label{cursor:pointer;display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.menu-toggle .close-label{display:none}
#menu-check:checked ~ .menu-toggle .menu-label{display:none}
#menu-check:checked ~ .menu-toggle .close-label{display:flex}
.hamburger-icon{width:24px;height:17px;display:flex;flex-direction:column;justify-content:space-between}
.hamburger-icon span{display:block;width:24px;height:1.5px;background:currentColor}
.close-icon{font-size:29px;line-height:1;font-weight:200;transform:translateY(-1px)}
.mobile-menu{position:absolute;left:0;right:0;top:64px;background:#fafaf8;border-top:1px solid #dedbd5;border-bottom:1px solid #dedbd5;display:none;flex-direction:column;align-items:center;padding:18px 20px 28px;z-index:30}
#menu-check:checked ~ .mobile-menu{display:flex}
.mobile-menu a{color:#77736d;text-decoration:none;font-size:13px;letter-spacing:.12em;padding:15px 0}
.mobile-menu a:first-child{color:#2b2a28}
main{width:90vw;max-width:1320px;margin:0 auto}
.hero{width:100%;height:auto;min-height:0;overflow:hidden;background:#fafaf8}
.hero img{width:100%;height:auto;object-fit:contain;display:block}
.section{padding:76px 0}
.about-section,.contact-section{display:grid;grid-template-columns:1fr;gap:38px;align-items:start}
.about-image img{display:block;width:100%;height:auto;object-fit:contain}
.about-copy{max-width:none}
.eyebrow{margin:0 0 22px;font-size:10px;letter-spacing:.14em;color:#77736d}
h1{margin:0 0 22px;font-size:38px;line-height:1.08;font-weight:300;letter-spacing:-.025em}
.about-lead,.about-body{font-size:15px;line-height:1.7;margin:0 0 24px}
.work-section{padding-top:24px}
.section-heading{border-top:1px solid #dedbd5;padding-top:20px;margin-bottom:34px}
.section-heading .eyebrow{margin:0}
.section-note{margin:6px 0 0;color:#77736d;font-size:10px;letter-spacing:.08em}
.work-grid{display:grid;grid-template-columns:1fr;gap:52px;align-items:start}
.work-card{margin:0}
.card-image{appearance:none;border:0;padding:0;background:none;width:100%;display:block;cursor:pointer;text-align:inherit;color:inherit}
.card-image img{width:100%;height:auto;display:block}
.work-card h2{margin:13px 0 0;font-size:11px;font-weight:400;letter-spacing:.12em}
.contact-form label{display:block;margin:0 0 24px;font-size:10px;letter-spacing:.08em;color:#77736d}
input,textarea{display:block;width:100%;margin-top:8px;padding:12px 0;border:0;border-bottom:1px solid #dedbd5;border-radius:0;background:transparent;color:#2b2a28;font:inherit;font-size:16px;outline:none}
textarea{min-height:130px;resize:vertical}
.contact-form>button{border:1px solid #2b2a28;background:#2b2a28;color:#fafaf8;padding:12px 22px;font:inherit;font-size:10px;letter-spacing:.12em}
.form-note{font-size:11px;line-height:1.6;color:#77736d;max-width:420px}
footer{display:flex;justify-content:space-between;width:90vw;margin:0 auto;padding:35px 0 calc(35px + env(safe-area-inset-bottom));font-size:9px;color:#77736d}
.instagram-link{position:fixed;right:22px;bottom:calc(22px + env(safe-area-inset-bottom));z-index:50;width:58px;height:58px;border:1px solid #d7d4ce;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(250,250,248,.98);text-decoration:none;box-shadow:0 3px 14px rgba(0,0,0,.08)}
.instagram-link svg{width:30px;height:30px}

/* JavaScript lightbox. One viewer is used for all photos. */
.lightbox{position:fixed;inset:0;z-index:1000;background:rgba(250,250,248,.985);display:none;align-items:center;justify-content:center;padding:20px 64px calc(20px + env(safe-area-inset-bottom));touch-action:none}
.lightbox.open{display:flex}
.lightbox-stage{width:100%;height:100%;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;touch-action:none;overscroll-behavior:contain;-webkit-user-select:none;user-select:none}
.lightbox-image{display:block;max-width:92vw;max-height:82vh;width:auto;height:auto;object-fit:contain;-webkit-user-drag:none;user-select:none;pointer-events:none}
.lightbox figcaption{width:min(92vw,1200px);margin-top:14px;display:flex;justify-content:space-between;gap:20px;color:#2b2a28;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.lightbox-close,.lightbox-arrow{position:fixed;z-index:1001;border:0;background:transparent;color:#2b2a28;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:inherit;font-weight:200}
.lightbox-close{top:calc(8px + env(safe-area-inset-top));right:12px;font-size:32px;width:44px;height:44px}
.lightbox-arrow{top:50%;transform:translateY(-50%);font-size:30px;width:52px;height:72px}
.lightbox-arrow.prev{left:6px}.lightbox-arrow.next{right:6px}
.lightbox-arrow.disabled,.lightbox-arrow:disabled{opacity:.18;cursor:default}

@media(min-width:721px){
  .site-header{height:82px;padding:0 7.5vw}
  .brand{font-size:clamp(20px,2vw,29px)}
  .menu-toggle{display:none}
  .mobile-menu{position:static;display:flex!important;flex-direction:row;align-items:center;padding:0;border:0;background:none;gap:clamp(18px,3vw,48px)}
  .mobile-menu a{padding:0;font-size:13px;letter-spacing:.08em}
  main{width:min(1320px,85vw)}
  .hero{height:calc(100vh - 82px);min-height:620px}
  .section{padding:150px 0}
  .about-section,.contact-section{grid-template-columns:minmax(280px,1fr) minmax(280px,.8fr);gap:clamp(50px,9vw,150px);align-items:center}
  .about-copy{max-width:430px}
  .work-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:3.5vw;row-gap:90px}
  footer{width:min(1320px,85vw)}
}

@media(max-width:720px){
  .site-header{height:64px;position:sticky;top:0}
  .hero{height:auto!important;min-height:0!important}
  .hero img{height:auto!important;width:100%!important;object-fit:contain!important}
  .menu-toggle{display:flex}
  .mobile-menu{top:64px}
  .instagram-link{width:58px;height:58px;right:20px;bottom:calc(20px + env(safe-area-inset-bottom))}
  .lightbox{padding:calc(18px + env(safe-area-inset-top)) 18px calc(18px + env(safe-area-inset-bottom))}
  .lightbox-stage{width:100vw;height:100%;padding:0 22px}
  .lightbox-image{max-width:calc(100vw - 44px);max-height:78vh}
  .lightbox figcaption{width:calc(100vw - 44px);font-size:9px}
  .lightbox-arrow{font-size:24px;width:36px;height:60px}
  .lightbox-arrow.prev{left:0}.lightbox-arrow.next{right:0}
  .lightbox-close{right:6px}
}

/* Contact */
.contact-email{align-self:center}
.contact-email a{font-size:clamp(18px,2.2vw,30px);font-weight:300;letter-spacing:-.01em;text-decoration:none;border-bottom:1px solid #bdb9b2;padding-bottom:5px}
.contact-email a:hover{border-bottom-color:#2b2a28}
@media(max-width:720px){.contact-email{align-self:start}.contact-email a{font-size:20px}}
