

/* About uses Mallory's portrait only; the still life belongs to Contact. */
.about-grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.6fr); gap: clamp(32px, 5vw, 72px); }
@media (max-width: 980px) { .about-grid { grid-template-columns: 1fr; } }
  
/* Shared multi-page navigation. */
header .brand-name, .footer-mirror .brand-name { font-size: clamp(38px, 3.5vw, 56px); }
header .nav a, .footer-mirror .nav a { font-size: 13px; }
header .header-inner { min-height: 108px; }
nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; }
.hero-copy h1 { font-size: clamp(27px, 3vw, 44px); }
.standalone-section { padding: 54px 0 64px; min-height: 65vh; }
.standalone-section .page-title { font-size: clamp(38px, 4.7vw, 64px); font-weight: 400; text-align: left; max-width: none; margin: 0 0 34px; line-height: 1.08; }
.standalone-section .portfolio-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 38px 28px; }
.standalone-section .portfolio-item img { aspect-ratio: 1.34; }
.standalone-section .about-copy h1 { font-size: clamp(34px,4vw,54px); text-align: left; margin: 0 0 24px; }
.contact-minimal-footer { padding: 18px 0; }
.contact-footer-row { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.contact-footer-row p { margin: 0; text-align: right; font: 11px/1.6 Arial,sans-serif; letter-spacing: .05em; }
.contact-minimal-footer .social-link { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; }
@media (min-width: 981px) and (max-width: 1280px) {
 header .header-inner { grid-template-columns: 1fr auto; padding: 18px 0; row-gap: 22px; }
 header .nav { grid-column: 1/-1; grid-row: 2; }
 header .header-cta { grid-column: 2; grid-row: 1; }
 .footer-mirror { grid-template-columns: 1fr auto; padding: 18px 0; row-gap: 22px; }
 .footer-mirror .nav { grid-column: 1/-1; grid-row: 2; }
 .footer-mirror .footer-socials { grid-column: 2; grid-row: 1; }
}
@media(max-width:640px) {
 header .brand-name, .footer-mirror .brand-name { font-size: 30px; }
 header .nav a, .footer-mirror .nav a { font-size: 11px; }
 .standalone-section { padding-top: 32px; }
 .standalone-section .portfolio-grid { grid-template-columns: 1fr; }
}
@media(max-width:380px) { header .brand-name, .footer-mirror .brand-name { font-size: 26px; } }

/* Center Staging beneath the lettering, excluding the artichoke. */
header .header-inner .brand, footer .header-inner .brand {
  display: grid; grid-template-columns: max-content max-content;
  column-gap: 3px; row-gap: 4px; align-items: center;
}
header .brand .brand-row, footer .brand .brand-row { display: contents; }
header .brand .brand-name, footer .brand .brand-name { grid-column: 1; grid-row: 1; }
header .brand .header-artichoke, footer .brand .header-artichoke {
  grid-column: 2; grid-row: 1; margin-left: 0;
}
header .brand .brand-sub, footer .brand .brand-sub {
  grid-column: 1; grid-row: 2; margin: 0; padding: 0;
  width: auto; justify-self: stretch; text-align: center;
  text-indent: .48em;
}
@media(max-width:640px) {
 header .brand .brand-sub, footer .brand .brand-sub { text-indent: .36em; }
}

#portfolio .page-title { text-decoration: underline; text-underline-offset: 10px; text-decoration-thickness: 1px; }
.property-carousel { display: grid; grid-template-columns: 40px minmax(0,1fr) 40px; gap: 16px; align-items: center; }
.standalone-section .portfolio-grid { display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 4px 0 16px; }
.portfolio-grid::-webkit-scrollbar { display: none; }
.portfolio-item { flex: 0 0 calc((100% - 48px) / 3); min-width: 0; scroll-snap-align: start; }
.portfolio-item a { display: block; }
.portfolio-item a:focus-visible { outline: 2px solid #111; outline-offset: 3px; }
.carousel-arrow { background: transparent; color: #111; border: 1px solid #ccc; border-radius: 50%; width: 40px; height: 40px; font-size: 24px; cursor: pointer; }
.carousel-arrow:disabled { opacity: .25; cursor: default; }
.gallery-main { max-width: 1000px; margin: 30px auto; }
.gallery-main img { width: 100%; max-height: 65vh; object-fit: contain; }
.gallery-thumbnails { display: flex; justify-content: center; margin: 20px 0; }
.gallery-thumbnails button { padding: 3px; border: 1px solid #111; background: white; }
.gallery-thumbnails img { width: 88px; height: 66px; object-fit: cover; }
.back-portfolio { font: 14px Arial,sans-serif; text-decoration: underline; text-underline-offset: 4px; }
@media(max-width:800px) { .portfolio-item { flex-basis: calc((100% - 24px) / 2); } }
@media(max-width:640px) { .property-carousel { grid-template-columns: 32px minmax(0,1fr) 32px; gap: 8px; } .carousel-arrow { width: 32px; height: 32px; } .portfolio-item { flex-basis: 100%; } }

.sellwood-section { padding-top: 42px; padding-bottom: 64px; }
.sellwood-heading { margin: 32px 0 38px; }
.sellwood-heading h1 { max-width: none; text-align: left; font-size: clamp(36px,5vw,66px); line-height: 1.1; margin: 0 0 14px; }
.sellwood-heading p { margin: 0; font-size: 18px; font-style: italic; }
.sellwood-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 38px 28px; align-items: center; }
.sellwood-photo { margin: 0; }
.sellwood-photo.wide { grid-column: 1/-1; }
.open-photo { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.open-photo:focus-visible { outline: 2px solid #111; outline-offset: 5px; }
.sellwood-photo img { width: 100%; height: auto; }
.sellwood-photo[data-photo="1"] img { aspect-ratio: 1.65; object-fit: cover; object-position: center 80%; }
.sellwood-photo[data-photo="8"] img { aspect-ratio: 1.8; object-fit: cover; object-position: center bottom; }
.gallery-return { display: inline-block; margin-top: 42px; }
.photo-viewer { padding: 18px; border: 0; width: min(1400px,96vw); max-width: 96vw; background: #fff; }
.photo-viewer::backdrop { background: rgba(0,0,0,.83); }
.viewer-close { display: block; margin-left: auto; padding: 10px 14px; background: #fff; border: 1px solid #bbb; cursor: pointer; font: 14px Arial,sans-serif; }
.viewer-stage { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; align-items: center; gap: 8px; margin: 14px 0; }
.viewer-stage .viewer-image { width: 100%; height: 70vh; object-fit: contain; }
.viewer-prev,.viewer-next { font-size: 32px; border: 0; background: transparent; cursor: pointer; min-height: 44px; }
.viewer-count { text-align: center; font: 14px Arial,sans-serif; }
@media(max-width:640px) { .sellwood-gallery { grid-template-columns: 1fr; gap: 24px; } .sellwood-section { padding-top: 28px; } .viewer-stage { grid-template-columns: 30px minmax(0,1fr) 30px; gap: 2px; } .photo-viewer { padding: 10px; } }

.project-gallery { max-width: 1160px; margin: 0 auto; }
.project-stage { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; gap: 14px; align-items: center; touch-action: pan-y; }
.project-stage #project-main-photo { width: 100%; height: min(62vh,690px); object-fit: contain; }
.project-arrow { width: 44px; height: 44px; border: 1px solid #bfbdb6; border-radius: 50%; background: #fff; color: #111; font-size: 30px; cursor: pointer; }
.project-arrow:hover { background: #f3f1eb; }
.project-counter { margin: 18px 0; text-align: center; font: 13px Arial,sans-serif; letter-spacing: .08em; }
.project-thumbnails { display: flex; gap: 12px; overflow-x: auto; padding: 6px 4px 16px; scroll-snap-type: x proximity; }
.project-thumb { flex: 0 0 104px; border: 2px solid transparent; background: #fff; padding: 3px; cursor: pointer; scroll-snap-align: start; }
.project-thumb img { width: 94px; height: 70px; object-fit: cover; }
.project-thumb[aria-pressed="true"] { border-color: #111; }
.project-thumb:focus-visible,.project-arrow:focus-visible { outline: 2px solid #111; outline-offset: 3px; }
@media(max-width:640px) {
 .project-stage { grid-template-columns: 34px minmax(0,1fr) 34px; gap: 5px; }
 .project-arrow { width: 34px; height: 34px; font-size: 25px; }
 .project-stage #project-main-photo { height: 38vh; }
 .project-thumb { flex-basis: 84px; }
 .project-thumb img { width: 74px; height: 56px; }
}

/* Larger property photographs with a subtle horizontal top trim. */
.project-gallery { max-width: 1360px; }
.sellwood-heading { margin: 24px 0 26px; }
.project-stage #project-main-photo {
  height: min(78vh, 900px);
  clip-path: inset(6px 0 0 0);
}
.project-thumb img { clip-path: inset(2px 0 0 0); }
@media (max-width: 640px) {
  .project-stage #project-main-photo { height: min(55vh, 520px); clip-path: inset(3px 0 0 0); }
}

.project-stage #project-main-photo {
  width: 100%; max-width: calc(min(78vh, 900px) * 1.34);
  height: auto; aspect-ratio: 1.34; object-fit: cover;
  object-position: center bottom; justify-self: center; clip-path: none;
}
@media(max-width:640px) {
 .project-stage #project-main-photo { height: auto; max-width: 100%; clip-path: none; }
}

/* Room-specific presentation crops, anchored to preserve the lower room. */
.project-stage #project-main-photo {
  aspect-ratio: var(--room-ratio, 1.7);
  max-width: calc(min(78vh, 900px) * var(--room-ratio, 1.7));
  object-position: center bottom;
}
@media(max-width:640px) { .project-stage #project-main-photo { max-width: 100%; } }

/* Text-only branding until the replacement logo is supplied. */
header .header-inner .brand, footer .header-inner .brand { grid-template-columns: max-content; column-gap: 0; }

/* Mallory's original logo, with the pale background blended into the page. */
header .header-inner .brand, footer .header-inner .brand {
 display:block; width:180px; height:180px; overflow:hidden; line-height:1;
 mix-blend-mode:multiply;
}
.brand img.mallory-logo {
 display:block; width:220px; height:220px; max-width:none;
 margin:-20px; object-fit:contain; filter:brightness(1.025);
}
header .header-inner { min-height:196px; }
@media(max-width:640px) {
 header .header-inner .brand, footer .header-inner .brand { width:148px; height:148px; }
 .brand img.mallory-logo { width:180px; height:180px; margin:-16px; }
 header .header-inner { min-height:0; }
}

/* Emerald masthead with cream logo and aligned navigation. */
body > header { background:#2b372c; color:#fff5e6; border-bottom:1px solid #455647; }
body > header .header-inner {
 display:flex; align-items:center; justify-content:space-between;
 min-height:210px; padding-top:12px; padding-bottom:12px; gap:36px;
}
body > header .header-inner > .brand {
 flex:0 0 200px; width:200px; height:200px; position:static;
 mix-blend-mode:screen; overflow:hidden;
}
body > header .brand img.mallory-logo {
 width:244px; height:244px; margin:-22px; max-width:none;
 filter:grayscale(1) invert(1) brightness(3) contrast(3) sepia(1) saturate(.3) brightness(.96);
}
body > header .nav {
 display:flex; align-items:center; justify-content:center; flex:1;
 flex-wrap:wrap; gap:24px 32px; margin:0;
}
body > header .nav a { color:#fff5e6; font-size:12px; font-weight:600; letter-spacing:.15em; padding:10px 0; text-decoration:none; border-bottom:1px solid transparent; }
body > header .nav a:hover, body > header .nav a[aria-current="page"] { opacity:1; border-bottom-color:#e6c4a1; }
body > header .header-cta { position:static; flex:0 0 auto; }
body > header .header-cta .btn { color:#fff5e6; background:transparent; border:1px solid #d8c4a7; }
body > header .header-cta .btn:hover { background:#fff5e6; color:#2b372c; }
body > header a:focus-visible { outline:2px solid #e6c4a1; outline-offset:5px; }
@media(max-width:900px) {
 body > header .header-inner { gap:20px; }
 body > header .nav { gap:14px 20px; }
 body > header .header-inner > .brand { flex-basis:170px; width:170px; height:170px; }
 body > header .brand img.mallory-logo { width:208px; height:208px; margin:-19px; }
}
@media(max-width:640px) {
 body > header .header-inner { display:flex; flex-wrap:wrap; justify-content:space-between; min-height:0; padding-top:12px; padding-bottom:22px; gap:14px; }
 body > header .header-inner > .brand { flex:0 0 154px; width:154px; height:154px; }
 body > header .brand img.mallory-logo { width:188px; height:188px; margin:-17px; }
 body > header .nav { order:3; flex:1 0 100%; justify-content:center; gap:10px 18px; }
 body > header .nav a { font-size:10px; letter-spacing:.1em; padding:7px 0; }
 body > header .header-cta .btn { font-size:10px; padding:12px 16px; }
}

/* Editorial palette: emerald, champagne and warm cream. */
:root { --paper:#fbfaf5; --cream:#fbfaf5; --ink:#292c28; --muted:#666960; --line:#d8c4a7; }
body { background:#fbfaf5; color:#292c28; }
body > header .header-inner > .brand { mix-blend-mode:normal; }
body > header .brand img.mallory-logo {  }
main h1, main h2, main h3, main .section-label, main .eyebrow { color:#2b372c; }
main .content-section { border-color:rgba(43,55,44,.26); }
main .section-label { border-color:#d8c4a7; }
main .testimonials { border-color:rgba(43,55,44,.26); }
main .testimonials blockquote { color:#293b32; }
main .btn, main button[type="submit"] { background:#2b372c; color:#fff5e6; border-color:#2b372c; }
main .btn:hover, main button[type="submit"]:hover { background:#3c4b3c; border-color:#3c4b3c; }
main .inquiry-form { border-color:#d8c4a7; background:#f5f1e8; }
main input, main textarea, main select { border-color:#c9c7b9; background:#fffdf8; color:#292c28; }
main input:focus, main textarea:focus, main select:focus { outline-color:#2b372c; border-color:#2b372c; }
main .back-portfolio, main .project-type { color:#465b48; }
main .project-thumb[aria-pressed="true"] { border-color:#2b372c; outline-color:#2b372c; }
main .project-arrow { color:#2b372c; }
body > footer { border-top-color:#d8c4a7; color:#465b48; background:#f5f1e8; }
::selection { background:#d8c4a7; color:#2b372c; }

/* Refined proportions and a consistent warm cream canvas. */
:root { --paper:#f8f5ec; --cream:#f8f5ec; }
body, main, main > section { background-color:#f8f5ec; }
body > header .header-inner { min-height:160px; padding-top:8px; padding-bottom:8px; }
body > header .header-inner > .brand { flex-basis:144px; width:144px; height:144px; }
body > header .brand img.mallory-logo { width:176px; height:176px; margin:-16px; }
body.homepage .hero { padding-top:40px; padding-bottom:24px; }
body.homepage .hero-copy { padding:24px 0 0; }
body.homepage .hero-copy h1 { margin:0; }
body.homepage #services { padding-top:24px; }
body.homepage .service-card p { color:#4b5a4a; }
main .portfolio-item p { color:#2b372c; }
@media(max-width:640px) {
 body > header .header-inner { min-height:0; padding-top:8px; padding-bottom:16px; gap:10px; }
 body > header .header-inner > .brand { flex-basis:126px; width:126px; height:126px; }
 body > header .brand img.mallory-logo { width:154px; height:154px; margin:-14px; }
 body.homepage .hero { padding-top:24px; padding-bottom:20px; }
 body.homepage .hero-copy { padding-top:20px; }
 body.homepage #services { padding-top:20px; }
}

/* Equal outer columns keep navigation centered, even without an Inquire button. */
@media(min-width:901px) {
 body > header .header-inner { display:grid; grid-template-columns:minmax(144px,1fr) auto minmax(144px,1fr); column-gap:24px; }
 body > header .header-inner > .brand { grid-column:1; grid-row:1; justify-self:start; }
 body > header .header-inner > .nav { grid-column:2; grid-row:1; justify-self:center; flex-wrap:nowrap; }
 body > header .header-inner > .header-cta { grid-column:3; grid-row:1; justify-self:end; width:auto; }
}
@media(min-width:641px) and (max-width:900px) {
 body > header .header-inner { display:grid; grid-template-columns:1fr 1fr; }
 body > header .header-inner > .brand { grid-column:1; grid-row:1; }
 body > header .header-inner > .header-cta { grid-column:2; grid-row:1; justify-self:end; width:auto; }
 body > header .header-inner > .nav { grid-column:1/-1; grid-row:2; justify-self:center; margin-bottom:12px; }
}

/* Thin closing accent and a compact, accessible mobile menu. */
body.homepage main > .closing-band { height:8px; min-height:0; padding:0; background:#2b372c; }
.mobile-menu-toggle { display:none; }
@media(max-width:640px) {
 body > header .header-inner { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; }
 body > header .header-inner > .header-cta { display:none; }
 body > header .mobile-menu-toggle {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px; width:48px; height:48px; margin-left:auto; padding:10px;
  background:transparent; border:1px solid transparent; color:#d8c4a7; cursor:pointer;
 }
 .mobile-menu-toggle span { display:block; width:26px; height:2px; background:currentColor; }
 body > header .mobile-menu-toggle:focus-visible { outline:2px solid #d8c4a7; outline-offset:3px; }
 body > header .header-inner > .nav { display:none; }
 body > header .header-inner.menu-open > .nav {
  display:flex; flex:1 0 100%; flex-direction:column; align-items:stretch;
  gap:0; border-top:1px solid rgba(216,196,167,.4); padding:10px 0 4px;
 }
 body > header .header-inner.menu-open > .nav a { display:block; text-align:center; padding:13px 12px; font-size:12px; }
}

/* Mobile menu: contact number and interaction-only highlighting. */
body > header .nav .mobile-menu-phone { display:none; }
@media(max-width:640px) {
 body > header .header-inner.menu-open > .nav a,
 body > header .nav a[aria-current="page"] { border-bottom:0; text-decoration:none; }
 body > header .header-inner.menu-open > .nav a:hover,
 body > header .header-inner.menu-open > .nav a:focus-visible {
  color:#d8c4a7; background:rgba(255,245,230,.07); border-bottom:0;
 }
 body > header .header-inner.menu-open > .nav .mobile-menu-phone {
  display:block; margin-top:12px; padding:16px 12px 10px;
  color:#d8c4a7; font-size:14px; letter-spacing:.06em;
 }
}

/* Larger original artwork with clean, unthickened lettering. */
@media(min-width:641px) {
 body > header .header-inner { min-height:192px; }
 body > header .header-inner > .brand { width:190px; height:176px; flex-basis:190px; }
 body > header .brand img.mallory-logo { width:232px; height:232px; margin:-28px -21px; }
}
@media(min-width:901px) {
 body > header .header-inner { grid-template-columns:minmax(190px,1fr) auto minmax(190px,1fr); }
}
@media(max-width:640px) {
 body > header .header-inner > .brand { width:156px; height:156px; flex-basis:156px; }
 body > header .brand img.mallory-logo { width:190px; height:190px; margin:-17px; }
}

/* Consistent landscape photograph size across portfolio galleries. */
.project-stage { max-width:1156px; margin-left:auto; margin-right:auto; }
.project-stage #project-main-photo {
 width:100%; max-width:1040px; height:auto; max-height:none;
 aspect-ratio:4 / 3; object-fit:cover; object-position:center bottom;
 justify-self:center; clip-path:none;
}
.gallery-main { width:calc(100% - 116px); max-width:1040px; margin:30px auto; }
.gallery-main img {
 width:100%; height:auto; max-height:none; aspect-ratio:4 / 3;
 object-fit:cover; object-position:center;
}
@media(max-width:640px) {
 .project-stage #project-main-photo { width:100%; max-width:100%; height:auto; aspect-ratio:4 / 3; }
 .gallery-main { width:calc(100% - 78px); }
}

/* Trim only the left edge of the first Sellwood-Moreland photo. */
.project-gallery:has(.project-thumb:first-child[aria-pressed="true"]) #project-main-photo { clip-path:inset(0 0 0 25px); }

/* Keep gallery dimensions fixed while cropping top-edge camera markings. */
.project-stage .project-photo-frame { width:100%; max-width:1040px; aspect-ratio:4 / 3; overflow:hidden; justify-self:center; }
.project-stage .project-photo-frame #project-main-photo { width:100%; max-width:none; height:100%; max-height:none; aspect-ratio:auto; display:block; object-fit:cover; transform:scale(1.22); transform-origin:center bottom; }
.project-thumb { overflow:hidden; }
.project-thumb img { transform:scale(1.07); transform-origin:center bottom; }
.project-thumb:nth-child(1) img { transform:scale(1.22); }
.project-thumb:nth-child(8) img, .project-thumb:nth-child(9) img, .project-thumb:nth-child(10) img { transform:scale(1.23); transform-origin:center 55%; }

/* New horizontal botanical logo and sampled evergreen palette. */
body > header .header-inner { min-height:148px; padding-top:8px; padding-bottom:8px; }
body > header .header-inner > .brand { width:278px; height:132px; flex-basis:278px; mix-blend-mode:normal; }
body > header .brand img.mallory-logo { width:100%; height:100%; margin:0; max-width:100%; object-fit:contain; filter:none; }
@media(min-width:1150px) {
 body > header .header-inner { display:grid; grid-template-columns:minmax(278px,1fr) auto minmax(278px,1fr); column-gap:24px; }
 body > header .header-inner > .nav { grid-column:2; grid-row:1; }
 body > header .header-inner > .header-cta { grid-column:3; grid-row:1; }
}
@media(min-width:641px) and (max-width:1149px) {
 body > header .header-inner { display:grid; grid-template-columns:1fr 1fr; }
 body > header .header-inner > .brand { grid-column:1; grid-row:1; }
 body > header .header-inner > .header-cta { grid-column:2; grid-row:1; justify-self:end; width:auto; }
 body > header .header-inner > .nav { grid-column:1/-1; grid-row:2; justify-self:center; margin-bottom:12px; }
}
@media(max-width:640px) {
 body > header .header-inner > .brand { width:230px; height:108px; flex-basis:230px; }
 body > header .brand img.mallory-logo { width:100%; height:100%; margin:0; }
 body > header .header-inner { min-height:0; gap:8px; padding-top:8px; padding-bottom:8px; }
}
@media(max-width:360px) { body > header .header-inner > .brand { width:210px; height:99px; flex-basis:210px; } }

/* Centered champagne logo with a side menu at every screen size. */
body > header { position:relative; z-index:20; }
body > header .header-inner {
 position:relative; display:grid; grid-template-columns:48px minmax(0,1fr) 48px;
 align-items:center; min-height:116px; padding-top:8px; padding-bottom:8px; gap:12px;
}
body > header .header-inner > .brand {
 grid-column:2; grid-row:1; justify-self:center; width:210px; height:99px;
 flex:none; margin:0; mix-blend-mode:normal;
}
body > header .brand img.mallory-logo { width:100%; height:100%; margin:0; max-width:100%; object-fit:contain; filter:none; }
body > header .header-inner > .header-cta { display:none; }
body > header .header-inner > .mobile-menu-toggle {
 display:flex; grid-column:3; grid-row:1; justify-self:end;
 flex-direction:column; align-items:center; justify-content:center; gap:6px;
 width:48px; height:48px; margin:0; padding:10px; cursor:pointer;
 background:transparent; border:1px solid transparent; color:#d8c4a7;
}
body > header .mobile-menu-toggle span { display:block; width:25px; height:2px; background:currentColor; }
body > header .mobile-menu-toggle:focus-visible { outline:2px solid #d8c4a7; outline-offset:3px; }
body > header .header-inner > .nav { display:none; }
body > header .header-inner.menu-open > .nav {
 display:flex; position:absolute; top:100%; right:0; z-index:30;
 width:300px; max-width:calc(100vw - 36px); flex-direction:column;
 align-items:stretch; justify-content:flex-start; gap:0; margin:0;
 padding:14px 20px 18px; background:#2b372c; border:1px solid #d8c4a7;
 box-shadow:0 10px 24px rgba(0,0,0,.14);
}
body > header .header-inner.menu-open > .nav a {
 display:block; color:#fff5e6; font:600 12px/1.5 Arial,sans-serif;
 letter-spacing:.12em; padding:12px; text-align:center; border:0; text-decoration:none;
}
body > header .header-inner.menu-open > .nav a[aria-current="page"] { border:0; }
body > header .header-inner.menu-open > .nav a:hover,
body > header .header-inner.menu-open > .nav a:focus-visible { background:rgba(216,196,167,.1); color:#d8c4a7; border:0; }
body > header .header-inner.menu-open > .nav a.menu-inquire {
 display:block; margin:12px 0 2px; border:1px solid #d8c4a7; color:#d8c4a7; background:transparent;
}
body > header .header-inner.menu-open > .nav a.menu-inquire:hover { background:#d8c4a7; color:#2b372c; }
body > header .header-inner.menu-open > .nav a.mobile-menu-phone { display:block; margin:10px 0 0; padding:10px 0 0; color:#d8c4a7; font-size:13px; letter-spacing:.04em; }
@media(max-width:640px) {
 body > header .header-inner { min-height:104px; grid-template-columns:44px minmax(0,1fr) 44px; gap:6px; }
 body > header .header-inner > .brand { width:180px; height:85px; flex:none; }
 body > header .brand img.mallory-logo { width:100%; height:100%; margin:0; }
 body > header .header-inner > .mobile-menu-toggle { width:44px; height:44px; }
}

body > header .header-inner.menu-open > .nav { grid-column:1 / -1; grid-row:auto; justify-self:auto; align-self:auto; }

/* More room around the centered logo. */
body > header .header-inner { min-height:166px; padding-top:24px; padding-bottom:24px; }
body > header .header-inner > .brand { width:245px; height:115px; }
@media(max-width:640px) {
 body > header .header-inner { min-height:142px; padding-top:22px; padding-bottom:22px; }
 body > header .header-inner > .brand { width:210px; height:99px; }
}
@media(max-width:360px) { body > header .header-inner > .brand { width:195px; height:92px; } }
