.hero-actions { display: grid !important; grid-template-columns: 200px auto; align-items: stretch; gap: 14px; }
.hero-action-buttons { display: grid; grid-template-rows: 1fr 1fr; gap: 12px; min-width: 0; }
.hero-action-buttons .badge { display: flex; align-items: center; justify-content: center; width: 100%; }
.hero-action-buttons .badge img, .hero-action-buttons .watch-demo { width: 100%; }
.hero-action-buttons .badge img { height: 100%; object-fit: contain; }
.hero-action-buttons .watch-demo { min-height: 0; }
.hero-download-qr { align-self: stretch; box-sizing: border-box; }
.watch-demo { display: inline-flex; min-height: 59px; align-items: center; justify-content: center; gap: 9px; padding: 0 23px; border: 1px solid var(--green-mid); border-radius: 12px; background: rgba(255,255,255,.74); color: var(--green); box-shadow: var(--shadow-sm); cursor: pointer; font: 700 15px/1 var(--sans); transition: transform .15s ease, border-color .15s ease, background .15s ease; }
.watch-demo:hover { transform: translateY(-1px); border-color: var(--green); background: #fff; }
.watch-demo:focus-visible { outline: 3px solid rgba(70, 119, 93, .3); outline-offset: 3px; }
.watch-demo .youtube-icon { width: 22px; height: 22px; flex: 0 0 auto; }
body.video-modal-open { overflow: hidden; }
.video-modal[hidden] { display: none; }
.video-modal { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 28px; }
.video-modal-backdrop { position: absolute; inset: 0; background: rgba(13, 28, 22, .78); backdrop-filter: blur(8px); }
.video-modal-dialog { position: relative; width: min(960px, 100%); overflow: hidden; border: 1px solid rgba(255,255,255,.16); border-radius: 22px; background: #f7f4ed; box-shadow: 0 34px 90px rgba(0,0,0,.42); }
.video-modal-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 20px 16px 24px; }
.video-modal-heading .kicker { margin-bottom: 4px; }
.video-modal-heading h2 { font-family: var(--serif); font-size: 24px; line-height: 1.1; }
.video-modal-close { display: grid; flex: 0 0 auto; width: 42px; height: 42px; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--ink); cursor: pointer; }
.video-modal-close:hover { border-color: var(--green-mid); }
.video-modal-close:focus-visible { outline: 3px solid rgba(70, 119, 93, .3); outline-offset: 2px; }
.video-modal-close svg { width: 20px; height: 20px; }
.video-modal-player { position: relative; aspect-ratio: 16 / 9; background: #0c1813; }
.video-modal-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

@media (max-width: 900px) {
  .hero-actions { grid-template-columns: minmax(0, 240px); }
  .hero-action-buttons { grid-template-rows: auto auto; }
  .hero-action-buttons .badge img { height: auto; }
}

@media (max-width: 700px) {
  .hero-actions { width: min(240px, 100%); margin-right: auto; margin-left: auto; gap: 0; }
  .hero-action-buttons .badge img { max-width: none; }
  .watch-demo { min-height: 56px; padding: 0 16px; }
  .video-modal { padding: 14px; }
  .video-modal-dialog { border-radius: 16px; }
  .video-modal-heading { padding: 14px 14px 12px 17px; }
  .video-modal-heading h2 { font-size: 20px; }
  .video-modal-close { width: 38px; height: 38px; }
}
