.hero{position:relative;isolation:isolate}
.logo .formwork-mark,.glass-name .formwork-mark{display:inline-block;width:6.03em;height:.75em;vertical-align:baseline;overflow:visible;shape-rendering:geometricPrecision}
.header .logo .formwork-mark{display:none}
.header .logo::before{content:"";display:block;width:clamp(195px,18vw,235px);aspect-ratio:308/48;background:url("formwork-logo-h-black.svg?v=20261015-logo-h") center/contain no-repeat}
.footer .logo .formwork-mark{display:none}
.footer .logo::before{content:"";display:block;width:clamp(150px,16vw,190px);aspect-ratio:308/48;background:url("formwork-logo-h-black.svg?v=20261015-logo-h") center/contain no-repeat}
.wordmark-brush{animation:wordmark-ink-turn 14s linear infinite}
@keyframes wordmark-ink-turn{to{stroke-dashoffset:-100}}
@media(prefers-reduced-motion:reduce){.wordmark-brush{animation:none}}
.hero-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden;contain:layout paint;z-index:-1;mask-image:linear-gradient(90deg,#0005 0%,#0006 38%,#000c 67%,#000 100%)}
.hero-motion-canvas{display:block;width:100%;height:100%}
.hero-glass{position:absolute;left:64%;top:15%;width:31%;height:44%;box-sizing:border-box;padding:20px 22px;opacity:0;display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.85);background:linear-gradient(135deg,rgba(255,255,255,.57),rgba(246,245,239,.28));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 8px 24px rgba(35,40,33,.07),inset 0 0 0 1px rgba(66,71,61,.12);color:#30372e}
.glass-top,.glass-foot{display:flex;justify-content:space-between;align-items:center;font:8px/1.4 Arial,sans-serif;letter-spacing:.09em}
.glass-top{padding-bottom:10px;border-bottom:1px solid #38433130}
.glass-name{font:750 clamp(18px,2.8vw,42px)/1 Arial,sans-serif;letter-spacing:-.055em;margin-top:14px}
.glass-name>span{font-size:9px;vertical-align:top;margin-left:3px}
.glass-caption{font:8px/1.4 Arial,sans-serif;letter-spacing:.15em;margin-top:7px}
.glass-layout{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:9px;flex:1;min-height:36px;margin:12px 0}
.glass-layout>span{border:1px solid #38433140;background:rgba(255,255,255,.13)}
.glass-layout>span:first-child{background:linear-gradient(145deg,transparent 49%,#38433130 50%,transparent 51%)}
.glass-foot{font-size:7px;border-top:1px solid #38433130;padding-top:7px}
.glass-foot b{color:#cf492b;font-size:15px}
.glass-corner{position:absolute;width:6px;height:6px;border-radius:50%;background:#41483d;transform:translate(-50%,-50%);pointer-events:none}
.glass-corner-tl{left:-.5px;top:-.5px}
.glass-corner-tr{left:calc(100% + .5px);top:-.5px}
.glass-corner-bl{left:-.5px;top:calc(100% + .5px)}
.glass-corner-br{left:calc(100% + .5px);top:calc(100% + .5px)}
@media(max-width:768px){.hero-glass{left:58%;width:35%;padding:9px;height:30%;top:18%}.glass-top{font-size:5px;padding-bottom:6px}.glass-top>span:last-child{display:none}.glass-name{font-size:17px;margin-top:10px}.glass-caption{font-size:5px}.glass-foot{font-size:5px}.glass-layout{margin:8px 0;gap:4px;min-height:12px}}
@media(max-width:1000px){.hero-motion-canvas{opacity:.95}}
@media(min-width:769px){
  /* Keep the ambient background quiet without fading the foreground panel. */
  .hero-motion{mask-image:none}
  .hero-motion-canvas{mask-image:linear-gradient(90deg,#0005 0%,#0006 38%,#000c 67%,#000 100%)}
  .hero-glass{color:#20241f;border-color:rgba(74,83,66,.32);background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(246,245,239,.52));box-shadow:0 8px 24px rgba(35,40,33,.1),inset 0 0 0 1px rgba(255,255,255,.65)}
  .glass-top,.glass-foot{border-color:rgba(56,67,49,.32)}
  .glass-layout>span{border-color:rgba(56,67,49,.42)}
}
@media(max-width:768px){
  /* Fade background geometry only: the glass panel keeps its own contrast. */
  .hero-motion{mask-image:none}
  .hero-motion-canvas{opacity:.85;mask-image:linear-gradient(180deg,#0005 0%,#0006 52%,#000b 100%)}
  .hero-glass{color:#20241f;border-color:rgba(74,83,66,.4);background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(246,245,239,.64));box-shadow:0 6px 18px rgba(35,40,33,.1),inset 0 0 0 1px rgba(255,255,255,.65)}
  .glass-top,.glass-foot{border-color:rgba(56,67,49,.35)}
  .glass-layout>span{border-color:rgba(56,67,49,.5)}
}
@media(prefers-reduced-motion:reduce){.hero-motion{pointer-events:none}}
