:root{--ink:#232825;--gold:#b69a70;--paper:#f7f7f3;--muted:#626861;--line:#d9dcd4}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--gold);outline-offset:6px}img{display:block;max-width:100%;height:auto}figure,p,h1,h2,h3{margin:0}header{padding:18px 4.5%;display:flex;justify-content:space-between;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:var(--paper)}.brand{display:flex;align-items:center;gap:12px;font-size:27px;letter-spacing:4px;font-weight:700;line-height:1.2}.brand img{width:59px;height:59px;object-fit:cover}.brand small{display:block;font-size:10px;letter-spacing:1.2px;margin-top:7px;font-weight:400}nav{display:flex;gap:35px;font-size:14px}nav a:hover,.header-phone:hover{color:#886a40}.header-phone{font-size:15px}.header-phone span{margin-left:20px}.hero{background:var(--ink);color:var(--paper);display:grid;grid-template-columns:46% 54%;min-height:665px}.hero-copy{padding:65px 9.8% 60px;display:flex;flex-direction:column;justify-content:space-between}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:600}.hero .eyebrow{color:#d3bf9d}h1{font-size:clamp(40px,4.5vw,76px);line-height:1.08;letter-spacing:-2px;font-weight:400;margin:40px 0}em{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--gold)}.hero-bottom p{font-size:16px;color:#d0d4ce;line-height:1.7}.button{margin-top:30px;display:inline-flex;gap:34px;align-items:center;border:1px solid #7d847b;padding:13px 19px;font-size:14px;transition:background .2s}.button:hover{background:var(--gold);color:var(--ink)}.hero-image{position:relative;min-height:665px}.hero-image img{height:100%;width:100%;object-fit:cover;object-position:56% center}.hero-image figcaption{position:absolute;bottom:0;left:0;right:0;padding:45px 28px 20px;display:flex;gap:16px;justify-content:space-between;font-size:12px;background:linear-gradient(transparent,#17221bcb);color:white}.section{padding:95px 7%}.section-top{display:grid;grid-template-columns:1fr 2.15fr;gap:30px;margin-bottom:52px}.section-top .eyebrow{padding-top:9px;color:var(--muted)}h2{font-size:clamp(30px,3.1vw,48px);line-height:1.18;letter-spacing:-1.2px;font-weight:400}.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px}.service{border-top:1px solid var(--ink);position:relative;padding-top:29px}.service-number{position:absolute;right:0;top:34px;color:#7c6849;font-size:14px}h3{font-size:30px;font-weight:400;line-height:1.3}.service>p{color:var(--muted);margin:20px 0;max-width:440px}.service ul{list-style:none;padding:0;margin:27px 0}.service li{border-bottom:1px solid var(--line);padding:11px 0;font-size:15px}.text-link{font-size:14px;display:flex;justify-content:space-between;padding-top:9px}.text-link:hover{color:#896738}.portfolio{background:#e9ece5}.intro{margin-top:18px;color:var(--muted)}.featured img{width:100%;aspect-ratio:1.85;object-fit:cover}.featured figcaption{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:22px}.featured figcaption span{font-size:14px;color:var(--muted)}.project-description{display:flex;justify-content:space-between;gap:45px;padding:23px 0 37px;font-size:15px}.project-description p{max-width:560px}.muted{color:var(--muted);font-size:13px}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:28px}.gallery img{width:100%;aspect-ratio:1.5;object-fit:cover}.gallery figcaption{font-size:13px;padding-top:13px;color:var(--muted)}.featured a,.gallery a{display:block;overflow:hidden}.featured a img,.gallery a img{transition:transform .5s}.featured a:hover img,.gallery a:hover img{transform:scale(1.025)}.contact{background:var(--ink);color:var(--paper);display:grid;grid-template-columns:1.1fr 1fr;gap:100px}.contact .eyebrow{color:#c4b18d;margin-bottom:35px}.contact h2{font-size:clamp(34px,3.5vw,55px)}.contact-title>p:last-child{color:#c5cac2;max-width:430px;margin-top:28px}.contact-details>div{padding:0 0 23px;margin-bottom:23px;border-bottom:1px solid #50564e}.contact-details>div:last-child{margin-bottom:0}.label{display:block;font-size:11px;letter-spacing:2px;color:#c5b28e;margin-bottom:10px}.large-link{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:clamp(21px,2.1vw,32px);line-height:1.4}.large-link:hover{color:#d3bf9d}.large-link span{font-size:22px}address{font-style:normal;font-size:20px}.map-link{display:inline-block;margin-top:13px;font-size:14px;color:#d3bf9d}footer{background:var(--ink);color:#c5cac2;display:flex;justify-content:space-between;align-items:center;gap:25px;padding:30px 7%;border-top:1px solid #50564e;font-size:12px}.footer-brand{font-size:24px;letter-spacing:5px;color:#e9e4d9}.skip{position:absolute;left:20px;top:-100px;background:white;color:black;padding:10px;z-index:5}.skip:focus{top:10px}@media(min-width:1700px){body{max-width:1900px;margin:auto}}@media(max-width:1100px){.header-phone{display:none}.hero{grid-template-columns:48% 52%}.hero-copy{padding-top:45px;padding-bottom:40px}.hero,.hero-image{min-height:580px}.hero-image figcaption{flex-direction:column;gap:0}.section{padding:75px 6%}.service-grid{gap:40px}.contact{gap:50px}}@media(max-width:700px){html{scroll-padding-top:20px}header{padding:15px 5%;flex-wrap:wrap;gap:15px}.brand{font-size:22px}.brand img{width:47px;height:47px}.brand small{font-size:9px}.brand{gap:9px}nav{width:100%;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px;font-size:14px;gap:10px}.hero{display:flex;flex-direction:column;min-height:0}.hero-copy{padding:36px 6% 38px}.eyebrow{font-size:11px;letter-spacing:1.5px}h1{font-size:clamp(40px,10vw,64px);margin:30px 0;letter-spacing:-1.5px}.hero-image{min-height:0}.hero-image img{height:auto;aspect-ratio:1.2;object-position:center}.hero-image figcaption{padding:40px 6% 16px;font-size:11px}.section{padding:56px 6%}.section-top{grid-template-columns:1fr;gap:20px;margin-bottom:34px}.service-grid{grid-template-columns:1fr;gap:42px}h2{font-size:33px}.service li{font-size:15px}.featured img{aspect-ratio:1.25}.featured figcaption{flex-direction:column;align-items:flex-start;gap:8px}.featured h3{font-size:27px}.project-description{flex-direction:column;gap:12px;padding-bottom:27px}.gallery{grid-template-columns:1fr;gap:27px}.contact{grid-template-columns:1fr;gap:42px}.contact h2{font-size:38px}.contact .eyebrow{margin-bottom:25px}.large-link{font-size:25px}footer{flex-wrap:wrap;padding:27px 6%;gap:16px}.footer-brand{width:100%;font-size:22px}footer p,footer>a:last-child{font-size:12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Image wrappers used by the current portfolio and admin-added projects. */
.protected-image{position:relative;overflow:hidden;user-select:none;-webkit-user-select:none}
.protected-image>img{pointer-events:none}
.protected-image>span{position:absolute;right:14px;bottom:12px;color:#ffffffaa;font-size:13px;letter-spacing:3px;text-shadow:0 1px 4px #000;pointer-events:none}
.featured .protected-image img{width:100%;aspect-ratio:1.85;object-fit:cover}
.gallery .protected-image img{width:100%;aspect-ratio:1.5;object-fit:cover}
.hero-image .protected-image{height:100%;width:100%}
.hero-image .protected-image img{height:100%;width:100%;object-fit:cover;object-position:56% center}
#additional-projects{background:#f1f2ed;border-top:1px solid var(--line)}
.footer-links{display:flex;gap:24px;flex-wrap:wrap}
.footer-links a:hover,.map-link:hover{color:#fff}
@media(max-width:700px){
  .hero-image .protected-image,.hero-image .protected-image img{height:auto}
  .hero-image .protected-image img{aspect-ratio:1.2;object-position:center}
  .featured .protected-image img{aspect-ratio:1.25}
  .footer-links{width:100%;justify-content:space-between}
}

.project-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.project-card{background:#fff;border:1px solid var(--line)}
.project-card>a{display:block;height:100%}
.project-card .protected-image,.project-cover-empty{display:block;aspect-ratio:1.55;overflow:hidden;background:#d9dcd4}
.project-card .protected-image img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.project-card a:hover img{transform:scale(1.035)}
.project-cover-empty{display:grid;place-items:center;color:#717a70;letter-spacing:.25em;font-size:20px}
.project-card-content{padding:22px 24px 24px}
.project-card-content .eyebrow{color:#77684f;font-size:12px}
.project-card-content h3{font-size:clamp(23px,2.3vw,32px);margin:10px 0 26px;overflow-wrap:anywhere}
.project-card-link{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:13px;font-size:14px;color:#5e604f}
.project-detail{background:var(--paper);min-height:65vh;padding:46px 7% 84px}
.detail-intro{max-width:940px}
.detail-back,.detail-end a{font-size:14px;color:#655a44;text-decoration:underline;text-underline-offset:5px}
.detail-intro>.eyebrow{margin:65px 0 16px;color:#746a55}
.project-detail h1{margin:0 0 22px;overflow-wrap:anywhere}
.detail-description{white-space:pre-line;max-width:780px;font-size:18px;line-height:1.65;color:#4d574f}
.detail-count{margin:22px 0 35px;color:#687068;font-size:14px}
.detail-cover{background:#e9ece5}
.project-photo{position:relative;display:block;width:100%;padding:0;border:0;background:#e3e7df;text-align:left;cursor:zoom-in;color:inherit}
.project-photo .protected-image{display:block}
.project-photo img{display:block;width:100%;aspect-ratio:1.55;object-fit:cover}
.project-photo.project-main-photo img{aspect-ratio:1.8}
.project-photo .zoom-label{position:absolute;right:17px;bottom:17px;background:#232825dd;color:#fff;padding:8px 12px;font-size:14px}
.project-photo:focus-visible,.photo-dialog button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.detail-image-empty{padding:80px 20px;text-align:center;color:#626861}
.detail-gallery{padding:65px 0 40px}
.detail-gallery h2{margin-bottom:25px;font-size:32px}
.detail-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.detail-gallery-grid .project-photo img{aspect-ratio:1.35}
.detail-end{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:36px;padding-top:24px}
.photo-dialog{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;border:0;padding:0;background:#151a17;color:white}
.photo-dialog::backdrop{background:#050806e8}
.photo-dialog-inner{height:100%;display:flex;flex-direction:column;padding:15px 24px 20px}
.photo-dialog-top{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:14px}
.photo-dialog button{border:1px solid #7b837b;background:#232b25;color:white;font:inherit;cursor:pointer}
#photo-close{padding:8px 13px}
.photo-view{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;align-items:center;gap:12px;min-height:0;flex:1}
.photo-view img{max-width:100%;max-height:calc(100dvh - 130px);width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-select:none}
.photo-view button{width:52px;height:64px;font-size:34px}
.photo-view button[hidden]{visibility:hidden}
#photo-caption{text-align:center;font-size:14px;color:#d5dad3;min-height:22px}
@media(max-width:700px){
  .project-card-grid{grid-template-columns:1fr;gap:20px}
  .project-detail{padding:28px 6% 60px}
  .detail-intro>.eyebrow{margin-top:42px}
  .detail-description{font-size:16px}
  .project-photo.project-main-photo img{aspect-ratio:1.25}
  .detail-gallery{padding-top:45px}
  .detail-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .photo-dialog-inner{padding:12px 8px 16px}
  .photo-view{grid-template-columns:36px minmax(0,1fr) 36px;gap:4px}
  .photo-view button{width:36px;height:48px;font-size:28px}
  .photo-view img{max-height:calc(100dvh - 130px)}
}

/* Architectural identity and the primary navigation. */
header{min-height:116px;padding:16px 4.5%;color:#f5f2ea;background-color:#202824;background-image:linear-gradient(90deg,#ffffff09 1px,transparent 1px),linear-gradient(#ffffff09 1px,transparent 1px);background-size:48px 48px;border-bottom:2px solid #b69a70;gap:24px}
header .brand{display:flex;align-items:center;gap:16px;min-width:0;line-height:1.1;letter-spacing:0}
header .brand img{width:78px;height:78px;flex:none;object-fit:contain}
.brand-type{display:flex;flex-direction:column;min-width:0}
.brand-type strong{font-size:28px;font-weight:700;letter-spacing:.16em;white-space:nowrap}
.brand-discipline{font-size:15px;color:#d7b786;font-weight:600;letter-spacing:.24em;margin-top:3px}
header .brand small{font-size:12px;line-height:1.35;letter-spacing:.08em;margin-top:7px;color:#d6dbd3;font-weight:400;white-space:nowrap}
header nav{display:flex;align-items:center;gap:clamp(18px,2.7vw,36px);font-size:16px;white-space:nowrap}
header nav a{position:relative;padding:9px 0}
header nav a::after{content:"";position:absolute;bottom:3px;left:0;right:0;height:1px;background:#d7b786;transform:scaleX(0);transform-origin:left;transition:transform .2s}
header nav a:hover::after,header nav a:focus-visible::after{transform:scaleX(1)}
header nav a:hover,header .header-phone:hover{color:#e2c596}
header .header-phone{white-space:nowrap;border:1px solid #8e795a;padding:11px 15px;font-size:16px}
header .header-phone span{color:#d7b786;margin-left:13px}
.hero-bottom p{font-size:18px}
.footer-brand span{display:block;font-size:11px;letter-spacing:.22em;color:#c9aa7d}
@media(max-width:1100px){header{min-height:105px}header .brand img{width:69px;height:69px}header nav{font-size:16px}}
@media(max-width:700px){header{min-height:0;padding:13px 5% 0;gap:11px}header .brand{gap:12px}header .brand img{width:59px;height:59px}.brand-type strong{font-size:23px}.brand-discipline{font-size:13px;margin-top:2px}header .brand small{font-size:11px;letter-spacing:.03em;margin-top:4px}header nav{width:100%;justify-content:space-between;gap:8px;padding:8px 0;border-top:1px solid #718076;font-size:15px}.hero-bottom p{font-size:17px}}
@media(max-width:360px){header .brand img{width:52px;height:52px}.brand-type strong{font-size:21px}.brand-discipline{font-size:12px}header .brand small{font-size:10px}header nav{font-size:14px}}

/* Quiet, precise wordmark and a material-led opening view. */
header{background:#202824;border-bottom:1px solid #465248;background-image:none}
header .brand img{width:64px;height:64px}
.brand-type strong{font-family:Arial,Helvetica,sans-serif;font-weight:600;font-size:29px;letter-spacing:.14em}
.brand-discipline{letter-spacing:.28em;font-size:13px;color:#c8a978}
header .brand small{letter-spacing:.085em}
header nav a[aria-current="page"]::after{transform:scaleX(1)}
.hero.hero-architectural{position:relative;display:flex;align-items:stretch;min-height:min(760px,calc(100vh - 110px));background-image:linear-gradient(90deg,#131916bd 0%,#151a1670 40%,transparent 78%),url('/assets/keuser-architectural-hero.webp');background-size:cover;background-position:center;color:#f8f6f0}
.hero.hero-architectural .hero-copy{width:min(760px,75%);min-height:660px;padding:72px 7% 78px;position:relative;z-index:1}
.hero.hero-architectural h1{font-size:clamp(45px,5.2vw,82px);margin:40px 0;max-width:700px}
.hero.hero-architectural .hero-bottom p{color:#ecebe5}
.hero.hero-architectural .button{border-color:#d6c6a8}
.hero-detail-label{position:absolute;bottom:30px;right:3%;padding:7px 11px;font-size:12px;letter-spacing:.15em;background:#202824b8;color:#f4ead8}
@media(max-width:1100px){.hero.hero-architectural{min-height:650px}.hero.hero-architectural .hero-copy{min-height:650px;width:85%;padding-top:58px}}
@media(max-width:700px){header .brand img{width:56px;height:56px}.hero.hero-architectural{min-height:640px;background-image:linear-gradient(90deg,#101713d9 0%,#131a15a6 58%,#131a1533 100%),url('/assets/keuser-architectural-hero.webp');background-position:58% center}.hero.hero-architectural .hero-copy{width:100%;min-height:640px;padding:42px 6% 75px}.hero.hero-architectural h1{font-size:clamp(41px,9vw,58px)}.hero-detail-label{bottom:17px;right:6%;font-size:10px}}

.blog-section{background:#f7f7f3;border-top:1px solid var(--line)}
.blog-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.blog-card{background:#fff;border:1px solid var(--line);transition:border-color .2s}
.blog-card:hover{border-color:#ad9671}
.blog-card>a{display:block;height:100%;padding:28px}
.blog-card .eyebrow{font-size:12px;color:#826f52}
.blog-card h3{font-size:clamp(24px,2.5vw,34px);margin:13px 0;line-height:1.25}
.blog-card p:not(.eyebrow){color:#535d55;line-height:1.6}
.blog-card .project-card-link{margin-top:30px}
.blog-more{max-width:230px;margin-top:26px}
.blog-page,.article-page{padding:58px 7% 100px;min-height:70vh;background:#f7f7f3}
.blog-heading{max-width:740px;margin-bottom:55px}
.blog-heading .eyebrow{color:#896f4c;margin-bottom:22px}
.blog-heading h1,.article-heading h1{font-size:clamp(40px,5.4vw,72px);margin:0 0 20px;letter-spacing:-.035em}
.blog-heading>p:last-child{font-size:19px;color:#536055}
.blog-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.blog-empty{color:#59635a;padding:50px 0}
.article-page{padding-top:46px}
.article-page article{max-width:1040px;margin:auto}
.article-heading{max-width:880px}
.article-heading .eyebrow{margin:65px 0 18px;color:#806e52}
.article-lead{font-size:clamp(19px,2vw,24px);line-height:1.55;color:#4a564d;max-width:840px;margin-bottom:37px}
.article-cover{margin:0 0 45px}
.article-cover img{width:100%;max-height:590px;aspect-ratio:1.8;object-fit:cover}
.article-cover figcaption{font-size:13px;color:#626861;padding-top:9px}
.article-body{max-width:760px;margin:auto;font-size:18px;line-height:1.85;color:#333f36}
.article-body p{margin:0 0 26px}
.article-body h2{font-size:clamp(26px,2.8vw,34px);letter-spacing:-.02em;margin:52px 0 20px}
.article-body a{color:#755c37;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.article-end{max-width:1040px;margin:75px auto 0;padding-top:25px;border-top:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px}
.article-end a{font-size:15px;color:#725e40;text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){.blog-card-grid,.blog-list{grid-template-columns:1fr}.blog-page,.article-page{padding:37px 6% 70px}.blog-heading{margin-bottom:35px}.blog-card>a{padding:21px}.article-heading .eyebrow{margin-top:42px}.article-body{font-size:16px;line-height:1.75}.article-cover img{aspect-ratio:1.24}}

/* Approved artwork fills the whole brand band, edge to edge. */
header{display:grid;grid-template-columns:minmax(0,1fr) auto;min-height:0;padding:0;gap:0;background:#032345;background-image:none;border-bottom:1px solid #bd9c65;color:#f8e9cb}
header .brand.brand-full-width{grid-column:1/-1;display:block;width:100%;max-width:none;margin:0;padding:0;line-height:0}
header .brand.brand-full-width img{display:block;position:static;width:100%;max-width:none;height:auto;margin:0;padding:0;object-fit:contain;aspect-ratio:2035/773}
header nav{display:flex;justify-content:center;align-items:center;gap:clamp(20px,4vw,64px);width:auto;margin:0;padding:12px 5%;font-size:16px;border:0}
header .header-phone{margin:8px 28px 8px 0;border-color:#ad9266}
@media(max-width:1100px){header{grid-template-columns:minmax(0,1fr)}header .header-phone{display:none}}
@media(max-width:700px){header{padding:0;gap:0;min-height:0}header nav{width:100%;justify-content:space-between;gap:8px;margin:0;padding:10px 5%;font-size:14px}header .brand.brand-full-width img{width:100%;height:auto}}

/* Mobile banner: one bounded frame, entire image visible. */
@media(max-width:760px){
 html,body{width:100%;max-width:100%;margin:0}
 body>header{display:block;width:100%;max-width:100%;padding:0;min-width:0}
 body>header .brand.brand-full-width{display:block;position:relative;width:100%;max-width:100%;min-width:0;height:auto;aspect-ratio:2035 / 773;overflow:hidden;margin:0;padding:0}
 body>header .brand.brand-full-width img{position:absolute;inset:0;display:block;width:100%;max-width:100%;min-width:0;height:100%;max-height:100%;margin:0;padding:0;object-fit:contain;object-position:center;transform:none;aspect-ratio:auto}
 body>header nav{display:flex;box-sizing:border-box;width:100%;max-width:100%;min-width:0;margin:0;gap:4px;padding:8px 4%;justify-content:space-between;flex-wrap:wrap}
 body>header nav a{font-size:14px;letter-spacing:0;padding:8px 0}
 body>header .header-phone{display:none}
}