/* Hermes Vision: verified public brand #fa7136 / #151515 / #272727 / #f0f0f0.
   Operational workspace keeps light reading surfaces and dark, orange navigation. */
:root {
  font-family:"Segoe UI Variable","Segoe UI",Arial,sans-serif;
  font-size:17px;
  line-height:1.5;
  color:#202020;
  background:#f0f0f0;
  --nav:#151515;
  --nav-light:#272727;
  --teal:#b84010;
  --teal-dark:#95300a;
  --border:#d8d6d3;
  --muted:#62605d;
  --vision-orange:#fa7136;
  --vision-ink:#151515;
  --vision-soft:#fff2eb;
  --vision-focus:#ac3609;
  --accent:#b84010;
}
body { background:#f0f0f0; }
button,input,select,textarea,summary { -webkit-tap-highlight-color:transparent; }
input,select,textarea { color:#202020; border-color:#aaa6a1; border-radius:7px; min-height:46px; }
label { font-size:1rem; line-height:1.5; }
button,a,input,select,textarea,summary { outline-offset:4px; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid var(--vision-focus); }
h1 { font-size:2rem; letter-spacing:-.7px; line-height:1.22; }
h2 { font-size:1.3rem; line-height:1.4; }
h3 { font-size:1.08rem; }
.small,.field-hint,.login-session-note,.usage-caption,.ops-note,.metric-note { font-size:.86rem; line-height:1.6; }
.brand-mark { background:none; border:0; color:var(--vision-orange); font-family:Georgia,serif; font-style:italic; font-size:2.5rem; font-weight:400; width:44px; height:48px; }
.wordmark { gap:12px; font-size:1.08rem; font-weight:700; letter-spacing:-.3px; }
.brand-subtitle { font-size:.73rem; font-weight:400; letter-spacing:.2px; color:#b9b6b1; margin-top:3px; }
.trial-banner { background:#fff1e7; border-color:#efc4aa; color:#633016; font-size:.84rem; }
.trial-banner .signal { background:var(--vision-orange); }
.login-layout { grid-template-columns:minmax(0,1.18fr) minmax(0,1fr); min-height:calc(100dvh - 40px); }
.login-story {
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:26px;
  padding:clamp(29px,5vh,54px) clamp(32px,5.6vw,102px);
  color:#fff9f2;
  background:
    linear-gradient(0deg,#160e0bd9 0%,transparent 31%),
    linear-gradient(113deg,#171310cf 0%,#171310a8 29%,#18120e32 64%,transparent 85%),
    #211916 url("/panel/static/hermes-login-office.webp") 54% 62% / cover no-repeat;
}
.login-wordmark { display:flex; gap:12px; align-items:center; }
.login-wordmark img { display:block; width:44px; height:22px; object-fit:contain; }
.login-story-copy { align-self:start; padding-top:clamp(24px,12vh,136px); }
.login-story h1 { font-family:Georgia,"Times New Roman",serif; font-size:clamp(2.85rem,4.45vw,5rem); font-weight:400; letter-spacing:-.04em; line-height:1.01; }
.login-description { color:#f5ede5; font-size:1rem; max-width:35ch; line-height:1.65; margin-top:20px; }
.login-footnote { color:#ede0d5; font-size:.78rem; max-width:47ch; }
.login-form-wrap { padding:clamp(24px,4.5vw,82px); background:#f4eee8; }
.login-card {
  width:min(100%,480px);
  min-width:0;
  padding:clamp(24px,3vw,43px);
  border:1px solid #e5d9ce;
  border-radius:20px;
  background:#fffdfb;
  box-shadow:0 18px 48px #4f362217;
}
.login-card .login-form { max-width:none; gap:9px; }
.login-card .login-form h2 { font-size:clamp(1.75rem,2.25vw,2.15rem); line-height:1.14; letter-spacing:-.037em; color:#211b17; }
.login-card .login-form>p:first-of-type { margin:0 0 12px; }
.login-card label:not(.checkbox-label) { font-size:.87rem; color:#392c23; margin-top:6px; }
.login-card input:not([type="checkbox"]) { min-height:49px; border-color:#bbb0a5; }
.login-card input[type="file"] { width:100%; min-width:0; font-size:.85rem; }
.login-card .login-form .primary { min-height:49px; margin-top:9px; }
.login-card .inline-error { margin:1px 0 0; }
.login-password-field { position:relative; }
.login-password-field input { width:100%; padding-inline-end:78px; }
.login-password-field input::-ms-reveal { display:none; }
.login-password-field button {
  position:absolute;
  inset-block:3px;
  inset-inline-end:4px;
  min-width:67px;
  border:0;
  border-radius:5px;
  background:#fffdfb;
  color:#803511;
  font-size:.8rem;
  font-weight:650;
}
.login-password-field button:hover { background:#fff0e5; }
.login-password-field button:focus-visible { outline-offset:-2px; }
.login-card>details { display:block; border-block-start:1px solid #e8ded5; }
.login-card>details:first-of-type { margin-top:22px; }
.login-card>details>summary {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  min-height:44px;
  padding:8px 2px;
  color:#4f4036;
  font-size:.84rem;
  font-weight:550;
  cursor:pointer;
}
.login-card>details>summary::-webkit-details-marker { display:none; }
.login-card>details>summary::after {
  content:"";
  width:7px;
  height:7px;
  border:solid currentColor;
  border-width:0 1.5px 1.5px 0;
  rotate:45deg;
  margin-inline-end:5px;
  flex:none;
}
.login-card>details[open]>summary::after { rotate:225deg; }
.login-card>details>summary:hover { color:#8c3511; }
.login-card>details>form { padding:8px 0 16px; }
.login-card>details>form h2 { font-size:1.06rem; }
.login-account-link {
  display:block;
  padding:12px 2px;
  border-block-start:1px solid #e8ded5;
  color:#803511;
  font-size:.84rem;
  font-weight:600;
  text-underline-offset:3px;
}
.checkbox-label { gap:12px; line-height:1.5; font-size:.92rem; padding:8px 0; }
.login-form input[type="checkbox"],.creation-form input[type="checkbox"] { width:20px; min-height:20px; accent-color:#b84010; }
.button { min-height:46px; padding:11px 17px; border-radius:7px; font-size:.92rem; font-weight:600; transition:background-color 160ms ease,border-color 160ms ease,box-shadow 160ms ease,transform 110ms ease; }
.button.primary { background:var(--vision-orange); border-color:var(--vision-orange); color:var(--vision-ink); box-shadow:inset 0 -2px 0 #1515151a; }
.button.primary:hover { background:#ff915a; border-color:#ff915a; color:var(--vision-ink); box-shadow:0 4px 12px #15151512; }
.button.secondary { color:#282522; background:#fff; border-color:#bdb8b2; }
.button.secondary:hover,.button.quiet:hover { background:var(--vision-soft); border-color:#d99d7e; color:#6b2c11; }
.button:active:not(:disabled) { transform:translateY(1px) scale(.985); box-shadow:inset 0 2px 4px #1515151a; }
.workspace { grid-template-columns:280px minmax(0,1fr); }
.sidebar { padding:27px 16px 20px; position:sticky; top:0; align-self:start; height:100dvh; overflow:hidden; }
.sidebar-brand { padding:0 10px 26px; }
.primary-nav { gap:22px; flex:1; min-height:0; overflow:hidden; padding:0 4px 12px; }
.area-switcher { display:flex; flex-direction:column; gap:5px; flex-shrink:0; border-top:1px solid #ffffff24; padding-top:15px; }
.primary-nav .workspace-area-button { display:flex; justify-content:space-between; font-size:1rem; font-weight:650; color:#e9e5df; min-height:45px; padding:10px 12px; }
.primary-nav .workspace-area-button[aria-pressed="true"] { background:#fa71361c; color:#ffad86; }
.area-arrow { font-size:1.35rem; font-weight:400; color:#a7a19a; }
.workspace-area-button[aria-pressed="true"] .area-arrow { color:var(--vision-orange); }
.nav-area-links { display:flex; flex-direction:column; gap:4px; overflow-y:auto; min-height:0; padding-top:15px; border-top:1px solid #ffffff24; scrollbar-width:thin; scrollbar-color:#6a594e transparent; }
.nav-area-links:not([hidden]) { animation:workspace-enter 160ms ease-out; }
.primary-nav button { font-size:.94rem; padding:11px 13px; gap:12px; min-height:47px; color:#bfbcb7; border-radius:6px; transition:background-color 150ms ease,color 150ms ease,transform 100ms ease; }
.primary-nav button:hover { background:#ffffff0d; color:#fff; }
.primary-nav button[aria-current="page"] { background:#fa713619; color:#ffad86; box-shadow:inset 3px 0 0 var(--vision-orange); font-weight:650; }
.primary-nav button:active { transform:translateX(2px); }
.sidebar button:focus-visible,.sidebar summary:focus-visible { outline-color:#ffad86; }
.nav-icon { width:20px; height:20px; flex:0 0 20px; }
.sidebar-bottom { display:none; }
.sidebar-bottom p { max-width:24ch; font-size:.81rem; }
.sidebar-pilot { color:#d2ccc5; font-size:.83rem; }
.workspace-header { padding:23px 32px; gap:20px; min-height:110px; border-bottom-color:#ddd9d4; }
.business-identity { gap:6px; }
.business-identity:has(.owner-business-control:not([hidden])) { display:grid; grid-template-columns:minmax(200px,1fr) minmax(190px,270px); column-gap:26px; }
.business-identity>.muted:first-child { grid-column:1; grid-row:1; }
.business-identity>strong { grid-column:1; grid-row:2; }
.business-identity>.identity-detail { grid-column:1; grid-row:3; }
.business-identity>#global-stop-label { grid-column:1 / -1; }
.business-identity>.owner-business-control { grid-column:2; grid-row:1 / 4; align-self:center; }
.business-identity>strong { font-size:1.15rem; }
.owner-business-control { margin-top:3px; }
.owner-business-control select { max-width:310px; min-height:42px; font-size:.88rem; }
.owner-business-control>label { font-size:.84rem; }
.identity-detail { gap:10px; flex-wrap:wrap; }
.badge { font-size:.8rem; }
.header-actions { flex-wrap:wrap; justify-content:flex-end; }
.content-shell { max-width:1440px; padding:35px 35px 48px; }
.page-heading { margin-bottom:29px; }
.page-heading p { font-size:1rem; max-width:65ch; }
.page-heading #last-refreshed { font-size:.82rem; color:#69645e; }
.creation-form,.panel-block,.job-detail,.empty-state { border-color:#dcd7d0; border-radius:9px; }
.creation-form { max-width:800px; }
.creation-form input,.creation-form select { width:100%; }
.creation-form input[type="checkbox"] { width:20px; }
.creation-form p { max-width:68ch; }
.crm-contact-card { font-size:1rem; transition:background-color 150ms ease,border-color 150ms ease; }
.crm-contact-card.is-selected,.crm-contact-card[aria-pressed="true"] { background:#fff3eb; border-color:#d99470; box-shadow:inset 3px 0 0 var(--vision-orange); }
.metric-label,.metric-note { color:#68625c; }
.metric-value { color:#25211e; }
.status-row,.table-scroll td { font-size:.94rem; }
.table-scroll tbody tr:hover { background:#fff7f0; }
.notice { font-size:.94rem; }
.notice>button { min-height:44px; width:44px; flex-shrink:0; }
.solution-field label,.solution-line-editor legend { font-size:.95rem; }
.solution-values,.solution-callout,.solution-history summary { font-size:.94rem; }
.solution-callout { background:#fff2e9; border-left-color:var(--vision-orange); }
.solution-tabs .button,.business-tools .button { font-size:.9rem; min-height:44px; }
.business-reference-search .button,.business-calendar-block .button { font-size:.85rem; min-height:44px; }
.business-calendar .business-card,.business-calendar-item p { font-size:.85rem; }
.business-calendar .business-card h3 { font-size:.95rem; }
.business-calendar-item { background:#fff3eb; border-left-color:var(--vision-orange); }
.management-toolbar { display:flex; gap:12px; margin-bottom:22px; }
.page-section.is-current { animation:workspace-enter 170ms ease-out; }
@keyframes workspace-enter { from { opacity:.6; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:1150px) {
  .workspace { grid-template-columns:250px minmax(0,1fr); }
  .workspace-header { flex-wrap:wrap; padding:23px 25px; }
  .header-actions { justify-content:flex-start; }
  .content-shell { padding:29px 25px 40px; }
}
@media(max-width:900px) {
  .workspace { display:block; }
  .sidebar { position:relative; height:auto; padding:15px 18px; overflow:visible; }
  .sidebar-brand { padding:0; }
  .menu-button { display:block; color:#f0f0f0; background:#272727; border:1px solid #655d55; border-radius:6px; padding:9px 15px; min-height:44px; font-size:.9rem; }
  .primary-nav { display:none; max-height:70dvh; overflow-y:auto; margin-top:20px; }
  .primary-nav.is-open { display:flex; }
  .sidebar-bottom { display:none; }
  .login-story { padding:28px clamp(24px,6vw,52px); min-height:310px; gap:22px; background-position:54% 66%; }
  .login-story-copy { padding-top:12px; }
  .login-story h1 { font-size:clamp(2.3rem,6vw,3.25rem); }
  .login-layout { grid-template-columns:1fr; }
  .login-form-wrap { padding:28px 22px 38px; min-height:0; }
  .workspace-header { padding:22px; }
  .content-shell { padding:27px 22px 36px; }
}
@media(max-width:520px) {
  :root { font-size:17px; }
  .login-story { grid-template-rows:auto 1fr; min-height:208px; gap:21px; padding:22px 24px 26px; }
  .login-story-copy { align-self:end; padding-top:0; }
  .login-story h1 { font-size:clamp(1.85rem,8.8vw,2.5rem); }
  .login-description,.login-footnote { display:none; }
  .login-form-wrap { padding:18px 14px 26px; }
  .login-card { border-radius:15px; padding:23px 19px; }
  .workspace-header { padding:19px; }
  .business-identity { width:100%; }
  .business-identity:has(.owner-business-control:not([hidden])) { display:flex; }
  .header-actions { display:flex; flex-direction:row; align-items:stretch; width:100%; gap:8px; }
  .header-actions>.button { width:auto; flex:1 1 0; min-width:0; padding:10px 12px; }
  .content-shell { padding:25px 18px 34px; }
  .page-heading { flex-direction:column; gap:8px; }
  .page-heading h1 { font-size:1.8rem; }
  .page-heading #last-refreshed { padding-top:0; }
  .owner-business-control select { max-width:100%; }
  .creation-form { padding:19px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  .button:active:not(:disabled),.primary-nav button:active { transform:none; }
}
