/* Annixia v5.7 — responsive navigation & refined action design
   This layer deliberately follows the consolidated theme and polish CSS. */
:root{--action-red:#aa2840;--action-red-deep:#781a31;--action-border:rgba(234,111,133,.43)}
/* A recognizable studio control: compact dark-crimson capsule with a contained arrow. */
a.hero-v5-primary,
.home-form-v5 button.contact-submit,
.contact-form button.button,
a.button,
button.button{
  display:inline-flex!important;align-items:center!important;justify-content:space-between!important;
  gap:18px!important;box-sizing:border-box!important;
  width:max-content;max-width:100%;
  min-height:52px!important;padding:6px 8px 6px 22px!important;
  border:1px solid var(--action-border)!important;border-radius:999px!important;
  background:linear-gradient(125deg,#b42c47 0%,#942139 50%,#741b30 100%)!important;
  color:#fff5f1!important;font:600 14px/1.25 "DM Sans",system-ui,sans-serif!important;
  letter-spacing:.012em!important;text-decoration:none!important;
  box-shadow:inset 0 1px 0 rgba(255,221,220,.16),0 9px 22px rgba(84,8,28,.22)!important;
  transition:background .2s ease,box-shadow .2s ease,border-color .2s ease,transform .2s ease!important;
  cursor:pointer;
}
a.hero-v5-primary>span,
.home-form-v5 button.contact-submit>span,
.contact-form button.button>span,
a.button>span,button.button>span{
  display:grid;place-items:center;flex:none;width:36px;height:36px;
  border-radius:50%;background:rgba(17,6,13,.3);border:1px solid rgba(255,220,225,.17);
  color:#fff!important;font-size:18px;font-weight:400;line-height:1;
  transition:background .2s ease,transform .2s ease;
}
a.hero-v5-primary:hover,.home-form-v5 button.contact-submit:hover,
.contact-form button.button:hover,a.button:hover,button.button:hover{
  transform:translateY(-2px)!important;border-color:rgba(255,161,173,.65)!important;
  background:linear-gradient(125deg,#c13a52 0%,#a6253f 50%,#852039 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,221,220,.19),0 12px 28px rgba(95,11,34,.32)!important;
}
a.hero-v5-primary:hover>span,.home-form-v5 button.contact-submit:hover>span,
.contact-form button.button:hover>span,a.button:hover>span,button.button:hover>span{
  background:rgba(17,6,13,.44);transform:translate(1px,-1px);
}
/* Secondary actions recede, but retain an identical tactile shape. */
a.hero-v5-secondary{
  display:inline-flex!important;align-items:center!important;justify-content:space-between!important;
  gap:18px!important;box-sizing:border-box!important;
  min-height:52px!important;padding:6px 8px 6px 22px!important;
  width:max-content;max-width:100%;border-radius:999px!important;
  background:rgba(24,17,24,.8)!important;border:1px solid rgba(220,176,182,.28)!important;
  color:#eee5df!important;text-decoration:none!important;font-size:14px!important;
  font-weight:500!important;box-shadow:none!important;
}
a.hero-v5-secondary>span{
  display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;
  border:1px solid rgba(227,178,187,.22);color:#f08b9a!important;font-size:17px;
  background:rgba(255,255,255,.035);
}
a.hero-v5-secondary:hover{
  background:rgba(83,26,43,.34)!important;border-color:rgba(229,111,135,.57)!important;
  transform:translateY(-2px);
}
/* Navigation CTA, project image chip, and mobile menu match the same language. */
.nav-wrap-v5 a.nav-cta-v5{
  border-radius:999px!important;min-height:44px!important;
  padding:5px 6px 5px 18px!important;gap:13px!important;
  background:rgba(101,22,40,.22)!important;border:1px solid rgba(208,93,114,.45)!important;
  color:#f5e9e5!important;box-shadow:none!important;text-decoration:none!important;
}
.nav-wrap-v5 a.nav-cta-v5 b{
  display:grid;place-items:center;width:32px;height:32px;border-radius:50%;
  background:#9e283e;color:#fff!important;font-size:17px;font-weight:400;
}
.nav-wrap-v5 a.nav-cta-v5:hover{
  background:rgba(146,32,59,.33)!important;border-color:#d75d72!important;
}
.project-v5-open{border-radius:999px!important;padding:7px 8px 7px 15px!important;gap:10px!important}
.project-v5-open b{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#8f273d;color:#fff!important}
.project-v5-cta{border-radius:999px!important}
.mobile-panel a.mobile-project-link{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  width:max-content;max-width:100%;padding:13px 21px!important;
  border-radius:999px!important;color:#fff!important;
  background:linear-gradient(120deg,#ae2e47,#7b2036)!important;
  border:1px solid rgba(255,137,157,.45)!important;font:600 14px/1.35 "DM Sans",sans-serif!important;
}
@media(hover:none){a.hero-v5-primary:hover,a.hero-v5-secondary:hover,a.button:hover,button.button:hover,.home-form-v5 button.contact-submit:hover,.contact-form button.button:hover{transform:none!important}}
/* The nav must stay above the menu: the original menu could trap the close control. */
@media(max-width:980px){
  body.menu-open{overflow-y:auto!important;overflow-x:clip!important;position:static!important}
  .nav-wrap-v5{isolation:isolate;overflow:visible!important}
  .nav-wrap-v5 .nav{position:relative!important;z-index:230!important}
  .nav-wrap-v5 .menu-toggle{
    display:inline-flex!important;align-items:center;justify-content:center;
    border:1px solid rgba(225,125,141,.38)!important;border-radius:999px!important;
    background:rgba(115,31,53,.18)!important;color:#f4e9e5!important;
    min-width:83px;min-height:43px;padding:0 15px!important;
    font:600 12px/1 "DM Sans",sans-serif!important;letter-spacing:.10em!important;
    cursor:pointer;position:relative!important;z-index:240!important;
  }
  .nav-wrap-v5 .menu-toggle[aria-expanded="true"]{background:#84243b!important;border-color:#b94a60!important}
  .nav-wrap-v5 .mobile-panel{
    position:absolute!important;top:100%!important;left:0!important;right:0!important;
    z-index:215!important;margin:0!important;padding:24px max(20px,5vw) 30px!important;
    max-height:calc(100dvh - 72px)!important;overflow-y:auto!important;
    background:rgba(12,10,15,.985)!important;border-top:1px solid rgba(255,255,255,.07)!important;
    border-bottom:1px solid rgba(215,83,108,.23)!important;
    box-shadow:0 22px 42px rgba(0,0,0,.40)!important;
    overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  }
  .nav-wrap-v5 .mobile-panel:not(.open){display:none!important}
  .nav-wrap-v5 .mobile-panel.open{display:grid!important;gap:9px!important}
  .nav-wrap-v5 .mobile-panel>a:not(.mobile-project-link){
    font:500 clamp(23px,4.3vw,31px)/1.25 "DM Sans",sans-serif!important;
    letter-spacing:-.035em;color:#f0e7e2!important;
    padding:10px 5px!important;min-height:44px;display:flex;align-items:center;
  }
  .nav-wrap-v5 .mobile-panel>a:hover{color:#f58da0!important}
}
/* Brand first on phone: reactor and wordmark precede the copy and actions. */
@media(max-width:760px){
  .hero-v5{min-height:auto!important}
  .hero-v5-shell{
    width:calc(100% - 36px)!important;min-height:auto!important;
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;grid-template-areas:"brandmark" "pitch"!important;
    align-content:start!important;justify-items:center!important;
    gap:0!important;padding-top:22px!important;padding-bottom:57px!important;
  }
  .hero-reactor{
    grid-area:brandmark!important;grid-row:1!important;grid-column:1!important;
    width:min(78vw,340px)!important;max-width:100%!important;
    margin:-8px auto -32px!important;justify-self:center!important;
    align-self:start!important;
  }
  .hero-v5-copy{
    grid-area:pitch!important;grid-row:2!important;grid-column:1!important;
    text-align:center!important;justify-self:center!important;
    align-self:start!important;padding:0!important;
    max-width:590px!important;
  }
  .hero-v5-kicker{justify-content:center!important;margin-bottom:17px!important}
  .hero-v5 h1{font-size:clamp(48px,11.2vw,69px)!important;line-height:1!important}
  .hero-v5-copy>p{max-width:36ch!important;margin:19px auto 25px!important;line-height:1.55!important}
  .hero-v5-actions{
    display:flex!important;flex-direction:column!important;align-items:center!important;
    justify-content:center!important;gap:11px!important;
  }
  .hero-v5-primary,.hero-v5-secondary{
    width:max-content!important;max-width:calc(100vw - 44px)!important;min-width:0!important;
    align-self:center!important;
  }
  a.hero-v5-primary{min-width:min(275px,calc(100vw - 44px))!important}
  a.hero-v5-secondary{min-width:196px!important}
  .home-form-v5 .form-actions{align-items:flex-start!important}
  .home-form-v5 button.contact-submit{width:max-content!important;max-width:100%!important}
  .contact-form button.button{width:max-content!important;max-width:100%!important}
}
@media(max-width:390px){
 .hero-reactor{width:min(79vw,310px)!important;margin-bottom:-23px!important}
 .hero-v5 h1{font-size:clamp(46px,11vw,57px)!important}
 .hero-v5-shell{padding-top:13px!important}
}
@media(prefers-reduced-motion:reduce){
 a.hero-v5-primary,a.hero-v5-secondary,a.button,button.button,
 .nav-wrap-v5 a.nav-cta-v5{transition:none!important;transform:none!important}
}
