/*
===========================================================
 Governance Publishing
 Theme CSS
 Baseline 0.1
===========================================================

This file defines the visual identity shared by every
publication produced by Governance Publishing.

It intentionally contains only global variables and
fundamental rules.

Component-specific rules belong to:

- layout.css
- book.css
- components.css

===========================================================
*/

/* =======================================================
   COLOR PALETTE
   ======================================================= */

:root {

    /* Background */
    --gp-background: #e9e4d8;
    --gp-paper: #fffdf7;

    /* Typography */
    --gp-text: #241f1a;
    --gp-text-light: #6f675d;

    /* Identity */
    --gp-accent: #9a6f35;

    /* Borders */
    --gp-border: rgba(36,31,26,.14);

    /* Shadows */
    --gp-shadow:
        0 18px 50px rgba(90,70,40,.14);

    /* Layout */
    --gp-page-width: 920px;

    --gp-radius: 0;

    --gp-transition: .25s ease;
}

/* =======================================================
   GLOBAL RESET
   ======================================================= */

*,
*::before,
*::after {

    box-sizing: border-box;

}

html {

    scroll-behavior: smooth;

}

body {

    margin: 0;

    padding: 0;

    background: var(--gp-background);

    color: var(--gp-text);

    font-family:

        -apple-system,

        BlinkMacSystemFont,

        "Segoe UI",

        sans-serif;

    line-height: 1.75;

    text-rendering: optimizeLegibility;

}

/* =======================================================
   TYPOGRAPHY
   ======================================================= */

h1,
h2,
h3,
h4,
h5 {

    font-family:

        Georgia,

        "Times New Roman",

        serif;

    font-weight: 400;

    line-height: 1.15;

    color: var(--gp-text);

}

p {

    margin-top: 1.2rem;

    margin-bottom: 1.2rem;

}

a {

    color: inherit;

    text-decoration: none;

    border-bottom:

        1px solid transparent;

    transition:

        border-color var(--gp-transition),

        color var(--gp-transition);

}

a:hover {

    color: var(--gp-accent);

    border-bottom-color: var(--gp-accent);

}

/* =======================================================
   IMAGES
   ======================================================= */

img {

    max-width: 100%;

    display: block;

}

/* =======================================================
   SELECTION
   ======================================================= */

::selection {

    background: var(--gp-accent);

    color: white;

}

/* =======================================================
   HORIZONTAL RULE
   ======================================================= */

hr {

    border: none;

    border-top:

        1px solid var(--gp-border);

    margin: 3rem 0;

}

/* =======================================================
   BLOCKQUOTES
   ======================================================= */

blockquote {

    margin: 2rem 0;

    padding-left: 1.5rem;

    border-left:

        3px solid var(--gp-accent);

    font-style: italic;

    color: #3f3b36;

}

/* =======================================================
   RESPONSIVE
   ======================================================= */

@media (max-width: 900px) {

    body {

        font-size: .98rem;

    }

}

@media (prefers-reduced-motion: reduce) {

    * {

        transition: none !important;

        animation: none !important;

        scroll-behavior: auto;

    }

}