/*
Theme Name: SKT Copywriter
Theme URI: https://www.sktthemes.org/shop/skt-copywriter/
Author: sonalsinha21
Author URI: https://wordpress.org/themes/author/sonalsinha21/
Description: The SKT Copywriter theme is responsive. It is a solution for content creators, marketing writers, brand storytellers, advertising specialists, bloggers, and creative communication experts. Designed with clean layouts and responsive functionality, it helps digital content professionals showcase portfolios, articles, campaigns, and promotional services with style. This theme is built using ITCSS and BEM methodology, it ensures fast performance, clean code, SEO-friendliness, and compatibility. Ideal for persuasive content developers, editorial writers, and messaging strategists, it offers elegant typography and user friendly navigation. SKT Copywriter delivers a polished online presence for every creative content specialist and marketing communication professional. Documentation : https://sktthemesdemo.net/documentation/skt-copywriter-doc/ 
Template: skt-consulting
Version: 1.1
Requires at least: 5.6
Tested up to: 7.0
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: skt-copywriter
Tags: two-columns, right-sidebar, full-width-template, custom-background, custom-colors, custom-menu, sticky-post, theme-options, threaded-comments, featured-images, footer-widgets, translation-ready, rtl-language-support, custom-logo, editor-style, custom-header, blog, e-commerce

SKT Copywriter is a child theme of SKT Consulting. SKT Consulting is based on Underscores, which is distributed under the terms of the GNU GPL v2 or later.

SKT Copywriter WordPress Theme, Copyright 2026 SKT Themes (sktthemes.org)
SKT Copywriter is distributed under the terms of the GNU GPL v2 or later.
*/

/* ==========================================================================
   TABLE OF CONTENTS
   01. CSS Variables & Reset
   02. Typography
   03. Layout (container, content, sidebar)
   04. Header & Navigation
   05. Inner Page Banner
   06. Buttons & Links
   07. Forms & Inputs
   08. Blog (lists, single post, post meta)
   09. Pagination & Post Navigation
   10. Sidebar & Widgets
   11. Comments
   12. Footer & Copyright
   13. Block Editor / Gutenberg
   14. WooCommerce essentials
   15. Tables, Code, Blockquote
   16. Accessibility & Utilities
   ========================================================================== */


/* ==========================================================================
   01. CSS Variables & Reset
   --------------------------------------------------------------------------
   Bold editorial palette: ink-black canvas accents, hard edges, hairline
   rules instead of shadows, and one sharp signal-yellow accent.
   ========================================================================== */
:root {
    --sps-ink: #0a0a0a;
	--sps-ink-hover: #2fb3a4;
    --sps-ink-soft: #161616;
    --sps-paper: #f4f1ea;
    --sps-paper-pure: #ffffff;
    --sps-accent: #2fb3a4;
    --sps-accent-deep: #e4cf00;
    --sps-text: #1c1c1c;
    --sps-text-dark: #0a0a0a;
    --sps-text-invert: #000000;
    --sps-muted: #6b6b6b;
    --sps-muted-invert: #9a988f;
    --sps-line: #0a0a0a;
    --sps-line-soft: #d8d4c8;
    --sps-bg: #ffffff;
    --sps-bg-alt: #e9e5da;
    --sps-bg-card: #ffffff;
    --sps-footer-bg: #f3f7fa;
    --sps-footer-text: #1d1d1d;
    --sps-footer-heading: #1d1d1d;
    --sps-footer-line: #c6e2e1;
    --sps-copyright-bg: #f3f7fa;
	--sps-orng: #ff895b;
	--sps-gray: #000000;
	--sps-green: #2fb3a4;

    --sps-icon-bg: #2fb3a4;
    --sps-icon-hover: #ffffff;
    --sps-icon-size: 60px;
    --sps-spacing-y: 60px;

    /* Sharp / square — no rounding anywhere */
    --sps-radius: 0px;
    --sps-radius-sm: 0px;
    --sps-radius-pill: 0px;

    /* Hard offset "print" shadows instead of soft blurs */
	--sps-shadow-mid: -10px 10px 0 var(--sps-ink);
    --sps-shadow-sm: 4px 4px 0 var(--sps-ink);
    --sps-shadow: 6px 6px 0 var(--sps-ink);
    --sps-shadow-lg: 10px 10px 0 var(--sps-ink);
	--sps-shadow-smn: 10px 0 0 var(--sps-gray);
	--sps-shadow-smnh: 10px 0 0 var(--sps-green);

    --sps-border-w: 2px;
	--sps-border-wn: 2px 2px 2px 2px;
    --sps-border-w-thick: 3px;

    --sps-transition: 0.18s cubic-bezier(0.2, 0, 0, 1);

    --sps-container: 1240px;

    --sps-font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --sps-font-heading: 'Archivo', 'Inter', "Helvetica Neue", Arial, sans-serif;
    --sps-font-display: 'Archivo', 'Anton', "Helvetica Neue", Arial, sans-serif;
    --sps-font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	--sps-font-menu: 'Poppins';
	--sps-font-banner-heading: 'Playfair Display';
}

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

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

body {
    margin: 0;
    background-color: var(--sps-bg);
    color: var(--sps-text);
    font-family: var(--sps-font-body);
    font-size: 16px;
    line-height: 1.65;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

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

iframe {
    max-width: 100%;
}

hr {
    border: 0;
    border-top: var(--sps-border-w) solid var(--sps-line);
    margin: 36px 0;
}

::selection {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
}


/* ==========================================================================
   02. Typography
   --------------------------------------------------------------------------
   Big, tight, high-contrast. Headings are heavy and condensed-feeling.
   ========================================================================== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--sps-font-heading);
    color: var(--sps-text-dark);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.02em;
    margin: 0 0 20px;
    text-wrap: balance;
}

h1 { font-size: 56px; }
h2 { font-size: 42px; }
h3 { font-size: 30px; }
h4 { font-size: 23px; }
h5 { font-size: 19px; }
h6 {
    font-size: 14px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 700;
}

p {
    margin: 0 0 20px;
}

a {
    color: var(--sps-text-dark);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    text-decoration-color: var(--sps-orng);
    transition: color var(--sps-transition), background-color var(--sps-transition);
}

a:hover,
a:focus {
    color: var(--sps-ink);
    text-decoration: none;
}

a:focus-visible {
    outline: var(--sps-border-w) solid var(--sps-ink);
}

strong, b { font-weight: 700; }
em, i    { font-style: italic; }

small { font-size: 0.8em; }


/* ==========================================================================
   03. Layout
   ========================================================================== */
.container {
    width: 100%;
    max-width: var(--sps-container);
    margin: 0 auto;
    padding: 0 28px;
    position: relative;
}

#main-set {
    position: relative;
    z-index: 999;
}

#content_navigator {
    width: 100%;
}

.page_content {
    padding: 30px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0 25px;
}

body.tax-product_cat .page_content {
    display: inherit;
}

.site-main {
    flex: 1 1 0;
    min-width: 0;
    float: none;
    width: auto;
}

#sitefull,
.full-main {
    flex: 0 1 100%;
    width: 100% !important;
    float: none;
}

.clear {
    clear: both;
}


/* ==========================================================================
   04. Header & Navigation
   --------------------------------------------------------------------------
   Flush ink-bordered bar. Left logo, left nav, uppercase, no shadow —
   a hard 3px rule underlines the whole header.
   ========================================================================== */
.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    min-height: 84px;
}

body.blog .header{
	border-bottom: var(--sps-border-w) solid var(--sps-ink);
}

.header {
    width: 100%;
    background-color: var(--sps-paper-pure);
    box-shadow: none;
    position: relative;
    z-index: 100;
    border: 0;    
    border-radius: 0;
    margin: 0;
    padding: 0;
}

.head-bar {
    padding: 0;
    margin: 0;
    width: 100%;
}

.head-bar > .container {
    max-width: var(--sps-container);
    width: 100%;
    margin: 0 auto;
    padding: 25px 27px 25px 28px;
    box-sizing: border-box;
}

.header > .container,
.head-bar > .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    min-height: 92px;
}

.transheaderhome {
  position: absolute!important;
  border:none !important;
  background-color:transparent !important;
  top: 0;
  left: 0;
  right: 0;
  z-index:999 !important;  
}

.transheaderhome .header{
    background-color:transparent !important;
}

.transheader {
    position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgba(10, 10, 10, 0.92);
    box-shadow: none;
    border-bottom: var(--sps-border-w-thick) solid var(--sps-accent);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.transheader .site-title a,
.transheader .site-description,
.transheader .main-navigation a {
    color: var(--sps-text-invert);
}

body.search .transheader,
body.error404 .transheader,
body.inner .transheader {
    position: relative !important;
    background-color: var(--sps-paper-pure);
    border-bottom-color: var(--sps-ink);
}

body.search .transheader .site-title a,
body.error404 .transheader .site-title a,
body.inner .transheader .site-title a,
body.search .transheader .main-navigation a,
body.error404 .transheader .main-navigation a,
body.inner .transheader .main-navigation a {
    color: var(--sps-text-dark);
}

/* ============================================
   HEADER TOPBAR - Complete Styling
   ============================================ */

.header-topbar {
    width: 100%;
    padding: 0;
	font-family: var(--sps-font-menu);
    font-size: 17px;
}

.header-topbar .container {
	background-color: rgba(30,157,143, 1);
    display: flex;
    align-items: center;
    justify-content: flex-start;  
    max-width: 1190px;
    margin: 0 auto;
    padding: 0 20px;
    min-height: 55px;
}

.header-topbar .left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.header-topbar .phntp,
.header-topbar .emltp {
    display: inline-flex;
    align-items: center;
    line-height: 50px;
    color: #ffffff;
    margin-right: 25px;
    font-size: 17px;
    float: none; 
}

.header-topbar .emltp {
    margin-right: 0;
}

.header-topbar .phntp img,
.header-topbar .emltp img {
    margin-right: 8px;
    vertical-align: middle;
    max-height: 16px;
    width: auto;
}

.header-topbar .emltp a {
    color: #ffffff;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: color 0.3s ease;
}

.header-topbar .emltp a:hover {
    color: var(--sps-text-invert);
}

/* ---------- RIGHT SIDE ---------- */
.header-topbar .right {
    display: flex;
    align-items: center;
    margin-left: auto;  
}

.header-topbar .social-icons {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-topbar .social-icons a {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-position: center center;
    text-indent: -9999px;
    overflow: hidden;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.header-topbar .social-icons a:hover {
	background-color:transparent;
	filter: brightness(0);
}

.header-topbar .social-icons a.fb {
    background-image: url('images/icon-fb.png');
}
.header-topbar .social-icons a.tw {
    background-image: url('images/icon-tw.png');
}
.header-topbar .social-icons a.in {
    background-image: url('images/icon-in.png');
}
.header-topbar .social-icons a.insta {
    background-image: url('images/icon-insta.png');
}

.header-topbar .clear {
    clear: both;
}

/* Logo */
.logo {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    flex-shrink: 0;
    padding: 0;
    margin: 0;
    min-height: 100% !important;
}

.logo p.site-title {
    font-size: 30px;
}

.logo img,
.custom-logo {
    max-height: 65px;
}

#logo-main {
    display: flex;
    flex-direction: column;
    text-align: left;
}

#logo-main a {
    text-decoration: none;
    color: inherit;
}

.site-title {
    font-family: var(--sps-font-display);
    font-size: 25px;
    font-weight: 800;
    line-height: 1;
    margin: 0;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}

.site-title a {
    color: var(--sps-text-dark);
    text-decoration: none;
    background: none;
}

.site-title a:hover {
    background: var(--sps-accent);
}

.site-description {
    font-size: 13px;
    color: var(--sps-muted);
    margin: 3px 0 -20px 0;
    line-height: 1.2;
    font-weight: 600;
}

/* Primary Navigation */
#navigation {
    flex: 1;
    display: flex;
    justify-content: flex-start;
    font-family: var(--sps-font-menu);
}

.leftnavig {
    margin-right: auto;
}

.primary-menu {
    display: flex;
    align-items: center;
    gap: 0;
}

/* =====================================================================
   MAIN NAVIGATION  (desktop default)
   ===================================================================== */
.main-navigation {
    display: flex;
    align-items: center;
    position: relative;
    text-transform: uppercase;
}

.main-navigation > div > ul,
.main-navigation > ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 0;
}

.main-navigation li {
    position: relative;
    list-style: none;
}

.main-navigation a {
    display: flex;
    align-items: center;
    padding: 14px 15px;
    color: var(--sps-text-dark);
    font-size: 17px;
    font-weight: 600;
    text-decoration: none;
    background: none;
    transition: background-color var(--sps-transition), color var(--sps-transition), border-color var(--sps-transition);
}

.main-navigation a:hover,
.main-navigation a:focus,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a,
.main-navigation .current-menu-ancestor > a {
    color: var(--sps-ink-hover);
}

/* ---------------------------------------------------------------------
   SUB-MENU (desktop dropdown) — hard black box, no blur, no rounding
   --------------------------------------------------------------------- */
.main-navigation ul ul {
    position: absolute;
    top: calc(100% + 27px);
    left: 0;
    min-width: 248px;
    background-color: var(--sps-accent);
    display: block;
    flex-direction: column;
    margin: 0;
    padding: 0;
    list-style: none;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 9999;
}

.main-navigation ul ul::before {
    content: "";
    position: absolute;
    top: -27px;        
    left: 0;
    right: 0;
    height: 27px;
    background: transparent;
}

.main-navigation ul ul li {
    width: 100%;
}

.main-navigation ul ul li:last-child {
    border-bottom: 0;
}

.main-navigation li:hover > ul,
.main-navigation li.focus > ul,
.main-navigation li.dropdown-open > ul,
.main-navigation li:focus-within > ul {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.main-navigation ul ul a {
    padding: 12px 18px;
    color: var(--sps-bg) !important;
    border: 0;
    width: 100%;
}

.main-navigation ul ul a:hover,
.main-navigation ul ul a:focus {
    background-color: var(--sps-orng);
    color: var(--sps-bg);
}

/* Nested sub-menus open to the side */
.main-navigation ul ul ul {
    top: 0;
    left: 100%;
    margin-left: 0;
    transform: translateX(8px);
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul,
.main-navigation ul ul li.dropdown-open > ul,
.main-navigation ul ul li:focus-within > ul {
    transform: translateX(0);
}

.main-navigation ul li a { line-height: inherit; }

/* ---------------------------------------------------------------------
   DROPDOWN CARET BUTTON
   --------------------------------------------------------------------- */
.main-navigation .dropdown-toggle {
    display: none;
    position: absolute;
    top: 4px;
    right: 4px;
    width: 40px;
    height: 40px;
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 0;
    align-items: center;
    justify-content: center;
    z-index: 5;
}

.main-navigation .dropdown-toggle .dropdown-icon {
    display: block;
    width: 9px;
    height: 9px;
    border-right: 3px solid currentColor;
    border-bottom: 3px solid currentColor;
    transform: rotate(45deg);
    transition: transform var(--sps-transition);
}

.main-navigation .dropdown-open > .dropdown-toggle .dropdown-icon {
    transform: rotate(-135deg);
}

/* Caret indicator on parent items (desktop) */
.main-navigation > div > ul > .menu-item-has-children > a::after,
.main-navigation > ul > .menu-item-has-children > a::after,
.main-navigation > div > ul > .page_item_has_children > a::after,
.main-navigation > ul > .page_item_has_children > a::after {
    content: "+";
    display: inline-block;
    margin-left: 7px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    transition: transform var(--sps-transition);
}

.main-navigation > div > ul > .menu-item-has-children:hover > a::after,
.main-navigation > ul > .menu-item-has-children:hover > a::after {
    transform: rotate(45deg);
}

/* ---------------------------------------------------------------------
   MENU TOGGLE (hamburger - mobile)
   --------------------------------------------------------------------- */
.menu-toggle {
    display: none;
    background: var(--sps-accent);
    border: var(--sps-border-w) solid var(--sps-ink);
    cursor: pointer;
    padding: 8px;
    margin: 0;
    width: 46px;
    height: 46px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    border-radius: 0;
}

.menu-toggle:hover,
.menu-toggle:focus {
    background-color: var(--sps-ink);
}

.menu-toggle:hover span,
.menu-toggle:focus span {
    background: var(--sps-ink);
}

.menu-toggle span {
    display: block;
    width: 22px;
    height: 3px;
    background: var(--sps-ink);
    border-radius: 0;
    transition: transform var(--sps-transition), opacity var(--sps-transition), background var(--sps-transition);
}

.toggled .menu-toggle span {
    background: var(--sps-accent);
}

/* Header button */
.srcrt {
    flex-shrink: 0;
}

.skt-header-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 58px;
    padding: 0 33px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.05em;
    border-radius: 250px;
    text-transform: uppercase;
    font-family: var(--sps-font-heading);
    background: var(--sps-orng);
    color: var(--sps-bg);
    text-decoration: none;
    transition: all var(--sps-transition);
}

.skt-header-button:hover,
.skt-header-button:focus {
    background: var(--sps-accent);
    color: var(--sps-bg);
    text-decoration: none;
}

.hedbtn-details a,
.skt-header-button a {
    color: inherit;
    text-decoration: none;
    background: none;
}


/* ==========================================================================
   05. Inner Page Banner
   --------------------------------------------------------------------------
   Solid ink block, oversized left-aligned headline, accent underline.
   ========================================================================== */
.inner-banner-thumb {
    position: relative;
    width: 100%;
    overflow: hidden;
    background-color: var(--sps-footer-bg);
    min-height: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner-banner-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.inner-banner-thumb::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 10, 10, 0.07), rgba(10, 10, 10, 0.14));
    z-index: 2;
}

.banner-container {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: var(--sps-container);
    margin: 0 auto;
    padding: 64px 28px;
    text-align: center;
}

.banner-container h1 {
    color: var(--sps-text-invert);
    font-size: 40px;
    margin: 0;
    text-shadow: none;
    display: inline;
    line-height: 1.15;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    padding: 0 4px;
	font-family:var(--sps-font-banner-heading);
}


/* ==========================================================================
   06. Buttons & Links
   --------------------------------------------------------------------------
   Square, bordered, with a hard offset shadow on hover ("press" feel).
   ========================================================================== */
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
.wp-block-button__link,
a.read-more-btn,
.rdmore a,
.aboutmore {
    display: inline-block;
    background-color: var(--sps-ink);
    color: var(--sps-bg);
    border: var(--sps-border-w) solid var(--sps-ink);
    padding: 14px 30px;
    font-family: var(--sps-font-heading);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    line-height: 1.3;
    text-decoration: none;
    border-radius: 0;
    cursor: pointer;
    transition: transform var(--sps-transition), box-shadow var(--sps-transition), background-color var(--sps-transition), color var(--sps-transition);
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.button:hover,
.wp-block-button__link:hover,
a.read-more-btn:hover,
.rdmore a:hover,
.aboutmore:hover {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
    text-decoration: none;
}

button:focus-visible,
input[type="submit"]:focus-visible,
.button:focus-visible {
    outline: var(--sps-border-w-thick) solid var(--sps-accent-deep);
    outline-offset: 3px;
}

a.ReadMore {
    display: inline-block;
    margin-top: 20px;
    padding: 12px 26px;
    color: var(--sps-ink);
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    background-color: var(--sps-paper-pure);
    text-decoration: none;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    transition: all var(--sps-transition);
}

a.ReadMore:hover {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
    text-decoration: none;
    transform: translate(-3px, -3px);
    box-shadow: 5px 5px 0 var(--sps-ink);
}


/* ==========================================================================
   07. Forms & Inputs
   --------------------------------------------------------------------------
   Hard 2px ink borders, no rounding, accent ring on focus.
   ========================================================================== */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="date"],
input[type="time"],
input[type="month"],
input[type="week"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea,
select {
    width: 100%;
    max-width: 100%;
    padding: 13px 15px;
    font-family: var(--sps-font-body);
    font-size: 15px;
    color: var(--sps-text-dark);
    background-color: var(--sps-paper-pure);
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    line-height: 1.4;
    transition: box-shadow var(--sps-transition), background-color var(--sps-transition);
    -webkit-appearance: none;
    appearance: none;
}

input:focus,
textarea:focus,
select:focus {
    outline: 0;
    border-color: var(--sps-ink);
    background-color: #fffef2;
    box-shadow: 4px 4px 0 var(--sps-accent);
}

textarea {
    min-height: 150px;
    resize: vertical;
}

label {
    display: inline-block;
    margin-bottom: 7px;
    font-family: var(--sps-font-heading);
    font-weight: 700;
    color: var(--sps-text-dark);
    font-size: 12px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

::placeholder {
    color: var(--sps-muted);
    opacity: 1;
}

/* Search form */
.wp-block-search,
.search-form {
    display: flex;
    gap: 0;
}

.wp-block-search__input,
.search-field {
    flex: 1;
}

.wp-block-search__button,
input.search-submit {
    background-color: var(--sps-ink);
    color: var(--sps-bg);
    border: var(--sps-border-w) solid var(--sps-ink);
    padding: 0 22px;
    border-radius: 0;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: background-color var(--sps-transition), color var(--sps-transition);
}

.wp-block-search__button:hover,
input.search-submit:hover {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
}


/* ==========================================================================
   08. Blog
   --------------------------------------------------------------------------
   Editorial row layout: hairline-ruled list entries, big numbered-feel
   titles, no floating cards. Single post is full-bleed-clean.
   ========================================================================== */
.blog-post {
    margin: 0;
}

.blogpost-wrap-wsb {
    display: grid;
    gap: 0;
}

body.home article.post,
body.home article.hentry,
body.home .blog_lists,
article.post,
article.hentry,
.blog_lists {
    background-color: var(--sps-paper-pure);
    border-style: solid;
	border-color: var(--sps-ink);
	border-width: var(--sps-border-wn);
    overflow: hidden;
	border-radius:0px;
    padding: 0;
    margin: 0 0 28px;
}

article.post:hover,
article.hentry:hover,
.blog_lists:hover {
    box-shadow: none;
}

article.post .post-thumb,
article.hentry .post-thumb {
    width: 100%;
    max-height: none;
    margin: 0;
    float: none;
    overflow: hidden;
    aspect-ratio: 16 / 8;
}

article.post .post-thumb img,
article.hentry .post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%) contrast(1.05);
    transition: filter 0.3s ease, transform 0.4s ease;
}

article.post:hover .post-thumb img,
article.hentry:hover .post-thumb img {
    filter: grayscale(0%) contrast(1);
    transform: none;
}

article.post .entry-header,
article.hentry .entry-header,
article.post .entry-content,
article.hentry .entry-content,
article.post .entry-summary,
article.hentry .entry-summary,
article.post .rdmore,
article.hentry .rdmore {
    padding: 18px 25px;
}

.blog-post article.post .entry-content {
    padding: 0 25px;
}

article.post .entry-header,
article.hentry .entry-header {
    padding-top: 22px;
    padding-bottom: 0;
}

article.post .rdmore,
article.hentry .rdmore {
    padding-bottom: 28px;
    padding-top: 10px;
}

.entry-title {
    font-family: var(--sps-font-heading);
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.08;
    margin: 0 0 12px;
}

.entry-title a {
    position: relative;
    text-decoration: none;
	transition: color 0.25s ease;
}

.entry-title a:hover {
    color: var(--sps-ink-hover);
}

.entry-title a::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -2px;
    width: 0%;
    height: 2px;
    background-color: var(--sps-accent);	
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.entry-title a:hover::after {
    width: 100%;
}

.postmeta {
    color: var(--sps-muted);
    font-family: var(--sps-font-heading);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0 0 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
}

.postmeta a {
    color: var(--sps-text-dark);
    text-decoration: none;
    background: none;
    margin: 0 0 0 6px;
	padding:3px 5px 0 8px;
    border-bottom: 2px solid var(--sps-accent);
}

.postmeta a:hover {
    color: var(--sps-ink);
    background-color: var(--sps-accent);
    text-decoration: none;
}

.post-date,
.post-comment,
.post-categories,
.post-tags {
    display: inline-flex;
    align-items: center;
    color: var(--sps-muted);
}

.entry-content,
.entry-summary {
    font-size: 16px;
    line-height: 1.75;
    color: var(--sps-text);
}

.entry-content a {
    color: var(--sps-text-dark);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-decoration-color: var(--sps-orng);
}

.entry-content a:hover {
    color: var(--sps-ink);
    background-color: var(--sps-accent);
}

.entry-content ul,
.entry-content ol {
    padding-left: 0;
    margin: 0 0 20px 15px;
}

.entry-content li {
    line-height: 1.8;
    margin-bottom: 7px;
}

.entry-content ul li::marker {
    color: var(--sps-accent-deep);
}

.entry-content img {
    border-radius: 0;
    border: var(--sps-border-w) solid var(--sps-ink);
}

/* Single post */
article.single-post {
    padding: 25px;
}

article.single-post:hover {
    box-shadow: none;
    background: transparent;
}

article.single-post .entry-header,
article.single-post .entry-content,
article.single-post .postmeta {
    padding-left: 0;
    padding-right: 0;
}

article.single-post .entry-title {
    font-size: 48px;
}

/* Sticky post highlight */
.sticky {
    border-left: 8px solid var(--sps-accent);
    background-color: #f1f3f5 !important;
}

/* Read more link */
.rdmore a {
    background-color: transparent;
    color: var(--sps-text-dark);
    padding: 2px 6px 0 6px;
    box-shadow: none;
    border: 0;
    border-bottom: var(--sps-border-w-thick) solid var(--sps-ink);
    border-radius: 0;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.rdmore a:hover {
    background: var(--sps-accent);
    color: var(--sps-ink);
    border-bottom-color: var(--sps-ink);
    transform: none;
    box-shadow: none;
}

/* Page header (search, archive titles) */
.page-header {
    margin-bottom: 32px;
    padding-bottom: 18px;
    border-bottom: var(--sps-border-w-thick) solid var(--sps-ink);
}

.page-header .page-title {
    margin: 0;
    font-size: 20px;
    text-transform: uppercase;
}

/* No results / 404 */
.no-results,
.error-404 {
    background-color: var(--sps-paper-pure);
    border: var(--sps-border-w-thick) solid var(--sps-ink);
    border-radius: 0;
    padding: 48px;
    box-shadow: var(--sps-shadow);
}


/* ==========================================================================
   09. Pagination & Post Navigation
   ========================================================================== */
.pagination,
.posts-navigation,
.post-navigation {
    margin: 40px 0;
    display: block;
    clear: both;
}

.pagination .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.pagination .nav-links a,
.pagination .nav-links span,
.posts-navigation .nav-links a,
.post-navigation .nav-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 46px;
    height: 46px;
    padding: 0 16px;
    background-color: var(--sps-paper-pure);
    color: var(--sps-text-dark);
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    text-decoration: none;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    font-size: 14px;
    transition: all var(--sps-transition);
}

.pagination .nav-links a:hover,
.pagination .nav-links span.current,
.posts-navigation .nav-links a:hover,
.post-navigation .nav-links a:hover {
    background-color: var(--sps-accent);
    border-color: var(--sps-ink);
    color: var(--sps-ink);
    text-decoration: none;
}

.pagination .nav-links span.current {
    background-color: var(--sps-ink);
    color: var(--sps-accent);
}

.pagination .nav-links span.dots {
    background: transparent;
    border-color: transparent;
}


/* ==========================================================================
   10. Sidebar & Widgets
   --------------------------------------------------------------------------
   Square ink-bordered blocks. Titles are uppercase with an accent bar.
   ========================================================================== */
#sidebar ol.wp-block-latest-comments {
    padding-left: 0;
}

#sidebar {
    width: 290px;
    flex: 0 0 290px;
    float: none;
    overflow: visible;
    font-size: 15px;
	margin:0 -15px 0 8px;
}

#sidebar aside.widget,
.widget {
    background-color: var(--sps-paper-pure);
    border: var(--sps-border-w) solid var(--sps-ink);
 
    border-bottom-right-radius: 8px;
	border-top-left-radius: 8px;	
    padding: 26px !important;
    margin-bottom: 28px;
    box-shadow: var(--sps-shadow-smn) !important;
    box-sizing: border-box;
}

#sidebar h2,
#sidebar h3,
#sidebar h4,
#sidebar h5,
#sidebar h6,
#sidebar .widget-title,
#sidebar .wp-block-search__label,
#sidebar label {
    color: var(--sps-text-dark);
    font-family: var(--sps-font-heading);
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin: 0 0 18px;
    padding: 0 0 14px;
    position: relative;
    border: 0 !important;
    padding-left: 0 !important;
    display: block;
}

#sidebar h2::after,
#sidebar h3::after,
#sidebar h4::after,
#sidebar h5::after,
#sidebar h6::after,
#sidebar .widget-title::after,
#sidebar .wp-block-search__label::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: var(--sps-border-w-thick);
    background-color: var(--sps-ink);
    border-radius: 0;
}

#sidebar h2::before,
#sidebar h3::before,
#sidebar h4::before,
#sidebar h5::before,
#sidebar h6::before,
#sidebar .widget-title::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: var(--sps-border-w-thick);
    background-color: var(--sps-accent);
    z-index: 1;
}

#sidebar h3.widget-title.titleborder span {
    border: 0;
}

.titleborder span:after {
    display: none;
}

#sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

#sidebar ul li {
    list-style: none;
    padding: 11px 0;
    border-bottom: 1px solid var(--sps-line-soft);
    margin: 0;
}

#sidebar ul li:last-child {
    border-bottom: 0;
}

#sidebar ul li a {
    color: var(--sps-text);
    text-decoration: none;
    background: none;
    display: inline-block;
    line-height: 1.5;
    font-weight: 500;
	padding:2px 6px;
	margin:0 0 0 -3px;
}

#sidebar ul li a:hover {
    color: var(--sps-bg) !important;
    background-color: var(--sps-accent);
    text-decoration: none;
}

#sidebar .widget li ul.children,
#sidebar .widget li ul.sub-menu {
    padding: 10px 0 0 16px;
    margin-top: 8px;
    border-top: 1px solid var(--sps-line-soft);
    border-left: var(--sps-border-w) solid var(--sps-accent);
    list-style: none;
}

#sidebar .wp-block-search__input {
    border: var(--sps-border-w) solid var(--sps-ink);
    padding: 11px 13px;
    border-radius: 0;
}

#sidebar .wp-block-search__button {
    border: var(--sps-border-w) solid var(--sps-ink);
    background-color: var(--sps-ink);
    color: var(--sps-bg);
    padding: 0 18px;
    cursor: pointer;
}

#sidebar .wp-block-search__button:hover {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
}

#sidebar p:empty {
    display: none;
}

/* Tag cloud */
.tagcloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tagcloud a {
    display: inline-block;
    background-color: var(--sps-paper-pure);
    color: var(--sps-text-dark) !important;
    font-family: var(--sps-font-heading);
    font-size: 12px !important;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 7px 13px;
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    text-decoration: none;
    transition: all var(--sps-transition);
}

.tagcloud a:hover {
    background-color: var(--sps-accent);
    color: var(--sps-ink) !important;
    text-decoration: none;
    transform: translate(-2px, -2px);
    box-shadow: 3px 3px 0 var(--sps-ink);
}

/* Calendar widget */
.widget_calendar table {
    width: 100%;
    border-collapse: collapse;
}

.widget_calendar th,
.widget_calendar td {
    padding: 7px;
    text-align: center;
    border: 1px solid var(--sps-ink);
    font-size: 13px;
}

.widget_calendar th {
    background-color: var(--sps-ink);
    color: var(--sps-text-invert);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.05em;
}

.widget_calendar caption {
    font-family: var(--sps-font-heading);
    font-weight: 800;
    text-transform: uppercase;
    margin-bottom: 8px;
}


/* ==========================================================================
   11. Comments
   ========================================================================== */
.bypostauthor {
    background-color: #f5f5f5;
    border-left: 4px solid #0073aa;
    padding: 15px;
    margin-bottom: 15px;
}

#comments {
    margin-top: 56px;
    padding-top: 36px;
    border-top: var(--sps-border-w-thick) solid var(--sps-ink);
}

.comments-title {
    font-size: 28px;
    margin-bottom: 28px;
    text-transform: uppercase;
}

.comment-list {
    list-style: none;
    padding: 0;
    margin: 0 0 36px;
}

.comment-list li {
    list-style: none;
    margin-bottom: 22px;
}

.comment-list .children {
    list-style: none;
    padding: 0;
    margin-left: 34px;
    margin-top: 22px;
    border-left: var(--sps-border-w-thick) solid var(--sps-accent);
    padding-left: 22px;
}

.comment-body {
    background-color: var(--sps-paper-pure);
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    padding: 24px;
}

.comment-author {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}

.comment-author.vcard {
    float: none;
}

.comment-author .avatar {
    border-radius: 0;
    border: var(--sps-border-w) solid var(--sps-ink);
}

.comment-author .fn {
    font-family: var(--sps-font-heading);
    font-weight: 800;
    color: var(--sps-text-dark);
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.comment-metadata {
    font-family: var(--sps-font-heading);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--sps-muted);
    margin-bottom: 12px;
}

.comment-metadata a {
    color: var(--sps-muted);
    text-decoration: none;
    background: none;
}

.reply {
    margin-top: 12px;
}

.reply .comment-reply-link {
    display: inline-block;
    padding: 7px 16px;
    background-color: var(--sps-paper-pure);
    color: var(--sps-text-dark);
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    font-family: var(--sps-font-heading);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
}

.reply .comment-reply-link:hover {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
}

.comment-form-cookies-consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
}

.comment-form-cookies-consent input[type="checkbox"] {
    width: auto;
    margin: 6px 0 0;
    float: none;
}

.comment-form-cookies-consent label {
    margin: 0;
    font-family: var(--sps-font-body);
    font-weight: 400;
    font-size: 14px;
    letter-spacing: normal;
    text-transform: none;
    color: var(--sps-text);
}

.comment-respond {
    margin-top: 36px;
    background-color: var(--sps-paper-pure);
    border: var(--sps-border-w-thick) solid var(--sps-ink);
    border-radius: 0;
    padding: 28px;
}

.comment-reply-title {
    margin-top: 0;
    font-size: 24px;
    text-transform: uppercase;
}

.comment-form p {
    margin-bottom: 16px;
}

.comment-form label {
    display: block;
    margin-bottom: 7px;
}


/* ==========================================================================
   12. Footer & Copyright
   --------------------------------------------------------------------------
   Solid ink footer, accent headings, hairline dividers.
   ========================================================================== */
#footer {
    background-color: var(--sps-footer-bg);
    background-image: none;
    color: var(--sps-footer-text);
    padding: 0;
}

#footer-wrapper {
    width: 100%;
}

#footer .container {
    padding: 0;
}

/* =========================================
   GENERIC
========================================= */
.social-icons br {
    display: none;
}

/* =========================================
   OBJECTS (Layout)
========================================= */
.o-footer {
    background-color: var(--sps-footer-bg);
}

.o-footer__container .container {
    border-bottom: 1px solid var(--sps-footer-line);
}

.o-layout {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.o-layout__left {
    text-align: left;
}

.o-layout__right {
    text-align: right;
}

/* =========================================
   COMPONENTS (Footer UI)
========================================= */
.c-footer-logo {
    padding: var(--sps-spacing-y) 0;
}

.c-footer-logo img {
    max-width: 100%;
    height: auto;
}

.c-footer-social {
    padding: var(--sps-spacing-y) 0;
}

.c-social-icons {
    display: inline-flex;
    gap: 8px;
}

.c-social-icons__link {
    width: var(--sps-icon-size);
    height: var(--sps-icon-size);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: var(--sps-orng) !important;
    transition: all var(--sps-transition);
}

.c-social-icons__link:hover {
    background-color: var(--sps-accent) !important;
}

/* =========================================
   COMPONENT MODIFIERS (Icons)
========================================= */
.c-social-icons__link--fb {
    background: url(images/icon-fb.png) no-repeat center center;
}

.c-social-icons__link--tw {
    background: url(images/icon-tw.png) no-repeat center center;
}

.c-social-icons__link--in {
    background: url(images/icon-in.png) no-repeat center center;
}

.c-social-icons__link--insta {
    background: url(images/icon-insta.png) no-repeat center center;
}

.c-social-icons__link--yt {
    background: url(images/icon-youtube.png) no-repeat center center;
}

.u-clear {
    clear: both;
}

.footerarea {
    background: transparent;
    padding: 24px 0 0 0;
}

.footer.ftr-widg {
    border: 0;
    background: none;
    padding: 40px 0 0 0 !important;
    border-radius: 0;
}

.footer-all {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 48px;
    align-items: flex-start;
}

.footer-lft,
.footer-rght {
    width: auto;
    float: none;
}

.footer-rght {
    display: contents;
}

.rfl-row {
    display: contents;
}

.rfl-row .cols-3 {
    width: auto;
    float: none;
}

.footer aside.widget {
    background: transparent;
    border: 0;
    box-shadow: none !important;
    padding: 0 !important;
    margin-bottom: 18px;
}

.footer h1,
.footer h2,
.footer h3,
.footer h4,
.footer h5,
.footer h6 {
    font-family: var(--sps-font-menu);
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sps-footer-heading);
    margin: 0 0 24px;
    position: relative;
}

.footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer ul li {
    padding: 3px 0;
    border: 0;
    list-style: none;
}

.footer ul li a,
.footer-row ul li a,
.footer-row .cols-3 ul li a {
    color: var(--sps-footer-text) !important;
    text-decoration: none;
    background: none;
    transition: color var(--sps-transition), background-color var(--sps-transition);
    display: inline-block;
    font-size: 16px;
}

.footer ul li a:hover,
.footer-row ul li a:hover,
.footer-row .cols-3 ul li a:hover {
    color: var(--sps-ink) !important;
    background-color: var(--sps-accent);
    text-decoration: none;
}

.footer p {
    color: var(--sps-footer-text);
    line-height: 1.7;
    margin: 0 0 16px;
}

.footer a {
    color: var(--sps-accent);
    text-decoration: none;
}

.footer a:hover {
    color: var(--sps-ink);
    background-color: var(--sps-accent);
}

/* Copyright bar */
.copyright-wrapper {
    background-color: var(--sps-copyright-bg);
    padding: 0;
    border: 0;
}

.copyright-wrapper .container {
    border-top: 1px solid var(--sps-footer-line);
}

.copyright-wrapper .copyright-txt {
    background-color: transparent !important;
    color: var(--sps-footer-text);
    text-align: center;
    padding: 24px 0;
    font-family: var(--sps-font-heading);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border: 0;
    float: none;
}

.copyright-txt a {
    color: var(--sps-accent);
    text-decoration: none;
    background: none;
}

.copyright-txt a:hover {
    color: var(--sps-ink);
    background-color: var(--sps-accent);
    text-decoration: none;
}


/* ==========================================================================
   13. Block Editor / Gutenberg
   ========================================================================== */
.wp-block-quote,
.wp-block-quote.is-style-skt-copywriter-plain {
    border: 0;
    border-left: 8px solid var(--sps-accent);
    background-color: var(--sps-paper-pure);
    padding: 24px 28px;
    margin: 30px 0;
    border-radius: 0;
    font-family: var(--sps-font-heading);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.35;
    font-style: normal;
    color: var(--sps-text-dark);
    box-shadow: var(--sps-shadow-sm);
}

.wp-block-quote.is-style-skt-copywriter-plain {
    background: transparent;
    box-shadow: none;
    border-left-color: var(--sps-accent);
}

.wp-block-quote cite {
    display: block;
    margin-top: 12px;
    font-family: var(--sps-font-heading);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sps-muted);
    font-style: normal;
}

.wp-block-button__link {
    border-radius: 0;
	color:#ccc !important;
}

.wp-block-file__button{
	color:#ccc !important;
}

.wp-block-cover,
.wp-block-image {
    margin-bottom: 28px;
}

.wp-block-image img {
    border-radius: 0;
    border: var(--sps-border-w) solid var(--sps-ink);
}

.wp-block-group {
    margin-bottom: 20px;
}

.wp-block-pullquote {
    border: var(--sps-border-w-thick) solid var(--sps-ink);
    border-left-width: 8px;
    border-left-color: var(--sps-accent);
    padding: 28px;
    margin: 36px 0;
    background-color: var(--sps-paper-pure);
    color: var(--sps-text-dark);
}

.wp-block-pullquote blockquote {
    border: 0;
    background: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
}

.wp-block-separator {
    border: 0;
    border-top: var(--sps-border-w-thick) solid var(--sps-ink);
    margin: 36px auto;
    max-width: 120px;
}

.wp-block-separator.is-style-wide {
    max-width: 100%;
}

.wp-block-table table {
    width: 100%;
    border-collapse: collapse;
}

.wp-block-table th,
.wp-block-table td {
    border: var(--sps-border-w) solid var(--sps-ink);
    padding: 11px 15px;
}

.wp-block-table thead th {
    background-color: var(--sps-ink);
    color: var(--sps-text-invert);
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.06em;
}

.wp-caption,
.wp-block-image figure {
    width: auto !important;
    margin-bottom: 22px;
}

.wp-caption img {
    max-width: 100%;
    height: auto;
}

.wp-caption-text,
.wp-block-image figcaption,
.gallery-caption {
    font-family: var(--sps-font-heading);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sps-muted);
    background-color: var(--sps-ink);
    padding: 9px 13px;
    text-align: left;
    line-height: 1.4;
    border-radius: 0;
    margin: 0;
}

.wp-block-image figcaption {
    color: var(--sps-muted-invert);
}

.alignright {
    float: right;
    margin: 6px 0 20px 28px;
    clear: right;
}

.alignleft {
    float: left;
    margin: 6px 28px 20px 0;
    clear: left;
}

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    max-width: 100%;
}

.alignwide,
.alignfull {
    margin-left: auto;
    margin-right: auto;
}

/* Page links (multipage post) */
.page-links {
    margin: 24px 0;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.page-links .post-page-numbers,
.page-links a .post-page-numbers {
    display: inline-block;
    min-width: 36px;
    padding: 5px 11px;
    margin: 0 4px;
    background-color: var(--sps-paper-pure);
    color: var(--sps-text-dark);
    border: var(--sps-border-w) solid var(--sps-ink);
    text-decoration: none;
    border-radius: 0;
    text-align: center;
}

.page-links a:hover .post-page-numbers,
.page-links .post-page-numbers.current {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
}


/* ==========================================================================
   14. WooCommerce essentials
   ========================================================================== */
.woocommerce ul.products li.product .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    background-color: var(--sps-ink) !important;
    color: var(--sps-text-invert) !important;
    border: var(--sps-border-w) solid var(--sps-ink) !important;
    border-radius: 0;
    padding: 11px 24px;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: all var(--sps-transition);
}

.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
    background-color: var(--sps-accent) !important;
    color: var(--sps-ink) !important;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
    background-color: var(--sps-accent) !important;
    color: var(--sps-ink) !important;
}

.woocommerce ul.products li.product {
    background-color: var(--sps-paper-pure);
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    padding: 18px !important;
    box-shadow: var(--sps-shadow-sm);
    transition: transform var(--sps-transition), box-shadow var(--sps-transition);
}

.woocommerce ul.products li.product:hover {
    transform: translate(-4px, -4px);
    box-shadow: var(--sps-shadow);
}

.woocommerce ul.products li.product img {
    border-radius: 0;
    border: var(--sps-border-w) solid var(--sps-ink);
    margin-bottom: 14px;
    filter: grayscale(100%);
    transition: filter 0.3s ease;
}

.woocommerce ul.products li.product:hover img {
    filter: grayscale(0%);
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--sps-text-dark);
    font-family: var(--sps-font-heading);
    font-weight: 800;
    background: var(--sps-accent);
    display: inline-block;
    padding: 2px 8px;
}

.woocommerce .star-rating span::before {
    color: var(--sps-ink);
}

.woocommerce-product-search button[type='submit'] {
    background-color: var(--sps-ink);
    color: var(--sps-text-invert);
    border: var(--sps-border-w) solid var(--sps-ink);
    padding: 11px 20px;
    border-radius: 0;
    text-transform: uppercase;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    cursor: pointer;
}

.woocommerce-product-search button[type='submit']:hover {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
}

.wc-block-cart__submit-button,
.wc-block-checkout__submit-button {
    background-color: var(--sps-ink);
    color: var(--sps-text-invert) !important;
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    text-transform: uppercase;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    text-decoration: none;
}

.wc-block-cart__submit-button:hover,
.wc-block-checkout__submit-button:hover {
    background-color: var(--sps-accent);
    color: var(--sps-ink) !important;
}

.woocommerce span.onsale {
    background-color: var(--sps-accent);
    color: var(--sps-ink);
    border: var(--sps-border-w) solid var(--sps-ink);
    border-radius: 0;
    font-family: var(--sps-font-heading);
    font-weight: 800;
    text-transform: uppercase;
    min-height: 2.4em;
    min-width: 2.4em;
    line-height: 2.4;
    font-size: 11px !important;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    border-radius: 0;
    border: var(--sps-border-w) solid var(--sps-ink);
    border-top: var(--sps-border-w) solid var(--sps-ink);
    border-left: 8px solid var(--sps-accent);
    padding: 17px 17px 17px 55px;
    background-color: var(--sps-paper-pure);
    color: var(--sps-text-dark);
}

.woocommerce-message {
    border-left-color: var(--sps-accent);
}

.woocommerce-error {
    border-left-color: var(--sps-ink);
}


/* ==========================================================================
   15. Tables, Code, Blockquote
   ========================================================================== */
table:not(.wp-block-table table):not(.widget_calendar table) {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 28px;
}

th, td {
    padding: 12px 15px;
    border: var(--sps-border-w) solid var(--sps-ink);
    text-align: left;
}

th {
    color: var(--sps-text-invert);
    font-family: var(--sps-font-heading);
    font-weight: 800;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.06em;
}

code,
kbd,
pre,
samp,
tt,
var {
    font-family: var(--sps-font-mono);
    font-size: 14px;
}

code,
kbd,
tt,
var {
    background-color: var(--sps-ink);
    color: var(--sps-accent);
    padding: 2px 7px;
    border-radius: 0;
}

pre {
    background-color: var(--sps-ink);
    color: var(--sps-text-invert);
    padding: 22px;
    overflow-x: auto;
    border: var(--sps-border-w) solid var(--sps-ink);
    border-left: 8px solid var(--sps-accent);
    border-radius: 0;
    line-height: 1.6;
    margin: 0 0 24px;
}

pre code {
    background: none;
    color: inherit;
    padding: 0;
}

blockquote {
    border: 0;
    border-left: 8px solid var(--sps-accent);
    background-color: var(--sps-paper-pure);
    padding: 20px 26px;
    margin: 30px 0;
    color: var(--sps-text-dark);
    font-family: var(--sps-font-heading);
    font-size: 20px;
    font-weight: 700;
    font-style: normal;
    border-radius: 0;
    box-shadow: var(--sps-shadow-sm);
}


/* ==========================================================================
   16. Accessibility & Utilities
   ========================================================================== */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background-color: var(--sps-accent);
    border-radius: 0;
    box-shadow: none;
    clip: auto !important;
    -webkit-clip-path: none;
    clip-path: none;
    color: var(--sps-ink);
    display: block;
    font-size: 14px;
    font-weight: 800;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 12px 22px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 100001;
}

.skip-link:focus {
    left: 6px;
    top: 6px;
}

.edit-link {
    display: inline-block;
    margin: 12px 0;
    font-size: 12px;
}

.edit-link a {
    color: var(--sps-muted);
    text-decoration: underline;
    background: none;
}

.alignleft  { float: left; margin: 6px 28px 20px 0; }
.alignright { float: right; margin: 6px 0 20px 28px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; text-align: center; }


/* ==========================================================================
   RTL — minimal flips for right-to-left languages
   ========================================================================== */
body.rtl .alignright { float: left; margin: 6px 28px 20px 0; }
body.rtl .alignleft  { float: right; margin: 6px 0 20px 28px; }
body.rtl #logo-main  { text-align: right; }

body.rtl #sidebar h2::before,
body.rtl #sidebar h3::before,
body.rtl #sidebar h4::before,
body.rtl #sidebar h5::before,
body.rtl #sidebar h6::before,
body.rtl #sidebar .widget-title::before,
body.rtl .footer h2::after,
body.rtl .footer h3::after,
body.rtl .footer h4::after,
body.rtl .footer h5::after,
body.rtl .footer h6::after {
    left: auto;
    right: 0;
}

body.rtl .main-navigation ul ul a {
    border-left: 0;
    border-right: var(--sps-border-w-thick) solid transparent;
}

body.rtl .main-navigation ul ul a:hover {
    border-right-color: var(--sps-ink);
}

body.rtl blockquote,
body.rtl .wp-block-quote,
body.rtl pre {
    border-left: 0;
    border-right: 8px solid var(--sps-accent);
}