/* Edafa website — shared styles. Page layouts use inline styles from the approved designs. */

@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 300; font-display: swap; src: url('../fonts/ibm-plex-sans-300.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/ibm-plex-sans-400.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/ibm-plex-sans-500.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/ibm-plex-sans-600.woff2') format('woff2'); }

:root { color-scheme: light; box-sizing: border-box; padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
html { scroll-padding-top: calc(env(safe-area-inset-top, 0px) + 72px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
*, *::before, *::after { box-sizing: inherit; }
body { margin: 0; background: #FFFFFF; color: #0F1B33; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 100; background: #FFFFFF; }
img { max-width: 100%; }
a { color: #273F74; }
a:hover { color: #16264A; }
[hidden] { display: none !important; }

/* Keyboard focus and skip link */
a:focus-visible, button:focus-visible { outline: 2px solid #273F74; outline-offset: 2px; }
input:focus, select:focus, textarea:focus { outline: 2px solid #273F74; outline-offset: 1px; }
.skip { position: absolute; left: 16px; top: -60px; z-index: 200; background: #273F74; color: #FFFFFF; padding: 10px 16px; font-family: 'IBM Plex Sans', 'Segoe UI', system-ui, sans-serif; font-weight: 600; text-decoration: none; }
.skip:focus { top: calc(env(safe-area-inset-top, 0px) + 12px); color: #FFFFFF; }

/* "Coming soon" label for platforms not yet launched */
.soon { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 2px; background: #E9EDF6; color: #273F74; font-size: 12px; font-weight: 600; line-height: 1.5; vertical-align: middle; white-space: nowrap; }

/* Homepage platform grid */
.pgrid { grid-template-columns: minmax(0, 1fr); }
.plist { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1000px) {
  .pgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pgrid .wide { grid-column: span 2; }
  .plist.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Sticky in-page tabs on product pages */
nav[aria-label="On this page"]:not(.legal-toc) { top: env(safe-area-inset-top, 0px) !important; }

/* Two-column layouts on wide screens */
@media (min-width: 1000px) {
  #contact-form-section > div { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr) !important; }
  .story-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr) !important; }
  .story-facts { position: sticky; top: 24px; }
  .legal-grid { grid-template-columns: 240px minmax(0, 1fr) !important; }
  .legal-toc { position: sticky; top: 24px; }
}

/* Contact form errors */
.fld.bad input, .fld.bad textarea { border-color: #B42318 !important; }

/* Mobile navigation toggle (hidden on desktop) */
.nav-toggle { display: none; font: inherit; font-size: 15px; font-weight: 600; color: #0F1B33; background: transparent; border: 1px solid #C9CDD3; border-radius: 2px; padding: 10px 16px; min-height: 44px; cursor: pointer; align-items: center; }

@media (max-width: 900px) {
  h1 { font-size: 38px !important; }
  h2 { font-size: 28px !important; }
  .slogan, .slogan-div { display: none !important; }
  .nav-toggle { display: inline-flex; }
  #main-nav { display: none !important; order: 3; width: 100%; flex-direction: column; align-items: stretch !important; min-height: 0 !important; padding-bottom: 12px; }
  header.nav-open #main-nav { display: flex !important; }
  #main-nav > div, #main-nav > a { display: flex; flex-direction: column; position: static !important; }
  #main-nav button, #main-nav > a { min-height: 52px !important; justify-content: space-between; padding: 0 4px !important; border-top: 0 !important; border-bottom: 1px solid #E3E5E8 !important; width: 100%; }
  .menu-panel > div { position: static !important; box-shadow: none !important; border-left: 0 !important; border-right: 0 !important; min-width: 0 !important; }
  .mega-grid { grid-template-columns: minmax(0, 1fr) !important; padding: 20px 4px !important; }
}

/* Phones: stack every two-column grid and keep the header on one row */
@media (max-width: 600px) {
  [style*="grid-template-columns: repeat(auto-fit"] { grid-template-columns: minmax(0, 1fr) !important; }
  header img { height: 44px !important; }
  header a[href^="https://support"] { padding: 10px 14px !important; }
  .nav-toggle { padding: 10px 14px; }
}
@media (max-width: 900px) {
  #main-nav > a { flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; }
}
