:root {
    --navy: #221e1b; --navy-deep: #17140f; --steel: #4a453d;
    --accent: #db2327; --accent-dark: #b81c20; --accent-tint: #fbf1f1; --ink: #2a2723;
    --muted: #625e57; --line: #e8e1d6; --bg: #f6f3ee; --white: #ffffff;
    --radius: 14px;
  }
  * { box-sizing: border-box; }
  body {
    margin: 0; font-family: 'Source Sans 3', 'Segoe UI', Roboto, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
    color: var(--ink); background: var(--white); line-height: 1.55;
  }
  a { text-decoration: none; color: inherit; }
  h1, h2, h3 { margin: 0; font-family: 'Libre Franklin', 'Segoe UI', Roboto, -apple-system, BlinkMacSystemFont, Arial, sans-serif; }


  header { background: var(--white); border-bottom: 1px solid var(--line); }
  .nav-wrap { max-width: 1180px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 14px 24px; }
  .logo-img { height: 48px; width: auto; display: block; }
  nav ul { list-style: none; display: flex; gap: 32px; margin: 0; padding: 0; font-size: 14px; font-weight: 600; }
  nav a { color: var(--navy); opacity: 0.75; transition: opacity 0.2s; }
  nav a:hover { opacity: 1; }
  nav .active { color: var(--accent-dark); opacity: 1; }
  .has-dropdown { position: relative; }
  .has-dropdown > a { display: inline-flex; align-items: center; gap: 5px; }
  .dropdown-caret { flex-shrink: 0; transition: transform 0.2s ease; }
  .has-dropdown:hover .dropdown-caret, .has-dropdown:focus-within .dropdown-caret { transform: rotate(180deg); }
  .nav-dropdown {
    position: absolute; top: 100%; left: 50%; margin-top: 14px; transform: translateX(-50%) translateY(-8px);
    background: var(--white); border: 1px solid var(--line); border-radius: 14px;
    box-shadow: 0 20px 44px rgba(23,20,15,0.16); padding: 16px; width: 460px;
    opacity: 0; visibility: hidden; pointer-events: none; z-index: 200;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
  }
  .nav-dropdown::before { content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px; }
  .has-dropdown:hover .nav-dropdown, .has-dropdown:focus-within .nav-dropdown {
    opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0);
  }
  .nav-dropdown-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
  .nav-dropdown-grid a { display: block; padding: 12px 14px; border-radius: 9px; font-size: 16px; font-weight: 600; color: var(--navy); opacity: 0.82; transition: background 0.15s ease, opacity 0.15s ease; }
  .nav-dropdown-grid a:hover { background: var(--bg); opacity: 1; }
  .nav-cta { background: var(--accent-dark); color: var(--white) !important; padding: 9px 18px; border-radius: 8px; font-size: 13.5px; opacity: 1 !important; }

  footer { background: var(--navy-deep); color: rgba(255,255,255,0.62); padding: 48px 24px 24px; }
  .footer-inner { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; }
  @media (max-width: 760px) { .footer-inner { grid-template-columns: 1fr; } }
  .footer-brand img { height: 42px; width: auto; margin-bottom: 12px; filter: brightness(0) invert(1); opacity: 0.95; }
  .footer-brand p { font-size: 13px; color: rgba(255,255,255,0.62); max-width: 320px; }
  .footer-socials { display: flex; gap: 10px; margin-top: 16px; }
  .footer-socials a { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.08); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.75); transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease; }
  .footer-socials a:hover { background: var(--accent-dark); color: var(--white); transform: translateY(-2px); }
  footer h3 { color: var(--white); font-size: 13.5px; text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 16px; }
  footer ul { list-style: none; margin: 0; padding: 0; }
  footer li { margin-bottom: 10px; font-size: 13.5px; }
  footer a:hover { color: var(--white); }
  .footer-bottom { max-width: 1180px; margin: 36px auto 0; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.1); text-align: center; font-size: 12.5px; color: rgba(255,255,255,0.42); }


  /* ---- Category pages (level 2, shared across all page-product-* sections) ---- */
  .cat-detail-hero { background: linear-gradient(135deg, var(--navy-deep), var(--steel)); color: var(--white); padding: 52px 24px 54px; text-align: center; }
  .breadcrumb { text-align: center; margin-bottom: 18px; }
  .breadcrumb a { color: rgba(255,255,255,0.85); font-size: 13.5px; font-weight: 600; }
  .breadcrumb a:hover { color: #fff; text-decoration: underline; }
  .cat-detail-hero .eyebrow { text-transform: uppercase; letter-spacing: 2px; font-size: 12.5px; color: rgba(255,255,255,0.75); font-weight: 700; margin-bottom: 12px; }
  .cat-detail-hero h1 { font-size: 34px; font-weight: 800; margin: 0 0 14px; }
  .cat-detail-hero p { max-width: 680px; margin: 0 auto; color: rgba(255,255,255,0.88); font-size: 15px; }
  .section { max-width: 1180px; margin: 0 auto; padding: 56px 24px; }
  .eyebrow-label { text-align: center; text-transform: uppercase; letter-spacing: 1.5px; font-size: 12px; font-weight: 800; color: var(--navy); margin-bottom: 10px; }
  .section-title { text-align: center; font-size: 27px; font-weight: 800; color: var(--navy); margin: 0 0 14px; }
  .section-sub { text-align: center; color: var(--muted); font-size: 14.5px; max-width: 620px; margin: 0 auto 36px; }

  /* Category switcher — pill nav to jump straight to any other category */
  .cat-switcher { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 44px; }
  .cat-pill {
    font-size: 12.5px; font-weight: 700; padding: 8px 16px; border-radius: 999px;
    border: 1.5px solid var(--line); color: var(--muted); transition: all 0.15s;
  }
  .cat-pill:hover { border-color: var(--navy); color: var(--navy); }
  .cat-pill.active { background: var(--navy); border-color: var(--navy); color: var(--white); }

  /* Bold product-within-category grid */
  .item-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 22px; }
  /* Subgroup group-card — one bordered box per named subgroup (e.g. "Reach
     in Incubators"), sized to fit its own products (shown nested inside as
     smaller clickable boxes) rather than stretching the full grid width, so
     other individual products can still sit alongside it in the same row.
     Shares the same white shell as a standalone .item-card — the group is
     flagged by a small pill label instead of a background color, and the
     nested product boxes get the beige surface to read as "inside" it. */
  .item-grid-group-card {
    background: var(--white); border: 1.5px solid var(--line);
    border-radius: var(--radius); padding: 26px 26px 28px;
  }
  .item-grid-group-card.span-2 { grid-column: span 2; }
  .item-grid-group-card.span-3 { grid-column: span 3; }
  .item-grid-group-card h3 {
    display: inline-block; background: var(--navy); color: var(--white);
    font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 1.2px;
    padding: 6px 14px; border-radius: 999px; margin: 0 0 18px;
  }
  .item-subgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
  .item-subcard {
    display: block; background: var(--bg); border: 1px solid var(--line); border-radius: 10px;
    padding: 18px 20px; transition: all 0.2s ease;
  }
  .item-subcard:hover { border-color: var(--navy); box-shadow: 0 10px 22px rgba(23,20,15,0.10); transform: translateY(-2px); }
  .item-subcard h4 { font-size: 14.5px; font-weight: 700; color: var(--navy); margin: 0 0 7px; }
  .item-subcard p { font-size: 12.5px; color: var(--muted); margin: 0 0 12px; line-height: 1.5; }
  .item-subcard-link { font-size: 12px; font-weight: 700; color: var(--navy); }
  .item-subcard:hover .item-subcard-link { text-decoration: underline; }
  @media (max-width: 700px) {
    .item-grid-group-card.span-2,
    .item-grid-group-card.span-3 { grid-column: 1 / -1; }
  }
  .item-card {
    display: block; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius);
    padding: 26px 24px; transition: all 0.2s ease; position: relative; overflow: hidden;
  }
  .item-card::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: var(--accent-dark); transform: scaleX(0); transform-origin: left; transition: transform 0.2s ease;
  }
  .item-card:hover::before { transform: scaleX(1); }
  .item-card:hover { box-shadow: 0 14px 30px rgba(23,20,15,0.12); transform: translateY(-4px); border-color: rgba(34,30,27,0.24); }
  .item-card h3 { font-size: 16.5px; color: var(--navy); margin: 0 0 8px; }
  .item-card p { font-size: 13.5px; color: var(--muted); margin: 0 0 14px; line-height: 1.55; }
  .spec-strip { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
  .spec-chip { font-size: 11px; font-weight: 600; color: var(--navy); background: rgba(34,30,27,0.06); border-radius: 6px; padding: 4px 9px; }
  .item-card-link { font-size: 13px; font-weight: 700; color: var(--navy); }
  .item-card:hover .item-card-link { text-decoration: underline; }

  .cat-note { font-size: 12.5px; color: var(--muted); margin-top: 24px; font-style: italic; text-align: center; }
  .cta-banner { background: var(--navy); color: var(--white); text-align: center; padding: 56px 24px; }
  .cta-banner h2 { font-size: 24px; font-weight: 800; margin: 0 0 12px; }
  .cta-banner p { color: rgba(255,255,255,0.88); font-size: 14px; max-width: 480px; margin: 0 auto 24px; }
  .btn-primary { background: var(--accent-dark); color: var(--white); padding: 12px 24px; border-radius: 8px; font-weight: 700; font-size: 14px; display: inline-block; }
  .btn-primary:hover { background: var(--accent); }


  /* ---- Mobile nav (hamburger dropdown panel) ---- */
  .nav-toggle { display: none; background: none; border: none; padding: 6px; margin: 0; cursor: pointer; color: var(--navy); }
  @media (max-width: 880px) {
    .nav-toggle { display: flex; align-items: center; justify-content: center; }
    nav ul {
      display: none; position: fixed; top: 77px; left: 0; right: 0;
      flex-direction: column; gap: 0; margin: 0; background: var(--white);
      border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
      box-shadow: 0 16px 32px rgba(23,20,15,0.14); padding: 4px 24px; z-index: 300;
      max-height: calc(100vh - 77px); overflow-y: auto;
    }
    nav.nav-open ul { display: flex; }
    nav ul li { width: 100%; }
    nav ul li a { display: block; width: 100%; padding: 15px 2px; opacity: 1; border-bottom: 1px solid var(--line); box-sizing: border-box; }
    nav ul li:last-child a { border-bottom: none; }
    nav ul li a.nav-cta { display: block; text-align: center; margin: 14px 0 16px; border-bottom: none; }
    .has-dropdown .nav-dropdown { display: none !important; }
    .has-dropdown .dropdown-caret { display: none; }
  }

  /* ---- Footer legal links (Privacy Notice / Cookie settings) ---- */
  .footer-legal a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
  .footer-legal a:hover { color: var(--white); }

  /* ---- Applications + FAQ (SEO content) ---- */
  .seo-band { background: var(--bg); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .seo-inner { max-width: 880px; margin: 0 auto; padding: 56px 24px; }
  .seo-title { font-size: 26px; font-weight: 800; color: var(--navy); margin: 0 0 26px; text-align: center; text-wrap: balance; }
  .app-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 32px; }
  .app-list li { position: relative; padding-left: 22px; font-size: 15px; line-height: 1.55; color: var(--ink); }
  .app-list li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 8px; height: 8px; border-radius: 50%; background: var(--accent-dark); }
  .faq-item { padding: 20px 0; border-bottom: 1px solid var(--line); }
  .faq-item:last-child { border-bottom: 0; }
  .faq-item h3 { font-size: 16.5px; line-height: 1.4; color: var(--navy); margin: 0 0 8px; }
  .faq-item p { font-size: 14.5px; line-height: 1.65; color: var(--ink); margin: 0; }
  .faq-item a { color: var(--accent-dark); text-decoration: underline; }
  /* Placeholders awaiting confirmed facts: highlighted so they cannot be missed before launch. */
  .verify { background: #fff1a8; color: inherit; padding: 0 3px; border-radius: 3px; }
  @media (max-width: 700px) {
    .seo-inner { padding: 40px 20px; }
    .seo-title { font-size: 22px; }
    .app-list { grid-template-columns: 1fr; }
  }

/* CookieYes banner: make "Accept All" the primary action. Reject/Customise stay the same size and fully visible. */
.cky-btn.cky-btn-accept {
  background: #b81c20 !important;   /* site red: same as the Send Message button (--accent-dark) */
  border-color: #b81c20 !important;
  color: #ffffff !important;
}
.cky-btn.cky-btn-reject,
.cky-btn.cky-btn-customize,
.cky-btn.cky-btn-preferences {
  background: transparent !important;
  border: 1px solid #ffffff !important;
  color: #ffffff !important;
}
/* Preference centre (Customise panel): put "Accept All" first */
.cky-prefrence-btn-wrapper { display: flex !important; flex-wrap: wrap; gap: 8px; }
.cky-prefrence-btn-wrapper .cky-btn-accept { order: -1; }

/* CookieYes banner: smaller text on phones */
@media (max-width: 600px) {
  .cky-consent-container .cky-title { font-size: 14px !important; }
  .cky-consent-container .cky-notice-des,
  .cky-consent-container .cky-notice-des p { font-size: 12px !important; line-height: 1.4 !important; }
}