/* =========================================================
   Property Impact Calculator: styles carried over unchanged from the
   current site (assets/css/main.css), for the green #4d6935 background.
   ========================================================= */

/* Base buttons from main.css, limited to the calculator section.
   :where() keeps them as weak as on the current site, so the calculator rules below still win. */
:where(.calc-block) input[type="button"],
:where(.calc-block) button,
:where(.calc-block) .button {
	-webkit-appearance: none;
	appearance: none;
	transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	background: none;
	border: solid 1px;
	border-radius: 0;
	color: inherit;
	cursor: pointer;
	display: inline-block;
	font-size: 0.8em;
	font-weight: 900;
	letter-spacing: 2px;
	min-width: 18em;
	padding: 0 0.75em;
	line-height: 3.75em;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}
:where(.calc-block) button:hover,
:where(.calc-block) .button:hover { background: rgba(255, 255, 255, 0.15); border-color: inherit; }
:where(.calc-block) button.primary,
:where(.calc-block) .button.primary { background: #4d6935; border-color: #4d6935; color: #fff !important; }
:where(.calc-block) button.primary:hover,
:where(.calc-block) .button.primary:hover { background: #3b4d27 !important; border-color: #3b4d27 !important; }
:where(.calc-block) button.small,
:where(.calc-block) .button.small { font-size: 0.7em; min-width: 14em; padding: 0.5em 0; }
@media (max-width: 736px) {
	:where(.calc-block) button,
	:where(.calc-block) .button { max-width: 20em; width: 100%; }
}

/* Green section the calculator sits on (was .wrapper.style2) */
.calc-block {
	background-color: #4d6935;
	color: #fff;
}

   COMPLETE CALCULATOR STYLES FOR AMASS
   Optimized for #4D6935 dark olive green background
   ================================================ */

/* Main Calculator Wrapper */
.calculator-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  color: #fff;
}

.calculator-wrapper h1,
.calculator-wrapper h2,
.calculator-wrapper h3,
.calculator-wrapper h4 {
  color: #fff !important;
  text-transform: none !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
}

.calculator-wrapper h2 {
  font-size: 1.5em;
  margin: 1.5em 0 1em 0;
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  padding-bottom: 0.5em;
}

.calculator-wrapper h3 {
  font-size: 1.2em;
  margin: 1.25em 0 0.75em 0;
}

.calculator-wrapper p {
  margin-bottom: 1em;
  line-height: 1.6;
  color: #E0E0E0;
}

.calculator-wrapper strong {
  font-weight: 600;
  color: #fff;
}

.calculator-wrapper ul {
  list-style: disc;
  padding-left: 2em;
  margin-bottom: 1em;
}

.calculator-wrapper ul li {
  margin-bottom: 0.5em;
  padding-left: 0.5em;
  color: #E0E0E0;
}

.calculator-wrapper a {
  color: #64b5f6;
  border-bottom: dotted 1px rgba(100, 181, 246, 0.5);
  text-decoration: none;
}

.calculator-wrapper a:hover {
  border-bottom-color: transparent;
  color: #90caf9;
}

.calc-alert-warning {
  /* background: rgba(255, 183, 77, 0.2); */
  border-left-color: #FFB74D;
}

.calc-alert-danger {
  /* background: rgba(244, 67, 54, 0.2); */
  border-left-color: red;
}

.calc-alert-success {
  background: rgba(129, 199, 132, 0.2);
  border-left-color: #81C784;
}

.calc-alert-title {
  font-weight: bold;
  font-size: 1.1em;
  margin: 0 0 0.75em 0 !important;
  color: #fff;
}

.calc-alert p {
  margin: 0.75em 0;
  color: #E0E0E0;
}

.calc-alert p:last-child {
  margin-bottom: 0;
}

.calc-alert-footnote {
  font-size: 0.85em;
  opacity: 0.9;
  margin-top: 1em !important;
  font-style: italic;
  color: rgba(255, 255, 255, 0.85);
}

/* Quote Box */
.calc-quote-box {
  margin-top: 1.25em;
  padding: 1.25em;
  background: rgba(255, 255, 255, 0.12);
  border-left: 4px solid rgba(255, 255, 255, 0.5);
  border-radius: 4px;
}

.calc-quote-title {
  font-weight: bold;
  margin: 0 0 0.75em 0 !important;
  color: #fff;
}

.calc-quote-box blockquote {
  border-left: none;
  padding: 0;
  margin: 0;
  font-style: italic;
}

.calc-quote-box blockquote p {
  margin: 0 0 0.5em 0 !important;
  color: #E0E0E0;
}

.calc-quote-box blockquote p:last-of-type {
  margin-bottom: 0.75em !important;
}

/* Landmarks Section */
.calc-landmarks {
  margin: 1.5em 0;
  padding: 1em 1.25em;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.calc-landmarks p {
  margin: 0 0 0.75em 0 !important;
  font-weight: 600;
  color: #fff;
  font-size: 0.9em;
}

.calc-landmarks .buttons {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4em;
}

.calc-landmarks .buttons li {
  margin: 0;
  padding: 0;
  display: inline-block;
}

.calc-landmarks .buttons {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4em;
  justify-content: center; /* Center horizontally */
}


.calc-landmarks .button:hover {
  background: rgba(255, 255, 255, 0.22) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
}

/* Form Styles */
/* Form Styles - Tighter & More Compact */
.calc-form {
  margin: 1.5em 0;
  background: rgba(255, 255, 255, 0.08);
  padding: 1.25em;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.calc-form-group {
  margin-bottom: 0.85em;
}

.calc-form-group:last-child {
  margin-bottom: 0;
}

/* Space before button */
.calc-form > button {
  margin-top: 1.25em !important;
}

.calc-form-group > label {
  display: block;
  margin-bottom: 0.5em;
  font-weight: 600;
  color: #fff;
  font-size: 0.9em;
}

.calc-form-group input[type="text"],
.calc-form-group input[type="number"] {
  background: rgba(255, 255, 255, 0.12);
  border: 2px solid rgba(255, 255, 255, 0.3);
  color: #fff;
  padding: 0.7em 0.85em;
  width: 100%;
  border-radius: 6px;
  font-size: 0.95em;
  transition: all 0.2s ease;
  font-weight: bold;
  text-transform: uppercase;
}

.calc-form-group input[type="text"]:focus,
.calc-form-group input[type="number"]:focus {
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.18);
  outline: none;
}

.calc-form-group input[type="text"]::placeholder {
  color: rgba(255, 255, 255, 0.6);
}

.calc-form-group input[type="range"] {
  width: 100%;
  cursor: pointer;
  height: 6px;
  -webkit-appearance: none;
  appearance: none;
  background: rgba(255, 255, 255, 0.25);
  border-radius: 3px;
  outline: none;
}

.calc-form-group input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  background: #81C784;
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid #fff;
}

.calc-form-group input[type="range"]::-moz-range-thumb {
  width: 20px;
  height: 20px;
  background: #81C784;
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid #fff;
}

.calc-value-display {
  margin-top: 0.5em !important;
  font-weight: bold;
  font-size: 1.4em;
  color: #81C784;
  text-align: center;
  padding: 0.4em;
  border-radius: 4px;
}

/* Checkbox Styles - More Compact */
.calc-checkbox-label {
  display: flex !important;
  align-items: center !important;
  padding: 10px 12px !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  border: 2px solid rgba(255, 255, 255, 0.25) !important;
  transition: all 0.2s ease !important;
  margin: 0 !important;
}

.calc-checkbox-label:hover {
  background: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.4) !important;
}

.calc-checkbox-label input[type="checkbox"] {
  position: relative !important;
  opacity: 1 !important;
  display: inline-block !important;
  visibility: visible !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  margin: 0 12px 0 0 !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  accent-color: #81C784 !important;
  transform: none !important;
  -webkit-appearance: checkbox !important;
  -moz-appearance: checkbox !important;
  appearance: checkbox !important;
}

.calc-checkbox-label input[type="checkbox"]:focus {
  outline: 2px solid rgba(129, 199, 132, 0.7) !important;
  outline-offset: 2px !important;
}

.calc-checkbox-label span {
  color: #fff !important;
  font-size: 0.9em !important;
  font-weight: 400 !important;
  user-select: none !important;
  line-height: 1.4 !important;
}

.calc-checkbox-label:has(input[type="checkbox"]:checked) {
  background: rgba(129, 199, 132, 0.25) !important;
  border-color: rgba(129, 199, 132, 0.6) !important;
}

.calc-checkbox-label:has(input[type="checkbox"]:checked) span {
  color: #A5D6A7 !important;
  font-weight: 500 !important;
}

/* MAXIMUM SPECIFICITY RED BUTTON - Override everything */
button.calc-submit-btn,
.calc-form button.calc-submit-btn,
button.calc-submit-btn.calc-submit-btn {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  background: #d32f2f !important;
  background-image: linear-gradient(135deg, #d32f2f 0%, #c62828 100%) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 1em !important;
  line-height: 1.4 !important;
  padding: 0.9em 1.5em !important;
  margin: 1.25em 0 0 0 !important;
  border: 2px solid rgba(255, 82, 82, 0.5) !important;
  border-radius: 4px !important;
  box-shadow: 
    0 4px 12px rgba(211, 47, 47, 0.5),
    0 0 20px rgba(255, 82, 82, 0.3) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
}

button.calc-submit-btn:hover,
.calc-form button.calc-submit-btn:hover,
button.calc-submit-btn.calc-submit-btn:hover {
  background: #b71c1c !important;
  background-image: linear-gradient(135deg, #b71c1c 0%, #a31919 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 
    0 6px 16px rgba(211, 47, 47, 0.7),
    0 0 30px rgba(255, 82, 82, 0.5) !important;
  border-color: rgba(255, 107, 107, 0.7) !important;
  color: #fff !important;
}

button.calc-submit-btn:active,
.calc-form button.calc-submit-btn:active,
button.calc-submit-btn.calc-submit-btn:active {
  transform: translateY(0) !important;
  box-shadow: 
    0 2px 6px rgba(211, 47, 47, 0.6),
    0 0 15px rgba(255, 82, 82, 0.4) !important;
}

button.calc-submit-btn:focus,
.calc-form button.calc-submit-btn:focus {
  outline: 2px solid rgba(211, 47, 47, 0.5) !important;
  outline-offset: 2px !important;
}

/* Mobile */
@media screen and (max-width: 736px) {
  button.calc-submit-btn,
  .calc-form button.calc-submit-btn {
    font-size: 0.95em !important;
    padding: 0.85em 1.25em !important;
  }
}



/* Mobile adjustments */
@media screen and (max-width: 736px) {
  .calc-form {
    padding: 1em;
  }

  .calc-form-group {
    margin-bottom: 0.75em;
  }

  .calc-checkbox-label {
    padding: 9px 10px !important;
  }

  .calc-checkbox-label span {
    font-size: 0.88em !important;
  }

  .calc-form .button.primary,
  .calc-form button.primary {
    font-size: 1em !important;
    padding: 0.9em 1.5em !important;
  }
}

/* Video Section */
.calc-video-section {
  margin: 2em 0;
  padding: 1.5em;
  background: rgba(255, 255, 255, 0.08);
  border: 2px solid rgba(255, 112, 67, 0.5);
  border-radius: 8px;
}

.calc-video-section h3 {
  margin-top: 0;
  color: #fff;
}

.calc-video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
  background: #000;
  border-radius: 6px;
  margin: 1em 0;
}

.calc-video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Donate Box */
.calc-donate-box {
  margin: 2.5em 0;
  padding: 2em;
  background: rgba(255, 235, 59, 0.18);
  border-radius: 8px;
  text-align: center;
  border: 2px solid rgba(255, 235, 59, 0.4);
}

.calc-donate-box h3 {
  margin-top: 0;
  color: #fff;
  font-size: 1.5em;
}

.calc-donate-box .button {
  margin: 1.25em 0;
  font-size: 0.9em;
  padding: 1em 2em;
}

/* Mobile fix for donate button */
@media screen and (max-width: 736px) {
  .calc-donate-box .button {
    font-size: 0.85em !important;
    padding: 0.85em 1.25em !important;
  }
}

@media screen and (max-width: 480px) {
  .calc-donate-box .button {
    font-size: 0.8em !important;
    padding: 0.75em 1em !important;
    white-space: normal !important;
  }
}

/* Results Area */
#result {
  margin: 2em 0;
}

/* Location Info Box */
.calc-location-info {
  background: rgba(255, 255, 255, 0.12);
  border: 2px solid rgba(255, 255, 255, 0.25);
  padding: 1.5em;
  border-radius: 8px;
  margin-bottom: 2em;
}

.calc-location-info h2 {
  margin: 0 0 1em 0;
  color: #fff;
  font-size: 1.4em;
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  padding-bottom: 0.5em;
}

.calc-location-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5em;
  margin-bottom: 1.25em;
}

.calc-location-grid p {
  margin: 0 0 0.75em 0 !important;
  color: #E0E0E0;
}

.calc-compliance-box {
  background: rgba(255, 255, 255, 0.1);
  padding: 1.25em;
  border-radius: 6px;
  margin-top: 1em;
}

.calc-compliance-box p {
  margin: 0 0 0.75em 0 !important;
  font-weight: 600;
  color: #fff;
}

.calc-compliance-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1em;
  margin-top: 0.75em;
}

.calc-compliance-grid span {
  font-weight: bold;
  font-size: 1em;
  text-align: center;
 }

.calc-risk-high { color: #FF7043 !important; font-weight: 700 !important; }
.calc-risk-medium { color: #FFB74D !important; font-weight: 700 !important; }
.calc-risk-okay { color: #81C784 !important; font-weight: 700 !important; }

.calc-property-details {
  background: rgba(255, 255, 255, 0.08);
  padding: 1em;
  border-radius: 6px;
  font-size: 0.9em;
  margin-top: 1em;
  color: #E0E0E0;
}

/* Shock Zone Alert */
.calc-shock-zone-alert {
  background: rgba(244, 67, 54, 0.22);
  border-left: 5px solid #FF7043;
  padding: 1.25em;
  border-radius: 6px;
  margin: 1.5em 0;
}

.calc-shock-zone-alert h3 {
  color: #FFCDD2 !important;
  font-size: 1.1em !important;
  margin: 0 0 0.75em 0 !important;
}

.calc-shock-zone-alert p {
  margin: 0.75em 0;
  color: #E0E0E0;
}

.calc-shock-zone-nested {
  margin-top: 1em;
  padding: 1em;
  background: rgba(244, 67, 54, 0.35);
  border-radius: 4px;
  font-size: 0.9em;
  color: #FFCDD2 !important;
  font-weight: bold;
}

/* Distance Sites Grid */
.calc-sites-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0.75em;
  padding: 0;
  margin: 1.5em 0;
}

.calc-site-card {
  padding: 1em 0.75em;
  border-radius: 6px;
  font-size: 0.9em;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  text-align: center;
  transition: transform 0.2s ease;
}

.calc-site-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

.calc-site-name {
  font-weight: 600;
  color: #fff !important;
  margin-bottom: 0.5em;
  font-size: 0.95em;
  line-height: 1.3;
}

.calc-site-distance {
  font-weight: bold;
  font-size: 1.3em;
}

/* Site card color variants */
.calc-site-bess {
  background: rgba(255, 152, 0, 0.28);
  border: 2px solid #FFA726;
}
.calc-site-bess .calc-site-distance { color: #FFA726 !important; }

.calc-site-extreme {
  background: rgba(255, 205, 210, 0.28);
  border: 2px solid #FFCDD2;
}
.calc-site-extreme .calc-site-distance { 
  color: #FFCDD2 !important;
  text-shadow: 0 0 8px rgba(255, 205, 210, 0.5);
}

.calc-site-severe {
  background: rgba(255, 138, 128, 0.28);
  border: 2px solid #FF8A80;
}
.calc-site-severe .calc-site-distance { 
  color: #FF8A80 !important;
  text-shadow: 0 0 6px rgba(255, 138, 128, 0.4);
}

.calc-site-high {
  background: rgba(255, 183, 77, 0.28);
  border: 2px solid #FFB74D;
}
.calc-site-high .calc-site-distance { color: #FFB74D !important; }

.calc-site-moderate {
  background: rgba(255, 224, 130, 0.28);
  border: 2px solid #FFE082;
}
.calc-site-moderate .calc-site-distance { color: #FFE082 !important; }

.calc-site-yellow {
  background: rgba(197, 225, 165, 0.28);
  border: 2px solid #C5E1A5;
}
.calc-site-yellow .calc-site-distance { color: #C5E1A5 !important; }

.calc-site-lightgreen {
  background: rgba(165, 214, 167, 0.28);
  border: 2px solid #A5D6A7;
}
.calc-site-lightgreen .calc-site-distance { color: #A5D6A7 !important; }

.calc-site-green {
  background: rgba(129, 199, 132, 0.28);
  border: 2px solid #81C784;
}
.calc-site-green .calc-site-distance { color: #81C784 !important; }

/* Valuation Section */
.calc-valuation-section {
  /* background: rgba(255, 183, 77, 0.18); */
  border: 2px solid #FFB74D;
  padding: 1.5em;
  border-radius: 8px;
  margin: 2em 0;
}

.calc-valuation-section h2 {
  margin-top: 0;
  margin-bottom: 1em;
  color: #fff;
  font-size: 1.4em;
  border-bottom: 2px solid rgba(255, 183, 77, 0.4);
  padding-bottom: 0.5em;
}

.calc-valuation-section > p {
  margin-bottom: 1.25em;
  font-weight: 600;
  color: #fff;
}

.calc-valuation-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5em;
  margin-top: 1.25em;
}

.calc-valuation-box {
  background: rgba(0, 0, 0, 0.35);
  padding: 1.25em;
  border-radius: 6px;
  border-left: 5px solid #FF7043;
}

.calc-valuation-box-long {
  border-left-color: #FFB74D;
}

.calc-valuation-label {
  font-size: 1em;
  margin-bottom: 1em;
  font-weight: 600;
  color: #fff !important;
  text-align: center;
  padding-bottom: 0.75em;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

.calc-valuation-row {
  font-weight: bold;
  margin: 0.75em 0;
  padding: 0.75em;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.08);
  font-size: 1em;
}

.calc-valuation-low { 
  color: #81C784 !important; 
  border-left: 3px solid #81C784;
}

.calc-valuation-median { 
  color: #FFB74D !important;
  border-left: 3px solid #FFB74D;
}

.calc-valuation-high { 
  color: #FF7043 !important;
  border-left: 3px solid #FF7043;
  font-weight: 700 !important;
}

.calc-adjustment-note {
  font-size: 0.85em;
  color: #FFB74D !important;
  font-weight: 600;
  margin-top: 1em;
  padding-top: 1em;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
  line-height: 1.6;
}

/* Info Box - Threat Summary */
.calc-info-box {
  background: rgba(0, 0, 0, 0.35);
  border: 2px solid rgba(255, 255, 255, 0.25);
  padding: 1.5em;
  border-radius: 6px;
  font-size: 0.95em;
  line-height: 1.7;
  margin: 1.5em 0;
}

.calc-info-box p {
  margin: 0.75em 0 !important;
  color: #E0E0E0;
}

.calc-info-box ul {
  margin: 1em 0;
  padding-left: 1.75em;
  list-style: disc !important;
}

.calc-info-box li {
  margin: 0.75em 0;
  color: #E0E0E0;
}

.calc-financial-impact {
  margin-top: 1.25em;
  padding: 1.25em;
  background: rgba(244, 67, 54, 0.22);
  border-left: 5px solid #FF7043;
  font-size: 1em;
  font-weight: bold;
  border-radius: 4px;
  color: #FFCDD2 !important;
}

/* Key Studies Box */
.calc-studies-box {
  background: rgba(0, 0, 0, 0.35);
  padding: 1.25em;
  border-radius: 6px;
  font-size: 0.9em;
  margin: 1.5em 0;
  border: 1px solid rgba(255, 255, 255, 0.25);
}

.calc-studies-box strong {
  color: #fff;
  font-weight: 600;
}

.calc-studies-box p {
  margin: 0.75em 0 !important;
  line-height: 1.8;
  color: #E0E0E0;
}

.calc-studies-box a {
  color: #64b5f6 !important;
  text-decoration: none;
  border-bottom: dotted 1px rgba(100, 181, 246, 0.5);
}

.calc-studies-box a:hover {
  border-bottom-color: transparent;
  color: #90caf9 !important;
}

/* BESS Risk Box */
.calc-bess-risk-box {
  /* background: rgba(255, 152, 0, 0.18); */
  border: 3px solid #FFA726;
  padding: 1.5em;
  border-radius: 8px;
  margin: 2em 0;
}

.calc-bess-risk-box h3 {
  color: #FFA726 !important;
  margin-top: 0;
  font-size: 1.3em;
}

.calc-bess-risk-box p {
  margin: 0.75em 0;
  color: #E0E0E0;
}

.calc-bess-distance {
  font-weight: bold;
  font-size: 1.3em;
  color: #FF7043 !important;
  text-shadow: 0 0 8px rgba(255, 112, 67, 0.4);
}

.calc-risk-tier {
  font-size: 1.1em;
  font-weight: bold;
  padding: 1em;
  border-radius: 6px;
  margin: 1em 0;
  text-align: center;
}

.calc-tier-immediate {
  background: rgba(244, 67, 54, 0.35);
  color: #FFCDD2 !important;
  border: 2px solid #FF7043;
}

.calc-tier-high {
  background: rgba(244, 67, 54, 0.3);
  color: #FF8A80 !important;
  border: 2px solid #FF7043;
}

.calc-tier-critical {
  background: rgba(255, 152, 0, 0.35);
  color: #FFB74D !important;
  border: 2px solid #FFA726;
}

.calc-tier-moderate {
  background: rgba(255, 183, 77, 0.3);
  color: #FFE082 !important;
  border: 2px solid #FFB74D;
}

.calc-scientific-basis {
  background: rgba(100, 181, 246, 0.15);
  padding: 1.25em;
  border-left: 4px solid #64b5f6;
  margin-top: 1.25em;
  font-size: 0.9em;
  border-radius: 4px;
}

.calc-scientific-basis p {
  margin: 0 0 0.75em 0 !important;
  font-weight: 600;
  color: #fff;
}

.calc-scientific-basis ul {
  margin: 0.75em 0;
  padding-left: 1.75em;
  list-style: disc !important;
}

.calc-scientific-basis li {
  margin: 0.5em 0;
  color: #E0E0E0;
}

/* Livestock Alert */
.calc-livestock-alert {
  background: rgba(244, 67, 54, 0.2);
  border-left: 5px solid #FF7043;
  padding: 1.5em;
  border-radius: 6px;
  margin: 1.5em 0;
}

.calc-livestock-alert h3 {
  margin: 0 0 1em 0 !important;
  font-size: 1.1em !important;
  color: #FF8A80 !important;
}

.calc-livestock-alert p {
  margin: 0 0 0.75em 0 !important;
  font-size: 0.95em;
  color: #E0E0E0;
}

.calc-livestock-alert ul {
  margin: 1em 0;
  padding-left: 1.75em;
  list-style: disc !important;
}

.calc-livestock-alert li {
  margin: 0.5em 0;
  font-size: 0.9em;
  color: #E0E0E0;
}

.calc-livestock-critical {
  margin: 1em 0 0 0;
  padding: 1em;
  background: rgba(244, 67, 54, 0.3);
  border-radius: 4px;
  font-size: 0.85em;
  color: #FFCDD2 !important;
  font-weight: bold;
}

/* Karst Alert */
.calc-karst-alert {
  background: rgba(100, 181, 246, 0.18);
  border-left: 5px solid #64b5f6;
  padding: 1.25em;
  border-radius: 6px;
  margin: 1.5em 0;
}

.calc-karst-alert h4 {
  color: #64b5f6 !important;
  margin: 0 0 0.75em 0 !important;
  font-size: 1em !important;
}

.calc-karst-alert p {
  margin: 0.5em 0 !important;
  color: #E0E0E0;
}

/* Acoustic Alert */
.calc-acoustic-alert {
  background: rgba(100, 181, 246, 0.18);
  border-left: 5px solid #4FC3F7;
  padding: 1.25em;
  border-radius: 6px;
  margin: 1.5em 0;
}

.calc-acoustic-alert h4 {
  color: #4FC3F7 !important;
  margin: 0 0 0.75em 0 !important;
  font-size: 1em !important;
}

.calc-acoustic-alert p {
  margin: 0.75em 0;
  color: #E0E0E0;
}

.calc-acoustic-alert ul {
  margin: 1em 0;
  padding-left: 1.75em;
  list-style: disc !important;
}

.calc-acoustic-alert li {
  margin: 0.5em 0;
  font-size: 0.95em;
  color: #E0E0E0;
}

.calc-noise-cumulative {
  margin: 1em 0;
  padding: 1em;
  border-left: 4px solid #FFB74D;
  background: rgba(255, 183, 77, 0.18);
  font-size: 0.9em;
  border-radius: 4px;
  color: #E0E0E0;
}

.calc-action-box {
  margin: 1em 0 0 0;
  padding: 1em;
  background: rgba(255, 193, 7, 0.18);
  border-left: 4px solid #ffc107;
  font-size: 0.9em;
  border-radius: 4px;
  color: #E0E0E0;
}

/* Visual Alert */
.calc-visual-alert {
  background: rgba(100, 181, 246, 0.18);
  border-left: 5px solid #FFB74D;
  padding: 1.25em;
  border-radius: 6px;
  margin: 1.5em 0;
}

.calc-visual-alert h4 {
  color: #FFB74D !important;
  margin: 0 0 0.75em 0 !important;
  font-size: 1em !important;
}

.calc-visual-alert p {
  margin: 0.75em 0;
  color: #E0E0E0;
}

.calc-visual-alert ul {
  margin: 1em 0;
  padding-left: 1.75em;
  list-style: disc !important;
}

.calc-visual-alert li {
  margin: 0.5em 0;
  font-size: 0.95em;
  color: #E0E0E0;
}

.calc-visual-cumulative {
  margin: 1em 0;
  padding: 1em;
  border-left: 4px solid #FFB74D;
  background: rgba(255, 183, 77, 0.18);
  font-size: 0.9em;
  border-radius: 4px;
  color: #E0E0E0;
}

/* Construction Warning */
.calc-construction-warning {
  margin: 1.25em 0;
  padding: 1em;
  background: rgba(255, 193, 7, 0.18);
  border-left: 4px solid #ffc107;
  font-size: 0.9em;
  border-radius: 4px;
}

.calc-construction-warning p {
  margin: 0 0 0.75em 0 !important;
  font-weight: 600;
  color: #fff;
}

.calc-construction-warning ul {
  margin: 0.75em 0;
  padding-left: 1.75em;
  list-style: disc !important;
}

.calc-construction-warning li {
  margin: 0.5em 0;
  color: #E0E0E0;
}

/* Error Message */
.calc-error {
  color: #FFCDD2 !important;
  font-weight: bold;
  padding: 1.25em;
  background: rgba(244, 67, 54, 0.25);
  border-left: 5px solid #FF7043;
  border-radius: 6px;
  margin: 1em 0;
}

/* Mobile Responsive */
@media screen and (max-width: 736px) {
  .calculator-wrapper {
    padding: 0;
  }

  .calc-alert,
  .calc-landmarks,
  .calc-video-section,
  .calc-donate-box,
  .calc-form {
    padding: 1.25em;
  }

  .calc-location-grid,
  .calc-compliance-grid,
  .calc-valuation-grid {
    grid-template-columns: 1fr;
    gap: 1em;
  }

  .calc-sites-grid {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.5em;
  }

  .calc-site-card {
    padding: 0.75em 0.5em;
    font-size: 0.85em;
  }

  .calc-site-name {
    font-size: 0.85em;
  }

  .calc-site-distance {
    font-size: 1.1em;
  }

  .calc-landmarks .buttons {
    flex-direction: column;
  }

  .calc-landmarks .buttons li {
    display: block;
    width: 100%;
  }

  .calc-landmarks .button {
    width: 100%;
  }

  .calc-valuation-row {
    font-size: 0.9em;
  }

  .calc-form-group input[type="text"],
  .calc-form-group input[type="number"] {
    font-size: 16px; /* Prevent iOS zoom */
  }
}

@media screen and (max-width: 480px) {
  .calc-sites-grid {
    grid-template-columns: 1fr 1fr 1fr;  /* Three equal columns */
  }

  .calc-valuation-section h2 {
    font-size: 1.2em;
  }

  .calc-value-display {
    font-size: 1.1em;
  }
}

.calc-scientific-basis {
  margin: 1.3em 0;
  padding: 0.9em 0.9em 1em;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.35);
  color: #fff;
  font-size: 0.9em;
}

.calc-scientific-basis > p {
  margin: 0 0 0.6em 0;
  font-weight: 600;
}

.basis-card {
  padding: 0.55em 0.7em;
  margin-bottom: 0.45em;
  border-radius: 6px;
  background: rgba(0,0,0,0.35);
}

.basis-title {
  font-weight: 600;
  margin-bottom: 0.15em;
}

.basis-text {
  line-height: 1.35;
}

/* Slightly tighter on very small screens */
@media (max-width: 600px) {
  .calc-scientific-basis {
    font-size: 0.84em;
    padding: 0.75em 0.8em 0.9em;
  }

  .basis-card {
    padding: 0.5em 0.6em;
    margin-bottom: 0.4em;
  }
}

.calc-bess-risk-box h3 {
  margin: 0 0 0.6em 0;
  font-size: 1.1em;
}

.bess-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
}

/* Two columns on wider screens if you want */
@media (min-width: 800px) {
  .bess-cards {
    grid-template-columns: 1fr 1fr;
  }
}

.bess-card {
  padding: 0.6em 0.7em;
  border-radius: 8px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.15);
}

.bess-card-label {
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.7);
  margin-bottom: 0.15em;
}

.bess-card-value {
  font-size: 0.95em;
  line-height: 1.35;
  color: #fff;
  font-weight: 500;
}

/* Keep your existing tier styling, but it now applies inside the card */
.bess-card .calc-risk-tier {
  display: inline-block;
  padding: 0.15em 0.45em;
  border-radius: 999px;
  font-size: 0.9em;
  font-weight: 600;
}


.calc-visual-alert {
  margin: 1.2em 0;
  padding: 0.9em 0.9em 1em;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.35);
  color: #fff;
  font-size: 0.9em;
}

.calc-visual-alert h4 {
  margin: 0 0 0.6em 0;
  font-size: 1em;
}

.visual-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
}

.visual-card {
  padding: 0.6em 0.7em;
  border-radius: 8px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.15);
}

.visual-card-label {
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.7);
  margin-bottom: 0.15em;
}

.visual-card-value {
  font-size: 0.9em;
  line-height: 1.35;
}

/* existing list content, just styled */
.visual-sources {
  margin: 0;
  padding-left: 1.1em;
}

.visual-sources li {
  margin: 0.2em 0;
}

/* Optional: two columns on desktop to mirror the BESS cards */
@media (min-width: 800px) {
  .visual-cards {
    grid-template-columns: 1fr 1fr;
  }
}

.calc-acoustic-alert {
  margin: 1.2em 0;
  padding: 0.9em 0.9em 1em;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.35);
  color: #fff;
  font-size: 0.9em;
}

.calc-acoustic-alert h4 {
  margin: 0 0 0.6em 0;
  font-size: 1em;
}

.calc-acoustic-alert p {
  margin: 0.3em 0;
}

.noise-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
}

.noise-card {
  padding: 0.6em 0.7em;
  border-radius: 8px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.15);
}

.noise-card-label {
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.7);
  margin-bottom: 0.15em;
}

.noise-card-value {
  font-size: 0.9em;
  line-height: 1.35;
}

.noise-sources {
  margin: 0;
  padding-left: 1.1em;
}

.noise-sources li {
  margin: 0.2em 0;
}

/* Optional: two columns on wider screens */
@media (min-width: 800px) {
  .noise-cards {
    grid-template-columns: 1fr 1fr;
  }
}

.calc-info-box {
  margin: 1.2em 0;
  padding: 0.9em 0.9em 1em;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.35);
  color: #fff;
  font-size: 0.9em;
}

.calc-info-box p {
  margin: 0 0 0.6em 0;
  font-weight: 600;
}

.summary-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
}

.summary-card {
  padding: 0.6em 0.7em;
  border-radius: 8px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.15);
}

.summary-card-label {
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.7);
  margin-bottom: 0.15em;
}

.summary-card-value {
  font-size: 0.9em;
  line-height: 1.35;
}

.summary-financial {
  margin-top: 0.8em;
  padding: 0.7em;
  border-radius: 8px;
  background: rgba(255,0,0,0.2);
  border: 1px solid rgba(255,0,0,0.3);
  text-align: center;
  font-weight: 600;
}

/* Studies cards */
.studies-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.4em;
  margin-top: 0.8em;
}

.studies-card {
  padding: 0.55em 0.7em;
  border-radius: 6px;
  background: rgba(0,0,0,0.3);
}

.studies-card-label {
  font-weight: 600;
  margin-bottom: 0.1em;
}

.studies-card-value {
  font-size: 0.85em;
  line-height: 1.3;
}

/* Desktop: 2 columns */
@media (min-width: 800px) {
  .summary-cards,
  .studies-cards {
    grid-template-columns: 1fr 1fr;
  }
}

.calc-livestock-alert {
  margin: 1.2em 0;
  padding: 0.9em 0.9em 1em;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.35);
  color: #fff;
  font-size: 0.9em;
}

.calc-livestock-alert h3 {
  margin: 0 0 0.5em 0;
  font-size: 1.1em;
}

.calc-livestock-alert > p {
  margin: 0 0 0.6em 0;
  font-weight: 600;
}

.livestock-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
  margin-bottom: 0.8em;
}

.livestock-card {
  padding: 0.6em 0.7em;
  border-radius: 8px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.15);
}

.livestock-card-label {
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.7);
  margin-bottom: 0.15em;
}

.livestock-card-value {
  font-size: 0.9em;
  line-height: 1.35;
}

.calc-livestock-critical {
  margin-top: 0.8em;
  padding: 0.7em;
  border-radius: 8px;
  background: rgba(255,165,0,0.25);
  border: 1px solid rgba(255,165,0,0.4);
  font-weight: 500;
}

/* Desktop: two columns */
@media (min-width: 800px) {
  .livestock-cards {
    grid-template-columns: 1fr 1fr;
  }
}

.calc-karst-alert {
  margin: 1.2em 0;
  padding: 0.9em 0.9em 1em;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.35);
  color: #fff;
  font-size: 0.9em;
}

.calc-karst-alert h4 {
  margin: 0 0 0.6em 0;
  font-size: 1em;
}

.karst-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
}

.karst-card {
  padding: 0.6em 0.7em;
  border-radius: 8px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.15);
}

.karst-card-label {
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.7);
  margin-bottom: 0.15em;
}

.karst-card-value {
  font-size: 0.9em;
  line-height: 1.35;
}

/* Desktop: two columns */
@media (min-width: 800px) {
  .karst-cards {
    grid-template-columns: 1fr 1fr;
  }
}

.calc-shock-zone-alert {
  margin: 1.2em 0;
  padding: 0.9em 0.9em 1em;
  border-radius: 8px;
  border: 2px solid rgba(255,0,0,0.5);
  background: rgba(255,0,0,0.15);
  color: #fff;
  font-size: 0.9em;
}

.calc-shock-zone-alert h3 {
  margin: 0 0 0.5em 0;
  font-size: 1.1em;
  color: #ffcc00;
}

.calc-shock-zone-alert > p {
  margin: 0 0 0.6em 0;
  line-height: 1.4;
}

.shock-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
  margin-top: 0.6em;
}

.shock-card {
  padding: 0.6em 0.7em;
  border-radius: 8px;
  background: rgba(0,0,0,0.4);
  border: 1px solid rgba(255,255,255,0.2);
}

.shock-card-label {
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.8);
  margin-bottom: 0.15em;
  font-weight: 600;
}

.shock-card-value {
  font-size: 0.9em;
  line-height: 1.35;
}

/* Desktop: two columns */
@media (min-width: 800px) {
  .shock-cards {
    grid-template-columns: 1fr 1fr;
  }
}

.calc-alert {
  margin: 1.5em 0;
  padding: 1.1em 1.2em;
  border-radius: 10px;
  border: 1px solid rgba(255,165,0,0.4);
  /* background: rgba(255,165,0,0.12); */
  color: #fff;
  font-size: 0.92em;
}

.calc-alert-title {
  margin: 0 0 0.8em 0;
  font-weight: 700;
  font-size: 1.05em;
  text-align: center;
}

.alert-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
}

.alert-card {
  padding: 0.7em 0.8em;
  border-radius: 8px;
  background: rgba(0,0,0,0.3);
  border: 1px solid rgba(255,255,255,0.15);
}

.alert-card-value {
  font-size: 0.95em;
  line-height: 1.4;
}

.alert-card-value p {
  margin: 0;
}

/* Desktop: keep single column for readability */
@media (min-width: 800px) {
  .alert-cards {
    grid-template-columns: 1fr;
  }
}


.why-tool-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5em;
}

.why-card {
  padding: 0.7em 0.8em;
  border-radius: 8px;
  background: rgba(0,0,0,0.3);
  border: 1px solid rgba(255,255,255,0.15);
}

.why-card-value {
  font-size: 0.95em;
  line-height: 1.4;
}

.why-card-value p {
  margin: 0.4em 0;
}

.why-card-value ul {
  margin: 0.5em 0;
  padding-left: 1.2em;
}

.why-card-value li {
  margin: 0.3em 0;
}

.quote-card {
  background: rgba(0,0,0,0.4);
  border: 1px solid rgba(255,255,255,0.25);
}

.calc-quote-box {
  padding: 0;
}

.calc-quote-title {
  margin: 0 0 0.5em 0;
  font-weight: 600;
}

.calc-quote-box blockquote {
  margin: 0.5em 0;
  padding-left: 0.8em;
  border-left: 3px solid rgba(255,255,255,0.4);
  font-style: italic;
}

.calc-quote-box blockquote p {
  margin: 0.4em 0;
}

.calc-alert-footnote {
  font-size: 0.88em;
  color: rgba(255,255,255,0.85);
  margin-top: 0.6em;
}

.calc-quote-box {
  padding: 0.8em;
  margin-top: 0.6em;
}

.calc-quote-title {
  margin: 0 0 0.6em 0;
  font-weight: 600;
  text-align: center;
}

.quote-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.4em;
  margin-bottom: 0.6em;
}

.quote-card-item {
  padding: 0.6em 0.7em;
  border-radius: 6px;
  background: rgba(0,0,0,0.35);
  border-left: 3px solid rgba(255,255,255,0.4);
  font-style: italic;
}

.quote-card-value {
  font-size: 0.9em;
  line-height: 1.4;
  color: #fff;
}

.calc-alert-footnote {
  font-size: 0.88em;
  color: rgba(255,255,255,0.85);
  font-style: normal;
  margin: 0.6em 0 0 0;
  text-align: center;
}

/* Desktop: optional 2 columns for shorter quotes */
@media (min-width: 800px) {
  .quote-cards {
    grid-template-columns: 1fr 1fr;
  }
}

.calc-compliance-box {
  margin: 1.2em 0;
  padding: 0.9em 0.9em 1em;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.35);
  color: #fff;
  font-size: 0.9em;
}

.calc-compliance-box > p {
  margin: 0 0 0.6em 0;
  font-weight: 600;
  text-align: center;
}

.calc-compliance-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.8em;
}

.compliance-card {
  padding: 0.8em;
  border-radius: 10px;
  text-align: center;
  border: 2px solid;
  background: rgba(0,0,0,0.4);
}

.compliance-icon {
  font-size: 2em;
  margin-bottom: 0.2em;
}

.compliance-label {
  font-size: 0.75em;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255,255,255,0.8);
  margin-bottom: 0.3em;
}

.compliance-distance {
  font-size: 1.8em;
  font-weight: 700;
  margin-bottom: 0.2em;
  line-height: 1;
}

.compliance-status {
  font-size: 0.85em;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.3em 0.6em;
  border-radius: 999px;
  display: inline-block;
  margin-top: 0.3em;
}

/* HIGH RISK - Red with strong contrast */
.compliance-high {
  border-color: #ff4444;
  background: rgba(255,68,68,0.15);
}

.compliance-high .compliance-distance {
  color: #ff6666;
}

.compliance-high .compliance-status {
  background: #ff4444;
  color: #fff;
}

/* MEDIUM - Orange with strong contrast */
.compliance-medium {
  border-color: #ffaa00;
  background: rgba(255,170,0,0.12);
}

.compliance-medium .compliance-distance {
  color: #ffcc00;
}

.compliance-medium .compliance-status {
  background: #ffaa00;
  color: #000;
  font-weight: 700;
}

/* OKAY - Green with strong contrast */
.compliance-okay {
  border-color: #4caf50;
  background: rgba(76,175,80,0.12);
}

.compliance-okay .compliance-distance {
  color: #66bb6a;
}

.compliance-okay .compliance-status {
  background: #4caf50;
  color: #fff;
}

/* Mobile: stack vertically if needed */
@media (max-width: 500px) {
  .calc-compliance-grid {
    grid-template-columns: 1fr;
    gap: 0.6em;
  }
}


.studies-mini-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.4em;
  margin-top: 0.6em;
}

.study-mini-card {
  padding: 0.5em 0.6em;
  border-radius: 6px;
  background: rgba(0,0,0,0.4);
  border-left: 3px solid rgba(255,170,0,0.6);
}

.study-mini-label {
  font-weight: 700;
  font-size: 0.85em;
  color: #ffcc00;
  margin-bottom: 0.2em;
}

.study-mini-value {
  font-size: 0.88em;
  line-height: 1.3;
  color: rgba(255,255,255,0.95);
}

/* Desktop: two columns for compact layout */
@media (min-width: 800px) {
  .studies-mini-cards {
    grid-template-columns: 1fr 1fr;
  }
}














/* Accordion styles (were inline on devaluation.html) */
/* COMPLETE Accordion Styles - PRESERVE YOUR COLORS + Both Closed + Rotating Arrow */
.accordion-item {
    margin-bottom: 1rem;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

.accordion-header {
        width: 100%;
    background: transparent;
    border: none;
    padding: 0.875rem 1.25rem;
    font-size: 1em;
    font-weight: 600;
    color: inherit;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.2s ease;
    box-sizing: border-box;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    user-select: none;
    outline: none;
    margin: 0;
    
}

.accordion-header:hover {
    background: transparent;
    box-shadow: inset 0 -1px 0 #e5e7eb;
}

.accordion-header:active,
.accordion-header:focus-visible {
    background: transparent !important;
    outline: none !important;
}

.accordion-title {
    flex-grow: 1;
    flex-shrink: 1;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-transform: uppercase;
}

.accordion-icon {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* ✅ Smooth rotation */
    font-size: 0.75em;
    color: inherit; /* ✅ YOUR ORIGINAL COLORS */
    flex-shrink: 0;
    margin-left: 0.5rem;
    line-height: 1;
}

.accordion-header[aria-expanded="true"] .accordion-icon {
    transform: rotate(180deg); /* ✅ Rotation fixed */
}

.accordion-header[aria-expanded="true"] {
    background: transparent;
    border-bottom: 1px solid #e5e7eb;
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
    background: transparent;
    box-sizing: border-box;
    width: 100%;
}

.accordion-content.active {
    max-height: 3000px;
    padding: 1.25rem;
}

@media (max-width: 768px) {
    .accordion-header {
        padding: 0.75rem 1rem;
        font-size: 0.95em;
        max-width: 30em;
    }
    
    .accordion-content.active {
        padding: 1rem;
    }
}

/* Site layout: the site-wide p / heading colours (dark grey, dark slate) were winning over the
   calculator's white text on the green. Plain text inside the calculator inherits again, as on the
   current site; anything with its own colour class or inline colour keeps it. */
.calc-block :where(p, li, h1, h2, h3, h4) { color: inherit; }
/* "100 local residents have already contributed." was a faint #aaa grey (inline style from the script) */
.calc-block .cta-donate-section p[style*="#aaa"] { color: #ddd !important; }
