/*
 * lochsgroup.com.au - page-specific bits on top of lochstudios-info styles.
 * Light theme tokens for shared marketing vars live in site.css
 * (:root[data-theme="light"]). Overrides below fix chrome that hardcodes
 * dark surfaces (info-header gradient, contact-card wash).
 */

.group-tag {
  display: inline-block;
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--cyan-2, #5ec8ff);
  opacity: .85;
  margin-bottom: 8px;
}

.eco-card .name {
  margin-top: 0;
}

.eco-foot .learn {
  text-decoration: none;
  color: inherit;
  opacity: .85;
}

.eco-foot a.learn:hover {
  opacity: 1;
  color: var(--cyan-2, #5ec8ff);
}

.info-footer-note {
  margin: 6px 0 0;
  font-size: 12px;
  opacity: .55;
}

.info-footer-copy {
  margin: 18px 0 0;
  font-size: 11px;
  opacity: .4;
}

/* site.css uses --ink as page background and --paper as text; the shared
 * pill prefers --ink for emphasis. Map hover/active labels to --paper so
 * the control stays legible on both themes. */
.info-nav-ctas .ls-theme-pill:hover,
.info-nav-ctas .ls-theme-pill[data-theme-state="light"],
.info-nav-ctas .ls-theme-pill[data-theme-state="dark"] {
  color: var(--paper);
}
html[data-theme="light"] .info-nav-ctas .ls-theme-pill:hover {
  color: var(--paper);
}

/* ----- Light theme chrome (data-theme from theme-init / theme-toggle) --- */
html[data-theme="light"] {
  color-scheme: light;
}

html[data-theme="light"] .info-header {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(244, 246, 249, 0.9));
  border-bottom-color: var(--line);
}

html[data-theme="light"] .contact-card {
  background: linear-gradient(135deg, rgba(15, 141, 194, 0.08), rgba(15, 141, 194, 0.02));
}

html[data-theme="light"] body::before {
  background:
    radial-gradient(1200px 800px at 80% -10%, rgba(15, 141, 194, 0.08), transparent 60%),
    radial-gradient(900px 700px at -10% 110%, rgba(26, 164, 223, 0.05), transparent 60%);
}

html[data-theme="light"] body::after {
  background-image:
    repeating-linear-gradient(0deg, rgba(10, 14, 20, 0.02) 0 1px, transparent 1px 3px);
  mix-blend-mode: normal;
  opacity: 0.55;
}
