/*
Theme Name: CLICQRANK
Theme URI: https://clicqrank.site
Author: CLICQRANK Agency
Author URI: https://clicqrank.site
Description: CLICQRANK — SEO, websites, paid ads & creative growth systems. Production classic PHP theme replicating the CLICQRANK design 1:1. Ships compiled Tailwind CSS (no CDN). Includes Home, Services (with 5 cluster pages), Clusters, Research, Blog, Case Studies, About, Contact and FAQs templates.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clicqrank
Tags: business, marketing, seo, agency, one-column, two-columns, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* Small overrides on top of compiled Tailwind (assets/tailwind.css). */
html { scroll-behavior: smooth; }
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.skip-link {
  position: absolute; left: -9999px; top: 0; background:#008080; color:#fff;
  padding:.5rem 1rem; z-index:1000; border-radius:0 0 .5rem 0;
}
.skip-link:focus { left: 0; }
:focus-visible { outline: 2px solid #008080; outline-offset: 2px; }

/* =========================================================
   Safety baseline — ensures pages remain readable & branded
   even when Tailwind utilities are stripped by an optimizer
   plugin, or when the_content() outputs raw HTML without
   utility classes (default WordPress Page/Post content).
   ========================================================= */
:root {
  --cq-brand: #008080;
  --cq-brand-foreground: #ffffff;
  --cq-brand-soft: #e6f4f4;
  --cq-ink: #0b1220;
  --cq-body: #334155;
  --cq-muted: #64748b;
  --cq-border: #e5e7eb;
  --cq-bg: #ffffff;
}
html, body { background: var(--cq-bg); color: var(--cq-body); }
body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
}
img { max-width: 100%; height: auto; }

/* Themed defaults for raw WP page/post content (the_content) */
.entry-content, .prose {
  color: var(--cq-body);
  font-size: 1.0625rem;
  line-height: 1.75;
}
.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, .entry-content h5, .entry-content h6,
.prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
  color: var(--cq-ink);
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  font-weight: 700;
  line-height: 1.25;
  margin: 1.6em 0 0.6em;
}
.entry-content h1, .prose h1 { font-size: 2.25rem; }
.entry-content h2, .prose h2 { font-size: 1.75rem; }
.entry-content h3, .prose h3 { font-size: 1.375rem; }
.entry-content p, .prose p { margin: 0 0 1.15em; }
.entry-content a, .prose a { color: var(--cq-brand); text-decoration: underline; text-underline-offset: 3px; }
.entry-content a:hover, .prose a:hover { opacity: .85; }
.entry-content ul, .entry-content ol, .prose ul, .prose ol { padding-left: 1.4em; margin: 0 0 1.15em; }
.entry-content li, .prose li { margin: .35em 0; }
.entry-content blockquote, .prose blockquote {
  border-left: 4px solid var(--cq-brand);
  background: var(--cq-brand-soft);
  padding: .85em 1.1em;
  border-radius: .5rem;
  margin: 1.25em 0;
  color: var(--cq-ink);
}
.entry-content code, .prose code {
  background: #f1f5f9; padding: .15em .4em; border-radius: .35rem; font-size: .95em;
}
.entry-content pre, .prose pre {
  background: #0b1220; color: #e2e8f0; padding: 1em 1.1em;
  border-radius: .75rem; overflow:auto; margin: 1.25em 0;
}
.entry-content img, .prose img { border-radius: .75rem; }
.entry-content table, .prose table {
  width: 100%; border-collapse: collapse; margin: 1.25em 0;
}
.entry-content th, .entry-content td, .prose th, .prose td {
  border: 1px solid var(--cq-border); padding: .6em .8em; text-align: left;
}
.entry-content th, .prose th { background: var(--cq-brand-soft); color: var(--cq-ink); }

/* Pagination */
.page-numbers { display: inline-flex; gap: .35rem; align-items: center; flex-wrap: wrap; }
.page-numbers li .page-numbers,
.page-numbers a, .page-numbers span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.25rem; height: 2.25rem; padding: 0 .75rem;
  border-radius: .5rem; border: 1px solid var(--cq-border);
  background: #fff; color: var(--cq-ink); font-weight: 600; text-decoration: none;
}
.page-numbers .current { background: var(--cq-brand); color: var(--cq-brand-foreground); border-color: var(--cq-brand); }

/* Comments */
.comment-list { padding-left: 0; list-style: none; }
.comment-body { padding: 1rem; border: 1px solid var(--cq-border); border-radius: .75rem; background: #fff; margin-bottom: 1rem; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%; padding: .6rem .75rem; border: 1px solid var(--cq-border);
  border-radius: .5rem; background: #fff; color: var(--cq-ink); font: inherit;
}
.comment-form textarea { min-height: 9rem; }
.comment-form .form-submit input,
.comment-form .submit {
  background: var(--cq-brand); color: var(--cq-brand-foreground); border: 0;
  padding: .7rem 1.25rem; border-radius: .5rem; font-weight: 600; cursor: pointer;
}

/* Screen-reader utility (fallback if Tailwind missing) */
.sr-only { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
