/* English light theme. Load after the three unchanged shared stylesheets.
   Layout, local font faces, logo geometry and breakpoints come from style.css. */
:root {
  color-scheme: light;
  --bg: #ffffff;
  --surface: #ffffff;
  --raised: #f5f2f8;
  --text: #17151b;
  --muted: #625c6b;
  --purple: #65459b;
  --lavender: #65459b;
  --green: #286448;
  --line: #ded9e4;
  --control-line: #82788e;
  --accent-hover: #533680;
  --error: #963829;
}

html { scroll-behavior: auto; }
.english-home { background: var(--bg); color: var(--text); }
.contact { position: relative; }
.legacy-anchor { position: absolute; inset: 0 auto auto 0; }

/* Keep every mineral in its original layout box, without blending or motion. */
.hero-mineral,
.preview-hero img,
.contact-art img {
  mix-blend-mode: normal;
  transform: none;
  object-fit: contain;
}

.button-primary { background: var(--purple); border-color: var(--purple); color: #ffffff; }
.button-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: #ffffff; }
.button-outline { border-color: var(--control-line); }
.button-outline:hover { border-color: var(--purple); color: var(--purple); }
.button:active { border-color: var(--text); }
.button:disabled,
.agent-demo button:disabled {
  opacity: 1;
  color: var(--muted);
  background: var(--raised);
  border-color: var(--line);
  cursor: default;
}
.demo-niche:disabled { background: transparent; }

.english-home :focus-visible,
.agent-demo button:focus-visible,
.cookie-notice :focus-visible {
  outline: 3px solid var(--purple);
  outline-offset: 5px;
}
.demo-composer textarea:focus-visible { outline: 0; }
.skip-link { min-height: 44px; }
::selection { background: var(--purple); color: #ffffff; }

/* Actual device frames retain their borders; content remains on open white. */
.browser-mockup,
.phone-mockup { background: var(--bg); border-color: var(--control-line); }
.browser-toolbar { background: var(--bg); border-color: var(--line); }
.phone-speaker { background: var(--muted); }

/* Inversion preserves the contrasting counter in the Filadélfia artwork. */
.client-logo { opacity: 1; }
.client-logo > img { filter: grayscale(1) invert(1); }
.client-logo-fort > img { filter: brightness(0); }

/* All live-demo states are styled for the director's later runtime integration. */
.demo-composer,
.demo-form-fields input { background: var(--bg); border-color: var(--control-line); }
.demo-composer:focus-within { border-color: var(--purple); outline: 2px solid var(--purple); outline-offset: 3px; }
.demo-composer textarea::placeholder,
.demo-form-fields input::placeholder { color: var(--muted); opacity: 1; }
.demo-suggestion { color: var(--muted); border-bottom-color: var(--line); }
.demo-suggestion:hover { color: var(--purple); border-bottom-color: var(--purple); }
.demo-composer-bottom > span,
.demo-notice,
.demo-reference,
.demo-message-author,
.demo-message-user .demo-message-text { color: var(--muted); }
.demo-messages { scrollbar-color: var(--control-line) var(--bg); }
.demo-message.is-pending { opacity: 1; }
.demo-message.is-failed .demo-message-author,
.demo-error,
.demo-lead-error { color: var(--error); }
.demo-loading-dot { background: var(--purple); animation: none; }
.demo-lead-success > .icon { color: var(--green); }
.demo-notice a,
.demo-lead-form > p a { display: inline-flex; align-items: center; min-height: 44px; color: var(--purple); }
.demo-form-fields label { display: flex; align-items: center; min-height: 44px; }
.demo-form-fields input[aria-invalid="true"] { border-color: var(--error); }

/* Cookie and privacy colors are defined in assets/en/privacy-v3.css. */

/* Allow English labels and enlarged text to wrap within the existing grids. */
.hero > *,
.services-ia > *,
.faq > *,
.contact > *,
.demo-heading-copy > *,
.demo-form-fields > *,
.demo-niche { min-width: 0; }
.hero-actions > *,
.demo-niche span,
.demo-suggestion,
.demo-identity span,
.footer-privacy > * { overflow-wrap: anywhere; }
.demo-niches { flex-wrap: wrap; }
.demo-niche { min-width: 44px; }
.main-nav a,
.footer-privacy a,
.footer-privacy button { min-width: 44px; }
.header-actions,
.hero-actions,
.footer-contact { max-width: 100%; }
.demo-identity { flex-wrap: wrap; }
.demo-contact-offer .button { white-space: normal; }
.cookie-notice button { min-width: 44px; overflow-wrap: anywhere; }

@media (max-width: 38em) {
  .hero-mineral { object-fit: contain; }
}
@media (max-width: 30em) {
  .demo-niche { flex-wrap: wrap; justify-content: flex-start; text-align: left; }
  .demo-niche span { flex: 1 1 4em; }
  .demo-suggestion { border-bottom-color: var(--line); }
  .cookie-notice-actions { grid-template-columns: 1fr; }
}

/* Preserve incoming links from the existing English partner pages. */
.contact { position: relative; }
.legacy-anchor { position: absolute; top: 0; left: 0; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }