/* Readable navigation and a transparent logo, with comfortable touch targets. */
.site-header{border-bottom:0;box-shadow:0 5px 24px rgb(37 39 35 / 5%)}
.brand-image{width:90px;height:90px;overflow:visible}
.brand-image img{object-fit:contain}
.desktop-nav{font-size:16px;gap:30px;line-height:1.5}
.desktop-nav a{padding-block:16px}
.header-contact .header-contact-label{font-size:14px}
.header-contact{border-color:rgb(37 39 35 / 14%);box-shadow:0 3px 12px rgb(37 39 35 / 4%)}
.mobile-nav{border-bottom:0;box-shadow:0 14px 24px rgb(37 39 35 / 7%)}
.mobile-nav a{font-size:20px;line-height:1.5;padding-block:17px;border-color:rgb(37 39 35 / 9%)}

/* Diffuse section boundaries, retaining the quiet stone and ivory palette. */
.projects{background:linear-gradient(to bottom,var(--paper),var(--sand) 85px,var(--sand) calc(100% - 85px),var(--paper));box-shadow:inset 0 18px 28px -26px rgb(37 39 35 / 12%),inset 0 -18px 28px -26px rgb(37 39 35 / 8%)}
.hero{overflow:hidden;display:flex;flex-direction:column;height:auto;min-height:max(620px,calc(100svh - 96px));max-height:none;box-shadow:0 12px 24px -16px rgb(37 39 35 / 15%)}
.hero-content{width:100%;flex:1;padding-bottom:60px}
.hero-bottom{position:relative;inset:auto;margin:0 var(--gutter) 28px}
.hero h1{font-size:clamp(52px,6.3vw,96px);max-width:1000px}
.hero-image{object-position:50% 55%}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%;z-index:-2;opacity:0;pointer-events:none;transition:opacity .4s ease}
.hero-video.is-playing{opacity:1}
.hero-video-toggle{color:inherit;background:transparent;border:1px solid #ffffff52;border-radius:2px;padding:10px 12px;font:inherit;letter-spacing:.04em;cursor:pointer;min-height:44px}
.hero-video-toggle:hover{background:#ffffff15}
.project-image,.service-image-frame{box-shadow:0 14px 34px -14px rgb(37 39 35 / 22%),0 3px 9px rgb(37 39 35 / 4%);border-radius:3px}
.artisan{box-shadow:0 12px 32px rgb(37 39 35 / 9%)}
.artisan-photo{overflow:hidden}
.service-list,.service-list>a,.contact-phone,.contact-email,.site-footer,.filters{border-color:rgb(37 39 35 / 10%)}
.site-footer{box-shadow:0 -12px 26px -25px rgb(37 39 35 / 16%)}

/* Rotation plus a small crop: no change to the source photographs. */
.hero-image,.project-image img,.service-hero-image,.artisan-photo img,.lightbox-image{transform:rotate(var(--photo-angle,0deg)) scale(var(--photo-scale,1))}
.project-image:hover img{transform:rotate(var(--photo-angle,0deg)) scale(calc(var(--photo-scale,1) + .035))}
.artisan-photo img{--photo-angle:0deg;--photo-scale:1}
.service-image-frame{overflow:hidden}
.lightbox figure{width:100%}
.lightbox-photo{max-width:100%;max-height:calc(100% - 45px);overflow:hidden;flex-shrink:1;min-height:0}
.lightbox-image{width:100%;height:100%;object-fit:cover}

/* Only JavaScript opts elements into motion; no-JS content stays visible. */
.reveal-ready{transition:opacity .85s ease,translate .95s cubic-bezier(.22,1,.36,1);transition-delay:var(--reveal-delay,0ms)}
.reveal-pending{opacity:0;translate:0 30px}
.reveal-ready .project-image img{transition:transform 1s cubic-bezier(.22,1,.36,1),scale 1.2s cubic-bezier(.22,1,.36,1)}
.reveal-pending .project-image img{scale:1.045}
.reveal-ready:focus-within{opacity:1;translate:0;transition:none}
@media(max-width:1150px){
  .desktop-nav{font-size:15px;gap:20px}
  .brand-image{width:90px;height:90px}
  .header-contact .header-contact-label{display:none}
  .header-contact .header-contact-short{display:inline;font-size:14px}
  .header-contact{gap:12px}
}
@media(min-width:761px) and (max-width:900px){
  .brand-type{display:none}
  .site-header{padding-inline:24px}
}
@media(min-width:761px) and (max-width:1000px){.hero{min-height:max(580px,calc(90svh - 80px))}.brand-image{width:76px;height:76px}}
@media(max-width:760px){
  .hero{min-height:max(600px,calc(93svh - 78px))}
  .hero-content{padding-bottom:50px}
  .hero-bottom{margin-bottom:24px}
  .hero h1{font-size:clamp(34px,6.8vw,52px);letter-spacing:-.045em}
  .hero-image{object-position:46% 50%}
  .hero-video{object-position:46% 50%}
  .hero-bottom{flex-wrap:wrap;gap:16px}
  .hero-video-toggle{margin-left:auto}
  .brand-image{width:74px;height:74px}
  .brand{gap:9px}
  .brand-type{font-size:21px}
  .header-contact{box-shadow:none}
  .header-contact .header-contact-short{font-size:14px}
  .header-actions{gap:10px}
  .reveal-ready{transition-delay:0ms}
  .reveal-pending{translate:0 20px}
  .projects{background:linear-gradient(to bottom,var(--paper),var(--sand) 55px,var(--sand) calc(100% - 55px),var(--paper))}
}
@media(max-width:360px){.header-contact .header-contact-short{display:none}}
@media(prefers-reduced-motion:reduce){
  .hero-video{display:none}
  .reveal-ready,.reveal-pending{opacity:1;translate:none;transition:none}
  .reveal-pending .project-image img{scale:1}
}
@media print{.reveal-ready,.reveal-pending{opacity:1;translate:none}}
.project-photo-count{position:absolute;bottom:24px;left:24px;padding:8px 12px;border-radius:2px;background:rgb(247 246 242 / 92%);font-size:12px;color:var(--ink)}.gallery-more{display:flex;margin:48px auto 0;background:transparent;border:1px solid rgb(37 39 35 / 22%);min-height:48px}.gallery-more:hover{background:var(--paper)}.project-photo-links{display:flex;gap:16px;padding-top:12px}.project-photo-links a{text-decoration:underline}@media(forced-colors:active){.intro>p:nth-child(2) span{background:none;-webkit-text-fill-color:currentColor}}
