/* Shared mobile reading and navigation improvements, 6 Nov 2026. */
[data-clarity] { --clarity-ink: #17313c; --clarity-teal: #116b70; }
[data-clarity] :is(a,button,summary):focus-visible { outline: 3px solid #147d80; outline-offset: 4px; }
[data-clarity] :is([id],.clarity-anchor) { scroll-margin-top: 90px; }
.clarity-skip { position: fixed; top: -100px; left: 12px; z-index: 100000; background: white; padding: 12px; }
.clarity-skip:focus { top: 12px; }
.clarity-home-start,.clarity-overview { color: var(--clarity-ink); padding: 30px 24px; margin: 0 auto 36px; background: #fff; border: 1px solid #d9e5e7; border-radius: 12px; }
[data-clarity] :is(.clarity-home-start,.clarity-overview) h2 { background: none!important; border: none!important; padding: 0!important; margin: 8px 0 12px!important; font-size: clamp(22px,3vw,30px)!important; line-height: 1.55!important; text-align: left; }
[data-clarity] :is(.clarity-home-start,.clarity-overview) h2::before,[data-clarity] :is(.clarity-home-start,.clarity-overview) h2::after { display:none!important; }
[data-clarity] .clarity-eyebrow { color: #116b70; font-size: 13px; font-weight: 700; letter-spacing: .04em; margin: 0!important; }
.clarity-home-start>p,.clarity-overview>p { margin: 0 0 18px; font-size: 16px; line-height: 1.8; }
.clarity-work-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.clarity-work-grid a { display: flex; position:relative; flex-direction:column; justify-content:center; min-height:106px; padding:18px 30px 18px 16px; background:#f3f8f8; border:1px solid #cbdfe1; border-radius:8px; text-decoration:none!important; color:#17313c; }
.clarity-work-grid strong { font-size:17px; line-height:1.5; }
.clarity-work-grid span { font-size:13px; line-height:1.6; margin-top:5px; color:#49606a; }
.clarity-work-grid b { position:absolute; right:12px; color:#116b70; }
.clarity-work-grid a:hover { background:#e5f1f1; border-color:#116b70; }
.clarity-corporate { display:flex; justify-content:space-between; margin-top:12px; padding:16px; border:1px solid #d5dde1; border-radius:8px; color:#17313c; font-weight:700; text-decoration:none!important; }
.clarity-help { margin-top:22px; padding:20px; background:#fff9e7; border-radius:8px; line-height:1.8; }
.clarity-help p { margin:4px 0 8px!important; font-size:15px; }
.clarity-help a { display:inline-block; min-height:44px; padding:9px 0; font-size:15px; color:#15575b; font-weight:700; }
[data-clarity] .clarity-hours { font-size:13px; line-height:1.8; margin:16px 0 0!important; color:#49606a; }
.clarity-price { border-left:4px solid #e6be31; background:#fffaf0; padding:16px 18px; margin:20px 0; }
.clarity-price>span { display:block; font-size:12px; color:#6e5622; font-weight:700; margin-bottom:5px; }
.clarity-price strong { font-size:17px; line-height:1.8; }
.clarity-price p { font-size:13px; line-height:1.8; margin:8px 0 0!important; }
.clarity-jumps { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.clarity-jumps a { flex:1 1 140px; display:flex; justify-content:space-between; gap:10px; align-items:center; min-height:48px; border:1px solid #a6c2c5; border-radius:6px; padding:10px 14px; color:#15575b; text-decoration:none!important; font-size:14px; font-weight:700; background:#fff; }
.clarity-anchor { height:0; }
[data-clarity] [hidden] { display:none!important; }
[data-clarity] .animated { visibility:visible!important; animation:none!important; }
[data-clarity] #fix_bottom_menu .menu_btn { cursor:pointer; }
@media(max-width:600px) {
  [data-clarity] { --swl-fz--content:16px; }
  .clarity-home-start,.clarity-overview { padding:22px 16px; margin-bottom:28px; border-radius:8px; }
  .clarity-work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .clarity-work-grid a { min-height:106px; padding:14px 22px 14px 12px; }
  .clarity-work-grid strong { font-size:16px; }
  .clarity-work-grid span { font-size:12px; }
  .clarity-work-grid b { right:8px; }
  .clarity-corporate { font-size:14px; padding:14px 12px; }
  .clarity-help { padding:16px; }
  .clarity-jumps { gap:8px; }
  .clarity-jumps a { flex-basis:100%; }
  [data-clarity] #main_content p { line-height:1.9; }
  [data-clarity] #main_content p .read-unit { display:inline!important; white-space:normal!important; }
  [data-clarity] .min_width30_ { overflow-x:auto; }
  [data-clarity] .min_width30_ table { min-width:0!important; width:100%!important; table-layout:fixed; }
  [data-clarity] .min_width30_ td { overflow-wrap:anywhere; padding:12px 10px; font-size:14px; }
  [data-clarity] .min_width30_ td:first-child { width:34%; }
  [data-clarity] .hoko-photo-consult h2 .keep { display:inline; white-space:normal; }
}
@media(prefers-reduced-motion:reduce) { [data-clarity] * { scroll-behavior:auto!important; transition:none!important; } }

/* Compact photo cards: one service menu, two columns on phones. */
.clarity-work-grid a { padding:0 0 14px; overflow:hidden; justify-content:flex-start; background:#fff; border-color:#dce4e5; border-radius:12px; box-shadow:0 3px 12px rgba(23,49,60,.06); transition:box-shadow .2s,border-color .2s; }
.clarity-work-grid .clarity-work-photo { display:block; width:100%; height:auto; aspect-ratio:8/5; object-fit:cover; margin:0 0 12px; border-radius:0; }
.clarity-work-grid strong { padding:0 12px; font-size:16px; }
.clarity-work-grid span { padding:0 12px 0; margin:5px 0 0; font-size:12px; }
.clarity-work-grid b { position:static; align-self:flex-end; margin:8px 12px 0; width:26px; height:26px; border-radius:50%; background:#f9d130; color:#17313c; text-align:center; line-height:26px; }
.clarity-work-grid a:hover { background:#fffdf4; box-shadow:0 5px 16px rgba(23,49,60,.12); }
@media(max-width:600px) { .clarity-work-grid { gap:12px 10px; } .clarity-work-grid a { padding:0 0 12px; } .clarity-work-grid strong { font-size:15px; padding:0 10px; } .clarity-work-grid span { padding:0 10px; font-size:11px; } .clarity-work-grid .clarity-work-photo { margin-bottom:10px; } }

/* Keep the text-only fire equipment disclosure compact. */
[data-clarity] .clarity-fire-note .hoko-service-detail summary { aspect-ratio:auto; min-height:0; height:auto; padding:16px 18px; color:#17313c; background:#fff9e7; border:1px solid #e9dbab; border-radius:8px; font-size:15px; line-height:1.7; font-weight:700; display:list-item; list-style:disclosure-closed inside; overflow:visible; }
[data-clarity] .clarity-fire-note .hoko-service-detail[open] summary { list-style-type:disclosure-open; }
[data-clarity] .clarity-fire-note .hoko-service-detail summary::-webkit-details-marker { display:inline; }
[data-clarity] .clarity-fire-note + .hoko-flow { padding-top:24px; }

[data-clarity] .clarity-fire-note { margin-top:16px!important; margin-bottom:16px!important; }
[data-clarity] .clarity-fire-note + .hoko-flow { margin-top:0!important; padding-top:12px!important; }
[data-clarity] .clarity-fire-note + .hoko-flow > h2 { margin-top:0!important; margin-bottom:24px!important; }

/* Persistent mobile contact navigation, including iPhone safe area. */
@media screen and (max-width:959px) {
  [data-clarity] #fix_bottom_menu { display:block!important; position:fixed!important; inset:auto 0 0!important; width:100%!important; margin:0!important; transform:none!important; visibility:visible!important; opacity:1!important; transition:none!important; z-index:1000!important; padding-bottom:env(safe-area-inset-bottom,0px)!important; background:rgba(17,17,17,.94); }
  [data-clarity] #fix_bottom_menu .menu_list { display:flex; align-items:stretch; min-height:56px; height:56px; margin:0; padding:0; list-style:none; }
  [data-clarity] #fix_bottom_menu .menu-item { flex:1 1 25%; min-width:0; }
  [data-clarity] #fix_bottom_menu .menu-item a,[data-clarity] #fix_bottom_menu .menu_btn { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:56px; gap:5px; color:#fff; }
  [data-clarity] #fix_bottom_menu span { font-size:11px; line-height:1.2; margin:0; white-space:nowrap; }
  [data-clarity] #fix_bottom_menu i { font-size:22px; height:22px; line-height:22px; }
  [data-clarity] { padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))!important; }
}