/* ==========================================================================
   THE HABITUAL FIRST AIDER
   Prepare. Protect. Care. Respond.

   Warm and practical, not clinical: cream and white grounds, sage accents,
   navy headings, soft neutrals. Red appears ONLY on genuine expiry and
   emergency warnings, never as a theme colour.

   Class names avoid the -card / -tile / -tag / -pill / -badge suffixes, each of
   which a global rule in this file hijacks. Prefix is fa-.
   ========================================================================== */
#page-first-aider{
  background:#ffffff !important;
  font-family:'Nunito',system-ui,-apple-system,sans-serif;
}
#page-first-aider .fa-wrap{ max-width:1120px; margin:0 auto; padding:0 clamp(16px,4vw,28px) 90px; }
/* the global section{padding:52px 24px} rule reaches any <section> here */
#page-first-aider .fa-wrap section, #page-first-aider .fa-sec{ padding:0 !important; }
#page-first-aider .fa-sec{ margin:28px 0 0; }

/* ---- type ---------------------------------------------------------------- */
#page-first-aider .fa-eb{
  font-size:.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; margin:0 0 6px;
  color:#5F7350 !important; -webkit-text-fill-color:#5F7350 !important;
}
#page-first-aider .fa-h1{
  font-family:'Playfair Display',Georgia,serif !important;
  font-size:clamp(1.8rem,4.4vw,2.7rem) !important; font-weight:700 !important; line-height:1.12;
  letter-spacing:.02em; margin:0 0 8px !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#page-first-aider .fa-tline{
  margin:0 0 12px; font-size:.86rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:#5F7350 !important; -webkit-text-fill-color:#5F7350 !important;
}
#page-first-aider .fa-lead{
  margin:0 0 18px; font-size:.98rem; line-height:1.66; max-width:64ch;
  color:#4A5462 !important; -webkit-text-fill-color:#4A5462 !important;
}
#page-first-aider .fa-h2{
  font-family:'Playfair Display',Georgia,serif !important;
  font-size:clamp(1.2rem,2.6vw,1.55rem) !important; font-weight:700 !important; margin:0 !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#page-first-aider .fa-h3{
  font-family:'Nunito',system-ui,sans-serif !important;
  font-size:1.02rem !important; font-weight:800 !important; margin:0 !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#page-first-aider .fa-sub{ margin:4px 0 0; font-size:.88rem; line-height:1.6;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
#page-first-aider .fa-hrow{ display:flex; align-items:flex-end; justify-content:space-between;
  gap:14px; flex-wrap:wrap; margin:0 0 14px; }
#page-first-aider .fa-note{ margin:12px 0 0; font-size:.81rem; line-height:1.65;
  color:#5F6773 !important; -webkit-text-fill-color:#5F6773 !important; }

/* ---- controls ------------------------------------------------------------- */
#page-first-aider .fa-b, #faSheet .fa-b{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:46px; padding:12px 20px; border-radius:999px; cursor:pointer; font:inherit;
  font-size:.88rem; font-weight:800; text-align:center;
  background:#fff !important; border:1px solid #DDD7C9 !important;
  color:#3D4A3A !important; -webkit-text-fill-color:#3D4A3A !important;
}
#page-first-aider .fa-b:hover, #faSheet .fa-b:hover{ background:#EEF4EC !important; border-color:#CFE0C8 !important; }
#page-first-aider .fa-b.is-primary, #faSheet .fa-b.is-primary{
  background:#4E6640 !important; border-color:#4E6640 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important;
}
#page-first-aider .fa-b.is-primary:hover, #faSheet .fa-b.is-primary:hover{ background:#445A38 !important; border-color:#445A38 !important; }
/* the ONLY red in the feature — reserved for calling emergency services */
#page-first-aider .fa-b.is-urgent, #faSheet .fa-b.is-urgent{
  background:#9B2C2C !important; border-color:#9B2C2C !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important;
}
#page-first-aider .fa-b.is-sm, #faSheet .fa-b.is-sm{ min-height:44px; padding:10px 15px; font-size:.8rem; }
#page-first-aider .fa-b[disabled]{ opacity:.5; cursor:default; }
#page-first-aider .fa-b:focus-visible, #faSheet .fa-b:focus-visible,
#page-first-aider .fa-nb:focus-visible, #page-first-aider .fa-ch:focus-visible,
#page-first-aider .fa-tick:focus-visible{ outline:3px solid #CF9E3F; outline-offset:2px; }
#page-first-aider .fa-acts{ display:flex; gap:10px; flex-wrap:wrap; }
#page-first-aider .fa-link{
  background:none !important; border:0 !important; padding:10px 0; min-height:44px; font:inherit;
  font-size:.85rem; font-weight:800; cursor:pointer; text-align:left;
  color:#4E6640 !important; -webkit-text-fill-color:#4E6640 !important;
}
#page-first-aider .fa-link:hover{ text-decoration:underline; }

/* ---- tab bar -------------------------------------------------------------- */
#page-first-aider .fa-nav{
  position:sticky; top:0; z-index:40; background:#fff; padding:12px 0 10px;
  border-bottom:1px solid #EDF1EA; margin:0 0 4px;
}
#page-first-aider .fa-nbs{ display:flex; gap:6px; overflow-x:auto; padding:2px; }
#page-first-aider .fa-nb{
  flex:none; min-height:44px; padding:11px 17px; border-radius:999px; cursor:pointer; font:inherit;
  font-size:.86rem; font-weight:700; white-space:nowrap;
  background:#F4F6F1 !important; border:1px solid transparent !important;
  color:#4C5560 !important; -webkit-text-fill-color:#4C5560 !important;
}
#page-first-aider .fa-nb[aria-selected="true"]{
  background:#243447 !important; border-color:#243447 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important;
}

/* ---- panels and figures --------------------------------------------------- */
#page-first-aider .fa-panel{
  background:#fff !important; border:1px solid #E4E9E0 !important; border-radius:20px;
  padding:20px clamp(15px,3vw,22px);
}
#page-first-aider .fa-panel.is-cream{ background:#FBF8F2 !important; border-color:#EAE2D3 !important; }
#page-first-aider .fa-panel.is-sage{ background:#F5F9F3 !important; border-color:#DCE7D7 !important; }
#page-first-aider .fa-panel.is-navy{ background:#243447 !important; border-color:#243447 !important; }
#page-first-aider .fa-panel.is-navy .fa-h2,
#page-first-aider .fa-panel.is-navy .fa-h3,
#page-first-aider .fa-panel.is-navy .fa-fv{ color:#fff !important; -webkit-text-fill-color:#fff !important; }
#page-first-aider .fa-panel.is-navy .fa-sub,
#page-first-aider .fa-panel.is-navy .fa-fl{ color:#D3DBE4 !important; -webkit-text-fill-color:#D3DBE4 !important; }

#page-first-aider .fa-figs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
#page-first-aider .fa-fig{
  background:#fff !important; border:1px solid #E4E9E0 !important; border-radius:16px; padding:14px 15px; min-width:0;
}
#page-first-aider .fa-fl{
  display:block; font-size:.68rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase;
  color:#5E6A54 !important; -webkit-text-fill-color:#5E6A54 !important;
}
#page-first-aider .fa-fv{
  display:block; margin:7px 0 0; font-size:clamp(1.1rem,2.6vw,1.4rem); font-weight:800;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#page-first-aider .fa-fm{ display:block; margin:4px 0 0; font-size:.78rem;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
#page-first-aider .fa-bar{ display:block; height:8px; border-radius:99px; background:#EDF1EA !important;
  margin:10px 0 0; overflow:hidden; }
#page-first-aider .fa-fill{ display:block; height:100%; border-radius:99px;
  background:#7D9E77 !important; background-image:none !important; transition:width .3s ease; }
#page-first-aider .fa-fill.is-warn{ background:#C4913F !important; }
#page-first-aider .fa-fill.is-low{ background:#B4694C !important; }

/* ---- quick actions -------------------------------------------------------- */
#page-first-aider .fa-quick{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; }
#page-first-aider .fa-q{
  display:flex; flex-direction:column; gap:7px; align-items:flex-start; text-align:left;
  cursor:pointer; font:inherit; width:100%; min-height:132px;
  background:#fff !important; border:1px solid #E4E9E0 !important; border-radius:18px; padding:17px 18px;
}
#page-first-aider .fa-q:hover{ border-color:#CFE0C8 !important; background:#FAFCF9 !important; }
#page-first-aider .fa-q.is-hero{ background:#F5F9F3 !important; border-color:#C6D9BF !important; grid-column:span 2; }
#page-first-aider .fa-q-ic{
  width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:#EEF4EC !important; flex:none;
}
#page-first-aider .fa-q-ic svg{ width:22px; height:22px; stroke:#4E6640; fill:none;
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
#page-first-aider .fa-q-n{ font-size:.98rem; font-weight:800;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
#page-first-aider .fa-q-d{ font-size:.82rem; line-height:1.5;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
#page-first-aider .fa-q-f{ margin-top:auto; padding-top:8px; font-size:.78rem; font-weight:800;
  color:#4E6640 !important; -webkit-text-fill-color:#4E6640 !important; }

/* ---- rows ----------------------------------------------------------------- */
#page-first-aider .fa-rows{ display:flex; flex-direction:column; gap:9px; }
#page-first-aider .fa-row{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left; font:inherit;
  background:#fff !important; border:1px solid #E4E9E0 !important; border-radius:15px;
  padding:12px 15px; min-height:60px;
}
#page-first-aider button.fa-row{ cursor:pointer; }
#page-first-aider button.fa-row:hover{ border-color:#CFE0C8 !important; background:#FAFCF9 !important; }
#page-first-aider .fa-row.is-have{ background:#F6FAF4 !important; border-color:#DCE7D7 !important; }
#page-first-aider .fa-row.is-alert{ background:#FBF4F2 !important; border-color:#E5CBC3 !important; }
#page-first-aider .fa-row-t{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
#page-first-aider .fa-row-n{ font-size:.94rem; font-weight:800;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
#page-first-aider .fa-row-m{ font-size:.81rem; line-height:1.5;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
#page-first-aider .fa-tick{
  flex:none; width:44px; height:44px; min-height:44px; border-radius:50%; cursor:pointer; font:inherit;
  font-size:1rem; font-weight:800;
  background:#fff !important; border:2px solid #C6D2BF !important;
  color:#4E6640 !important; -webkit-text-fill-color:#4E6640 !important;
}
#page-first-aider .fa-row.is-have .fa-tick{ background:#5F7350 !important; border-color:#5F7350 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important; }
#page-first-aider .fa-x{
  flex:none; width:44px; height:44px; min-height:44px; border-radius:50%; cursor:pointer; font:inherit; font-size:.9rem;
  background:#fff !important; border:1px solid #E4E9E0 !important;
  color:#5F6773 !important; -webkit-text-fill-color:#5F6773 !important;
}
#page-first-aider .fa-x:hover{ background:#F4F6F1 !important; }
#page-first-aider .fa-empty{
  margin:0; padding:22px 18px; text-align:center; border-radius:16px;
  border:1px dashed #D8DFD4 !important; background:#FBFCFA !important;
  font-size:.9rem; line-height:1.6; color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important;
}

/* ---- status words --------------------------------------------------------- */
#page-first-aider .fa-st{
  display:inline-block; font-size:.71rem; font-weight:800; padding:4px 10px; border-radius:99px;
  background:#EEF2EC !important; color:#43503C !important; -webkit-text-fill-color:#43503C !important;
}
#page-first-aider .fa-st.is-soon{ background:#FBF1DD !important; color:#7A5A18 !important; -webkit-text-fill-color:#7A5A18 !important; }
#page-first-aider .fa-st.is-out{ background:#F8ECEE !important; color:#8A2F3B !important; -webkit-text-fill-color:#8A2F3B !important; }
#page-first-aider .fa-st.is-quiet{ background:#F1F2F0 !important; color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }

/* ---- cards grid ----------------------------------------------------------- */
#page-first-aider .fa-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:12px; }
#page-first-aider .fa-c{
  display:flex; flex-direction:column; gap:6px; text-align:left; cursor:pointer; font:inherit; width:100%;
  background:#fff !important; border:1px solid #E4E9E0 !important; border-radius:18px; padding:17px 18px; min-height:118px;
}
#page-first-aider .fa-c:hover{ border-color:#CFE0C8 !important; background:#FAFCF9 !important; }
#page-first-aider .fa-c-n{ font-size:.96rem; font-weight:800;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
#page-first-aider .fa-c-d{ font-size:.83rem; line-height:1.55;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
#page-first-aider .fa-c-f{ margin-top:auto; padding-top:9px; font-size:.78rem; font-weight:800;
  color:#4E6640 !important; -webkit-text-fill-color:#4E6640 !important; }

/* ---- search --------------------------------------------------------------- */
#page-first-aider .fa-search{ position:relative; margin:0 0 14px; }
#page-first-aider .fa-search input{
  width:100%; box-sizing:border-box; min-height:60px; padding:16px 20px; border-radius:16px;
  font:inherit; font-size:1.02rem; font-weight:600;
  background:#fff !important; border:2px solid #DDE3D8 !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#page-first-aider .fa-search input:focus{ outline:none; border-color:#7D9E77 !important;
  box-shadow:0 0 0 4px rgba(125,158,119,.18); }
#page-first-aider .fa-chips{ display:flex; gap:8px; flex-wrap:wrap; }
#page-first-aider .fa-ch, #faSheet .fa-ch{
  min-height:44px; padding:11px 16px; border-radius:999px; cursor:pointer; font:inherit;
  font-size:.83rem; font-weight:700;
  background:#fff !important; border:1px solid #DDE3D8 !important;
  color:#4C5560 !important; -webkit-text-fill-color:#4C5560 !important;
}
#page-first-aider .fa-ch[aria-pressed="true"], #faSheet .fa-ch[aria-pressed="true"]{
  background:#EEF4EC !important; border-color:#A9C4A2 !important;
  color:#33452C !important; -webkit-text-fill-color:#33452C !important;
}

/* ---- guide detail --------------------------------------------------------- */
#page-first-aider .fa-steps, #faSheet .fa-steps{ list-style:none; margin:0; padding:0; counter-reset:fastep; }
#page-first-aider .fa-steps li, #faSheet .fa-steps li{
  counter-increment:fastep; position:relative; padding:0 0 0 40px; margin:0 0 12px;
  font-size:.95rem; line-height:1.62;
  color:#3F4A55 !important; -webkit-text-fill-color:#3F4A55 !important;
}
#page-first-aider .fa-steps li::before, #faSheet .fa-steps li::before{
  content:counter(fastep); position:absolute; left:0; top:-1px;
  width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:#EEF4EC; color:#3D5233; font-size:.82rem; font-weight:800;
}
#faSheet .fa-block{ margin:0 0 16px; padding:15px 17px; border-radius:15px;
  background:#FBF8F2 !important; border:1px solid #EAE2D3 !important; }
#faSheet .fa-block.is-sage{ background:#F5F9F3 !important; border-color:#DCE7D7 !important; }
#faSheet .fa-block.is-alert{ background:#FBF2F2 !important; border-color:#E3C4C4 !important; }
#faSheet .fa-block h4{
  font-family:'Nunito',system-ui,sans-serif !important; font-size:.76rem !important; font-weight:800 !important;
  letter-spacing:.12em; text-transform:uppercase; margin:0 0 9px !important;
  color:#4E5A49 !important; -webkit-text-fill-color:#4E5A49 !important;
}
#faSheet .fa-block.is-alert h4{ color:#8A2F3B !important; -webkit-text-fill-color:#8A2F3B !important; }
#faSheet .fa-block ul{ margin:0; padding:0 0 0 20px; }
#faSheet .fa-block li{ margin:0 0 8px; font-size:.92rem; line-height:1.6;
  color:#3F4A55 !important; -webkit-text-fill-color:#3F4A55 !important; }
#faSheet .fa-block p{ margin:0; font-size:.92rem; line-height:1.62;
  color:#3F4A55 !important; -webkit-text-fill-color:#3F4A55 !important; }

/* ---- readiness ring ------------------------------------------------------- */
#page-first-aider .fa-ring{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
#page-first-aider .fa-ring svg{ flex:none; }

/* ---- forms ---------------------------------------------------------------- */
#page-first-aider .fa-f, #faSheet .fa-f{ display:block; margin:0 0 14px; }
#page-first-aider .fa-fl2, #faSheet .fa-fl2{
  display:block; margin:0 0 6px; font-size:.79rem; font-weight:800;
  color:#3F4A55 !important; -webkit-text-fill-color:#3F4A55 !important;
}
#page-first-aider .fa-i, #faSheet .fa-i{
  width:100%; box-sizing:border-box; min-height:46px; padding:11px 14px; border-radius:13px; font:inherit; font-size:.92rem;
  background:#fff !important; border:1px solid #DDE3D8 !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#page-first-aider .fa-i:focus, #faSheet .fa-i:focus{ outline:none; border-color:#7D9E77 !important;
  box-shadow:0 0 0 3px rgba(125,158,119,.2); }
#page-first-aider textarea.fa-i, #faSheet textarea.fa-i{ min-height:80px; resize:vertical; }
#page-first-aider .fa-fgrid, #faSheet .fa-fgrid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px;
}

/* ---- sheet ---------------------------------------------------------------- */
#faSheet{
  position:fixed; inset:0; z-index:9350; display:none; align-items:center; justify-content:center; padding:16px;
  background:rgba(28,34,28,.44); font-family:'Nunito',system-ui,sans-serif;
}
#faSheet.is-open{ display:flex; }
#faSheet .fa-box{
  width:100%; max-width:580px; max-height:calc(100dvh - 40px); overflow-y:auto;
  background:#fff !important; border-radius:22px; padding:22px clamp(16px,4vw,24px) 24px;
  box-shadow:0 24px 60px rgba(28,34,28,.26);
}
#faSheet .fa-box-h{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin:0 0 6px; }
#faSheet .fa-box-t{
  font-family:'Playfair Display',Georgia,serif !important; font-size:1.32rem !important; font-weight:700 !important;
  margin:0 !important; color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#faSheet .fa-box-x{
  flex:none; width:44px; height:44px; min-height:44px; border-radius:50%; cursor:pointer; font:inherit; font-size:1.05rem;
  background:#F4F6F1 !important; border:1px solid #E4E9E0 !important;
  color:#3D4A3A !important; -webkit-text-fill-color:#3D4A3A !important;
}
#faSheet .fa-box-b{ font-size:.93rem; line-height:1.68;
  color:#3F4A55 !important; -webkit-text-fill-color:#3F4A55 !important; }
#faSheet .fa-box-b > p{ margin:0 0 12px; color:#3F4A55 !important; -webkit-text-fill-color:#3F4A55 !important; }
#faSheet .fa-box-f{ display:flex; gap:10px; justify-content:flex-end; flex-wrap:wrap; margin:18px 0 0; }

/* ---- the persistent disclaimer -------------------------------------------- */
#page-first-aider .fa-disc{
  margin:26px 0 0; padding:16px 18px; border-radius:16px;
  background:#F7F9F5 !important; border:1px solid #E4EBE0 !important;
  font-size:.81rem; line-height:1.7; color:#4E5A49 !important; -webkit-text-fill-color:#4E5A49 !important;
}
#page-first-aider .fa-disc strong{ color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
/* the small always-visible line under the nav */
#page-first-aider .fa-mini{
  margin:0; padding:9px 14px; border-radius:12px;
  background:#FBF8F2 !important; border:1px solid #EAE2D3 !important;
  font-size:.76rem; line-height:1.55;
  color:#5A5346 !important; -webkit-text-fill-color:#5A5346 !important;
}

/* ---- emergency strip ------------------------------------------------------ */
#page-first-aider .fa-emg{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  padding:16px 18px; border-radius:18px;
  background:#FBF2F2 !important; border:1px solid #E3C4C4 !important;
}
#page-first-aider .fa-emg-t{ font-size:.95rem; font-weight:800;
  color:#7A2A34 !important; -webkit-text-fill-color:#7A2A34 !important; }
#page-first-aider .fa-emg-m{ font-size:.83rem; line-height:1.55;
  color:#6B4046 !important; -webkit-text-fill-color:#6B4046 !important; }

/* ---- sticky mobile actions ------------------------------------------------ */
#page-first-aider .fa-stick{
  position:fixed; left:50%; transform:translateX(-50%);
  bottom:calc(82px + env(safe-area-inset-bottom,0px));
  z-index:1900; display:none; gap:8px;
  box-shadow:0 10px 26px rgba(36,52,71,.22);
}
@media (max-width:760px){
  #page-first-aider.active .fa-stick{ display:inline-flex; }
  #page-first-aider .fa-wrap{ padding-bottom:180px; }
  #page-first-aider .fa-q.is-hero{ grid-column:span 1; }
}

/* ---- responsive ----------------------------------------------------------- */
@media (max-width:680px){
  #page-first-aider .fa-figs{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #page-first-aider .fa-acts .fa-b{ flex:1 1 auto; }
  #page-first-aider .fa-quick{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #page-first-aider .fa-q{ min-height:120px; padding:15px; }
}
@media (max-width:430px){
  #page-first-aider .fa-figs{ grid-template-columns:1fr; }
  #page-first-aider .fa-quick{ grid-template-columns:1fr; }
  #page-first-aider .fa-row{ flex-wrap:wrap; }
}