/* CONTRACT
 * 270.sales-header.css
 * Styles the shared designer-export header, paired actions, backdrop, and mobile drawer.
 * Depends on: the shared markup in Header.dc.html and tokens from peo.css.
 * Depended on by: every page that imports the shared Header fragment.
 * Removing this file breaks shared header presentation and responsive navigation.
 */
@charset "utf-8";

#actionbar{position:fixed;top:0;left:0;right:0;z-index:70;background:var(--ink);border-bottom:1px solid rgba(244,239,230,.14);box-shadow:0 .45rem 1.5rem rgba(14,13,11,.16)}
#actionbar-spacer{min-height:4.25rem}
#actionbar-inner{display:flex;align-items:center;gap:1.35rem;width:min(100% - 2rem,73.75rem);min-height:4.25rem;margin-inline:auto}
#brandmark{display:inline-flex;align-items:baseline;flex:0 0 auto;font-family:var(--font-display);font-size:1.15rem;font-weight:900;letter-spacing:-.03em;color:var(--paper);white-space:nowrap}
#brandmark span,.menu-brand span{color:var(--accent-soft)}
#navlinks{display:flex;align-items:center;justify-content:center;gap:1.15rem;min-width:0;flex:1}
.header-nav-link{display:inline-flex;align-items:center;min-height:2.75rem;border-bottom:2px solid transparent;color:rgba(244,239,230,.78);font-family:var(--font-body);font-size:.88rem;font-weight:500;line-height:1;white-space:nowrap;transition:color 140ms,border-color 140ms}
.header-nav-link:hover,.header-nav-link:focus-visible{color:var(--paper);border-bottom-color:rgba(244,239,230,.46);outline:none}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;flex:0 0 auto}
.header-action{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-inline-size:5.5rem;min-height:2.75rem;padding:.72rem 1rem;border:1px solid transparent;border-radius:var(--radius-button);font-family:var(--font-body);font-size:.85rem;font-weight:700;line-height:1;white-space:nowrap;transition:background 140ms,border-color 140ms,color 140ms,transform 140ms,box-shadow 140ms}
.header-action:hover,.header-action:focus-visible{transform:translateY(-1px);box-shadow:0 .5rem 1.1rem rgba(0,0,0,.2);outline:2px solid var(--accent-soft);outline-offset:2px}
.header-action:active{transform:translateY(0);box-shadow:none}
.header-action-primary{background:linear-gradient(180deg,var(--accent-soft),var(--accent));border-color:var(--accent);color:#fff}
.header-action-primary:hover,.header-action-primary:focus-visible{background:linear-gradient(180deg,var(--accent),var(--accent-deep));color:#fff}
.header-action-secondary{background:var(--paper);border-color:var(--paper);color:var(--ink)}
.header-action-secondary:hover,.header-action-secondary:focus-visible{background:var(--paper-deep);border-color:var(--paper-deep);color:var(--ink)}
.header-action-icon{font-family:var(--font-mono);font-size:.82em}
#menubtn{display:none;align-items:center;justify-content:center;gap:.5rem;min-height:2.75rem;padding:.65rem .8rem;border:1px solid rgba(244,239,230,.4);border-radius:var(--radius-button);background:transparent;color:var(--paper);font-family:var(--font-body);font-size:.78rem;font-weight:700;cursor:pointer}
.menu-icon{display:grid;gap:.22rem;width:1rem}
.menu-icon span{display:block;height:1px;background:currentColor}
#menuwrap{position:fixed;inset:0;z-index:100;background:rgba(14,13,11,.5);backdrop-filter:blur(.18rem);-webkit-backdrop-filter:blur(.18rem)}
#menupanel{position:absolute;inset:0 0 0 auto;display:flex;flex-direction:column;width:min(92vw,24rem);background:var(--paper);color:var(--ink);box-shadow:-1.25rem 0 3.75rem rgba(14,13,11,.28)}
.menu-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:4.25rem;padding:0 1rem;border-bottom:1px solid var(--rule);flex:0 0 auto}
.menu-brand{font-family:var(--font-display);font-size:1.15rem;font-weight:900;letter-spacing:-.03em;color:var(--ink)}
.menu-close{display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border:1px solid var(--rule);border-radius:var(--radius-button);background:transparent;color:var(--ink);cursor:pointer}
.menu-close:hover,.menu-close:focus-visible{border-color:var(--accent);color:var(--accent-deep);outline:2px solid var(--accent);outline-offset:2px}
.menu-scroll{display:flex;flex:1;flex-direction:column;overflow-y:auto;padding:1rem}
.menu-nav{display:grid;border-top:1px solid var(--rule)}
.menu-link{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.35rem;padding:.8rem .25rem;border-bottom:1px solid var(--rule);font-family:var(--font-display);font-size:1.05rem;font-weight:700;color:var(--ink)}
.menu-link::after{content:"→";font-family:var(--font-mono);font-size:.85rem;color:var(--ink-mute)}
.menu-link:hover,.menu-link:focus-visible{color:var(--accent-deep);outline:none}
.menu-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--rule)}
.menu-actions .header-action{min-height:3.15rem}
.menu-actions .header-action-secondary{border-color:var(--ink);background:transparent;color:var(--ink)}
body.header-menu-open{overflow:hidden}
body.header-menu-open .ptva{display:none}

@media(max-width:1180px){
#navlinks{display:none}
#menubtn{display:inline-flex}
#actionbar-spacer{min-height:3.75rem}
#actionbar-inner{gap:.5rem;width:min(100% - 1rem,73.75rem);min-height:3.75rem}
.header-actions{margin-left:auto;gap:.35rem}
.header-action{min-height:2.45rem;padding:.62rem .78rem;font-size:.76rem}
#menubtn{min-height:2.45rem;padding:.55rem .68rem}
}
@media(max-width:430px){
#actionbar-spacer{min-height:3.45rem}
#actionbar-inner{gap:.28rem;width:calc(100% - .7rem);min-height:3.45rem}
#brandmark{font-size:.94rem}
.header-actions{gap:.2rem}
.header-action{min-inline-size:4.1rem;min-height:2.25rem;padding:.55rem .58rem;font-size:.68rem}
#menubtn{min-height:2.25rem;padding:.5rem .52rem;font-size:.68rem}
#menubtn .menu-label{display:none}
#menupanel{width:calc(100% - 1rem)}
}
@media(min-width:1181px){#menuwrap{display:none!important}}
@media(prefers-reduced-motion:reduce){.header-action{transition:none}}