
:root{
  --paper:#f2f0eb;
  --paper2:#e9e6df;
  --ink:#171714;
  --muted:#6f6d67;
  --line:#cfcbc2;
  --warm:#a88d73;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Manrope","Helvetica Neue",Arial,sans-serif;font-weight:300}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;object-fit:cover}
.header{
  position:fixed;z-index:50;top:0;left:0;right:0;
  display:flex;align-items:flex-start;justify-content:space-between;
  padding:24px 34px;color:white;mix-blend-mode:difference;
}
.brand{display:flex;flex-direction:column;align-items:flex-start;line-height:1}
.brand strong,.footer-brand strong{font-weight:400;font-size:21px;letter-spacing:.22em}
.brand span,.footer-brand span{font-size:7px;letter-spacing:.32em;margin-top:5px}
.brand small,.footer-brand small{font-size:6px;letter-spacing:.42em;margin-top:6px}
.nav{display:flex;gap:34px;font-size:9px;text-transform:uppercase;letter-spacing:.16em}
.menu{display:none;background:none;border:0;color:inherit;font:inherit;font-size:9px;letter-spacing:.15em}
.hero{height:100svh;min-height:660px;position:relative;background:#1d1c19;color:white;overflow:hidden}
.hero img{height:100%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,9,.66),rgba(10,10,9,.08) 58%,rgba(10,10,9,.08))}
.hero-copy{position:absolute;left:7vw;top:50%;transform:translateY(-47%);max-width:540px}
.eyebrow{text-transform:uppercase;font-size:8px;letter-spacing:.2em;font-weight:500;margin:0 0 26px}
.hero h1,.section h2,.statement h2,.contact h2{font-weight:300;letter-spacing:-.045em;line-height:.96;margin:0}
.hero h1{font-size:clamp(60px,8vw,118px)}
.intro{font-size:13px;line-height:1.75;max-width:500px;color:rgba(255,255,255,.78);margin:34px 0 28px}
.line-link{display:inline-flex;gap:24px;border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:7px;font-size:9px;text-transform:uppercase;letter-spacing:.16em}
.section{padding:115px 4vw}
.light{background:var(--paper)}
.section-title{margin-bottom:58px}
.section-title h2,.statement h2,.contact h2{font-size:clamp(43px,5.5vw,78px)}
.section-title-inline{display:grid;grid-template-columns:1.4fr .6fr;gap:8vw;align-items:end}
.section-title-inline>p{font-size:13px;line-height:1.75;color:var(--muted);max-width:440px;margin:0 0 6px}
.collection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.collection-card img{height:30vw;min-height:330px;max-height:510px}
.card-line{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:16px 0 14px}
.card-line h3{font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:400;margin:0}
.collection-card p{font-size:10px;line-height:1.6;color:var(--muted);max-width:280px}
.projects{background:#e7e4de}
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.project img{height:37vw;max-height:560px;min-height:360px}
.project-meta{display:grid;grid-template-columns:28px 1fr auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.project-meta span,.project-meta p{font-size:8px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin:0}
.project-meta h3{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:400;margin:0}
.materials{padding-bottom:80px}
.swatches{display:grid;grid-template-columns:repeat(8,1fr);gap:12px}
.swatch{display:block;height:120px}
.swatches p{font-size:8px;text-transform:uppercase;letter-spacing:.12em;text-align:center}
.travertine{background:linear-gradient(8deg,#b9ac99 0 21%,#d8cfbf 21% 24%,#aa9c89 24% 49%,#e6ddd0 49% 52%,#b0a38e 52%)}
.limestone{background:linear-gradient(145deg,#c9bea9,#e5ddce 37%,#b9ad99 39%,#d8ccb7)}
.marble{background:linear-gradient(120deg,#1d1e1c,#363431 31%,#a28f80 32%,#20211f 34%,#5b554f 61%,#a38f80 62%,#2a2a27)}
.onyx{background:linear-gradient(110deg,#c9975e,#f0d09a 22%,#a87648 24%,#e7bd79 48%,#f2dcaf 63%,#a76f41 66%,#d6aa69)}
.porcelain{background:linear-gradient(130deg,#55514c,#918a83 37%,#44413d 38%,#7b756e 71%,#504e4a)}
.brass{background:linear-gradient(90deg,#8d704f,#c5a878 45%,#75553a)}
.bronze{background:linear-gradient(90deg,#624531,#9b6d4f 45%,#51382c)}
.glass{background:linear-gradient(90deg,#dfe4e1,#9ba7a4,#edf0ed);border:1px solid #d0d3d0}
.statement{display:grid;grid-template-columns:1.15fr .85fr;background:#1b1b18;color:white}
.statement>img{height:100%;min-height:690px}
.statement-copy{padding:110px 6vw;align-self:center}
.statement-copy h2{margin-bottom:50px}
.cap-list{border-top:1px solid rgba(255,255,255,.18)}
.cap-list div{display:grid;grid-template-columns:48px 1fr;border-bottom:1px solid rgba(255,255,255,.18);padding:18px 0}
.cap-list span{font-size:8px;color:#928d86}
.cap-list p{margin:0;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.studio-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:9vw}
.studio-grid h2{font-size:clamp(38px,4.6vw,68px)}
.studio-copy p{font-size:13px;line-height:1.8;color:var(--muted);margin-top:0}
.process{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);margin-top:90px}
.process div{padding:22px 0;border-right:1px solid var(--line)}
.process div+div{padding-left:24px}
.process span{font-size:8px;color:var(--muted)}
.process h3{font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:400;margin:18px 0 0}
.contact{background:#ded9cf;padding:110px 4vw 28px}
.contact-head{min-height:54vh}
.contact-email{display:inline-flex;gap:25px;margin-top:42px;border-bottom:1px solid var(--ink);padding-bottom:8px;font-size:15px}
.footer{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:6vw;border-top:1px solid #bcb6ac;padding-top:38px}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start}
.footer-label{font-size:8px;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin:0 0 14px}
.footer-block,.footer-block a,.footer-block address{font-size:10px;line-height:1.8;font-style:normal}
.footer-block{display:flex;flex-direction:column}
.footer-bottom{grid-column:1/-1;border-top:1px solid #bcb6ac;margin-top:22px;padding-top:18px;display:flex;justify-content:space-between;font-size:8px;text-transform:uppercase;letter-spacing:.12em}
@media(max-width:900px){
  .header{padding:18px 20px}.nav{display:none}.menu{display:block}
  .hero-copy{left:20px;right:20px;max-width:none}
  .section{padding:85px 20px}
  .collection-grid{grid-template-columns:1fr 1fr}
  .collection-card img{height:56vw}
  .project-grid{grid-template-columns:1fr}
  .project img{height:64vw}
  .swatches{grid-template-columns:repeat(4,1fr)}
  .statement{grid-template-columns:1fr}
  .statement>img{min-height:460px;height:62vw}
  .statement-copy{padding:80px 20px}
  .section-title-inline,.studio-grid{grid-template-columns:1fr}
  .footer{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
}
@media(max-width:600px){
  .hero h1{font-size:15vw}
  .hero-shade{background:linear-gradient(90deg,rgba(10,10,9,.78),rgba(10,10,9,.28))}
  .collection-grid{grid-template-columns:1fr}
  .collection-card img{height:86vw}
  .swatches{grid-template-columns:repeat(2,1fr)}
  .swatch{height:140px}
  .process{grid-template-columns:1fr 1fr}
  .footer{grid-template-columns:1fr}
  .footer-brand{grid-column:auto}
  .footer-bottom{display:block}
  .footer-bottom span{display:block;margin-top:7px}
}
