.wa-tool, .wa-tool * {
    box-sizing: border-box;
}

.wa-tool {
    max-width: 1100px;
    margin: 30px auto;
    font-family: Arial, Helvetica, sans-serif;
    color: #172033;
    background: #ffffff;
}

.wa-tool h1,
.wa-tool h2,
.wa-tool h3 {
    margin-top: 0;
}

.wa-header {
    background: #f3f7fb;
    border-radius: 16px;
    padding: 28px;
    margin-bottom: 20px;
}

.wa-header h1 {
    margin: 0;
    color: #175b8a;
    font-size: 30px;
}

.wa-section {
    background: #ffffff;
    border: 1px solid #dce3ea;
    border-radius: 16px;
    padding: 25px;
    margin-bottom: 20px;
}

.wa-section-title {
    font-size: 22px;
    font-weight: 700;
    color: #175b8a;
    margin-bottom: 20px;
}

.wa-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}

.wa-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.wa-field {
    display: flex;
    flex-direction: column;
}

.wa-field label {
    font-weight: 700;
    margin-bottom: 7px;
    font-size: 15px;
}

.wa-tool .required {
    color: #d60000;
}

.wa-field input,
.wa-field select {
    width: 100%;
    padding: 13px 14px;
    border: 1px solid #cbd3dc;
    border-radius: 10px;
    font-size: 16px;
    background: #fff;
}

.wa-field input:focus,
.wa-field select:focus {
    outline: none;
    border-color: #175b8a;
    box-shadow: 0 0 0 2px rgba(23,91,138,.10);
}

.wa-help {
    font-size: 12px;
    color: #777;
    margin-top: 5px;
}

.wa-photo-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.wa-photo-box {
    border: 2px dashed #cbd3dc;
    border-radius: 14px;
    padding: 20px;
    background: #fafbfd;
}

.wa-photo-box h3 {
    margin-bottom: 8px;
    color: #175b8a;
}

.wa-photo-preview {
    margin-top: 15px;
    display: none;
}

.wa-photo-preview img {
    width: 100%;
    max-height: 280px;
    object-fit: contain;
    border-radius: 10px;
    background: #eee;
}

.wa-button-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 25px;
}

.wa-btn {
    border: 0;
    border-radius: 10px;
    padding: 14px 24px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

.wa-btn-primary {
    background: #175b8a;
    color: white;
}

.wa-btn-green {
    background: #00a83b;
    color: white;
}

.wa-btn-secondary {
    background: #e9eef3;
    color: #172033;
}

/* =========================================================
   REPORT
   ========================================================= */

#wa-report {
    display: none;
    margin-top: 30px;
}

.wa-report-page {
    width: 100%;
    background: white;
    padding: 35px;
    margin-bottom: 25px;
    border: 1px solid #ddd;
    border-radius: 8px;
}

.wa-report-page-title {
    font-size: 27px;
    color: #175b8a;
    margin-bottom: 20px;
    font-weight: 800;
}

/* =========================================================
   BLOCK 7 — REPORT INFORMATION
   ========================================================= */

.wa-report-info {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border: 1px solid #d9e0e6;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 25px;
}

.wa-report-info-item {
    padding: 14px 18px;
    border-bottom: 1px solid #e1e5e9;
}

.wa-report-info-item:nth-child(odd) {
    border-right: 1px solid #e1e5e9;
}

.wa-report-info-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    color: #718096;
    margin-bottom: 5px;
}

.wa-report-info-value {
    font-size: 16px;
    font-weight: 700;
}

/* =========================================================
   BLOCK 5 — TOTAL SAVING HIGHLIGHT
   ========================================================= */

.wa-total-highlight {
    background: #00a83b;
    color: white;
    border-radius: 18px;
    padding: 28px;
    margin-bottom: 25px;
}

.wa-total-highlight-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 25px;
    align-items: center;
}

.wa-total-label {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    opacity: .95;
    margin-bottom: 7px;
}

.wa-total-value {
    font-size: 32px;
    font-weight: 900;
}

.wa-total-co2 {
    font-size: 26px;
    font-weight: 900;
}

/* =========================================================
   SAVING CARDS
   ========================================================= */

.wa-saving-card {
    border: 1px solid #dce3ea;
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 18px;
}

.wa-saving-title {
    font-size: 18px;
    font-weight: 800;
    color: #175b8a;
    margin-bottom: 14px;
}

.wa-saving-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 15px;
}

.wa-saving-value {
    font-size: 23px;
    font-weight: 800;
}

.wa-saving-label {
    font-size: 12px;
    color: #667085;
    margin-top: 4px;
}

.wa-saving-note {
    font-size: 12px;
    color: #667085;
    margin-top: 15px;
    line-height: 1.5;
}

/* =========================================================
   PAGE 1 PHOTOS
   ========================================================= */

.wa-report-photo-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    margin-top: 20px;
}

.wa-report-photo {
    border: 1px solid #ddd;
    border-radius: 12px;
    padding: 10px;
}

.wa-report-photo-title {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #175b8a;
}

.wa-report-photo img {
    width: 100%;
    max-height: 300px;
    object-fit: contain;
}

/* =========================================================
   BLOCK 6 — BENEFITS
   ========================================================= */

.wa-benefits {
    border: 1px solid #dce3ea;
    border-radius: 14px;
    padding: 20px;
    margin-top: 25px;
}

.wa-benefits-title {
    font-size: 18px;
    font-weight: 800;
    color: #175b8a;
    margin-bottom: 12px;
}

.wa-benefits ul {
    margin: 0;
    padding-left: 22px;
}

.wa-benefits li {
    margin-bottom: 8px;
    line-height: 1.5;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width: 768px) {

    .wa-grid,
    .wa-grid-3,
    .wa-photo-grid,
    .wa-saving-grid,
    .wa-total-highlight-grid,
    .wa-report-photo-grid,
    .wa-report-info {
        grid-template-columns: 1fr;
    }

    .wa-report-info-item:nth-child(odd) {
        border-right: 0;
    }

    .wa-report-page {
        padding: 20px;
    }

    .wa-total-value {
        font-size: 27px;
    }
}

/* =========================================================
   BLOCK 7 — PRINT / PDF
   ========================================================= */

@media print {

    body * {
        visibility: hidden;
    }

    #wa-report,
    #wa-report * {
        visibility: visible;
    }

    #wa-report {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        margin: 0;
    }

    .wa-report-page {
        border: none;
        border-radius: 0;
        margin: 0;
        min-height: 100vh;
        page-break-after: always;
    }

    .wa-report-page:last-child {
        page-break-after: auto;
    }

    .wa-total-highlight {
        background: #00a83b !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .wa-total-highlight,
    .wa-total-highlight * {
        color: white !important;
    }
}

.wa-btn:disabled{opacity:.45;cursor:not-allowed}
#wa-status{padding:10px 0;font-weight:600}
#wa-assumptions,#wa-financial-details{line-height:1.65;overflow-wrap:anywhere}
.wa-report-info-value{overflow-wrap:anywhere}
@page{size:A4;margin:12mm}
@media print{
 .wa-tool > :not(#wa-report){display:none!important}
 #wa-report{position:static}
 .wa-report-page{min-height:0;padding:8mm 0;break-after:page}
 .wa-saving-card,.wa-total-highlight,.wa-report-photo,.wa-report-info{break-inside:avoid}
 .wa-report-info,.wa-report-photo-grid,.wa-total-highlight-grid{grid-template-columns:1fr 1fr}
 .wa-saving-grid{grid-template-columns:repeat(3,1fr)}
}

/* Consistent control dimensions, including themes with input-specific styles. */
.wa-tool .wa-field input[type="text"],
.wa-tool .wa-field input[type="tel"],
.wa-tool .wa-field input[type="email"],
.wa-tool .wa-field select {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    padding: 0 14px !important;
    margin: 0 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: normal !important;
    border: 1px solid #cbd3dc;
    border-radius: 10px !important;
}
.wa-tool .wa-field { min-width: 0; }

/* Portrait phone-photo frames; preserve the complete evidence image. */
.wa-tool .wa-photo-preview,
.wa-tool .wa-report-photo img {
    width: 100%;
    max-width: 360px;
    aspect-ratio: 3 / 4;
    margin-left: auto;
    margin-right: auto;
    background: #f3f5f7;
    border-radius: 10px;
    overflow: hidden;
}
.wa-tool .wa-photo-preview img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
}
.wa-tool .wa-report-photo img {
    display: block;
    height: auto;
    max-height: none;
    object-fit: contain;
}
@media print {
    .wa-tool .wa-report-photo img {
        width: 60mm;
        height: 80mm;
        max-width: 100%;
        object-fit: contain;
    }
}

.wa-tool .wa-unit-toggle {display:flex; min-height:50px; border:1px solid #cbd3dc; border-radius:10px; overflow:hidden;}
.wa-tool .wa-unit-toggle button {flex:1; margin:0; padding:10px 8px; border:0; border-radius:0; background:#f3f7fb; color:#172033; font:600 14px Arial,sans-serif; cursor:pointer;}
.wa-tool .wa-unit-toggle button[aria-pressed="true"] {background:#175b8a; color:#fff;}
.wa-tool .wa-unit-toggle button:focus-visible {outline:3px solid #00a83b; outline-offset:-3px;}