/*
Theme Name: Unique Digit
Theme URI: https://uniquedigit.com/
Author: UniqueDigit Team
Author URI: https://uniquedigit.com/
Description: UniqueDigit is a modern, lightweight WordPress theme built as a canvas, enabling developers and agencies to craft fast, scalable, and fully customized websites from the ground up.
Version: 3.0.0
Text Domain: digits
*/

/* FAQ (matches Google Ads page) */
/*.vns-faq .section-tag { background:rgba(249,115,22,.16); color:#ffb27a; }
.vns-faq h2 { color:#fff; }
.vns-faq h2 em { color:#F97316; font-style:normal; }
.vns-faq .section-subtitle { color:rgba(255,255,255,.72); }*/
.vns-faq .section-tag { display:inline-block; font-size:12.5px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:#1a3fc4; background:#eef1fd; padding:6px 14px; border-radius:100px; margin-bottom:16px; }
.vns-faq .section-title { font-size:34px; font-weight:800; letter-spacing:-0.5px; line-height:1.2; margin-bottom:14px; color:#0f1729; }
.vns-faq .section-title em { color:#1a3fc4; font-style:normal; }
.vns-faq .section-subtitle { font-size:16.5px; color:#4a5568; line-height:1.7; max-width:760px; }
.vns-faq .text-center { text-align:center; }
.vns-faq .text-center .section-subtitle { margin-left:auto; margin-right:auto; }


section.vns-faq { background:#fff;padding: 40px 0; }
.vns-faq .faq-list { max-width:880px; margin:40px auto 0; }
.vns-faq .faq-item { background:#f8f9fa; margin-bottom:12px; border-radius:12px; border:1px solid #eee; overflow:hidden; transition:all .2s; }
.vns-faq .faq-item:hover { border-color:#1a3fc4; }
.vns-faq .faq-question { padding:18px 22px; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; font-weight:600; font-size:15.5px; color:#0f1729; padding:0px;}
.vns-faq .faq-toggle { width:28px; height:28px; background:#1a3fc4; color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:18px; line-height:1; transition:transform .2s; }
.vns-faq .faq-item.active .faq-toggle { transform:rotate(45deg); background:#F97316; }
.vns-faq .faq-answer { padding:0 22px; max-height:0; overflow:hidden; transition:max-height .3s, padding .3s; font-size:14.5px; color:#555; line-height:1.7; }
.vns-faq .faq-item.active .faq-answer { padding: 20px 0px; max-height:1600px; }
.vns-faq .faq-answer p { margin-bottom:12px; }
.vns-faq .faq-answer p:last-child { margin-bottom:0; }
.vns-faq .faq-breakdown { list-style:none; padding:0; margin:14px 0; }
.vns-faq .faq-breakdown li { padding:8px 0 8px 26px; position:relative; font-size:14px; color:#444; line-height:1.6; }
.vns-faq .faq-breakdown li::before { content:''; position:absolute; left:0; top:13px; width:14px; height:14px; background:#e6f7ed; border-radius:50%; }
.vns-faq .faq-breakdown li::after { content:''; position:absolute; left:3px; top:16px; width:7px; height:4px; border-left:2px solid #10b981; border-bottom:2px solid #10b981; transform:rotate(-45deg); }
.vns-faq .faq-breakdown li strong { color:#1a1a1a; font-weight:700; }
.vns-faq .faq-answer a { color:#1a3fc4; font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.vns-faq .faq-answer a:hover { color:#F97316; }

@media (max-width: 768px){
    aside.blog-sidebar{position: relative;}
}


/* ==========================================================================
   .article-body — Typography & Content Elements
   Scope: all WordPress post/page body content
   ========================================================================== */

.article-body {
  font-size: 17px;
  line-height: 1.75;
  color: #222222;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* ==========================================================================
   Headings
   ========================================================================== */

.article-body h1,
.article-body h2,
.article-body h3,
.article-body h4,
.article-body h5,
.article-body h6 {
  font-weight: 700;
  line-height: 1.3;
  color: #111111;
  margin: 1.6em 0 0.6em;
}

.article-body h1:first-child,
.article-body h2:first-child,
.article-body h3:first-child {
  margin-top: 0;
}

.article-body h1 { font-size: 2.25em; }
.article-body h2 { font-size: 1.85em; }
.article-body h3 { font-size: 1.5em; }
.article-body h4 { font-size: 1.25em; }
.article-body h5 { font-size: 1.1em; }
.article-body h6 {
  font-size: 0.95em;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #555555;
}

/* ==========================================================================
   Paragraph & inline text
   ========================================================================== */

.article-body p {
  margin: 0 0 1.25em;
}

.article-body strong,
.article-body b {
  font-weight: 700;
}

.article-body em,
.article-body i {
  font-style: italic;
}

.article-body u {
  text-decoration: underline;
}

.article-body mark {
  background: #fff3b0;
  color: inherit;
  padding: 0.1em 0.3em;
  border-radius: 2px;
}

.article-body small {
  font-size: 0.85em;
  color: #666666;
}

.article-body sub {
  vertical-align: sub;
  font-size: 0.75em;
}

.article-body sup {
  vertical-align: super;
  font-size: 0.75em;
}

.article-body code {
  font-size: 0.88em;
  background: #f3f3f3;
  color: #d6336c;
  padding: 0.15em 0.4em;
  border-radius: 3px;
}

.article-body kbd {
  font-size: 0.85em;
  background: #2b2b2b;
  color: #ffffff;
  padding: 0.15em 0.5em;
  border-radius: 4px;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,0.15), 0 1px 0 rgba(0,0,0,0.3);
}

.article-body var {
  font-style: italic;
}

.article-body abbr,
.article-body acronym {
  text-decoration: underline dotted;
  cursor: help;
}

.article-body q {
  quotes: "“" "”" "‘" "’";
  font-style: italic;
}

.article-body q::before { content: open-quote; }
.article-body q::after  { content: close-quote; }

.article-body hr {
  border: none;
  border-top: 1px solid #e2e2e2;
  margin: 2.5em 0;
}

/* ==========================================================================
   Blockquote
   ========================================================================== */

.article-body blockquote {
  margin: 1.75em 0;
  padding: 0.75em 1.5em;
  border-left: 4px solid #ff7a00;
  background: #faf9f7;
  font-style: italic;
  color: #333333;
}

.article-body blockquote p {
  margin: 0 0 0.5em;
}

.article-body blockquote cite {
  display: block;
  margin-top: 0.5em;
  font-style: normal;
  font-size: 0.9em;
  color: #777777;
}

.article-body blockquote cite::before {
  content: "";
}

/* Twitter/X embed blockquote should not inherit the styled quote look */
.article-body blockquote.twitter-tweet {
  border-left: none;
  background: transparent;
  font-style: normal;
  padding: 0;
}

/* ==========================================================================
   Preformatted / Code blocks
   ========================================================================== */

.article-body pre {
  background: #1e1e1e;
  color: #e6e6e6;
  padding: 1.25em;
  border-radius: 6px;
  overflow-x: auto;
  margin: 1.75em 0;
  font-size: 0.88em;
  line-height: 1.6;
}

.article-body pre code {
  background: none;
  color: inherit;
  padding: 0;
  font-size: 1em;
}

/* ==========================================================================
   Lists — ordered / unordered / nested
   ========================================================================== */

.article-body ol,
.article-body ul {
  margin: 0 0 1.25em;
  padding-left: 1.5em;
}

.article-body li {
  margin-bottom: 0.4em;
}

.article-body ul li {
  list-style-type: disc;
}

.article-body ul ul li {
  list-style-type: circle;
}

.article-body ul ul ul li {
  list-style-type: square;
}

.article-body ol li {
  list-style-type: decimal;
}

.article-body ol ol li {
  list-style-type: lower-alpha;
}

.article-body ol ol ol li {
  list-style-type: lower-roman;
}

.article-body ol ol,
.article-body ul ul,
.article-body ol ul,
.article-body ul ol {
  margin-top: 0.4em;
  margin-bottom: 0;
}

/* ==========================================================================
   Definition list
   ========================================================================== */

.article-body dl {
  margin: 0 0 1.5em;
}

.article-body dt {
  font-weight: 700;
  color: #111111;
  margin-top: 0.9em;
}

.article-body dd {
  margin: 0.2em 0 0;
  padding-left: 1em;
  color: #444444;
}

/* ==========================================================================
   Table
   ========================================================================== */

.article-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.75em 0;
  font-size: 0.95em;
}

.article-body th,
.article-body td {
  border: 1px solid #e0e0e0;
  padding: 0.7em 1em;
  text-align: left;
}

.article-body thead th {
  background: #fdf1e6;
  color: #111111;
  font-weight: 700;
  border-bottom: 2px solid #ff7a00;
}

.article-body tbody tr:nth-child(even) {
  background: #fafafa;
}

.article-body tbody tr:hover {
  background: #f5f0ea;
}

/* ==========================================================================
   Images
   ========================================================================== */

.article-body img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
}

/* Author-set inline float/width/align styles on <img> are preserved as-is;
   these rules only apply when no inline style is present. */
.article-body p > img:only-child {
  display: block;
  margin: 1.5em auto;
}

.article-body .alignleft,
.article-body img[style*="float:left"] {
  float: left;
  margin: 0.3em 1.5em 1em 0;
}

.article-body .alignright,
.article-body img[style*="float:right"] {
  float: right;
  margin: 0.3em 0 1em 1.5em;
}

.article-body .aligncenter {
  display: block;
  margin: 1.5em auto;
}

/* Clearfix helper for float layouts */
.article-body .clear,
.article-body [style*="clear:both"] {
  clear: both;
}

/* ==========================================================================
   Figure / Figcaption
   ========================================================================== */

.article-body figure {
  margin: 1.75em 0;
}

.article-body figure img {
  display: block;
  width: 100%;
}

.article-body figcaption {
  margin-top: 0.6em;
  font-size: 0.88em;
  color: #777777;
  text-align: center;
}

/* ==========================================================================
   Linked image
   ========================================================================== */

.article-body a img {
  border: none;
  transition: opacity 0.2s ease;
}

.article-body a:hover img {
  opacity: 0.9;
}

/* ==========================================================================
   Simple gallery (flex-wrap grid)
   ========================================================================== */

.article-body .gallery,
.article-body [style*="display:flex"] {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin: 1.75em 0;
}

.article-body .gallery img {
  flex: 1 1 calc(33.333% - 15px);
  min-width: 150px;
  object-fit: cover;
}

/* ==========================================================================
   Audio / Video / Embeds
   ========================================================================== */

.article-body audio {
  width: 100%;
  max-width: 480px;
  margin: 1em 0;
}

.article-body video {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  margin: 1em 0;
  background: #000;
}

.article-body iframe {
  max-width: 100%;
  border: none;
  margin: 1.5em 0;
  border-radius: 4px;
}

/* Responsive 16:9 wrapper — apply this class to a wrapping <div> around
   YouTube/Vimeo iframes if you want fluid embeds instead of fixed px sizes */
.article-body .embed-responsive {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  margin: 1.75em 0;
}

.article-body .embed-responsive iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.article-body button,
.article-body input[type="button"],
.article-body input[type="submit"],
.article-body a.button {
  display: inline-block;
  font-family: inherit;
  font-size: 0.95em;
  font-weight: 600;
  color: #ffffff;
  background: #ff7a00;
  border: none;
  padding: 0.65em 1.4em;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s ease, transform 0.1s ease;
}

.article-body button:hover,
.article-body input[type="button"]:hover,
.article-body input[type="submit"]:hover,
.article-body a.button:hover {
  background: #e56d00;
}

.article-body button:active,
.article-body input[type="button"]:active,
.article-body input[type="submit"]:active,
.article-body a.button:active {
  transform: translateY(1px);
}

.article-body button:disabled,
.article-body input:disabled {
  background: #cccccc;
  color: #888888;
  cursor: not-allowed;
}

/* ==========================================================================
   Forms
   ========================================================================== */

.article-body form {
  margin: 1.75em 0;
  max-width: 480px;
}

.article-body form label {
  display: inline-block;
  font-weight: 600;
  font-size: 0.9em;
  color: #333333;
  margin-bottom: 0.3em;
}

.article-body form input[type="text"],
.article-body form input[type="email"],
.article-body form input[type="password"],
.article-body form select,
.article-body form textarea {
  width: 100%;
  font-family: inherit;
  font-size: 0.95em;
  padding: 0.6em 0.8em;
  border: 1px solid #d5d5d5;
  border-radius: 5px;
  background: #ffffff;
  color: #222222;
  margin-bottom: 1em;
}

.article-body form input[type="text"]:focus,
.article-body form input[type="email"]:focus,
.article-body form input[type="password"]:focus,
.article-body form select:focus,
.article-body form textarea:focus {
  outline: none;
  border-color: #ff7a00;
  box-shadow: 0 0 0 3px rgba(255,122,0,0.15);
}

.article-body form textarea {
  resize: vertical;
}

.article-body form input[type="checkbox"],
.article-body form input[type="radio"] {
  margin-right: 0.5em;
  vertical-align: middle;
}

.article-body form input[type="submit"] {
  width: auto;
}

/* ==========================================================================
   Address
   ========================================================================== */

.article-body address {
  font-style: normal;
  line-height: 1.6;
  color: #444444;
  margin: 1.5em 0;
}

/* ==========================================================================
   Links
   ========================================================================== */

.article-body a {
  color: #ff7a00;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  transition: color 0.15s ease;
}

.article-body a:hover {
  color: #d96700;
}

.article-body a:visited {
  color: #c25f00;
}

/* Long URLs / long words must wrap, never break layout */
.article-body a,
.article-body p {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ==========================================================================
   Emoji
   ========================================================================== */

.article-body .emoji,
.article-body img.emoji {
  height: 1em;
  width: 1em;
  margin: 0 0.05em 0 0.1em;
  vertical-align: -0.1em;
  display: inline-block;
}
