:root {
    --cfo-green:#07855a;
    --cfo-green-dark:#064b3d;
    --cfo-gold:#ffb600;
    --cfo-ink:#082b29;
    --cfo-muted:#64756f;
    --cfo-soft:#f2f8f5;
    --cfo-line:#dce9e3;
}

.cfo-page {
    min-height: 75vh;
    padding: clamp(2.5rem,6vw,5rem) 0;
    color: var(--cfo-ink);
    background:
        radial-gradient(circle at 90% 0,rgba(7,133,90,.12),transparent 30rem),
        #f7faf8;
}

.cfo-heading {
    max-width: 950px;
    margin-bottom: 2rem;
}

.cfo-heading > span {
    color: var(--cfo-green);
    font-size: .75rem;
    font-weight: 950;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.cfo-heading h1 {
    margin: .55rem 0;
    font-size: clamp(2.4rem,5vw,4.8rem);
    line-height: .98;
    letter-spacing: -.05em;
    font-weight: 950;
}

.cfo-heading p {
    color: var(--cfo-muted);
    font-size: 1.02rem;
}

.cfo-heading--split {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:1rem;
}

.cfo-status {
    display:inline-flex;
    padding:.65rem .9rem;
    border-radius:999px;
    color:#fff;
    background:var(--cfo-green);
    font-size:.75rem;
    font-weight:900;
}

.cfo-card,
.cfo-empty {
    padding: clamp(1.1rem,3vw,1.6rem);
    border: 1px solid var(--cfo-line);
    border-radius: 1.25rem;
    background: #fff;
    box-shadow: 0 18px 45px rgba(8,43,41,.06);
}

.cfo-card h2 {
    font-size: 1.15rem;
    font-weight: 950;
}

.cfo-card--warning {
    border-color:#f0c2aa;
    background:#fff9f5;
}

.cfo-form {
    max-width: 980px;
    display:grid;
    gap:1rem;
}

.cfo-product-summary {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
}

.cfo-product-summary > strong {
    font-size:1.5rem;
    text-align:right;
}

.cfo-product-summary > strong small {
    display:block;
    color:var(--cfo-muted);
    font-size:.72rem;
}

.cfo-btn {
    min-height:46px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.45rem;
    border:0;
    border-radius:.8rem;
    color:#fff;
    background:var(--cfo-green);
    font-weight:900;
}

.cfo-actions {
    display:flex;
    justify-content:flex-end;
    gap:.75rem;
}

.cfo-order-list {
    display:grid;
    gap:.7rem;
}

.cfo-order-row {
    min-height:86px;
    display:grid;
    grid-template-columns:2fr repeat(3,1fr) auto;
    align-items:center;
    gap:1rem;
    padding:1rem;
    border:1px solid var(--cfo-line);
    border-radius:1rem;
    color:inherit;
    background:#fff;
    text-decoration:none;
}

.cfo-order-row:hover {
    border-color:var(--cfo-green);
}

.cfo-order-row div {
    display:flex;
    flex-direction:column;
}

.cfo-order-row small {
    color:var(--cfo-muted);
    font-size:.68rem;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.cfo-order-row strong {
    font-size:.88rem;
}

.cfo-order-row span {
    color:var(--cfo-muted);
    font-size:.76rem;
}

.cfo-track-grid {
    display:grid;
    grid-template-columns:minmax(0,1.7fr) minmax(300px,.7fr);
    gap:1rem;
    align-items:start;
}

.cfo-track-grid main,
.cfo-track-grid aside {
    display:grid;
    gap:1rem;
}

.cfo-timeline {
    display:grid;
    gap:0;
}

.cfo-timeline article {
    position:relative;
    display:grid;
    grid-template-columns:28px 1fr;
    gap:.8rem;
    padding-bottom:1.2rem;
}

.cfo-timeline article::before {
    content:"";
    position:absolute;
    left:8px;
    top:18px;
    bottom:-1px;
    width:2px;
    background:var(--cfo-line);
}

.cfo-timeline article:last-child::before {
    display:none;
}

.cfo-timeline__dot {
    width:18px;
    height:18px;
    border:5px solid #d8f4e8;
    border-radius:50%;
    background:var(--cfo-green);
    z-index:1;
}

.cfo-timeline strong,
.cfo-timeline small,
.cfo-timeline p {
    display:block;
}

.cfo-timeline small {
    color:var(--cfo-muted);
    font-size:.68rem;
}

.cfo-timeline p {
    margin:.2rem 0 0;
    color:var(--cfo-muted);
    font-size:.8rem;
}

.cfo-data-grid,
.cfo-kpis {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:.8rem;
}

.cfo-data-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.cfo-kpis {
    margin-bottom:1rem;
}

.cfo-kpis article,
.cfo-data-grid div {
    padding:1rem;
    border:1px solid var(--cfo-line);
    border-radius:1rem;
    background:#fff;
}

.cfo-kpis small,
.cfo-data-grid small {
    display:block;
    color:var(--cfo-muted);
    font-size:.7rem;
}

.cfo-kpis strong {
    display:block;
    margin-top:.3rem;
    font-size:1.7rem;
}

.cfo-summary {
    margin:0;
}

.cfo-summary div {
    display:flex;
    justify-content:space-between;
    gap:1rem;
    padding:.7rem 0;
    border-bottom:1px solid var(--cfo-line);
}

.cfo-summary div:last-child {
    border:0;
}

.cfo-summary dt {
    color:var(--cfo-muted);
    font-weight:600;
}

.cfo-summary dd {
    margin:0;
    font-weight:900;
    text-align:right;
}

.cfo-issue {
    padding:.9rem 0;
    border-bottom:1px solid #f0d8ca;
}

.cfo-issue span {
    float:right;
    color:#a54d20;
    font-size:.72rem;
    font-weight:900;
}

.cfo-empty {
    max-width:800px;
    margin:2rem auto;
    text-align:center;
}

.cfo-empty i {
    color:var(--cfo-green);
    font-size:3rem;
}

@media(max-width:991.98px) {
    .cfo-track-grid {
        grid-template-columns:1fr;
    }

    .cfo-kpis {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .cfo-order-row {
        grid-template-columns:1fr 1fr;
    }

    .cfo-order-row > i {
        display:none;
    }
}

@media(max-width:575.98px) {
    .cfo-heading--split,
    .cfo-product-summary,
    .cfo-actions {
        align-items:stretch;
        flex-direction:column;
    }

    .cfo-order-row,
    .cfo-data-grid,
    .cfo-kpis {
        grid-template-columns:1fr;
    }

    .cfo-actions .btn {
        width:100%;
    }
}