/* V19: original cascade order retained. */
:root {
  --cream:#F3F0EA;
  --paper:#F7F5F0;
  --coal:#222321;
  --green:#35483C;
  --beige:#D6C5AB;
  --sans:'Instrument Sans',Arial,sans-serif;
  --serif:'Newsreader',Georgia,serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  background:var(--cream);
  color:var(--coal);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased
}
button,input,textarea,select {
  font:inherit
}
a {
  color:inherit
}
button {
  cursor:pointer
}
.wrap {
  width:min(1160px,calc(100% - 88px));
  margin:auto
}
.top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  min-height:108px
}
.brand {
  display:flex;
  flex-direction:column;
  text-decoration:none;
  font-size:18px;
  letter-spacing:.15em;
  font-weight:600;
  line-height:1.4
}
.brand small {
  font-weight:400;
  letter-spacing:.12em;
  font-size:10px;
  margin-top:4px;
  opacity:.7
}
.nav {
  display:flex;
  gap:36px;
  align-items:center
}
.nav a {
  text-decoration:none;
  font-size:11px;
  letter-spacing:.13em;
  text-transform:uppercase;
  font-weight:600
}
.nav a:hover {
  opacity:.6
}
.hero {
  padding-bottom:103px
}
.hero-main {
  text-align:center;
  padding:116px 0 104px
}
.hero h1 {
  margin:34px auto 0;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(48px,7.6vw,108px);
  line-height:.99;
  letter-spacing:-.049em;
  max-width:1150px
}
.hero h1 span {
  display:block
}
.hero h1 em {
  display:block;
  font-weight:400;
  font-style:italic;
  color:var(--green);
  letter-spacing:-.055em;
  font-size:.90em;
  line-height:1.07;
  margin-top:18px
}
.underhero {
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:10px;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:#88867d
}
.down {
  border-bottom:1px solid currentColor;
  padding-bottom:8px;
  text-decoration:none
}
.video {
  background:var(--coal);
  color:var(--paper);
  padding:119px 0 123px
}
.section-label {
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-weight:600;
  opacity:.65;
  margin:0 0 34px
}
.working {
  padding:152px 0 168px
}
.work-grid {
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  gap:clamp(65px,9vw,140px);
  align-items:center
}
.portrait {
  display:block;
  width:100%;
  height:auto;
  box-shadow:18px 18px 0 #e8e2d7
}
.work h2,.faq h2,.contact h2 {
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-.047em;
  line-height:1.03
}
.work h2 {
  font-size:clamp(45px,5vw,71px);
  margin:0 0 33px
}
.copy p {
  font-size:15px;
  line-height:1.88;
  color:#464741;
  margin:0 0 17px
}
.portfolio {
  display:inline-block;
  margin-top:19px;
  text-decoration:none;
  border-bottom:1px solid var(--green);
  padding-bottom:10px;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:11px;
  font-weight:600
}
.faq {
  background:var(--paper);
  padding:130px 0 144px
}
.faq .inner {
  max-width:930px
}
.faq h2 {
  font-size:clamp(46px,5.3vw,78px);
  margin:0 0 60px
}
.faqitem {
  border-top:1px solid #d9d7d0
}
.faqitem:last-child {
  border-bottom:1px solid #d9d7d0
}
.plus {
  font-size:23px;
  line-height:1;
  font-weight:300;
  transition:transform .2s
}
.faqitem[open] .plus {
  transform:rotate(45deg)
}
.faqitem .answer {
  font-size:14px;
  line-height:1.9;
  color:#5a5b55;
  max-width:740px;
  padding:0 50px 25px 0
}
.faqitem .answer p {
  margin:0
}
details>summary {
  list-style:none
}
details>summary::-webkit-details-marker {
  display:none
}
.faqitem summary {
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:26px;
  padding:24px 0;
  font-size:15px;
  font-weight:500
}
.faqitem[open] summary .plus {
  transform:rotate(45deg)
}
.contact {
  background:var(--green);
  color:var(--paper);
  padding:140px 0 155px
}
.contact .inner {
  max-width:770px
}
.contact .section-label {
  text-align:center;
  color:var(--beige);
  opacity:1
}
.contact h2 {
  text-align:center;
  font-size:clamp(42px,6.15vw,81px);
  margin:0 0 62px;
  white-space:normal
}
.contact h2 em {
  font-size:1.07em;
  font-style:italic;
  font-weight:400;
  vertical-align:baseline;
  color:#f1e6d5
}
.contact form {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:29px 27px
}
.field {
  display:flex;
  flex-direction:column;
  gap:11px
}
.field.wide {
  grid-column:1/-1
}
.field label {
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:#ddd9cd
}
.field input,.field textarea,.field select {
  background:transparent;
  color:var(--paper);
  border:0;
  border-bottom:1px solid #8e958e;
  padding:10px 2px 14px;
  outline:0;
  border-radius:0;
  min-width:0
}
.field input:focus,.field textarea:focus,.field select:focus {
  border-color:#fff
}
.field option {
  color:#222
}
.field textarea {
  resize:vertical;
  min-height:110px
}
.field input::placeholder,.field textarea::placeholder {
  color:#aeb5ad
}
.send {
  justify-self:center;
  grid-column:1/-1;
  min-width:196px;
  margin-top:16px;
  border:0;
  background:var(--cream);
  color:var(--green);
  padding:18px 33px;
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:11px;
  font-weight:600
}
.contact-msg {
  grid-column:1/-1;
  text-align:center;
  line-height:1.6;
  font-size:12px;
  color:var(--beige)
}
footer {
  padding:34px 0;
  background:#1d2521;
  color:#c4c8c0;
  font-size:11px
}
.foot {
  display:flex;
  justify-content:space-between;
  gap:20px
}
footer a {
  text-decoration:none
}
@media(max-width:860px) {
  .wrap {
  width:min(100% - 42px,1160px)
}
.top {
  min-height:87px
}
.nav {
  gap:16px
}
.nav a {
  font-size:9px
}
.hero-main {
  padding:80px 0
}
.video {
  padding:70px 0
}
.working {
  padding:95px 0
}
.work-grid {
  gap:48px;
  grid-template-columns:1fr 1.12fr
}
.copy p {
  font-size:13px
}
.faq,.contact {
  padding:94px 0
}

}
@media(max-width:640px) {
  .brand {
  font-size:14px
}
.brand small {
  font-size:8px
}
.top {
  align-items:flex-start;
  padding-top:25px;
  min-height:94px
}
.nav {
  flex-wrap:wrap;
  justify-content:flex-end;
  max-width:190px;
  gap:13px
}
.hero-main {
  padding:91px 0 88px
}
.hero h1 {
  font-size:clamp(49px,11vw,72px)
}
.hero h1 em {
  margin-top:17px;
  font-size:.91em
}
.hero {
  padding-bottom:55px
}
.underhero {
  font-size:8px
}
.work-grid {
  grid-template-columns:1fr;
  gap:51px
}
.portrait {
  max-width:430px
}
.work h2 {
  font-size:59px
}
.faq h2 {
  font-size:57px
}
.contact h2 {
  font-size:clamp(42px,9vw,61px);
  line-height:1.1
}
.contact form {
  grid-template-columns:1fr;
  gap:25px
}
.field.wide,.send,.contact-msg {
  grid-column:1
}
.foot {
  flex-direction:column
}
.faqitem summary {
  font-size:14px
}

}
@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto
}

}

.hero h1 em {
  color:var(--green);
  font-family:'Cormorant Garamond',Georgia,serif;
  font-weight:400;
  font-style:italic;
  font-size:.98em;
  letter-spacing:-.046em;
}

.underhero {
  justify-content:flex-end;
}

.video .section-label,.video .videonote {
  display:none;
}

.video {
  padding-top:119px;
  padding-bottom:123px;
}

.contact h2 em {
  font-family:'Cormorant Garamond',Georgia,serif;
  color:#D6C5AB;
  font-size:1.07em;
  white-space:nowrap;
  letter-spacing:-.035em;
}

.contact .field input,.contact .field textarea,.contact .field select {
  width:100%;
}

@media(max-width:860px) {
  .video {
  padding:70px 0
}

}

@media(max-width:640px) {
  .contact h2 em {
  white-space:nowrap;
}
 .video {
  padding:70px 0
}

}

.contact .inner.contact-layout {
  max-width:1160px;
  display:grid;
  grid-template-columns:minmax(0, .94fr) minmax(0, 1.06fr);
  align-items:start;
  gap:clamp(54px,7vw,115px)
}

.contact .contact-intro {
  min-width:0;
  padding-top:3px;
}

.contact .contact-intro .section-label {
  text-align:left;
  margin-bottom:28px;
}

.contact .contact-intro h2 {
  text-align:left;
  margin-bottom:0;
  font-size:clamp(45px,5vw,73px);
  line-height:1.08;
}

.contact .contact-intro h2 em {
  display:block;
  font-size:1.04em;
  white-space:nowrap;
}

.contact .contact-layout form {
  min-width:0;
}

@media(max-width:860px) {
  .contact .inner.contact-layout {
  grid-template-columns:minmax(0, 1fr) minmax(0, 1.08fr);
  gap:30px
}
.contact .contact-intro h2 {
  font-size:clamp(38px,5.5vw,60px)
}
.contact .contact-layout form {
  grid-template-columns:1fr;
  gap:25px
}
.contact .contact-layout .field,.contact .contact-layout .send,.contact .contact-layout .contact-msg {
  grid-column:1/-1
}

}

@media(max-width:700px) {
  .contact .inner.contact-layout {
  display:block;
}
.contact .contact-intro {
  margin-bottom:55px;
}
.contact .contact-intro .section-label {
  text-align:center
}
.contact .contact-intro h2 {
  text-align:center;
  font-size:clamp(42px,9vw,62px)
}
.contact .contact-intro h2 em {
  display:inline-block;
}

}

.field .required-mark {
  color:var(--beige);
  font-size:1.12em;
  font-weight:500;
  vertical-align:baseline;
}

.contact .required-note {
  grid-column:1/-1;
  margin:1px 0 -16px;
  font-size:10px;
  letter-spacing:.055em;
  color:var(--beige);
  opacity:.85;
}

.contact input:focus-visible,.contact select:focus-visible,.contact textarea:focus-visible {
  outline:1px solid var(--beige);
  outline-offset:4px;
}

@media(max-width:860px) {
  .contact .required-note {
  grid-column:1/-1;
}

}

@media(min-width:861px) {
  .hero h1 {
  font-size:clamp(44.16px,6.992vw,99.36px);
}

  .hero-main {
  padding-top:94px;
  padding-bottom:74px;
}

  .hero {
  padding-bottom:74px;
}

  .video {
  padding-top:83px;
}

}

.faq {
  position:relative;
}

.faq::before {
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:min(1160px,calc(100% - 88px));
  height:1px;
  background:#D8D2C8;
  pointer-events:none;
}

@media (min-width:861px) {
  .contact {
  padding-bottom:95px;
}

}

@media (max-width:860px) {
  .faq::before {
  width:min(1160px,calc(100% - 42px));
}

}

.hero h1.hero-three-line {
  max-width:1150px;
}

.hero h1.hero-three-line .hero-service {
  font-family:var(--serif);
  font-style:normal;
  font-weight:400;
  font-size:.96em;
  line-height:1.02;
  letter-spacing:-.049em;
  color:var(--coal);
  white-space:nowrap;
  margin-top:2px;

}

.hero h1.hero-three-line .hero-tailored {
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic;
  font-weight:400;
  font-size:.79em;
  line-height:1.06;
  letter-spacing:-.046em;
  margin-top:11px;

}

@media(max-width:860px) {
 .hero h1.hero-three-line .hero-service {
  white-space:normal;
}

}

@media(max-width:640px) {
 .hero h1.hero-three-line .hero-service {
  font-size:.94em;
}

 .hero h1.hero-three-line .hero-tailored {
  font-size:.80em;
  margin-top:12px;
}

}

@media(min-width:861px) {
  .hero-main {
  padding-top:27px;
}

}

@media(min-width:641px) and (max-width:860px) {
  .hero-main {
  padding-top:48px;
}

}

@media(max-width:640px) {
  .hero-main {
  padding-top:62px;
}

}

.video {
  background:#222321;
  padding:0!important;
  height:clamp(52px,6vw,86px)!important;
  min-height:0!important;
}

@media (max-width:640px) {
  .video {
  height:48px!important;
}

}

@media(min-width:861px) {
  .top {
  min-height:90px;
}

  .hero-main {
  padding-top:42px;
}

}

@media(min-width:641px) and (max-width:860px) {
  .top {
  min-height:78px;
}

  .hero-main {
  padding-top:57px;
}

}

@media(max-width:640px) {
  .top {
  min-height:86px;
}

  .hero-main {
  padding-top:70px;
}

}

.hero h1.hero-three-line .hero-tailored {
  font-family:'Instrument Sans',Arial,sans-serif;
  font-size:.50em;
  font-style:italic;
  font-weight:400;
  letter-spacing:-.025em;
  line-height:1.15;
  margin-top:1px;
}

@media(max-width:640px) {
  .hero h1.hero-three-line .hero-tailored {
  font-size:.55em;
  margin-top:2px;
}

}

.faq {
  background:#222321;
  color:#F3F0EA;
}

.faq .section-label {
  color:#C4BEB2;
  opacity:1;
}

.faq h2,.faqitem summary,.faqitem .plus {
  color:#F3F0EA;
}

.faqitem .answer {
  color:#CAC7C0;
}

.faqitem,.faqitem:last-child {
  border-color:rgba(243,240,234,.16);
}

.faq::before {
  display:none;
}
