:root {
    --forest: #314f2d;
    --leaf: #718348;
    --sun: #f0821e;
    --sand: #f3dfb8;
    --water: #6fb7b4;
    --ink: #1f2a1e;
    --mist: #f7f4ea;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    color: var(--ink);
    background: linear-gradient(180deg, #fffaf0 0%, #eef7f2 46%, #f8fbf9 100%);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.app-nav {
    background: rgba(255, 252, 244, .94);
    border-bottom: 1px solid rgba(49, 79, 45, .12);
    backdrop-filter: blur(12px);
}

.navbar-brand span,
h1,
h2 {
    color: var(--forest);
    font-weight: 800;
    letter-spacing: 0;
}

h1 { font-size: clamp(2rem, 7vw, 4.4rem); }
h2 { font-size: 1.2rem; }

.nav-link.active {
    color: var(--sun) !important;
    font-weight: 700;
}

.hero {
    min-height: 72svh;
    display: flex;
    align-items: center;
    background:
        linear-gradient(90deg, rgba(49, 79, 45, .91), rgba(49, 79, 45, .62), rgba(240, 130, 30, .28)),
        url("../img/logo-acrovital.png") center right 12% / min(58vw, 620px) no-repeat;
    color: white;
}

.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 420px);
    gap: 2rem;
    align-items: center;
}

.hero h1,
.hero .lead,
.hero .eyebrow { color: white; }

.hero-logo {
    width: min(100%, 420px);
    border-radius: 8px;
    box-shadow: 0 24px 80px rgba(31, 42, 30, .22);
}

.eyebrow {
    text-transform: uppercase;
    font-weight: 800;
    color: var(--sun);
}

.lead {
    max-width: 680px;
    font-size: 1.25rem;
}

.goal-strip {
    display: flex;
    flex-wrap: wrap;
    gap: .8rem;
    align-items: center;
    width: fit-content;
    margin-top: 1.5rem;
    padding: .8rem 1rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .22);
}

.section-grid,
.chart-grid,
.cards-grid,
.metrics-grid {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
    margin-bottom: 2rem;
}

.section-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.chart-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.metrics-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.page {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.page-title-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.date-picker {
    display: flex;
    gap: .5rem;
    min-width: min(100%, 300px);
}

.panel,
.metric,
.program-card {
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(49, 79, 45, .08);
    padding: 1.2rem;
}

.mission-list {
    display: grid;
    gap: .8rem;
}

.mission {
    display: flex;
    align-items: center;
    gap: .7rem;
    font-weight: 700;
}

.mission-state {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid var(--leaf);
}

.mission.done .mission-state { background: var(--leaf); }
.mission.partial .mission-state { background: linear-gradient(90deg, var(--sun) 50%, transparent 50%); }
.mission.todo .mission-state { border-color: #a8a8a8; }

.mission-progress-list {
    display: grid;
    gap: .9rem;
}

.mission-progress-head {
    display: flex;
    justify-content: space-between;
    gap: .8rem;
    align-items: baseline;
    color: var(--forest);
    font-weight: 800;
}

.mission-progress-head strong {
    color: #5b6659;
    font-size: .88rem;
    white-space: nowrap;
}

.mini-progress {
    height: .55rem;
    overflow: hidden;
    border-radius: 999px;
    background: #e5eadc;
}

.mini-progress span {
    display: block;
    height: 100%;
    min-width: 0;
    border-radius: 999px;
    background: var(--sun);
}

.mission-progress.done .mini-progress span {
    background: var(--leaf);
}

.badge-nature {
    background: rgba(113, 131, 72, .16);
    color: var(--forest);
}

.stat-main {
    margin-bottom: .2rem;
    color: var(--sun);
    font-size: 2rem;
    font-weight: 850;
}

.metric span {
    display: block;
    color: #5b6659;
    font-weight: 700;
}

.metric strong {
    display: block;
    color: var(--forest);
    font-size: 1.7rem;
}

.progress-lg {
    height: 1rem;
    background: #e5eadc;
}

.progress-bar,
.btn-accent {
    background: var(--sun);
    border-color: var(--sun);
}

.btn-accent {
    color: white;
    font-weight: 800;
}

.chart-panel {
    min-height: 330px;
}

.chart-panel canvas {
    width: 100% !important;
    height: 300px !important;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.journal-sections {
    display: grid;
    gap: 1rem;
}

.journal-form label {
    font-weight: 700;
    color: var(--forest);
}

.activity-list {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.activity-card {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(180px, .8fr);
    gap: 1rem;
    padding: 1.2rem;
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(49, 79, 45, .08);
}

.activity-card h2 {
    margin-bottom: .1rem;
}

.activity-date {
    color: var(--sun);
    font-weight: 800;
}

.activity-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .8rem;
    align-content: start;
}

.activity-stats strong {
    display: block;
    color: var(--forest);
    font-size: 1.45rem;
}

.activity-stats span {
    display: block;
}

.activity-stats span,
.activity-extra {
    color: #5b6659;
    font-size: .92rem;
}

.activity-extra {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    grid-column: 1 / -1;
    padding-top: .6rem;
    border-top: 1px solid rgba(49, 79, 45, .1);
}

.program-card span {
    color: var(--sun);
    font-weight: 800;
    text-transform: uppercase;
}

.coach-panel {
    max-width: 880px;
}

.coach-answer {
    margin: 1rem 0;
    padding: 1rem;
    border-left: 4px solid var(--sun);
    background: rgba(240, 130, 30, .08);
    border-radius: 8px;
}

.login-page {
    min-height: 100svh;
    display: grid;
    place-items: center;
    padding: 1rem;
}

.login-shell {
    width: min(100%, 980px);
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    overflow: hidden;
    border-radius: 8px;
    background: white;
    box-shadow: 0 28px 90px rgba(49, 79, 45, .18);
}

.login-visual {
    display: grid;
    place-items: center;
    padding: 2rem;
    background: linear-gradient(145deg, var(--sand), #eaf4ef);
}

.login-visual img {
    width: min(100%, 520px);
}

.login-panel {
    padding: clamp(1.5rem, 5vw, 3rem);
    align-self: center;
}

.public-site {
    background: #fffaf0;
}

.public-nav {
    background: rgba(255, 252, 244, .96);
    border-bottom: 1px solid rgba(49, 79, 45, .12);
    backdrop-filter: blur(12px);
}

.public-nav .navbar-brand {
    padding: 0;
}

.public-nav .navbar-brand img {
    width: 104px;
    height: 104px;
    object-fit: contain;
}

.public-hero {
    min-height: 68svh;
    display: flex;
    align-items: center;
    color: white;
    background:
        linear-gradient(90deg, rgba(49, 79, 45, .95), rgba(78, 104, 69, .84), rgba(240, 130, 30, .18));
}

.public-page-hero {
    padding: clamp(3rem, 9vw, 6rem) 0;
    color: white;
    background:
        linear-gradient(90deg, rgba(49, 79, 45, .94), rgba(113, 131, 72, .76)),
        url("../img/logo-acrovital.png") right 8vw center / min(46vw, 520px) no-repeat;
}

.public-page-hero h1,
.public-page-hero .lead,
.public-page-hero .eyebrow {
    color: white;
}

.presentation-hero {
    padding: clamp(2.8rem, 7vw, 4.8rem) 0;
}

.presentation-hero h1 {
    font-size: clamp(2.4rem, 6vw, 4.4rem);
}

.presentation-page h2 {
    font-size: clamp(1.7rem, 3.2vw, 2.6rem);
}

.public-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 480px);
    gap: clamp(2rem, 7vw, 5rem);
    align-items: center;
}

.public-hero h1 {
    color: white;
    font-size: clamp(3rem, 8vw, 6.5rem);
}

.public-hero .lead,
.public-hero .eyebrow {
    color: white;
}

.home-hero-simple {
    padding: clamp(4rem, 10vw, 7rem) 0;
    color: white;
    background:
        linear-gradient(135deg, rgba(49, 79, 45, .96), rgba(82, 111, 72, .88), rgba(240, 130, 30, .2));
}

.home-hero-content {
    max-width: 780px;
}

.home-hero-simple h1 {
    max-width: 760px;
    color: white;
    font-size: clamp(2.7rem, 7vw, 5.8rem);
    line-height: 1.03;
}

.home-hero-simple .lead,
.home-hero-simple .eyebrow {
    color: white;
}

.home-hero-simple .lead {
    max-width: 680px;
}

.home-overview-band {
    padding-top: clamp(2.5rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.5rem, 6vw, 4.5rem);
}

.home-centered-title {
    max-width: 780px;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.home-link-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.home-link-card {
    display: block;
    min-height: 180px;
    padding: 1.25rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: rgba(255, 255, 255, .94);
    color: inherit;
    text-decoration: none;
    box-shadow: 0 14px 34px rgba(49, 79, 45, .07);
}

.home-link-card span {
    color: var(--sun);
    font-size: .8rem;
    font-weight: 850;
}

.home-link-card strong {
    display: block;
    margin: .35rem 0 .45rem;
    color: var(--forest);
    font-size: 1.3rem;
}

.home-link-card p {
    margin-bottom: 0;
    color: #43513f;
}

.home-link-card:hover {
    border-color: rgba(240, 130, 30, .55);
    transform: translateY(-2px);
}

.public-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .8rem;
    margin-top: 1.5rem;
}

.public-logo-panel {
    padding: .8rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 28px 80px rgba(31, 42, 30, .22);
}

.public-logo-panel img,
.public-image-tile img {
    display: block;
    width: 100%;
    border-radius: 8px;
}

.public-band {
    padding: clamp(3rem, 8vw, 6rem) 0;
}

.home-intro-grid {
    display: grid;
    grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr);
    gap: clamp(1.5rem, 5vw, 4rem);
    align-items: start;
}

.assessment-block {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    gap: 1.5rem;
    align-items: center;
    padding: clamp(1.4rem, 4vw, 2.2rem);
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: white;
    box-shadow: 0 18px 42px rgba(49, 79, 45, .08);
}

.assessment-block .btn {
    white-space: nowrap;
}

.assessment-block h2 {
    margin-bottom: .7rem;
    font-size: clamp(1.8rem, 4vw, 3rem);
}

.assessment-block p:last-child {
    margin-bottom: 0;
}

.public-band-soft {
    background: #eef7f2;
}

.public-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, .8fr);
    gap: clamp(1.5rem, 5vw, 4rem);
    align-items: center;
}

.public-two-col.reverse {
    grid-template-columns: minmax(280px, .8fr) minmax(0, 1fr);
}

.public-two-col h2,
.public-section-title h2 {
    font-size: clamp(2rem, 5vw, 3.8rem);
}

.public-card-list {
    display: grid;
    gap: 1rem;
}

.public-card-list article,
.public-product-card,
.admin-card {
    padding: 1.2rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 18px 42px rgba(49, 79, 45, .08);
}

.public-card-list strong,
.public-product-card h3,
.admin-card strong {
    display: block;
    color: var(--forest);
    font-size: 1.25rem;
}

.public-card-list span {
    color: #5b6659;
}

.public-image-tile {
    padding: 1rem;
    background: white;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(49, 79, 45, .08);
}

.public-section-title {
    max-width: 720px;
    margin-bottom: 1.5rem;
}

.shop-category-band {
    padding: clamp(1.8rem, 4vw, 3rem) 0;
}

.compact-section-title {
    margin-bottom: .9rem;
}

.compact-section-title h2 {
    font-size: clamp(1.8rem, 4vw, 3rem);
    margin-bottom: .4rem;
}

.compact-section-title p {
    margin-bottom: 0;
}

.public-product-grid,
.public-category-grid,
.admin-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.shop-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.shop-card {
    overflow: hidden;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: white;
    box-shadow: 0 18px 42px rgba(49, 79, 45, .08);
}

.shop-card img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    background: #eef7f2;
}

.shop-card div {
    padding: 1rem;
}

.shop-card span {
    color: var(--sun);
    font-size: .8rem;
    font-weight: 800;
    text-transform: uppercase;
}

.shop-card h3 {
    margin: .2rem 0;
}

.shop-card a {
    color: var(--forest);
    text-decoration: none;
}

.shop-card strong,
.product-price {
    display: block;
    color: var(--sun);
    font-size: 1.4rem;
    font-weight: 850;
}

.shop-card small {
    color: #5b6659;
}

.category-link {
    color: inherit;
    text-decoration: none;
}

.category-link.active {
    border-color: rgba(247, 126, 22, .65);
    box-shadow: 0 18px 42px rgba(247, 126, 22, .14);
}

.category-chip-grid {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}

.public-search-bar,
.product-filter-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: .8rem;
    align-items: end;
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: rgba(255, 255, 255, .88);
}

.product-filter-bar {
    grid-template-columns: minmax(220px, 1fr) minmax(220px, .7fr) auto;
    margin-bottom: 1rem;
}

.product-filter-actions {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}

.contact-filter-bar {
    display: flex;
    gap: .8rem;
    align-items: end;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.contact-filter-bar label {
    min-width: min(100%, 260px);
}

.source-choice-field {
    display: grid;
    gap: .45rem;
}

.source-choice-field > span {
    color: var(--forest);
    font-weight: 700;
}

.source-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
}

.small-choice span {
    min-height: 42px;
    padding: .55rem .7rem;
    font-size: .92rem;
}

.contact-alert-card {
    display: grid;
    gap: .2rem;
    width: 100%;
    margin-bottom: 1rem;
    padding: 1rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: rgba(255, 255, 255, .92);
    color: var(--forest);
    text-align: left;
    box-shadow: 0 18px 42px rgba(49, 79, 45, .08);
}

.contact-alert-card.has-alert {
    border-color: rgba(220, 53, 69, .35);
    background: #fff5f5;
}

.contact-alert-card span {
    color: var(--sun);
    font-weight: 850;
    text-transform: uppercase;
}

.contact-alert-card strong {
    color: #b4232f;
    font-size: 2.1rem;
    line-height: 1;
}

.contact-alert-card small {
    color: #5b6659;
}

.followup-date.is-due {
    display: inline-block;
    padding: .18rem .45rem;
    border-radius: 8px;
    background: #ffe2e6;
    color: #b4232f;
    font-weight: 800;
}

.followup-date.is-late {
    background: #ffd1d8;
}

.template-list {
    display: grid;
    gap: 1rem;
}

.template-card {
    display: grid;
    gap: .8rem;
    padding: 1rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: white;
}

.template-card span {
    display: block;
    color: var(--sun);
    font-weight: 850;
    text-transform: uppercase;
    font-size: .82rem;
}

.template-card strong {
    color: var(--forest);
}

.category-chip {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: .45rem .8rem;
    border: 1px solid rgba(49, 79, 45, .14);
    border-radius: 8px;
    background: rgba(255, 255, 255, .94);
    color: var(--forest);
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(49, 79, 45, .06);
}

.category-chip span {
    color: inherit;
    font-size: .78rem;
    font-weight: 850;
    line-height: 1.1;
    text-transform: uppercase;
}

.category-chip.active {
    border-color: var(--sun);
    background: rgba(240, 130, 30, .1);
    color: var(--sun);
}

.category-chip:hover {
    border-color: rgba(240, 130, 30, .7);
    color: var(--sun);
}

.shop-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.product-flags {
    display: block;
    color: var(--sun);
    font-size: .8rem;
    font-weight: 800;
    text-transform: uppercase;
}

.breadcrumb-nav {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    align-items: center;
    margin-bottom: 1.4rem;
    color: #5b6659;
    font-size: .95rem;
}

.breadcrumb-nav a {
    color: var(--forest);
    text-decoration: none;
    font-weight: 700;
}

.breadcrumb-nav a:hover {
    color: var(--sun);
}

.breadcrumb-nav strong {
    color: #5b6659;
    font-weight: 700;
}

.product-detail {
    display: grid;
    grid-template-columns: minmax(260px, .85fr) minmax(0, 1fr);
    gap: clamp(1.5rem, 5vw, 4rem);
    align-items: start;
}

.product-title {
    font-size: clamp(2rem, 4.4vw, 3.6rem);
    line-height: 1.08;
}

.product-detail-image {
    padding: 1rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: white;
    box-shadow: 0 18px 42px rgba(49, 79, 45, .08);
}

.product-detail-image img {
    width: 100%;
    border-radius: 8px;
}

.cart-add-form {
    display: flex;
    gap: .8rem;
    align-items: end;
    flex-wrap: wrap;
}

.cart-add-form input {
    width: 120px;
}

.auth-layout {
    max-width: 900px;
}

.contact-form {
    display: grid;
    gap: 1rem;
}

.anti-bot-input {
    max-width: 160px;
}

.spam-field {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.cart-panel,
.order-list {
    display: grid;
    gap: 1rem;
}

.assessment-form-layout {
    max-width: 980px;
}

.assessment-form {
    display: grid;
    gap: 1.4rem;
}

.assessment-step {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(49, 79, 45, .1);
    border-radius: 8px;
    background: linear-gradient(180deg, #ffffff, #fbfdf9);
}

.assessment-step h2,
.assessment-step h3 {
    margin: 0;
}

.assessment-step h3 {
    color: var(--forest);
    font-size: 1.05rem;
}

.choice-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
}

.choice-grid.compact {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.choice-card,
.segmented-choice label {
    cursor: pointer;
}

.choice-card input,
.segmented-choice input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.choice-card span,
.segmented-choice span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: .7rem .85rem;
    border: 1px solid rgba(49, 79, 45, .18);
    border-radius: 8px;
    background: white;
    color: var(--forest);
    font-weight: 800;
    text-align: center;
    transition: border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.choice-card input:checked + span,
.segmented-choice input:checked + span {
    border-color: var(--sun);
    background: rgba(240, 130, 30, .1);
    color: #c7630b;
    box-shadow: 0 10px 24px rgba(240, 130, 30, .12);
}

.segmented-choice {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
}

.segmented-choice.wide {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.conditional-field {
    display: grid;
    overflow: hidden;
    max-height: 160px;
    opacity: 1;
    transition: max-height .22s ease, opacity .22s ease;
}

.conditional-field.is-hidden {
    max-height: 0;
    opacity: 0;
    pointer-events: none;
}

.assessment-admin-list {
    display: grid;
    gap: 1rem;
}

.assessment-admin-card {
    padding: 1rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: #fbfdf9;
}

.assessment-admin-head,
.assessment-status-form {
    display: flex;
    gap: .8rem;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
}

.assessment-admin-actions {
    display: flex;
    gap: .5rem;
    align-items: flex-start;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.assessment-admin-edit-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.assessment-edit-form,
.assessment-edit-grid {
    display: grid;
    gap: 1rem;
}

.assessment-edit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.assessment-admin-head span {
    display: block;
    color: #5b6659;
}

.assessment-admin-grid,
.assessment-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem 1rem;
    margin: 1rem 0;
}

.assessment-detail-grid section {
    padding: .8rem;
    border-radius: 8px;
    background: white;
}

.assessment-detail-grid h3 {
    font-size: 1rem;
    color: var(--forest);
}

.cart-row {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) 110px auto;
    gap: 1rem;
    align-items: center;
    padding: .8rem 0;
    border-bottom: 1px solid rgba(49, 79, 45, .12);
}

.order-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 1rem;
    align-items: center;
    padding: .8rem 0;
    border-bottom: 1px solid rgba(49, 79, 45, .12);
}

.cart-row:last-child,
.order-row:last-child {
    border-bottom: 0;
}

.cart-row img {
    width: 72px;
    height: 72px;
    border-radius: 8px;
    object-fit: cover;
    background: #eef7f2;
}

.cart-row span,
.order-row span {
    display: block;
    color: #5b6659;
}

.cart-total {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-top: .8rem;
    font-size: 1.15rem;
}

.checkout-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.admin-products-layout {
    display: grid;
    grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr);
    gap: 1rem;
    align-items: start;
}

.admin-list {
    display: grid;
    gap: .8rem;
    margin-top: 1rem;
}

.admin-list article {
    padding: .9rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: #fbfdf9;
}

.admin-list strong,
.admin-list span {
    display: block;
}

.check-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: .8rem;
}

.current-product-image {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin: .8rem 0;
}

.current-product-image img {
    width: 90px;
    height: 90px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid rgba(49, 79, 45, .12);
}

.admin-product-list {
    display: grid;
    gap: .8rem;
}

.product-empty-state {
    box-shadow: none;
}

.admin-product-row {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) auto auto;
    gap: 1rem;
    align-items: center;
    padding: .8rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: white;
}

.admin-product-row img {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 8px;
}

.admin-product-row strong,
.admin-product-row span {
    display: block;
}

.stock-value {
    margin-top: .25rem;
    color: var(--forest);
    font-weight: 850;
}

.stock-value.stock-negative {
    color: #c5162e;
}

.admin-order-lines {
    display: grid;
    gap: .8rem;
}

.admin-order-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(180px, 260px) auto auto;
    gap: 1rem;
    align-items: end;
    padding: .9rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: #fbfdf9;
}

.admin-order-line span {
    display: block;
    color: #5b6659;
}

.line-quantity-form,
.add-order-item-form,
.admin-create-order-form {
    display: flex;
    gap: .6rem;
    align-items: end;
    flex-wrap: wrap;
}

.line-quantity-form input {
    width: 96px;
}

.add-order-item-form {
    padding: .9rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: rgba(113, 131, 72, .08);
}

.add-order-item-form label:first-of-type {
    flex: 1 1 280px;
}

.add-order-item-form input {
    width: 110px;
}

.admin-create-order-form label {
    flex: 1 1 220px;
    font-weight: 700;
    color: var(--forest);
}

.admin-create-order-form label:nth-of-type(3),
.admin-create-order-form label:nth-of-type(4) {
    flex: 0 1 150px;
}

.stock-actions,
.stock-actions form {
    display: flex;
    gap: .4rem;
    align-items: center;
}

.stock-actions input {
    width: 76px;
}

.category-check-list {
    display: grid;
    gap: .5rem;
    padding: .85rem;
    border: 1px solid rgba(49, 79, 45, .12);
    border-radius: 8px;
    background: #fbfdf9;
}

.public-product-card span,
.admin-card span {
    color: var(--sun);
    font-weight: 800;
    text-transform: uppercase;
    font-size: .82rem;
}

.public-footer {
    padding: 1.2rem 0;
    background: var(--forest);
    color: white;
}

.public-footer a {
    color: white;
}

.admin-card {
    display: block;
    min-height: 190px;
    color: inherit;
    text-decoration: none;
}

.admin-card.primary {
    background:
        linear-gradient(145deg, rgba(49, 79, 45, .95), rgba(113, 131, 72, .86)),
        url("../img/logo-acrovital.png") right -30px bottom -40px / 190px no-repeat;
    color: white;
}

.admin-card.primary strong,
.admin-card.primary span {
    color: white;
}

.admin-card.muted {
    opacity: .78;
}

@media (max-width: 900px) {
    .hero {
        min-height: auto;
        padding: 2rem 0 2.5rem;
        background:
            linear-gradient(180deg, rgba(49, 79, 45, .93), rgba(49, 79, 45, .69)),
            url("../img/logo-acrovital.png") center bottom / 96vw no-repeat;
    }

    .hero-grid,
    .public-hero-grid,
    .home-intro-grid,
    .public-two-col,
    .public-two-col.reverse,
    .product-detail,
    .checkout-grid,
    .admin-products-layout,
    .section-grid,
    .chart-grid,
    .cards-grid,
    .metrics-grid,
    .public-product-grid,
    .public-category-grid,
    .shop-grid,
    .home-link-grid,
    .admin-grid,
    .login-shell,
    .form-grid,
    .public-search-bar,
    .product-filter-bar,
    .activity-card,
    .admin-product-row,
    .admin-order-line {
        grid-template-columns: 1fr;
    }

    .cart-row,
    .order-row,
    .assessment-admin-grid,
    .assessment-detail-grid,
    .assessment-edit-grid,
    .choice-grid,
    .choice-grid.compact,
    .source-choice-grid,
    .segmented-choice,
    .segmented-choice.wide {
        grid-template-columns: 1fr;
    }

    .cart-row img {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .public-hero {
        min-height: auto;
        padding: 3rem 0;
        background: linear-gradient(180deg, rgba(49, 79, 45, .94), rgba(49, 79, 45, .74));
    }

    .home-hero-simple {
        padding: 3.5rem 0;
    }

    .home-link-card {
        min-height: auto;
    }

    .public-nav .navbar-brand img {
        width: 118px;
        height: 118px;
    }

    .public-logo-panel {
        max-width: 360px;
        justify-self: center;
    }

    .assessment-block {
        grid-template-columns: 1fr;
        padding: 1.25rem;
    }

    .assessment-block .btn {
        width: 100%;
        white-space: normal;
    }

    .assessment-block h2 {
        font-size: clamp(1.8rem, 11vw, 2.7rem);
    }

    .page-title-row,
    .date-picker {
        flex-direction: column;
    }

    .date-picker {
        width: 100%;
    }

    .hero-logo {
        width: min(100%, 300px);
        justify-self: center;
    }

    h1 { font-size: 2.5rem; }
}

@media (max-width: 700px) {
    .public-nav .navbar-brand img {
        width: 86px;
        height: 86px;
    }

    .home-hero-simple {
        padding: 2.5rem 0;
    }

    .home-hero-simple h1 {
        font-size: clamp(2.2rem, 13vw, 3.4rem);
    }

    .home-hero-simple .lead {
        font-size: 1.05rem;
    }

    .home-overview-band {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .home-centered-title {
        text-align: left;
    }

    .home-centered-title h2 {
        font-size: clamp(1.7rem, 8vw, 2.35rem);
    }

    .home-link-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: .8rem;
    }

    .home-link-card {
        min-height: 0;
        padding: 1rem;
    }

    .home-link-card strong {
        font-size: 1.25rem;
    }

    .home-link-card p {
        font-size: .98rem;
    }

    .public-actions .btn {
        width: 100%;
    }
}

/* Témoignage personnel et accueil AcroVital */
.story-hero { background: linear-gradient(125deg, #243e2c, #426444); }
.story-hero-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(230px, .7fr); gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.story-hero h1 { color: #fff; font-size: clamp(2.35rem, 5.3vw, 4.7rem); line-height: 1.08; max-width: 850px; }
.story-hero .lead { color: #f4f7f1; max-width: 740px; margin-top: 1.4rem; }
.story-hero .eyebrow { color: #f9c886; }
.story-date { color: #fff; margin: 1.5rem 0; }
.story-date time { font-weight: 700; }
.story-portrait { margin: 0; max-width: 354px; justify-self: center; }
.story-portrait img { display: block; width: 100%; height: auto; border-radius: 100px 100px 12px 12px; box-shadow: 0 20px 50px #12271b55; }
.story-portrait figcaption { color: #f4f7f1; font-size: .85rem; line-height: 1.6; margin-top: 1rem; text-align: center; }
.story-reading { max-width: 800px; }
.story-reading h2, .story-section-title h2 { font-size: clamp(1.9rem, 4vw, 3rem); }
.story-reading p { font-size: 1.1rem; line-height: 1.85; }
.story-section-title { max-width: 780px; }
.story-observations { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.story-observations article { padding: clamp(1.3rem, 3vw, 2.2rem); border: 1px solid #314f2d20; border-radius: 12px; background: #fff; }
.story-observations h3 { font-size: 1.5rem; margin: .75rem 0; }
.story-observations p { line-height: 1.8; margin-bottom: 0; }
.story-signature { color: var(--forest); font-weight: 750; }
.story-presentation-callout { padding-bottom: 0; }
.story-hero a:focus-visible, .home-link-card:focus-visible { outline: 3px solid #f9c886; outline-offset: 5px; }
@media (max-width: 767px) {
    .story-hero-grid, .story-observations { grid-template-columns: minmax(0, 1fr); }
    .story-portrait { max-width: 280px; }
    .story-presentation-callout .assessment-block { grid-template-columns: minmax(0, 1fr); }
    .story-presentation-callout .btn { white-space: normal; }
}

/* Photo de présentation : cadrage visuel, original conservé. */
.presentation-portrait { width: 100%; }
.presentation-portrait img { aspect-ratio: 4 / 5; height: auto; object-fit: cover; object-position: center 80%; border-radius: 18px; }
.story-comparisons article { padding: 0; overflow: hidden; }
.story-comparisons h3 { padding: 1.4rem 1.5rem; margin: 0; }
.story-comparisons h4 { font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; margin-bottom: .6rem; }
.story-before, .story-now { padding: 1.25rem 1.5rem; }
.story-before { background: #faf3ec; }
.story-now { background: #eaf3e5; border-top: 1px solid #314f2d20; }
.story-now h4 { color: #314f2d; }
/* Nouvelle identité AcroVital : visuels complets, menu sous la bannière. */
.brand-banner{background:#f5f4ec}
.brand-banner a{display:block;max-width:1320px;margin:0 auto}.brand-banner picture{display:block}
.brand-banner img{display:block;width:100%;height:auto}
.public-site .public-nav{background:#fffdf7;box-shadow:0 3px 16px #183e3312;padding:.65rem 0}
.public-site .public-nav .navbar-nav{gap:.25rem}
.public-site .public-nav .navbar-toggler{align-items:center;gap:.6rem;padding:.5rem .85rem;font-size:1rem;color:#21483d}
@media(max-width:991px){.public-site .public-nav .navbar-toggler{display:flex;margin-left:auto}.public-site .public-nav .navbar-collapse{max-height:75svh;overflow-y:auto}.public-site .public-nav .navbar-nav{padding:.75rem 0}}
.public-site .public-nav .navbar-brand img{width:150px;height:auto;max-height:none;object-fit:contain}
.navbar-brand img[src*="logo-acrovital-2026"]{width:140px;height:auto}
.public-site .public-nav .nav-link{font-size:.9rem}
@media(min-width:992px){
    .public-site .public-nav{padding:.8rem 0;border-bottom:1px solid #dbe2d2}
    .public-site .public-nav>.container{max-width:1440px}
    .public-site .public-nav .navbar-nav{gap:.4rem;flex-wrap:wrap;justify-content:center}
    .public-site .public-nav .nav-link{font-size:1.05rem;font-weight:650;color:#21483d;padding:.7rem .9rem;border-radius:9px;transition:background-color .15s,color .15s}
    .public-site .public-nav .nav-link:hover{background:#edf2e5;color:#183e33}
    .public-site .public-nav .nav-link.active{background:#21483d;color:#fff;font-weight:750}
    .public-site .public-nav .nav-link:focus-visible{outline:3px solid #83a24c;outline-offset:3px}
}
@media(min-width:992px) and (max-width:1199px){.public-site .public-nav .navbar-nav{gap:.15rem}.public-site .public-nav .nav-link{font-size:1rem;padding:.65rem .6rem}}
.qr-page .qr-logo,.qr-display .qr-display-logo{width:190px;height:auto;background:#fffdf7;border-radius:12px;padding:12px}
.hero-logo[src*="logo-acrovital-2026"]{width:min(320px,100%);height:auto;background:#fffdf7;border-radius:16px;padding:16px}
.welcome-personal .welcome-portrait{max-width:300px;margin:auto}
.welcome-personal .welcome-portrait img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center 85%;border-radius:140px 140px 24px 24px;box-shadow:0 14px 36px #183e3320}
@media(max-width:700px){.brand-banner img{aspect-ratio:auto;height:auto}.public-site .public-nav .navbar-brand img{width:140px}.welcome-personal .welcome-portrait{max-width:230px;margin:0 auto 2rem}}
