/*
 * OneClickPDF — 2026 brand layer
 * One visual language across marketing, tool, pricing, legal and account pages.
 * Loaded after legacy styles so the existing product logic remains untouched.
 */

:root {
  --ocp-paper: var(--surface-2);
  --ocp-paper-2: var(--surface-2);
  --ocp-white: var(--surface);
  --ocp-ink: var(--ink);
  --ocp-ink-2: var(--ink);
  --ocp-muted: var(--ink-muted);
  --ocp-line: var(--line);
  --ocp-line-strong: #bdc8ba;
  --ocp-accent: #b8ff42;
  --ocp-accent-strong: #8fd91c;
  --ocp-green: #16a85f;
  --ocp-green-dark: #08743d;
  --ocp-mint: #d7ffe1;
  --ocp-blue: #3157ff;
  --ocp-red: #ed4742;
  --ocp-radius-sm: 8px;
  --ocp-radius: 14px;
  --ocp-radius-lg: 24px;
  --ocp-shadow-sm: 0 8px 28px rgba(16, 19, 15, 0.06);
  --ocp-shadow: 0 22px 60px rgba(16, 19, 15, 0.1);
  --ocp-shadow-accent: 0 18px 45px rgba(132, 205, 22, 0.2);
  --blue: var(--accent-deep);
  --blue-dark: var(--accent-deep-hover);
  --blue-light: var(--ocp-accent);
  --blue-mid: var(--ocp-mint);
  --slate-50: var(--ocp-paper);
  --slate-100: var(--ocp-paper-2);
  --slate-200: var(--ocp-line);
  --slate-500: var(--ocp-muted);
  --slate-700: var(--ocp-ink-2);
  --slate-900: var(--ocp-ink);
}

html {
  scroll-behavior: smooth;
}

body,
body.home-page,
body.premium-tool-page {
  background: var(--ocp-paper) !important;
  color: var(--ocp-ink) !important;
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  text-rendering: optimizeLegibility;
}

body::selection {
  background: var(--ocp-accent);
  color: var(--ocp-ink);
}

a,
button,
input,
textarea,
select {
  font: inherit;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(22, 168, 95, 0.28) !important;
  outline-offset: 3px;
}

/* ---------- Unified navigation ---------- */

.navbar.navbar-v2,
.premium-tool-page .navbar-v2,
.legal-page .navbar-v2 {
  position: sticky !important;
  top: 0;
  z-index: 1000;
  min-height: 72px !important;
  background: rgba(247, 248, 244, 0.92) !important;
  border-bottom: 1px solid var(--ocp-line) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px) saturate(130%);
}

.navbar-inner,
.premium-tool-page .navbar-inner {
  width: min(100% - 40px, 1180px) !important;
  min-height: 72px !important;
  margin-inline: auto !important;
  padding: 0 !important;
}

.navbar-logo,
.premium-tool-page .navbar-logo,
.navbar-logo-text,
.premium-tool-page .navbar-logo-text {
  color: var(--ocp-ink) !important;
}

.navbar-logo {
  gap: 11px !important;
}

.navbar-logo svg,
.footer-logo svg,
.premium-tool-page .navbar-logo svg,
.premium-tool-page .footer-logo svg {
  width: 36px !important;
  height: 36px !important;
  border-radius: 9px;
  box-shadow: 0 5px 14px rgba(107, 164, 13, 0.16);
}

.navbar-logo svg rect:first-child,
.footer-logo svg rect:first-child,
.premium-tool-page .navbar-logo svg rect:first-child,
.premium-tool-page .footer-logo svg rect:first-child {
  fill: var(--ocp-accent) !important;
}

.navbar-logo svg rect:nth-of-type(5),
.footer-logo svg rect:nth-of-type(5) {
  fill: var(--ocp-ink) !important;
}

.navbar-logo-text {
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.035em !important;
}

.nav-links {
  gap: 30px !important;
}

.nav-link,
.premium-tool-page .nav-link {
  position: relative;
  color: #4e584f !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
}

.nav-link::after {
  position: absolute;
  right: 0;
  bottom: -8px;
  left: 0;
  height: 2px;
  content: "";
  background: var(--ocp-green);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 180ms ease;
}

.nav-link:hover::after,
.nav-link:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left;
}

.nav-link:hover,
.premium-tool-page .nav-link:hover {
  color: var(--ocp-ink) !important;
}

.lang-drop-btn,
.premium-tool-page .lang-drop-btn {
  min-height: 40px !important;
  padding: 0 13px !important;
  color: var(--ocp-ink) !important;
  background: var(--ocp-white) !important;
  border: 1px solid var(--ocp-line) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

.lang-drop-list {
  padding: 8px !important;
  background: var(--ocp-white) !important;
  border: 1px solid var(--ocp-line) !important;
  border-radius: 12px !important;
  box-shadow: var(--ocp-shadow) !important;
}

.lang-drop-list button {
  color: var(--ocp-ink) !important;
  border-radius: 8px !important;
}

.lang-drop-list button:hover {
  background: var(--ocp-paper-2) !important;
}

.nav-cta,
.ocp-auth-btn,
.ocp-login-btn {
  min-height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  color: var(--ocp-ink) !important;
  background: var(--ocp-accent) !important;
  border: 1px solid var(--ocp-accent-strong) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  transition: transform 180ms ease, box-shadow 180ms ease !important;
}

.nav-cta:hover,
.ocp-auth-btn:hover,
.ocp-login-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--ocp-shadow-accent) !important;
}

/* ---------- Home hero ---------- */

.home-page .hero {
  min-height: 660px !important;
  padding: clamp(76px, 8vw, 118px) 24px 120px !important;
  overflow: hidden;
  color: var(--ocp-ink) !important;
  background:
    radial-gradient(circle at 80% 24%, rgba(184, 255, 66, 0.28), transparent 27%),
    radial-gradient(circle at 9% 74%, rgba(22, 168, 95, 0.1), transparent 24%),
    linear-gradient(180deg, #fbfcf8 0%, var(--ocp-paper) 100%) !important;
  border-bottom: 1px solid var(--ocp-line);
}

.home-page .aurora-orb,
.home-page .aurora-beam {
  display: none !important;
}

.home-page .premium-hero-inner {
  width: min(100%, 1180px) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 0.9fr) minmax(430px, 1.1fr) !important;
  align-items: center !important;
  gap: clamp(52px, 7vw, 104px) !important;
  margin-inline: auto !important;
  padding: 0 !important;
}

.home-page .hero-copy {
  position: relative;
  z-index: 2;
  max-width: 620px !important;
}

.home-page .hero-kicker {
  width: fit-content;
  margin: 0 0 24px !important;
  padding: 0 !important;
  color: var(--ocp-green-dark) !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase;
}

.home-page .hero-title,
.home-page .hero .hero-title {
  max-width: 680px !important;
  margin: 0 !important;
  color: #fff !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: clamp(3.6rem, 6.7vw, 6.45rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.065em !important;
  line-height: 0.92 !important;
  text-align: left !important;
  text-shadow: none !important;
}

.home-page .hero-title-gradient,
.home-page .hero .hero-title-gradient {
  color: transparent !important;
  background: linear-gradient(92deg, var(--accent) 0%, var(--success) 92%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

.home-page .hero-sub {
  max-width: 590px !important;
  margin: 30px 0 0 !important;
  color: var(--ocp-muted) !important;
  font-size: clamp(1.05rem, 1.5vw, 1.28rem) !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

.hero-cta-row-v2 {
  justify-content: flex-start !important;
  gap: 12px !important;
  margin-top: 34px !important;
}

.btn-hero-primary,
.pricing-card-cta--primary,
.premium-tool-page .btn-blue,
.premium-tool-page .btn-green {
  color: var(--ocp-ink) !important;
  background: var(--ocp-accent) !important;
  border: 1px solid var(--ocp-accent-strong) !important;
  border-radius: 10px !important;
  box-shadow: var(--ocp-shadow-accent) !important;
  font-weight: 750 !important;
  animation: none !important;
}

.btn-hero-primary:hover,
.pricing-card-cta--primary:hover:not(:disabled),
.premium-tool-page .btn-blue:hover,
.premium-tool-page .btn-green:hover {
  color: var(--ocp-ink) !important;
  background: #c6ff66 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 20px 48px rgba(132, 205, 22, 0.27) !important;
}

.btn-hero-secondary {
  color: var(--ocp-ink) !important;
  background: transparent !important;
  border: 1px solid var(--ocp-line-strong) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

.btn-hero-secondary:hover {
  background: #ffffff !important;
  border-color: #10130f !important;
  transform: translateY(-2px);
}

.home-page .hero-trust-line {
  justify-content: flex-start !important;
  gap: 12px 22px !important;
  margin-top: 24px !important;
  color: var(--ocp-muted) !important;
}

.home-page .hero-trust-line li {
  color: var(--ocp-muted) !important;
  font-size: 0.79rem !important;
}

.home-page .hero-trust-line li::before {
  color: var(--ocp-green) !important;
}

.home-page .hero-upload-preview {
  position: relative;
  min-height: 420px !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  padding: 44px !important;
  color: var(--ocp-ink) !important;
  background:
    linear-gradient(var(--ocp-white), var(--ocp-white)) padding-box,
    linear-gradient(135deg, var(--ocp-line), rgba(22, 168, 95, 0.42)) border-box !important;
  border: 1px solid transparent !important;
  border-radius: var(--ocp-radius-lg) !important;
  box-shadow: var(--ocp-shadow) !important;
  backdrop-filter: none !important;
}

.home-page .hero-upload-preview::before {
  position: absolute;
  top: 14px;
  right: 14px;
  left: 14px;
  height: 4px;
  content: "";
  background: linear-gradient(90deg, var(--accent-deep), var(--accent), transparent);
  border-radius: 99px;
}

.home-page .hero-upload-icon {
  color: var(--ocp-green) !important;
  background: var(--ocp-mint) !important;
  border: 1px solid rgba(22, 168, 95, 0.24) !important;
}

.home-page .hero-upload-preview h2 {
  color: var(--ocp-ink) !important;
  font-size: 1.35rem !important;
}

.home-page .hero-upload-preview p,
.home-page .hero-upload-preview > span {
  color: var(--ocp-muted) !important;
}

.format-more {
  color: var(--ocp-ink) !important;
  background: var(--ocp-paper-2) !important;
}

/* ---------- Conversion cards ---------- */

.cards-section {
  background: var(--ocp-paper) !important;
}

.home-page .cards-section {
  padding: 0 24px 72px !important;
}

.home-page .cards-grid {
  width: min(100%, 900px) !important;
  gap: 18px !important;
  margin-top: -70px !important;
}

.card,
.premium-tool-page .card {
  overflow: hidden;
  background: var(--ocp-white) !important;
  border: 1px solid var(--ocp-line) !important;
  border-radius: var(--ocp-radius) !important;
  box-shadow: var(--ocp-shadow-sm) !important;
}

.home-page .card {
  padding: 26px !important;
}

.card:hover,
.premium-tool-page .card:hover {
  border-color: var(--ocp-line-strong) !important;
  box-shadow: var(--ocp-shadow) !important;
  transform: translateY(-3px) !important;
}

.card::before,
.premium-tool-page .card::before {
  background: linear-gradient(90deg, var(--accent-deep), var(--accent)) !important;
}

.card-header h2,
.premium-tool-page .card-header h2 {
  color: var(--ocp-ink) !important;
}

.card-icon-wrap {
  color: var(--ocp-green) !important;
  background: var(--ocp-mint) !important;
}

.html-textarea {
  color: #e7eee8 !important;
  background: #10130f !important;
  border: 1px solid #2e3930 !important;
  border-radius: 10px !important;
}

.drop-zone,
.merge-file-list {
  color: var(--ocp-ink) !important;
  background: var(--surface-2) !important;
  border: 1.5px dashed var(--ocp-line-strong) !important;
  border-radius: 10px !important;
}

.drop-zone:hover,
.drop-zone.dragover {
  background: var(--accent-soft) !important;
  border-color: var(--accent-deep) !important;
}

.btn.btn-blue,
.btn.btn-green {
  color: var(--ocp-ink) !important;
  background: var(--ocp-accent) !important;
  border: 1px solid var(--ocp-accent-strong) !important;
  box-shadow: none !important;
}

.micro-steps-bar {
  background: var(--ocp-white) !important;
  border-color: var(--ocp-line) !important;
}

.micro-step-num {
  color: var(--ocp-ink) !important;
  background: var(--ocp-accent) !important;
}

/* ---------- Marketing sections ---------- */

.tools-section,
.faq-exposed-section,
.content-section,
.faq-section {
  background: var(--ocp-paper) !important;
}

.tools-inner,
.trust-section-inner,
.faq-exposed-inner {
  width: min(100% - 40px, 1180px) !important;
  margin-inline: auto !important;
}

.tools-section,
.trust-section,
.faq-exposed-section {
  padding-block: clamp(86px, 9vw, 132px) !important;
}

.section-eyebrow {
  color: var(--ocp-green-dark) !important;
  letter-spacing: 0.18em !important;
}

.section-heading,
.tools-title {
  color: var(--ocp-ink) !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  letter-spacing: -0.045em !important;
}

.tools-subtitle,
.section-subhead {
  color: var(--ocp-muted) !important;
}

.tool-filter {
  color: var(--ocp-muted) !important;
  background: transparent !important;
  border: 1px solid var(--ocp-line) !important;
}

.tool-filter.is-active {
  color: var(--ocp-ink) !important;
  background: var(--ocp-accent) !important;
  border-color: var(--ocp-accent-strong) !important;
}

.premium-tool-card,
.tool-chip,
.faq-exposed-item,
.trust-block,
.feature-block {
  background: var(--ocp-white) !important;
  border: 1px solid var(--ocp-line) !important;
  border-radius: var(--ocp-radius) !important;
  box-shadow: none !important;
}

.premium-tool-card:hover,
.tool-chip:hover,
.faq-exposed-item:hover,
.trust-block:hover,
.feature-block:hover {
  border-color: rgba(22, 168, 95, 0.48) !important;
  box-shadow: var(--ocp-shadow-sm) !important;
  transform: translateY(-3px) !important;
}

.premium-tool-card span,
.tool-chip span,
.faq-exposed-q,
.trust-block-title {
  color: var(--ocp-ink) !important;
}

.premium-tool-card small,
.tool-chip small,
.faq-exposed-a,
.trust-block-desc {
  color: var(--ocp-muted) !important;
}

.trust-section {
  color: #f6faf4 !important;
  background: #10130f !important;
}

.trust-section .section-eyebrow {
  color: var(--ocp-accent) !important;
}

.trust-section .section-heading {
  color: #f6faf4 !important;
}

.trust-section .trust-block {
  background: var(--surface-2) !important;
  border-color: rgba(255,255,255,0.10) !important;
}

.trust-section .trust-block-title {
  color: #fff !important;
}

.trust-section .trust-block-desc {
  color: var(--ink-muted) !important;
}

.trust-block-icon {
  color: var(--success) !important;
  background: rgba(114, 230, 193, 0.12) !important;
}

.premium-stats {
  color: #fff !important;
  background: var(--accent-deep) !important;
  border: 0 !important;
}

.premium-stats .fstat {
  border-color: rgba(16, 19, 15, 0.18) !important;
}

.premium-stats strong {
  color: var(--ocp-ink) !important;
}

.premium-stats span {
  color: #46513d !important;
}

.cta-final {
  min-height: 560px !important;
  display: grid;
  place-items: center;
  color: #f8fbf5 !important;
  background:
    radial-gradient(circle at 82% 60%, rgba(184, 255, 66, 0.22), transparent 30%),
    linear-gradient(135deg, #10130f 0%, #171d17 100%) !important;
}

.cta-final-heading {
  color: #f8fbf5 !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  letter-spacing: -0.05em !important;
}

.cta-final-sub,
.cta-final-fud {
  color: #aeb9ae !important;
}

/* ---------- Tool pages ---------- */

.premium-tool-page .hero-tool {
  min-height: 430px !important;
  padding: 92px 24px 118px !important;
  overflow: hidden;
  color: var(--ocp-ink) !important;
  background:
    radial-gradient(circle at 18% 20%, rgba(184, 255, 66, 0.25), transparent 24%),
    radial-gradient(circle at 88% 70%, rgba(22, 168, 95, 0.09), transparent 28%),
    var(--ocp-paper) !important;
  border-bottom: 1px solid var(--ocp-line) !important;
}

.premium-tool-page .hero-tool::before,
.premium-tool-page .hero-tool::after {
  display: none !important;
}

.premium-tool-page .hero-tool .hero-inner {
  width: min(100%, 940px) !important;
  margin-inline: auto !important;
  text-align: center !important;
}

.premium-tool-page .hero-tool .hero-title {
  max-width: 900px !important;
  margin-inline: auto !important;
  color: #fff !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: clamp(3rem, 7vw, 5.7rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.06em !important;
  line-height: 0.96 !important;
  text-shadow: none !important;
}

.premium-tool-page .hero-tool .hero-title-gradient {
  color: transparent !important;
  background: linear-gradient(92deg, var(--accent) 0%, var(--success) 92%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

.premium-tool-page .hero-tool .hero-sub {
  max-width: 680px !important;
  margin: 24px auto 0 !important;
  color: var(--ocp-muted) !important;
  font-size: 1.08rem !important;
  line-height: 1.65 !important;
}

.premium-tool-page .hero-tool .hero-fud {
  width: fit-content;
  margin: 24px auto 0 !important;
  padding: 9px 14px !important;
  color: var(--ocp-green-dark) !important;
  background: var(--ocp-mint) !important;
  border: 1px solid rgba(22, 168, 95, 0.22) !important;
  border-radius: 999px !important;
}

.premium-tool-page .cards-section {
  padding: 0 24px 84px !important;
  background: var(--ocp-paper) !important;
}

.premium-tool-page .cards-grid {
  margin-top: -70px !important;
}

.premium-tool-page .card {
  color: var(--ocp-ink) !important;
}

.premium-tool-page .content-section,
.premium-tool-page .faq-section,
.premium-tool-page .tools-section {
  padding-block: 84px !important;
  color: var(--ocp-ink) !important;
  background: var(--ocp-paper) !important;
}

.premium-tool-page .content-cols > div,
.premium-tool-page .faq-item,
.premium-tool-page .tool-chip {
  background: var(--ocp-white) !important;
  border-color: var(--ocp-line) !important;
}

.premium-tool-page .content-inner h2,
.premium-tool-page .content-inner h3,
.premium-tool-page .faq-question {
  color: var(--ocp-ink) !important;
}

.premium-tool-page .content-inner p,
.premium-tool-page .content-inner li,
.premium-tool-page .faq-answer {
  color: var(--ocp-muted) !important;
}

/* ---------- Pricing ---------- */

body:has(.pricing-main) {
  background: var(--ocp-paper) !important;
}

body:has(.pricing-main) > .hero {
  min-height: 480px !important;
  padding: 82px 24px 118px !important;
  color: var(--ocp-ink) !important;
  background:
    radial-gradient(circle at 73% 26%, rgba(184, 255, 66, 0.28), transparent 27%),
    var(--ocp-paper) !important;
  border-bottom: 1px solid var(--ocp-line) !important;
}

body:has(.pricing-main) > .hero .aurora-orb,
body:has(.pricing-main) > .hero .aurora-beam {
  display: none !important;
}

body:has(.pricing-main) > .hero .hero-inner {
  width: min(100%, 900px) !important;
  margin-inline: auto !important;
  text-align: center;
}

body:has(.pricing-main) > .hero .hero-title {
  margin-top: 28px !important;
  color: #fff !important;
  font-family: "Poppins", "Inter", sans-serif !important;
  font-size: clamp(3rem, 6.5vw, 5.6rem) !important;
  letter-spacing: -0.06em !important;
  line-height: 0.98 !important;
  text-shadow: none !important;
}

body:has(.pricing-main) > .hero .hero-title-gradient {
  color: transparent !important;
  background: linear-gradient(92deg, var(--accent) 0%, var(--success) 92%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.pricing-back,
.pricing-hero-sub {
  color: #b8c1d7 !important;
}

.hero-trust-pill {
  color: var(--ocp-green-dark) !important;
  background: var(--ocp-mint) !important;
  border: 1px solid rgba(22, 168, 95, 0.2) !important;
}

.pricing-main {
  background: var(--ocp-paper) !important;
}

.login-nudge {
  color: var(--ocp-ink) !important;
  background: var(--ocp-white) !important;
  border: 1px solid var(--ocp-line) !important;
  border-radius: 12px !important;
  box-shadow: var(--ocp-shadow-sm) !important;
}

.login-nudge button {
  color: #fff !important;
  background: var(--accent-deep) !important;
  border: 1px solid var(--accent-deep) !important;
  border-radius: 9px !important;
}

.pricing-trust-item {
  color: var(--ocp-muted) !important;
}

.pricing-card {
  color: var(--ocp-ink) !important;
  background: var(--ocp-white) !important;
  border: 1px solid var(--ocp-line) !important;
  border-radius: var(--ocp-radius) !important;
  box-shadow: var(--ocp-shadow-sm) !important;
}

.pricing-card:hover {
  border-color: var(--ocp-line-strong) !important;
  box-shadow: var(--ocp-shadow) !important;
  transform: translateY(-3px);
}

.pricing-card--pro {
  border: 2px solid #10130f !important;
  box-shadow: 12px 12px 0 var(--ocp-accent) !important;
}

.pricing-card-badge {
  color: var(--ocp-ink) !important;
  background: var(--ocp-accent) !important;
  border: 1px solid var(--ocp-accent-strong) !important;
}

.pricing-card-name,
.pricing-card-price,
.pricing-value-title,
.pricing-faq-q {
  color: var(--ocp-ink) !important;
}

.pricing-card-period,
.pricing-card-desc,
.pricing-value-desc,
.pricing-faq-a {
  color: var(--ocp-muted) !important;
}

.pricing-card-cta--ghost,
.pricing-card-cta--outline-blue {
  color: var(--ocp-ink) !important;
  background: transparent !important;
  border-color: var(--ocp-line-strong) !important;
}

.pricing-card-cta--primary:disabled {
  color: #6d756d !important;
  background: var(--ocp-paper-2) !important;
  border-color: var(--ocp-line) !important;
  box-shadow: none !important;
}

.pricing-fud-strip,
.pricing-value-grid,
.pricing-faq-grid {
  border-color: var(--ocp-line) !important;
}

.pricing-value-item,
.pricing-faq-item {
  background: var(--ocp-white) !important;
  border: 1px solid var(--ocp-line) !important;
  border-radius: var(--ocp-radius) !important;
}

/* ---------- Dashboard ---------- */

body:has(.dashboard-shell) {
  min-height: 100vh;
  color: var(--ocp-ink) !important;
  background:
    radial-gradient(circle at 80% 0%, rgba(184, 255, 66, 0.2), transparent 28%),
    var(--ocp-paper) !important;
}

body:has(.dashboard-shell) .dash-orb {
  display: none !important;
}

.dashboard-shell {
  width: min(100% - 40px, 1180px) !important;
}

.dash-nav {
  min-height: 76px !important;
  background: transparent !important;
  border-bottom: 1px solid var(--ocp-line) !important;
}

.dash-nav .brand,
.dash-nav .brand span {
  color: var(--ocp-ink) !important;
}

.dash-nav .brand-mark {
  color: var(--ocp-ink) !important;
  background: var(--ocp-accent) !important;
  border-color: var(--ocp-accent-strong) !important;
}

.dash-hero {
  color: var(--ocp-ink) !important;
  background: transparent !important;
}

.dash-hero h1,
.dash-hero .gradient-text {
  color: var(--ocp-ink) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
}

.dash-hero .eyebrow {
  color: var(--ocp-green-dark) !important;
}

.dash-hero .hero-sub {
  color: var(--ocp-muted) !important;
}

.hero-card,
.panel,
.quick-tool {
  color: var(--ocp-ink) !important;
  background: var(--ocp-white) !important;
  border: 1px solid var(--ocp-line) !important;
  box-shadow: var(--ocp-shadow-sm) !important;
}

.panel-dark {
  color: #f8fbf5 !important;
  background: #10130f !important;
  border-color: #303a31 !important;
}

.panel-dark .panel-title {
  color: #f8fbf5 !important;
}

.panel-dark .panel-sub {
  color: #aeb8ae !important;
}

.dashboard-shell .btn-primary,
.dashboard-shell .meter-fill {
  color: #fff !important;
  background: var(--accent-deep) !important;
  border-color: var(--accent-deep) !important;
}

.dashboard-shell .btn-secondary,
.dashboard-shell .btn-ghost {
  color: var(--ocp-ink) !important;
  background: var(--ocp-white) !important;
  border-color: var(--ocp-line) !important;
}

/* ---------- Legal, FAQ and footer ---------- */

.legal-page,
body.legal-page {
  color: var(--ocp-ink) !important;
  background: var(--ocp-paper) !important;
}

.legal-card,
.legal-content {
  background: var(--ocp-white) !important;
  border-color: var(--ocp-line) !important;
  box-shadow: var(--ocp-shadow-sm) !important;
}

.site-footer-v2,
.premium-tool-page .site-footer-v2 {
  position: relative;
  color: #aab4aa !important;
  background: #10130f !important;
  border-top: 0 !important;
}

.site-footer-v2::before,
.premium-tool-page .site-footer-v2::before {
  height: 4px !important;
  background: linear-gradient(90deg, var(--accent), var(--accent-deep), transparent) !important;
}

.footer-grid,
.footer-bottom,
.premium-tool-page .footer-grid,
.premium-tool-page .footer-bottom {
  width: min(100% - 40px, 1180px) !important;
}

.footer-logo-text,
.footer-col-title {
  color: #f8fbf5 !important;
}

.footer-links-list a,
.footer-tagline,
.footer-byline,
.footer-contact-text,
.premium-tool-page .footer-links-list a,
.premium-tool-page .footer-tagline,
.premium-tool-page .footer-byline,
.premium-tool-page .footer-contact-text {
  color: #9eaa9f !important;
}

.footer-links-list a:hover,
.footer-email:hover,
.footer-byline a:hover {
  color: var(--ocp-accent) !important;
}

#gdpr-banner {
  color: #e8eee8 !important;
  background: rgba(16, 19, 15, 0.96) !important;
  border-top: 1px solid #323b32 !important;
  backdrop-filter: blur(16px);
}

.gdpr-btn {
  border-radius: 8px !important;
}

/* ---------- Responsive ---------- */

@media (max-width: 980px) {
  .home-page .premium-hero-inner {
    grid-template-columns: 1fr !important;
  }

  .home-page .hero-copy {
    max-width: 760px !important;
  }

  .home-page .hero-upload-preview {
    width: 100%;
  }
}

@media (max-width: 760px) {
  .navbar-inner,
  .premium-tool-page .navbar-inner {
    width: min(100% - 28px, 1180px) !important;
  }

  .nav-links {
    display: none !important;
  }

  .nav-cta {
    display: none !important;
  }

  .home-page .hero {
    min-height: auto !important;
    padding: 64px 20px 102px !important;
  }

  .home-page .hero-title,
  .home-page .hero .hero-title {
    font-size: clamp(3.15rem, 15vw, 5.1rem) !important;
  }

  .home-page .hero-upload-preview {
    min-height: 340px !important;
    padding: 34px 22px !important;
  }

  .home-page .cards-grid,
  .premium-tool-page .cards-grid {
    margin-top: -48px !important;
  }

  .premium-tool-page .hero-tool {
    min-height: 360px !important;
    padding: 70px 20px 92px !important;
  }

  .premium-tool-page .hero-tool .hero-title {
    font-size: clamp(2.8rem, 13vw, 4.4rem) !important;
  }

  .pricing-card--pro {
    box-shadow: 8px 8px 0 var(--ocp-accent) !important;
  }

  body:has(.pricing-main) > .hero {
    padding: 64px 20px 88px !important;
  }

  .tools-inner,
  .trust-section-inner,
  .faq-exposed-inner,
  .footer-grid,
  .footer-bottom {
    width: min(100% - 28px, 1180px) !important;
  }
}

@media (max-width: 480px) {
  .navbar-logo-text {
    font-size: 0.92rem !important;
  }

  .navbar-logo svg {
    width: 32px !important;
    height: 32px !important;
  }

  .lang-drop-btn {
    padding-inline: 10px !important;
  }

  .hero-cta-row-v2 {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  .btn-hero-primary,
  .btn-hero-secondary {
    width: 100% !important;
    justify-content: center !important;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}