/* DrapeWell v2. Layout values are set per element as CSS variables (desktop, -t tablet <=1024px, -m mobile <=767px). */
@font-face{font-family:"Instrument Serif";src:url(/fonts/instrument-serif.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;ascent-override:98%;descent-override:10%;line-gap-override:0%}
@font-face{font-family:"Instrument Sans";src:url(/fonts/instrument-sans.woff2) format("woff2");font-weight:400 700;font-stretch:75% 100%;font-style:normal;font-display:swap}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{margin:0;font-family:"Instrument Sans",Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.5;color:#070707;background:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
p{margin:0 0 .9rem}
h1,h2,h3,h4{margin:0;font-weight:400}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto;border:0}
ul{margin:0 0 .9rem}
.skip{position:absolute;left:-9999px;top:0;z-index:10000;background:#070707;color:#fff;padding:10px 14px}
.skip:focus{left:10px;top:10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* containers */
.c{--d:flex;--fd:column;--cols:repeat(1,1fr);--rows:repeat(1,1fr);--g:20px;--p:0;--mh:0;--jc:normal;--ai:normal;--o:0;--w:auto;--fw:nowrap;--bw:0;
--d-t:var(--d);--fd-t:var(--fd);--cols-t:var(--cols);--rows-t:var(--rows);--g-t:var(--g);--p-t:var(--p);--mh-t:var(--mh);--jc-t:var(--jc);--ai-t:var(--ai);--o-t:var(--o);--w-t:var(--w);--fw-t:var(--fw);--bw-t:var(--bw);
--d-m:var(--d-t);--fd-m:var(--fd-t);--cols-m:var(--cols-t);--rows-m:var(--rows-t);--g-m:var(--g-t);--p-m:var(--p-t);--mh-m:var(--mh-t);--jc-m:var(--jc-t);--ai-m:var(--ai-t);--o-m:var(--o-t);--w-m:var(--w-t);--fw-m:var(--fw-t);--bw-m:var(--bw-t);
position:relative;display:var(--d);flex-direction:var(--fd);flex-wrap:var(--fw);grid-template-columns:var(--cols);grid-template-rows:var(--rows);gap:var(--g);padding:var(--p);min-height:var(--mh);justify-content:var(--jc);align-items:var(--ai);order:var(--o);width:var(--w);border:0 solid #BDBDBD;border-width:var(--bw)}
/* widgets */
.w{--p:0;--m:0;--mw:none;--w:100%;--fs:inherit;--lh:inherit;--ta:inherit;--o:0;--d:block;--as:auto;
--p-t:var(--p);--m-t:var(--m);--mw-t:var(--mw);--w-t:var(--w);--fs-t:var(--fs);--lh-t:var(--lh);--ta-t:var(--ta);--o-t:var(--o);--d-t:var(--d);--as-t:var(--as);
--p-m:var(--p-t);--m-m:var(--m-t);--mw-m:var(--mw-t);--w-m:var(--w-t);--fs-m:var(--fs-t);--lh-m:var(--lh-t);--ta-m:var(--ta-t);--o-m:var(--o-t);--d-m:var(--d-t);--as-m:var(--as-t);
position:relative;display:var(--d);padding:var(--p);margin:var(--m);max-width:var(--mw);width:var(--w);font-size:var(--fs);line-height:var(--lh);text-align:var(--ta);order:var(--o);align-self:var(--as)}
/* widget types */
.w.h{--fs:65px;--lh:var(--fs);--lh-t:var(--fs-t);--lh-m:var(--fs-m);--k:.894;font-size:calc(var(--fs) * var(--k));font-family:"Instrument Serif",Georgia,serif;font-weight:400;letter-spacing:.012em;color:#070707}
.w.t{--fs:18px;--lh:26px;--fs-m:14px;--lh-m:20px;font-weight:400}
.w.l{--fs:17px;--fs-m:15px;font-weight:500;text-transform:uppercase}
.w.i{--h:auto;--op:center center;--h-t:var(--h);--h-m:var(--h-t);--op-t:var(--op);--op-m:var(--op-t)}
.w.i img{width:100%;height:var(--h);object-fit:cover;object-position:var(--op)}
@media(max-width:1024px){.w.i img{height:var(--h-t);object-position:var(--op-t)}}
@media(max-width:767px){.w.i img{height:var(--h-m);object-position:var(--op-m)}}
.w.h.white,.w.t.white{color:#fff}
.w.t.white{color:#FDFDFD}

@media(max-width:1024px){
.c{display:var(--d-t);flex-direction:var(--fd-t);flex-wrap:var(--fw-t);grid-template-columns:var(--cols-t);grid-template-rows:var(--rows-t);gap:var(--g-t);padding:var(--p-t);min-height:var(--mh-t);justify-content:var(--jc-t);align-items:var(--ai-t);order:var(--o-t);width:var(--w-t);border-width:var(--bw-t)}
.w{display:var(--d-t);padding:var(--p-t);margin:var(--m-t);max-width:var(--mw-t);width:var(--w-t);font-size:var(--fs-t);line-height:var(--lh-t);text-align:var(--ta-t);order:var(--o-t);align-self:var(--as-t)}
.w.h{font-size:calc(var(--fs-t) * var(--k))}
}
@media(max-width:767px){
.c{display:var(--d-m);flex-direction:var(--fd-m);flex-wrap:var(--fw-m);grid-template-columns:var(--cols-m);grid-template-rows:var(--rows-m);gap:var(--g-m);padding:var(--p-m);min-height:var(--mh-m);justify-content:var(--jc-m);align-items:var(--ai-m);order:var(--o-m);width:var(--w-m);border-width:var(--bw-m)}
.w{display:var(--d-m);padding:var(--p-m);margin:var(--m-m);max-width:var(--mw-m);width:var(--w-m);font-size:var(--fs-m);line-height:var(--lh-m);text-align:var(--ta-m);order:var(--o-m);align-self:var(--as-m)}
.w.h{font-size:calc(var(--fs-m) * var(--k))}
}

/* backgrounds with a black overlay */
.bg{background-position:center center;background-repeat:no-repeat;background-size:cover}
.bg::before{content:"";position:absolute;inset:0;background:#000;opacity:var(--ov,.5);pointer-events:none}
.bg>*{position:relative;z-index:1}
@media(min-width:1025px){.bg.fixed{background-attachment:fixed}}

/* header */
.hdr{position:fixed;top:0;left:0;width:100%;z-index:50;display:grid;grid-template-columns:repeat(2,1fr);gap:20px;padding:3% 5%;transition:background .35s,padding .35s,box-shadow .35s}
/* persistent navbar: turns into a light bar once the page has scrolled */
.hdr.solid{background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding-top:14px;padding-bottom:14px;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.hdr.solid .logo svg{color:#070707!important}
.hdr.solid .menu a{color:#070707}
.hdr.solid .menu a:hover,.hdr.solid .menu a:focus-visible,.hdr.solid .menu a[aria-current]{color:#07070799}
.hdr.solid .burger{color:#070707}
.hdr .logo{display:flex;align-items:center;justify-self:start;width:168px}
.logo svg{display:block;width:100%;height:auto;transition:opacity .4s}
.logo:hover svg{opacity:.5}
.hdr .right{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;gap:34px}
.hdr-tel{font-size:13px;font-weight:700;line-height:20px;letter-spacing:2px;color:#fff;white-space:nowrap;border:1px solid currentColor;padding:6px 14px;transition:color .3s,background .3s}
.hdr-tel:hover,.hdr-tel:focus-visible{background:#fff;color:#070707}
.hdr.solid .hdr-tel{color:#070707}
.hdr.solid .hdr-tel:hover,.hdr.solid .hdr-tel:focus-visible{background:#070707;color:#fff}
.menu{display:flex;list-style:none;margin:0;padding:0}
.menu li+li{margin-left:26px}
.menu a{display:block;font-size:13px;font-weight:700;line-height:20px;letter-spacing:5.25px;text-transform:uppercase;color:#fff;transition:color .3s}
.menu a:hover,.menu a:focus-visible,.menu a[aria-current]{color:#FFFFFF78}
.burger{display:none;width:30px;height:28px;padding:0;margin:0;border:0;background:none;cursor:pointer;color:#fff;align-items:center;justify-content:flex-end}
.burger svg{width:30px;height:22px;display:block;overflow:visible}
.burger rect{transition:transform .35s ease;transform-origin:right center}
.burger:hover .b2{transform:scaleX(.55)}
@media(max-width:1024px){
.hdr .menu{display:none}
.burger{display:flex}
.hdr .logo{width:168px}
}
@media(max-width:767px){
.hdr-tel{font-size:12px;letter-spacing:1px;padding:5px 10px}
.hdr .right{gap:16px}
.hdr{padding:5%}
.hdr.solid{padding-top:12px;padding-bottom:12px}
.hdr .logo{width:90px}
}

/* full screen menu (tablet and mobile) */
.pop{position:fixed;inset:0;z-index:9000;background:#000;display:none;flex-direction:column;overflow:auto}
.pop.open{display:flex}
.pop .top{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;padding:3% 5%;border-bottom:1px solid #fff}
.pop .top .logo{width:168px;display:flex;align-items:center}
.pop .top .right{display:flex;justify-content:flex-end;align-items:center}
.pop .burger{display:flex}
.pop .body{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;min-height:469px;padding:3% 5%}
.pop ul{list-style:none;margin:0;padding:100px 0 0}
.pop li+li{margin-top:26px}
.pop a.it{display:block;font-size:20px;font-weight:700;line-height:20px;letter-spacing:5px;text-transform:uppercase;color:#fff;transition:color .3s}
.pop a.it:hover{color:#FFFFFF78}
.pop a.it[aria-current]{text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:1px}
@media(max-width:767px){.pop .top,.pop .body{padding:5%}.pop .top .logo{width:90px}}

/* hero */
.hero{--ov:.45;background-image:url(/img/hero-d.webp);background-size:cover;background-position:center 55%}
@media(max-width:767px){.hero{background-image:url(/img/hero-m.webp);background-position:center}}
.sub{font-size:13px;font-weight:500;line-height:1.5;letter-spacing:3px;text-transform:uppercase;color:#fff}
.line{width:100px;height:106px;align-self:center}
.line.sm{width:80px;height:86px}
.line i{position:absolute;left:50%;top:.4px;width:1.6px;margin-left:-.8px;height:99.2px;background:#fff;display:block}
.line i.a{animation:lineA 2s infinite}
.line i.b{animation:lineB 2s infinite}
.line.sm i{width:1.3px;margin-left:-.65px;top:.3px;height:79.4px}
@media(max-width:767px){.line.sm-m{width:80px;height:86px}.line.sm-m i{width:1.3px;margin-left:-.65px;top:.3px;height:79.4px}}
@keyframes lineA{0%{clip-path:inset(0 0 0 0);animation-timing-function:cubic-bezier(.498,0,0,1)}50%,100%{clip-path:inset(100% 0 0 0)}}
@keyframes lineB{0%,8.333%{clip-path:inset(0 0 100% 0);animation-timing-function:cubic-bezier(.498,0,0,1)}58.333%,100%{clip-path:inset(0 0 0 0)}}

/* list in What we do */
.w.t ul{padding-left:40px;padding-bottom:20px;margin:0}
.w.t ul li{margin-left:-20px}

/* product rows on home */
.prow{border-bottom:1px solid #BDBDBD}

/* text button */
.tbtn{display:inline-block;font-size:18px;font-weight:500;line-height:24px;color:#fff;background:transparent;transition:color .3s}
.tbtn:hover,.tbtn:focus-visible{color:#FFFFFF80}

/* galleries */
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.gal a{position:relative;display:block;overflow:hidden;aspect-ratio:1/1;background:#eee}
.gal.r32 a{aspect-ratio:3/2}
.gal img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gal a::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .8s}
.gal a:hover::after,.gal a:focus-visible::after{opacity:1}
@media(max-width:1024px){.gal{grid-template-columns:repeat(2,1fr)}}
@media(max-width:767px){.gal{grid-template-columns:1fr}}

/* lightbox */
.lb{position:fixed;inset:0;z-index:9500;background:#000;display:none;align-items:center;justify-content:center}
.lb.open{display:flex}
.lb img{max-width:calc(100% - 140px);max-height:calc(100% - 120px);width:auto;height:auto;object-fit:contain}
.lb button{position:absolute;background:none;border:0;color:hsla(0,0%,93%,.9);cursor:pointer;padding:16px;font:inherit}
.lb button:hover{color:#fff}
.lb .x{top:0;right:0;font-size:28px;line-height:1}
.lb .pv,.lb .nx{top:50%;transform:translateY(-50%);font-size:34px}
.lb .pv{left:8px}.lb .nx{right:8px}
.lb svg{width:26px;height:26px;display:block;fill:currentColor}
@media(max-width:767px){.lb img{max-width:100%}}

/* logo strip (about) */
.strip{overflow:hidden;width:100%;padding-bottom:6px}
.strip .track{display:flex;will-change:transform}
.strip .sl{flex:0 0 calc((100% - 500px)/6);margin-right:100px;display:flex;align-items:center;justify-content:center}
.strip .sl svg{width:100%;height:auto;max-width:238px;display:block}
@media(max-width:1024px){.strip .sl{flex-basis:calc((100% - 60px)/4);margin-right:20px}}
@media(max-width:767px){.strip .sl{flex-basis:100%;margin-right:20px}}

/* range cards (about) */
.card .w.i img{height:390px;object-position:center left}
@media(max-width:1024px){.card .w.i img{height:350px}}
@media(max-width:767px){.card .w.i img{height:300px}}

/* product cards with accordion */
.pc .w.i img{height:390px;object-position:center left}
@media(max-width:767px){.pc .w.i img{height:300px}}
.acc summary{list-style:none;display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:18px;font-weight:500;line-height:27px;color:#070707}
.acc summary::-webkit-details-marker{display:none}
.acc summary svg{width:13.125px;height:15px;fill:#070707}
.acc .mi{display:none}
.acc details[open] .mi{display:block}
.acc details[open] .pl{display:none}
.acc .bd{overflow:hidden;padding-top:5px}
.acc .bd p{font-size:18px;line-height:26px}
@media(max-width:767px){.acc .bd p{font-size:14px;line-height:20px}.acc summary{font-size:16px;line-height:24px}.w.acc{padding-bottom:10px}}

/* contact details */
.w.t.cdl{--fs:18px;--lh:27px;--fs-m:18px;--lh-m:27px}
.cd a{transition:color .3s}
.cd a:hover{color:#0000007A}

/* form */
.form{display:flex;flex-wrap:wrap;margin:0 -5px -10px}
.fg{width:100%;padding:0 5px;margin-bottom:10px}
.fg input,.fg textarea{display:block;width:100%;margin:0;font-family:inherit;font-size:18px;font-weight:500;line-height:1.4;color:#000;background:#fff;border:0;border-bottom:1px solid #BDBDBD;border-radius:0;padding:20px 0 30px;min-height:40px;outline:0;-webkit-appearance:none;appearance:none}
.fg textarea{height:200px;resize:vertical}
.fg input:focus,.fg textarea:focus{box-shadow:inset 0 -1px 0 0 #070707}
.fg button{display:inline-flex;align-items:center;min-height:40px;padding:0;margin:0;border:0;background:transparent;font-family:inherit;font-size:18px;font-weight:500;line-height:1;color:#000;cursor:pointer;transition:color .4s}
.fg button:hover,.fg button:focus-visible{color:#00000073}

/* footer */
.foot{background:#070707;color:#fff}
.foot .ft{font-size:16px;line-height:20px;color:#fff}
.foot .ft a:hover{color:#FFFFFF78}
.foot .fnav{justify-self:end;align-self:end}
.foot .menu a{line-height:20px}
.foot hr{border:0;border-top:1px solid #fff;margin:0;height:0}
.foot .dv{padding:25px 0}
.foot .flogo{display:block;width:150px}
.foot .flogo svg{display:block;width:100%;height:auto;transition:opacity .4s}
.foot .flogo:hover svg{opacity:.5}
.foot .credit{align-self:center;text-align:right;font-size:14px;line-height:18px;color:#BDBDBD;margin:0}
.foot .credit p{margin:0 0 .9rem}
@media(max-width:767px){
.foot .fnav{display:none}
.foot .dv{padding:15px 0}
.foot .flogo{width:90px}
.foot .credit{text-align:left}
}

/* hide per device */
@media(min-width:1025px){.hide-d{display:none!important}}
@media(min-width:768px) and (max-width:1024px){.hide-t{display:none!important}}
@media(max-width:767px){.hide-m{display:none!important}}

/* entrance animations (only when JS runs) */
.js [data-a]{visibility:hidden}
.js [data-a].in{visibility:visible;animation-duration:1.25s;animation-fill-mode:both}
.js [data-a].in.slow{animation-duration:2s}
.js [data-a=fadeIn].in{animation-name:fadeIn}
.js [data-a=fadeInDown].in{animation-name:fadeInDown}
.js [data-a=fadeInUp].in{animation-name:fadeInUp}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}
@keyframes fadeInUp{from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}

/* page transition */
.pt{display:none}
.js .pt{position:fixed;inset:0;z-index:99999;background:#fff;display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .5s ease;pointer-events:none}
.js .pt svg{display:none}
.js.ready .pt{opacity:0}
.js.leaving .pt{opacity:1;pointer-events:auto}
@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}

@media(prefers-reduced-motion:reduce){
.js [data-a]{visibility:visible}
.js [data-a].in{animation:none}
.line i{animation:none}
.js .pt{transition:none}
}

/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* bigger tap targets */
.burger{width:44px;height:44px}
.burger svg{margin-right:0}
.hdr .logo{padding:8px 0}
.tbtn{padding:10px 0}
.prow a{display:inline-block;padding:6px 0}
.foot .ft a,.ci a,main a[href^="tel:"],main a[href^="mailto:"]{display:inline-block;padding:10px 0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ts{margin:6px 0 14px;min-height:0}
.fmsg{margin:14px 0 0;font-size:16px;line-height:1.4}.fmsg.ok{color:#2f6b3a}.fmsg.bad{color:#a12b2b}