/* Anti-generic editorial surface. One amber. No rainbow worlds, no pill kit.
   The three hero app frames stay; everything else should read like a printed note. */

html {
  --page: #0c0b09;
  --ink: #ece6da;
  --mute: #9a9286;
  --line: rgba(236, 230, 218, .14);
  --amber: #c8862b;
}

body {
  background: var(--page);
  color: var(--ink);
}

body::before {
  position: fixed;
  inset: 0;
  z-index: 80;
  pointer-events: none;
  opacity: .055;
  background-image: radial-gradient(rgba(255, 255, 255, .55) .55px, transparent .7px);
  background-size: 3px 3px;
  content: "";
}

.site-header {
  border-bottom: 1px solid var(--line);
  background: rgba(12, 11, 9, .78);
}

.wordmark,
.wordmark span,
.footer-wordmark {
  color: var(--ink);
}

.desktop-nav a,
.quiet-action,
.footer-column a {
  color: var(--mute);
}

.desktop-nav a[aria-current="page"],
.desktop-nav a.is-active {
  color: var(--ink);
}

/* Dark field so the three real app frames stay the only spectacle. */
.hero.hero-pep {
  min-height: 100svh;
  background: #0c0b09;
}

.hero.hero-pep .hero-stage {
  opacity: .55;
}

.hero.hero-pep .hero-content h1 {
  max-width: 11ch;
  color: var(--ink);
  font-size: clamp(3.8rem, 7.4vw, 7.1rem);
}

.hero.hero-pep .hero-content h1 em {
  color: #e2b56a;
  font-style: italic;
}

.hero.hero-pep .hero-copy {
  max-width: 32rem;
  color: var(--mute);
  font-size: .95rem;
}

.hero.hero-pep .hero-actions .button-text:first-child,
.hero.hero-pep .hero-actions .button-text:last-child {
  min-height: 0;
  padding: 0 0 .2rem;
  border: 0;
  border-bottom: 1px solid currentColor;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--ink);
  font-weight: 600;
}

.hero.hero-pep .hero-actions .button-text:first-child {
  color: #e2b56a;
  border-bottom-color: #e2b56a;
}

.hero.hero-pep .hero-actions .button-text:first-child:hover,
.hero.hero-pep .hero-actions .button-text:last-child:hover {
  transform: none;
  box-shadow: none;
}

.hero-roles {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: min(100%, 28rem);
  border-top: 1px solid var(--line);
}

.hero-roles li {
  border-bottom: 1px solid var(--line);
}

.hero-roles a {
  display: flex;
  align-items: baseline;
  gap: 1.1rem;
  min-height: 0;
  padding: .65rem 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  backdrop-filter: none;
}

.hero-roles a:hover,
.hero-roles a:focus-visible {
  transform: none;
  border-color: transparent;
}

.hero-roles strong {
  font-family: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink);
}

.hero-roles li:nth-child(1) strong,
.hero-roles li:nth-child(2) strong,
.hero-roles li:nth-child(3) strong {
  color: var(--ink);
}

.hero-roles span {
  color: var(--mute);
  font-size: .78rem;
}

.hero-stack {
  width: min(100%, 46rem);
  height: clamp(22rem, 48vw, 34rem);
}

.hero-stack__shot {
  border: 1px solid rgba(236, 230, 218, .22);
  border-radius: .28rem;
  box-shadow: 0 1.8rem 3.2rem rgba(0, 0, 0, .5);
}

/* Comparison: a contents page, not three product tiles */
.comparison-section {
  background: #0c0b09 !important;
  box-shadow: none !important;
  border-block: 0 !important;
  border-top: 1px solid var(--line) !important;
}

.comparison-heading h2,
.comparison-heading h2 em {
  color: var(--ink);
}

.comparison-heading h2 em {
  color: #e2b56a;
}

.comparison-heading > p {
  color: var(--mute);
}

.app-feature-grid {
  gap: 0;
  border-top: 1px solid var(--line);
}

.app-feature-card {
  padding: 1.6rem 1.1rem 1.4rem !important;
  border: 0 !important;
  border-right: 1px solid var(--line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  color: var(--ink);
}

.app-feature-card:last-child {
  border-right: 0 !important;
}

.app-feature-card:hover {
  transform: none;
  box-shadow: none;
}

.app-feature-selra,
.app-feature-luce,
.app-feature-incisa {
  background: transparent !important;
}

.app-feature-kicker,
.app-feature-selra .app-feature-kicker,
.app-feature-luce .app-feature-kicker,
.app-feature-incisa .app-feature-kicker,
.app-feature-card li > span {
  color: var(--mute) !important;
}

.app-feature-card h3 {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
}

.app-feature-card header p,
.app-feature-card li small,
.app-feature-selra li strong,
.app-feature-luce li strong,
.app-feature-incisa li strong {
  color: var(--mute) !important;
}

.app-feature-card li strong {
  color: var(--ink) !important;
  font-weight: 600;
}

.app-feature-card > a {
  color: #e2b56a !important;
  border-top-color: var(--line);
}

.app-feature-card > a:hover {
  background: none;
}

/* Workflow: the photograph is the color */
.workflow-section {
  background: #0c0b09 !important;
  box-shadow: none !important;
}

.feature-cull,
.feature-edit,
.feature-deliver {
  background: transparent;
}

.title-selra,
.title-luce,
.title-incisa {
  color: #e2b56a;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: .72rem;
  font-family: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
}

.feature-copy h3 {
  color: var(--ink);
}

.feature-copy > p {
  color: var(--mute);
}

.feature-link {
  border: 1px solid rgba(232, 181, 106, .55);
  border-radius: 0;
  background: transparent;
  color: #e2b56a;
  font-weight: 650;
}

.feature-link:hover {
  background: transparent;
  color: #f2d49b;
}

.quality-section,
.suite-cta-section {
  background: #0c0b09 !important;
  box-shadow: none !important;
}

.quality-intro h2,
.quality-card h3,
.suite-cta-intro h2,
.suite-cta-intro h2 em,
.suite-cta-product strong {
  color: var(--ink);
}

.quality-intro p,
.quality-card p,
.suite-cta-intro > p,
.suite-cta-product small {
  color: var(--mute);
}

.quality-card,
.suite-cta-product,
.suite-cta-selra,
.suite-cta-luce,
.suite-cta-incisa {
  border-color: var(--line);
  border-radius: 0;
  background: transparent;
}

.landing-footer,
.system-requirements {
  background: #0c0b09;
  color: var(--mute);
}

/* Product pages: same room, one accent, the screenshot does the work */
body:has(.product-screen-selra),
body:has(.product-screen-luce),
body:has(.product-screen-incisa) {
  background: #0c0b09;
}

.product-hero .hero-copy h1,
.product-hero .hero-copy h1 em,
body:has(.product-screen-selra) .product-hero .hero-copy h1 em,
body:has(.product-screen-luce) .product-hero .hero-copy h1 em,
body:has(.product-screen-incisa) .product-hero .hero-copy h1 em {
  color: var(--ink);
}

body:has(.product-screen-selra) .clarity-kicker,
body:has(.product-screen-luce) .clarity-kicker,
body:has(.product-screen-incisa) .clarity-kicker,
body:has(.product-screen-selra) .hero-kicker,
body:has(.product-screen-luce) .hero-kicker,
body:has(.product-screen-incisa) .hero-kicker,
.clarity-kicker,
.hero-kicker {
  color: #e2b56a;
}

.hero-license {
  border: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

.button-primary,
.button-outline {
  border-radius: 0;
  box-shadow: none;
}

.button-primary {
  background: #c8862b;
  color: #161006;
}

.button-outline {
  border-color: var(--line);
  color: var(--ink);
}

.can-do-section {
  padding: 0;
  border-radius: 0;
  background: transparent;
}

.can-do-header h2 {
  color: var(--ink);
}

.can-do-grid {
  gap: 0;
  border-top: 1px solid var(--line);
  background: transparent;
}

.can-do-card {
  min-height: 0;
  padding: 1.1rem 1rem 1.15rem 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.can-do-card::before {
  display: none;
}

.can-do-card:hover {
  transform: none;
  border-color: var(--line);
  box-shadow: none;
}

body:has(.product-screen-selra) .can-do-card,
body:has(.product-screen-luce) .can-do-card,
body:has(.product-screen-incisa) .can-do-card {
  background: transparent;
}

.can-do-card h3 {
  font-size: .92rem;
  font-weight: 650;
}

.can-do-card p {
  color: var(--mute);
}

.feature-grid {
  gap: 0;
  border-top: 1px solid var(--line);
  background: transparent;
}

.feature-card {
  border-radius: 0;
  background: transparent;
  border-bottom: 1px solid var(--line);
}

body:has(.product-screen-selra) .feature-card,
body:has(.product-screen-luce) .feature-card,
body:has(.product-screen-incisa) .feature-card {
  background: transparent;
}

.feature-card h3 {
  color: var(--ink);
}

.feature-card p {
  color: var(--mute);
}

.product-facts {
  border-color: var(--line);
}

.product-hero .hero-visual,
.product-screen {
  border: 1px solid var(--line);
  border-radius: .28rem;
  box-shadow: 0 1.4rem 2.6rem rgba(0, 0, 0, .4);
}

.capability-chip {
  border-radius: 0;
  background: transparent;
}

.how-section,
.quality-intro,
.interlude-copy h2,
.deep-copy h2 {
  color: var(--ink);
}

.proof-anchor {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.capability-section {
  margin-top: clamp(2.2rem, 5vw, 3.4rem);
  padding-top: 1.2rem;
  border-top: 1px solid var(--line);
}

.capability-header {
  grid-template-columns: 8rem 1fr;
  align-items: start;
  gap: 1.2rem;
  margin-bottom: 1rem;
}

.capability-header h2 {
  max-width: none;
  font-family: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1.3;
}

.capability-header > p:last-child {
  max-width: 40rem;
  font-size: .68rem;
  line-height: 1.45;
}

.capability-group {
  grid-template-columns: 6.5rem 1fr;
  gap: 1rem;
  padding: .7rem 0;
  background: transparent;
}

.capability-group__heading h3 {
  font-family: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  font-size: .68rem;
  font-weight: 650;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.capability-group__heading p {
  display: none;
}

.capability-chip {
  min-height: 0;
  padding: .15rem .35rem 0 0;
  border: 0;
  background: transparent;
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--mute);
}

.capability-chip small {
  display: none;
}

.app-feature-grid {
  grid-template-columns: 1fr;
}

.app-feature-card {
  display: grid;
  grid-template-columns: minmax(11rem, 16rem) minmax(0, 1fr) auto;
  gap: 1.4rem 2rem;
  align-items: start;
  padding: 1.7rem 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid var(--line) !important;
}

.app-feature-card header {
  padding: 0;
  border: 0;
}

.app-feature-card ul {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem 1.4rem;
}

.app-feature-card li {
  display: block;
  padding: 0;
  border: 0;
}

.app-feature-card li > span {
  display: none;
}

.app-feature-card li small {
  display: none;
}

.app-feature-card li strong {
  font-size: .78rem;
  font-weight: 500;
}

.app-feature-card > a {
  align-self: center;
  margin: 0;
  padding: 0;
  border: 0;
}

.product-hero .hero-license {
  display: block;
  max-width: none;
  margin-top: 1.15rem;
  padding: 0;
  border: 0;
  background: transparent;
}

.product-hero .hero-license__channel {
  display: none;
}

.product-hero .hero-license strong {
  display: inline;
  font-family: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  font-size: .92rem;
  font-weight: 650;
}

.product-hero .hero-license > span:last-child {
  display: inline;
  margin-left: .55rem;
}

.product-hero .hero-actions {
  gap: 1.3rem;
}

.product-hero .button-primary,
.product-hero .button-outline {
  min-height: 0;
  padding: 0 0 .15rem;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: none;
  color: var(--ink);
  font-weight: 600;
  box-shadow: none;
}

.product-hero .button-primary {
  color: #e2b56a;
  border-bottom-color: #e2b56a;
}

@media (max-width: 760px) {
  .app-feature-card {
    grid-template-columns: 1fr;
    border-right: 0 !important;
    border-bottom: 1px solid var(--line) !important;
  }

  .capability-header,
  .capability-group {
    grid-template-columns: 1fr;
  }
}
