/*
Theme Name: Link Shortner
Theme URI: https://geturl.in
Author: GetURL.in
Author URI: https://geturl.in
Description: Fast, SEO-friendly theme for link shorteners. White/light design, full-width mobile, compact layout, built-in Ads Manager, clean and minimal.
Version: 1.1.0
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: link-shortner
Tags: light, one-column, two-columns, custom-colors, custom-menu, featured-images, full-width-template, sticky-post, theme-options, translation-ready
Template: generatepress
*/

/* ── CRITICAL: Font with display:swap for speed ── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

/* ══════════════════════════════════════════════════
   CSS VARIABLES — WHITE THEME
══════════════════════════════════════════════════ */
:root {
    --s2u-bg:      #ffffff;
    --s2u-s1:      #f8f9fa;
    --s2u-s2:      #eef0f3;
    --s2u-s3:      #e2e5ea;
    --s2u-s4:      #d0d4dc;
    --s2u-border:  #e2e5ea;
    --s2u-border2: #cfd3db;
    --s2u-red:     #e63946;
    --s2u-rdk:     #c1121f;
    --s2u-green:   #06d6a0;
    --s2u-text:    #111827;
    --s2u-muted:   #4b5563;
    --s2u-faint:   #9ca3af;
    --s2u-r:       8px;
    --s2u-rl:      10px;
    --s2u-font:    'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --s2u-mono:    'JetBrains Mono','Fira Code',monospace;
    --s2u-ease:    0.15s ease;
    --s2u-px:      14px;
    --s2u-max:     1100px;
}

/* ══════════════════════════════════════════════════
   RESET & BASE
══════════════════════════════════════════════════ */
*,*::before,*::after { box-sizing: border-box }

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

body {
    background: var(--s2u-bg) !important;
    color: var(--s2u-text) !important;
    font-family: var(--s2u-font) !important;
    font-size: 15px;
    line-height: 1.65;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block }
a { color: var(--s2u-red); text-decoration: none }
a:hover { text-decoration: none }
::selection { background: rgba(230,57,70,0.15); color: var(--s2u-text) }

::-webkit-scrollbar { width: 4px }
::-webkit-scrollbar-track { background: var(--s2u-s1) }
::-webkit-scrollbar-thumb { background: var(--s2u-s3); border-radius: 4px }
::-webkit-scrollbar-thumb:hover { background: var(--s2u-red) }

/* ══════════════════════════════════════════════════
   GP RESET
══════════════════════════════════════════════════ */
.site-content,#page,.grid-container { background: transparent !important }

.grid-container {
    max-width: var(--s2u-max) !important;
    padding-left: var(--s2u-px) !important;
    padding-right: var(--s2u-px) !important;
    width: 100% !important;
    margin: 0 auto !important;
}

#page .grid-container { padding-top: 0 !important; padding-bottom: 0 !important }

/* ══════════════════════════════════════════════════
   HEADER — compact, sticky
══════════════════════════════════════════════════ */
.site-header {
    background: #fff !important;
    border-bottom: 1px solid var(--s2u-border) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.07) !important;
}

.s2u-hdr-inner {
    max-width: var(--s2u-max);
    margin: 0 auto;
    padding: 0 var(--s2u-px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 50px;
    gap: 10px;
}

.site-branding { flex-shrink: 0 }

.site-title,
.site-branding .site-title {
    font-size: 1.1rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em !important;
    margin: 0 !important;
    line-height: 1 !important;
}

.site-title a,
.site-branding .site-title a {
    color: var(--s2u-text) !important;
    text-decoration: none !important;
}

.logo-accent { color: var(--s2u-red) }
.site-description { display: none !important }

/* ── Mobile nav toggle ── */
.menu-toggle,
button.menu-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    background: var(--s2u-s1) !important;
    color: var(--s2u-text) !important;
    border: 1px solid var(--s2u-border) !important;
    border-radius: var(--s2u-r) !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    transition: background var(--s2u-ease) !important;
}

.menu-toggle:hover,button.menu-toggle:hover {
    background: var(--s2u-s2) !important;
}

/* ── Nav ── */
.main-navigation,.nav-primary { background: transparent !important }

.main-navigation ul,
.nav-primary ul {
    display: none !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Mobile toggled */
.main-navigation.toggled ul#primary-menu,
.nav-primary.toggled ul#primary-menu {
    display: flex !important;
    flex-direction: column !important;
    gap: 1px !important;
    position: fixed !important;
    top: 50px !important;
    left: 0 !important;
    right: 0 !important;
    background: #fff !important;
    border-bottom: 1px solid var(--s2u-border) !important;
    padding: 8px var(--s2u-px) 10px !important;
    z-index: 999 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
    max-height: calc(100dvh - 50px) !important;
    overflow-y: auto !important;
}

.main-navigation ul li a,
.nav-primary ul li a {
    display: block !important;
    color: var(--s2u-muted) !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    padding: 9px 10px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: color var(--s2u-ease), background var(--s2u-ease) !important;
}

.main-navigation ul li a:hover,
.nav-primary ul li a:hover {
    color: var(--s2u-text) !important;
    background: var(--s2u-s1) !important;
}

.main-navigation ul li.current-menu-item > a,
.nav-primary ul li.current-menu-item > a {
    color: var(--s2u-red) !important;
    background: rgba(230,57,70,0.06) !important;
}

/* Sub-menu mobile */
.main-navigation ul ul,
.nav-primary ul ul {
    position: static !important;
    background: var(--s2u-s1) !important;
    border: none !important;
    border-radius: 6px !important;
    margin: 2px 0 2px 10px !important;
    padding: 4px 0 !important;
    display: none !important;
    min-width: 0 !important;
}

.main-navigation ul li:hover > ul,
.nav-primary ul li:hover > ul,
.main-navigation ul li.focus > ul,
.nav-primary ul li.focus > ul { display: block !important }

/* Desktop */
@media(min-width:769px) {
    .menu-toggle,button.menu-toggle { display: none !important }

    .main-navigation ul,
    .nav-primary ul {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 2px !important;
        position: static !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        box-shadow: none !important;
        max-height: none !important;
    }

    .main-navigation ul li,
    .nav-primary ul li { position: relative !important }

    .main-navigation ul ul,
    .nav-primary ul ul {
        position: absolute !important;
        top: calc(100% + 4px) !important;
        left: 0 !important;
        background: #fff !important;
        border: 1px solid var(--s2u-border) !important;
        border-radius: var(--s2u-r) !important;
        margin: 0 !important;
        padding: 4px !important;
        min-width: 170px !important;
        box-shadow: 0 6px 16px rgba(0,0,0,0.1) !important;
    }
}

/* ══════════════════════════════════════════════════
   PAGE LAYOUT GRID
══════════════════════════════════════════════════ */
.s2u-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    padding: 0 0 40px;
    align-items: start;
    width: 100%;
}

@media(min-width:900px) {
    .s2u-layout.has-sidebar {
        grid-template-columns: 1fr 260px;
        gap: 22px;
        padding: 22px 0 40px;
    }
    .s2u-layout:not(.has-sidebar) {
        padding: 20px 0 40px;
    }
}

/* ══════════════════════════════════════════════════
   AD BOXES — max 2 per page
══════════════════════════════════════════════════ */
.s2u-ad-box {
    width: 100%;
    background: var(--s2u-s1);
    border: 1px dashed var(--s2u-border2);
    border-radius: var(--s2u-r);
    padding: 10px;
    margin: 12px 0;
    text-align: center;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.s2u-ad-box .widget { margin: 0 !important }

/* On mobile: ad box goes edge-to-edge like cards */
@media(max-width:768px) {
    .s2u-ad-box {
        border-radius: 0;
        border-left: none;
        border-right: none;
        margin: 10px 0;
    }
}

/* ══════════════════════════════════════════════════
   POST CARDS — full-width on mobile, compact
══════════════════════════════════════════════════ */
.post.s2u-card {
    background: #fff !important;
    border: none !important;
    border-bottom: 1px solid var(--s2u-border) !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    transition: background var(--s2u-ease) !important;
}

.post.s2u-card:hover { background: var(--s2u-s1) !important }

/* Card layout: image left on desktop, stacked on mobile */
@media(min-width:600px) {
    .post.s2u-card {
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
    }

    .post.s2u-card .s2u-thumb-wrap {
        width: 180px !important;
        flex-shrink: 0 !important;
        margin: 0 !important;
        border-radius: 0 !important;
        aspect-ratio: auto !important;
    }

    .post.s2u-card .s2u-card-body {
        flex: 1;
        padding: 14px 16px !important;
    }
}

/* Mobile: full-width image on top */
@media(max-width:599px) {
    .post.s2u-card { display: block !important }

    .post.s2u-card .s2u-thumb-wrap {
        width: 100% !important;
        aspect-ratio: 16/8 !important;
        border-radius: 0 !important;
        margin: 0 !important;
        display: block !important;
    }

    .post.s2u-card .s2u-card-body {
        padding: 10px var(--s2u-px) 14px !important;
    }
}

.s2u-thumb-wrap {
    display: block;
    overflow: hidden;
    background: var(--s2u-s2);
    text-decoration: none;
}

.s2u-thumb-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.post.s2u-card:hover .s2u-thumb-wrap img { transform: scale(1.03) }

.s2u-card-body { padding: 12px var(--s2u-px) }

/* Categories */
.s2u-cats {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 6px;
}

.s2u-cat {
    display: inline-flex;
    background: rgba(230,57,70,0.08);
    color: var(--s2u-red) !important;
    border: 1px solid rgba(230,57,70,0.18);
    padding: 1px 7px;
    border-radius: 20px;
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-decoration: none !important;
    transition: background var(--s2u-ease);
}

.s2u-cat:hover { background: rgba(230,57,70,0.15) !important }

/* Entry title */
.entry-title,
.entry-title a {
    color: var(--s2u-text) !important;
    font-size: 0.975rem !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.01em !important;
    text-decoration: none !important;
    transition: color var(--s2u-ease) !important;
    margin: 0 0 5px !important;
}

.entry-title a:hover { color: var(--s2u-red) !important }
.entry-header { margin-bottom: 6px !important }

/* Meta */
.s2u-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
    color: var(--s2u-faint);
    font-size: 0.72rem;
    margin-bottom: 7px;
}

.s2u-meta a { color: var(--s2u-muted); text-decoration: none }
.s2u-meta a:hover { color: var(--s2u-red) }
.s2u-dot { color: var(--s2u-s3) }
.s2u-meta--single { font-size: 0.78rem; margin-top: 6px }

/* Excerpt */
.entry-summary {
    color: var(--s2u-muted) !important;
    font-size: 0.82rem !important;
    line-height: 1.55 !important;
    margin-bottom: 8px !important;
}

/* Read more */
.s2u-read-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--s2u-red) !important;
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none !important;
    transition: gap var(--s2u-ease);
}

.s2u-read-more:hover { gap: 7px }

/* Legacy read-more / more-link */
.read-more,.more-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: var(--s2u-red) !important;
    color: #fff !important;
    padding: 5px 12px !important;
    border-radius: 6px !important;
    font-size: 0.78rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: background var(--s2u-ease) !important;
}

.read-more:hover,.more-link:hover { background: var(--s2u-rdk) !important; color: #fff !important }

/* ══════════════════════════════════════════════════
   ARCHIVE HEADER / BREADCRUMB
══════════════════════════════════════════════════ */
.archive-header {
    padding: 14px var(--s2u-px) 12px !important;
    border-bottom: 1px solid var(--s2u-border) !important;
    margin-bottom: 0 !important;
}

.archive-title {
    font-size: 1.1rem !important;
    font-weight: 800 !important;
    color: var(--s2u-text) !important;
    margin: 0 !important;
}

.s2u-breadcrumb {
    font-size: 0.73rem;
    color: var(--s2u-faint);
    margin-bottom: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

.s2u-breadcrumb a { color: var(--s2u-muted); text-decoration: none }
.s2u-breadcrumb a:hover { color: var(--s2u-red) }
.s2u-bc-cur { color: var(--s2u-text); font-weight: 500 }

/* ══════════════════════════════════════════════════
   SINGLE POST — full-width mobile
══════════════════════════════════════════════════ */
.single .post,
.post.s2u-single {
    background: #fff !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.single .site-main,
.single #main { width: 100% !important; max-width: 100% !important }

/* Single header padding */
.s2u-single .entry-header {
    padding: 14px var(--s2u-px) 10px !important;
}

@media(min-width:900px) {
    .s2u-single .entry-header {
        padding: 20px 0 12px !important;
    }
}

.single .entry-title {
    font-size: clamp(1.25rem,4.5vw,1.8rem) !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
    line-height: 1.22 !important;
    margin-bottom: 8px !important;
    color: var(--s2u-text) !important;
}

/* Post image — full-width on mobile */
.post-image {
    width: 100% !important;
    overflow: hidden !important;
    margin: 0 0 16px !important;
}

.post-image img {
    width: 100% !important;
    height: auto !important;
    border-radius: 0 !important;
    display: block !important;
}

@media(min-width:900px) {
    .post-image { border-radius: var(--s2u-r) !important; margin: 12px 0 16px !important }
    .post-image img { border-radius: var(--s2u-r) !important }
}

/* Entry content */
.entry-content {
    color: var(--s2u-text) !important;
    font-size: 0.935rem !important;
    line-height: 1.75 !important;
    padding: 0 var(--s2u-px) !important;
}

@media(min-width:900px) { .entry-content { padding: 0 !important } }

.entry-content p { color: var(--s2u-muted) !important; margin-bottom: 1em !important }

.entry-content h2,.entry-content h3,
.entry-content h4,.entry-content h5 {
    color: var(--s2u-text) !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    margin: 1.6em 0 0.45em !important;
    line-height: 1.3 !important;
}

.entry-content h2 { font-size: 1.2rem !important }
.entry-content h3 { font-size: 1.05rem !important }
.entry-content h4 { font-size: 0.97rem !important }

.entry-content a {
    color: var(--s2u-red) !important;
    border-bottom: 1px solid rgba(230,57,70,0.25) !important;
    text-decoration: none !important;
    transition: border-color var(--s2u-ease) !important;
}

.entry-content a:hover { border-color: var(--s2u-red) !important }
.entry-content .s2u-btn,.entry-content .s2u-dl-btn,
.entry-content a.s2u-btn,.entry-content a.s2u-dl-btn { border-bottom: none !important }

.entry-content ul,.entry-content ol {
    padding-left: 1.3em !important;
    color: var(--s2u-muted) !important;
    margin-bottom: 1em !important;
}

.entry-content li { margin-bottom: 4px !important }

.entry-content blockquote {
    border-left: 3px solid var(--s2u-red) !important;
    padding: 8px 14px !important;
    background: var(--s2u-s1) !important;
    border-radius: 0 var(--s2u-r) var(--s2u-r) 0 !important;
    color: var(--s2u-muted) !important;
    font-style: italic !important;
    margin: 1em 0 !important;
}

.entry-content code {
    font-family: var(--s2u-mono) !important;
    background: var(--s2u-s2) !important;
    color: #c0392b !important;
    padding: 1px 5px !important;
    border-radius: 4px !important;
    font-size: 0.83em !important;
    border: none !important;
}

.entry-content pre {
    font-family: var(--s2u-mono) !important;
    background: var(--s2u-s1) !important;
    border: 1px solid var(--s2u-border) !important;
    border-radius: var(--s2u-r) !important;
    padding: 12px !important;
    overflow-x: auto !important;
    font-size: 0.82rem !important;
    line-height: 1.55 !important;
    margin: 1em 0 !important;
}

.entry-content pre code { background: transparent !important; padding: 0 !important; color: var(--s2u-text) !important }

.entry-content table {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 0.84rem !important;
    display: block !important;
    overflow-x: auto !important;
}

.entry-content th {
    background: var(--s2u-s1) !important;
    color: var(--s2u-text) !important;
    font-weight: 600 !important;
    padding: 7px 10px !important;
    text-align: left !important;
    border-bottom: 2px solid var(--s2u-red) !important;
    white-space: nowrap !important;
}

.entry-content td {
    padding: 7px 10px !important;
    border-bottom: 1px solid var(--s2u-border) !important;
    color: var(--s2u-muted) !important;
}

.entry-content tr:hover td { background: var(--s2u-s1) !important }

/* Tags */
.entry-footer {
    margin-top: 16px !important;
    padding: 12px var(--s2u-px) !important;
    border-top: 1px solid var(--s2u-border) !important;
}

@media(min-width:900px) { .entry-footer { padding: 12px 0 !important } }

.s2u-tags-label { color: var(--s2u-faint); font-size: 0.73rem; margin-right: 4px }

.tags-links a,.post-tags a {
    display: inline-block !important;
    background: var(--s2u-s1) !important;
    border: 1px solid var(--s2u-border) !important;
    color: var(--s2u-muted) !important;
    padding: 2px 8px !important;
    border-radius: 20px !important;
    font-size: 0.72rem !important;
    text-decoration: none !important;
    margin: 2px !important;
    transition: all var(--s2u-ease) !important;
}

.tags-links a:hover,.post-tags a:hover {
    background: rgba(230,57,70,0.07) !important;
    border-color: rgba(230,57,70,0.25) !important;
    color: var(--s2u-red) !important;
}

/* ══════════════════════════════════════════════════
   POST NAVIGATION
══════════════════════════════════════════════════ */
.s2u-post-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 16px var(--s2u-px) 0;
}

@media(min-width:900px) { .s2u-post-nav { margin: 16px 0 0 } }

.s2u-nav-link {
    background: var(--s2u-s1);
    border: 1px solid var(--s2u-border);
    border-radius: var(--s2u-r);
    padding: 10px 12px;
    text-decoration: none;
    display: block;
    transition: border-color var(--s2u-ease), background var(--s2u-ease);
}

.s2u-nav-link:hover { border-color: var(--s2u-red); background: rgba(230,57,70,0.03) }
.s2u-nav-link:hover .s2u-nav-title { color: var(--s2u-red) }

.s2u-nav-dir { color: var(--s2u-faint); font-size: 0.68rem; display: block; margin-bottom: 3px }
.s2u-nav-title { color: var(--s2u-text); font-size: 0.8rem; font-weight: 600; display: block; line-height: 1.35; transition: color var(--s2u-ease) }
.s2u-nav-link.next { text-align: right }

/* ══════════════════════════════════════════════════
   SIDEBAR
══════════════════════════════════════════════════ */
.widget-area {
    background: var(--s2u-s1) !important;
    border: 1px solid var(--s2u-border) !important;
    border-radius: var(--s2u-rl) !important;
    padding: 14px !important;
    position: sticky !important;
    top: 62px !important;
    margin-top: 20px !important;
}

@media(min-width:900px) { .widget-area { margin-top: 0 !important } }

.widget { margin-bottom: 20px !important }
.widget:last-child { margin-bottom: 0 !important }

.widget-title {
    color: var(--s2u-text) !important;
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    margin: 0 0 10px !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid var(--s2u-border) !important;
    display: flex !important;
    align-items: center !important;
}

.widget ul { margin: 0 !important; padding: 0 !important; list-style: none !important }
.widget ul li { padding: 4px 0 !important; border-bottom: 1px solid var(--s2u-border) !important }
.widget ul li:last-child { border-bottom: none !important }
.widget ul li a { color: var(--s2u-muted) !important; font-size: 0.82rem !important; text-decoration: none !important; transition: color var(--s2u-ease) !important }
.widget ul li a:hover { color: var(--s2u-red) !important }

/* ══════════════════════════════════════════════════
   SEARCH FORM
══════════════════════════════════════════════════ */
.search-form { display: flex !important; gap: 0 !important; position: relative !important }

.search-form-inner,.search-form label {
    flex: 1 !important;
    position: relative !important;
    min-width: 0 !important;
    margin: 0 !important;
}

.search-form .search-field {
    flex: 1 !important;
    background: #fff !important;
    border: 1px solid var(--s2u-border) !important;
    border-right: none !important;
    border-radius: var(--s2u-r) 0 0 var(--s2u-r) !important;
    color: var(--s2u-text) !important;
    padding: 8px 12px !important;
    font-family: var(--s2u-font) !important;
    font-size: 0.875rem !important;
    min-width: 0 !important;
    width: 100% !important;
    height: 36px !important;
    transition: border-color var(--s2u-ease) !important;
}

.search-form .search-field:focus {
    outline: none !important;
    border-color: var(--s2u-red) !important;
}

.search-form .search-field::placeholder { color: var(--s2u-faint) !important }

.search-form .search-submit {
    background: var(--s2u-red) !important;
    color: #fff !important;
    border: 1px solid var(--s2u-red) !important;
    border-radius: 0 var(--s2u-r) var(--s2u-r) 0 !important;
    padding: 0 !important;
    width: 36px !important;
    height: 36px !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    transition: background var(--s2u-ease) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 14px 14px !important;
}

.search-form .search-submit:hover { background-color: var(--s2u-rdk) !important }

/* ══════════════════════════════════════════════════
   PAGINATION
══════════════════════════════════════════════════ */
.pagination .nav-links {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    justify-content: center !important;
    margin: 16px 0 !important;
    padding: 0 var(--s2u-px) !important;
}

.pagination .page-numbers {
    background: var(--s2u-s1) !important;
    color: var(--s2u-muted) !important;
    border: 1px solid var(--s2u-border) !important;
    border-radius: 6px !important;
    padding: 5px 11px !important;
    font-size: 0.82rem !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all var(--s2u-ease) !important;
    min-width: 32px !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover {
    background: var(--s2u-red) !important;
    color: #fff !important;
    border-color: var(--s2u-red) !important;
}

/* ══════════════════════════════════════════════════
   COMMENTS
══════════════════════════════════════════════════ */
.comments-area {
    background: var(--s2u-s1) !important;
    border-top: 1px solid var(--s2u-border) !important;
    padding: 16px var(--s2u-px) !important;
    margin-top: 0 !important;
}

@media(min-width:900px) { .comments-area { padding: 16px 0 !important } }

.comments-title { color: var(--s2u-text) !important; font-size: 0.95rem !important; font-weight: 700 !important; margin: 0 0 14px !important }

.comment-list { padding: 0 !important; margin: 0 0 16px !important; list-style: none !important }
.comment-list .comment-body { background: #fff !important; border: 1px solid var(--s2u-border) !important; border-radius: var(--s2u-r) !important; padding: 11px 13px !important; margin-bottom: 8px !important }
.comment-author .fn { color: var(--s2u-text) !important; font-weight: 600 !important; font-size: 0.84rem !important }
.comment-metadata { color: var(--s2u-faint) !important; font-size: 0.72rem !important }
.comment-content { color: var(--s2u-muted) !important; font-size: 0.84rem !important; margin-top: 6px !important }

.comment-form p { margin-bottom: 9px !important }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    background: #fff !important;
    border: 1px solid var(--s2u-border) !important;
    border-radius: var(--s2u-r) !important;
    color: var(--s2u-text) !important;
    padding: 7px 11px !important;
    width: 100% !important;
    font-family: var(--s2u-font) !important;
    font-size: 0.875rem !important;
    transition: border-color var(--s2u-ease) !important;
}

.comment-form input:focus,.comment-form textarea:focus { outline: none !important; border-color: var(--s2u-red) !important }

.comment-form .submit {
    background: var(--s2u-red) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--s2u-r) !important;
    padding: 7px 18px !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    cursor: pointer !important;
    transition: background var(--s2u-ease) !important;
}

.comment-form .submit:hover { background: var(--s2u-rdk) !important }

/* ══════════════════════════════════════════════════
   FOOTER — compact
══════════════════════════════════════════════════ */
.site-footer {
    background: var(--s2u-s1) !important;
    border-top: 1px solid var(--s2u-border) !important;
    padding: 18px 0 14px !important;
    margin-top: 32px !important;
    color: var(--s2u-faint) !important;
    font-size: 0.76rem !important;
}

.site-footer .grid-container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.site-footer a { color: var(--s2u-muted) !important; text-decoration: none !important; transition: color var(--s2u-ease) !important }
.site-footer a:hover { color: var(--s2u-red) !important }

.footer-menu { display: flex !important; gap: 14px !important; list-style: none !important; margin: 0 !important; padding: 0 !important; flex-wrap: wrap !important }

/* ══════════════════════════════════════════════════
   BACK TO TOP
══════════════════════════════════════════════════ */
.s2u-back-top {
    position: fixed;
    bottom: 18px;
    right: 14px;
    width: 38px;
    height: 38px;
    background: #fff;
    border: 1px solid var(--s2u-border);
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 997;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 2px 10px rgba(0,0,0,0.10);
    padding: 0;
}

.s2u-back-top.visible { opacity: 1; pointer-events: auto }
.s2u-back-top:hover { transform: translateY(-2px); border-color: var(--s2u-red); box-shadow: 0 4px 14px rgba(0,0,0,0.12) }
.s2u-back-top img { display: block; width: 18px; height: 18px; object-fit: contain }

/* ══════════════════════════════════════════════════
   MISC PAGES
══════════════════════════════════════════════════ */
.skip-link { position: absolute; left: -9999px }
.skip-link:focus { left: 6px; top: 6px; z-index: 9999; background: var(--s2u-red); color: #fff; padding: 6px 12px; border-radius: 6px }

.error-404 { text-align: center !important; padding: 48px 16px !important }
.error-404 .page-title { font-size: clamp(3rem,12vw,5rem) !important; font-weight: 900 !important; color: var(--s2u-red) !important; line-height: 1 !important; margin-bottom: 10px !important }
.error-404 p { color: var(--s2u-muted) !important }

.no-results { text-align: center !important; padding: 36px 14px !important; background: var(--s2u-s1) !important; border-radius: var(--s2u-r) !important; border: 1px solid var(--s2u-border) !important; margin: 14px var(--s2u-px) !important }
.no-results h2 { color: var(--s2u-text) !important; font-size: 1rem !important; margin-bottom: 6px !important; font-weight: 700 !important }
.no-results p { color: var(--s2u-muted) !important; margin-bottom: 14px !important }

.page .post { padding: 16px var(--s2u-px) !important }
.page .entry-title { font-size: 1.4rem !important; font-weight: 800 !important }

/* ══════════════════════════════════════════════════
   GP CONFLICT OVERRIDES
══════════════════════════════════════════════════ */
.content-area,#primary { float: none !important; width: 100% !important }
#secondary { float: none !important; width: 100% !important }
.site-content { padding: 0 !important; margin: 0 !important }
#content.site-content > .grid-container { padding-top: 0 !important }
#page { padding: 0 !important; margin: 0 !important }
.s2u-layout { width: 100% !important }
.site-main { width: 100% !important; max-width: 100% !important; float: none !important }

/* Widget overrides */
#secondary .widget-title,#secondary h2.widget-title,#secondary h3.widget-title,
.widget-area .widget-title,.widget-area h2.widget-title,.widget-area h3.widget-title {
    color: var(--s2u-text) !important;
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    margin: 0 0 10px !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid var(--s2u-border) !important;
    background: none !important;
}

#secondary .search-form,.widget-area .search-form { display: flex !important; gap: 0 !important; align-items: stretch !important }
#secondary .search-form label,.widget-area .search-form label { flex: 1 !important; min-width: 0 !important; margin: 0 !important }

#secondary .search-form .search-field,
.widget-area .search-form .search-field,
.widget .search-field,
#secondary input[type="search"],
.widget-area input[type="search"] {
    flex: 1 !important;
    width: 100% !important;
    background: #fff !important;
    border: 1px solid var(--s2u-border) !important;
    border-right: none !important;
    border-radius: var(--s2u-r) 0 0 var(--s2u-r) !important;
    color: var(--s2u-text) !important;
    padding: 7px 11px !important;
    font-family: var(--s2u-font) !important;
    font-size: 0.84rem !important;
    height: 34px !important;
    outline: none !important;
    -webkit-appearance: none !important;
}

#secondary .search-form .search-field:focus,
.widget-area input[type="search"]:focus { border-color: var(--s2u-red) !important }

#secondary .search-form input[type="submit"],
#secondary .search-form .search-submit,
.widget-area .search-form input[type="submit"],
.widget-area .search-form .search-submit {
    background-color: var(--s2u-red) !important;
    color: #fff !important;
    border: 1px solid var(--s2u-red) !important;
    border-radius: 0 var(--s2u-r) var(--s2u-r) 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    font-size: 0 !important;
    flex-shrink: 0 !important;
    width: 34px !important;
    height: 34px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 13px 13px !important;
}

#secondary .widget ul,.widget-area .widget ul { margin: 0 !important; padding: 0 !important; list-style: none !important }
#secondary .widget ul li,.widget-area .widget ul li { padding: 4px 0 !important; border-bottom: 1px solid var(--s2u-border) !important; margin: 0 !important }
#secondary .widget ul li:last-child,.widget-area .widget ul li:last-child { border-bottom: none !important }
#secondary .widget ul li a,.widget-area .widget ul li a { color: var(--s2u-muted) !important; font-size: 0.82rem !important; text-decoration: none !important }
#secondary .widget ul li a:hover,.widget-area .widget ul li a:hover { color: var(--s2u-red) !important }
#secondary .widget,.widget-area .widget { background: none !important; border: none !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; margin-bottom: 18px !important }
#secondary .widget:last-child,.widget-area .widget:last-child { margin-bottom: 0 !important }
#secondary .widget p,.widget-area .widget p { color: var(--s2u-muted) !important; font-size: 0.82rem !important; margin: 0 !important }

/* Widget icons */
.widget-title::before,#secondary .widget-title::before,.widget-area .widget-title::before {
    content: '';
    display: inline-block !important;
    width: 12px !important;
    height: 12px !important;
    margin-right: 5px !important;
    vertical-align: middle !important;
    flex-shrink: 0 !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    opacity: 0.5 !important;
    position: relative !important;
    top: -1px !important;
}

.widget_search .widget-title::before,.widget-area .widget_search .widget-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333355' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") !important;
}
.widget_recent_entries .widget-title::before,.widget-area .widget_recent_entries .widget-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333355' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3C/svg%3E") !important;
}
.widget_categories .widget-title::before,.widget-area .widget_categories .widget-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333355' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='8' y1='6' x2='21' y2='6'/%3E%3Cline x1='8' y1='12' x2='21' y2='12'/%3E%3Cline x1='8' y1='18' x2='21' y2='18'/%3E%3Cline x1='3' y1='6' x2='3.01' y2='6'/%3E%3Cline x1='3' y1='12' x2='3.01' y2='12'/%3E%3Cline x1='3' y1='18' x2='3.01' y2='18'/%3E%3C/svg%3E") !important;
}
.widget_tag_cloud .widget-title::before,.widget-area .widget_tag_cloud .widget-title::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333355' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E") !important;
}

/* ══════════════════════════════════════════════════
   SUB2UNLOCK COMPONENTS
══════════════════════════════════════════════════ */

.s2u-wrapper { position: relative; margin: 20px 0 }

/* Lock Box */
.s2u-lock-box {
    background: var(--s2u-s1);
    border: 1px solid var(--s2u-border);
    border-radius: var(--s2u-rl);
    padding: 24px 18px;
    text-align: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}

.s2u-lock-box::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: var(--s2u-rl);
    padding: 1px;
    background: linear-gradient(135deg,rgba(230,57,70,0.22),transparent 55%,rgba(230,57,70,0.08));
    -webkit-mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

/* Lock Icon */
.s2u-lock-icon {
    width: 48px; height: 48px;
    background: rgba(230,57,70,0.08);
    border: 1px solid rgba(230,57,70,0.20);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 12px;
    color: #e63946;
    animation: s2u-pulse 2.5s ease-in-out infinite;
}

@keyframes s2u-pulse {
    0%,100% { box-shadow: 0 0 0 0 rgba(230,57,70,0.15) }
    50%      { box-shadow: 0 0 0 5px rgba(230,57,70,0) }
}

.s2u-message {
    color: var(--s2u-muted);
    font-size: 0.84rem;
    margin: 0 auto 18px;
    line-height: 1.6;
    max-width: 340px;
}

/* Preview */
.s2u-preview {
    background: #fff;
    border: 1px solid var(--s2u-border);
    border-radius: var(--s2u-r) var(--s2u-r) 0 0;
    padding: 14px;
    color: var(--s2u-muted);
    font-size: 0.875rem;
    line-height: 1.7;
    filter: blur(4px);
    user-select: none;
    pointer-events: none;
    position: relative;
    max-height: 80px;
    overflow: hidden;
    margin-bottom: 0;
}

.s2u-preview::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 40px;
    background: linear-gradient(transparent, rgba(255,255,255,0.90));
}

/* Buttons */
.s2u-buttons {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    max-width: 310px;
    margin: 0 auto;
}

.s2u-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 11px 18px;
    border-radius: var(--s2u-r);
    color: #fff !important;
    font-size: 0.845rem;
    font-weight: 600;
    text-decoration: none !important;
    border: none;
    border-bottom: none !important;
    cursor: pointer;
    transition: transform 0.13s ease, box-shadow 0.13s ease;
    letter-spacing: 0.01em;
    -webkit-tap-highlight-color: transparent;
}

.s2u-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,0.18); color: #fff !important }
.s2u-btn:active { transform: translateY(0) }
.s2u-btn svg { flex-shrink: 0 }

/* Download button */
.s2u-dl-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: linear-gradient(135deg,#e63946,#c1121f);
    color: #fff !important;
    padding: 11px 22px;
    border-radius: var(--s2u-r);
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none !important;
    border-bottom: none !important;
    margin: 8px 0;
    transition: transform 0.13s ease, box-shadow 0.13s ease;
    box-shadow: 0 3px 10px rgba(230,57,70,0.25);
    -webkit-tap-highlight-color: transparent;
}

.s2u-dl-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(230,57,70,0.35); color: #fff !important }

/* Countdown ring */
.s2u-countdown-wrap { margin-top: 18px; text-align: center }
.s2u-countdown-ring { position: relative; width: 56px; height: 56px; margin: 0 auto 6px }
.s2u-ring-svg { width: 100%; height: 100%; transform: rotate(-90deg) }
.s2u-ring-bg { fill: none; stroke: var(--s2u-border); stroke-width: 3 }
.s2u-ring-fill { fill: none; stroke: #e63946; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 94.25; stroke-dashoffset: 0; transition: stroke-dashoffset 1s linear }
.s2u-countdown-num { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 1.1rem; font-weight: 700; color: var(--s2u-text) }
.s2u-countdown-label { color: var(--s2u-faint); font-size: 0.73rem; margin: 0 }

/* Success */
.s2u-success-msg { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 16px; color: #06d6a0; font-size: 0.875rem; font-weight: 600; animation: s2u-fadein 0.3s ease }
.s2u-success-icon { width: 24px; height: 24px; background: rgba(6,214,160,0.1); border: 1px solid rgba(6,214,160,0.25); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.7rem; flex-shrink: 0 }

/* Unlocked content */
.s2u-content {
    animation: s2u-reveal 0.35s cubic-bezier(0.4,0,0.2,1);
    border: 1px solid rgba(6,214,160,0.12);
    border-radius: var(--s2u-r);
    padding: 16px;
    background: rgba(6,214,160,0.02);
}

@keyframes s2u-reveal { from { opacity:0; transform:translateY(6px) } to { opacity:1; transform:translateY(0) } }
@keyframes s2u-fadein { from { opacity:0 } to { opacity:1 } }

/* Alerts */
.s2u-alert { padding: 10px 13px; border-radius: 6px; font-size: 0.855rem; margin: 12px 0; line-height: 1.5 }
.s2u-alert--info    { background: rgba(67,97,238,0.07);  border-left: 3px solid #4361ee; color: #3057c7 }
.s2u-alert--warning { background: rgba(255,107,53,0.07); border-left: 3px solid #ff6b35; color: #c04a1a }
.s2u-alert--success { background: rgba(6,214,160,0.07);  border-left: 3px solid #06d6a0; color: #059a73 }
.s2u-alert--danger  { background: rgba(230,57,70,0.07);  border-left: 3px solid #e63946; color: #b52232 }

/* Mobile small tweaks */
@media(max-width:480px) {
    .s2u-lock-box { padding: 20px 12px }
    .s2u-btn { padding: 10px 12px; font-size: 0.82rem }
    .s2u-content { padding: 12px }
}

/* ══════════════════════════════════════════════════
   MOBILE WIDGET — compact
══════════════════════════════════════════════════ */
@media(max-width:768px) {
    .widget-area,#secondary.widget-area { padding: 12px !important; margin-top: 10px !important }
    #secondary .widget,.widget-area .widget { margin-bottom: 12px !important }
    #secondary .widget-title,#secondary h2.widget-title,#secondary h3.widget-title,
    .widget-area .widget-title,.widget-area h2.widget-title,.widget-area h3.widget-title {
        font-size: 0.62rem !important;
        margin: 0 0 7px !important;
        padding-bottom: 7px !important;
    }
}