/* --- GLOBAL UTILITIES (DO NOT REMOVE) --- */
        body { 
            margin: 0; 
            padding: 0; 
              
            /* --- FIXED BACKGROUND TILING START --- */
            background-color: #f4f4f4; 
            /* --- FIXED BACKGROUND TILING END --- */

            font-family: 'Nunito', sans-serif; 
            -webkit-font-smoothing: antialiased; 
        }
          
        html { scroll-behavior: smooth; }
        * { box-sizing: border-box; }
          
        /* Focus Outline for Accessibility */
        :focus-visible { outline: 2px solid #FCB017; outline-offset: 2px; }

        /* Unified Button Style Helper */
        .btn-core {
            display: inline-flex; align-items: center; justify-content: center; gap: 8px;
            padding: 12px 24px; border-radius: 999px; text-decoration: none;
            font-weight: 700; font-size: 15px; line-height: 1;
            transition: all 0.25s ease; cursor: pointer;
        }
          
        /* Global Gradient Top Bar */
        body::before { content:""; position:absolute; top:0; left:0; width:100%; height:10px; background: linear-gradient(90deg, #FFC956 0%, #FCB017 40%, #F4A90C 100%); z-index:9999; }

.esp.hero-guarding-wm { background:#fff; border-bottom:1px solid rgba(0,0,0,0.05); }
    .esp.hero-guarding-wm .container {
      max-width:1100px; margin:0 auto; padding:70px 16px 60px; text-align:center; color:#3E3D3D;
    }
    .esp.hero-guarding-wm .eyebrow-pill {
      display:inline-block; padding:6px 14px; border:2px solid #e6e6e6; border-radius:999px;
      font-weight:700; font-size:12px; letter-spacing:.05em; text-transform:uppercase;
      color: #ff8c00c7; background:#fff; margin:0 0 12px;
    }
    .esp.hero-guarding-wm h1 {
      margin:10px 0 6px; color:#111111; font-weight:700; font-size:clamp(28px,5vw,42px); line-height:1.1;
    }
    .esp.hero-guarding-wm .hero-underline {
      width:100px; height:5px; border-radius:5px; background:#FCB017; margin:12px auto 14px;
    }
    .esp.hero-guarding-wm .subhead {
      margin:0 auto 14px; font-weight:700; color:#424a57; font-size:clamp(16px,3vw,20px); max-width:800px;
    }
    .esp.hero-guarding-wm .lead {
      max-width:860px; margin:0 auto 24px; font-size:clamp(15px,2.6vw,17px); line-height:1.65; color:#424a57;
    }
    .esp.hero-guarding-wm .cta-row {
      display:flex; justify-content:center; gap:12px; flex-wrap:wrap;
    }

    .esp.hero-guarding-wm .btn {
      border-radius:999px; border:2px solid #FCB017; background:#FCB017;
      color:#111; font-weight:700; box-shadow:0 4px 10px rgba(0,0,0,.08);
      padding: 14px 28px; text-decoration: none; transition: 0.2s;
    }
    .esp.hero-guarding-wm .btn:hover { background: #fff;  color:#FCB017; transform: translateY(-2px); }
      
    .esp.hero-guarding-wm .accred-strip {
        margin-top: 32px; display: flex; flex-wrap: wrap; justify-content: center; gap: 15px; opacity: 0.7;
    }
    .esp.hero-guarding-wm .accred-text {
        font-size: 13px; font-weight: 700; color: #424a57; text-transform: uppercase; letter-spacing: 0.5px;
    }
    /* New Style for Dots */
    .esp.hero-guarding-wm .sep-dot {
        color: #FCB017; /* Orange Color */
    }


/* Add this to your CSS to force the font to load */
.esp.calc-budget .c-trigger, 
.esp.calc-budget .c-opt,
.esp.calc-budget .custom-input {
    font-family: 'Nunito', sans-serif !important;
}

.esp.why-matters {
      background: #fff; padding: 70px 16px 60px;
      font-family: 'Nunito', sans-serif; color: #424a57;
    }
    .esp.why-matters .wrap {
      max-width: 1100px; margin: 0 auto;
      display: grid; gap: 30px; align-items: center;
    }
    @media(min-width: 900px) { .esp.why-matters .wrap { grid-template-columns: 1fr 1fr; } }

    .esp.why-matters .content-side { padding-right: 20px; }
      
    /* Updated Chip Design with Border */
    .esp.why-matters .eyebrow {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
        font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
        color: #FCB017; background: #fff; margin: 0 0 12px;
    }
      
    .esp.why-matters h2 {
        font-size: clamp(28px, 4vw, 38px); font-weight: 700; color: #111; margin: 0 0 10px; line-height: 1.15;
    }
      
    /* Updated Quote Style */
    .esp.why-matters .motto {
        font-size: 18px; font-style: italic; 
        color: #424a57; 
        border-left: 5px solid #FCB017; 
        margin: 0 0 20px; font-weight: 600;
        
        background: #fff; 
        padding: 16px 24px;
        border-radius: 0 12px 12px 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        line-height: 1.4;
    }

    .esp.why-matters .desc { font-size: 16px; line-height: 1.6; color: #424a57; margin-bottom: 24px; }
      
    /* Updated Button Design */
    .esp.why-matters .btn {
        display: inline-flex; align-items: center; justify-content: center; gap: 10px;
        padding: 14px 28px; border-radius: 999px;
        background: #FCB017; color: #111; font-weight: 700; text-decoration: none;
        box-shadow: 0 4px 10px rgba(0,0,0,.08); border: 2px solid #FCB017;
        transition: all 0.25s ease;
    }
    .esp.why-matters .btn:hover {
        background: #fff; color: #FCB017; transform: translateY(-2px);
        box-shadow: 0 8px 16px rgba(0,0,0,.12);
    }

    .esp.why-matters .list-side {
        display: grid; gap: 14px;
        grid-auto-rows: 1fr; 
    }
      
    /* Updated Card Design: Center Content */
    .esp.why-matters .card {
        background: #fff; padding: 18px; border-radius: 12px; border: 1px solid rgba(0,0,0,0.08);
        box-shadow: 0 4px 12px rgba(0,0,0,0.03); transition: 0.2s; 
        display: flex; gap: 16px; 
        align-items: center; 
        min-height: 110px; 
        height: 100%; 
    }
    .esp.why-matters .card:hover { transform: translateY(-3px); border-color: #FCB017; box-shadow: 0 10px 20px rgba(0,0,0,0.06); }
      
    .esp.why-matters .icon {
        background: rgba(252, 176, 23, 0.15); width: 44px; height: 44px; border-radius: 50%;
        display: grid; place-items: center; font-size: 20px; color: #FCB017; flex-shrink: 0;
    }
    .esp.why-matters h3 { margin: 0 0 4px; font-size: 17px; font-weight: 700; color: #111; }
    .esp.why-matters p { margin: 0; font-size: 14.5px; line-height: 1.5; color: #424a57; }

    /* --- MOBILE OPTIMIZATION --- */
    @media (max-width: 900px) {
        .esp.why-matters { text-align: center !important; }
        
        .esp.why-matters .content-side { padding-right: 0 !important; }

        /* Center Quote/Motto */
        .esp.why-matters .motto {
            margin: 0 auto 20px !important;
            display: inline-block !important;
        }

        /* Center Button */
        .esp.why-matters .btn {
            margin: 0 auto !important;
        }

        /* Center Card Content */
        .esp.why-matters .card {
            flex-direction: column !important; /* Stack icon on top */
            text-align: center !important;
            justify-content: center !important;
            padding: 24px !important;
        }

        .esp.why-matters .icon {
            margin-bottom: 10px !important;
        }
    }

/* --- MAIN SECTION STYLES --- */
    .esp.core-duties { 
        background: #fafafa; 
        padding: 70px 16px 60px; 
        font-family: 'Nunito', sans-serif; 
    }
    .esp.core-duties .wrap { max-width: 1100px; margin: 0 auto; }
      
    /* Header Styles */
    .esp.core-duties .header { 
        text-align: left; 
        max-width: 800px; 
        margin: 0 0 40px; 
    }
      
    /* Tag Style (Chip) */
    .esp.core-duties .sub { 
        display: inline-flex; align-items: center; gap: 8px;
        padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
        font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
        color: #FCB017; background: #fff; margin: 0 0 12px;
    }

    .esp.core-duties h2 { font-size: clamp(28px, 4vw, 38px); font-weight: 700; margin: 0 0 8px; color: #111; line-height: 1.1; }
      
    /* Quote Style */
    .esp.core-duties .quote { 
        font-style: italic; 
        color: #424a57; 
        margin: 0 0 20px; 
        font-size: 18px; 
        border-left: 5px solid #FCB017; 
        
        background: #ffffff;
        padding: 16px 24px;
        border-radius: 0 12px 12px 0; 
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        
        line-height: 1.4;
    }

    /* Subheading Strip */
    .esp.core-duties .points-strip {
        display: flex; flex-wrap: wrap; 
        align-items: center;
        gap: 12px; 
        
        font-size: 13px; font-weight: 700; color: #424a57; 
        text-transform: uppercase; letter-spacing: 1px;
    }
    .esp.core-duties .points-strip span { 
        color: #FCB017; margin: 0; font-size: 14px; 
    }

    /* --- GRID STYLES (Duties) --- */
    .esp.core-duties .grid {
        display: grid; grid-template-columns: 1fr; gap: 20px; margin-bottom: 40px;
    }
    @media(min-width: 768px) { .esp.core-duties .grid { grid-template-columns: repeat(2, 1fr); } }

    .esp.core-duties .card {
        background: #fff; border: 1px solid #eee; border-radius: 16px; padding: 20px;
        transition: 0.25s; position: relative; overflow: hidden;
    }
    .esp.core-duties .card:hover { border-color: #FCB017; box-shadow: 0 12px 24px rgba(0,0,0,0.06); transform: translateY(-4px); }

    .esp.core-duties h3 { font-size: 20px; margin: 0 0 10px; color: #111; font-weight: 700; display: flex; align-items: center; gap: 10px; }
    .esp.core-duties p { font-size: 15px; line-height: 1.6; color: #424a57; margin: 0; }

    /* --- EMERGENCY MERGED BLOCK STYLES --- */
    .esp.core-duties .emergency-merged {
        background: #fff; 
        border-radius: 20px;
        padding: 20px;
        border: 2px solid #eee;
        border-left: 6px solid #FCB017; 
        text-align: left; 
    }

    .esp.core-duties .emergency-merged h3 {
        font-size: 22px; margin-bottom: 8px; color: #111;
    }
    .esp.core-duties .emergency-merged p {
        font-size: 16px; color: #424a57; margin: 0; 
    }
    .esp.core-duties .emergency-merged .sub-tag {
        font-size: 11px; font-weight: 700; color: #FCB017; text-transform: uppercase; margin-bottom: 5px; display: block;
    }
    .esp.core-duties .emergency-merged .sub-heading-bold {
        font-weight: 700; color: #111; margin-bottom: 8px; display: block; font-size: 16px;
    }
    .esp.core-duties .emergency-merged .quote-small {
        font-style: italic; color: #424a57; margin-bottom: 16px; display: block; font-size: 15px;
    }

    /* Button Style */
    .esp.core-duties .btn-emergency {
        display: inline-flex; align-items: center; justify-content: center; gap: 10px;
        padding: 14px 28px; border-radius: 999px;
        background: #FCB017; color: #111; font-weight: 700; text-decoration: none;
        border: 2px solid #FCB017; box-shadow: 0 4px 10px rgba(0,0,0,.08);
        transition: all 0.2s ease;
        white-space: nowrap;
        margin-top: 24px; 
    }
    .esp.core-duties .btn-emergency:hover { 
        background: #fff; color: #FCB017; transform: translateY(-2px); 
        box-shadow: 0 8px 16px rgba(0,0,0,.12);
    }

    /* --- MOBILE OPTIMIZATION (Center Align Headings & Chips) --- */
    @media (max-width: 900px) {
        .esp.core-duties { text-align: center !important; }
        
        .esp.core-duties .header, 
        .esp.core-duties .emergency-merged {
            text-align: center !important;
            margin-left: auto !important;
            margin-right: auto !important;
        }

        /* Center Flex Items (Headings, Strips) */
        .esp.core-duties h3, 
        .esp.core-duties .points-strip {
            justify-content: center !important;
        }

        /* Stack Grid and Center Content */
        .esp.core-duties .grid {
            display: flex !important;
            flex-direction: column !important;
        }

        .esp.core-duties .card {
            text-align: center !important;
            display: flex !important;
            flex-direction: column !important;
            align-items: center !important;
        }
    }

.esp.process-wm { 
        background: #fff; /* Light Grey background to separate from white sections */
        padding: 70px 16px 60px; 
        font-family: 'Nunito', sans-serif; 
    }
    .esp.process-wm .wrap { max-width: 1100px; margin: 0 auto; }

    /* Header Styling */
    .esp.process-wm .head-box { text-align: center; margin-bottom: 40px; }
      
    .esp.process-wm .eyebrow {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
        font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
        color: #FCB017; background: #fff; margin: 0 0 12px;
    }

    .esp.process-wm h2 { 
        font-size: 38px; font-weight: 700; color: #111; margin: 0 0 10px; line-height: 1.2; 
    }
      
    .esp.process-wm .sub-h {
        font-size: 18px; color: #424a57; margin-bottom: 20px;
    }

    /* Motto Style */
    .esp.process-wm .motto { 
        font-size: 18px; font-style: italic; color: #424a57; 
        border-left: 5px solid #FCB017; 
        margin: 0 auto; font-weight: 600;
        background: #fff; 
        padding: 16px 24px;
        border-radius: 0 12px 12px 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        line-height: 1.4;
        text-align: left;
    }

    /* Process Grid */
    .esp.process-wm .process-grid {
        display: grid; 
        grid-template-columns: repeat(4, 1fr); 
        gap: 20px;
        margin-top: 40px;
    }
      
    /* Step Card Styling */
    .esp.process-wm .step-card {
        background: #fff; 
        padding: 30px 20px 24px; 
        border-radius: 16px; 
        border: 1px solid #eee;
        position: relative;
        transition: all 0.3s ease;
        text-align: left;
    }
      
    .esp.process-wm .step-card:hover {
        border-color: #FCB017; 
        transform: translateY(-5px);
        box-shadow: 0 12px 24px rgba(0,0,0,0.08);
    }
      
    /* Number Badge */
    .esp.process-wm .step-num {
        position: absolute;
        top: -15px; left: 20px;
        background: #FCB017; color: #111;
        font-weight: 800; font-size: 14px;
        padding: 6px 12px; border-radius: 8px;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    }

    .esp.process-wm h3 {
        font-size: 18px; font-weight: 700; color: #111; margin: 10px 0 10px;
    }

    .esp.process-wm p {
        font-size: 14.5px; line-height: 1.6; color: #424a57; margin: 0;
    }

    /* --- MOBILE OPTIMIZATION --- */
    @media (max-width: 900px) {
        .esp.process-wm { padding-left: 20px !important; padding-right: 20px !important; }
        .esp.process-wm h2 { font-size: 28px !important; }
        .esp.process-wm .process-grid { grid-template-columns: 1fr; gap: 30px; } /* Stack vertically */
        .esp.process-wm p { font-size: 15.5px !important; }
        .esp.process-wm .motto { font-size: 16px !important; }
        .esp.process-wm .step-card { padding-top: 24px; } /* More space for badge on mobile */
    }

.esp.pricing-wm { 
        background: #fafafa; 
        padding: 70px 16px 60px; 
        font-family: 'Nunito', sans-serif;
    }
    .esp.pricing-wm .wrap { max-width: 1100px; margin: 0 auto; text-align: center; }
      
    /* --- HEADER SECTION --- */
    .esp.pricing-wm .top-flex { 
        display: flex; flex-wrap: wrap; justify-content: center; text-align: center; 
        margin-bottom: 40px; gap: 20px; 
    }
      
    /* 1. CHIP STYLE (Consistent) */
    .esp.pricing-wm .eyebrow {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
        font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
        color: #FCB017; background: #fff; margin: 0 0 12px;
    }

    .esp.pricing-wm h2 { font-size: clamp(28px, 4vw, 38px); font-weight: 700; margin: 0 0 8px; color: #111; line-height: 1.2; }
      
    /* 2. UPDATED MOTTO STYLE */
    .esp.pricing-wm .motto { 
        font-size: 18px; font-style: italic; color: #424a57; 
        border-left: 5px solid #FCB017; 
        margin: 0 0 20px; font-weight: 500;
        background: #fff; 
        padding: 16px 24px;
        border-radius: 0 12px 12px 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        line-height: 1.4;
        text-align: left;
    }
      
    /* Button Style */
    .esp.pricing-wm .btn {
        display: inline-flex; align-items: center; justify-content: center; gap: 10px;
        padding: 14px 28px; border-radius: 999px;
        background: #FCB017; color: #111; font-weight: 700; text-decoration: none;
        box-shadow: 0 4px 10px rgba(0,0,0,.08); border: 2px solid #FCB017;
        transition: all 0.25s ease;
        margin-top: 32px; 
    }
    .esp.pricing-wm .btn:hover {
        background: #fff; color: #FCB017; transform: translateY(-2px);
        box-shadow: 0 8px 16px rgba(0,0,0,.12);
    }
      
    /* --- GRID LAYOUT (Centered Block for Single Card) --- */
    .esp.pricing-wm .card-grid {
        display: block; max-width: 800px; margin: 0 auto;
    }

    /* --- COMMON CARD STYLES --- */
    .esp.pricing-wm .card {
        background: #fff; padding: 30px; border-radius: 20px; 
        box-shadow: 0 4px 20px rgba(0,0,0,0.03); border: 1px solid rgba(0,0,0,0.05);
        transition: transform 0.2s;
    }
    .esp.pricing-wm .card:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(0,0,0,0.06); border-color: #FCB017; }

    /* Left Card Specifics */
    .esp.pricing-wm .main-card { border-left: 6px solid #FCB017; }
      
    /* Rate Rows */
    .esp.pricing-wm .rate-row { 
        display: flex; justify-content: space-between; align-items: center; 
        border-bottom: 1px solid #f0f0f0; padding-bottom: 16px; margin-bottom: 16px; 
    }
    .esp.pricing-wm .rate-row:last-of-type { border-bottom: none; margin-bottom: 0; }
      
    .esp.pricing-wm .rate-lbl { font-weight: 700; color: #333; font-size: 18px; text-align: left; }
    .esp.pricing-wm .rate-val { font-weight: 700; color: #111; font-size: 26px; }
    .esp.pricing-wm .unit { font-size: 14px; font-weight: 500; color: #777; margin-left: 2px; }
      
    .esp.pricing-wm h3 { margin: 0 0 20px; font-size: 20px; font-weight: 700; color: #111; display: flex; align-items: center; gap: 10px; }
    .esp.pricing-wm .note { font-size: 13px; color: #424a57; margin-top: 20px; line-height: 1.5; text-align: left; }

    /* --- MOBILE OPTIMIZATION (Centered) --- */
    @media (max-width: 900px) {
        .esp.pricing-wm { text-align: center !important; }
        .esp.pricing-wm .top-flex { justify-content: center !important; text-align: center !important; }
        .esp.pricing-wm .eyebrow { margin: 0 auto 12px !important; }
        .esp.pricing-wm .motto { margin: 0 auto 20px !important; display: inline-block !important; }
        .esp.pricing-wm .card-grid { width: 100% !important; }
        .esp.pricing-wm h3 { justify-content: center !important; }
        .esp.pricing-wm .rate-row { gap: 15px !important; }
    }

.esp.calc-budget { background: #fff; padding: 70px 16px 60px; font-family:'Nunito',sans-serif; }
    .esp.calc-budget .wrap { max-width: 800px; margin: 0 auto; border: 2px solid #e6e6e6; border-radius: 20px; padding: 30px; background:#fff; }
    .esp.calc-budget h2 { text-align: center; margin: 0 0 16px; font-weight: 700; font-size: 38px; color: #111; }
      
    /* Subtitle Motto Style */
    .esp.calc-budget .motto-style { 
        font-size: 18px; font-style: italic; color: #555; 
        border-left: 5px solid #FCB017; 
        background: #fff; 
        padding: 12px 24px;
        border-radius: 0 12px 12px 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        line-height: 1.4;
        font-weight: 600;
        margin-bottom: 32px;
    }
    .esp.calc-budget .center-motto { text-align: center; }

    .esp.calc-budget .c-grid { display: grid; gap: 20px; grid-template-columns: 1fr; margin-bottom: 30px; }
    @media(min-width:600px){ .esp.calc-budget .c-grid { grid-template-columns: 1fr 1fr; } }

    .esp.calc-budget label { display: block; font-weight: 700; margin-bottom: 8px; font-size: 14px; }

    /* Custom Select */
    .esp.calc-budget .c-select { position: relative; width: 100%; }
      
    .esp.calc-budget .c-trigger {
      width:100%; padding:12px 12px 12px 16px; 
      border:1px solid #ddd; border-radius:8px;
      background:#fff; color:#111; font-size:16px; text-align:left; cursor:pointer;
      line-height:1.2; box-shadow: 0 1px 0 rgba(0,0,0,.02);
      display: flex; justify-content: space-between; align-items: center; 
    }
    .esp.calc-budget .c-trigger:focus-visible{ outline:0; box-shadow:0 0 0 3px rgba(252,176,23,.30); border-color:#FCB017; }
      
    /* CHEVRON STYLE */
    .esp.calc-budget .chev {
      width: 24px; height: 24px; display: grid; place-items: center; border-radius: 999px;
      border: 1px solid rgba(0,0,0,.10); flex-shrink: 0;
    }
    .esp.calc-budget .chev::after {
      content: ""; display: inline-block; width: 8px; height: 8px; 
      border-right: 2.5px solid #FCB017;
      border-bottom: 2.5px solid #FCB017; 
      transform: rotate(45deg); transition: transform .2s ease; margin-bottom: 4px;
    }
    .esp.calc-budget .c-select[data-open="true"] .chev::after {
       transform: rotate(-135deg); margin-bottom: -2px; 
    }

    .esp.calc-budget .c-menu{
      position:absolute; left:0; right:0; margin-top:8px; border:1px solid #e6e6e6; border-radius:12px;
      background:#fff; box-shadow: 0 12px 26px rgba(0,0,0,.12); z-index:50; max-height:240px; overflow:auto; padding:6px; display:none;
    }
    .esp.calc-budget .c-select[data-open="true"] .c-menu{ display:block; }

    .esp.calc-budget .c-opt{
      width:100%; border:0; background:transparent; text-align:left; padding:10px 10px;
      border-radius:10px; font-size:16px; cursor:pointer; color:#111;
    }
    .esp.calc-budget .c-opt:hover { background:#FCB017; color:#111; }
    .esp.calc-budget .c-opt:focus-visible{ outline:0; box-shadow:0 0 0 3px rgba(252,176,23,.30); }

    /* Custom Input Field Style */
    .esp.calc-budget .custom-input-wrap {
        margin-top: 10px;
        display: none; /* Hidden by default */
        width: 100%;
    }
    .esp.calc-budget .custom-input {
        width: 100%; padding: 12px;
        border: 1px solid #ddd; border-radius: 8px;
        font-size: 16px; font-family: inherit;
        outline: none;
    }
    .esp.calc-budget .custom-input:focus { border-color: #FCB017; box-shadow: 0 0 0 3px rgba(252,176,23,.30); }

    /* Updated Result Section Grid - SINGLE BOX */
    .esp.calc-budget .results-wrapper {
        display: flex; 
        justify-content: center;
        width: 100%;
    }

    .esp.calc-budget .res-card { 
        background: #fff; padding: 24px; border-radius: 12px; 
        text-align: center; border: 1px solid #eee; 
        box-shadow: 0 2px 8px rgba(0,0,0,0.03);
        transition: all 0.3s ease; 
        cursor: default; 
        width: 100%;
        max-width: 400px; 
    }
      
    .esp.calc-budget .res-card:hover { 
        border-color: #FCB017; 
        box-shadow: 0 4px 12px rgba(252, 176, 23, 0.15); 
        transform: translateY(-2px);
    }
      
    .esp.calc-budget .res-card:hover .res-val { color: #FCB017; }

    .esp.calc-budget .res-lbl { font-size: 14px; color: #666; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px; }
      
    .esp.calc-budget .res-val { 
        font-size: 32px; font-weight: 700; color: #111; 
        transition: color 0.3s ease;
    }

    .esp.calc-budget .disclaimer { font-size: 12px; color: #999; margin-top: 24px; text-align: center; }

    /* --- MOBILE OPTIMIZATION --- */
    @media (max-width: 900px) {
        .esp.calc-budget {
            text-align: center !important;
            padding-left: 20px !important;
            padding-right: 20px !important;
        }

        .esp.calc-budget .wrap {
            padding: 24px 20px !important; 
            width: 100% !important;
        }

        /* Center Motto */
        .esp.calc-budget .center-motto {
            text-align: center !important;
        }
        .esp.calc-budget .motto-style {
            display: inline-block !important;
            margin: 0 auto 30px !important;
        }
        
        /* Center Labels */
        .esp.calc-budget label {
            text-align: center !important;
        }

        /* --- FORCE FULL WIDTH BOXES --- */
        .esp.calc-budget .c-grid {
            display: flex !important;
            flex-direction: column !important;
            gap: 20px !important;
            align-items: center !important; /* This centers the children... */
        }
        
        /* ...But we force the inner divs to be 100% wide */
        .esp.calc-budget .c-grid > div {
            width: 100% !important;
        }
        
        .esp.calc-budget .c-trigger {
            width: 100% !important;
            justify-content: space-between !important;
        }

        /* Make Result Card Full Width */
        .esp.calc-budget .res-card {
            max-width: 100% !important;
            width: 100% !important;
        }
    }

.esp.knowledge-base { 
        background: #fafafa; 
        padding: 70px 16px 60px; 
        font-family: 'Nunito', sans-serif; 
    }
    .esp.knowledge-base .wrap { max-width: 1100px; margin: 0 auto; }

    /* Header Styling */
    .esp.knowledge-base .head-box { text-align: center; margin-bottom: 40px; }
      
    .esp.knowledge-base .eyebrow {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
        font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
        color: #FCB017; background: #fff; margin: 0 0 12px;
    }

    .esp.knowledge-base h2 { 
        font-size: 38px; font-weight: 700; color: #111; margin: 0 0 10px; line-height: 1.2; 
    }
      
    .esp.knowledge-base .sub-h {
        font-size: 18px; color: #424a57; margin-bottom: 20px;
    }

    /* Motto Style */
    .esp.knowledge-base .motto { 
        font-size: 18px; font-style: italic; color: #424a57; 
        border-left: 5px solid #FCB017; 
        margin: 0 auto; font-weight: 600;
        background: #fff; 
        padding: 16px 24px;
        border-radius: 0 12px 12px 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        line-height: 1.4;
        text-align: left;
    }

    /* Grid Layout */
    .esp.knowledge-base .kb-grid {
        display: grid; 
        grid-template-columns: repeat(2, 1fr); 
        gap: 24px;
    }
      
    /* Card Styling */
    .esp.knowledge-base .kb-card {
        background: #fff; border: 1px solid #eee; border-radius: 16px; 
        padding: 30px; 
        transition: all 0.3s ease;
        display: flex; flex-direction: column; justify-content: flex-start;
        height: 100%;
    }
      
    .esp.knowledge-base .kb-card:hover {
        border-color: #FCB017; 
        transform: translateY(-5px);
        box-shadow: 0 12px 24px rgba(0,0,0,0.08);
    }

    .esp.knowledge-base h3 {
        font-size: 20px; font-weight: 700; color: #111; margin: 0 0 12px; line-height: 1.4;
    }

    .esp.knowledge-base p {
        font-size: 15px; line-height: 1.6; color: #424a57; margin: 0 0 20px; flex-grow: 1;
    }
      
    /* "Read More" Link Style */
    .esp.knowledge-base .read-link {
        font-size: 14px; font-weight: 800; color: #FCB017; 
        text-decoration: none; text-transform: uppercase; letter-spacing: 0.5px;
        display: inline-flex; align-items: center; gap: 6px;
        margin-top: auto; /* Pushes link to bottom */
    }
    .esp.knowledge-base .read-link:hover { text-decoration: underline; }
      
    /* --- MOBILE OPTIMIZATION --- */
    @media (max-width: 900px) {
        .esp.knowledge-base { padding-left: 20px !important; padding-right: 20px !important; }
        .esp.knowledge-base h2 { font-size: 28px !important; }
        .esp.knowledge-base .kb-grid { grid-template-columns: 1fr; } /* Stack cards */
        .esp.knowledge-base p { font-size: 15.5px !important; }
        .esp.knowledge-base .motto { font-size: 16px !important; }
    }

.esp.why-eagle { background: #fff; padding: 70px 16px 60px; font-family: 'Nunito', sans-serif; }
    .esp.why-eagle .wrap { max-width: 1100px; margin: 0 auto; text-align: center; }
      
    /* NEW CHIP STYLE (Centered) */
    .esp.why-eagle .eyebrow {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
        font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
        color: #FCB017; background: #fff; margin-bottom: 12px;
    }

    .esp.why-eagle h2 { font-size: 38px; font-weight: 700; margin: 10px 0; color: #111; line-height: 1.2; }
      
    /* UPDATED MOTTO STYLE (Consistent) */
    .esp.why-eagle .motto { 
        font-size: 18px; font-style: italic; color: #424a57; 
        border-left: 5px solid #FCB017; 
        margin: 0 auto 40px; font-weight: 500;
        
        /* Consistent Background Styling */
        background: #fff; 
        padding: 16px 24px;
        border-radius: 0 12px 12px 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        line-height: 1.4;
        text-align: left; /* Keep text aligned left inside the box */
    }

    .esp.why-eagle .grid { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
      
    .esp.why-eagle .item { 
        padding: 30px 24px; border-radius: 16px; border: 1px solid #eee; text-align: left;
        background: #fff; /* Default white */
        transition: all 0.3s ease; /* Smooth hover animation */
    }

    /* 2nd Box Background Color */
    .esp.why-eagle .item:nth-child(2) {
        background: #fff;
        border-color: rgba(252, 176, 23, 0.2); /* Slight border tint for colored boxes */
    }

    /* Hover Effects */
    .esp.why-eagle .item:hover { 
        border-color: #FCB017; 
        transform: translateY(-8px); /* Moves up */
        box-shadow: 0 12px 24px rgba(0,0,0,0.08); /* Adds shadow */
    }
      
    .esp.why-eagle h3 { font-size: 19px; font-weight: 700; color: #111; margin: 0 0 10px; }
    .esp.why-eagle p { font-size: 15px; line-height: 1.6; color: #424a57; margin: 0; }
    .esp.why-eagle .check { color: #FCB017; font-size: 28px; margin-bottom: 14px; display: block; }

.esp.mg-cs-wm { 
        background: #fafafa; 
        padding: 70px 16px 60px; 
        font-family: 'Nunito', sans-serif;
    }
    .esp.mg-cs-wm .wrap { max-width: 1100px; margin: 0 auto; text-align: center; }
      
    .esp.mg-cs-wm .head { 
        text-align: center;
        margin-bottom: 30px;
    }
      
    /* Chip Style */
    .esp.mg-cs-wm .eyebrow {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
        font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
        color: #FCB017; background: #fff; margin: 0 0 12px;
    }
      
    #mg-cs-wm-title { 
        margin: 0 0 10px; font-weight: 700; color: #111; 
        font-size: clamp(22px, 4vw, 38px); line-height: 1.2;
    }
      
    /* UPDATED MOTTO STYLE (Consistent) */
    .esp.mg-cs-wm .motto { 
        font-size: 18px; font-style: italic; color: #424a57; 
        border-left: 5px solid #FCB017; 
        margin: 0 auto 24px; font-weight: 500;
        background: #fff; 
        padding: 16px 24px;
        border-radius: 0 12px 12px 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        line-height: 1.4;
        text-align: left;
    }

    .esp.mg-cs-wm h3 { 
        margin: 0 0 24px; 
        font-size: 22px; 
        font-weight: 700; 
        color: #111; 
        padding-bottom: 0; 
        text-align: center; 
    }

    /* Highlights Grid */
    .esp.mg-cs-wm .phases-grid {
        display: grid; gap: 20px;
        grid-template-columns: 1fr;
    }
    @media(min-width: 768px) { .esp.mg-cs-wm .phases-grid { grid-template-columns: 1fr 1fr 1fr; } }

    /* Individual Highlight Boxes */
    .esp.mg-cs-wm .phase-box {
        background: #fff; 
        padding: 20px; border-radius: 16px;
        border: 1px solid rgba(0,0,0,0.05); 
        border-left: 4px solid #ddd; 
        box-shadow: 0 4px 6px rgba(0,0,0,0.02);
        transition: transform 0.2s;
        text-align: left;
    }
    .esp.mg-cs-wm .phase-box:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(0,0,0,0.08); }

    /* Specific Colors - ALL YELLOW */
    .esp.mg-cs-wm .phase-issue { border-left-color: #FCB017; } 
    .esp.mg-cs-wm .phase-response { border-left-color: #FCB017; } 
    .esp.mg-cs-wm .phase-outcome { border-left-color: #FCB017; } 

    .esp.mg-cs-wm .phase-title {
        font-size: 17px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; display: block;
    }
      
    /* Title Colors */
    .esp.mg-cs-wm .phase-issue .phase-title { color: #FCB017; }
    .esp.mg-cs-wm .phase-response .phase-title { color: #FCB017; }
    .esp.mg-cs-wm .phase-outcome .phase-title { color: #FCB017; }

    .esp.mg-cs-wm p { font-size: 14.5px; line-height: 1.6; color: #424a57; margin: 0; }

    /* Button */
    .esp.mg-cs-wm .btn {
        display: inline-flex; margin-top: 30px; padding: 14px 28px; border-radius: 999px; 
        background: #FCB017; color: #111; font-weight: 700; text-decoration: none;
        box-shadow: 0 4px 10px rgba(0,0,0,.08); transition: all 0.2s; border: 2px solid #FCB017;
    }
    .esp.mg-cs-wm .btn:hover { background: #fff; color: #FCB017; transform: translateY(-2px); box-shadow: 0 8px 16px rgba(0,0,0,.12); }

.esp.coverage-wm { background: #fff; padding: 70px 16px 60px; font-family: 'Nunito', sans-serif; }
    .esp.coverage-wm .wrap { max-width: 1100px; margin: 0 auto; text-align: center; }
      
    /* Consistent Tag Style */
    .esp.coverage-wm .eyebrow {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
        font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
        color: #FCB017; background: #fff; margin: 0 0 12px;
    }

    .esp.coverage-wm h2 { font-size: 38px; font-weight: 700; color: #111; margin: 0 0 20px; }
      
    /* UPDATED MOTTO STYLE (Consistent) */
    .esp.coverage-wm .motto { 
        font-size: 18px; font-style: italic; color: #424a57; 
        border-left: 5px solid #FCB017; 
        margin: 0 auto 30px; font-weight: 500;
        background: #fff; 
        padding: 16px 24px;
        border-radius: 0 12px 12px 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.04);
        display: inline-block;
        line-height: 1.4;
        text-align: left;
    }

    /* DEFAULT (Desktop/Tablet) - Flexbox */
    .esp.coverage-wm .pill-grid {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
      margin-top: 30px;
    }

    /* --- UPDATED BUTTON STYLE --- */
    .esp.coverage-wm .pill {
      display: inline-flex; align-items: center; justify-content: center;
      padding: 14px 28px; /* Standard button padding */
      border-radius: 999px;
      font-size: 15px;
      font-weight: 700;
      text-decoration: none;
      transition: all 0.25s ease;
      
      /* Default: Yellow Background, Black Text */
      background: #FCB017;
      color: #111;
      border: 2px solid #FCB017;
      box-shadow: 0 4px 10px rgba(0,0,0,.08);
    }

    /* Hover: White Background, Yellow Text, Yellow Border */
    .esp.coverage-wm .pill:hover,
    .esp.coverage-wm .pill:focus-visible {
      background: #fff;
      color: #FCB017;
      border-color: #FCB017;
      transform: translateY(-2px);
      box-shadow: 0 8px 16px rgba(0,0,0,.12);
      outline: none;
    }

    /* MOBILE SPECIFIC LAYOUT (2-3-2 Pattern) */
    @media (max-width: 600px) {
        .esp.coverage-wm .pill-grid {
            display: grid;
            grid-template-columns: repeat(6, 1fr); /* 6 columns allow for 2 (span 3) and 3 (span 2) items */
            gap: 8px;
            width: 100%; /* Reset width */
        }

        .esp.coverage-wm .pill {
            width: 100%; /* Fill the grid cell */
            padding: 12px 4px; /* Reduce padding slightly for small screens */
            font-size: 13px; /* Slightly smaller text to fit 3 in a row */
            grid-column: span 3; /* Default: 2 items per row (6/3 = 2) */
            margin-bottom: 0; /* Remove default margin */
        }

        /* The Middle 3 Items (3rd, 4th, 5th) -> 3 items per row (6/2 = 3) */
        .esp.coverage-wm .pill:nth-child(3),
        .esp.coverage-wm .pill:nth-child(4),
        .esp.coverage-wm .pill:nth-child(5) {
            grid-column: span 2; 
        }
    }

.esp.client-reviews { background: #fafafa; padding: 70px 16px; font-family: 'Nunito', sans-serif; text-align: center; }
      .esp.client-reviews .wrap { max-width: 900px; margin: 0 auto; }
      .esp.client-reviews .eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px; font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: #FCB017; background: #fff; margin: 0 0 12px; }
      .esp.client-reviews h2 { font-size: 32px; font-weight: 700; color: #111; margin-bottom: 40px; }
      .esp.client-reviews .review-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
      @media(min-width: 768px) { .esp.client-reviews .review-grid { grid-template-columns: 1fr; max-width: 600px; margin: 0 auto; } }
      .esp.client-reviews .review-card { background: #fff; padding: 30px; border-radius: 16px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); text-align: left; border: 1px solid #eee; transition: 0.3s; }
      .esp.client-reviews .review-card:hover { transform: translateY(-5px); border-color: #FCB017; }
      .esp.client-reviews .stars { color: #FCB017; font-size: 18px; margin-bottom: 12px; display: block; }
      .esp.client-reviews p { font-style: italic; color: #424a57; font-size: 16px; line-height: 1.6; margin-bottom: 16px; }
      .esp.client-reviews .author { font-weight: 700; font-size: 14px; color: #111; text-transform: uppercase; letter-spacing: 0.5px; }

/* ===== MASTER FAQ REFERENCE DESIGN (PRESERVED) ===== */
   .esp.mg-faqs-wm.v2 {
     --brand: #FCB017;
     --ink: #111111;
     --line: rgba(0,0,0,.10);
     --bg-grey: #fafafa;
     
     font-family: 'Nunito', system-ui;
     color: #111111;
     background: var(--bg-grey);
     padding: 70px 16px 60px;
     border: none;
     scroll-margin-top: 100px;
   }
   @media(min-width:768px) { 
       .esp.mg-faqs-wm.v2 { padding: 70px 16px 60px; } 
   }

   .esp.mg-faqs-wm.v2 * { box-sizing: border-box; font-family: inherit; }
   .esp.mg-faqs-wm.v2 .wrap { max-width: 1100px; margin: 0 auto; }

   .esp.mg-faqs-wm.v2 .head { position: relative; margin-bottom: 8px; padding-left: 0; }
   
   /* Consistent Chip Style */
   .esp.mg-faqs-wm.v2 .eyebrow {
     display: inline-flex; align-items: center; gap: 8px;
     padding: 6px 14px; border: 1px solid rgba(0,0,0,.1); border-radius: 999px;
     font-weight: 700; font-size: 12px; letter-spacing: .05em; text-transform: uppercase;
     color: #FCB017; background: #fff; margin: 0 0 12px;
   }

   #mg-faqs-wm-mobile-title {
     font-weight: 700; color: var(--ink); 
     font-size: clamp(24px, 4.4vw, 38px);
     line-height: 1.15; letter-spacing: -.01em;
     position: relative; margin: 0 0 20px; padding-bottom: 15px;
   }
   
   
   /* UPDATED MOTTO STYLE (Consistent) */
   .esp.mg-faqs-wm.v2 .motto { 
       font-size: 18px; font-style: italic; color: #424a57; 
       border-left: 5px solid #FCB017; 
       margin: 0 auto 30px; font-weight: 500;
       background: #fff; /* White background to stand out on grey section */
       padding: 16px 24px;
       border-radius: 0 12px 12px 0;
       box-shadow: 0 4px 12px rgba(0,0,0,0.04);
       display: inline-block;
       line-height: 1.4;
       text-align: left;
   }


   .esp.mg-faqs-wm.v2 .list { display: grid; gap: 12px; }

   .esp.mg-faqs-wm.v2 details {
     border: 1px solid var(--line); border-radius: 14px; background: #fff; overflow: hidden;
     transition: border-color .15s, box-shadow .15s, transform .15s;
   }
   .esp.mg-faqs-wm.v2 details[open],
   .esp.mg-faqs-wm.v2 details:hover {
     border-color: var(--brand); box-shadow: 0 10px 22px rgba(0,0,0,.06); transform: translateY(-1px);
   }

   .esp.mg-faqs-wm.v2 summary {
     list-style: none; cursor: pointer; outline: none;
     display: grid; grid-template-columns: 1fr auto;
     gap: 12px; align-items: center;
     padding: 16px 17px;
     font-weight: 700; color: #111111; font-size: 17px;
   }
   .esp.mg-faqs-wm.v2 summary::-webkit-details-marker { display: none; }

   /* Custom Chevron Arrow */
   .esp.mg-faqs-wm.v2 .chev {
     width: 24px; height: 24px; display: grid; place-items: center; border-radius: 999px;
     border: 1px solid var(--line); color: var(--brand);
   }
   .esp.mg-faqs-wm.v2 .chev::after {
     content: ""; display: inline-block; width: 8px; height: 8px; 
     border-right: 2.5px solid var(--brand);
     border-bottom: 2.5px solid var(--brand); 
     transform: rotate(45deg); transition: transform .2s ease; margin-bottom: 4px;
   }
   .esp.mg-faqs-wm.v2 details[open] .chev::after { 
       transform: rotate(-135deg); margin-bottom: -2px; 
   }

   /* Answer Styling & Animation */
   .esp.mg-faqs-wm.v2 .answer {
     max-height: 0; 
     opacity: 0; 
     overflow: hidden;
     transition: max-height 0.4s ease-out, opacity 0.4s ease-out, padding 0.4s ease;
     padding: 0 16px; 
     border-top: 1px solid transparent; 
     font-size: 16px; line-height: 1.7; color: #424a57;
   }

   /* Active State (When Open) */
   .esp.mg-faqs-wm.v2 details[open] .answer { 
       border-top: 1px solid var(--line); 
       max-height: none; 
       opacity: 1;
       padding-top: 16px;
       padding-bottom: 16px;
   }

   .esp.mg-faqs-wm.v2 .answer p { margin: 0; }

.esp.author-bio { background: #fff; padding: 40px 16px; font-family: 'Nunito', sans-serif;}
      .esp.author-bio .wrap { max-width: 800px; margin: 0 auto; display: flex; align-items: center; gap: 20px; background: #fafafa; padding: 20px; border-radius: 12px; border-left: 5px solid #FCB017; }
      .esp.author-bio .bio-text h4 { margin: 0 0 5px; font-size: 16px; font-weight: 700; color: #111; }
      .esp.author-bio .bio-text p { margin: 0; font-size: 14px; color: #555; line-height: 1.5; }
      @media(max-width: 600px) { .esp.author-bio .wrap { flex-direction: column; text-align: center; } }

@keyframes wm-spin { to { transform: rotate(360deg); } }
    
    .wm-loading-icon {
      display: inline-block; width: 16px; height: 16px;
      border: 2px solid #111; /* Matches button text color */
      border-radius: 50%; border-top-color: transparent;
      animation: wm-spin 0.8s linear infinite; margin-right: 8px;
    }
    
    .wm-btn.is-loading {
      opacity: 0.8; cursor: not-allowed; pointer-events: none; 
      background-color: #e5a015; /* Maintain brand feel */
    }
    
    .wm-status.error { 
        display: block; 
        color: #dc2626; 
        margin-bottom: 10px; 
        font-weight: 700;
    }

:root{ --wm-brand:#FCB017; --wm-ink:#111111; --wm-text:#3E3D3D; --wm-line:rgba(0,0,0,.10); --wm-max:1100px; }
.wm-chip{ display:inline-flex;align-items:center;gap:8px; padding:6px 14px;border:1px solid var(--wm-line);border-radius:999px; background:#fafafa;font:700 12px/1 Nunito,system-ui; text-transform:uppercase;letter-spacing:.5px;color: #ff8c00c7; }
.wm-h2{ font:700 clamp(22px,4vw,38px)/1.15 Nunito,system-ui; color:var(--wm-ink);margin:12px 0 0; }
.wm-sub{ font: 16px/1.6 Nunito,system-ui;color:rgba(62,61,61,.92); max-width:109ch; margin-bottom: 20px; border: none !important; }

/* --- QUOTE STYLE CSS --- */
.wm-motto {
    font-size: 18px; 
    font-style: italic; 
    color: #424a57; 
    border-left: 5px solid #FCB017; 
    background: #fff; 
    padding: 16px 24px;
    border-radius: 0 12px 12px 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.04);
    display: inline-block;
    line-height: 1.4;
    font-weight: 500;
    margin: 20px 0 20px; 
    text-align: left;
}

.wm-btn{ display:inline-flex;align-items:center;justify-content:center;gap:8px; padding:14px 28px;border-radius:999px;text-decoration:none; font:700 14px/1 Nunito,system-ui;border:2px solid var(--wm-brand); background:var(--wm-brand);color:#111; box-shadow:0 12px 26px rgba(0,0,0,.08); transition:background-color .18s,color .18s,transform .18s,border-color .18s,box-shadow .18s; }
.wm-btn:hover{ background:#fff; color:var(--wm-brand); border-color:var(--wm-brand); box-shadow:0 12px 26px rgba(252,176,23,.18); transform:translateY(-1px); }
.wm-lead{ 
    background:#fafafa; 
    padding:70px 16px 60px; 
}
.wm-lead__in{ max-width:var(--wm-max);margin:0 auto; }
.wm-form{ margin-top:12px;border:1px solid var(--wm-line);border-radius:16px; background:#fff;padding:20px;display:grid;gap:16px; }
.wm-row{display:grid;gap:12px}
.wm-row--2{grid-template-columns:1fr}
@media(min-width:880px){ .wm-row--2{grid-template-columns:1fr 1fr} }
.wm-field{display:grid;gap:6px}

/* --- Floating Label Styles --- */
.wm-field.floating {
  position: relative;
  margin-bottom: 0;
}
.wm-form input, .wm-form textarea{ 
    font:700 14px/1.3 'Nunito', sans-serif !important; 
    color:var(--wm-ink); 
    background:#fff; border:1px solid var(--wm-line); 
    border-radius:12px; padding:16px 16px 12px; 
    outline:none; 
    width: 100%; 
    box-sizing: border-box; 
    transition: all 0.2s ease;
}
.wm-form textarea{min-height:110px;resize:vertical}

/* Floating Label Logic */
.wm-field.floating label {
  position: absolute;
  top: 16px;
  left: 14px;
  font-size: 14px;
  font-family: 'Nunito', sans-serif !important; 
  color: #424a57;
  font-weight: 700;
  pointer-events: none;
  transition: all 0.2s ease-out;
  background-color: transparent;
  padding: 0 4px;
}

/* Input Focus or Value Present State */
.wm-field.floating input:focus ~ label,
.wm-field.floating input:not(:placeholder-shown) ~ label,
.wm-field.floating textarea:focus ~ label,
.wm-field.floating textarea:not(:placeholder-shown) ~ label {
  top: -9px;
  font-size: 12px;
  color: var(--wm-brand);
  background-color: #fff; 
  font-weight: 700;
  left: 12px;
}

.wm-form input:focus, .wm-form textarea:focus{ 
    border-color:var(--wm-brand); 
    box-shadow: 0 0 0 4px rgba(252, 176, 23, 0.25);
    background-color: #fff;
    transform: translateY(-1px);
}

.wm-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.wm-status{ display:none;color:#b91c1c; font:700 13px/1.4 Nunito,system-ui;margin:6px 0 2px; }
.wm-fine{ display:flex;flex-wrap:wrap;gap:10px;align-items:center; margin-top:8px;font:700 12px/1.4 Nunito,system-ui; color:rgba(62,61,61,.9); }
.wm-contact a,.wm-link{ color:#fcb017;text-decoration:none;border-bottom:1px dashed rgba(252,176,23,.6); }
.wm-contact a:hover,.wm-link:hover{border-bottom-color:#fcb017}
.wm-vh{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width: 480px) { .wm-actions{ justify-content: center; } }

/* --- MOBILE & TABLET OPTIMIZATION (Starts Below 900px) --- */
@media (max-width: 900px) {
    /* 1. GLOBAL CENTER ALIGNMENT */
    body, 
    section[class*="esp"], 
    .wm-lead, 
    .container, 
    .wrap, 
    .wm-lead__in {
        text-align: center !important;
    }

    /* 2. Consistent Padding */
    section[class*="esp"], 
    .wm-lead {
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
    .container, .wrap, .wm-lead__in {
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
    }

    /* 3. Headings Adjustment */
    h1 { font-size: 32px !important; }
    h2, h2[id*="title"] {
        font-size: 28px !important;
        line-height: 1.2 !important;
        margin-bottom: 15px !important;
    }

    /* 4. Center Quotes / Motto */
    .motto, .quote, .wm-sub, .sl-sub-text, .quote-small {
        font-size: 16px !important;
        line-height: 1.5 !important;
        /* Center block elements */
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
        /* Adjust borders if they look weird centered */
        display: inline-block !important;
    }
    /* Specific adjustment for Motto to ensure it doesn't span full width if not needed */
    .motto { display: inline-block !important; width: auto !important; }

    /* 5. Paragraphs & Lists */
    p, .lead, .desc, .answer p, li, .sl-carousel-item p {
        font-size: 15.5px !important;
        line-height: 1.6 !important;
    }

    /* 6. Smaller Chips */
    .eyebrow, .eyebrow-pill, .wm-chip, .rate-lbl, .note, .sub-tag, .unit {
        font-size: 12px !important;
    }

    /* 7. Stack Grids & Center Content */
    .grid, .card-grid, .phases-grid, .wm-row, .wm-row--2, .c-grid, .list-side, .process-grid, .kb-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
        align-items: center !important; /* Forces grid items to center */
    }
      
    /* 8. Make Cards Full Width but Centered Content */
    .card, .item, .phase-box, .res-card, .kb-card, .step-card {
        width: 100% !important;
        text-align: center !important;
        
        /* FORCE CENTER ALIGNMENT INSIDE BOXES */
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* 9. Center Icons inside cards */
    .icon { margin: 0 auto 10px !important; }
    
    /* 10. Center Flex Buttons (CTA Rows) */
    .cta-row, .wm-actions, .pill-grid {
        justify-content: center !important;
    }
    
    /* 11. FAQ Details Alignment */
    .esp.mg-faqs-wm.v2 summary {
        grid-template-columns: 1fr auto !important; 
        text-align: left !important; 
    }
    
    /* 12. Form Fields */
    .wm-form { text-align: left !important; } 

    /* Force Full Width on Inputs in Mobile */
    .wm-field, .wm-form input, .wm-form textarea {
        width: 100% !important;
    }

    /* Updated Quote Size for Mobile */
    .wm-motto {
        font-size: 14px !important; 
        margin-left: auto !important;
        margin-right: auto !important;
        display: inline-block !important; 
    }
}

/* Inline styles for tettenhall-security-hub.html */
.st-0fcc0ad3 { text-align:center !important; margin-bottom:30px !important; }
body { margin: 0;
    padding: 0;
    background-color: #fff;
    font-family: 'Nunito', sans-serif;
    -webkit-font-smoothing: antialiased;
    color: #424a57; }
:root { --brand: #FCB017;
    --ink: #111111;
    --text: #424a57;
    --line: rgba(0,0,0,.08);
    --shadow: 0 4px 12px rgba(0,0,0,0.04); }
.esp-wrap { max-width: 1100px; margin: 0 auto; padding-inline: 16px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 14px 28px; border-radius: 999px; text-decoration: none;
    font-weight: 700; font-size: 15px; line-height: 1;
    transition: all 0.25s ease; cursor: pointer;
    border: 2px solid var(--brand); background: var(--brand);
    color: #111; box-shadow: 0 4px 10px rgba(0,0,0,.08);
    font-family: 'Nunito', sans-serif; }
.btn:hover { background: #fff; color: var(--brand); transform: translateY(-2px); box-shadow: 0 8px 16px rgba(0,0,0,.12); }
.btn .material-symbols-outlined { font-size: 18px; font-weight: bold; }
.esp-header { background: #000;
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 2px 10px rgba(0,0,0,.15); }
.esp-header .container { max-width: 1100px;
    margin: 0 auto;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start; }
.esp-logo img { height: 52px; width: auto; display: block; }
.esp-hero { background: #fafafa; color: #424a57; padding: 120px 16px 60px; border-bottom: 1px solid rgba(0,0,0,0.05); }
.esp-hero-grid { display: grid; gap: 30px; grid-template-columns: 1fr; }
.esp-hero-grid { grid-template-columns: 1fr 1fr; 
        align-items: stretch; /* Isse dono boxes ki height perfectly equal ho jayegi */ }
.esp-hero-card { background: #fff; 
    border: 1px solid rgba(0,0,0,0.05); 
    border-radius: 16px; 
    box-shadow: 0 10px 25px rgba(0,0,0,0.04); 
    padding: 40px 30px;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%; }
.esp-hero .eyebrow-pill { display:inline-block; 
    align-self: flex-start; /* Fix: restricts the width to content size inside vertical flex container */
    padding:6px 14px; 
    border:2px solid rgba(0,0,0,0.05); 
    border-radius:999px;
    font-weight:700; font-size: 12px; letter-spacing:.05em; text-transform:uppercase;
    color: var(--brand); background:rgba(252, 176, 23, 0.05); margin:0 0 16px; }
.esp-hero .h1 { font-size: clamp(28px, 4vw, 42px); font-weight: 700; color: #111; margin: 0 0 14px; line-height: 1.15; }
.esp-hero .p { font-size: 16px; line-height: 1.6; color: #424a57; margin: 0 0 24px; }
.esp-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-media { border-radius: 16px; 
    overflow: hidden; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.05); 
    text-align: center; 
    font-size: 0; 
    height: 100%;
    display: flex; }
.hero-media img { display: block; 
    width: 100%; 
    height: 100%; 
    object-fit: cover; /* Isse image box ke size ke mutabiq auto-crop ho jayegi aur stretch nahi hogi */
    border-radius: 16px; }
from { opacity: 0; transform: translateY(20px); }
to { opacity: 1; transform: translateY(0); }
.fade-in { opacity: 0; animation: fadeInUp 0.9s ease forwards; }
.fade-in.delay { animation-delay: 0.3s; }
.esp-steps { background: #fff; padding: 70px 16px 60px; text-align: center; }
.esp-steps .h2 { font-size: clamp(28px, 4vw, 38px); font-weight: 700; color: #111; margin: 0 0 32px; line-height: 1.15; }
.steps-grid { display: grid; gap: 20px; grid-template-columns: 1fr; }
.steps-grid { grid-template-columns: repeat(3, 1fr); }
.step { background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow);
    padding: 30px 24px; opacity: 0; transform: translateY(20px);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    text-align: left; }
.step:hover { transform: translateY(-8px); border-color: var(--brand); box-shadow: 0 10px 25px rgba(0,0,0,0.06); }
.step.visible { animation: fadeInUp 0.9s ease forwards; }
.step .ico { font-size: 46px; color: var(--brand); line-height: 1; margin-bottom: 16px; display: inline-block; }
.step h3 { margin: 0 0 8px; color: #111; font-weight: 700; font-size: 18px; }
.step p { margin: 0; font-size: 14.5px; line-height: 1.6; color: #424a57; }
.esp-trust { background: #fafafa; padding: 70px 16px 60px; border-top: 1px solid rgba(0,0,0,0.03); }
.esp-trust h2 { margin: 0 0 8px; text-align: center; color: #111; font-size: clamp(28px, 4vw, 38px); font-weight: 700; line-height: 1.15; }
.esp-trust p { margin: 0 0 40px; text-align: center; color: #424a57; font-size: 16px; font-weight: 500; }
.esp-trust-grid { display: grid; gap: 20px; grid-template-columns: repeat(2, 1fr); }
.esp-trust-grid { grid-template-columns: repeat(4, 1fr); }
.esp-trust-card { background: #fff; border: 2px solid var(--brand); border-radius: 16px; padding: 20px;
    text-align: center; box-shadow: var(--shadow); transition: transform 0.25s, box-shadow 0.25s;
    text-decoration: none; display: flex; flex-direction: column; justify-content: space-between; align-items: center; min-height: 170px; }
.esp-trust-card:hover { transform: translateY(-4px); box-shadow: 0 12px 24px rgba(0,0,0,0.08); }
.esp-trust-logo { height: 96px; width: auto; object-fit: contain; margin-inline: auto; display: block; }
.esp-trust-note { margin: 12px 0 0; color: #111; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.5px; }
.esp-social { background: #fff; padding: 70px 16px 60px; border-top: 1px solid rgba(0,0,0,0.03); }
.esp-social-head { font-size: clamp(24px, 3.2vw, 32px); font-weight: 700; margin: 0 0 8px; color: #111; text-align: center; }
.esp-social-sub { font-size: 15px; margin: 0 0 32px; color: #424a57; text-align: center; font-weight: 500; }
.social-grid { display: grid; gap: 12px; grid-template-columns: 1fr; }
.social-grid { grid-template-columns: repeat(2, 1fr); }
.social-grid { grid-template-columns: repeat(5, 1fr); }
.social-btn { display: flex; align-items: center; justify-content: center; gap: 10px; border-radius: 999px;
    padding: 14px 16px; text-decoration: none; font-weight: 700; color: #fff; box-shadow: 0 4px 10px rgba(0,0,0,.08);
    transition: transform .2s ease, filter .2s ease; font-family: 'Nunito', sans-serif; font-size: 14px; }
.social-btn:hover { filter: brightness(1.08); transform: scale(1.02); }
.social-btn:active { transform: scale(0.98); }
.social-ico { font-family: "Material Symbols Outlined"; font-size: 20px; line-height: 1; }
.fb { background: #1877F2; }
.ig { background: linear-gradient(135deg, #F58529, #FEDA77, #DD2A7B, #8134AF, #515BD4); }
.yt { background: #FF0000; }
.tk { background: #000; }
.li { background: #0A66C2; }
body , section[class*="esp"] { text-align: center !important; }
.esp-hero-card { text-align: center; padding: 30px 20px; }
.esp-hero .eyebrow-pill { align-self: center; }
.esp-hero-actions { justify-content: center; }
.btn { width: 100%; box-sizing: border-box; }
.step { text-align: center !important; }

/* === FAQ ACCORDION ? FAQS.HTML REFERENCE === */
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) .list{display:grid;gap:12px}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) details{margin:0;border:1px solid #d9d9d9;border-radius:14px;background:#fff;overflow:hidden;transition:border-color .15s,box-shadow .15s,transform .15s}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) details[open],:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) details:hover{border-color:#fcb017;box-shadow:0 10px 22px rgba(0,0,0,.06);transform:translateY(-1px)}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;margin:0;padding:14px 16px;border:0;border-radius:0;outline:0;list-style:none;background:#fff;color:#111;font:700 16px/1.45 Nunito,system-ui,sans-serif;text-align:left;cursor:pointer;box-shadow:none;appearance:none}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) summary::-webkit-details-marker{display:none}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) .chev{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;margin:0;border:1px solid #d9d9d9;border-radius:999px;background:#fff;color:transparent;font-size:0;line-height:1}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) .chev::after{content:"";display:inline-block;width:8px;height:8px;margin-bottom:4px;border-right:2.5px solid #fcb017;border-bottom:2.5px solid #fcb017;transform:rotate(45deg);transition:transform .2s ease,margin .2s ease}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) details[open] .chev::after{margin-bottom:-2px;transform:rotate(-135deg)}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) .answer{max-height:0;opacity:0;overflow:hidden;padding:0 16px;border-top:1px solid transparent;background:#fff;color:#333;font-size:14.5px;line-height:1.7;transition:max-height .3s ease-out,opacity .3s ease-out,padding .3s ease}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) details[open] .answer{max-height:none;opacity:1;padding-bottom:16px;border-top-color:#d9d9d9}
:is(.esp.mg-faqs-wm.v2,.esp.mg-faqs-birmingham.v2) .answer p{margin:12px 0 14px;padding:0;color:#333}

/* === GLOBAL FOOTER ACCESSIBLE CONTRAST === */
.esp-global-footer,.esp-global-footer p,.esp-global-footer span,.esp-global-footer strong{color:#f3f4f6!important}
.esp-global-footer a{color:#fff!important;text-decoration-color:#fcb017!important}
.esp-global-footer a:hover,.esp-global-footer a:focus{color:#fcb017!important}


/* === GLOBAL HONEYPOT VISIBILITY FIX === */
input[name="company_site"] {
  position: fixed !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}