/*
Theme Name: AmeriGA
Theme URI: https://ameriga.com
Author: AmeriGA
Author URI: https://ameriga.com
Description: The AmeriGA design system as a theme — minimal, monochrome, hairline-ruled. Extends the look of the AmeriGA homepage to posts, pages, archives, and search. Pairs with the AmeriGA Homepage plugin, which supplies products, the blueprint tool, legal pages, and the sitemap.
Version: 1.1.4
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ameriga
Tags: minimal, business, one-column, block-styles, wide-blocks, custom-menu
*/

/* ==========================================================================
   Design tokens
   Declared on :root so the theme stands alone if the plugin is deactivated.
   Identical values to the plugin's component library — one system, two files.
   ========================================================================== */

:root {
    --agm-bg: #fdfdfc;
    --agm-surface: #ffffff;
    --agm-ink: #16181d;
    --agm-muted: #5c6270;
    --agm-faint: #9aa0ad;
    --agm-line: #e4e5e8;
    --agm-line-strong: #16181d;
    --agm-radius: 10px;
    --agm-max: 1080px;
    --agm-read: 44rem;
    --agm-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --agm-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* ==========================================================================
   Base
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    background: var(--agm-bg);
    color: var(--agm-ink);
    font-family: var(--agm-sans);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* The .agm wrapper carries the token scope the plugin's components expect and
   gives every page a sticky footer. Redeclared here so the theme works alone. */
.agm {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--agm-bg);
}

.agm a { color: inherit; text-decoration: none; }

img, video, canvas, svg, iframe { max-width: 100%; height: auto; }

:focus-visible {
    outline: 2px solid var(--agm-ink);
    outline-offset: 2px;
}

.screen-reader-text {
    border: 0;
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}
.screen-reader-text:focus {
    clip-path: none;
    height: auto;
    width: auto;
    display: block;
    top: 8px;
    left: 8px;
    z-index: 100000;
    padding: 12px 20px;
    background: var(--agm-ink);
    color: #fff;
    font-family: var(--agm-mono);
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

/* ==========================================================================
   Layout
   ========================================================================== */

.agm-main { flex: 1; width: 100%; }

.agm-wrap {
    max-width: var(--agm-read);
    margin: 0 auto;
    padding: 0 28px;
    width: 100%;
}
.agm-wrap-wide {
    max-width: var(--agm-max);
    margin: 0 auto;
    padding: 0 28px;
    width: 100%;
}

.agm-section { padding: 56px 0 72px; }

/* ==========================================================================
   Page & post headers
   The mono eyebrow carries real metadata (date, category) — not decoration.
   ========================================================================== */

.agm-head {
    padding: 56px 0 0;
    border-bottom: 1px solid var(--agm-line-strong);
    margin-bottom: 34px;
}
.agm-eyebrow {
    font-family: var(--agm-mono);
    font-size: 11px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--agm-faint);
    margin-bottom: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
}
.agm-eyebrow a { color: var(--agm-faint); }
.agm-eyebrow a:hover { color: var(--agm-ink); }

.agm-title {
    font-size: clamp(28px, 4.2vw, 40px);
    font-weight: 600;
    letter-spacing: -.025em;
    line-height: 1.08;
    margin: 0 0 14px;
    color: var(--agm-ink);
}
.agm-title-sm { font-size: clamp(24px, 3vw, 30px); }

.agm-lead {
    font-size: 16.5px;
    color: var(--agm-muted);
    margin: 0 0 26px;
    max-width: 38rem;
}

/* ==========================================================================
   Article body
   ========================================================================== */

.agm-article {
    font-size: 17px;
    line-height: 1.72;
    color: var(--agm-ink);
    padding-bottom: 56px;
}
.agm-article > * { margin-top: 0; margin-bottom: 1.15em; }
.agm-article > *:last-child { margin-bottom: 0; }

.agm-article h2,
.agm-article h3,
.agm-article h4 {
    font-weight: 600;
    letter-spacing: -.015em;
    line-height: 1.22;
    color: var(--agm-ink);
    margin-top: 1.9em;
    margin-bottom: .55em;
}
.agm-article h2 { font-size: 25px; padding-top: .6em; border-top: 1px solid var(--agm-line); }
.agm-article h3 { font-size: 20px; }
.agm-article h4 { font-size: 17px; }

.agm-article a {
    color: var(--agm-ink);
    border-bottom: 1px solid var(--agm-ink);
    transition: color .15s ease, border-color .15s ease;
}
.agm-article a:hover { color: var(--agm-muted); border-color: var(--agm-muted); }

.agm-article ul, .agm-article ol { padding-left: 1.25em; }
.agm-article li { margin-bottom: .45em; }

.agm-article blockquote {
    margin-left: 0;
    margin-right: 0;
    padding: 4px 0 4px 22px;
    border-left: 2px solid var(--agm-ink);
    color: var(--agm-muted);
    font-size: 17px;
}
.agm-article blockquote p:last-child { margin-bottom: 0; }

.agm-article code,
.agm-article kbd {
    font-family: var(--agm-mono);
    font-size: .875em;
    background: #f4f4f2;
    border: 1px solid var(--agm-line);
    padding: 1px 5px;
}
.agm-article pre {
    font-family: var(--agm-mono);
    font-size: 13px;
    line-height: 1.6;
    background: #f4f4f2;
    border: 1px solid var(--agm-line);
    padding: 16px 18px;
    overflow-x: auto;
}
.agm-article pre code { background: none; border: 0; padding: 0; font-size: inherit; }

.agm-article hr {
    border: 0;
    border-top: 1px solid var(--agm-line-strong);
    margin: 2.4em 0;
}

.agm-article table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14.5px;
}
.agm-article th, .agm-article td {
    text-align: left;
    padding: 9px 12px 9px 0;
    border-bottom: 1px solid var(--agm-line);
}
.agm-article th {
    font-family: var(--agm-mono);
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--agm-faint);
    font-weight: 500;
    border-bottom-color: var(--agm-line-strong);
}

.agm-article figure { margin-left: 0; margin-right: 0; }
.agm-article figcaption,
.wp-caption-text {
    font-family: var(--agm-mono);
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--agm-faint);
    margin-top: 9px;
}

.agm-featured { margin-bottom: 30px; }
.agm-featured img { display: block; width: 100%; }

/* WordPress alignment + block support */
.alignleft { float: left; margin: .3em 1.6em 1em 0; }
.alignright { float: right; margin: .3em 0 1em 1.6em; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.agm-article .alignwide {
    max-width: var(--agm-max);
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: 28px;
    padding-right: 28px;
}
.agm-article .alignfull {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    max-width: 100vw;
}
.wp-block-image img { display: block; }
.sticky .agm-index-title::after {
    content: "Pinned";
    font-family: var(--agm-mono);
    font-size: 9px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--agm-faint);
    border: 1px solid var(--agm-line);
    padding: 1px 5px;
    margin-left: 10px;
    vertical-align: middle;
}

/* ==========================================================================
   Index / archive
   Articles are hairline-ruled index rows, not cards. Cards are reserved for
   products, so the two content types stay visually distinct.
   ========================================================================== */

.agm-index { border-top: 1px solid var(--agm-line-strong); }

.agm-index-item {
    display: grid;
    grid-template-columns: 108px 1fr;
    gap: 22px;
    padding: 22px 0;
    border-bottom: 1px solid var(--agm-line);
}
.agm-index-meta {
    font-family: var(--agm-mono);
    font-size: 11px;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--agm-faint);
    padding-top: 4px;
    line-height: 1.5;
}
.agm-index-title {
    font-size: 19px;
    font-weight: 600;
    letter-spacing: -.015em;
    line-height: 1.25;
    margin: 0 0 6px;
}
.agm-index-title a { transition: color .15s ease; }
.agm-index-title a:hover { color: var(--agm-muted); }
.agm-index-excerpt {
    font-size: 14.5px;
    color: var(--agm-muted);
    margin: 0;
    max-width: 40rem;
}
.agm-index-more {
    display: inline-block;
    margin-top: 10px;
    font-family: var(--agm-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--agm-ink);
    border-bottom: 1.5px solid var(--agm-ink);
    padding-bottom: 2px;
}
.agm-index-more:hover { color: var(--agm-muted); border-color: var(--agm-muted); }

/* Empty states are invitations to act, not apologies. */
.agm-empty { padding: 40px 0 64px; }
.agm-empty p { color: var(--agm-muted); font-size: 15.5px; max-width: 34rem; }

/* ==========================================================================
   Breadcrumbs & network link
   On app installs the trail starts at the parent site, so the relationship is
   visible in the page and not only in structured data.
   ========================================================================== */

.agm-crumbs {
    max-width: var(--agm-max);
    margin: 0 auto;
    padding: 20px 28px 0;
    font-family: var(--agm-mono);
    font-size: 11px;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--agm-faint);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.agm-crumbs a { color: var(--agm-muted); transition: color .15s ease; }
.agm-crumbs a:hover { color: var(--agm-ink); }
.agm-crumbs-sep { color: var(--agm-faint); }
.agm-crumbs [aria-current="page"] {
    color: var(--agm-ink);
    max-width: 24rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.agm-network-note {
    padding: 0 28px 28px;
    text-align: center;
}
.agm-network-note a {
    font-family: var(--agm-mono);
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--agm-faint);
    border-bottom: 1px solid var(--agm-line);
    padding-bottom: 2px;
    transition: color .15s ease, border-color .15s ease;
}
.agm-network-note a:hover { color: var(--agm-ink); border-color: var(--agm-ink); }

/* ==========================================================================
   Pagination & post navigation
   ========================================================================== */

.agm-pagination {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding: 34px 0 0;
    font-family: var(--agm-mono);
    font-size: 12px;
    letter-spacing: .06em;
}
.agm-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 9px;
    border: 1px solid var(--agm-line);
    color: var(--agm-muted);
    transition: border-color .15s ease, color .15s ease;
}
.agm-pagination .page-numbers:hover { border-color: var(--agm-ink); color: var(--agm-ink); }
.agm-pagination .page-numbers.current {
    background: var(--agm-ink);
    border-color: var(--agm-ink);
    color: #fff;
}

.agm-postnav {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    border-top: 1px solid var(--agm-line-strong);
    padding: 24px 0 0;
}
.agm-postnav-item { max-width: 46%; }
.agm-postnav-item.is-next { text-align: right; margin-left: auto; }
.agm-postnav-label {
    display: block;
    font-family: var(--agm-mono);
    font-size: 10px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--agm-faint);
    margin-bottom: 5px;
}
.agm-postnav-title { font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.agm-postnav-title:hover { color: var(--agm-muted); }

/* ==========================================================================
   Search form
   ========================================================================== */

.agm-search {
    display: flex;
    gap: 0;
    max-width: 30rem;
    border: 1px solid var(--agm-line-strong);
}
.agm-search input[type="search"] {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    padding: 11px 14px;
    font-family: inherit;
    font-size: 14.5px;
    color: var(--agm-ink);
}
.agm-search input[type="search"]:focus { outline: none; }
.agm-search:focus-within { outline: 2px solid var(--agm-ink); outline-offset: 2px; }
.agm-search button {
    border: 0;
    background: var(--agm-ink);
    color: #fff;
    font-family: var(--agm-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 0 16px;
    cursor: pointer;
}
.agm-search button:hover { background: var(--agm-muted); }

/* ==========================================================================
   Comments
   ========================================================================== */

.agm-comments { border-top: 1px solid var(--agm-line-strong); padding: 34px 0 56px; }
.agm-comments-title {
    font-family: var(--agm-mono);
    font-size: 11px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--agm-faint);
    margin: 0 0 22px;
}
.agm-comments .comment-list { list-style: none; margin: 0; padding: 0; }
.agm-comments .comment-list li { padding: 18px 0; border-bottom: 1px solid var(--agm-line); }
.agm-comments .comment-list .children { list-style: none; padding-left: 24px; }
.agm-comments .comment-meta {
    font-family: var(--agm-mono);
    font-size: 11px;
    letter-spacing: .06em;
    color: var(--agm-faint);
    margin-bottom: 7px;
}
.agm-comments .comment-author .fn { font-style: normal; font-weight: 600; color: var(--agm-ink); }
.agm-comments .comment-content { font-size: 15px; }
.agm-comments .avatar { display: none; }
.agm-comments .reply a {
    font-family: var(--agm-mono);
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--agm-muted);
    border-bottom: 1px solid var(--agm-line);
}
.agm-comments .reply a:hover { color: var(--agm-ink); border-color: var(--agm-ink); }

.agm-comments input[type="text"],
.agm-comments input[type="email"],
.agm-comments input[type="url"],
.agm-comments textarea {
    width: 100%;
    max-width: 34rem;
    border: 1px solid var(--agm-line-strong);
    background: var(--agm-surface);
    padding: 10px 13px;
    font-family: inherit;
    font-size: 15px;
    color: var(--agm-ink);
}
.agm-comments label {
    display: block;
    font-family: var(--agm-mono);
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--agm-faint);
    margin-bottom: 5px;
}
.agm-comments .form-submit input[type="submit"] {
    border: 0;
    background: var(--agm-ink);
    color: #fff;
    font-family: var(--agm-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 11px 20px;
    cursor: pointer;
}
.agm-comments .form-submit input[type="submit"]:hover { background: var(--agm-muted); }

/* ==========================================================================
   404
   ========================================================================== */

.agm-404-code {
    font-family: var(--agm-mono);
    font-size: 58px;
    font-weight: 600;
    letter-spacing: -.03em;
    line-height: 1;
    color: var(--agm-ink);
    margin: 0 0 16px;
}

/* ==========================================================================
   Responsive & motion
   ========================================================================== */

@media (max-width: 720px) {
    .agm-wrap, .agm-wrap-wide { padding: 0 20px; }
    .agm-crumbs { padding: 16px 20px 0; }
    .agm-crumbs [aria-current="page"] { max-width: 14rem; }
    .agm-section { padding: 40px 0 56px; }
    .agm-head { padding-top: 40px; }
    .agm-article { font-size: 16.5px; }
    .agm-index-item { grid-template-columns: 1fr; gap: 8px; }
    .agm-index-meta { padding-top: 0; }
    .agm-postnav-item, .agm-postnav-item.is-next { max-width: 100%; text-align: left; margin-left: 0; }
    .agm-article .alignwide, .agm-article .alignfull { margin-left: 0; margin-right: 0; padding: 0; max-width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}
