/* Public controls only; geometry and application controls remain with their pages. */
.landing-motion-scope,
[data-imagora-public-page] {
  --public-control-surface: color-mix(in srgb, var(--ink-3, #24201b) 78%, var(--ink-2, #151210));
  --public-control-hover: color-mix(in srgb, var(--text-1, #ede6d8) 6%, var(--ink-3, #24201b));
  --public-control-edge: var(--line-3, rgba(217, 200, 170, .28));
  --public-control-focus: color-mix(in srgb, var(--amber, #d9884a) 62%, transparent);
  --public-control-shadow: 0 3px 10px rgba(0, 0, 0, .16), inset 0 1px 0 rgba(255, 255, 255, .04);
  --public-control-accent: #d9884a;
  --public-control-accent-hover: #e29b63;
  --public-control-accent-ink: #24170d;
}

html.light :is(.landing-motion-scope, [data-imagora-public-page]) {
  --public-control-shadow: 0 3px 10px rgba(64, 43, 24, .08), inset 0 1px 0 rgba(255, 255, 255, .7);
  --public-control-accent-hover: #d17d3d;
}

.landing-motion-scope :is(a.inline-flex, button),
[data-imagora-public-page] :is(a.inline-flex, button, .button) {
  border-radius: 12px;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

/* Header account/register actions can use responsive inline-flex utilities. */
.landing-motion-scope header a:is([class~="inline-flex"], [class~="sm:inline-flex"], [class~="md:inline-flex"])[class*="rounded-"][class*="bg-"]:not([class~="rounded-full"]),
body:has([data-imagora-public-page]) header a:is([class~="inline-flex"], [class~="sm:inline-flex"], [class~="md:inline-flex"])[class*="rounded-"][class*="bg-"]:not([class~="rounded-full"]),
body:has([data-imagora-public-page="contact"]) .nav .links a:last-child {
  border-radius: 12px;
}

.landing-motion-scope :is(a.inline-flex, button):focus-visible,
[data-imagora-public-page] :is(a.inline-flex, button, .button):focus-visible {
  outline: 2px solid var(--public-control-focus);
  outline-offset: 3px;
}

.landing-motion-scope #pricing [data-stagger-child],
[data-imagora-public-page="pricing"] [data-imagora-plan-card] {
  border-radius: 16px;
}

/* The card's existing 1px border is enough; remove the extra solid top stripe. */
[data-imagora-public-page="pricing"] [data-imagora-plan-card="recommended"] > .pointer-events-none.inset-x-0.top-0.h-1 {
  opacity: 0;
}

[data-imagora-public-page="pricing"] [data-imagora-plan-action] {
  color: var(--text-1);
  background: var(--public-control-surface);
  border-color: var(--public-control-edge);
  box-shadow: var(--public-control-shadow);
}

[data-imagora-public-page="pricing"] [data-imagora-plan-action]:not([aria-disabled="true"]):hover {
  background: var(--public-control-hover);
  border-color: var(--public-control-edge);
  box-shadow: var(--public-control-shadow), inset 0 0 0 1px var(--public-control-edge);
}

[data-imagora-public-page="pricing"] [data-imagora-plan-card="recommended"] [data-imagora-plan-action] {
  color: var(--public-control-accent-ink);
  background: var(--public-control-accent);
  border-color: var(--public-control-accent);
  box-shadow: 0 5px 16px color-mix(in srgb, var(--public-control-accent) 18%, transparent), inset 0 1px 0 rgba(255, 255, 255, .16);
}

[data-imagora-public-page="pricing"] [data-imagora-plan-card="recommended"] [data-imagora-plan-action]:not([aria-disabled="true"]):hover {
  background: var(--public-control-accent-hover);
  border-color: var(--public-control-accent-hover);
}

[data-imagora-public-page="pricing"] [data-imagora-plan-action]:not([aria-disabled="true"]):active {
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, .16);
}

[data-imagora-public-page="pricing"] [data-imagora-plan-action][aria-disabled="true"] {
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .landing-motion-scope :is(a.inline-flex, button),
  [data-imagora-public-page] :is(a.inline-flex, button, .button) {
    transition: none;
  }
}