/* Brand tokens for Surgical Dermatology.
   Values measured from this site's own rendered pages; the component
   stylesheets consume these so the shared library follows this brand. */

:root {
    --aqua-font-display: Baskervville; /* display / headings */
    --aqua-font-heading: Baskervville; /* section headings */
    --aqua-font-body:    Roboto; /* body copy */
    --aqua-almost-black: #303133; /* primary dark text */
    --aqua-border-dark:  rgba(48, 49, 51, 0.15); /* hairline rules */
    --aqua-blue:         #a95a18; /* primary accent (copper) */
    --aqua-blue-gray:    #2a5962; /* deep accent */
    --aqua-light-blue:   #fffcf7; /* tinted section background (cream) */
    --aqua-shell:        #fffcf7; /* "Primary/Shell White" in the brand sheet */
    --aqua-blue-gray-dk: #1d3f46; /* deep accent, one step down — button outlines */
    --aqua-light-gray:   #f0f0f0; /* neutral surface */
    --aqua-white:        #ffffff; /* light text / surface */
    --aqua-orange:       #a95a18; /* hover accent */
    --aqua-rose:         #8a4a14; /* secondary hover accent */
    --aqua-yellow:       #ffd154; /* rating stars (brand neutral) */

    --aqua-px: 116px; /* section inline padding */
    --aqua-py: 120px; /* section block padding */
}

@media (max-width: 1100px) {
    :root {
        --aqua-px: 60px;
    }
}

@media (max-width: 768px) {
    :root {
        --aqua-px: 24px;
        --aqua-py: 72px;
    }
}