/* ==========================================================================
   marketing.css — the marketing site's own stylesheet
   --------------------------------------------------------------------------
   Source of truth: marketing-src/assets/css/marketing.css
   Built to:        /marketing/css/marketing.css   (do not edit that copy)
   Loaded:          LAST on every built marketing page, after every legacy
                    stylesheet, so anything written here wins without needing
                    !important.

   WHY THIS FILE EXISTS
   The marketing pages share /styles/*.css with the application. Two of those
   sheets (styles.css, sub_styles.css) are also used by the login, forgot-
   password and error pages, and libs.css is the Foundation framework used by
   every app screen. Editing those to restyle marketing risks changing the app.
   Put marketing-only changes here instead: nothing else on the site loads this
   file, so it cannot affect the application.

   CACHING
   .htaccess caches css for a year as immutable, so the build appends
   ?v=<file modification time>. Save this file and the next build ships a new
   URL automatically — no manual version bumping, no stale styles.

   HOW TO USE IT
   Add rules under the matching section below. Selectors here have the same
   specificity as the legacy ones, and win because this file loads last; if a
   legacy rule still beats yours, match its specificity rather than reaching
   for !important. To restyle one language only, scope to the html lang:
       html[lang="es"] .pricingContainer { … }
   ========================================================================== */

/* --------------------------------------------------------------------------
   Brand tokens — the colours already used across the marketing pages, named
   once here so future rules reference a name instead of repeating a hex code.
   Declaring these changes nothing on its own.
   -------------------------------------------------------------------------- */
:root {
  --slyb-green: #2ecc71;        /* primary brand green, buttons and links     */
  --slyb-green-dark: #1b7943;   /* hover/pressed state of the green           */
  --slyb-navy: #0b2233;         /* dark section backgrounds                   */
  --slyb-blue: #236799;         /* footer text and secondary links            */
  --slyb-blue-dark: #1d5680;    /* headings on light backgrounds              */
  --slyb-blue-light: #77a4c5;   /* muted/secondary text on dark backgrounds   */
  --slyb-tint: #e6f4fd;         /* pale blue panel background                 */
  --slyb-rule: #ececec;         /* hairline borders and separators            */
}

/* --------------------------------------------------------------------------
   Site-wide overrides — applies to every marketing page, all languages.
   -------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------
   FAQ  (/faq  ·  /es/faq  ·  /fr/faq)
   -------------------------------------------------------------------------- */

/* styles/faq.css points the question bullet at ../../dev/styles/img/ — a path
   left over from a dev environment, which resolves to /dev/styles/img/ and 404s
   on every FAQ page load in all three languages. The icon itself is fine and
   has always been at /img/, so this repoints it rather than dropping it: the
   16x16 asset matches the rule's own width/height, and the missing icon is now
   visible again instead of silently absent.
   Fixed here, not in styles/faq.css, because that sheet is shared with the
   legacy pages — this override loads last and affects marketing pages only. */
.bubble-list li:before,
.bubble-list li::before {
  background-image: url("/img/icon-faq-question.png");
}


/* --------------------------------------------------------------------------
   Navigation and footer — the shared frame from marketing-src/_partials/.
   Remember the markup itself lives in those partials; only styling goes here.
   -------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------
   Home page  (/  ·  /es/  ·  /fr/)
   -------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------
   Blog  (/blog/  ·  /es/blog/  ·  /fr/blog/)
   -------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------
   Industry pages  (/industry/*  ·  /es/industria/*  ·  /fr/industrie/*)
   -------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------
   Help center  (/helpcenter/*  ·  /es/centro-de-ayuda/*  ·  /fr/centre-d-aide/*)
   -------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------
   Language-specific adjustments. Spanish and French run roughly 15-20% longer
   than English, so a button or heading that fits in English can wrap. Scope
   those fixes to the language rather than changing the shared rule.
   -------------------------------------------------------------------------- */