@font-face{font-family:'Awesome Serif';src:url(fonts/awesome-serif.woff2) format('woff2');font-weight:1 700;font-style:normal;font-display:swap}
@font-face{font-family:'Awesome Serif';src:url(fonts/awesome-serif-italic.woff2) format('woff2');font-weight:300 700;font-style:italic;font-display:swap}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#F9F9F1;-webkit-font-smoothing:antialiased}
a{color:#47322F}a:hover{color:#860000}
img{max-width:100%}
.hero-panel{padding:96px 64px 80px}
input:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:2px solid #7B9FDD;outline-offset:2px}
button:hover{background:#860000 !important}
@media (max-width:640px){
 .hero-panel{padding:72px 28px 56px;clip-path:polygon(6% 0,80% 0,100% 12%,97% 100%,0 100%,0 18%) !important}
 form[name=enquiry]{padding:32px 20px !important}
 h2{font-size:44px !important}
}

/* phone layout */
@media (max-width:640px){
 .site-header{padding:20px 20px 12px !important;row-gap:8px !important}
 .site-header > a img{height:26px !important}
 .site-nav{width:100%;justify-content:space-between;gap:0 !important;font-size:15px !important;border-top:1px solid rgba(71,50,47,.2);padding-top:4px}
 section{padding-top:64px !important;padding-bottom:64px !important;padding-left:20px !important;padding-right:20px !important}
 section#top{padding-top:8px !important;gap:32px !important}
 h1{font-size:44px !important}
 .gallery{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important}
 .work-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:24px 12px !important}
 .work-grid div[style*="font-size: 28px"]{font-size:19px !important}
 .work-grid div[style*="font-size: 15px"]{font-size:13px !important}
 .illo{max-width:200px !important}
 #contact-h ~ div .illo, section[aria-labelledby="contact-h"] .illo{display:none}
 p[style*="font-size: 26px"]{font-size:21px !important}
 p[style*="font-size: 22px"],p[style*="font-size: 20px"]{font-size:17px !important}
 .site-footer{padding:14px 20px !important;gap:6px 12px !important}
 .site-footer > div{gap:0 14px !important;font-size:12px}
}

/* FOLD O cursor (mouse and trackpad only) */
@media (hover:hover) and (pointer:fine){
 html,body,a,button,label,summary,img{cursor:url(images/cursor.png) 16 16, auto}
 a,button,label,summary{cursor:-webkit-image-set(url(images/cursor.png) 1x, url(images/cursor@2x.png) 2x) 16 16, pointer}
 html,body{cursor:-webkit-image-set(url(images/cursor.png) 1x, url(images/cursor@2x.png) 2x) 16 16, auto}
 input[type=text],input[type=email],textarea{cursor:text}
}