/* =========================================
EMERGENCY TREE SERVICE SECTION - FULL RESPONSIVE

========================================= */

.emergency-tree-service {
    padding: 80px 0;
   
}

/* WRAPPER - 2 COLUMNS */
.emergency-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

/* LEFT COLUMN */
.emergency-content {
    display: flex;
    flex-direction: column;
    gap: 35px;
}

/* CTA BOX */
.emergency-cta-box {
    background: #f8faf6;
    padding: 30px 32px;
    border-radius: 24px;
}

.cta-text p {
    line-height: 1.6;
    color: #333;
    margin: 0 0 25px 0;
}

.emergency-cta-box .trust-buttons {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.emergency-cta-box .btn-estimate,
.emergency-cta-box .btn-call {
    width: 220px;
    height: 52px;
}

/* SERVICES - 2 COLUMN GRID */
.emergency-services {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
}

.emergency-item {
    background: #fff;
    border-radius: 20px;
    border-top: 4px solid #ffb300;
    padding: 24px 26px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.emergency-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 28px rgba(26, 44, 163, 0.1);
}

.emergency-item h3 {
    font-weight: 700;
    color: #FFB300;
    margin: 0 0 14px 0;
    line-height: 1.3;
}

.emergency-item p {
    color: #444;
    line-height: 1.55;
    margin: 0 0 12px 0;
}

.emergency-item p:last-child {
    margin-bottom: 0;
}

/* HIGHLIGHT ITEM - FULL WIDTH */
.emergency-item.emergency-highlight {
    grid-column: span 2;
    background: linear-gradient(135deg, #fff 0%, #fef9e6 100%);
    border-top: 4px solid #1A2CA3;
    margin-top: 40px;
}

.emergency-highlight h3 {
    color: #1A2CA3;
}

.emergency-list {
    padding-left: 22px;
    margin: 12px 0 0 0;
}

.emergency-list li {
    color: #000;
    line-height: 1.65;
    margin-bottom: 8px;
}

/* RIGHT COLUMN - IMAGE */
.emergency-image {
    position: relative;
}

.emergency-image img {
    width: 100%;
    height: auto;
    min-height: 800px;
    object-fit: cover;
    border-radius: 28px;
    display: block;
}

.emergency-floating-card {
    position: absolute;
    bottom:600px;
    left: 30px;
    right: 30px;
    background: #fff;
    padding: 22px 26px;
    border-radius: 22px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
}

.emergency-floating-card h4 {
    font-weight: 700;
    color: #1A2CA3;
    margin: 0 0 10px 0;
}

.emergency-floating-card p {
    line-height: 1.55;
    color: #000;
    margin: 0;
}

/* =========================================
BREAKPOINT: 1920px (Large Desktop)
========================================= */
@media (min-width: 1920px) {
    .emergency-tree-service {
        padding: 100px 0;
    }
    
    .emergency-wrapper {
        gap: 80px;
    }
    
    .emergency-services {
        gap: 30px;
    }
    
    .emergency-item {
        padding: 28px 32px;
    }
    
    .emergency-item h3 {
    }
    
    .emergency-item p {
    }
    
    .emergency-image img {
        min-height: 620px;
    }
}

/* =========================================
BREAKPOINT: 1440px (Default - already set)
========================================= */

/* =========================================
BREAKPOINT: 1280px (Small Desktop)
========================================= */
@media (max-width: 1280px) {
    .emergency-wrapper {
        gap: 45px;
    }
    
    .emergency-services {
        gap: 20px;
    }
    
    .emergency-item {
        padding: 20px 22px;
    }
    
    .emergency-item h3 {
    }
    
    .emergency-image img {
        min-height: 500px;
    }
}

/* =========================================
BREAKPOINT: 1200px (Desktop)
========================================= */
@media (max-width: 1200px) {
    .emergency-tree-service {
        padding: 70px 0;
    }
    
    .emergency-wrapper {
        gap: 40px;
    }
    
    .emergency-cta-box {
        padding: 25px 28px;
    }
}

/* =========================================
BREAKPOINT: 1024px (Tablet Landscape)
========================================= */
@media (max-width: 1024px) {
    .emergency-wrapper {
        gap: 35px;
    }
    
    .emergency-services {
        gap: 18px;
    }
    
    .emergency-item {
        padding: 18px 20px;
    }
    
    .emergency-item h3 {
    }
    
    .emergency-item p {
    }
    
    .emergency-list li {
    }
    
    .emergency-image img {
        min-height: 450px;
    }
    
    .emergency-floating-card {
        padding: 18px 22px;
    }
    
    .emergency-floating-card h4 {
    }
}

/* =========================================
BREAKPOINT: 992px (Tablet)
========================================= */
@media (max-width: 992px) {
    .emergency-tree-service {
        padding: 60px 0;
    }
    
    .emergency-wrapper {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .emergency-content {
        gap: 30px;
    }
    
    .emergency-services {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }
    
    .emergency-image img {
        min-height: 420px;
    }
    
    .emergency-floating-card {
        position: relative;
        bottom: auto;
        left: auto;
        right: auto;
        margin-top: 20px;
    }
}

/* =========================================
BREAKPOINT: 768px (Tablet Portrait)
========================================= */
@media (max-width: 768px) {
    .emergency-tree-service {
        padding: 50px 0;
    }
    
    .emergency-wrapper {
        gap: 35px;
    }
    
    .emergency-content {
        gap: 25px;
    }
    
    .emergency-cta-box {
        padding: 22px 24px;
    }
    
    .cta-text p {
        margin-bottom: 20px;
    }
    
    .emergency-cta-box .trust-buttons {
        flex-direction: column;
        gap: 12px;
    }
    
    .emergency-cta-box .btn-estimate,
    .emergency-cta-box .btn-call {
        width: 100%;
        text-align: center;
    }
    
    .emergency-services {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .emergency-item.emergency-highlight {
        grid-column: span 1;
    }
    
    .emergency-item {
        padding: 18px 20px;
    }
    
    .emergency-item h3 {
    }
    
    .emergency-image img {
        min-height: 380px;
        border-radius: 24px;
    }
    
    .emergency-floating-card {
        margin-top: 18px;
        padding: 16px 20px;
    }
}

/* =========================================
BREAKPOINT: 576px (Mobile Landscape)
========================================= */
@media (max-width: 576px) {
    .emergency-tree-service {
        padding: 40px 0;
    }
    
    .emergency-wrapper {
        gap: 30px;
    }
    
    .emergency-content {
        gap: 20px;
    }
    
    .emergency-cta-box {
        padding: 18px 20px;
        border-radius: 20px;
    }
    
    .cta-text p {
        line-height: 1.5;
        margin-bottom: 18px;
    }
    
    .emergency-services {
        gap: 14px;
    }
    
    .emergency-item {
        padding: 16px 18px;
        border-radius: 16px;
    }
    
    .emergency-item h3 {
        margin-bottom: 10px;
    }
    
    .emergency-item p {
        line-height: 1.5;
        margin-bottom: 8px;
    }
    
    .emergency-list {
        padding-left: 18px;
        margin-top: 8px;
    }
    
    .emergency-list li {
        line-height: 1.55;
        margin-bottom: 5px;
    }
    
    .emergency-image img {
        min-height: 320px;
        border-radius: 20px;
    }
    
    .emergency-floating-card {
        margin-top: 15px;
        padding: 14px 18px;
        border-radius: 18px;
    }
    
    .emergency-floating-card h4 {
        margin-bottom: 6px;
    }
    
    .emergency-floating-card p {
        line-height: 1.5;
    }
}

/* =========================================
BREAKPOINT: 425px (Mobile Medium)
========================================= */
@media (max-width: 425px) {
    .emergency-tree-service {
        padding: 35px 0;
    }
    
    .emergency-wrapper {
        gap: 25px;
    }
    
    .emergency-cta-box {
        padding: 20px 22px;
    }
    
    .cta-text p {
    }
    
    .emergency-services {
        gap: 12px;
    }
    
    .emergency-item {
        padding: 20px 22px;
    }
    
    .emergency-item h3 {
    }
    
    .emergency-item p {
    }
    
    .emergency-list li {
    }
    
    .emergency-image img {
        min-height: 280px;
        border-radius: 18px;
    }
    
    .emergency-floating-card {
        padding: 20px 22px;
    }
    
    .emergency-floating-card h4 {
    }
    
    .emergency-floating-card p {
    }
}

/* =========================================
BREAKPOINT: 375px (Mobile Small)
========================================= */
@media (max-width: 375px) {
    .emergency-tree-service {
        padding: 30px 0;
    }
    
    .emergency-wrapper {
        gap: 22px;
    }
    
    .emergency-cta-box {
        padding: 20px 22px;
    }
    
    .cta-text p {
        margin-bottom: 15px;
    }
    
    .emergency-services {
        gap: 10px;
    }
    
    .emergency-item {
        padding: 20px 22px;
    }
    
    .emergency-item h3 {
        margin-bottom: 8px;
    }
    
    .emergency-item p {
    }
    
    .emergency-list {
        padding-left: 16px;
    }
    
    .emergency-list li {
        margin-bottom: 4px;
    }
    
    .emergency-image img {
        min-height: 250px;
    }
    
    .emergency-floating-card {
        padding: 20px 22px;
    }
    
    .emergency-floating-card h4 {
    }
    
    .emergency-floating-card p {
    }
}

/* =========================================
BREAKPOINT: 320px (Mobile Extra Small)
========================================= */
@media (max-width: 320px) {
    .emergency-tree-service {
        padding: 25px 0;
    }
    
    .emergency-wrapper {
        gap: 20px;
    }
    
    .emergency-cta-box {
        padding: 20px 22px;
    }
    
    .cta-text p {
    }
    
    .emergency-services {
        gap: 8px;
    }
    
    .emergency-item {
        padding: 10px 12px;
    }
    
    .emergency-item h3 {
    }
    
    .emergency-item p {
    }
    
    .emergency-list li {
    }
    
    .emergency-image img {
        min-height: 220px;
    }
    
    .emergency-floating-card {
        padding: 8px 12px;
    }
    
    .emergency-floating-card h4 {
    }
    
    .emergency-floating-card p {
    }
}

/* =========================================
LANDSCAPE MODE (Mobile Landscape)
========================================= */
@media (max-width: 768px) and (orientation: landscape) {
    .emergency-tree-service {
        padding: 40px 0;
    }
    
    .emergency-wrapper {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
    
    .emergency-content {
        gap: 20px;
    }
    
    .emergency-services {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .emergency-image img {
        min-height: 350px;
    }
    
    .emergency-floating-card {
        position: relative;
        margin-top: 15px;
    }
    
    .emergency-cta-box .trust-buttons {
        flex-direction: row;
    }
    
    .emergency-cta-box .btn-estimate,
    .emergency-cta-box .btn-call {
        width: auto;
        flex: 1;
    }
}

/* =========================================
PRINT STYLES
========================================= */
@media print {
    .emergency-tree-service {
        padding: 20px 0;
    }
    
    .emergency-wrapper {
        display: block;
    }
    
    .emergency-item {
        box-shadow: none;
        border: 1px solid #ddd;
        page-break-inside: avoid;
    }
    
    .emergency-cta-box {
        background: #f0f0f0;
        border: 1px solid #ddd;
    }
    
    .emergency-floating-card {
        box-shadow: none;
        border: 1px solid #ddd;
        position: relative;
        margin-top: 15px;
    }
    
    .emergency-call-btn {
        background: #f0f0f0;
        color: #000;
        border: 1px solid #ddd;
    }
}

/* =========================================
   TYPOGRAPHY STANDARDIZATION (USER REQUESTED)
   ========================================= */
/* Desktop */
.emergency-tree-service h2, .section-title h2 { font-size: 40px !important; }
.emergency-tree-service h3, .emergency-tree-service h4, .emergency-item h3, .emergency-floating-card h4, .section-title h3 { font-size: 22px !important; }
.emergency-tree-service p, .emergency-item p, .emergency-floating-card p, .section-title p { font-size: 18px !important; line-height: 1.6 !important; }
.emergency-tree-service li { font-size: 18px !important; line-height: 1.6 !important; }

/* Tablet and Mobile (<= 1024px) */
@media (max-width: 1024px) {
    .emergency-tree-service h2, .section-title h2 { font-size: 35px !important; }
    .emergency-tree-service h3, .emergency-tree-service h4, .emergency-item h3, .emergency-floating-card h4, .section-title h3 { font-size: 22px !important; }
    .emergency-tree-service p, .emergency-item p, .emergency-floating-card p, .section-title p { font-size: 18px !important; line-height: 1.6 !important; }
    .emergency-tree-service li { font-size: 18px !important; line-height: 1.6 !important; }
}