/* Corbel hero: framed etch panel (layout after browserbase.com's hero, in Corbel's palette). */
.hero{min-height:0}
/* Same column as the nav and the .sec content below: 1320 max with a 40px gutter (20px ≤900px). */
.cbh{--blue:#2F6BFF;position:relative;width:100%;max-width:1320px;margin:0 auto;padding:6px 40px 40px}
/* Height tracks the 1350:720 artboard ratio of the column width, without forcing the panel
   wider than the column the way aspect-ratio + min-height does. */
.cbh-panel{pointer-events:auto;position:relative;overflow:hidden;height:clamp(560px,calc((min(100vw,1320px) - 80px) * .5333),700px);border-radius:14px;background:#e8ebee;box-shadow:inset 0 0 0 1px rgba(10,10,10,.1),0 34px 64px -40px rgba(10,10,10,.3)}
.cbh-base,.cbh-reveal{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.cbh-base{image-rendering:pixelated;opacity:0;transition:opacity .35s ease-out}
.cbh-panel.is-ready .cbh-base{opacity:1}
.cbh-reveal{z-index:1}

.cbh-copy{position:relative;z-index:2;text-align:center;padding:clamp(52px,7.4%,104px) 24px 0;pointer-events:none}
.cbh-h1{display:inline;margin:0;font:500 clamp(34px,4.4vw,62px)/1.24 var(--display);letter-spacing:-.035em;color:#fff}
.cbh-hl{background:var(--blue);padding:.02em .2em .06em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.cbh-sub{display:block;width:fit-content;max-width:min(540px,100%);margin:26px auto 0;padding:7px 12px;border-radius:4px;background:rgba(244,246,247,.94);font-size:17px;line-height:1.5;color:#0a0a0a;text-wrap:balance}
.cbh-ctas{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:24px}
.cbh-btn{pointer-events:auto;display:inline-flex;align-items:center;gap:7px;height:42px;padding:0 18px;border-radius:999px;background:#0a0a0a;color:#fff;font:600 14px/1 var(--sans);text-decoration:none;transition:background-color .16s ease,color .16s ease}
.cbh-btn:hover{background:var(--blue);color:#fff}
.cbh-btn span{font-size:17px;line-height:0;transform:translateY(-1px)}
.cbh-ghost{background:rgba(255,255,255,.9);color:#0a0a0a;box-shadow:inset 0 0 0 1px rgba(10,10,10,.12)}
.cbh-ghost:hover{background:#fff;color:#0a0a0a}

.cbh-stats{position:absolute;z-index:2;left:18px;bottom:18px;display:flex;gap:8px;margin:0;pointer-events:none}
.cbh-stats div{display:flex;align-items:baseline;gap:8px;padding:10px 14px;border-radius:8px;background:rgba(244,246,247,.95);box-shadow:0 0 0 1px rgba(10,10,10,.08)}
.cbh-stats dt{font:600 20px/1 var(--display);letter-spacing:-.02em;color:#0a0a0a}
.cbh-stats dd{margin:0;font-size:12.5px;color:var(--mute)}
.cbh-hint{position:absolute;z-index:2;right:18px;bottom:18px;display:flex;align-items:center;gap:9px;margin:0;padding:10px 12px;border-radius:8px;background:rgba(244,246,247,.95);box-shadow:0 0 0 1px rgba(10,10,10,.08);font:500 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:#0a0a0a;pointer-events:none;transition:opacity .5s ease}
.cbh-hint::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px rgba(47,107,255,.25)}
.cbh-hint.is-used{opacity:0}

/* Customer strip: a label then logos in one row, flattened to the ink so mismatched brand
   greys read as one set. Logos are sized by optical weight, not equal height. */
.cbh-customers{display:flex;align-items:center;gap:20px 44px;flex-wrap:wrap;margin-top:28px;padding:0 4px}
.cbh-customers-lbl{margin:0;font:500 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.cbh-customers ul{display:flex;align-items:center;gap:44px;margin:0;padding:0;list-style:none}
.cbh-customers img{display:block;width:auto;filter:grayscale(1) brightness(.35);opacity:.78;transition:opacity .2s ease,filter .2s ease}
.cbh-customers li:hover img{filter:none;opacity:1}
.cbh-logo-essentia{height:22px}
.cbh-logo-incubis{height:34px}

@media (hover:none),(max-width:960px){.cbh-hint{display:none}}
@media (max-width:900px){.cbh{padding:0 20px 32px}}
@media (max-width:767px){
  .cbh-panel{height:auto;min-height:660px}
  .cbh-copy{padding-top:48px}
  .cbh-sub{font-size:15.5px}
  .cbh-stats{left:12px;right:12px;bottom:12px}
  .cbh-stats div{flex:1;flex-direction:column;gap:4px}
}
