/* Barlow + Barlow Condensed (SIL Open Font License 1.1), latin subset, self-hosted */
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/barlow-400.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/barlow-500.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/barlow-600.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/barlow-700.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/barlow-condensed-600.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/barlow-condensed-700.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/barlow-condensed-800.woff2) format('woff2')}

/* Base (from the Claude Design source) */
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#0F110E;font-family:'Barlow',system-ui,sans-serif;color:#F4F4EF;-webkit-font-smoothing:antialiased}
img{max-width:100%}
[hidden]{display:none !important}
section[id]{scroll-margin-top:12px}
a{color:#B7D47E}a:hover{color:#D6EBA9}
a:focus-visible,button:focus-visible{outline:2px solid #B7D47E;outline-offset:3px}
.dh-nav a{color:#F4F4EF;text-decoration:none}
.dh-nav a:hover{color:#B7D47E}
.dh-input{width:100%;height:48px;border:1px solid #C9CBC2;background:#FFFFFF;padding:0 14px;font:500 15px 'Barlow',sans-serif;color:#151714;border-radius:2px}
.dh-input:focus{outline:2px solid #6F8F3A;outline-offset:1px;border-color:#6F8F3A}
textarea.dh-input{height:120px;padding:12px 14px;resize:vertical}
button[type=submit]:disabled{opacity:.6;cursor:progress !important}
.dh-card img{transition:transform .5s ease}
.dh-card:hover img{transform:scale(1.04)}

/* Accessibility helpers */
.dh-skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;background:#9BBC61;color:#0F110E;font-weight:700;text-decoration:none}
.dh-skip:focus{top:12px;color:#0F110E}
.dh-hp{position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .dh-card img{transition:none}
  .dh-card:hover img{transform:none}
}

/* Hero photo: sits to the right of the angled panel so the roofers stay visible */
@media (min-width:961px){
  .dh-hero-img{left:auto !important;right:0 !important;width:64% !important;object-position:30% 50% !important}
  .dh-hero-panel{background:#0F110E !important}
}
@media (min-width:961px) and (max-width:1180px){
  .dh-hero h1{font-size:7vw !important}
}

/* Up to tablet portrait the hero stacks: copy on solid dark, photo as an angled band below */
@media (max-width:960px){
  .dh-hero{display:flex;flex-direction:column;min-height:0 !important}
  .dh-hero > .dh-header,.dh-hero > .dh-hero-copy{width:100%}
  .dh-hero-panel,.dh-hero-shade{display:none}
  .dh-hero-img{position:relative !important;order:1;height:clamp(300px,52vw,460px) !important;object-position:42% 50% !important;clip-path:polygon(0 52px,100% 0,100% 100%,0 100%);margin-top:-52px}
  .dh-hero-copy{padding-bottom:88px !important}
}
@media (min-width:561px) and (max-width:1100px){
  #services .dh-cells{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  #services .dh-cells > div:nth-child(2n){border-right:0 !important}
  #services .dh-cells > div:nth-child(-n+2){border-bottom:1px solid #2D332B}
}

/* Mobile adaptations: the design was drawn on a 1440px canvas */
@media (max-width:760px){
  .dh-hide-sm{display:none !important}

  .dh-header{padding:18px 20px !important;gap:14px !important}
  .dh-nav{width:100%;flex-wrap:nowrap !important;gap:22px !important;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .dh-nav::-webkit-scrollbar{display:none}
  .dh-nav a{white-space:nowrap;padding:6px 0}
  .dh-hero-copy{padding:36px 20px 88px !important}

  .dh-section{padding-left:20px !important;padding-right:20px !important}
  #materials.dh-section,#projects.dh-section,#reviews.dh-section{padding-top:60px !important;padding-bottom:60px !important}

  .dh-cells > div{border-right:0 !important;border-bottom:1px solid #2D332B}
  .dh-cells > div:last-child{border-bottom:0}
  .dh-stats > div{padding-bottom:22px !important}

  .dh-panel{padding:56px 20px !important}
  .dh-panel-cut{clip-path:none !important}
}
