/*
Theme Name: Elec Water
Theme URI: https://elec-water.com/
Author: Elec Water
Author URI: https://elec-water.com/
Description: Elec Water is the official child theme for elec-water.com, built on the Minimalist Blogger X framework. It preserves the warm paper reading experience — cream background, rust accents and the Fraunces/Karla type pairing — while adding a classic full-content homepage blog layout and a centered, brand-consistent footer.
Version: 1.0.0
Requires PHP: 7.0
Requires at least: 5.0
Tested up to: 7.0
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.en.html
Template: minimalist-blogger-x
Text Domain: elec-water
Tags: blog, news, one-column, two-columns, right-sidebar, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, translation-ready, threaded-comments, sticky-post
*/

/* ==========================================================================
   PART 1 — Inherited paper styling
   Carried over from The Paper Blog so the site's existing look is unchanged.
   ========================================================================== */

/*
/* TABLE OF CONTENT
/* General Layout  
/* General widget styling
/* Form elements
/* Typography  
/* Buttons   
/* Tables
/* Archive block & widget  
/* Tag cloud block / widget 
 * WP Block Cover   
/* Category block & widget  
/* Images 
/* Horizontal Rule (hr) 
/* Blockquote 
/* Pull quote 
/* WP Calendar block and Widget
/* Post Comments 
/* Latest posts / Blog / Archives / Search
/* Post pagination
/* Featured image block 
/* Single post / page
/* All Page List / Menu Block/widget 
/* Plugin integration: Elementor
/* Plugin integration:  Superb Recent Posts With Thumbnails
/* Pluing Integration: Recent Posts Extended 
/* Plugin integration: Contact Form 7 
/* Plugin integration: Proflegrid 
/* Plugin integration: Registration Magic and ProfileGrid
/* Search Block/widget 
/* Navigation / Menu
/* Related posts
/* About the author 
/* Log in / out Block
/* Next / Previous post
/* Tags and Cateogries ( Single posts and pages )
/* Entry meta 
/* Code block 
/* Social Links
/* Verse block
/* WooCommerce
/* Footer
/* Header widgets 
/* Go to top button
/* WordPress Gallery block/widget
/* Sidebar
/* Default Header
/* MetaSlider Header
/* Accessibility
/* Unsorted 
/* Min width media queries 
/* Max width media queries 
/*




/*
/*  General Layout  
*/

:root {
    --font-primary: 'Karla', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
    --font-primary-lineheight: 172%;
    --font-primary-lineheight-small: 126%;
    --font-primary-default: 400;
    --font-primary-bold: 700;
    --font-primary-small: 14px;
    --font-primary-normal: 17px;
    --font-primary-medium: 18px;
    --font-primary-large: 24px;
    --font-primary-extra: 30px;
    --font-primary-xl: 34px;
    --font-primary-xxl: 44px;
    --font-primary-xxxl: 56px;
    --font-primary-xxxxl: 68px;

    --font-secondary: 'Fraunces', Georgia, 'Times New Roman', Times, serif;
    --font-secondary-lineheight: 122%;
    --font-secondary-default: 400;
    --font-secondary-bold: 600;
    --font-secondary-small: 15px;
    --font-secondary-normal: 17px;
    --font-secondary-medium: 21px;
    --font-secondary-large: 28px;
    --font-secondary-extra: 33px;
    --font-secondary-xl: 38px;
    --font-secondary-xxl: 46px;
    --font-secondary-xxxl: 58px;
    --font-secondary-xxxxl: 70px;

    --font-tertiary: SFMono-Regular, Menlo, Consolas, monospace;
    --font-tertiary-lineheight: 160%;
    --font-tertiary-normal: normal;
    --font-tertiary-default: 600;

    --minimalist-blogger-x-light2: var(--minimalist-blogger-x-light-2);
    --minimalist-blogger-x-primary-foreground: var(--minimalist-blogger-x-primary);
    --minimalist-blogger-x-primary-background: var(--minimalist-blogger-x-button-text-color);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    letter-spacing: -0.01em;
}

.entry-content p a,
.entry-content li a,
.comment-content p a {
    color: var(--minimalist-blogger-x-primary);
    text-decoration: underline;
    text-underline-offset: 3px;
    -webkit-text-decoration-thickness: 1px;
    text-decoration-thickness: 1px;
}

.entry-content p a:hover,
.entry-content li a:hover,
.comment-content p a:hover {
    color: var(--minimalist-blogger-x-primary-dark);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--minimalist-blogger-x-primary);
    outline-offset: 3px;
}

hr,
hr.wp-block-separator {
    border-top: 1px solid;
    border-bottom: 0;
    border-color: var(--minimalist-blogger-x-light-2);
    margin-bottom: 2em;
}

.wp-block-quote {
    border-left: 3px solid var(--minimalist-blogger-x-primary);
    padding-left: 28px;
}

blockquote p {
    font-size: var(--font-secondary-medium);
    line-height: 145%;
}

.wp-block-pullquote {
    padding: 34px 30px;
}

.wp-block-image figcaption,
.wp-caption-text {
    font-size: var(--font-primary-small);
    color: var(--minimalist-blogger-x-dark-1);
    font-style: normal;
}

#masthead.sheader {
    border-top: 4px solid var(--minimalist-blogger-x-primary);
    margin: 0 0 46px;
}

#masthead .top-nav-wrapper,
#masthead .super-menu {
    border-bottom: 1px solid var(--minimalist-blogger-x-light-2);
}

#masthead .logo-container {
    max-width: 38%;
    padding: 24px 0;
}

#masthead .center-main-menu {
    max-width: 62%;
}

.logofont,
#masthead .logofont {
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-large);
    font-weight: var(--font-secondary-bold);
    line-height: 110%;
    letter-spacing: -0.015em;
    color: var(--minimalist-blogger-x-foreground);
}

p.logodescription,
#masthead p.logodescription {
    font-family: var(--font-primary);
    font-size: 12px;
    font-weight: var(--font-primary-bold);
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--minimalist-blogger-x-dark-1);
    margin: 9px 0 0;
    line-height: 130%;
}

#masthead .main-navigation ul.pmenu > li {
    margin-left: 34px;
}

#masthead .main-navigation ul.pmenu > li:first-child {
    margin-left: 0;
}

#masthead .main-navigation ul li a {
    position: relative;
    font-family: var(--font-primary);
    font-size: 13px;
    font-weight: var(--font-primary-bold);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--minimalist-blogger-x-foreground);
}

#masthead .main-navigation ul.pmenu > li > a {
    padding: 27px 0 26px;
}

#masthead .main-navigation ul.pmenu > li > a:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 20px;
    height: 1px;
    background: var(--minimalist-blogger-x-primary);
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
    -webkit-transition: 0.25s ease;
    -o-transition: 0.25s ease;
    transition: 0.25s ease;
}

#masthead .main-navigation ul.pmenu > li > a:hover:after,
#masthead .main-navigation ul.pmenu > li.current-menu-item > a:after,
#masthead .main-navigation ul.pmenu > li.current_page_item > a:after {
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
}

#masthead .main-navigation ul.pmenu > li > a:hover,
#masthead .main-navigation ul.pmenu > li.current-menu-item > a {
    color: var(--minimalist-blogger-x-primary);
}

#masthead .main-navigation ul.pmenu > li.menu-item-has-children,
#masthead .main-navigation ul.pmenu > li.page_item_has_children {
    padding-right: 20px;
    margin-right: 0;
}

#masthead .main-navigation ul.pmenu > li > .sub-arrow {
    width: 12px;
    right: 2px;
    top: 50%;
    height: auto;
    line-height: 1;
    font-size: 13px;
    color: var(--minimalist-blogger-x-foreground);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

#masthead .primary-menu ul li ul.children,
#masthead .primary-menu ul li ul.sub-menu {
    border: 1px solid var(--minimalist-blogger-x-light-2);
    -webkit-box-shadow: 0 18px 40px -22px rgba(36, 31, 26, 0.35);
    box-shadow: 0 18px 40px -22px rgba(36, 31, 26, 0.35);
}

#masthead .main-navigation ul ul li a {
    font-size: 12px;
    letter-spacing: 0.14em;
}

#masthead .main-navigation ul ul li a:hover {
    color: var(--minimalist-blogger-x-primary);
}

#masthead .super-menu .logofont {
    font-size: var(--font-secondary-medium);
}

#masthead .super-menu p.logodescription {
    font-size: 11px;
    margin-top: 5px;
}

#smobile-menu.show .main-navigation ul li a {
    font-family: var(--font-primary);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-size: var(--font-primary-small);
    font-weight: var(--font-primary-bold);
}

#smobile-menu.show .main-navigation ul li {
    border-bottom: 1px solid var(--minimalist-blogger-x-light-2);
}

.bottom-header-wrapper {
    margin-bottom: 46px;
}

.bottom-header-wrapper:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: var(--minimalist-blogger-x-element-border-radius);
    background: -webkit-gradient(linear, left top, right top, from(rgba(30, 26, 22, 0.8)), color-stop(45%, rgba(30, 26, 22, 0.55)), to(rgba(30, 26, 22, 0.15)));
    background: -o-linear-gradient(left, rgba(30, 26, 22, 0.8) 0%, rgba(30, 26, 22, 0.55) 45%, rgba(30, 26, 22, 0.15) 100%);
    background: linear-gradient(90deg, rgba(30, 26, 22, 0.8) 0%, rgba(30, 26, 22, 0.55) 45%, rgba(30, 26, 22, 0.15) 100%);
    z-index: 1;
}

.bottom-header-wrapper img {
    display: block;
    width: 100%;
    min-height: 360px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--minimalist-blogger-x-element-border-radius);
}

.bottom-header-text {
    text-align:center;
    z-index: 2;
}

.bottom-header-pre-title {
    font-family: var(--font-primary);
    font-size: var(--font-primary-small);
    font-weight: var(--font-primary-bold);
    text-align:center;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    margin: 0 0 16px;
}

.bottom-header-title {
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-xxxl);
    font-weight: var(--font-secondary-bold);
    line-height: 106%;
    text-align:center;
    letter-spacing: -0.02em;
    margin-left:auto;
    margin-right:auto;
    max-width: 720px;
}

.bottom-header-paragraph {
    font-family: var(--font-primary);
    font-size: var(--font-primary-medium);
    font-weight: var(--font-primary-default);
    line-height: 165%;
    max-width: 560px;
    margin-top: 18px;
    text-align:center;
    margin-left:auto;
    margin-right:auto;
}

.header-button-wrap {
    width: 1180px;
    max-width: 90%;
    margin: 0 auto;
    text-align: center;
}

.header-button-wrap a {
    margin: 34px 0 0;
    padding: 16px 34px;
}

.content-wrap .header-widgets-wrapper {
    margin-bottom: 46px;
}

.header-widgets-wrapper .wp-block-column {
    background: var(--minimalist-blogger-x-background);
    border-radius: var(--minimalist-blogger-x-element-border-radius);
    padding: 30px;
}

.header-widgets-wrapper .wp-block-column h2:first-of-type {
    font-family: var(--font-primary);
    font-size: var(--font-primary-small);
    font-weight: var(--font-primary-bold);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--minimalist-blogger-x-primary);
}

#primary .all-blog-articles article.blogposts-list {
    border-radius: var(--minimalist-blogger-x-element-border-radius);
    overflow: hidden;
    margin-bottom: 26px;
}

#primary .all-blog-articles .blogposts-list header.entry-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
}

#primary .all-blog-articles .blogposts-list header.entry-header .entry-meta {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    margin: 0 0 10px;
}

#primary .all-blog-articles .blogposts-list header.entry-header h2.entry-title {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 100%;
    margin: 0;
}

#primary .all-blog-articles article h2.entry-title {
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-large);
    font-weight: var(--font-secondary-bold);
    line-height: 118%;
    letter-spacing: -0.015em;
}

#primary .all-blog-articles h2.entry-title a {
    color: var(--minimalist-blogger-x-foreground);
    -webkit-transition: 0.2s color;
    -o-transition: 0.2s color;
    transition: 0.2s color;
}

#primary .all-blog-articles h2.entry-title a:hover {
    color: var(--minimalist-blogger-x-primary);
}

#primary .all-blog-articles .entry-meta,
#primary .all-blog-articles .entry-meta a,
#primary .all-blog-articles .post-meta-inner-wrapper {
    font-family: var(--font-primary);
    font-size: 12px;
    font-weight: var(--font-primary-bold);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--minimalist-blogger-x-dark-1);
    line-height: 150%;
    margin-top: 0;
}

#primary .all-blog-articles .entry-meta a:hover {
    color: var(--minimalist-blogger-x-primary);
}

#primary .all-blog-articles .entry-content {
    color: var(--minimalist-blogger-x-dark-1);
    margin-top: 14px;
}

#primary .all-blog-articles .entry-content p {
    font-size: var(--font-primary-normal);
    line-height: 170%;
}

#primary .read-story,
#primary .related-posts .read-more {
    background: rgba(0, 0, 0, 0);
    color: var(--minimalist-blogger-x-primary);
    border: 1px solid var(--minimalist-blogger-x-primary);
    padding: 11px 26px;
    margin-top: 22px;
    font-size: 12px;
    font-weight: var(--font-primary-bold);
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

#primary .read-story:hover,
#primary .related-posts .read-more:hover {
    background: var(--minimalist-blogger-x-primary);
    color: var(--minimalist-blogger-x-button-text-color);
}

#primary .featured-img-box .featured-img-category {
    top: auto;
    bottom: 14px;
    left: 14px;
    background: var(--minimalist-blogger-x-background);
    color: var(--minimalist-blogger-x-foreground);
    border-radius: 50px;
    padding: 6px 15px;
    font-size: 11px;
    font-weight: var(--font-primary-bold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    z-index: 2;
}

#primary .blogpost-is-sticky-icon svg {
    background: var(--minimalist-blogger-x-primary);
}

#primary .all-blog-articles .featured-thumbnail {
    overflow: hidden;
}

#primary .all-blog-articles .featured-thumbnail img {
    -webkit-transition: 0.6s -webkit-transform;
    transition: 0.6s -webkit-transform;
    -o-transition: 0.6s transform;
    transition: 0.6s transform;
    transition: 0.6s transform, 0.6s -webkit-transform;
}

#primary .all-blog-articles .featured-img-box:hover .featured-thumbnail img {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}

.archive .archive-description {
    text-align: left;
    color: var(--minimalist-blogger-x-dark-1);
}

.archive .page-header h1,
header.page-header.search-results-header-wrapper h1.page-title {
    text-align: left;
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-xl);
    letter-spacing: -0.02em;
}

header.page-header.search-results-header-wrapper {
    background: rgba(0, 0, 0, 0);
    border-bottom: 1px solid var(--minimalist-blogger-x-light-2);
    border-radius: 0;
    padding: 0 0 22px;
    margin-bottom: 34px;
}

.text-center.pag-wrapper {
    text-align: left;
}

.page-numbers li a.page-numbers {
    background: rgba(0, 0, 0, 0);
    color: var(--minimalist-blogger-x-foreground);
    border: 1px solid var(--minimalist-blogger-x-light-2);
    font-size: var(--font-primary-small);
    letter-spacing: 0.05em;
    margin: 10px 8px 10px 0;
}

.page-numbers li a.page-numbers:hover {
    background: var(--minimalist-blogger-x-primary);
    border-color: var(--minimalist-blogger-x-primary);
    color: var(--minimalist-blogger-x-button-text-color);
}

.page-numbers li .page-numbers.current {
    background: var(--minimalist-blogger-x-primary);
    color: var(--minimalist-blogger-x-button-text-color);
    border: 1px solid var(--minimalist-blogger-x-primary);
    margin: 10px 8px 10px 0;
}

.page-numbers li a.next.page-numbers,
.page-numbers li a.prev.page-numbers {
    color: var(--minimalist-blogger-x-foreground);
    text-transform: uppercase;
    letter-spacing: 0.16em;
    font-size: 12px;
}

.page-numbers li a.next.page-numbers:hover,
.page-numbers li a.prev.page-numbers:hover {
    color: var(--minimalist-blogger-x-button-text-color);
}

.single header.entry-header h1,
.page header.entry-header h1 {
    text-align: left;
}

.page h1.entry-title,
.single h1.entry-title {
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-xxl);
    font-weight: var(--font-secondary-bold);
    line-height: 112%;
    letter-spacing: -0.02em;
}

.single .blog-data-wrapper:after {
    display: none;
}

.single .post-meta-inner-wrapper {
    background: rgba(0, 0, 0, 0);
    padding: 0;
    margin-top: 0;
}

.single #main > .posts-entry .entry-meta {
    margin: 16px 0 30px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--minimalist-blogger-x-light-2);
}

.single .entry-meta *,
.single .entry-meta a,
.single .entry-meta {
    text-align: left;
    font-family: var(--font-primary);
    font-size: 12px;
    font-weight: var(--font-primary-bold);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--minimalist-blogger-x-dark-1);
}

.single .entry-meta a:hover {
    color: var(--minimalist-blogger-x-primary);
}

.single #main > .posts-entry .featured-thumbnail,
.page #main > .posts-entry .featured-thumbnail {
    border-radius: var(--minimalist-blogger-x-element-border-radius);
    overflow: hidden;
    margin-bottom: 32px;
}

.single #main > .posts-entry .entry-content p,
.page #main > .posts-entry .entry-content p {
    font-size: var(--font-primary-medium);
    line-height: 178%;
}

.single #main > .posts-entry .entry-content > p:first-of-type {
    font-size: 21px;
    line-height: 162%;
    color: var(--minimalist-blogger-x-foreground);
}

.widget_tag_cloud a,
.wp-block-tag-cloud a {
    background-color: var(--minimalist-blogger-x-light-2);
    color: var(--minimalist-blogger-x-foreground);
    padding: 7px 18px;
    font-size: 12px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.widget_tag_cloud a:hover,
.wp-block-tag-cloud a:hover {
    background-color: var(--minimalist-blogger-x-primary);
    color: var(--minimalist-blogger-x-button-text-color);
}

.site-footer .widget_tag_cloud a,
.site-footer .wp-block-tag-cloud a {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--minimalist-blogger-x-background);
}

.site-footer .widget_tag_cloud a:hover,
.site-footer .wp-block-tag-cloud a:hover {
    background-color: var(--minimalist-blogger-x-primary);
    color: var(--minimalist-blogger-x-button-text-color);
}

.category-and-tags {
    margin-top: 36px;
    padding-top: 26px;
    border-top: 1px solid var(--minimalist-blogger-x-light-2);
}

.category-and-tags a {
    padding: 8px 20px;
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.category-and-tags a[rel="category"] {
    background-color: var(--minimalist-blogger-x-primary);
}

.post-navigation .nav-previous a,
.posts-navigation .nav-previous a,
.post-navigation .nav-next a,
.posts-navigation .nav-next a {
    background-color: rgba(0, 0, 0, 0);
    color: var(--minimalist-blogger-x-foreground);
    border: 1px solid var(--minimalist-blogger-x-light-2);
    font-size: 12px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 18px;
}

.post-navigation .nav-previous a:hover,
.posts-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover,
.posts-navigation .nav-next a:hover {
    background-color: var(--minimalist-blogger-x-primary);
    border-color: var(--minimalist-blogger-x-primary);
    color: var(--minimalist-blogger-x-button-text-color);
}

.related-posts-headline h3 {
    font-family: var(--font-primary);
    font-size: var(--font-primary-small);
    font-weight: var(--font-primary-bold);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    border-bottom: 1px solid var(--minimalist-blogger-x-light-2);
    padding-bottom: 14px;
    margin-bottom: 6px;
}

.related-posts h4 {
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-medium);
    font-weight: var(--font-secondary-bold);
    line-height: 124%;
    letter-spacing: -0.01em;
    margin: 10px 0 6px;
}

.related-posts h4 a {
    -webkit-transition: 0.2s color;
    -o-transition: 0.2s color;
    transition: 0.2s color;
}

.related-posts h4 a:hover {
    color: var(--minimalist-blogger-x-primary);
}

.related-posts-posts .entry-meta,
.related-posts-posts .entry-meta * {
    font-family: var(--font-primary);
    font-size: 11px;
    font-weight: var(--font-primary-bold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--minimalist-blogger-x-dark-1);
}

.related-posts .featured-thumbnail {
    border-radius: var(--minimalist-blogger-x-element-border-radius);
    overflow: hidden;
}

#primary .related-posts .entry-content {
    margin-top: 10px;
}

#primary .related-posts .entry-content p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: var(--font-primary-small);
    line-height: 165%;
    color: var(--minimalist-blogger-x-dark-1);
}

.about-the-author h3 {
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-large);
    letter-spacing: -0.01em;
}

.about-the-author-img img {
    border: 3px solid var(--minimalist-blogger-x-light-2);
}

#secondary .sidebar-headline-wrapper {
    margin-bottom: 18px;
}

#secondary .widget-title-lines {
    width: 34px;
    height: 2px;
    background: var(--minimalist-blogger-x-primary);
    margin-bottom: 13px;
}

#secondary h3.widget-title,
#secondary .widget_block h2 {
    font-family: var(--font-primary);
    font-size: var(--font-primary-small);
    font-weight: var(--font-primary-bold);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--minimalist-blogger-x-foreground);
    margin: 0;
}

#secondary .widget:not(.widget_block) {
    margin-bottom: 42px;
}

#secondary li {
    line-height: 165%;
    margin-bottom: 9px;
}

#secondary a {
    text-decoration: none;
}

#secondary a:hover {
    color: var(--minimalist-blogger-x-primary);
}

.widget_search {
    background: rgba(0, 0, 0, 0);
    padding: 0;
}

.widget_search input[type="search"] {
    border: 1px solid var(--minimalist-blogger-x-light-2);
    font-weight: var(--font-primary-default);
}

.widget_search .wp-block-search__label,
.widget_search .widget-title {
    text-transform: uppercase;
    letter-spacing: 0.18em;
}

.widget_search button[type="submit"],
.widget_search .search-submit {
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 12px;
}

.comments-area .comments-title,
#comments h3#reply-title {
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-large);
    font-weight: var(--font-secondary-bold);
    letter-spacing: -0.01em;
}

.comment-respond {
    background: var(--minimalist-blogger-x-background);
    border: 1px solid var(--minimalist-blogger-x-light-2);
    padding: 34px 30px;
}

.comments-area .comment-author {
    font-family: var(--font-primary);
    letter-spacing: 0.01em;
}

#comments .comment-metadata *,
.comments-area .comment-metadata a {
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--minimalist-blogger-x-dark-1);
}

.comments-area .reply .comment-reply-link {
    font-size: 12px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: var(--font-primary-bold);
    color: var(--minimalist-blogger-x-primary);
    text-decoration: none;
}

.comments-area p.form-submit input {
    text-transform: uppercase;
    letter-spacing: 0.16em;
    font-size: 12px;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.header-button-wrap a,
.fourofour-home a,
.header-content-some-container a,
.header-content-button-container a {
    text-transform: uppercase;
    letter-spacing: 0.16em;
    font-size: 12px;
    font-weight: var(--font-primary-bold);
}

input[type="color"],
input[type="date"],
input[type="datetime-local"],
input[type="datetime"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="range"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
textarea {
    border: 1px solid var(--minimalist-blogger-x-light-2);
    padding: 13px 16px;
}

section.error-404.not-found,
.search-form-wrapper {
    background: var(--minimalist-blogger-x-background);
    border: 1px solid var(--minimalist-blogger-x-light-2);
}

section.error-404.not-found input.search-field,
.search-form-wrapper input.search-field {
    border: 1px solid var(--minimalist-blogger-x-light-2);
}

section.error-404.try-new-posts .try-new-post-headline {
    font-family: var(--font-secondary);
    font-size: var(--font-secondary-xl);
    letter-spacing: -0.02em;
}

#colophon.site-footer {
    margin-top: 70px;
    border-top: 0;
}

.site-footer-widget-area {
    padding: 56px 0 34px;
}

.site-footer .widget-title,
.site-footer h3.widget-title,
.site-footer .widget h2 {
    font-family: var(--font-primary);
    font-size: var(--font-primary-small);
    font-weight: var(--font-primary-bold);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--minimalist-blogger-x-background);
}

.site-footer li {
    line-height: 165%;
    margin-bottom: 9px;
}

.site-footer a {
    text-decoration: none;
}

.site-footer a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

#colophon .site-info {
    font-size: 12px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 26px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    width: 1180px;
    max-width: 90%;
    margin: 0 auto;
}

#goTop {
    background-color: var(--minimalist-blogger-x-primary);
    color: var(--minimalist-blogger-x-button-text-color);
}

#goTop:hover {
    background-color: var(--minimalist-blogger-x-primary-dark);
}

@media screen and (min-width: 700px) {
    #primary .all-blog-articles .blogposts-list .featured-img-box {
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    #primary .all-blog-articles .blogposts-list .featured-img-box .featured-thumbnail {
        max-width: 40%;
        min-width: 40%;
        height: auto;
        min-height: 250px;
        -ms-flex-item-align: stretch;
        align-self: stretch;
        background-size: cover;
        background-position: center;
    }

    #primary .all-blog-articles .blogposts-list .featured-img-box .featured-thumbnail img {
        -o-object-fit: cover;
        object-fit: cover;
        height: 100%;
        width: 100%;
        min-width: 100%;
    }

    #primary .all-blog-articles .blogposts-list .featured-img-box .content-wrapper {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    #primary .all-blog-articles .blogposts-list .featured-img-box .content-wrapper > * {
        width: 100%;
    }

    #primary .all-blog-articles .blogposts-list .featured-img-box .content-wrapper > .read-story {
        width: auto;
    }

    #primary .all-blog-articles article h2.entry-title {
        font-size: var(--font-secondary-extra);
    }
}

@media screen and (max-width: 1200px) {
    .bottom-header-title {
        font-size: var(--font-secondary-xxl);
    }
}

@media screen and (max-width: 992px) {
    #masthead.sheader {
        margin: 0 0 26px;
    }

    .bottom-header-wrapper,
    .content-wrap .header-widgets-wrapper {
        margin-bottom: 30px;
    }

    #colophon.site-footer {
        margin-top: 45px;
    }
}

@media screen and (max-width: 700px) {
    .bottom-header-wrapper img {
        min-height: 400px;
    }

    .bottom-header-title {
        font-size: var(--font-secondary-extra);
    }

    .bottom-header-paragraph {
        font-size: var(--font-primary-normal);
        margin-top: 12px;
    }

    .bottom-header-pre-title {
        font-size: 12px;
        margin-bottom: 10px;
    }

    .header-button-wrap a {
        margin-top: 22px;
        padding: 13px 26px;
    }

    #primary .all-blog-articles article h2.entry-title {
        font-size: var(--font-secondary-large);
    }

    .page h1.entry-title,
    .single h1.entry-title {
        font-size: var(--font-secondary-extra);
    }

    .single .entry-content > p:first-of-type {
        font-size: var(--font-primary-medium);
    }

    .archive .page-header h1,
    header.page-header.search-results-header-wrapper h1.page-title {
        font-size: var(--font-secondary-large);
    }

    .related-posts-posts .post {
        text-align: left;
    }

    .about-the-author-description h3,
    .related-posts-headline h3 {
        text-align: left;
    }

    .related-posts-posts .blog-data-wrapper {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    .about-the-author-img {
        text-align: left;
    }
}

/* ==========================================================================
   PART 2 — Elec Water additions
   ========================================================================== */

/* --------------------------------------------------------------------------
   Footer — centered, clean, responsive copyright
   Footer widgets and the back-to-top control are preserved.
   -------------------------------------------------------------------------- */

.site-footer .site-info {
	text-align: center;
}

.site-footer .ew-copyright {
	margin: 0;
	font-size: 15px;
	line-height: 1.7;
	letter-spacing: 0.2px;
}

.site-footer .ew-copyright .sep {
	opacity: 0.45;
	margin: 0 2px;
}

.site-footer .ew-footer-nav {
	margin-top: 10px;
}

.site-footer .ew-footer-nav ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-footer .ew-footer-nav ul li {
	margin: 0;
	padding: 0;
}

.site-footer .ew-footer-nav ul li a {
	font-size: 14px;
	opacity: 0.85;
}

.site-footer .ew-footer-nav ul li a:hover,
.site-footer .ew-footer-nav ul li a:focus {
	opacity: 1;
}

@media (max-width: 575px) {
	.site-footer .ew-copyright {
		font-size: 14px;
	}

	.site-footer .ew-footer-nav ul {
		gap: 4px 16px;
	}
}

/* --------------------------------------------------------------------------
   Classic homepage blog layout
   Featured image (uncropped) -> title -> meta -> full content.
   Scoped to .ew-classic-post so archives and single posts are untouched.
   -------------------------------------------------------------------------- */

.ew-classic-post {
	display: block;
	margin-bottom: 48px;
	padding-bottom: 40px;
}

.ew-classic-post:last-of-type {
	border-bottom: 0;
	margin-bottom: 24px;
}

/* Featured image — full width, natural aspect ratio, never cropped */
.ew-classic-post .ew-classic-thumb {
	margin: 0 0 22px;
	line-height: 0;
	overflow: hidden;
	border-radius: 6px;
}

.ew-classic-post .ew-classic-thumb a {
	display: block;
}

.ew-classic-post .ew-classic-thumb img {
	width: 100%;
	height: auto;
	max-width: 100%;
	display: block;
	object-fit: none;
}

.ew-classic-post .ew-classic-category {
	display: inline-block;
	margin-bottom: 10px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ew-classic-post .entry-title {
	margin: 0 0 10px;
	line-height: 1.25;
}

.ew-classic-post .entry-meta {
	margin-bottom: 18px;
	font-size: 14px;
	opacity: 0.8;
}

.ew-classic-post .entry-content {
	line-height: 1.8;
	word-wrap: break-word;
}

.ew-classic-post .entry-content > *:last-child {
	margin-bottom: 0;
}

.ew-classic-post .entry-content img,
.ew-classic-post .entry-content iframe,
.ew-classic-post .entry-content video {
	max-width: 100%;
	height: auto;
}

@media (max-width: 575px) {
	.ew-classic-post {
		margin-bottom: 34px;
		padding-bottom: 28px;
	}
}
