/* ==========================================================================
   VisualAds front — landing / legal / blog pages  (public/theme/front/css/v3-pages.css)
   --------------------------------------------------------------------------
   Loaded after v3.css, only by: front/pages/partials/landing.blade.php (the five
   SEO pages), front/about, front/privacy, front/blog, front/blog_view.
   Uses the v3 tokens only; logical properties throughout (RTL-safe).
   ========================================================================== */

/* ---- page head additions ------------------------------------------------ */
.v3-crumb ol { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 8px; font: 500 13px/1.4 var(--v3-font-body); color: var(--v3-d-muted); }
.v3-crumb li + li::before { content: '/'; margin-inline-end: 8px; color: var(--v3-d-ghost); }
.v3-crumb a { color: var(--v3-d-text); text-decoration: none; }
.v3-crumb a:hover { color: #F6F5F1; text-decoration: underline; }
.v3-lp-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.v3-lp-head .v3-page-head__panel .v3-t-blg { max-width: 60ch; }
@media (max-width: 991.98px) {
  /* v3.css hides the page-head ledger below 992 (contact repeats it in an aside); landing pages show it under the text */
  .v3-lp-head .v3-page-head__panel > .v3-ledger { display: grid; margin-top: 32px; }
}
@media (max-width: 575.98px) {
  .v3-lp-cta > .v3-btn { flex: 1 1 100%; justify-content: center; }
  .v3-lp-head .v3-t-dlg { font-size: 34px; }
}

/* ---- sections ----------------------------------------------------------- */
.v3-lp-sec { padding: 80px 0; }
.v3-lp-sec--alt { background: var(--v3-surface-2); border-block: 1px solid var(--v3-line); }
@media (max-width: 991.98px) { .v3-lp-sec { padding: 64px 0; } }
@media (max-width: 575.98px) { .v3-lp-sec { padding: 48px 0; } }
.v3-lp-sec .v3-sec-head--left { max-width: 72ch; margin-bottom: 24px; }

/* prose */
.v3-lp-prose { max-width: 72ch; }
.v3-lp-prose p, .v3-lp-after { font: 400 17px/1.7 var(--v3-font-body); color: var(--v3-ink-2); margin: 0 0 16px; }
.v3-lp-after { margin-top: 24px; }
.v3-lp-prose a, .v3-lp-after a, .v3-legal a { color: var(--v3-gold-ink); text-decoration: underline; text-underline-offset: 3px; }
.v3-lp-prose a:hover, .v3-lp-after a:hover, .v3-legal a:hover { color: var(--v3-ink); }
.v3-lp-points { list-style: none; margin: 8px 0 16px; padding: 0; display: grid; gap: 12px; }
.v3-lp-points li { display: grid; grid-template-columns: 18px 1fr; gap: 12px; align-items: start; font: 400 16px/1.6 var(--v3-font-body); color: var(--v3-ink-2); }
.v3-lp-points .v3-i { margin-top: 3px; color: var(--v3-gold-ink); }

/* cards */
.v3-lp-cards .v3-tile--card { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.v3-lp-cards .v3-t-hsm { margin: 8px 0 0; color: var(--v3-ink); }
.v3-lp-cards .v3-tile__body { margin: 0; color: var(--v3-muted); }

/* rows (ledger with icon / text / chip) */
.v3-lp-rows { background: var(--v3-surface); }
.v3-lp-rows .v3-t-hsm { margin: 0; color: var(--v3-ink); }
.v3-lp-rows .v3-t-bsm { margin: 4px 0 0; color: var(--v3-muted); }
@media (max-width: 575.98px) {
  .v3-lp-rows .v3-ledger__row { grid-template-columns: 40px 1fr; }
  .v3-lp-rows .v3-ledger__v { grid-column: 2; justify-self: start; margin-top: 8px; }
}

/* steps with 3 or 4 items */
@media (min-width: 1200px) {
  .v3-steps--4 { grid-template-columns: repeat(4, 1fr); }
  .v3-steps--3 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1199.98px) {
  .v3-steps--4 > li:last-child { grid-column: auto; }
}

/* comparison table (stacks into cards below 768) */
.v3-lp-table { border: 1px solid var(--v3-line); border-radius: var(--v3-r-lg); overflow: hidden; background: var(--v3-surface); box-shadow: var(--v3-sh-sm); }
.v3-lp-table table { width: 100%; border-collapse: collapse; font: 400 15px/1.55 var(--v3-font-body); color: var(--v3-ink-2); }
.v3-lp-table th, .v3-lp-table td { padding: 16px 20px; text-align: start; vertical-align: top; border-top: 1px solid var(--v3-line); }
.v3-lp-table thead th { border-top: 0; font: 700 13px/1.3 var(--v3-font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--v3-muted); background: var(--v3-surface-2); }
.v3-lp-table tbody th { width: 18%; font-weight: 600; color: var(--v3-ink); }
.v3-lp-table .is-us { background: rgba(251,188,4,.07); }
.v3-lp-table thead .is-us { color: var(--v3-gold-ink); }
.v3-lp-note { margin: 16px 0 0; color: var(--v3-faint); }
@media (max-width: 767.98px) {
  .v3-lp-table { border: 0; background: none; box-shadow: none; overflow: visible; }
  .v3-lp-table thead { display: none; }
  .v3-lp-table table, .v3-lp-table tbody, .v3-lp-table tr, .v3-lp-table th, .v3-lp-table td { display: block; width: 100%; }
  .v3-lp-table tr { margin-bottom: 12px; border: 1px solid var(--v3-line); border-radius: var(--v3-r-lg); overflow: hidden; background: var(--v3-surface); }
  .v3-lp-table tbody th { width: 100%; border-top: 0; background: var(--v3-surface-2); padding: 12px 16px; }
  .v3-lp-table td { padding: 12px 16px; }
  .v3-lp-table td::before { content: attr(data-label); display: block; margin-bottom: 4px; font: 700 12px/1.3 var(--v3-font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--v3-muted); }
  .v3-lp-table td.is-us::before { color: var(--v3-gold-ink); }
}

/* two columns of bullet cards */
.v3-lp-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.v3-lp-duo .v3-card { padding: 32px; }
.v3-lp-duo .v3-t-hsm { margin: 0 0 16px; color: var(--v3-ink); }
@media (max-width: 767.98px) { .v3-lp-duo { grid-template-columns: 1fr; gap: 16px; } .v3-lp-duo .v3-card { padding: 24px; } }

/* chip cloud (partner names) */
.v3-lp-chips { list-style: none; margin: 0 auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; max-width: 900px; }
.v3-lp-chips .v3-chip { font-size: 15px; padding: 10px 16px; }

/* FAQ without tabs */
.v3-lp-faq .v3-faq__head { margin-bottom: 32px; }

/* related guides */
.v3-lp-related__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.v3-lp-guide { display: flex; flex-direction: column; gap: 8px; padding: 24px; text-decoration: none; color: inherit; }
.v3-lp-guide .v3-t-hsm { margin: 0; color: var(--v3-ink); }
.v3-lp-guide .v3-t-bsm { margin: 0; color: var(--v3-muted); flex: 1; }
.v3-lp-guide:hover { border-color: var(--v3-line-gold); }
.v3-lp-guide:focus-visible { outline: 2px solid var(--v3-focus); outline-offset: 2px; }
@media (max-width: 1199.98px) { .v3-lp-related__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .v3-lp-related__grid { grid-template-columns: 1fr; gap: 12px; } }

/* ---- about -------------------------------------------------------------- */
.v3-about__grid { display: grid; grid-template-columns: 7fr 5fr; gap: 48px; align-items: start; }
.v3-about__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.v3-about__stats .v3-tile--card { padding: 24px; }
.v3-about__offices { display: grid; grid-template-columns: 7fr 5fr; gap: 40px; align-items: center; padding: 56px 64px; }
.v3-about__offices .v3-t-dmd { color: #F6F5F1; margin: 0 0 16px; }
.v3-about__offices p { color: var(--v3-d-text); margin: 0 0 20px; }
.v3-about__offices .v3-offices { list-style: none; margin: 0; padding: 0; }
@media (max-width: 991.98px) {
  .v3-about__grid, .v3-about__offices { grid-template-columns: 1fr; gap: 32px; }
  .v3-about__offices { padding: 40px 32px; }
}
@media (max-width: 575.98px) { .v3-about__offices { padding: 32px 20px; } .v3-about__stats { gap: 12px; } }

/* ---- legal (privacy) ---------------------------------------------------- */
.v3-legal { max-width: 80ch; }
.v3-legal h2 { font: 700 22px/1.3 var(--v3-font-display); color: var(--v3-ink); margin: 48px 0 16px; scroll-margin-top: 96px; }
.v3-legal h2:first-of-type { margin-top: 0; }
.v3-legal p, .v3-legal li { font: 400 16px/1.7 var(--v3-font-body); color: var(--v3-ink-2); }
.v3-legal p { margin: 0 0 14px; }
.v3-legal ul { list-style: none; margin: 0 0 16px; padding-inline-start: 20px; }
.v3-legal li { margin-bottom: 6px; }
.v3-legal code { font-size: .92em; background: var(--v3-surface-2); border: 1px solid var(--v3-line); border-radius: var(--v3-r-2xs); padding: 1px 5px; color: var(--v3-ink); }
.v3-legal a { overflow-wrap: anywhere; }
.v3-legal__grid { display: grid; grid-template-columns: 260px 1fr; gap: 56px; align-items: start; }
.v3-toc { position: sticky; top: 104px; }
.v3-toc ol { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 8px; }
.v3-toc a { font: 500 14px/1.4 var(--v3-font-body); color: var(--v3-muted); text-decoration: none; }
.v3-toc a:hover { color: var(--v3-ink); text-decoration: underline; }
@media (max-width: 991.98px) { .v3-legal__grid { grid-template-columns: 1fr; gap: 32px; } .v3-toc { position: static; } }

/* ---- blog --------------------------------------------------------------- */
.v3-blog__group + .v3-blog__group { margin-top: 56px; }
.v3-blog__group > h2 { margin: 0 0 24px; }
.v3-blog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.v3-post { display: flex; flex-direction: column; overflow: hidden; padding: 0; }
.v3-post img { width: 100%; height: auto; aspect-ratio: 598 / 247; object-fit: cover; display: block; }
.v3-post__body { padding: 20px 24px 24px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.v3-post__body h3 { margin: 0; }
.v3-post__body h3 a { color: var(--v3-ink); text-decoration: none; }
.v3-post__body h3 a:hover { text-decoration: underline; }
.v3-post__body p { margin: 0; color: var(--v3-muted); flex: 1; }
.v3-post time, .v3-article time { color: var(--v3-faint); }
.v3-article { max-width: 760px; margin: 0 auto; }
.v3-article img.v3-article__cover { width: 100%; height: auto; border-radius: var(--v3-r-lg); margin-bottom: 24px; }
.v3-article__body { font: 400 17px/1.7 var(--v3-font-body); color: var(--v3-ink-2); }
.v3-article__body img { max-width: 100%; height: auto; }
@media (max-width: 991.98px) { .v3-blog__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .v3-blog__grid { grid-template-columns: 1fr; } }

/* step meta chip: v3.css gives it padding-top:16px inside a fixed 24px chip height — keep the gap as margin instead */
.v3-lp-sec .v3-step > .v3-t-bsm + .v3-step__meta { padding-top: 0; margin-top: auto; }
.v3-lp-sec .v3-step > .v3-t-bsm { margin-bottom: 16px; }
.v3-lp-guide .v3-btn--link { align-self: flex-start; padding-inline: 0; }
.v3-about__stats .v3-tile--card { min-height: 0; gap: 8px; }
.v3-about__stats .v3-tile--card p { margin: 0; }
.v3-lp-cards .v3-tile--card { min-height: 0; }
.v3-post__body .v3-btn--link { align-self: flex-start; padding-inline: 0; }
.v3-lp-cards .v3-tile__ic, .v3-lp-cards .v3-tile__ic + * { margin-top: 0; } .v3-lp-cards .v3-tile__ic { margin-bottom: 4px; }

/* ---- polish v1.1 (2026-09-28, brief 60) --------------------------------- */
/* blog: when every group holds a single post, the groups sit side by side instead of four
   one-card rows with an empty two-thirds of the page */
@media (min-width: 576px) {
  .v3-lp-sec .v3-wrap:has(> .v3-blog__group):not(:has(.v3-blog__grid > :nth-child(2))) {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 48px 24px; align-items: start;
  }
  .v3-lp-sec .v3-wrap:has(> .v3-blog__group):not(:has(.v3-blog__grid > :nth-child(2))) .v3-blog__group + .v3-blog__group { margin-top: 0; }
  .v3-lp-sec .v3-wrap:has(> .v3-blog__group):not(:has(.v3-blog__grid > :nth-child(2))) .v3-blog__grid { grid-template-columns: 1fr; }
}
@media (min-width: 992px) {
  .v3-lp-sec .v3-wrap:has(> .v3-blog__group):not(:has(.v3-blog__grid > :nth-child(2))) { grid-template-columns: repeat(4, 1fr); }
}
.v3-blog__group > h2 { word-spacing: .06em; }
.v3-post .v3-t-cap { font-variant-numeric: tabular-nums; }
/* uppercase table heads / mobile labels: calmer tracking */
.v3-lp-table thead th, .v3-lp-table td::before { letter-spacing: .05em; font-weight: 600; }