:root { --ink:#292720; --paper:#f5f0e7; --cream:#fffaf1; --terracotta:#a94d35; --rust:#783322; --gold:#dfa72e; --sage:#5e6954; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; }
button { font:inherit; }
.site-header { height:92px; padding:0 clamp(24px,5vw,76px); display:flex; align-items:center; justify-content:space-between; background:rgba(245,240,231,.96); position:sticky; top:0; z-index:100; box-shadow:0 1px 0 rgba(41,39,32,.08); backdrop-filter:blur(12px); }
.brand { display:flex; align-items:center; gap:12px; }
.brand-mark { width:46px; height:46px; border-radius:50% 50% 46% 54%; display:grid; place-items:center; color:var(--cream); background:var(--terracotta); font:italic 700 28px Georgia,serif; transform:rotate(-5deg); }
.brand-text { display:flex; flex-direction:column; text-transform:uppercase; letter-spacing:.08em; font-size:10px; line-height:1.4; }
.brand-text strong { font-size:13px; letter-spacing:.03em; }
nav { display:flex; gap:clamp(18px,3vw,44px); font-size:13px; font-weight:700; }
nav a { position:relative; padding:10px 0; }
nav a:after { content:""; position:absolute; left:0; right:100%; bottom:4px; height:2px; background:var(--terracotta); transition:.25s; }
nav a:hover:after { right:0; }
.language { display:flex; align-items:center; gap:5px; font-size:12px; }
.language button { border:0; background:none; padding:6px 3px; cursor:pointer; opacity:.45; font-weight:700; }
.language button.active { opacity:1; color:var(--terracotta); }
.header-actions { display:flex; align-items:center; gap:20px; }
.menu-toggle { width:44px; height:44px; padding:10px; border:0; background:transparent; display:none; flex-direction:column; align-items:center; justify-content:center; gap:5px; cursor:pointer; }
.menu-toggle span { width:23px; height:2px; background:var(--ink); transition:transform .25s, opacity .2s; transform-origin:center; }
.menu-toggle.is-open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.menu-toggle.is-open span:nth-child(2) { opacity:0; }
.menu-toggle.is-open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.hero { min-height:calc(100vh - 92px); display:grid; grid-template-columns:.88fr 1.12fr; background:var(--cream); }
.hero-content { padding:clamp(70px,10vw,150px) clamp(32px,6.5vw,104px); display:flex; flex-direction:column; justify-content:center; }
.eyebrow,.section-kicker { text-transform:uppercase; letter-spacing:.2em; font-size:11px; font-weight:800; color:var(--terracotta); }
h1,h2,blockquote { font-family:Georgia,"Times New Roman",serif; font-weight:400; }
h1 { margin:22px 0 24px; font-size:clamp(52px,6.2vw,100px); line-height:.93; letter-spacing:-.045em; }
h1 em { color:var(--terracotta); font-weight:400; }
.hero-lead { max-width:590px; margin:0 0 38px; font-size:clamp(17px,1.4vw,21px); line-height:1.65; color:#5b574d; }
.button { width:fit-content; display:flex; align-items:center; gap:28px; padding:16px 20px 16px 24px; background:var(--terracotta); color:white; font-size:13px; font-weight:700; border-radius:2px; transition:.2s; }
.button span { font-size:17px; }
.button:hover { background:var(--rust); transform:translateY(-2px); }
.hero-photo-wrap { min-height:620px; position:relative; overflow:hidden; }
.hero-photo { height:100%; object-fit:cover; object-position:56% center; filter:saturate(.8) contrast(.97); }
.hero-photo-wrap:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(56,31,20,.05),transparent 40%,rgba(20,15,10,.12)); }
.hero-stamp { position:absolute; z-index:2; left:-57px; top:52%; width:116px; height:116px; border-radius:50%; background:var(--gold); display:flex; flex-direction:column; justify-content:center; align-items:center; color:var(--ink); transform:rotate(-8deg); }
.hero-stamp span { font:italic 700 34px Georgia,serif; }
.hero-stamp small { font-size:6px; letter-spacing:.08em; }
.photo-note { position:absolute; z-index:2; bottom:24px; right:28px; margin:0; color:white; text-transform:uppercase; letter-spacing:.16em; font-size:9px; font-weight:700; }
.section { padding:clamp(80px,10vw,150px) clamp(24px,7vw,110px); }
.intro { display:grid; grid-template-columns:1fr 1fr; gap:10vw; background:var(--paper); }
h2 { margin:18px 0 0; font-size:clamp(42px,5vw,76px); line-height:1.04; letter-spacing:-.035em; }
.intro-copy { padding-top:28px; font-size:17px; line-height:1.85; color:#5b574d; }
.intro-copy p { margin:0 0 22px; }
.work { background:var(--terracotta); color:var(--cream); }
.work .section-kicker { color:#f3c65f; }
.section-heading { max-width:850px; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:80px; background:rgba(255,255,255,.25); border-top:1px solid rgba(255,255,255,.25); border-bottom:1px solid rgba(255,255,255,.25); }
.work-card { padding:38px 36px 42px; background:var(--terracotta); min-height:310px; }
.work-card>span { font:italic 20px Georgia,serif; color:#f3c65f; }
.work-card h3 { max-width:270px; margin:54px 0 16px; font:400 29px/1.1 Georgia,serif; }
.work-card p { margin:0; color:#f1dbd4; line-height:1.7; font-size:15px; }
.community { display:grid; grid-template-columns:.8fr 1.2fr; gap:8vw; align-items:center; background:var(--cream); }
.community-copy>p:last-child { max-width:520px; margin-top:30px; line-height:1.85; color:#5b574d; font-size:17px; }
.community-image { position:relative; }
.community-image:before { content:""; position:absolute; width:45%; height:30%; background:var(--gold); left:-22px; bottom:-22px; }
.community-image img { position:relative; aspect-ratio:1.26; object-fit:cover; object-position:center; }
.gallery { padding-top:0; display:grid; grid-template-columns:1.1fr 1fr 1fr; grid-template-rows:280px 280px; gap:12px; background:var(--cream); }
.gallery figure { margin:0; overflow:hidden; }
.gallery figure:first-child { grid-row:1/3; }
.gallery figure:nth-child(2) { grid-column:2/4; }
.gallery img { height:100%; object-fit:cover; transition:transform .5s; }
.gallery figure:hover img { transform:scale(1.025); }
.statement { display:flex; align-items:center; justify-content:space-between; gap:60px; background:var(--paper); }
blockquote { margin:0; max-width:1080px; font-size:clamp(34px,4.5vw,68px); line-height:1.15; color:var(--rust); }
.statement-mark { flex:0 0 110px; height:110px; border-radius:50%; background:var(--gold); display:grid; place-items:center; font:italic 700 60px Georgia,serif; transform:rotate(7deg); }
.contact { display:grid; grid-template-columns:1fr 1fr; gap:10vw; background:var(--ink); color:var(--cream); }
.contact .section-kicker { color:#f3c65f; }
.contact-intro>p:not(.section-kicker) { max-width:550px; margin:28px 0 32px; color:#d3cec3; line-height:1.7; font-size:17px; }
.button-light { background:var(--cream); color:var(--ink); }
.button-light:hover { background:var(--gold); }
.contact-details { border-top:1px solid #57534a; }
.contact-details>div { padding:26px 0; border-bottom:1px solid #57534a; display:grid; grid-template-columns:145px 1fr; gap:24px; }
.contact-details span { text-transform:uppercase; letter-spacing:.16em; font-size:9px; color:#aaa59c; padding-top:5px; }
.contact-details p,.contact-details a { margin:0; line-height:1.7; }
.contact-details a:hover { color:#f3c65f; }
footer { min-height:150px; padding:38px clamp(24px,7vw,110px); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:30px; background:#1e1c18; color:#d8d1c5; }
.brand-footer .brand-mark { width:40px; height:40px; font-size:24px; }
footer>p { text-transform:uppercase; letter-spacing:.2em; font-size:10px; }
footer small { justify-self:end; text-align:right; font-size:10px; color:#8f8a82; }
@media(max-width:900px){
  .site-header { height:78px; }
  .menu-toggle { display:flex; }
  nav { position:absolute; top:100%; left:0; width:100%; padding:8px 24px 24px; display:flex; flex-direction:column; gap:0; background:var(--paper); border-top:1px solid rgba(41,39,32,.08); box-shadow:0 16px 26px rgba(41,39,32,.12); opacity:0; visibility:hidden; transform:translateY(-8px); transition:opacity .2s, transform .2s, visibility .2s; }
  nav.menu-open { opacity:1; visibility:visible; transform:translateY(0); }
  nav a { padding:15px 0; border-bottom:1px solid rgba(41,39,32,.1); font-size:15px; }
  nav a:after { display:none; }
  .hero { grid-template-columns:1fr; }
  .hero-content { min-height:570px; }
  .hero-photo-wrap { min-height:520px; }
  .hero-stamp { left:auto; right:22px; top:-58px; }
  .intro,.community,.contact { grid-template-columns:1fr; gap:52px; }
  .cards { grid-template-columns:1fr; margin-top:50px; }
  .work-card { min-height:0; }
  .work-card h3 { margin-top:28px; }
  .gallery { grid-template-columns:1fr 1fr; grid-template-rows:420px 240px 240px; }
  .gallery figure:first-child { grid-column:1/3; grid-row:auto; }
  .gallery figure:nth-child(2) { grid-column:1/3; }
  footer { grid-template-columns:1fr; text-align:center; }
  footer .brand { justify-content:center; } footer small { justify-self:center; text-align:center; }
}
@media(max-width:560px){
  .site-header { padding:0 18px; }
  .brand-mark { width:40px; height:40px; font-size:24px; }
  .brand-text { display:none; }
  .header-actions { gap:10px; }
  .hero-content { min-height:540px; padding:72px 24px; }
  h1 { font-size:52px; }
  .hero-photo-wrap { min-height:410px; }
  .hero-photo { object-position:61% center; }
  .section { padding:76px 24px; }
  h2 { font-size:43px; }
  .work-card { padding:32px 24px; }
  .community-image:before { left:-10px; bottom:-10px; }
  .gallery { padding-top:0; grid-template-columns:1fr; grid-template-rows:360px repeat(3,260px); }
  .gallery figure:first-child,.gallery figure:nth-child(2) { grid-column:auto; }
  .statement { align-items:flex-start; flex-direction:column; }
  .statement-mark { width:76px; height:76px; flex-basis:76px; font-size:40px; }
  .contact-details>div { grid-template-columns:1fr; gap:8px; }
}
@media(prefers-reduced-motion:reduce){ html{scroll-behavior:auto}.button,.gallery img{transition:none} }