/* ZI Woodcraft · a walnut cabinet: dark oiled wood, brass hardware, cream lettering. Mobile first. */
@font-face{font-family:"Marcellus";src:url("fonts/marcellus.woff2") format("woff2");font-display:swap}
@font-face{font-family:"Jost";src:url("fonts/jost-var.woff2") format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Markazi";src:url("fonts/markazi-400.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:"Markazi";src:url("fonts/markazi-500.woff2") format("woff2");font-weight:500 700;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}

:root{
  --w900:#140D09;--w800:#1F150F;--w700:#2B1E15;--cream:#EFE6D8;--soft:#D7C7B2;--oak:#C2A07C;--brass:#C9A36B;--brass-deep:#8C6A38;
  --linen:#E8DDCB;--ink:#2B1E15;--ink-soft:#5E4634;
  --ease:cubic-bezier(.16,1,.3,1);
  --zi-display:"Marcellus",Georgia,serif;--zi-text:"Jost",system-ui,sans-serif;
  --zi-gutter:20px;--zi-max:1200px;--zi-head:64px;
}
.zi-ar{--zi-display:"Markazi","Marcellus",serif;--zi-text:"Markazi","Jost",serif}

html{scroll-padding-top:var(--zi-head);background:var(--w900)}
body.zi{margin:0;background:var(--w800);color:var(--cream);font:400 17px/1.7 var(--zi-text);-webkit-font-smoothing:antialiased;padding-bottom:76px}
body.zi-ar{font-size:22px;line-height:1.75}
.zi-ar .elementor-widget-text-editor{font-size:22px}
.zi-ar h3.elementor-heading-title{font-size:clamp(25px,4.4vw,30px)}
.zi ::selection{background:var(--brass);color:var(--w900)}
.zi a{color:inherit}
.zi :focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.zi svg{width:1em;height:1em;flex:none}
.zi-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.zi-ltr{direction:ltr;unicode-bidi:isolate;white-space:nowrap}
.zi-skip{position:fixed;inset-inline-start:12px;top:-60px;z-index:100;background:var(--brass);color:var(--w900);padding:10px 14px;text-decoration:none}
.zi-skip:focus{top:12px}

/* type in Elementor widgets */
.zi .elementor-heading-title{font-family:var(--zi-display);font-weight:400;color:var(--cream);letter-spacing:.005em;line-height:1.15;text-wrap:balance}
.zi-ar .elementor-heading-title{font-weight:500;line-height:1.4}
.zi h1.elementor-heading-title{font-size:clamp(36px,8.4vw,72px)}
.zi h2.elementor-heading-title{font-size:clamp(28px,5.6vw,46px)}
.zi h3.elementor-heading-title{font-size:clamp(21px,3.6vw,26px)}
.zi-ar h1.elementor-heading-title{font-size:clamp(38px,9vw,74px)}
.zi-ar h2.elementor-heading-title{font-size:clamp(30px,6vw,48px)}
.zi .elementor-widget-text-editor{color:var(--soft);font-family:var(--zi-text);max-width:62ch}
.zi .elementor-widget-text-editor p{margin:0 0 .8em}
.zi .elementor-widget-text-editor p:last-child{margin-bottom:0}
.zi .elementor-widget-text-editor ul{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.zi .elementor-widget-text-editor li{position:relative;padding-inline-start:26px}
.zi .elementor-widget-text-editor li::before{content:"";position:absolute;inset-inline-start:0;top:.72em;width:12px;height:1px;background:var(--brass)}
.zi .elementor-widget-text-editor a{color:var(--cream);text-decoration-color:rgba(201,163,107,.6);text-underline-offset:.25em}
.zi-eyebrow .elementor-widget-container,.zi-eyebrow{font:500 12px/1.4 "Jost",sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--oak)}
.zi-ar .zi-eyebrow,.zi-ar .zi-eyebrow .elementor-widget-container{font:500 17px/1.4 "Markazi",serif;letter-spacing:0}
.zi-lead{font-size:1.08em}
.zi-more a{font:500 13px/1 "Jost";letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--brass);border-bottom:1px solid currentColor;padding-bottom:4px}
.zi-ar .zi-more a{font:500 18px/1 "Markazi";letter-spacing:0}

/* buttons: Elementor button widget and our own */
.zi .elementor-button,.zi-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:50px;padding:0 24px;border-radius:0;border:1px solid rgba(239,230,216,.5);background:transparent;color:var(--cream);font:500 13px/1 "Jost",sans-serif;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;position:relative;overflow:hidden;transition:background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease),transform .5s var(--ease)}
.zi-ar .elementor-button,.zi-ar .zi-btn{font:500 18px/1 "Markazi",serif;letter-spacing:0}
.zi .elementor-button:hover,.zi-btn:hover{border-color:var(--brass);color:var(--brass)}
.zi .zi-brass .elementor-button,.zi-btn--brass{background:var(--brass);border-color:var(--brass);color:var(--w900)}
.zi .zi-brass .elementor-button:hover,.zi-btn--brass:hover{background:var(--cream);border-color:var(--cream);color:var(--w900)}
.zi .elementor-button::after,.zi-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,244,220,.55) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}
.zi .zi-lit .elementor-button::after,.zi-btn.zi-lit::after{transition:transform .9s var(--ease);transform:translateX(120%)}
.zi-btns .elementor-widget-wrap,.zi-btns.e-con{gap:12px!important}

/* header */
.zi-head{position:sticky;top:0;z-index:40;height:var(--zi-head);display:flex;align-items:center;gap:18px;padding:0 var(--zi-gutter);background:rgba(20,13,9,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(201,163,107,.18)}
.zi-brand{display:flex;align-items:center;height:100%}
.zi-brand img{display:block;height:48px;width:auto}
.zi-nav{display:none}
.zi-head__end{margin-inline-start:auto;display:flex;align-items:center;gap:14px}
.zi-lang{font:500 15px/1 "Markazi",serif;color:var(--soft);text-decoration:none;padding:8px 2px}
.zi-ar .zi-lang{font:500 13px/1 "Jost",sans-serif;letter-spacing:.08em}
.zi-head__book{display:none}
.zi-burger{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(239,230,216,.35);background:none;color:var(--cream);cursor:pointer}
.zi-burger svg{width:20px;height:20px}
.zi-sheet{position:fixed;inset:0;z-index:60;background:rgba(10,7,5,.6)}
.zi-sheet__panel{position:absolute;inset:auto 0 0;background:var(--w900);padding:20px var(--zi-gutter) calc(28px + env(safe-area-inset-bottom));border-top:1px solid rgba(201,163,107,.3);animation:zi-up .5s var(--ease)}
@keyframes zi-up{from{transform:translateY(100%)}}
.zi-sheet__close{display:grid;place-items:center;width:44px;height:44px;margin-inline-start:auto;background:none;border:0;color:var(--cream);cursor:pointer}
.zi-sheet__close svg{width:22px;height:22px}
.zi-sheet__nav{display:grid;margin:6px 0 18px}
.zi-sheet__nav a{font:400 28px/1.2 var(--zi-display);text-decoration:none;padding:12px 0;border-bottom:1px solid rgba(201,163,107,.15)}
.zi-sheet__nav a[aria-current]{color:var(--brass)}

/* bottom dock on phones: WhatsApp first */
.zi-dock{position:fixed;inset:auto 10px calc(10px + env(safe-area-inset-bottom));z-index:45;display:grid;grid-template-columns:minmax(0,1fr) 54px minmax(0,.7fr);gap:8px}
.zi-dock a{display:flex;align-items:center;justify-content:center;gap:.55em;min-height:54px;text-decoration:none;font:500 13px/1 "Jost";letter-spacing:.12em;text-transform:uppercase;box-shadow:0 10px 30px rgba(0,0,0,.45);position:relative;overflow:hidden;transition:transform .25s var(--ease)}
.zi-ar .zi-dock a{font:500 18px/1 "Markazi";letter-spacing:0}
.zi-dock a:active{transform:scale(.97)}
.zi-dock svg{width:20px;height:20px}
.zi-dock__wa{background:var(--brass);color:var(--w900)}
.zi-dock__wa::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,246,226,.75) 50%,transparent 65%);transform:translateX(-130%);animation:zi-shine 6s var(--ease) 2s infinite}
@keyframes zi-shine{0%{transform:translateX(-130%)}22%,100%{transform:translateX(130%)}}
.zi-dock__call,.zi-dock__book{background:var(--w900);color:var(--cream);border:1px solid rgba(239,230,216,.35)}

/* sections built in Elementor */
.zi .zi-sec{padding:clamp(72px,12vw,140px) var(--zi-gutter)!important;position:relative}
.zi .zi-sec>.e-con-inner{max-width:var(--zi-max);margin-inline:auto;width:100%}
.zi .zi-linen{background:var(--linen)}
.zi .zi-linen .elementor-heading-title{color:var(--ink)}
.zi .zi-linen .elementor-widget-text-editor{color:var(--ink-soft)}
.zi .zi-deep{background:var(--w900)}

/* hero */
.zi .zi-hero{position:relative;min-height:calc(100svh - var(--zi-head));display:flex;flex-direction:column!important;justify-content:flex-end!important;align-items:stretch!important;padding:0 var(--zi-gutter) clamp(96px,14vw,120px)!important;overflow:hidden;isolation:isolate}
.zi .zi-hero-media{position:absolute!important;inset:0;z-index:-2;margin:0!important;width:100%!important}
.zi .zi-hero-media img,.zi .zi-hero-media .elementor-widget-container{width:100%;height:100%;object-fit:cover}
.zi .zi-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,13,9,.35) 0%,rgba(20,13,9,.55) 38%,rgba(20,13,9,.9) 72%,rgba(20,13,9,.97) 100%)}
.zi .zi-hero>.e-con-inner{max-width:var(--zi-max);margin-inline:auto;width:100%;flex-grow:1;justify-content:flex-end!important}
.zi .zi-hero .elementor-widget-text-editor{color:var(--cream);opacity:.88}
.zi-light-pool{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(240px circle at var(--lx,50%) var(--ly,40%),rgba(255,214,160,.2),transparent 70%);opacity:0;transition:opacity .6s}
.zi-light-on .zi-light-pool{opacity:1}

/* page heads on inner pages */
.zi .zi-pagehead{min-height:62svh}
.zi .zi-pagehead.zi-plain{min-height:auto;align-items:flex-start;padding-top:clamp(72px,12vw,120px)!important;padding-bottom:clamp(40px,6vw,64px)!important}
.zi .zi-pagehead.zi-plain::after{display:none}

/* the 27-year rings */
.zi .zi-rings{position:relative;width:min(300px,78vw);aspect-ratio:1;margin-inline:auto;display:grid;place-items:center}
.zi .zi-rings svg{position:absolute;inset:0;width:100%;height:100%}
.zi .zi-rings circle{fill:none;stroke:var(--oak);stroke-width:1;opacity:.55}
.zi .zi-rings .elementor-heading-title{font-size:clamp(68px,16vw,92px);line-height:1;position:relative}
.zi .zi-rings-cap{text-align:center;font:500 11px/1.6 "Jost";letter-spacing:.24em;text-transform:uppercase;color:var(--oak);margin-top:-6px}
.zi-ar .zi-rings-cap{font:500 21px/1.5 "Markazi";letter-spacing:0}

/* service cards as cabinet doors */
.zi .zi-cards{display:grid!important;grid-template-columns:minmax(0,1fr);gap:22px}
.zi .zi-door{position:relative;text-decoration:none;display:block!important;padding:0!important;perspective:900px}
.zi .zi-door .zi-door-media{aspect-ratio:4/3;overflow:hidden;margin:0!important;position:relative}
.zi .zi-door .zi-door-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.zi .zi-door:hover .zi-door-media img{transform:scale(1.04)}
.zi-leaf{position:absolute;top:0;inset-inline-start:0;width:100%;aspect-ratio:4/3;z-index:2;background:var(--w700) url("walnut.webp") center/cover;transform-origin:0 50%;transform:rotateY(var(--zi-open,0deg));transition:transform .9s var(--ease);box-shadow:inset 0 0 0 1px rgba(201,163,107,.35),inset 0 0 60px rgba(0,0,0,.45);pointer-events:none;will-change:transform}
.zi-ar .zi-leaf{transform-origin:100% 50%;transform:rotateY(calc(var(--zi-open,0deg) * -1))}
.zi-leaf::after{content:"";position:absolute;inset-inline-end:12px;top:calc(50% - 40px);width:4px;height:80px;border-radius:2px;background:linear-gradient(90deg,#8C6A38,#E6C48E 45%,#8C6A38)}
.zi .zi-door{--zi-open:-34deg}
.zi .zi-door.ajar{--zi-open:-80deg}
.zi .zi-door .elementor-widget-heading{margin:16px 0 4px!important}
.zi .zi-door .elementor-widget-text-editor{font-size:.95em}

/* varnish reveal */
.zi .zi-varnish{position:relative;overflow:hidden;margin:0!important}
.zi .zi-varnish img{display:block;width:100%;height:auto}
.zi-varnish-col{position:absolute;inset:0}
.zi-varnish-col img{width:100%;height:100%;object-fit:cover}
.zi-fx .zi-varnish>.elementor-widget-container>img,.zi-fx .zi-varnish>img{filter:grayscale(1) brightness(.72)}
.zi-fx .zi-varnish .zi-varnish-col{clip-path:inset(calc(100% - var(--zi-p,0) * 100%) 0 0 0)}

/* carousel of work */
.zi .zi-rail{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;gap:14px!important;overflow-x:auto;scroll-snap-type:x mandatory;padding:26px calc(50% - 36vw) 30px!important;margin-inline:calc(var(--zi-gutter) * -1);scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab}
.zi .zi-rail::-webkit-scrollbar{display:none}
.zi .zi-rail>.elementor-widget-image{flex:0 0 72vw;width:72vw!important;scroll-snap-align:center;margin:0!important;transform:scale(var(--zi-s,.88));opacity:var(--zi-o,.65);transition:transform .2s linear,opacity .2s linear;will-change:transform}
.zi .zi-rail img{width:100%;aspect-ratio:4/5;object-fit:cover;pointer-events:none;box-shadow:0 18px 40px rgba(0,0,0,.5);transition:transform .6s var(--ease)}
.zi .zi-rail .zoom img{transform:scale(1.9)}
.zi .zi-rail .elementor-widget-container{overflow:hidden}

/* project grid */
.zi .zi-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px!important}
.zi .zi-grid>.elementor-widget-image{margin:0!important;width:100%!important}
.zi .zi-grid img{width:100%;aspect-ratio:4/5;object-fit:cover}

/* process */
.zi .zi-steps{display:grid!important;grid-template-columns:minmax(0,1fr);gap:0!important;counter-reset:step}
.zi .zi-step{padding:26px 0!important;border-top:1px solid rgba(140,106,56,.4);counter-increment:step;position:relative;padding-inline-start:64px!important}
.zi .zi-step::before{content:counter(step,decimal-leading-zero);position:absolute;inset-inline-start:0;top:26px;font:400 34px/1 "Marcellus",serif;color:var(--brass-deep)}

/* plank entry */
.zi-fx .zi-plank{opacity:0;transform:translateY(28px);clip-path:inset(0 100% 0 0);transition:opacity .5s var(--ease),transform .9s var(--ease),clip-path 1s var(--ease)}
.zi-ar.zi-fx .zi-plank,.zi-fx .zi-ar .zi-plank{clip-path:inset(0 0 0 100%)}
.zi-fx .zi-plank.in{opacity:1;transform:none;clip-path:inset(0 0 0 0)}

/* contact */
.zi .zi-contact-grid{display:grid!important;grid-template-columns:minmax(0,1fr);gap:40px!important}
.zi-form{display:grid;gap:16px;padding:22px;background:var(--w700);border:1px solid rgba(201,163,107,.2);min-width:0}
.zi-field{display:grid;gap:6px;min-width:0;margin:0;border:0;padding:0}
.zi-field label,.zi-field legend{font-size:14px;color:var(--soft)}
.zi-ar .zi-field label,.zi-ar .zi-field legend{font-size:18px}
.zi-form input:not([type=radio]):not([type=checkbox]),.zi-form textarea{width:100%;min-height:48px;padding:12px 14px;border:1px solid rgba(239,230,216,.25);border-radius:0;background:var(--w800);color:var(--cream);font:inherit;font-size:16px}
.zi-form input:focus,.zi-form textarea:focus{outline:none;border-color:var(--brass)}
.zi-chips{display:flex;flex-wrap:wrap;gap:8px}
.zi-chips legend{width:100%;margin-bottom:6px}
.zi-chips label{position:relative}
.zi-chips input{position:absolute;opacity:0}
.zi-chips span{display:inline-flex;align-items:center;min-height:42px;padding:0 14px;border:1px solid rgba(239,230,216,.3);font-size:14px;cursor:pointer}
.zi-ar .zi-chips span{font-size:18px}
.zi-chips input:checked+span{background:var(--brass);border-color:var(--brass);color:var(--w900)}
.zi-chips input:focus-visible+span{outline:2px solid var(--brass);outline-offset:2px}
.zi-consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--soft)}
.zi-ar .zi-consent{font-size:18px}
.zi-consent input{width:20px;height:20px;margin-top:3px;accent-color:var(--brass)}
.zi-hp{position:absolute!important;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0);pointer-events:none}
.zi-form__msg{margin:0;font-size:15px;color:var(--brass);min-height:1.4em}
.zi-details a{font-size:1.1em}

/* footer */
.zi-foot{background:var(--w900);border-top:1px solid rgba(201,163,107,.18);padding:56px var(--zi-gutter) 40px}
.zi-foot__in{max-width:var(--zi-max);margin:0 auto;display:grid;gap:18px;justify-items:start}
.zi-foot__brand img{width:150px;height:auto;display:block}
.zi-foot__line{margin:0;color:var(--soft)}
.zi-foot__nav{display:flex;flex-wrap:wrap;gap:8px 22px}
.zi-foot__nav a,.zi-foot__contact a{text-decoration:none;color:var(--cream)}
.zi-foot__contact{margin:0}
.zi-foot__legal{margin:0;font-size:13px;color:#A88A6C;line-height:1.7}
.zi-ar .zi-foot__legal{font-size:16px}

/* desktop */
@media (min-width:900px){
  :root{--zi-gutter:40px;--zi-head:80px}
  body.zi{padding-bottom:0}
  .zi-dock{display:none}
  .zi-brand img{height:60px}
  .zi-nav{display:flex;gap:30px;margin-inline-start:30px}
  .zi-nav a{text-decoration:none;font:500 13px/1 "Jost";letter-spacing:.14em;text-transform:uppercase;color:var(--soft);padding:8px 0;border-bottom:1px solid transparent}
  .zi-ar .zi-nav a{font:500 19px/1 "Markazi";letter-spacing:0}
  .zi-nav a:hover,.zi-nav a[aria-current]{color:var(--cream);border-color:var(--brass)}
  .zi-head__book{display:inline-flex;min-height:44px}
  .zi-burger{display:none}
  .zi .zi-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
  .zi .zi-cards.zi-cards--five{grid-template-columns:repeat(6,minmax(0,1fr))}
  .zi .zi-cards--five>.zi-door{grid-column:span 2}
  .zi .zi-cards--five>.zi-door:nth-child(4){grid-column:2/span 2}
  .zi .zi-rail{padding:30px max(var(--zi-gutter),calc(50% - 560px))!important;margin-inline:0}
  .zi .zi-rail>.elementor-widget-image{flex:0 0 340px;width:340px!important}
  .zi .zi-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px!important}
  .zi .zi-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px!important}
  .zi .zi-step{padding-inline-start:0!important;padding-top:70px!important}
  .zi .zi-step::before{top:22px}
  .zi .zi-contact-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:64px!important}
  .zi .zi-split{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px!important;align-items:center}
  .zi-foot__in{grid-template-columns:auto 1fr;align-items:center;column-gap:56px}
  .zi-foot__brand{grid-row:span 4}
}
/* pointer-only touches */
.zi-cur{position:fixed;left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;border:1.5px solid var(--brass);pointer-events:none;z-index:90;opacity:0;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .35s,opacity .3s}
.zi-cur.big{width:54px;height:54px;margin:-27px 0 0 -27px;background:rgba(201,163,107,.16)}
.zi-has-cur,.zi-has-cur a,.zi-has-cur button{cursor:none}
.zi-has-cur input,.zi-has-cur textarea{cursor:text}

@media (prefers-reduced-motion:reduce){
  .zi *,.zi *::before,.zi *::after{animation:none!important;transition:none!important}
  .zi-leaf,.zi-light-pool,.zi-cur{display:none!important}
  .zi .zi-rail>.elementor-widget-image{transform:none;opacity:1}
}