/* SignBridge calm refresh, 26 September 2026.
   Loaded after styles.css and colours.css. Keeps the approved colour tokens and navigation.
   Adds a readable font, sentence case sizing, quieter surfaces, flat lists and a fixed professional mobile bar. */

@font-face{font-family:"Atkinson Hyperlegible";src:url(fonts/atkinson-hyperlegible-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible";src:url(fonts/atkinson-hyperlegible-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

body{font-family:"Atkinson Hyperlegible",Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font-family:inherit}
p{line-height:1.55}

/* Headings: sentence case, calmer size */
h1{font-size:clamp(1.55rem,2.3vw,2rem);letter-spacing:-.01em;font-weight:700;line-height:1.2}
.home h1{font-size:clamp(1.8rem,3vw,2.4rem)}
.narrow h1{font-size:clamp(1.5rem,2.2vw,1.9rem)}
h2{font-size:1.1rem;font-weight:700;letter-spacing:0}
h3{font-size:1rem;font-weight:700}
h4{font-size:.98rem;margin:0 0 6px}
main>h2{margin-top:28px}

/* Quieter surfaces: structure is felt, not outlined everywhere */
.card,.glass{background:var(--surface);border-color:var(--divider)}
.card .card,.card .person,.card .glass,.card .arrival{background:transparent;border:0;border-top:1px solid var(--divider);border-radius:0;padding:14px 0 0;margin:14px 0 0;box-shadow:none}
dialog .card{background:var(--raised);border-color:var(--divider)}
.person{padding-top:12px;margin-top:12px;border-top:1px solid var(--divider)}
.arrival>h3{margin-top:0}

/* Sidebar: quiet rows, soft highlight for the current page */
.workspace{grid-template-columns:230px 1fr}
.workspace>nav{gap:2px;position:sticky;top:16px;align-self:start}
.workspace>nav a.button{background:transparent;border-color:transparent;color:var(--muted);min-height:44px;padding:9px 12px;border-radius:10px;font-weight:600}
.workspace>nav a.button:hover{background:var(--surface);color:var(--text)}
.workspace>nav a[aria-current="page"],.workspace>nav a[aria-current="page"]:hover{background:var(--soft);color:var(--text);box-shadow:inset 3px 0 0 var(--accent)}

/* Stat tiles are links */
.stat{background:var(--surface);border:1px solid var(--divider)}
a.stat{display:block;color:var(--text);text-decoration:none;transition:border-color 160ms ease}
a.stat:hover{border-color:var(--accent)}
.stat b{margin-top:4px}

/* Flat lists for bookings, arrivals and teams */
.items{list-style:none;margin:0 0 24px;padding:0;border:1px solid var(--divider);border-radius:16px;background:var(--surface);overflow:hidden}
.item{display:flex;gap:16px;justify-content:space-between;align-items:flex-start;padding:16px 18px;border-top:1px solid var(--divider)}
.item:first-child{border-top:0}
.item>div:first-child{min-width:0}
.item h3{margin:0 0 4px}
.item p{margin:4px 0 0}
.item-side{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end;flex-shrink:0}
.item-side .button{min-height:44px;padding:9px 14px}
.item.urgent{box-shadow:inset 3px 0 0 var(--warning)}
.meta{color:var(--muted);font-size:.94rem;margin:4px 0}
.blocker{color:var(--warning);font-size:.94rem}
.ref{font-size:.8rem;font-weight:700;color:var(--muted);letter-spacing:.04em;margin-left:6px;white-space:nowrap}
.row>.ref{margin-left:0}
.when{font-weight:700}
.when-lg{font-size:1.1rem;font-weight:700;margin:14px 0 4px}
.next{background:var(--raised);border-radius:10px;padding:10px 12px;font-size:.96rem}
.booking-card h2{margin:10px 0 2px}
.booking-card>.button{margin-top:4px}
.facts{list-style:none;padding:0;margin:6px 0 10px;display:grid;gap:6px}
.success-note{border-left-color:var(--success);background:var(--success-bg);color:var(--success)}
.group{border:1px solid var(--divider);border-radius:14px;padding:14px 16px;display:grid;gap:14px;margin:0}
.group legend{font-weight:700;padding:0 6px}
.review-row h2{margin:0}
.review-row p{margin:10px 0 0}

/* Call controls show their state with a dot as well as the pressed style */
.video-controls button[aria-pressed="true"]{background:var(--soft);color:var(--text);border-color:var(--accent)}
.video-controls button[aria-pressed="true"]::before{content:"●"/"";margin-right:6px;color:var(--accent);font-size:.7em}

/* Gentle page entrance on navigation only */
@keyframes sb-enter{from{opacity:.001;transform:translateY(4px)}to{opacity:1;transform:none}}
.main.enter{animation:sb-enter 180ms ease-out}
html[data-motion="reduce"] .main.enter{animation:none}
@media(prefers-reduced-motion:reduce){.main.enter{animation:none}}

@media(max-width:760px){
 .item{flex-direction:column;gap:10px}
 .item-side{justify-content:flex-start}
 body[data-role="professional"] .professional-nav{position:fixed;left:0;right:0;bottom:0;z-index:20;margin:0;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--divider);display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
 body[data-role="professional"] .professional-nav .button{background:transparent;border-color:transparent;color:var(--muted);min-height:48px;padding:8px 4px}
 body[data-role="professional"] .professional-nav [aria-current="page"]{background:var(--soft);color:var(--text)}
 body[data-role="professional"] .shell{padding-bottom:84px}
}

/* Call preview: wider stage and controls that never split words */
.main.narrow:has(.call-room){max-width:880px}
.video-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px}
.video-controls button{white-space:nowrap;overflow-wrap:normal;word-break:normal;padding:10px 8px}
@media(max-width:760px){.video-controls{grid-template-columns:repeat(3,1fr)}.video-controls button{font-size:.85rem;padding:10px 4px}}
.actions-row{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0 12px}
main a.button.quiet{padding-left:0}