/* Gesture Enterprises layer. Loaded after base.css, so these win. */

/* Exalted (Zafara Studios). DEMO file: personal use only, one weight, and no punctuation.
   unicode-range keeps punctuation on the fallback font so it never shows as empty boxes.
   Buy the commercial web license and swap in the full files before the site goes live. */
@font-face{font-family:'Exalted'; src:url('/exalted-demo.ttf') format('truetype'); font-weight:100 900; font-display:swap;
  unicode-range:U+0020,U+0030-0039,U+0041-005A,U+0061-007A;}
html{font-synthesis:none;}
/* the demo has one weight, so keep every fallback character at that weight too */
.page *{font-weight:400 !important;}
:root{
  --ink:#000; --body:#2b2b2b; --muted:#5c5c5c; --hair:#e2e2e2; --ground:#fff;
  /* black and white theme: every family color is black. The -t twin is the same for type. */
  --media:#000;  --media-t:#000;
  --tech:#000;   --tech-t:#000;
  --expo:#000;   --expo-t:#000;
  --supply:#000; --supply-t:#000;
  --gestr:#000;
}

/* plain white page, no color wash */
.page,.page.is-paper{background:#fff;}
.page::before{background:none !important;}

/* the rainbow bars from the old design become solid black */
.workpanel::before,.spanel--bar::before{background:#000 !important;}
.formerr{color:#000; font-weight:600;}

/* header logo */
.brand{display:flex; align-items:center; text-decoration:none;}
.brand .blogo{height:38px; width:auto; display:block;}
@media(max-width:420px){ .brand .blogo{height:32px;} }

/* hero logo */
.hero .glogo{margin:0 auto clamp(18px,2vw,26px);}
.hero .glogo img{width:clamp(240px,34vw,398px); height:auto; display:block; margin:0 auto;}

/* black footer with the white logo */
footer{background:#000; border-top:none; color:#fff;}
.foot-brand .flogo{height:auto; width:clamp(180px,16vw,220px); display:block;}
@media(max-width:900px){ .foot-brand .flogo{margin:0 auto;} }
footer .foot-brand .foot-tag,footer .fcol a,footer .foot-brand .foot-email{color:#d6d6d6;}
footer .foot-seal,footer .foot-bar,footer .foot-bar a,footer .fcol .fsub,footer .fcol .fnote,footer .fcol .soonlink{color:#a8a8a8;}
footer .fcol .fh,footer .foot-sign{color:#fff;}
footer .fcol a:hover,footer .foot-bar a:hover,footer .foot-email:hover{color:#fff;}
footer .foot-brand .foot-email{border-bottom-color:#555;}
footer .foot-brand .foot-email:hover{border-bottom-color:#fff; color:#fff;}
footer .foot-bar{border-top-color:#333;}

.nav a[aria-current="page"]{border-bottom-color:var(--ink);}

/* hero mark */
.hero .gmark{width:clamp(120px,15vw,190px); height:auto; display:block; margin:0 auto clamp(18px,2vw,26px);}
.hero .gname{font-family:'Exalted','Poppins',var(--font-ui); font-weight:600; color:var(--ink); letter-spacing:-0.03em;
  font-size:clamp(2.2rem,5vw,3.6rem); line-height:1; margin:0 0 clamp(14px,1.6vw,20px);}
.hero .gname span{font-weight:500; color:var(--muted);}

/* division title in place of an image lockup */
.lockup-t{font-family:'Exalted','Poppins',var(--font-ui); font-weight:600; color:var(--ink); letter-spacing:-0.03em;
  font-size:clamp(2.2rem,5.4vw,4rem); line-height:1.04; margin:0;}
.lockup-t span{color:var(--ct,var(--ink));}

/* leadership card without a photo yet */
.person .ph--mark{display:flex; align-items:center; justify-content:center; background:#f2f2f2;}
.person .ph--mark svg{width:46%; height:auto;}

/* covenant verse */
.verse{font-family:var(--font-creed); font-style:italic; color:var(--ink); font-size:clamp(1.2rem,2.2vw,1.6rem);
  line-height:1.4; max-width:40ch; margin:28px auto 0; text-align:center;}
.verse cite{display:block; margin-top:10px; font-style:normal; font-family:var(--font-label); text-transform:uppercase;
  letter-spacing:0.18em; font-size:0.66rem; font-weight:600; color:var(--muted);}

/* status tags on the engine cards */
.stag{display:inline-block; margin-top:12px; font-family:var(--font-label); text-transform:uppercase; letter-spacing:0.14em;
  font-size:0.6rem; font-weight:700; padding:5px 9px; border-radius:999px; background:#f2f2f2; color:var(--ink);}
.stag--on{background:#000; color:#fff;}
.stag--next{background:#fff; color:#000; box-shadow:inset 0 0 0 1px #000;}

/* home headline: one phrase per line */
.hero .creed span{display:block;}

/* scrolling words: the word at the center lights up, the strip pauses on hover */
.marquee .track span{color:#b3b3b3; transition:color .35s ease;}
.marquee .track span.lit{color:#000;}
.marquee .track span::after{color:#d0d0d0;}
.marquee:hover .track{animation-play-state:paused;}
@media (prefers-reduced-motion:reduce){
  .marquee{-webkit-mask-image:none; mask-image:none;}
  .marquee .track{display:flex; flex-wrap:wrap; justify-content:center; row-gap:14px; white-space:normal; padding:0 16px;}
  .marquee .track span{color:#5c5c5c;}
  .marquee .track span.dup{display:none;}
}

/* hero video: a quiet black and white layer behind the headline (only when public/hero-hands.mp4 exists) */
.hero{position:relative; isolation:isolate;}
.hero-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-1;
  filter:grayscale(1) contrast(1.05); opacity:.14; pointer-events:none;}
@media (prefers-reduced-motion:reduce){ .hero-video{display:none;} }

/* engine demo clip (only when public/engine-demo.mp4 exists) */
.demo{max-width:760px; margin:clamp(28px,4vw,48px) auto 0; text-align:left;}
.demo video{width:100%; display:block; border:1px solid var(--hair); background:#000; filter:grayscale(1);}
.demo figcaption{margin-top:12px; color:var(--body); font-size:.95rem; line-height:1.5;}

/* coming soon page: the home hero on its own, filling the screen */
.is-bare .hero.soon{min-height:100vh; min-height:100svh; display:flex; flex-direction:column; justify-content:center;
  padding-top:clamp(40px,7vh,90px); padding-bottom:clamp(20px,3vh,32px);}
.soon-block{margin-top:clamp(26px,4vh,44px);}
.soon-made{font-size:clamp(1.05rem,1.6vw,1.3rem); color:var(--ink); margin:0;}
.soon-tag{display:inline-block; margin-top:16px; padding:8px 18px; border:1px solid #000; font-family:var(--font-label);
  text-transform:uppercase; letter-spacing:0.24em; font-size:0.72rem; color:#000;}
.soon-contact{margin-top:18px; color:var(--body); font-size:0.95rem;}
.soon-contact a{color:var(--ink); text-decoration:none; border-bottom:1px solid var(--hair);}
.soon-contact a:hover{border-bottom-color:var(--ink);}
.soon .marquee{margin-top:clamp(30px,5vh,56px);}
.soon-foot{margin-top:clamp(18px,3vh,28px); font-family:var(--font-label); text-transform:uppercase; letter-spacing:0.13em;
  font-size:0.6rem; color:var(--muted);}

/* coming soon: four photos of the work, black and white until you point at one */
.soon-work{list-style:none; margin:clamp(34px,5vh,56px) auto 0; padding:0; width:100%; max-width:1100px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(10px,1.4vw,18px);}
.soon-work figure{margin:0;}
.soon-work img{width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; display:block; filter:grayscale(1) contrast(1.05);
  transition:filter .5s ease, transform .5s ease;}
.soon-work li{overflow:hidden;}
.soon-work li:hover img{filter:none; transform:scale(1.03);}
.soon-work figcaption{margin-top:10px; font-family:var(--font-label); text-transform:uppercase; letter-spacing:0.2em;
  font-size:0.62rem; color:var(--muted); text-align:left;}
@media (max-width:760px){ .soon-work{grid-template-columns:repeat(2,1fr);} }
@media (prefers-reduced-motion:reduce){ .soon-work img{transition:none;} .soon-work li:hover img{transform:none;} }

/* coming soon v2: the line above the photos is their title, and the email is a clear button */
.soon .soon-tag{align-self:center; margin-top:clamp(22px,3.5vh,36px);}
.soon-showcase{width:100%; max-width:1100px; margin:clamp(48px,7vh,80px) auto 0; padding:0;}
.soon-showcase .soon-made{font-family:'Exalted','Poppins',var(--font-ui); color:var(--ink); line-height:1.2; letter-spacing:-0.01em;
  font-size:clamp(1.6rem,3.2vw,2.5rem); margin:0 0 clamp(18px,2.6vw,30px); text-wrap:balance;}
.soon-showcase .soon-work{margin-top:0;}
.soon-mail{margin-top:clamp(44px,6vh,70px); display:flex; flex-direction:column; align-items:center; gap:14px;}
.soon-mail-k{margin:0; font-family:var(--font-label); text-transform:uppercase; letter-spacing:0.24em; font-size:0.72rem; color:var(--muted);}
.soon-mail-a{display:inline-flex; align-items:center; gap:14px; padding:18px 30px; background:#000; color:#fff; text-decoration:none;
  font-size:clamp(1.05rem,2.2vw,1.5rem); letter-spacing:0.01em; border:1px solid #000; transition:background .2s ease, color .2s ease;
  max-width:100%; overflow-wrap:anywhere;}
.soon-mail-a svg{width:1.3em; height:1.3em; flex:none;}
.soon-mail-a:hover,.soon-mail-a:focus-visible{background:#fff; color:#000;}
.soon-mail-a:focus-visible{outline:3px solid #000; outline-offset:3px;}
@media (max-width:420px){ .soon-mail-a{padding:14px 18px; gap:10px;} }

/* email copy button */
button.soon-mail-a{font:inherit; font-size:clamp(1.05rem,2.2vw,1.5rem); cursor:pointer;}
.soon-mail-a.copied{background:#fff; color:#000;}
.soon-mail-s{margin:0; min-height:1.4em; font-size:0.85rem; color:var(--muted);}

/* coming soon v3: photos sit closer to the headline; the tagline closes the page under the email, larger */
.is-bare .hero.soon{padding-top:clamp(28px,5vh,64px);}
.soon-showcase{margin-top:clamp(28px,4.5vh,48px);}
.soon-sig{margin:clamp(28px,4.5vh,46px) 0 0; font-family:var(--font-creed); font-style:italic; color:var(--ink);
  font-size:clamp(1.6rem,3.4vw,2.6rem); line-height:1.2;}

/* coming soon: logo and tagline line at 3x */
.soon .glogo img{width:min(1194px,92vw);}
.soon .mec{font-size:clamp(11px,2.35vw,35px); letter-spacing:0.2em; line-height:1.3; text-wrap:balance; max-width:min(1194px,92vw);
  margin-top:clamp(8px,1vw,14px);}

/* coming soon: headline spreads across the same width as the logo */
.soon .herostmt{max-width:min(1194px,92vw); width:100%;}
.soon .creed{max-width:none; white-space:normal; text-wrap:balance; font-size:clamp(1.5rem,3.6vw,3.3rem); line-height:1.2;}
.soon .creed span{display:inline;}
.soon .creed{text-wrap:wrap; font-size:clamp(1.35rem,3.3vw,3.1rem);}
.soon .creed span:first-child{display:block;}
@media (max-width:760px){ .soon .creed{text-wrap:balance;} }

/* coming soon: logo a little smaller (about 80% of the 3x size), tagline line scaled to match */
.soon .glogo img{width:min(960px,88vw);}
.soon .mec{font-size:clamp(11px,1.9vw,28px); max-width:min(960px,92vw);}

/* coming soon: logo at half the previous size, tagline line kept the same width as the logo */
.soon .glogo img{width:min(480px,80vw);}
.soon .mec{font-size:clamp(10px,1.05vw,14px); letter-spacing:0.24em; max-width:min(480px,92vw);}

/* coming soon: sliding words sit right under the photos */
.soon .marquee{margin-top:clamp(20px,3vh,32px);}

/* coming soon: black banner across the bottom */
.is-bare .hero.soon{min-height:auto; padding-bottom:clamp(40px,6vh,64px);}
.soon-banner{background:#000; color:#fff; text-align:center; padding:clamp(48px,8vh,96px) 16px clamp(22px,3vh,32px); border:0;}
.soon-banner-t{margin:0; font-family:var(--font-creed); font-style:italic; color:#fff; font-size:clamp(1.8rem,4.2vw,3.4rem); line-height:1.15;}
.soon-banner-f{margin:clamp(36px,6vh,64px) 0 0; font-family:var(--font-label); text-transform:uppercase; letter-spacing:0.13em;
  font-size:0.6rem; color:#a8a8a8;}

/* coming soon: black banner across the top holding the white logo and the tagline line */
.soon-top{background:#000; color:#fff; text-align:center; padding:clamp(40px,7vh,80px) 16px clamp(34px,5.5vh,60px);}
.soon-top .glogo img{width:min(480px,80vw); height:auto; display:block; margin:0 auto;}
.soon-top .mec{margin:clamp(14px,2vh,22px) auto 0; font-family:var(--font-label); text-transform:uppercase; letter-spacing:0.24em;
  font-size:clamp(10px,1.05vw,14px); color:#d6d6d6; max-width:min(480px,92vw); line-height:1.4;}
.is-bare .hero.soon{padding-top:clamp(36px,6vh,72px);}
.soon .herostmt{margin-top:0;}

/* coming soon: red notice above the headline */
.soon-dev{margin:0 0 clamp(14px,2vh,22px); color:#c8102e; font-family:var(--font-label); text-transform:uppercase;
  letter-spacing:0.24em; font-size:clamp(0.75rem,1.1vw,0.95rem);}
.soon-dev{color:#d00000; font-size:clamp(0.85rem,1.3vw,1.1rem); letter-spacing:0.2em;}
.soon-dev{font-size:clamp(1.1rem,2.2vw,1.8rem); letter-spacing:0.16em; margin-bottom:clamp(16px,2.4vh,26px);}

/* coming soon: a short line under each photo label */
.soon-work figcaption{display:flex; flex-direction:column; gap:4px;}
.soon-work-d{font-family:var(--font-ui); text-transform:none; letter-spacing:0; font-size:0.9rem; line-height:1.4; color:var(--body);}

/* coming soon: founder line with headshot */
.soon-founder{display:flex; align-items:center; justify-content:center; gap:16px; margin-top:clamp(40px,6vh,64px); text-align:left;}
.soon-founder img{width:72px; height:72px; border-radius:50%; object-fit:cover; object-position:50% 25%; filter:grayscale(1); flex:none;}
.soon-founder p{margin:0; display:flex; flex-direction:column; gap:4px;}
.soon-founder-n{font-size:clamp(1.05rem,1.6vw,1.25rem); color:var(--ink);}
.soon-founder-r{font-size:0.88rem; color:var(--muted); line-height:1.4;}
.soon-founder + .soon-mail{margin-top:clamp(28px,4vh,40px);}
.soon-founder img{object-position:50% 50%;}

/* founder photo: the round icon opens the full portrait */
.soon-founder-pic{padding:0; border:0; background:none; border-radius:50%; cursor:zoom-in; flex:none; line-height:0;}
.soon-founder-pic img{transition:filter .3s ease, transform .3s ease;}
.soon-founder-pic:hover img,.soon-founder-pic:focus-visible img{filter:none; transform:scale(1.05);}
.soon-founder-pic:focus-visible{outline:3px solid #000; outline-offset:3px;}
.soon-lightbox{padding:0; border:0; background:transparent; max-width:min(560px,92vw); overflow:visible;}
.soon-lightbox::backdrop{background:rgba(0,0,0,.85);}
.soon-lightbox img{display:block; width:100%; height:auto; max-height:82vh; object-fit:contain;}
.soon-lightbox-c{margin:12px 0 0; color:#fff; text-align:center; font-size:0.95rem;}
.soon-lightbox-x{position:absolute; top:-14px; right:-14px; width:40px; height:40px; border-radius:50%; border:0;
  background:#fff; color:#000; font-size:1.6rem; line-height:1; cursor:pointer;}
.soon-lightbox-x:focus-visible{outline:3px solid #fff; outline-offset:2px;}
.soon-lightbox::backdrop{background:rgba(0,0,0,.94);}

/* coming soon: phone layout */
@media (max-width:600px){
  .soon-top{padding:36px 16px 28px;}
  .soon-top .glogo img{width:min(300px,78vw);}
  .soon-top .mec{font-size:11px; letter-spacing:0.16em; margin-top:12px;}
  .is-bare .hero.soon{padding:32px 16px 40px;}
  .soon-dev{font-size:1rem; letter-spacing:0.14em; margin-bottom:14px;}
  .soon .creed{font-size:1.7rem; line-height:1.2;}
  .soon-showcase{margin-top:32px;}
  .soon-showcase .soon-made{font-size:1.25rem; margin-bottom:16px;}
  .soon-work{gap:14px 12px;}
  .soon-work-d{font-size:0.85rem;}
  .soon .marquee{margin-top:24px; padding:22px 0;}
  .soon-founder{flex-direction:column; text-align:center; gap:12px; margin-top:36px;}
  .soon-founder p{align-items:center;}
  .soon-founder-pic img,.soon-founder img{width:84px; height:84px;}
  .soon-founder + .soon-mail{margin-top:28px;}
  .soon-mail-a{width:100%; justify-content:center; padding:16px 14px; font-size:1.02rem;}
  .soon-banner{padding:44px 16px 24px;}
  .soon-banner-t{font-size:2rem;}
  .soon-banner-f{margin-top:32px; letter-spacing:0.1em;}
}
@media (max-width:600px){ .soon-banner-f span{display:block; line-height:1.9;} .soon-banner-f .sep{display:none;} }

/* coming soon: Devarim 28 Supply Co. logo in the bottom banner */
.soon-banner-logo{display:block; width:clamp(150px,15vw,210px); height:auto; margin:clamp(36px,5.5vh,56px) auto 0;}
.soon-banner-logo + .soon-banner-f{margin-top:clamp(18px,2.6vh,26px);}