/* Safety stock calculator page — green, centred hero, wide two-column tool, timeline sections */
.ss-page { --ss-ink:#062b22; --ss-green:#0f8a5f; --ss-deep:#0b6b4a; --ss-mint:#e7f7ef; --ss-line:#cfe9dc; --ss-muted:#3f5a50; color:var(--ss-ink); background:#fbfefc; }
.ss-page p { color:var(--ss-muted); line-height:1.75; }
.ss-wrap { max-width:1120px; margin:0 auto; padding:0 16px; }
.ss-hero { padding:28px 0 40px; text-align:center; background:radial-gradient(1200px 400px at 50% -10%,#d9f3e6 0%,rgba(251,254,252,0) 70%); }
.ss-hero .breadcrumb { justify-content:center; }
.ss-pill { display:inline-block; background:#fff; border:1px solid var(--ss-line); color:var(--ss-deep); border-radius:999px; padding:6px 14px; font-size:.8rem; font-weight:700; margin-bottom:18px; }
.ss-h1 { font-size:clamp(1.9rem,4.2vw,3rem); font-weight:900; line-height:1.15; max-width:900px; margin:0 auto 18px; color:var(--ss-ink); letter-spacing:-.5px; }
.ss-intro { max-width:760px; margin:0 auto 12px; font-size:1.05rem; }
.ss-ctas { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin:24px 0 8px; }
.ss-btn { display:inline-flex; align-items:center; gap:8px; padding:13px 28px; border-radius:999px; font-weight:750; text-decoration:none; transition:background .15s, color .15s; }
.ss-btn-a { background:var(--ss-green); color:#fff; }
.ss-btn-a:hover { background:var(--ss-deep); color:#fff; }
.ss-btn-b { background:var(--ss-mint); color:var(--ss-deep); }
.ss-btn-b:hover { background:#d2f0e1; color:var(--ss-deep); }

.ss-tool { display:grid; grid-template-columns:1fr 1fr; background:#fff; border:1px solid var(--ss-line); border-radius:22px; overflow:hidden; box-shadow:0 20px 50px rgba(6,43,34,.08); margin-top:10px; text-align:left; }
.ss-in { padding:30px; }
.ss-in h2, .ss-res h2 { font-size:1.1rem; font-weight:800; margin:0 0 16px; color:var(--ss-ink); }
.ss-group { margin-bottom:18px; }
.ss-group-t { font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; font-weight:800; color:var(--ss-green); margin-bottom:10px; }
.ss-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ss-f label { display:block; font-size:.82rem; font-weight:650; margin-bottom:5px; color:var(--ss-ink); }
.ss-f input { width:100%; border:1.5px solid var(--ss-line); border-radius:10px; padding:11px 12px; font-size:1rem; background:#fbfefc; }
.ss-f input:focus { outline:none; border-color:var(--ss-green); box-shadow:0 0 0 3px rgba(15,138,95,.14); }
.ss-run { width:100%; border:0; border-radius:999px; background:var(--ss-green); color:#fff; font-weight:800; padding:14px; font-size:1rem; cursor:pointer; margin-top:4px; }
.ss-run:hover { background:var(--ss-deep); }
.ss-err { display:none; color:#b42318; font-size:.85rem; margin-top:10px; }
.ss-res { background:linear-gradient(180deg,#0b6b4a,#06523a); color:#e6fff4; padding:30px; display:flex; flex-direction:column; }
.ss-res h2 { color:#fff; }
.ss-res p { color:#c7f0dd; }
.ss-num { font-size:3.4rem; font-weight:900; line-height:1; color:#fff; }
.ss-num-l { font-size:.92rem; color:#c7f0dd; margin:6px 0 18px; }
.ss-split { height:16px; border-radius:999px; overflow:hidden; display:flex; background:rgba(255,255,255,.15); }
.ss-split i { display:block; height:100%; }
.ss-split .a { background:#7ef0bd; }
.ss-split .b { background:#fcd34d; }
.ss-key { display:flex; flex-wrap:wrap; gap:14px; font-size:.82rem; margin:10px 0 16px; }
.ss-key span::before { content:""; display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:middle; }
.ss-key .a::before { background:#7ef0bd; }
.ss-key .b::before { background:#fcd34d; }
.ss-stats { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.ss-stats div { background:rgba(255,255,255,.08); border-radius:12px; padding:12px; }
.ss-stats b { display:block; font-size:1.3rem; color:#fff; }
.ss-stats small { color:#c7f0dd; font-size:.78rem; }
.ss-say { margin-top:14px; font-size:.9rem; line-height:1.6; background:rgba(255,255,255,.1); border-radius:12px; padding:12px 14px; }
.ss-idle { opacity:.55; }

.ss-sec { padding:64px 0; }
.ss-sec.tint { background:var(--ss-mint); }
.ss-h2 { font-size:clamp(1.45rem,2.6vw,1.95rem); font-weight:850; color:var(--ss-ink); margin:0 0 14px; }
.ss-center { text-align:center; max-width:780px; margin:0 auto; }
.ss-timeline { position:relative; max-width:820px; margin:34px auto 0; padding-left:34px; }
.ss-timeline::before { content:""; position:absolute; left:11px; top:6px; bottom:6px; width:3px; background:var(--ss-line); border-radius:2px; }
.ss-t { position:relative; margin-bottom:26px; }
.ss-t::before { content:""; position:absolute; left:-30px; top:4px; width:19px; height:19px; border-radius:50%; background:#fff; border:4px solid var(--ss-green); }
.ss-t h3 { font-size:1.05rem; font-weight:800; margin:0 0 6px; color:var(--ss-ink); }
.ss-t p { margin:0; }
.ss-table { width:100%; border-collapse:separate; border-spacing:0; background:#fff; border:1px solid var(--ss-line); border-radius:14px; overflow:hidden; margin-top:22px; }
.ss-table th, .ss-table td { padding:12px 16px; text-align:left; border-bottom:1px solid var(--ss-line); font-size:.94rem; }
.ss-table th { background:#f2fbf6; color:var(--ss-deep); font-weight:800; }
.ss-table tr:last-child td { border-bottom:0; font-weight:800; color:var(--ss-ink); }
.ss-two { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; }
.ss-signs { display:grid; gap:14px; }
.ss-sign { background:#fff; border-radius:14px; padding:18px 20px; border:1px solid var(--ss-line); }
.ss-sign h3 { font-size:1rem; font-weight:800; margin:0 0 6px; color:var(--ss-ink); }
.ss-sign p { margin:0; font-size:.94rem; }
.ss-cta { text-align:center; background:#fff; border:2px solid var(--ss-green); border-radius:24px; padding:46px 24px; }
.ss-cta p { max-width:680px; margin:0 auto; }
.ss-qa { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:26px; }
.ss-q { background:#fff; border:1px solid var(--ss-line); border-radius:14px; padding:20px 22px; }
.ss-q h3 { font-size:1rem; font-weight:800; margin:0 0 8px; color:var(--ss-ink); }
.ss-q p { margin:0; font-size:.94rem; }
.ss-more { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:20px; }
.ss-more a { background:#fff; border:1px solid var(--ss-line); border-radius:999px; padding:10px 18px; color:var(--ss-deep); font-weight:700; text-decoration:none; font-size:.9rem; }
.ss-more a:hover { background:var(--ss-green); color:#fff; border-color:var(--ss-green); }

@media (max-width:991px) {
  .ss-tool, .ss-two, .ss-qa { grid-template-columns:1fr; }
}
@media (max-width:575px) {
  .ss-row, .ss-stats { grid-template-columns:1fr; }
  .ss-in, .ss-res { padding:22px 18px; }
  .ss-sec { padding:48px 0; }
  .ss-table th, .ss-table td { padding:10px; font-size:.86rem; }
}