/* Cashbook Finance v2.10.8 — mobile navigation, typography and audit refinements */

/* Scrolled header: remove the pill/highlight clutter around page links. */
body.nav-solid header.nav nav.links,
body.nav-compact header.nav nav.links,
html[data-theme="dark"] body.nav-solid header.nav nav.links,
html[data-theme="dark"] body.nav-compact header.nav nav.links{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
}
body.nav-solid header.nav nav.links>a,
body.nav-compact header.nav nav.links>a,
html[data-theme="dark"] body.nav-solid header.nav nav.links>a,
html[data-theme="dark"] body.nav-compact header.nav nav.links>a{
  background:transparent!important;
  box-shadow:none!important;
}
body.nav-solid header.nav nav.links>a:hover,
body.nav-compact header.nav nav.links>a:hover{
  background:transparent!important;
  color:#075f9f!important;
}
html[data-theme="dark"] body.nav-solid header.nav nav.links>a:hover,
html[data-theme="dark"] body.nav-compact header.nav nav.links>a:hover{
  background:transparent!important;
  color:#9fdcff!important;
}
body.nav-solid header.nav nav.links>a[aria-current="page"],
body.nav-solid header.nav nav.links>a.is-current,
body.nav-compact header.nav nav.links>a[aria-current="page"],
body.nav-compact header.nav nav.links>a.is-current,
html[data-theme="dark"] body.nav-solid header.nav nav.links>a[aria-current="page"],
html[data-theme="dark"] body.nav-solid header.nav nav.links>a.is-current,
html[data-theme="dark"] body.nav-compact header.nav nav.links>a[aria-current="page"],
html[data-theme="dark"] body.nav-compact header.nav nav.links>a.is-current{
  background:transparent!important;
  box-shadow:none!important;
  color:#0785cf!important;
}
html[data-theme="dark"] body.nav-solid header.nav nav.links>a[aria-current="page"],
html[data-theme="dark"] body.nav-solid header.nav nav.links>a.is-current,
html[data-theme="dark"] body.nav-compact header.nav nav.links>a[aria-current="page"],
html[data-theme="dark"] body.nav-compact header.nav nav.links>a.is-current{color:#8dd7ff!important}
body.nav-solid header.nav nav.links>a[aria-current="page"]::after,
body.nav-solid header.nav nav.links>a.is-current::after,
body.nav-compact header.nav nav.links>a[aria-current="page"]::after,
body.nav-compact header.nav nav.links>a.is-current::after{display:block!important;transform:scaleX(.62)!important;opacity:1!important}

/* Equal optical space around the header logo. */
@media(min-width:1361px){
  header.nav .brand{
    width:128px!important;
    min-width:128px!important;
    height:52px!important;
    min-height:52px!important;
    padding:10px 12px!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }
  header.nav .brand img{height:auto!important;max-height:30px!important;max-width:104px!important;width:auto!important}
}
@media(min-width:1361px) and (max-width:1480px){
  header.nav .brand{width:116px!important;min-width:116px!important;padding:9px 10px!important}
  header.nav .brand img{max-width:96px!important;max-height:28px!important}
}

/* Dark mode should read visibly darker, not merely recoloured. */
html[data-theme="dark"] :is(.hero.ink-bg,.subhero.ink-bg){
  background:#031522!important;
}
html[data-theme="dark"] :is(.hero.ink-bg,.subhero.ink-bg)::before{
  background:
    radial-gradient(42% 52% at 80% 6%,rgba(34,132,196,.20),transparent 62%),
    radial-gradient(45% 55% at 10% 95%,rgba(0,87,151,.18),transparent 62%),
    radial-gradient(38% 42% at 96% 96%,rgba(87,176,225,.08),transparent 62%)!important;
}
html[data-theme="dark"] body[data-page="portal"] .subhero{background:#02131f!important}

/* Deliberate desktop line starts requested for the home-page narrative. */
@media(min-width:900px){
  body[data-page="home"] .cb-line-start,
  body[data-page="home"] .cb-copy-line{display:block}
}
body[data-page="home"] .panel-card p .cb-copy-line+ .cb-copy-line{margin-top:2px}

/* Worked example copy can use the full row beneath the three figures. */
body[data-page="home"] .worked :is(.wfoot,.micro){width:100%!important;max-width:none!important}
body[data-page="home"] .worked .wfoot{display:block!important}

/* Keep every sector heading on one line while retaining safe responsive sizing. */
body[data-page="home"] .sector-group .sector-heading{
  white-space:nowrap!important;
  font-size:clamp(14px,1.08vw,18px)!important;
  letter-spacing:-.035em!important;
}
@media(max-width:600px){body[data-page="home"] .sector-group .sector-heading{font-size:15px!important}}

/* Regulatory text and its top rule now use the same width as the footer rule below. */
footer.ft .ft-reg{width:100%!important;max-width:none!important}

/* Search: stable popover placement, usable results and explicit open state. */
header.nav .desktop-site-search .site-search-form.cb-search-expanded,
header.nav .desktop-site-search .site-search-form:focus-within{
  overflow:visible!important;
}
header.nav .desktop-site-search .site-search-results{
  top:calc(100% + 10px)!important;
  z-index:100!important;
  overscroll-behavior:contain;
}
header.nav .desktop-site-search.open .site-search-form{
  top:calc(100% + 14px)!important;
  width:300px!important;
  padding:0 13px!important;
  justify-content:flex-start!important;
  overflow:visible!important;
  border-color:rgba(104,198,249,.42)!important;
  background:linear-gradient(145deg,rgba(8,36,59,.99),rgba(5,26,45,.99))!important;
  box-shadow:0 24px 50px -25px rgba(0,0,0,.82),inset 0 1px 0 rgba(255,255,255,.1)!important;
}
header.nav .desktop-site-search.open .site-search-input{
  width:236px!important;
  margin-left:9px!important;
  opacity:1!important;
  pointer-events:auto!important;
}
body.nav-solid header.nav .desktop-site-search.open .site-search-form,
body.nav-compact header.nav .desktop-site-search.open .site-search-form{
  background:#fff!important;
  border-color:#a9d6f0!important;
}
html[data-theme="dark"] body.nav-solid header.nav .desktop-site-search.open .site-search-form,
html[data-theme="dark"] body.nav-compact header.nav .desktop-site-search.open .site-search-form{
  background:linear-gradient(145deg,rgba(8,36,59,.99),rgba(5,26,45,.99))!important;
  border-color:rgba(104,198,249,.42)!important;
}
.site-search-result.is-active{background:#e8f5fd!important;outline:2px solid rgba(7,133,207,.2)!important}
html[data-theme="dark"] .site-search-results{background:#081f34!important;border-color:rgba(126,200,240,.22)!important}
html[data-theme="dark"] .site-search-result{color:#eaf6fd!important}
html[data-theme="dark"] .site-search-result small{color:#a9c4d8!important}
html[data-theme="dark"] .site-search-result:hover,
html[data-theme="dark"] .site-search-result.is-active{background:rgba(61,155,233,.13)!important}

/* Prevent accidental text/image context menus as requested. */
html.cb-context-menu-disabled{-webkit-touch-callout:none}
.site-search-results,
.site-search-result,
.site-search-result strong,
.site-search-result small{white-space:normal!important;overflow-wrap:anywhere!important}
@media(min-width:1481px){
  header.nav .brand{height:49px!important;min-height:49px!important;padding:10px!important}
  header.nav .brand img{max-width:104px!important;max-height:29px!important}
}
@media(min-width:1361px) and (max-width:1480px){
  header.nav .brand{height:46px!important;min-height:46px!important;padding:10px!important}
  header.nav .brand img{max-width:96px!important;max-height:26px!important}
}
body.nav-solid header.nav nav.links>a,
body.nav-compact header.nav nav.links>a,
html[data-theme="dark"] body.nav-solid header.nav nav.links>a,
html[data-theme="dark"] body.nav-compact header.nav nav.links>a{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}


/* v2.10.8 typography and spacing QA */
:where(h1,h2,h3,h4){text-wrap:balance;overflow-wrap:normal}
:where(p,li,.lead,.micro,.wfoot){text-wrap:pretty}
:where(.grid2,.grid3,.blog-grid,.team-grid,.sector-grid,.mobile-menu-link-grid)>*{min-width:0}
:where(.btn,button,a){-webkit-tap-highlight-color:transparent}
img{max-width:100%;height:auto}
body[data-page="home"] .worked .cb-worked-second-line{display:block;margin-top:4px}

/* Mobile search is intentionally desktop-only. */
.mobile-menu .mobile-site-search{display:none!important}

/* Premium mobile navigation — designed as a deliberate product, not a compressed desktop header. */
@media(max-width:1360px){
  .mobile-menu{
    position:fixed!important;
    inset:0!important;
    z-index:998!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:18px!important;
    width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
    padding:calc(102px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom))!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    background:
      radial-gradient(70% 34% at 100% 0%,rgba(65,181,241,.20),transparent 70%),
      radial-gradient(60% 40% at -8% 100%,rgba(2,113,188,.17),transparent 72%),
      linear-gradient(155deg,#031522 0%,#06223a 52%,#082f4d 100%)!important;
    color:#eef8ff!important;
    box-sizing:border-box!important;
    opacity:0;
    visibility:hidden;
    transform:translateY(-12px);
    transition:opacity .24s ease,transform .24s ease,visibility .24s ease!important;
  }
  .mobile-menu.show{opacity:1;visibility:visible;transform:none}
  .mobile-menu::before{
    content:""!important;
    position:fixed!important;
    inset:86px 12px 12px!important;
    z-index:-1!important;
    margin:0!important;
    border:1px solid rgba(138,211,250,.16)!important;
    border-radius:26px!important;
    background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
    box-shadow:0 28px 70px -38px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.06)!important;
    backdrop-filter:blur(20px) saturate(130%)!important;
    -webkit-backdrop-filter:blur(20px) saturate(130%)!important;
    pointer-events:none!important;
  }
  .mobile-menu::after{
    content:""!important;
    position:fixed!important;
    width:260px!important;height:260px!important;
    right:-126px!important;bottom:-118px!important;
    border-radius:50%!important;
    background:radial-gradient(circle,rgba(70,181,239,.18),transparent 68%)!important;
    pointer-events:none!important;
  }
  .mobile-menu-intro{
    position:relative;
    padding:18px 18px 19px;
    border:1px solid rgba(133,207,247,.15);
    border-radius:20px;
    background:linear-gradient(145deg,rgba(13,61,96,.78),rgba(6,34,57,.58));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 18px 44px -34px rgba(0,0,0,.9);
  }
  .mobile-menu-intro::after{content:"";position:absolute;right:16px;top:16px;width:42px;height:3px;border-radius:99px;background:linear-gradient(90deg,#168bd8,#71cdf8)}
  .mobile-menu-kicker{display:block;margin-bottom:8px;color:#87d3fb;font-size:10px;font-weight:850;letter-spacing:.18em;text-transform:uppercase}
  .mobile-menu-intro strong{display:block;max-width:80%;color:#fff;font-size:21px;line-height:1.15;letter-spacing:-.035em}
  .mobile-menu-intro small{display:block;margin-top:8px;color:#abc6d9;font-size:13px;line-height:1.45}
  .mobile-menu-group{display:grid;gap:9px}
  .mobile-menu-group-label{display:flex;align-items:center;gap:10px;padding:0 3px;color:#7ebfe5;font-size:10px;font-weight:850;letter-spacing:.16em;text-transform:uppercase}
  .mobile-menu-group-label::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,rgba(126,199,239,.24),transparent)}
  .mobile-menu-featured-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .mobile-menu a.nav-product{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    min-height:76px!important;
    padding:13px 12px 13px 14px!important;
    border:1px solid rgba(125,204,247,.18)!important;
    border-radius:17px!important;
    background:linear-gradient(145deg,rgba(17,111,174,.25),rgba(255,255,255,.035))!important;
    color:#fff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 14px 32px -28px rgba(0,0,0,.9)!important;
    text-decoration:none!important;
  }
  .mobile-menu a.nav-product::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:0 5px 5px 0;background:linear-gradient(#50c0f4,#1585d0);opacity:.85}
  .mobile-menu a.nav-product::after{content:none!important}
  .mobile-nav-copy{display:block;min-width:0}
  .mobile-nav-copy small{display:block;margin-bottom:4px;color:#84c8ee;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
  .mobile-nav-copy b{display:block;color:#f3f9fd;font-size:14px;line-height:1.18;letter-spacing:-.015em}

  .mobile-menu-featured-grid .mobile-nav-copy b{min-height:2.36em}
  .mobile-menu-featured-grid .mobile-nav-copy b br{display:block}
  .mobile-nav-arrow{display:grid;place-items:center;flex:0 0 29px;width:29px;height:29px;border:1px solid rgba(134,211,251,.18);border-radius:10px;background:rgba(63,170,229,.1);color:#88d5fc;font-size:17px}
  .mobile-menu a.nav-product:is(:hover,:focus-visible,[aria-current="page"],.is-current){border-color:rgba(126,213,255,.42)!important;background:linear-gradient(145deg,rgba(18,135,207,.4),rgba(255,255,255,.055))!important}
  .mobile-menu-link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .mobile-menu-link-grid a{
    display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;
    min-height:52px!important;margin:0!important;padding:0 12px 0 14px!important;
    border:1px solid rgba(134,204,242,.11)!important;border-radius:15px!important;
    background:rgba(255,255,255,.035)!important;color:#dcecf7!important;
    font-size:14px!important;font-weight:720!important;text-decoration:none!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  }
  .mobile-menu-link-grid a::before,.mobile-menu-link-grid a::after{content:none!important}
  .mobile-menu-link-grid a>span:last-child{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:rgba(68,171,228,.08);color:#7ccbf6;font-size:11px}
  .mobile-menu-link-grid a:last-child{grid-column:1/-1}
  .mobile-menu-link-grid a:is(:hover,:focus-visible,[aria-current="page"],.is-current){border-color:rgba(112,202,250,.3)!important;background:linear-gradient(135deg,rgba(18,124,191,.23),rgba(255,255,255,.035))!important;color:#fff!important}
  .mobile-menu-action-stack{display:grid;gap:9px}
  .mobile-menu-action-stack :is(.m-call,.portal-mobile-link,.mobile-apply){
    display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;
    width:100%!important;min-height:54px!important;height:54px!important;margin:0!important;padding:0 16px!important;
    border-radius:15px!important;box-sizing:border-box!important;font-size:14px!important;font-weight:800!important;letter-spacing:-.01em!important;
  }
  .mobile-menu-action-stack .m-call{color:#dcecf8!important;border:1px solid rgba(127,199,239,.17)!important;background:rgba(255,255,255,.045)!important}
  .mobile-menu-action-stack .m-call svg{width:18px!important;height:18px!important;color:#83cdf7!important}
  .mobile-menu-action-stack .portal-mobile-link{color:#edf8ff!important;border:1px solid rgba(97,190,242,.28)!important;background:linear-gradient(135deg,rgba(11,113,183,.27),rgba(38,150,216,.11))!important}
  .mobile-menu-action-stack .portal-mobile-link svg{width:18px!important;height:18px!important;color:#8bd4fc!important}
  .mobile-menu-action-stack .portal-status-dot{display:block!important;width:7px!important;height:7px!important;flex:0 0 7px!important;border-radius:50%!important;background:#54dda7!important;box-shadow:0 0 0 4px rgba(84,221,167,.12)!important}
  .mobile-menu-action-stack .mobile-apply{justify-content:center!important;gap:12px!important;text-align:center!important;color:#fff!important;background:linear-gradient(135deg,#0785d0,#45b6ef)!important;border:1px solid rgba(132,216,255,.5)!important;box-shadow:0 15px 30px -22px rgba(0,116,190,.95),inset 0 1px 0 rgba(255,255,255,.22)!important}
  .mobile-menu-trust{display:flex;align-items:center;justify-content:center;gap:10px;padding:1px 0 3px;color:#799bb2;font-size:10px;font-weight:700;letter-spacing:.04em}
  .mobile-menu-trust span+span::before{content:"•";margin-right:10px;color:#3b7295}
  body.menu-open{overflow:hidden!important}
}
@media(max-width:370px){
  .mobile-menu{padding-top:calc(98px + env(safe-area-inset-top))!important;padding-inline:14px!important;gap:15px!important}
  .mobile-menu::before{inset:82px 10px 10px!important}
  .mobile-menu-intro{padding:16px}
  .mobile-menu-intro strong{font-size:19px}
  .mobile-menu a.nav-product{min-height:72px!important;padding-inline:12px 10px!important}
  .mobile-nav-copy b{font-size:13px}
  .mobile-menu-link-grid a{min-height:49px!important;font-size:13px!important}
}
@media(prefers-reduced-motion:reduce){.mobile-menu{transition:none!important}}

@media(max-width:1360px){
  body.menu-open header.nav{z-index:1005!important;pointer-events:none}
  body.menu-open header.nav .nav-in{
    pointer-events:auto;
    background:linear-gradient(145deg,rgba(5,28,47,.96),rgba(7,42,68,.94))!important;
    border-color:rgba(132,207,248,.23)!important;
    box-shadow:0 16px 38px -28px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07)!important;
    backdrop-filter:blur(18px) saturate(135%)!important;
    -webkit-backdrop-filter:blur(18px) saturate(135%)!important;
  }
  body.menu-open header.nav .brand{opacity:1!important;visibility:visible!important}
  body.menu-open header.nav .burger{
    background:linear-gradient(145deg,rgba(17,111,174,.34),rgba(255,255,255,.07))!important;
    border-color:rgba(127,209,252,.38)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
  }
}

/* Final form-control QA: all portal actions and table fields meet a 44px target. */
body[data-page="portal"] .add-file,
body[data-page="portal"] .finance-table input{min-height:44px!important;height:44px!important}
@media(max-width:1360px){.mobile-menu::after{display:none!important}}
