/* Emergency Oxygen public pages. Urgent = red accent on SFA royal blue. Motion: ease-out, <300ms, specific props; hover only on real pointers. */
:root{--ox-ease:cubic-bezier(.23,1,.32,1);--ox-line:#C5CCE0}
html{scroll-behavior:smooth}[id]{scroll-margin-top:84px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.ox-hero{background:linear-gradient(110deg,var(--brand-deep),var(--brand) 62%,#2a45e0);color:#fff;padding:34px 0 40px;position:relative;overflow:hidden}
.ox-hero--slim{padding:26px 0 28px}
.ox-hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px 44px;align-items:center}
.ox-hero-grid:not(:has(.ox-hero-photo)){grid-template-columns:minmax(0,1fr)}
.ox-eyebrow{color:var(--gold-soft,#f0c777);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
.ox-hero h1{font-family:var(--font-display);font-size:clamp(2rem,4.4vw,3rem);line-height:1.1;margin:8px 0 2px;color:#fff}
.ox-bn{font-size:1.1rem;color:#dbe4ff;margin:0 0 8px;font-weight:600}
.ox-lede{font-size:1.04rem;color:#dbe4ff;max-width:560px;margin:0 0 16px}
.ox-cta{display:flex;flex-wrap:wrap;gap:8px}
.ox-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:999px;border:1.5px solid var(--brand);background:var(--brand);color:#fff;font:600 .93rem var(--font-body);text-decoration:none;cursor:pointer;transition:transform .15s var(--ox-ease),background-color .15s var(--ox-ease),box-shadow .15s var(--ox-ease)}
.ox-btn--red{background:var(--red,#d2232a);border-color:var(--red,#d2232a)}
.ox-btn--light{background:#fff;color:var(--brand-deep);border-color:#fff}
.ox-btn--ghost{background:transparent;border-color:rgba(255,255,255,.55);color:#fff}
.ox-btn--blue{background:var(--brand);border-color:var(--brand)}
.ox-btn--line{background:#fff;color:var(--brand);border-color:var(--ox-line)}
.ox-btn:active{transform:scale(.97)}
.ox-btn:focus-visible,.ox-fab:focus-visible,.ox-more summary:focus-visible{outline:3px solid var(--gold,#C98A2B);outline-offset:2px}
.ox-warn{margin:16px 0 0;padding:10px 14px;border-left:4px solid #ffb4b6;background:rgba(255,255,255,.1);border-radius:8px;font-size:.88rem;color:#fff;max-width:600px}
.ox-hero-photo{border-radius:18px;overflow:hidden;box-shadow:0 18px 40px rgba(6,12,70,.35);aspect-ratio:3/2;background:rgba(255,255,255,.1)}
.ox-hero-photo img{width:100%;height:100%;object-fit:cover;display:block}

.ox-stock{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:0;margin-top:-22px;position:relative;z-index:2;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 8px 22px rgba(17,31,143,.12);overflow:hidden}
.ox-stock-h{display:flex;flex-direction:column;gap:2px;padding:14px 18px;background:var(--brand-tint)}
.ox-stock-h b{font-size:.98rem}.ox-stock-h small{color:var(--ink-soft);font-size:.76rem;line-height:1.35}
.ox-live{display:inline-flex;align-items:center;gap:6px;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--leaf)}
.ox-live i{width:8px;height:8px;border-radius:50%;background:var(--leaf);animation:oxp 2s ease-out infinite}
@keyframes oxp{0%{box-shadow:0 0 0 0 rgba(44,110,79,.5)}100%{box-shadow:0 0 0 8px rgba(44,110,79,0)}}
.ox-stock-i{display:flex;flex-direction:column;gap:3px;padding:14px 18px;border-left:1px solid var(--border)}
.ox-stock-i span{font-weight:700;font-size:.9rem}.ox-stock-i small{color:var(--ink-faint);font-size:.76rem}
.ox-chip{font-style:normal;align-self:flex-start;margin-top:4px;font-weight:800;font-size:.76rem;border-radius:999px;padding:3px 11px}
.ox-chip--ok{background:#e3f4ea;color:#1f6b45}.ox-chip--low{background:#fff1d6;color:#8a5a00}.ox-chip--out{background:#fde5e6;color:#a31a20}

.ox-steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:22px 0 0;padding:0}
.ox-steps li{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:3px}
.ox-steps i{font-style:normal;width:26px;height:26px;border-radius:50%;background:var(--brand-tint);color:var(--brand);display:grid;place-items:center;font-weight:800;font-size:.82rem}
.ox-steps b{font-size:.95rem}.ox-steps span{color:var(--ink-soft);font-size:.82rem;line-height:1.4}

.ox-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.ox-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:18px 20px}
.ox-card h2{font-family:var(--font-display);font-size:1.3rem;margin:0 0 6px}.ox-card h2 span{font-family:var(--font-body);font-size:.85rem;color:var(--ink-soft);font-weight:600}
.ox-muted{color:var(--ink-soft);font-size:.9rem;margin:0 0 12px}
.ox-ticks{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.ox-ticks li{position:relative;padding-left:24px;font-size:.92rem}
.ox-ticks li::before{content:"";position:absolute;left:2px;top:.35em;width:12px;height:7px;border-left:2.5px solid var(--leaf);border-bottom:2.5px solid var(--leaf);transform:rotate(-45deg)}

.ox-sec{padding-top:34px}
.ox-sh{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:12px}
.ox-sh h2{font-family:var(--font-display);font-size:1.7rem;margin:0}.ox-sh h2 span{font-family:var(--font-body);font-size:.9rem;color:var(--ink-soft)}
.ox-imp{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.ox-ic{margin:0;background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden}
.ox-ic img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.ox-ic figcaption{display:flex;flex-direction:column;gap:3px;padding:10px 14px 14px}
.ox-ic small{color:var(--ink-faint)}
.ox-tag{font-style:normal;align-self:flex-start;background:var(--brand-tint);color:var(--brand);font-weight:700;font-size:.74rem;border-radius:999px;padding:2px 10px}

.ox-story{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px;margin-top:34px;align-items:start}
.ox-tl{list-style:none;margin:8px 0 12px;padding:0 0 0 18px;border-left:2px solid var(--ox-line);display:grid;gap:12px}
.ox-tl li{position:relative;display:flex;flex-direction:column;gap:1px}
.ox-tl li::before{content:"";position:absolute;left:-25px;top:.3em;width:10px;height:10px;border-radius:50%;background:var(--brand);border:2px solid #fff;box-shadow:0 0 0 1px var(--brand)}
.ox-tl span{color:var(--ink-soft);font-size:.88rem}
.ox-more summary{cursor:pointer;font-weight:700;color:var(--brand);min-height:44px;display:flex;align-items:center}
.ox-more p{font-size:.92rem;color:var(--ink-soft);margin:0 0 10px}
.ox-gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:12px}
.ox-gal img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;display:block}
.ox-leg{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-bottom:6px}
.ox-leg div{background:var(--brand-tint);border-radius:10px;padding:8px 12px;display:flex;flex-direction:column}
.ox-leg b{font-family:var(--font-display);font-size:1.5rem;color:var(--brand-deep);line-height:1.1}.ox-leg span{font-size:.78rem;color:var(--ink-soft)}.ox-leg i{font-style:normal}

.ox-disc{margin:22px 0 0;padding:12px 16px;background:#fff8e8;border:1px solid #f0d9a4;border-radius:12px;font-size:.88rem;color:#5c4300}
.ox-band{margin:22px 0 40px;padding:22px 26px;border-radius:16px;background:linear-gradient(110deg,var(--brand-deep),var(--brand));color:#fff;display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;justify-content:space-between}
.ox-band h2{font-family:var(--font-display);font-size:1.5rem;margin:0 0 2px;color:#fff}.ox-band h2 span{font-family:var(--font-body);font-size:.9rem}.ox-band p{margin:0;color:#dbe4ff}
.ox-band .ox-btn--blue{background:#fff;color:var(--brand-deep);border-color:#fff}

.ox-fab{display:none}

/* ---- Request form + status page ---- */
.ox-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start;padding:22px 0 40px}
.ox-side{position:sticky;top:90px;display:grid;gap:14px}
.ox-danger{background:#fff4f4;border:1px solid #f3c1c3;border-radius:14px;padding:14px 16px;font-size:.88rem}
.ox-danger b{color:#a31a20}
.ox-danger .ox-btn{width:100%;margin-top:10px}
.ox-next{margin:0;padding-left:0;list-style:none;display:grid;gap:8px;font-size:.88rem;color:var(--ink-soft)}
.ox-next b{color:var(--ink)}
.ox-form{display:grid;gap:16px}
.ox-fs{background:#fff;border:1px solid var(--border);border-radius:14px;padding:18px 20px;margin:0;min-width:0}
.ox-fs-h{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-family:var(--font-display);font-size:1.2rem}
.ox-fs-h i{font-style:normal;width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font:800 .85rem var(--font-body);flex:none}
.ox-fs-h small{font:600 .82rem var(--font-body);color:var(--ink-soft)}
.ox-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 14px}
.ox-grid .s2{grid-column:span 2}.ox-grid .s3{grid-column:1/-1}
.ox-fld{display:flex;flex-direction:column;gap:4px;min-width:0}
.ox-fld label{font-weight:600;font-size:.84rem;line-height:1.3}
.ox-fld label em{font-style:normal;color:var(--ink-faint);font-weight:500}
.ox-fld .req{color:var(--red,#d2232a)}
.ox-fld input,.ox-fld select,.ox-fld textarea{width:100%;min-height:44px;padding:9px 12px;border:1.5px solid var(--border);border-radius:10px;background:#fff;font:400 1rem var(--font-body);color:var(--ink);transition:border-color .15s var(--ox-ease),box-shadow .15s var(--ox-ease)}
.ox-fld textarea{min-height:64px;resize:vertical}
.ox-fld input:focus,.ox-fld select:focus,.ox-fld textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(26,46,200,.15)}
.ox-fld .input-error,.ox-fld .has-error{border-color:var(--red,#d2232a)}
.ox-fld .field-error{color:#a31a20;font-size:.8rem}
.ox-errs{background:#fff4f4;border:1px solid #f3c1c3;border-left:4px solid var(--red,#d2232a);border-radius:12px;padding:12px 16px;font-size:.9rem}
.ox-errs ul{margin:6px 0 0;padding-left:18px}
.ox-decl{background:#f7f9ff}
.ox-decl .checkbox-line{display:flex;gap:12px;align-items:flex-start;font-size:.92rem;line-height:1.55;cursor:pointer}
.ox-decl input[type=checkbox]{width:22px;height:22px;flex:none;margin-top:2px;accent-color:var(--brand)}
.ox-submit{width:100%;min-height:52px;font-size:1rem}
.ox-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ox-done{text-align:center;padding:30px 20px}
.ox-done h2{font-family:var(--font-display);font-size:1.8rem;margin:0 0 6px}
.ox-ref{display:inline-block;margin:12px 0;padding:10px 18px;border-radius:12px;background:var(--brand-tint);color:var(--brand-deep);font:800 1.3rem var(--font-body);letter-spacing:.04em;user-select:all}
.ox-trk{max-width:560px;margin:0 auto;padding:26px 0 40px}
.ox-stepper{list-style:none;margin:16px 0 4px;padding:0;display:grid;gap:0}
.ox-stepper li{position:relative;padding:0 0 18px 34px;color:var(--ink-faint);font-weight:600}
.ox-stepper li::before{content:"";position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;border:2px solid var(--ox-line);background:#fff}
.ox-stepper li::after{content:"";position:absolute;left:9px;top:24px;bottom:2px;width:2px;background:var(--ox-line)}
.ox-stepper li:last-child::after{display:none}
.ox-stepper li.is-done{color:var(--ink)}.ox-stepper li.is-done::before{background:var(--leaf);border-color:var(--leaf)}.ox-stepper li.is-done::after{background:var(--leaf)}
.ox-stepper li.is-now{color:var(--brand);font-weight:800}.ox-stepper li.is-now::before{border-color:var(--brand);box-shadow:0 0 0 4px rgba(26,46,200,.15)}
.ox-stepper small{display:block;font-weight:400;color:var(--ink-soft);font-size:.82rem}

@media (hover:hover) and (pointer:fine){
  .ox-btn:hover{box-shadow:0 6px 16px rgba(17,31,143,.25)}.ox-btn--light:hover{background:#eef2ff}.ox-btn--line:hover{background:var(--brand-tint)}
}
@media (max-width:900px){
  .ox-hero-grid,.ox-story,.ox-two,.ox-wrap{grid-template-columns:minmax(0,1fr)}
  .ox-stock{grid-template-columns:repeat(3,minmax(0,1fr))}.ox-stock-h{grid-column:1/-1}.ox-stock-i:nth-of-type(1){border-left:0}
  .ox-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ox-side{position:static;order:-1}
  .ox-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ox-grid .s3{grid-column:1/-1}
}
@media (max-width:600px){
  .ox-hero{padding:24px 0 34px}.ox-cta .ox-btn{flex:1 1 100%}
  .ox-stock{margin-top:-16px}.ox-stock-i{padding:12px 10px}.ox-stock-i span{font-size:.8rem}.ox-stock-i small{display:none}
  .ox-steps{grid-template-columns:minmax(0,1fr)}
  .ox-grid{grid-template-columns:minmax(0,1fr)}.ox-grid .s2,.ox-grid .s3{grid-column:auto}
  .ox-card,.ox-fs{padding:16px}.ox-band{padding:18px}.ox-band .ox-cta{width:100%}.ox-band .ox-btn{flex:1}
  .ox-sh h2{font-size:1.4rem}
  .ox-fab{display:inline-flex;align-items:center;gap:8px;position:fixed;right:14px;bottom:16px;z-index:50;min-height:52px;padding:0 20px;border-radius:999px;background:var(--red,#d2232a);color:#fff;font:700 .95rem var(--font-body);text-decoration:none;box-shadow:0 8px 20px rgba(210,35,42,.4);transition:transform .15s var(--ox-ease)}
  .ox-fab:active{transform:scale(.96)}
}
@media (prefers-reduced-motion:reduce){.ox-live i{animation:none}.ox-btn,.ox-fab{transition:none}}