/* Recycling & Waste Management Archive Page
   Scoped styles: all selectors start with .rw-archive-page
   Safe to include site-wide (won't affect other pages).
*/

.rw-archive-page{
  --rw-bg: #f6f7f9;
  --rw-text: #111827;
  --rw-muted: #4b5563;
  --rw-border: #e5e7eb;
  --rw-card: #ffffff;

  --rw-green-700: #0b2239;  /* navy accent */ /* mono primary */
  --rw-green-600: #111827;  /* charcoal */ /* mono secondary */
  --rw-teal-700:  #1f2937;  /* slate */ /* mono tertiary */

  --rw-amber-50: #fffbeb;
  --rw-amber-600: #d97706;
  --rw-amber-800: #92400e;
  --rw-amber-900: #78350f;

  --rw-blue-700: #1d4ed8;
  --rw-gray-700: #374151;

  --rw-radius: 16px;
  --rw-shadow: 0 10px 25px rgba(17,24,39,.08);
  --rw-shadow-sm: 0 6px 16px rgba(17,24,39,.07);

  color: var(--rw-text);
  background: var(--rw-bg);
  line-height: 1.55;
  font-family: Montserrat,sans-serif!important; 
}

.rw-archive-page a{ text-decoration: none; }
.rw-archive-page *{ box-sizing: border-box; }

.rw-archive-page .rw-container{
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
}

/* HERO */
.rw-archive-page .rw-hero{
  padding: 72px 0;
  color: #111827;
  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(17,24,39,.06), transparent 60%),
    linear-gradient(180deg, #ffffff, #f3f4f6);
  border-bottom: 1px solid #e5e7eb;
}

.rw-archive-page .rw-hero__inner{
  text-align: center;
  max-width: 820px;
  margin: 0 auto;
}

.rw-archive-page .rw-hero__title{
  margin: 0 0 12px;
  font-size: clamp(30px, 4.2vw, 50px);
  letter-spacing: -.02em;
  line-height: 1.1;
  font-weight: 600 !important;
}

.rw-archive-page .rw-hero__subtitle{
  margin: 0 0 24px;
  color: #374151;
  font-size: clamp(16px, 1.9vw, 22px);
}

.rw-archive-page .rw-hero__actions{
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: center;
  margin: 0 0 14px;
}

.rw-archive-page .rw-hero__note{
  margin: 0;
  font-size: 13px;
  color: #4b5563;
  font-style: italic;
}

@media (min-width: 640px){
  .rw-archive-page .rw-hero__actions{ flex-direction: row; }
}

/* BODY */
.rw-archive-page .rw-body{
  padding: 48px 0 64px;
}

.rw-archive-page .rw-section{
  margin: 0 0 56px;
}

.rw-archive-page .rw-section__header{
  text-align: center;
  margin-bottom: 18px;
}

.rw-archive-page .rw-h2{
  margin: 0;
  font-size: clamp(22px, 2.2vw, 32px);
  font-weight: 600;
  letter-spacing: -.01em;
}

/* Buttons */
.rw-archive-page .rw-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: 14px;
  font-weight: 600;
  border: 1px solid transparent;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease, border-color .12s ease;
  white-space: nowrap;
}

.rw-archive-page .rw-btn:focus-visible{
  outline: 3px solid rgba(17,24,39,.35);
  outline-offset: 2px;
}

.rw-archive-page .rw-btn:hover{
  transform: translateY(-1px);
  box-shadow: var(--rw-shadow-sm);
}

.rw-archive-page .rw-btn--primary{
  background: #111827;
  color: #ffffff;
  border-color: #111827;
}

.rw-archive-page .rw-btn--secondary{
  background: #ffffff;
  color: #111827;
  border-color: #d1d5db;
}

.rw-archive-page .rw-btn--dark{
  background: var(--rw-gray-700);
  color: #fff;
}

.rw-archive-page .rw-btn--info{
  background: var(--rw-blue-700);
  color: #fff;
}

.rw-archive-page .rw-btn__icon{
  font-size: 18px;
  line-height: 1;
}

/* Callout */
.rw-archive-page .rw-callout{
  background: var(--rw-amber-50);
  border-left: 6px solid var(--rw-amber-600);
  border-radius: var(--rw-radius);
  padding: 18px 18px;
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 14px;
  box-shadow: var(--rw-shadow-sm);
}

.rw-archive-page .rw-callout__icon{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: rgba(217,119,6,.14);
  color: var(--rw-amber-800);
  display: grid;
  place-items: center;
  font-weight: 600;
}

.rw-archive-page .rw-callout__title{
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: 600;
  color: var(--rw-amber-900);
}

.rw-archive-page .rw-callout__text{
  margin: 0 0 8px;
  color: var(--rw-amber-800);
}

.rw-archive-page .rw-link{
  color: var(--rw-green-700);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.rw-archive-page .rw-link--strong{
  color: var(--rw-amber-900);
}

/* Cards & grids */
.rw-archive-page .rw-grid{
  display: grid;
  gap: 16px;
}

.rw-archive-page .rw-grid--4{
  grid-template-columns: 1fr;
}

.rw-archive-page .rw-grid--3{
  grid-template-columns: 1fr;
}

@media (min-width: 768px){
  .rw-archive-page .rw-grid--3{ grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 900px){
  .rw-archive-page .rw-grid--4{ grid-template-columns: repeat(4, 1fr); }
}

.rw-archive-page .rw-card{
  background: var(--rw-card);
  border: 1px solid var(--rw-border);
  border-radius: var(--rw-radius);
  padding: 18px;
  box-shadow: var(--rw-shadow-sm);
}

.rw-archive-page .rw-card__kicker{
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--rw-muted);
  margin-bottom: 6px;
  font-weight: 600;
}

.rw-archive-page .rw-card__value{
  color: #1f2937;
  font-weight: 650;
}

.rw-archive-page .rw-card--link{
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.rw-archive-page .rw-card--link:hover{
  transform: translateY(-2px);
  box-shadow: var(--rw-shadow);
  border-color: rgba(17,24,39,.18);
}

.rw-archive-page .rw-card__title{
  font-weight: 600;
  margin-bottom: 10px;
  color: #111827;
  line-height: 1.25;
}

.rw-archive-page .rw-card__meta{
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--rw-muted);
  font-weight: 650;
  flex-wrap: wrap;
}

.rw-archive-page .rw-badge{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(17,24,39,.06);
  color: var(--rw-green-700);
  font-weight: 600;
  font-size: 12px;
}

.rw-archive-page .rw-dot{ opacity: .8; }

/* Theme */
.rw-archive-page .rw-theme{
  margin: 18px 0 0;
  padding: 22px;
  border-radius: calc(var(--rw-radius) + 4px);
  color: #fff;
  background: linear-gradient(90deg, #0b2239, #111827);
  box-shadow: var(--rw-shadow);
  text-align: center;
}

.rw-archive-page .rw-theme__quote{
  margin: 0;
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 600;
  font-style: italic;
}

.rw-archive-page .rw-theme__caption{
  margin-top: 6px;
  color: rgba(255,255,255,.85);
  font-size: 12px;
  font-weight: 600;
}

/* Chips */
.rw-archive-page .rw-chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.rw-archive-page .rw-chip{
  display: inline-flex;
  padding: 10px 12px;
  border: 1px solid var(--rw-border);
  border-radius: 999px;
  background: #fff;
  font-weight: 600;
  color: #1f2937;
  font-size: 13px;
  box-shadow: 0 2px 10px rgba(17,24,39,.05);
}

/* Panel */
.rw-archive-page .rw-panel{
  background: #fff;
  border: 1px solid var(--rw-border);
  border-radius: calc(var(--rw-radius) + 4px);
  padding: 22px 18px;
  box-shadow: var(--rw-shadow-sm);
}

.rw-archive-page .rw-list{
  list-style: none;
  padding: 0;
  margin: 8px auto 12px;
  max-width: 820px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

@media (min-width: 720px){
  .rw-archive-page .rw-list{ grid-template-columns: 1fr 1fr; }
}

.rw-archive-page .rw-list li{
  position: relative;
  padding-left: 18px;
  color: #374151;
  font-weight: 650;
}

.rw-archive-page .rw-list li::before{
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 99px;
  background: var(--rw-green-600);
  position: absolute;
  left: 0;
  top: .6em;
}

.rw-archive-page .rw-panel__note{
  margin: 18px 0 0;
  padding-top: 16px;
  border-top: 1px solid var(--rw-border);
  text-align: center;
  color: var(--rw-muted);
  font-style: italic;
}

/* Actions row */
.rw-archive-page .rw-actions{
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: stretch;
  justify-content: center;
}

@media (min-width: 640px){
  .rw-archive-page .rw-actions{
    flex-direction: row;
    align-items: center;
  }
}

/* FAQ (details/summary) */
.rw-archive-page .rw-faqs{
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  gap: 12px;
}

.rw-archive-page .rw-faq{
  background: #fff;
  border: 1px solid var(--rw-border);
  border-radius: var(--rw-radius);
  box-shadow: var(--rw-shadow-sm);
  overflow: hidden;
}

.rw-archive-page .rw-faq__q{
  cursor: pointer;
  padding: 16px 18px;
  font-weight: 600;
  color: #111827;
  list-style: none;
}

.rw-archive-page .rw-faq__q::-webkit-details-marker{ display:none; }

.rw-archive-page .rw-faq__q::after{
  content: "▾";
  float: right;
  color: #6b7280;
  transition: transform .12s ease;
}

.rw-archive-page .rw-faq[open] .rw-faq__q::after{
  transform: rotate(180deg);
}

.rw-archive-page .rw-faq__a{
  padding: 0 18px 18px;
  color: #374151;
  font-weight: 650;
}

/* Small tweaks for cramped embeds */
@media (max-width: 420px){
  .rw-archive-page .rw-btn{ width: 100%; }
  .rw-archive-page .rw-chip{ width: 100%; justify-content: center; border-radius: 14px; }
}