:root {
  --maison-ink: #171714;
  --maison-muted: #66645d;
  --maison-green: #28785a;
  --maison-green-dark: #174a39;
  --maison-ivory: #fbfaf6;
  --maison-paper: #fffefa;
  --maison-line: rgba(23, 23, 20, 0.12);
}

html { scroll-behavior: smooth; }
body {
  color: var(--maison-ink) !important;
  background:
    radial-gradient(circle at 88% 8%, rgba(32, 188, 174, 0.1), transparent 27rem),
    var(--maison-ivory) !important;
  font-family: "Gill Sans", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Apple SD Gothic Neo", "PingFang TC", sans-serif !important;
  -webkit-font-smoothing: antialiased;
}

.container { max-width: 1220px !important; padding-inline: 24px !important; }
.header {
  background: rgba(255, 255, 252, 0.94) !important;
  border-bottom: 1px solid rgba(23, 23, 20, 0.08) !important;
  backdrop-filter: blur(18px);
}
.header-content { min-height: 78px; padding-block: 10px !important; }
.logo-link, .footer-logo-link { gap: 11px !important; }
.logo-icon { width: 42px !important; height: 42px !important; border-radius: 12px !important; }
.logo-text, .footer-text {
  color: var(--maison-ink) !important;
  font-family: inherit !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
}
.nav { display: flex; align-items: center; gap: 4px; }
.nav-link {
  color: #47463f !important;
  border-radius: 999px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
}
.nav-link:hover, .nav-link:focus-visible { color: var(--maison-green) !important; background: #eef7f3 !important; }
.nav-download-button { margin-left: 8px; }
.nav-download-icon { height: 40px !important; }

.main-content { padding: 132px 0 84px !important; }
.main-content .content-wrapper {
  max-width: 920px !important;
  padding: clamp(28px, 5vw, 68px) !important;
  border: 1px solid var(--maison-line);
  border-radius: 32px;
  background: rgba(255, 254, 250, 0.96);
  box-shadow: 0 26px 70px rgba(40, 34, 25, 0.08);
}
.main-content .content-wrapper::before {
  content: "MAISON.DOG / INFORMATION";
  display: block;
  margin-bottom: 14px;
  color: var(--maison-green);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.16em;
}
.main-content .page-title {
  margin: 0 0 12px !important;
  color: var(--maison-ink) !important;
  font-size: clamp(2.1rem, 5vw, 3.8rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.045em;
  line-height: 1.15 !important;
}
.last-updated { margin-bottom: 38px !important; color: var(--maison-muted); font-size: 0.82rem; }
.main-content .content-section {
  margin: 0 !important;
  padding: 28px 0 !important;
  border-top: 1px solid var(--maison-line);
}
.main-content .content-section:first-of-type { border-top: 0; }
.main-content .content-section h2 {
  margin: 0 0 14px !important;
  color: var(--maison-green-dark) !important;
  font-size: clamp(1.25rem, 2.5vw, 1.65rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em;
}
.main-content .content-section h3 { color: var(--maison-ink) !important; }
.main-content .content-section p,
.main-content .content-section li,
.main-content .content-section dd,
.main-content .content-section td {
  color: #4f4d47 !important;
  line-height: 1.85 !important;
}
.main-content .content-section a {
  color: var(--maison-green-dark);
  font-weight: 700;
  overflow-wrap: anywhere;
  text-underline-offset: 3px;
}
.main-content .content-section ul,
.main-content .content-section ol { padding-left: 0.4em; }
.main-content .content-section li::marker { color: var(--maison-green); }
.faq-item {
  margin: 12px 0 !important;
  padding: 18px 20px !important;
  border: 1px solid var(--maison-line);
  border-radius: 18px;
  background: #fff;
}
.faq-item h3 { margin-top: 0 !important; color: var(--maison-green-dark) !important; }
details.app-appendix {
  border-color: var(--maison-line) !important;
  border-radius: 18px !important;
  background: #f4f7f5 !important;
}

#contact-form {
  max-width: none !important;
  padding: clamp(20px, 4vw, 34px) !important;
  border-color: var(--maison-line) !important;
  border-radius: 22px !important;
  box-shadow: none !important;
}
#contact-form label { color: var(--maison-ink) !important; }
#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form textarea {
  border-color: var(--maison-line) !important;
  border-radius: 13px !important;
  background: var(--maison-paper) !important;
  font-family: inherit !important;
}
#contact-form input:focus,
#contact-form textarea:focus {
  border-color: var(--maison-green) !important;
  box-shadow: 0 0 0 3px rgba(40, 120, 90, 0.13) !important;
}
#contact-form .btn,
.main-content .btn {
  min-height: 48px;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--maison-green) !important;
  color: #fff !important;
  font-family: inherit !important;
  font-weight: 700 !important;
  box-shadow: 0 12px 28px rgba(40, 120, 90, 0.2);
}

.footer {
  padding: 46px 0 !important;
  border-top: 1px solid var(--maison-line) !important;
  background: #fff !important;
}
.footer-content { max-width: 960px !important; }
.footer-icon { width: 30px !important; height: 30px !important; border-radius: 8px !important; }
.footer-link, .footer-copyright { color: #716f68 !important; }
.footer-link { font-weight: 600; }
.footer-link:hover, .footer-link:focus-visible { color: var(--maison-green) !important; }

@media (max-width: 720px) {
  .container { padding-inline: 16px !important; }
  .header-content { min-height: 68px; }
  .logo-icon { width: 38px !important; height: 38px !important; }
  .logo-text { font-size: 0.95rem !important; }
  .nav { gap: 0; }
  .nav-link { padding-inline: 8px !important; font-size: 0.72rem !important; }
  .nav-download-button { display: none !important; }
  .main-content { padding: 100px 0 50px !important; }
  .main-content .content-wrapper { padding: 28px 22px !important; border-radius: 24px; }
  .main-content .page-title { font-size: 2.15rem !important; overflow-wrap: anywhere; }
  .footer-links { gap: 15px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; }
}
