body { font-family: Open Sans }
.bg-danger { background-color: #d9534f !important }
.text-danger { color: #d9534f !important }
.bg-success { background-color: #c1e2b2 !important }
.text-success { color: #c1e2b2 !important }
.bg-warning { background-color: #fffdaf !important }
.text-warning { color: #fffdaf !important }
.bg-info { background-color: #5bc0de !important }
.text-info { color: #5bc0de !important }
:root {
    --primary: #003a5a;
    --secondary: #f18825;
    --bodyColor: #1d1d1d;
}
body {
    background-color: #f9f9f8;
    line-height: 1.8;
    font-size: 1.1rem;
    font-family: "Open Sans", serif;
}
a { color: var(--bodyColor); text-decoration: none; }
a:hover { color: var(--secondary); text-decoration: none; }
p { margin-bottom: 1.8rem; color: var(--bodyColor); font-family: "Open Sans", serif; }
h1, h2, h3, h4, h5 { color: var(--bodyColor); margin-bottom: 1.8rem; font-family: "Open Sans", serif; }
figure { margin: 0 }
#content figure { margin-bottom: 1.8rem; }
#content .text a { color: var(--secondary); text-decoration: none; }
#content .text a:hover { text-decoration: underline; }
.page { max-width: 992px; margin: auto; position: relative; z-index: 10; }
.page #content { padding: 2rem 10rem }
@media all and (max-width: 768px) { .page #content { padding: 1rem 0; } }
#header { top: 0; z-index: 999; transition-delay: 1s; transition: transform 0.5s; margin-bottom: 0 !important; }
#header .neos-contentcollection figure { padding: 10px; }
#content figure > figcaption {
    background-color: #cee8f7;
    padding: 0.5rem;
    margin-bottom: 2rem;
    margin-top: 0;
}
#content figure > figcaption p { font-size: 0.85rem; font-family: "Open Sans", serif; }
#content figure > figcaption p:last-child { margin: 0; }
.btn.bg-primary-color {
    display: inline-block;
    padding: 10px 20px;
    background: #E1A600;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
}
.bg-primary-color {
    background: #5ea22e !important;
    padding: 0.5rem 2rem !important;
    border-radius: 1.5rem !important;
    display: block;
    width: 400px;
    margin: 0 auto 1.5rem auto;
    display: block !important;
}
.main-nav {
    background: white;
    border-bottom: 2px #235fa0 solid;
    top: 0;
    z-index: 1000;
    padding: 0;
}
.nav-container {
    max-width: 992px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1rem;
}
.nav-logo { padding: 0.5rem 0; }
.nav-logo img { height: 50px; width: auto; }
.nav-menu {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.5rem;
}
.nav-menu a {
    color: black;
    text-decoration: none;
    padding: 1rem 0.75rem;
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    transition: background 0.3s;
}
.nav-menu a:hover { background: var(--secondary); color: white; }
.nav-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
}
.nav-toggle span {
    display: block;
    width: 25px;
    height: 3px;
    background: #235fa0;
    margin: 5px 0;
    transition: 0.3s;
}
.nav-toggle.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.nav-toggle.active span:nth-child(2) { opacity: 0; }
.nav-toggle.active span:nth-child(3) { transform: rotate(-45deg) translate(7px, -6px); }
@media (max-width: 768px) {
    .nav-toggle { display: block; }
    .nav-menu {
        position: fixed;
        top: 66px;
        left: -100%;
        width: 100%;
        height: calc(100vh - 66px);
        background: white;
        flex-direction: column;
        padding: 1rem 0;
        transition: left 0.3s ease;
        gap: 0;
    }
    .nav-menu.active { left: 0; }
    .nav-menu a { padding: 1rem 1.5rem; border-bottom: 1px solid rgba(255,255,255,0.1); font-size: 1rem; }
    .nav-logo img { height: 40px; }
    body.nav-open { overflow: hidden; }
    .btn.bg-primary-color { width: 100%; padding: 10px; font-size: 17px; }
    h1 { font-size: 2.2rem; }
    h2 { font-size: 1.95rem; }
    h3 { font-size: 1.6rem; }
}
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 70px; }
@media (max-width: 576px) {
    body { font-size: 1rem; }
    .page #content { padding: 1rem 0.75rem; }
    h1 { font-size: 1.75rem; line-height: 1.3; }
    h2 { font-size: 1.5rem; }
    h3 { font-size: 1.25rem; }
    p { margin-bottom: 1.2rem; }
    .bg-primary-color { width: 100%; padding: 0.75rem 1.5rem !important; }
}

/* ---------- CTA buttons (same as first.html) ---------- */
body { padding-bottom: 96px; }
.btn.bg-primary-color,
a.btn.bg-primary-color {
    background: #5ea22e !important;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(94, 162, 46, .42);
    border: none;
    font-weight: 800;
    text-align: center;
    transition: transform .14s, box-shadow .14s, filter .14s;
    position: relative;
    overflow: hidden;
}
.btn.bg-primary-color:hover,
a.btn.bg-primary-color:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
    color: #fff !important;
    box-shadow: 0 14px 32px rgba(94, 162, 46, .55);
}
#content .text a.cta-inline,
#content .text a[href*="trk.validchoice"] {
    color: #C94515;
    font-weight: 800;
}

/* ---------- Sticky order bar ---------- */
.stickybar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    background: rgba(255, 255, 255, .96); backdrop-filter: blur(12px);
    border-top: 1px solid #D8E4EE;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    box-shadow: 0 -6px 22px rgba(30, 58, 82, .10);
    font-family: "Open Sans", sans-serif;
}
.stickybar .sb-info { min-width: 0; display: flex; align-items: center; gap: 10px; }
.stickybar .sb-mini {
    flex: none; width: 38px; height: 38px; border-radius: 10px;
    background: #E8F5F2; display: flex; align-items: center; justify-content: center;
    overflow: hidden;
}
.stickybar .sb-mini img { width: 100%; height: 100%; object-fit: cover; }
.stickybar .sb-title {
    font-weight: 800; font-size: 14px; color: #1E3A52;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.2;
    display: inline-flex; align-items: center; gap: 6px;
}
.stickybar .sb-title .dose-pill {
    display: inline-flex; align-items: center; justify-content: center;
    background: #1E3A52; color: #fff;
    font-size: 10px; font-weight: 800; line-height: 1; padding: 4px 7px; border-radius: 99px;
}
.stickybar .sb-timer { font-size: 12px; font-weight: 800; color: #5A7085; line-height: 1.2; }
.stickybar .sb-timer b { color: #C94515; font-variant-numeric: tabular-nums; }
.stickybar .btn-sticky {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    flex: none; white-space: nowrap;
    min-height: 50px; padding: 0 18px; font-size: 15px; font-weight: 800;
    border-radius: 14px;
    background: #5ea22e;
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(94, 162, 46, .42);
    text-decoration: none;
}
.stickybar .btn-sticky:hover { color: #fff !important; filter: brightness(1.05); }
@media (max-width: 420px) { .stickybar .sb-mini { display: none; } }

/* Facebook-style thumbs-up.
   vendor.css draws this icon from a Sprite.png that is not in the project,
   so it is replaced here with a self-contained inline SVG (no icon font
   or external library required). */
div#facebook-comments i.thumbs-up {
    width: 14px;
    height: 14px;
    background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='12' fill='%231877F2'/><g transform='translate%284.6,4.9%29 scale%280.61%29' fill='%23fff'><path d='M9 21h9a2 2 0 0 0 1.85-1.23l3.02-7.05c.09-.23.13-.47.13-.72v-2c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2zM1 9h4v12H1z'/></g></svg>");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: -2px;
}