.honeycomb-section{padding:128px 0;background:#f7f5f0;overflow:hidden}
.honeycomb-heading{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:90px;align-items:end;margin-bottom:34px}
.honeycomb-heading h2{font-size:clamp(46px,5.8vw,82px)}
.honeycomb-heading>p{margin:0 0 8px;color:#575a55;font-size:14px;line-height:1.75}
.honeycomb-stage{position:relative;width:100%;aspect-ratio:5/3;min-height:680px}
.honeycomb-product{position:absolute;z-index:1;left:20.5%;top:14%;width:59%;height:72%;display:grid;place-items:center;transition:filter .35s ease,transform .35s ease}
.honeycomb-product img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.honeycomb-section.has-active .honeycomb-product{filter:contrast(1.08) saturate(1.04);transform:scale(1.008)}
.honeycomb-map{position:absolute;z-index:2;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.map-feature path{fill:none;stroke:#8d897f;stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke .25s ease,stroke-width .25s ease}
.map-point{fill:#f7f5f0;stroke:#ad792f;stroke-width:2;opacity:0;transition:fill .25s ease,transform .25s ease;transform-box:fill-box;transform-origin:center}
.map-glow{fill:#bd8231;opacity:0;transition:opacity .3s ease}
.honeycomb-section.is-visible .map-feature path{animation:honeycomb-line 1.15s cubic-bezier(.22,.72,.19,1) forwards}
.honeycomb-section.is-visible .map-feature:nth-child(2) path{animation-delay:.08s}
.honeycomb-section.is-visible .map-feature:nth-child(3) path{animation-delay:.16s}
.honeycomb-section.is-visible .map-feature:nth-child(4) path{animation-delay:.24s}
.honeycomb-section.is-visible .map-feature:nth-child(5) path{animation-delay:.32s}
.honeycomb-section.is-visible .map-feature:nth-child(6) path{animation-delay:.4s}
.honeycomb-section.is-visible .map-point{animation:honeycomb-point .35s ease .72s forwards}
.map-feature.is-active path{stroke:#ad792f;stroke-width:2}
.map-feature.is-active .map-point{fill:#ad792f;transform:scale(1.35)}
.map-feature.is-active .map-glow{opacity:.1}
.honeycomb-callout{position:absolute;z-index:3;width:245px;padding:0;border:0;background:transparent;color:#151816;text-align:left;cursor:default;opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease,color .25s ease}
.honeycomb-section.is-visible .honeycomb-callout{opacity:1;transform:none}
.honeycomb-callout:nth-of-type(2){transition-delay:.08s}.honeycomb-callout:nth-of-type(3){transition-delay:.16s}.honeycomb-callout:nth-of-type(4){transition-delay:.24s}.honeycomb-callout:nth-of-type(5){transition-delay:.32s}.honeycomb-callout:nth-of-type(6){transition-delay:.4s}
.honeycomb-callout span{display:block;margin-bottom:10px;color:#ad792f;font:500 9px/1 var(--mono);letter-spacing:.16em}
.honeycomb-callout strong{display:block;font:600 22px/1.06 var(--display);letter-spacing:-.035em}
.honeycomb-callout small{display:block;margin-top:8px;color:#686b65;font:400 11px/1.55 var(--sans)}
.honeycomb-callout:is(:hover,:focus-visible,.is-active){color:#ad792f;outline:none}
.honeycomb-callout:is(:hover,:focus-visible,.is-active) small{color:#3f423e}
.callout-1{left:0;top:8%}.callout-2{left:0;top:38%}.callout-3{left:0;top:72%}.callout-4{right:0;top:10%}.callout-5{right:0;top:42%}.callout-6{right:0;top:74%}
.honeycomb-specimens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,64px);margin-top:12px;padding-top:40px;border-top:1px solid rgba(16,19,17,.16)}
.honeycomb-specimens figure{display:flex;align-items:center;justify-content:center;gap:16px;min-width:0;margin:0}
.specimen{position:relative;display:block;width:94px;height:82px;overflow:hidden;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:#e7e3da}
.specimen svg{display:block;width:100%;height:100%}
.honeycomb-specimens figcaption{display:grid;gap:6px}
.honeycomb-specimens figcaption b{color:#ad792f;font:500 9px/1 var(--mono);letter-spacing:.14em}
.honeycomb-specimens figcaption span{max-width:130px;font:600 15px/1.25 var(--sans)}
@keyframes honeycomb-line{to{stroke-dashoffset:0}}
@keyframes honeycomb-point{to{opacity:1}}
@media(max-width:980px){
  .honeycomb-section{padding:92px 0}
  .honeycomb-heading{grid-template-columns:1fr;gap:24px;margin-bottom:52px}
  .honeycomb-heading>p{max-width:620px}
  .honeycomb-stage{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;aspect-ratio:auto;min-height:0}
  .honeycomb-product{position:relative;left:auto;top:auto;grid-column:1/-1;width:100%;height:auto;min-height:340px;margin-bottom:26px}
  .honeycomb-product img{max-height:520px}
  .honeycomb-map{display:none}
  .honeycomb-callout{position:relative;left:auto;right:auto;top:auto;width:auto;min-height:138px;padding:21px 4px 22px;border-top:1px solid rgba(16,19,17,.18);opacity:1;transform:none;transition:color .25s ease}
  .honeycomb-callout strong{font-size:21px}
  .honeycomb-section.has-active .honeycomb-product{filter:none;transform:none}
  .honeycomb-specimens{gap:22px}
  .honeycomb-specimens figure{align-items:flex-start;flex-direction:column;justify-content:flex-start}
}
@media(max-width:600px){
  .honeycomb-section{padding:76px 0}
  .honeycomb-heading h2{font-size:clamp(39px,12vw,54px)}
  .honeycomb-stage{grid-template-columns:1fr}
  .honeycomb-product{grid-column:auto;min-height:245px;margin:0 -12px 24px;width:calc(100% + 24px)}
  .honeycomb-callout{min-height:0;padding:18px 0 20px}
  .honeycomb-callout small{font-size:12px}
  .honeycomb-specimens{grid-template-columns:1fr;gap:0;margin-top:20px;padding-top:8px}
  .honeycomb-specimens figure{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid rgba(16,19,17,.12)}
  .specimen{width:92px;height:80px}
  .honeycomb-specimens figcaption span{max-width:none;font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  .map-feature path{stroke-dashoffset:0;animation:none!important}
  .map-point{opacity:1;animation:none!important}
  .honeycomb-callout{opacity:1;transform:none;transition:none}
}