:root{
      --esp-brand:#FCB017;
      --esp-ink:#111111;
      --esp-text:#222222;
      --esp-line:rgba(0,0,0,.08);
      --esp-dark:#000000;
      --esp-contact-radius:18px;
    }

    body{
      margin:0;
      font-family:Nunito,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
      background:#ffffff;
      color:#111827;
    }

 
    /* ========================= HERO SECTION ========================= */
    .esp-locations-hero{
      --brand:#FCB017;
      --ink:#ffffff;
      --overlay: rgba(0,0,0,.64);
      --minh: 30vh;
      position:relative;
      isolation:isolate;
      min-height:var(--minh);
      display:grid;
      place-items:center;
      color:var(--ink);
      background:
        url("https://eaglesecurityprotection.co.uk/wp-content/uploads/2025/12/Service-banner.webp")
        center / cover no-repeat #222;
      padding-block: clamp(80px, 10vw, 120px);
    }

    .esp-locations-hero .esp-loc__overlay{
      position:absolute;
      inset:0;
      background:var(--overlay);
      z-index:0;
    }

    .esp-locations-hero .esp-loc__in{
      position:relative;
      z-index:1;
      width:min(1200px, calc(100% - 48px));
      margin-inline:auto;
      text-align:left;
    }

    .esp-locations-hero .esp-loc__bar{
      display:inline-block;
      width:88px; height:8px;
      background:var(--brand);
      border-radius:6px;
      margin-bottom:14px;
    }

    .esp-locations-hero .esp-loc__title{
      margin:0 0 8px;
      font:700 clamp(32px,6vw,64px)/1.05 Nunito,system-ui,sans-serif;
      color:#fff;
    }

    @media (max-width: 768px) {
      .esp-locations-hero {
        --minh: 50vh;
        padding-block: 50px;
      }
    }

    @media (min-height:700px){
      .esp-locations-hero{ --minh: 30vh; }
    }

    /* ========================= ASSESSMENT TOOL STYLES ========================= */
    .esp-assessment-wrapper {
        background: #fafafa; 
        padding: 50px 20px;
        line-height: 1.6;
    }

    .esp-assessment-wrapper * { 
        box-sizing: border-box; 
    }

    .esp-assessment-wrapper {
        --esp-yellow: #fcb017;
        --esp-black: #111;
        --esp-dark-grey: #222;
        --esp-light-grey: #f4f4f4;
        --esp-white: #fff;
        --shadow-soft: 0 10px 30px rgba(0,0,0,0.08);
        --shadow-hover: 0 15px 35px rgba(0,0,0,0.12);
        --radius-card: 16px;
        --radius-btn: 50px;
    }

    .assessment-container { 
        background: var(--esp-white); 
        border-radius: 24px; 
        max-width: 960px; 
        width: 100%;
        margin: 0 auto; 
        box-shadow: var(--shadow-soft);
        position: relative;
        min-height: 600px; 
        overflow: hidden; 
        border-top: 8px solid var(--esp-yellow);
        display: flex;
        flex-direction: column;
    }

    .app-header {
        text-align: center;
        padding: 30px 20px 10px 20px;
    }
    .app-header h2 {
        margin: 0;
        color: var(--esp-black);
        font-weight: 700;
        font-size: 2rem;
        text-transform: uppercase;
        letter-spacing: -0.5px;
    }
    .app-header .subtitle {
        color: #666;
        font-size: 1.1rem;
        margin-top: 5px;
        font-weight: 600;
    }

    #quiz-intro {
        padding: 40px 20px;
        text-align: center;
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .radar-shield {
        width: 100px;
        height: 100px;
        background: var(--esp-yellow);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 30px;
        position: relative;
        color: #000;
        font-size: 40px;
        box-shadow: 0 0 0 0 rgba(252, 176, 23, 0.7);
        animation: pulse-yellow 2s infinite;
    }
    
    @keyframes pulse-yellow {
        0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(252, 176, 23, 0.7); }
        70% { transform: scale(1); box-shadow: 0 0 0 20px rgba(252, 176, 23, 0); }
        100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(252, 176, 23, 0); }
    }

    .cta-button, .rec-btn {
        background: #fcb017; 
        color: #000;
        padding: 14px 30px;
        border: 2px solid #fcb017;
        border-radius: 9999px; 
        font-size: 18px;
        font-weight: 700; /* UPDATED to 700 */
        cursor: pointer;
        display: inline-block;
        text-decoration: none;
        text-align: center;
        font-family: 'Nunito', sans-serif !important;
        transition: all 0.25s ease;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    }

    .cta-button:hover, .rec-btn:hover {
        background: #ffffff; 
        color: #fcb017; 
        border-color: #fcb017; 
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    }

    .cta-button::before, .rec-btn::before {
        content: '⚡';
        margin-right: 8px; 
        color: #000; 
        transition: color 0.2s ease;
        font-size: 1.1em;
    }

    .cta-button:hover::before, .rec-btn:hover::before {
        color: #F87A7A; 
    }
    
    .back-btn {
        background: transparent;
        border: none;
        color: #888;
        font-weight: 700;
        cursor: pointer;
        padding: 10px 20px;
        font-size: 14px;
        transition: color 0.2s;
    }
    .back-btn:hover { color: var(--esp-black); }

    .quiz-wrapper {
        padding: 20px 40px 40px 40px;
        width: 100%;
    }

    .progress-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 10px;
        font-size: 14px;
        font-weight: 700;
        color: #888;
    }
    .progress-track {
        width: 100%;
        height: 8px;
        background: #eee;
        border-radius: 4px;
        overflow: hidden;
        margin-bottom: 30px;
    }
    .progress-fill {
        height: 100%;
        background: linear-gradient(90deg, var(--esp-yellow), #f5d76e);
        width: 20%;
        transition: width 0.4s ease;
    }

    .quiz-step { display: none; animation: fadeInRight 0.4s ease-out; }
    .quiz-step.active { display: block; }

    .question-block h3 {
        font-size: 1.6rem;
        font-weight: 700; /* UPDATED to 700 */
        color: var(--esp-black);
        margin-bottom: 25px;
        text-align: center;
    }

    .answer-options {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }
    .answer-options.three-options label:last-child {
        grid-column: 1 / -1; 
    }

    .answer-card {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 25px 20px;
        background: #fff;
        border: 2px solid #eef0f2;
        border-radius: var(--radius-card);
        cursor: pointer;
        transition: all 0.2s ease;
    }
    
    .answer-card .card-icon {
        font-size: 2.5rem;
        margin-bottom: 10px;
        transition: transform 0.2s;
    }
    
    .answer-card .card-text {
        font-weight: 700;
        color: #444;
        font-size: 1.1rem;
    }
    
    .answer-card:hover {
        border-color: #ddd;
        box-shadow: 0 8px 20px rgba(0,0,0,0.05);
        transform: translateY(-3px);
    }
    .answer-card:hover .card-icon { transform: scale(1.1); }

    .answer-card.selected {
        border-color: var(--esp-yellow);
        background: #fffcf5;
        box-shadow: 0 0 0 1px var(--esp-yellow), 0 10px 25px rgba(252, 176, 23, 0.15);
        transform: translateY(-3px);
    }
    .answer-card.selected .card-text { color: #000; }
    .answer-card input { display: none; }

    /* === TRUST STRIP IN ASSESSMENT === */
    .esp-trust-assess {
        margin-top: 50px; 
        border-top: 1px solid #eee;
        padding-top: 40px; 
        padding-bottom: 20px;
        width: 100%;
        text-align: center;
    }
    
    .trust-heading {
        margin: 0 0 30px 0; 
        color: #333; 
        font-size: 1.5rem; 
        text-transform: uppercase;
        letter-spacing: 1px;
        font-weight: 700; 
    }

    .esp-trust-assess-grid {
        display: grid;
        gap: 15px;
        grid-template-columns: repeat(4, 1fr); 
    }
    
    .esp-trust-assess-card {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 140px; 
        padding: 15px;
        border: 2px solid var(--esp-yellow); 
        border-radius: 16px;
        background: #fff;
        transition: all .25s;
        box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    }
    
    .esp-trust-assess-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 8px 25px rgba(0,0,0,0.1);
        border-color: #e09b10;
    }
    
    .esp-trust-assess-logo {
        max-width: 95%;
        max-height: 90px; 
        object-fit: contain;
    }

    /* === LEAD FORM === */
    #lead-capture-container { 
        display: none; 
        padding: 20px 40px 40px; 
        width: 100%;
        max-width: 600px; 
        margin: 0 auto;
    }
    .form-group { margin-bottom: 20px; }
    .form-group label {
        display: block;
        font-weight: 700;
        margin-bottom: 8px;
        color: #333;
    }
    .form-group input {
        width: 100%;
        padding: 14px;
        border: 2px solid #e1e1e1;
        border-radius: 8px;
        font-size: 16px;
        transition: border-color 0.2s;
    }
    .form-group input:focus {
        outline: none;
        border-color: var(--esp-yellow);
    }
    .consent-group {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        margin-top: 20px;
        font-size: 0.95rem;
        color: #555;
    }
    .consent-group input { margin-top: 5px; width: auto; }

    /* === SCANNER === */
    #loading-container {
        display: none;
        text-align: center;
        padding: 60px 20px;
    }
    .scanner-line {
        width: 200px;
        height: 4px;
        background: var(--esp-yellow);
        margin: 0 auto 20px;
        border-radius: 2px;
        box-shadow: 0 0 10px var(--esp-yellow);
        animation: scan 1.5s ease-in-out infinite;
    }
    @keyframes scan {
        0% { width: 10px; opacity: 0.5; }
        50% { width: 200px; opacity: 1; }
        100% { width: 10px; opacity: 0.5; }
    }

    /* === NEW RESULTS LAYOUT === */
    #results-container { 
        display: none; 
        padding: 0 30px 50px; 
        width: 100%;
    }

    /* Top Row Grid */
    .results-top-row {
        display: grid;
        grid-template-columns: 35% 63%; /* Left Score, Right Vectors */
        gap: 2%;
        margin-bottom: 40px;
        align-items: stretch;
    }

    /* 1. Score Card (Left) */
    .score-card {
        background: #fff;
        border: 1px solid #eee;
        border-radius: var(--radius-card);
        box-shadow: var(--shadow-soft);
        padding: 25px;
        display: flex;
        flex-direction: column; 
        align-items: center;
        justify-content: center;
        position: relative;
        overflow: hidden;
    }
    /* Accent Bar on Right */
    .score-card::after {
        content: '';
        position: absolute;
        top: 15%; bottom: 15%; right: 0;
        width: 6px;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        background: var(--esp-yellow);
    }

    .gauge-wrapper {
        position: relative;
        width: 160px;
        height: 80px; 
        overflow: hidden;
        margin-bottom: 15px;
    }
    .gauge-bg {
        width: 160px;
        height: 160px;
        background: #eee; /* Light grey for empty part */
        border-radius: 50%;
    }
    .gauge-fill {
        position: absolute;
        top: 0; left: 0;
        width: 160px;
        height: 160px;
        background: conic-gradient(var(--gauge-color) var(--percentage), transparent 0);
        border-radius: 50%;
        transform: rotate(-90deg); 
        transition: --percentage 1s ease; 
    }
    .gauge-center {
        position: absolute;
        top: 20px; left: 20px;
        width: 120px;
        height: 120px;
        background: #fff; /* White center */
        border-radius: 50%;
        display: flex;
        align-items: flex-start; 
        justify-content: center;
        padding-top: 15px; 
        z-index: 10; 
    }
    .score-display {
        font-size: 2.5rem;
        font-weight: 700;
        color: #111;
        line-height: 1;
    }
    .score-label-group { text-align: center; }
    .score-label-title { font-size: 0.9rem; font-weight: 700; color: #888; text-transform: uppercase; margin-bottom: 5px; }
    .risk-badge {
        display: inline-block;
        padding: 6px 14px;
        border-radius: 6px;
        font-weight: 700; /* UPDATED to 700 */
        font-size: 1rem;
        text-transform: uppercase;
        border: 2px solid transparent;
    }
    .bg-low { border-color: #28a745; color: #28a745; background: #ebf9ed; }
    .bg-medium { border-color: #fd7e14; color: #fd7e14; background: #fff4e5; }
    .bg-high { border-color: #dc3545; color: #dc3545; background: #fff5f5; }

    /* 2. Vectors Card (Right) */
    .vectors-card {
        background: #fff;
        border: 1px solid #eee;
        border-radius: var(--radius-card);
        box-shadow: var(--shadow-soft);
        padding: 30px;
    }
    .vectors-title {
        font-size: 1.2rem;
        font-weight: 700; /* UPDATED to 700 */
        color: #111;
        margin: 0 0 20px 0;
        display: flex;
        align-items: center;
    }
    /* Bullet List Style */
    .vectors-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .vectors-list li {
        display: flex;
        align-items: flex-start;
        margin-bottom: 12px;
        font-size: 1rem;
        color: #555;
    }
    .vectors-list li::before {
        content: '•';
        color: var(--esp-yellow);
        font-size: 1.5rem;
        line-height: 1rem;
        margin-right: 10px;
    }
    .vector-key { font-weight: 700; color: #333; margin-right: 5px; }

    /* 3. Strategy Section */
    .strategy-heading {
        font-size: 1.6rem;
        font-weight: 700;
        color: #111;
        margin-bottom: 20px;
    }

    .rec-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 25px;
        margin-bottom: 40px;
    }
    .rec-card {
        background: #fff;
        border: 1px solid #eee;
        border-radius: var(--radius-card);
        padding: 30px;
        border-top: 6px solid var(--esp-yellow); 
        box-shadow: var(--shadow-soft);
        transition: transform 0.2s;
        display: flex;
        flex-direction: column;
        height: 100%;
    }
    .rec-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-hover); }
    
    .rec-label {
        font-size: 0.8rem;
        font-weight: 700; /* UPDATED to 700 */
        color: var(--esp-yellow); 
        text-transform: uppercase;
        margin-bottom: 15px;
        letter-spacing: 1px;
    }
    .rec-title { 
        font-size: 1.6rem; 
        font-weight: 700; 
        margin: 0 0 15px; 
        color: #111; 
        line-height: 1.2;
    }
    .rec-desc { 
        color: #666; 
        flex-grow: 1; 
        margin-bottom: 30px; 
        font-size: 1.05rem;
    }
    
    .rec-btn {
        width: 100%; 
        font-size: 16px;
    }

    /* Responsive */
    @media (max-width: 768px) {
        .app-header h2 { font-size: 1.5rem; }
        .answer-options { grid-template-columns: 1fr; }
        
        /* Stack the results */
        .results-top-row { grid-template-columns: 1fr; gap: 20px; }
        .rec-grid { grid-template-columns: 1fr; }
        
        .score-card::after { display: none; } 
        .esp-trust-assess-grid { grid-template-columns: repeat(2, 1fr); }
    }


    /* ============= LOCATION / MAP SECTION ============= */
    .esp-location{
      width:100%;
      margin:0;
      padding:90px 0 ;
      background:#fffff;
    }
    @media (max-width: 480px) {
    .esp-location{
    padding: 40px 0;
    }
    }

    .esp-location__inner{
      max-width:1200px;
      margin:0 auto;
      padding:0 16px;
    }

    .esp-location__header{
      text-align:center;
      margin-bottom:22px;
      color:#111827;
    }

    .esp-location__header h2{
      margin:0 0 6px;
      font-size:clamp(24px,3vw,28px);
      font-weight:700;
    }

    .esp-location__map-frame{
      width:100%;
      height:420px;
      border-radius:18px;
      overflow:hidden;
      box-shadow:0 16px 36px rgba(15,23,42,0.18);
      background:#fafafa;
    }

    .esp-location__map-frame iframe{
      width:100%;
      height:100%;
      border:0;
    }

/* Inline styles for site-assesment.html */
.st-3301ea9e { margin-bottom: 10px !important; }
.st-f1e5559f { max-width: 500px !important; color: #666 !important; margin-bottom: 30px !important; }
.st-ada0eea4 { margin-top:20px !important; text-align:center !important; }
.st-e1341b49 { color:red !important; display:none !important; margin-top:10px !important; }
.st-a104aae7 { text-align:center !important; color:#666 !important; margin-bottom:30px !important; }
.st-506afd24 { text-align:center !important; margin-top:30px !important; }
.st-48d21665 { color:#999 !important; }
.st-5ab202b4 { text-align:center !important; margin-top:40px !important; }
.st-b804283a { color:#666 !important; }

/* === 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;
}
