/*!
Consted — Visual Refresh
--------------------------------------------------------------
This stylesheet layers a more modern, polished look on top of
the theme's existing markup and classes. It is purely cosmetic:
no template, hook, or class name required by the theme's PHP is
changed or removed, so every existing feature keeps working.
Loaded after consted.css and style.css so these rules take
priority automatically (no !important needed for most of it).
--------------------------------------------------------------*/

/* ==========================================================
   1. Foundations — type, selection, scroll, focus
   ========================================================== */

html {
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

::selection {
  background: var(--secondary-color);
  color: #fff;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: var(--surface-tint);
}
::-webkit-scrollbar-thumb {
  background: var(--tertiary_color);
  border-radius: 10px;
  border: 2px solid var(--surface-tint);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--secondary-color);
}

a {
  transition: color 0.25s var(--ease), background-color 0.25s var(--ease), border-color 0.25s var(--ease), opacity 0.25s var(--ease), transform 0.25s var(--ease);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid var(--secondary-color);
  outline-offset: 2px;
}

img {
  height: auto;
}

blockquote {
  position: relative;
  margin: 30px 0;
  padding: 28px 30px 28px 60px;
  background: var(--surface-tint);
  border-left: 4px solid var(--secondary-color);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-style: italic;
  color: var(--tertiary_color);
  box-shadow: var(--shadow-sm);
}
blockquote:before {
  content: "\201C";
  position: absolute;
  left: 18px;
  top: 8px;
  font-size: 46px;
  line-height: 1;
  font-family: Georgia, serif;
  color: var(--secondary-color);
  opacity: 0.55;
}
blockquote p:last-child { margin-bottom: 0; }

hr {
  border: none;
  border-top: 1px solid rgba(0, 33, 91, 0.1);
  margin: 34px 0;
}

table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  box-shadow: var(--shadow-sm);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
table th {
  background: var(--tertiary_color);
  color: #fff;
  text-align: left;
  padding: 12px 16px;
  font-weight: 600;
}
table td {
  padding: 12px 16px;
  border-bottom: 1px solid rgba(0, 33, 91, 0.08);
}
table tr:nth-child(even) td { background: var(--surface-tint); }

/* Core/Gutenberg form controls, WooCommerce-agnostic */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
textarea,
select {
  border: 1px solid rgba(0, 33, 91, 0.14) !important;
  border-radius: var(--radius-sm) !important;
  padding: 12px 16px !important;
  transition: border-color 0.25s var(--ease), box-shadow 0.25s var(--ease);
  background: #fff;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
  border-color: var(--secondary-color) !important;
  box-shadow: 0 0 0 4px rgba(244, 89, 5, 0.12);
  outline: none;
}

/* ==========================================================
   2. Buttons — CTAs across the theme
   ========================================================== */

.def-btn,
form.wpcf7-form input.def-btn,
.wp-block-button__link,
.comment-reply-link,
#wp-calendar caption {
  background: var(--gradient-accent) !important;
  border: none !important;
  box-shadow: 0 10px 24px rgba(244, 89, 5, 0.28);
  transition: transform 0.28s var(--ease), box-shadow 0.28s var(--ease), background 0.28s var(--ease);
}
.def-btn:hover,
.def-btn:focus,
form.wpcf7-form input.def-btn:hover,
form.wpcf7-form input.def-btn:focus,
.wp-block-button__link:hover,
.comment-reply-link:hover {
  background: var(--gradient-dark) !important;
  box-shadow: 0 14px 30px rgba(0, 33, 91, 0.28);
  transform: translateY(-3px);
}

input[type="submit"],
button[type="submit"],
.search-submit,
.comment-form input#submit {
  background: var(--gradient-accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-sm);
  padding: 13px 28px;
  font-weight: 600;
  letter-spacing: 0.02em;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(244, 89, 5, 0.25);
  transition: transform 0.28s var(--ease), box-shadow 0.28s var(--ease), background 0.28s var(--ease);
}
input[type="submit"]:hover,
button[type="submit"]:hover,
.search-submit:hover,
.comment-form input#submit:hover {
  background: var(--gradient-dark);
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(0, 33, 91, 0.25);
}

.scroll-to-top .container button {
  background: var(--gradient-accent) !important;
  border: none !important;
  box-shadow: var(--shadow-lg);
  transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease);
}
.scroll-to-top .container button:hover {
  background: var(--gradient-dark) !important;
  color: #fff !important;
  transform: translateY(-4px);
}

/* ==========================================================
   3. Header — top bar, main nav, mobile toggle
   ========================================================== */

.header .bottom-header {
  box-shadow: 0 4px 24px rgba(15, 25, 60, 0.06);
}

/* Nav link color/hover only — no position, no pseudo-elements, no
   animation, so Bootstrap/Popper's own dropdown positioning and the
   collapse toggle are left completely untouched. */
.ow-navigation .menubar > li > a,
.ow-navigation .navbar-nav > li > a {
  font-weight: 600;
}
.ow-navigation .menubar > li > a:hover,
.ow-navigation .menubar > li > a:focus,
.ow-navigation .menubar > li.current-menu-item > a,
.ow-navigation .navbar-nav > li > a:hover,
.ow-navigation .navbar-nav > li > a:focus {
  color: var(--secondary-color);
}

.ow-navigation .dropdown-menu .dropdown-item:hover,
.ow-navigation .dropdown-menu .dropdown-item:focus {
  background: var(--surface-tint);
  color: var(--secondary-color);
}

/* ==========================================================
   4. Hero / page banner + breadcrumb
   ========================================================== */

.site-hero-section .part-txt .page-title-text {
  animation: consted-fade-up 0.6s var(--ease) both;
}
.site-hero-section .part-txt .subtitle {
  animation: consted-fade-up 0.6s var(--ease) 0.1s both;
}

@keyframes consted-fade-up {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

.site-hero-section .part-txt ul.breadcrumbs {
  animation: consted-fade-up 0.6s var(--ease) 0.2s both;
  background: rgba(255, 255, 255, 0.1);
  display: inline-flex;
  padding: 8px 20px;
  border-radius: 50px;
  backdrop-filter: blur(6px);
}

/* ==========================================================
   5. Blog list + single post content cards
   ========================================================== */

#main article .single-box,
#main .single-box {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  transition: box-shadow 0.35s var(--ease), transform 0.35s var(--ease);
  background: #fff;
}
#main article .single-box:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-4px);
}
#main article .single-box img {
  transition: transform 0.6s var(--ease);
}
#main article .single-box:hover img {
  transform: scale(1.06);
}

/* Multi-column blog grid: equal-height cards, uniform image ratio */
.blog-wrap .row,
.related-posts .row {
  display: flex;
  flex-wrap: wrap;
}
.blog-wrap .row > [class*="col-"],
.related-posts .row > [class*="col-"] {
  display: flex;
}
.blog-wrap .single-box,
.related-posts .single-box {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.blog-wrap .single-box .part-txt,
.related-posts .single-box .part-txt {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.blog-wrap .single-box .part-img,
.related-posts .single-box .part-img {
  aspect-ratio: 16 / 10;
}
.blog-wrap .single-box .part-img img,
.related-posts .single-box .part-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.entry-content,
.content-wrap,
.type-post .part-txt {
  line-height: 1.85;
  color: rgba(0, 33, 91, 0.82);
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.content-wrap h1,
.content-wrap h2,
.content-wrap h3,
.content-wrap h4 {
  color: var(--tertiary_color);
  font-family: var(--heading-font);
  margin-top: 1.4em;
  line-height: 1.35;
}
.entry-content p,
.content-wrap p {
  margin-bottom: 1.4em;
}
.entry-content ul,
.entry-content ol,
.content-wrap ul,
.content-wrap ol {
  margin-bottom: 1.4em;
  padding-left: 22px;
}
.entry-content a,
.content-wrap a {
  color: var(--secondary-color);
  text-decoration: underline;
  text-decoration-color: rgba(244, 89, 5, 0.35);
  text-underline-offset: 3px;
}
.entry-content a:hover,
.content-wrap a:hover {
  text-decoration-color: var(--secondary-color);
}
.entry-content img,
.content-wrap img,
.wp-caption img,
.type-post .part-img img,
article .single-box .part-img img,
article .single-box img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius-md);
}

.page-title-text,
.entry-title,
h1, h2, h3 {
  letter-spacing: -0.01em;
}

/* Meta row (author / date / category chips) */
.meta-list,
.post-meta,
ul.meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.meta-list li,
.post-meta li,
ul.meta li {
  background: var(--surface-tint);
  border-radius: 50px;
  padding: 6px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--tertiary_color);
}
.meta-list li i,
.post-meta li i,
ul.meta li i {
  color: var(--secondary-color);
  margin-right: 6px;
}
.meta-list li a,
.post-meta li a,
ul.meta li a {
  color: inherit;
}

/* ==========================================================
   5b. Single post additions — reading time, share, author, related
   ========================================================== */

.reading-time {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--surface-tint);
  color: var(--tertiary_color);
  font-size: 13px;
  font-weight: 600;
  padding: 6px 16px;
  border-radius: 50px;
  margin: 4px 0 18px;
}
.reading-time i { color: var(--secondary-color); }

.share-links {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0 30px;
}
.share-links .share-label {
  font-weight: 700;
  color: var(--tertiary_color);
  margin-right: 4px;
}
.share-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--surface-tint);
  color: var(--tertiary_color) !important;
  box-shadow: var(--shadow-sm);
  transition: all 0.25s var(--ease);
}
.share-links a:hover {
  background: var(--gradient-accent);
  color: #fff !important;
  transform: translateY(-3px);
}

.other-info .tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.other-info .tags span {
  font-weight: 700;
  color: var(--tertiary_color);
  margin-right: 4px;
}
.other-info .tags a {
  font-size: 13px;
  background: var(--surface-tint);
  border: 1px solid rgba(0, 33, 91, 0.1);
  padding: 6px 14px 6px 10px;
  border-radius: 50px;
  color: var(--tertiary_color);
  transition: all 0.25s var(--ease);
}
.other-info .tags i { margin-right: 5px; color: var(--secondary-color); }
.other-info .tags a:hover {
  background: var(--secondary-color);
  border-color: var(--secondary-color);
  color: #fff;
}
.other-info .tags a:hover i { color: #fff; }

.author-box {
  display: flex;
  gap: 22px;
  align-items: flex-start;
  background: var(--surface-tint);
  border-radius: var(--radius-lg);
  padding: 28px;
  margin: 36px 0;
  box-shadow: var(--shadow-sm);
}
.author-box .author-avatar img {
  border-radius: 50%;
  border: 4px solid #fff;
  box-shadow: var(--shadow-sm);
}
.author-box .author-label {
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--secondary-color);
}
.author-box .author-name {
  margin: 4px 0 10px;
  color: var(--tertiary_color);
}
.author-box .author-name a { color: inherit; }
.author-box .author-bio {
  color: rgba(0, 33, 91, 0.75);
  margin-bottom: 14px;
}
.author-box .author-links {
  display: flex;
  align-items: center;
  gap: 14px;
}
.author-box .author-more-posts {
  font-weight: 600;
  color: var(--secondary-color);
}
.author-box .author-website {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff;
  color: var(--tertiary_color);
  box-shadow: var(--shadow-sm);
}
.author-box .author-website:hover {
  background: var(--secondary-color);
  color: #fff;
}

.single-prev-next {
  margin: 36px 0;
  padding: 24px 0;
  border-top: 1px solid rgba(0, 33, 91, 0.1);
  border-bottom: 1px solid rgba(0, 33, 91, 0.1);
}
.single-prev-next h5 {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--secondary-color);
  margin-bottom: 6px;
}
.single-prev-next span {
  font-weight: 600;
  color: var(--tertiary_color);
}
.single-prev-next .align-right { text-align: right; }

.related-posts {
  margin-top: 46px;
}
.related-posts-title {
  color: var(--tertiary_color);
  font-weight: 700;
  position: relative;
  padding-bottom: 14px;
  margin-bottom: 26px;
}
.related-posts-title:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 50px;
  height: 3px;
  border-radius: 3px;
  background: var(--secondary-color);
}
.related-posts .related-post-card {
  height: 100%;
  margin-bottom: 24px;
}
.related-posts .related-post-card .part-txt {
  padding: 18px 20px 22px;
}
.related-posts .related-post-card .post-meta {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
  padding: 0;
}
.related-posts .related-post-card .post-meta li {
  list-style: none;
  font-size: 12px;
  color: rgba(0, 33, 91, 0.55);
}
.related-posts .related-post-card .entry-title {
  font-size: 17px;
  line-height: 1.4;
  margin: 0;
}
.related-posts .related-post-card .entry-title a {
  color: var(--tertiary_color);
}
.related-posts .related-post-card .entry-title a:hover {
  color: var(--secondary-color);
}

/* ==========================================================
   6. Pagination
   ========================================================== */

.pagination .page-numbers,
.nav-links .page-numbers,
.pagination ul li a,
.pagination ul li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 14px;
  margin: 0 4px 8px;
  border-radius: 50px;
  background: #fff;
  color: var(--tertiary_color);
  box-shadow: var(--shadow-sm);
  font-weight: 600;
  transition: all 0.25s var(--ease);
}
.pagination .page-numbers:hover,
.nav-links .page-numbers:hover,
.pagination ul li a:hover {
  background: var(--gradient-accent);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(244, 89, 5, 0.25);
}
.pagination .page-numbers.current,
.nav-links .page-numbers.current,
.pagination ul li span.current,
.pagination ul li a.current {
  background: var(--gradient-dark);
  color: #fff;
  box-shadow: 0 10px 20px rgba(0, 33, 91, 0.25);
}

/* ==========================================================
   7. Sidebar widgets (off-canvas "Fly Sidebar" + inline)
   ========================================================== */

.main-sidebar {
  background: #fff;
  box-shadow: -20px 0 60px rgba(15, 25, 60, 0.18);
}

.main-sidebar .widget,
#secondary .widget,
.widget-area .widget,
.consted-sidebar .widget,
#blog-sidebar .widget {
  background: var(--surface-tint);
  border-radius: var(--radius-md);
  padding: 24px;
  margin-bottom: 24px;
  box-shadow: var(--shadow-sm);
}

.widget-title,
.widget-title span {
  color: var(--tertiary_color);
  font-weight: 700;
  position: relative;
  padding-bottom: 14px;
  margin-bottom: 18px;
  display: inline-block;
}
.widget-title:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 46px;
  height: 3px;
  border-radius: 3px;
  background: var(--secondary-color);
}

.widget ul li,
.widget_categories ul li,
.widget_archive ul li,
.widget_pages ul li,
.widget_meta ul li,
.widget_recent_entries ul li,
.widget_recent_comments ul li,
.widget_nav_menu ul li {
  list-style: none;
  border-bottom: 1px dashed rgba(0, 33, 91, 0.12);
  padding: 10px 0;
  transition: padding-left 0.25s var(--ease);
}
.widget ul li:last-child { border-bottom: none; }
.widget ul li:hover {
  padding-left: 6px;
}
.widget ul li a {
  color: var(--tertiary_color);
  font-weight: 500;
}
.widget ul li a:hover {
  color: var(--secondary-color);
}

.widget_search .search-form,
.search-form {
  display: flex;
  gap: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.widget_search .search-form .search-field,
.search-form .search-field {
  flex: 1;
  border: 1px solid rgba(0, 33, 91, 0.14) !important;
  border-right: none !important;
  border-radius: var(--radius-sm) 0 0 var(--radius-sm) !important;
}
.widget_search .search-form .search-submit,
.search-form .search-submit {
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: 0 20px;
}

.widget_tag_cloud .tagcloud,
.tagcloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.widget_tag_cloud .tagcloud a,
.tagcloud a {
  font-size: 13px !important;
  background: #fff;
  border: 1px solid rgba(0, 33, 91, 0.12);
  padding: 6px 14px;
  border-radius: 50px;
  color: var(--tertiary_color);
  transition: all 0.25s var(--ease);
}
.widget_tag_cloud .tagcloud a:hover,
.tagcloud a:hover {
  background: var(--secondary-color);
  border-color: var(--secondary-color);
  color: #fff;
}

.widget_calendar table caption {
  background: var(--tertiary_color);
  color: #fff;
  padding: 10px;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}
.widget_calendar table {
  box-shadow: none;
}
.widget_calendar #today {
  background: var(--secondary-color);
  color: #fff;
  border-radius: 4px;
}

/* ==========================================================
   8. Comments
   ========================================================== */

.comments-area {
  margin-top: 40px;
}
.comments-title {
  color: var(--tertiary_color);
  font-weight: 700;
}
.comment-list .comment-body,
.comment-list article {
  background: var(--surface-tint);
  border-radius: var(--radius-md);
  padding: 24px;
  margin-bottom: 18px;
  box-shadow: var(--shadow-sm);
  transition: box-shadow 0.3s var(--ease);
}
.comment-list .comment-body:hover {
  box-shadow: var(--shadow-md);
}
.comment-list .avatar {
  border-radius: 50%;
  border: 3px solid #fff;
  box-shadow: var(--shadow-sm);
}
.comment-list .comment-metadata a {
  color: var(--tertiary_color);
  opacity: 0.65;
}
.comment-reply-link {
  display: inline-block;
  padding: 6px 18px;
  font-size: 12px;
  border-radius: 50px;
  color: #fff !important;
}

#respond {
  margin-top: 30px;
}
#respond .comment-reply-title {
  color: var(--tertiary_color);
  font-weight: 700;
}

/* ==========================================================
   9. Footer
   ========================================================== */

.footer {
  background: var(--gradient-dark);
  position: relative;
}

.footer .main-footer .widget_nav_menu ul li,
.footer .main-footer ul li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.footer .main-footer ul li a {
  color: rgba(255, 255, 255, 0.75);
  transition: color 0.25s var(--ease), padding-left 0.25s var(--ease);
}
.footer .main-footer ul li a:hover {
  color: var(--secondary-color);
  padding-left: 6px;
}

.footer .main-footer .site-info .social a {
  transition: transform 0.25s var(--ease), background 0.25s var(--ease);
}
.footer .main-footer .site-info .social a:hover {
  transform: translateY(-4px);
  background: var(--secondary-color) !important;
}

.copyright {
  background: rgba(0, 0, 0, 0.18);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.copyright a {
  color: var(--secondary-color);
}

/* ==========================================================
   10. 404 / search results
   ========================================================== */

.error-404 .page-content,
.no-results {
  text-align: center;
}
.search-no-results .page-content .def-btn {
  margin-top: 10px;
}

/* ==========================================================
   11. Small responsive polish
   ========================================================== */

@media (max-width: 991px) {
  .site-hero-section .part-txt { min-height: 40vh; }
  #main article .single-box:hover { transform: none; }
  #blog-sidebar.consted-sidebar { margin-top: 30px; }
}

@media (max-width: 575px) {
  .author-box { flex-direction: column; text-align: center; }
  .author-box .author-links { justify-content: center; }
  .single-prev-next .align-right { text-align: left; }
  .share-links { flex-wrap: wrap; }
}

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