.module-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:16px;
margin-top:20px;

}

.module-card{

background:white;
border:1px solid #e5e5e5;
border-radius:10px;
padding:18px;

}

.module-card a{

display:inline-block;
margin-top:10px;

background:#111;
color:white;

padding:8px 12px;
border-radius:6px;
text-decoration:none;

}

/* ------------------------------
INSPECTION DASHBOARD
------------------------------ */

#categories{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:12px;
margin-top:15px;
}

.category-card{
background:white;
border:1px solid #e5e5e5;
border-radius:10px;
padding:16px;
cursor:pointer;
transition:all .2s ease;
}

.category-card:hover{
border-color:#000;
transform:translateY(-2px);
box-shadow:0 4px 12px rgba(0,0,0,.05);
}
.category-card.completed {
  border-left: 4px solid #2e7d32;
  background: #f6fff7;
}
/* ------------------------------
STATUS COLORS
------------------------------ */

.status-safe{
color:#2e7d32;
font-weight:600;
}

.status-review{
color:#f9a825;
font-weight:600;
}

.status-risk{
color:#c62828;
font-weight:600;
}

.status-pending{
color:#666;
}

/* ------------------------------
RISK METER
------------------------------ */

.deal-meter{
margin:14px 0 18px 0;
padding:14px;
border:1px solid #eee;
border-radius:10px;
background:#fafafa;
}

.meter-bar{
width:100%;
height:12px;
background:#eee;
border-radius:6px;
overflow:hidden;
}

.meter-fill{
height:100%;
transition:width .4s ease;
}

.meter-low{
background:#4caf50;
}

.meter-mid{
background:#ffb300;
}

.meter-high{
background:#e53935;
}

/* ------------------------------
APPRAISAL HERO
------------------------------ */

.hero{
max-width:900px;
margin:0 auto 24px auto;
text-align:center;
}

.hero-title{
font-size:28px;
font-weight:700;
margin-bottom:6px;
}

.hero-sub{
font-size:12px;
text-transform:uppercase;
letter-spacing:1.5px;
color:#64748b;
margin-bottom:10px;
}

.hero-desc{
font-size:14px;
color:#475569;
max-width:540px;
margin:0 auto;
line-height:1.5;
}

.hero-note{
margin-top:10px;
font-size:12px;
color:#64748b;
}

/* ------------------------------
WORKFLOW
------------------------------ */

.workflow{
max-width:900px;
margin:0 auto 24px auto;
display:flex;
align-items:center;
justify-content:center;
gap:12px;
}

.workflow-step{
display:flex;
flex-direction:column;
align-items:center;
font-size:11px;
color:#64748b;
}

.step-number{
width:28px;
height:28px;
border-radius:50%;
border:1px solid #d1d5db;
display:flex;
align-items:center;
justify-content:center;
font-weight:600;
margin-bottom:6px;
background:white;
}

.workflow-step.active .step-number{
background:#111827;
color:white;
border:none;
}

.workflow-divider{
width:60px;
height:1px;
background:#e5e7eb;
}

/* ------------------------------
ENGINE STATUS
------------------------------ */

.engine-status{
max-width:900px;
margin:0 auto 14px auto;
padding:14px 18px;
background:#0f172a;
color:white;
border-radius:10px;
display:flex;
flex-direction:column;
gap:4px;
font-size:13px;
position:relative;
}

.engine-dot{
width:8px;
height:8px;
background:#22c55e;
border-radius:50%;
box-shadow:0 0 8px #22c55e;
position:absolute;
left:18px;
top:18px;
}

.engine-text{
font-weight:600;
padding-left:14px;
}

.engine-sub{
opacity:.7;
font-size:12px;
padding-left:14px;
}

/* ------------------------------
RESULT ALERTS
------------------------------ */

.alarm{
padding:22px;
border-radius:12px;
font-weight:700;
font-size:18px;
text-align:center;
}

.alarm-fail{
background:#fee2e2;
color:#991b1b;
}

.alarm-pass{
background:#dcfce7;
color:#166534;
}

.alarm-subtext{
margin-top:12px;
font-size:14px;
text-align:center;
}

.alarm-subtext-fail{
color:#991b1b;
}

/* ------------------------------
BADGES
------------------------------ */

.badge{
display:inline-block;
padding:6px 12px;
border-radius:999px;
font-size:12px;
font-weight:600;
}

.badge.stable{
background:#dcfce7;
color:#166534;
}

.badge.exposed{
background:#fef3c7;
color:#92400e;
}

.badge.fragile{
background:#fee2e2;
color:#991b1b;
}

/* ------------------------------
MISC
------------------------------ */

.divider{
border:none;
border-top:1px solid #e5e7eb;
margin:28px 0;
}

.credibility-strip{
max-width:900px;
margin:8px auto 22px auto;
text-align:center;
font-size:12px;
color:#64748b;
}

.risk-warning{
margin-top:6px;
font-size:12px;
color:#475569;
text-align:center;
}


.workflow-step{
transition:all .25s ease;
}

.workflow-step.active .step-number{
transform:scale(1.05);
}


/* -----------------------------
DEAL SCORE
----------------------------- */

.deal-score{
display:flex;
align-items:center;
gap:14px;
margin-bottom:12px;
}

.score-number{
font-size:36px;
font-weight:700;
}

.score-rating{
font-size:16px;
font-weight:600;
color:#555;
}

/* -----------------------------
RISK METER
----------------------------- */

.score-meter{
margin-top:10px;
}

.meter-bar{
width:100%;
height:12px;
background:#eee;
border-radius:6px;
overflow:hidden;
}

.meter-fill{
height:100%;
transition:width .4s ease;
}

/* COLORS */

.meter-strong{
background:#4caf50;
}

.meter-moderate{
background:#ffb300;
}

.meter-fragile{
background:#ff7043;
}

.meter-critical{
background:#e53935;
}

.meter-scale{
display:flex;
justify-content:space-between;
font-size:11px;
color:#777;
margin-top:6px;
}

/* -----------------------------
CAPITAL EXPOSURE
----------------------------- */

.capital-grid{
margin-bottom:10px;
}

.capital-meter{
margin-top:10px;
}

.meter-capital{
background:#1565c0;
}

.listing-card{
  padding:18px;
}

.listing-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
}

.listing-address{
  font-size:20px;
  font-weight:600;
}

.listing-price{
  font-size:22px;
  font-weight:700;
  color:#1a7f37;
}

.listing-meta{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  color:#777;
  font-size:13px;
}

.demo-banner{
  border-left:4px solid #4CAF50;
}

.workspace-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:20px;
}

@media(max-width:900px){
  .workspace-grid{
    grid-template-columns:1fr;
  }
}

.safe-offer-box{
  background:#111;
  color:#fff;
  padding:20px;
  border-radius:8px;
  text-align:center;
  margin-bottom:12px;
}

.safe-offer-price{
  font-size:36px;
  font-weight:700;
  color:#4CAF50;
}

.safe-offer-label{
  font-size:13px;
  opacity:0.8;
  margin-top:4px;
}

.pulse-highlight {
  animation: pulseCard 1.2s ease;
  border-left:4px solid #ff9800;
}

@keyframes pulseCard {

  0% { transform:scale(1); }

  40% { transform:scale(1.02); }

  100% { transform:scale(1); }

}

/* =========================================
   DEAL WORKSPACE — FRAGILITY CARD
   ========================================= */

.fragility-card {
  background: #ffffff;
  color: #111;
  border-left: 6px solid #ddd;
  border-radius: 10px;
  padding: 16px;
  transition: all 0.2s ease;
}

.fragility-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.fragility-score {
  font-size: 56px;
  font-weight: 700;
  line-height: 1;
  margin-top: 6px;
}

.fragility-label {
  font-size: 20px;
  font-weight: 600;
  margin-top: 6px;
}

.fragility-sub {
  font-size: 13px;
  color: #666;
  margin-top: 6px;
}

/* =========================================
   STATE COLORS (CONTROLLED SYSTEM)
   ========================================= */

.fragility-card.strong {
  border-left-color: #4CAF50;
}

.fragility-card.moderate {
  border-left-color: #FFC107;
}

.fragility-card.fragile {
  border-left-color: #FF9800;
  background: #fff8f2;
}

.fragility-card.critical {
  border-left-color: #F44336;
  background: #fff5f5;
}

/* =========================================
   BADGE
   ========================================= */

.fragility-badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
}

.fragility-badge.strong {
  background: #4CAF50;
}

.fragility-badge.moderate {
  background: #FFC107;
  color: #000;
}

.fragility-badge.fragile {
  background: #FF9800;
}

.fragility-badge.critical {
  background: #F44336;
}

/* =========================================
   HIGH RISK ANIMATION
   ========================================= */

.fragility-card.pulse-highlight {
  animation: pulse 1.2s ease-in-out infinite alternate;
}

@keyframes pulse {
  from { box-shadow: 0 0 0 rgba(244,67,54,0.1); }
  to { box-shadow: 0 0 18px rgba(244,67,54,0.4); }
}
/* =========================================
   LOCKED STATE (PARTIAL REVEAL SYSTEM)
   ========================================= */

/* container */
.locked-wrapper {
  position: relative;
}

/* main content (VISIBLE, NOT BLURRED) */
.locked-content {
  position: relative;
  z-index: 1;
  opacity: 1;
}

/* DO NOT blur everything — only optional targeting */
.locked-content .coverage-row {
  opacity: 0.75; /* subtle de-emphasis instead of blur */
}

/* key number stays sharp + prominent */
.locked-content .safe-offer-price {
  filter: none;
  opacity: 1;
  font-size: 28px;
  font-weight: 600;
}

/* =========================================
   LIGHT DIM LAYER (CRITICAL FIX)
   ========================================= */

.locked-fade {
  position: absolute;
  inset: 0;

  background: linear-gradient(
    rgba(255,255,255,0.15),
    rgba(255,255,255,0.25)
  );

  z-index: 2;
  pointer-events: none;
}

/* =========================================
   CTA OVERLAY (INTERACTION LAYER)
   ========================================= */

.locked-overlay {
  position: absolute;
  inset: 0;
  max-width: 520px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  text-align: center;
  padding: 28px 24px;


  z-index: 3;

background: radial-gradient(
  circle at center,
  rgba(255,255,255,0.65) 0%,
  rgba(255,255,255,0.45) 40%,
  rgba(255,255,255,0.1) 100%
);
}

/* button polish */
.locked-overlay .primary-btn {
  margin-top: 14px;
  cursor: pointer;
}

.locked-overlay .primary-btn:hover {
  transform: scale(1.04);
  transition: transform 0.15s ease;
}

.locked-card-inner {
  max-width: 420px;
  background: rgba(255,255,255,0.85);
  padding: 24px 22px;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

/* =========================================
   LOCK MOMENT (CONVERSION LAYER)
   ========================================= */

.locked-card-inner {
  max-width: 420px;
  background: rgba(255,255,255,0.9);
  padding: 26px 22px;
  border-radius: 14px;

  box-shadow:
    0 10px 30px rgba(0,0,0,0.08),
    0 2px 6px rgba(0,0,0,0.05);

  backdrop-filter: blur(6px);
}

/* 🔥 HEADLINE = PAIN */
.lock-headline {
  font-size: 22px;
  font-weight: 600;
  color: #7a0000;
  margin-bottom: 10px;
  line-height: 1.3;
}

/* supporting text */
.lock-sub {
  font-size: 14px;
  color: #333;
  margin-bottom: 16px;
}

/* divider */
.lock-divider {
  height: 1px;
  background: #e5e7eb;
  margin: 16px 0;
}

/* bullets */
.locked-bullets {
  font-size: 14px;
  line-height: 1.6;
  color: #111;
  margin-bottom: 18px;
}

/* 🔥 CTA = DECISION */
.lock-cta {
  font-size: 16px;
  padding: 12px 18px;
  font-weight: 600;

  background: #111;
  color: #fff;
  border-radius: 8px;

  transition: all 0.2s ease;
}

.lock-cta:hover {
  transform: scale(1.05);
  background: #000;
}

/* footnote = price framing */
.lock-footnote {
  font-size: 13px;
  color: #555;
  margin-top: 12px;
}

.lock-highlight{
  font-size:13px;
  color:#c62828;
  font-weight:600;
  margin-bottom:10px;
}
/* =========================================
   OVERLAY TUNING (IMPORTANT)
   ========================================= */

.locked-overlay {
  backdrop-filter: blur(2px);
}

/* keep background visible */
.locked-fade {
  background: linear-gradient(
    rgba(255,255,255,0.12),
    rgba(255,255,255,0.22)
  );
}
/* =========================================
   REMOVE LEGACY BLUR SYSTEM (IMPORTANT)
   ========================================= */

.locked-blur {
  display: none !important; /* kill it completely */
}

/* =========================================
   LOCK PREVIEW (OPTIONAL)
   ========================================= */

.locked-preview {
  margin-top: 16px;
}

.blur-line {
  height: 14px;
  margin: 10px 0;
  border-radius: 4px;
  background: linear-gradient(90deg, #333, #555, #333);
  opacity: 0.4;
}

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

.report-section {
  opacity: 0;
  transform: translateY(10px);
  transition: all 0.35s ease;
  will-change: transform, opacity;
}

.report-section.visible {
  opacity: 1;
  transform: translateY(0);
}

/* subtle emphasis */
.report-section.visible .safe-offer-price {
  transform: scale(1.05);
}