.sm-calculator-page{
    --primary: #16a34a;
    --primary-dark: #15803d;
    --primary-soft: #f0fdf4;
    --success: #0f9f6e;
    --ink: #14213d;
    --muted: #64748b;
    --line: #e5eaf1;
    --surface: #ffffff;
    --page: #f6f9fc;
    --shadow: 0 18px 55px rgba(15, 23, 42, .08);
}

.sm-calculator-page, .sm-calculator-page *{ box-sizing: border-box; }
.sm-calculator-page{ scroll-behavior: smooth; }
.sm-calculator-page{
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--ink);
    background:
        radial-gradient(circle at 10% 0%, rgba(22, 163, 74, .09), transparent 26%),
        radial-gradient(circle at 92% 12%, rgba(34, 197, 94, .08), transparent 22%),
        var(--page);
}

.sm-calculator-page .page-header{ padding-bottom: 1.2rem !important; }
.sm-calculator-page .hero-card, .sm-calculator-page .calculator-shell, .sm-calculator-page .funnel-card, .sm-calculator-page .results-card, .sm-calculator-page .detail-card, .sm-calculator-page .table-card{
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(226,232,240,.95);
    box-shadow: var(--shadow);
    border-radius: 26px;
}
.sm-calculator-page .hero-card{ position: relative; overflow: hidden; }
.sm-calculator-page .hero-card::after{
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    right: -90px;
    bottom: -120px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(22,163,74,.12), rgba(34,197,94,.05));
}
.sm-calculator-page .eyebrow, .sm-calculator-page .section-kicker{
    display: inline-flex;
    align-items: center;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: .76rem;
    font-weight: 800;
    color: var(--primary);
}
.sm-calculator-page .hero-mini-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.sm-calculator-page .hero-mini-grid div{
    padding: 16px;
    border-radius: 18px;
    background: var(--primary-soft);
    border: 1px solid #dcfce7;
}
.sm-calculator-page .hero-mini-grid span{
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    background: var(--primary);
    color: white;
    border-radius: 11px;
    font-weight: 800;
    margin-bottom: 10px;
}
.sm-calculator-page .hero-mini-grid small{ color: #42526a; font-weight: 700; }

.sm-calculator-page .calculator-shell{ padding: 26px; }
.sm-calculator-page .section-heading{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 24px;
}
.sm-calculator-page .btn-soft{
    border: 1px solid #dcfce7;
    background: #f7fff9;
    color: var(--primary);
}
.sm-calculator-page .btn-soft:hover{ background: var(--primary-soft); color: var(--primary-dark); }

.sm-calculator-page .form-block{
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 22px;
    margin-bottom: 18px;
    background: #fff;
}
.sm-calculator-page .form-block-title{
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}
.sm-calculator-page .form-block-title h3{ font-size: 1rem; margin: 0 0 3px; font-weight: 800; }
.sm-calculator-page .form-block-title p{ margin: 0; color: var(--muted); font-size: .9rem; }
.sm-calculator-page .form-icon, .sm-calculator-page .metric-icon{
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 1.12rem;
    flex: 0 0 auto;
}
.sm-calculator-page .form-label{ font-weight: 750; color: #334155; font-size: .91rem; }
.sm-calculator-page .form-label span{ color: #dc2626; }
.sm-calculator-page .input-group-text, .sm-calculator-page .form-control{
    border-color: #dbe2ea;
    min-height: 52px;
}
.sm-calculator-page .input-group-text{ background: #f8fafc; color: #475569; font-weight: 750; }
.sm-calculator-page .form-control:focus{
    border-color: #86efac;
    box-shadow: 0 0 0 .25rem rgba(22,163,74,.10);
}
.sm-calculator-page .form-control.is-invalid:focus{ box-shadow: 0 0 0 .25rem rgba(220,38,38,.08); }
.sm-calculator-page .calculate-bar{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 6px;
}
.sm-calculator-page .btn-primary{
    border-color: var(--primary);
    background: var(--primary);
    box-shadow: 0 10px 28px rgba(22,163,74,.20);
}
.sm-calculator-page .btn-primary:hover{ background: var(--primary-dark); border-color: var(--primary-dark); }

.sm-calculator-page .results-section{ scroll-margin-top: 20px; }
.sm-calculator-page .funnel-card, .sm-calculator-page .results-card, .sm-calculator-page .detail-card{ padding: 24px; }
.sm-calculator-page .card-title-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.sm-calculator-page .card-title-row > i{
    font-size: 1.45rem;
    color: var(--primary);
    background: var(--primary-soft);
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 14px;
}
.sm-calculator-page .funnel-flow{ display: flex; flex-direction: column; align-items: center; }
.sm-calculator-page .funnel-step{
    width: min(100%, 360px);
    text-align: center;
    padding: 13px 18px;
    border-radius: 16px;
    border: 1px solid #dcfce7;
    background: #f7fff9;
}
.sm-calculator-page .funnel-step small{ display: block; color: var(--muted); font-weight: 700; }
.sm-calculator-page .funnel-step strong{ display: block; font-size: 1.45rem; margin-top: 2px; }
.sm-calculator-page .funnel-step.spend{ background: #f0fdf4; }
.sm-calculator-page .funnel-step.revenue{ background: #ecfdf5; border-color: #bbf7d0; }
.sm-calculator-page .funnel-step.revenue strong{ color: #047857; }
.sm-calculator-page .funnel-arrow{ color: #93a3b8; padding: 4px 0; }

.sm-calculator-page .metrics-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.sm-calculator-page .metric-card{
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 16px;
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 12px;
    align-items: center;
    background: #fff;
}
.sm-calculator-page .metric-card .metric-icon{ grid-row: 1 / span 2; }
.sm-calculator-page .metric-card small{ color: var(--muted); font-weight: 700; }
.sm-calculator-page .metric-card strong{ font-size: 1.16rem; line-height: 1.15; overflow-wrap: anywhere; }
.sm-calculator-page .metric-card.highlight{ background: linear-gradient(135deg, #f0fdf4, #eefbf7); border-color: #bbf7d0; }
.sm-calculator-page .metric-card.highlight strong{ color: var(--primary-dark); }

.sm-calculator-page .result-breakdown-table th{ color: #334155; font-size: .9rem; }
.sm-calculator-page .result-breakdown-table td{ font-weight: 800; }
.sm-calculator-page .result-breakdown-table td.formula{ color: var(--muted); font-weight: 600; font-size: .84rem; text-align: right; }
.sm-calculator-page .result-breakdown-table > :not(caption) > * > *{ border-bottom-color: #edf1f5; padding: .85rem .5rem; }
.sm-calculator-page .input-summary-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.sm-calculator-page .input-summary-grid > div{
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fbfdff;
}
.sm-calculator-page .input-summary-grid small{ display: block; color: var(--muted); font-weight: 700; }
.sm-calculator-page .input-summary-grid strong{ display: block; margin-top: 5px; font-size: 1.05rem; }

.sm-calculator-page .history-section{ scroll-margin-top: 20px; }
.sm-calculator-page .table-card{ overflow: hidden; }
.sm-calculator-page .history-table{ min-width: 1880px; }
.sm-calculator-page .history-table thead th{
    background: #f8fafc;
    color: #475569;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .045em;
    white-space: nowrap;
    padding: 15px 12px;
    border-bottom: 1px solid var(--line);
}
.sm-calculator-page .history-table tbody td{
    white-space: nowrap;
    font-size: .88rem;
    padding: 14px 12px;
    border-bottom-color: #eef2f7;
}
.sm-calculator-page .history-table tbody tr:hover{ background: #fbfdff; }
.sm-calculator-page .delete-row-btn{
    width: 38px;
    height: 38px;
    border-radius: 11px;
    display: inline-grid;
    place-items: center;
}
.sm-calculator-page .empty-state{ padding: 50px 20px; text-align: center; }
.sm-calculator-page .empty-state i{ font-size: 2.4rem; color: #94a3b8; }
.sm-calculator-page .empty-state h3{ font-size: 1.05rem; margin: 10px 0 4px; }
.sm-calculator-page .empty-state p{ margin: 0; color: var(--muted); }
.sm-calculator-page .modal-icon,
body.sm-google-ads-calculator-body #confirmModal .modal-icon{
    width: 64px;
    height: 64px;
    border-radius: 20px;
    margin: 0 auto;
    display: grid;
    place-items: center;
    background: #fef2f2;
    color: #dc2626;
    font-size: 1.5rem;
}

@media (max-width: 991.98px) {
    .sm-calculator-page .section-heading{ align-items: flex-start; }
    .sm-calculator-page .calculate-bar{ align-items: stretch; flex-direction: column; }
    .sm-calculator-page .calculate-bar .btn{ width: 100%; }
}
@media (max-width: 767.98px) {
    .sm-calculator-page .hero-card, .sm-calculator-page .calculator-shell, .sm-calculator-page .funnel-card, .sm-calculator-page .results-card, .sm-calculator-page .detail-card, .sm-calculator-page .table-card{ border-radius: 20px; }
    .sm-calculator-page .hero-card{ padding: 24px !important; }
    .sm-calculator-page .calculator-shell{ padding: 18px; }
    .sm-calculator-page .form-block{ padding: 17px; }
    .sm-calculator-page .section-heading{ flex-direction: column; }
    .sm-calculator-page .section-heading > .d-flex{ width: 100%; }
    .sm-calculator-page .section-heading > .d-flex .btn{ flex: 1; }
    .sm-calculator-page .metrics-grid, .sm-calculator-page .input-summary-grid{ grid-template-columns: 1fr; }
    .sm-calculator-page .metric-card{ padding: 14px; }
    .sm-calculator-page .funnel-card, .sm-calculator-page .results-card, .sm-calculator-page .detail-card{ padding: 19px; }
}
@media (max-width: 420px) {
    .sm-calculator-page .hero-mini-grid{ grid-template-columns: 1fr 1fr; }
    .sm-calculator-page .hero-mini-grid div{ padding: 12px; }
    .sm-calculator-page .display-5{ font-size: 2.1rem; }
}

@media print {
    .sm-calculator-page{ background: #fff; }
    .sm-calculator-page .page-header, .sm-calculator-page .calculator-shell, .sm-calculator-page .history-section, .sm-calculator-page #printBtn, .sm-calculator-page #globalAlert{ display: none !important; }
    .sm-calculator-page .results-section{ display: block !important; }
    .sm-calculator-page .funnel-card, .sm-calculator-page .results-card, .sm-calculator-page .detail-card{ box-shadow: none; break-inside: avoid; }
}

/* --------------------------------------------------
   Compact left-aligned calculator layout
   -------------------------------------------------- */
.sm-calculator-page{
    background: #f7f9fc;
}

.sm-calculator-page .simple-page-header{
    padding: 28px 0 16px;
}

.sm-calculator-page .simple-page-header h1{
    margin: 0;
    font-size: clamp(1.65rem, 2.5vw, 2.1rem);
    line-height: 1.2;
    font-weight: 700;
    color: #172033;
}

.sm-calculator-page .simple-page-header p{
    margin: 7px 0 0;
    max-width: 650px;
    color: #64748b;
    font-size: .95rem;
}

.sm-calculator-page .compact-calculator{
    width: 100%;
    max-width: 620px;
    margin-left: 0;
    margin-right: auto;
    padding: 18px;
    border-radius: 12px;
    box-shadow: 0 6px 22px rgba(15, 23, 42, .05);
    border: 1px solid #e3e8ef;
    background: #fff;
}

.sm-calculator-page .compact-calculator-heading{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 13px;
    margin-bottom: 14px;
    border-bottom: 1px solid #edf0f4;
}

.sm-calculator-page .compact-calculator-heading h2{
    margin: 0;
    font-size: 1.1rem;
    line-height: 1.3;
    font-weight: 700;
    color: #1e293b;
}

.sm-calculator-page .compact-calculator-heading p{
    margin: 3px 0 0;
    color: #718096;
    font-size: .82rem;
}

.sm-calculator-page .compact-form-group{
    padding: 0 0 13px;
    margin: 0 0 13px;
    border-bottom: 1px solid #edf0f4;
}

.sm-calculator-page .compact-form-group:last-of-type{
    margin-bottom: 14px;
}

.sm-calculator-page .compact-form-group h3{
    margin: 0 0 9px;
    font-size: .9rem;
    font-weight: 700;
    color: #334155;
}

.sm-calculator-page .compact-calculator .form-label{
    margin-bottom: 5px;
    font-size: .78rem;
    line-height: 1.35;
    font-weight: 650;
}

.sm-calculator-page .compact-calculator .form-control, .sm-calculator-page .compact-calculator .input-group-text{
    min-height: 40px;
    height: 40px;
    font-size: .88rem;
}

.sm-calculator-page .compact-calculator .input-group-text{
    padding: .375rem .7rem;
}

.sm-calculator-page .compact-calculator .form-control{
    padding: .45rem .7rem;
}

.sm-calculator-page .compact-calculator .invalid-feedback{
    font-size: .72rem;
}

.sm-calculator-page .compact-calculate-bar{
    display: flex;
    justify-content: flex-start;
}

.sm-calculator-page .compact-calculate-bar .btn{
    min-width: 175px;
    padding: .62rem 1rem;
    font-size: .88rem;
    font-weight: 650;
    border-radius: 8px;
    box-shadow: none;
}

@media (max-width: 767.98px) {
    .sm-calculator-page .simple-page-header{
        padding: 20px 0 13px;
    }

    .sm-calculator-page .simple-page-header h1{
        font-size: 1.55rem;
    }

    .sm-calculator-page .simple-page-header p{
        font-size: .88rem;
    }

    .sm-calculator-page .compact-calculator{
        max-width: 100%;
        padding: 15px;
        border-radius: 10px;
    }

    .sm-calculator-page .compact-calculator-heading{
        align-items: center;
    }

    .sm-calculator-page .compact-calculate-bar .btn{
        width: 100%;
    }
}

@media print {
    .sm-calculator-page .simple-page-header, .sm-calculator-page .compact-calculator{
        display: none !important;
    }
}

/* --------------------------------------------------
   Number input UX: mouse wheel/spinner protection
   -------------------------------------------------- */
.sm-calculator-page input[type="number"]::-webkit-outer-spin-button, .sm-calculator-page input[type="number"]::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
}

.sm-calculator-page input[type="number"]{
    -moz-appearance: textfield;
    appearance: textfield;
}

/* --------------------------------------------------
   Submitted revenue card
   -------------------------------------------------- */
.sm-calculator-page .submitted-revenue-card{
    min-height: 96px;
    padding: 18px 20px;
    border: 1px solid #bbf7d0;
    border-radius: 18px;
    background: linear-gradient(135deg, #f0fdf4, #ecfdf5);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.sm-calculator-page .submitted-revenue-card small, .sm-calculator-page .submitted-revenue-card span{
    display: block;
}

.sm-calculator-page .submitted-revenue-card small{
    color: #166534;
    font-weight: 800;
    font-size: .85rem;
}

.sm-calculator-page .submitted-revenue-card span{
    color: #64748b;
    font-size: .78rem;
    margin-top: 3px;
}

.sm-calculator-page .submitted-revenue-card strong{
    color: #047857;
    font-size: clamp(1.3rem, 2vw, 1.75rem);
    white-space: nowrap;
}

/* --------------------------------------------------
   Growth Opportunity
   -------------------------------------------------- */
.sm-calculator-page .growth-section{
    scroll-margin-top: 20px;
}

.sm-calculator-page .growth-grid{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.sm-calculator-page .growth-card, .sm-calculator-page .biggest-opportunity-card{
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    box-shadow: 0 14px 40px rgba(15, 23, 42, .06);
}

.sm-calculator-page .growth-card{
    position: relative;
    padding: 20px;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.sm-calculator-page .growth-card.growth-best{
    border-color: #86efac;
    background: linear-gradient(180deg, #f0fdf4 0%, #ffffff 42%);
    box-shadow: 0 16px 38px rgba(22, 163, 74, .10);
}

.sm-calculator-page .growth-card.growth-minimum{
    border-color: #fecaca;
    background: linear-gradient(180deg, #fff1f2 0%, #ffffff 42%);
    box-shadow: 0 16px 38px rgba(220, 38, 38, .08);
}

.sm-calculator-page .growth-card-head{
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: 88px;
}

.sm-calculator-page .growth-letter{
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #f0fdf4;
    color: var(--primary);
    font-weight: 850;
}

.sm-calculator-page .growth-card-head h3{
    margin: 0;
    font-size: 1rem;
    font-weight: 750;
    color: #1e293b;
}

.sm-calculator-page .growth-card-head p{
    margin: 5px 0 0;
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.45;
}

.sm-calculator-page .growth-rate-row{
    display: grid;
    grid-template-columns: 1fr 1.1fr 1fr;
    gap: 8px;
    margin-top: 15px;
}

.sm-calculator-page .growth-rate-box, .sm-calculator-page .growth-uplift-box{
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 11px;
    background: #fbfdff;
}

.sm-calculator-page .growth-rate-box small, .sm-calculator-page .growth-uplift-box label{
    display: block;
    color: #64748b;
    font-size: .7rem;
    line-height: 1.25;
    font-weight: 750;
    margin-bottom: 5px;
}

.sm-calculator-page .growth-rate-box strong{
    display: block;
    color: #172033;
    font-size: 1.03rem;
}

.sm-calculator-page .growth-rate-box.improved{
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.sm-calculator-page .growth-rate-box.improved strong{
    color: #166534;
}

.sm-calculator-page .growth-uplift-box .form-control, .sm-calculator-page .growth-uplift-box .input-group-text{
    min-height: 34px;
    height: 34px;
    font-size: .82rem;
}

.sm-calculator-page .growth-uplift-box .form-control{
    padding: .3rem .5rem;
}

.sm-calculator-page .growth-uplift-box .input-group-text{
    padding: .3rem .55rem;
}

.sm-calculator-page .growth-result-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 12px;
}

.sm-calculator-page .growth-result-grid > div{
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid #edf1f5;
    border-radius: 13px;
    background: #fff;
}

.sm-calculator-page .growth-result-grid small, .sm-calculator-page .growth-result-grid strong{
    display: block;
}

.sm-calculator-page .growth-result-grid small{
    color: #64748b;
    font-size: .7rem;
    font-weight: 700;
}

.sm-calculator-page .growth-result-grid strong{
    margin-top: 4px;
    color: #14213d;
    font-size: .9rem;
    overflow-wrap: anywhere;
}

.sm-calculator-page .growth-rank-badge{
    min-height: 26px;
    margin-top: 12px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    font-size: .72rem;
    font-weight: 800;
}

.sm-calculator-page .growth-rank-badge:empty{
    padding: 0;
    min-height: 0;
}

.sm-calculator-page .growth-rank-badge.best{
    color: #166534;
    background: #dcfce7;
}

.sm-calculator-page .growth-rank-badge.minimum{
    color: #b91c1c;
    background: #fee2e2;
}

.sm-calculator-page .biggest-opportunity-card{
    overflow: hidden;
}

.sm-calculator-page .biggest-opportunity-copy{
    padding: 22px 24px 16px;
    border-bottom: 1px solid #edf1f5;
}

.sm-calculator-page .biggest-opportunity-copy h3{
    margin: 5px 0 5px;
    font-size: 1.25rem;
    font-weight: 800;
    color: #172033;
}

.sm-calculator-page .biggest-opportunity-copy p{
    margin: 0;
    max-width: 850px;
    color: #64748b;
    font-size: .9rem;
}

.sm-calculator-page .opportunity-compare-grid{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) minmax(220px, .9fr);
    align-items: stretch;
    gap: 12px;
    padding: 20px 24px 24px;
}

.sm-calculator-page .opportunity-current, .sm-calculator-page .opportunity-improved, .sm-calculator-page .opportunity-gain{
    padding: 16px 18px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.sm-calculator-page .opportunity-improved, .sm-calculator-page .opportunity-gain{
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.sm-calculator-page .opportunity-current small, .sm-calculator-page .opportunity-improved small, .sm-calculator-page .opportunity-gain small, .sm-calculator-page .opportunity-current strong, .sm-calculator-page .opportunity-improved strong, .sm-calculator-page .opportunity-gain strong, .sm-calculator-page .opportunity-current span, .sm-calculator-page .opportunity-improved span, .sm-calculator-page .opportunity-gain span{
    display: block;
}

.sm-calculator-page .opportunity-current small, .sm-calculator-page .opportunity-improved small, .sm-calculator-page .opportunity-gain small{
    color: #64748b;
    font-size: .73rem;
    font-weight: 750;
}

.sm-calculator-page .opportunity-current strong, .sm-calculator-page .opportunity-improved strong{
    margin-top: 5px;
    font-size: 1.2rem;
    color: #172033;
}

.sm-calculator-page .opportunity-current span, .sm-calculator-page .opportunity-improved span, .sm-calculator-page .opportunity-gain span{
    margin-top: 3px;
    color: #64748b;
    font-size: .82rem;
}

.sm-calculator-page .opportunity-gain strong{
    margin-top: 5px;
    color: #047857;
    font-size: 1.35rem;
}

.sm-calculator-page .opportunity-arrow{
    display: grid;
    place-items: center;
    color: #94a3b8;
    font-size: 1.35rem;
}

@media (max-width: 1199.98px) {
    .sm-calculator-page .growth-grid{
        grid-template-columns: 1fr;
    }

    .sm-calculator-page .growth-card-head{
        min-height: auto;
    }
}

@media (max-width: 991.98px) {
    .sm-calculator-page .opportunity-compare-grid{
        grid-template-columns: 1fr 1fr;
    }

    .sm-calculator-page .opportunity-arrow{
        display: none;
    }

    .sm-calculator-page .opportunity-gain{
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .sm-calculator-page .submitted-revenue-card{
        align-items: flex-start;
        flex-direction: column;
    }

    .sm-calculator-page .growth-card{
        padding: 16px;
        border-radius: 18px;
    }

    .sm-calculator-page .growth-rate-row{
        grid-template-columns: 1fr;
    }

    .sm-calculator-page .growth-result-grid{
        grid-template-columns: 1fr 1fr;
    }

    .sm-calculator-page .biggest-opportunity-copy, .sm-calculator-page .opportunity-compare-grid{
        padding-left: 18px;
        padding-right: 18px;
    }

    .sm-calculator-page .opportunity-compare-grid{
        grid-template-columns: 1fr;
    }

    .sm-calculator-page .opportunity-gain{
        grid-column: auto;
    }
}

@media (max-width: 420px) {
    .sm-calculator-page .growth-result-grid{
        grid-template-columns: 1fr;
    }
}

/* --------------------------------------------------
   Maximum Affordable Cost
   -------------------------------------------------- */
.sm-calculator-page .affordable-cost-section, .sm-calculator-page .affordable-results-section{
    scroll-margin-top: 20px;
}

.sm-calculator-page .affordable-control-card{
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    box-shadow: 0 14px 40px rgba(15, 23, 42, .06);
    padding: 22px;
}

.sm-calculator-page .affordable-control-grid{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
}

.sm-calculator-page .affordable-value-box, .sm-calculator-page .affordable-percent-box{
    min-height: 132px;
    border: 1px solid #dbe4ef;
    border-radius: 18px;
    background: #f8fafc;
    padding: 18px;
}

.sm-calculator-page .affordable-value-box small, .sm-calculator-page .affordable-percent-box label{
    display: block;
    color: #475569;
    font-size: .83rem;
    font-weight: 800;
    margin-bottom: 7px;
}

.sm-calculator-page .affordable-value-box strong{
    display: block;
    color: var(--text);
    font-size: 1.55rem;
    line-height: 1.2;
}

.sm-calculator-page .affordable-value-box span, .sm-calculator-page .affordable-percent-box small{
    display: block;
    color: #64748b;
    font-size: .8rem;
    margin-top: 7px;
}

.sm-calculator-page .affordable-percent-box .input-group{
    max-width: 240px;
}

.sm-calculator-page .affordable-percent-box .form-control, .sm-calculator-page .affordable-percent-box .input-group-text{
    min-height: 48px;
    font-weight: 800;
}

.sm-calculator-page .affordable-formula-grid{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.sm-calculator-page .affordable-formula-item{
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #fff;
    padding: 15px;
}

.sm-calculator-page .affordable-formula-item span, .sm-calculator-page .affordable-formula-item strong, .sm-calculator-page .affordable-formula-item small{
    display: block;
}

.sm-calculator-page .affordable-formula-item span{
    color: #475569;
    font-size: .79rem;
    font-weight: 800;
}

.sm-calculator-page .affordable-formula-item strong{
    color: var(--text);
    font-size: 1.15rem;
    margin-top: 5px;
}

.sm-calculator-page .affordable-formula-item small{
    color: #64748b;
    font-size: .74rem;
    line-height: 1.45;
    margin-top: 5px;
}

.sm-calculator-page .affordable-results-grid{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.sm-calculator-page .affordable-result-card{
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 142px;
    border: 1px solid #bbf7d0;
    border-radius: 20px;
    background: linear-gradient(135deg, #ffffff, #f7fff9);
    box-shadow: 0 12px 34px rgba(15, 23, 42, .05);
    padding: 20px;
}

.sm-calculator-page .affordable-result-icon{
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: #f0fdf4;
    color: #16a34a;
    font-size: 1.2rem;
}

.sm-calculator-page .affordable-result-card small, .sm-calculator-page .affordable-result-card strong, .sm-calculator-page .affordable-result-card span{
    display: block;
}

.sm-calculator-page .affordable-result-card small{
    color: #475569;
    font-size: .82rem;
    font-weight: 800;
}

.sm-calculator-page .affordable-result-card strong{
    color: #0f172a;
    font-size: clamp(1.35rem, 2vw, 1.75rem);
    line-height: 1.2;
    margin-top: 4px;
}

.sm-calculator-page .affordable-result-card span{
    color: #64748b;
    font-size: .78rem;
    margin-top: 5px;
}

.sm-calculator-page .affordable-results-note{
    margin-top: 14px;
    color: #64748b;
    font-size: .82rem;
}

@media (max-width: 991.98px) {
    .sm-calculator-page .affordable-formula-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sm-calculator-page .affordable-results-grid{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .sm-calculator-page .affordable-control-card{
        padding: 16px;
        border-radius: 18px;
    }

    .sm-calculator-page .affordable-control-grid, .sm-calculator-page .affordable-formula-grid{
        grid-template-columns: 1fr;
    }

    .sm-calculator-page .affordable-percent-box .input-group{
        max-width: none;
    }
}


/* =========================================================
   GREEN STEPPER / ONE-SECTION-AT-A-TIME LAYOUT
   ========================================================= */
.sm-calculator-page{
    --primary: #16a34a;
    --primary-dark: #15803d;
    --primary-deep: #14532d;
    --primary-soft: #f0fdf4;
    --primary-line: #bbf7d0;
    --success: #16a34a;
    --page: #f5faf7;
    --ink: #14231a;
    --muted: #657568;
    --line: #dfe9e2;
    --surface: #ffffff;
    --shadow: 0 18px 48px rgba(20, 83, 45, .08);
    --sidebar-w: 320px;
}

.sm-calculator-page, .sm-calculator-page{ min-height: 100%; }
.sm-calculator-page{
    background: linear-gradient(180deg, #f8fcf9 0%, #f3f8f5 100%);
    color: var(--ink);
    overflow-x: hidden;
}

.sm-calculator-page .stepper-page{ padding: 22px 0; }
.sm-calculator-page .calc-page-container{ max-width: 1540px; padding-left: 22px; padding-right: 22px; }
.sm-calculator-page .global-alert{
    position: fixed;
    z-index: 1085;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    width: min(92vw, 700px);
    box-shadow: 0 16px 38px rgba(15,23,42,.12);
    border-radius: 14px;
}

.sm-calculator-page .stepper-app{
    display: grid;
    grid-template-columns: var(--sidebar-w) minmax(0, 1fr);
    min-height: calc(100vh - 44px);
    background: #fff;
    border: 1px solid #dce8df;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(20,83,45,.09);
}

/* Sidebar */
.sm-calculator-page .stepper-sidebar{
    background: linear-gradient(180deg, #123d27 0%, #0f3422 100%);
    color: #fff;
    padding: 26px 18px 22px;
    display: flex;
    flex-direction: column;
    gap: 22px;
    min-width: 0;
}
.sm-calculator-page .calculator-brand{
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 13px;
    align-items: start;
    padding: 4px 8px 18px;
    border-bottom: 1px solid rgba(255,255,255,.12);
}
.sm-calculator-page .brand-icon{
    width: 48px;
    height: 48px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    font-size: 1.35rem;
    color: #0f5132;
    background: #dcfce7;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
}
.sm-calculator-page .calculator-brand h1{
    color: #fff;
    font-size: 1.18rem;
    line-height: 1.2;
    margin: 2px 0 7px;
    font-weight: 800;
}
.sm-calculator-page .calculator-brand p{
    margin: 0;
    color: rgba(255,255,255,.68);
    font-size: .79rem;
    line-height: 1.5;
}
.sm-calculator-page .step-navigation{ display: grid; gap: 8px; }
.sm-calculator-page .step-nav-item{
    appearance: none;
    width: 100%;
    border: 1px solid transparent;
    background: transparent;
    color: rgba(255,255,255,.78);
    border-radius: 14px;
    padding: 11px 10px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    text-align: left;
    transition: .18s ease;
}
.sm-calculator-page .step-nav-item:hover:not(.is-locked), .sm-calculator-page .step-nav-item.active{
    background: rgba(255,255,255,.11);
    border-color: rgba(187,247,208,.24);
    color: #fff;
}
.sm-calculator-page .step-nav-item.active{ box-shadow: inset 3px 0 0 #4ade80; }
.sm-calculator-page .step-number{
    width: 34px;
    height: 34px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    font-weight: 800;
    font-size: .86rem;
    color: #14532d;
    background: #dcfce7;
}
.sm-calculator-page .step-nav-item.active .step-number{ background: #4ade80; color: #0c3320; }
.sm-calculator-page .step-nav-item strong{ display: block; font-size: .86rem; font-weight: 760; color: inherit; }
.sm-calculator-page .step-nav-item small{ display: block; margin-top: 2px; color: rgba(255,255,255,.5); font-size: .69rem; line-height: 1.35; }
.sm-calculator-page .step-nav-item.active small{ color: rgba(255,255,255,.72); }
.sm-calculator-page .step-nav-item > i{ font-size: .8rem; opacity: .7; }
.sm-calculator-page .step-nav-item.is-locked{ opacity: .47; cursor: not-allowed; }
.sm-calculator-page .step-nav-item .step-lock{ display: inline-block; }
.sm-calculator-page .step-nav-item .step-chevron{ display: none; }
.sm-calculator-page .step-nav-item:not(.is-locked) .step-lock{ display: none; }
.sm-calculator-page .step-nav-item:not(.is-locked) .step-chevron{ display: inline-block; }
.sm-calculator-page .sidebar-tip{
    margin-top: auto;
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 10px;
    align-items: center;
    padding: 12px;
    border-radius: 14px;
    background: rgba(74,222,128,.11);
    border: 1px solid rgba(134,239,172,.18);
}
.sm-calculator-page .sidebar-tip > span{
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: rgba(255,255,255,.1);
    color: #86efac;
}
.sm-calculator-page .sidebar-tip strong{ display:block; font-size:.78rem; color:#fff; }
.sm-calculator-page .sidebar-tip small{ display:block; margin-top:2px; color:rgba(255,255,255,.58); font-size:.69rem; }

/* Workspace */
.sm-calculator-page .stepper-workspace{ min-width: 0; background: #fbfefc; }
.sm-calculator-page .workspace-header{
    min-height: 100px;
    padding: 22px 28px;
    background: #fff;
    border-bottom: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 28px;
}
.sm-calculator-page .workspace-title-wrap > span{
    display: inline-block;
    color: var(--primary);
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 800;
    margin-bottom: 4px;
}
.sm-calculator-page .workspace-title-wrap h2{ margin: 0; font-size: 1.38rem; font-weight: 800; }
.sm-calculator-page .workspace-title-wrap p{ margin: 4px 0 0; color: var(--muted); font-size: .84rem; }
.sm-calculator-page .workspace-progress-wrap{ width: min(290px, 34vw); }
.sm-calculator-page .workspace-progress-meta{ display:flex; justify-content:space-between; color:var(--muted); font-size:.73rem; margin-bottom:7px; }
.sm-calculator-page .workspace-progress-meta strong{ color:var(--primary-dark); }
.sm-calculator-page .workspace-progress{ height: 6px; background: #e7efe9; border-radius: 99px; }
.sm-calculator-page .workspace-progress .progress-bar{ background: linear-gradient(90deg, #22c55e, #15803d); border-radius:99px; transition:width .25s ease; }
.sm-calculator-page .workspace-content{ padding: 26px 28px 30px; }
.sm-calculator-page .calc-panel{ display: none !important; animation: panelFade .18s ease; }
.sm-calculator-page .calc-panel.active{ display: block !important; }
@keyframes panelFade { from { opacity:0; transform: translateY(4px); } to { opacity:1; transform:none; } }

/* Campaign form: compact, left-aligned like requested */
.sm-calculator-page .campaign-card, .sm-calculator-page .calculator-shell.compact-calculator{
    width: min(100%, 780px);
    margin: 0;
    padding: 20px;
    border-radius: 18px;
    box-shadow: none;
    border: 1px solid var(--line);
    background: #fff;
}
.sm-calculator-page .compact-calculator-heading{ margin-bottom: 12px; }
.sm-calculator-page .compact-calculator-heading h2{ font-size: 1.05rem; }
.sm-calculator-page .compact-calculator-heading p{ font-size: .76rem; }
.sm-calculator-page .compact-form-group{ padding: 13px 0; }
.sm-calculator-page .compact-form-group h3{ font-size: .91rem; margin-bottom: 10px; }
.sm-calculator-page .compact-form-group .form-label{ font-size: .78rem; margin-bottom: 5px; }
.sm-calculator-page .compact-form-group .form-control, .sm-calculator-page .compact-form-group .input-group-text{ min-height: 43px; font-size: .9rem; }
.sm-calculator-page .compact-calculate-bar{ padding-top: 13px; }
.sm-calculator-page .compact-calculate-bar .btn{ min-height: 44px; border-radius: 11px; padding-inline: 18px; font-size:.87rem; }
.sm-calculator-page .campaign-help{
    width: min(100%, 780px);
    margin-top: 14px;
    display: flex;
    gap: 9px;
    align-items: flex-start;
    color: #386047;
    background: #f0fdf4;
    border: 1px solid #dcfce7;
    border-radius: 13px;
    padding: 11px 13px;
    font-size: .78rem;
}
.sm-calculator-page .campaign-help i{ color: var(--primary); margin-top:1px; }

/* Panel intro / navigation */
.sm-calculator-page .panel-intro{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px;
}
.sm-calculator-page .panel-intro h2{ margin: 2px 0 3px; font-size: 1.25rem; font-weight:800; }
.sm-calculator-page .panel-intro p{ margin:0; color:var(--muted); font-size:.82rem; }
.sm-calculator-page .section-kicker{ color: var(--primary); }
.sm-calculator-page .panel-actions{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-top:20px;
    padding-top:18px;
    border-top:1px solid var(--line);
}
.sm-calculator-page .panel-actions .btn{ border-radius: 10px; font-size:.82rem; font-weight:700; }
.sm-calculator-page .btn-success, .sm-calculator-page .btn-primary{ background: var(--primary); border-color: var(--primary); box-shadow: none; }
.sm-calculator-page .btn-success:hover, .sm-calculator-page .btn-primary:hover{ background: var(--primary-dark); border-color: var(--primary-dark); }
.sm-calculator-page .btn-outline-success{ color: var(--primary-dark); border-color:#86efac; }
.sm-calculator-page .btn-outline-success:hover{ background:var(--primary); border-color:var(--primary); }
.sm-calculator-page .form-control:focus{ border-color:#86efac; box-shadow:0 0 0 .2rem rgba(22,163,74,.10); }

/* Funnel becomes compact horizontal cards on desktop */
.sm-calculator-page #panelFunnel .funnel-card{ padding: 20px; box-shadow:none; border-radius:18px; }
.sm-calculator-page #panelFunnel .funnel-flow{
    display:grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap:10px;
    align-items:stretch;
}
.sm-calculator-page #panelFunnel .funnel-step{
    width:auto;
    min-width:0;
    min-height:100px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    border-radius:14px;
    padding:12px 10px;
}
.sm-calculator-page #panelFunnel .funnel-step strong{ font-size:1.2rem; }
.sm-calculator-page #panelFunnel .funnel-arrow{ display:none; }
.sm-calculator-page #panelFunnel .funnel-step.revenue{ background:#ecfdf3; border-color:#86efac; }

/* Performance compact */
.sm-calculator-page #panelPerformance .results-card, .sm-calculator-page #panelPerformance .detail-card{ box-shadow:none; border-radius:18px; }
.sm-calculator-page #panelPerformance .metrics-grid{ grid-template-columns: repeat(4, minmax(0,1fr)); }
.sm-calculator-page #panelPerformance .metric-card{ padding:13px; border-radius:14px; }
.sm-calculator-page #panelPerformance .metric-icon{ width:38px; height:38px; border-radius:11px; }
.sm-calculator-page .submitted-revenue-card{ border-color:#bbf7d0 !important; background:#f0fdf4 !important; }

/* Growth / cost panels keep full functionality but use calmer cards */
.sm-calculator-page #panelGrowth .growth-section, .sm-calculator-page #panelCosts .affordable-cost-section, .sm-calculator-page #panelCosts .affordable-results-section{ margin-top:0 !important; }
.sm-calculator-page #panelGrowth .growth-grid{ gap:14px; }
.sm-calculator-page #panelGrowth .growth-card, .sm-calculator-page #panelGrowth .biggest-opportunity-card, .sm-calculator-page #panelCosts .affordable-control-card, .sm-calculator-page #panelCosts .affordable-result-card{ box-shadow:none; }
.sm-calculator-page #panelGrowth .growth-card.best-opportunity, .sm-calculator-page #panelGrowth .growth-card.is-best{ border-color:#86efac !important; background:#f0fdf4 !important; }
.sm-calculator-page #panelCosts .affordable-results-grid{ gap:14px; }

/* History */
.sm-calculator-page #panelHistory .section-heading{ margin-bottom:14px; }
.sm-calculator-page #panelHistory .table-card{ box-shadow:none; border-radius:18px; }
.sm-calculator-page #panelHistory .history-table thead th{ background:#f2f8f4; }

/* Number inputs: no wheel spinner UI */
.sm-calculator-page input[type="number"]::-webkit-outer-spin-button, .sm-calculator-page input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance: none; margin:0; }
.sm-calculator-page input[type="number"]{ -moz-appearance:textfield; appearance:textfield; }

/* Responsive */
@media (max-width: 1199.98px) {
    .sm-calculator-page{ --sidebar-w: 270px; }
    .sm-calculator-page #panelPerformance .metrics-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); }
    .sm-calculator-page #panelFunnel .funnel-flow{ grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 991.98px) {
    .sm-calculator-page .stepper-page{ padding:0; }
    .sm-calculator-page .calc-page-container{ padding:0; }
    .sm-calculator-page .stepper-app{ grid-template-columns:1fr; min-height:100vh; border-radius:0; border-left:0; border-right:0; }
    .sm-calculator-page .stepper-sidebar{ padding:13px 14px 12px; gap:12px; position:sticky; top:0; z-index:1030; }
    .sm-calculator-page .calculator-brand{ grid-template-columns:38px 1fr; padding:0 2px 10px; }
    .sm-calculator-page .brand-icon{ width:38px; height:38px; border-radius:11px; font-size:1rem; }
    .sm-calculator-page .calculator-brand h1{ font-size:.98rem; line-height:1.1; margin:0 0 2px; }
    .sm-calculator-page .calculator-brand h1 br{ display:none; }
    .sm-calculator-page .calculator-brand p{ font-size:.68rem; }
    .sm-calculator-page .step-navigation{ display:flex; gap:8px; overflow-x:auto; padding-bottom:2px; scrollbar-width:none; }
    .sm-calculator-page .step-navigation::-webkit-scrollbar{ display:none; }
    .sm-calculator-page .step-nav-item{
        flex:0 0 auto;
        width:auto;
        min-width:150px;
        grid-template-columns:30px minmax(0,1fr) auto;
        padding:8px 9px;
        background:rgba(255,255,255,.05);
    }
    .sm-calculator-page .step-number{ width:28px; height:28px; border-radius:9px; font-size:.75rem; }
    .sm-calculator-page .step-nav-item small{ display:none; }
    .sm-calculator-page .step-nav-item strong{ font-size:.75rem; white-space:nowrap; }
    .sm-calculator-page .sidebar-tip{ display:none; }
    .sm-calculator-page .workspace-header{ min-height:auto; padding:16px 18px; }
    .sm-calculator-page .workspace-content{ padding:18px; }
    .sm-calculator-page .workspace-progress-wrap{ width:210px; }
}

@media (max-width: 767.98px) {
    .sm-calculator-page .workspace-header{ align-items:flex-start; flex-direction:column; gap:12px; }
    .sm-calculator-page .workspace-progress-wrap{ width:100%; }
    .sm-calculator-page .workspace-title-wrap h2{ font-size:1.15rem; }
    .sm-calculator-page .workspace-title-wrap p{ font-size:.77rem; }
    .sm-calculator-page .workspace-content{ padding:14px; }
    .sm-calculator-page .campaign-card, .sm-calculator-page .calculator-shell.compact-calculator{ width:100%; padding:15px; }
    .sm-calculator-page #panelFunnel .funnel-flow{ grid-template-columns: repeat(2,minmax(0,1fr)); }
    .sm-calculator-page #panelPerformance .metrics-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); }
    .sm-calculator-page .panel-intro{ align-items:flex-start; }
    .sm-calculator-page .panel-intro h2{ font-size:1.05rem; }
    .sm-calculator-page .panel-actions{ flex-wrap:wrap; }
    .sm-calculator-page .panel-actions .btn{ flex:1 1 180px; }
}

@media (max-width: 479.98px) {
    .sm-calculator-page .step-nav-item{ min-width:135px; }
    .sm-calculator-page #panelFunnel .funnel-flow, .sm-calculator-page #panelPerformance .metrics-grid{ grid-template-columns:1fr; }
    .sm-calculator-page .metrics-grid{ grid-template-columns:1fr !important; }
    .sm-calculator-page .input-summary-grid{ grid-template-columns:1fr; }
}

@media print {
    .sm-calculator-page .stepper-sidebar, .sm-calculator-page .workspace-header, .sm-calculator-page .panel-actions, .sm-calculator-page .global-alert{ display:none !important; }
    .sm-calculator-page .stepper-app{ display:block; border:0; box-shadow:none; }
    .sm-calculator-page .calc-panel{ display:none !important; }
    .sm-calculator-page .calc-panel.active{ display:block !important; }
    .sm-calculator-page .workspace-content{ padding:0; }
}


/* Laravel shared-layout integration */
.sm-calculator-page {
    position: relative;
    isolation: isolate;
    width: 100%;
    background: #f6f9fc;
}
.sm-calculator-page .stepper-page {
    min-height: auto;
}
.sm-calculator-page .btn,
.sm-calculator-page input,
.sm-calculator-page select,
.sm-calculator-page textarea,
.sm-calculator-page table {
    font-family: inherit;
}

/* =========================================================
   Growth Opportunity readability + Download Report action
   ========================================================= */
.sm-calculator-page .panel-actions-end{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:12px;
    margin-left:auto;
}

.sm-calculator-page #downloadReportBtn{
    min-width:150px;
    border-width:1px;
    background:#fff;
}

.sm-calculator-page #downloadReportBtn:hover,
.sm-calculator-page #downloadReportBtn:focus{
    color:#fff;
    background:var(--primary);
    border-color:var(--primary);
}

@media (min-width: 1200px){
    .sm-calculator-page #panelGrowth .growth-grid{
        align-items:stretch;
    }

    .sm-calculator-page #panelGrowth .growth-card{
        min-height:540px;
        padding:24px;
        display:flex;
        flex-direction:column;
    }

    .sm-calculator-page #panelGrowth .growth-card-head{
        min-height:112px;
    }

    .sm-calculator-page #panelGrowth .growth-card-head h3{
        font-size:1.05rem;
        line-height:1.35;
    }

    .sm-calculator-page #panelGrowth .growth-card-head p{
        font-size:.82rem;
        line-height:1.55;
    }

    .sm-calculator-page #panelGrowth .growth-rate-row{
        margin-top:18px;
        gap:10px;
    }

    .sm-calculator-page #panelGrowth .growth-rate-box,
    .sm-calculator-page #panelGrowth .growth-uplift-box{
        min-height:105px;
        padding:14px;
        display:flex;
        flex-direction:column;
        justify-content:center;
    }

    .sm-calculator-page #panelGrowth .growth-result-grid{
        margin-top:22px;
        gap:12px;
    }

    .sm-calculator-page #panelGrowth .growth-result-grid > div{
        min-height:96px;
        padding:15px 14px;
        display:flex;
        flex-direction:column;
        justify-content:center;
    }

    .sm-calculator-page #panelGrowth .growth-result-grid strong{
        font-size:1rem;
        line-height:1.35;
    }

    .sm-calculator-page #panelGrowth .growth-rank-badge{
        margin-top:auto;
        align-self:flex-start;
    }
}

@media (max-width: 767.98px){
    .sm-calculator-page .panel-actions-end{
        width:100%;
        flex-wrap:wrap;
    }

    .sm-calculator-page .panel-actions-end .btn,
    .sm-calculator-page #downloadReportBtn{
        flex:1 1 180px;
        min-width:0;
    }
}

/* =========================================================
   GROWTH OPPORTUNITY - FULL WIDTH HORIZONTAL ROW CARDS
   Each scenario (A/B/C) is one full-width row.
   Existing IDs and calculations remain unchanged.
   ========================================================= */
.sm-calculator-page #panelGrowth .growth-grid{
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) !important;
    gap:14px !important;
}

.sm-calculator-page #panelGrowth .growth-card{
    min-height:0 !important;
    width:100%;
    padding:18px 20px !important;
    display:grid !important;
    grid-template-columns:minmax(235px, 1.15fr) minmax(330px, 1.35fr) minmax(430px, 1.8fr) auto;
    grid-template-areas:"head rates results badge";
    align-items:center;
    gap:18px;
}

.sm-calculator-page #panelGrowth .growth-card-head{
    grid-area:head;
    min-height:0 !important;
    align-items:flex-start;
    margin:0;
}

.sm-calculator-page #panelGrowth .growth-card-head h3{
    font-size:1rem;
    line-height:1.3;
}

.sm-calculator-page #panelGrowth .growth-card-head p{
    margin-top:5px;
    font-size:.78rem;
    line-height:1.45;
}

.sm-calculator-page #panelGrowth .growth-rate-row{
    grid-area:rates;
    margin-top:0 !important;
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:9px;
}

.sm-calculator-page #panelGrowth .growth-rate-box,
.sm-calculator-page #panelGrowth .growth-uplift-box{
    min-height:88px !important;
    padding:11px 12px !important;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.sm-calculator-page #panelGrowth .growth-result-grid{
    grid-area:results;
    margin-top:0 !important;
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:9px;
}

.sm-calculator-page #panelGrowth .growth-result-grid > div{
    min-height:88px !important;
    padding:11px 12px !important;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.sm-calculator-page #panelGrowth .growth-result-grid small{
    line-height:1.3;
}

.sm-calculator-page #panelGrowth .growth-result-grid strong{
    font-size:.95rem !important;
    line-height:1.3;
    white-space:normal;
    overflow-wrap:anywhere;
}

.sm-calculator-page #panelGrowth .growth-rank-badge{
    grid-area:badge;
    margin-top:0 !important;
    align-self:center !important;
    justify-self:end;
    white-space:nowrap;
}

/* Medium desktop/laptop: keep each scenario as one full-width row,
   but put result numbers on a clean second line inside that same row. */
@media (min-width: 992px) and (max-width: 1499.98px){
    .sm-calculator-page #panelGrowth .growth-card{
        grid-template-columns:minmax(230px, .95fr) minmax(360px, 1.35fr) auto;
        grid-template-areas:
            "head rates badge"
            "results results results";
        align-items:center;
    }

    .sm-calculator-page #panelGrowth .growth-result-grid{
        margin-top:2px !important;
    }
}

/* Tablet: one full-width scenario row with neatly wrapped blocks. */
@media (min-width: 768px) and (max-width: 991.98px){
    .sm-calculator-page #panelGrowth .growth-card{
        grid-template-columns:minmax(0, 1fr) auto;
        grid-template-areas:
            "head badge"
            "rates rates"
            "results results";
        align-items:center;
    }

    .sm-calculator-page #panelGrowth .growth-result-grid{
        grid-template-columns:repeat(4, minmax(0, 1fr));
    }
}

/* Mobile: still A, B, C row-by-row; inner data stacks for readability. */
@media (max-width: 767.98px){
    .sm-calculator-page #panelGrowth .growth-card{
        display:grid !important;
        grid-template-columns:minmax(0, 1fr);
        grid-template-areas:
            "head"
            "rates"
            "results"
            "badge";
        gap:12px;
        padding:16px !important;
    }

    .sm-calculator-page #panelGrowth .growth-rate-row{
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }

    .sm-calculator-page #panelGrowth .growth-result-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .sm-calculator-page #panelGrowth .growth-rank-badge{
        justify-self:start;
    }
}

@media (max-width: 479.98px){
    .sm-calculator-page #panelGrowth .growth-rate-row,
    .sm-calculator-page #panelGrowth .growth-result-grid{
        grid-template-columns:minmax(0, 1fr);
    }

    .sm-calculator-page #panelGrowth .growth-rate-box,
    .sm-calculator-page #panelGrowth .growth-uplift-box,
    .sm-calculator-page #panelGrowth .growth-result-grid > div{
        min-height:72px !important;
    }
}


/* =========================================================
   CALCULATOR + SHARED LAYOUT FIXES
   ========================================================= */

/*
 * Bootstrap appends .modal-backdrop directly under <body>.
 * #confirmModal is intentionally outside .sm-calculator-page in the Blade file,
 * so both elements now share the same top-level stacking context.
 */
body.sm-google-ads-calculator-body #confirmModal {
    z-index: 1060;
}
body.sm-google-ads-calculator-body .modal-backdrop {
    z-index: 1050;
}
body.sm-google-ads-calculator-body #confirmModal .modal-dialog,
body.sm-google-ads-calculator-body #confirmModal .modal-content {
    pointer-events: auto;
}

/*
 * Fallback styles for the shared layout's scroll-to-top button.
 * Existing fewlayout styles still win where they are already present.
 */
body.sm-google-ads-calculator-body .sm-scroll-top-btn {
    position: fixed;
    right: 22px;
    bottom: 22px;
    left: auto;
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #0b4a2a;
    background: rgba(52, 168, 83, 0.16);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.16);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease, box-shadow .2s ease;
    z-index: 1035;
}
body.sm-google-ads-calculator-body .sm-scroll-top-btn.sm-show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}
body.sm-google-ads-calculator-body .sm-scroll-top-btn:hover,
body.sm-google-ads-calculator-body .sm-scroll-top-btn:focus-visible {
    box-shadow: 0 15px 34px rgba(15, 23, 42, 0.22);
    outline: none;
}
body.sm-google-ads-calculator-body .sm-scroll-top-btn > i {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    color: #0f6b3a;
    font-size: 15px;
}

@media (max-width: 767.98px) {
    body.sm-google-ads-calculator-body .sm-scroll-top-btn {
        right: 14px;
        bottom: 14px;
        width: 44px;
        height: 44px;
    }
    body.sm-google-ads-calculator-body .sm-scroll-top-btn > i {
        width: 34px;
        height: 34px;
    }
}