/*
Theme Name: Sofia Garden
Theme URI: https://sofiagardens.com/
Author: Sofia Garden
Description: Responsive adaptation of Sofia Garden's original garden panorama, burgundy brand panel, gold navigation and green sidebar.
Version: 1.0.2
Requires at least: 6.2
Requires PHP: 8.0
Text Domain: sofiagarden
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

:root {
  --sg-burgundy: #672145;
  --sg-burgundy-dark: #4f1834;
  --sg-green: #53794a;
  --sg-green-dark: #365d3b;
  --sg-gold: #eeba59;
  --sg-gold-light: #f3d190;
  --sg-ink: #292929;
  --sg-link: #314981;
  --sg-page: #c8c8c8;
  --sg-line: #e2e7df;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--sg-ink);
  background: var(--sg-page);
  font: 15px/1.65 Arial, Helvetica, sans-serif;
  overflow-wrap: break-word;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: var(--sg-link); }
a:hover { color: var(--sg-burgundy); }
:focus-visible { outline: 3px solid #af5617; outline-offset: 3px; }
img, video, iframe { max-width: 100%; }
img { height: auto; }
figure { margin: 0; }
svg { max-width: 100%; }
table { border-collapse: collapse; }
th, td { border: 1px solid #d6ded3; padding: .55rem .7rem; text-align: left; }
th { background: #f1f5ef; }
blockquote { margin: 1.5rem 0; padding: .3rem 1.2rem; border-left: 4px solid var(--sg-gold); background: #fafaf5; }
hr { border: 0; border-top: 1px solid var(--sg-line); margin: 1.8rem 0; }
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.screen-reader-text:focus {
  clip: auto;
  clip-path: none;
  height: auto;
  width: auto;
  z-index: 9999;
  top: .75rem;
  left: .75rem;
  padding: .7rem 1rem;
  background: #fff;
  color: var(--sg-ink);
}

.site-shell {
  width: min(100% - 32px, 1050px);
  margin: 28px auto 0;
  background: #fff;
  box-shadow: 0 5px 24px rgb(0 0 0 / 12%);
}
.site-header {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  min-height: 160px;
  background: var(--sg-green) url('assets/images/header.jpg') center center / cover no-repeat;
}
.site-brand {
  background: var(--sg-burgundy);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 1.1rem 1.2rem;
  min-width: 0;
}
.site-brand a { color: inherit; text-decoration: none; display: flex; align-items: center; gap: .5rem; min-width: 0; }
.site-brand a:hover { color: var(--sg-gold-light); }
.site-brand-mark { flex: 0 0 auto; width: 61px; max-height: 101px; object-fit: contain; }
.site-brand-words { display: block; min-width: 0; }
.site-brand-logo {
  max-height: 126px;
  width: auto;
  object-fit: contain;
}
.site-brand .custom-logo-link { display: block; }
.site-brand .custom-logo { display: block; max-width: 100%; max-height: 126px; width: auto; height: auto; }
.site-brand-name {
  display: block;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.15rem, 1.75vw, 1.45rem);
  line-height: 1.05;
  letter-spacing: .02em;
  font-weight: 700;
}
.site-brand-name .brand-garden { color: var(--sg-gold-light); }
.site-brand-name .brand-garden { display: block; }
.site-brand-subtitle {
  display: block;
  font-size: .62rem;
  line-height: 1.3;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  margin-top: .45rem;
}
.site-header-image { min-width: 0; position: relative; }
.site-header-image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(28 64 27 / 8%), transparent 45%);
  pointer-events: none;
}
.site-header-tagline {
  position: absolute;
  right: 1.5rem;
  bottom: 1rem;
  max-width: 21rem;
  padding: .5rem .8rem;
  color: #fff;
  background: rgb(42 72 41 / 78%);
  font-size: .9rem;
  line-height: 1.3;
  text-align: right;
  z-index: 1;
}

.primary-bar {
  min-height: 42px;
  background: var(--sg-gold);
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
}
.menu-toggle,
.sidebar-toggle { display: none; }
.primary-menu,
.sidebar-menu,
.footer-menu { list-style: none; padding: 0; margin: 0; }
.primary-menu { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.primary-menu > li { position: relative; }
.primary-menu a {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: .55rem .86rem;
  color: #20211b;
  text-decoration: none;
  font-family: Verdana, Geneva, sans-serif;
  font-size: .79rem;
  line-height: 1.25;
  font-weight: 600;
}
.primary-menu > li > a:hover,
.primary-menu > .current-menu-item > a,
.primary-menu > .current-menu-ancestor > a { background: #f3d190; }
.primary-menu .sub-menu {
  display: none;
  list-style: none;
  min-width: 200px;
  padding: .25rem 0;
  margin: 0;
  position: absolute;
  z-index: 20;
  top: 100%;
  left: 0;
  background: #fff8e8;
  border: 1px solid #d3a84f;
  box-shadow: 0 8px 16px rgb(0 0 0 / 14%);
}
.primary-menu .sub-menu li { position: relative; }
.primary-menu .sub-menu .sub-menu { top: -.25rem; left: 100%; }
.primary-menu li:hover > .sub-menu,
.primary-menu li:focus-within > .sub-menu { display: block; }
.primary-menu .sub-menu a { min-height: 38px; }
.primary-menu .sub-menu a:hover { background: #f3d190; }

.site-body { display: grid; grid-template-columns: 250px minmax(0, 1fr); align-items: stretch; }
.site-sidebar {
  min-width: 0;
  color: #fff;
  background: linear-gradient(148deg, #315734, #557c4c 65%, #426b42);
  padding: 1.25rem .75rem 2rem;
}
.sidebar-inner { position: relative; }
.sidebar-section + .sidebar-section { margin-top: 1.4rem; }
.sidebar-heading,
.site-sidebar .widget-title {
  color: var(--sg-gold-light);
  font-size: .85rem;
  line-height: 1.3;
  margin: 0 0 .55rem;
  padding: 0 .55rem;
  text-align: right;
}
.sidebar-menu li,
.site-sidebar .widget li { list-style: none; }
.sidebar-menu a,
.site-sidebar .widget a {
  color: #fff;
  text-decoration: none;
}
.sidebar-menu a {
  display: block;
  padding: .52rem .65rem;
  border-bottom: 1px solid rgb(255 255 255 / 16%);
  font-size: .82rem;
  line-height: 1.4;
  text-align: right;
}
.sidebar-menu a:hover,
.sidebar-menu .current-menu-item > a,
.sidebar-menu .current-menu-ancestor > a {
  background: rgb(255 255 255 / 12%);
  color: #fff5d8;
}
.sidebar-menu .sub-menu { list-style: none; margin: 0; padding: 0 0 0 .65rem; }
.sidebar-menu .sub-menu a { font-size: .78rem; }
.site-sidebar .widget { margin: 0 0 1.25rem; }
.site-sidebar .widget ul { margin: 0; padding: 0; }
.site-sidebar .widget li { padding: .35rem .55rem; border-bottom: 1px solid rgb(255 255 255 / 16%); }
.site-sidebar .widget a:hover { color: #fff5d8; text-decoration: underline; }
.site-sidebar .widget input[type='search'] { width: 100%; min-width: 0; }
.search-form { display: flex; gap: .4rem; }
.search-form label { flex: 1; min-width: 0; }
.search-form input[type='search'] {
  width: 100%;
  min-height: 39px;
  padding: .5rem .65rem;
  border: 1px solid #b9c9b0;
  border-radius: 2px;
  background: #fff;
  color: var(--sg-ink);
}
.search-form button,
.button,
.wp-block-button__link {
  border: 0;
  border-radius: 2px;
  padding: .55rem .85rem;
  color: #201b13;
  background: var(--sg-gold);
  font-weight: 700;
  text-decoration: none;
}
.search-form button:hover,
.button:hover,
.wp-block-button__link:hover { background: var(--sg-gold-light); color: #201b13; }

.site-main { min-width: 0; padding: 1.8rem clamp(1.3rem, 4vw, 3rem) 3rem; }
.breadcrumbs { color: #5d655d; font-size: .78rem; margin-bottom: 1.1rem; }
.breadcrumbs a { color: #436342; }
.page-header { margin-bottom: 1.2rem; }
.page-title, .entry-title {
  color: var(--sg-green-dark);
  font-size: clamp(1.45rem, 2.5vw, 2rem);
  line-height: 1.28;
  margin: 0 0 .7rem;
  font-weight: 700;
}
.entry-title a { color: inherit; text-decoration: none; }
.entry-title a:hover { color: var(--sg-burgundy); }
.entry-meta { font-size: .78rem; color: #646b63; margin: -.2rem 0 1.15rem; }
.entry-meta a { color: inherit; }
.entry-content { min-width: 0; }
.entry-content > :first-child { margin-top: 0; }
.entry-content h2, .entry-content h3, .entry-content h4 { color: var(--sg-green); line-height: 1.35; }
.entry-content h2 { font-size: 1.4rem; margin-top: 1.65rem; }
.entry-content h3 { font-size: 1.15rem; margin-top: 1.4rem; }
.entry-content p, .entry-content ul, .entry-content ol { margin: 0 0 1.05rem; }
.entry-content li + li { margin-top: .2rem; }
.entry-content img { max-width: 100% !important; height: auto !important; }
.entry-content iframe { max-width: 100%; }
.entry-content .alignleft { float: left; margin: .2rem 1.2rem 1rem 0; }
.entry-content .alignright { float: right; margin: .2rem 0 1rem 1.2rem; }
.entry-content .aligncenter { display: block; margin: 1.2rem auto; }
.entry-content .wp-caption { max-width: 100%; }
.entry-content .wp-caption-text, .entry-content figcaption { color: #667065; font-size: .82rem; text-align: center; }
.entry-content .table-scroll { overflow-x: auto; }
.entry-content table { max-width: 100%; width: 100%; }
.entry-content::after { display: table; clear: both; content: ''; }
.entry-featured { display: block; width: 100%; max-height: 350px; object-fit: cover; margin: 0 0 1.1rem; }
.article-card { padding: 0 0 1.7rem; margin: 0 0 1.7rem; border-bottom: 1px solid var(--sg-line); }
.article-card .entry-title { font-size: 1.35rem; }
.article-card .entry-featured { max-height: 260px; }
.article-card .entry-content > :last-child { margin-bottom: 0; }
.read-more { display: inline-block; font-weight: 700; margin-top: .3rem; }
.post-navigation, .pagination, .page-links { margin-top: 2rem; }
.nav-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; }
.nav-links a, .page-links a { color: var(--sg-green-dark); }
.pagination .page-numbers { display: inline-block; padding: .25rem .5rem; margin: .2rem; }
.pagination .current { background: var(--sg-green); color: #fff; }
.search-results-count { color: #5d655d; font-size: .85rem; }
.not-found { max-width: 45rem; }

/* Standard WordPress galleries and galleries converted from Joomla. */
.sg-gallery,
.wp-block-gallery,
.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: .8rem;
  margin: 1.2rem 0 1.7rem;
}
.sg-gallery figure,
.wp-block-gallery figure,
.gallery .gallery-item {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  background: #eef2eb;
}
.sg-gallery a,
.wp-block-gallery a,
.gallery a { display: block; }
.sg-gallery img,
.wp-block-gallery img,
.gallery img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform .22s ease;
}
.sg-gallery a:hover img,
.wp-block-gallery a:hover img,
.gallery a:hover img { transform: scale(1.035); }
.sg-gallery figcaption,
.wp-block-gallery figcaption,
.gallery .gallery-caption { padding: .4rem .5rem; font-size: .77rem; color: #52614f; }
.sg-lightbox {
  position: fixed;
  inset: 0;
  max-width: min(100vw - 32px, 1100px);
  max-height: calc(100vh - 32px);
  padding: .8rem;
  border: 0;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 20px 70px rgb(0 0 0 / 45%);
}
.sg-lightbox::backdrop { background: rgb(0 0 0 / 78%); }
.sg-lightbox-frame { display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.sg-lightbox-close { align-self: flex-end; border: 0; background: var(--sg-burgundy); color: #fff; padding: .25rem .65rem; font-size: 1.4rem; line-height: 1.25; }
.sg-lightbox img { display: block; width: auto; max-height: calc(100vh - 145px); object-fit: contain; }
.sg-lightbox figcaption { text-align: center; color: #344230; font-size: .88rem; }
.sg-lightbox-actions { display: flex; align-items: center; justify-content: center; gap: 1.1rem; }
.sg-lightbox-actions button { border: 1px solid #c6d3c0; border-radius: 2px; color: var(--sg-green-dark); background: #f4f7f2; min-width: 2.3rem; min-height: 2.1rem; }
.sg-lightbox-actions button:hover { background: #dfeadb; }
.sg-lightbox-count { font-size: .8rem; color: #52614f; min-width: 3.5rem; text-align: center; }

.sg-ad-slot { margin: 1.5rem auto; max-width: 100%; text-align: center; }
.sg-ad-slot .adsbygoogle { display: block; min-height: 120px; }

.site-footer {
  color: #fff;
  background: var(--sg-green-dark);
  padding: 1.25rem 1.5rem;
  font-size: .82rem;
}
.site-footer a { color: #fff3ca; }
.site-footer-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .7rem 1.5rem; }
.site-footer p { margin: 0; }
.footer-menu { display: flex; flex-wrap: wrap; gap: .35rem 1rem; }
.footer-menu a { text-decoration: none; }
.footer-menu a:hover { text-decoration: underline; }

@media (max-width: 900px) {
  .site-shell { width: min(100% - 20px, 1050px); margin-top: 10px; }
  .site-header { grid-template-columns: 225px minmax(0, 1fr); }
  .site-body { grid-template-columns: 225px minmax(0, 1fr); }
  .primary-menu a { padding-inline: .55rem; font-size: .73rem; }
  .site-main { padding-inline: 1.5rem; }
}
@media (max-width: 720px) {
  .site-shell { width: 100%; margin: 0; box-shadow: none; }
  .site-header { grid-template-columns: minmax(0, 1fr); min-height: 0; background: var(--sg-green); }
  .site-brand { min-height: 104px; padding: .6rem 1rem; background: var(--sg-burgundy); }
  .site-brand-mark { width: 52px; max-height: 86px; }
  .site-brand-name { font-size: 1.35rem; }
  .site-header-image { min-height: 115px; background: var(--sg-green) url('assets/images/header.jpg') center center / cover no-repeat; }
  .site-header-tagline { right: .8rem; bottom: .65rem; font-size: .8rem; }
  .primary-bar { display: block; }
  .has-js .menu-toggle,
  .has-js .sidebar-toggle {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    min-height: 44px;
    padding: .55rem 1rem;
    border: 0;
    background: transparent;
    color: #1e231b;
    font-weight: 700;
  }
  .menu-toggle::before,
  .sidebar-toggle::before { content: '☰'; font-size: 1.25rem; line-height: 1; }
  .has-js .primary-nav { display: none; }
  .primary-nav.is-open { display: block; }
  .primary-menu { display: block; }
  .primary-menu > li { border-top: 1px solid rgb(0 0 0 / 13%); }
  .primary-menu a { min-height: 44px; padding: .6rem 1rem; font-size: .9rem; }
  .primary-menu .sub-menu,
  .primary-menu .sub-menu .sub-menu {
    display: block;
    position: static;
    min-width: 0;
    box-shadow: none;
    border: 0;
    background: rgb(255 255 255 / 24%);
    padding: 0 0 0 .8rem;
  }
  .site-body { display: flex; flex-direction: column; }
  .site-sidebar { padding: 0; }
  .sidebar-toggle { width: 100%; justify-content: flex-start; color: #fff; padding: .7rem 1rem; }
  .sidebar-inner { padding: .5rem 1rem 1.4rem; }
  .has-js .sidebar-inner { display: none; }
  .sidebar-inner.is-open { display: block; }
  .sidebar-menu a { font-size: .9rem; text-align: left; min-height: 42px; }
  .sidebar-heading, .site-sidebar .widget-title { text-align: left; }
  .site-main { padding: 1.5rem 1rem 2.6rem; }
}
@media (max-width: 440px) {
  .entry-content .alignleft,
  .entry-content .alignright { float: none; display: block; margin: 1rem auto; }
  .sg-gallery, .wp-block-gallery, .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .site-footer-inner { display: block; }
  .footer-menu { margin-top: .65rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .sg-gallery img, .wp-block-gallery img, .gallery img { transition: none; }
}