* { margin: 0; padding: 0; box-sizing: border-box; }
.custom-page {
            background-image: radial-gradient(ellipse at top left, #6699FF, #6666CC, #00CCFF);
            min-height: 100vh;
            padding: 20px;
            max-width: 100%; }
.header { background-image: radial-gradient(ellipse at top left, #6699FF, #6666CC, #00CCFF);
            color: white;
            padding: 30px;
            border-radius: 12px 12px 0 0; /* TL TR BR BL */
            text-align: center; }
.header h1 { font-size: 2.0rem;
            margin-bottom: 10px; padding: 4px;
            font-weight: 700;
            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); }
.header p { font-size: 1.0rem; opacity: 0.9; }
.custom-container {
            margin: 0 auto;
            font-family: 'Arial', sans-serif;
            background: #f9f9f9;
            border-radius: 20px;
            padding: 20px;
            box-shadow: 0 5px 10px 3px rgba(0,0,0,0.2); }
.custom-content {
	    display: flex;
            flex-direction: column;
            align-items: left; /* only effective inside a flex */
            justify-content: left; /* only effective inside a flex */
            text-align: left;
	    background: #fcfcf7;
	    margin: 10px auto;
            padding: 40px; }
#copyright { white-space: nowrap; font-size: 0.7em; text-align: right; padding-right: 10px; color: darkgrey; }
.floating-tooltip {
            position: absolute;
            top: 25px; right: 25px;
            z-index: 100;
            font-family: sans-serif; }
.floating-tooltip:hover .tooltip-text { visibility: visible; }
.tooltip-icon {
            cursor: pointer;
            font-size: 40px;
            color: orange; 
            text-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5); /* offset-x | offset-y | blur-radius | color */
}
.tooltip-text {
            visibility: hidden;
            width: 180px;
            background-color: rgba(0,0,0,0.85);
            color: #fff;
            text-align: left;
            padding: 8px;
            border-radius: 5px;
            position: absolute;
            top: 25px; right: 10px;
            font-size: 12px;
            line-height: 1.3; }
blockquote {
  background: linear-gradient(135deg, #e8f4ff, #f0f8ff);
  border-left: 5px solid #2196F3; 
  border-radius: 10px; text-align: left;
  margin: 1.2em 0; /* Vertical margin for spacing, no horizontal margin */
  padding: 0.5em 1em; 
  font-style: italic; 
  color: #0E5077;
  line-height: 1.4; }
blockquote:before { color: #E73D50;
  font-family: Georgia, "Times New Roman", serif;
  content: open-quote;
  font-size: 4.6em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em; }
blockquote p { display: inline; }

.faq { padding: 20px; margin: 14px;}

i.fa-check-square-o, i.fa-square-o { color: green; }
i { padding-right:8px; }

.cta-seo, .cta-white { display: block; 
    margin: 8px; font-size: 1.3em; 
    font-weight: 700; justify-content: center; 
    text-align: left; text-decoration: none;
    color: white !important; 
    border: none; cursor: pointer; 
    padding: 6px 8px; border-radius: 8px; opacity: 1 !important; /* Make it explicit */}
.cta-seo { background: #CC5500 !important; }
.cta-white { background: #3D8B40; }
.cta-seo:hover, .cta-white:hover { background-color: #0E5077 !important; color: #FFFF00 !important; transform: scale(1.1); box-shadow: 5px 5px 10px 3px rgba(0, 0, 0, 0.5); }

         /* Generic links - exclude CTA buttons */
a:not(.cta-seo):not(.cta):not(.cta-white):not(.skip-link) {
    display: block; color: #0056b3;
    text-decoration: none; }

a:not(.cta-seo):not(.cta):not(.cta-white):not(.skip-link):hover {
    color: #007300;
    text-decoration: underline; }

         /* ADA: Enhanced focus visibility */
a:focus, button:focus { outline: 3px solid #ff8c00; outline-offset: 2px; }
nav.breadcrumb { font-size: 0.7em; margin: 0px; display: flex; gap: 5px; white-space: nowrap; padding: 2px; }
nav.breadcrumb a { color: #0056b3; text-decoration: none; }
nav.breadcrumb a:hover { color: #01447e; text-decoration: underline; }
        /* ADA: Skip to main content link */
.skip-link:focus { top: 0; }
.skip-link { position: absolute;
  top: -40px; left: 0; background: #000;
  color: #fff; padding: 8px; text-decoration: none; z-index: 100; }