:root {
  --page-background: #f8faf5;
  --surface: rgba(255, 255, 255, 0.96);
  --surface-soft: #f7faef;
  --surface-accent: #edf5e3;
  --brand-green: #8fc65c;
  --brand-green-dark: #4b9334;
  --heading: #173f39;
  --text: #2f3d3a;
  --border: #e1ead8;
  --shadow: 0 22px 60px rgba(43, 67, 57, 0.13);
}
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--page-background); }
body {
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  color: var(--text);
  background:
    radial-gradient(circle at 12% 18%, rgba(143, 198, 92, 0.12), transparent 24rem),
    radial-gradient(circle at 90% 78%, rgba(143, 198, 92, 0.1), transparent 28rem),
    linear-gradient(180deg, #fbfcf9 0%, #f5f8f1 100%);
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.background-shape {
  position: fixed; z-index: 0; width: 44rem; height: 15rem;
  border: 2px solid rgba(143, 198, 92, 0.55); border-radius: 50%;
  background: linear-gradient(135deg, rgba(143, 198, 92, 0.16), rgba(255,255,255,0));
  pointer-events: none;
}
.background-shape-left { top: 15%; left: -24rem; transform: rotate(18deg); }
.background-shape-right { right: -22rem; bottom: 8%; transform: rotate(-17deg); }
.page-shell { position: relative; z-index: 1; min-height: 100vh; display: grid; place-items: center; padding: 2.5rem 1.25rem; }
.maintenance-card {
  width: min(100%, 70rem); padding: clamp(2rem, 5vw, 4.25rem); text-align: center;
  background: var(--surface); border: 1px solid rgba(225, 234, 216, 0.9);
  border-radius: 2.25rem; box-shadow: var(--shadow); backdrop-filter: blur(14px);
}
.brand { display: flex; flex-direction: column; align-items: center; }
.brand-logo { display: block; width: min(100%, 31rem); height: auto; }
.brand-divider { width: 5rem; height: 0.2rem; margin-top: 1.75rem; border-radius: 999px; background: linear-gradient(90deg, transparent, var(--brand-green), transparent); }
.intro { max-width: 52rem; margin: 2rem auto 0; }
h1 { margin: 0; color: var(--heading); font-size: clamp(2.2rem, 5vw, 4.1rem); font-weight: 750; line-height: 1.08; letter-spacing: -0.04em; }
h1 span { color: var(--brand-green); }
.intro p { max-width: 43rem; margin: 1.4rem auto 0; font-size: clamp(1.05rem, 2.2vw, 1.35rem); line-height: 1.65; }
.information-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; margin-top: 3.25rem; }
.information-card { position: relative; min-height: 15.5rem; padding: 3.35rem 1.6rem 1.8rem; background: linear-gradient(180deg, #fbfdf8, var(--surface-soft)); border: 1px solid var(--border); border-radius: 1.35rem; }
.icon-badge { position: absolute; top: 0; left: 50%; width: 5.25rem; height: 5.25rem; display: grid; place-items: center; transform: translate(-50%, -45%); background: linear-gradient(180deg, #f5faed, #eaf3df); border: 1px solid rgba(143,198,92,0.12); border-radius: 50%; }
.icon-badge svg { width: 2.9rem; height: 2.9rem; fill: none; stroke: var(--brand-green-dark); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.information-card h2 { margin: 0; color: #164c35; font-size: 1.35rem; line-height: 1.25; }
.information-card p { margin: 0.9rem 0 0; color: var(--text); font-size: 1.03rem; line-height: 1.55; }
.status-note { max-width: 48rem; display: flex; align-items: center; justify-content: center; gap: 0.9rem; margin: 2rem auto 0; padding: 1rem 1.35rem; background: var(--surface-accent); border: 1px solid rgba(143,198,92,0.14); border-radius: 1rem; }
.status-note svg { flex: 0 0 auto; width: 2.15rem; height: 2.15rem; fill: none; stroke: var(--brand-green-dark); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.status-note p { margin: 0; font-size: 0.98rem; line-height: 1.45; }
footer { display: flex; align-items: center; justify-content: center; gap: 0.9rem; margin-top: 1.5rem; color: #6b9b58; }
footer p { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.2rem, 2.3vw, 1.6rem); font-style: italic; }
footer span { color: #a8c994; font-size: 1.7rem; }
@media (max-width: 56rem) { .information-grid { grid-template-columns: 1fr; gap: 3.35rem; } .information-card { min-height: auto; } }
@media (max-width: 40rem) {
  .page-shell { padding: 0; }
  .maintenance-card { min-height: 100vh; padding: 2rem 1.15rem 2.5rem; border: 0; border-radius: 0; box-shadow: none; }
  .brand-logo { width: min(100%, 23rem); }
  h1 { font-size: clamp(2rem, 10vw, 3rem); }
  .intro p { font-size: 1.05rem; }
  .information-grid { margin-top: 3rem; }
  .status-note { align-items: flex-start; text-align: left; }
  .background-shape { display: none; }
}