:root{
  --bg:#fbf8f4;
  --ink:#26211e;
  --muted:#756a64;
  --line:#ded4cd;
  --soft:#f2ebe5;
  --serif:Georgia,"Times New Roman",serif;
  --sans:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--serif)}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.site-header{
  position:sticky;
  top:0;
  z-index:10;
  min-height:74px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:18px clamp(18px,5vw,66px);
  background:rgba(251,248,244,.9);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.menu-word{
  justify-self:start;
  border:0;
  background:transparent;
  font-family:var(--serif);
  font-size:18px;
  color:var(--ink);
  padding:0;
}
.brand img{width:54px;height:54px;border-radius:50%;object-fit:cover}
.nav-left{justify-self:end;display:flex;gap:26px;font-family:var(--serif);font-size:18px}
.intro{
  width:min(920px,calc(100% - 36px));
  margin:auto;
  padding:clamp(62px,10vw,124px) 0 clamp(44px,8vw,90px);
  text-align:center;
}
.intro-logo{width:92px;height:92px;margin:0 auto 24px;border-radius:50%;object-fit:cover}
h1,h2,h3,p{margin-top:0}
h1{
  margin-bottom:6px;
  font-size:clamp(50px,9vw,108px);
  font-weight:400;
  line-height:.92;
  letter-spacing:-.045em;
}
.intro h2{
  margin-bottom:34px;
  color:var(--muted);
  font-size:clamp(22px,3vw,34px);
  font-weight:400;
  line-height:1.1;
}
.intro p{
  max-width:760px;
  margin:0 auto 34px;
  color:var(--muted);
  font-size:clamp(18px,2.3vw,27px);
  line-height:1.42;
}
.cta-row{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.cta-row a,.contact-actions a{
  min-width:132px;
  padding:13px 19px;
  border:1px solid var(--ink);
  border-radius:0;
  font-family:var(--sans);
  font-size:11px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.cta-row a:first-child,.contact-actions a:first-child{background:var(--ink);color:white}
.image-grid{
  width:min(1260px,calc(100% - 28px));
  margin:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  padding-bottom:clamp(54px,8vw,96px);
  border-bottom:1px solid var(--line);
}
figure{margin:0;position:relative;background:var(--soft);overflow:hidden}
.image-grid figure:nth-child(1){grid-row:span 2}
.image-grid figure:nth-child(2){grid-column:span 2}
.image-grid img{width:100%;height:100%;min-height:430px;object-fit:cover}
.image-grid figure:nth-child(1) img{min-height:874px}
figcaption{
  position:absolute;
  left:0;
  bottom:0;
  padding:12px 14px;
  background:rgba(251,248,244,.86);
  font-family:var(--sans);
  font-size:11px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.statement,.services,.process,.contact{
  width:min(920px,calc(100% - 36px));
  margin:auto;
  padding:clamp(58px,9vw,108px) 0;
  text-align:center;
}
.statement p{
  margin:0 auto;
  color:var(--ink);
  font-size:clamp(26px,4.6vw,52px);
  line-height:1.08;
  letter-spacing:-.04em;
}
.services h2,.process h2,.contact h2{
  margin-bottom:34px;
  font-size:clamp(42px,7vw,82px);
  font-weight:400;
  line-height:.95;
  letter-spacing:-.045em;
}
.service-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  border-top:1px solid var(--line);
}
.service-list article{
  padding:34px 26px;
  border-bottom:1px solid var(--line);
}
.service-list article:nth-child(odd){border-right:1px solid var(--line)}
.service-list h3{
  margin-bottom:12px;
  font-size:28px;
  font-weight:400;
}
.service-list p{
  max-width:360px;
  margin:0 auto 18px;
  color:var(--muted);
  font-size:17px;
  line-height:1.46;
}
.service-list span{
  font-family:var(--sans);
  font-size:11px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.image-row{
  width:min(1260px,calc(100% - 28px));
  margin:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.image-row img{width:100%;height:620px;object-fit:cover}
.process{
  border-bottom:1px solid var(--line);
}
.process p{
  max-width:760px;
  margin:0 auto 18px;
  color:var(--muted);
  font-size:clamp(18px,2.2vw,25px);
  line-height:1.42;
}
.process .policy{
  font-family:var(--sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink);
}
.contact p{
  color:var(--muted);
  font-size:clamp(18px,2.2vw,25px);
}
.contact-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:28px 0}
.details{font-family:var(--serif);line-height:1.55}
footer{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  padding:28px;
  color:var(--muted);
  font-size:15px;
  border-top:1px solid var(--line);
}
footer img{width:44px;height:44px;border-radius:50%;object-fit:cover}
@media(max-width:860px){
  .site-header{grid-template-columns:auto 1fr auto}
  .brand{justify-self:center}
  .nav-left{display:none}
  .image-grid{grid-template-columns:1fr}
  .image-grid figure:nth-child(1),.image-grid figure:nth-child(2){grid-row:auto;grid-column:auto}
  .image-grid img,.image-grid figure:nth-child(1) img{min-height:430px;height:430px}
  .service-list{grid-template-columns:1fr}
  .service-list article:nth-child(odd){border-right:0}
  .image-row{grid-template-columns:1fr}
  .image-row img{height:430px}
  footer{display:block;text-align:center}
  footer img{margin:0 auto 10px}
}


/* Contact icon links */
.icon-actions {
  gap: 14px;
  align-items: center;
}

.icon-actions a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: auto;
  padding: 13px 18px;
}

.icon-actions .icon,
.footer-social span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  font-size: 16px;
  line-height: 1;
}

.footer-social {
  display: flex;
  align-items: center;
  gap: 16px;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.footer-social a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  text-decoration: none;
  margin: 0;
}

@media(max-width:860px){
  .icon-actions {
    flex-direction: column;
  }
  .icon-actions a {
    width: 100%;
    justify-content: center;
  }
  .footer-social {
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 12px;
  }
}


/* Luxury typography update */
h1 {
  font-family: Didot, "Bodoni 72", "Bodoni 72 Smallcaps", "Times New Roman", serif;
  font-weight: 300;
  letter-spacing: -0.065em;
}

.intro h1 {
  font-weight: 300;
  font-size: clamp(44px, 8vw, 94px);
  letter-spacing: -0.055em;
}

h2 {
  font-family: Didot, "Bodoni 72", "Times New Roman", serif;
  font-weight: 300;
  letter-spacing: -0.045em;
}

.site-header {
  position: sticky;
}

.menu-word {
  cursor: pointer;
  transition: opacity .2s ease;
}

.menu-word:hover {
  opacity: .55;
}

/* Functional menu */
.menu-panel {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-content: center;
  gap: 18px;
  padding: 32px;
  background: rgba(251, 248, 244, .96);
  backdrop-filter: blur(18px);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px);
  transition: opacity .28s ease, transform .28s ease;
  text-align: center;
}

body.menu-open .menu-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.menu-panel > a {
  font-family: Didot, "Bodoni 72", "Times New Roman", serif;
  font-size: clamp(38px, 7vw, 82px);
  line-height: .95;
  letter-spacing: -0.045em;
  text-decoration: none;
  color: var(--ink);
}

.menu-panel > a:hover {
  color: #9d665f;
}

.menu-close {
  position: fixed;
  top: 24px;
  right: 32px;
  border: 0;
  background: transparent;
  font-family: var(--serif);
  font-size: 18px;
  color: var(--ink);
  cursor: pointer;
}

.menu-contact {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 20px;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.menu-contact a {
  padding: 12px 16px;
  border: 1px solid var(--ink);
  text-decoration: none;
}

.menu-contact a:first-child {
  background: var(--ink);
  color: white;
}

@media(max-width:860px){
  .intro h1 {
    font-size: clamp(40px, 13vw, 72px);
  }
  .menu-close {
    top: 18px;
    right: 20px;
  }
  .menu-contact {
    flex-direction: column;
  }
}


/* Make brand title truly thin and luxury */
.intro .brand-title {
  font-family: "Times New Roman", Georgia, serif !important;
  font-weight: 100 !important;
  font-size: clamp(30px, 5.5vw, 58px) !important;
  line-height: 1.05 !important;
  letter-spacing: .035em !important;
  text-transform: uppercase !important;
  margin-bottom: 16px !important;
  opacity: .82;
}

.intro .studio-title {
  font-family: "Times New Roman", Georgia, serif !important;
  font-weight: 300 !important;
  font-size: clamp(28px, 5.2vw, 64px) !important;
  line-height: 1 !important;
  letter-spacing: -0.035em !important;
  margin-bottom: 34px !important;
  color: var(--ink) !important;
}

@media(max-width:860px){
  .intro .brand-title {
    font-size: clamp(26px, 9vw, 42px) !important;
    letter-spacing: .045em !important;
  }
  .intro .studio-title {
    font-size: clamp(30px, 10vw, 54px) !important;
  }
}


.instagram-note {
  width: min(920px, calc(100% - 36px));
  margin: 0 auto;
  padding: 34px 0 10px;
  text-align: center;
}

.instagram-note p {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1.35;
}

.instagram-note a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 13px 19px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: white;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
}

@media(max-width:860px){
  .instagram-note a {
    width: 100%;
  }
}