/* Oakmoore Accountants — shared site styles.
   One file for every page (1 Oct 2026). Page markup still carries most
   styling inline; this holds the global rules, mobile behaviour, hover
   states and accessibility. Brand rules: 00_Resources/Brand/Oakmoore Brand
   Guidelines.dc.html, section 06 Mobile. */

:root { color-scheme:dark; --om-label:11px; }
@media (max-width:760px) { :root { --om-label:12px; } }   /* mono labels: 12px floor on phones */

body {
  margin:0; background:#0C1417;
  -webkit-font-smoothing:antialiased;
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
  /* landscape iPhone: keep content clear of the notch */
  padding-left:env(safe-area-inset-left); padding-right:env(safe-area-inset-right);
}
a { color:#C0614A; text-decoration:none; }
a:hover { color:#D4775F; }
::selection { background:#C0614A; color:#0C1417; }
input, select, textarea, button { box-sizing:border-box; max-width:100%; }

/* Focus: visible for keyboard users, never for mouse/touch */
:focus-visible { outline:2px solid #D4775F !important; outline-offset:3px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline-offset:0; }

/* Hover states (semantic; replaces the per-page .oh0-.oh3 classes) */
.h-bone:hover  { color:#EDE9E2; }
.h-fill:hover  { background:#D4775F; }
.h-line:hover  { border-color:#8A9A9E; }
.h-raise:hover { background:#162327; }
.h-coral:hover { border-color:#C0614A; color:#C0614A; }
.h-edge:hover  { border-color:#C0614A; color:#EDE9E2; }

/* Navigation */
.om-menu { display:none; }
@media (max-width:900px) {
  .om-navlinks { display:none !important; }
  .om-menu { display:block; }
  .om-navbar { padding-left:20px !important; padding-right:20px !important; }
}
.om-menu > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:9px; font-family:IBM Plex Mono, monospace; font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:#EDE9E2; border:1px solid #223035; padding:0 14px; height:44px; }
.om-menu > summary::-webkit-details-marker { display:none; }
.om-menu > summary::marker { content:''; }
.om-menu[open] > summary { border-color:#C0614A; color:#C0614A; }
.om-burger { display:inline-block; width:16px; height:11px; border-top:1.5px solid currentColor; border-bottom:1.5px solid currentColor; position:relative; }
.om-burger:after { content:''; position:absolute; left:0; right:0; top:50%; border-top:1.5px solid currentColor; }
.om-menu-panel { position:absolute; left:0; right:0; top:100%; z-index:30; background:#0C1417; border-top:1px solid #223035; border-bottom:1px solid #223035; display:flex; flex-direction:column; }
.om-menu-panel a { display:block; padding:16px 20px; color:#EDE9E2; font-family:IBM Plex Mono, monospace; font-size:13px; letter-spacing:0.16em; text-transform:uppercase; border-bottom:1px solid #172429; }
.om-menu-panel a:last-child { border-bottom:0; color:#D4775F; }

/* Fixed call bar on phones: 44px targets, clear of the home indicator */
#mobile-cta { display:none; }
@media (max-width:760px) {
  #mobile-cta {
    display:flex; gap:8px !important;
    padding:8px max(12px, env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)) !important;
  }
  #mobile-cta a { padding:0 12px !important; font-size:15px !important; min-height:44px !important; }
  body:has(#mobile-cta) { padding-bottom:calc(60px + env(safe-area-inset-bottom)); }
}

/* Home page marquee */
@keyframes om-marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.om-track { animation:om-marquee 44s linear infinite; }
.om-marquee:hover .om-track { animation-play-state:paused; }
@media (prefers-reduced-motion:reduce) { .om-track { animation:none; } }

/* Contact form */
#request { scroll-margin-top:92px; min-width:0; }
#request input, #request select, #request textarea { font-family:Archivo, Helvetica, sans-serif; }
#request input:focus, #request select:focus, #request textarea:focus { outline:none; border-color:#C0614A !important; box-shadow:inset 0 0 0 1px #C0614A; }
input::placeholder, textarea::placeholder { color:#8A9A9E; opacity:1; }
input[type=checkbox] { width:20px !important; height:20px !important; flex:none; accent-color:#C0614A; }
@media (max-width:900px) {
  .om-contact-grid { grid-template-columns:1fr !important; }
  .om-contact-grid > * { min-width:0; border-right:0 !important; }
  #request input, #request select, #request textarea { width:100% !important; min-width:0 !important; }
}

/* Calculators */
input[type=range] { accent-color:#C0614A; height:44px; margin:0; }
input[type=number] { -moz-appearance:textfield; appearance:textfield; }
input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.om-amount { display:inline-flex; align-items:baseline; gap:2px; font-family:IBM Plex Mono, monospace; font-size:22px; color:#C0614A; border-bottom:1px solid #223035; }
.om-amount:focus-within { border-bottom-color:#C0614A; }
.om-amount input { width:7.5ch; background:transparent; border:0; outline:none; color:#C0614A; font:inherit; text-align:left; padding:4px 0; }

/* Phones: every standalone link and control is at least 44px tall (Apple HIG).
   Inline links inside a sentence are exempt. */
@media (max-width:760px) {
  a.h-bone:not(p a), nav[aria-label="Breadcrumb"] a,
  a[href^="tel:"]:not(p a), a[href^="mailto:"]:not(p a), a.om-more {
    display:inline-flex; align-items:center; min-height:44px;
  }
  button { min-height:44px; }
  .om-amount input { padding:10px 0; }
}
#request input[type=checkbox] { width:20px !important; min-width:20px !important; }
@media (max-width:760px) {
  .om-footlinks { row-gap:0 !important; column-gap:24px !important; grid-template-columns:1fr 1fr !important; }
  .om-navbar > a:first-child { min-height:44px; }
}