/* ==========================================================================
   DIG Marketing - sitewide design system
   --------------------------------------------------------------------------
   The homepage design (assets/css/dig-home.css) was scoped to body.home-dig,
   so no other route could see it. This file is the promoted, sitewide version:
   the same tokens and the same component treatment, now unscoped so every
   page, every blog post and every nested route renders on-brand.

   Load order (see includes/header.php):
     1. assets/css/style.css        legacy base layer
     2. assets/css/<page>.css      page layer (dig-home / priya-pages / blog)
     3. assets/css/dig-theme.css    this file - wins on ties

   Two kinds of rule live here:
     - token promotion: the DIG palette in :root, plus a remap of the legacy
       token names so the untouched rules in style.css re-skin themselves.
     - component rules: the homepage chrome (header, hero, buttons, cards,
       footer) lifted out of body.home-dig and applied to every route.

   NOTE on radii: --radius / --radius-sm / --radius-lg are deliberately NOT
   remapped. The locked checkout stylesheet (assets/smm-checkout/checkout.css)
   bridges those three names straight into its own --ck-* tokens, so changing
   them would silently restyle the payment modal. Page surfaces use the new
   --dig-radius scale instead.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens
   -------------------------------------------------------------------------- */

:root {
  /* --- DIG palette (lifted from body.home-dig in dig-home.css) --- */
  --dig-ink: #102b23;
  --dig-forest: #12372a;
  --dig-dark: #09271e;
  --dig-leaf: #c8f36a;
  --dig-paper: #f5f3e9;
  --dig-paper-2: #eeece1;
  --dig-line: rgba(16, 43, 35, .16);
  --dig-muted: #66736a;
  --dig-accent: #698446;
  --dig-accent-2: #547b24;
  --dig-glow: rgba(200, 243, 106, .14);
  --dig-radius: 4px;
  --dig-radius-sm: 4px;

  /* --- legacy tokens remapped onto the DIG palette --- */
  --orange: #12372a;
  --orange-2: #1e513b;
  --orange-soft: #e7ebdc;
  --orange-line: #c7d6ae;
  --ink: #102b23;
  --ink-2: #33473c;
  --muted: #66736a;
  --muted-2: #8a958c;
  --line: rgba(16, 43, 35, .14);
  --line-2: rgba(16, 43, 35, .28);
  --panel: #eeece1;
  --white: #f8f7ef;

  --success: #0f8c63;
  --success-soft: #e9faf4;
  --success-ink: #0b6b4b;
  --danger: #b3261e;
  --danger-soft: #fdeceb;

  /* Restrained, green-tinted elevation - the homepage cards carry a hairline
     border instead of a resting shadow and only lift on hover. */
  --shadow: 0 16px 34px rgba(16, 43, 35, .10);
  --shadow-hover: 0 24px 52px rgba(16, 43, 35, .16);
  --shadow-soft: 0 2px 10px rgba(16, 43, 35, .04);

  --max: 1240px;
  --nav-h: 76px;
}

/* The alias block in style.css resolves against these, so the remap above
   carries through: --accent, --primary, --bg, --text, --border and friends
   all follow automatically. Only values pinned to a literal inside a rule
   need an explicit rule further down this file. */

/* --------------------------------------------------------------------------
   2. Base layer
   -------------------------------------------------------------------------- */

html { scroll-padding-top: calc(var(--nav-h) + 16px); }

body {
  background: var(--dig-paper);
  color: var(--dig-ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.container { width: min(var(--max), calc(100% - 64px)); }

h1, h2, h3, h4 { letter-spacing: -.045em; line-height: 1.05; }

/* The serif-italic accent is part of the brandkit, not decoration: it travels
   with every heading scope that the new design uses. */
h1 em, h2 em, h3 em,
.section-title em, .section-head h2 em,
.priya-page-hero h1 em, .priya-guide-hero h1 em,
.blog-hero h1 em, .blog-post-hero h1 em,
.page-hero h1 em, .prose h2 em {
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -.075em;
  color: var(--dig-accent);
}

:focus-visible { outline-color: var(--dig-forest); }

.orange { color: var(--orange); }

.skip-link { background: var(--dig-forest); color: #fff; }
.skip-link:focus { background: var(--dig-forest); color: #fff; }

/* --------------------------------------------------------------------------
   3. Header and navigation
   -------------------------------------------------------------------------- */

.site-header {
  position: sticky;
  top: 0;
  z-index: 200;
  background: rgba(245, 243, 233, .94);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(16, 43, 35, .10);
}

.nav-inner { min-height: var(--nav-h); height: var(--nav-h); }

.logo { gap: 11px; color: var(--dig-ink); }

.logo-mark {
  width: 38px;
  height: 38px;
  background: var(--dig-forest);
  color: var(--dig-leaf);
  border-radius: 50%;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: -.08em;
  box-shadow: none;
}

.logo-word { font-size: 17px; font-weight: 800; letter-spacing: -.055em; color: var(--dig-ink); }

.nav-links { font-weight: 650; }

.nav-links > li > a,
.nav-trigger { color: #385247; }

.nav-links > li > a:hover,
.nav-trigger:hover { color: var(--dig-accent-2); }

.nav-links > li > a.active { color: var(--dig-ink); }

.nav-badge { color: var(--dig-accent); }

.nav-drop.open .nav-trigger { color: var(--dig-accent-2); }

.nav-cta .btn,
.nav-drawer-cta .btn {
  background: var(--dig-forest);
  color: #fff;
  border-radius: 999px;
  padding: 12px 19px;
  font-size: 12px;
  font-weight: 750;
  box-shadow: none;
}

.nav-cta .btn:hover,
.nav-drawer-cta .btn:hover { background: #1e513b; transform: translateY(-1px); }

/* Services mega panel - reachable on click, so it has to sit in the same
   palette as everything else. */
.mega-inner {
  background: #fbfaf3;
  border: 1px solid var(--dig-line);
  border-radius: var(--dig-radius);
  box-shadow: 0 30px 80px rgba(16, 43, 35, .16);
}

.rail-item.active { background: var(--dig-forest); color: #fff; }
.rail-item.active .rail-count { background: rgba(200, 243, 106, .2); color: var(--dig-leaf); border-color: transparent; }
.rail-icon { background: var(--orange-soft); color: var(--dig-forest); }
.pane-list a:hover { background: var(--orange-soft); color: var(--dig-forest); }
.pane-all { color: var(--dig-forest) !important; }

@media (max-width: 960px) {
  .nav { background: var(--dig-paper); border-left-color: var(--dig-line); }
  .nav-links > li > a:hover { background: var(--panel); }
}

/* --------------------------------------------------------------------------
   4. Buttons, pills, chips
   -------------------------------------------------------------------------- */

.btn {
  border-radius: 999px;
  font-weight: 750;
  font-size: 13px;
  letter-spacing: -.01em;
  gap: 12px;
  transition: transform .25s, background .25s, color .25s, border-color .25s;
}

.btn-primary {
  background: var(--dig-forest);
  color: #fff;
  box-shadow: none;
}

.btn-primary:hover {
  background: #1e513b;
  box-shadow: none;
  transform: translateY(-2px);
}

.btn-ghost {
  background: transparent;
  color: var(--dig-ink);
  border: 1px solid var(--line-2);
}

.btn-ghost:hover { border-color: var(--dig-ink); background: rgba(16, 43, 35, .04); }

.btn-dark { background: var(--dig-dark); color: #fff; }
.btn-dark:hover { transform: translateY(-2px); }

.btn-ico { background: rgba(255, 255, 255, .18); }
.btn-ghost .btn-ico { background: rgba(16, 43, 35, .08); }

.pill, .badge {
  background: var(--orange-soft);
  color: var(--dig-forest);
  border: 1px solid var(--orange-line);
  letter-spacing: .09em;
}

.chip { background: #fbfaf3; border-color: var(--dig-line); }
.chip.is-active { background: var(--dig-forest); color: #fff; border-color: var(--dig-forest); }

/* --------------------------------------------------------------------------
   5. Section rhythm and headings
   -------------------------------------------------------------------------- */

.section { padding: 104px 0; }
.section.alt, .section-alt { background: var(--panel); }

.section-head { margin-bottom: 34px; }
.section-title, .section-head h2 {
  font-size: clamp(34px, 4.4vw, 56px);
  font-weight: 650;
  letter-spacing: -.062em;
  line-height: 1;
}
.section-title em, .section-head h2 em { color: var(--dig-accent); }
.section-copy, .section-head p { color: var(--dig-muted); line-height: 1.7; }

.package-header h2 { font-weight: 650; letter-spacing: -.05em; }

/* The legacy .eyebrow carried two definitions; the later one turned it into
   a lime pill. Reset the pill and restore the homepage treatment. */
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0;
  border-radius: 0;
  background: none;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--dig-accent);
}
.eyebrow::before {
  width: 20px;
  height: 1px;
  background: currentColor;
  border-radius: 0;
}

/* --------------------------------------------------------------------------
   6. Page heroes - the homepage's dark forest band, on every route
   -------------------------------------------------------------------------- */

.page-hero,
.priya-page-hero,
.priya-guide-hero,
.blog-hero,
.blog-post-hero {
  position: relative;
  overflow: hidden;
  background: var(--dig-forest);
  color: #f7f5e9;
  border-bottom: 0;
  padding: clamp(56px, 7.4vw, 100px) 0 clamp(48px, 6vw, 82px);
}

.page-hero::before,
.priya-page-hero::before,
.priya-guide-hero::before,
.blog-hero::before,
.blog-post-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .12;
  background-image:
    linear-gradient(rgba(231, 244, 208, .15) 1px, transparent 1px),
    linear-gradient(90deg, rgba(231, 244, 208, .15) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to right, transparent, black 48%, black);
  pointer-events: none;
}

.page-hero > .container,
.priya-page-hero > .container,
.priya-guide-hero > .container,
.blog-hero > .container,
.blog-post-hero > .container { position: relative; z-index: 1; }

.page-hero h1,
.blog-hero h1,
.blog-post-hero h1 {
  max-width: 17ch;
  font-size: clamp(40px, 5.4vw, 74px);
  font-weight: 650;
  line-height: .98;
  letter-spacing: -.062em;
  color: #f7f5e9;
  margin: 14px 0 16px;
}
.page-hero h1 em, .blog-hero h1 em, .blog-post-hero h1 em { color: var(--dig-leaf); }

.page-hero .lead,
.blog-hero p,
.blog-post-hero .blog-post-sub {
  max-width: 620px;
  color: #d2dbd2;
  font-size: 16px;
  line-height: 1.7;
}

.page-hero .eyebrow,
.blog-hero .eyebrow { color: var(--dig-leaf); }
.page-hero .eyebrow::before,
.blog-hero .eyebrow::before { background: var(--dig-leaf); }

.page-hero .h1-variant { color: #a9bcae; }

.page-hero .breadcrumb,
.blog-post-hero .breadcrumb { color: #a9bcae; }
.page-hero .breadcrumb a,
.blog-post-hero .breadcrumb a { color: #d2dbd2; }
.page-hero .breadcrumb a:hover,
.blog-post-hero .breadcrumb a:hover { color: var(--dig-leaf); }

.page-hero .btn-primary,
.blog-hero .btn-primary {
  background: var(--dig-leaf);
  color: var(--dig-dark);
}
.page-hero .btn-primary:hover,
.blog-hero .btn-primary:hover { background: #d9ff8e; }
.page-hero .btn-ghost,
.blog-hero .btn-ghost {
  background: transparent;
  color: #f2f5e9;
  border-color: rgba(255, 255, 255, .32);
}
.page-hero .btn-ghost:hover,
.blog-hero .btn-ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .08); }

.priya-page-hero h1,
.priya-guide-hero h1 {
  max-width: 15ch;
  font-size: clamp(40px, 5.2vw, 72px);
  font-weight: 650;
  line-height: .98;
  letter-spacing: -.06em;
  color: #f7f5e9;
}
.priya-page-kicker { color: var(--dig-leaf); }
.priya-page-hero p, .priya-guide-hero p { color: #d2dbd2; }
.priya-page-actions .btn-primary { background: var(--dig-leaf); color: var(--dig-dark); }
.priya-page-actions .btn-primary:hover { background: #d9ff8e; }
.priya-page-actions .btn-ghost { background: transparent; color: #f2f5e9; border-color: rgba(255, 255, 255, .32); }
.priya-page-actions .btn-ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .08); }

.priya-guide-hero { padding: clamp(84px, 11vw, 152px) 0 clamp(56px, 7vw, 92px); }
.priya-guide-hero h1 { max-width: 18ch; }
.priya-guide-cta h2 { color: #f6f4e9; font-weight: 650; letter-spacing: -.05em; }
.priya-guide-cta p { color: #c6d0c5; }

/* --------------------------------------------------------------------------
   7. Cards and surfaces - hairline borders, sharp corners, quiet elevation
   -------------------------------------------------------------------------- */

.service-card,
.pkg-card,
.cat-tile,
.blog-card,
.catalog-card,
.form-panel,
.step,
.notice,
.service-sidebar,
.priya-editorial-grid article,
.priya-capability-grid article,
.priya-guide-grid article {
  background: #f8f7ef;
  border: 1px solid rgba(16, 43, 35, .12);
  border-radius: var(--dig-radius);
  box-shadow: none;
}

.service-card:hover,
.pkg-card:hover,
.cat-tile:hover,
.blog-card:hover,
.step:hover {
  transform: translateY(-5px);
  border-color: #9bbd68;
  box-shadow: 0 15px 30px rgba(16, 43, 35, .08);
}

.service-card .icon,
.cat-icon,
.trust-icon,
.social-icon {
  background: var(--orange-soft);
  color: var(--dig-forest);
  border-radius: 50%;
}

.service-card .from { color: var(--dig-forest); }
.service-card:hover .arrow { background: var(--dig-forest); color: #fff; border-color: var(--dig-forest); }
.cat-tile:hover .cat-go { background: var(--dig-forest); border-color: var(--dig-forest); color: #fff; }

.pkg-card { border-width: 1px; }
.pkg-card.is-popular { border-color: var(--dig-forest); }
.pkg-card.is-popular .pkg-mark { color: var(--dig-forest); }
.pkg-badge { border-color: var(--dig-forest); color: var(--dig-forest); }
.pkg-badge.is-best { background: var(--dig-forest); color: #fff; }
.pkg-card.is-popular .pkg-btn { border-color: var(--dig-forest); color: var(--dig-forest); }
.pkg-card.is-popular .pkg-btn:hover { background: var(--dig-forest); color: #fff; }

.blog-card .blog-card-cta { color: var(--dig-forest); }

.trust-strip { background: #f8f7ef; border-color: var(--dig-line); }

.notice { background: #f1efe4; }
.notice-warn { background: #fbf3e3; border-color: #e3d6ae; }
.notice a { color: var(--dig-forest); }

.featured-service { background: var(--dig-forest); border-color: transparent; }
.featured-service .eyebrow { color: var(--dig-leaf); }
.featured-service .eyebrow::before { background: var(--dig-leaf); }
.featured-price strong { color: #f7f5e9; }
.featured-price small { color: #b3c4b6; }

.step .n { background: var(--dig-forest); color: var(--dig-leaf); border-radius: 50%; }

.faq-list { border-color: var(--dig-line); }
.faq-list details { border-color: var(--dig-line); }
.faq-list summary::after { color: var(--dig-accent-2); }

.market-icon { background: var(--orange-soft); color: var(--dig-forest); }
.micro-tag { background: var(--orange-soft); color: var(--dig-forest); }
.micro-tag.hot { background: var(--orange-soft); color: var(--dig-forest); }
.service-row:hover .row-go { background: var(--dig-forest); }
.category-btn.active { background: var(--orange-soft); color: var(--dig-forest); }
.category-btn.active em { background: #f8f7ef; color: var(--dig-forest); }

.platform-head svg { color: var(--dig-forest); }
.service-row-price { color: var(--dig-forest); }
.success-ref { color: var(--dig-forest); }

.search-wrap, .service-search input { border-radius: var(--dig-radius-sm); }
.service-search input, .sort-wrap select { background: #fbfaf3; border-color: var(--dig-line); }
.count-line { color: var(--dig-muted); }
.service-toolbar strong { color: var(--dig-ink); }

/* --------------------------------------------------------------------------
   8. Forms
   -------------------------------------------------------------------------- */

.form-row input, .form-row select, .form-row textarea, .field input {
  background: #fbfaf3;
  border: 1px solid var(--dig-line);
  border-radius: var(--dig-radius-sm);
  color: var(--dig-ink);
}

.form-row input:focus, .form-row select:focus, .form-row textarea:focus, .field input:focus {
  border-color: var(--dig-forest);
  box-shadow: 0 0 0 3px rgba(18, 55, 42, .10);
}

.service-search input:focus {
  border-color: var(--dig-forest);
  background: #fbfaf3;
  box-shadow: 0 0 0 3px rgba(18, 55, 42, .10);
}

.form-hint { color: var(--dig-muted); }
.form-error { background: var(--danger-soft); border-color: #f2d5d2; color: var(--danger); }
.alert-success { background: var(--success-soft); color: var(--success-ink); }
.alert-error { background: var(--danger-soft); color: var(--danger); }

.prose h2 { color: var(--dig-ink); font-weight: 650; letter-spacing: -.04em; }
.prose p, .prose li { color: var(--dig-muted); }
.prose a { color: var(--dig-forest); text-decoration: underline; text-underline-offset: 3px; }

/* --------------------------------------------------------------------------
   9. Closing CTA and footer
   -------------------------------------------------------------------------- */

.cta {
  background: var(--dig-forest);
  color: #f4f3e8;
  border-radius: var(--dig-radius);
  padding: 48px;
}
.cta::after { background: var(--dig-glow); }
.cta h2 { color: #f4f3e8; font-weight: 650; letter-spacing: -.055em; }
.cta h2 em { color: var(--dig-leaf); }
.cta p { color: #c6d0c5; }
.cta .eyebrow { color: var(--dig-leaf); }
.cta .eyebrow::before { background: var(--dig-leaf); }
.cta .btn-primary { background: var(--dig-leaf); color: var(--dig-dark); }
.cta .btn-primary:hover { background: #d9ff8e; }

.site-footer {
  background: var(--dig-dark);
  color: #e4ece1;
  border-top: 0;
  padding: 60px 0 28px;
}
.site-footer .logo-word { color: #f4f3e8; }
.site-footer .logo-mark { background: var(--dig-leaf); color: var(--dig-dark); }
.site-footer .footer-brand p { max-width: 290px; color: #afc0b2; font-size: 11px; line-height: 1.75; }
.site-footer .footer-col a { color: #becbbf; }
.site-footer .footer-col a:hover { color: var(--dig-leaf); }
.site-footer .footer-col a.footer-all { color: var(--dig-leaf); }
.site-footer .footer-col h4, .site-footer h4 { color: #f2f3e8; }
.site-footer .footer-bottom { border-color: rgba(255, 255, 255, .12); color: #9daf9f; }
.site-footer .footer-legal a { color: #bdc9bf; }
.site-footer .footer-legal a:hover { color: var(--dig-leaf); }
.site-footer .footer-pay span {
  background: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .14);
  color: #dce8dc;
}
.site-footer .form-hint { color: #9daf9f; }
.site-footer .field input {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .18);
  color: #eef2e7;
}
.site-footer .field input::placeholder { color: #9daf9f; }
.site-footer .btn-primary { background: var(--dig-leaf); color: var(--dig-dark); }
.site-footer .btn-primary:hover { background: #d9ff8e; }

/* --------------------------------------------------------------------------
   10. Free-trial and share components
   --------------------------------------------------------------------------
   These rules used to live in assets/css/priya-pages.css, but free.php never
   loaded that stylesheet, so the share bar, the bonus card and the free
   console rendered unstyled. They now live in the sitewide layer, where every
   route can reach them.
   -------------------------------------------------------------------------- */

.free-share-section { padding: 18px 0 8px; }

.share-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 9px;
  padding: 14px 16px;
  border: 1px solid var(--dig-line);
  border-radius: var(--dig-radius);
  background: #f8f7ef;
}

.share-label { color: var(--dig-ink); font-weight: 850; }
.share-star, .share-explain sup { color: var(--dig-forest); font-weight: 900; }

.share-btn {
  min-height: 38px;
  padding: 8px 14px;
  border: 1px solid var(--dig-ink);
  border-radius: 999px;
  background: #f8f7ef;
  color: var(--dig-ink);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}
.share-btn:hover, .share-btn:focus-visible { background: var(--dig-forest); color: #fff; }
.share-btn.wa { border-color: #128c7e; color: #0f6f63; }
.share-btn.wa:hover, .share-btn.wa:focus-visible { background: #128c7e; color: #fff; }
.share-btn.tg { border-color: #208bc3; color: #1a6fa0; }
.share-btn.tg:hover, .share-btn.tg:focus-visible { background: #208bc3; color: #fff; }

.share-explain { margin: 8px auto 0; max-width: 70ch; color: var(--dig-muted); text-align: center; font-size: 12px; line-height: 1.5; }
.share-explain a { color: var(--dig-forest); font-weight: 800; text-underline-offset: 3px; }

.free-bonus-section { padding-top: 28px; }

.free-bonus-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, .9fr);
  gap: 28px;
  align-items: center;
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid rgba(16, 43, 35, .12);
  border-radius: var(--dig-radius);
  background: #f8f7ef;
}

.free-bonus-card h2 {
  max-width: 12ch;
  margin: 10px 0 0;
  color: var(--dig-ink);
  font-size: clamp(30px, 4vw, 48px);
  font-weight: 650;
  line-height: .98;
  letter-spacing: -.05em;
}
.free-bonus-card > div:first-child > p { max-width: 55ch; margin: 16px 0 0; color: var(--dig-muted); line-height: 1.6; }
.free-bonus-flow { display: grid; gap: 12px; }

.bonus-step {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 2px 10px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--dig-forest);
  border-radius: var(--dig-radius);
  background: var(--dig-forest);
  color: #fff;
  text-align: left;
  cursor: pointer;
}
.bonus-step span {
  grid-row: span 2;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--dig-leaf);
  color: var(--dig-dark);
  font-weight: 900;
}
.bonus-step small { color: #b6c8b9; }
.bonus-step.is-done { border-color: var(--success); background: var(--success); }
.bonus-step.is-done span { background: #fff; color: var(--success-ink); }
.bonus-form { display: grid; gap: 7px; }
.bonus-form label { color: var(--dig-ink); font-size: 12px; font-weight: 800; }
.bonus-input-row { display: flex; gap: 8px; }
.bonus-input-row input { min-width: 0; flex: 1; }
.bonus-form .form-hint { margin: 2px 0 0; }

.free-hero-console {
  display: grid;
  gap: 16px;
  padding: clamp(22px, 3vw, 30px);
  border: 1px solid rgba(16, 43, 35, .14);
  border-radius: var(--dig-radius);
  background: #f8f7ef;
  color: var(--dig-ink);
}
.free-console-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.free-console-head .eyebrow { color: var(--dig-accent); }
.free-console-head .console-title { margin-top: 4px; font-size: clamp(24px, 3vw, 34px); font-weight: 650; letter-spacing: -.045em; }
.free-console-live {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--success-soft);
  color: var(--success-ink);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}
.free-console-tabs { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 2px; }
.free-console-tab {
  flex: 0 0 auto;
  padding: 8px 11px;
  border: 1px solid var(--dig-line);
  border-radius: 999px;
  background: #fbfaf3;
  color: var(--ink-2);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.free-console-tab.is-active, .free-console-tab:hover { border-color: var(--dig-forest); background: var(--dig-forest); color: #fff; }
.free-console-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--dig-line);
  border-radius: var(--dig-radius);
  background: #fbfaf3;
}
.free-console-panel[hidden] { display: none; }
.free-offer-mark { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--dig-forest); color: var(--dig-leaf); }
.free-offer-mark svg { width: 20px; height: 20px; }
.free-offer-kicker { color: var(--dig-accent); font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.free-console-panel h3 { margin: 4px 0 0; color: var(--dig-ink); font-size: 18px; line-height: 1.1; }
.free-console-panel p { margin: 5px 0 0; color: var(--dig-muted); font-size: 12px; line-height: 1.4; }
.free-console-panel .btn { white-space: nowrap; }
.free-console-note, .free-console-empty { margin: 0; color: var(--dig-muted); font-size: 11px; line-height: 1.4; }
.free-console-empty a { color: var(--dig-forest); font-weight: 800; }

/* --------------------------------------------------------------------------
   11. Payment ticket (order.php) - retinted into the DIG palette
   -------------------------------------------------------------------------- */

.dig-pay-panel, .dig-pay-modal {
  --dig-paper: #f5f3e9;
  --dig-clay: #1e513b;
  --dig-soil: #102b23;
  --dig-line: rgba(16, 43, 35, .18);
  --dig-ink: #102b23;
}

/* --------------------------------------------------------------------------
   11. Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 760px) {
  .container { width: min(100% - 36px, 600px); }
  .nav-inner { min-height: 66px; height: 66px; }
  .logo-word { font-size: 15px; }
  .section { padding: 76px 0; }
  .page-hero h1, .blog-hero h1, .blog-post-hero h1 { font-size: clamp(34px, 8.6vw, 50px); }
  .priya-page-hero h1, .priya-guide-hero h1 { font-size: clamp(34px, 8.4vw, 50px); }
  .section-title, .section-head h2 { font-size: clamp(30px, 7.6vw, 44px); }
}

@media (max-width: 700px) {
  .free-bonus-card { grid-template-columns: 1fr; }
  .free-console-panel { grid-template-columns: auto minmax(0, 1fr); }
  .free-console-panel .btn { grid-column: 2; justify-self: start; }
}

@media (max-width: 640px) {
  .container { width: min(100% - 36px, var(--max)); }
  .section { padding: 62px 0; }
  .cta { padding: 30px; border-radius: var(--dig-radius); }
  .free-console-head { display: grid; }
  .free-console-live { justify-self: start; }
  .free-console-panel { grid-template-columns: 1fr; }
  .free-console-panel .btn { grid-column: auto; width: 100%; }
  .bonus-input-row { display: grid; }
  .bonus-input-row .btn { width: 100%; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

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