/* Base reset & typography */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 16px; line-height: 1.65; color: #1A2332; background-color: #FAFAF8; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
h1, h2, h3, h4, h5, h6 { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: 700; line-height: 1.12; color: #1A2332; }
p { line-height: 1.65; }

/* Wrapper */
.wrapper { width: 100%; min-height: 100vh; overflow: hidden; }

/* Screen reader only */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }

/* Content container */
.container { max-width: 1080px; margin: 0 auto; padding: 0 24px; }

/* Section divider — gold bar, homepage only */
.section-divider { width: 40px; height: 3px; background: #C8A951; margin: 24px auto; border: none; border-radius: 2px; }
.section-divider--flush { margin-top: 0; }

/* Visibility utility for JS toggling */
.hidden { display: none; }

/* Body links */
.body-link { color: #C8A951; text-decoration: underline; transition: color 0.2s; }
.body-link:hover { color: #A88B3D; }

/* Back to top */
.back-to-top { position: fixed; bottom: 32px; right: 32px; width: 44px; height: 44px; border-radius: 50%; border: none; background: #1A2332; color: #FAFAF8; display: flex; align-items: center; justify-content: center; font-size: 19px; box-shadow: 0 4px 16px rgba(26, 35, 50, 0.18); opacity: 0; visibility: hidden; cursor: pointer; transition: opacity 0.3s, visibility 0.3s, background 0.25s, transform 0.25s; z-index: 90; }
.back-to-top.visible { opacity: 1; visibility: visible; }
.back-to-top:hover { background: #C8A951; color: #FFFFFF; transform: translateY(-3px); }
.back-to-top:focus { outline: 2px solid #C8A951; outline-offset: 2px; }

/* Entrance animations */
.animate-in { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; }
.animate-in.visible { opacity: 1; transform: translateY(0); }
.animate-in-delay-1 { transition-delay: 0.12s; }
.animate-in-delay-2 { transition-delay: 0.24s; }
.animate-in-delay-3 { transition-delay: 0.36s; }
.animate-in-delay-4 { transition-delay: 0.48s; }

/* Trust badge — small green indicator */
.trust-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.8px; color: #2A7D5F; }
.trust-badge svg { flex-shrink: 0; }

/* Gold pill */
.gold-pill { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; padding: 4px 12px; border-radius: 50px; background: rgba(200, 169, 81, 0.1); color: #A88B3D; }

/* Green pill */
.green-pill { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; padding: 4px 12px; border-radius: 50px; background: rgba(42, 125, 95, 0.08); color: #2A7D5F; }

/* Callout box — gold-tinted */
.callout { background: rgba(200, 169, 81, 0.08); border-left: 3px solid #C8A951; border-radius: 0 8px 8px 0; padding: 20px 24px; margin: 28px 0; }
.callout p { font-size: 15px; line-height: 1.65; color: #1A2332; }
.callout p strong { font-weight: 700; }

@media (max-width: 480px) {
  .container { padding: 0 16px; }
}
