/* ==========================================================================
   Hero Standard — shared hero typography + button styling.
   Loaded AFTER global.css. Scoped to `.std-hero` (added to the hero <section>)
   so it overrides per-page hero CSS and gives every hero the same eyebrow / H1 /
   body / supporting text and the same gold-primary + outline-secondary buttons.
   Reference: solutions/smart-room-hospitality-operations.
   Covers both the standard vocabulary (.eyebrow/.body/.supporting/.cta-row/...)
   and the platform landing "lexi-*" vocabulary (.lexi-eyebrow/.lexi-body/...).
   !important is used deliberately: this is an authoritative normalization layer
   that must win over the older per-page hero rules.
   ========================================================================== */

/* --- Hero typography --- */
.std-hero .eyebrow,.std-hero .lexi-eyebrow{
  font-size:24px!important;line-height:1.15!important;font-weight:700!important;
  letter-spacing:.015em!important;text-transform:uppercase!important;
  color:var(--gold)!important;margin:0 0 20px!important;
}
.std-hero h1,.std-hero .lexi-h1{
  font-size:56px!important;line-height:1.05!important;font-weight:500!important;
  letter-spacing:-.037em!important;margin:0;
}
.std-hero .body,.std-hero .lexi-body{font-size:20px!important;line-height:1.55!important}
.std-hero .supporting,.std-hero .support,.std-hero .hero-support{font-size:18px!important;line-height:1.5!important}

/* --- Hero button rows --- */
.std-hero .cta-row,.std-hero .actions,.std-hero .lexi-actions,.std-hero .buttons,
.std-hero .btnrow,.std-hero .btn-row,.std-hero .ctas,.std-hero .btns{
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:32px;
}

/* base button */
.std-hero .cta-row>a,.std-hero .actions>a,.std-hero .lexi-actions>a,.std-hero .buttons>a,
.std-hero .btnrow>a,.std-hero .btn-row>a,.std-hero .ctas>a,.std-hero .btns>a{
  font-size:18px!important;line-height:1!important;font-weight:600!important;
  text-decoration:none!important;padding:17px 22px!important;border-radius:6px!important;
  display:inline-flex!important;align-items:center;gap:12px;white-space:nowrap;
  height:auto!important;min-height:0!important;
}

/* primary — first button in the row: gold fill */
.std-hero .cta-row>a:first-of-type,.std-hero .actions>a:first-of-type,
.std-hero .lexi-actions>a:first-of-type,.std-hero .buttons>a:first-of-type,
.std-hero .btnrow>a:first-of-type,.std-hero .btn-row>a:first-of-type,
.std-hero .ctas>a:first-of-type,.std-hero .btns>a:first-of-type{
  background:var(--gold)!important;color:#0b1725!important;border:1px solid var(--gold)!important;
}

/* secondary — any button after the first: outline, adapts to hero text color */
.std-hero .cta-row>a:not(:first-of-type),.std-hero .actions>a:not(:first-of-type),
.std-hero .lexi-actions>a:not(:first-of-type),.std-hero .buttons>a:not(:first-of-type),
.std-hero .btnrow>a:not(:first-of-type),.std-hero .btn-row>a:not(:first-of-type),
.std-hero .ctas>a:not(:first-of-type),.std-hero .btns>a:not(:first-of-type){
  background:transparent!important;color:inherit!important;border:1px solid currentColor!important;
}

.std-hero .arrow,.std-hero .lexi-arrow{font-size:25px!important;line-height:.7!important;font-weight:300!important}

/* --- Responsive --- */
@media (max-width:960px){
  .std-hero h1,.std-hero .lexi-h1{font-size:52px!important}
  .std-hero .eyebrow,.std-hero .lexi-eyebrow{font-size:21px!important}
}
@media (max-width:700px){
  .std-hero h1,.std-hero .lexi-h1{font-size:42px!important;line-height:1.06!important}
  .std-hero .eyebrow,.std-hero .lexi-eyebrow{font-size:18px!important;margin-bottom:16px!important}
  .std-hero .body,.std-hero .lexi-body{font-size:18px!important}
  .std-hero .supporting,.std-hero .support,.std-hero .hero-support{font-size:17px!important}
  .std-hero .cta-row,.std-hero .actions,.std-hero .lexi-actions,.std-hero .buttons,
  .std-hero .btnrow,.std-hero .btn-row,.std-hero .ctas,.std-hero .btns{align-items:stretch}
  .std-hero .cta-row>a,.std-hero .actions>a,.std-hero .lexi-actions>a,.std-hero .buttons>a,
  .std-hero .btnrow>a,.std-hero .btn-row>a,.std-hero .ctas>a,.std-hero .btns>a{
    font-size:17px!important;width:100%;justify-content:center;white-space:normal;text-align:center;
  }
}
@media (max-width:420px){
  .std-hero h1,.std-hero .lexi-h1{font-size:38px!important}
}
