/*
Theme Name: TechQor Ultra Lite Theme
Theme URI: https://techqor.in/
Description: A lightweight, responsive, AdSense-friendly Genesis child theme built for blogs, content websites, and tool-based pages.
Author: Krishna Sharma
Author URI: https://techqor.in/
Template: genesis
Version: 1.0.2
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: techqor-ultra-lite
Tags: blog, news, one-column, two-columns, right-sidebar, custom-logo, featured-images, custom-menu, threaded-comments, translation-ready
*/

:root {
    --techqor-container-width: 1250px;
    --techqor-container-padding: 16px;
    --techqor-content-width: 860px;
    --techqor-sidebar-width: 350px;
    --techqor-gap: 24px;
    --techqor-padding: var(--techqor-container-padding);
    --techqor-font-primary: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    --techqor-font-heading: inherit;
    --techqor-primary: #209cee;
    --techqor-primary-hover: #1689d7;
    --techqor-light-text: #667085;
    --techqor-heading: #101828;
    --techqor-bg: #ffffff;
    --techqor-light-bg: #f7f7f7;
    --techqor-border: #eeeeee;
    --techqor-text: #333333;
    --techqor-transition: all 0.25s ease;
    --techqor-shadow-sm: none;
    --techqor-shadow-md: none;
    --tq-accent: #209cee;
    --techqor-space-xs: 6px;
    --techqor-space-sm: 8px;
    --techqor-space-md: 16px;
    --techqor-space-lg: 24px;
    --techqor-space-xl: 32px;
    --techqor-space-2xl: 48px;
}

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

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    scrollbar-width: thin;
    scrollbar-color: var(--techqor-primary) #eef1f6;
}

html,
body {
    overflow-x: hidden;
}



/* =========================
GLOBAL FONT FIX (CLEAN)
========================= */
body {
    font-family: var(--techqor-font-primary);
    color: var(--techqor-text);
    line-height: 1.8;
    font-size: 17px;
    letter-spacing: -0.01em;
    font-weight: 400;
    padding-top: 60px;
}


/* images */

.techqor-thumb img,
.wp-post-image,
.entry img,
.techqor-post img{
}

ul {
    list-style: none;
}

a {
    color: var(--techqor-primary);
    text-decoration: none;
    transition: var(--techqor-transition);
}

a:hover {
    color: var(--techqor-primary-hover);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--techqor-font-heading);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.01em;
    color: var(--techqor-heading);
}

h1 {
    font-size: 32px;
    line-height: 1.15;
    font-weight: 600;
}

h2 {
    font-size: 26px;
    line-height: 1.2;
    font-weight: 600;
}

h3 {
    font-size: 22px;
    line-height: 1.3;
    font-weight: 600;
}

h4 {
    font-size: 20px;
    font-weight: 600;
}

h5 {
    font-size: 18px;
    font-weight: 600;
}

h6 {
    font-size: 16px;
    font-weight: 600;
}


strong,
b {
    font-weight: 700;
}

p {
  margin-bottom: 28px;
}


.entry-content p {
  margin-bottom: 28px;
  text-align: justify;
  text-justify: inter-word;
}


.entry-content a {
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}

code,
pre {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    background: #f4f6fa;
    padding: 4px 6px;
    font-size: 14px;
}

pre {
    padding: 16px;
    overflow-x: auto;
}

.site-title,
.site-description {
    display: none;
}



::selection {
    background: rgba(32, 156, 238, 0.16);
    color: var(--techqor-heading);
}

:focus-visible {
    outline: 2px solid rgba(32, 156, 238, 0.45);
    outline-offset: 2px;
}

@media (max-width: 1024px) {
    .custom-logo {
        max-height: 36px;
    }

    h1 {
        font-size: 34px;
    }

    h2 {
        font-size: 28px;
    }
}

@media (max-width: 768px) {
    body {
        font-size: 15px;
        line-height: 1.7;
        padding-top: 55px;
    }

    .custom-logo {
        max-height: 32px;
    }

    h1 {
        font-size: 28px;
    }

    h2 {
        font-size: 24px;
    }

    h3 {
        font-size: 21px;
    }
}

/* ======================================================
LAYOUT
====================================================== */

.site-container {
    width: 100%;
    max-width: var(--techqor-container-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--techqor-container-padding);
    padding-right: var(--techqor-container-padding);
    box-sizing: border-box;
}



.content-sidebar-wrap {
    display: flex;
    gap: var(--techqor-gap);
    margin-top: var(--techqor-space-xl);
    align-items: flex-start;
}

.content {
    flex: 1 1 0;
    max-width: 100%;
}

.sidebar {
    flex: 0 0 var(--techqor-sidebar-width);
}

.entry {
    margin-bottom: 26px;
}

.entry-title {
    font-size: 30px;
    line-height: 1.2;
    margin-bottom: 10px;
    font-family: var(--techqor-font-heading);
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--techqor-heading);
}

.entry-meta {
    font-size: 14px;
    color: var(--techqor-light-text);
    margin-bottom: 18px;
}



@media (max-width: 768px) {
    .content-sidebar-wrap {
        flex-direction: column;
        gap: 24px;
    }

    .content,
    .sidebar {
        width: 100%;
    }

    .entry-title {
        font-size: 26px;
        line-height: 1.25;
        font-weight: 800;
        letter-spacing: -0.02em;
    }
}

/* ACCESSIBILITY FIX: Hide skip link */
.skip-link,
.screen-reader-shortcut {
    position: absolute;
    top: -100px;
    left: 0;
    background: #000;
    color: #fff;
    padding: 10px 15px;
    z-index: 9999;
    text-decoration: none;
}

/* Show only on focus (for accessibility) */
.skip-link:focus,
.screen-reader-shortcut:focus {
    top: 10px;
    left: 10px;
}

/* ======================================================
HEADER
====================================================== */

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 60px;
    border-bottom: 1px solid #eee;
background: #fff;
    z-index: 1000;
    transform: translateY(0);
    transition: var(--techqor-transition);
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}



.site-header.tq-hide {
    transform: translateY(-100%);
}

.admin-bar .site-header {
    top: 32px;
}

@media (max-width: 782px) {
    .admin-bar .site-header {
        top: 46px;
    }
}

@media (max-width: 768px) {
    .site-header {
        height: 55px;
        padding: 0;
    }
}

.tq-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: var(--techqor-container-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--techqor-container-padding);
    padding-right: var(--techqor-container-padding);
    min-height: 60px;
    height: 60px;
    box-sizing: border-box;
}

.tq-logo {
    display: flex;
    align-items: center;
    min-height: 55px;
    height: 55px;
    flex-shrink: 0;
}

.tq-nav {
    display: flex;
    align-items: center;
    min-height: 55px;
    height: 55px;
    margin-left: auto;
}

.tq-header-icons {
    position: relative;
    display: flex;
    align-items: center;
    height: 25px;
    gap: 16px;
    border-left: 1px solid var(--techqor-border);
    margin-left: 16px;
}

/* ======================================================
DESKTOP MENU
====================================================== */

.tq-menu {
    display: flex;
    align-items: center;
    gap: 26px;
}

.tq-menu li {
    position: relative;
}

.tq-menu a {
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    font-weight: 500;
    color: var(--techqor-heading);
    transition: color 0.2s ease;
}

.tq-menu a:hover {
    color: var(--techqor-primary-hover);
}

.tq-menu .current-menu-item > a,
.tq-menu .current-menu-parent > a,
.tq-menu .current-menu-ancestor > a {
    color: var(--techqor-primary-hover);
}

/* ======================================================
PARENT ARROW
====================================================== */

.tq-menu .menu-item-has-children > a {
    position: relative;
    padding-right: 18px;
}

.tq-menu .menu-item-has-children > a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 3px;
    width: 5px;
    height: 5px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
}

/* ======================================================
SUBMENU BASE
====================================================== */

.tq-menu .sub-menu {
    position: absolute;
    top: 100%; /* 🔥 gap removed */
    left: 0;

    background: #fff;
    border: 1px solid rgba(0,0,0,0.08);
    padding: 0;
    min-width: 200px;

    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);

    transition: opacity 0.25s ease, transform 0.25s ease;

    pointer-events: none;
    z-index: 9999;
}

/* ======================================================
SHOW (STRONG HOVER FIX)
====================================================== */

.tq-menu li:hover > .sub-menu,
.tq-menu li:focus-within > .sub-menu,
.tq-menu li > .sub-menu:hover {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

/* ======================================================
HOVER BRIDGE (NO FLICKER)
====================================================== */

.tq-menu > li::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 8px;
}

/* ======================================================
FIRST LEVEL
====================================================== */

.tq-menu > li > .sub-menu {
    border-top: 2px solid var(--techqor-primary);
}

/* ARROW */
.tq-menu > li > .sub-menu::before {
    content: "";
    position: absolute;
    top: -8px;
    left: 24px;

    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid var(--techqor-primary);
}

/* ======================================================
NESTED SUBMENU
====================================================== */

.tq-menu .sub-menu .menu-item-has-children {
    position: relative;
}

.tq-menu .sub-menu .menu-item-has-children > .sub-menu {
    top: 0;
    left: 100%;
    margin-left: 0; /* 🔥 gap removed */

    transform: translateX(8px);
}

/* SHOW NESTED */
.tq-menu .sub-menu li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

/* ======================================================
LEFT OPEN FIX
====================================================== */

.menu-item-has-children.open-left > .sub-menu {
    left: auto !important;
    right: 100% !important;
}

/* ======================================================
ITEMS
====================================================== */

.tq-menu .sub-menu li {
    position: relative;
}

.tq-menu .sub-menu a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    padding: 12px 16px;
    line-height: 1.2;
    color: #333;
    transition: background 0.15s ease, color 0.15s ease;
}

.tq-menu .sub-menu a:hover,
.tq-menu .sub-menu .current-menu-item > a {
    color: var(--techqor-primary);
}

/* ======================================================
DIVIDER
====================================================== */

.tq-menu .sub-menu li:not(:last-child)::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 16px;
    right: 16px;
    height: 1px;
    background: rgba(0,0,0,0.06);
}

/* ======================================================
NESTED ARROW
====================================================== */

.tq-menu .sub-menu .menu-item-has-children > a {
    position: relative;
    padding-right: 20px;
}

.tq-menu .sub-menu .menu-item-has-children > a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 8px;
    width: 5px;
    height: 5px;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    transform: translateY(-50%) rotate(-45deg);
}

/* ======================================================
SEARCH BUTTON
====================================================== */

.tq-search-btn {
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
}

.tq-search-btn:hover {
    background: transparent; /* 🔥 removed hover bg */
}

.tq-search-btn svg {
    width: 18px;
    height: 18px;
    stroke: #222;
    stroke-width: 2;
    fill: none;
}
/* ======================================================
SEARCH DROPDOWN (CLEAN + PRIMARY BUTTON ONLY)
====================================================== */

/* =========================
BASE
========================= */

.tq-search-dropdown {
    position: absolute;
    top: 48px;
    right: 0;
    width: 320px;

    background: #fff; /* ✅ clean white */

    border: 1px solid rgba(0,0,0,0.08);

    padding: 10px;

    opacity: 0;
    visibility: hidden;

    transform: translateY(10px) scale(0.98);
    transform-origin: top right;

    transition: 
        opacity 0.2s ease,
        transform 0.22s cubic-bezier(.4,0,.2,1);

    z-index: 999;
}

/* =========================
SHOW
========================= */

.tq-search-dropdown.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

/* =========================
FORM
========================= */

.tq-search-dropdown form {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* =========================
INPUT
========================= */

.tq-search-dropdown input {
    flex: 1;

    padding: 10px 12px;

    font-size: 14px;

    border: 1px solid rgba(0,0,0,0.15);

    background: #fff;
    color: var(--techqor-text);

    outline: none;
}

/* PLACEHOLDER */

.tq-search-dropdown input::placeholder {
    color: #9ca3af;
}

/* FOCUS */

.tq-search-dropdown input:focus {
    border-color: var(--techqor-primary);
}

/* =========================
BUTTON (PRIMARY ONLY HERE)
========================= */

.tq-search-dropdown button {
    background: var(--techqor-primary); /* ✅ only button colored */
    color: #fff;

    border: none;

    padding: 8px 12px;

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;

    transition: background 0.15s ease;
}

/* HOVER */

.tq-search-dropdown button:hover {
    background: var(--techqor-primary-hover);
}

/* =========================
ICON
========================= */

.tq-search-dropdown svg {
    width: 18px;
    height: 18px;

    stroke: #fff;
    stroke-width: 2;
    fill: none;
}
/* ======================================================
MOBILE
====================================================== */

@media (max-width: 768px) {
    .tq-search-dropdown {
        width: calc(100vw - 20px);
        right: -6px;
        top: 58px;
    }
}
/* ======================================================
HAMBURGER / OFFCANVAS
====================================================== */

.tq-hamburger {
    display: none;
    position: relative;
    width: 24px;
    height: 18px;
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
}

.tq-hamburger:hover,
.tq-hamburger:focus,
.tq-hamburger:active {
    background: transparent;
    box-shadow: none;
    outline: none;
}

.tq-hamburger span {
    position: absolute;
    right: 0;
    left: auto;
    display: block;
    height: 2px;
    background: #0f172a;
    transform-origin: center;
    transition:
        transform 0.32s cubic-bezier(.4, 0, .2, 1),
        opacity 0.22s ease,
        width 0.32s cubic-bezier(.4, 0, .2, 1),
        top 0.32s cubic-bezier(.4, 0, .2, 1);
}

.tq-hamburger span:nth-child(1) {
    top: 0;
    width: 75%;
}

.tq-hamburger span:nth-child(2) {
    top: 8px;
    width: 100%;
}

.tq-hamburger span:nth-child(3) {
    top: 16px;
    width: 40%;
}

.tq-hamburger:hover span:nth-child(1) {
    width: 58%;
}

.tq-hamburger:hover span:nth-child(2) {
    width: 84%;
}

.tq-hamburger.active span:nth-child(1) {
    top: 8px;
    width: 100%;
    transform: rotate(45deg);
}

.tq-hamburger.active span:nth-child(2) {
    opacity: 0;
    width: 0;
}

.tq-hamburger.active span:nth-child(3) {
    top: 8px;
    width: 100%;
    transform: rotate(-45deg);
}



/* ======================================================
OFFCANVAS OVERLAY (BLUR GLASS)
====================================================== */

.tq-offcanvas-overlay {
    position: fixed;
    inset: 0;

    background: rgba(15, 23, 42, 0.12);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition: opacity 0.28s ease, visibility 0.28s ease;

    z-index: 9998;
}

.tq-offcanvas-overlay.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}


/* ======================================================
OFFCANVAS PANEL
====================================================== */

.tq-offcanvas {
    position: fixed;
    top: 0;
    left: 0;

    width: 260px;
    max-width: 90%;
    height: 100vh;

    background: #ffffff;

    /* hidden by default */
    transform: translate3d(-100%, 0, 0);

    transition: transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);

    z-index: 9999;

    display: flex;
    flex-direction: column;

    /* ✅ IMPORTANT FIXES */
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;

    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* only visible when active */
.tq-offcanvas.active {
    transform: translate3d(0, 0, 0);
}


/* ======================================================
CLOSE BUTTON
====================================================== */

.tq-offcanvas-close {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 12px 16px 6px;
}

.tq-close-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    background: transparent;
    border: none;
    cursor: pointer;

    font-size: 22px;
    color: #111;

    transition: opacity 0.2s ease, transform 0.2s ease;
}

.tq-close-btn:hover {
    opacity: 0.7;
    transform: rotate(90deg);
}


/* ======================================================
LOGO
====================================================== */

.tq-offcanvas-logo {
    padding: 0 20px 10px;
    text-align: center;
}

.tq-offcanvas-logo img {
    max-width: 160px;
    height: auto;
}


/* ======================================================
NAV WRAP
====================================================== */

.tq-offcanvas-nav {
    flex: 1;
}


/* ======================================================
MOBILE MENU
====================================================== */

.tq-mobile-menu {
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 0;
    list-style: none;
}


/* ======================================================
TOP LEVEL ITEMS
====================================================== */

.tq-mobile-menu > li {
    position: relative;
}

.tq-mobile-menu > li::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 18px;
    right: 18px;
    height: 1px;
    background: rgba(0, 0, 0, 0.08);
}

.tq-mobile-menu > li:last-child::after {
    display: none;
}


/* ======================================================
RESPONSIVE
====================================================== */

@media (max-width: 1024px) {
    .tq-hamburger {
        display: block;
    }
}
/* ======================================================
TOP LINK
====================================================== */

.tq-mobile-menu > li > a {
    display: block;
    padding: 10px 18px;

    font-size: 16px;
    font-weight: 600;

    color: #222;
    text-decoration: none;

    background: transparent;
    transition: color 0.2s ease;
}

.tq-mobile-menu > li > a:hover {
    color: var(--techqor-primary);
}

/* ======================================================
SUBMENU
====================================================== */

.tq-mobile-menu .sub-menu {
    display: none;
    margin: 0;
    padding: 0;
}

.tq-mobile-menu .menu-item-has-children.submenu-open > .sub-menu {
    display: block;
}

/* ======================================================
SUBMENU ITEMS
====================================================== */

.tq-mobile-menu .sub-menu li {
    position: relative;
}

/* 🔥 SUBMENU DIVIDER */
.tq-mobile-menu .sub-menu li::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 18px;
    right: 18px;
    height: 1px;
    background: rgba(0, 0, 0, 0.06);
}

.tq-mobile-menu .sub-menu li:last-child::after {
    display: none;
}

/* ======================================================
SUBMENU LINK
====================================================== */

.tq-mobile-menu .sub-menu a {
    display: block;
    padding: 14px 18px 14px 36px;

    font-size: 14px;
    font-weight: 500;

    color: #555;
    text-decoration: none;
}

/* dash */
.tq-mobile-menu .sub-menu a::before {
    content: "—";
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #444;
}

/* ======================================================
ARROW
====================================================== */

.tq-mobile-menu .menu-item-has-children > a {
    padding-right: 44px;
    position: relative;
}

.tq-mobile-menu .menu-item-has-children > a::after {
    content: "";
    position: absolute;
    right: 18px;
    top: 50%;

    width: 6px;
    height: 6px;

    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;

    transform: translateY(-50%) rotate(-45deg);
    transition: transform 0.2s ease;
}

.tq-mobile-menu .menu-item-has-children.submenu-open > a::after {
    transform: translateY(-50%) rotate(45deg);
}



/* mobile */
.tq-mobile-menu .current-menu-item > a,
.tq-mobile-menu .current-menu-parent > a,
.tq-mobile-menu .current-menu-ancestor > a {
    color: var(--techqor-primary);
    font-weight: 600;
}

/* submenu active */
.tq-mobile-menu .sub-menu .current-menu-item > a {
    color: var(--techqor-primary);
}

/* arrow bhi active color me */
.tq-mobile-menu .current-menu-item > a::after,
.tq-mobile-menu .current-menu-parent > a::after {
    border-color: var(--techqor-primary);
}

/* ======================================================
RESPONSIVE HEADER
====================================================== */

@media (max-width: 768px) {
    .tq-menu {
        display: none;
    }

    .tq-hamburger {
        display: block;
        margin-left: 8px;
        width: 24px;
        height: 18px;
        padding: 0;
        border-left: none;
    }

    .tq-search-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
    }

    .tq-header-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 55px;
        height: 55px;
    }

    .tq-logo {
        min-height: 55px;
        height: 55px;
    }

    .tq-header-icons {
        display: flex;
        align-items: center;
        gap: 12px;
        min-height: 55px;
        height: 55px;
        border-left: none;
        padding-left: 0;
        margin-left: 0;
    }
}

@media (min-width: 769px) {
    .tq-hamburger {
        display: none;
    }
}


/* ======================================================
TABLES / FORMS / MISC CONTENT
====================================================== */

table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 24px;
    background: #fff;
}

th,
td {
    padding: 12px 14px;
    border: 1px solid var(--techqor-border);
    text-align: left;
}

th {
    color: var(--techqor-heading);
    font-weight: 600;
    background: #f8fafc;
}

input,
textarea,
select {
    border: 1px solid var(--techqor-border);
    padding: 12px 14px;
    color: var(--techqor-text);
    background: #fff;
    box-shadow: none;
}

input:focus,
textarea:focus,
select:focus {
    outline: none;
    border-color: rgba(32, 156, 238, 0.35);
}

/* ======================================================
ACCESSIBILITY
====================================================== */

.screen-reader-text {
    position: absolute;
    left: -9999px;
}

.screen-reader-text:focus {
    left: 20px;
    top: 20px;
    background: #000;
    color: #fff;
    padding: 10px 15px;
    z-index: 9999;
}
html.tq-no-scroll,
body.tq-no-scroll {
	overflow: hidden;
}

/* ======================================================
CUSTOM SCROLLBAR
====================================================== */

::-webkit-scrollbar {
    width: 2px;
}

::-webkit-scrollbar-track {
    background: #eef1f6;
}

::-webkit-scrollbar-thumb {
    background: var(--techqor-primary);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--techqor-primary-hover);
}



/* ======================================================
BODY STATES
====================================================== */

body.tq-menu-open,
body.techqor-offcanvas-open {
    overflow: hidden;
}

body.techqor-offcanvas-open {
    height: 100vh;
    touch-action: none;
}

img {
    width: 100%;
    display: block;
    image-rendering: auto;
    backface-visibility: hidden;
}



/* containers */

.techqor-page-hero,
.techqor-post,
.techqor-card,
.techqor-tool-card,
.front-widget,
.techqor-search-card,
.techqor-no-results,
.techqor-inline-related{
  overflow: hidden;
}



/* buttons */

.techqor-btn-primary,
.techqor-btn-outline,
.techqor-btn-glass{
  transition: var(--techqor-transition);
}

/* =========================
LOGO VISIBILITY FIX (CLEAN)
========================= */

.tq-logo img,
.tq-offcanvas-logo img,
.techqor-footer-logo img,
.custom-logo {
    display: block;
    max-width: 100%;
    width: auto;
    height: auto;
    max-height: 36px;
    object-fit: contain;
    vertical-align: middle;
}


/* =========================
SINGLE POST ONLY (FINAL CLEAN)
========================= */

.single-post .content-area {
    max-width: 720px;
    margin: 0 auto;
}

/* =========================
BREADCRUMB
========================= */
.single-post .tq-breadcrumb {
    background: #f7f8fa;
    padding: 8px 14px;
    border: 1px solid #eee;
    font-size: 14px;
    margin-bottom: 15px;
}

/* =========================
TITLE
========================= */
.single-post .tq-title {
    font-size: 30px;
    font-weight: 600;
    margin: 10px 0 15px;
    line-height: 1.3;
}

/* =========================
META (PERFECT)
========================= */
.single-post .tq-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
}

.single-post .tq-meta img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.single-post .tq-meta-text {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
}

.single-post .tq-author {
    font-size: 15px;
    font-weight: 500;
    color: #202124;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.single-post .tq-verified svg {
    width: 15px;
    height: 15px;
    fill: #058DF0;
}

.single-post .tq-date {
    font-size: 13px;
    color: #5f6368;
    margin-top: 2px;
}

/* =========================
FEATURED IMAGE
========================= */
.single-post .tq-featured-img img {
    width: 100%;
    height: auto !important;
    object-fit: contain !important;
}


/* =========================
   JOIN SECTION WRAPPER
========================= */
.tq-join-wrap {
  margin: 15px 0;
}


/* =========================
   JOIN ITEM (ROW)
========================= */
.tq-join-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #f9ffff;
  border: 1px solid #d0d0d0;
  padding: 5px 14px;
  margin-bottom: 10px;
  border-radius: 2px;
}


/* =========================
   LEFT SECTION
========================= */
.tq-join-left {
  display: flex;
  align-items: center;
  gap: 10px;
}


/* =========================
   ICON
========================= */
.tq-icon svg {
  width: 18px;
  height: 18px;
  display: block;
}


/* =========================
   TEXT
========================= */
.tq-text {
  font-size: 16px;
  font-weight: 600;
  color: #222;
  font-family: Arial, sans-serif;
}


/* =========================
   BUTTON (GENESIS SAFE RESET)
========================= */
.tq-btn {
  all: unset;
  display: inline-block;
  padding: 6px 14px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  border-radius: 2px;
  cursor: pointer;
  text-align: center;
}


/* =========================
   WHATSAPP STYLE
========================= */
.tq-join-item.whatsapp {
  border-color: #8ed1a3;
}

.tq-join-item.whatsapp .tq-btn {
  background: #5cc77a;
}


/* =========================
   TELEGRAM STYLE
========================= */
.tq-join-item.telegram {
  border-color: #7fbbe3;
}

.tq-join-item.telegram .tq-btn {
  background: #3b8fc9;
}


/* =========================
CONTENT
========================= */
.single-post .tq-content {
    font-size: 17px;
    line-height: 1.8;
}

.single-post .tq-content p {
    margin-bottom: 28px;
}
/* =========================
AUTHOR BOX (FINAL PERFECT)
========================= */

.single-post .tq-author-card {
    display: block;
    width: 100%;
    text-align: center;

    padding: 18px 20px 14px; /* top right bottom left */
    margin-top: 30px;

    background: #f7f8f9;
    border: 1px solid #ececec;
    border-radius: 0;
    box-sizing: border-box;
}

/* IMAGE */
.single-post .tq-author-img {
    display: flex;
    justify-content: center;
    align-items: center;

    margin: 0 0 10px;
    width: 100%;
}

.single-post .tq-author-img img {
    display: block;
    width: 78px;
    height: 78px;

    border-radius: 50%;
    object-fit: cover;
    margin: 0 auto;
}

/* AUTHOR NAME */
.single-post .tq-author-name {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 700;
    color: #202124;
    line-height: 1.3;
}

.single-post .tq-author-name::before {
    content: "By ";
    font-weight: 400;
    color: #666;
}

.single-post .tq-author-name a {
    color: #209cee;
    font-weight: 700;
    text-decoration: none;
}

.single-post .tq-author-name a:hover {
    text-decoration: underline;
}

/* VERIFIED BADGE */
.single-post .tq-author-verified {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.single-post .tq-author-verified svg {
    width: 15px;
    height: 15px;
    fill: #058DF0;
    display: block;
}

/* DESCRIPTION */
.single-post .tq-author-desc {
    max-width: 820px;
    margin: 0 auto;

    font-size: 16px;
    line-height: 1.65;
    color: #222;
}

/* 🔥 CRITICAL FIX: remove hidden extra space */
.single-post .tq-author-desc p {
    margin: 0 !important;
}

/* EXTRA SAFETY (in case theme override ho raha ho) */
.single-post .tq-author-card p {
    margin-bottom: 0 !important;
}

/* MOBILE */
@media (max-width: 768px) {

    .single-post .tq-author-card {
        padding: 16px 16px 12px;
        margin-top: 24px;
    }

    .single-post .tq-author-img {
        margin-bottom: 8px;
    }

    .single-post .tq-author-img img {
        width: 70px;
        height: 70px;
    }

    .single-post .tq-author-name {
        font-size: 15px;
        margin-bottom: 6px;
    }

    .single-post .tq-author-verified svg {
        width: 14px;
        height: 14px;
    }

    .single-post .tq-author-desc {
        font-size: 15px;
        line-height: 1.6;
    }
}
/* =========================
RELATED (FINAL CLEAN PREMIUM)
========================= */

/* =========================
HEADING (RESPONSIVE DIVIDER)
========================= */

.single-post .tq-related {
    text-align: center;
}

/* HEADING */
.single-post .tq-related h3 {
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 20px;
    font-weight: 600;
    color: #202124;

    margin: 30px 0 25px;
}

/* LINES (DESKTOP FULL WIDTH) */
.single-post .tq-related h3::before,
.single-post .tq-related h3::after {
    content: "";
    flex: 1; /* 🔥 full width */
    height: 1px;
    background: #e5e7eb;
}

/* GAP CONTROL */
.single-post .tq-related h3::before {
    margin-right: 12px;
}

.single-post .tq-related h3::after {
    margin-left: 12px;
}

/* =========================
MOBILE FIX
========================= */
@media (max-width: 768px) {

    .single-post .tq-related h3::before,
    .single-post .tq-related h3::after {
        flex: unset;
        width: 80px; /* 🔥 small lines for mobile */
    }
}
/* =========================
DESKTOP GRID
========================= */
.single-post .tq-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

/* CARD */
.single-post .tq-related-item {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: #202124;
    transition: transform 0.2s ease;
}

/* IMAGE */
.single-post .tq-related-item img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    transition: transform 0.25s ease;
}

/* CONTENT */
.single-post .tq-related-content {
    padding-top: 10px;
    text-align: left;
}

/* TITLE */
.single-post .tq-related-item h4 {
    font-size: 15px;
    font-weight: 500;
    margin: 0 0 6px;
    line-height: 1.5;
    transition: color 0.2s ease;
}

/* META */
.single-post .tq-related-meta {
    font-size: 12px;
    color: #5f6368;
}

/* HOVER */
.single-post .tq-related-item:hover h4 {
    color: var(--techqor-primary);
}

/* =========================
MOBILE / TABLET LIST VIEW
========================= */
@media (max-width: 768px) {

    .single-post .tq-related-grid {
        display: flex;
        flex-direction: column;
        gap: 0; /* 🔥 important */
    }

    .single-post .tq-related-item {
        flex-direction: row;
        align-items: flex-start;
        gap: 12px;

        padding: 12px 0;
        border-bottom: 1px solid #e5e7eb; /* 🔥 divider */
    }

    /* REMOVE LAST BORDER */
    .single-post .tq-related-item:last-child {
        border-bottom: none;
    }

    /* IMAGE */
    .single-post .tq-related-item img {
        width: 110px;
        height: 75px;
        flex-shrink: 0;
    }

    /* CONTENT */
    .single-post .tq-related-content {
        padding-top: 0;
        flex: 1;
    }

    /* TITLE */
    .single-post .tq-related-item h4 {
        font-size: 14px;
        margin: 0 0 4px;

        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* META */
    .single-post .tq-related-meta {
        font-size: 12px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* ==============================
INLINE SINGLE POST (MINIMAL)
============================== */

.tq-inline-post {
    display: flex;
    gap: 12px;
    align-items: center;
    margin: 20px 0;
    text-decoration: none;
}

/* IMAGE */
.tq-inline-thumb {
    width: 110px;
    aspect-ratio: 16/9;
    overflow: hidden;
    border-radius: 6px;
    flex-shrink: 0;
}

.tq-inline-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* CONTENT */
.tq-inline-content {
    display: flex;
    flex-direction: column;
}

/* TITLE */
.tq-inline-title {
    font-size: 15px;
    font-weight: 600;
    color: black;
    line-height: 1.4;
}

/* CTA */
.tq-inline-cta {
    font-size: 13px;
    color: #2563eb;
    margin-top: 4px;
}

/* HOVER */
.tq-inline-post:hover .tq-inline-title {
    color: var(--techqor-primary, #209cee);
}


/* =========================
   TechQor Light Footer (Final Clean Version)
========================= */

.techqor-site-footer {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: #f9fafb;
	color: #1a2a3a;
	clear: both;
}

.techqor-site-footer *,
.techqor-site-footer *::before,
.techqor-site-footer *::after {
	box-sizing: border-box;
}

/* Links */
.techqor-site-footer a {
	color: #1f3a5f;
	text-decoration: none;
	transition: all 0.25s ease;
}

.techqor-site-footer a:hover {
	color: #0073ff;
}

/* Layout */
.techqor-footer-inner {
	width: 100%;
	padding: 24px 0 20px;
	margin-top:10px;
}

.techqor-footer-wrap {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 20px;
}

.techqor-footer-grid {
	display: grid;
	grid-template-columns: minmax(260px, 1.45fr) minmax(150px, 0.7fr) minmax(150px, 0.7fr) minmax(280px, 1.15fr);
	gap: 32px;
}

/* Logo */
.techqor-footer-logo {
	margin-bottom: 14px;
}

.techqor-footer-logo img {
	max-height: 36px;
}

/* Site Title */
.techqor-footer-site-title {
	font-size: 2.1rem;
	font-weight: 800;
	background: none;
    color: #111;
	-webkit-background-clip: text;
}

/* Text */
.techqor-footer-desc,
.techqor-footer-newsletter-desc {
	color: #5a6b7c;
	line-height: 1.8;
}

/* Titles */
.techqor-footer-title {
	margin-bottom: 12px;
	font-size: 1.6rem;
	font-weight: 700;
	color: #0f1f2f;
	position: relative;
}

.techqor-footer-title::after {
	content: "";
	display: block;
	width: 40px;
	height: 2px;
	background: #0073ff;
	margin-top: 10px;
}

/* Menu */
.techqor-footer-menu,
.techqor-footer-fallback-menu {
	list-style: none;
	padding: 0;
	margin: 0;
}

.techqor-footer-menu li {
	margin-bottom: 8px;
}

.techqor-footer-menu a {
	color: #4a5a6a;
}

.techqor-footer-menu a:hover {
	color: #0073ff;
	transform: translateX(3px);
}

/* Social */
.techqor-footer-social {
	display: flex;
	gap: 14px;
	margin-top: 20px;
}

.techqor-social-link {
	position: relative;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;

	background: rgba(0,0,0,0.04);
	color: #1a2a3a;

	transition: all 0.35s ease;
	overflow: hidden;
}

/* subtle inner ring */
.techqor-social-link::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	box-shadow: inset 0 0 0 1px rgba(0,0,0,0.06);
	transition: all 0.35s ease;
}

/* hover gradient glow */
.techqor-social-link::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: linear-gradient(135deg, #0073ff, #00c6ff);
	opacity: 0;
	transition: opacity 0.35s ease;
	z-index: 0;
}

/* icon */
.techqor-social-link svg {
	position: relative;
	z-index: 1;
	width: 18px;
	height: 18px;
	transition: all 0.35s ease;
}


/* Newsletter */
.techqor-footer-newsletter-form {
	position: relative;
	margin-top: 20px;
}

.techqor-footer-newsletter-form input {
	width: 100%;
	height: 56px;
	padding: 0 70px 0 18px;
	border-radius: 999px;
	border: none;
	background: #ffffff;
	color: #1a2a3a;
	box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1);
}

.techqor-footer-newsletter-form input::placeholder {
	color: #7a8a9a;
}

.techqor-footer-newsletter-form button {
	position: absolute;
	right: 5px;
	top: 5px;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: none;
	background: #0073ff;
	color: #fff;
	cursor: pointer;
	transition: 0.25s;
}

.techqor-footer-newsletter-form button:hover {
	transform: scale(1.05);
}

/* Bottom */
.techqor-footer-bottom {
	margin-top: 18px;   /* 40 → 18 */
    padding-top: 10px;  /* 20 → 10 */
    text-align: center;
	border-top: 1px solid rgba(0,0,0,0.08);
}

.techqor-footer-bottom p {
	color: #6b7c8f;
	font-size: 0.95rem;
}
/* =========================
BACK TO TOP BUTTON (FIXED)
========================= */

#techqor-top {
    position: fixed;
    right: 18px;
    bottom: 18px;
    width: 42px;
    height: 42px;

    background: #0073ff;
    color: #fff;
    border: none;
    cursor: pointer;

    /* HIDDEN BY DEFAULT */
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);

    transition: all 0.3s ease;
}

/* SHOW WHEN ACTIVE */
#techqor-top.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}


/* Responsive */
@media (max-width: 900px) {
	.techqor-footer-grid {
		grid-template-columns: 1fr 1fr;
		gap: 30px;
	}
}

@media (max-width: 600px) {
	.techqor-footer-grid {
		grid-template-columns: 1fr;
	}
}



/* =========================
RECENT POSTS - CLEAN LIST UI
========================= */

/* MAIN WIDGET BOX */
.widget {
	border: 1px solid #eee;
background: #fff;
border-radius: 6px;
	overflow: hidden;
}

/* HEADER */
.widget-title {
	text-align: center;
	font-size: 15px;
	font-weight: 700;
	padding: 14px 10px;
	margin: 0;
	border-bottom: 1px solid rgba(0,0,0,0.06);
	background: #fafafa;
	letter-spacing: 0.4px;
}

/* POSTS WRAPPER */
.tq-recent-posts {
	padding: 10px 14px;
}

/* SINGLE POST */
.tq-post-item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 14px 0;
	border-bottom: 1px solid rgba(0,0,0,0.05);
}

.tq-post-item:last-child {
	border-bottom: none;
}

/* IMAGE */
.tq-post-thumb {
	flex: 0 0 110px;
	aspect-ratio: 16/9;
	overflow: hidden;
}

.tq-post-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* CONTENT */
.tq-post-content {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

/* TITLE (2 LINE CLAMP) */
.tq-post-title {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.45;
	color: #111;
	text-decoration: none;
	margin: 0;

	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tq-post-title:hover {
	color: #0073e6;
}

/* DATE */
.tq-post-date {
	font-size: 12px;
	color: #444;
	margin-top: 6px;
}

/* =========================
RESPONSIVE
========================= */

@media (max-width: 768px) {
	.tq-post-thumb {
		flex: 0 0 95px;
	}
}

@media (max-width: 480px) {

	.tq-post-item {
		gap: 12px;
	}

	.tq-post-thumb {
		flex: 0 0 85px;
	}

	.tq-post-title {
		font-size: 14px;
	}

	.tq-post-date {
		font-size: 11px;
	}
}

 /* =========================
COMMENT SECTION (PRO)
========================= */

.single-post #comments {
    margin-top: 40px;
}

/* TITLE */
.single-post .comment-reply-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 10px;
}

/* NOTE TEXT */
.single-post .comment-notes {
    font-size: 14px;
    color: #5f6368;
    margin-bottom: 20px;
}

/* FORM */
.single-post .comment-form {
    flex-direction: column;
    gap: 15px;
}

/* TEXTAREA */
.single-post .comment-form textarea {
    width: 100%;
    min-height: 140px;
    padding: 12px 14px;

    border: 1px solid #e5e7eb;
    border-radius: 8px;

    font-size: 14px;
    resize: vertical;

    transition: all 0.2s ease;
}

/* INPUTS */
.single-post .comment-form input[type="text"],
.single-post .comment-form input[type="email"],
.single-post .comment-form input[type="url"] {
    width: 100%;
    padding: 10px 12px;

    border: 1px solid #e5e7eb;
    border-radius: 8px;

    font-size: 14px;

    transition: all 0.2s ease;
}

/* FOCUS */
.single-post .comment-form input:focus,
.single-post .comment-form textarea:focus {
    outline: none;
    border-color: var(--techqor-primary);
    box-shadow: 0 0 0 2px rgba(5, 141, 240, 0.1);
}

/* LABELS */
.single-post .comment-form label {
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 4px;
    display: inline-block;
}

/* CHECKBOX */
.single-post .comment-form .comment-form-cookies-consent {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #5f6368;
}

/* BUTTON */
.single-post .comment-form input[type="submit"] {
    align-self: flex-start;

    padding: 10px 16px;
    background: var(--techqor-primary);
    color: #fff;

    border: none;
    border-radius: 8px;

    font-size: 14px;
    font-weight: 500;

    cursor: pointer;
    transition: all 0.2s ease;
}

.single-post .comment-form input[type="submit"]:hover {
    opacity: 0.9;
}

/* =========================
FORM GRID (DESKTOP)
========================= */
@media (min-width: 768px) {

    .single-post .comment-form-author,
    .single-post .comment-form-email,
    .single-post .comment-form-url {
        width: 32%;
        display: inline-block;
        vertical-align: top;
    }

    .single-post .comment-form {
        gap: 18px;
    }
}

/* =========================
MOBILE
========================= */
@media (max-width: 767px) {

    .single-post .comment-form-author,
    .single-post .comment-form-email,
    .single-post .comment-form-url {
        width: 100%;
    }

    .single-post .comment-form input[type="submit"] {
        width: 100%;
        text-align: center;
    }
}


/* =========================
COMMENT HEADING (MATCH RELATED)
========================= */

.single-post .comment-reply-title {
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 20px;
    font-weight: 600;
    color: #202124;

    margin: 35px 0 20px;
    text-align: center;
}

/* DIVIDERS */
.single-post .comment-reply-title::before,
.single-post .comment-reply-title::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

/* SPACING */
.single-post .comment-reply-title::before {
    margin-right: 12px;
}

.single-post .comment-reply-title::after {
    margin-left: 12px;
}

/* =========================
MOBILE
========================= */
@media (max-width: 768px) {

    .single-post .comment-reply-title::before,
    .single-post .comment-reply-title::after {
        flex: unset;
        width: 40px;
    }
}



/* =========================
   FAQ SECTION (PRO SYSTEM)
========================= */

.faq-box {
  margin-top: 40px;
  padding: 0;
}

/* Intro text */
.faq-intro {
  margin: 0 0 10px 0;
  font-size: 15px;
  color: #555;
  line-height: 1.5;
}

/* Heading */
.faq-box h2 {
  margin: 0 0 16px 0;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.3;
}

/* Each FAQ item */
.faq-item {
  padding: 12px 0;
  border-bottom: 1px solid #e5e7eb;
}

/* Remove last border */
.faq-item:last-child {
  border-bottom: none;
}

/* Question */
.faq-q {
  margin: 0 0 4px 0;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.4;
  color: #111;
}

/* Answer */
.faq-a {
  margin: 0;
  font-size: 15px;
  color: #444;
  line-height: 1.5;
}

/* Kill unwanted paragraph spacing */
.faq-box p {
  margin: 0;
}

/* Slight spacing between items (controlled) */
.faq-item + .faq-item {
  margin-top: 2px;
}

/* =========================
   MOBILE OPTIMIZATION
========================= */

@media (max-width: 768px) {

  .faq-box {
    margin-top: 30px;
  }

  .faq-box h2 {
    font-size: 20px;
  }

  .faq-q {
    font-size: 16px;
  }

  .faq-a {
    font-size: 14px;
  }

  .faq-intro {
    font-size: 14px;
  }
}

/* =========================
   OPTIONAL: TIGHT MODE
   (uncomment if needed)
========================= */

/*
.faq-item {
  padding: 10px 0;
}
*/

/* =========================
   SAFETY FIX (GENESIS THEMES)
========================= */

/* Prevent global spacing conflict */
.entry-content .faq-box p {
  margin-bottom: 0;
}

/* Remove extra spacing from headings inside FAQ */
.entry-content .faq-box h2,
.entry-content .faq-box h3 {
  margin-top: 0;
}



/* =========================
   ARCHIVE HEADER (MINIMAL LEFT)
========================= */
.tq-archive-header {
	margin: 0 0 18px;
}

.tq-archive-header .wrap {
	position: relative;
	padding: 8px 14px;
	background: var(--techqor-primary);
	border: 1px solid rgba(255,255,255,0.06);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	text-align: left;
	gap: 4px;
	min-height: auto;
}

/* =========================
   BREADCRUMB
========================= */
.tq-archive-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
	font-size: 0.72rem;
	line-height: 1.3;
	color: #94a3b8;
}

.tq-archive-breadcrumb a,
.tq-archive-breadcrumb-parent {
	color: #94a3b8;
	text-decoration: none;
}

.tq-archive-breadcrumb a:hover {
	color: var(--techqor-primary, #209cee);
}

.tq-archive-breadcrumb-sep {
	opacity: 0.5;
	font-size: 0.7rem;
}

/* =========================
   CURRENT TITLE IN BREADCRUMB
========================= */
.tq-archive-breadcrumb-current {
	font-size: clamp(1rem, 1.4vw, 1.25rem);
	font-weight: 600;
	color: #ffffff;
	letter-spacing: -0.01em;
}

/* =========================
   DESCRIPTION
========================= */
.tq-archive-description {
	margin-top: 2px;
	font-size: 0.8rem;
	line-height: 1.45;
	color: #9ca3af;
	max-width: 620px;
	text-align: left;
}

.tq-archive-description p:last-child {
	margin-bottom: 0;
}

/* =========================
   ARCHIVE LIST
========================= */
.tq-archive-list {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* =========================
   ARCHIVE ITEM (DESKTOP)
========================= */
.tq-archive-item {
	display: grid;
	grid-template-columns: 360px minmax(0, 1fr);
	gap: 18px;
	align-items: start;
	padding: 14px;
	margin: 0;
	border: 1px solid var(--techqor-border, #e7eaf0);
	background: #ffffff;
}

.tq-archive-item:hover {
	box-shadow: none;
	transform: none;
}

/* =========================
   THUMBNAIL LINK
========================= */
.tq-archive-thumb-link {
	display: block;
	text-decoration: none;
	padding: 3px 0;
	background: transparent;
	border: 0;
}

/* =========================
   THUMBNAIL
========================= */
.tq-archive-thumb {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.tq-archive-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: cover;
	transform: none;
	transform-origin: center;
}

.tq-no-thumb {
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #eef2f7, #e5ebf3);
}

/* =========================
   CONTENT
========================= */
.tq-archive-content {
	min-width: 0;
	display: flex;
	flex-direction: column;
	padding: 3px 0;
}

/* =========================
   TITLE
========================= */
.tq-archive-entry-title {
	margin: 0 0 6px;
	font-size: clamp(1.15rem, 1.5vw, 1.5rem);
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.tq-archive-entry-title a {
	color: #111827;
	text-decoration: none;
	transition: color 0.2s ease;
}

.tq-archive-entry-title a:hover,
.tq-archive-item:hover .tq-archive-entry-title a,
.tq-archive-thumb-link:hover + .tq-archive-content .tq-archive-entry-title a {
	color: var(--techqor-primary, #209cee);
}

/* =========================
   META
========================= */
.tq-archive-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin-bottom: 8px;
	font-size: 0.85rem;
	line-height: 1.4;
	color: #6b7280;
}

.tq-archive-meta a {
	color: inherit;
	text-decoration: none;
}

.tq-archive-meta a:hover {
	color: var(--techqor-primary, #209cee);
}

.tq-archive-meta-sep {
	opacity: 0.5;
}

/* =========================
   EXCERPT
========================= */
.tq-archive-excerpt {
	font-size: 0.95rem;
	line-height: 1.7;
	color: #4b5563;
}

/* =========================
   EMPTY STATE
========================= */
.tq-no-posts {
	padding: 20px 0;
	font-size: 1rem;
	color: #4b5563;
}

/* =========================
   PAGINATION
========================= */
.archive .pagination,
.blog .pagination,
.search .pagination {
	margin-top: 24px;
}

/* =========================
   TABLET
========================= */
@media (max-width: 1024px) {
	.tq-archive-header .wrap {
		padding: 8px 12px;
		gap: 3px;
	}

	.tq-archive-breadcrumb {
		font-size: 0.7rem;
	}

	.tq-archive-breadcrumb-current {
		font-size: 1.05rem;
	}

	.tq-archive-description {
		font-size: 0.76rem;
	}

	.tq-archive-list {
		gap: 16px;
	}

	.tq-archive-item {
		grid-template-columns: 280px minmax(0, 1fr);
		gap: 14px;
		padding: 0 0 16px;
		border: 0;
		background: transparent;
	}


	.tq-archive-thumb {
		aspect-ratio: 16 / 9;
	}

	.tq-archive-thumb img {
		width: 160%;
		height: 100%;
		max-width: none;
		object-fit: cover;
		margin-left: -30%;
	}

	.tq-archive-entry-title {
		margin-bottom: 5px;
		font-size: 1.04rem;
		line-height: 1.34;
	}

	.tq-archive-meta {
		margin-bottom: 7px;
		font-size: 0.8rem;
	}

	.tq-archive-excerpt {
		font-size: 0.9rem;
		line-height: 1.58;
	}
}

/* =========================
   MOBILE
========================= */
@media (max-width: 768px) {
	.tq-archive-header {
		margin-bottom: 16px;
	}

	.tq-archive-header .wrap {
		padding: 2px 10px;
		gap: 3px;
	}

	.tq-archive-breadcrumb {
		font-size: 0.68rem;
		gap: 4px;
	}

	.tq-archive-breadcrumb-current {
		font-size: 0.95rem;
	}

	.tq-archive-description {
		font-size: 0.74rem;
		line-height: 1.4;
	}

	.tq-archive-list {
		gap: 0;
	}

	.tq-archive-item {
		grid-template-columns: 150px minmax(0, 1fr);
		gap: 12px;
		padding: 0;
		margin: 0;
		border: 0;
		background: transparent;
		align-items: start;
	}

	.tq-archive-item + .tq-archive-item {
		margin-top: 14px;
		padding-top: 14px;
		border-top: 1px solid var(--techqor-border, #e7eaf0);
	}

	.tq-archive-thumb-link,
	.tq-archive-content {
		padding: 0;
	}

	.tq-archive-thumb {
		aspect-ratio: 16 / 10;
	}


	.tq-archive-thumb img {
		width: 160%;
		height: 100%;
		max-width: none;
		object-fit: cover;
		margin-left: -30%;
	}

	.tq-archive-entry-title {
		margin: 0 0 5px;
		font-size: 0.95rem;
		line-height: 1.34;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	.tq-archive-meta {
		margin-bottom: 0;
		font-size: 0.74rem;
		gap: 5px;
	}

	.tq-archive-excerpt {
		display: none;
	}
}

/* =========================
   SMALL MOBILE
========================= */
@media (max-width: 480px) {
	.tq-archive-item {
		grid-template-columns: 140px minmax(0, 1fr);
		gap: 10px;
	}

	.tq-archive-breadcrumb {
		font-size: 0.66rem;
	}

	.tq-archive-breadcrumb-current {
		font-size: 0.9rem;
	}

	.tq-archive-description {
		font-size: 0.72rem;
	}

	.tq-archive-entry-title {
		font-size: 0.93rem;
	}
}


/* =========================
PAGINATION (MODERN UI)
========================= */

.archive-pagination {
    margin: 40px 0;
    text-align: center;
}

/* LIST */
.archive-pagination ul {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

/* ITEMS */
.archive-pagination li {
    display: inline-block;
}

/* LINKS + ACTIVE */
.archive-pagination a,
.archive-pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 38px;
    height: 38px;
    padding: 0 10px;

    font-size: 14px;
    font-weight: 600;

    border-radius: 10px;
    border: 1px solid #209cee;

    color: #202124;
    text-decoration: none;

    transition: all 0.2s ease;
}

/* HOVER */
.archive-pagination a:hover {
    border-color: #209cee;
    background: #f8fafc;
}

/* ACTIVE */
/* ACTIVE (FINAL FIX) */
.archive-pagination .current,
.archive-pagination a.current {
    background: var(--techqor-primary);
    border-color: var(--techqor-primary);
    color: #fff;
}

/* NEXT / PREV */
.archive-pagination .pagination-next a,
.archive-pagination .pagination-previous a {
    font-weight: 600;
}

/* DOTS (...) */
.archive-pagination .dots {
    border: none;
    background: transparent;
    padding: 0 6px;
}

/* =========================
RESPONSIVE
========================= */
@media (max-width: 600px) {

    .archive-pagination ul {
        gap: 6px;
    }

    .archive-pagination a,
    .archive-pagination span {
        min-width: 32px;
        height: 32px;
        font-size: 13px;
        border-radius: 8px;
    }

    /* hide extra pages */
    .archive-pagination li:nth-child(n+5):not(.pagination-next) {
        display: none;
    }
}





.tq-archive-breadcrumb {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: #cbd5e1;
}

.tq-archive-breadcrumb a {
	color: #ffffff;
	text-decoration: none;
}

.tq-sep {
	opacity: 0.6;
}

/* CATEGORY BADGE */
.tq-category-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #121213;
	color: #fff;
	padding: 6px 10px;
	border-radius: 4px;
	font-weight: 500;
}

.tq-category-badge svg {
	width: 14px;
	height: 14px;
	fill: #fff;
}



.site-footer,
.tq-footer {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.techqor-footer-inner {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

.techqor-footer-bottom {
    margin-bottom: 0 !important;
    padding-bottom: 10px !important;
}

.site-footer .wrap {
    padding-bottom: 0 !important;
}

.site-footer *:last-child {
    margin-bottom: 10px !important;
}



/* ======================================================
RESPONSIVE BORDER RADIUS SYSTEM
Desktop = Flat
Tablet/Mobile = 10px
====================================================== */

/* Desktop flat */
@media (min-width: 1025px) {
    .widget,
    .tq-latest-card,
    .techqor-tool-card,
    .tq-info-item,
    .single-post .tq-author-card,
    .single-post .tq-breadcrumb,
    .single-post .comment-form textarea,
    .single-post .comment-form input[type="text"],
    .single-post .comment-form input[type="email"],
    .single-post .comment-form input[type="url"],
    .single-post .comment-form input[type="submit"],
    .tq-join-item,
    .archive-pagination a,
    .archive-pagination span,
    .tq-archive-header .wrap,
    .tq-archive-item,
    table,
    input,
    textarea,
    select,
    .tq-search-dropdown,
    .tq-search-dropdown input,
    .tq-search-dropdown button,
    .tq-offcanvas,
    .tq-close-btn {
        border-radius: 0 !important;
    }

    .tq-latest-card-thumb,
    .tq-latest-card-thumb img,
    .tq-post-thumb,
    .tq-post-thumb img,
    .tq-archive-thumb,
    .tq-archive-thumb img,
    .single-post .tq-related-item img {
        border-radius: 0 !important;
    }
}

/* Tablet + Mobile rounded */
@media (max-width: 1024px) {
    .widget,
    .tq-latest-card,
    .techqor-tool-card,
    .tq-info-item,
    .single-post .tq-author-card,
    .single-post .tq-breadcrumb,
    .single-post .comment-form textarea,
    .single-post .comment-form input[type="text"],
    .single-post .comment-form input[type="email"],
    .single-post .comment-form input[type="url"],
    .single-post .comment-form input[type="submit"],
    .tq-join-item,
    .archive-pagination a,
    .archive-pagination span,
    .tq-archive-header .wrap,
    .tq-archive-item,
    table,
    input,
    textarea,
    select,
    .tq-search-dropdown,
    .tq-search-dropdown input,
    .tq-search-dropdown button,
    .tq-offcanvas,
    .tq-close-btn {
        border-radius: var(--techqor-radius) !important;
    }

    .tq-latest-card-thumb,
    .tq-latest-card-thumb img,
    .tq-post-thumb,
    .tq-post-thumb img,
    .tq-archive-thumb,
    .tq-archive-thumb img,
    .single-post .tq-related-item img {
        border-radius: var(--techqor-radius) !important;
    }
}



/* ======================================================
GLOBAL RADIUS SYSTEM (FINAL - GENESIS SAFE)
====================================================== */

/* =========================
DESKTOP → FULL FLAT
========================= */

@media (min-width: 1025px) {

    /* MAIN UI ELEMENTS */
    .widget,
    .tq-latest-card,
    .tq-archive-item,
    .tq-related-item,
    .tq-join-item,
    .tq-inline-thumb,
    .techqor-card,
    .techqor-tool-card,
    .techqor-search-card,
    .techqor-no-results,
    .archive-pagination a,
    .archive-pagination span,
    input,
    textarea,
    select,
    .tq-search-dropdown,
    .tq-offcanvas,
    .single-post .tq-featured-img,
    .single-post .tq-related-item img {
        border-radius: 0 !important;
    }

}


/* =========================
TABLET + MOBILE → 10px
========================= */

@media (max-width: 1024px) {

    /* MAIN UI ELEMENTS */
    .widget,
    .tq-latest-card,
    .tq-archive-item,
    .tq-related-item,
    .tq-join-item,
    .tq-inline-thumb,
    .techqor-card,
    .techqor-tool-card,
    .techqor-search-card,
    .techqor-no-results,
    .archive-pagination a,
    .archive-pagination span,
    input,
    textarea,
    select,
    .tq-search-dropdown,
    .tq-offcanvas {
        border-radius: 10px !important;
    }

    /* =========================
    FEATURED IMAGE (FIXED)
    ========================= */

    .single-post .tq-featured-img {
        border-radius: 10px !important;
        overflow: hidden;
    }

    .single-post .tq-featured-img img {
        border-radius: 10px !important;
    }

    /* =========================
    RELATED POSTS IMAGE
    ========================= */

    .single-post .tq-related-item img {
        border-radius: 10px !important;
    }

    /* =========================
    INLINE POSTS
    ========================= */

    .tq-inline-thumb {
        border-radius: 10px !important;
    }

    /* =========================
    CARD IMAGES (OPTIONAL CLEAN LOOK)
    ========================= */

    .tq-latest-card-thumb,
    .tq-post-thumb,
    .tq-archive-thumb {
        border-radius: 6px !important;
        overflow: hidden;
    }

    /* =========================
    CIRCLE ELEMENTS (SAFE)
    ========================= */

    .techqor-social-link,
    #techqor-top {
        border-radius: 50% !important;
    }

}















/* =========================================================
FRONT PAGE DIRECTORY LAYOUT - FINAL CLEAN
========================================================= */

/* front page reset */
.techqor-front-page .site-container {
	max-width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.techqor-front-page .site-inner,
.techqor-front-page .content-sidebar-wrap,
.techqor-front-page .content {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
}

.techqor-front-page .content-sidebar-wrap {
	display: block !important;
}

.techqor-front-page .entry,
.techqor-front-page .post,
.techqor-front-page .page {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.techqor-front-page {
	background: #f3f4f6;
}

/* main */
.techqor-front-main.tq-directory-home {
	padding: 18px 0 34px;
	background: #f3f4f6;
}

.techqor-front-page .techqor-wrap {
	width: min(1280px, calc(100% - 18px));
	margin-left: auto;
	margin-right: auto;
}

/* =========================================================
HERO
========================================================= */

.tq-home-hero {
	margin: 0 0 16px;
}

.tq-home-hero-box {
	border-radius: 12px;
	padding: 22px 20px;
	background: #ffffff;
	border: 1px solid #e7ebf1;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.tq-home-hero-content {
	max-width: 980px;
}

.tq-home-hero-title {
	margin: 0 0 8px;
	font-size: clamp(28px, 4vw, 44px);
	line-height: 1.08;
	font-weight: 800;
	letter-spacing: -0.03em;
	color: #0f172a;
}

.tq-home-hero-desc {
	margin: 0;
	font-size: 14px;
	line-height: 1.65;
	color: #475467;
}

/* =========================================================
SEARCH
========================================================= */

.tq-home-search-section {
	margin: 0 0 18px;
}

.tq-home-search {
	position: relative;
	max-width: 640px;
	margin: 0 auto;
}

.tq-home-search input[type="search"] {
	width: 100%;
	height: 46px;
	padding: 0 16px 0 44px;
	border: 1px solid #d7dce3;
	border-radius: 10px;
	background: #fff;
	color: #111827;
	font-size: 13px;
	font-weight: 500;
	outline: none;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	appearance: none;
	-webkit-appearance: none;
}

.tq-home-search input[type="search"]::placeholder {
	color: #8a94a6;
	opacity: 1;
}

.tq-home-search input[type="search"]:focus {
	border-color: #209cee;
	box-shadow: 0 4px 12px rgba(32, 156, 238, 0.10);
}

.tq-home-search-icon {
	position: absolute;
	top: 50%;
	left: 14px;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #8a94a6;
	pointer-events: none;
}

/* =========================================================
SECTIONS
========================================================= */

.tq-home-service-sections {
	padding: 0;
}

.tq-service-group {
	margin: 0 0 28px;
}

.tq-service-group:last-child {
	margin-bottom: 0;
}

.tq-service-group-header {
	margin-bottom: 14px;
}

.tq-service-group-title {
	position: relative;
	margin: 0;
	padding-left: 12px;
	font-size: 18px;
	line-height: 1.2;
	font-weight: 800;
	letter-spacing: -0.015em;
	color: #0f172a;
}

.tq-service-group-title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 2px;
	bottom: 2px;
	width: 4px;
	border-radius: 999px;
	background: linear-gradient(180deg, #ec4899 0%, #8b5cf6 100%);
}

.tq-service-group.is-orange .tq-service-group-title::before {
	background: linear-gradient(180deg, #fb7185 0%, #f59e0b 100%);
}

/* =========================================================
GRID
========================================================= */

.tq-service-grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 14px;
	align-items: stretch;
}

/* =========================================================
CARD
========================================================= */

.tq-service-card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 168px;
	padding: 18px 14px 14px;
	text-align: center;
	text-decoration: none;
	background: #ffffff;
	border-radius: 24px;
	border: 1.5px solid #dce7f3;
	box-shadow: none;
	overflow: hidden;
	transition:
		transform 0.18s ease,
		box-shadow 0.18s ease,
		border-color 0.18s ease;
}

.tq-service-card:hover,
.tq-service-card:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

.tq-service-card:nth-child(5n+1) {
	border-color: #c8ddff;
}

.tq-service-card:nth-child(5n+2) {
	border-color: #c8ddff;
}

.tq-service-card:nth-child(5n+3) {
	border-color: #c9f0d8;
}

.tq-service-card:nth-child(5n+4) {
	border-color: #d8cfff;
}

.tq-service-card:nth-child(5n+5) {
	border-color: #efdba8;
}

/* =========================================================
ICON
========================================================= */

.tq-service-card-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	margin-bottom: 14px;
	border-radius: 18px;
	background: #f7f7f8;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.95);
}

.tq-service-svg,
.tq-service-emoji {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	line-height: 1;
	color: #4b5563;
}

.tq-service-svg svg {
	width: 40px;
	height: 40px;
	display: block;
}

.tq-service-icon-placeholder {
	display: inline-block;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: linear-gradient(135deg, #dbeafe 0%, #fce7f3 100%);
}

/* =========================================================
TITLE
========================================================= */

.tq-service-card-title {
	margin: 0;
	font-size: 16px;
	line-height: 1.35;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: #233b5e;
	text-wrap: balance;
	max-width: 100%;
}

/* =========================================================
BADGE
========================================================= */

.tq-service-badge {
	position: absolute;
	top: 12px;
	right: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 46px;
	height: 28px;
	padding: 0 10px;
	border-radius: 999px;
	color: #ffffff;
	font-size: 14px;
	line-height: 1;
	font-weight: 800;
	text-transform: uppercase;
	box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}

.tq-service-badge-free {
	background: linear-gradient(135deg, #9bd40f 0%, #74c50f 100%);
}

.tq-service-badge-paid {
	background: linear-gradient(135deg, #ff5b7f 0%, #ff3f67 100%);
}

/* =========================================================
ACCESSIBILITY
========================================================= */

.techqor-front-page img {
	max-width: 100%;
	height: auto;
}

.techqor-front-page a {
	text-decoration: none;
}

.techqor-front-page .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* =========================================================
RESPONSIVE
========================================================= */

@media (max-width: 1200px) {
	.tq-service-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 12px;
	}

	.tq-service-card {
		min-height: 158px;
		border-radius: 22px;
	}
}

@media (max-width: 900px) {
	.techqor-front-page .techqor-wrap {
		width: min(100%, calc(100% - 14px));
	}

	.tq-service-group {
		margin-bottom: 22px;
	}

	.tq-service-group-title {
		font-size: 17px;
	}

	.tq-service-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 10px;
	}

	.tq-service-card {
		min-height: 146px;
		padding: 16px 10px 12px;
		border-radius: 18px;
	}

	.tq-service-card-icon {
		width: 62px;
		height: 62px;
		margin-bottom: 12px;
		border-radius: 16px;
	}

	.tq-service-svg svg {
		width: 34px;
		height: 34px;
	}

	.tq-service-card-title {
		font-size: 14px;
	}

	.tq-service-badge {
		min-width: 40px;
		height: 24px;
		font-size: 12px;
	}
}

@media (max-width: 600px) {
	.techqor-front-main.tq-directory-home {
		padding: 14px 0 24px;
	}

	.techqor-front-page .techqor-wrap {
		width: min(100%, calc(100% - 12px));
	}

	.tq-home-hero-box {
		padding: 18px 14px;
		border-radius: 10px;
	}

	.tq-home-hero-title {
		font-size: 24px;
	}

	.tq-home-hero-desc {
		font-size: 12.5px;
	}

	.tq-home-search input[type="search"] {
		height: 44px;
		font-size: 13px;
		border-radius: 10px;
	}

	.tq-service-group {
		margin-bottom: 20px;
	}

	.tq-service-group-header {
		margin-bottom: 10px;
	}

	.tq-service-group-title {
		font-size: 16px;
		padding-left: 10px;
	}

	.tq-service-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.tq-service-card {
		min-height: 128px;
		padding: 14px 8px 10px;
		border-radius: 16px;
	}

	.tq-service-card-icon {
		width: 52px;
		height: 52px;
		margin-bottom: 10px;
		border-radius: 14px;
	}

	.tq-service-svg svg {
		width: 28px;
		height: 28px;
	}

	.tq-service-card-title {
		font-size: 13px;
		line-height: 1.3;
	}

	.tq-service-badge {
		top: 10px;
		right: 10px;
		min-width: 36px;
		height: 22px;
		padding: 0 8px;
		font-size: 10px;
	}
}