/*
Theme Name: Centro Ecuestre Real Hipica de Griñon (3.1)
Theme URI: http://www.realhipica.com/
Description: Modern premium theme for Real Hípica de Griñón
Author: Martin Dominguez y Jaime Torrijos
Version: 3.1
License: GNU General Public License
License URI: license.txt
Tags:
*/

/* =============================================================================
   DESIGN TOKENS
   ============================================================================= */

:root {
    /* Palette */
    --ink:          #141412;
    --charcoal:     #252523;
    --stone:        #4a4846;
    --ash:          #7a7774;
    --fog:          #bbb8b3;
    --linen:        #f0ebe2;
    --cream:        #faf8f4;
    --white:        #ffffff;
    --gold:         #9a7520;
    --gold-lt:      #c4991e;
    --gold-pale:    rgba(154, 117, 32, 0.12);
    --link:         #2c4a6e;
    --link-hover:   #9a7520;

    /* Typography */
    --f-display: 'Cormorant Garamond', Georgia, serif;
    --f-body:    'Inter', 'Open Sans', system-ui, -apple-system, sans-serif;
    --f-mono:    'JetBrains Mono', 'Fira Code', 'Courier New', monospace;

    /* Spacing scale */
    --s1:  4px;
    --s2:  8px;
    --s3:  12px;
    --s4:  16px;
    --s5:  24px;
    --s6:  32px;
    --s7:  48px;
    --s8:  64px;
    --s9:  96px;
    --s10: 128px;

    /* Layout */
    --max-prose:   760px;
    --max-content: 1200px;
    --max-wide:    1440px;

    /* Radius */
    --r1: 3px;
    --r2: 6px;
    --r3: 12px;
    --r4: 20px;
    --r-full: 9999px;

    /* Shadow */
    --sh1: 0 1px 2px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.1);
    --sh2: 0 4px 8px rgba(0,0,0,0.07), 0 2px 4px rgba(0,0,0,0.05);
    --sh3: 0 12px 32px rgba(0,0,0,0.10), 0 4px 10px rgba(0,0,0,0.06);
    --sh4: 0 24px 64px rgba(0,0,0,0.14), 0 8px 24px rgba(0,0,0,0.08);

    /* Timing */
    --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in:   cubic-bezier(0.4, 0, 1, 1);
    --t-fast:    180ms;
    --t-mid:     300ms;
    --t-slow:    500ms;

    /* Nav height — used in scroll offsets */
    --nav-h: 60px;
}

/* =============================================================================
   FONT IMPORTS
   ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Inter:wght@300;400;500;600&display=swap');

/* =============================================================================
   RESET & BOX MODEL
   ============================================================================= */

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

html {
    scroll-behavior: smooth;
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
}

body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, address, big, cite, code, del, dfn, em,
font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup,
tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}

body        { line-height: 1; }
ol, ul      { list-style: none; }
blockquote  { quotes: none; }
blockquote::before, blockquote::after { content: ''; }
del         { text-decoration: line-through; }
table       { border-collapse: collapse; border-spacing: 0; }
a img       { border: none; }

/* =============================================================================
   BASE
   ============================================================================= */

body {
    background: var(--cream);
    font-family: var(--f-body);
    font-size: 1rem;
    line-height: 1.75;
    color: var(--stone);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::selection      { background: #c8b88a; color: var(--ink); }
::-moz-selection { background: #c8b88a; color: var(--ink); }

/* Focus ring — accessible but subtle */
:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 3px;
    border-radius: var(--r1);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--f-display);
    font-weight: 500;
    color: var(--ink);
    line-height: 1.2;
    clear: both;
    letter-spacing: -0.01em;
}

p            { margin-bottom: var(--s4); }
strong, b    { font-weight: 600; }
em, cite, i  { font-style: italic; }
abbr         { border-bottom: 1px dotted var(--ash); cursor: help; text-decoration: none; }
ins          { background: #fef9c3; text-decoration: none; padding: 0 2px; }
del          { color: var(--ash); }
sup          { vertical-align: super; font-size: 0.75em; }
sub          { vertical-align: sub; font-size: 0.75em; }

ul {
    list-style: disc;
    padding-left: var(--s2);
    margin: 0 0 var(--s4) 1.5em;
}
ol { list-style: decimal; margin: 0 0 var(--s4) 1.5em; }
ol ol  { list-style: upper-alpha; }
ol ol ol { list-style: lower-roman; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }
dl { margin: 0 0 var(--s5) 0; }
dt { font-weight: 600; }
dd { margin-bottom: var(--s4); }

hr {
    border: none;
    border-top: 1px solid rgba(154, 117, 32, 0.18);
    margin: var(--s6) 0;
    clear: both;
}

pre {
    font-family: var(--f-mono);
    background: var(--ink);
    color: #e8e4dc;
    font-size: 0.875rem;
    line-height: 1.65;
    padding: var(--s5);
    border-radius: var(--r3);
    overflow-x: auto;
    margin-bottom: var(--s4);
}

code {
    font-family: var(--f-mono);
    font-size: 0.875em;
    background: rgba(0,0,0,0.06);
    padding: 0.1em 0.4em;
    border-radius: var(--r1);
}

pre code { background: none; padding: 0; font-size: inherit; }

blockquote {
    border-left: 3px solid var(--gold);
    padding: var(--s4) var(--s6);
    margin: var(--s5) 0;
    color: var(--stone);
    font-style: italic;
    font-family: var(--f-display);
    font-size: 1.15rem;
    background: var(--gold-pale);
    border-radius: 0 var(--r2) var(--r2) 0;
}
blockquote cite, blockquote em, blockquote i { font-style: normal; }

/* Links */
a:link, a:visited {
    color: var(--link);
    text-decoration: none;
    transition: color var(--t-fast) var(--ease-out);
}
a:hover, a:active {
    color: var(--link-hover);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.screen-reader-text { position: absolute; left: -9000px; clip: rect(1px, 1px, 1px, 1px); }

/* =============================================================================
   GLOBAL WRAPPERS
   ============================================================================= */

#global,
#global-full-screen {
    width: 100%;
    position: relative;
    margin: 0 auto;
}

#global-full-screen {
    position: sticky;
    top: 0;
    z-index: 9999;
}

#page, #page-full-screen { width: 100%; }

/* =============================================================================
   SITE HEADER  — logo bar
   ============================================================================= */

.site-header {
    background: var(--white);
    border-top: 3px solid var(--gold);
    padding: var(--s4) var(--s6);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--s4);
}

/* Legacy .top-header keeps working */
.top-header {
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--s4) var(--s6);
    gap: var(--s4);
}

/* Logo */
a.logo {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    line-height: 0;
    position: static !important;
    margin: 0 !important;
    top: auto !important;
}

.logoimg {
    display: block;
    height: auto;
    max-height: 88px;
    width: auto;
}

a.logo-sol { display: none; } /* Not used */

/* =============================================================================
   SOCIAL ICONS — header
   ============================================================================= */

.socialbuttons {
    display: flex;
    align-items: center;
    gap: var(--s2);
    position: static !important;
    float: none !important;
    margin: 0 !important;
}

.socialbuttons a,
.socialbuttonsbottom a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--r-full);
    background: var(--linen);
    transition: background var(--t-fast) var(--ease-out),
                transform var(--t-fast) var(--ease-out);
    flex-shrink: 0;
}

.socialbuttons a:hover,
.socialbuttonsbottom a:hover {
    background: var(--gold-pale);
    transform: translateY(-2px);
    text-decoration: none;
}

.socialbuttons img,
.socialbuttonsbottom img,
img.socialbuttongrow {
    width: 22px;
    height: 22px;
    padding: 0;
    object-fit: contain;
    display: block;
    transition: transform var(--t-fast) var(--ease-out);
}

img.socialbuttongrow:hover { transform: scale(1.08); }

/* =============================================================================
   NAVIGATION  — sticky top bar
   ============================================================================= */

#rhg-navbar,
.bg-menu-nav {
    background-color: var(--charcoal);
    border: none;
    margin: 0;
    min-height: var(--nav-h);
    position: sticky;
    top: -1px;
    z-index: 9999;
}

#rhg-navbar {
    transition: background-color var(--t-mid) var(--ease-out),
                backdrop-filter var(--t-mid) var(--ease-out),
                box-shadow var(--t-mid) var(--ease-out);
}

#rhg-navbar.isSticky {
    background-color: rgba(20, 20, 18, 0.85);
    backdrop-filter: saturate(2) blur(20px);
    -webkit-backdrop-filter: saturate(2) blur(20px);
    box-shadow: 0 1px 0 rgba(154, 117, 32, 0.25),
                0 4px 24px rgba(0,0,0,0.3);
}

/* Nav links */
.navbar-dark .navbar-nav .nav-link,
.bg-menu-nav a,
.nav-link {
    color: rgba(255, 255, 255, 0.78) !important;
    font-family: var(--f-body) !important;
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    text-decoration: none !important;
    padding: 0.45rem 0.9rem !important;
    border-radius: var(--r2);
    transition: color var(--t-fast) var(--ease-out),
                background var(--t-fast) var(--ease-out);
    display: block;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .active .nav-link,
.bg-menu-nav a:hover {
    color: #e8d9b0 !important;
    background: rgba(154, 117, 32, 0.16);
}

.navbar-dark .navbar-nav .active .nav-link {
    color: #e8d9b0 !important;
    background: rgba(154, 117, 32, 0.12);
}

/* Gold accent underline on active */
.navbar-dark .navbar-nav .active .nav-link {
    position: relative;
}
.navbar-dark .navbar-nav .active .nav-link::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 0.9rem;
    right: 0.9rem;
    height: 2px;
    background: var(--gold-lt);
    border-radius: var(--r-full);
}

/* Mobile brand label */
.nav-mobile-brand {
    font-family: var(--f-display);
    font-size: 1.05rem;
    letter-spacing: 0.03em;
    color: rgba(255, 255, 255, 0.9);
    pointer-events: none;
}

/* Hamburger button */
.navbar-toggler {
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: var(--r2);
    padding: 6px 10px;
    transition: border-color var(--t-fast);
}
.navbar-toggler:hover { border-color: rgba(255,255,255,0.5); }

/* Collapsed mobile menu */
@media (max-width: 767px) {
    .navbar-collapse.show,
    .navbar-collapse.collapsing {
        background: var(--charcoal);
        padding: var(--s3) var(--s4) var(--s4);
        border-top: 1px solid rgba(255,255,255,0.06);
    }

    .navbar-dark .navbar-nav .nav-link {
        padding: 0.6rem 1rem !important;
        border-radius: var(--r2);
        margin-bottom: 2px;
    }
}

/* Extra link padding overrides */
.extra-link-padding {
    padding-right: 0.9rem !important;
    padding-left:  0.9rem !important;
}

/* Legacy ul.menu fallback */
ul.menu {
    list-style: none;
    padding: var(--s2) var(--s4);
    width: 100%;
    background-color: var(--charcoal);
    margin: 0;
    z-index: 51;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s1);
}
ul.menu li { display: inline; }
ul.menu li a {
    color: rgba(255,255,255,0.78);
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    text-decoration: none;
    padding: var(--s1) var(--s3);
    border-radius: var(--r2);
    transition: color var(--t-fast);
}
ul.menu li.active a,
ul.menu li a:hover { color: #e8d9b0; }

/* Bootstrap overrides */
.navbar, .navbar-inverse {
    border-radius: 0;
    border: none;
    margin-bottom: 0;
    min-height: var(--nav-h);
}
.nav li { display: inline; color: white; }

/* =============================================================================
   JSSOR SLIDER
   ============================================================================= */

.jssorb05 div,
.jssorb05 div:hover,
.jssorb05 .av {
    background: url(slider/img/b21.png) no-repeat;
    overflow: hidden;
    cursor: pointer;
}
.jssorb05 div             { background-position: -7px -7px; }
.jssorb05 div:hover,
.jssorb05 .av:hover       { background-position: -37px -7px; }
.jssorb05 .av             { background-position: -67px -7px; }
.jssorb05 .dn,
.jssorb05 .dn:hover       { background-position: -97px -7px; }

.jssora11l, .jssora11r, .jssora11ldn, .jssora11rdn {
    position: absolute;
    cursor: pointer;
    display: block;
    background: url(slider/img/a11.png) no-repeat;
    overflow: hidden;
}
.jssora11l  { background-position: -11px -41px; }
.jssora11r  { background-position: -71px -41px; }
.jssora11l:hover { background-position: -131px -41px; }
.jssora11r:hover { background-position: -191px -41px; }
.jssora11ldn { background-position: -251px -41px; }
.jssora11rdn { background-position: -311px -41px; }

/* =============================================================================
   MAIN LAYOUT  — two-column grid
   ============================================================================= */

/* Full-width wrapper around the two columns */
.site-body {
    display: grid;
    grid-template-columns: 1fr min(280px, 30%);
    grid-template-rows: auto;
    gap: 0;
    max-width: var(--max-wide);
    margin: 0 auto;
    align-items: start;
}

/* Single-column pages (no sidebar) */
.site-body--full {
    grid-template-columns: 1fr;
    max-width: var(--max-content);
}

#container {
    min-width: 0; /* prevent grid blowout */
    padding: var(--s6) var(--s6) var(--s9);
}

#content {
    margin: 0;
    max-width: var(--max-prose);
}

/* Full-width content (pages without sidebar) */
.site-body--full #content {
    max-width: var(--max-content);
    padding: var(--s6);
}

/* Old layout compat */
#primary, #secondary {
    float: none;
    overflow: visible;
    margin-top: 0;
    text-align: left;
}

.one-column #content,
.single-attachment #content {
    margin: 0 auto;
    max-width: var(--max-prose);
}

/* =============================================================================
   SIDEBAR
   ============================================================================= */

.site-sidebar {
    padding: var(--s6) var(--s5) var(--s9) var(--s3);
    position: sticky;
    top: calc(var(--nav-h) + var(--s4));
}

/* Archive year nav & search inside sidebar */
.sidebar-nav {
    background: var(--white);
    border: 1px solid rgba(154,117,32,0.15);
    border-radius: var(--r3);
    overflow: hidden;
    box-shadow: var(--sh1);
}

.sidebar-nav__head {
    padding: var(--s3) var(--s4);
    font-family: var(--f-body);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ash);
    border-bottom: 1px solid rgba(154,117,32,0.1);
    background: var(--linen);
}

.sidebar-nav .navbar-nav { flex-direction: column; padding: var(--s2) 0; }
.sidebar-nav .nav-item .nav-link {
    font-size: 0.875rem !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: var(--stone) !important;
    padding: var(--s2) var(--s4) !important;
    background: none;
    border-radius: 0;
    font-weight: 400;
}
.sidebar-nav .nav-item .nav-link:hover {
    color: var(--gold) !important;
    background: var(--gold-pale) !important;
}

.sidebar-search {
    margin-top: var(--s4);
}

/* Archive year dropdown items */
.archive-submenu {
    display: block;
    padding: var(--s2) var(--s4);
    font-size: 0.875rem;
    color: var(--stone);
    text-align: left;
    border-bottom: none;
    transition: background var(--t-fast);
}
.archive-submenu a {
    color: var(--stone);
    display: block;
    transition: color var(--t-fast);
}
.archive-submenu a:hover { color: var(--gold); text-decoration: none; }

/* =============================================================================
   SEARCH FORM
   ============================================================================= */

#searchform,
form.search-form {
    display: flex;
    gap: var(--s2);
    align-items: stretch;
    width: 100%;
}

#searchform .search-field,
.search-field {
    flex: 1;
    min-width: 0;
    padding: var(--s2) var(--s4);
    font-family: var(--f-body);
    font-size: 0.875rem;
    color: var(--ink);
    background: var(--white);
    border: 1px solid var(--fog);
    border-radius: var(--r2);
    transition: border-color var(--t-fast), box-shadow var(--t-fast);
    appearance: none;
}

#searchform .search-field:focus,
.search-field:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(154, 117, 32, 0.14);
}

#searchform button,
.search-submit {
    padding: var(--s2) var(--s4);
    background: var(--gold);
    color: var(--white);
    border: none;
    border-radius: var(--r2);
    font-family: var(--f-body);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--t-fast), transform var(--t-fast);
    display: inline-flex;
    align-items: center;
    gap: var(--s2);
}
#searchform button:hover,
.search-submit:hover {
    background: var(--gold-lt);
    transform: translateY(-1px);
}

/* =============================================================================
   POSTS — general content typography
   ============================================================================= */

#content, #content input, #content textarea {
    color: var(--stone);
    font-size: 1rem;
    line-height: 1.75;
}

#content p, #content ul, #content ol,
#content dd, #content pre, #content hr {
    margin-bottom: var(--s4);
}

#content ul ul, #content ol ol,
#content ul ol, #content ol ul { margin-bottom: 0; }

#content pre, #content kbd, #content tt, #content var {
    font-size: 0.875rem;
    line-height: 1.65;
}

#content code { font-size: 0.875em; }
#content dt, #content th { color: var(--ink); font-weight: 600; }

#content h1 {
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 400;
    /* margin: 0 0 var(--s5);*/ 
    /* line-height: 1.15;*/ 
}
#content h2 {
    font-size: clamp(1.35rem, 2.5vw, 1.75rem);
    font-weight: 500;
    color: var(--ink);
    margin: var(--s6) 0 var(--s4);
}
#content h3 { font-size: 1.25rem; font-weight: 500; margin: var(--s5) 0 var(--s3); }
#content h4 { font-size: 1.1rem; font-weight: 600; margin: var(--s4) 0 var(--s3); }
#content h5, #content h6 {
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--ash);
    margin: var(--s4) 0 var(--s2);
}

/* =============================================================================
   ENTRY TITLES & META
   ============================================================================= */

.entry-title,
h2.entry-title,
.page-title,
.new-entry-title {
    font-family: var(--f-display) !important;
    color: var(--ink) !important;
    font-weight: 500 !important;
}

.new-entry-title { text-align: center; }

h2.entry-title {
    font-size: clamp(1.4rem, 2.5vw, 1.9rem) !important;
    line-height: 1.2 !important;
    margin-top: 0 !important;
    margin-bottom: var(--s3) !important;
    text-decoration: none !important;
}

.page-title {
    font-size: clamp(2rem, 4vw, 3rem) !important;
    text-align: center;
    margin: 0 auto var(--s6);
    max-width: var(--max-prose);
}

.post-title {
    font-family: var(--f-display) !important;
    color: var(--ink) !important;
    font-weight: 500 !important;
}

/* Title links */
.entry-title a:link, .entry-title a:visited,
.page-title a:link,  .page-title a:visited  { color: var(--ink); text-decoration: none; }
.entry-title a:hover, .page-title a:hover    { color: var(--gold); }

/* Meta info */
.entry-meta, .entry-utility {
    color: var(--ash);
    font-size: 0.8rem;
    letter-spacing: 0.03em;
    float: none;
    display: block;
    margin-top: var(--s2);
    clear: both;
}
.entry-meta abbr, .entry-utility abbr { border: none; text-decoration: none; }
.entry-meta a, .entry-utility a { color: var(--ash); }
.entry-meta a:hover, .entry-utility a:hover { color: var(--gold); }

/* Entry content body */
.entry-content, .entry-summary {
    clear: both;
    padding: var(--s3) 0 0;
    text-align: left;
}

.hentry        { margin: 0 0 var(--s6); }
.single .hentry { margin: 0 0 var(--s8); }

/* Edit link */
body.page .edit-link { clear: both; display: block; }

/* Page link (paginated content) */
.page-link {
    clear: both;
    color: var(--ink);
    font-weight: 600;
    margin: 0 0 var(--s5);
}
.page-link a:link, .page-link a:visited {
    background: var(--linen);
    color: var(--stone);
    font-weight: 400;
    padding: 0.3em 0.65em;
    border-radius: var(--r2);
    text-decoration: none;
    transition: background var(--t-fast);
}
.page-link a:hover { background: var(--gold-pale); color: var(--gold); }

/* =============================================================================
   POST CARDS  (loop.php — index view)
   ============================================================================= */

.post-card {
    background: var(--white);
    border: 1px solid rgba(154, 117, 32, 0.13);
    border-radius: var(--r3);
    overflow: hidden;
    box-shadow: var(--sh1);
    transition: box-shadow var(--t-mid) var(--ease-out),
                transform var(--t-mid) var(--ease-out),
                border-color var(--t-mid) var(--ease-out);
    margin-bottom: var(--s5);
}

.post-card:hover {
    box-shadow: var(--sh3);
    transform: translateY(-3px);
    border-color: rgba(154, 117, 32, 0.3);
}

.post-card__body {
    padding: var(--s5) var(--s6);
}

.post-card__footer {
    padding: var(--s3) var(--s6);
    background: var(--linen);
    border-top: 1px solid rgba(154, 117, 32, 0.1);
    font-size: 0.8rem;
    color: var(--ash);
    display: flex;
    align-items: center;
    gap: var(--s4);
}

.post-card__footer a { color: var(--ash); }
.post-card__footer a:hover { color: var(--gold); }

/* Thumbnail inside a card */
.post-card .post-thumbnail {
    width: 100%;
    height: 220px;
    overflow: hidden;
}
.post-card .post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform var(--t-slow) var(--ease-out);
}
.post-card:hover .post-thumbnail img { transform: scale(1.04); }

/* Bootstrap .card overrides (legacy selectors in loop.php) */
.card {
    background: var(--white) !important;
    border: 1px solid rgba(154, 117, 32, 0.13) !important;
    border-radius: var(--r3) !important;
    box-shadow: var(--sh1);
    transition: box-shadow var(--t-mid) var(--ease-out),
                transform var(--t-mid) var(--ease-out),
                border-color var(--t-mid) var(--ease-out);
    overflow: hidden;
    margin-top: 0 !important;
    margin-bottom: var(--s5) !important;
}
.card:hover {
    box-shadow: var(--sh3);
    transform: translateY(-3px);
    border-color: rgba(154, 117, 32, 0.3) !important;
}
.card-body { padding: var(--s5) var(--s6) !important; }
.card-footer {
    background: var(--linen) !important;
    border-top: 1px solid rgba(154, 117, 32, 0.1) !important;
    padding: var(--s3) var(--s6) !important;
    font-size: 0.8rem;
    color: var(--ash);
}
.card-title {
    font-family: var(--f-display) !important;
    font-size: clamp(1.2rem, 2vw, 1.6rem) !important;
    font-weight: 500 !important;
    color: var(--ink) !important;
    line-height: 1.2 !important;
    margin-bottom: var(--s3) !important;
}
.card-title a:link, .card-title a:visited { color: var(--ink); text-decoration: none; }
.card-title a:hover { color: var(--gold); }
.card-text { color: var(--stone); line-height: 1.75; }
.text-muted { color: var(--ash) !important; }

/* =============================================================================
   SINGLE POST  — prose reader view
   ============================================================================= */

.single-post-header {
    max-width: var(--max-prose);
    margin: var(--s7) auto var(--s6);
    text-align: center;
    padding: 0 var(--s4);
}

.single-post-header .new-entry-title {
    font-size: clamp(1.8rem, 4vw, 3rem);
    line-height: 1.1;
    margin-bottom: var(--s4);
}

.single-post-meta {
    color: var(--ash);
    font-size: 0.85rem;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--s4);
    flex-wrap: wrap;
}

.single-post-meta::before,
.single-post-meta::after {
    content: '';
    flex: 1;
    border-top: 1px solid rgba(154, 117, 32, 0.2);
    max-width: 80px;
}

/* =============================================================================
   ASIDES
   ============================================================================= */

.home #content .format-aside p,
.home #content .category-asides p {
    font-size: 0.95rem;
    line-height: 1.7;
    margin-bottom: var(--s3);
}
.home .hentry.format-aside,
.home .hentry.category-asides { padding: 0; }

/* Sticky posts */
.home .sticky {
    background: linear-gradient(135deg, var(--linen), var(--cream));
    border-top: 3px solid var(--gold);
    border-radius: var(--r3);
    padding: var(--s5) var(--s6);
    margin-bottom: var(--s6);
}

/* =============================================================================
   GALLERY (listing format)
   ============================================================================= */

.format-gallery .size-thumbnail img,
.category-gallery .size-thumbnail img {
    border: 4px solid var(--linen);
    border-radius: var(--r2);
}

.format-gallery .gallery-thumb,
.category-gallery .gallery-thumb {
    float: left;
    margin-right: var(--s5);
    margin-top: -4px;
}

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

img.size-auto, img.size-full, img.size-large, img.size-medium, .attachment img {
    max-width: 100%;
    height: auto;
}

.alignleft, img.alignleft   { display: inline; float: left; margin: 4px var(--s5) var(--s4) 0; }
.alignright, img.alignright { display: inline; float: right; margin: 4px 0 var(--s4) var(--s5); }
.aligncenter, img.aligncenter { clear: both; display: block; margin: 0 auto var(--s4); }

.wp-caption {
    background: var(--linen);
    padding: var(--s1);
    border-radius: var(--r2);
    max-width: 100% !important;
    text-align: center;
    margin-bottom: var(--s5);
}
.wp-caption img { margin: 5px 5px 0; border-radius: var(--r1); }
.wp-caption p.wp-caption-text { color: var(--ash); font-size: 0.8rem; margin: 5px; }
.wp-smiley { margin: 0; }

img.shadowlink { transition: box-shadow var(--t-mid) var(--ease-out); }
img.shadowlink:hover { box-shadow: 0 6px 24px rgba(0,0,0,0.2); }

/* Gallery grid */
.gallery { margin: 0 auto var(--s5); }
.gallery .gallery-item {
    float: left;
    text-align: center;
    width: 33%;
    padding: var(--s2);
}
.gallery-columns-2 .gallery-item { width: 50%; }
.gallery-columns-4 .gallery-item { width: 25%; }
.gallery img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: var(--r2);
    border: 2px solid transparent;
    transition: border-color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast);
    display: block;
}
.gallery img:hover {
    border-color: var(--gold);
    box-shadow: 0 8px 24px rgba(0,0,0,0.18);
    transform: scale(1.03);
}
.gallery .gallery-caption { color: var(--ash); font-size: 0.78rem; margin: var(--s2) 0 var(--s4); }
.gallery dl { margin: 0; }
.gallery br+br { display: none; }
#content .attachment img { display: block; margin: 0 auto; }

/* =============================================================================
   TABLES
   ============================================================================= */

#content table {
    width: 100%;
    margin: 0 0 var(--s5);
    text-align: left;
    font-size: 0.9rem;
    border: 1px solid rgba(154,117,32,0.15);
    border-radius: var(--r2);
    overflow: hidden;
}
#content tr th, #content thead th {
    background: var(--linen);
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: var(--s3) var(--s4);
    border-bottom: 1px solid rgba(154,117,32,0.15);
}
#content tr td {
    padding: var(--s2) var(--s4);
    border-bottom: 1px solid rgba(0,0,0,0.04);
    color: var(--stone);
}
#content tr:last-child td { border-bottom: none; }
#content tr:nth-child(even) td { background: rgba(240,235,226,0.4); }

table.tablaborde {
    border-collapse: collapse;
    border: 1px solid rgba(154,117,32,0.2);
    border-radius: var(--r2);
    overflow: hidden;
    width: 100%;
    font-size: 0.9rem;
    margin-bottom: var(--s5);
}
table.tablaborde th,
table.tablaborde td {
    border: 1px solid rgba(154,117,32,0.15);
    padding: var(--s2) var(--s4);
}
td.headerlevel2 { background-color: #dce8f5; vertical-align: middle; }
td.headerlevel1 { background-color: var(--gold); color: var(--white); font-weight: 700; text-align: center; }

/* =============================================================================
   FORMS
   ============================================================================= */

input[type="text"],
input[type="email"],
textarea {
    background: var(--white);
    border: 1px solid var(--fog);
    border-radius: var(--r2);
    padding: var(--s3) var(--s4);
    font-family: var(--f-body);
    font-size: 0.9rem;
    color: var(--ink);
    width: 100%;
    transition: border-color var(--t-fast), box-shadow var(--t-fast);
    appearance: none;
}
input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(154, 117, 32, 0.14);
}

input[type=submit],
button[type=submit] {
    font-family: var(--f-body);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: var(--white);
    background: var(--gold);
    border: none;
    border-radius: var(--r2);
    padding: var(--s3) var(--s5);
    cursor: pointer;
    transition: background var(--t-fast), transform var(--t-fast), box-shadow var(--t-fast);
}
input[type=submit]:hover,
button[type=submit]:hover {
    background: var(--gold-lt);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(154, 117, 32, 0.3);
}
input[type=submit]:active,
button[type=submit]:active { transform: translateY(0); box-shadow: none; }

/* Bootstrap overrides for search btn */
.btn-primary {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
    font-weight: 600 !important;
    border-radius: var(--r2) !important;
    letter-spacing: 0.04em;
}
.btn-primary:hover {
    background-color: var(--gold-lt) !important;
    border-color: var(--gold-lt) !important;
}
.form-control {
    border-radius: var(--r2) !important;
    border-color: var(--fog) !important;
    font-size: 0.9rem !important;
}
.form-control:focus {
    border-color: var(--gold) !important;
    box-shadow: 0 0 0 3px rgba(154, 117, 32, 0.14) !important;
}

/* Contact form table */
table.contactform,
table.contactform tr td { border: none !important; }
table.contactform td { padding-top: 0 !important; padding-bottom: 0 !important; vertical-align: top; }
td.submit { text-align: center; }

/* Entry fieldsets */
.entry-content fieldset {
    border: 1px solid var(--fog);
    border-radius: var(--r3);
    margin: 0 0 var(--s5);
    padding: var(--s5);
}
.entry-content fieldset legend {
    background: var(--white);
    color: var(--ink);
    font-weight: 600;
    padding: 0 var(--s4);
    font-size: 0.9rem;
}

/* =============================================================================
   NAVIGATION — prev/next
   ============================================================================= */

.navigation {
    color: var(--ash);
    font-size: 0.875rem;
    overflow: hidden;
    padding: var(--s4) 0;
}
.navigation a:link, .navigation a:visited { color: var(--ash); text-decoration: none; }
.navigation a:hover { color: var(--gold); }
.nav-previous { float: left; width: 50%; }
.nav-next     { float: right; text-align: right; width: 50%; }
#nav-above    { margin: 0; display: none; }
.paged #nav-above, .single #nav-above { display: block; }
#nav-below    { margin: 0; }

/* =============================================================================
   COMMENTS
   ============================================================================= */

#comments {
    clear: both;
    max-width: var(--max-prose);
    margin-top: var(--s7);
}

#comments .navigation { padding: 0 0 var(--s4); }

h3#comments-title, h3#reply-title {
    font-family: var(--f-display);
    color: var(--ink);
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 0;
}
h3#comments-title { padding: var(--s5) 0; border-top: 1px solid rgba(154,117,32,0.15); }

.commentlist { list-style: none; margin: 0; }
.commentlist li.comment {
    border-bottom: 1px solid rgba(0,0,0,0.06);
    line-height: 1.75;
    margin: 0 0 var(--s5);
    padding: 0 0 var(--s5) 64px;
    position: relative;
}
.commentlist li:last-child { border-bottom: none; margin-bottom: 0; }
.commentlist .avatar { position: absolute; top: 2px; left: 0; border-radius: var(--r-full); }
.comment-author cite { color: var(--ink); font-style: normal; font-weight: 600; }
.comment-author .says { font-style: italic; color: var(--ash); }
.comment-meta { font-size: 0.8rem; margin: 0 0 var(--s3); }
.comment-meta a { color: var(--ash); }
.comment-meta a:hover { color: var(--gold); }
.reply { font-size: 0.8rem; padding: 0 0 var(--s5); }
.reply a, a.comment-edit-link { color: var(--ash); }
.reply a:hover, a.comment-edit-link:hover { color: var(--gold); }
.commentlist .children { list-style: none; margin: 0; }
.commentlist .children li { border: none; margin: 0; }
#comments .pingback {
    border-bottom: 1px solid rgba(0,0,0,0.06);
    margin-bottom: var(--s4);
    padding-bottom: var(--s4);
}
#comments .pingback p { color: var(--ash); font-size: 0.8rem; line-height: 1.5; margin: 0; }

/* Comment form */
#respond {
    border-top: 1px solid rgba(154,117,32,0.15);
    margin: var(--s6) 0;
    overflow: hidden;
    position: relative;
    padding-top: var(--s5);
}
#respond p { margin: 0 0 var(--s3); }
h3#reply-title { margin: 0 0 var(--s4); }
#cancel-comment-reply-link { font-size: 0.8rem; font-weight: normal; }
#respond .required { color: var(--gold); font-weight: 700; }
#respond label { color: var(--ash); font-size: 0.8rem; display: block; margin-bottom: var(--s1); }
#respond input { margin: 0 0 var(--s3); width: 98%; }
#respond textarea { width: 98%; min-height: 120px; }
#respond .form-allowed-tags {
    color: var(--ash);
    font-size: 0.78rem;
    line-height: 1.5;
}
#respond .form-submit { margin: var(--s4) 0; }
#respond .form-submit input { width: auto; }

.nopassword, .nocomments { display: none; }

/* =============================================================================
   AUTHOR INFO BOX
   ============================================================================= */

#entry-author-info {
    background: var(--linen);
    border-top: 3px solid var(--gold);
    border-radius: var(--r3);
    clear: both;
    font-size: 0.9rem;
    line-height: 1.6;
    margin: var(--s6) 0;
    overflow: hidden;
    padding: var(--s5) var(--s6);
    display: flex;
    gap: var(--s5);
    align-items: flex-start;
}
#entry-author-info #author-avatar {
    background: var(--white);
    border: 2px solid var(--fog);
    border-radius: var(--r-full);
    flex-shrink: 0;
    padding: 3px;
}
#entry-author-info #author-avatar img { border-radius: var(--r-full); }
#entry-author-info #author-description { flex: 1; }
#entry-author-info h2 { font-size: 1rem; font-weight: 600; color: var(--ink); margin-bottom: var(--s2); }

/* =============================================================================
   WIDGET AREAS (sidebar)
   ============================================================================= */

#main .widget-area ul { margin-left: 0; padding: 0; }
#main .widget-area ul ul { border: none; margin-left: 1.2em; padding: 0; }
ul.xoxo { list-style: none; }
ul.xoxo li { line-height: 1.6; margin-bottom: 6px; font-size: 0.875rem; }

/* =============================================================================
   AJAX LOAD MORE
   ============================================================================= */

.alm-btn-wrap {
    display: block;
    text-align: center;
    padding: var(--s4) 0 var(--s8);
}
.alm-btn-wrap::after { display: table; clear: both; height: 0; width: 100%; content: ''; }

.alm-btn-wrap .alm-load-more-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 46px;
    padding: 0 var(--s6);
    background: var(--gold);
    color: var(--white);
    border: none;
    border-radius: var(--r-full);
    font-family: var(--f-body);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: background var(--t-fast), transform var(--t-fast), box-shadow var(--t-fast);
    text-decoration: none;
    appearance: none;
    user-select: none;
}
.alm-btn-wrap .alm-load-more-btn:hover,
.alm-btn-wrap .alm-load-more-btn.loading {
    background: var(--gold-lt);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(154, 117, 32, 0.35);
    text-decoration: none;
}
.alm-btn-wrap .alm-load-more-btn:active { transform: translateY(0); }
.alm-btn-wrap .alm-load-more-btn.done   { opacity: 0.2; cursor: default; }
.alm-listing { margin: 0; padding: 0; }
.alm-listing .alm-reveal { outline: 0; }
.alm-listing .alm-reveal::after { display: table; clear: both; height: 0; width: 100%; content: ''; }
.alm-listing > li,
.alm-listing .alm-paging-content > li,
.alm-listing .alm-reveal > li {
    list-style: none;
    margin: 0 0 var(--s6);
    padding: 0 0 0 170px;
    position: relative;
    overflow: hidden;
}
.alm-listing > li.no-img,
.alm-listing .alm-paging-content > li.no-img,
.alm-listing .alm-reveal > li.no-img { padding: 0; }
.alm-listing > li img,
.alm-listing .alm-paging-content > li img,
.alm-listing .alm-reveal > li img { position: absolute; left: 0; top: 0; border-radius: var(--r2); }
.alm-masonry { display: block; overflow: hidden; clear: both; }
.alm-toc { display: flex; width: auto; padding: var(--s2) 0; gap: var(--s2); }
.alm-toc button {
    background: var(--linen);
    border-radius: var(--r-full);
    border: 1px solid var(--fog);
    color: var(--stone);
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 500;
    padding: var(--s2) var(--s4);
    line-height: 1;
    transition: all var(--t-fast);
}
.alm-toc button:hover { border-color: var(--gold); color: var(--gold); }
.alm-toc button:focus { box-shadow: 0 0 0 3px rgba(154,117,32,0.14); outline: none; }

/* =============================================================================
   POST GRID (RT TPG plugin)
   ============================================================================= */

.rt-img-holder { text-align: center; display: table; margin: 0 auto; }
.rt-tpg-container .layout3 .rt-holder .rt-img-holder > a img.rounded,
.layout3 .rt-holder .rt-img-holder .overlay {
    border-radius: 50% !important;
    margin: 0 auto;
}
.rt-tpg-container .layout3 .rt-holder .rt-img-holder:hover .overlay { opacity: 0 !important; }

/* Add link */
a.addlink:link, a.addlink:active, a.addlink:visited {
    padding-right: 22px;
    background: url("images/addlink.png") no-repeat right center;
}

/* Lightbox .light-blurry */
.light-blurry {
    backdrop-filter: saturate(1.5) blur(1em);
    -webkit-backdrop-filter: saturate(1.5) blur(1em);
}

/* reCAPTCHA */
.grecaptcha-badge { display: none; }

/* p.social-links */
p.social-links { width: 100%; text-align: center; line-height: 150px; }

/* =============================================================================
   FOOTER
   ============================================================================= */

#footer {
    width: 100%;
    border-top: 1px solid rgba(154,117,32,0.15);
    padding: var(--s8) var(--s6) var(--s6);
    background: linear-gradient(170deg, #1e1e1c 0%, var(--charcoal) 60%, #141412 100%);
    color: rgba(228, 220, 200, 0.75);
    font-size: 0.875rem;
    line-height: 1.7;
}

.footer-inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--s6);
    max-width: var(--max-content);
    margin: 0 auto var(--s7);
    align-items: start;
}

.footer-col__label {
    display: block;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: var(--s3);
}

.footer-col__title {
    font-family: var(--f-display);
    font-size: 1.2rem;
    font-weight: 400;
    color: rgba(240, 230, 200, 0.95);
    line-height: 1.3;
    margin-bottom: var(--s3);
}

.footer-address {
    color: rgba(200, 185, 154, 0.7);
    font-size: 0.8rem;
    margin-bottom: var(--s3);
}

.footer-phones {
    font-size: 0.85rem;
    color: rgba(228, 220, 200, 0.85);
    line-height: 2;
}

.footer-legal a {
    color: rgba(200, 185, 154, 0.65);
    font-size: 0.8rem;
    display: block;
    line-height: 2.2;
    text-decoration: none;
    transition: color var(--t-fast);
}
.footer-legal a:hover { color: var(--gold-lt); text-decoration: none; }

.footer-bottom {
    border-top: 1px solid rgba(154,117,32,0.12);
    padding-top: var(--s5);
    text-align: center;
    font-size: 0.75rem;
    color: rgba(200,185,154,0.35);
    letter-spacing: 0.04em;
    max-width: var(--max-content);
    margin: 0 auto;
}

/* Footer social row */
.socialbuttonsbottom {
    display: flex;
    align-items: center;
    gap: var(--s3);
    flex-wrap: wrap;
    margin-bottom: var(--s5);
}
.socialbuttonsbottom a {
    background: rgba(255,255,255,0.06);
    width: 44px;
    height: 44px;
    max-width: none;
    flex-grow: 0;
    flex-shrink: 0;
}
.socialbuttonsbottom a:hover { background: rgba(154,117,32,0.2); }
.socialbuttonsbottom img { width: 22px !important; height: 22px !important; filter: brightness(0.85); }
.socialbuttonsbottom a:hover img { filter: brightness(1.1); }

#footer p, #footer a { font-size: 0.875rem; color: rgba(228, 220, 200, 0.75); }
#footer a:hover { color: var(--gold-lt); text-decoration: none; }

/* =============================================================================
   RESPONSIVE — tablet (≤ 1024px)
   ============================================================================= */

@media (max-width: 1024px) {
    .site-body {
        grid-template-columns: 1fr;
    }
    .site-sidebar { display: none; }
    #container { padding: var(--s5) var(--s5) var(--s7); }

    .footer-inner { grid-template-columns: 1fr 1fr; }
}

/* =============================================================================
   RESPONSIVE — mobile (≤ 767px)
   ============================================================================= */

@media (max-width: 767px) {
    :root { --nav-h: 56px; }

    .top-header,
    .site-header {
        padding: var(--s3) var(--s4);
        flex-wrap: wrap;
        gap: var(--s3);
    }

    .socialbuttons { display: none; }

    .logoimg { max-height: 64px; }

    a.logo { margin: 0 !important; position: static !important; }

    a.logo-sol { display: none; }

    ul.menu {
        flex-direction: column;
        gap: 0;
    }
    ul.menu li { display: block; }

    #container { padding: var(--s4) var(--s4) var(--s6); }

    #content { max-width: 100%; }

    .gallery .gallery-item { width: 50%; }
    .gallery-columns-4 .gallery-item { width: 50%; }

    .footer-inner {
        grid-template-columns: 1fr;
        gap: var(--s6);
    }

    #footer { padding: var(--s6) var(--s4) var(--s5); }

    .post-card .post-thumbnail { height: 160px; }
}

/* =============================================================================
   PRINT
   ============================================================================= */

@media print {
    body { background: none !important; color: #000; }
    #rhg-navbar, .socialbuttons, .site-sidebar, #footer,
    #respond, .navigation, .page-link { display: none !important; }
    #container { padding: 0; }
    #content { max-width: none; }
    .entry-content { font-size: 12pt; line-height: 1.6; }
    a[href]::after { content: ' (' attr(href) ')'; font-size: 0.8em; }
    .card, .post-card { box-shadow: none !important; border: 1px solid #ccc !important; }
}